feat(api): update api 32

src/locales/lang/zh-CN/routes/scenes.ts

@@ -9,7 +9,7 @@ export default {
   sceneList: '场景列表',
   bindAnchor: '绑定主播',
   anchorRoom: '直播间名称',
-  appListPicUrl: '直播间封面',
+  appListPicUrl: '场景封面',
   sortOrder: '排序',
   bindShowerNameList: '已绑定主播',
   livestreamStatus: '是否开播',

src/views/devices/editModal.vue

@@ -0,0 +1,263 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="register"
+    :title="t('routes.devices.addCamera')"
+    @visible-change="handleVisibleChange"
+    @ok="handleSubmit"
+  >
+    <div class="pt-2px pr-3px">
+      <BasicForm @register="registerForm" :model="model" />
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, nextTick, onMounted } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { allCompanyApi, addCameraApi } from '/@/api/device/list';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  //   address: "11111"
+  // balance: "111"
+  // cameraType: "4"
+  // childName: "11111"
+  // companyId: 1146
+  // orderSn: "1111"
+  // own: "0"
+  // rnd: 0.9923218970879999
+  // snCode: "1111"
+  // wifiName: "1111"
+  const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    setup(props, { emit }) {
+      const modelRef = ref({});
+      const { createMessage } = useMessage();
+      const schemas: FormSchema[] = [
+        {
+          field: 'own',
+          component: 'Select',
+          label: t('routes.devices.own'),
+          colProps: {
+            span: 24,
+          },
+          componentProps: {
+            options: [0, 2, 1, 3].map((ele) => {
+              return { value: ele, key: ele, label: renderOwnTypeLabel(ele) };
+            }),
+          },
+          required: true,
+        },
+        {
+          field: 'cameraType',
+          component: 'Select',
+          label: t('routes.devices.cameraType'),
+          required: true,
+          colProps: {
+            span: 24,
+          },
+          componentProps: {
+            options: [4, 1, 9, 10, 6].map((ele) => {
+              return { value: ele, key: ele, label: rendercameraTypeLabel(ele) };
+            }),
+            // onChange: function (val) {
+            //   console.log('appendSchemaByField', val);
+            //   if (val !== 6) {
+            //     appendSchemaByField(
+            //       {
+            //         field: 'snCode',
+            //         component: 'Input',
+            //         label: t('routes.devices.snCode'),
+            //         required: true,
+            //         colProps: {
+            //           span: 24,
+            //         },
+            //       },
+            //       'address',
+            //     );
+            //   } else {
+            //     removeSchemaByFiled('snCode');
+            //   }
+            // },
+          },
+        },
+
+        {
+          field: 'childName',
+          component: 'Input',
+          label: t('routes.devices.childName'),
+          required: true,
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'wifiName',
+          component: 'Input',
+          label: t('routes.devices.wifiName'),
+          required: true,
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'address',
+          component: 'Input',
+          required: true,
+          label: t('routes.devices.address'),
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'snCode',
+          component: 'Input',
+          label: t('routes.devices.snCode'),
+          required: true,
+          ifShow: ({ model }) => {
+            console.log('record', model.cameraType);
+
+            return model.cameraType && model.cameraType !== 6;
+          },
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'balance',
+          component: 'Input',
+          label: t('routes.devices.balance'),
+          colProps: {
+            span: 24,
+          },
+        },
+        // {
+        //   field: 'orderSn',
+        //   component: 'Input',
+        //   label: t('routes.devices.orderSn'),
+        //   colProps: {
+        //     span: 24,
+        //   },
+        //   required: true,
+        // },
+        {
+          field: 'companyId',
+          component: 'ApiSelect',
+          label: t('routes.devices.companyId'),
+          componentProps: {
+            api: allCompanyApi,
+            numberToString: true,
+            labelField: 'companyName',
+            valueField: 'id',
+            immediate: true,
+            params: {
+              page: 1,
+              limit: 1000,
+            },
+          },
+          colProps: {
+            span: 24,
+          },
+        },
+      ];
+      const [
+        registerForm,
+        {
+          getFieldsValue,
+          validateFields,
+          // appendSchemaByField,
+          // removeSchemaByFiled,
+          // setFieldsValue,
+          // setProps
+        },
+      ] = useForm({
+        labelWidth: 120,
+        schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+      function renderOwnTypeLabel(type: number): string {
+        switch (type) {
+          case 0:
+            return t('routes.devices.ownName.0');
+          case 2:
+            return t('routes.devices.ownName.2');
+          case 1:
+            return t('routes.devices.ownName.1');
+          case 3:
+            return t('routes.devices.ownName.3');
+          default:
+            return '';
+        }
+      }
+      function rendercameraTypeLabel(cameraType: number): string {
+        switch (cameraType) {
+          case 4:
+            return t('routes.devices.cameraName.4');
+          case 1:
+            return t('routes.devices.cameraName.1');
+          case 9:
+            return t('routes.devices.cameraName.9');
+          case 10:
+            return t('routes.devices.cameraName.10');
+          case 6:
+            return t('routes.devices.cameraName.6');
+          default:
+            return '';
+        }
+      }
+      function onDataReceive(data) {
+        console.log('Data Received', data);
+        const { addList } = data;
+        if (typeof addList === 'function') {
+          //是函数    其中 FunName 为函数名称
+          addListFunc = addList;
+        }
+      }
+      const handleSubmit = async () => {
+        console.log('getFieldsValue()', getFieldsValue());
+        try {
+          const data = await validateFields();
+          const param = await getFieldsValue();
+          let res = await addCameraApi(param);
+          console.log('getFieldsValue()', res, data, param);
+          if (res.code) {
+            createMessage.error(res.error || t('common.optFail'));
+          } else {
+            emit('getList');
+            closeModal();
+          }
+        } catch (error) {
+          console.log('not passing', error);
+        }
+      };
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
+
+      return {
+        register,
+        rendercameraTypeLabel,
+        renderOwnTypeLabel,
+        schemas,
+        registerForm,
+        model: modelRef,
+        handleVisibleChange,
+        handleSubmit,
+        addListFunc,
+        t,
+      };
+    },
+  });
+</script>

src/views/devices/list.vue

@@ -14,26 +14,13 @@
         {{ renderOwnTypeLabel(record.own) }}
       </template>
 
-      <template #action>
+      <template #action="{ record }">
         <TableAction
           :actions="[
             {
               icon: 'clarity:note-edit-line',
-              label: t('common.operating'),
-              onClick: () => {
-                createMessage.info(`暂未接入`);
-              },
-            },
-            {
-              icon: 'ant-design:delete-outlined',
-              color: 'error',
-              label: t('common.delText'),
-              popConfirm: {
-                title: t('common.delConfirm'),
-                confirm: () => {
-                  createMessage.info(t('common.notConnect'));
-                },
-              },
+              label: t('common.edit'),
+              onClick: handleEditScenes.bind(null, record),
             },
           ]"
         />
@@ -108,6 +95,12 @@
           slots: { customRender: 'own' },
           width: 120,
         },
+        {
+          title: t('common.operating'),
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
+          width: 120,
+        },
       ];
 
       const searchForm: Partial<FormProps> = {
@@ -181,7 +174,9 @@
             return '';
         }
       }
-
+      function handleEditScenes(record: recordable) {
+        console.log('record', record);
+      }
       return {
         registerTable,
         createMessage,
@@ -191,6 +186,7 @@
         openAddModal,
         t,
         reload,
+        handleEditScenes,
       };
     },
   });