feat(device): 国际化

src/api/device/list.ts

@@ -1,5 +1,5 @@
 import { defHttp } from '/@/utils/http/axios';
-import { PageParams, RentListGetResultModel } from './model';
+import { PageParams, RentListGetResultModel, addCamerParams } from './model';
 
 enum Api {
   pageList = '/zfb-api/zfb/camera/pageList',
@@ -20,6 +20,16 @@ export const ListApi = (params: PageParams) =>
       ignoreCancelToken: true,
     },
   });
+
+// export const ListApi = (params: PageParams) =>
+//   defHttp.post<RentListGetResultModel>({
+//     url: Api.pageList,
+//     params,
+//     headers: {
+//       // @ts-ignore
+//       ignoreCancelToken: true,
+//     },
+//   });
 export const allCompanyApi = (params: PageParams) =>
   defHttp.post<RentListGetResultModel>({
     url: Api.allCompany,
@@ -30,7 +40,7 @@ export const allCompanyApi = (params: PageParams) =>
     },
   });
 
-export const addCameraApi = (params: PageParams) =>
+export const addCameraApi = (params: addCamerParams) =>
   defHttp.post<RentListGetResultModel>({
     url: Api.addCamera,
     params,

src/api/device/model.ts

@@ -4,6 +4,17 @@ import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
  */
 export type PageParams = BasicPageParams;
 
+export interface addCamerParams {
+  address: string;
+  balance: string;
+  cameraType: string;
+  childName: string;
+  companyId?: string;
+  orderSn?: string;
+  own: string;
+  snCode?: string;
+  wifiName: string;
+}
 export interface DeviceListItem {
   id: number;
   activatedTime: string;

src/locales/lang/zh-CN/common.ts

@@ -5,21 +5,31 @@ export default {
   loadingText: '加载中...',
   saveText: '保存',
   delText: '删除',
+  operating: '操作',
   resetText: '重置',
   searchText: '搜索',
   queryText: '查询',
 
   inputText: '请输入',
   chooseText: '请选择',
-
+  edit: '编辑',
   redo: '刷新',
   back: '返回',
-
+  checkTips: '验证提示',
   light: '亮色主题',
   dark: '黑暗主题',
-
+  unbind: '解绑',
+  bind: '绑定',
   yes: '是',
   no: '否',
+  unusual: '异常',
+  operation: '操作',
+  state: '状态',
+  fullName: '姓名',
   optSuccess: '操作成功',
   optFail: '操作失败',
+  notConnect: '暂未接入',
+  delConfirm: '是否确认删除',
+  phone: '请填写您的手机号码！',
+  phoneError: '请正确填写您的手机号码！',
 };

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

@@ -2,4 +2,27 @@ export default {
   recharge: '充值',
   device: '设备',
   sub_account: '子账号',
+  stateName: {
+    0: '审核中',
+    1: '已通过',
+    2: '已拒绝',
+    9: '全部',
+  },
+  businessAuth: '企业认证',
+  timeField: '时间字段',
+  phone: '手机号',
+  enterpriseName: '企业名称',
+  submitTime: '提交时间',
+  enterpriseId: '企业账号',
+  rechargeId: '充值账号',
+  sceneLogo: '加载界面LOGO',
+  floorLogo: '加载地面LOGO',
+  bgMusic: '背景音乐',
+  cameraNum: '设备数量',
+  subNum: '子账号数量',
+  sceneNum: '上传场景数',
+  point: '余额',
+  expirationTime: '到期时间',
+  detailed: '详细信息',
+  modifySubId: '修改子账号',
 };

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

@@ -1,12 +1,46 @@
 export default {
   deviceList: '设备列表',
+  device: '设备',
+  addDevice: '设备',
   address: '物理地址',
   balance: '初始点数',
   cameraType: '相机类型',
   childName: '设备ID',
   companyId: '客户名称',
+  phoneName: '手机号（用户名）',
   orderSn: '订单号',
   own: '出库类型',
-  snCode: '1111',
+  addCamera: '添加相机',
+  type: '设备类型',
   wifiName: 'wifi名称',
+  normalSales: '正常销售',
+  giftGive: '礼品赠送',
+  selfUse: '员工自用',
+  other: '其它',
+  activationTime: '激活时间',
+  shipmentType: '出货类型',
+  snCode: 'sn码',
+  cameraName: {
+    '1': '四维看看 Lite二目相机',
+    '4': '四维看看 Pro八目相机',
+    '6': '第三方相机',
+    '9': '四维看看双目转台相机',
+    '10': '四维看看激光相机',
+    '7': '四维看看 三脚架套装',
+  },
+  ownName: {
+    '0': '正常销售',
+    '1': '员工自用',
+    '2': '礼品赠送',
+    '3': '其它',
+  },
+  partList: {},
+  addSubAccount: '新增子账号',
+  bindErr: '子账号已被该企业绑定',
+  excess: '子账号数量已满!',
+  unbindWarning: '确定要解绑该子账号？',
+  addeduser: '已添加字子号账号数',
+  subNum: '设备数量',
+  // normalSales: '正常销售',
+  // normalSales: '正常销售',
 };

src/views/corporation/EditModal.vue

@@ -2,7 +2,7 @@
   <BasicModal
     v-bind="$attrs"
     @register="register"
-    title="修改子账号"
+    :title="t('routes.corporation.modifySubId')"
     @visible-change="handleVisibleChange"
     @ok="submitMolad"
   >
@@ -15,24 +15,7 @@
   import { defineComponent, ref, nextTick } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
-  const schemas: FormSchema[] = [
-    {
-      field: 'memoName',
-      component: 'Input',
-      label: '姓名',
-      colProps: {
-        span: 24,
-      },
-    },
-    {
-      field: 'phone',
-      component: 'Input',
-      label: '手机号',
-      colProps: {
-        span: 24,
-      },
-    },
-  ];
+  import { useI18n } from '/@/hooks/web/useI18n';
   export default defineComponent({
     components: { BasicModal, BasicForm },
     props: {
@@ -40,6 +23,25 @@
     },
     setup(props) {
       const modelRef = ref({});
+      const { t } = useI18n();
+      const schemas: FormSchema[] = [
+        {
+          field: 'memoName',
+          component: 'Input',
+          label: t('common.fullName'),
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'phone',
+          component: 'Input',
+          label: t('routes.corporation.phone'),
+          colProps: {
+            span: 24,
+          },
+        },
+      ];
       const [registerForm, { setFieldsValue, getFieldsValue }] = useForm({
         labelWidth: 120,
         schemas,
@@ -67,7 +69,15 @@
         v && props.userData && nextTick(() => onDataReceive(props.userData));
       }
 
-      return { register, submitMolad, schemas, registerForm, model: modelRef, handleVisibleChange };
+      return {
+        register,
+        submitMolad,
+        schemas,
+        registerForm,
+        model: modelRef,
+        handleVisibleChange,
+        t,
+      };
     },
   });
 </script>

src/views/corporation/SubaccountModal.vue

@@ -77,6 +77,7 @@
   import EditModal from './EditModal.vue';
   import { tableState } from './types/hooks';
   import AddModal from './AddModal.vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
   export default defineComponent({
     components: { BasicModal, BasicForm, BasicTable, AddModal, TableAction, EditModal },
     props: {
@@ -84,6 +85,7 @@
     },
     emits: ['addtable'],
     setup(props) {
+      const { t } = useI18n();
       const { createConfirm, createMessage } = useMessage();
       const currentModal = shallowRef<Nullable<ComponentOptions>>(null);
       const tableRef = ref<Nullable<TableActionType>>(null);
@@ -142,13 +144,13 @@
         {
           field: 'userName',
           component: 'Input',
-          label: '充值账号',
+          label: t('routes.corporation.rechargeId'),
           slot: 'userName',
           labelWidth: 200,
         },
         {
           field: 'name',
-          label: '企业账号',
+          label: t('routes.corporation.enterpriseId'),
           slot: 'name',
           component: 'Input',
           labelWidth: 200,
@@ -156,7 +158,7 @@
         {
           field: 'subNum',
           component: 'InputNumber',
-          label: '设备数量',
+          label: t('routes.devices.subNum'),
           labelWidth: 200,
           componentProps: () => {
             return {
@@ -168,7 +170,7 @@
         },
         {
           field: 'addeduser',
-          label: '已添加字子号账号数',
+          label: t('routes.devices.addeduser'),
           labelWidth: 200,
           slot: 'addeduser',
           component: 'Input',
@@ -224,7 +226,7 @@
           createConfirm({
             iconType: 'warning',
             title: '提示',
-            content: '确定要解绑该子账号？',
+            content: t('routes.devices.unbindWarning'),
             onOk: async () => {
               tableRef.value.deleteTableDataRecord(item.id);
             },
@@ -247,9 +249,8 @@
         myData.pagination.total = res.totalCount || 0;
         console.log('selectUserList', res, myData);
       }
-      async function beforeEditSubmit({ record, index, key, value }) {
+      async function beforeEditSubmit({ _, index, key, value }) {
         myData.TableData[index][key] = value;
-        console.log('单元格数据正在准备提交', record, myData.TableData[index]);
         return true;
       }
       function handleVisibleChange(v) {
@@ -264,7 +265,7 @@
               myData.TableData.push(val);
               console.log('addList', val, myData.TableData);
             } else {
-              createMessage.error('子账号数量已满!');
+              createMessage.error(t('routes.devices.excess'));
             }
           },
         });
@@ -277,7 +278,7 @@
           subUsers: tableData,
         });
         console.log('saveTable', res);
-        createMessage.success('操作成功');
+        createMessage.success(t('common.o'));
         reload();
         closeModal();
       }
@@ -311,6 +312,7 @@
         closeModal,
         addTabledata,
         reload,
+        t,
       };
     },
   });

src/views/corporation/deviceModal.vue

@@ -2,7 +2,7 @@
   <BasicModal
     v-bind="$attrs"
     @register="register"
-    title="新增设备"
+    :title="t('routes.devices.addDevice')"
     @ok="submitModal"
     @visible-change="handleVisibleChange"
   >
@@ -24,6 +24,7 @@
   import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { AddDevice, checkDevice } from '/@/api/corporation/modal';
+  import { useI18n } from '/@/hooks/web/useI18n';
   export default defineComponent({
     components: { BasicModal, BasicForm },
     props: {
@@ -32,6 +33,7 @@
     setup(props) {
       const modelRef = ref({});
       const num = ref(0);
+      const { t } = useI18n();
       const { createMessage } = useMessage();
       const { success, error } = createMessage;
       // const debounce = (fn, delay) => {
@@ -69,20 +71,20 @@
       const schemas: FormSchema[] = [
         {
           field: 'userName',
-          label: '企业名称',
+          label: t('routes.corporation.enterpriseName'),
           slot: 'userName',
           component: 'Input',
         },
         {
           field: 'name',
-          label: '企业账号',
+          label: t('routes.corporation.enterpriseId'),
           slot: 'name',
           component: 'Input',
         },
         {
           field: 'num',
           component: 'InputNumber',
-          label: '设备数量',
+          label: t('routes.corporation.cameraNum'),
           colProps: {
             span: 8,
           },
@@ -179,12 +181,13 @@
           // value,num.value,schemasList.filter((_,index) => {return !(index<num.value)}).map((_,index) => `ID${index}`))
         } else {
           //增
+          let device = t('routes.corporation.device');
           let schemasList: FormSchema[] = Array.from(new Array(value)).map((_, index) => {
             return {
               field: `ID${index}`,
               component: 'Input',
-              label: '设备ID' + index,
-              helpMessage: ['验证提示', '设备号码异常'],
+              label: device + 'ID' + index,
+              helpMessage: [t('common.checkTips'), `${device} ${t('common.unusual')}`],
               itemProps: {
                 validateTrigger: 'blur',
               },
@@ -194,7 +197,7 @@
               rules: [
                 {
                   required: true,
-                  message: '请输入设备ID',
+                  message: `${t('common.inputText')} ${device} ID`,
                 },
                 {
                   validator: handlevalidator,
@@ -230,6 +233,7 @@
         handleVisibleChange,
         num,
         errorMsg: error,
+        t,
       };
     },
   });

src/views/corporation/index.vue

@@ -97,55 +97,55 @@
           width: 80,
         },
         {
-          title: '企业账户',
+          title: t('routes.corporation.enterpriseId'),
           dataIndex: 'userName',
           width: 120,
         },
         {
-          title: '企业名称',
+          title: t('routes.corporation.enterpriseName'),
           dataIndex: 'name',
           width: 120,
         },
         {
-          title: '加载界面LOGO',
+          title: t('routes.corporation.sceneLogo'),
           dataIndex: 'sceneLogo',
           slots: { customRender: 'sceneLogo' },
           width: 160,
         },
         {
-          title: '加载地面LOGO',
+          title: t('routes.corporation.floorLogo'),
           dataIndex: 'floorLogo',
           slots: { customRender: 'floorLogo' },
           width: 160,
         },
         {
-          title: '背景音乐',
+          title: t('routes.corporation.bgMusic'),
           dataIndex: 'bgMusic',
           slots: { customRender: 'bgMusic' },
           width: 160,
         },
         {
-          title: '设备数量',
+          title: t('routes.corporation.cameraNum'),
           dataIndex: 'cameraNum',
           width: 80,
         },
         {
-          title: '子账号数量',
+          title: t('routes.corporation.subNum'),
           dataIndex: 'subNum',
           width: 80,
         },
         {
-          title: '上传场景数',
+          title: t('routes.corporation.sceneNum'),
           dataIndex: 'sceneNum',
           width: 80,
         },
         {
-          title: '余额',
+          title: t('routes.corporation.point'),
           dataIndex: 'point',
           width: 80,
         },
         {
-          title: '到期时间',
+          title: t('routes.corporation.expirationTime'),
           dataIndex: 'expirationTime',
           slots: { customRender: 'expirationTime' },
           width: 180,
@@ -166,7 +166,7 @@
           },
           {
             field: 'userName',
-            label: '企业账号',
+            label: t('routes.corporation.enterpriseId'),
             component: 'Input',
             colProps: {
               xl: 12,
@@ -178,7 +178,7 @@
       // { getForm }
       provide('tablereload', tablereload);
       const [registerTable, { reload }] = useTable({
-        title: '企业账号',
+        title: t('routes.corporation.enterpriseId'),
         api: ListApi,
         columns: columns,
         useSearchForm: true,
@@ -196,7 +196,7 @@
         },
         actionColumn: {
           width: 160,
-          title: '操作',
+          title: t('common.operation'),
           dataIndex: 'action',
           slots: { customRender: 'action' },
         },

src/views/corporation/verify.vue

@@ -2,9 +2,9 @@
   <div class="p-4">
     <BasicTable @register="registerTable">
       <template #toolbar> </template>
-      <template #no="{ state }">
-        <Tag color="green">
-          {{ state || '审核中' }}
+      <template #no="{ record }">
+        <Tag :color="rederTag(record.state, 'color')">
+          {{ rederTag(record.state, 'text') || '审核中' }}
         </Tag>
       </template>
       <template #time="{ record }">
@@ -16,7 +16,7 @@
             {
               icon: 'clarity:info-standard-line',
               // tooltip: '详细信息',
-              label: '详细信息',
+              label: t('routes.corporation.detailed'),
               onClick: () => {
                 infoText(record);
               },
@@ -37,14 +37,16 @@
   import { ListVerifyApi } from '/@/api/corporation/list';
   import detailsModal from './detailsModal.vue';
   import { useModal } from '/@/components/Modal';
+  import { useI18n } from '/@/hooks/web/useI18n';
 
   export default defineComponent({
     components: { BasicTable, Tag, TableAction, detailsModal, Time },
     setup() {
+      const { t } = useI18n();
       const [registerDeviceModal, { openModal: openDeviceModal }] = useModal();
       const columns: BasicColumn[] = [
         {
-          title: '提交日期',
+          title: t('routes.corporation.submitTime'),
           dataIndex: 'createTime',
           slots: { customRender: 'time' },
           width: 180,
@@ -55,23 +57,23 @@
           // },
         },
         {
-          title: '企业名称',
+          title: t('routes.corporation.enterpriseName'),
           dataIndex: 'name',
           width: 230,
         },
         {
-          title: '手机号',
+          title: t('routes.corporation.phone'),
           dataIndex: 'userName',
           width: 120,
         },
         {
-          title: '状态',
+          title: t('common.state'),
           dataIndex: 'state',
           slots: { customRender: 'no' },
           width: 180,
         },
         {
-          title: '操作',
+          title: t('common.operation'),
           dataIndex: '',
           slots: { customRender: 'action' },
           width: 120,
@@ -82,34 +84,53 @@
         labelWidth: 100,
         schemas: [
           {
-            field: 'id',
-            label: 'id',
-            component: 'Input',
+            field: 'state',
+            component: 'Select',
+            label: t('routes.devices.deviceList'),
+            defaultValue: '',
             colProps: {
-              xl: 3,
-              xxl: 3,
+              span: 4,
+            },
+            componentProps: {
+              options: ['', 1, 0, 2].map((ele) => {
+                return { value: ele, key: ele, label: rederTag(ele, 'text') };
+              }),
             },
           },
           {
             field: 'userName',
-            label: '企业账号',
+            label: t('routes.corporation.phone'),
             component: 'Input',
             colProps: {
-              xl: 12,
-              xxl: 8,
+              span: 6,
+            },
+          },
+          {
+            field: 'fieldTime',
+            component: 'RangePicker',
+            label: t('routes.corporation.timeField'),
+            colProps: {
+              span: 8,
             },
           },
         ],
       };
       // { getForm }
       const [registerTable] = useTable({
-        title: '企业认证',
+        title: t('routes.corporation.businessAuth'),
         api: ListVerifyApi,
         columns: columns,
         useSearchForm: true,
         formConfig: searchForm,
         showTableSetting: true,
         tableSetting: { fullScreen: true },
+        handleSearchInfoFn: function (searchData) {
+          if (searchData.fieldTime) {
+            searchData.startTime = searchData.fieldTime[0];
+            searchData.endTime = searchData.fieldTime[1];
+          }
+          return searchData;
+        },
         showIndexColumn: false,
         rowKey: 'id',
         //TODO
@@ -123,12 +144,28 @@
       function infoText(record) {
         openDeviceModal(true, { record });
       }
+      function rederTag(state, type) {
+        let obj = {
+          1: { color: 'success', text: t('routes.corporation.stateName.1') },
+          2: { color: 'warning', text: t('routes.corporation.stateName.2') },
+          0: { color: 'green', text: t('routes.corporation.stateName.0') },
+        };
+        let active = obj[state] || { color: 'green', text: t('routes.corporation.stateName.9') };
+        console.log('active', active, state);
+        if (type == 'color') {
+          return active.color || 'green';
+        } else {
+          return active.text || 'green';
+        }
+      }
       // pagination.value = { pageSize: 20 };
       return {
         registerTable,
         uploadApi: uploadApi as any,
         registerDeviceModal,
         infoText,
+        rederTag,
+        t,
       };
     },
   });

src/views/devices/AddModal.vue

@@ -2,7 +2,7 @@
   <BasicModal
     v-bind="$attrs"
     @register="register"
-    title="新增子账号"
+    :title="t('routes.devices.addSubAccount')"
     @visible-change="handleVisibleChange"
     @ok="handleSubmit"
   >
@@ -12,11 +12,11 @@
   </BasicModal>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, nextTick } from 'vue';
+  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 { checkUserAddAble } from '/@/api/corporation/modal';
+  import { allCompanyApi, addCameraApi } from '/@/api/device/list';
   import { useI18n } from '/@/hooks/web/useI18n';
   //   address: "11111"
   // balance: "111"
@@ -29,107 +29,131 @@
   // snCode: "1111"
   // wifiName: "1111"
   const { t } = useI18n();
-  const schemas: FormSchema[] = [
-    {
-      field: 'own',
-      component: 'Input',
-      label: t('routes.devices.own'),
-      colProps: {
-        span: 24,
-      },
-      componentProps: {
-        options: [
-          {
-            label: '全部',
-            value: '1',
-            key: '1',
-          },
-          {
-            label: '正常',
-            value: '2',
-            key: '2',
-          },
-          {
-            label: '已关闭',
-            value: '2',
-            key: '2',
-          },
-        ],
-      },
-      required: true,
-    },
-    {
-      field: 'cameraType',
-      component: 'Select',
-      label: t('routes.devices.cameraType'),
-      required: true,
-      colProps: {
-        span: 24,
-      },
-    },
-    {
-      field: 'childName',
-      component: 'Input',
-      label: t('routes.devices.childName'),
-      required: true,
-      colProps: {
-        span: 24,
-      },
-    },
-    {
-      field: 'wifiName',
-      component: 'Input',
-      label: t('routes.devices.wifiName'),
-      colProps: {
-        span: 24,
-      },
-    },
-    {
-      field: 'address',
-      component: 'Input',
-      label: t('routes.devices.address'),
-      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: 'Input',
-      label: t('routes.devices.companyId'),
-      colProps: {
-        span: 24,
-      },
-    },
-  ];
   export default defineComponent({
     components: { BasicModal, BasicForm },
     props: {
       userData: { type: Object },
     },
-    setup(props) {
+    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'),
+          colProps: {
+            span: 24,
+          },
+        },
+        {
+          field: 'address',
+          component: 'Input',
+          label: t('routes.devices.address'),
+          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: 'name',
+            valueField: 'id',
+            immediate: true,
+            params: {
+              page: 1,
+              limit: 1000,
+            },
+          },
+          colProps: {
+            span: 24,
+          },
+        },
+      ];
       const [
         registerForm,
         {
           getFieldsValue,
+          validateFields,
+          appendSchemaByField,
+          removeSchemaByFiled,
           // setFieldsValue,
           // setProps
         },
@@ -141,11 +165,41 @@
           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;
@@ -156,22 +210,19 @@
       }
       const handleSubmit = async () => {
         console.log('getFieldsValue()', getFieldsValue());
-        var reg_tel =
-          /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
-        let { phone, memoName } = getFieldsValue();
-        if (phone == '') {
-          createMessage.error('请填写您的手机号码！');
-          return false;
-        } else if (!reg_tel.test(phone)) {
-          createMessage.error('请正确填写您的手机号码！');
-          return false;
-        }
-        let res = await checkUserAddAble({ phone });
-        if (res.result == false) {
-          addListFunc({ phone, memoName });
-          closeModal();
-        } else {
-          createMessage.error('子账号已被该企业绑定');
+        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) {
@@ -180,13 +231,15 @@
 
       return {
         register,
+        rendercameraTypeLabel,
+        renderOwnTypeLabel,
         schemas,
         registerForm,
         model: modelRef,
         handleVisibleChange,
         handleSubmit,
         addListFunc,
-        closeModal,
+        t,
       };
     },
   });

src/views/devices/list.vue

@@ -2,7 +2,9 @@
   <div class="p-4">
     <BasicTable @register="registerTable">
       <template #toolbar>
-        <a-button type="primary" @click="openAddModal">添加相机</a-button>
+        <a-button type="primary" @click="openAddModal">{{
+          t('routes.devices.addCamera')
+        }}</a-button>
       </template>
 
       <template #cameraType="{ record }">
@@ -17,7 +19,7 @@
           :actions="[
             {
               icon: 'clarity:note-edit-line',
-              label: '编辑',
+              label: t('common.operating'),
               onClick: () => {
                 createMessage.info(`暂未接入`);
               },
@@ -25,11 +27,11 @@
             {
               icon: 'ant-design:delete-outlined',
               color: 'error',
-              label: '删除',
+              label: t('common.delText'),
               popConfirm: {
-                title: '是否确认删除',
+                title: t('common.delConfirm'),
                 confirm: () => {
-                  createMessage.info(`暂未接入`);
+                  createMessage.info(t('common.notConnect'));
                 },
               },
             },
@@ -37,7 +39,7 @@
         />
       </template>
     </BasicTable>
-    <AddModal @register="registerAddModal" />
+    <AddModal @getList="reload" @register="registerAddModal" />
   </div>
 </template>
 <script lang="ts">
@@ -59,44 +61,44 @@
       const { t } = useI18n();
       const columns: BasicColumn[] = [
         {
-          title: '设备ID',
+          title: t('routes.devices.childName'),
           dataIndex: 'id',
           fixed: 'left',
           width: 100,
         },
         {
-          title: '手机号（用户名）',
+          title: t('routes.devices.phoneName'),
           dataIndex: 'userName',
           width: 230,
         },
         {
-          title: '客户名称',
+          title: t('routes.devices.companyId'),
           dataIndex: 'companyName',
           width: 120,
         },
         {
-          title: '设备类型',
+          title: t('routes.devices.cameraType'),
           dataIndex: 'cameraType',
           width: 230,
           slots: { customRender: 'cameraType' },
         },
         {
-          title: 'sn码',
+          title: t('routes.devices.snCode'),
           dataIndex: 'snCode',
           width: 120,
         },
         {
-          title: 'wifi',
+          title: t('routes.devices.wifiName'),
           dataIndex: 'wifiName',
           width: 180,
         },
         {
-          title: '激活时间',
+          title: t('routes.devices.activationTime'),
           dataIndex: 'activatedTime',
           width: 150,
         },
         {
-          title: '出货类型',
+          title: t('routes.devices.shipmentType'),
           dataIndex: 'own',
           slots: { customRender: 'own' },
           width: 120,
@@ -153,7 +155,7 @@
         ],
       };
       // { getForm }
-      const [registerTable] = useTable({
+      const [registerTable, { reload }] = useTable({
         title: t('routes.devices.deviceList'),
         api: ListApi,
         columns: columns,
@@ -210,6 +212,7 @@
         registerAddModal,
         openAddModal,
         t,
+        reload,
       };
     },
   });