You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

495 lines
17 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="container">
<!-- 查询配置 -->
<div style="padding: 0px 20px">
<div ref="lxHeader">
<LxHeader icon="md-apps" text="隐患排查治理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<div slot="content"></div>
<slot>
<div>
<Input style="width: 200px; margin-right: 10px" v-model="searchFields.KeyWord" placeholder="关键字搜索" />
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
<Button type="primary" @click="edit()" style="margin-left: 10px">新增</Button>
</div>
</slot>
</LxHeader>
</div>
<div ref="lxTable">
<el-table :data="tableData" :height="tableHeight" style="width: 100%">
<el-table-column type="index" width="50" align="center"> </el-table-column>
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
:label="column.title" :width="column.width">
<template slot-scope="scope">
<div v-if="column.type=='opt'">
<Button ghost size="small" @click="edit(scope.row)" type="primary"
style="margin-left: 10px;">编辑</Button>
<Button ghost size="small" @click="del(scope.row)" type="error" style="margin-left: 10px;">删除</Button>
</div>
<div v-else-if="column.type=='level'" v-for="hidden in parameters.hiddenLevel">
<div v-if='scope.row[column.field]==hidden.id'>
{{hidden.value}}
</div>
</div>
<div v-else-if="column.type=='type'" v-for="hidden in parameters.hiddenType">
<div v-if='scope.row[column.field]==hidden.id'>
{{hidden.value}}
</div>
</div>
<div v-else>{{scope.row[column.field]}}</div>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
</el-pagination>
</div>
</div>
</div>
<el-dialog title="基础信息" :visible.sync="dialogFormVisible" fullscreen width="90%">
<div class="dialogConcent" :style="{height:clientHeight+'px'}">
<el-scrollbar style="flex: 1">
<el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
<el-row>
<el-col :span="8">
<el-form-item label="科室,运维管理单位" prop="unit" class="units">
<el-select v-model="form.unit" placeholder="请选择科室,运维管理单位" style="width: 100%">
<el-option v-for="item in deptOptions" :key="item.id" :label="item.name" :value="item.name">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="隐患级别" prop="level" label-position="right">
<el-select v-model="form.level" placeholder="请选择隐患级别" style="width: 100%">
<el-option v-for="item in parameters.hiddenLevel" :key="item.id" :label="item.value"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" :offset="6">
<el-form-item label="隐患类别" prop="type">
<el-select v-model="form.type" placeholder="请选择隐患类别" style="width: 100%">
<el-option v-for="item in parameters.hiddenType" :key="item.id" :label="item.value"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="排查日期" prop="date">
<el-date-picker type="date" v-model="form.date" value-format="yyyy-MM-dd HH:mm:ss"
start-placeholder="排查日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" :offset="6">
<el-form-item label="排查负责人" prop="unit" class="">
<el-select v-model="form.responsible_person" placeholder="请选择排查负责人" style="width: 100%">
<el-option v-for="item in userOptions" :key="item.id" :label="item.name" :value="item.name">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="事故隐患情况简述" prop="introduce">
<el-input type="textarea" :rows="3" v-model="form.introduce" placeholder="请填写事故隐患情况简述" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="整改措施" prop="measure">
<el-input type="textarea" :rows="3" v-model="form.measure" placeholder="请填写整改措施" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="效果评估" prop="effect_evaluate">
<el-input type="textarea" :rows="3" v-model="form.effect_evaluate" placeholder="请填写效果评估" autocomplete="off"></el-input>
</el-form-item>
<el-row>
<el-col :span="8">
<el-form-item label="整改责任人" prop="rectify_person" class="">
<el-select v-model="form.rectify_person" placeholder="请选择整改责任人" style="width: 100%">
<el-option v-for="item in userOptions" :key="item.id" :label="item.name" :value="item.name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" :offset="6">
<el-form-item label="复查人" prop="review_person" class="">
<el-select v-model="form.review_person" placeholder="请选择复查人" style="width: 100%">
<el-option v-for="item in userOptions" :key="item.id" :label="item.name" :value="item.name">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="附件" prop="file_list">
<el-upload class="upload-demo" :on-success="handlesuccess" :data="uploadOther"
action="/api/admin/upload-file" :on-remove="handleRemove" :before-remove="beforeRemove"
:on-exceed="handleExceed" :file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
</el-form>
</el-scrollbar>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="resetForm('form')">取 消</el-button>
<el-button type="primary" v-preventReClick @click="submitForm('form')">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
getToken
} from '@/utils/auth'
import LxHeader from "@/components/LxHeader/index.vue";
import Tinymce from '@/components/Tinymce'
import {
save,
store,
del,
get,
listtask
} from "../../api/risk/hiddendangerindex.js";
import {
getparameteritem
} from "../../api/system/dictionary.js";
import {
listdept
} from "../../api/system/department.js";
import {
listuser
} from "../../api/system/user.js";
export default {
components: {
LxHeader,
Tinymce
},
data() {
return {
parameters: {
hiddenLevel: [],
hiddenType: []
},
paginations: {
page: 1,
page_size: 15,
total: 0
},
tableHeight: 0,
dialogFormVisible: false,
formLabelWidth: "120px",
clientHeight: 0,
form: {
unit: "",
level: "",
type: "",
date: "",
responsible_person: "",
introduce: "",
measure: "",
effect_evaluate: "",
rectify_person:"",
review_person:"",
file_list: "",
},
fileList: [],
tableData: [],
rules: {
unit: [{
required: true,
message: '请选择科室,运维管理单位',
trigger: 'blur'
}],
level: [{
required: true,
message: '请选择隐患级别',
trigger: 'blur'
}],
type: [{
required: true,
message: '请选择隐患类别',
trigger: 'blur'
}],
date: [{
required: true,
message: '请选择排查日期',
trigger: 'blur'
}],
responsible_person: [{
required: true,
message: '请输入排查负责人',
trigger: 'blur'
}],
introduce: [{
required: true,
message: '请输入事故隐患情况简述',
trigger: 'blur'
}],
measure: [{
required: true,
message: '请输入整改措施',
trigger: 'blur'
}],
effect_evaluate: [{
required: true,
message: '请输入整改效果评估',
trigger: 'blur'
}],
rectify_person: [{
required: true,
message: '请输入整改人',
trigger: 'blur'
}],
review_person: [{
required: true,
message: '请输入复查人',
trigger: 'blur'
}],
},
tableHeight: 900,
searchFields: {
KeyWord: ""
},
columns: [{
field: "date",
title: "排查日期",
type: "string"
},
{
field: "responsible_person",
title: "排查负责人",
type: "string",
width: 180
},
{
field: "level",
title: "隐患级别",
type: "level",
width: 180
},
{
field: "type",
title: "隐患类别",
type: "type",
width: 180,
},
{
field: "introduce",
title: "简述",
type: "string",
width: 180,
},
{
field: "created_at",
title: "创建信息",
type: "string",
width: 180,
align: "center"
},
{
field: "操作",
title: "操作",
width: 220,
type: "opt",
}
],
uploadOther: {
token: ""
},
deptOptions: [],
userOptions: []
}
},
created() {
this.uploadOther.token = getToken();
this.loadDeptOptions();
this.loadUserOptions();
this.initLoad();
this.load();
},
methods: {
loadDeptOptions() {
listdept().
then((res) => {
this.deptOptions = res;
}).catch(error => {
console.log(error)
reject(error)
})
},
loadUserOptions() {
listuser().
then((res) => {
this.userOptions = res.data;
}).catch(error => {
console.log(error)
reject(error)
})
},
initLoad() {
var that = this;
var clientHeight = document.documentElement.clientHeight
var lxHeader_height = 96.5; //查询 头部
var paginationHeight = 37; //分页的高度
var topHeight = 50; //页面 头部
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
that.tableHeight = tableHeight;
//加载自定义参数
getparameteritem("hiddenLevel").then(res => {
this.parameters.hiddenLevel = res.detail;
});
//加载自定义参数
getparameteritem("hiddenType").then(res => {
this.parameters.hiddenType = res.detail;
});
},
handleCurrentChange(page) {
this.paginations.page = page;
this.load();
},
load() {
listtask({
page: this.paginations.page,
page_size: this.paginations.page_size,
}).then(response => {
this.tableData = response.data;
this.paginations.total = response.total;
}).catch(error => {
console.log(error)
reject(error)
})
},
del(obj) {
var that = this;
if (obj) {
this.$Modal.confirm({
title: '确认要删除数据?',
onOk: () => {
del(obj.id).then(response => {
this.$Message.success('操作成功');
that.load();
}).catch(error => {
console.log(error)
reject(error)
})
},
onCancel: () => {
//this.$Message.info('Clicked cancel');
}
});
}
},
info(obj) {
var that = this;
get(obj.id).then(res => {
let result = Object.assign(that.form, res);
that.form = result;
let _files = [];
for (var mod of result.hidden_danger_files) {
let m = Object.assign({}, mod["files"]);
m.name = mod["files"].original_name;
_files.push(m);
}
that.fileList = _files;
}).catch(error => {
//reject(error)
})
},
edit(obj) {
this.form = this.$options.data().form;
this.clientHeight = document.documentElement.clientHeight - 84 - 110;
if (obj) {
var that = this;
that.info(obj);
} else {}
this.dialogFormVisible = true;
},
submitForm(formName) {
var that = this;
this.$refs[formName].validate((valid) => {
if (valid) {
if (that.form.id) {
that.form.id = that.form.id;
save(that.form).then(response => {
//console.log(response)
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
} else {
store(that.form).then(response => {
//console.log(response)
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
}
that.fileList = [];
} else {
this.$Message.error('数据校验失败');
console.log('error submit!!');
return false;
}
});
},
handleRemove(file, fileList) {
let listUrl = [];
for (var m of fileList) {
if (m.response)
listUrl.push({"upload_id":m.response.id});
else
listUrl.push({"upload_id":m.id});
}
this.form.file_list = listUrl;
},
handleExceed(files, fileList) {},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }`);
},
handlesuccess(response, file, fileList) {
let listUrl = [];
for (var m of fileList) {
if (m.response)
listUrl.push({"upload_id":m.response.id});
else
listUrl.push({"upload_id":m.id});
}
this.form.file_list = listUrl;
},
resetForm(formName) {
var that = this;
that.fileList = [];
this.$refs[formName].resetFields();
that.dialogFormVisible = false;
},
}
}
</script>
<style scoped="scoped">
.dialogConcent {
overflow-y: auto;
}
.units label{
line-height: 22px;
}
</style>