1

.env.development

@@ -6,7 +6,7 @@ VITE_PUBLIC_PATH = ./
 
 # Cross-domain proxy, you can configure multiple
 # Please note that no line breaks
-VITE_PROXY = [["/qjkankan","https://test.4dkankan.com/qjkankan"],["/takelook","https://v4-test.4dkankan.com/takelook"],["/upload","https://v4-uat.4dkankan.com/service/manage/common/upload/files"],["/service","https://v4-uat.4dkankan.com/service"],["/ucenter","https://v4-uat.4dkankan.com/ucenter"]]
+VITE_PROXY = [["/qjkankan","https://test.4dkankan.com/qjkankan"],["/takelook","https://v4-test.4dkankan.com/takelook"],["/upload","https://v4-uat.4dkankan.com/service/manage/common/upload/files"],["/service","https://testeur.4dkankan.com/service"],["/ucenter","https://v4-uat.4dkankan.com/ucenter"]]
 # VITE_PROXY=[["/api","https://vvbin.cn/test"]]
 
 # Delete console

src/views/product/rtk/AddenvModal.vue

@@ -0,0 +1,467 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="register"
+    :title="fileFlow.title"
+    @visible-change="handleVisibleChange"
+    @cancel="resetFields"
+    @ok="handleSubmit"
+  >
+    <div class="pt-2px pr-3px">
+      <BasicForm @register="registerForm" :model="model">
+        <template #text="{ model, field }">
+          {{ model[field] }}
+        </template>
+      </BasicForm>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, nextTick, 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 { uploadApi, rtksaveOrEdit } from '/@/api/product/index';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import moment from 'moment';
+
+  const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['update', 'register'],
+    setup(props, { emit }) {
+      const modelRef = ref({
+        operator: '中国移动',
+        ipAddr: '120.253.239.161',
+        mountPoint: 'RTCM33_GRCEJ',
+        port: '8001',
+      });
+      let disabledDate = (current: any) => {
+        return current && current < moment().subtract(1, 'days').endOf('day');
+      };
+      let range = (start: any, end: any) => {
+        const result = [];
+        for (let i = start; i < end; i++) {
+          result.push(i);
+        }
+        return result;
+      };
+      let disabledDateTime = (current: any) => {
+        if (current) {
+          let today = moment().date();
+          if (today == current.date()) {
+            let minute = Number(moment().minutes());
+            let hour = Number(moment().hour());
+            let finalHour: number, finalMinute: number;
+            console.log('today', minute, current.hour(), hour);
+            // if (current.hour() > hour) {
+            //   finalMinute = 0;
+            // } else {
+            if (current.minute() >= 58) {
+              finalHour = hour + 1;
+              finalMinute = 0;
+            } else {
+              finalHour = hour;
+              finalMinute = minute + 5;
+            }
+            // }
+            console.log('today', finalHour, finalMinute);
+            return {
+              disabledHours: () => range(0, finalHour),
+              disabledMinutes: () => range(0, finalMinute),
+            };
+          } else if (moment() > current) {
+            return {
+              disabledHours: () => range(0, 24),
+              disabledMinutes: () => range(0, 60),
+              disabledSeconds: () => range(0, 60),
+            };
+          }
+        } else {
+          return {
+            disabledHours: () => range(0, 24),
+            disabledMinutes: () => range(0, 60),
+            disabledSeconds: () => range(0, 60),
+          };
+        }
+      };
+      const fileFlow = reactive({
+        file: null,
+        title: '新增RTK账号',
+      });
+      const { createMessage } = useMessage();
+      const schemas: FormSchema[] = [
+        {
+          field: 'id',
+          component: 'Input',
+          label: 'id',
+          show: false,
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'cameraSnCode',
+          component: 'Input',
+          required: true,
+          label: '相机sn',
+          componentProps: {
+            maxLength: 50,
+            onChange: (value) => {
+              handlertkSn(value.target.value);
+            },
+          },
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'rtkType',
+          component: 'Select',
+          label: '板卡类型',
+          required: true,
+          colProps: {
+            span: 18,
+          },
+          componentProps: {
+            options: [
+              {
+                label: '千寻板卡千寻账号',
+                value: 0,
+                key: 0,
+              },
+              {
+                label: '千寻板卡移动账号',
+                value: 1,
+                key: 1,
+              },
+              {
+                label: '北云板卡移动账号',
+                value: 2,
+                key: 2,
+              },
+            ],
+            onChange: (value) => {
+              handlertkType(value);
+            },
+          },
+          // required: true,
+        },
+        {
+          field: 'rtkSnCode',
+          component: 'Input',
+          required: true,
+          label: '板卡sn号',
+          componentProps: {
+            maxLength: 50,
+          },
+          rules: [
+            {
+              required: false,
+              // @ts-ignore
+              validator: (rule, value, ) => {
+                function isSpec(s) {
+                  var pattern = /[~!@#$%^&*<>|']/gi;
+                  return pattern.test(s);
+                }
+                if (value != null && value !== '') {
+                  if (isSpec(value) || value.indexOf(' ') !== -1) {
+                    return Promise.reject('不能包含特殊字符或空格');
+                  } else {
+                    return Promise.resolve();
+                  }
+                } else {
+                  return Promise.resolve();
+                }
+              },
+              trigger: 'change',
+            },
+          ],
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'sgRtkSn',
+          component: 'Input',
+          required: false,
+          label: '深光rtk插件sn',
+          componentProps: {
+            maxLength: 50,
+          },
+          rules: [
+            {
+              required: false,
+              // @ts-ignore
+              validator: (rule, value) => {
+                console.log('isValidateTxtNonSpec', value);
+                function isSpec(s) {
+                  var pattern = /[~!@#$%^&*<>|']/gi;
+                  return pattern.test(s);
+                }
+                if (value != null && value !== '') {
+                  if (isSpec(value) || value.indexOf(' ') !== -1) {
+                    return Promise.reject('不能包含特殊字符或空格');
+                  } else {
+                    return Promise.resolve();
+                  }
+                } else {
+                  return Promise.resolve();
+                }
+              },
+              trigger: 'change',
+            },
+          ],
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'operator',
+          component: 'Input',
+          required: true,
+          label: '运营商',
+          defaultValue: '中国移动',
+          componentProps: {
+            maxLength: 50,
+          },
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'ipAddr',
+          component: 'Input',
+          label: 'IP地址',
+          ifShow: false,
+          required: true,
+          defaultValue: '120.253.239.161',
+          colProps: {
+            span: 20,
+          },
+          // rules: [
+          //   {
+          //     required: true,
+          //     // @ts-ignore
+          //     validator: async (rule, value) => {
+          //       if (!value) {
+          //         return Promise.reject('请输入IP地址');
+          //       }
+          //       if (/.*[\u4e00-\u9fa5]+.*$/.test(value)) {
+          //         /* eslint-disable-next-line */
+          //         return Promise.reject('不支持中文字符');
+          //       }
+          //       return Promise.resolve();
+          //     },
+          //     trigger: 'change',
+          //   },
+          // ],
+          componentProps: {
+            maxLength: 50,
+            onChange: (data) => {
+              console.log('data', data);
+            },
+          },
+        },
+        {
+          field: 'mountPoint',
+          component: 'Input',
+          required: true,
+          label: '挂载点',
+          defaultValue: 'RTCM33_GRCEJ',
+          componentProps: {
+            maxLength: 50,
+          },
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'port',
+          component: 'Input',
+          required: true,
+          label: '端口',
+          defaultValue: '8001',
+          componentProps: {
+            maxLength: 50,
+          },
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'userName',
+          component: 'Input',
+          required: true,
+          label: '用户名称',
+          componentProps: {
+            maxLength: 50,
+          },
+          colProps: {
+            span: 20,
+          },
+        },
+        {
+          field: 'password',
+          component: 'Input',
+          label: '密码',
+          required: true,
+          componentProps: {
+            maxLength: 50,
+            'v-model:visible': false,
+            // readonly:preventAutoFill.value,
+            placeholder: '请输入数字、字母大小写组合',
+          },
+          colProps: { span: 20 },
+        },
+        {
+          field: 'failureTime',
+          component: 'DatePicker',
+          label: '到期日期',
+          colProps: {
+            span: 16,
+          },
+          componentProps: {
+            disabledDate: disabledDate,
+            disabledTime: disabledDateTime,
+            showTime: { defaultValue: moment('23:59:59', 'HH:mm:ss') },
+            valueFormat: 'YYYY-MM-DD HH:mm:ss',
+
+            // defaultValue: dayjs().add(7, 'day').format('YYYY-MM-DD') + ' 23:59:59',
+            format: 'YYYY-MM-DD HH:mm:ss',
+          },
+        },
+      ];
+      const [registerForm, { validate, resetFields, setFieldsValue, updateSchema, clearValidate }] =
+        useForm({
+          labelWidth: 120,
+          schemas,
+          showActionButtonGroup: false,
+          actionColOptions: {
+            span: 20,
+          },
+        });
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+
+      function onDataReceive(data) {
+        modelRef.value = data;
+        fileFlow.title = data.id ? '编辑RTK账号' : '新增RTK账号';
+        handlertkSn(data.cameraSnCode ? true : false);
+        resetFields();
+        console.log('data', data);
+        handlertkType(data.rtkType);
+        setFieldsValue(data);
+        clearValidate();
+      }
+      function handlertkType(val) {
+        console.log('val', val);
+        let ifShow = val != 0;
+        updateSchema([
+          { field: 'ipAddr', ifShow },
+          { field: 'mountPoint', ifShow },
+          { field: 'port', ifShow },
+          { field: 'userName', ifShow },
+          // { field: 'sgRtkSn', ifShow },
+          { field: 'password', ifShow },
+          { field: 'operator', ifShow },
+        ]);
+      }
+      function handlertkSn(val) {
+        console.log('handlertkSn', val);
+        let required = !!val;
+        !required && clearValidate();
+        updateSchema([
+          { field: 'cameraSnCode', required },
+          { field: 'rtkType', required },
+          {
+            field: 'rtkSnCode',
+            rules: [
+              {
+                required: required,
+                // @ts-ignore
+                validator: (rule, value, callback) => {
+                  function isSpec(s) {
+                    var pattern = /[~!@#$%^&*<>|']/gi;
+                    return pattern.test(s);
+                  }
+                  if(required && !value){
+                    return Promise.reject('请输入板卡sn号');
+                  }
+                  if (value != null && value !== '') {
+                    if (isSpec(value) || value.indexOf(' ') !== -1) {
+                      return Promise.reject('不能包含特殊字符或空格');
+                    } else {
+                      return Promise.resolve();
+                    }
+                  } else {
+                    return Promise.resolve();
+                  }
+                },
+                trigger: 'change',
+              },
+            ],
+          },
+          // { field: 'sgRtkSn', required },
+          { field: 'ipAddr', required },
+          { field: 'mountPoint', required },
+          { field: 'port', required },
+          { field: 'userName', required },
+          { field: 'password', required },
+          { field: 'operator', required },
+        ]);
+      }
+
+      const handleSubmit = async () => {
+        function isEmptyString(value) {
+          return value === null || value === undefined || value === '';
+        }
+        try {
+          const params = await validate();
+          let keyData = Object.values(params).some((item) => {
+            if (item == params.id) {
+              return false;
+            } else {
+              return !isEmptyString(item);
+            }
+          });
+          if (!keyData) {
+            return createMessage.error('请填写至少一项数据');
+          }
+          params.rtkSnCode = params.rtkSnCode && params.rtkSnCode.trim();
+          console.log('params', Object.values(params), keyData);
+          const res = await rtksaveOrEdit(params);
+          console.log('res', res);
+          closeModal();
+          resetFields();
+          createMessage.success(t('common.optSuccess'));
+          emit('update');
+        } catch (error) {
+          console.log('not passing', error);
+        }
+      };
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
+      return {
+        register,
+        schemas,
+        registerForm,
+        model: modelRef,
+        fileFlow,
+        handleVisibleChange,
+        handleSubmit,
+        addListFunc,
+        resetFields,
+        handlertkSn,
+        t,
+      };
+    },
+  });
+</script>

src/views/product/rtk/rtklist.vue

@@ -0,0 +1,301 @@
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleEdit" v-if="getCheckPerm('rtk-add')">新增</a-button>
+      </template>
+      <template #copy="{ record }">
+        <a @click="handleCopy(record.authorizeKey)">
+          {{ record.authorizeKey }}
+        </a>
+      </template>
+      <template #action="{ record }">
+        <TableAction
+          :actions="[
+            //{
+            //  label: record.status ? '取消激活' : '激活',
+            //  ifShow: getCheckPerm('rtk-activation'),
+            //  onClick: handleActive.bind(null, record),
+            //},
+            {
+              label: '编辑',
+              ifShow: getCheckPerm('rtk-updata'),
+              onClick: handleEdit.bind(null, record),
+            },
+            {
+              label: '删除',
+              color: 'error',
+              ifShow: getCheckPerm('rtk-delete'),
+              onClick: handleDelete.bind(null, record),
+            },
+          ]"
+        />
+      </template>
+    </BasicTable>
+    <AddModal @register="register" @update="reload" />
+  </div>
+</template>
+<script lang="ts">
+  import { defineComponent, h } from 'vue';
+  import {
+    BasicTable,
+    useTable,
+    TableAction,
+    BasicColumn,
+    TableImg,
+    FormProps,
+  } from '/@/components/Table';
+  import { rtkInfoList, rtkdelOrEdit, activation, rtksaveOrEdit } from '/@/api/product';
+  import { useModal } from '/@/components/Modal';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { copyTextToClipboard } from '/@/hooks/web/useCopyToClipboard';
+  import AddModal from './AddenvModal.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { usePermissionStore } from '/@/store/modules/permission';
+  import { incrementUseTypeList } from '/@/api/account';
+  import { Switch } from 'ant-design-vue';
+  export default defineComponent({
+    components: {
+      BasicTable,
+      AddModal,
+      TableAction,
+      TableImg,
+      Switch,
+    },
+    setup() {
+      const { t } = useI18n();
+      const { createMessage, createConfirm } = useMessage();
+      const permissionStore = usePermissionStore();
+      const { getCheckPerm } = permissionStore;
+      const [register, { openModal }] = useModal();
+      const columns: BasicColumn[] = [
+        {
+          title: '相机sn',
+          ellipsis: true,
+          dataIndex: 'cameraSnCode',
+          width: 100,
+        },
+        {
+          title: '板卡类型',
+          dataIndex: 'rtkType',
+          ellipsis: true,
+          width: 120,
+          customRender: ({ record }) => {
+            let obj = {
+              0: '千寻板卡千寻账号',
+              1: '千寻板卡移动账号',
+              2: '北云板卡移动账号',
+            };
+            return obj[record.rtkType] || '-';
+          },
+        },
+        {
+          title: '板卡sn号',
+          ellipsis: true,
+          dataIndex: 'rtkSnCode',
+          width: 150,
+        },
+        {
+          title: '深光rtk插件sn',
+          ellipsis: true,
+          dataIndex: 'sgRtkSn',
+          width: 120,
+        },
+        {
+          title: '运营商',
+          ellipsis: true,
+          dataIndex: 'operator',
+          width: 120,
+        },
+        {
+          title: 'IP地址',
+          ellipsis: true,
+          dataIndex: 'ipAddr',
+          width: 100,
+        },
+        {
+          title: '挂载点',
+          ellipsis: true,
+          dataIndex: 'mountPoint',
+          width: 120,
+        },
+        {
+          title: '端口',
+          ellipsis: true,
+          dataIndex: 'port',
+          width: 50,
+        },
+        {
+          title: '用户名称',
+          ellipsis: true,
+          dataIndex: 'userName',
+          width: 120,
+        },
+        {
+          title: '创建人',
+          ellipsis: true,
+          dataIndex: 'createNickName',
+          width: 100,
+        },
+        {
+          title: '创建时间',
+          ellipsis: true,
+          dataIndex: 'createTime',
+          width: 160,
+        },
+        {
+          title: 'RTK使用状态',
+          dataIndex: 'status',
+          ellipsis: true,
+          width: 120,
+          customRender: ({ record }) => {
+            return '正常';
+          },
+        },
+        {
+          title: '状态',
+          dataIndex: 'status',
+          width: 100,
+          // ifShow: getCheckPerm('recruit-publish'),
+          customRender: ({ record }) => {
+            if (!Reflect.has(record, 'pendingStatus')) {
+              record.pendingStatus = false;
+            }
+            return h(Switch, {
+              checked: record.status === 0,
+              checkedChildren: '正常',
+              unCheckedChildren: '禁用',
+              loading: false,
+              onChange: async (checked: boolean) => {
+                record.pendingStatus = true;
+                const status = checked ? 0 : 1;
+                Reflect.set(record, 'status', status);
+                await rtksaveOrEdit({ ...record, status: status });
+                createMessage.success('操作成功');
+                // reload()
+              },
+            });
+          },
+        },
+      ];
+      const searchForm: Partial<FormProps> = {
+        labelWidth: 100,
+        autoSubmitOnEnter: true,
+        schemas: [
+          {
+            field: 'cameraSn',
+            label: '相机Sn',
+            component: 'Input',
+            colProps: {
+              xl: 8,
+              xxl: 8,
+            },
+          },
+          {
+            field: 'rtkSnCode',
+            label: '板卡sn号',
+            component: 'Input',
+            colProps: {
+              xl: 8,
+              xxl: 8,
+            },
+          },
+          {
+            field: 'userName',
+            label: '用户名称',
+            component: 'Input',
+            colProps: {
+              xl: 8,
+              xxl: 8,
+            },
+          },
+          {
+            field: 'operator',
+            label: '运营商',
+            component: 'Input',
+            colProps: {
+              xl: 8,
+              xxl: 8,
+            },
+          },
+          {
+            field: 'sgRtkSn',
+            label: '深光rtk插件sn',
+            component: 'Input',
+            colProps: {
+              xl: 8,
+              xxl: 8,
+            },
+          },
+        ],
+      };
+      const [registerTable, { reload }] = useTable({
+        api: rtkInfoList,
+        title: 'rtk列表',
+        columns: columns,
+        useSearchForm: true,
+        showIndexColumn: true,
+        formConfig: searchForm,
+        showTableSetting: true,
+        fetchSetting: {
+          pageField: 'pageNum',
+          sizeField: 'pageSize',
+          listField: 'list',
+          totalField: 'total',
+        },
+        actionColumn: {
+          width: 160,
+          title: '操作',
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
+        },
+        rowKey: 'id',
+        canResize: false,
+      });
+      async function handleDelete(record) {
+        createConfirm({
+          iconType: 'warning',
+          title: () => h('span', '温馨提示'),
+          content: () => h('span', '确定要删除吗？'),
+          onOk: async () => {
+            await rtkdelOrEdit({ id: record.id });
+            reload();
+            createMessage.success(t('common.optSuccess'));
+          },
+        });
+      }
+      function handleCopy(str: string) {
+        copyTextToClipboard(str);
+        createMessage.success('复制成功');
+      }
+      function handleActive(record) {
+        createConfirm({
+          iconType: 'warning',
+          title: () => h('span', '温馨提示'),
+          content: () => h('span', `确定要${record.status ? '禁用' : '激活'}吗？`),
+          onOk: async () => {
+            await activation({ id: record.id, status: record.status ? 0 : 1 });
+            reload();
+            createMessage.success(t('common.optSuccess'));
+          },
+        });
+      }
+      function handleEdit(record = {}) {
+        openModal(true, {
+          ...record,
+          authorizeTime: `${record.authorizeTime || '10'}_${record.authorizeTimeUnit || '1'}`,
+        });
+      }
+      return {
+        registerTable,
+        handleCopy,
+        handleDelete,
+        reload,
+        register,
+        handleActive,
+        getCheckPerm,
+        handleEdit,
+      };
+    },
+  });
+</script>