fix: 添加解绑和绑定

src/views/device/batchPutModal.vue

@@ -26,7 +26,7 @@
   // import { sceneMove } from '/@/api/operate';
   import { companyUploadExcel, downTemplate } from '/@/api/customer';
   import { useI18n } from '/@/hooks/web/useI18n';
-  import { downloadByData } from '/@/utils/file/download'
+  import { downloadByData } from '/@/utils/file/download';
   const { t } = useI18n();
   export default defineComponent({
     components: { BasicModal, BasicForm },
@@ -97,14 +97,14 @@
           const params = await validate();
           const apiData = {
             file: fileFlow.file,
-            data:{
+            data: {
               type: 0,
-            }
+            },
           };
           const res = await companyUploadExcel(apiData);
           closeModal();
           resetFields();
-          createMessage.success( res || '导入成功');
+          createMessage.success(res || '导入成功');
         } catch (error) {
           console.log('not passing', error);
         }
@@ -115,9 +115,9 @@
       }
       async function getTemplate() {
         try {
-          const res:BlobPart = await downTemplate({ type: 0 });
-          console.log('downTemplate',res)
-          downloadByData(res.data,'入库模板.xlsx')
+          const res: BlobPart = await downTemplate({ type: 0 });
+          console.log('downTemplate', res);
+          downloadByData(res.data, '入库模板.xlsx');
         } catch (error) {
           console.log('not passing', error);
         }

src/views/device/detailsMoadl.vue

@@ -18,97 +18,100 @@
   </BasicModal>
 </template>
 <script lang="ts">
-import { defineComponent, ref, onMounted, reactive } from 'vue';
-import { BasicModal, useModalInner } from '/@/components/Modal';
-import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
-import { useMessage } from '/@/hooks/web/useMessage';
-import { companyList } from '/@/api/customer';
-// import { sceneMove } from '/@/api/operate';
-import { downTemplate } from '/@/api/customer';
-import { cameraParam, cameraUpdate, cameraOut } from '/@/api/device';
-import { agentNewList } from '/@/api/dealer';
-import { CameraList } from '/@/api/order';
-import { useI18n } from '/@/hooks/web/useI18n';
-const { t } = useI18n();
-interface Option {
-  value: string;
-}
+  import { defineComponent, ref, onMounted, reactive } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { companyList } from '/@/api/customer';
+  // import { sceneMove } from '/@/api/operate';
+  import { downTemplate } from '/@/api/customer';
+  import { cameraParam, cameraUpdate, cameraOut } from '/@/api/device';
+  import { agentNewList } from '/@/api/dealer';
+  import { CameraList } from '/@/api/order';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  const { t } = useI18n();
+  interface Option {
+    value: string;
+  }
 
-export default defineComponent({
-  components: { BasicModal, BasicForm },
-  props: {
-    userData: { type: Object },
-  },
-  emits: ['reload'],
-  setup(_, { emit }) {
-    const modelRef = ref({
-      isUpdate:false,
-    });
-    const title = ref('设备出库');
-    const optionsOrderSn = ref<Option[]>([]);
-    const optionsName = ref<Option[]>([]);
-    const fileFlow = reactive({
-      file: null,
-    });
-    const { createMessage } = useMessage();
-    const schemas: FormSchema[] = [
-      {
-        field: 'id',
-        component: 'Input',
-        label: 'id',
-        show: false,
-      },
-      {
-        field: 'outType',
-        component: 'Select',
-        label: '出库类型',
-        required: true,
-        colProps: {
-          span: 18,
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['reload'],
+    setup(_, { emit }) {
+      const modelRef = ref({
+        isUpdate: false,
+      });
+      const title = ref('设备出库');
+      const optionsOrderSn = ref<Option[]>([]);
+      const optionsName = ref<Option[]>([]);
+      const fileFlow = reactive({
+        file: null,
+      });
+      const { createMessage } = useMessage();
+      const schemas: FormSchema[] = [
+        {
+          field: 'id',
+          component: 'Input',
+          label: 'id',
+          show: false,
         },
-        componentProps: {
-          options: [
-            {
-              label: t('routes.product.outType.0'),
-              value: '0',
-              key: '0',
-            },{
-                  label: t('routes.product.outType.4'),
-                  value: '4',
-                  key: '4',
-             },
-            {
-              label: t('routes.product.outType.1'),
-              value: '1',
-              key: '1',
-            },
-            {
-              label: t('routes.product.outType.2'),
-              value: '2',
-              key: '2',
-            },
-            {
-              label: t('routes.product.outType.3'),
-              value: '3',
-              key: '3',
+        {
+          field: 'outType',
+          component: 'Select',
+          label: '出库类型',
+          required: true,
+          ifShow: false,
+          colProps: {
+            span: 18,
+          },
+          componentProps: {
+            options: [
+              {
+                label: t('routes.product.outType.0'),
+                value: '0',
+                key: '0',
+              },
+              {
+                label: t('routes.product.outType.4'),
+                value: '4',
+                key: '4',
+              },
+              {
+                label: t('routes.product.outType.1'),
+                value: '1',
+                key: '1',
+              },
+              {
+                label: t('routes.product.outType.2'),
+                value: '2',
+                key: '2',
+              },
+              {
+                label: t('routes.product.outType.3'),
+                value: '3',
+                key: '3',
+              },
+            ],
+            onChange: (value) => {
+              updateSchema([{ field: 'agentId', ifShow: value == '4' }]);
             },
-          ],
-          onChange:(value)=>{
-              updateSchema([{field: 'agentId',ifShow:value=='4',}])
-            }
+          },
         },
-      },{
-            field: 'agentId',
-            component: 'ApiSelect',
-            label: '经销商名称',
-            required: true,
-            ifShow:false,
-            componentProps: {
+        {
+          field: 'agentId',
+          component: 'ApiSelect',
+          label: '经销商名称',
+          required: true,
+          ifShow: false,
+          componentProps: {
             api: async function () {
-              const {list} = await agentNewList({pageSize:1000,pageNum:1});
-              console.log('agentNewList',list)
-              return list.map(ele => {
-                return {name:ele.name,value:ele.id}
+              const { list } = await agentNewList({ pageSize: 1000, pageNum: 1 });
+              console.log('agentNewList', list);
+              return list.map((ele) => {
+                return { name: ele.name, value: ele.id };
               });
             },
             numberToString: true,
@@ -119,137 +122,158 @@ export default defineComponent({
               agentName: '',
             },
           },
-            colProps: {
-              span: 18,
-            },
+          colProps: {
+            span: 18,
           },
-      {
-        field: 'companyName',
-        component: 'AutoComplete',
-        label: '客户名称',
-        colProps: {
-          span: 18,
         },
-        componentProps: {
-          filterOption: onFilterOption,
-          onSearch: async (searchText: string) => {
-            const {list} = await companyList({ companyName: searchText });
-            let optionsList = list.map((ele) => { return { ...ele,value: ele.companyName }; }) || []
-            console.log('paramList',optionsList)
-            optionsName.value = optionsList || [];
-            updateSchema({
-              field: 'companyName',
-              componentProps:{
-                options: optionsName.value,
-              },
-            })
+        {
+          field: 'companyName',
+          component: 'AutoComplete',
+          label: '客户名称',
+          ifShow: false,
+          colProps: {
+            span: 18,
           },
-          onChange: (data) => {
-            console.log('data', data);
+          componentProps: {
+            filterOption: onFilterOption,
+            onSearch: async (searchText: string) => {
+              const { list } = await companyList({ companyName: searchText });
+              let optionsList =
+                list.map((ele) => {
+                  return { ...ele, value: ele.companyName };
+                }) || [];
+              console.log('paramList', optionsList);
+              optionsName.value = optionsList || [];
+              updateSchema({
+                field: 'companyName',
+                componentProps: {
+                  options: optionsName.value,
+                },
+              });
+            },
+            onChange: (data) => {
+              console.log('data', data);
+            },
           },
         },
-      },
-      {
-        field: 'orderSn',
-        component: 'AutoComplete',
-        label: '订单号',
-        colProps: {
-          span: 18,
-        },
-        componentProps: {
-          options: optionsOrderSn.value,
-          filterOption: onFilterOption,
-          onSearch: async (searchText: string) => {
-            const { list } = await CameraList({ orderSn: searchText });
-            optionsOrderSn.value = !searchText ? [] : list.map((ele) => { return { value: ele.orderSn }; });
-            updateSchema({
-              field: 'orderSn',
-              componentProps:{
-                options: optionsOrderSn.value,
-              },
-            })
+        {
+          field: 'orderSn',
+          component: 'AutoComplete',
+          label: '订单号',
+          ifShow: false,
+          colProps: {
+            span: 18,
+          },
+          componentProps: {
+            options: optionsOrderSn.value,
+            filterOption: onFilterOption,
+            onSearch: async (searchText: string) => {
+              const { list } = await CameraList({ orderSn: searchText });
+              optionsOrderSn.value = !searchText
+                ? []
+                : list.map((ele) => {
+                    return { value: ele.orderSn };
+                  });
+              updateSchema({
+                field: 'orderSn',
+                componentProps: {
+                  options: optionsOrderSn.value,
+                },
+              });
+            },
+            onChange: (data) => {
+              console.log('data', data);
+            },
           },
-          onChange: (data) => {
-            console.log('data', data);
+        },
+        {
+          field: 'userName',
+          component: 'Input',
+          label: '绑定用户',
+          required: true,
+          colProps: {
+            span: 18,
           },
+        }
+      ];
+      const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
+        labelWidth: 120,
+        schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
         },
-      },
-    ];
-    const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
-      labelWidth: 120,
-      schemas,
-      showActionButtonGroup: false,
-      actionColOptions: {
-        span: 24,
-      },
-    });
-    onMounted(() => {});
-    let addListFunc = () => {};
-    const [register, { closeModal }] = useModalInner((data) => {
-      // console.log(data);
-      data && onDataReceive(data);
-    });
-
-    function onDataReceive(data) {
-      modelRef.value = data;
-      title.value = data.isUpdate?'编辑':'设备出库'
-      console.log('onDataReceive', data);
-      const { outType } = data;
-      let obj = t('routes.product.outType')
-      resetFields();
-      setFieldsValue({
-        type: obj[outType],
-        ...data,
       });
-    }
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        // console.log(data);
+        data && onDataReceive(data);
+      });
 
-    const handleSubmit = async () => {
-      const apiUrl = modelRef.value.isUpdate?cameraUpdate:cameraOut
-      try {
-        const params = await validate();
-        console.log('params', params);
-        const res = await apiUrl(params);
-        console.log('res', res);
-        closeModal();
+      function onDataReceive(data) {
+        modelRef.value = data;
+        title.value = data.isUpdate ? '绑定' : '设备出库';
+        console.log('onDataReceive', data);
+        const { outType } = data;
+        let obj = t('routes.product.outType');
         resetFields();
-        createMessage.success(t('common.optSuccess'));
-        emit('reload');
-      } catch (error) {
-        console.log('not passing', error);
+        setFieldsValue({
+          type: obj[outType],
+          ...data,
+        });
       }
-    };
-    function onFilterOption(inputText: string, option: Option) {
-      return option.value.toUpperCase().indexOf(inputText.toUpperCase()) >= 0;
-    }
 
-    function handleVisibleChange(v) {
-      // console.log(v);
-      // v && props.userData && nextTick(() => onDataReceive(props.userData));
-    }
+      const handleSubmit = async () => {
+        const apiUrl = modelRef.value.isUpdate ? cameraUpdate : cameraOut;
+        try {
+          const params = await validate();
+          console.log('params', params);
+          const res = await apiUrl({
+            ...modelRef.value,
+            ...params,
+          });
+          console.log('res', res);
+          closeModal();
+          resetFields();
+          createMessage.success(t('common.optSuccess'));
+          emit('reload');
+        } catch (error) {
+          console.log('not passing', error, modelRef.value);
+        }
+      };
+      function onFilterOption(inputText: string, option: Option) {
+        return option.value.toUpperCase().indexOf(inputText.toUpperCase()) >= 0;
+      }
+
+      function handleVisibleChange(v) {
+        // console.log(v);
+        // v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
 
-    async function getTemplate() {
-      try {
-        const res = await downTemplate({ type: 2 });
-        console.log('res', res);
-      } catch (error) {
-        console.log('not passing', error);
+      async function getTemplate() {
+        try {
+          const res = await downTemplate({ type: 2 });
+          console.log('res', res);
+        } catch (error) {
+          console.log('not passing', error);
+        }
       }
-    }
-    return {
-      register,
-      schemas,
-      registerForm,
-      model: modelRef,
-      title,
-      fileFlow,
-      handleVisibleChange,
-      onFilterOption,
-      handleSubmit,
-      addListFunc,
-      resetFields,
-      t,
-      getTemplate,
-    };
-  },
-});
+      return {
+        register,
+        schemas,
+        registerForm,
+        model: modelRef,
+        title,
+        fileFlow,
+        handleVisibleChange,
+        onFilterOption,
+        handleSubmit,
+        addListFunc,
+        resetFields,
+        t,
+        getTemplate,
+      };
+    },
+  });
 </script>

src/views/device/index.vue

@@ -21,8 +21,8 @@
                 ifShow: getCheckPerm('device-out') && !Boolean(record.outType),
                 onClick: handleCheckout.bind(null, record),
               },{
-                label: '编辑',
-                ifShow: getCheckPerm('device-update') && Boolean(record.outType),
+                label: '绑定',
+                ifShow: getCheckPerm('device-update') && !Boolean(record.userName),
                 onClick: handleEdit.bind(null, record),
               },{
                 label: '解绑',

src/views/device/putModal.vue

@@ -22,7 +22,7 @@
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { cameraIn } from '/@/api/device'
+  import { cameraIn } from '/@/api/device';
   import { companyUploadExcel, downTemplate } from '/@/api/customer';
   import { useI18n } from '/@/hooks/web/useI18n';
   const { t } = useI18n();
@@ -31,7 +31,7 @@
     props: {
       userData: { type: Object },
     },
-    emits: ['reload',],
+    emits: ['reload'],
     setup(_, { emit }) {
       const modelRef = ref({});
       const fileFlow = reactive({
@@ -46,8 +46,8 @@
           colProps: {
             span: 18,
           },
-          helpMessage:'wifi名称需包含前缀，如““4DKKPRO_”。',
-          defaultValue:'4DKKPRO_',
+          helpMessage: 'wifi名称需包含前缀，如““4DKKPRO_”。',
+          defaultValue: '4DKKPRO_',
           rules: [
             {
               required: true,
@@ -57,12 +57,12 @@
                 if (!value) {
                   return Promise.reject('请输入wifi名称');
                 }
-                var list:string[] = ['4DKKPRO_',];
-                const some = list.some(item=>{
-                  return value.indexOf(item) != -1
-                })
-                console.log('validator',some)
-                if(!some){
+                var list: string[] = ['4DKKPRO_'];
+                const some = list.some((item) => {
+                  return value.indexOf(item) != -1;
+                });
+                console.log('validator', some);
+                if (!some) {
                   return Promise.reject('wifi名称需包含前缀，如“4DKKPRO_”。');
                 }
                 return Promise.resolve();
@@ -70,7 +70,7 @@
               trigger: 'change',
             },
           ],
-        }
+        },
       ];
       const [registerForm, { validate, resetFields, setFieldsValue }] = useForm({
         labelWidth: 120,
@@ -94,9 +94,7 @@
           type: data.sceneName,
         });
       }
-      function handleVisibleChange() {
-
-      }
+      function handleVisibleChange() {}
 
       const handleSubmit = async () => {
         try {