Merge branch 'ww' into 'main'

fix: BUG in teambition

See merge request huang/yun-teng-iot-front!381

@@ -6,8 +6,10 @@ import type {
   ConfigurationCenterItemsModal,
 } from './model/configurationCenterModal';
 import { getPageData } from '../../base';
+import { FileUploadResponse } from '../../oem/model';
 enum API {
   basicUrl = '/configuration/center',
+  UPLOAD = '/oss/upload',
 }
 
 export const getPage = (params: queryPageParams) => {
@@ -43,3 +45,7 @@ export const saveOrUpdateConfigurationCenter = (
 ) => {
   return isUpdate ? updateConfigurationCenter(params) : saveConfigurationCenter(params);
 };
+
+export const uploadThumbnail = (file: FormData) => {
+  return defHttp.post<FileUploadResponse>({ url: API.UPLOAD, params: file });
+};

@@ -186,7 +186,7 @@ export const getGATEWAYdevice = async (params: { organization: string }) => {
     params,
   });
   return Promise.resolve<{ label: string; value: string }[]>(
-    res.map((item) => ({ label: item.name, value: item.id }))
+    res.map((item) => ({ label: item.name, value: item.tbDeviceId }))
   );
 };
 

+<svg t="1667959039355" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2798" width="32" height="32"><path d="M860.068571 666.422857L726.857143 731.245714c-8.685714 4.205714-18.742857 4.205714-27.428572 0l-133.211428-64.822857A31.296 31.296 0 0 1 548.571429 638.262857V477.165714c0-11.977143 6.857143-22.948571 17.645714-28.16l133.211428-64.822857c8.685714-4.205714 18.742857-4.205714 27.428572 0l133.211428 64.822857c10.788571 5.211429 17.645714 16.182857 17.645715 28.16v161.097143c0 11.977143-6.857143 22.948571-17.645715 28.16z" fill="#B4D7FE" p-id="2799"></path><path d="M713.142857 701.988571V543.542857l-139.337143-68.571428M852.48 474.971429L713.142857 543.542857" fill="#B4D7FE" p-id="2800"></path><path d="M950.857143 146.285714H73.142857c-10.057143 0-18.285714 8.228571-18.285714 18.285715v621.714285c0 10.057143 8.228571 18.285714 18.285714 18.285715h205.714286v54.857142c0 10.057143 8.228571 18.285714 18.285714 18.285715h429.714286c10.057143 0 18.285714-8.228571 18.285714-18.285715v-54.857142H950.857143c10.057143 0 18.285714-8.228571 18.285714-18.285715V164.571429c0-10.057143-8.228571-18.285714-18.285714-18.285715zM708.571429 841.142857h-393.142858v-36.571428h393.142858v36.571428z m224-73.142857H91.428571V182.857143h841.142858v585.142857z" fill="#248BFF" p-id="2801"></path><path d="M182.857143 274.285714h201.142857v36.571429H182.857143z" fill="#B4D7FE" p-id="2802"></path><path d="M411.428571 237.714286H155.428571c-5.028571 0-9.142857 4.114286-9.142857 9.142857v457.142857c0 5.028571 4.114286 9.142857 9.142857 9.142857h256c5.028571 0 9.142857-4.114286 9.142858-9.142857V246.857143c0-5.028571-4.114286-9.142857-9.142858-9.142857z m-228.571428 36.571428h201.142857v36.571429H182.857143v-36.571429z m0 402.285715V347.428571h201.142857v329.142858H182.857143zM867.474286 452.571429l-146.285715-71.222858c-2.56-1.188571-5.302857-1.828571-8.045714-1.828571s-5.485714 0.64-8.045714 1.828571l-146.285714 71.222858c-6.217143 3.108571-10.24 9.417143-10.24 16.457142v177.371429c0 7.04 4.022857 13.348571 10.24 16.457143l146.285714 71.222857c2.56 1.188571 5.302857 1.828571 8.045714 1.828571s5.485714-0.64 8.045714-1.828571l146.285715-71.222857c6.308571-3.017143 10.24-9.417143 10.24-16.457143V469.028571c0-7.04-4.022857-13.348571-10.24-16.457142zM713.142857 418.102857l107.245714 52.205714-107.428571 52.937143c-0.64-0.365714-1.28-0.822857-1.92-1.097143l-105.142857-51.748571L713.142857 418.102857z m-128 82.834286l109.714286 54.034286v133.394285l-109.714286-53.394285V500.937143z m146.285714 187.428571V554.971429l109.714286-54.034286v134.034286l-109.714286 53.394285z" fill="#248BFF" p-id="2803"></path><path d="M347.428571 411.428571H219.428571c-10.057143 0-18.285714-8.228571-18.285714-18.285714s8.228571-18.285714 18.285714-18.285714h128c10.057143 0 18.285714 8.228571 18.285715 18.285714s-8.228571 18.285714-18.285715 18.285714zM859.428571 292.571429H484.571429c-10.057143 0-18.285714-8.228571-18.285715-18.285715s8.228571-18.285714 18.285715-18.285714h374.857142c10.057143 0 18.285714 8.228571 18.285715 18.285714s-8.228571 18.285714-18.285715 18.285715zM667.428571 356.571429H484.571429c-10.057143 0-18.285714-8.228571-18.285715-18.285715s8.228571-18.285714 18.285715-18.285714h182.857142c10.057143 0 18.285714 8.228571 18.285715 18.285714s-8.228571 18.285714-18.285715 18.285715zM548.571429 420.571429h-64c-10.057143 0-18.285714-8.228571-18.285715-18.285715s8.228571-18.285714 18.285715-18.285714h64c10.057143 0 18.285714 8.228571 18.285714 18.285714s-8.228571 18.285714-18.285714 18.285715zM237.714286 475.428571h-18.285715c-10.057143 0-18.285714-8.228571-18.285714-18.285714s8.228571-18.285714 18.285714-18.285714h18.285715c10.057143 0 18.285714 8.228571 18.285714 18.285714s-8.228571 18.285714-18.285714 18.285714z" fill="#248BFF" p-id="2804"></path><path d="M301.714286 539.428571h-82.285715c-10.057143 0-18.285714-8.228571-18.285714-18.285714s8.228571-18.285714 18.285714-18.285714h82.285715c10.057143 0 18.285714 8.228571 18.285714 18.285714s-8.228571 18.285714-18.285714 18.285714z" fill="#248BFF" p-id="2805"></path><path d="M274.285714 603.428571h-54.857143c-10.057143 0-18.285714-8.228571-18.285714-18.285714s8.228571-18.285714 18.285714-18.285714h54.857143c10.057143 0 18.285714 8.228571 18.285715 18.285714s-8.228571 18.285714-18.285715 18.285714z" fill="#248BFF" p-id="2806"></path></svg>

@@ -4,10 +4,10 @@
   };
 </script>
 <script lang="ts" setup>
-  import { Upload, Spin } from 'ant-design-vue';
+  import { Upload, Spin, Tooltip } from 'ant-design-vue';
   import { InboxOutlined } from '@ant-design/icons-vue';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { computed, ref, unref, useAttrs } from 'vue';
+  import { computed, ref, unref } from 'vue';
   import { cloneDeep } from 'lodash-es';
   import { isFunction, isNumber, isObject } from '/@/utils/is';
   import { useDesign } from '/@/hooks/web/useDesign';
@@ -23,8 +23,6 @@
   const { prefixCls } = useDesign('api-upload');
   const emit = defineEmits(['update:fileList', 'preview', 'download']);
 
-  const attrs = useAttrs();
-
   const { createMessage } = useMessage();
 
   const loading = ref(false);
@@ -70,6 +68,16 @@
     return disabled ? disabled : unref(componentDisabled);
   });
 
+  const isPictureCard = computed(() => {
+    const { listType } = props;
+    return listType === 'picture-card';
+  });
+
+  const getMaxFileLimit = computed(() => {
+    const { maxFileLimit } = props;
+    return isPictureCard.value ? 1 : maxFileLimit;
+  });
+
   const handleUpload = async (file: File | string | Blob | Promise<string | Blob | File>) => {
     try {
       setUploadStatus(true);
@@ -78,10 +86,10 @@
       if (api && isFunction(api)) {
         const data = await api(file);
         if (isObject(data) && Reflect.has(data, 'uid') && Reflect.has(data, 'name')) {
-          const { fileList, maxFileLimit } = props;
+          const { fileList } = props;
           let _fileList = cloneDeep(fileList);
 
-          if (isNumber(maxFileLimit) && _fileList.length === maxFileLimit) {
+          if (isNumber(unref(getMaxFileLimit)) && _fileList.length === unref(getMaxFileLimit)) {
             _fileList.splice(0, 1);
           }
 
@@ -106,49 +114,36 @@
     emit('update:fileList', _fileList);
   };
 
-  const defaultPreview = (file: FileItem) => {
-    console.log('default preview', file);
-  };
-
-  const defaultDownload = (file: FileItem) => {
-    console.log('default download', file);
-  };
-
   const handlePreview = (file: FileItem) => {
-    if (Reflect.has(attrs, 'preview')) {
-      emit('preview', file);
-      return;
-    }
-    defaultPreview(file);
+    emit('preview', file);
   };
 
   const handleDownload = (file: FileItem) => {
-    if (Reflect.has(attrs, 'download')) {
-      emit('download', file);
-      return;
-    }
-    defaultDownload(file);
+    emit('download', file);
   };
 </script>
 
 <template>
-  <Upload.Dragger
+  <Upload
     class="block"
     :class="prefixCls"
     :file-list="props.fileList"
+    :list-type="props.listType"
     :disabled="getDisabled"
     :before-upload="handleBeforeUpload"
     @preview="handlePreview"
     @download="handleDownload"
     :remove="handleRemove"
   >
-    <Spin :spinning="loading">
+    <Spin v-if="!fileList.length" :spinning="loading">
       <div class="w-full h-full flex flex-col justify-center content-center">
-        <InboxOutlined class="text-[3rem] !text-blue-500" />
-        <div class="m-2 text-gray-400">点击上传或拖拽上传</div>
+        <Tooltip title="点击上传或拖拽上传">
+          <InboxOutlined class="text-[3rem] !text-blue-500" />
+        </Tooltip>
+        <div v-if="!isPictureCard" class="m-2 text-gray-400 text-sm">点击上传或拖拽上传</div>
       </div>
     </Spin>
-  </Upload.Dragger>
+  </Upload>
 </template>
 
 <style lang="less">
@@ -164,6 +159,12 @@
       .ant-upload-list-item-name {
         width: calc(100% - 22px);
       }
+
+      .ant-upload-select-text {
+        width: 100%;
+        text-align: center;
+        border: 1px dashed #d9d9d9;
+      }
     }
   }
 </style>

@@ -245,69 +245,25 @@
             </Space>
           </div>
         </div>
-        <List
-          :loading="loading"
-          :data-source="cameraList"
-          class="bg-light-50 flex-auto dark:bg-dark-900 split-mode-list"
-          :grid="gridLayout"
-          :style="{ '--height': `${100 / pagination.colNumber}%` }"
-        >
-          <template #renderItem="{ item }">
-            <List.Item>
-              <div class="box-border w-full h-full p-1px">
-                <div
-                  v-if="item.placeholder"
-                  class="bg-black w-full h-full overflow-hidden relative"
-                ></div>
-                <div
-                  v-if="!item.placeholder"
-                  class="bg-black w-full h-full overflow-hidden relative video-container"
-                >
-                  <Spin v-show="!item.isTransform" :spinning="!item.isTransform">
-                    <div class="bg-black text-light-50"> </div>
-                  </Spin>
-                  <VideoPlay
-                    v-show="item.isTransform"
-                    @loadstart="handleLoadStart(item)"
-                    @loadeddata="handleLoadData(item)"
-                    v-bind="options"
-                    :src="item.videoUrl"
-                    :title="item.name"
-                    :type="item.type"
-                  />
+        <section ref="videoContainer" class="flex-auto">
+          <List
+            :loading="loading"
+            :data-source="cameraList"
+            class="bg-light-50 w-full h-full dark:bg-dark-900 split-mode-list"
+            :grid="gridLayout"
+            :style="{ '--height': `${100 / pagination.colNumber}%` }"
+          >
+            <template #renderItem="{ item }">
+              <List.Item>
+                <div class="box-border w-full h-full p-1px">
                   <div
-                    v-if="item.isTransform && isDef(item.canPlay) && !item.canPlay"
-                    class="video-container-error-msk absolute top-0 left-0 text-lg w-full h-full text-light-50 flex justify-center items-center z-50 bg-black"
-                  >
-                    视频加载出错了！
-                  </div>
+                    v-if="item.placeholder"
+                    class="bg-black w-full h-full overflow-hidden relative"
+                  ></div>
                   <div
-                    class="video-container-mask absolute top-0 left-0 z-50 text-lg w-full text-light-50 flex justify-center items-center"
-                    style="height: 100%; background-color: rgba(0, 0, 0, 0.5)"
+                    v-if="!item.placeholder"
+                    class="bg-black w-full h-full overflow-hidden relative video-container"
                   >
-                    <span>{{ item.name }}</span>
-                  </div>
-                </div>
-              </div>
-            </List.Item>
-          </template>
-        </List>
-        <!-- <section ref="videoContainer" class="bg-light-50 flex-auto dark:bg-dark-900">
-          <Spin :spinning="loading" class="h-full">
-            <Empty
-              class="h-full flex flex-col justify-center items-center"
-              v-if="!cameraList.length"
-            />
-            <Row :gutter="8" class="h-full mx-0 content-start">
-              <Col
-                v-for="item in cameraList"
-                :key="item.id"
-                :style="{ height: `${100 / pagination.colNumber}%` }"
-                class="h-1/2 !px-0 !flex justify-center items-center"
-                :span="getColLayout"
-              >
-                <div class="box-border w-full h-full p-1px">
-                  <div class="bg-black w-full h-full overflow-hidden relative video-container">
                     <Spin v-show="!item.isTransform" :spinning="!item.isTransform">
                       <div class="bg-black text-light-50"> </div>
                     </Spin>
@@ -334,10 +290,10 @@
                     </div>
                   </div>
                 </div>
-              </Col>
-            </Row>
-          </Spin>
-        </section> -->
+              </List.Item>
+            </template>
+          </List>
+        </section>
       </section>
     </PageWrapper>
     <CameraDrawer @register="registerDrawer" @success="getCameraList" />

@@ -17,6 +17,8 @@
   import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { saveOrUpdateConfigurationCenter } from '/@/api/configuration/center/configurationCenter';
+  import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
+  import { buildUUID } from '/@/utils/uuid';
 
   export default defineComponent({
     name: 'ConfigurationDrawer',
@@ -36,6 +38,11 @@
         setDrawerProps({ confirmLoading: false });
         isUpdate.value = !!data?.isUpdate;
         if (unref(isUpdate)) {
+          if (data.record.thumbnail) {
+            data.record.thumbnail = [
+              { uid: buildUUID(), name: 'name', url: data.record.thumbnail } as FileItem,
+            ];
+          }
           if (data.record.organizationDTO) {
             await setFieldsValue(data.record);
           } else {
@@ -51,9 +58,14 @@
         try {
           const { createMessage } = useMessage();
           const values = await validate();
+          if (Reflect.has(values, 'thumbnail')) {
+            const file = (values.thumbnail || []).at(0) || {};
+            values.thumbnail = file.url || null;
+          }
           setDrawerProps({ confirmLoading: true });
           let saveMessage = '添加成功';
           let updateMessage = '修改成功';
+          console.log(values);
           await saveOrUpdateConfigurationCenter(values, unref(isUpdate));
           closeDrawer();
           emit('success');

 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { getOrganizationList } from '/@/api/system/system';
 import { copyTransFun } from '/@/utils/fnUtils';
+import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
+import { createImgPreview } from '/@/components/Preview';
+import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
 export enum Platform {
   PHONE = 'phone',
   PC = 'pc',
@@ -64,6 +67,37 @@ export const searchFormSchema: FormSchema[] = [
 
 export const formSchema: FormSchema[] = [
   {
+    field: 'thumbnail',
+    label: '缩略图',
+    component: 'ApiUpload',
+    changeEvent: 'update:fileList',
+    valueField: 'fileList',
+    componentProps: () => {
+      return {
+        listType: 'picture-card',
+        maxFileLimit: 1,
+        api: async (file: File) => {
+          try {
+            const formData = new FormData();
+            formData.set('file', file);
+            const { fileStaticUri, fileName } = await uploadThumbnail(formData);
+            return {
+              uid: fileStaticUri,
+              name: fileName,
+              url: fileStaticUri,
+            } as FileItem;
+          } catch (error) {
+            return {};
+          }
+        },
+        onPreview: (fileList: FileItem) => {
+          createImgPreview({ imageList: [fileList.url!] });
+        },
+      };
+    },
+  },
+
+  {
     field: 'name',
     label: '组态名称',
     required: true,

@@ -25,6 +25,8 @@
   import { useDrawer } from '/@/components/Drawer';
   import { useSyncConfirm } from '/@/hooks/component/useSyncConfirm';
   import { getBoundingClientRect } from '/@/utils/domUtils';
+  import configurationSrc from '/@/assets/icons/configuration.svg';
+  import { cloneDeep } from 'lodash';
 
   const listColumn = ref(4);
 
@@ -98,7 +100,7 @@
     if (record) {
       openDrawer(true, {
         isUpdate: true,
-        record,
+        record: cloneDeep(record),
       });
     } else {
       openDrawer(true, {
@@ -204,8 +206,9 @@
             <Card hoverable>
               <template #cover>
                 <img
+                  class="w-36 h-36 flex justify-center items-center"
                   alt="example"
-                  src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
+                  :src="item.thumbnail || configurationSrc"
                 />
               </template>
               <template class="ant-card-actions" #actions>
@@ -242,8 +245,10 @@
               </template>
               <Card.Meta :title="item.name">
                 <template #description>
-                  <div class="truncate">{{ item.organizationDTO.name }}</div>
-                  <div class="truncate">{{ item.remark }} </div>
+                  <div class="truncate h-11">
+                    <div class="truncate">{{ item.organizationDTO.name }}</div>
+                    <div class="truncate">{{ item.remark || '' }} </div>
+                  </div>
                 </template>
               </Card.Meta>
             </Card>

@@ -34,6 +34,12 @@ export const step1Schemas: FormSchema[] = [
     slot: 'snCode',
   },
   {
+    field: 'transportType',
+    label: '类型',
+    component: 'Input',
+    show: false,
+  },
+  {
     field: 'profileId',
     label: '所属产品',
     required: true,
@@ -44,9 +50,9 @@ export const step1Schemas: FormSchema[] = [
         api: deviceProfile,
         labelField: 'name',
         valueField: 'tbProfileId',
-        onChange(_value: string, option: { deviceType: string }) {
-          const { deviceType } = option;
-          setFieldsValue({ deviceType: deviceType });
+        onChange(_value: string, option: { deviceType: string; transportType: string }) {
+          const { deviceType, transportType } = option;
+          setFieldsValue({ deviceType: deviceType, transportType });
         },
       };
     },
@@ -69,6 +75,17 @@ export const step1Schemas: FormSchema[] = [
     },
   },
   {
+    field: 'code',
+    label: '地址码',
+    component: 'Input',
+    ifShow: ({ model }) => {
+      return model['transportType'] === 'TCP';
+    },
+    dynamicRules: ({ model }) => {
+      return [{ required: model['transportType'] === 'TCP', message: '地址码为必填项' }];
+    },
+  },
+  {
     field: 'brand',
     component: 'ApiRadioGroup',
     label: '选择厂家',

@@ -110,72 +110,79 @@
       // 提交
       const msg = computed(() => (unref(isUpdate) ? '更新设备成功' : '新增设备成功'));
       async function handleOk() {
-        if (current.value === 0) {
-          // 验证
-          const valid = await unref(DeviceStep1Ref)?.parentValidate();
-          if (!valid) return;
-          stepState.value = unref(DeviceStep1Ref)?.parentGetFieldsValue();
-        } else {
-          // !!!此处需要删除地图的属性，否则会报堆栈溢出的错误 Uncaught RangeError: Maximum call stack size exceeded
-          Reflect.deleteProperty(stepState.value, 'map');
-          Reflect.deleteProperty(stepState.value, 'marker');
-          if (unref(DeviceStep2Ref)?.getFieldsValue().addAgree) {
-            const valid = await unref(DeviceStep2Ref)?.validate();
+        try {
+          if (current.value === 0) {
+            // 验证
+            const valid = await unref(DeviceStep1Ref)?.parentValidate();
             if (!valid) return;
-            // 第二页验证通过情况
-            stepState.value = {
+            stepState.value = unref(DeviceStep1Ref)?.parentGetFieldsValue();
+          } else {
+            // !!!此处需要删除地图的属性，否则会报堆栈溢出的错误 Uncaught RangeError: Maximum call stack size exceeded
+            Reflect.deleteProperty(stepState.value, 'map');
+            Reflect.deleteProperty(stepState.value, 'marker');
+            if (unref(DeviceStep2Ref)?.getFieldsValue().addAgree) {
+              const valid = await unref(DeviceStep2Ref)?.validate();
+              if (!valid) return;
+              // 第二页验证通过情况
+              stepState.value = {
+                ...unref(stepState),
+                ...unref(DeviceStep2Ref)?.getFieldsValue(),
+              };
+            }
+          }
+          // 验证成功 --调-- 新增或者编辑接口
+          // !!!此处需要删除地图的属性，否则会报堆栈溢出的错误 Uncaught RangeError: Maximum call stack size exceeded
+          Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'map');
+          Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'marker');
+          setModalProps({
+            confirmLoading: true,
+          });
+          if (unref(isUpdate)) {
+            const editData = {
               ...unref(stepState),
-              ...unref(DeviceStep2Ref)?.getFieldsValue(),
+              deviceInfo: {
+                avatar: DeviceStep1Ref.value?.devicePic,
+                ...DeviceStep1Ref.value?.positionState,
+              },
             };
+            await createOrEditDevice(editData);
+          } else {
+            const createData = {
+              ...unref(stepState),
+              deviceInfo: {
+                avatar: DeviceStep1Ref.value?.devicePic,
+                ...DeviceStep1Ref.value?.positionState,
+              },
+              deviceToken:
+                unref(current) === 0 || !unref(stepState).addAgree
+                  ? null
+                  : {
+                      credentialsType: unref(stepState).credentialType,
+                      credentialsId: unref(stepState).credentialsId,
+                      credentialsValue:
+                        unref(stepState).credentialType === credentialTypeEnum.MQTT_BASIC
+                          ? JSON.stringify({
+                              userName: unref(stepState).username,
+                              password: unref(stepState).password,
+                              clientId: unref(stepState).clientId,
+                            })
+                          : unref(stepState).credentialType === credentialTypeEnum.X_509
+                          ? unref(stepState).publicKey
+                          : null,
+                    },
+            };
+            await createOrEditDevice(createData);
           }
+          createMessage.success(unref(msg));
+          handleCancel();
+          closeModal();
+          emit('reload');
+        } catch (error) {
+        } finally {
+          setModalProps({
+            confirmLoading: false,
+          });
         }
-        // 验证成功 --调-- 新增或者编辑接口
-        // !!!此处需要删除地图的属性，否则会报堆栈溢出的错误 Uncaught RangeError: Maximum call stack size exceeded
-        Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'map');
-        Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'marker');
-        setModalProps({
-          confirmLoading: true,
-        });
-        if (unref(isUpdate)) {
-          const editData = {
-            ...unref(stepState),
-            deviceInfo: {
-              avatar: DeviceStep1Ref.value?.devicePic,
-              ...DeviceStep1Ref.value?.positionState,
-            },
-          };
-          await createOrEditDevice(editData);
-        } else {
-          const createData = {
-            ...unref(stepState),
-            deviceInfo: {
-              avatar: DeviceStep1Ref.value?.devicePic,
-              ...DeviceStep1Ref.value?.positionState,
-            },
-            deviceToken:
-              unref(current) === 0 || !unref(stepState).addAgree
-                ? null
-                : {
-                    credentialsType: unref(stepState).credentialType,
-                    credentialsId: unref(stepState).credentialsId,
-                    credentialsValue:
-                      unref(stepState).credentialType === credentialTypeEnum.MQTT_BASIC
-                        ? JSON.stringify({
-                            userName: unref(stepState).username,
-                            password: unref(stepState).password,
-                            clientId: unref(stepState).clientId,
-                          })
-                        : unref(stepState).credentialType === credentialTypeEnum.X_509
-                        ? unref(stepState).publicKey
-                        : null,
-                  },
-          };
-          await createOrEditDevice(createData);
-        }
-        createMessage.success(unref(msg));
-        handleCancel();
-        closeModal();
-        emit('reload');
       }
       return {
         getTitle,

 <template>
   <div class="wrapper">
     <div ref="wrapRef" :style="{ height, width }"> </div>
-    <div class="right-wrap">
-      <BasicTable style="cursor: pointer" @register="registerTable" @rowClick="deviceRowClick">
+    <div class="right-wrap !dark:bg-dark-900">
+      <BasicTable
+        style="cursor: pointer"
+        @register="registerTable"
+        @rowClick="deviceRowClick"
+        class="dark:bg-dark-900"
+      >
         <template #deviceState="{ record }">
           <Tag
             :color="

@@ -42,7 +42,7 @@
   import ConverScriptModal from '/@/views/scriptmanage/converscript/ConverScriptModal.vue';
 
   const { createMessage } = useMessage();
-  const selectScript = reactive({
+  const selectScript = reactive<Record<'script', Nullable<string>>>({
     script: null,
   });
   const selectOptions: Ref<SelectTypes['options']> = ref([]);
@@ -55,7 +55,7 @@
       };
     });
   });
-  const handleSuccess = async () => {
+  const handleSuccess = async (val: { id: string }) => {
     const res = await getScriptManageMeList();
     selectOptions.value = res.map((m) => {
       return {
@@ -63,6 +63,7 @@
         value: m.id,
       };
     });
+    selectScript.script = val.id;
   };
 
   const [register] = useForm({

@@ -101,7 +101,7 @@
           converScriptRef.value?.setScriptOutputData(res?.output);
         }
       }
-      emits('success');
+      emits('success', res);
     } finally {
       setModalProps({ confirmLoading: false });
     }