商品工艺导出20240712

src/pages/database/goods/newgoods/index.jsx

@@ -7,7 +7,8 @@ import ProDescriptions from '@ant-design/pro-descriptions';
 import { history } from 'umi';
 import CreateForm from './components/CreateForm';
 import { getDataBaseUrl } from '@/global_data';
-import { gettree, goods, removeGoods, addGoods, updateGoods, GetDeviceTechnology, TechnologyTemplateExport, GoodsTechnologyExport, GetAliyunRequestURL, Getgoodslist } from './service';
+import { gettree, goods, removeGoods, addGoods, updateGoods, GetDeviceTechnology, TechnologyTemplateExport, GoodsTechnologyExport, GetgoodsWithIds, Getgoodslist, GoodsSimpleExport } from './service';
+import { getdevicegoods } from '../../../device/deviceInfo/services'
 
 const aliyunHostUrl = 'https://bpa.oss-cn-chengdu.aliyuncs.com/hkerp/test/goods/';
 
@@ -26,9 +27,12 @@ const GoodsManage = () => {
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [deviceData, setDeviceData] = useState([]);
   const [goodData, setGoodData] = useState([]);
+  const [deviceGoodData, setDeviceGoodData] = useState([]);
   const [deviceId, setDeviceId] = useState('');
   const [deviceName, setDeviceName] = useState('');
   const [goodsId, setGoodsId] = useState([]);
+  const [isDataModalOpen, setIsDataModalOpen] = useState(false);
+  const [ids, setIds] =useState('');
   /** 国际化配置 */
   useEffect(() => {
     gettree().then((r) => {
@@ -68,6 +72,31 @@ const GoodsManage = () => {
       }
     });
   }
+  const initGetdevicegoodsList = async (deviceId) => {
+    getdevicegoods(deviceId).then((r) => {
+      var arr = r.data;
+      if (r.succeeded) {
+        var idList = [];
+        arr.forEach((item) => {
+          idList.push(item.goodsId);
+        });
+        setIds(idList);
+        GetgoodsWithIds(idList).then((t) => {
+          var a = t.data;
+          if (t.succeeded) {
+            var list = [];
+            a.forEach((i) => {
+              list.push({
+                value: i.id,
+                label: i.name
+              })
+            })
+            setDeviceGoodData(list);
+          }
+        })
+      }
+    });
+  };
 
   /**
   * 添加节点
@@ -384,6 +413,11 @@ const GoodsManage = () => {
       }
     }
   };
+  const handleDataDeviceChange = (value, option) => {
+    setDeviceId(option?.value);
+    setDeviceName(option?.label);
+    initGetdevicegoodsList(option?.value);
+  }
   const handleDeviceChange = (value, option) => {
     setDeviceId(option?.value);
     setDeviceName(option?.label);
@@ -391,10 +425,45 @@ const GoodsManage = () => {
   const handleGoodChange = (value, option) => {
     setGoodsId(value);
   }
+  const handleDataDownload = async()=>{
+    if(deviceName == '')
+    {
+      message.error('请选择一个设备！');
+      return;
+    }
+    const base64String = await GoodsSimpleExport({ goodsId: goodsId, deviceId: deviceId, ids: ids });
+      // 解码 Base64 数据
+      const binaryString = atob(base64String);
+      // 转换为 Uint8Array
+      const bytes = new Uint8Array(binaryString.length);
+      for (let i = 0; i < binaryString.length; i++) {
+        bytes[i] = binaryString.charCodeAt(i);
+      }
+      // 创建 Blob 对象
+      const blob = new Blob([bytes], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+      // 创建一个临时的 URL，指向 Blob 对象
+      const url = window.URL.createObjectURL(blob);
+      // 创建 <a> 元素，用于下载文件
+      const link = document.createElement('a');
+      const fileName = "商品.xlsx";
+      link.href = url;
+      link.setAttribute('download', fileName);
+      // 将 <a> 元素添加到页面中
+      document.body.appendChild(link);
+      // 模拟用户点击下载链接，触发文件下载
+      link.click();
+      // 下载完成后，移除 <a> 元素
+      document.body.removeChild(link);
+      setDeviceId('');
+      setDeviceName('');
+      setGoodsId([]);
+      setIds('');
+      setIsDataModalOpen(false);
+  }
   const handleDownload = async () => {
     if(deviceName == '')
     {
-      message.error('必须选择一个设备！');
+      message.error('请选择一个设备！');
       return;
     }
     try {
@@ -506,6 +575,14 @@ const GoodsManage = () => {
             <Upload {...technologprops} showUploadList={false}>
               <Button icon={<UploadOutlined />}>导入工艺</Button>
             </Upload>,
+            <Button
+              key="primary"
+              onClick={async () => {
+                setIsDataModalOpen(true);
+              }}
+            >
+              <DownloadOutlined /> 下载商品工艺
+            </Button>,
             <BatchDeletion />
           ]}
           request={async (params) => {
@@ -605,7 +682,7 @@ const GoodsManage = () => {
                 width: 300,
                 marginRight: 10
               }}
-              placeholder="选择下载一个或该设备下所有商品的模版"
+              placeholder="选择商品下载模版"
               optionFilterProp="children"
               filterOption={(input, option) => (option?.label ?? '').includes(input)}
               filterSort={(optionA, optionB) =>
@@ -621,6 +698,66 @@ const GoodsManage = () => {
             onClick = {handleDownload}
           >下载</Button>
         </Modal>
+        <Modal
+          title="下载商品工艺"
+          open={isDataModalOpen}
+          footer={false}
+          width={450}
+          destroyOnClose={true}
+          onCancel={() => {
+            setDeviceGoodData([])
+            setDeviceId('')
+            setDeviceName('')
+            setGoodsId([])
+            setIds('')
+            setIsDataModalOpen(false)
+          }}>
+          <div style={{ marginBottom: 10 }}>
+            <span style={{ marginRight: 10 }}><span style={{color:'red',marginRight: 3}}>*</span>选择设备：</span>
+            <Select
+              showSearch
+              allowClear
+              style={{
+                width: 300,
+                marginRight: 10
+              }}
+              placeholder="请选择设备"
+              optionFilterProp="children"
+              filterOption={(input, option) => (option?.label ?? '').includes(input)}
+              filterSort={(optionA, optionB) =>
+                (optionA?.label ?? '').toLowerCase().localeCompare((optionB?.label ?? '').toLowerCase())
+              }
+              onChange={async (value, option) => { handleDataDeviceChange(value, option) }}
+              options={deviceData}
+              required
+            />
+          </div>
+          <div style={{ marginBottom: 10 }}>
+            <span style={{ marginLeft: 9, marginRight: 10 }}>选择商品：</span>
+            <Select
+              mode='multiple'
+              showSearch
+              allowClear
+              style={{
+                width: 300,
+                marginRight: 10
+              }}
+              placeholder="选择商品下载工艺"
+              optionFilterProp="children"
+              filterOption={(input, option) => (option?.label ?? '').includes(input)}
+              filterSort={(optionA, optionB) =>
+                (optionA?.label ?? '').toLowerCase().localeCompare((optionB?.label ?? '').toLowerCase())
+              }
+              onChange={async (value, option) => { handleGoodChange(value, option) }}
+              options={deviceGoodData}
+            />
+          </div>
+          <Button
+            icon={<DownloadOutlined />}
+            style={{ marginLeft: '22.2%' }}
+            onClick = {handleDataDownload}
+          >下载</Button>
+        </Modal>
         <Drawer
           width={600}
           visible={showDetail}

src/pages/database/goods/newgoods/service.js

@@ -157,4 +157,19 @@ export async function Getgoodslist() {
   return request(getDataBaseUrl()+`/api/goods/getgoodslist`, {
     method: 'Get',
   });
+}
+
+export async function GetgoodsWithIds(data) {
+  return request(getDataBaseUrl()+`/api/goods/getgoodsWithids`, {
+    method: 'post',
+    data: data
+  });
+}
+
+export async function GoodsSimpleExport(data) {
+  return request(getDataBaseUrl()+`/api/goods/goodsSimpleExport`, {
+    method: 'post',
+    data: data
+    // responseType: 'blob'
+  });
 }