代码优化

src/api/platform/system/controller/boxcard.ts

@@ -1,4 +1,4 @@
-import {BoxCardParams, BoxCardListItem, BoxCardListGetListResult} from '/@/api/platform/system/entity/boxCardModel'
+import {BoxCardParams, BoxCardListItem, BoxCardListGetListResult} from '/@/api/platform/system/entity/boxCardModel';
 import { defHttp } from '/@/utils/http/axios';
 import {isDef} from '/@/utils/is';
 

src/api/platform/system/controller/doctor.ts

@@ -2,29 +2,32 @@ import {DoctorParams,DoctorItem,DoctorItemListResult} from '/@/api/platform/syst
 import { defHttp } from '/@/utils/http/axios';
 import {isDef} from '/@/utils/is';
 
-const prefix = '/system_proxy/system';
+
+
 
 enum Api {
-    QueryById = '/doctor/query',
+    QueryById = '/system_proxy/system/doctor/query',
-    List = '/doctor/list',
+    list = '/system_proxy/system/doctor/list',
-    Add = '/doctor/add',
+    add = '/system_proxy/system/doctor/add',
-    Update = '/doctor/update',
+    edit = '/system_proxy/system/doctor/update',
-    Remove = '/doctor/remove'
+    del = '/system_proxy/system/doctor/remove',
+    get = '/system_proxy/system/doctor'
 }
 
 export const queryById = (params: { id: String }) =>
-    defHttp.get<DoctorItem>({url: prefix + Api.QueryById + `/${params.id}`});
+    defHttp.get<DoctorItem>({url: Api.QueryById + `/${params.id}`});
+
+/** 查询客户端列表 */
+export const listDoctor = (params?: Partial<DoctorItem>) => defHttp.get<DoctorItemListResult>({ url: Api.list, params }, { isReturnResultResponse: true });
+
+/** 新增客户端 */
+export const addDoctor = (params: Partial<DoctorParams>) => defHttp.post({ url: Api.add, data: params });
 
-export const list = (params: DoctorParams) =>
+/** 修改客户端 */
-    defHttp.get<DoctorItemListResult>({url: prefix + Api.List, params});
+export const editDoctor = (params: Partial<DoctorParams>) => defHttp.put({ url: Api.edit, data: params });
 
-export const set = (params: DoctorItem) => {
+/** 查询客户端详细 */
-    if (isDef(params.id)){
+export const getDoctor = (id: string) => defHttp.get<DoctorItem>({ url: `${Api.get}/${id}` });
-        defHttp.put<DoctorItem>({url: prefix + Api.Update, params});
-    }else {
-        defHttp.post<DoctorItem>({url: prefix + Api.Add, params});
-    }
-};
 
-export const remove = (params: {ids: String}) =>
+/** 删除客户端 */
-    defHttp.delete<boolean>({url: prefix + Api.Remove + `/${params.ids}`});
+export const delDoctor = (id: string) => defHttp.delete({ url: `${Api.del}/${id}` });

src/views/equip/boxcard/BoxCardModal.vue

@@ -0,0 +1,57 @@
+<template>
+  <BasicModal v-bind="$attrs"
+              :title="getTitle"
+              @register="registerModal"
+              @ok="handleSubmit"
+  >
+    <BasicForm @register="registerForm"/>
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+import {ref, computed, unref} from 'vue';
+import {BasicModal, useModalInner} from '/@/components/Modal';
+import {cardFormSchema} from './boxcard.data';
+import {BasicForm, useForm} from '/@/components/Form/index';
+import {set} from '/@/api/platform/system/controller/boxcard';
+const isUpdate = ref(true);
+// 定义emit
+const emit = defineEmits(['success', 'register']);
+/**
+ * 表单
+ */
+const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  labelWidth: 100,
+  schemas: cardFormSchema,
+  showActionButtonGroup: false,
+  actionColOptions: {
+    span: 23,
+  },
+});
+/**
+ * 表单参数
+ */
+const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  resetFields();
+  setModalProps({confirmLoading: false});
+  isUpdate.value = !!data?.isUpdate;
+  if (unref(isUpdate)) {
+    setFieldsValue({
+      ...data.record,
+    });
+  }
+});
+//表单标题
+const getTitle = computed(() => (!unref(isUpdate) ? '新增网卡' : '编辑网卡'));
+async function handleSubmit() {
+  try {
+    const values = await validate();
+    setModalProps({confirmLoading: true});
+    await set(values);//保存网卡
+    closeModal();
+    emit('success');
+  } finally {
+    setModalProps({confirmLoading: false});
+  }
+}
+</script>

src/views/equip/boxcard/boxcard.data.ts

@@ -0,0 +1,160 @@
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import {h} from 'vue';
+import {Tag} from 'ant-design-vue';
+
+
+export const columns: BasicColumn[] = [
+    {
+        title: 'ID',
+        dataIndex: 'id',
+        width: 120,
+    },
+    {
+        title: 'iccid',
+        dataIndex: 'iccid',
+        width: 120,
+    },
+    {
+        title: '卡号',
+        dataIndex: 'card',
+        width: 120,
+    },
+    {
+        title: '网卡厂商',
+        dataIndex: 'company',
+        width: 120,
+        customRender: ({ record }) => {
+            const com = record.company;
+            switch (com) {
+                case '1': return '中国移动';
+                case '2': return '中国联通';
+                case '3': return '中国电信';
+                default: return '未知厂商';
+            }
+        }
+    },
+    {
+        title: '卡是否已使用',
+        dataIndex: 'isUsed',
+        width: 120,
+    },
+    {
+        title: '状态',
+        dataIndex: 'status',
+        width: 100,
+        customRender: ({ record }) => {
+            const status = record.status;
+            const enable = status === '0';
+            const color = enable ? 'green' : 'red';
+            const text = enable ? '启用' : '禁用';
+            return h(Tag, { color: color }, () => text);
+        },
+    },
+    {
+        title: '创建人',
+        dataIndex: 'createByName',
+        width: 180,
+    },
+    {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        width: 180,
+    }
+];
+
+export const searchFormSchema: FormSchema[] = [
+    {
+        field: 'iccid',
+        label: 'iccid',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入唯一标识iccid',
+        },
+        colProps: { span: 5 },
+    },
+    {
+        field: 'card',
+        label: '卡号',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入卡号',
+        },
+        colProps: { span: 5 },
+    },
+    {
+        field: 'company',
+        label: '网卡厂商',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入网卡厂商',
+        },
+        colProps: { span: 4 },
+    },
+    {
+        field: 'beginTime',
+        label: '起始时间',
+        component: 'DatePicker',
+        colProps: { span: 5 },
+    },
+    {
+        field: 'endTime',
+        label: '截止时间',
+        component: 'DatePicker',
+        colProps: { span: 5 },
+    },
+];
+
+export const cardFormSchema: FormSchema[] = [
+    {
+        field: 'id',
+        label: 'ID',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'iccid',
+        label: 'iccid',
+        component: 'Input',
+        helpMessage: ['唯一识别号'],
+        required: true
+    },
+    {
+        field: 'card',
+        label: '卡号',
+        component: 'Input',
+        required: false,
+    },
+    {
+        field: 'company',
+        label: '网卡厂商',
+        component: 'Select',
+        required: true,
+        componentProps: {
+            options: [
+                { label: '中国移动', value: '1' },
+                { label: '中国联通', value: '2' },
+                { label: '中国电信', value: '3' },
+                { label: '未知厂商', value: ''||undefined||null }
+            ],
+
+        }
+    },
+    {
+        field: 'status',
+        label: '状态',
+        component: 'RadioButtonGroup',
+        defaultValue: '0',
+        componentProps: {
+            options: [
+                { label: '启用', value: '0' },
+                { label: '禁用', value: '1' },
+            ],
+        },
+    },
+    {
+        label: '备注',
+        field: 'remarks',
+        component: 'InputTextArea',
+    }
+];

src/views/equip/boxcard/index.vue

@@ -0,0 +1,94 @@
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleCreate">新增网卡</a-button>
+      </template>
+      <template #action="{ record }">
+        <TableAction
+          :actions="[
+            {
+              icon: 'clarity:note-edit-line',
+              onClick: handleEdit.bind(null, record),
+            },
+            {
+              icon: 'ant-design:delete-outlined',
+              color: 'error',
+              popConfirm: {
+                title: '是否确认删除',
+                confirm: handleDelete.bind(null, record),
+              },
+            },
+          ]"
+        />
+      </template>
+    </BasicTable>
+
+    <BoxCardModal @register="registerModal" @success="handleSuccess"/>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {BasicTable, useTable, TableAction} from '/@/components/Table';
+import {useModal} from '/@/components/Modal';
+import BoxCardModal from './BoxCardModal.vue';
+import {columns, searchFormSchema} from './boxcard.data';
+import {useMessage} from '/@/hooks/web/useMessage';
+import {cardList, remove} from '/@/api/platform/system/controller/boxcard';
+const {createMessage} = useMessage();
+const [registerModal, {openModal}] = useModal();
+const [registerTable, {reload}] = useTable({
+  title: '网卡列表',
+  api: cardList,
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema,
+  },
+  pagination: true,
+  striped: true,
+  useSearchForm: true,
+  showTableSetting: true,
+  bordered: true,
+  showIndexColumn: true,
+  canResize: false,
+  actionColumn: {
+    width: 80,
+    title: '操作',
+    dataIndex: 'action',
+    slots: {customRender: 'action'},
+    fixed: undefined,
+  },
+});
+/**
+ * 创建菜单
+ */
+function handleCreate() {
+  openModal(true, {
+    isUpdate: false,
+  });
+}
+/**
+ * 编辑菜单
+ */
+function handleEdit(record: Recordable) {
+  openModal(true, {
+    record,
+    isUpdate: true,
+  });
+}
+/**
+ * 删除菜单
+ */
+async function handleDelete(record: Recordable) {
+  await remove({ids: record.id});
+  createMessage.success('删除成功!');
+  handleSuccess();
+}
+/**
+ * 成功后重载表格
+ */
+function handleSuccess() {
+  reload();
+}
+</script>

src/views/institution/address/address.data.ts

@@ -8,7 +8,7 @@ import {Tag} from 'ant-design-vue';
 export const columns: BasicColumn[] = [
     {
         title: '区域ID',
-        dataIndex: 'id',
+        dataIndex: 'code',
         width: 50,
     },
     {
@@ -100,7 +100,7 @@ export const addressFormSchema: FormSchema[] = [
     }
     },
     {
-        field: 'id',
+        field: 'code',
         label: '区域ID',
         component: 'Input',
         helpMessage: ['区域ID'],

src/views/institution/doctor/DoctorModal.vue

@@ -1,52 +1,79 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
+  <BasicModal v-bind="$attrs"
+              width="720px"
+              @register="registerModal"
+              @ok="handleSubmit"
+  >
     <BasicForm @register="registerForm"/>
   </BasicModal>
 </template>
-
 <script lang="ts" setup>
-import {ref, computed, unref} from 'vue';
+  /**
-import {BasicModal, useModalInner} from '/@/components/Modal';
+   * 提供模板规范代码参考,请尽量保证编写代码风格跟模板规范代码一致
-import {doctorFormSchema} from './doctor.data';
+   * 采用vben-动态表格表单封装组件编写,采用 setup 写法
-import {BasicForm, useForm} from '/@/components/Form';
+   * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
-import {set} from '/@/api/platform/system/controller/doctor';
+   * author entfrm开发团队-王翔
-const isUpdate = ref(true);
-// 定义emit
-const emit = defineEmits(['success', 'register']);
-/**
- * 表单
    */
-const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  import { ref, unref } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { doctorFormSchema } from './doctor.data';
+  import {addDoctor, delDoctor,getDoctor,editDoctor} from '/@/api/platform/system/controller/doctor';
+  import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal';
+  import { isEmpty } from '/@/utils/is';
+
+  /** 通用变量统一声明区域 */
+  const tag = ref<Nullable<string>>('');
+  /** https://v3.cn.vuejs.org/api/options-data.html#emits */
+  const emit = defineEmits(['success', 'register']);
+  const [registerForm, { resetFields, setFieldsValue, validate, clearValidate, updateSchema }] = useForm({
     labelWidth: 100,
     schemas: doctorFormSchema,
     showActionButtonGroup: false,
-  actionColOptions: {
+    baseColProps: { span: 24 }
-    span: 23,
+  });
-  },
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data: WindowInnerData = { _tag: '' }) => {
-});
+    // 处理清除脏数据
-/**
+    await resetFields();
- * 表单参数
+    await clearValidate();
- */
+    // 处理设置数据
-const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+    tag.value = data._tag;
-  resetFields();
+    const id = data.record?.id;
-  setModalProps({confirmLoading: false});
+    const props: Partial<ModalProps> = { confirmLoading: false };
-  isUpdate.value = !!data?.isUpdate;
+    // 采用tag标签区分操作
-  console.log(data.record);
+    switch (unref(tag)) {
-  if (unref(isUpdate)) {
+      case 'add':
-    setFieldsValue(data.record);
+        props.title = '医生';
+        break;
+      case 'edit':
+        props.title = '编辑医生';
+        await setFieldsValue(await getDoctor(id));
+        break;
     }
-})
+    // 尾部:设置处理后的最终配置数据
-//表单标题
+    setModalProps(props);
-const getTitle = computed(() => (!unref(isUpdate) ? '新增医生' : '编辑医生'));
+  });
-async function handleSubmit() {
+
+  /** 处理弹出框提交 */
+  async function handleSubmit() {
     try {
-    const values = await validate();
+      // 提取验证数据
-    setModalProps({confirmLoading: true});
+      const formData = await validate();
-    await set(values);//保存网卡
+      // 处理提交之前逻辑
+      setModalProps({ confirmLoading: true });
+      // 采用tag标签区分操作
+      switch (unref(tag)) {
+        case 'add':
+          await addDoctor(formData);
+          break;
+        case 'edit':
+          await editDoctor(formData);
+          break;
+      }
+      // 处理提交完成之后逻辑
       closeModal();
       emit('success');
     } finally {
-    setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
+    }
   }
-}
 </script>

src/views/institution/doctor/index.vue

@@ -1,94 +1,136 @@
 <template>
   <div>
-    <BasicTable @register="registerTable">
+    <BasicTable @register="registerTable"
+                @selection-change="handleSelectionChange"
+    >
       <template #toolbar>
-        <a-button type="primary" @click="handleCreate">新增医生</a-button>
+        <a-button
+          type="primary"
+          @click="handleAdd()"
+        >新增医生</a-button>
+        <a-button type="primary"
+                  :disabled="state.single"
+                  @click="handleEdit()"
+        >修改医生</a-button>
+        <a-button type="primary"
+                  :disabled="state.multiple"
+                  @click="handleDel()"
+        >删除医生</a-button>
       </template>
       <template #action="{ record }">
-        <TableAction
+        <TableAction :actions="[
-            :actions="[
           {
-              icon: 'clarity:note-edit-line',
+            label: '编辑',
-              onClick: handleEdit.bind(null, record),
+            icon: 'fa6-regular:pen-to-square',
+            onClick: handleEdit.bind(null, record)
           },
           {
+            label: '删除',
             icon: 'ant-design:delete-outlined',
             color: 'error',
-              popConfirm: {
+            onClick: handleDel.bind(null, record)
-                title: '是否确认删除',
+          }]"
-                confirm: handleDelete.bind(null, record),
-              },
-            },
-          ]"
         />
       </template>
     </BasicTable>
-
+    <!--弹出窗体区域-->
-    <DoctorModal @register="registerModal" @success="handleSuccess"></DoctorModal>
+    <DoctorModal @register="registerModal" @success="handleRefreshTable"/>
   </div>
 </template>
 
 <script lang="ts" setup>
-import {BasicTable, useTable, TableAction} from '/@/components/Table';
+  /**
-import {useModal} from '/@/components/Modal';
+   * 提供模板规范代码参考,请尽量保证编写代码风格跟模板规范代码一致
-import DoctorModal from './DoctorModal.vue';
+   * 采用vben-动态表格表单封装组件编写,采用 setup 写法
-import {columns, searchFormSchema} from './doctor.data'
+   * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
-import {useMessage} from '/@/hooks/web/useMessage';
+   * author entfrm开发团队-王翔
-import {list, remove} from '/@/api/platform/system/controller/doctor';
+   */
-const {createMessage} = useMessage();
+  import { reactive, toRaw } from 'vue';
-const [registerModal, {openModal}] = useModal();
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
-const [registerTable, {reload}] = useTable({
+  import {listDoctor, delDoctor} from '/@/api/platform/system/controller/doctor';
+  import { useModal } from '/@/components/Modal';
+  import { columns, searchFormSchema } from './doctor.data';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import DoctorModal from './DoctorModal.vue';
+
+  /** 类型规范统一声明定义区域 */
+  interface TableState {
+    single: boolean;
+    multiple: boolean;
+  }
+
+  /** 通用变量统一声明区域 */
+  const state = reactive<TableState>({
+    // 非单个禁用
+    single: true,
+    // 非多个禁用
+    multiple: true
+  });
+  const { createConfirm, createMessage } = useMessage();
+  const [registerModal, { openModal }] = useModal();
+  const [registerTable, { reload, clearSelectedRowKeys, getSelectRowKeys }] = useTable({
     title: '医生列表',
-  api: list,
+    api: listDoctor,
+    rowKey: 'id',
     columns,
     formConfig: {
       labelWidth: 120,
       schemas: searchFormSchema,
+      autoSubmitOnEnter: true,
+      fieldMapToTime: [['dateRange', ['beginTime', 'endTime'], 'YYYY-MM-DD']]
     },
-  pagination: true,
+    rowSelection: { type: 'checkbox' },
-  striped: true,
     useSearchForm: true,
     showTableSetting: true,
     bordered: true,
-  showIndexColumn: true,
+    clickToRowSelect: false,
-  canResize: false,
+    showIndexColumn: false,
     actionColumn: {
-    width: 80,
+      width: 220,
       title: '操作',
       dataIndex: 'action',
-    slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
-    fixed: undefined,
+      fixed: false
     },
-});
+    handleSearchInfoFn: () => clearSelectedRowKeys()
-/**
- * 创建菜单
- */
-function handleCreate() {
-  openModal(true, {
-    isUpdate: false,
-  });
-}
-/**
- * 编辑菜单
- */
-function handleEdit(record: Recordable) {
-  openModal(true, {
-    record,
-    isUpdate: true,
   });
-}
+
-/**
+  /** 处理多选框选中数据 */
- * 删除菜单
+  function handleSelectionChange(selection?: Recordable) {
- */
+    const rowSelection = toRaw(selection?.keys) || [];
-async function handleDelete(record: Recordable) {
+    state.single = rowSelection.length != 1;
-  await remove({ids: record.id});
+    state.multiple = !rowSelection.length;
+  }
+
+  /** 新增按钮操作,行内新增与工具栏局域新增通用 */
+  function handleAdd() {
+    openModal(true,{ _tag: 'add' });
+  }
+
+  /** 编辑按钮操作,行内编辑 */
+  function handleEdit(record?: Recordable) {
+    record = record || { id: getSelectRowKeys() };
+    openModal(true, { _tag: 'edit', record });
+  }
+
+  /** 删除按钮操作,行内删除 */
+  async function handleDel(record?: Recordable) {
+    const id = record?.id || getSelectRowKeys();
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: `是否确认删除医生编号为${id}医生吗?`,
+      onOk: async () => {
+        await delDoctor(id);
         createMessage.success('删除成功!');
-  handleSuccess();
+        handleRefreshTable();
-}
+      }
-/**
+    });
- * 成功后重载表格
+  }
- */
+
-function handleSuccess() {
+  /** 处理表格刷新 */
+  function handleRefreshTable() {
+    clearSelectedRowKeys();
     reload();
-}
+  }
 </script>

src/views/institution/hospital/HospitalModal.vue

@@ -1,8 +1,9 @@
 <template>
   <BasicModal v-bind="$attrs"
-:title="getTitle"
+              :title="getTitle"
-@register="registerModal"
+              @register="registerModal"
-              @ok="handleSubmit">
+              @ok="handleSubmit"
+  >
     <BasicForm @register="registerForm"/>
   </BasicModal>
 </template>
@@ -45,7 +46,7 @@ const [registerModal, {setModalProps, closeModal}] = useModalInner( (data) => {
       ...data.record,
     });
   }
-})
+});
 //表单标题
 const getTitle = computed(() => (!unref(isUpdate) ? '新增医院' : '编辑医院'));
 async function handleSubmit() {

src/views/institution/hospital/hospital.data.ts

@@ -1,9 +1,8 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
-import {h} from "vue";
+import {h} from 'vue';
-import {Tag} from "ant-design-vue";
+import {Tag} from 'ant-design-vue';
-import {list as addressList} from "/@/api/platform/system/controller/address";
+import {list as institutionList} from '/@/api/platform/system/controller/institution';
-import {list as institutionList} from "/@/api/platform/system/controller/institution"
 
 
 export const columns: BasicColumn[] = [
@@ -215,7 +214,7 @@ export const hospitalFormSchema: FormSchema[] = [
         label: '关联机构',
         component: 'ApiSelect',
         componentProps: {
-            mode: "multiple",
+            mode: 'multiple',
             resultField: 'list',
             labelField: 'name',
             valueField: 'id',

src/views/institution/hospital/index.vue

@@ -24,7 +24,7 @@
       </template>
     </BasicTable>
 
-    <HospitalModal @register="registerModal" @success="handleSuccess"></HospitalModal>
+    <HospitalModal @register="registerModal" @success="handleSuccess"/>
   </div>
 </template>
 
@@ -32,7 +32,7 @@
 import {BasicTable, useTable, TableAction} from '/@/components/Table';
 import {useModal} from '/@/components/Modal';
 import HospitalModal from './HospitalModal.vue';
-import {columns, searchFormSchema} from './hospital.data'
+import {columns, searchFormSchema} from './hospital.data';
 import {useMessage} from '/@/hooks/web/useMessage';
 import {list, remove} from '/@/api/platform/system/controller/hospital';
 const {createMessage} = useMessage();

src/views/institution/institution/InstitutionModal.vue

@@ -1,5 +1,9 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
+  <BasicModal v-bind="$attrs"
+              :title="getTitle"
+              @register="registerModal"
+              @ok="handleSubmit"
+  >
     <BasicForm @register="registerForm"/>
   </BasicModal>
 </template>
@@ -7,9 +11,9 @@
 <script lang="ts" setup>
 import {ref, computed, unref} from 'vue';
 import {BasicModal, useModalInner} from '/@/components/Modal';
-import {institutionFormSchema} from './institution.data'
+import {institutionFormSchema} from './institution.data';
 import {BasicForm, useForm} from '/@/components/Form';
-import {set} from '/@/api/platform/system/controller/institution'
+import {set} from '/@/api/platform/system/controller/institution';
 const isUpdate = ref(true);
 // 定义emit
 const emit = defineEmits(['success', 'register']);
@@ -36,7 +40,7 @@ const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data)
       ...data.record,
     });
   }
-})
+});
 //表单标题
 const getTitle = computed(() => (!unref(isUpdate) ? '新增机构' : '编辑机构'));
 async function handleSubmit() {

src/views/institution/institution/index.vue

@@ -24,7 +24,7 @@
       </template>
     </BasicTable>
 
-    <BoxCardModal @register="registerModal" @success="handleSuccess"></BoxCardModal>
+    <BoxCardModal @register="registerModal" @success="handleSuccess"/>
   </div>
 </template>
 
@@ -32,7 +32,7 @@
 import {BasicTable, useTable, TableAction} from '/@/components/Table';
 import {useModal} from '/@/components/Modal';
 import BoxCardModal from './InstitutionModal.vue';
-import {columns, searchFormSchema} from './institution.data'
+import {columns, searchFormSchema} from './institution.data';
 import {useMessage} from '/@/hooks/web/useMessage';
 import {list, remove} from '/@/api/platform/system/controller/institution';
 const {createMessage} = useMessage();

src/views/institution/institution/institution.data.ts

@@ -1,8 +1,7 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
-import {h} from "vue";
+import {h} from 'vue';
-import {Tag} from "ant-design-vue";
+import {Tag} from 'ant-design-vue';
-import {list as addressList} from "/@/api/platform/system/controller/address";
 
 
 export const columns: BasicColumn[] = [
@@ -94,25 +93,24 @@ export const columns: BasicColumn[] = [
 export const searchFormSchema: FormSchema[] = [
     {
         field: 'name',
-        label: '医院名称',
+        label: '机构名称' ,
         component: 'Input',
         componentProps: {
-            placeholder: '请输入医院名称',
+            placeholder: '请输入机构名称',
         },
         colProps: { span: 5 },
     },
     {
-        field: 'beginTime',
+        field: 'dateRange',
-        label: '起始时间',
+        label: '创建时间',
-        component: 'DatePicker',
+        component: 'RangePicker',
-        colProps: { span: 5 },
+        componentProps: {
-    },
+            style: { width:'100%' },
-    {
+            valueFormat: 'YYYY-MM-DD',
-        field: 'endTime',
+            placeholder: ['开始日期','结束日期']
-        label: '截止时间',
-        component: 'DatePicker',
-        colProps: { span: 5 },
         },
+        colProps: { span: 8 }
+    }
 ];
 
 export const institutionFormSchema: FormSchema[] = [
@@ -152,7 +150,17 @@ export const institutionFormSchema: FormSchema[] = [
         field: 'contactsTel',
         label: '联系人电话',
         component: 'Input',
+
+        rules: [
+            {
+                pattern: new RegExp('^1[3|4|5|6|7|8|9][0-9]\\d{8}$'),
+                message: '请输入正确的手机号',
+                validateTrigger: 'change',
                 required: true
+            }
+        ],
+
+
     },
     {
         field: 'contactsTitle',

src/views/institution/office/OfficeModal.vue

@@ -1,5 +1,9 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
+  <BasicModal v-bind="$attrs"
+              :title="getTitle"
+              @register="registerModal"
+              @ok="handleSubmit"
+  >
     <BasicForm @register="registerForm"/>
   </BasicModal>
 </template>
@@ -36,7 +40,7 @@ const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data)
       ...data.record,
     });
   }
-})
+});
 //表单标题
 const getTitle = computed(() => (!unref(isUpdate) ? '新增科室' : '编辑科室'));
 async function handleSubmit() {

src/views/institution/office/index.vue

@@ -24,7 +24,7 @@
       </template>
     </BasicTable>
 
-    <OfficeModal @register="registerModal" @success="handleSuccess"></OfficeModal>
+    <OfficeModal @register="registerModal" @success="handleSuccess"/>
   </div>
 </template>
 
@@ -32,7 +32,7 @@
 import {BasicTable, useTable, TableAction} from '/@/components/Table';
 import {useModal} from '/@/components/Modal';
 import OfficeModal from './OfficeModal.vue';
-import {columns, searchFormSchema} from './office.data'
+import {columns, searchFormSchema} from './office.data';
 import {useMessage} from '/@/hooks/web/useMessage';
 import {list, remove} from '/@/api/platform/system/controller/office';
 const {createMessage} = useMessage();
@@ -64,6 +64,7 @@ const [registerTable, {reload}] = useTable({
  * 创建菜单
  */
 function handleCreate() {
+  debugger;
   openModal(true, {
     isUpdate: false,
   });

src/views/institution/office/office.data.ts

@@ -1,9 +1,9 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
-import {h} from "vue";
+import {h} from 'vue';
-import {Tag} from "ant-design-vue";
+import {Tag} from 'ant-design-vue';
-import { list as hospitalList } from "/@/api/platform/system/controller/hospital";
+import { list as hospitalList } from '/@/api/platform/system/controller/hospital';
-import { list as institutionList } from "/@/api/platform/system/controller/institution";
+import { list as institutionList } from '/@/api/platform/system/controller/institution';
 
 
 export const columns: BasicColumn[] = [
@@ -149,7 +149,7 @@ export const officeFormSchema: FormSchema[] = [
                 labelField: 'name',
                 valueField: 'id',
                 api: dataApi
-            }
+            };
         },
     },
     {

src/views/system/area/AreaModal.vue

@@ -1,6 +1,10 @@
 <template>
-	<BasicModal v-bind="$attrs" width="720px" @ok="handleSubmit" @register="registerModal">
+  <BasicModal v-bind="$attrs"
-		<BasicForm @register="registerForm" />
+              width="720px"
+              @ok="handleSubmit"
+              @register="registerModal"
+  >
+    <BasicForm @register="registerForm"/>
   </BasicModal>
 </template>
 <script lang="ts" setup>
@@ -10,75 +14,75 @@
  * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
  * author entfrm开发团队-王翔
  */
-import { ref, unref } from 'vue'
+import { ref, unref } from 'vue';
-import { BasicForm, useForm } from '/@/components/Form/index'
+import { BasicForm, useForm } from '/@/components/Form/index';
-import { formSchema } from './area.data'
+import { formSchema } from './area.data';
-import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal'
+import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal';
-import { listArea, addArea, editArea, getArea } from '/@/api/platform/system/controller/area'
+import { listArea, addArea, editArea, getArea } from '/@/api/platform/system/controller/area';
-import { listToTree } from '/@/utils/helper/treeHelper'
+import { listToTree } from '/@/utils/helper/treeHelper';
 
 /** 通用变量统一声明区域 */
-const tag = ref<Nullable<string>>('')
+const tag = ref<Nullable<string>>('');
 /** https://v3.cn.vuejs.org/api/options-data.html#emits */
-const emit = defineEmits(['success', 'register'])
+const emit = defineEmits(['success', 'register']);
 const [registerForm, { resetFields, setFieldsValue, updateSchema, validate, clearValidate }] = useForm({
 	labelWidth: 100,
 	schemas: formSchema,
 	showActionButtonGroup: false,
 	baseColProps: { span: 24 }
-})
+});
 const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data: WindowInnerData = { _tag: '' }) => {
 	// 处理清除脏数据
-	await resetFields()
+	await resetFields();
-	await clearValidate()
+	await clearValidate();
 	// 处理设置数据
-	tag.value = data._tag
+	tag.value = data._tag;
-	const topArea = { areaId: '0', name: '顶级区域', children: [] }
+	const topArea = { areaId: '0', name: '顶级区域', children: [] };
-	topArea.children = listToTree(await listArea())
+	topArea.children = listToTree(await listArea());
 	await updateSchema({
 		field: 'parentId',
 		componentProps: {
 			treeData: [topArea]
 		}
-	})
+	});
-	const areaId = data.record?.areaId
+	const areaId = data.record?.areaId;
-	const props: Partial<ModalProps> = { confirmLoading: false }
+	const props: Partial<ModalProps> = { confirmLoading: false };
 	// 采用tag标签区分操作
 	switch (unref(tag)) {
 		case 'add':
-			props.title = '新增区域'
+			props.title = '新增区域';
-			areaId && (await setFieldsValue({ parentId: areaId }))
+			areaId && (await setFieldsValue({ parentId: areaId }));
-			break
+			break;
 		case 'edit':
-			props.title = '编辑区域'
+			props.title = '编辑区域';
-			await setFieldsValue(await getArea(areaId))
+			await setFieldsValue(await getArea(areaId));
-			break
+			break;
 	}
 	// 尾部:设置处理后的最终配置数据
-	setModalProps(props)
+	setModalProps(props);
-})
+});
 
 /** 处理弹出框提交 */
 async function handleSubmit() {
 	try {
 		// 提取验证数据
-		const formData = await validate()
+		const formData = await validate();
 		// 处理提交之前逻辑
-		setModalProps({ confirmLoading: true })
+		setModalProps({ confirmLoading: true });
 		// 采用tag标签区分操作
 		switch (unref(tag)) {
 			case 'add':
-				await addArea(formData)
+				await addArea(formData);
-				break
+				break;
 			case 'edit':
-				await editArea(formData)
+				await editArea(formData);
-				break
+				break;
 		}
 		// 处理提交完成之后逻辑
-		closeModal()
+		closeModal();
-		emit('success')
+		emit('success');
 	} finally {
-		setModalProps({ confirmLoading: false })
+		setModalProps({ confirmLoading: false });
 	}
 }
 </script>

src/views/system/dept/index.vue

@@ -35,7 +35,7 @@
         />
       </template>
     </BasicTable>
-		<DeptModal @register="registerModal" @success="handleRefreshTable" />
+    <DeptModal @register="registerModal" @success="handleRefreshTable"/>
   </div>
 </template>
 <script lang="ts" setup>
@@ -45,17 +45,17 @@
  * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
  * author entfrm开发团队-王翔
  */
-import { BasicTable, useTable, TableAction } from '/@/components/Table'
+import { BasicTable, useTable, TableAction } from '/@/components/Table';
-import { useModal } from '/@/components/Modal'
+import { useModal } from '/@/components/Modal';
-import DeptModal from './DeptModal.vue'
+import DeptModal from './DeptModal.vue';
-import { columns, searchFormSchema } from './dept.data'
+import { columns, searchFormSchema } from './dept.data';
-import { delDept, listDept } from '/@/api/platform/system/controller/dept'
+import { delDept, listDept } from '/@/api/platform/system/controller/dept';
-import { useMessage } from '/@/hooks/web/useMessage'
+import { useMessage } from '/@/hooks/web/useMessage';
-import { listToTree } from '/@/utils/helper/treeHelper'
+import { listToTree } from '/@/utils/helper/treeHelper';
 
 /** 通用变量统一声明区域 */
-const { createMessage } = useMessage()
+const { createMessage } = useMessage();
-const [registerModal, { openModal }] = useModal()
+const [registerModal, { openModal }] = useModal();
 const [registerTable, { reload, expandAll, collapseAll, getDataSource }] = useTable({
 	title: '部门列表',
 	api: listDept,
@@ -83,30 +83,30 @@ const [registerTable, { reload, expandAll, collapseAll, getDataSource }] = useTa
 		fixed: false
 	},
 	afterFetch: result => listToTree(result, { id: 'deptId' }),
-	onExpand: rowClick
+
-})
+});
 
 /** 新增按钮操作,行内新增与工具栏局域新增通用 */
 function handleAdd(record?: Recordable) {
-	openModal(true, { _tag: 'add', record })
+	openModal(true, { _tag: 'add', record });
 }
 
 /** 编辑按钮操作,行内编辑 */
 function handleEdit(record: Recordable) {
-	openModal(true, { _tag: 'edit', record })
+	openModal(true, { _tag: 'edit', record });
 }
 
 /** 删除按钮操作,行内删除 */
 async function handleDel(record: Recordable) {
-	await delDept(record.deptId)
+	await delDept(record.deptId);
-	createMessage.success('删除成功!')
+	createMessage.success('删除成功!');
-	handleRefreshTable()
+	handleRefreshTable();
 }
 function rowClick(record, index, event) {
-	console.log(record, index, event)
+	console.log(record, index, event);
 }
 /** 处理表格刷新 */
 function handleRefreshTable() {
-	reload()
+	reload();
 }
 </script>

src/views/system/equip/boxcard/BoxCardModal.vue

@@ -0,0 +1,67 @@
+<template>
+  <BasicModal v-bind="$attrs" 
+              :title="getTitle" 
+              @register="registerModal" 
+              @ok="handleSubmit"
+  >
+    <BasicForm @register="registerForm"/>
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+import {ref, computed, unref} from 'vue';
+import {BasicModal, useModalInner} from '/@/components/Modal';
+import {cardFormSchema} from './boxcard.data';
+import {BasicForm, useForm} from '/@/components/Form/index';
+import {set} from '/@/api/platform/system/controller/boxcard';
+
+const isUpdate = ref(true);
+
+// 定义emit
+const emit = defineEmits(['success', 'register']);
+
+/**
+ * 表单
+ */
+const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  labelWidth: 100,
+  schemas: cardFormSchema,
+  showActionButtonGroup: false,
+  actionColOptions: {
+    span: 23,
+  },
+});
+
+/**
+ * 表单参数
+ */
+const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  resetFields();
+  setModalProps({confirmLoading: false});
+  isUpdate.value = !!data?.isUpdate;
+
+
+  if (unref(isUpdate)) {
+    setFieldsValue({
+      ...data.record,
+    });
+  }
+});
+
+//表单标题
+const getTitle = computed(() => (!unref(isUpdate) ? '新增网卡' : '编辑网卡'));
+
+async function handleSubmit() {
+  try {
+    const values = await validate();
+    setModalProps({confirmLoading: true});
+    await set(values);//保存网卡
+    closeModal();
+    emit('success');
+  } finally {
+    setModalProps({confirmLoading: false});
+  }
+}
+
+
+</script>

src/views/system/equip/boxcard/boxcard.data.ts

@@ -0,0 +1,160 @@
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import {h} from 'vue';
+import {Tag} from 'ant-design-vue';
+
+
+export const columns: BasicColumn[] = [
+    {
+        title: 'ID',
+        dataIndex: 'id',
+        width: 120,
+    },
+    {
+        title: 'iccid',
+        dataIndex: 'iccid',
+        width: 120,
+    },
+    {
+        title: '卡号',
+        dataIndex: 'card',
+        width: 120,
+    },
+    {
+        title: '网卡厂商',
+        dataIndex: 'company',
+        width: 120,
+        customRender: ({ record }) => {
+            const com = record.company;
+            switch (com) {
+                case '1': return '中国移动';
+                case '2': return '中国联通';
+                case '3': return '中国电信';
+                default: return '未知厂商';
+            }
+        }
+    },
+    {
+        title: '卡是否已使用',
+        dataIndex: 'isUsed',
+        width: 120,
+    },
+    {
+        title: '状态',
+        dataIndex: 'status',
+        width: 100,
+        customRender: ({ record }) => {
+            const status = record.status;
+            const enable = status === '0';
+            const color = enable ? 'green' : 'red';
+            const text = enable ? '启用' : '禁用';
+            return h(Tag, { color: color }, () => text);
+        },
+    },
+    {
+        title: '创建人',
+        dataIndex: 'createByName',
+        width: 180,
+    },
+    {
+        title: '创建时间',
+        dataIndex: 'createTime',
+        width: 180,
+    }
+];
+
+export const searchFormSchema: FormSchema[] = [
+    {
+        field: 'iccid',
+        label: 'iccid',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入唯一标识iccid',
+        },
+        colProps: { span: 5 },
+    },
+    {
+        field: 'card',
+        label: '卡号',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入卡号',
+        },
+        colProps: { span: 5 },
+    },
+    {
+        field: 'company',
+        label: '网卡厂商',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入网卡厂商',
+        },
+        colProps: { span: 4 },
+    },
+    {
+        field: 'beginTime',
+        label: '起始时间',
+        component: 'DatePicker',
+        colProps: { span: 5 },
+    },
+    {
+        field: 'endTime',
+        label: '截止时间',
+        component: 'DatePicker',
+        colProps: { span: 5 },
+    },
+];
+
+export const cardFormSchema: FormSchema[] = [
+    {
+        field: 'id',
+        label: 'ID',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'iccid',
+        label: 'iccid',
+        component: 'Input',
+        helpMessage: ['唯一识别号'],
+        required: true
+    },
+    {
+        field: 'card',
+        label: '卡号',
+        component: 'Input',
+        required: false,
+    },
+    {
+        field: 'company',
+        label: '网卡厂商',
+        component: 'Select',
+        required: true,
+        componentProps: {
+            options: [
+                { label: '中国移动', value: '1' },
+                { label: '中国联通', value: '2' },
+                { label: '中国电信', value: '3' },
+                { label: '未知厂商', value: ''||undefined||null }
+            ],
+
+        }
+    },
+    {
+        field: 'status',
+        label: '状态',
+        component: 'RadioButtonGroup',
+        defaultValue: '0',
+        componentProps: {
+            options: [
+                { label: '启用', value: '0' },
+                { label: '禁用', value: '1' },
+            ],
+        },
+    },
+    {
+        label: '备注',
+        field: 'remarks',
+        component: 'InputTextArea',
+    }
+];

src/views/system/equip/boxcard/index.vue

@@ -0,0 +1,100 @@
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleCreate">新增网卡</a-button>
+      </template>
+      <template #action="{ record }">
+        <TableAction
+          :actions="[
+            {
+              icon: 'clarity:note-edit-line',
+              onClick: handleEdit.bind(null, record),
+            },
+            {
+              icon: 'ant-design:delete-outlined',
+              color: 'error',
+              popConfirm: {
+                title: '是否确认删除',
+                confirm: handleDelete.bind(null, record),
+              },
+            },
+          ]"
+        />
+      </template>
+    </BasicTable>
+
+    <BoxCardModal @register="registerModal" @success="handleSuccess"/>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import {BasicTable, useTable, TableAction} from '/@/components/Table';
+  import {useModal} from '/@/components/Modal';
+  import BoxCardModal from './BoxCardModal.vue';
+  import {columns, searchFormSchema} from './boxcard.data';
+  import {useMessage} from '/@/hooks/web/useMessage';
+  import {cardList, remove} from '/@/api/platform/system/controller/boxcard';
+
+  const {createMessage} = useMessage();
+  const [registerModal, {openModal}] = useModal();
+  const [registerTable, {reload}] = useTable({
+    title: '网卡列表',
+    api: cardList,
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    pagination: true,
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: true,
+    canResize: false,
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      slots: {customRender: 'action'},
+      fixed: undefined,
+    },
+  });
+
+  /**
+   * 创建菜单
+   */
+  function handleCreate() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
+
+  /**
+   * 编辑菜单
+   */
+  function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  /**
+   * 删除菜单
+   */
+  async function handleDelete(record: Recordable) {
+    await remove({ids: record.id});
+    createMessage.success('删除成功!');
+    handleSuccess();
+  }
+
+  /**
+   * 成功后重载表格
+   */
+  function handleSuccess() {
+    reload();
+  }
+
+</script>