Commit c61dc4497bd3083398de37856aacc107c231336d

Authored by loveumiko
1 parent 53483454

fix: 修复物模型导入样式

@@ -58,7 +58,7 @@ @@ -58,7 +58,7 @@
58 }, 58 },
59 selections: { 59 selections: {
60 beforeSelectValidate: (record: ProfileRecord) => { 60 beforeSelectValidate: (record: ProfileRecord) => {
61 - return !record.default; 61 + return !record.default && record?.name !== 'default';
62 }, 62 },
63 onSelect: (_record, _flag, allSelecteds) => { 63 onSelect: (_record, _flag, allSelecteds) => {
64 disabledDeleteFlag.value = !allSelecteds.length; 64 disabledDeleteFlag.value = !allSelecteds.length;
@@ -5,48 +5,28 @@ @@ -5,48 +5,28 @@
5 destroyOnClose 5 destroyOnClose
6 v-bind="$attrs" 6 v-bind="$attrs"
7 width="25rem" 7 width="25rem"
  8 + :height="160"
  9 + :min-height="160"
8 @register="register" 10 @register="register"
9 @cancel="handleCancel" 11 @cancel="handleCancel"
10 :showOkBtn="false" 12 :showOkBtn="false"
11 > 13 >
12 - <div class="w-full h-full" ref="loadingRef">  
13 - <div class="flex justify-end">  
14 - <Button @click="handleTemplateDownload" type="link">excel模板下载</Button>  
15 - </div>  
16 - <div class="flex justify-evenly items-center h-50 !w-full">  
17 - <Upload  
18 - accept=".json,"  
19 - :show-upload-list="false"  
20 - :customRequest="handleImportModel"  
21 - class="flex justify-center items-center"  
22 - >  
23 - <div class="flex flex-col justify-center items-center">  
24 - <Tooltip>  
25 - <template #title>请使用从物模型TSL导出的JSON文件在进行导入</template>  
26 - <img :src="JSONImage" alt="avatar" class="w-20 h-20" />  
27 - </Tooltip>  
28 - </div>  
29 - </Upload>  
30 - <Upload  
31 - accept=".csv,.xls,.xlsx"  
32 - :show-upload-list="false"  
33 - :customRequest="handleCSVImport"  
34 - class="flex justify-center items-center"  
35 - >  
36 - <div class="flex flex-col justify-center items-center">  
37 - <Tooltip>  
38 - <template #title>请使用下载的模板编辑之后在进行导入</template>  
39 - <img :src="CSVImage" alt="avatar" class="w-20 h-20" />  
40 - </Tooltip>  
41 - </div>  
42 - </Upload>  
43 - </div>  
44 - </div> 14 + <BasicForm @register="registerForm">
  15 + <template #importType="{ model }">
  16 + <RadioGroup v-model:value="model.importType">
  17 + <Radio value="2">JSON导入</Radio>
  18 + <Radio value="1">Excel导入</Radio>
  19 + </RadioGroup>
  20 + <div v-if="model.importType == 1" class="absolute -left-28 mb-1">
  21 + <Button @click="handleTemplateDownload" type="link">excel模板下载</Button>
  22 + </div>
  23 + </template>
  24 + </BasicForm>
45 </BasicModal> 25 </BasicModal>
46 </template> 26 </template>
47 <script lang="ts" setup> 27 <script lang="ts" setup>
48 import { ref, unref } from 'vue'; 28 import { ref, unref } from 'vue';
49 - import { Upload, Tooltip, Button } from 'ant-design-vue'; 29 + import { Button, Radio, RadioGroup } from 'ant-design-vue';
50 import { BasicModal, useModalInner } from '/@/components/Modal'; 30 import { BasicModal, useModalInner } from '/@/components/Modal';
51 import { DeviceRecord } from '/@/api/device/model/deviceModel'; 31 import { DeviceRecord } from '/@/api/device/model/deviceModel';
52 import { useMessage } from '/@/hooks/web/useMessage'; 32 import { useMessage } from '/@/hooks/web/useMessage';
@@ -59,8 +39,7 @@ @@ -59,8 +39,7 @@
59 excelExport, 39 excelExport,
60 } from '/@/api/device/modelOfMatter'; 40 } from '/@/api/device/modelOfMatter';
61 import { useLoading } from '/@/components/Loading'; 41 import { useLoading } from '/@/components/Loading';
62 - import JSONImage from '/@/assets/svg/JSON.svg';  
63 - import CSVImage from '/@/assets/svg/excel.svg'; 42 + import { BasicForm, useForm } from '/@/components/Form';
64 43
65 const emits = defineEmits(['register', 'handleImportCSV', 'handleReload']); 44 const emits = defineEmits(['register', 'handleImportCSV', 'handleReload']);
66 45
@@ -85,6 +64,45 @@ @@ -85,6 +64,45 @@
85 const [register, { closeModal }] = useModalInner(async (data) => { 64 const [register, { closeModal }] = useModalInner(async (data) => {
86 ImportInfo.value = data; 65 ImportInfo.value = data;
87 }); 66 });
  67 +
  68 + const [registerForm, {}] = useForm({
  69 + schemas: [
  70 + {
  71 + field: 'importType',
  72 + label: '导入类型',
  73 + component: 'RadioGroup',
  74 + defaultValue: '2',
  75 + slot: 'importType',
  76 + helpMessage:
  77 + 'JSON导入请使用从物模型TSL导出的JSON文件在进行导入,Excel导入请使用下载的模板编辑之后在进行导入',
  78 + required: true,
  79 + },
  80 + {
  81 + field: 'apiId',
  82 + label: '',
  83 + component: 'ApiUpload',
  84 + componentProps: ({ formModel }) => {
  85 + return {
  86 + // listType: 'picture-card',
  87 + maxFileLimit: 1,
  88 + accept: formModel.importType == 2 ? '.json,' : '.csv,.xls,.xlsx',
  89 + api: async (file: File) => {
  90 + try {
  91 + if (formModel.importType == 2) {
  92 + handleImportModel(file);
  93 + } else {
  94 + handleCSVImport(file);
  95 + }
  96 + } catch {}
  97 + },
  98 + };
  99 + },
  100 + },
  101 + ],
  102 + labelWidth: 100,
  103 + showActionButtonGroup: false,
  104 + });
  105 +
88 // 导入loading 106 // 导入loading
89 const importLoading = ref(false); 107 const importLoading = ref(false);
90 108
@@ -101,7 +119,7 @@ @@ -101,7 +119,7 @@
101 }; 119 };
102 120
103 // JSON导入 121 // JSON导入
104 - const handleImportModel = async (data: { file: File }) => { 122 + const handleImportModel = async (file: File) => {
105 const fileReader = new FileReader(); 123 const fileReader = new FileReader();
106 const { isCateGory, id } = unref(ImportInfo); 124 const { isCateGory, id } = unref(ImportInfo);
107 125
@@ -148,11 +166,11 @@ @@ -148,11 +166,11 @@
148 } 166 }
149 }; 167 };
150 168
151 - fileReader.readAsText(data.file, 'utf-8'); 169 + fileReader.readAsText(file, 'utf-8');
152 }; 170 };
153 171
154 // CSV导入 172 // CSV导入
155 - const handleCSVImport = async ({ file }) => { 173 + const handleCSVImport = async (file) => {
156 const { isCateGory, id } = unref(ImportInfo); 174 const { isCateGory, id } = unref(ImportInfo);
157 175
158 try { 176 try {