Merge branch 'fix/DEFECT-1775' into 'main_dev'

fix:产品物模型导入添加注释和excel模板

See merge request yunteng/thingskit-front!1035

@@ -24,6 +24,7 @@ enum ModelOfMatter {
   CATEGORY_EXPORT = '/things_model/categoryGetExport',
 
   IMPORT_CSV = '/things_model/csvImport',
+  EXCEL_EXPORT = '/things_model/downloadTemplate',
 }
 
 export const getModelList = (
@@ -169,3 +170,13 @@ export const importCsvDeviceProfileId = (params: {
     params: params.file,
   });
 };
+
+/**
+ * 物模型excel导出模板
+ */
+export const excelExport = () => {
+  return defHttp.get({
+    url: `${ModelOfMatter.EXCEL_EXPORT}`,
+    responseType: 'blob',
+  });
+};

@@ -97,7 +97,6 @@
   // 状态->编辑
   const handleSwitch = async (e: any, record: any) => {
     switchLoading.value = true;
-    console.log(e, record);
     await deviceProfileCategory({ ...record, status: e });
     switchLoading.value = false;
     createMessage.success('操作成功');
@@ -185,7 +184,6 @@
       </template>
     </BasicTable>
     <classModal @register="registerModal" @handleReload="handleReload" />
-    <!-- <physicalModel @register="registerDetailDrawer" :record /> -->
     <BasicDrawer title="物模型" @register="registerDetailDrawer" width="60%" destroy-on-close>
       <PhysicalModelManagementStep :record="registerDetailRecord" />
     </BasicDrawer>

@@ -10,9 +10,9 @@
     :showOkBtn="false"
   >
     <div class="w-full h-full" ref="loadingRef">
-      <!-- <div class="flex justify-end">
-        <Button @click="handleTemplateDownload" type="link">EXCEL模板下载</Button>
-      </div> -->
+      <div class="flex justify-end">
+        <Button @click="handleTemplateDownload" type="link">excel模板下载</Button>
+      </div>
       <div class="flex justify-evenly items-center h-50 !w-full">
         <Upload
           accept=".json,"
@@ -21,7 +21,10 @@
           class="flex justify-center items-center"
         >
           <div class="flex flex-col justify-center items-center">
-            <img :src="JSONImage" alt="avatar" class="w-20 h-20" />
+            <Tooltip>
+              <template #title>使用从物模型TSL导出的JSON进行导入</template>
+              <img :src="JSONImage" alt="avatar" class="w-20 h-20" />
+            </Tooltip>
           </div>
         </Upload>
         <Upload
@@ -31,7 +34,10 @@
           class="flex justify-center items-center"
         >
           <div class="flex flex-col justify-center items-center">
-            <img :src="CSVImage" alt="avatar" class="w-20 h-20" />
+            <Tooltip>
+              <template #title>请使用excel模板编辑之后在进行导入</template>
+              <img :src="CSVImage" alt="avatar" class="w-20 h-20" />
+            </Tooltip>
           </div>
         </Upload>
       </div>
@@ -40,7 +46,7 @@
 </template>
 <script lang="ts" setup>
   import { ref, unref } from 'vue';
-  import { Upload } from 'ant-design-vue';
+  import { Upload, Tooltip, Button } from 'ant-design-vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { DeviceRecord } from '/@/api/device/model/deviceModel';
   import { useMessage } from '/@/hooks/web/useMessage';
@@ -50,6 +56,7 @@
     importModelCategory,
     importModelOfMatter,
     importCsvDeviceProfileId,
+    excelExport,
   } from '/@/api/device/modelOfMatter';
   // import XLSX, { CellObject } from 'xlsx';
   import { useLoading } from '/@/components/Loading';
@@ -162,6 +169,7 @@
           });
       flag && createMessage.info(flag?.message);
     } catch (msg) {
+      // eslint-disable-next-line no-console
       console.log(msg, 'msg');
     } finally {
       closeLoading();
@@ -170,23 +178,23 @@
     }
   };
 
-  // const downloadFile = (data: string, fileName: string, type: string, ext: string) => {
-  //   const blob = new Blob([data], { type: type });
-  //   const objectURL = URL.createObjectURL(blob);
-  //   const element = document.createElement('a');
-  //   element.href = objectURL;
-  //   element.download = `${fileName}.${ext}`;
-  //   element.style.display = 'none';
-  //   document.body.appendChild(element);
-  //   element.click();
-  //   element.remove();
-  //   URL.revokeObjectURL(objectURL);
-  // };
+  const downloadFile = (data: Blob, fileName: string, ext: string) => {
+    const objectURL = URL.createObjectURL(data);
+    const element = document.createElement('a');
+    element.href = objectURL;
+    element.download = `${fileName}.${ext}`;
+    element.style.display = 'none';
+    document.body.appendChild(element);
+    element.click();
+    element.remove();
+    URL.revokeObjectURL(objectURL);
+  };
 
   // 模板下载
-  // const handleTemplateDownload = () => {
-
-  // };
+  const handleTemplateDownload = async () => {
+    const res = await excelExport();
+    downloadFile(res, '物模型属性导入模板', 'xls');
+  };
 
   const handleCancel = () => {
     closeModal();

@@ -75,35 +75,6 @@ export const columnsDrawer: BasicColumn[] = [
     },
     ellipsis: true,
   },
-  // {
-  //   title: '事件类型',
-  //   dataIndex: 'eventType',
-  //   customRender({ text }) {
-  //     return h(
-  //       Tag,
-  //       {
-  //         color: EventTypeColor[text as EventType],
-  //       },
-  //       () => EventTypeName[text as EventType]
-  //     );
-  //   },
-  //   ellipsis: true,
-  // },
-  // {
-  //   title: '状态',
-  //   dataIndex: 'status',
-  //   width: 100,
-  //   customRender: (value: Record<'text', number>) => {
-  //     const { text } = value;
-  //     return h(
-  //       Tag,
-  //       {
-  //         color: text ? 'green' : 'red',
-  //       },
-  //       () => (text ? '已发布' : '待发布')
-  //     );
-  //   },
-  // },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -121,7 +92,6 @@ export const searchFormSchema: FormSchema[] = [
         labelField: 'itemText',
         valueField: 'itemValue',
         placeholder: '请选择领域',
-        // getPopupContainer: () => document.body,
       };
     },
   },

@@ -186,7 +186,9 @@
         selectType: props.record.ifShowClass ? 'category' : undefined,
       });
     },
-    columns: physicalColumn,
+    columns: props.record.ifShowClass
+      ? physicalColumn.filter((item) => item.dataIndex !== 'status')
+      : physicalColumn,
     showIndexColumn: false,
     clickToRowSelect: false,
     showTableSetting: true,