mental-health-web/src/views/archive/interveneRecord/index.vue

348 lines
12 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="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
:leave-active-class="proxy?.animate.searchAnimate.leave">
<div class="search" v-show="showSearch">
<el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
<el-form-item label="测评人" prop="batchNo">
<el-input v-model="queryParams.batchNo" placeholder="请输入测评人" clearable style="width: 240px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="状态" prop="note">
<el-select v-model="queryParams.status" placeholder="请选状态" style="width: 240px">
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="预警时间" prop="note">
<el-date-picker clearable v-model="queryParams.warnTime" type="date" value-format="YYYY-MM-DD"
placeholder="请选预警时间" />
</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>
</div>
</transition>
<el-card shadow="never">
<el-table v-loading="loading" :data="warnRecordList">
<el-table-column label="场次名称" align="center" prop="sessionName" />
<el-table-column label="测评人" align="center" prop="nickName" />
<el-table-column label="预警时间" align="center" prop="warnTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.warnTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="interveneStatus" width="180">
<template #default="scope">
<el-tag :type="scope.row.interveneStatus === 0 ? 'success' : 'danger'">{{ scope.row.interveneStatus === 0 ?
'无须干预' : '干预中' }}</el-tag>
</template>
</el-table-column>
<el-table-column label="补充说明" align="center" prop="note" />
<el-table-column label="严重度" align="center" prop="situation">
<template #default="scope">
{{ handleSituation(scope.row.situation) }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding" width="280">
<template #default="scope">
<el-tooltip content="测评详情" placement="top">
<el-button link type="primary" icon="View" @click="handleRecord(scope.row)"
v-hasPermi="['intervene:record:add']">测评详情</el-button>
</el-tooltip>
<el-tooltip content="处理" placement="top">
<el-button link type="primary" icon="Pointer" @click="handleUpdate(scope.row)"
v-hasPermi="['intervene:record:add']">处理</el-button>
</el-tooltip>
<el-tooltip content="干预列表" placement="top">
<el-button link type="primary" icon="Edit" @click="handleList(scope.row)"
v-hasPermi="['intervene:record:list']">干预列表</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<el-dialog title="处理详情" v-model="dialog.visible" width="600px" append-to-body>
<el-form ref="warnRecordFormRef" :model="form" :rules="rules" label-width="90px">
<el-form-item label="用户" prop="userId" v-show="false">
<el-input v-model="form.userId" placeholder="请输入" />
</el-form-item>
<el-form-item label="诊断说明" prop="diagnose">
<el-input v-model="form.diagnose" :rows="4" type="textarea" placeholder="请输入" />
</el-form-item>
<el-form-item label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :value="0">暂存</el-radio>
<el-radio :value="1">完成</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="诊断附件" prop="cover">
<file-upload v-model="form.annex" :limit="1" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
<el-dialog title="干预详情" v-model="listDialog" width="600px" append-to-body>
<el-timeline style="max-width: 600px">
<el-timeline-item :timestamp="item.time" placement="top" v-for="item in timeList" :key="item.id">
{{ item.name }}
</el-timeline-item>
</el-timeline>
</el-dialog>
<el-dialog :title="recordDialog.title" v-model="recordDialog.visible" width="800px" append-to-body>
<el-tabs v-model="activeName" class="demo-tabs">
<el-tab-pane label="静态普查记录" name="static">
<el-table :data="staticList" style="width: 100%">
<el-table-column prop="sessionName" label="场次名称" />
<el-table-column prop="scaleName" label="量表名称" />
<el-table-column label="严重度" align="center" prop="situation">
<template #default="scope">
{{ handleSituation(scope.row.situation) }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="导出" placement="top">
<el-button link type="primary" icon="View" @click="handleExport(scope.row)"
v-hasPermi="['evaluation:record:export']">导出</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="staticTotal > 0" :total="staticTotal" v-model:page="staticQuery.pageNum"
v-model:limit="staticQuery.pageSize" @pagination="getStaticList" />
</el-tab-pane>
<!-- <el-tab-pane label="动态普查记录" name="dynamic">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="Date" width="180" />
<el-table-column prop="name" label="Name" width="180" />
<el-table-column prop="address" label="Address" />
</el-table>
</el-tab-pane> -->
<!-- <el-tab-pane label="预警干预记录" name="warn">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="Date" width="180" />
<el-table-column prop="name" label="Name" width="180" />
<el-table-column prop="address" label="Address" />
</el-table>
</el-tab-pane> -->
</el-tabs>
</el-dialog>
</div>
</template>
<script setup name="WarnRecord" lang="ts">
import { listWarnRecord } from '@/api/archive/warnRecord';
import { WarnRecordVO, WarnRecordQuery, WarnRecordForm } from '@/api/archive/warnRecord/types';
import { listStatistic } from '@/api/archive/information';
import { addInterveneRecord, listInterveneTimes } from '@/api/archive/interveneRecord';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const warnRecordList = ref<WarnRecordVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const warnRecordFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const recordDialog = reactive<DialogOption>({
visible: false,
title: '测评记录'
});
const listDialog = ref(false)
const activeName = ref('static')
const statusOptions: any[] = []
const initFormData: WarnRecordForm = {
warnId: undefined,
batchNo: undefined,
userId: undefined,
status: 0,
note: undefined,
warnTime: undefined
}
const data = reactive<PageData<WarnRecordForm, WarnRecordQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
batchNo: undefined,
userId: undefined,
status: undefined,
note: undefined,
warnTime: undefined,
params: {
}
},
rules: {
warnId: [
{ required: true, message: "不能为空", trigger: "blur" }
],
batchNo: [
{ required: true, message: "td_scale_publish表主键不能为空", trigger: "blur" }
],
userId: [
{ required: true, message: "测评人id不能为空", trigger: "blur" }
],
status: [
{ required: true, message: "状态 0 未处理1 分配咨询师2 咨询师拒绝干预3 干预中 4 干预结束不能为空", trigger: "change" }
],
note: [
{ required: true, message: "补充说明不能为空", trigger: "blur" }
],
warnTime: [
{ required: true, message: "预警时间不能为空", trigger: "blur" }
]
}
});
const { queryParams, form, rules } = toRefs(data);
function handleSituation(situation: any) {
if (situation == 1) {
return '未见异常'
} else if (situation == 2) {
return '低风险'
} else if (situation == 3) {
return '中风险'
} else if (situation == 4) {
return '高风险'
} else {
return '重大风险'
}
}
/** 查询预警记录列表 */
const getList = async () => {
loading.value = true;
const res = await listWarnRecord(queryParams.value);
warnRecordList.value = res.rows;
total.value = res.total;
loading.value = false;
}
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
}
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
warnRecordFormRef.value?.resetFields();
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
}
/** 修改按钮操作 */
const handleUpdate = async (row?: WarnRecordVO) => {
reset();
form.value.userId = row?.userId
dialog.title = "处理详情";
dialog.visible = true
}
const timeList = ref<any[]>([])
async function handleList(row: any) {
const userId = row.userId
const res = await listInterveneTimes({ userId })
timeList.value = res.data
listDialog.value = true
}
/** 提交按钮 */
const submitForm = () => {
warnRecordFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
await addInterveneRecord(form.value).finally(() => buttonLoading.value = false);
proxy?.$modal.msgSuccess("处理成功");
dialog.visible = false;
await getList();
}
});
}
const staticQuery = ref({
userId: '',
pageNum: 1,
pageSize: 10
})
const staticTotal = ref(0)
const staticList = ref<any[]>([])
const current = ref({ userId: '', nickName: '' })
const handleRecord = async (row?: any) => {
staticQuery.value.userId = row.userId;
current.value.userId = row.userId
current.value.nickName = row.nickName
getStaticList()
recordDialog.visible = true;
}
async function getStaticList() {
const res = await listStatistic(staticQuery.value);
staticList.value = res.rows
staticTotal.value = res.total
}
function handleExport(row: any) {
proxy?.download('scale/evaluation/record/export', {
scaleId: row.scaleId,
scaleName: row.scaleName,
recordId: row.recordId,
userId: current.value.userId,
nickName: current.value.nickName
}, `${current.value.nickName}.pdf`)
}
onMounted(() => {
getList();
});
</script>
<style lang="scss" scoped>
.card-header {
font-size: 18px;
font-weight: bold;
}
</style>