手术类型管理

src/api/model/surgicalType.ts

+/**
+ * 项目：-
+ * @Author: xiongwei
+ * @Date: 2022-06-28 11:50:00
+ */
+
+import { BasePageParams, PageResult, ApiResponse } from './baseModel';
+
+export interface SurgicalTypeParams extends BasePageParams {
+  /**
+   * ID系统自动生成
+   */
+  id?: number;
+  /**
+   * ID系统自动生成 IN值List
+   */
+  idList?: Array<number>;
+  /**
+   * 编码
+   */
+  code?: string;
+  /**
+   * 名称
+   */
+  name?: string;
+  /**
+   * 操作人Id
+   */
+  editorId?: number;
+  /**
+   * 操作人
+   */
+  editorName?: string;
+  /**
+   * create_time
+   */
+  createTime?: Date;
+  /**
+   *  下限值(大于等于)
+   */
+  createTimeFrom?: Date;
+  /**
+   *  上限值(小于)
+   */
+  createTimeTo?: Date;
+  /**
+   * update_time
+   */
+  updateTime?: Date;
+  /**
+   *  下限值(大于等于)
+   */
+  updateTimeFrom?: Date;
+  /**
+   *  上限值(小于)
+   */
+  updateTimeTo?: Date;
+  /**
+   * 是否启用
+   */
+  status?: String;
+  /**
+   * 是否启用 IN值List
+   */
+  statusList?: Array<string>;
+  /**
+   * 其他参数
+   */
+  [key: string]: any;
+}
+
+export interface SurgicalType {
+  /**
+   * ID系统自动生成
+   */
+  id?: number;
+  /**
+   * 编码
+   */
+  code?: string;
+  /**
+   * 名称
+   */
+  name?: string;
+  /**
+   * 操作人Id
+   */
+  editorId?: number;
+  /**
+   * 操作人
+   */
+  editorName?: string;
+  /**
+   * create_time
+   */
+  createTime?: Date;
+  /**
+   * update_time
+   */
+  updateTime?: Date;
+  /**
+   * 是否启用
+   */
+  status?: String;
+}
+
+export type SurgicalTypePageResult = PageResult<SurgicalType>;
+
+export type SurgicalTypePageResponse = ApiResponse<SurgicalTypePageResult>;
+
+export type SurgicalTypeResponse = ApiResponse<SurgicalType>;

src/api/system/surgicalTypeApi.ts

+/**
+ * 项目：-
+ * @Author: xiongwei
+ * @Date: 2022-06-28 11:50:00
+ */
+
+import { defHttp } from '/@/utils/http/axios';
+import { SurgicalType, SurgicalTypeParams, SurgicalTypePageResult } from '../model/surgicalType';
+const baseApi = '/v1/system/surgical-type';
+
+/**
+ * 新增
+ */
+export const add = (entity: SurgicalType) => defHttp.post<SurgicalType>({ url: `${baseApi}/`, data: entity });
+
+/**
+ * 更新
+ */
+export const update = (entity: SurgicalType) => defHttp.put<SurgicalType>({ url: `${baseApi}/`, data: entity });
+
+/**
+ * 删除
+ */
+export const remove = (id: any) => defHttp.delete<Number>({ url: `${baseApi}/${id}` });
+
+/**
+ * 分页查询
+ */
+export const search = (params?: SurgicalTypeParams) =>
+  defHttp.get<SurgicalTypePageResult>({ url: `${baseApi}/search`, params });
+
+/**
+ * 列表查询
+ */
+export const all = (params?: SurgicalTypeParams) =>
+  defHttp.get<SurgicalTypePageResult>({ url: `${baseApi}/all`, params });
+
+/**
+ * 通过主键查询
+ */
+export const getById = (id: any) => defHttp.get<SurgicalType>({ url: `${baseApi}/${id}` });
+
+/**
+ * 单个查询
+ */
+export const getOne = (params?: SurgicalTypeParams) => defHttp.get<SurgicalType>({ url: `${baseApi}/one`, params });
+
+/**
+ * 批量删除
+ */
+export const batchRemove = (idList: Array<any>) =>
+  defHttp.post<boolean>({ url: `${baseApi}/batch-delete`, data: idList });
+
+/**
+ * 批量新增
+ */
+export const batchAdd = (entityList: Array<SurgicalType>) =>
+  defHttp.post<boolean>({ url: `${baseApi}/batch-save`, data: entityList });
+
+/**
+ * 批量更新
+ */
+export const batchUpdate = (entityList: Array<SurgicalType>) =>
+  defHttp.post<boolean>({ url: `${baseApi}/batch-update`, data: entityList });
+
+/**
+ * 查询数量
+ */
+export const count = (params?: SurgicalTypeParams) => defHttp.get<Number>({ url: `${baseApi}/count`, params });

src/api/system/userApi.ts

@@ -5,8 +5,7 @@
  */
 
 import { defHttp } from '/@/utils/http/axios';
-import { ApiResponse } from '../model/baseModel';
-import { User, UserParams, UserPageResult, UserPageResponse, UserResponse } from '../model/user';
+import { User, UserParams, UserPageResult } from '../model/user';
 
 const baseApi = '/v1/system/user';
 

src/views/system/surgical-type/detail.vue

+<template>
+  <Card :bordered="false">
+    <Descriptions bordered :column="3">
+      <Descriptions.Item
+        v-for="p in displayProps"
+        :key="p.title"
+        :label="p.title"
+        :span="['avatar'].includes(p.name) ? 3 : 1"
+      >
+        <span v-if="p.key === 'avatar'">
+          <img :src="p.value" style="width: 120px; height: 120px" />
+        </span>
+        <template v-else>
+          {{ p.value }}
+        </template>
+      </Descriptions.Item>
+    </Descriptions>
+  </Card>
+</template>
+<script lang="ts" setup name="DeviceDetail">
+  import { onMounted, computed, ref, reactive } from 'vue';
+  import { useRoute } from 'vue-router';
+  import { ComputedRef } from '@vue/reactivity';
+  import { Descriptions, Card } from 'ant-design-vue';
+  import { descriptionColumns } from './schema';
+  import * as SurgicalTypeApi from '/@/api/system/surgicalTypeApi';
+  import { Device } from '/@/api/model/device';
+
+  const route = useRoute();
+  const id = ref(route.params?.id);
+  let data = reactive({
+    detail: {},
+    isOver: false,
+  });
+  const getDetail = () => {
+    SurgicalTypeApi.getById(id.value).then((res: Device) => {
+      data.isOver = true;
+      data.detail = res;
+    });
+  };
+
+  onMounted(() => {
+    getDetail();
+  });
+
+  const displayProps: ComputedRef<Array<any>> = computed(() => {
+    if (!data.isOver) return {};
+    const display: any = descriptionColumns.map(({ title, dataIndex = '', customRender }) => ({
+      key: dataIndex,
+      title,
+      value: customRender ? customRender(data.detail[dataIndex], data.detail) : data.detail[dataIndex],
+    }));
+    return display;
+  });
+</script>
+
+<style scoped></style>

src/views/system/surgical-type/drawer.vue

+<template>
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="600px" @ok="handleSubmit">
+    <BasicForm @register="registerForm" />
+  </BasicDrawer>
+</template>
+<script lang="ts" setup name="SurgicalTypeDrawer">
+  import { defineEmits, ref, computed, unref } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './schema';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import * as SurgicalTypeApi from '/@/api/system/surgicalTypeApi';
+
+  const emit = defineEmits(['success', 'register']);
+  const isUpdate = ref(true);
+  const entityId = ref(0);
+
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 120,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+    await resetFields();
+    setDrawerProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    entityId.value = data?.record?.id;
+
+    if (unref(isUpdate)) {
+      await setFieldsValue({
+        ...data.record,
+      });
+    }
+  });
+
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setDrawerProps({ confirmLoading: true });
+      const {
+        ...rest
+      } = values;
+      const action = !unref(isUpdate) ? SurgicalTypeApi.add : SurgicalTypeApi.update;
+      const data = !unref(isUpdate)
+        ? {
+            ...rest,
+          }
+        : Object.assign({},
+          {
+            ...rest,
+            id: unref(entityId),
+          },
+        );
+      await action(data);
+      closeDrawer();
+      emit('success');
+    } finally {
+      setDrawerProps({ confirmLoading: false });
+    }
+  }
+</script>

src/views/system/surgical-type/index.vue

+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #headerTop>
+        <a-alert type="info" show-icon>
+          <template #message>
+            <template v-if="checkedKeys.length > 0">
+              <span>已选中{{ checkedKeys.length }}条记录</span>
+              <a-button type="link" @click="checkedKeys = []" size="small">清空</a-button>
+              <a-popconfirm
+                class="ml-4"
+                title="确定要全部删除吗？"
+                ok-text="是"
+                cancel-text="否"
+                @confirm="handleBatchDelete"
+              >
+                <a href="#" class="text-red-500">删除</a>
+              </a-popconfirm>
+            </template>
+            <template v-else>
+              <span>未选中任何项目</span>
+            </template>
+          </template>
+        </a-alert>
+      </template>
+      <template #toolbar>
+        <a-button v-auth="'AUTH_SYSTEM_SURGICAL_TYPE:ADD'" type="primary" @click="handleCreate"> 新增</a-button>
+      </template>
+      <template #bodyCell="{ column, record, text }">
+        <template v-if="column.dataIndex === 'id'">
+          <a @click="handleView(record)"> {{ record.id }} </a>
+        </template>
+        <template v-if="[].includes(column.dataIndex)">
+          <img :src="text" class="photo" alt="图片" v-if="!!text" />
+        </template>
+        <template v-if="column.dataIndex === 'action'">
+          <TableAction
+            :actions="[
+              {
+                tooltip: '编辑',
+                icon: 'clarity:note-edit-line',
+                onClick: handleEdit.bind(null, record),
+                ifShow: hasPermission('AUTH_SYSTEM_SURGICAL_TYPE:EDIT'),
+              },
+              {
+                tooltip: '删除',
+                icon: 'ant-design:delete-outlined',
+                color: 'error',
+                popConfirm: {
+                  title: '是否确认删除',
+                  confirm: handleDelete.bind(null, record),
+                },
+                ifShow: hasPermission('AUTH_SYSTEM_SURGICAL_TYPE:DELETE'),
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <SurgicalTypeDrawer @register="registerDrawer" @success="handleSuccess" />
+  </div>
+</template>
+<script lang="ts" setup name="DeviceIndex">
+  import { ref } from 'vue';
+  import { useGo } from '/@/hooks/web/usePage';
+  import { usePermission } from '/@/hooks/web/usePermission';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { isObject } from '/@/utils/is';
+  import moment from 'moment';
+  import * as SurgicalTypeApi from '/@/api/system/surgicalTypeApi';
+  import { useDrawer } from '/@/components/Drawer';
+  import componentSetting from '/@/settings/componentSetting';
+  import SurgicalTypeDrawer from './drawer.vue';
+  import { columns, searchFormSchema } from './schema';
+
+  const { hasPermission } = usePermission();
+  const go = useGo();
+  const {
+    formConfig,
+    showTableSetting,
+    bordered,
+    showIndexColumn,
+  } = componentSetting.table;
+
+  const checkedKeys = ref<Array<string | number>>([]);
+  const onSelectChange = (selectedRowKeys: (string | number)[]) => {
+    checkedKeys.value = selectedRowKeys;
+  }
+
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerTable, { reload }] = useTable({
+    title: '手术类型',
+    api: (params) => SurgicalTypeApi.search(handleParams(params)),
+    columns,
+    formConfig: {
+      labelWidth: formConfig.labelWidth,
+      schemas: searchFormSchema,
+      showAdvancedButton: false,
+    },
+    rowSelection: {
+      type: 'checkbox',
+      selectedRowKeys: checkedKeys,
+      onChange: onSelectChange,
+    },
+    useSearchForm: true,
+    showTableSetting,
+    bordered,
+    showIndexColumn,
+    canResize: false,
+    rowKey: (record: any) => record.id,
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: 'right',
+    },
+  });
+
+  const handleParams = (params) => {
+    const handledParams: any = {};
+    Object.keys(params).forEach((key) => {
+      const schema = searchFormSchema.find((item) => item.field === key);
+      const value = params[key];
+      if (schema && value !== undefined && value !== '') {
+        if (schema.component === 'Input') {
+          handledParams[key] = `%${value.trim()}%`;
+        } else if (['Select', 'ApiSelect'].includes(schema.component)) {
+          handledParams[key] = isObject(value) ? value.value : value;
+        } else if (schema.component === 'RangePicker') {
+          handledParams[`${key}From`] = moment(value[0]).startOf('d').format('YYYY-MM-DD HH:mm:ss');
+          handledParams[`${key}To`] = moment(value[1]).endOf('d').format('YYYY-MM-DD HH:mm:ss');
+        } else if (schema.component === 'DatePicker') {
+          handledParams[key] = moment(value).format((schema.componentProps as any).format || 'YYYY-MM-DD');
+        } else {
+          handledParams[key] = value;
+        }
+      }
+    });
+    return handledParams;
+  };
+
+  const handleCreate = () => {
+    openDrawer(true, {
+      isUpdate: false,
+    });
+  };
+
+  const handleEdit = (record: Recordable) => {
+    openDrawer(true, {
+      record,
+      isUpdate: true,
+    });
+  };
+
+  const handleDelete = (record: Recordable) => {
+    SurgicalTypeApi.remove(record.id).then((_) => {
+      reload();
+    });
+  };
+
+  const handleBatchDelete = () => {
+    SurgicalTypeApi.batchRemove(checkedKeys.value).then((_) => {
+      reload();
+    });
+  };
+
+  const handleSuccess = () => {
+    reload();
+  };
+
+  const handleView = (record) => {
+    go('/system/surgical-type/' + record.id);
+  };
+</script>

src/views/system/surgical-type/schema.ts

+/**
+ * 项目：-
+ * 模型分组：系统管理
+ * 模型名称：手术类型
+ * @Author: xiongwei
+ * @Date: 2022-06-28 11:50:00
+ */
+
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import get from 'lodash.get';
+
+export enum YesNoEnum {
+  YES = '是',
+  NO = '否',
+}
+export const YesNoEnumOptions: any[] = [];
+for (const key in YesNoEnum) {
+  YesNoEnumOptions.push({
+    value: key,
+    label: YesNoEnum[key],
+  });
+}
+
+const colProps = { xs: { span: 24 }, sm: { span: 24 }, lg: { span: 8 } };
+const colPropsInDrawer = { span: 24 };
+
+export const schema = {
+  model: 'SurgicalType',
+  viewInPage: false,
+  properties: [
+    {
+      field: 'id',
+      label: 'ID系统自动生成',
+      defaultValue: undefined,
+      form: {
+        componentProps: {
+          allowClear: false,
+          placeholder: 'ID系统自动生成',
+        },
+        colProps,
+        component: 'InputNumber',
+        rules: [{ required: true, message: '请输入ID系统自动生成！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'code',
+      label: '编码',
+      defaultValue: undefined,
+      form: {
+        componentProps: {
+          allowClear: true,
+          placeholder: '编码',
+        },
+        colProps,
+        component: 'Input',
+      },
+      table: {
+      },
+    },
+    {
+      field: 'name',
+      label: '名称',
+      defaultValue: undefined,
+      form: {
+        componentProps: {
+          allowClear: false,
+          placeholder: '名称',
+        },
+        colProps,
+        component: 'Input',
+        rules: [{ required: true, message: '请输入名称！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'editorId',
+      label: '操作人Id',
+      defaultValue: 1,
+      form: {
+        componentProps: {
+          allowClear: false,
+          placeholder: '操作人Id',
+        },
+        colProps,
+        component: 'InputNumber',
+        rules: [{ required: true, message: '请输入操作人Id！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'editorName',
+      label: '操作人',
+      defaultValue: 'admin',
+      form: {
+        componentProps: {
+          allowClear: false,
+          placeholder: '操作人',
+        },
+        colProps,
+        component: 'Input',
+        rules: [{ required: true, message: '请输入操作人！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'createTime',
+      label: 'CreateTime',
+      defaultValue: undefined,
+      form: {
+        colProps,
+        componentProps: {
+          allowClear: false,
+          placeholder: ['开始时间', '结束时间'],
+          format: 'YYYY-MM-DD',
+          showTime: false,
+        },
+        component: 'RangePicker',
+        rules: [{ required: true, message: '请输入CreateTime！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'updateTime',
+      label: 'UpdateTime',
+      defaultValue: undefined,
+      form: {
+        colProps,
+        componentProps: {
+          allowClear: false,
+          placeholder: ['开始时间', '结束时间'],
+          format: 'YYYY-MM-DD',
+          showTime: false,
+        },
+        component: 'RangePicker',
+        rules: [{ required: true, message: '请输入UpdateTime！' }],
+      },
+      table: {
+      },
+    },
+    {
+      field: 'status',
+      label: '是否启用',
+      defaultValue: 'YES',
+      form: {
+        componentProps: {
+          allowClear: false,
+          placeholder: '是否启用',
+          options: YesNoEnumOptions,
+        },
+        colProps,
+        component: 'Select',
+        rules: [{ required: true, message: '请输入是否启用！' }],
+      },
+      table: {
+        customRender: ({ text }) => {
+          const option = YesNoEnumOptions.find((item) => item.value === text)
+          return option ? option.label : text;
+        },
+      },
+    },
+  ],
+};
+
+const queryFields = ['id','code','name','editorId','editorName','createTime','updateTime','status'];
+const editFields = ['code','name','status'];
+const tableFields = ['id','code','name','editorId','editorName','createTime','updateTime','status'];
+const descriptionFields = ['id','code','name','editorId','editorName','createTime','updateTime','status'];
+
+export const searchFormSchema: FormSchema[] = schema.properties.filter(item => queryFields.includes(item.field))
+  .map(
+    ({ field, label, form: { rules = [], ...formProps } }) =>
+      ({
+        field,
+        label,
+        defaultValue: undefined,
+        rules: rules.filter((r) => !r.required),
+        ...formProps,
+      } as FormSchema),
+  );
+
+export const formSchema: FormSchema[] = schema.properties.filter(item => editFields.includes(item.field))
+  .map(
+    ({ field, label, defaultValue, form }) =>
+      ({
+        field,
+        label,
+        defaultValue,
+        ...form,
+        colProps: colPropsInDrawer,
+      } as FormSchema),
+  );
+
+export const columns: BasicColumn[] = schema.properties.filter(item => tableFields.includes(item.field))
+  .map(
+    ({ field, label, table }) =>
+      ({
+        dataIndex: field,
+        title: label,
+        ...table,
+      } as BasicColumn)
+  );
+
+export const descriptionColumns: BasicColumn[] = schema.properties.filter(item => descriptionFields.includes(item.field))
+  .map(
+    ({ field, label, table }) =>
+      ({
+        dataIndex: field,
+        title: label,
+        ...table,
+      } as BasicColumn),
+  );