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.

583 lines
19 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="search" style="margin-left: 10px">查询</Button>
<Button type="primary" @click="edit()" style="margin-left: 10px">新增</Button>
</div>
</slot>
</LxHeader>
</div>
<div ref="lxTable" class="table-tree">
<el-table :data="tableData" class="v-table" :height="tableHeight" style="width: 100%">
<el-table-column type="index" fixed width="50" align="center"> </el-table-column>
<el-table-column :prop="column.field" :fixed="column.fixed" :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=='formats'">
<div v-if="column.field=='admin'||column.field=='department'||column.field=='maintenance_department'">
{{scope.row[column.field]?scope.row[column.field].name:""}}
</div>
</div>
<div v-else-if="column.type=='check_person'">
<div v-for="item in userOptions">
<div v-if='scope.row[column.field]==item.id'>
{{item.name}}
</div>
</div>
</div>
<div v-else-if="column.type=='unit'">
<div v-for="item in deptOptions">
<div v-if='scope.row[column.field]==item.id'>
{{item.name}}
</div>
</div>
</div>
<div v-else-if="column.type=='result'" >
<div v-for="item in results">
<div v-if='scope.row[column.field]==item.id'>
{{item.value}}
</div>
</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="name">
<el-input v-model="form.name" placeholder="请填写制度名称" autocomplete="off"></el-input>
</el-form-item>
</el-col>
</el-row>
<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.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" :offset="8">
<el-form-item label="检查评定时间" prop="check_time">
<el-date-picker style="width:100%" type="date" v-model="form.check_time" value-format="yyyy-MM-dd"
placeholder="检查评定时间">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="检查评定人员" prop="check_person" class="">
<el-select v-model="form.check_person" placeholder="请选择检查评定人员" style="width: 100%">
<el-option v-for="item in userOptions" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="适宜性" prop="suit">
<el-input type="textarea" v-model="form.suit" :rows="3" placeholder="请填写适宜性" autocomplete="off">
</el-input>
</el-form-item>
<el-form-item>
<el-upload class="upload-demo" :on-success="handlesuccess" :data="uploadOther"
:action="action" :before-remove="beforeRemove"
:on-exceed="handleExceed" :file-list="fileList.suit_rule_files">
<el-button size="small" type="primary" @click="toupload('suit_file_list')">点击上传</el-button>
</el-upload>
</el-form-item>
<el-form-item label="充分性" prop="full">
<el-input type="textarea" v-model="form.full" :rows="3" placeholder="请填写充分性" autocomplete="off">
</el-input>
</el-form-item>
<el-form-item>
<el-upload class="upload-demo" :on-success="handlesuccess" :data="uploadOther"
::action="action" :before-remove="beforeRemove"
:on-exceed="handleExceed" :file-list="fileList.full_rule_files">
<el-button size="small" type="primary" @click="toupload('full_file_list')">点击上传</el-button>
</el-upload>
</el-form-item>
<el-form-item label="有效性" prop="effect">
<el-input type="textarea" v-model="form.effect" :rows="3" placeholder="请填写有效性" autocomplete="off">
</el-input>
</el-form-item>
<el-form-item>
<el-upload class="upload-demo" :on-success="handlesuccess" :data="uploadOther"
::action="action" :before-remove="beforeRemove"
:on-exceed="handleExceed" :file-list="fileList.effect_rule_files">
<el-button size="small" type="primary" @click="toupload('effect_file_list')">点击上传</el-button>
</el-upload>
</el-form-item>
<el-form-item label="评定结果" prop="result">
<el-radio v-for="item in this.results" v-model="form.result" :label="item.id">{{item.value}}</el-radio>
</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 {
getparameteritem
} from "../../api/system/dictionary.js"
import {
save,
store,
del,
get,
listtask
} from "../../api/improvement/rule.js";
import {
listuser
} from "../../api/system/user.js";
import {
listdept
} from "../../api/system/department.js"
export default {
components: {
LxHeader,
Tinymce
},
data() {
return {
action:`${process.env.VUE_APP_BASE_API}/api/admin/upload-file`,
touploadType: "",
checkAll: false,
isIndeterminate: true,
parameters: {
accidentType: [],
accidentLevel: []
},
paginations: {
page: 1,
page_size: 15,
total: 0
},
tableHeight: 0,
dialogFormVisible: false,
formLabelWidth: "120px",
clientHeight: 0,
form: {
name: "",
unit: "",
check_time: "",
check_person: "",
suit: "",
full: "",
effect: "",
result: "",
suit_file_list: [],
full_file_list: [],
effect_file_list: [],
},
fileList: {
suit_rule_files: [],
full_rule_files: [],
effect_rule_files: [],
},
tableData: [],
rules: {
name: [{
required: true,
message: '请填写制度名称',
trigger: 'blur'
}],
unit: [{
required: true,
message: '请选择归口科室,运维管理单位',
trigger: 'blur'
}]
},
tableHeight: 900,
searchFields: {
KeyWord: ""
},
columns: [{
field: "name",
title: "制度名称",
type: "string",
width:240,
align:'left'
},
{
field: "check_time",
title: "检查时间",
type: "string",
width: 180,
align: "center"
},
{
field: "check_person",
title: "检查评定人员",
type: "check_person",
width: 120,
align: "center"
},
{
field: "unit",
title: "科室",
type: "unit",
align: "center",
width: 120,
},
{
field: "result",
title: "评定结果",
type: "result",
width: 120,
align: "left"
},
{
field: "created_at",
title: "创建信息",
type: "string",
width: 180,
align: "center"
},
{
field: "admin",
title: "创建人",
type: "formats",
width: 120,
align: "center"
},
{
field: "department",
title: "创建人科室",
type: "formats",
width: 120,
align: "center"
},
{
field: "操作",
title: "操作",
width: 220,
type: "opt",
fixed:"right"
}
],
uploadOther: {
token: ""
},
deptOptions: [],
all_files: [],
userOptions: [],
results:[{
id:1,
value:"不修改"
},{
id:2,
value:"局部修改"
},{
id:3,
value:"重新编织"
},]
}
},
created() {
this.uploadOther.token = getToken();
this.loadDeptOptions();
this.loadUserOptions();
this.initLoad();
this.load();
},
methods: {
toupload(type) {
console.log(type)
this.touploadType = type;
},
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)
})
},
handleCheckAllChange(val) {
console.log(val)
let options = [];
for (var m of this.deptOptions) {
options.push(m.id);
}
this.form.department_list = val ? options : [];
this.isIndeterminate = false;
},
handleCheckedDeptChange(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.deptOptions.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.deptOptions.length;
},
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("accidentLevel").then(res => {
this.parameters.accidentLevel = res.detail;
});
//加载自定义参数
getparameteritem("accidentType").then(res => {
this.parameters.accidentType = res.detail;
});
},
handleCurrentChange(page) {
this.paginations.page = page;
this.load();
},
search() {
this.paginations.page = 1;
this.load();
},
load() {
listtask({
page: this.paginations.page,
page_size: this.paginations.page_size,
keyword:this.searchFields.KeyWord
}).then(res => {
this.tableData = res.data;
this.paginations.total = res.total
}).catch(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');
}
});
}
},
show(obj) {
this.clientHeight = document.documentElement.clientHeight - 84 - 110;
this.dialogViewVisible = true;
this.info(obj);
},
info(obj) {
var that = this;
get(obj.id).then(res => {
let result = Object.assign(that.form, res);
that.form = result;
Object.keys(this.fileList).map(key => {
if (result[key].length != 0) {
let _files = [];
for (var mod of result[key]) {
let m = Object.assign({}, mod.files);
m.name = mod.files.original_name;
_files.push(m);
m.touploadType = key;
that.all_files.push(m);
}
that.fileList[key] = _files;
}
})
}).catch(error => {
//reject(error)
})
},
edit(obj) {
var that = this;
this.form = this.$options.data().form;
that.fileList.effect_rule_files = [];
that.fileList.full_rule_files = [];
that.fileList.suit_file_lists = [];
this.clientHeight = document.documentElement.clientHeight - 84 - 110;
if (obj) {
that.info(obj);
} else {}
this.dialogFormVisible = true;
},
submitForm(formName) {
var that = this;
this.$refs[formName].validate((valid) => {
if (valid) {
if (that.form.id) {
save(that.form).then(response => {
//console.log(response)
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
} else {
// console.log("that.form",that.form);
// return;
store(that.form).then(response => {
//console.log(response)
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
}
that.fileList.effect_rule_files = [];
that.fileList.full_rule_files = [];
that.fileList.suit_rule_files = [];
} else {
this.$Message.error('数据校验失败');
console.log('error submit!!');
return false;
}
});
},
handleRemove(file, fileList) {
var _touploadType = this.all_files.filter((x) => {
return x.uid == file.uid;
})[0].touploadType;
console.log(_touploadType);
var type = 1;
let listUrl = [];
for (var m of fileList) {
if (m.response)
listUrl.push({
upload_id: m.response.id,
type: type
});
else
listUrl.push({
upload_id: m.id,
type: type
});
}
this.form[_touploadType] = listUrl;
},
handleExceed(files, fileList) {},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }`);
},
handlesuccess(response, file, fileList) {
//console.log(response,file,fileList);
let listUrl = [];
var type = 1;
Object.keys(this.fileList).map((key, index) => {
if (this.touploadType == key)
type = index + 1
})
for (var m of fileList) {
if (m.response)
listUrl.push({
upload_id: m.response.id,
type: type
});
else
listUrl.push({
upload_id: m.id,
type: type
});
}
file.touploadType = this.touploadType;
this.all_files.push(file);
this.form[this.touploadType] = listUrl;
},
resetForm(formName) {
var that = this;
that.fileList.effect_rule_files = [];
that.fileList.full_rule_files = [];
that.fileList.suit_rule_files = [];
this.$refs[formName].resetFields();
that.dialogFormVisible = false;
},
}
}
</script>
<style>
.dialogConcent {
overflow-y: auto;
}
.units label {
line-height: 22px;
}
</style>