11

src/views/parameter/EditModal.vue

@@ -0,0 +1,86 @@
+<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">
+        <template #text="{ model, field }">
+          {{ model[field]  }}
+        </template>
+        <template #img="{ model }">
+          <TableImg v-if="model.invoiceUrl" :size="200" :adaptations="true" :simpleShow="true" :imgList="[model.invoiceUrl]" />
+        </template>
+      </BasicForm>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, nextTick, onMounted, reactive } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { TableImg } from '/@/components/Table';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { InvoiceRegister, InvoiceDetail } from '/@/api/order';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { uploadApi } from '/@/api/product/index';
+  import { ResultEnum } from '/@/enums/httpEnum';
+  import { InvoiceSchemas } from './data'
+  const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm, TableImg },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['update', 'register'],
+    setup(props, { emit }) {
+      const fileFlow = reactive({
+        title: '新增设备类型',
+      })
+      const { createMessage } = useMessage();
+
+      const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
+        labelWidth: 120,
+        schemas:InvoiceSchemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+      async function onDataReceive(data) {
+        resetFields();
+        fileFlow.title = data.id ? '修改设备类型' : '新增设备类型';
+        setFieldsValue(data);
+      }
+      const handleSubmit = async () => {
+        const values = await validate();
+        await addDowm(values);
+        closeModal();
+        emit('update', true);
+      };
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
+      return {
+        register,
+        registerForm,
+        fileFlow,
+        handleVisibleChange,
+        handleSubmit,
+        addListFunc,
+        resetFields,
+        t,
+      };
+    },
+  });
+</script>

src/views/parameter/InvoiceModal.vue

@@ -0,0 +1,199 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="register"
+    title="开票登记"
+    :okText="okText"
+    @visible-change="handleVisibleChange"
+    @cancel="resetFields"
+    :confirmLoading="loading"
+    @ok="handleSubmit"
+  >
+    <div class="pt-2px pr-3px">
+      <BasicForm @register="registerForm">
+        <template #text="{ model, field }">
+          {{ model[field]  }}
+        </template>
+      </BasicForm>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, nextTick, onMounted, reactive, ref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { InvoiceRegister } from '/@/api/order';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { uploadApi } from '/@/api/product/index';
+  import { ResultEnum } from '/@/enums/httpEnum';
+
+  const { t } = useI18n();
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    emits: ['update', 'register'],
+    setup(props, { emit }) {
+      const fileFlow = reactive({
+        file:null,
+        type:2,//2-普通发票，3-专用发票
+      })
+      const okText = ref('发送')
+      const loading = ref(false)
+      const { createMessage } = useMessage();
+      const schemas: FormSchema[] = [
+          {
+            field: 'id',
+            component: 'Input',
+            show:false,
+            label: '发票编号',
+            required: true,
+          },
+          {
+            field: 'email',
+            component: 'Input',
+            label: '邮箱',
+            slot: 'text',
+            ifShow:fileFlow.type == 2,
+            componentProps: {
+              maxLength: 50,
+            },
+            colProps: {
+              span: 24,
+            },
+          },{
+            field: 'invoiceNum',
+            component: 'Input',
+            label: '发票编号',
+            required: true,
+            componentProps: {
+              maxLength: 50,
+            },
+            colProps: {
+              span: 24,
+            },
+          },{
+            field: 'file',
+            component: 'Upload',
+            label: '电子发票',
+            ifShow:fileFlow.type == 2,
+            required: true,
+            rules: [{ required: true, message: t('common.uploadMessge') }],
+            itemProps: {
+              validateTrigger: 'blur',
+            },
+            componentProps: {
+              api: uploadApi,
+              fileFlow:true,
+              maxNumber: 1,
+              maxSize: 1000,
+              accept: ['jpeg','jpg','png'],
+              afterFetch: function (data) {
+                console.log('url',data)
+                // Reflect.set(data, 'url', data.file);
+                fileFlow.file = data.file
+                return data;
+              },
+            },
+
+            colProps: {
+              span: 22,
+            },
+          },{
+            field: 'invoiceNum',
+            component: 'Input',
+            label: '发票编号',
+            required: true,
+            componentProps: {
+              maxLength: 50,
+            },
+            colProps: {
+              span: 24,
+            },
+          },{
+            field: 'shipNum',
+            component: 'Input',
+            ifShow:fileFlow.type == 3,
+            label: '快递单号',
+            componentProps: {
+              maxLength: 50,
+            },
+            required: true,
+            colProps: {
+              span: 24,
+            },
+          },
+      ];
+
+      const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
+        labelWidth: 120,
+        schemas:schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+      onMounted(() => {});
+      let addListFunc = () => {};
+      const [register, { closeModal }] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
+      function onDataReceive(data) {
+        resetFields();
+        fileFlow.type = data.type
+        setFieldsValue(data);
+        okText.value = fileFlow.type == 2?'发送':'确认'
+        updateSchema([
+          {field: 'shipNum',ifShow:fileFlow.type == 3,},
+          {field: 'email',ifShow:fileFlow.type == 2,},
+          {field: 'file',ifShow:fileFlow.type == 2,},
+        ])
+      }
+      const handleSubmit = async () => {
+        loading.value = true
+        try {
+          const params = await validate();
+          const apiData = {
+            data:fileFlow.type == 3?{
+              id:params.id,
+              invoiceNum:params.invoiceNum,
+              shipNum:params.shipNum,
+            }:{
+              id:params.id,
+              invoiceNum:params.invoiceNum,
+              file:fileFlow.file,
+            // file:params.file[0],
+            }
+          }
+          console.log('res', apiData,params);
+          await InvoiceRegister(apiData);
+          closeModal();
+          resetFields();
+          createMessage.success(t('common.optSuccess'));
+          emit('update');
+          loading.value = false
+        } catch (error) {
+          loading.value = false
+          console.log('not passing', error);
+        }
+      };
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
+      return {
+        register,
+        registerForm,
+        fileFlow,
+        handleVisibleChange,
+        handleSubmit,
+        addListFunc,
+        resetFields,
+        okText,
+        loading,
+        t,
+      };
+    },
+  });
+</script>

src/views/parameter/data.tsx

@@ -0,0 +1,222 @@
+import { Time } from '/@/components/Time';
+import { FormProps, BasicColumn } from '/@/components/Table';
+import { h } from 'vue';
+import { FormSchema } from '/@/components/Form/index';
+import { useI18n } from '/@/hooks/web/useI18n';
+const { t } = useI18n();
+
+export const columns: BasicColumn[] = [
+  {
+    title: 'camera_name',
+    dataIndex: 'camera_name',
+    ellipsis: false,
+    width: 100,
+  },
+  {
+    title: 'camera_type',
+    dataIndex: 'camera_type',
+    width: 80,
+  },
+  {
+    title: 'scene_source',
+    dataIndex: 'scene_source',
+    width: 80,
+  },
+  {
+    title: 'modelkind',
+    dataIndex: 'modelkind',
+    width: 80,
+  },
+  {
+    title: 'scene_resolution',
+    dataIndex: 'scene_resolution',
+    width: 50,
+  },
+  {
+    title: 'scene_from',
+    dataIndex: 'scene_from',
+    width: 100,
+  },
+  {
+    title: 'scene_kind',
+    dataIndex: 'scene_kind',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+  {
+    title: 'skybox_type',
+    dataIndex: 'skybox_type',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+  {
+    title: 'app_obj_split_type',
+    dataIndex: 'app_obj_split_type',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+  {
+    title: 'pc_obj_split_type',
+    dataIndex: 'pc_obj_split_type',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+  {
+    title: '场景码前缀',
+    dataIndex: 'scene_kind',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+  {
+    title: 'wifi前缀',
+    dataIndex: 'scene_kind',
+    // slots: { customRender: 'orderStatus' },
+    width: 100,
+  },
+];
+export const searchForm: Partial<FormProps> = {
+  labelWidth: 100,
+  schemas: [
+    {
+      field: 'orderSn',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        maxLength: 100,
+      },
+      colProps: {
+        xl: 6,
+        xxl: 6,
+      },
+    },
+  ],
+};
+export const InvoiceSchemas: FormSchema[] = [
+  {
+    field: 'id',
+    component: 'Input',
+    label: 'id',
+    ifShow: false,
+    required: true,
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'camera_name',
+    component: 'Input',
+    required: true,
+    label: 'camera_name',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'camera_type',
+    required: true,
+    component: 'Input',
+    label: 'camera_type',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'scene_source',
+    component: 'Input',
+    required: true,
+    label: 'scene_source',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'modelkind',
+    component: 'Input',
+    required: true,
+    label: 'modelkind',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'scene_resolution',
+    component: 'Input',
+    required: true,
+    label: 'scene_resolution',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'scene_from',
+    component: 'Input',
+    required: true,
+    label: 'scene_from',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'scene_kind',
+    component: 'Input',
+    required: true,
+    label: 'scene_kind',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'split_type',
+    component: 'Input',
+    required: true,
+    label: 'split_type',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'skybox_type',
+    component: 'Input',
+    required: true,
+    label: 'skybox_type',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'app_obj_split_type',
+    component: 'Input',
+    required: true,
+    label: 'app_obj_split_type',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'pc_obj_split_type',
+    component: 'Input',
+    required: true,
+    label: 'pc_obj_split_type',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'camera_name',
+    component: 'Input',
+    required: true,
+    label: '场景码前缀',
+    colProps: {
+      span: 18,
+    },
+  },
+  {
+    field: 'camera_name',
+    component: 'Input',
+    required: true,
+    label: 'wifi前缀',
+    colProps: {
+      span: 18,
+    },
+  },
+];

src/views/parameter/index.vue

@@ -0,0 +1,126 @@
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleEdit" v-if="getCheckPerm('invoice-export')">
+          新增设备类型</a-button
+        >
+      </template>
+      <template #action="{ record }">
+        <TableAction
+          stopButtonPropagation
+          :actions="[
+            {
+              label: '编辑',
+              //ifShow: getCheckPerm('account-equityEdit'),
+              onClick: handleEdit.bind(null, record),
+            },
+            {
+              label: '删除',
+              color: 'error',
+              //ifShow: getCheckPerm('account-equityDelete'),
+              onClick: handleDelete.bind(null, record),
+            },
+          ]"
+        />
+      </template>
+    </BasicTable>
+    <EditModal @register="registerEditModal" @update="reload" />
+  </div>
+</template>
+<script lang="ts">
+  import { defineComponent, h, reactive } from 'vue';
+  import { BasicTable, useTable, TableAction, TableImg } from '/@/components/Table';
+  import { PageWrapper } from '/@/components/Page';
+  import { useModal } from '/@/components/Modal';
+  import { Descriptions } from 'ant-design-vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { InvoiceList, InvoiceExport } from '/@/api/order';
+  import { downloadByData } from '/@/utils/file/download';
+  import { searchForm, columns } from './data';
+  import EditModal from './EditModal.vue';
+  import { usePermissionStore } from '/@/store/modules/permission';
+  interface apiDataParam {
+    orderSn?: string;
+    payTimeStart?: string;
+    payTimeEnd?: string;
+    invoiceTimeStart?: string;
+    invoiceTimeEnd?: string;
+    orderBy?: string;
+    sortBy?: string;
+  }
+  export default defineComponent({
+    components: {
+      EditModal,
+      BasicTable,
+      TableAction,
+      PageWrapper,
+      TableImg,
+      [Descriptions.name]: Descriptions,
+      [Descriptions.Item.name]: Descriptions.Item,
+    },
+    setup() {
+      const { t } = useI18n();
+      const permissionStore = usePermissionStore();
+      const { getCheckPerm } = permissionStore;
+      const apiData = reactive<apiDataParam>({
+        orderSn: '',
+        payTimeStart: '',
+        payTimeEnd: '',
+        invoiceTimeStart: '',
+        invoiceTimeEnd: '',
+        orderBy: '',
+        sortBy: '',
+      });
+      const { createMessage, createConfirm } = useMessage();
+      const [registerEditModal, { openModal: openEditModal }] = useModal();
+      const [registerTable, { reload }] = useTable({
+        api: InvoiceList,
+        columns: columns,
+        useSearchForm: true,
+        formConfig: searchForm,
+        showTableSetting: true,
+        showIndexColumn: false,
+        rowKey: 'id',
+        fetchSetting: {
+          pageField: 'pageNum',
+          sizeField: 'pageSize',
+          listField: 'list',
+          totalField: 'total',
+        },
+        actionColumn: {
+          width: 100,
+          title: '操作',
+          fixed: 'right',
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
+        },
+        canResize: false,
+      });
+      function handleDelete(record: Recordable) {
+        createConfirm({
+          iconType: 'warning',
+          title: () => h('span', '温馨提示'),
+          content: () => h('span', '确定要删除授权吗？'),
+          onOk: async () => {
+            await authorizeInstalldelete({ id: record.id });
+            reload();
+            createMessage.success(t('common.optSuccess'));
+          },
+        });
+      }
+      function handleEdit(record: Recordable) {
+        openEditModal(true, record);
+      }
+      return {
+        registerTable,
+        handleDelete,
+        registerEditModal,
+        handleEdit,
+        reload,
+        getCheckPerm,
+      };
+    },
+  });
+</script>