refactor(surgical): 重构手术安排界面组件结构
- 移除原有的表格和表单相关代码 - 简化页面布局结构 - 保留新增手术安排按钮功能 - 清理相关的数据属性和方法定义 - 优化组件的整体架构设计
This commit is contained in:
@@ -58,312 +58,6 @@
|
|||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="mb8">
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['surgical:schedule:add']">
|
|
||||||
新增
|
|
||||||
</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate" v-hasPermi="['surgical:schedule:edit']">
|
|
||||||
修改
|
|
||||||
</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['surgical:schedule:remove']">
|
|
||||||
删除
|
|
||||||
</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="scheduleList" @selection-change="handleSelectionChange">
|
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
|
||||||
<el-table-column label="手术单号" align="center" prop="operCode" />
|
|
||||||
<el-table-column label="患者姓名" align="center" prop="patientName" />
|
|
||||||
<el-table-column label="性别" align="center" prop="sex" :formatter="sexFormat" />
|
|
||||||
<el-table-column label="年龄" align="center" prop="age" />
|
|
||||||
<el-table-column label="申请科室" align="center" prop="applyDeptName" />
|
|
||||||
<el-table-column label="安排时间" align="center" prop="scheduleDate" width="180">
|
|
||||||
<template #default="scope">
|
|
||||||
{{ parseTime(scope.row.scheduleDate, '{y}-{m}-{d} {h}:{i}') }}
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="手术名称" align="center" prop="operationName" />
|
|
||||||
<el-table-column label="手术医师" align="center" prop="surgeonName" />
|
|
||||||
<el-table-column label="麻醉方法" align="center" prop="anesthesiaMethod" :formatter="anesthesiaMethodFormat" />
|
|
||||||
<el-table-column label="外请专家姓名" align="center" prop="expertName" />
|
|
||||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
||||||
<template #default="scope">
|
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['surgical:schedule:edit']">修改</el-button>
|
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['surgical:schedule:remove']">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
|
|
||||||
<!-- 添加或修改门诊手术安排对话框 -->
|
|
||||||
<el-dialog :title="title" v-model="open" width="800px" append-to-body>
|
|
||||||
<el-form ref="scheduleRef" :model="form" :rules="rules" label-width="120px">
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="手术单号" prop="operCode">
|
|
||||||
<el-input v-model="form.operCode" placeholder="请输入手术单号" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="患者姓名" prop="patientName">
|
|
||||||
<el-input v-model="form.patientName" placeholder="请输入患者姓名" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="性别" prop="sex">
|
|
||||||
<el-select v-model="form.sex" placeholder="请选择性别">
|
|
||||||
<el-option label="男" value="1" />
|
|
||||||
<el-option label="女" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="年龄" prop="age">
|
|
||||||
<el-input v-model="form.age" placeholder="请输入年龄" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="申请科室" prop="applyDeptId">
|
|
||||||
<el-select v-model="form.applyDeptId" placeholder="请选择申请科室" @change="handleApplyDeptChange">
|
|
||||||
<el-option
|
|
||||||
v-for="dept in deptList"
|
|
||||||
:key="dept.id"
|
|
||||||
:label="dept.name"
|
|
||||||
:value="dept.id"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="安排时间" prop="scheduleDate">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.scheduleDate"
|
|
||||||
type="datetime"
|
|
||||||
placeholder="选择安排时间"
|
|
||||||
format="YYYY-MM-DD HH:mm"
|
|
||||||
value-format="YYYY-MM-DD HH:mm:ss"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="手术名称" prop="operationName">
|
|
||||||
<el-input v-model="form.operationName" placeholder="请输入手术名称" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="手术医师" prop="surgeonId">
|
|
||||||
<el-select v-model="form.surgeonId" placeholder="请选择手术医师">
|
|
||||||
<el-option
|
|
||||||
v-for="doctor in doctorList"
|
|
||||||
:key="doctor.id"
|
|
||||||
:label="doctor.name"
|
|
||||||
:value="doctor.id"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="麻醉方法" prop="anesthesiaMethod">
|
|
||||||
<el-select v-model="form.anesthesiaMethod" placeholder="请选择麻醉方法">
|
|
||||||
<el-option
|
|
||||||
v-for="item in anesthesiaMethodOptions"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="外请专家姓名" prop="expertId">
|
|
||||||
<el-select v-model="form.expertId" placeholder="请选择外请专家">
|
|
||||||
<el-option
|
|
||||||
v-for="expert in expertList"
|
|
||||||
:key="expert.id"
|
|
||||||
:label="expert.name"
|
|
||||||
:value="expert.id"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="麻醉医师" prop="anesthetistId">
|
|
||||||
<el-select v-model="form.anesthetistId" placeholder="请选择麻醉医师">
|
|
||||||
<el-option
|
|
||||||
v-for="doctor in anesthetistList"
|
|
||||||
:key="doctor.id"
|
|
||||||
:label="doctor.name"
|
|
||||||
:value="doctor.id"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="手术室" prop="operatingRoomId">
|
|
||||||
<el-select v-model="form.operatingRoomId" placeholder="请选择手术室">
|
|
||||||
<el-option
|
|
||||||
v-for="room in operatingRoomList"
|
|
||||||
:key="room.id"
|
|
||||||
:label="room.roomName"
|
|
||||||
:value="room.id"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="24">
|
|
||||||
<el-form-item label="备注" prop="remark">
|
|
||||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-form>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
||||||
<el-button @click="cancel">取 消</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup name="SurgicalSchedule">
|
|
||||||
import { listSurgicalSchedule, getSurgicalSchedule, delSurgicalSchedule, addSurgicalSchedule, updateSurgicalSchedule } from "@/api/surgical/surgicalSchedule";
|
|
||||||
import { listDept } from "@/api/system/dept";
|
|
||||||
import { listDoctorByDeptId } from "@/api/system/doctor";
|
|
||||||
import { listExpert } from "@/api/surgical/expert";
|
|
||||||
import { listOperatingRoom } from "@/api/surgical/operatingRoom";
|
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const { userStore } = useUserStore();
|
|
||||||
|
|
||||||
const scheduleList = ref([]);
|
|
||||||
const open = ref(false);
|
|
||||||
const loading = ref(true);
|
|
||||||
const showSearch = ref(true);
|
|
||||||
const ids = ref([]);
|
|
||||||
const single = ref(true);
|
|
||||||
const multiple = ref(true);
|
|
||||||
const total = ref(0);
|
|
||||||
const title = ref("");
|
|
||||||
const deptList = ref([]);
|
|
||||||
const doctorList = ref([]);
|
|
||||||
const anesthetistList = ref([]);
|
|
||||||
const expertList = ref([]);
|
|
||||||
const operatingRoomList = ref([]);
|
|
||||||
|
|
||||||
const anesthesiaMethodOptions = ref([
|
|
||||||
{ value: '01', label: '全身麻醉' },
|
|
||||||
{ value: '02', label: '局部麻醉' },
|
|
||||||
{ value: '03', label: '椎管内麻醉' },
|
|
||||||
{ value: '04', label: '复合麻醉' }
|
|
||||||
]);
|
|
||||||
|
|
||||||
const data = reactive({
|
|
||||||
form: {},
|
|
||||||
queryParams: {
|
|
||||||
pageNum: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
operCode: null,
|
|
||||||
patientName: null,
|
|
||||||
applyDeptId: null,
|
|
||||||
scheduleDateRange: [],
|
|
||||||
},
|
|
||||||
rules: {
|
|
||||||
operCode: [
|
|
||||||
{ required: true, message: "手术单号不能为空", trigger: "blur" }
|
|
||||||
],
|
|
||||||
patientName: [
|
|
||||||
{ required: true, message: "患者姓名不能为空", trigger: "blur" }
|
|
||||||
],
|
|
||||||
sex: [
|
|
||||||
{ required: true, message: "性别不能为空", trigger: "change" }
|
|
||||||
],
|
|
||||||
age: [
|
|
||||||
{ required: true, message: "年龄不能为空", trigger: "blur" }
|
|
||||||
],
|
|
||||||
applyDeptId: [
|
|
||||||
{ required: true, message: "申请科室不能为空", trigger: "change" }
|
|
||||||
],
|
|
||||||
scheduleDate: [
|
|
||||||
{ required: true, message: "安排时间不能为空", trigger: "change" }
|
|
||||||
],
|
|
||||||
operationName: [
|
|
||||||
{ required: true, message: "手术名称不能为空", trigger: "blur" }
|
|
||||||
],
|
|
||||||
surgeonId: [
|
|
||||||
{ required: true, message: "手术医师不能为空", trigger: "change" }
|
|
||||||
],
|
|
||||||
anesthesiaMethod: [
|
|
||||||
{ required: true, message: "麻醉方法不能为空", trigger: "change" }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const { queryParams, form, rules } = toRefs(data);
|
|
||||||
|
|
||||||
/** 查询门诊手术安排列表 */
|
|
||||||
function getList() {
|
|
||||||
loading.value = true;
|
|
||||||
listSurgicalSchedule(queryParams.value).then(response => {
|
|
||||||
scheduleList.value = response.rows;
|
|
||||||
total.value = response.total;
|
|
||||||
loading.value = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 取消按钮 */
|
|
||||||
function cancel() {
|
|
||||||
open.value = false;
|
|
||||||
reset();
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 表单重置 */
|
|
||||||
function reset() {
|
|
||||||
form.value = {
|
|
||||||
id: null,
|
|
||||||
operCode: null,
|
|
||||||
patientName: null,
|
|
||||||
sex: null,
|
|
||||||
age: null,
|
|
||||||
applyDeptId: null,
|
|
||||||
scheduleDate: null,
|
|
||||||
operationName: null,
|
|
||||||
surgeonId: null,
|
|
||||||
anesthesiaMethod: null,
|
|
||||||
expertId: null,
|
|
||||||
anesthetistId: null,
|
|
||||||
operatingRoomId: null,
|
|
||||||
remark: null
|
|
||||||
};
|
|
||||||
proxy.$refs["scheduleRef"].resetFields();
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 搜索按钮操作 */
|
|
||||||
function handleQuery() {
|
|
||||||
queryParams.value.pageNum = 1;
|
|
||||||
getList();
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 重置按钮操作 */
|
|
||||||
function resetQuery()utter="10" class="mb8">
|
|
||||||
<el-col :span="1.5">
|
<el-col :span="1.5">
|
||||||
<el-button type="primary" plain icon="Plus" @click="handleAdd"> 新增手术安排 </el-button>
|
<el-button type="primary" plain icon="Plus" @click="handleAdd"> 新增手术安排 </el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|||||||
Reference in New Issue
Block a user