<template>
|
<div class="app-container">
|
<!-- 头部：标题和操作按钮 -->
|
<div class="header-container">
|
<div class="header-left">
|
<div class="title">规则配置管理</div>
|
<div class="tips">配置科室和病区的执行优先级规则</div>
|
</div>
|
<div class="header-right">
|
<el-button type="primary" icon="el-icon-plus" @click="openAddDialog">
|
新增规则
|
</el-button>
|
</div>
|
</div>
|
|
<!-- 搜索区域 -->
|
<el-card class="filter-container" shadow="never">
|
<div class="filter-title">查询条件</div>
|
<el-form :model="searchForm" :inline="true" class="filter-form">
|
<el-form-item label="科室名称">
|
<el-input
|
v-model="searchForm.deptname"
|
placeholder="请输入科室名称"
|
clearable
|
style="width: 200px"
|
@keyup.enter.native="handleSearch"
|
/>
|
</el-form-item>
|
<el-form-item label="病区名称">
|
<el-input
|
v-model="searchForm.wardname"
|
placeholder="请输入病区名称"
|
clearable
|
style="width: 200px"
|
@keyup.enter.native="handleSearch"
|
/>
|
</el-form-item>
|
<el-form-item label="科室规则">
|
<el-select
|
v-model="searchForm.deptRule"
|
placeholder="请选择"
|
clearable
|
style="width: 120px"
|
>
|
<el-option label="首先执行" value="1" />
|
<el-option label="次要执行" value="2" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="病区规则">
|
<el-select
|
v-model="searchForm.wradRule"
|
placeholder="请选择"
|
clearable
|
style="width: 120px"
|
>
|
<el-option label="首先执行" value="1" />
|
<el-option label="次要执行" value="2" />
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="el-icon-search" @click="handleSearch"
|
>查询</el-button
|
>
|
<el-button icon="el-icon-refresh" @click="resetSearch"
|
>重置</el-button
|
>
|
</el-form-item>
|
</el-form>
|
</el-card>
|
|
<!-- 规则列表表格 -->
|
<el-card class="table-container" shadow="never">
|
<el-table
|
v-loading="loading"
|
:data="tableData"
|
style="width: 100%"
|
stripe
|
:header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
|
>
|
<el-table-column
|
prop="deptname"
|
label="科室"
|
min-width="120"
|
align="center"
|
/>
|
<el-table-column
|
prop="wardname"
|
label="病区"
|
min-width="120"
|
align="center"
|
/>
|
<el-table-column label="科室优先级" min-width="100" align="center">
|
<template slot-scope="{ row }">
|
<el-tag
|
:type="row.deptRule === '1' ? 'success' : 'warning'"
|
size="small"
|
>
|
{{ row.deptRule === "1" ? "首先执行" : "次要执行" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="病区优先级" min-width="100" align="center">
|
<template slot-scope="{ row }">
|
<el-tag
|
:type="row.wradRule === '1' ? 'success' : 'warning'"
|
size="small"
|
>
|
{{ row.wradRule === "1" ? "首先执行" : "次要执行" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="疾病优先级" min-width="100" align="center">
|
<template slot-scope="{ row }">
|
<el-tag
|
:type="row.diagRule === '1' ? 'success' : 'warning'"
|
size="small"
|
>
|
{{ row.diagRule === "1" ? "首先执行" : "次要执行" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="createTime"
|
label="创建时间"
|
min-width="150"
|
align="center"
|
/>
|
<el-table-column label="操作" width="180" fixed="right" align="center">
|
<template slot-scope="{ row }">
|
<el-button
|
type="text"
|
size="mini"
|
icon="el-icon-edit"
|
@click="openEditDialog(row)"
|
class="action-btn"
|
>
|
编辑
|
</el-button>
|
<el-button
|
type="text"
|
size="mini"
|
icon="el-icon-delete"
|
@click="handleDelete(row)"
|
style="color: #f56c6c"
|
class="action-btn"
|
>
|
删除
|
</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<!-- 分页 -->
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
:page.sync="searchForm.pageNum"
|
:limit.sync="searchForm.pageSize"
|
@pagination="getList"
|
style="margin-top: 20px"
|
/>
|
</el-card>
|
|
<!-- 添加/编辑对话框 -->
|
<el-dialog
|
:title="dialogTitle"
|
:visible.sync="dialogVisible"
|
width="500px"
|
:close-on-click-modal="false"
|
@close="resetDialog"
|
>
|
<el-form
|
ref="ruleFormRef"
|
:model="ruleForm"
|
:rules="rules"
|
label-width="100px"
|
class="rule-form"
|
>
|
<el-form-item label="科室" prop="deptcode">
|
<el-select
|
v-model="ruleForm.deptcode"
|
placeholder="请选择科室"
|
filterable
|
clearable
|
style="width: 100%"
|
@change="handleDeptChange"
|
>
|
<el-option
|
v-for="dept in departmentOptions"
|
:key="dept.value"
|
:label="dept.label"
|
:value="dept.value"
|
/>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="病区" prop="wardcode">
|
<el-select
|
v-model="ruleForm.wardcode"
|
placeholder="请选择病区"
|
filterable
|
clearable
|
style="width: 100%"
|
@change="handleDeptChangebq"
|
>
|
<el-option
|
v-for="ward in wardOptions"
|
:key="ward.value"
|
:label="ward.label"
|
:value="ward.value"
|
/>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="科室优先级" prop="deptRule">
|
<el-radio-group v-model="ruleForm.deptRule">
|
<el-radio label="1">首先执行</el-radio>
|
<el-radio label="2">次要执行</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<el-form-item label="病区优先级" prop="wradRule">
|
<el-radio-group v-model="ruleForm.wradRule">
|
<el-radio label="1">首先执行</el-radio>
|
<el-radio label="2">次要执行</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<el-form-item label="疾病优先级" prop="diagRule">
|
<el-radio-group v-model="ruleForm.diagRule">
|
<el-radio label="1">首先执行</el-radio>
|
<el-radio label="2">次要执行</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<div class="form-tips">
|
<i class="el-icon-info"></i>
|
提示：科室和病区至少需要选择一个
|
</div>
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="handleSubmit" :loading="submitting"
|
>确 定</el-button
|
>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
taskrulelist,
|
addtaskrule,
|
edittaskrule,
|
deltaskrule,
|
} from "@/api/AiCentre/index";
|
|
export default {
|
name: "RuleConfig",
|
data() {
|
// 验证科室和病区至少选一个
|
const validateDeptOrWard = (rule, value, callback) => {
|
if (!this.ruleForm.deptcode && !this.ruleForm.wardcode) {
|
callback(new Error("科室和病区至少需要选择一个"));
|
} else {
|
callback();
|
}
|
};
|
|
return {
|
// 搜索表单
|
searchForm: {
|
pageNum: 1,
|
pageSize: 10,
|
deptname: "",
|
wardname: "",
|
deptRule: "",
|
wradRule: "",
|
},
|
|
// 表格数据
|
tableData: [],
|
total: 0,
|
loading: false,
|
|
// 对话框相关
|
dialogVisible: false,
|
dialogTitle: "",
|
submitting: false,
|
isEdit: false,
|
currentId: null,
|
|
// 表单数据
|
ruleForm: {
|
deptcode: "",
|
deptname: "",
|
wardcode: "",
|
wardname: "",
|
deptRule: "1",
|
wradRule: "1",
|
diagRule: "1",
|
},
|
|
// 验证规则
|
rules: {
|
deptRule: [
|
{ required: true, message: "请选择科室优先级", trigger: "change" },
|
],
|
wradRule: [
|
{ required: true, message: "请选择病区优先级", trigger: "change" },
|
],
|
diagRule: [
|
{ required: true, message: "请选择疾病优先级", trigger: "change" },
|
],
|
deptcode: [{ validator: validateDeptOrWard, trigger: "change" }],
|
wardcode: [{ validator: validateDeptOrWard, trigger: "change" }],
|
},
|
|
// 选项数据
|
departmentOptions: [],
|
wardOptions: [],
|
};
|
},
|
computed: {
|
// 科室选项
|
computedDepartmentOptions() {
|
if (this.$store.getters.belongDepts) {
|
return this.$store.getters.belongDepts.map((dept) => ({
|
label: dept.deptName,
|
value: dept.deptCode,
|
}));
|
}
|
return [];
|
},
|
},
|
created() {
|
this.getList();
|
this.departmentOptions = this.computedDepartmentOptions;
|
this.fetchWardOptions();
|
},
|
methods: {
|
// 获取规则列表
|
getList() {
|
this.loading = true;
|
taskrulelist(this.searchForm)
|
.then((response) => {
|
if (response.code === 200) {
|
this.tableData = response.rows;
|
this.total = response.total;
|
} else {
|
this.$message.error(response.msg || "获取列表失败");
|
}
|
})
|
.catch((error) => {
|
console.error("获取规则列表失败:", error);
|
this.$message.error("获取规则列表失败");
|
})
|
.finally(() => {
|
this.loading = false;
|
});
|
},
|
|
// 获取病区数据
|
fetchWardOptions() {
|
// TODO: 调用获取病区列表的接口
|
// getWardList().then(response => {
|
// this.wardOptions = response.data.map(ward => ({
|
// label: ward.wardName,
|
// value: ward.wardCode
|
// }));
|
// }).catch(error => {
|
// console.error('获取病区列表失败:', error);
|
// });
|
|
// 临时数据
|
this.wardOptions = [
|
{ label: "心血管内科一病区", value: "W001" },
|
{ label: "心血管内科二病区", value: "W002" },
|
{ label: "呼吸内科病区", value: "W003" },
|
{ label: "神经内科病区", value: "W004" },
|
];
|
},
|
|
// 科室变化处理
|
handleDeptChange(value) {
|
const selectedDept = this.departmentOptions.find(
|
(dept) => dept.value === value
|
);
|
if (selectedDept) {
|
this.ruleForm.deptname = selectedDept.label;
|
} else {
|
this.ruleForm.deptname = "";
|
}
|
},
|
handleDeptChangebq(value) {
|
const selectedDept = this.wardOptions.find(
|
(dept) => dept.value === value
|
);
|
if (selectedDept) {
|
this.ruleForm.wardname = selectedDept.label;
|
} else {
|
this.ruleForm.wardname = "";
|
}
|
},
|
|
// 搜索
|
handleSearch() {
|
this.searchForm.pageNum = 1;
|
this.getList();
|
},
|
|
// 重置搜索
|
resetSearch() {
|
this.searchForm = {
|
pageNum: 1,
|
pageSize: 10,
|
deptname: "",
|
wardname: "",
|
deptRule: "",
|
wradRule: "",
|
};
|
this.getList();
|
},
|
|
// 打开新增对话框
|
openAddDialog() {
|
this.dialogTitle = "新增规则";
|
this.isEdit = false;
|
this.currentId = null;
|
this.dialogVisible = true;
|
},
|
|
// 打开编辑对话框
|
openEditDialog(row) {
|
this.dialogTitle = "编辑规则";
|
this.isEdit = true;
|
this.currentId = row.id;
|
|
// 填充表单数据
|
this.ruleForm = {
|
deptcode: row.deptcode || "",
|
deptname: row.deptname || "",
|
wardcode: row.wardcode || "",
|
wardname: row.wardname || "",
|
deptRule: row.deptRule || "1",
|
wradRule: row.wradRule || "1",
|
diagRule: row.diagRule || "1",
|
};
|
|
this.dialogVisible = true;
|
},
|
|
// 重置对话框
|
resetDialog() {
|
this.$refs.ruleFormRef && this.$refs.ruleFormRef.resetFields();
|
this.ruleForm = {
|
deptcode: "",
|
deptname: "",
|
wardcode: "",
|
wardname: "",
|
deptRule: "1",
|
wradRule: "1",
|
diagRule: "1",
|
};
|
this.currentId = null;
|
this.submitting = false;
|
},
|
|
// 提交表单
|
handleSubmit() {
|
this.$refs.ruleFormRef.validate((valid) => {
|
if (valid) {
|
this.submitting = true;
|
|
const formData = { ...this.ruleForm };
|
if (this.isEdit) {
|
formData.id = this.currentId;
|
}
|
|
const api = this.isEdit ? edittaskrule : addtaskrule;
|
|
api(formData)
|
.then((response) => {
|
if (response.code === 200) {
|
this.$message.success(this.isEdit ? "编辑成功" : "新增成功");
|
this.dialogVisible = false;
|
this.getList();
|
} else {
|
this.$message.error(
|
response.msg || (this.isEdit ? "编辑失败" : "新增失败")
|
);
|
}
|
})
|
.catch((error) => {
|
console.error("提交失败:", error);
|
this.$message.error("提交失败，请稍后重试");
|
})
|
.finally(() => {
|
this.submitting = false;
|
});
|
}
|
});
|
},
|
|
// 删除规则
|
handleDelete(row) {
|
this.$confirm(
|
`确定要删除规则"${row.deptname || row.wardname}"吗？`,
|
"提示",
|
{
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}
|
)
|
.then(() => {
|
return deltaskrule({ id: row.id });
|
})
|
.then((response) => {
|
if (response.code === 200) {
|
this.$message.success("删除成功");
|
this.getList();
|
} else {
|
this.$message.error(response.msg || "删除失败");
|
}
|
})
|
.catch((error) => {
|
if (error !== "cancel") {
|
console.error("删除失败:", error);
|
this.$message.error("删除失败");
|
}
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.app-container {
|
padding: 20px;
|
background-color: #f0f2f5;
|
min-height: calc(100vh - 84px);
|
}
|
|
.header-container {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 20px;
|
padding: 16px 20px;
|
background: white;
|
border-radius: 4px;
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
}
|
|
.header-left {
|
display: flex;
|
flex-direction: column;
|
}
|
|
.header-left .title {
|
font-size: 20px;
|
font-weight: 500;
|
color: #303133;
|
margin-bottom: 6px;
|
}
|
|
.header-left .tips {
|
font-size: 13px;
|
color: #909399;
|
}
|
|
.filter-container {
|
margin-bottom: 20px;
|
border-radius: 4px;
|
}
|
|
.filter-title {
|
font-size: 15px;
|
font-weight: 500;
|
color: #303133;
|
margin-bottom: 16px;
|
padding-bottom: 12px;
|
border-bottom: 1px solid #ebeef5;
|
}
|
|
.filter-form {
|
display: flex;
|
flex-wrap: wrap;
|
gap: 20px 0;
|
}
|
|
.filter-form .el-form-item {
|
margin-bottom: 0;
|
margin-right: 20px;
|
}
|
|
.table-container {
|
border-radius: 4px;
|
margin-bottom: 20px;
|
}
|
|
.action-btn {
|
padding: 5px 8px;
|
font-size: 12px;
|
}
|
|
.rule-form {
|
padding-right: 20px;
|
}
|
|
.form-tips {
|
background-color: #f0f9ff;
|
border: 1px solid #c6e2ff;
|
border-radius: 4px;
|
padding: 10px 15px;
|
margin-left: 100px;
|
color: #409eff;
|
font-size: 12px;
|
line-height: 1.5;
|
}
|
|
.form-tips i {
|
margin-right: 5px;
|
}
|
|
.dialog-footer {
|
text-align: right;
|
padding-top: 20px;
|
border-top: 1px solid #ebeef5;
|
}
|
|
/* 响应式调整 */
|
@media (max-width: 768px) {
|
.header-container {
|
flex-direction: column;
|
align-items: flex-start;
|
}
|
|
.header-right {
|
margin-top: 10px;
|
}
|
|
.filter-form .el-form-item {
|
width: 100%;
|
margin-right: 0;
|
}
|
|
.filter-form .el-form-item .el-input,
|
.filter-form .el-form-item .el-select {
|
width: 100%;
|
}
|
}
|
</style>
|
