forked from xxhjsb/hbt-prevention-ui
feat:新增风险辨识清单 风险管控措施清单
kongyeqing
parent
748be50781
commit
a930cbf338
|
|
@ -6,11 +6,11 @@ export default class IdentifyService extends BaseService<any>{
|
|||
super()
|
||||
}
|
||||
public selectByPage(params: any):Promise<AxiosResponse<ActionResult<any>>>{
|
||||
const url = this.prefix.system+'/user/list';
|
||||
const url = this.prefix.prevention+'/risk/identifyinventory/getList';
|
||||
return this.get(url,params,true)
|
||||
}
|
||||
public deleteByIds(params):Promise<AxiosResponse<ActionResult<any>>>{
|
||||
const url = this.prefix.system+'/user/list';
|
||||
const url = this.prefix.prevention+'/risk/identifyinventory';
|
||||
return this.deleteBatch(url,params,{},true)
|
||||
}
|
||||
}
|
||||
|
|
@ -6,11 +6,13 @@ export default class MeasuresService extends BaseService<any>{
|
|||
super()
|
||||
}
|
||||
public selectByPage(params: any):Promise<AxiosResponse<ActionResult<any>>>{
|
||||
const url = this.prefix.system+'/user/list';
|
||||
const url = this.prefix.prevention+'/risk/inventory/list';
|
||||
return this.get(url,params,true)
|
||||
}
|
||||
public deleteByIds(params):Promise<AxiosResponse<ActionResult<any>>>{
|
||||
const url = this.prefix.system+'/user/list';
|
||||
const url = this.prefix.prevention+'/risk/inventory';
|
||||
return this.deleteBatch(url,params,{},true)
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
<div class="common-box dis-flex " >
|
||||
<div class="common-tree-box" v-if="treeData">
|
||||
<el-tree :data="treeData" :expand-on-click-node="false" default-expand-all highlight-current @node-click="handleNodeClick">
|
||||
</el-tree>
|
||||
<div class="common-box dis-flex ">
|
||||
<div class="common-tree-box">
|
||||
<UnitTreeComponent @callback="handleNodeClick"></UnitTreeComponent>
|
||||
</div>
|
||||
<div class="common-content-box dis-flex flex-col flex-1">
|
||||
<div class="search-box">
|
||||
|
|
@ -10,13 +9,18 @@
|
|||
</div>
|
||||
<div class="table-box flex-1">
|
||||
<TableComponent :tableData="tableData" :tableColumn="tableColumn" @tabCallback="callback($event)"
|
||||
@actionCallback="callback($event)" @pageNumberChange="callback($event)" @pageSizeChange="callback($event)"
|
||||
:footerActions="footerActions" :actions="tableActions">
|
||||
|
||||
@actionCallback="callback($event)" @pageNumberChange="callback($event)"
|
||||
@pageSizeChange="callback($event)" :footerActions="footerActions" :actions="tableActions">
|
||||
|
||||
<el-table ref="multipleTable" :data="tableData.datas" height="100%" border row-key="checked"
|
||||
@selection-change="handleSelectionChange" style="width: 100%">
|
||||
<el-table-column type="selection" label="全选" width="60">
|
||||
</el-table-column>
|
||||
<el-table-column label="序号" width="60">
|
||||
<template slot-scope="scope">
|
||||
{{scope.$index+1}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template v-for="item in tableColumn">
|
||||
<el-table-column v-if="item.render" :label="item.name" :width="item.width" :key="item.key">
|
||||
<div slot-scope="scope" v-html="item.render(scope.row)"></div>
|
||||
|
|
@ -26,18 +30,28 @@
|
|||
</template>
|
||||
<el-table-column label="操作" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="showUpdateModel(scope.row.userId)">查看</el-button>
|
||||
<el-button type="text" @click="deleteData([scope.row])">删除</el-button>
|
||||
<el-button type="text" @click="showUpdateModel(scope.row)">查看</el-button>
|
||||
<el-button type="text" @click="deleteData([scope.row.id])">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
|
||||
</TableComponent>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog :close-on-click-modal="false" :title="currentId>0?'详情':currentId===-1?'新增':'编辑'" :visible.sync="showUpdate" width="952px"
|
||||
<el-dialog :close-on-click-modal="false" :title="'详情'" :visible.sync="showUpdate" width="952px"
|
||||
:before-close="handleClose">
|
||||
<FormComponent :options="updateOptions" :isReadonly="true" labelWidth="110px" labelAlign="right" :data.sync="updateParams"></FormComponent>
|
||||
<div class="sub-title">风险辨识情况</div>
|
||||
<FormComponent :options="updateOptions" :isReadonly="true" labelWidth="110px" labelAlign="right"
|
||||
:data.sync="subUpdateParams"></FormComponent>
|
||||
<div class="sub-title">风险评估情况</div>
|
||||
<FormComponent :options="subRiskOptions" :isReadonly="true" labelWidth="110px" labelAlign="right"
|
||||
:data.sync="riskUpdateParams"></FormComponent>
|
||||
<div class="sub-title">残余风险评估情况</div>
|
||||
<FormComponent :options="subRemnantsOptions" :isReadonly="true" labelWidth="110px" labelAlign="right"
|
||||
:data.sync="remainUpdateParams"></FormComponent>
|
||||
<ButtonListComponent :actions="subActions" @callback="subCallback" btn-position="center" :full-btn="true">
|
||||
</ButtonListComponent>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
|
@ -9,158 +9,433 @@ import IdentifyService from "@/service/identify.service"
|
|||
import FormOption from "hbt-common/models/formOptions"
|
||||
import BtnOption from "hbt-common/models/btnOptions"
|
||||
import DrawComponent from '@/components/draw.component.vue';
|
||||
import ButtonListComponent from "hbt-common/components/common/buttonList.component.vue";
|
||||
import UnitTreeComponent from '@/components/tree.component.vue';
|
||||
|
||||
@Component({
|
||||
template,
|
||||
components:{
|
||||
components: {
|
||||
FormComponent,
|
||||
TableComponent,
|
||||
DrawComponent,
|
||||
ButtonListComponent,
|
||||
UnitTreeComponent,
|
||||
},
|
||||
})
|
||||
export default class IdentifyManagerComponent extends BaseRecordComponent<any> {
|
||||
public tableService = new IdentifyService();
|
||||
|
||||
public params = {} as any;
|
||||
|
||||
public treeData = [{
|
||||
label: '一级 1',
|
||||
children: [{
|
||||
label: '二级 1-1',
|
||||
children: [{
|
||||
label: '三级 1-1-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 2',
|
||||
children: [{
|
||||
label: '二级 2-1',
|
||||
children: [{
|
||||
label: '三级 2-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 2-2',
|
||||
children: [{
|
||||
label: '三级 2-2-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 3',
|
||||
children: [{
|
||||
label: '二级 3-1',
|
||||
children: [{
|
||||
label: '三级 3-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 3-2',
|
||||
children: [{
|
||||
label: '三级 3-2-1'
|
||||
}]
|
||||
}]
|
||||
}]
|
||||
public params = {
|
||||
areaId:null,
|
||||
unitId:null,
|
||||
} as any;
|
||||
|
||||
public formActions = [{
|
||||
name:"查询",
|
||||
value:"search",
|
||||
icon:"el-icon-search",
|
||||
type:"primary"
|
||||
},{
|
||||
name:"清空",
|
||||
icon:"el-icon-tickets",
|
||||
value:"reset"
|
||||
name: "查询",
|
||||
value: "search",
|
||||
icon: "el-icon-search",
|
||||
type: "primary"
|
||||
}, {
|
||||
name: "清空",
|
||||
icon: "el-icon-tickets",
|
||||
value: "reset"
|
||||
}];
|
||||
public tableActions = [{
|
||||
name:"批量删除",
|
||||
value:"delete",
|
||||
plain:true,
|
||||
icon:"el-icon-delete",
|
||||
type:"danger"
|
||||
name: "批量删除",
|
||||
value: "delete",
|
||||
plain: true,
|
||||
icon: "el-icon-delete",
|
||||
type: "danger"
|
||||
}];
|
||||
public footerActions = [{
|
||||
name:"选择全部",
|
||||
value:"selectAll",
|
||||
type:"primary"
|
||||
},{
|
||||
name:"反向选择",
|
||||
value:"reverse"
|
||||
name: "选择全部",
|
||||
value: "selectAll",
|
||||
type: "primary"
|
||||
}, {
|
||||
name: "反向选择",
|
||||
value: "reverse"
|
||||
}];
|
||||
public formOptions:FormOption<BtnOption>[] = [{
|
||||
name:"区域名称",
|
||||
key:"areaId",
|
||||
type:"text",
|
||||
},{
|
||||
name:"单元名称",
|
||||
key:"unitId",
|
||||
type:"text",
|
||||
public formOptions: FormOption<BtnOption>[] = [{
|
||||
name: "管控对象",
|
||||
key: "controlName",
|
||||
type: "text",
|
||||
}, {
|
||||
name: "分析对象",
|
||||
key: "analName",
|
||||
type: "text",
|
||||
}];
|
||||
|
||||
public subActions = [{
|
||||
name: "取消",
|
||||
value: "cancel"
|
||||
}];
|
||||
|
||||
public showUpdate = false;
|
||||
public updateParams = {} as any;
|
||||
public updateParams = {} as any;
|
||||
public selectData = [];
|
||||
//风险辨识情况
|
||||
public subUpdateParams = {} as any;
|
||||
//风险评估情况
|
||||
public riskUpdateParams = {} as any;
|
||||
//残余风险评估情况
|
||||
public remainUpdateParams = {} as any;
|
||||
|
||||
created(){
|
||||
public updateOptions: FormOption<BtnOption>[] = [] as any;
|
||||
//风险评估
|
||||
public subRiskOptions: FormOption<BtnOption>[] = [];
|
||||
//残余风险评估
|
||||
public subRemnantsOptions: FormOption<BtnOption>[] = [];
|
||||
public buildUpdateForm() {
|
||||
this.updateOptions = [{
|
||||
name: "管控对象",
|
||||
key: "controlName",
|
||||
type: "textarea",
|
||||
require: true,
|
||||
width: "calc(50% - 20px)",
|
||||
disable: true,
|
||||
},
|
||||
{
|
||||
name: "分析对象",
|
||||
key: "analName",
|
||||
type: "textarea",
|
||||
require: true,
|
||||
width: "calc(50% - 20px)",
|
||||
disable: true,
|
||||
},
|
||||
{
|
||||
name: "风险源",
|
||||
key: "riskSource",
|
||||
type: "text",
|
||||
require: true,
|
||||
width: "calc(50% - 20px)"
|
||||
},
|
||||
{
|
||||
name: "最严重后果",
|
||||
key: "seriousResult",
|
||||
format: "seriousResultName",
|
||||
type: "select",
|
||||
require: true,
|
||||
multiple: true,
|
||||
width: "calc(50% - 20px)",
|
||||
datas: this.$store.state.prevention_serious_result,
|
||||
},
|
||||
{
|
||||
name: "危害分析",
|
||||
key: "hazardAnalysis",
|
||||
type: "text",
|
||||
require: true,
|
||||
width: "calc(100% - 20px)"
|
||||
},
|
||||
{
|
||||
name: "安全警示标识",
|
||||
key: "safetySign",
|
||||
format: "safetySignName",
|
||||
type: "select",
|
||||
require: true,
|
||||
multiple: true,
|
||||
width: "calc(50% - 20px)",
|
||||
datas: this.$store.state.prevention_security_identifier,
|
||||
},
|
||||
{
|
||||
name: "设置复评时间",
|
||||
key: "reviewStartTime",
|
||||
type: "date",
|
||||
subType: "date",
|
||||
width: "calc(50% - 20px)",
|
||||
require: true,
|
||||
showError: false,
|
||||
format: "yyyy-MM-dd"
|
||||
},];
|
||||
|
||||
this.subRiskOptions = [
|
||||
{
|
||||
name: "LS法：",
|
||||
key: "riskLSValue",
|
||||
type: "text",
|
||||
// width: "20px",
|
||||
}, {
|
||||
name: "L值：",
|
||||
key: "lslvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "S值：",
|
||||
key: "lssvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "R值：",
|
||||
key: "lsrvalue",
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "风险等级：",
|
||||
key: "lsgrade",
|
||||
format: 'lsgradeName',
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "60px",
|
||||
}, {
|
||||
name: "LEC法：",
|
||||
key: "riskLECValue",
|
||||
type: "text",
|
||||
// labelWidth: "30px",
|
||||
}, {
|
||||
name: "L值：",
|
||||
key: "leclvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "E值：",
|
||||
key: "lecevalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "C值：",
|
||||
key: "leccvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "D值：",
|
||||
key: "lecdvalue",
|
||||
type: "text",
|
||||
width: "15%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "风险等级：",
|
||||
key: "lecgrade",
|
||||
format: "lecgradeName",
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "60px",
|
||||
}, {
|
||||
name: "风险等级",
|
||||
key: "riskLevel",
|
||||
format: "riskLevelName",
|
||||
type: "text",
|
||||
require: true,
|
||||
width: "100%",
|
||||
}, {
|
||||
name: "管控层级",
|
||||
key: "riskControlLevel",
|
||||
format: "riskControlLevelName",
|
||||
type: "text",
|
||||
require: true,
|
||||
}];
|
||||
|
||||
this.subRemnantsOptions = [
|
||||
{
|
||||
name: "LS法：",
|
||||
key: "remainLSValue",
|
||||
type: "text",
|
||||
// width: "30px",
|
||||
}, {
|
||||
name: "L值：",
|
||||
key: "lslvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "S值：",
|
||||
key: "lssvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "R值：",
|
||||
key: "lsrvalue",
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "风险等级：",
|
||||
key: "lsgrade",
|
||||
format: "lsgradeName",
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "60px",
|
||||
}, {
|
||||
name: "LEC法：",
|
||||
key: "remainLECValue",
|
||||
type: "text",
|
||||
// width: "30px",
|
||||
}, {
|
||||
name: "L值：",
|
||||
key: "leclvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "E值：",
|
||||
key: "lecevalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "C值：",
|
||||
key: "leccvalue",
|
||||
type: "text",
|
||||
width: "10%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "D值：",
|
||||
key: "lecdvalue",
|
||||
type: "text",
|
||||
width: "15%",
|
||||
labelWidth: "40px",
|
||||
}, {
|
||||
name: "风险等级：",
|
||||
key: "lecgrade",
|
||||
format: "lecgradeName",
|
||||
type: "text",
|
||||
width: "20%",
|
||||
labelWidth: "60px",
|
||||
}, {
|
||||
name: "风险等级",
|
||||
key: "remainLevel",
|
||||
format: "remainLevelName",
|
||||
type: "select",
|
||||
require: true,
|
||||
width: "calc(50% - 20px)",
|
||||
},];
|
||||
}
|
||||
|
||||
created() {
|
||||
this.buildUpdateForm()
|
||||
}
|
||||
|
||||
// 树点击
|
||||
public handleNodeClick(data){
|
||||
console.log(data)
|
||||
public handleNodeClick(data) {
|
||||
this.params.unitId = "";
|
||||
this.params.areaId = "";
|
||||
if (data.areaId) {
|
||||
this.params.unitId = data.id
|
||||
} else {
|
||||
this.params.areaId = data.id
|
||||
}
|
||||
this.getTableData()
|
||||
}
|
||||
|
||||
public buildTable(){
|
||||
this.tableColumn.push({name:'序号',key:"index"});
|
||||
this.tableColumn.push({name:'管控对象',key:"deptName",width:"200px"});
|
||||
this.tableColumn.push({name:'分析对象',key:"deptName",width:"200px"});
|
||||
this.tableColumn.push({name:'风险源',key:"person",width:"200px"});
|
||||
this.tableColumn.push({name:'事故后果',key:"person",width:"250px"});
|
||||
this.tableColumn.push({name:'风险等级',key:"status",render:(data)=>{
|
||||
if(data.status==0){
|
||||
return "<span class='noDraw'>未绘制</span>"
|
||||
}else{
|
||||
return "<span>已绘制</span>"
|
||||
public buildTable() {
|
||||
this.tableColumn.push({ name: '管控对象', key: "controlName", width: "200px" });
|
||||
this.tableColumn.push({ name: '分析对象', key: "analName", width: "200px" });
|
||||
this.tableColumn.push({ name: '风险源', key: "riskSource", width: "150px" });
|
||||
this.tableColumn.push({
|
||||
name: '事故后果', key: "seriousResult", width: "250px", render: (data) => {
|
||||
if (data.seriousResult) {
|
||||
return data.seriousResult.split(";").map(item => this.$store.getters.prevention_serious_result_map[item]).join(";")
|
||||
}
|
||||
}
|
||||
}});
|
||||
this.tableColumn.push({name:'残余风险等级', width:"110px",key:"status",render:(data)=>{
|
||||
if(data.status==0){
|
||||
return "<span class='noDraw'>未绘制</span>"
|
||||
}else{
|
||||
return "<span>已绘制</span>"
|
||||
});
|
||||
this.tableColumn.push({
|
||||
name: '风险等级', key: "riskLevel", render: (data) => {
|
||||
return "<span class='color_" + data.riskLevel + "'>" + (data.riskLevel ? (this.$store.getters.prevention_risk_level_map[data.riskLevel]) : '') + "</span>"
|
||||
}
|
||||
}});
|
||||
this.tableColumn.push({name:'评估人',key:"person"});
|
||||
this.tableColumn.push({name:'评估时间',key:"person",width:"150px"});
|
||||
});
|
||||
this.tableColumn.push({
|
||||
name: '残余风险等级', width: "110px", key: "remainLevel", render: (data) => {
|
||||
return "<span class='color_" + data.remainLevel + "'>" + (data.remainLevel ? (this.$store.getters.prevention_risk_level_map[data.remainLevel]) : '') + "</span>"
|
||||
}
|
||||
});
|
||||
this.tableColumn.push({ name: '评估人', key: "appraiser" });
|
||||
this.tableColumn.push({ name: '评估时间', key: "appraiseTime", width: "150px" });
|
||||
}
|
||||
|
||||
public callback(data){
|
||||
public callback(data) {
|
||||
// 查询
|
||||
if(data.value==="search"){
|
||||
if (data.value === "search") {
|
||||
this.getTableData()
|
||||
// 重置
|
||||
}else if(data.value === "reset"){
|
||||
// 重置
|
||||
} else if (data.value === "reset") {
|
||||
this.reset()
|
||||
// 反选
|
||||
}else if(data.value === "reverse"){
|
||||
// 反选
|
||||
} else if (data.value === "reverse") {
|
||||
this.toggleAll()
|
||||
// 全选
|
||||
}else if(data.value === "selectAll"){
|
||||
// 全选
|
||||
} else if (data.value === "selectAll") {
|
||||
this.selectAll()
|
||||
}else if(data.value === "delete"){
|
||||
this.deleteData(this.selectData.map((item:any)=>item.id))
|
||||
} else if (data.value === "delete") {
|
||||
this.deleteData(this.selectData.map((item: any) => item.id))
|
||||
}
|
||||
}
|
||||
// 重置数据
|
||||
public reset(){
|
||||
public reset() {
|
||||
this.params = {
|
||||
pageNum:1,
|
||||
pageSize:20,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
} as any;
|
||||
}
|
||||
|
||||
|
||||
|
||||
public showUpdateModel(id){
|
||||
public showUpdateModel(row) {
|
||||
this.showUpdate = true
|
||||
const tmprow = JSON.parse(JSON.stringify(row))
|
||||
this.subUpdateParams = tmprow
|
||||
this.subUpdateParams.safetySignName = tmprow.safetySign.split(';').map(item => this.$store.getters.prevention_security_identifier_map[item]).join(";")
|
||||
this.subUpdateParams.seriousResultName = tmprow.seriousResult.split(';').map(item => this.$store.getters.prevention_serious_result_map[item]).join(";")
|
||||
|
||||
//风险评估
|
||||
this.riskUpdateParams.riskLevelName = this.$store.getters.prevention_risk_level_map[tmprow.riskLevel]
|
||||
this.riskUpdateParams.riskControlLevelName = this.$store.getters.prevention_control_level_map[tmprow.riskControlLevel]
|
||||
if (tmprow.riskLsValue) {
|
||||
const riskLsValue = JSON.parse(tmprow.riskLsValue)
|
||||
const tmpRiskLsValue = {}
|
||||
for (let key in riskLsValue) {
|
||||
if (key.indexOf('ls') !== -1) {
|
||||
tmpRiskLsValue[key] = riskLsValue[key];
|
||||
}
|
||||
}
|
||||
this.riskUpdateParams = { ...this.riskUpdateParams, ...tmpRiskLsValue }
|
||||
this.riskUpdateParams.lsgradeName = this.$store.getters.prevention_risk_level_map[this.riskUpdateParams.lsgrade]
|
||||
}
|
||||
if (tmprow.riskLecValue) {
|
||||
const riskLecValue = JSON.parse(tmprow.riskLecValue)
|
||||
const tmpRiskLecValue = {}
|
||||
for (let key in riskLecValue) {
|
||||
if (key.indexOf('lec') !== -1) {
|
||||
tmpRiskLecValue[key] = riskLecValue[key];
|
||||
}
|
||||
}
|
||||
this.riskUpdateParams = { ...this.riskUpdateParams, ...tmpRiskLecValue }
|
||||
this.riskUpdateParams.lecgradeName = this.$store.getters.prevention_risk_level_map[this.riskUpdateParams.lsgrade]
|
||||
}
|
||||
|
||||
//残余风险评估
|
||||
this.remainUpdateParams.remainLevelName = this.$store.getters.prevention_risk_level_map[tmprow.remainLevel]
|
||||
if (tmprow.remainLsValue) {
|
||||
const remainLsValue = JSON.parse(tmprow.remainLsValue)
|
||||
const tmpRemainLsValue = {}
|
||||
for (let key in remainLsValue) {
|
||||
if (key.indexOf('ls') !== -1) {
|
||||
tmpRemainLsValue[key] = remainLsValue[key];
|
||||
}
|
||||
}
|
||||
this.remainUpdateParams = { ...this.remainUpdateParams, ...tmpRemainLsValue }
|
||||
this.remainUpdateParams.lsgradeName = this.$store.getters.prevention_risk_level_map[this.remainUpdateParams.lsgrade]
|
||||
|
||||
}
|
||||
if (tmprow.remainLecValue) {
|
||||
const remainLecValue = JSON.parse(tmprow.remainLecValue)
|
||||
const tmpRemainLecValue = {}
|
||||
for (let key in remainLecValue) {
|
||||
if (key.indexOf('lec') !== -1) {
|
||||
tmpRemainLecValue[key] = remainLecValue[key];
|
||||
}
|
||||
}
|
||||
this.remainUpdateParams = { ...this.remainUpdateParams, ...tmpRemainLecValue }
|
||||
this.remainUpdateParams.lecgradeName = this.$store.getters.prevention_risk_level_map[this.remainUpdateParams.lecgrade]
|
||||
}
|
||||
this.buildUpdateForm()
|
||||
}
|
||||
|
||||
public handleClose(){
|
||||
public handleClose() {
|
||||
this.showUpdate = false;
|
||||
}
|
||||
|
||||
|
|
@ -168,22 +443,26 @@ export default class IdentifyManagerComponent extends BaseRecordComponent<any> {
|
|||
public toggleAll() {
|
||||
(this.$refs.multipleTable as any).toggleAllSelection();
|
||||
}
|
||||
public selectAll(){
|
||||
if(!this.selectData.length){
|
||||
public selectAll() {
|
||||
if (!this.selectData.length) {
|
||||
this.toggleAll()
|
||||
}else{
|
||||
this.tableData.datas.forEach((item,index)=>{
|
||||
const find = this.selectData.find((data:any)=>data.userId === item.userId);
|
||||
if(!find){
|
||||
} else {
|
||||
this.tableData.datas.forEach((item, index) => {
|
||||
const find = this.selectData.find((data: any) => data.userId === item.userId);
|
||||
if (!find) {
|
||||
(this.$refs.multipleTable as any).toggleRowSelection(item);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
public handleSelectionChange(data){
|
||||
public handleSelectionChange(data) {
|
||||
this.selectData = data;
|
||||
}
|
||||
|
||||
public subCallback() {
|
||||
this.showUpdate = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped src="../../common.component.scss"></style>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<div class="common-box dis-flex " >
|
||||
<div class="common-tree-box" v-if="treeData">
|
||||
<el-tree :data="treeData" :expand-on-click-node="false" default-expand-all highlight-current @node-click="handleNodeClick">
|
||||
</el-tree>
|
||||
<div class="common-box dis-flex ">
|
||||
<div class="common-tree-box">
|
||||
<UnitTreeComponent @callback="handleNodeClick"></UnitTreeComponent>
|
||||
</div>
|
||||
<div class="common-content-box dis-flex flex-col flex-1">
|
||||
<div class="search-box">
|
||||
|
|
@ -10,33 +9,56 @@
|
|||
</div>
|
||||
<div class="table-box flex-1">
|
||||
<TableComponent :tableData="tableData" :tableColumn="tableColumn" @tabCallback="callback($event)"
|
||||
@actionCallback="callback($event)" @pageNumberChange="callback($event)" @pageSizeChange="callback($event)"
|
||||
:footerActions="footerActions" :actions="tableActions">
|
||||
|
||||
@actionCallback="callback($event)" @pageNumberChange="callback($event)"
|
||||
@pageSizeChange="callback($event)" :footerActions="footerActions" :actions="tableActions">
|
||||
|
||||
<el-table ref="multipleTable" :data="tableData.datas" height="100%" border row-key="checked"
|
||||
@selection-change="handleSelectionChange" style="width: 100%">
|
||||
<el-table-column type="selection" label="全选" width="60">
|
||||
</el-table-column>
|
||||
<el-table-column label="序号" width="60">
|
||||
<template slot-scope="scope">
|
||||
{{scope.$index+1}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template v-for="item in tableColumn">
|
||||
<el-table-column v-if="item.render" :label="item.name" :width="item.width" :key="item.key">
|
||||
<div slot-scope="scope" v-html="item.render(scope.row)"></div>
|
||||
<div slot-scope="scope" v-html="item.render(scope.row)" @click="showPros($event,scope.row)">
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column v-else :prop="item.key" :label="item.name" :width="item.width" :key="item.key">
|
||||
</el-table-column>
|
||||
</template>
|
||||
<el-table-column label="操作" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="deleteData([scope.row])">删除</el-button>
|
||||
<el-button type="text" @click="deleteData([scope.row.id])">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
|
||||
</TableComponent>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog :close-on-click-modal="false" :title="currentId>0?'详情':currentId===-1?'新增':'编辑'" :visible.sync="showUpdate" width="952px"
|
||||
:before-close="handleClose">
|
||||
<FormComponent :options="updateOptions" :isReadonly="true" labelWidth="110px" labelAlign="right" :data.sync="updateParams"></FormComponent>
|
||||
<!-- 管控措施详情 -->
|
||||
<el-dialog :close-on-click-modal="false" title="管控措施" :show-close="false" :visible.sync="showProtable"
|
||||
width="940px">
|
||||
<TableComponent :tableData="currentProTableData" :tableColumn="proTableColumn" :showFooter="false"
|
||||
style="margin-bottom: 20px;">
|
||||
<el-table ref="multipleTable" :data="currentProTableData.datas" tooltip-effect="dark" height="250" border
|
||||
style="width: 100%">
|
||||
<template v-for="item in proTableColumn">
|
||||
<el-table-column v-if="item.render" :label="item.name" :width="item.width" :key="item.key">
|
||||
<div slot-scope="scope" v-html="item.render(scope.row)" @click="showPros($event,scope.row)">
|
||||
</div>
|
||||
</el-table-column>
|
||||
<el-table-column v-else :prop="item.key" :label="item.name" :width="item.width" :key="item.key">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</TableComponent>
|
||||
<ButtonListComponent :actions="subActions" @callback="subCallback" btn-position="center" :full-btn="true">
|
||||
</ButtonListComponent>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
|
@ -9,158 +9,173 @@ import MeasuresService from "@/service/measures.service"
|
|||
import FormOption from "hbt-common/models/formOptions"
|
||||
import BtnOption from "hbt-common/models/btnOptions"
|
||||
import DrawComponent from '@/components/draw.component.vue';
|
||||
import ButtonListComponent from "hbt-common/components/common/buttonList.component.vue";
|
||||
import UnitTreeComponent from '@/components/tree.component.vue';
|
||||
|
||||
@Component({
|
||||
template,
|
||||
components:{
|
||||
components: {
|
||||
FormComponent,
|
||||
TableComponent,
|
||||
DrawComponent,
|
||||
ButtonListComponent,
|
||||
UnitTreeComponent,
|
||||
},
|
||||
})
|
||||
export default class MeasuresManagerComponent extends BaseRecordComponent<any> {
|
||||
public tableService = new MeasuresService();
|
||||
|
||||
public params = {} as any;
|
||||
public params = {
|
||||
areaId: null,
|
||||
unitId: null,
|
||||
} as any;
|
||||
|
||||
public treeData = [{
|
||||
label: '一级 1',
|
||||
children: [{
|
||||
label: '二级 1-1',
|
||||
children: [{
|
||||
label: '三级 1-1-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 2',
|
||||
children: [{
|
||||
label: '二级 2-1',
|
||||
children: [{
|
||||
label: '三级 2-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 2-2',
|
||||
children: [{
|
||||
label: '三级 2-2-1'
|
||||
}]
|
||||
}]
|
||||
}, {
|
||||
label: '一级 3',
|
||||
children: [{
|
||||
label: '二级 3-1',
|
||||
children: [{
|
||||
label: '三级 3-1-1'
|
||||
}]
|
||||
}, {
|
||||
label: '二级 3-2',
|
||||
children: [{
|
||||
label: '三级 3-2-1'
|
||||
}]
|
||||
}]
|
||||
}]
|
||||
public showProtable = false;
|
||||
|
||||
public currentProTableData = {
|
||||
datas: []
|
||||
} as any;
|
||||
|
||||
public proTableColumn = [] as any;
|
||||
|
||||
//管控措施
|
||||
public measuresSelectData = {} as any;
|
||||
|
||||
public formActions = [{
|
||||
name:"查询",
|
||||
value:"search",
|
||||
icon:"el-icon-search",
|
||||
type:"primary"
|
||||
},{
|
||||
name:"清空",
|
||||
icon:"el-icon-tickets",
|
||||
value:"reset"
|
||||
name: "查询",
|
||||
value: "search",
|
||||
icon: "el-icon-search",
|
||||
type: "primary"
|
||||
}, {
|
||||
name: "清空",
|
||||
icon: "el-icon-tickets",
|
||||
value: "reset"
|
||||
}];
|
||||
public tableActions = [{
|
||||
name:"批量删除",
|
||||
value:"delete",
|
||||
plain:true,
|
||||
icon:"el-icon-delete",
|
||||
type:"danger"
|
||||
name: "批量删除",
|
||||
value: "delete",
|
||||
plain: true,
|
||||
icon: "el-icon-delete",
|
||||
type: "danger"
|
||||
}];
|
||||
public footerActions = [{
|
||||
name:"选择全部",
|
||||
value:"selectAll",
|
||||
type:"primary"
|
||||
},{
|
||||
name:"反向选择",
|
||||
value:"reverse"
|
||||
name: "选择全部",
|
||||
value: "selectAll",
|
||||
type: "primary"
|
||||
}, {
|
||||
name: "反向选择",
|
||||
value: "reverse"
|
||||
}];
|
||||
public formOptions:FormOption<BtnOption>[] = [{
|
||||
name:"区域名称",
|
||||
key:"areaId",
|
||||
type:"text",
|
||||
},{
|
||||
name:"单元名称",
|
||||
key:"unitId",
|
||||
type:"text",
|
||||
public formOptions: FormOption<BtnOption>[] = [{
|
||||
name: "管控对象",
|
||||
key: "controlName",
|
||||
type: "text",
|
||||
}, {
|
||||
name: "分析对象",
|
||||
key: "analName",
|
||||
type: "text",
|
||||
}];
|
||||
public subActions = [{
|
||||
name: "取消",
|
||||
value: "cancel"
|
||||
}];
|
||||
|
||||
public showUpdate = false;
|
||||
public updateParams = {} as any;
|
||||
public updateParams = {} as any;
|
||||
public selectData = [];
|
||||
|
||||
created(){
|
||||
|
||||
created() {
|
||||
this.$store.state.prevention_measures_sort.map((item) => {
|
||||
this.measuresSelectData[item.value] = this.treeSelectData(item.children)
|
||||
})
|
||||
}
|
||||
// 树点击
|
||||
public handleNodeClick(data){
|
||||
console.log(data)
|
||||
public handleNodeClick(data) {
|
||||
this.params.unitId = "";
|
||||
this.params.areaId = "";
|
||||
if (data.areaId) {
|
||||
this.params.unitId = data.id
|
||||
} else {
|
||||
this.params.areaId = data.id
|
||||
}
|
||||
this.getTableData()
|
||||
}
|
||||
|
||||
public buildTable(){
|
||||
this.tableColumn.push({name:'序号',key:"index"});
|
||||
this.tableColumn.push({name:'管控对象',key:"deptName",width:"200px"});
|
||||
this.tableColumn.push({name:'分析对象',key:"deptName",width:"200px"});
|
||||
this.tableColumn.push({name:'风险源',key:"person",width:"200px"});
|
||||
this.tableColumn.push({name:'事故后果',key:"person",width:"250px"});
|
||||
this.tableColumn.push({name:'风险等级',key:"status",render:(data)=>{
|
||||
if(data.status==0){
|
||||
return "<span class='noDraw'>未绘制</span>"
|
||||
}else{
|
||||
return "<span>已绘制</span>"
|
||||
public buildTable() {
|
||||
this.tableColumn.push({ name: '管控对象', key: "controlName", width: "200px" });
|
||||
this.tableColumn.push({ name: '分析对象', key: "analName", width: "200px" });
|
||||
this.tableColumn.push({ name: '风险源', key: "riskSource", width: "150px" });
|
||||
this.tableColumn.push({
|
||||
name: '事故后果', key: "seriousResult", width: "200px", render: (data) => {
|
||||
if (data.seriousResult) {
|
||||
return data.seriousResult.split(";").map(item => this.$store.getters.prevention_serious_result_map[item]).join(";")
|
||||
}
|
||||
}
|
||||
}});
|
||||
this.tableColumn.push({name:'措施详情', width:"110px",key:"status",render:(data)=>{
|
||||
if(data.status==0){
|
||||
return "<span class='noDraw'>未绘制</span>"
|
||||
}else{
|
||||
return "<span>已绘制</span>"
|
||||
});
|
||||
this.tableColumn.push({
|
||||
name: '风险等级', key: "riskLevel", width: "100px", render: (data) => {
|
||||
return "<span class='color_" + data.riskLevel + "'>" + (data.riskLevel ? (this.$store.getters.prevention_risk_level_map[data.riskLevel]) : '') + "</span>"
|
||||
}
|
||||
}});
|
||||
this.tableColumn.push({name:'涉及岗位',key:"person"});
|
||||
});
|
||||
this.tableColumn.push({
|
||||
name: '措施详情', width: "100px", key: "measureNum", render: (data) => {
|
||||
return "<span class='link'>" + (data.details ? data.details.length : 0) + "</span>"
|
||||
}
|
||||
});
|
||||
this.tableColumn.push({ name: '涉及岗位', key: "postName" });
|
||||
|
||||
|
||||
//管控措施详情
|
||||
this.proTableColumn.push({ name: '序号', key: "index" });
|
||||
this.proTableColumn.push({
|
||||
name: '措施类型一', key: "firstTypeName", render: (data) => {
|
||||
if (data.firstType) {
|
||||
return this.$store.getters.prevention_measures_sort_map[data.firstType]
|
||||
}
|
||||
}
|
||||
});
|
||||
this.proTableColumn.push({
|
||||
name: '措施类型二', key: "secondTypeName",
|
||||
render: (data) => {
|
||||
if (data.firstType) {
|
||||
const secondTypeItem = this.measuresSelectData[data.firstType]
|
||||
return this.selectName(secondTypeItem, data.secondType)
|
||||
}
|
||||
}
|
||||
});
|
||||
this.proTableColumn.push({ name: '措施类型三', key: "thirdType" });
|
||||
this.proTableColumn.push({ name: '管控措施', key: "description" });
|
||||
}
|
||||
|
||||
public callback(data){
|
||||
public callback(data) {
|
||||
// 查询
|
||||
if(data.value==="search"){
|
||||
if (data.value === "search") {
|
||||
this.getTableData()
|
||||
// 重置
|
||||
}else if(data.value === "reset"){
|
||||
// 重置
|
||||
} else if (data.value === "reset") {
|
||||
this.reset()
|
||||
// 反选
|
||||
}else if(data.value === "reverse"){
|
||||
// 反选
|
||||
} else if (data.value === "reverse") {
|
||||
this.toggleAll()
|
||||
// 全选
|
||||
}else if(data.value === "selectAll"){
|
||||
// 全选
|
||||
} else if (data.value === "selectAll") {
|
||||
this.selectAll()
|
||||
}else if(data.value === "delete"){
|
||||
this.deleteData(this.selectData.map((item:any)=>item.id))
|
||||
} else if (data.value === "delete") {
|
||||
this.deleteData(this.selectData.map((item: any) => item.id))
|
||||
}
|
||||
}
|
||||
// 重置数据
|
||||
public reset(){
|
||||
public reset() {
|
||||
this.params = {
|
||||
pageNum:1,
|
||||
pageSize:20,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
} as any;
|
||||
}
|
||||
// 删除数据
|
||||
|
||||
|
||||
|
||||
public showUpdateModel(id){
|
||||
public showUpdateModel(id) {
|
||||
this.showUpdate = true
|
||||
}
|
||||
|
||||
public handleClose(){
|
||||
public handleClose() {
|
||||
this.showUpdate = false;
|
||||
}
|
||||
|
||||
|
|
@ -168,22 +183,64 @@ export default class MeasuresManagerComponent extends BaseRecordComponent<any> {
|
|||
public toggleAll() {
|
||||
(this.$refs.multipleTable as any).toggleAllSelection();
|
||||
}
|
||||
public selectAll(){
|
||||
if(!this.selectData.length){
|
||||
public selectAll() {
|
||||
if (!this.selectData.length) {
|
||||
this.toggleAll()
|
||||
}else{
|
||||
this.tableData.datas.forEach((item,index)=>{
|
||||
const find = this.selectData.find((data:any)=>data.userId === item.userId);
|
||||
if(!find){
|
||||
} else {
|
||||
this.tableData.datas.forEach((item, index) => {
|
||||
const find = this.selectData.find((data: any) => data.userId === item.userId);
|
||||
if (!find) {
|
||||
(this.$refs.multipleTable as any).toggleRowSelection(item);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
public handleSelectionChange(data){
|
||||
public handleSelectionChange(data) {
|
||||
this.selectData = data;
|
||||
}
|
||||
|
||||
//管控措施
|
||||
public showPros(el, data) {
|
||||
const isTarget = el.target.classList.contains("link");
|
||||
if (isTarget) {
|
||||
this.showProtable = true;
|
||||
this.currentProTableData.datas = data.details.map((item, index) => {
|
||||
item.index = index + 1;
|
||||
return item
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
//管控措施--关闭
|
||||
public subCallback() {
|
||||
this.showProtable = false;
|
||||
}
|
||||
|
||||
public treeSelectData(data) {
|
||||
return data.map((item) => {
|
||||
return {
|
||||
label: item.dictLabel,
|
||||
id: isNaN(+item.dictValue) ? item.dictValue : +item.dictValue,
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
public selectName(selectGroup, data) {
|
||||
if (selectGroup && selectGroup.length > 0) {
|
||||
const map = {};
|
||||
selectGroup.forEach((item: any) => {
|
||||
if (item.value) {
|
||||
map[item.value] = item.name
|
||||
} else if (item.id) {
|
||||
map[item.id] = item.label
|
||||
}
|
||||
|
||||
})
|
||||
return map[data]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped src="../../common.component.scss"></style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue