From a26722a65569fd20515168b4ea6dfc074f700a42 Mon Sep 17 00:00:00 2001
From: lq <workerqi@163.com>
Date: Wed, 14 May 2025 15:04:09 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BB=93=E5=BA=93=E8=8D=AF=E5=93=81?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=20-=20=E8=AF=8A=E6=89=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web-antd/src/adapter/component/index.ts  |   3 +-
 .../admin/api/index.ts                        |   8 +
 .../warehouse-drug-management/admin/index.vue |  25 ++-
 .../store/api/index.ts                        |  88 +++++++++
 .../store/components/ExcelUpload.vue          | 172 +++++++++++++++++
 .../store/components/modal.vue                | 135 +++++++++++++
 .../store/config/form.ts                      |  97 ++++++++++
 .../store/config/search.ts                    |  60 ++++++
 .../store/config/table.ts                     |  79 ++++++++
 .../warehouse-drug-management/store/index.vue | 181 ++++++++++++++++++
 10 files changed, 844 insertions(+), 4 deletions(-)
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/api/index.ts
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/components/ExcelUpload.vue
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/components/modal.vue
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/config/form.ts
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/config/search.ts
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
 create mode 100644 apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue

diff --git a/apps/web-antd/src/adapter/component/index.ts b/apps/web-antd/src/adapter/component/index.ts
index 57d2c76e..e4b38e89 100644
--- a/apps/web-antd/src/adapter/component/index.ts
+++ b/apps/web-antd/src/adapter/component/index.ts
@@ -13,7 +13,8 @@ import { $t } from '@vben/locales';
 
 import {
   AutoComplete,
-  Button, Cascader,
+  Button,
+  Cascader,
   Checkbox,
   CheckboxGroup,
   DatePicker,
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/admin/api/index.ts b/apps/web-antd/src/views/business/warehouse-drug-management/admin/api/index.ts
index f54364ab..f395347d 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/admin/api/index.ts
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/admin/api/index.ts
@@ -39,6 +39,14 @@ export async function exportWarehouseDrugManagementTemplateApi() {
   return requestClient.download(`${prefix}export-template`);
 }
 
+/**
+ * 上架/下架
+ * @param id
+ */
+export async function updateWarehouseDrugManagementStatusApi(id: number) {
+  return requestClient.get<any>(`${prefix}update-status`, { params: { id } });
+}
+
 /**
  * 新增西（中成）药
  * @param data
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue b/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
index 52f5c1c9..03c08049 100644
--- a/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/admin/index.vue
@@ -11,7 +11,11 @@ import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { TableAction } from '#/components/table-action';
 import { downloadByData } from '#/util/tool';
 
-import { deleteWarehouseDrugManagement, exportWarehouseDrugManagementApi } from './api';
+import {
+  deleteWarehouseDrugManagement,
+  exportWarehouseDrugManagementApi,
+  updateWarehouseDrugManagementStatusApi
+} from './api';
 import FormModalDemo from './components/modal.vue';
 import ExcelUpload from './components/ExcelUpload.vue';
 import { formOptions } from './config/search';
@@ -88,6 +92,13 @@ const openExcelUploadModal = (type = 1) => {
   });
   ExcelUploadModalApi.open();
 };
+
+const updateStatus = (id) => {
+  updateWarehouseDrugManagementStatusApi(id).then(() => {
+    message.success('修改成功!');
+    gridApi.reload();
+  });
+}
 </script>
 
 <template>
@@ -165,6 +176,14 @@ const openExcelUploadModal = (type = 1) => {
       <template #action="{ row }">
         <TableAction
           :actions="[
+            {
+              label: '上架/下架',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['western-medicine', 'sys:role:detail'],
+              onClick: updateStatus.bind(null, row.id),
+            },
             {
               label: '编辑',
               type: 'link',
@@ -173,6 +192,8 @@ const openExcelUploadModal = (type = 1) => {
               // auth: ['western-medicine', 'sys:role:detail'],
               onClick: showModal.bind(null, row, true),
             },
+          ]"
+          :drop-down-actions="[
             {
               label: '删除',
               type: 'link',
@@ -184,8 +205,6 @@ const openExcelUploadModal = (type = 1) => {
                 confirm: deleteApi.bind(null, row.id),
               },
             },
-          ]"
-          :drop-down-actions="[
             // {
             //   label: '编辑',
             //   type: 'link',
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/api/index.ts b/apps/web-antd/src/views/business/warehouse-drug-management/store/api/index.ts
new file mode 100644
index 00000000..9050859c
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/api/index.ts
@@ -0,0 +1,88 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'warehouse-drug-management-store/';
+
+/**
+ * 分页查询诊所仓库商品列表
+ * @param data
+ */
+export async function getWarehouseDrugManagementStoreList(data: any) {
+  return requestClient.get<any>(`${prefix}list`, { params: data });
+}
+
+/**
+ * 分页查询诊所仓库商品列表
+ * @param data
+ */
+export async function getWarehouseDrugManagementStoreOption(data: any) {
+  return requestClient.get<any>(`${prefix}option`, { params: data });
+}
+
+/**
+ * 获取诊所仓库商品药详情
+ * @param id
+ */
+export async function getWarehouseDrugManagementStoreInfo(id: number) {
+  return requestClient.get<any>(`${prefix}detail`, { params: { id } });
+}
+
+/**
+ * 上架/下架
+ * @param id
+ */
+export async function updateWarehouseDrugManagementStoreStatusApi(id: number) {
+  return requestClient.get<any>(`${prefix}update-status`, { params: { id } });
+}
+
+/**
+ * 导出仓库药品药品
+ */
+export async function exportWarehouseDrugManagementStoreApi() {
+  return requestClient.download(`${prefix}export`);
+}
+/**
+ * 导出仓库药品药品 - 模板
+ */
+export async function exportWarehouseDrugManagementStoreTemplateApi() {
+  return requestClient.download(`${prefix}export-template`);
+}
+
+/**
+ * 新增诊所仓库商品药
+ * @param data
+ */
+export async function createWarehouseDrugManagementStore(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}create`, data);
+}
+
+/**
+ * 编辑诊所仓库商品药
+ * @param data
+ */
+export async function updateWarehouseDrugManagementStore(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}update`, data);
+}
+
+/**
+ * 删除诊所仓库商品药
+ * @param data
+ */
+export async function deleteWarehouseDrugManagementStore(data: Record<string, any>) {
+  return requestClient.post<any>(`${prefix}delete`, data);
+}
+
+/**
+ * 导入仓库药品
+ * @param data
+ */
+export async function importWarehouseDrugManagementStoreApi(data: Record<string, any>) {
+  return requestClient.upload(`${prefix}import`, data);
+}
+
+/**
+ * 导入仓库药品修改价格
+ * @param data
+ */
+export async function importUpdatePriceApi(data: Record<string, any>) {
+  return requestClient.upload(`${prefix}import-update-price`, data);
+}
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/components/ExcelUpload.vue b/apps/web-antd/src/views/business/warehouse-drug-management/store/components/ExcelUpload.vue
new file mode 100644
index 00000000..7c9fc111
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/components/ExcelUpload.vue
@@ -0,0 +1,172 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import {
+  Button,
+  message,
+  type UploadChangeParam,
+  UploadDragger,
+} from 'ant-design-vue';
+
+import { downloadByData } from '#/util/tool';
+
+import {
+  exportWarehouseDrugManagementStoreTemplateApi,
+  importUpdatePriceApi,
+  importWarehouseDrugManagementStoreApi,
+} from '../api';
+
+const gridApi = ref();
+const passApplication = ref();
+const importType = ref(1);
+const fileList = ref([]);
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.setState({ loading: true, confirmLoading: true });
+    gridApi.value?.reload();
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    passApplication.value = isOpen ? modalApi.getData()?.passApplication : null;
+    importType.value = isOpen ? modalApi.getData()?.type : 1;
+    fileList.value = [];
+  },
+});
+
+const importWarehouseDrugManagementStore = ({ file, onSuccess }) => {
+  modalApi.setState({ loading: true, confirmLoading: true });
+  const submitApi =
+    importType.value === 1
+      ? importWarehouseDrugManagementStoreApi
+      : importUpdatePriceApi;
+  submitApi({
+    file,
+  })
+    .then(() => {
+      onSuccess('ok', { status: 'done' });
+    })
+    .catch(() => {
+      onSuccess('error', { status: 'error' });
+    })
+    .finally(() => {
+      modalApi.setState({ loading: false, confirmLoading: false });
+    });
+};
+const handleChange = (info: UploadChangeParam) => {
+  if (info.file.status === 'uploading') {
+    return;
+  }
+  if (info.file.status === 'done') {
+    message.success('上传成功');
+  }
+  if (info.file.status === 'error') {
+    message.error('upload error');
+  }
+};
+
+const exportWarehouseDrugManagementStoreTemplate = () => {
+  exportWarehouseDrugManagementStoreTemplateApi().then((res) => {
+    // 创建新的URL表示指定的File对象或者Blob对象。
+    downloadByData(
+      res.data,
+      '萧康云医-仓库商品导入模板结果导出（只包含未导入的药品）.xlsx',
+    );
+    message.success('导出成功!');
+  });
+};
+</script>
+<template>
+  <Modal class="w-[30%]" :title="importType === 1 ? '上传Excel' : '批量修改价格'">
+    <Button v-if="importType === 1" type="link" @click="exportWarehouseDrugManagementStoreTemplate">
+      下载位同步到仓库药品的导入模板
+    </Button>
+    <Button v-if="importType === 2" type="link" @click="passApplication">
+      下载修改价格模板
+    </Button>
+    <UploadDragger
+      class="mt-6"
+      v-model:file-list="fileList"
+      :custom-request="importWarehouseDrugManagementStore"
+      :max-count="1"
+      :on-change="handleChange"
+      name="file"
+    >
+      <p class="flex justify-center">
+        <svg
+          height="64"
+          viewBox="0 0 32 32"
+          width="64"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <defs>
+            <linearGradient
+              id="vscodeIconsFileTypeExcel0"
+              gradientTransform="translate(0 2100)"
+              gradientUnits="userSpaceOnUse"
+              x1="4.494"
+              x2="13.832"
+              y1="-2092.086"
+              y2="-2075.914"
+            >
+              <stop offset="0" stop-color="#18884f" />
+              <stop offset=".5" stop-color="#117e43" />
+              <stop offset="1" stop-color="#0b6631" />
+            </linearGradient>
+          </defs>
+          <path
+            d="M19.581 15.35L8.512 13.4v14.409A1.19 1.19 0 0 0 9.705 29h19.1A1.19 1.19 0 0 0 30 27.809V22.5Z"
+            fill="#185c37"
+          />
+          <path
+            d="M19.581 3H9.705a1.19 1.19 0 0 0-1.193 1.191V9.5L19.581 16l5.861 1.95L30 16V9.5Z"
+            fill="#21a366"
+          />
+          <path d="M8.512 9.5h11.069V16H8.512Z" fill="#107c41" />
+          <path
+            d="M16.434 8.2H8.512v16.25h7.922a1.2 1.2 0 0 0 1.194-1.191V9.391A1.2 1.2 0 0 0 16.434 8.2"
+            opacity="0.1"
+          />
+          <path
+            d="M15.783 8.85H8.512V25.1h7.271a1.2 1.2 0 0 0 1.194-1.191V10.041a1.2 1.2 0 0 0-1.194-1.191"
+            opacity="0.2"
+          />
+          <path
+            d="M15.783 8.85H8.512V23.8h7.271a1.2 1.2 0 0 0 1.194-1.191V10.041a1.2 1.2 0 0 0-1.194-1.191"
+            opacity="0.2"
+          />
+          <path
+            d="M15.132 8.85h-6.62V23.8h6.62a1.2 1.2 0 0 0 1.194-1.191V10.041a1.2 1.2 0 0 0-1.194-1.191"
+            opacity="0.2"
+          />
+          <path
+            d="M3.194 8.85h11.938a1.193 1.193 0 0 1 1.194 1.191v11.918a1.193 1.193 0 0 1-1.194 1.191H3.194A1.19 1.19 0 0 1 2 21.959V10.041A1.19 1.19 0 0 1 3.194 8.85"
+            fill="url(#vscodeIconsFileTypeExcel0)"
+          />
+          <path
+            d="m5.7 19.873l2.511-3.884l-2.3-3.862h1.847L9.013 14.6c.116.234.2.408.238.524h.017q.123-.281.26-.546l1.342-2.447h1.7l-2.359 3.84l2.419 3.905h-1.809l-1.45-2.711A2.4 2.4 0 0 1 9.2 16.8h-.024a1.7 1.7 0 0 1-.168.351l-1.493 2.722Z"
+            fill="#fff"
+          />
+          <path
+            d="M28.806 3h-9.225v6.5H30V4.191A1.19 1.19 0 0 0 28.806 3"
+            fill="#33c481"
+          />
+          <path d="M19.581 16H30v6.5H19.581Z" fill="#107c41" />
+        </svg>
+      </p>
+      <p class="ant-upload-text">点击或拖动文件到此区域进行上传</p>
+      <p class="ant-upload-hint">
+        支持单个上传，xlsx格式文件。严禁上传公司数据或其他带格式文件。
+      </p>
+    </UploadDragger>
+    <!--    <Form />-->
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/components/modal.vue b/apps/web-antd/src/views/business/warehouse-drug-management/store/components/modal.vue
new file mode 100644
index 00000000..64c4bc34
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/components/modal.vue
@@ -0,0 +1,135 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+
+import {
+  createWarehouseDrugManagementStore,
+  updateWarehouseDrugManagementStore,
+} from '../api';
+import { modalFormProps } from '../config/form';
+import {getDrugUseList} from "#/views/doctor/doctor-reception/api";
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+const userStore = useUserStore();
+
+const drugTime = ref([]);
+const drugType = ref([]);
+const drugUnit = ref([]);
+const drugFrequency = ref([]);
+getDrugUseList().then((res) => {
+  drugTime.value = res.drug_time.map((item) => {
+    return {
+      label: item.name,
+      value: item.id,
+    };
+  });
+  drugType.value = res.drug_use_type.map((item) => {
+    return {
+      label: item.name,
+      value: item.id,
+    };
+  });
+  drugUnit.value = res.drug_unit.map((item) => {
+    return {
+      label: item.name,
+      value: item.id,
+    };
+  });
+  drugFrequency.value = res.drug_use_frequency.map((item) => {
+    return {
+      label: item.name,
+      value: item.id,
+    };
+  });
+  return res;
+});
+
+const isUpdate = ref(false);
+const gridApi = ref();
+
+const [Form, formApi] = useVbenForm(modalFormProps);
+
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    formApi.validate().then(async (e: any) => {
+      if (e.valid) {
+        const values = await formApi.getValues();
+        modalApi.setState({ loading: true, confirmLoading: true });
+        const submitApi = isUpdate.value
+          ? updateWarehouseDrugManagementStore
+          : createWarehouseDrugManagementStore;
+        submitApi(values)
+          .then(() => {
+            message.success('保存成功');
+            gridApi.value?.reload();
+            modalApi.close();
+          })
+          .finally(() => {
+            modalApi.setState({ loading: false, confirmLoading: false });
+          });
+      }
+    });
+    await formApi.validateAndSubmitForm();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+
+      formApi.updateSchema([
+        {
+          componentProps: {
+            options: drugTime.value,
+          },
+          fieldName: 'time_id',
+        },
+        {
+          componentProps: {
+            options: drugUnit.value,
+          },
+          fieldName: 'unit_id',
+        },
+        {
+          componentProps: {
+            options: drugType.value,
+          },
+          fieldName: 'type_id',
+        },
+        {
+          componentProps: {
+            options: drugFrequency.value,
+          },
+          fieldName: 'frequency_id',
+        },
+      ]);
+      const { values, update } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        console.log(values, 'sssssssssssss')
+        isUpdate.value = update;
+        formApi.setValues(values);
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal
+    :title="`${isUpdate === true ? '编辑' : '新增'}仓库药品`"
+    class="w-[30%]"
+  >
+    <Form />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/config/form.ts b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/form.ts
new file mode 100644
index 00000000..eba3a1e7
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/form.ts
@@ -0,0 +1,97 @@
+import type {VbenFormProps} from '#/adapter/form';
+
+import {
+  getWarehouseDrugManagementStoreOption
+} from "../api";
+
+
+export const modalFormProps: VbenFormProps = {
+  wrapperClass: 'grid-cols-12', // 24栅格,
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // handleSubmit: onSubmit,
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'VbenInput',
+      fieldName: 'id',
+      label: 'ID',
+      formItemClass: 'col-span-6',
+      dependencies: {
+        show: false,
+        triggerFields: ['id'],
+      },
+    },
+    {
+      component: 'ApiSelect',
+      fieldName: 'drug_id',
+      label: '选择加入的药品',
+      formItemClass: 'col-span-12',
+      rules: 'required',
+      componentProps: {
+        api: getWarehouseDrugManagementStoreOption,
+        allowClear: true,
+        showSearch: true,
+        filterOption: (input: string, option: any) => {
+          // 自定义过滤逻辑，确保可以根据 name 进行搜索
+          return option?.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+        },
+        // 菜单接口转options格式
+        afterFetch: (data: { drug_name: string; id: number }[]) => {
+          return data.map((item: any) => ({
+            label: `${item.drug_name}【${item.pinyin_simple}】`,
+            value: item.id,
+          }));
+        },
+      },
+      dependencies: {
+        show(formValues: any) {
+          return !formValues.id;
+        },
+        triggerFields: ['id'],
+      },
+    },
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '请输入价格',
+      },
+      fieldName: 'price',
+      formItemClass: 'col-span-12',
+      label: '价格',
+      rules: 'required',
+    },
+  ],
+  showDefaultActions: false,
+};
+export const uploadExcelProps: VbenFormProps = {
+  wrapperClass: 'grid-cols-12', // 24栅格,
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // handleSubmit: onSubmit,
+  layout: 'horizontal',
+  schema: [
+    {
+      component: 'Upload',
+      componentProps: {
+        placeholder: '请选择',
+        multiple: true,
+      },
+      fieldName: 'frequency_id',
+      formItemClass: 'col-span-12',
+      label: '导入excel',
+      rules: 'file',
+    },
+  ],
+  showDefaultActions: false,
+};
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/config/search.ts b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/search.ts
new file mode 100644
index 00000000..14217fe7
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/search.ts
@@ -0,0 +1,60 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'VbenInput',
+      componentProps: {
+        placeholder: '输入名称',
+      },
+      defaultValue: '',
+      fieldName: 'name',
+      label: '药名称',
+    },
+    {
+      component: 'VbenSelect',
+      componentProps: {
+        placeholder: '输入名称',
+        options: [
+          {
+            label: '中药',
+            value: 1,
+          },
+          {
+            label: '西药',
+            value: 2,
+          },
+          {
+            label: '服务包',
+            value: 5,
+          },
+        ],
+      },
+      defaultValue: 1,
+      fieldName: 'type',
+      label: '类型',
+    }
+    // {
+    //   component: 'RangePicker',
+    //   componentProps: {
+    //     format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+    //   },
+    //   // defaultValue: [dayjs().startOf('month'), dayjs()],
+    //   fieldName: 'search_time',
+    //   label: '时间范围',
+    // },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
new file mode 100644
index 00000000..927fa3dd
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/config/table.ts
@@ -0,0 +1,79 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import {getWarehouseDrugManagementStoreList} from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+  logo: string;
+  introduce: string;
+  created_at: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { type: 'checkbox', width: 60 },
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    { field: 'drug.drug_name', align: 'left', title: '药品名称' },
+    { field: 'drug.pinyin_simple', title: '拼音' },
+    {
+      field: 'image',
+      align: 'left',
+      title: '产品图片',
+      slots: { default: 'image' },
+      width: 130,
+    },
+    { field: 'drug.drug_store_drug.market_price', title: '供货价' },
+    { field: 'drug.drug_store_drug.price', title: '建议售价' },
+    { field: 'price', title: '售价' },
+    { field: 'status', title: '状态', slots: { default: 'status' } },
+    { type: 'html', align: 'right', title: '操作', slots: { default: 'action' }, width: 300, },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getWarehouseDrugManagementStoreList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  // exportConfig: {
+  //   api: passApplicationApi,
+  // },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
diff --git a/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue b/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue
new file mode 100644
index 00000000..9517b95e
--- /dev/null
+++ b/apps/web-antd/src/views/business/warehouse-drug-management/store/index.vue
@@ -0,0 +1,181 @@
+<script lang="ts" setup>
+import type { VxeGridListeners } from '#/adapter/vxe-table';
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Image, message, Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+import { downloadByData } from '#/util/tool';
+
+import {
+  deleteWarehouseDrugManagementStore,
+  exportWarehouseDrugManagementStoreApi,
+  updateWarehouseDrugManagementStoreStatusApi
+} from './api';
+import FormModalDemo from './components/modal.vue';
+import ExcelUpload from './components/ExcelUpload.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+const hasTopTableDropDownActions = ref(false);
+
+const gridEvents: VxeGridListeners<any> = {
+  checkboxChange() {
+    // eslint-disable-next-line no-use-before-define
+    const records = gridApi.grid.getCheckboxRecords();
+    hasTopTableDropDownActions.value = records.length > 0;
+  },
+  checkboxAll() {
+    // eslint-disable-next-line no-use-before-define
+    const records = gridApi.grid.getCheckboxRecords();
+    hasTopTableDropDownActions.value = records.length > 0;
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+  gridEvents,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const [ExcelUploadModal, ExcelUploadModalApi] = useVbenModal({
+  connectedComponent: ExcelUpload,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+
+const deleteApi = (row: any) => {
+  let ids = [];
+  if (row) {
+    ids.push(row);
+  } else {
+    ids = gridApi.grid.getCheckboxRecords().map((item) => item.id);
+  }
+  deleteWarehouseDrugManagementStore({ ids }).then(() => {
+    message.success('删除成功!');
+    gridApi.reload();
+  });
+};
+/**
+ * 导出
+ */
+const passApplication = () => {
+  // 新标签跳转到 exportWarehouseDrugManagementStoreApi
+  exportWarehouseDrugManagementStoreApi().then((res) => {
+    // 创建新的URL表示指定的File对象或者Blob对象。
+    downloadByData(res.data, '萧康云医-仓库商品导出.xlsx');
+    message.success('导出成功!');
+  });
+};
+
+const openExcelUploadModal = (type = 1) => {
+  ExcelUploadModalApi.setData({
+    gridApi,
+    type,
+    passApplication,
+  });
+  ExcelUploadModalApi.open();
+};
+
+const updateStatus = (id) => {
+  updateWarehouseDrugManagementStoreStatusApi(id).then(() => {
+    message.success('修改成功!');
+    gridApi.reload();
+  });
+}
+</script>
+
+<template>
+  <Page auto-content-height title="西（中成）药管理">
+    <ExcelUploadModal />
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+        <TableAction
+          :actions="[
+            {
+              label: '批量修改价格',
+              type: 'primary',
+              icon: 'ix:export-check',
+              // auth: ['超级西（中成）药', 'sys:user:save'],
+              onClick: openExcelUploadModal.bind(null, 2),
+            },
+          ]"
+          :drop-down-actions="[
+            {
+              label: '删除',
+              icon: 'ant-design:delete-outlined',
+              ifShow: hasTopTableDropDownActions,
+              // auth: ['超级西（中成）药', 'sys:user:save'],
+              popConfirm: {
+                title: '确定删除吗？',
+                confirm: deleteApi.bind(null, false),
+              },
+            },
+          ]"
+        >
+          <template #more>
+            <Button style="margin-left: 16px">
+              批量操作
+              <Icon icon="ant-design:down-outlined" />
+            </Button>
+          </template>
+        </TableAction>
+      </template>
+      <template #image="{ row }">
+        <Image :src="row.drug?.image || '/public/img/traditional-chinese-medicine.jpg'" height="30" width="30" />
+      </template>
+      <template #instruction="{ row }">
+        <div class="div" style="width: 120px; height: 120px; overflow: scroll">
+          <Image :src="row.instruction" height="30" width="30" />
+        </div>
+      </template>
+      <template #status="{ row }">
+        <Tag :color="row.status === 2 ? 'green' : 'red'">{{
+          row.status === 2 ? '上架' : '下架'
+        }}</Tag>
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '上架/下架',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['western-medicine', 'sys:role:detail'],
+              onClick: updateStatus.bind(null, row.id),
+            },
+            {
+              label: '编辑',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['western-medicine', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>