2023-09-21 10:53:24 +08:00

425 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<a-form :model="queryForm" ref="queryFormRef" layout="inline">
<a-form-item field="prescription_code" label="处方编号">
<a-input :style="{ width: '182px' }" v-model="queryForm.prescription_code" placeholder="请输入处方编号" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="inquiry_no" label="问诊编号">
<a-input :style="{ width: '182px' }" v-model="queryForm.inquiry_no" placeholder="请输入问诊订单编号" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="order_product_no" label="药品编号">
<a-input :style="{ width: '182px' }" v-model="queryForm.order_product_no" placeholder="请输入药品订单编号" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="doctor_name" label="医生姓名">
<a-input :style="{ width: '182px' }" v-model="queryForm.doctor_name" placeholder="请输入医生姓名" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="patient_name" label="患者姓名">
<a-input :style="{ width: '182px' }" v-model="queryForm.patient_name" placeholder="请输入患者姓名" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="mobile" label="电话号码">
<a-input :style="{ width: '182px' }" v-model="queryForm.mobile" placeholder="请输入医生或者患者电话号码" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="prescription_status" label="处方状态">
<a-select
v-model="queryForm.prescription_status"
placeholder="请选择处方状态"
:style="{ width: '182px' }"
>
<!-- 处方状态1:待审核 2:待使用 3:已失效 4:已使用 -->
<a-option value="1">待审核</a-option>
<a-option value="2">待使用</a-option>
<a-option value="3">已失效</a-option>
<a-option value="4">已使用</a-option>
</a-select>
</a-form-item>
<a-form-item field="pharmacist_audit_status" label="审核状态">
<a-select
v-model="queryForm.pharmacist_audit_status"
placeholder="请选择审核状态"
:style="{ width: '182px' }"
>
<!-- 0:审核中 1:审核成功 2:审核驳回 -->
<a-option value="0">审核中</a-option>
<a-option value="1">审核成功</a-option>
<a-option value="2">审核驳回</a-option>
</a-select>
</a-form-item>
<a-row>
<a-form-item field="pharmacist_verify_range_time" label="审核时间范围">
<a-range-picker
style="width: 330px"
v-model="queryForm.pharmacist_verify_range_time"
/>
</a-form-item>
<a-form-item field="create_range_time" label="开具时间范围">
<a-range-picker
style="width: 330px"
v-model="queryForm.create_range_time"
/>
</a-form-item>
<a-form-item field="expired_range_time" label="过期时间范围">
<a-range-picker
style="width: 330px"
v-model="queryForm.expired_range_time"
/>
</a-form-item>
<a-form-item>
<a-space>
<a-button type="primary" @click="handleQuery"
><icon-search /> 搜索</a-button
>
<a-button @click="handleResetQuery"><icon-loop /> 重置</a-button>
</a-space>
</a-form-item>
</a-row>
</a-form>
<a-divider />
<!-- action -->
<div class="action">
<a-space>
<a-button v-has="'admin:sysPrescriptionList:add'" type="primary" @click="handleAdd"><icon-plus /> 新增 </a-button>
<!-- <a-button v-has="'admin:sysPrescriptionList:remove'" type="primary" status="danger"><icon-delete /> 批量删除 </a-button> -->
</a-space>
</div>
<!-- table -->
<a-table :columns="columns" :data="tableData"
:scroll="{ x: 1400 }"
:row-selection="{ type: 'checkbox', showCheckedAll: true }"
:pagination="{ 'show-total': true, 'show-jumper': true, 'show-page-size': true, total: pager.total, current: currentPage }"
row-key="doctor_id" @selection-change="(selection) => {deleteData = selection;console.log(selection)}"
@page-change="handlePageChange" @page-size-change="handlepage_sizeChange">
<template #doctor_id="{record,rowIndex}">
<div>{{(rowIndex+1)+(pager.page-1)*10}}</div>
</template>
<template #prescription_status="{ record }">
<span>{{formatPrescriptionStatus(record.prescription_status)}}</span>
</template>
<template #is_platform_deep_cooperation="{ record }">
<a-tag v-if="record.is_platform_deep_cooperation == 0" color="gray">否</a-tag>
<a-tag v-else color="green">是</a-tag>
</template>
<template #doctor_name="{record}">
<div class="doctor_name" :title="record.doctor_name">{{ record.doctor_name }}</div>
</template>
<template #pharmacist_name="{record}">
<div class="doctor_name" :title="record.pharmacist_name">{{record.pharmacist_name}}</div>
</template>
<template #patient_name="{record}">
<div class="doctor_name" :title="record.patient_name">{{record.patient_name}}({{
record.patient_sex == 1 ? '男,' : '女,'
}}{{ record.patient_age }}岁)</div>
</template>
<template #order_prescription_icd="{record}">
<div class="doctor_name" :title="record.order_prescription_icd">{{record.order_prescription_icd}}</div>
</template>
<template #action="{ record }">
<a-space>
<a-button v-has="'admin:sysPrescriptionList:detail'" type="text"
@click="handleDetail(record)"><icon-book />详情</a-button>
<!-- <a-button v-has="'admin:sysPrescriptionList:edit'" type="text" @click="handleUpdate(record)"><icon-edit />
修改</a-button> -->
<!-- <a-button v-has="'admin:sysPrescriptionList:remove'" type="text"
@click="() => { deleteVisible = true; deleteData = [record.doctor_id]; }"><icon-delete /> 删除</a-button> -->
</a-space>
</template>
</a-table>
<familyModal :modalVisible="modalVisible" :modalForm="modalForm" @familyVisibleChange="()=>{modalVisible=false}"></familyModal>
<!-- Akiraka 20230223 删除与批量删除 开始 -->
<!-- <DeleteModal :data="deleteData" :visible="deleteVisible" :apiDelete="removePrescription"
@deleteVisibleChange="() => deleteVisible = false" /> -->
<!-- Akiraka 20230223 删除与批量删除 结束 -->
<a-modal v-model:visible="okVisible" :modal-style="{width:'320px'}" body-class="okmodal"
@cancel="()=>okVisible=false">
<template #title>
提示
</template>
<div>确定保存当前信息?</div>
</a-modal>
</div>
</template>
<script setup>
import { reactive, ref, getCurrentInstance, onMounted, nextTick, watch, computed } from 'vue';
import { getPrescriptionList,getPrescriptionDetail} from '@/api/prescription/list';
import {formatPrescriptionStatus} from "@/utils/format"
// Akiraka 20230210 删除数据
const deleteData = ref([])
// Akiraka 20230210 删除对话框
const deleteVisible = ref(false)
// Akiraka 20230210 监听删除事件
const okVisible = ref(false);
watch(() => deleteVisible.value, (value) => {
if (value == false) {
getPrescriptionInfo(pager);
}
});
const file = ref();
const { proxy } = getCurrentInstance();
const currentPage = ref(1);
const family_data=ref([]);
const family_columns=ref([{
title: '编号',
dataIndex: 'code',
slotName:'code'
},{
title: '就诊人姓名',
dataIndex: 'card_name_mask',
},{
title: '身份证号',
dataIndex: 'id_number_mask',
},{
title: '与账号关系',
dataIndex: 'relation',
slotName:'relation'
},{
title: '添加时间',
dataIndex: 'created_at',
slotName:'created_at'
}, { title: '操作', slotName: 'action'}])
// Pager
const pager = {
total: 0,
page: 1,
page_size: 10,
};
// form
const queryForm = reactive({
});
const modalForm = reactive({
user:{},
avatar: 'https://img.applets.igandanyiyuan.com/basic/file/patient_avatar.png',
});
// Modal
const modalVisible = ref(false);
const modalTitle = ref('默认标题');
watch(() => queryForm.pharmacist_verify_range_time,
(value) => {
if (value) {
let [startTime, endTime] = value;
queryForm.pharmacist_verify_time = startTime + '&' + endTime;
} else {
queryForm.pharmacist_verify_time = '';
}
}
);
watch(() => queryForm.create_range_time,
(value) => {
if (value) {
let [startTime, endTime] = value;
queryForm.doctor_created_time = startTime + '&' + endTime;
} else {
queryForm.doctor_created_time = '';
}
}
);
watch(() => queryForm.expired_range_time,
(value) => {
if (value) {
let [startTime, endTime] = value;
queryForm.expired = startTime + '&' + endTime;
} else {
queryForm.expired = '';
}
}
);
// Batch Del List
let batchList = [];
// Table Columns
const columns = [
{ title: '编号', dataIndex: 'doctor_id', slotName: 'doctor_id', width: '90' },
{ title: '处方编号', dataIndex: 'order_prescription_id',width:180 },
{ title: '医生姓名', dataIndex: 'doctor_name',slotName: 'doctor_name', width: 150 },
{ title: '药师姓名', dataIndex: 'pharmacist_name',slotName:'pharmacist_name' },
{ title: '就诊人', dataIndex: 'patient_name', slotName: 'patient_name',width:180 },
{ title: '就诊人联系电话', dataIndex: 'mobile',width:130 },
{ title: '诊断', dataIndex: 'order_prescription_icd',slotName: 'order_prescription_icd' },
{ title: '处方状态', dataIndex: 'prescription_status',slotName:'prescription_status' },
{ title: '开方时间', dataIndex: 'created_at',slotName:'created_at',width:180 },
{ title: '操作', slotName: 'action', fixed: "right", width: 120 },
];
// Table Data
const tableData = ref([]);
//弹框状态
const modalSatus = ref('add');
// 新增Satus
const handleAdd = () => {
modalVisible.value = true;
modalTitle.value = '新增患者';
modalSatus.value = 'add';
modalForm.patient_id = null;
};
//详情
const handleDetail = async (record) => {
const { code, data, message } = await getPrescriptionDetail(record.family_id);
if (code == 200) {
Object.assign(modalForm, data);
modalVisible.value = true;
}
};
// 批量删除
const handleBatchDelete = () => {
if (batchList.length !== 0) {
proxy.$modal.warning({
title: '提示',
content: '是否批量删除以下选中的数据?',
hideCancel: false,
onOk: async () => {
const res = await removePrescription({ ids: batchList });
proxy.$message.success(res.message);
getPrescriptionInfo(pager);
},
onCancel: () => {
proxy.$message.info('已取消批量删除数据');
},
});
} else {
proxy.$message.error('请勾选需要删除的数据!');
}
};
/**
* 分页改变
* @param {Number} [page]
*/
const handlePageChange = (page) => {
pager.page = page;
// 修改当前页码
currentPage.value = page;
getPrescriptionInfo({ ...pager, ...queryForm });
};
// 每页数据量
const handlepage_sizeChange = (page_size) => {
pager.page_size = page_size;
getPrescriptionInfo({ ...pager, ...queryForm });
};
// 获取患者信息
const getPrescriptionInfo = async (params = {}) => {
const { data, code, message } = await getPrescriptionList(params);
if (code == 200) {
tableData.value = data.data;
Object.assign(pager, { total: data.total, page: data.page, page_size: data.page_size });
}
};
// 查询患者信息
const handleQuery = async () => {
pager.page = 1;
const params = {
page: pager.page,
page_size: pager.page_size,
...queryForm,
};
getPrescriptionInfo(params);
};
// 重置搜索
const handleResetQuery = () => {
proxy.$refs.queryFormRef.resetFields();
//getPrescriptionInfo(queryForm);
currentPage.value=1;
//getProductInfo(queryForm);
handleQuery();
}
onMounted(() => {
getPrescriptionInfo(pager);
});
</script>
<style lang="scss" scoped>
.action {
margin-bottom: 12px;
}
.okmodal div {
text-align: center;
}
.hospital_name {
width: 140px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.headImg {
margin-right: 20px;
border-radius: 50%;
width: 80px;
height: 80px;
}
.arco-form-item-layout-horizontal:first-child,
.arco-form-item-layout-horizontal:nth-child(2) {
align-items: center;
}
.cellbox{
margin-top: 35px;
}
.cellbox .cell{
width:50%;
border-bottom:1px dashed #efefef;
margin-bottom: 20px;
}
.cellbox .cell:first-child{
border: none;
}
.cell{
.arco-form-item{
margin-bottom: 10px;
}
}
.box {
display: flex;
align-items: center;
}
.cert .arco-form-item-label-col {
flex: 0 0 8px !important;
}
.red {
display: inline-block;
margin-right: 5px;
font-size: 14px;
color: red;
margin-top: 5px;
}
.cardNum {
width: 148px;
}
.codbox{
display: flex;
align-items: center;
}
.doctor_name{
max-width:250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>