147 lines
4.2 KiB
Vue
147 lines
4.2 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<el-form
|
|
:model="queryParams"
|
|
ref="queryRef"
|
|
:inline="true"
|
|
v-show="showSearch"
|
|
>
|
|
<el-form-item label="查询内容" prop="searchKey">
|
|
<el-input
|
|
v-model="queryParams.searchKey"
|
|
placeholder="身份证号/病人ID/门诊号/姓名"
|
|
clearable
|
|
style="width: 210px"
|
|
@keyup.enter="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="电话" prop="phone">
|
|
<el-input
|
|
v-model="queryParams.phone"
|
|
placeholder="请输入联系方式"
|
|
clearable
|
|
style="width: 200px"
|
|
@keyup.enter="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="起始时间">
|
|
<el-date-picker
|
|
v-model="dateRange"
|
|
value-format="YYYY-MM-DD"
|
|
type="daterange"
|
|
range-separator="-"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
></el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item label="医生" prop="doctorName">
|
|
<el-select
|
|
v-model="queryParams.doctorName"
|
|
placeholder="请选择医生"
|
|
clearable
|
|
@keyup.enter="handleQuery"
|
|
style="width: 160px"
|
|
>
|
|
<el-option
|
|
v-for="item in doctorOptions"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.label"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" icon="Search" @click="handleQuery"
|
|
>搜索</el-button
|
|
>
|
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<el-table :data="outpatienRecordsList" border style="width: 100%">
|
|
<el-table-column prop="name" label="患者" width="180" />
|
|
<el-table-column prop="idCard" label="身份证" width="180" />
|
|
<el-table-column prop="description" label="疾病" width="180" />
|
|
<el-table-column prop="patientBusNo" label="病人ID" width="180" />
|
|
<el-table-column prop="encounterBusNo" label="门诊号" width="180" />
|
|
<el-table-column prop="genderEnum_enumText" label="性别" width="80" />
|
|
<el-table-column prop="phone" label="电话" width="120" />
|
|
<el-table-column prop="encounterTime" label="就诊时间" width="180" />
|
|
<el-table-column
|
|
prop="subjectStatusEnum_enumText"
|
|
label="状态"
|
|
width="120"
|
|
/>
|
|
<el-table-column prop="organizationName" label="接诊医院" width="180" />
|
|
<el-table-column prop="doctorName" label="接诊医生" width="180" />
|
|
</el-table>
|
|
<pagination
|
|
v-show="total > 0"
|
|
:total="total"
|
|
v-model:page="queryParams.pageNo"
|
|
v-model:limit="queryParams.pageSize"
|
|
@pagination="getList"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup name="outpatienRecords">
|
|
import { ref, computed } from "vue";
|
|
import { listOutpatienRecords, listDoctorNames } from "./component/api";
|
|
|
|
const showSearch = ref(true);
|
|
const total = ref(0);
|
|
const dateRange = ref([]);
|
|
const outpatienRecordsList = ref([]);
|
|
const doctorList = ref([]);
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
|
const data = reactive({
|
|
form: {},
|
|
queryParams: {
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
doctorName: undefined,
|
|
searchKey: undefined,
|
|
phone: undefined,
|
|
patientid: undefined,
|
|
},
|
|
});
|
|
const { queryParams } = toRefs(data);
|
|
|
|
const doctorOptions = computed(() => {
|
|
return doctorList.value.map((name, index) => ({
|
|
value: index, // 使用索引作为 value
|
|
label: name, // 使用名字作为 label
|
|
}));
|
|
});
|
|
|
|
/** 查询门诊记录列表 */
|
|
function getList() {
|
|
listOutpatienRecords(queryParams.value).then((response) => {
|
|
outpatienRecordsList.value = response.data.records;
|
|
total.value = response.data.total;
|
|
});
|
|
listDoctorNames().then((response) => {
|
|
console.log(response);
|
|
doctorList.value = response.data;
|
|
});
|
|
}
|
|
|
|
/** 搜索按钮操作 */
|
|
function handleQuery() {
|
|
queryParams.value.beginTime = dateRange.value[0];
|
|
queryParams.value.endTime = dateRange.value[1];
|
|
queryParams.value.pageNo = 1;
|
|
getList();
|
|
}
|
|
/** 重置按钮操作 */
|
|
function resetQuery() {
|
|
dateRange.value = [];
|
|
proxy.resetForm("queryRef");
|
|
handleQuery();
|
|
}
|
|
|
|
getList();
|
|
</script> |