xkyy/xk-admin
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

1. 管理员管理模块拆分

Browse Source 
2. 图片上传自动压缩（大于850kb）
3. 省市区选择组件重构，支持搜索
This commit is contained in:
李琦
2026-05-30 13:52:59 +08:00
parent 402da17e3d
commit 75d1b4db42
20 changed files with 475 additions and 620 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
apps/web-antd/src/views/system/pharmacy/index.vue
View File

@@ -28,6 +28,7 @@ import {
import FormModalDemo from './components/modal.vue';
// 导入绑定在线复诊配置弹窗（使用store的组件）
import BindConsultationModal from '#/views/system/store/components/BindConsultationModal.vue';
import DrugPriceModal from '#/views/system/store/components/DrugPriceModal.vue';
import StoreExternalFieldModal from '#/views/system/store/components/StoreExternalFieldModal.vue';
// 导入搜索表单配置
import { formOptions } from './config/search';
@@ -104,6 +105,17 @@ const [StoreExternalFieldModalComponent, storeExternalFieldModalApi] = useVbenMo
connectedComponent: StoreExternalFieldModal,
});
const [DrugPriceModalComponent, drugPriceModalApi] = useVbenModal({
connectedComponent: DrugPriceModal,
});
const showDrugPriceModal = (row: any) => {
drugPriceModalApi.setData({
store_id: row.id,
});
drugPriceModalApi.open();
};
const showStoreExternalFieldModal = (
row: any,
field: 'erp_id' | 'mes_id',
@@ -236,6 +248,7 @@ const batchSyncDrugPrice = () => {
<Page auto-content-height title="药店管理">
<FormModal />
<QrCodePreviewModal />
<DrugPriceModalComponent />
<BindConsultationModalComponent />
<StoreExternalFieldModalComponent />
<Grid>
@@ -427,6 +440,14 @@ const batchSyncDrugPrice = () => {
confirm: openQrCode.bind(null, row.id),
},
},
{
label: '修改药品价格',
type: 'link',
icon: 'ant-design:edit-outlined',
size: 'small',
ifShow: isPlatformAdmin,
onClick: showDrugPriceModal.bind(null, row),
},
]"
/>
</template>

2
apps/web-antd/src/views/system/store/api/index.ts
View File

@@ -117,7 +117,7 @@ export async function updateStoreSubscribeStatus(data: { id: number }) {
/**
* 获取诊所药品列表（按类型）
* @param storeId 诊所ID
* @param type 药品类型（1=中药，2=西药）
* @param type 商品类型（1中药 2西药 3保健食品 5产品服务包 6非药品 7医疗器械）
*/
export async function getStoreDrugsByTypeApi(storeId: number, type: number) {
return requestClient.get<any>(`${prefix}get-store-drugs-by-type`, {

167
apps/web-antd/src/views/system/store/components/DrugPriceModal.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { computed, ref, watch } from 'vue';
import { computed, nextTick, ref, watch } from 'vue';
import { useVbenModal } from '@vben/common-ui';
@@ -9,18 +9,18 @@ import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
type DrugItem,
getChinaMedicineGridOptions,
getWesternMedicineGridOptions,
handleSaveRow,
type ProductTypeOption,
fetchProductTypeOptions,
getDrugPriceGridOptions,
handleBatchSave,
handleSaveRow,
TCM_PLACEHOLDER_IMAGE,
} from '../config/drug-price-table';
import { drugPriceFormOptions } from '../config/search';
const activeTab = ref<string>('1'); // 1=中药, 2=西药
const activeTab = ref<string>('');
const storeId = ref<number>(0);
const loading = ref(false);
const chinaGridApi = ref<any>(null);
const westernGridApi = ref<any>(null);
const productTypeOptions = ref<ProductTypeOption[]>([]);
const [Modal, modalApi] = useVbenModal({
fullscreenButton: false,
@@ -30,136 +30,89 @@ const [Modal, modalApi] = useVbenModal({
modalApi.close();
},
onConfirm: async () => {
// 批量保存：保存当前激活tab的表格中所有修改的数据
if (activeTab.value === '1') {
await handleBatchSave(chinaGridApi.value, storeId.value);
} else {
await handleBatchSave(westernGridApi.value, storeId.value);
}
await handleBatchSave(drugGridApi, storeId.value);
},
onOpenChange(isOpen: boolean) {
onOpenChange: async (isOpen: boolean) => {
if (isOpen) {
const data = modalApi.getData<{ store_id: number }>();
if (data?.store_id) {
storeId.value = data.store_id;
// 使用proxyConfig自动加载数据，不需要手动调用
}
productTypeOptions.value = await fetchProductTypeOptions();
activeTab.value = String(productTypeOptions.value[0]?.value ?? '1');
await nextTick();
drugGridApi?.reload?.();
} else {
// 重置数据
activeTab.value = '1';
activeTab.value = '';
storeId.value = 0;
productTypeOptions.value = [];
}
},
});
// 单行保存回调函数
const handleSaveChinaRow = async (row: DrugItem) => {
await handleSaveRow(row, storeId.value, chinaGridApi.value);
const handleSaveCurrentRow = async (row: DrugItem) => {
await handleSaveRow(row, storeId.value, drugGridApi);
};
const handleSaveWesternRow = async (row: DrugItem) => {
await handleSaveRow(row, storeId.value, westernGridApi.value);
};
const activeProductType = computed(() => Number(activeTab.value) || 1);
// 中药表格配置 - 使用computed包装响应式数据，传入storeId
const chinaMedicineGridOptions = computed(() =>
getChinaMedicineGridOptions(storeId.value, handleSaveChinaRow),
const drugPriceGridOptions = computed(() =>
getDrugPriceGridOptions(
() => storeId.value,
() => activeProductType.value,
handleSaveCurrentRow,
),
);
// 西药表格配置 - 使用computed包装响应式数据，传入storeId
const westernMedicineGridOptions = computed(() =>
getWesternMedicineGridOptions(storeId.value, handleSaveWesternRow),
);
const [ChinaGrid, chinaGridApiInstance] = useVbenVxeGrid({
const [DrugGrid, drugGridApi] = useVbenVxeGrid({
formOptions: drugPriceFormOptions,
gridOptions: chinaMedicineGridOptions,
gridOptions: drugPriceGridOptions,
});
const [WesternGrid, westernGridApiInstance] = useVbenVxeGrid({
formOptions: drugPriceFormOptions,
gridOptions: westernMedicineGridOptions,
watch(activeTab, async (tab, prev) => {
if (!storeId.value || !tab || !prev) {
return;
}
await nextTick();
drugGridApi?.reload?.();
});
chinaGridApi.value = chinaGridApiInstance;
westernGridApi.value = westernGridApiInstance;
// 批量保存（保存当前tab的所有修改）
const handleBatchSaveCurrent = async () => {
if (activeTab.value === '1') {
await handleBatchSave(chinaGridApi.value, storeId.value);
} else {
await handleBatchSave(westernGridApi.value, storeId.value);
}
await handleBatchSave(drugGridApi, storeId.value);
};
// 监听Tab切换，刷新对应表格数据
watch(activeTab, () => {
// Tab切换时刷新对应表格的数据
if (activeTab.value === '1') {
chinaGridApi.value?.reload?.();
} else {
westernGridApi.value?.reload?.();
}
});
const rowImageSrc = (row: DrugItem) => {
return row.image || TCM_PLACEHOLDER_IMAGE;
};
</script>
<template>
<Modal
title="修改药品价格"
class="w-[80%]"
>
<Modal title="修改药品价格" class="w-[80%]">
<div>
<Tabs v-model:activeKey="activeTab">
<TabPane key="1" tab="中药">
<ChinaGrid>
<template #toolbar-buttons>
<Button type="primary" @click="handleBatchSaveCurrent">
批量保存
</Button>
</template>
<template #china-action="{ row }">
<Button
type="link"
size="small"
@click="handleSaveChinaRow(row)"
>
保存
</Button>
</template>
</ChinaGrid>
</TabPane>
<TabPane key="2" tab="西药">
<WesternGrid>
<template #toolbar-buttons>
<Button type="primary" @click="handleBatchSaveCurrent">
批量保存
</Button>
</template>
<template #western-image="{ row }">
<div class="div" style="width: 120px; height: 120px; overflow: scroll">
<Image
:src="
row.image ||
'https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/xk_upload_20250510/cd470ebf97e31c4048ba502ba71b66a3.jpg'
"
height="30"
width="30"
/>
</div>
</template>
<template #western-action="{ row }">
<Button
type="link"
size="small"
@click="handleSaveWesternRow(row)"
>
保存
</Button>
</template>
</WesternGrid>
</TabPane>
<TabPane
v-for="option in productTypeOptions"
:key="String(option.value)"
:tab="option.label"
/>
</Tabs>
<DrugGrid v-if="activeTab">
<template #toolbar-buttons>
<Button type="primary" @click="handleBatchSaveCurrent">
批量保存
</Button>
</template>
<template #drug-image="{ row }">
<div class="div" style="width: 120px; height: 120px; overflow: scroll">
<Image :src="rowImageSrc(row)" height="30" width="30" />
</div>
</template>
<template #row-action="{ row }">
<Button type="link" size="small" @click="handleSaveCurrentRow(row)">
保存
</Button>
</template>
</DrugGrid>
</div>
</Modal>
</template>

226
apps/web-antd/src/views/system/store/config/drug-price-table.ts
View File

@@ -2,6 +2,8 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
import { message } from 'ant-design-vue';
import { getWarehouseProductTypeOptions } from '#/views/business/warehouse-drug-management/admin/api';
import {
getStoreDrugsByTypeApi,
updateStoreDrugPricesApi,
@@ -16,11 +18,21 @@ export interface DrugItem {
buy_price: number;
}
export interface ProductTypeOption {
label: string;
value: number;
}
const TCM_PLACEHOLDER_IMAGE =
'https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/xk_upload_20250510/cd470ebf97e31c4048ba502ba71b66a3.jpg';
export async function fetchProductTypeOptions(): Promise<ProductTypeOption[]> {
const data = await getWarehouseProductTypeOptions();
return Array.isArray(data) ? data : [];
}
/**
* 单行保存函数
* @param row 当前行数据
* @param storeId 诊所ID
* @param gridApi 表格API实例
*/
export const handleSaveRow = async (
row: DrugItem,
@@ -28,12 +40,11 @@ export const handleSaveRow = async (
gridApi: any,
) => {
if (!storeId) {
message.error('诊所ID不能为空');
message.error('门店ID不能为空');
return;
}
try {
// 获取当前行的最新数据（从表格中获取，包含编辑后的值）
const tableData = gridApi?.grid?.getTableData?.();
const fullData = tableData?.fullData || [];
const currentRow = fullData.find((item: DrugItem) => item.id === row.id);
@@ -43,7 +54,6 @@ export const handleSaveRow = async (
return;
}
// 构建提交数据（只提交当前行）
const drugs = [
{
id: currentRow.id,
@@ -52,7 +62,6 @@ export const handleSaveRow = async (
},
];
// 验证数据
for (const drug of drugs) {
if (drug.price < 0 || drug.buy_price < 0) {
message.error('价格不能为负数');
@@ -70,7 +79,6 @@ export const handleSaveRow = async (
});
message.success('保存成功');
// 刷新表格数据
gridApi?.reload?.();
} catch (error: any) {
message.error(error?.message || '保存失败');
@@ -79,24 +87,17 @@ export const handleSaveRow = async (
/**
* 批量保存函数（只保存修改的数据）
* @param gridApi 表格API实例
* @param storeId 诊所ID
*/
export const handleBatchSave = async (
gridApi: any,
storeId: number,
) => {
export const handleBatchSave = async (gridApi: any, storeId: number) => {
if (!storeId) {
message.error('诊所ID不能为空');
message.error('门店ID不能为空');
return;
}
try {
// 使用getRecordset获取修改的记录
const recordset = gridApi?.grid?.getRecordset?.();
const updateRecords = recordset?.updateRecords || [];
// 如果getRecordset没有返回修改记录，尝试获取所有数据
if (updateRecords.length === 0) {
const tableData = gridApi?.grid?.getTableData?.();
const fullData = tableData?.fullData || [];
@@ -106,14 +107,12 @@ export const handleBatchSave = async (
return;
}
// 如果没有修改记录，提交所有数据
const drugs = fullData.map((row: DrugItem) => ({
id: row.id,
price: parseFloat(String(row.price)) || 0,
buy_price: parseFloat(String(row.buy_price)) || 0,
}));
// 验证数据
for (const drug of drugs) {
if (drug.price < 0 || drug.buy_price < 0) {
message.error('价格不能为负数');
@@ -135,17 +134,12 @@ export const handleBatchSave = async (
return;
}
// 构建提交数据（只提交修改过的数据）
const dataToSave = updateRecords;
// 构建提交数据
const drugs = dataToSave.map((row: DrugItem) => ({
const drugs = updateRecords.map((row: DrugItem) => ({
id: row.id,
price: parseFloat(String(row.price)) || 0,
buy_price: parseFloat(String(row.buy_price)) || 0,
}));
// 验证数据
for (const drug of drugs) {
if (drug.price < 0 || drug.buy_price < 0) {
message.error('价格不能为负数');
@@ -163,7 +157,6 @@ export const handleBatchSave = async (
});
message.success('保存成功');
// 刷新表格数据
gridApi?.reload?.();
} catch (error: any) {
message.error(error?.message || '保存失败');
@@ -171,103 +164,29 @@ export const handleBatchSave = async (
};
/**
* 获取中药表格配置
* @param storeId 诊所ID
* @param onSaveRow 单行保存回调函数
* @returns 表格配置对象
* 按 ProductTypeEnum 获取改价表格配置
*/
export const getChinaMedicineGridOptions = (
storeId: number,
export const getDrugPriceGridOptions = (
getStoreId: () => number,
getProductType: () => number,
onSaveRow: (row: DrugItem) => Promise<void>,
): VxeGridProps<DrugItem> => ({
columns: [
): VxeGridProps<DrugItem> => {
const showImage = getProductType() !== 1;
const columns: VxeGridProps<DrugItem>['columns'] = [
{ type: 'seq', width: 60, title: '序号' },
{ field: 'drug_name', title: '药品名称' },
{
field: 'price',
title: '零售价',
editRender: { name: 'input', props: { type: 'number', step: 0.01, min: 0 } },
formatter: ({ cellValue }) => {
if (cellValue === null || cellValue === undefined || cellValue === '') {
return '0.00';
}
const num = parseFloat(String(cellValue));
return isNaN(num) ? '0.00' : num.toFixed(2);
},
},
{
field: 'buy_price',
title: '供货价',
editRender: { name: 'input', props: { type: 'number', step: 0.01, min: 0 } },
formatter: ({ cellValue }) => {
if (cellValue === null || cellValue === undefined || cellValue === '') {
return '0.00';
}
const num = parseFloat(String(cellValue));
return isNaN(num) ? '0.00' : num.toFixed(2);
},
},
{
title: '操作',
slots: { default: 'china-action' },
},
],
editConfig: {
mode: 'cell',
trigger: 'click',
showStatus: true,
},
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
if (!storeId) {
return { items: [], total: 0 };
}
const res = await getStoreDrugsByTypeApi(storeId, 1);
let items = res || [];
];
// 如果有关键词搜索，进行过滤
if (formValues?.drug_name) {
const keyword = String(formValues.drug_name).toLowerCase();
items = items.filter((item: DrugItem) =>
item.drug_name?.toLowerCase().includes(keyword),
);
}
return { items, total: items.length };
},
},
},
toolbarConfig: {
search: true,
refresh: true,
zoom: true,
slots: {
buttons: 'toolbar-buttons',
},
},
height: 500,
showOverflow: true,
});
/**
* 获取西药表格配置
* @param storeId 诊所ID
* @param onSaveRow 单行保存回调函数
* @returns 表格配置对象
*/
export const getWesternMedicineGridOptions = (
storeId: number,
onSaveRow: (row: DrugItem) => Promise<void>,
): VxeGridProps<DrugItem> => ({
columns: [
{ type: 'seq', width: 60, title: '序号' },
{ field: 'drug_name', title: '药品名称' },
{
if (showImage) {
columns.push({
field: 'image',
title: '图片',
slots: { default: 'western-image' },
},
slots: { default: 'drug-image' },
});
}
columns.push(
{
field: 'price',
title: '零售价',
@@ -294,43 +213,50 @@ export const getWesternMedicineGridOptions = (
},
{
title: '操作',
slots: { default: 'western-action' },
slots: { default: 'row-action' },
},
],
editConfig: {
mode: 'cell',
trigger: 'click',
showStatus: true,
},
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
if (!storeId) {
return { items: [], total: 0 };
}
const res = await getStoreDrugsByTypeApi(storeId, 2);
let items = res || [];
);
// 如果有关键词搜索，进行过滤
if (formValues?.drug_name) {
const keyword = String(formValues.drug_name).toLowerCase();
items = items.filter((item: DrugItem) =>
item.drug_name?.toLowerCase().includes(keyword),
);
}
return {
columns,
editConfig: {
mode: 'cell',
trigger: 'click',
showStatus: true,
},
proxyConfig: {
ajax: {
query: async (_ctx, formValues) => {
const storeId = getStoreId();
const productType = getProductType();
if (!storeId) {
return { items: [], total: 0 };
}
const res = await getStoreDrugsByTypeApi(storeId, productType);
let items = res || [];
return { items, total: items.length };
if (formValues?.drug_name) {
const keyword = String(formValues.drug_name).toLowerCase();
items = items.filter((item: DrugItem) =>
item.drug_name?.toLowerCase().includes(keyword),
);
}
return { items, total: items.length };
},
},
},
},
toolbarConfig: {
search: true,
refresh: true,
zoom: true,
slots: {
buttons: 'toolbar-buttons',
toolbarConfig: {
search: true,
refresh: true,
zoom: true,
slots: {
buttons: 'toolbar-buttons',
},
},
},
height: 500,
showOverflow: true,
});
height: 500,
showOverflow: true,
};
};
export { TCM_PLACEHOLDER_IMAGE };

9
apps/web-antd/src/views/system/supplier/config/form.ts
View File

@@ -41,7 +41,8 @@ export const modalFormProps: VbenFormProps = {
component: 'Avatar',
fieldName: 'logo',
label: 'LOGO',
rules: 'required',
defaultValue: 'https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/xk_upload_20250108/1bb87d41d15fe27b500a4bfcde01bb0e.png',
// rules: 'required',
},
{
component: 'VbenInput',
@@ -65,14 +66,14 @@ export const modalFormProps: VbenFormProps = {
component: 'Avatar',
fieldName: 'open_business_license',
label: '营业执照',
rules: 'required',
// rules: 'required',
formItemClass: 'col-span-6',
},
{
component: 'Avatar',
fieldName: 'business_license',
label: '生产许可证',
rules: 'required',
// rules: 'required',
formItemClass: 'col-span-6',
},
{
@@ -80,7 +81,7 @@ export const modalFormProps: VbenFormProps = {
fieldName: 'product_registration_certificate',
label: '产品注册证',
formItemClass: 'col-span-6',
rules: 'required',
// rules: 'required',
},
],
showDefaultActions: false,