224 lines
8.1 KiB
Vue
224 lines
8.1 KiB
Vue
|
<template>
|
|||
|
|
<el-drawer v-loading="loading" :close-on-click-modal="false" :model-value="visible" title="药品详情" size="70%"
|
|||
|
|
style="--el-drawer-padding-primary: 0" @close="close">
|
|||
|
|
<my-layout>
|
|||
|
|
<layout-main>
|
|||
|
|
<el-form :label-width="140" label-suffix="：" class="p-15px pr-30px" :class="loading ? 'pointer-events-none' : ''">
|
|||
|
|
<div active-title-bar class="my-2.5">药品基本信息</div>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="12" v-for="item in basicInfoList" :key="item.prop">
|
|||
|
|
<el-form-item class="mb-5px" :label="item.label" :prop="item.prop"
|
|||
|
|
:class="requiredMap[item.prop] ? 'is-required' : ''">
|
|||
|
|
{{ form[item.prop] }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<div active-title-bar class="my-2.5">药品标准用法用量</div>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="12" v-for="item in usageInfo" :key="item.prop">
|
|||
|
|
<el-form-item class="mb-5px" :label="item.label" :prop="item.prop"
|
|||
|
|
:class="requiredMap[item.prop] ? 'is-required' : ''">
|
|||
|
|
{{ form[item.prop] }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<div active-title-bar class="my-2.5">药品规则配置</div>
|
|||
|
|
<el-row v-if="libType === 'online'">
|
|||
|
|
<el-col :span="12" v-for="item in otherInfo" :key="item.prop">
|
|||
|
|
<el-form-item class="mb-5px" :label="item.label" :prop="item.prop"
|
|||
|
|
:class="requiredMap[item.prop] ? 'is-required' : ''">
|
|||
|
|
{{ form[item.prop] }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="24">
|
|||
|
|
<el-form-item class="mb-5px" label="是否上传用药证明">
|
|||
|
|
{{ form.need_medication_proof }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="24">
|
|||
|
|
<el-form-item class="mb-5px" label="是否限制使用范围">
|
|||
|
|
{{ form.has_usage_restriction }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<div active-title-bar class="my-2.5">药品维护记录</div>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="12" v-for="item in maintenanceInfo" :key="item.prop">
|
|||
|
|
<el-form-item class="mb-5px" :label="item.label" :prop="item.prop"
|
|||
|
|
:class="requiredMap[item.prop] ? 'is-required' : ''">
|
|||
|
|
{{ form[item.prop] }}
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</el-form>
|
|||
|
|
</layout-main>
|
|||
|
|
<layout-item>
|
|||
|
|
<div common-shadow--r class="text-center py-10px">
|
|||
|
|
<el-button plain type="primary" class="w-100px" @click="close()">取消</el-button>
|
|||
|
|
<el-button :type="data.onSale ? 'info' : 'success'" class="w-100px" @click="setOnSale()">
|
|||
|
|
{{ data.onSale ? '下架' : '上架' }}
|
|||
|
|
</el-button>
|
|||
|
|
<el-button type="primary" class="w-100px" @click="edit()">编辑</el-button>
|
|||
|
|
|
|||
|
|
<!-- <el-button class="w-100px" :loading="loading" type="primary" @click="save()">保存</el-button> -->
|
|||
|
|
</div>
|
|||
|
|
</layout-item>
|
|||
|
|
</my-layout>
|
|||
|
|
</el-drawer>
|
|||
|
|
</template>
|
|||
|
|
<script setup>
|
|||
|
|
import { computed, ref, watch } from 'vue';
|
|||
|
|
import { storeToRefs } from "pinia";
|
|||
|
|
import { ElMessage, ElMessageBox } from "element-plus";
|
|||
|
|
import dayjs from "dayjs";
|
|||
|
|
import { setHlwDrugOnSale, setOnlineDrugOnSale } from "@/api/hlw";
|
|||
|
|
import { drugFieldDict } from './drug-dict.js'
|
|||
|
|
import { memberStore } from "@/store/member";
|
|||
|
|
|
|||
|
|
import MyLayout, { LayoutMain, LayoutItem } from "@/components/layout";
|
|||
|
|
|
|||
|
|
const emits = defineEmits(['close', 'edit', 'changeSale'])
|
|||
|
|
const props = defineProps({
|
|||
|
|
visible: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: false
|
|||
|
|
},
|
|||
|
|
// 库类型：hlw = 互联网医院药品库(drug-info)，online = 配送/线上药品库(online-drug-info)
|
|||
|
|
libType: {
|
|||
|
|
type: String,
|
|||
|
|
default: 'hlw'
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
type: Object,
|
|||
|
|
default: () => ({})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
const { memberInfo } = storeToRefs(memberStore());
|
|||
|
|
|
|||
|
|
const basicInfo = [
|
|||
|
|
{ label: '药品名称', prop: "name" },
|
|||
|
|
{ label: '药品规格', prop: "specification" },
|
|||
|
|
{ label: '包装单位', prop: "unit" },
|
|||
|
|
{ label: '包装量', prop: "package_amount" },
|
|||
|
|
{ label: '生产厂家', prop: "manufacturer" },
|
|||
|
|
{ label: '商品条形码', prop: "barcode" },
|
|||
|
|
{ label: '医保编码', prop: "insurance_code" },
|
|||
|
|
{ label: '药品类型', prop: "category" },
|
|||
|
|
{ label: '药品拼音码', prop: "pinyin_code" },
|
|||
|
|
{ label: '药库货品ID', prop: "product_id" },
|
|||
|
|
{ label: '通用名', prop: "generic_name" },
|
|||
|
|
{ label: '通用名拼音码', prop: "generic_pinyin" },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
// 在线药品库扩展展示字段：管理分类 + 剂型
|
|||
|
|
const onlineBasicInfoExtra = [
|
|||
|
|
{ label: '管理分类', prop: "manage_category" },
|
|||
|
|
{ label: '剂型', prop: "dosage_form" },
|
|||
|
|
{ label: 'hisID', prop: "his_drug_code" },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const basicInfoList = computed(() => {
|
|||
|
|
return props.libType === 'online'
|
|||
|
|
? [...basicInfo, ...onlineBasicInfoExtra]
|
|||
|
|
: basicInfo;
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
const usageInfo = [
|
|||
|
|
{ label: '单次标准剂量', prop: "dosage" },
|
|||
|
|
{ label: '剂量单位', prop: "dosage_unit" },
|
|||
|
|
{ label: '给药标准频次', prop: "frequency" },
|
|||
|
|
{ label: '给药标准方式', prop: "administration_method" },
|
|||
|
|
{ label: '用药标准天数', prop: "days" },
|
|||
|
|
{ label: '发药标准数量', prop: "recommended_quantity" },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const maintenanceInfo = [
|
|||
|
|
{ label: '平台ID', prop: "_id" },
|
|||
|
|
{ label: '当前状态', prop: "onSale" },
|
|||
|
|
{ label: '创建时间', prop: "createTime" },
|
|||
|
|
{ label: '创建人', prop: "creator" },
|
|||
|
|
{ label: '最近更新时间', prop: "updateTime" },
|
|||
|
|
{ label: '最近更新人', prop: "updater" },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const otherInfo = [
|
|||
|
|
{ label: '适用性别', prop: 'suitableGender' },
|
|||
|
|
{ label: '是否儿童用药', prop: 'suitableChild' },
|
|||
|
|
{ label: '重复用药标识', prop: 'repeatTag' },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const requiredMap = drugFieldDict.reduce((m, cur) => {
|
|||
|
|
m[cur.field] = typeof cur.required === 'boolean' ? cur.required : false
|
|||
|
|
return m
|
|||
|
|
}, {})
|
|||
|
|
|
|||
|
|
const showForm = computed(() => {
|
|||
|
|
const genderMap = { common: '通用', male: '男', female: '女' };
|
|||
|
|
|
|||
|
|
let repeatTag = props.data.repeatTag;
|
|||
|
|
if (Array.isArray(repeatTag)) {
|
|||
|
|
repeatTag = repeatTag.join('，');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return {
|
|||
|
|
onSale: props.data.onSale ? '已上架' : '已下架',
|
|||
|
|
createTime: props.data.createTime && dayjs(props.data.createTime).isValid() ? dayjs(props.data.createTime).format('YYYY-MM-DD HH:mm:ss') : '',
|
|||
|
|
updateTime: props.data.updateTime && dayjs(props.data.updateTime).isValid() ? dayjs(props.data.updateTime).format('YYYY-MM-DD HH:mm:ss') : '',
|
|||
|
|
// 如果存在描述文本，则认为为“是”，并展示描述；否则为“否”。保持与编辑抽屉的语义一致。
|
|||
|
|
need_medication_proof: props.data.medication_proof_desc ? `是（${props.data.medication_proof_desc}）` : '否',
|
|||
|
|
has_usage_restriction: props.data.usage_restriction_desc ? `是（${props.data.usage_restriction_desc}）` : '否',
|
|||
|
|
suitableGender: genderMap[props.data.suitableGender] || props.data.suitableGender,
|
|||
|
|
suitableChild: props.data.suitableChild ? '是' : '否',
|
|||
|
|
repeatTag,
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
const form = computed(() => ({ ...props.data, ...showForm.value }))
|
|||
|
|
const loading = ref(false)
|
|||
|
|
|
|||
|
|
|
|||
|
|
function close() {
|
|||
|
|
if (loading.value) return;
|
|||
|
|
emits('close', false)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function edit() {
|
|||
|
|
if (loading.value) return;
|
|||
|
|
close()
|
|||
|
|
emits('edit')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function setOnSale() {
|
|||
|
|
await ElMessageBox.confirm(`确定${props.data.onSale ? '下架' : '上架'}药品吗？`, '提示', {
|
|||
|
|
confirmButtonText: '确定',
|
|||
|
|
cancelButtonText: '取消',
|
|||
|
|
type: 'warning',
|
|||
|
|
});
|
|||
|
|
const onSale = !props.data.onSale;
|
|||
|
|
const isOnline = props.libType === 'online';
|
|||
|
|
const { success, message } = await (isOnline
|
|||
|
|
? setOnlineDrugOnSale({
|
|||
|
|
ids: [props.data._id],
|
|||
|
|
onSale,
|
|||
|
|
updater: memberInfo.value.anotherName,
|
|||
|
|
updaterId: memberInfo.value._id,
|
|||
|
|
})
|
|||
|
|
: setHlwDrugOnSale({
|
|||
|
|
ids: [props.data._id],
|
|||
|
|
onSale,
|
|||
|
|
updater: memberInfo.value.anotherName,
|
|||
|
|
updaterId: memberInfo.value._id,
|
|||
|
|
}));
|
|||
|
|
if (success) {
|
|||
|
|
ElMessage.success(message);
|
|||
|
|
emits('changeSale', onSale)
|
|||
|
|
} else {
|
|||
|
|
ElMessage.error(message);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</script>
|