<template>
|
<div class="app-container">
|
<el-row :gutter="20">
|
<!-- 搜索区域 -->
|
<el-form
|
:model="queryParams"
|
ref="queryForm"
|
size="small"
|
:inline="true"
|
v-show="showSearch"
|
label-width="98px"
|
>
|
<el-form-item label="服务组名称">
|
<el-input
|
v-model="queryParams.groupName"
|
placeholder="请输入服务组名称"
|
@keyup.enter.native="handleQuery"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="创建人">
|
<el-input
|
v-model="queryParams.createBy"
|
placeholder="请输入创建人"
|
@keyup.enter.native="handleQuery"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="创建时间">
|
<el-date-picker
|
v-model="dateRange"
|
style="width: 240px"
|
value-format="yyyy-MM-dd"
|
type="daterange"
|
range-separator="-"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="状态">
|
<el-select v-model="queryParams.status" placeholder="请选择状态">
|
<el-option
|
v-for="item in statusOptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
type="primary"
|
icon="el-icon-search"
|
size="medium"
|
@click="handleQuery"
|
>搜索</el-button
|
>
|
<el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
|
>重置</el-button
|
>
|
</el-form-item>
|
</el-form>
|
|
<el-divider></el-divider>
|
|
<!-- 操作按钮区域 -->
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button
|
type="primary"
|
icon="el-icon-plus"
|
size="medium"
|
@click="handleAdd"
|
>新建服务组</el-button
|
>
|
</el-col>
|
<right-toolbar
|
:showSearch.sync="showSearch"
|
@queryTable="getList"
|
></right-toolbar>
|
</el-row>
|
|
<!-- 服务组列表 -->
|
<el-table
|
v-loading="loading"
|
:data="groupList"
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column
|
label="服务组ID"
|
align="center"
|
key="groupId"
|
prop="groupId"
|
width="100"
|
/>
|
<el-table-column
|
label="服务组名称"
|
align="center"
|
key="groupName"
|
prop="groupName"
|
:show-overflow-tooltip="true"
|
/>
|
<el-table-column
|
label="描述"
|
align="center"
|
key="groupDesc"
|
prop="groupDesc"
|
:show-overflow-tooltip="true"
|
/>
|
<el-table-column
|
label="关联任务数"
|
align="center"
|
key="taskCount"
|
prop="taskCount"
|
width="100"
|
/>
|
<el-table-column
|
label="关联患者数"
|
align="center"
|
key="patientCount"
|
prop="patientCount"
|
width="100"
|
/>
|
<el-table-column
|
label="状态"
|
align="center"
|
key="status"
|
prop="status"
|
width="100"
|
>
|
<template slot-scope="scope">
|
<el-tag :type="scope.row.status === 1 ? 'success' : 'info'">
|
{{ scope.row.status === 1 ? "启用" : "停用" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="创建人"
|
align="center"
|
key="createBy"
|
prop="createBy"
|
/>
|
<el-table-column
|
label="创建时间"
|
align="center"
|
prop="createTime"
|
width="180"
|
>
|
<template slot-scope="scope">
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column
|
label="操作"
|
align="center"
|
width="300"
|
class-name="small-padding fixed-width"
|
>
|
<template slot-scope="scope">
|
<el-button
|
size="mini"
|
type="text"
|
icon="el-icon-view"
|
@click="handleView(scope.row)"
|
>详情</el-button
|
>
|
|
<el-button
|
size="mini"
|
type="text"
|
icon="el-icon-delete"
|
class="delete-btn"
|
@click="handleDelete(scope.row)"
|
>删除</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<!-- 分页 -->
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
</el-row>
|
</div>
|
</template>
|
|
<script>
|
import { listServiceGroup, delServiceGroup } from "@/api/system/serviceGroup";
|
|
export default {
|
name: "ServiceGroupList",
|
dicts: ["sys_normal_disable"],
|
data() {
|
return {
|
// 遮罩层
|
loading: false,
|
// 选中数组
|
ids: [],
|
// 非单个禁用
|
single: true,
|
// 非多个禁用
|
multiple: true,
|
// 显示搜索条件
|
showSearch: true,
|
// 总条数
|
total: 5,
|
// 服务组表格数据
|
groupList: [
|
{
|
groupId: "SG2025001",
|
groupName: "糖尿病随访管理组",
|
groupDesc: "专门负责糖尿病患者的定期随访和健康管理服务",
|
taskCount: 5,
|
patientCount: 150,
|
status: 1,
|
createBy: "张医生",
|
createTime: "2025-10-15 14:30:00",
|
},
|
{
|
groupId: "SG2025002",
|
groupName: "高血压健康管理组",
|
groupDesc: "高血压患者的用药指导和血压监测管理",
|
taskCount: 3,
|
patientCount: 89,
|
status: 1,
|
createBy: "李医生",
|
createTime: "2025-10-10 09:15:00",
|
},
|
{
|
groupId: "SG2025003",
|
groupName: "术后康复随访组",
|
groupDesc: "外科手术后患者的康复指导和随访管理",
|
taskCount: 2,
|
patientCount: 45,
|
status: 0,
|
createBy: "王医生",
|
createTime: "2025-09-28 16:20:00",
|
},
|
{
|
groupId: "SG2025004",
|
groupName: "孕产期健康管理组",
|
groupDesc: "孕期和产后妇女的健康监测和指导服务",
|
taskCount: 4,
|
patientCount: 67,
|
status: 1,
|
createBy: "赵医生",
|
createTime: "2025-10-05 11:30:00",
|
},
|
{
|
groupId: "SG2025005",
|
groupName: "慢性病综合管理组",
|
groupDesc: "多种慢性病患者的综合健康管理服务",
|
taskCount: 6,
|
patientCount: 203,
|
status: 1,
|
createBy: "张医生",
|
createTime: "2025-09-15 08:45:00",
|
},
|
],
|
// 日期范围
|
dateRange: [],
|
// 状态选项
|
statusOptions: [
|
{ value: 1, label: "启用" },
|
{ value: 0, label: "停用" },
|
],
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
groupName: undefined,
|
createBy: undefined,
|
status: undefined,
|
},
|
};
|
},
|
created() {
|
this.getList();
|
},
|
methods: {
|
/** 查询服务组列表 */
|
getList() {
|
// this.loading = true;
|
// listServiceGroup(
|
// this.addDateRange(this.queryParams, this.dateRange)
|
// ).then((response) => {
|
// this.groupList = response.rows;
|
// this.total = response.total;
|
// this.loading = false;
|
// });
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1;
|
this.getList();
|
},
|
/** 重置按钮操作 */
|
resetQuery() {
|
this.dateRange = [];
|
this.resetForm("queryForm");
|
this.handleQuery();
|
},
|
// 多选框选中数据
|
handleSelectionChange(selection) {
|
this.ids = selection.map((item) => item.groupId);
|
this.single = selection.length !== 1;
|
this.multiple = !selection.length;
|
},
|
/** 新增按钮操作 */
|
handleAdd() {
|
this.$router.push("/group/serviceGroupPar");
|
},
|
/** 详情按钮操作 */
|
handleView(row, type) {
|
this.$router.push({
|
path: "/group/serviceGroupPar",
|
query: {
|
type: this.topqueryParams.type,
|
},
|
});
|
},
|
/** 删除按钮操作 */
|
handleDelete(row) {
|
const groupIds = row.groupId || this.ids;
|
this.$modal
|
.confirm('是否确认删除服务组编号为"' + groupIds + '"的数据项？')
|
.then(() => {
|
return delServiceGroup(groupIds);
|
})
|
.then(() => {
|
this.getList();
|
this.$modal.msgSuccess("删除成功");
|
})
|
.catch(() => {});
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.delete-btn {
|
color: #f56c6c;
|
}
|
.app-container {
|
padding: 20px;
|
}
|
.mb8 {
|
margin-bottom: 8px;
|
}
|
</style>
|
