474 lines
17 KiB
Vue
474 lines
17 KiB
Vue
<template>
|
||
<div class="app-container" ref="layout">
|
||
<div ref="topform" class="form">
|
||
<SearchFilter :labelWidths="310" :widths="70" size="small" @search="handleQuery" @handleRules="getList"
|
||
patientUploadButtonVisible="true" @reset="resetQuery" @minShowCtrol="getMaxTableHeight" v-show="showSearch">
|
||
<el-form-item label="导入日期" prop="" label-width="90px">
|
||
<el-date-picker v-model="createTime" type="daterange" range-separator="至" start-placeholder="开始日期"
|
||
style="width: 220px" value-format="yyyy-MM-dd" end-placeholder="结束日期">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<el-form-item label="流水号" prop="sn" label-width="90px">
|
||
<el-input v-model="queryParams.sn" placeholder="请输入流水号" style="width: 220px" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="批次名称" prop="importName" label-width="90px">
|
||
<el-input v-model="queryParams.importName" placeholder="请输入批次名称" style="width: 220px" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="医院" prop="" label-width="90px">
|
||
<el-select v-model="queryParams.hospitalAgencyId" filterable placeholder="请选择医院" style="width: 220px"
|
||
clearable @clear="clearhospitalAgency" @change="changehospitalAgency">
|
||
<el-option v-for="item in hospitalAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="院区" prop="">
|
||
<el-select v-model="queryParams.campusAgencyId" filterable placeholder="请选择院区" style="width: 220px" clearable
|
||
@clear="clearcampusAgency">
|
||
<el-option v-for="item in campusAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item> -->
|
||
</SearchFilter>
|
||
</div>
|
||
<!-- <div ref="mb8" class="mb8">
|
||
<el-row :gutter="10" class="">
|
||
<el-col :span="1.5">
|
||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||
v-hasPermi="['manage:blacklist:add']">新增</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
|
||
v-hasPermi="['manage:blacklist:edit']">修改</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
|
||
v-hasPermi="['manage:blacklist:remove']">删除</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||
v-hasPermi="['manage:blacklist:export']">导出</el-button>
|
||
</el-col>
|
||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||
</el-row>
|
||
</div> -->
|
||
<div ref="table">
|
||
<el-table :max-height="maxTableHeight" v-loading="loading" :data="PatientInfoImportBatchlist"
|
||
@selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="55" />
|
||
<el-table-column label="序号" type="index" width="50" align="center" />
|
||
<el-table-column label="流水号" prop="sn" align="center">
|
||
<template slot-scope="scope">
|
||
<el-button size="mini" type="text" @click="handsn(scope.row)">
|
||
{{ scope.row.sn }}
|
||
</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="批次名称" align="center" prop="importName" />
|
||
<el-table-column label="患者数" align="center" prop="patientCount" />
|
||
<el-table-column label="操作人" align="center" prop="createBy" />
|
||
<el-table-column label="导入日期" align="center" prop="createTime">
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||
<template slot-scope="scope">
|
||
<!-- <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
|
||
v-hasPermi="['manage:blacklist:edit']">修改</el-button>
|
||
<el-button size="mini" type="text" @click="handleDelete(scope.row)"
|
||
v-hasPermi="['manage:blacklist:remove']">删除</el-button> -->
|
||
<el-button size="mini" type="text" @click="handOutbound(scope.row)">外呼</el-button>
|
||
<el-button size="mini" type="text" @click="ljhandOutbound(scope.row)">立即外呼</el-button>
|
||
<el-button size="mini" type="text" @click="handsn(scope.row)">明细</el-button>
|
||
<el-button size="mini" type="text" @click="handleDelete(scope.row)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
<!-- <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
|
||
:limit.sync="queryParams.pageSize" @pagination="getList" /> -->
|
||
<myPagination v-show="total > 0" :total="total" :pageSize="queryParams.pageSize"
|
||
:indexFromWrap="queryParams.pageNum" @updateCPage="updateCPage"></myPagination>
|
||
<el-dialog title="立即外呼" :visible.sync="open" width="500px" append-to-body>
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||
<el-form-item label="任务名称" prop="manageRouteName">
|
||
<el-input v-model="form.manageRouteName" placeholder="请输入任务名称" />
|
||
</el-form-item>
|
||
<el-descriptions title="上次外呼数据简介" />
|
||
<el-form-item label="流水号" prop="sn">
|
||
<div class="formdiv">
|
||
{{ form.sn }}
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="任务节点类型" prop="taskNodeType">
|
||
<div class="formdiv">
|
||
{{ form.taskNodeType == 'PHONE_OUTBOUND' ? '电话外呼' : '' }}
|
||
{{ form.taskNodeType == 'QUESTIONNAIRE_SCALE' ? '问卷量表' : '' }}
|
||
{{ form.taskNodeType == 'PROPAGANDA_ARTICLE' ? '宣教文案' : '' }}
|
||
{{ form.taskNodeType == 'TEXT_REMIND' ? '文字提醒' : '' }}
|
||
</div>
|
||
</el-form-item>
|
||
<span v-if="form.taskNodeType == 'PHONE_OUTBOUND'">
|
||
<el-form-item label="话术模板" prop="phoneTemplateName">
|
||
<div class="formdiv">
|
||
{{ form.phoneTemplateName }}
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="推送方式" prop="phoneDialMethod">
|
||
<div class="formdiv">
|
||
{{ form.phoneDialMethod == 'COMMON' ? '人工电话' : '' }}
|
||
{{ form.phoneDialMethod == 'AI' ? '自动外呼' : '' }}
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="重播次数" prop="phoneRedialTimes">
|
||
<div class="formdiv">
|
||
{{ returnphoneRedialTime(form.phoneRedialTimes) }}
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="时间间隔(分)" prop="phoneTimeInterval">
|
||
<div class="formdiv">
|
||
{{ form.phoneTimeInterval }}
|
||
</div>
|
||
</el-form-item>
|
||
</span>
|
||
<span v-if="form.taskNodeType == 'QUESTIONNAIRE_SCALE'">
|
||
<el-form-item label="问卷模板" prop="taskNodeType">
|
||
<div class="formdiv">
|
||
{{ form.questionnaireName }}
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="推送方式" prop="phoneDialMethod">
|
||
<div class="formdiv">
|
||
{{ form.phoneDialMethod == '' ? '小程序问卷' : '' }}
|
||
{{ form.phoneDialMethod == 'AI' ? 'AI自动外呼' : '' }}
|
||
{{ form.phoneDialMethod == 'COMMON' ? '人工随访' : '' }}
|
||
</div>
|
||
</el-form-item>
|
||
</span>
|
||
<el-form-item v-if="form.taskNodeType == 'PROPAGANDA_ARTICLE'" label="宣教模板" prop="taskNodeType">
|
||
<div class="formdiv">
|
||
{{ form.propagandaTitle }}
|
||
</div>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="Calloutimmediately">确 定</el-button>
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { patientInfoImportBatchlist, updateSn, outboundConfirmation, directOutbound } from "@/api/manage/patientInfoImport";
|
||
import { selectAgencyList, getDepartmentList, getAgencyList } from "@/api/manage/selectAgencyList";
|
||
import SearchFilter from '../../components/SearchForm.vue'
|
||
import { getAgencytype } from "@/api/system/agency";
|
||
export default {
|
||
name: "Importlist",
|
||
components: { SearchFilter },
|
||
data() {
|
||
return {
|
||
maxTableHeight: undefined,
|
||
//医院list
|
||
hospitalAgencylist: [],
|
||
// 院区list
|
||
campusAgencylist: [],
|
||
// 遮罩层
|
||
loading: true,
|
||
// 选中数组
|
||
ids: [],
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
// 显示搜索条件
|
||
showSearch: true,
|
||
// 总条数
|
||
total: 0,
|
||
// 导入列表
|
||
PatientInfoImportBatchlist: [],
|
||
// 弹出层标题
|
||
title: "",
|
||
// 是否显示弹出层
|
||
open: false,
|
||
createTime: "",
|
||
// 查询参数
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
hospitalAgencyId: null,
|
||
importTimeStart: "",
|
||
importTimeEnd: "",
|
||
campusAgencyId: null,
|
||
sn: "",
|
||
importName: "",
|
||
},
|
||
// 表单参数
|
||
form: {},
|
||
//重播次数
|
||
optionslisttime: [],
|
||
// 表单校验
|
||
rules: {
|
||
manageRouteName: [
|
||
{ required: true, message: '请输入任务名称', trigger: 'change' }
|
||
],
|
||
}
|
||
};
|
||
},
|
||
created() {
|
||
this.selectAgencyinfo();
|
||
this.getList();
|
||
},
|
||
mounted() {
|
||
this.getMaxTableHeight()
|
||
this.screenChange()
|
||
},
|
||
methods: {
|
||
// 流水号/明细
|
||
handsn(row) {
|
||
this.$router.push({
|
||
path: "/patient/ImportDetails",
|
||
query: {
|
||
path: "/patient/patientinfoimport",
|
||
sn: row.sn,
|
||
Timeimport: row.createTime,
|
||
},
|
||
});
|
||
},
|
||
// 外呼
|
||
handOutbound(row) {
|
||
this.$router.push({
|
||
path: "/patient/ManuallyCreatingTasks",
|
||
query: {
|
||
path: "/patient/patientinfoimport",
|
||
// signPatientRecordId: row.id,
|
||
sn: row.sn ? row.sn : '',
|
||
patientName: row.patientName ? row.patientName : '',
|
||
departmentId: row.departmentId ? row.departmentId : '',
|
||
departmentName: row.departmentName ? row.departmentName : '',
|
||
},
|
||
});
|
||
},
|
||
returnphoneRedialTime(text) {
|
||
let arr = this.optionslisttime;
|
||
for (let i = 0; i < arr.length; i++) {
|
||
if (arr[i].dictValue == text) {
|
||
return arr[i].dictLabel;
|
||
}
|
||
}
|
||
},
|
||
// 立即外呼
|
||
ljhandOutbound(row) {
|
||
var dictType = "redial_times";
|
||
getAgencytype(dictType).then((res) => {
|
||
this.optionslisttime = res.data;
|
||
outboundConfirmation().then(res => {
|
||
if (res.data) {
|
||
this.form = res.data;
|
||
this.$set(this.form, 'sn', row.sn + '')
|
||
this.open = true;
|
||
} else {
|
||
this.$modal.msgError("暂无最新外呼数据,请先进行手动外呼");
|
||
}
|
||
})
|
||
});
|
||
},
|
||
Calloutimmediately() {
|
||
this.$refs["form"].validate(valid => {
|
||
if (valid) {
|
||
directOutbound(this.form).then(res => {
|
||
this.$modal.msgSuccess("操作成功");
|
||
this.open = false;
|
||
this.getList();
|
||
})
|
||
}
|
||
})
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDelete(row) {
|
||
// const ids = row.id || this.ids;
|
||
this.$modal.confirm('是否确认删除？').then(() => {
|
||
return updateSn(row.sn);
|
||
}).then(() => {
|
||
this.getList();
|
||
this.$modal.msgSuccess("删除成功");
|
||
}).catch(() => { });
|
||
},
|
||
updateCPage(index, size) {
|
||
this.queryParams.pageNum = index
|
||
this.queryParams.pageSize = size
|
||
this.getList();
|
||
},
|
||
/** 查询 */
|
||
getList() {
|
||
this.loading = true;
|
||
patientInfoImportBatchlist(this.queryParams).then(response => {
|
||
this.PatientInfoImportBatchlist = response.rows;
|
||
this.total = response.total;
|
||
this.loading = false;
|
||
});
|
||
},
|
||
// 取消按钮
|
||
cancel() {
|
||
this.open = false;
|
||
this.reset();
|
||
},
|
||
// 表单重置
|
||
reset() {
|
||
this.form = {};
|
||
this.resetForm("form");
|
||
},
|
||
/** 搜索按钮操作 */
|
||
handleQuery() {
|
||
this.queryParams.pageNum = 1;
|
||
if (this.createTime?.length > 0) {
|
||
this.queryParams.importTimeStart = this.createTime[0];
|
||
this.queryParams.importTimeEnd = this.createTime[1];
|
||
} else {
|
||
this.queryParams.importTimeStart = null;
|
||
this.queryParams.importTimeEnd = null;
|
||
}
|
||
this.getList();
|
||
},
|
||
/** 重置按钮操作 */
|
||
resetQuery() {
|
||
this.queryParams = {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
hospitalAgencyId: null,
|
||
importTimeStart: "",
|
||
importTimeEnd: "",
|
||
campusAgencyId: null,
|
||
sn: "",
|
||
importName: "",
|
||
}
|
||
this.createTime = '';
|
||
// this.resetForm("queryForm");
|
||
this.handleQuery();
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map(item => item.id)
|
||
this.single = selection.length !== 1
|
||
this.multiple = !selection.length
|
||
},
|
||
/** 导出按钮操作 */
|
||
handleExport() {
|
||
this.download('manage/blacklist/export', {
|
||
...this.queryParams
|
||
}, `blacklist_${new Date().getTime()}.xlsx`)
|
||
},
|
||
//获取医院list
|
||
selectAgencyinfo() {
|
||
let query = {
|
||
agencyStatus: 'ON',
|
||
nodeType: 'HOSPITAL',
|
||
}
|
||
selectAgencyList(query).then(res => {
|
||
this.hospitalAgencylist = res.data
|
||
})
|
||
},
|
||
//获取下级单位
|
||
getAgencyListinfo(nodeType, id, type) {
|
||
let query = {
|
||
nodeType: nodeType,
|
||
}
|
||
if (nodeType == 'HOSPITAL') {
|
||
query.hospitalId = id
|
||
} else if (nodeType == 'CAMPUS') {
|
||
query.campusId = id
|
||
}
|
||
getAgencyList(query).then(res => {
|
||
// if (type) {
|
||
if (nodeType == 'HOSPITAL') {
|
||
this.campusAgencylist = res.data.campusList;
|
||
}
|
||
// }
|
||
})
|
||
},
|
||
//选中医院获取院区
|
||
changehospitalAgency(id, type, typetwo) {
|
||
this.getAgencyListinfo('HOSPITAL', id, type)
|
||
// let query = {
|
||
// agencyStatus: 'ON',
|
||
// nodeType: 'CAMPUS',
|
||
// parentId: id,
|
||
// }
|
||
// selectAgencyList(query).then(res => {
|
||
if (type) {
|
||
if (!typetwo) {
|
||
this.form.campusAgencyId = null
|
||
}
|
||
} else {
|
||
this.queryParams.campusAgencyId = null
|
||
}
|
||
// })
|
||
},
|
||
//选中院区获取科室
|
||
changecampusAgency(id, type, typetwo) {
|
||
this.getAgencyListinfo('CAMPUS', id, type)
|
||
},
|
||
//清空医院
|
||
clearhospitalAgency(type) {
|
||
if (type) {
|
||
this.form.campusAgencyId = null
|
||
this.form.departmentId = null
|
||
this.form.wardId = null
|
||
} else {
|
||
this.queryParams.campusAgencyId = null
|
||
this.queryParams.departmentId = null
|
||
this.queryParams.wardId = null
|
||
}
|
||
},
|
||
//清空院区
|
||
clearcampusAgency(type) {
|
||
if (type) {
|
||
this.form.departmentId = null
|
||
this.form.wardId = null
|
||
this.getAgencyListinfo('HOSPITAL', this.form.hospitalAgencyId, type)
|
||
} else {
|
||
this.queryParams.departmentId = null
|
||
this.queryParams.wardId = null
|
||
this.getAgencyListinfo('HOSPITAL', this.queryParams.hospitalAgencyId)
|
||
}
|
||
},
|
||
// 获取表格最高高度
|
||
getMaxTableHeight() {
|
||
const windowInnerHeight = window.innerHeight // 屏幕可视高度
|
||
const layoutDiv = this.$refs.layout
|
||
const formDiv = this.$refs.topform
|
||
const mb8Div = this.$refs.mb8
|
||
this.maxTableHeight =
|
||
windowInnerHeight - 134 -
|
||
this.getBoxPadding(layoutDiv) -
|
||
this.getBoxHeight(mb8Div) -
|
||
this.getBoxHeight(formDiv)
|
||
},
|
||
// 屏幕resize监听
|
||
screenChange() {
|
||
// 屏幕resize监听事件：一旦屏幕宽高发生变化，就会执行resize
|
||
window.addEventListener('resize', this.getMaxTableHeight, true)
|
||
// 将屏幕监听事件移除
|
||
// 这步是必须的。离开页面时不移除，再返回，或者进入到别的有相同元素的页面会报错
|
||
// 或者将这里的方法直接写在beforeDestroy函数中也可以
|
||
this.$once('hook:beforeDestroy', () => {
|
||
window.removeEventListener('resize', this.getMaxTableHeight, true)
|
||
})
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
.formdiv {
|
||
width: 340px;
|
||
border: 1px solid #DCDFE6;
|
||
height: 36px;
|
||
line-height: 36px;
|
||
font-size: 14px;
|
||
padding: 0 15px;
|
||
border-radius: 4px;
|
||
}
|
||
</style> |