guangyin
/
hbt-prevention-ui
forked from xxhjsb/hbt-prevention-ui
1
0
Fork 0
Code Pull Requests Activity

feat:页面UI优化

dev
kongyeqing 2023-08-16 09:47:45 +08:00
parent 51d6a8e172
commit 90421468b5
14 changed files with 788 additions and 215 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/analEvaluation.component.vue
View File

@ -1196,8 +1196,10 @@ export default class AnalEvaluationComponent extends Vue {
tr {
&.current-row {
&>td {
background-color: #68C23A !important;
color: #fff;
// background-color: #68C23A !important;
color: #409EFF;
background: #E3F1FF !important;
// border: 1px solid #409EFF;
}
}

84
src/views/risk/assessment/areaAnal/areaAnal.component.html
View File

@ -5,12 +5,11 @@
:full-btn="false" @change="callback" btn-position="end"></FormComponent>
</div>
<div class="table-box flex-1">
<TableComponent :tableData="tableData" :tableColumn="tableColumn"
@actionCallback="callback($event)" @pageNumberChange="callback($event,'pageNum')"
@pageSizeChange="callback($event,'pageSize')" :actions="tableActions">
<TableComponent :tableData="tableData" :tableColumn="tableColumn" @actionCallback="callback($event)"
@pageNumberChange="callback($event,'pageNum')" @pageSizeChange="callback($event,'pageSize')"
:actions="tableActions">
<el-table ref="multipleTable" :data="tableData.datas" height="100%" border
style="width: 100%">
<el-table ref="multipleTable" :data="tableData.datas" height="100%" border style="width: 100%">
<el-table-column label="序号" width="60">
<template slot-scope="scope">
{{scope.$index+1}}
@ -38,10 +37,79 @@
</div>
</div>
<el-dialog :close-on-click-modal="false" :visible.sync="showUpdate" destroy-on-close>
<el-dialog :close-on-click-modal="false" :visible.sync="showUpdate" destroy-on-close>
<img style="width:100%" src="../../../../assets/images/4.jpg" alt="">
</el-dialog>
<el-dialog :close-on-click-modal="false" :title="popTitle" :visible.sync="showPop" width="1000px" destroy-on-close>
<!-- 选取LS值 -->
<el-dialog :close-on-click-modal="false" title="评估区域内发生事故的可能性（L | S）" :visible.sync="showPop" width="1080px"
destroy-on-close>
<el-steps :active="stepsActive" align-center>
<el-step title="1.评估L值" @click.native="oneStep">
<template slot="icon">
<span>L</span>
</template>
</el-step>
<el-step title="2.评估S值" @click.native="twoStep"><template slot="icon">
<span>S</span>
</template></el-step>
</el-steps>
<el-table :header-cell-style="headerHidden" :data="popTitle === 'L' ? riskLDatas :riskSDatas" border
style="width: 100%; margin-bottom: 20px;" :span-method="colSpan" @cell-click="clickTableCell"
:cell-class-name="tableCellClassName">
<el-table-column prop="name" label="项目" width="180px"></el-table-column>
<el-table-column label="取值标准">
<el-table-column label="是否涉及（请勾选以下项目进行评估）">
<el-table-column prop="noInvolved">
<div slot-scope="scope" class="cursor td-content" :class="{active:scope.row.value===0}">
<el-radio v-model="scope.row.value" @input="selectRadioData" :label="0">不涉及</el-radio>
</div>
</el-table-column>
<el-table-column prop="type1" width="150px">
<div slot-scope="scope" class="cursor td-content" :class="{active:scope.row.value===1}">
<el-radio v-if="scope.row.type1 !='/'" v-model="scope.row.value"
:label="1">{{scope.row.type1}}</el-radio>
<span v-else>{{scope.row.type1}}</span>
</div>
</el-table-column>
<el-table-column prop="type2" width="150px">
<div slot-scope="scope" class="cursor td-content" :class="{active:scope.row.value===2}">
<el-radio v-if="scope.row.type2 !='/'" v-model="scope.row.value"
:label="2">{{scope.row.type2}}</el-radio>
<span v-else>{{scope.row.type2}}</span>
</div>
</el-table-column>
<el-table-column prop="type3" width="150px">
<div slot-scope="scope" class="cursor td-content" :class="{active:scope.row.value===3}">
<el-radio v-if="scope.row.type3 !='/'" v-model="scope.row.value"
:label="3">{{scope.row.type3}}</el-radio>
<span v-else>{{scope.row.type3}}</span>
</div>
</el-table-column>
<el-table-column prop="type4" width="150px">
<div slot-scope="scope" class="cursor td-content" :class="{active:scope.row.value===4}">
<el-radio v-model="scope.row.value" :label="4"">{{scope.row.type4}}</el-radio></div>
</el-table-column>
</el-table-column>
</el-table-column>
<el-table-column prop=" value" :label="popTitle==='L'?'Ln':'Sn'">
<div slot-scope="scope">
<span v-if="scope.row.value">{{scope.row.value}}</span>
<span v-else></span>
</div>
</el-table-column>
<el-table-column prop="result" :label="popTitle==='L'?'L':'S'"></el-table-column>
</el-table>
<ButtonListComponent :actions="popBtns" @callback="popCallback" btn-position="center" :full-btn="true">
</ButtonListComponent>
</el-dialog>
<!-- 选取LS值 -->
<!-- <el-dialog :close-on-click-modal="false" :title="popTitle" :visible.sync="showPop" width="1000px" destroy-on-close>
<el-table :data="riskDatas" border style="width: 100%; margin-bottom: 20px;" :span-method="colSpan">
<el-table-column prop="index" label="序号"></el-table-column>
<el-table-column prop="name" label="项目"></el-table-column>
@ -79,5 +147,5 @@
</el-table>
<ButtonListComponent :actions="popBtns" @callback="popCallback" btn-position="center" :full-btn="true">
</ButtonListComponent>
</el-dialog>
</el-dialog> -->
</div>

371
src/views/risk/assessment/areaAnal/areaAnal.component.vue
View File

@ -15,7 +15,7 @@ import riskSData from "@/mock/sData"
import riskLevel from '@/mock/riskLevel'
@Component({
template,
components:{
components: {
FormComponent,
TableComponent,
DrawComponent,
@ -28,157 +28,179 @@ export default class AreaAnalComponent extends BaseRecordComponent<any> {
public params = {} 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:"rules",
type:"primary"
name: "评估标准",
value: "rules",
type: "primary"
}];
public formOptions:FormOption<BtnOption>[] = [{
name:"区域名称",
key:"name",
type:"text",
public formOptions: FormOption<BtnOption>[] = [{
name: "区域名称",
key: "name",
type: "text",
}];
public riskDatas = [] as any;
public riskLDatas = JSON.parse(JSON.stringify(riskLData));
public riskSDatas = JSON.parse(JSON.stringify(riskSData));
public showUpdate = false;
public showPop:boolean = false;
public popTitle = "";
public showPop = false;
public popTitle = "L";
public currentRow:any;
public currentRow: any;
//暂存当前行数据
public cacheCurrentRow: any;
public popBtns = [{
name:"保存",
value:"save",
type:"primary"
},{
name:"取消",
value:"cancel",
type:""
}];
public numberForMat = ["","(Ⅳ)","(Ⅲ)","(Ⅱ)","(Ⅰ)"]
public stepsActive = 1;
public popBtns = [] as any;
public updateBtn() {
this.popBtns = [{
name: `${this.popTitle === 'L' ? '确定' : '保存'}`,
value: "save",
type: "primary",
}, {
name: "取消",
value: "cancel",
type: ""
}];
}
public numberForMat = ["", "(Ⅳ)", "(Ⅲ)", "(Ⅱ)", "(Ⅰ)"]
created(){
public radio = null;
created() {
//
}
public buildTable(){
this.tableColumn.push({name:'区域名称',key:"name"});
this.tableColumn.push({name:'区域内发生事故的可能性/L',width:"195",render:(data)=>{
if(!data.analFlag|| data.edit){
return "<span class='link l-value'>"+(data.analLikelihoodValue || "选取L值")+"</span>"
}else{
return data.analLikelihoodValue
}
public buildTable() {
this.tableColumn.push({ name: '区域名称', key: "name" });
this.tableColumn.push({
name: '区域内发生事故的可能性（L | S）', render: (data) => {
if (!data.analFlag || data.edit) {
return "<span class='link'>" + (data.analLikelihoodValue && data.analSeverityValue ? ('L：' + data.analLikelihoodValue + '&nbsp' + ' | ' + '&nbsp' + 'S：' + data.analSeverityValue) : "点击去评估") + "</span>"
} else {
return 'L：' + data.analLikelihoodValue + '&nbsp' + ' | ' + '&nbsp' + 'S：' + data.analSeverityValue
}
}});
this.tableColumn.push({name:'区域内发生事故的严重性/s',key:"person",width:"195",render:(data)=>{
if(!data.analFlag || data.edit){
return "<span class='link s-value'>"+(data.analSeverityValue || "选取S值")+"</span>"
}else{
return data.analSeverityValue
}
}});
this.tableColumn.push({name:'区域固有风险',render:(data)=>{
return "<span class='color_level_"+data.analRiskLevel+"'>"+(data.analRiskLevel?(this.$store.getters.prevention_risk_level_map[data.analRiskLevel]+this.numberForMat[data.analRiskLevel]):'')+"</span>"
}});
this.tableColumn.push({name:'评估完成情况',key:"status",render:(data)=>{
if(data.edit){
return "<span>正在修改</span>"
}else if(data.analFlag===1){
return "<span class='color_1'>已评估</span></span>"
}else{
return "<span class='color_5'>未评估</span>"
});
this.tableColumn.push({
name: '区域固有风险', render: (data) => {
return "<span class='color_level_" + data.analRiskLevel + "'>" + (data.analRiskLevel ? (this.$store.getters.prevention_risk_level_map[data.analRiskLevel] + this.numberForMat[data.analRiskLevel]) : '') + "</span>"
}
}});
});
this.tableColumn.push({
name: '评估完成情况', key: "status", render: (data) => {
if (data.edit) {
return "<span>正在修改</span>"
} else if (data.analFlag === 1) {
return "<span class='color_1'>已评估</span></span>"
} else {
return "<span class='color_5'>未评估</span>"
}
}
});
}
public callback(data,type?){
if(type){
public callback(data, type?) {
if (type) {
this.params[type] = data;
this.getTableData();
return
}
// 查询
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 === "rules"){
// 评估标准
} else if (data.value === "rules") {
this.showUpdate = true
}
}
// 重置数据
public reset(){
public reset() {
this.params = {
pageNum:1,
pageSize:20,
pageNum: 1,
pageSize: 20,
} as any;
}
public showUpdateModel(id){
public showUpdateModel(id) {
// if(id!==-1){
// }
this.showUpdate = true
}
// 添加L/S值
public addVal(el,row){
// 新增 添加L/S值
public addVal(el, row) {
this.currentRow = row;
const isL = el.target.classList.contains("l-value");
this.popTitle = isL?"L值取值":"S值取值";
this.riskDatas = isL?riskLData:riskSData;
const data = isL?JSON.parse(row.analLikelihoodContent || "[]"):JSON.parse(row.analSeverityContent || "[]");
if(data.length){
this.riskDatas.forEach((item,i)=>{
item.value = data[i];
item.result = isL? this.currentRow.analLikelihoodValue : this.currentRow.analSeverityValue
this.cacheCurrentRow = JSON.parse(JSON.stringify(row));
this.riskLDatas = riskLData;
this.popTitle = 'L';
const lData = JSON.parse(row.analLikelihoodContent || "[]");
const sData = JSON.parse(row.analSeverityContent || "[]");
if (lData.length) {
this.riskLDatas.forEach((item, i) => {
item.value = lData[i];
item.result = this.currentRow.analLikelihoodValue
})
}else{
} else {
// 如果没有值 则用字符串代替
this.riskDatas.forEach(item=>{
item.value = isL?"Ln"+item.index:"Sn"+item.index
this.riskLDatas.forEach(item => {
item.value = "Ln" + item.index
})
}
this.showPop = true
if (sData.length) {
this.riskSDatas.forEach((item, i) => {
item.value = sData[i];
item.result = this.currentRow.analSeverityValue
})
} else {
// 如果没有值 则用字符串代替
this.riskSDatas.forEach(item => {
item.value = "Sn" + item.index
})
}
this.stepsActive = 1;
this.showPop = true;
this.updateBtn();
}
// 保存L/S值
public saveVal(row){
if(!row.analLikelihoodValue){
public saveVal(row) {
if (!row.analLikelihoodValue) {
this.$message.error("请选取L值");
return
}
if(!row.analSeverityValue){
if (!row.analSeverityValue) {
this.$message.error("请选取S值");
return
}
// 因为按索引取值 所以要-1
row.analRiskLevel=riskLevel[row.analLikelihoodValue - 1][row.analSeverityValue - 1];
row.analFlag = 1;
this.tableService.addOrUpdate(row,false,true).then((res)=>{
row.analRiskLevel = riskLevel[row.analLikelihoodValue - 1][row.analSeverityValue - 1];
row.analFlag = 1;
this.tableService.addOrUpdate(row, false, true).then((res) => {
this.$message.success("保存成功")
row.edit = false;
})
}
public colSpan({ row, column, rowIndex, columnIndex }){
if(columnIndex===8){
public colSpan({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 7) {
return {
rowspan: 6,
colspan: 1
@ -186,66 +208,179 @@ export default class AreaAnalComponent extends BaseRecordComponent<any> {
}
}
public selectRow(row,data){
if(row.index===6 && data && data!==4 && this.popTitle==="L值取值"){
public tableCellClassName({ row, column, rowIndex, columnIndex }) {
//注意这里是解构
//利用单元格的 className 的回调方法，给行列索引赋值
row.index = rowIndex;
column.index = columnIndex;
}
public clickTableCell(row, column, event, cell) {
if (column.index < 0 || column.index > 5) {
return
}
row.value = data
if (row[column.property] !== '/') {
row.value = column.index - 1
}
}
public startEdit(row){
public startEdit(row) {
row.edit = true;
}
public getTableCallback(){
this.tableData.datas = this.tableData.datas.map(item=>{
return Object.assign({edit:false,analFlag:0,analLikelihoodContent:"",analLikelihoodValue:null,analSeverityContent:"",analSeverityValue:null,analRiskLevel:0},item)
public getTableCallback() {
this.tableData.datas = this.tableData.datas.map(item => {
return Object.assign({ edit: false, analFlag: 0, analLikelihoodContent: "", analLikelihoodValue: null, analSeverityContent: "", analSeverityValue: null, analRiskLevel: 0 }, item)
});
}
public popCallback(data){
if(data.value === "save"){
public popCallback(data) {
if (data.value === "save") {
let pass = true;
const datas:number[] = [];
for(const item of this.riskDatas){
if(typeof item.value !== "number"){
const datas: number[] = [];
let tmpRiskData = this.popTitle === 'L' ? this.riskLDatas : this.riskSDatas;
//S 保存时，判断L值是否有数据
if (this.popTitle === 'S') {
if (!this.currentRow.analLikelihoodValue) {
this.$message.error("请选择评估L值的取值标准");
return
}
}
for (const item of tmpRiskData) {
if (typeof item.value !== "number") {
pass = false;
break;
}
datas.push(item.value)
}
if(!pass){
if (!pass) {
this.$message.error("所有项目都需选择取值标准");
return
}
const length = datas.filter(item=>item!==0).length;
if(!length){
const length = datas.filter(item => item !== 0).length;
if (!length) {
this.$message.error("所有项目不可选为不涉及");
return
}
const total = datas.reduce((total,cur)=>{
return total+cur
},0);
const total = datas.reduce((total, cur) => {
return total + cur
}, 0);
const content = JSON.stringify(datas);
const value = Math.ceil(total / length)
if(this.popTitle==="L值取值"){
if (this.popTitle === "L") {
this.currentRow.analLikelihoodContent = content;
this.currentRow.analLikelihoodValue = value;
}else{
this.popTitle = 'S';
this.stepsActive = 2;
this.riskLDatas[0].value = value;
this.riskSDatas = JSON.parse(JSON.stringify(riskSData));
this.updateBtn();
} else {
this.currentRow.analSeverityContent = content;
this.currentRow.analSeverityValue = value;
this.showPop = false;
this.riskSDatas[0].value = value;
this.currentRow = null;
this.stepsActive = 1;
}
this.riskDatas[0].value = value;
this.showPop = false;
this.currentRow = null;
}else if (data.value === "cancel"){
} else if (data.value === "cancel") {
this.currentRow = this.cacheCurrentRow;
this.showPop = false;
this.currentRow = null;
this.stepsActive = 1;
}
}
//表头合并
public headerHidden({ row, colunm, rowIndex, columnIndex }) {
if (rowIndex === 2 && columnIndex < 5) {
//这里为了是将第二列的表头隐藏，就形成了合并表头的效果
return { display: 'none' }
}
return "background:#f5f7fa"
}
//单选
public selectRadioData(data) {
console.log('data', data);
}
//点击L 步骤
public oneStep() {
this.stepsActive = 1;
this.popTitle = 'L';
this.updateBtn()
}
//点击S步骤
public twoStep() {
this.stepsActive = 2;
this.popTitle = 'S';
this.updateBtn()
}
}
</script>
<style lang="scss" scoped src="../../../common.component.scss">
<style lang="scss" scoped src="../../../common.component.scss"></style>
<style lang="scss" scoped>
::v-deep {
.el-table {
.td-content {
&.active {
&::before {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
content: "";
background: #E3F1FF;
border: 1px solid rgba(64, 158, 255, 0.3);
z-index: 1;
}
span {
position: relative;
z-index: 9;
color: #409EFF;
}
}
}
.el-radio {
white-space: break-spaces;
line-height: 1.5;
display: flex;
align-items: center;
.el-radio__label {
padding-left: 5px;
font-size: 12px;
}
}
}
.el-steps {
padding-bottom: 24px;
}
.el-step__title.is-process {
color: #606266;
font-weight: 400;
font-size: 16px;
cursor: pointer;
}
.el-step__title.is-finish {
cursor: pointer;
}
.el-step__icon.is-text {
cursor: pointer;
}
}
</style>

120
src/views/risk/assessment/work/work.component.html
View File

@ -4,13 +4,13 @@
</div>
<div class="common-content-box dis-flex flex-col flex-1">
<div class="search-box">
<FormComponent :inline="true" :options="formOptions" :data.sync="params" @actionCallback="callback" :actions="formActions"
:full-btn="false" @change="changes" btn-position="end"></FormComponent>
<FormComponent :inline="true" :options="formOptions" :data.sync="params" @actionCallback="callback"
:actions="formActions" :full-btn="false" @change="changes" btn-position="end"></FormComponent>
</div>
<div class="table-box flex-1">
<TableComponent :tableData="tableData" :tableColumn="tableColumn"
@actionCallback="callback($event)" @pageNumberChange="callback($event,'pageNum')"
@pageSizeChange="callback($event,'pageSize')" :footerActions="footerActions" :actions="tableActions">
<TableComponent :tableData="tableData" :tableColumn="tableColumn" @actionCallback="callback($event)"
@pageNumberChange="callback($event,'pageNum')" @pageSizeChange="callback($event,'pageSize')"
:footerActions="footerActions" :actions="tableActions">
<el-table ref="multipleTable" :data="tableData.datas" height="100%" border tooltip-effect="dark"
@selection-change="handleSelectionChange" style="width: 100%">
@ -45,62 +45,86 @@
</div>
<el-dialog :close-on-click-modal="false" :title="!updateParams.id?'新增':isReadonly?'详情':'编辑'"
:visible.sync="showUpdate" width="952px" :before-close="handleClose" destroy-on-close>
:visible.sync="showUpdate" width="952px" :before-close="handleClose" destroy-on-close>
<FormComponent :options="updateOptions" :isReadonly="isReadonly" @change="changes" labelWidth="110px"
labelAlign="right" :data.sync="updateParams" @actionCallback="callback" :actions="updateActions"
:full-btn="true" btnPosition="center">
<div class="sub-title">作业步骤</div>
<TableComponent :tableData="currentStepTableData" :tableColumn="subTableColumn"
@actionCallback="callback($event)" :actions="!isReadonly?subTableActions:[]" actionPosition="flex-start"
:showFooter="false" style="margin-bottom: 20px;">
<el-table ref="multipleTable" :data="updateParams.steps" tooltip-effect="dark" height="250" border
@selection-change="handleSelectionChange" style="width: 100%">
<el-table-column type="selection" fixed label="全选" width="40" v-if="!isReadonly">
</el-table-column>
<template v-for="item in subTableColumn">
<el-table-column v-if="item.render" :show-overflow-tooltip="item.showTip" :label="item.name"
:width="item.width" :key="item.key">
<div slot-scope="scope" v-html="item.render(scope.row)"></div>
</el-table-column>
<el-table-column v-else :prop="item.key" :show-overflow-tooltip="item.showTip"
:label="item.name" :width="item.width" :key="item.key">
</el-table-column>
</template>
<el-table-column label="操作" fixed="right" width="100" v-if="!isReadonly">
<template slot-scope="scope">
<el-button type="text" @click="showSubUpdateModel(scope.row)">修改</el-button>
<el-button type="text" @click="doSubDelete([scope.row.index - 1])">删除</el-button>
<el-steps v-if="updateParams.steps.length > 0" direction="vertical" class="steps" style="width: 100%;">
<template v-for="(item,index) in updateParams.steps">
<el-step>
<template slot="icon">
<span>步骤 {{index + 1}}</span>
</template>
</el-table-column>
</el-table>
</TableComponent>
<template slot="title">
<span>{{item.name}}</span>
<div v-if="!isReadonly">
<img class="modify-img" src="/src/assets/images/modify.png" alt="modify"
@click="showSubUpdateModel(item)" />
<img class="delete-img" src="/src/assets/images/delete.png" alt="delete"
@click="doSubDelete([index])" />
</div>
</template>
<template slot="description">
<!-- <>{{item.description}}</div> -->
<el-input autosize type="textarea" class="description" disabled placeholder="请输入内容"
v-model="item.description">
</el-input>
<div class="basic-content">
<div class="content-item">作业地点：<span>{{item.location}}</span></div>
<div class="content-item">责任人：<span>{{item.chargeUserName}}</span></div>
<div class="content-item">作业人：<span>{{item.workerName}}</span></div>
</div>
</template>
</el-step>
</template>
<el-step class="end-step">
<template slot="icon">{{null}}
</template>
</el-step>
<span class="end-title">结束</span>
</el-steps>
<div v-if="!isReadonly" class="add-steps-btn" @click="addWorkSteps">
<i class="el-icon-plus" style="margin-right: 7px;"></i>
添加作业步骤
</div>
</FormComponent>
</el-dialog>
<el-dialog :close-on-click-modal="false" :title="!stepUpdateParams.id?'新增':'编辑'" :visible.sync="showSubUpdate"
width="500" :before-close="handleClose" destroy-on-close>
<FormComponent :options="subUpdateOptions" labelWidth="110px" @change="changes" labelAlign="right" :data.sync="stepUpdateParams"
:full-btn="true" btnPosition="center" @actionCallback="callback" :actions="updateActions"></FormComponent>
width="500" :before-close="handleClose" destroy-on-close>
<FormComponent :options="subUpdateOptions" labelWidth="110px" @change="changes" labelAlign="right"
:data.sync="stepUpdateParams" :full-btn="true" btnPosition="center" @actionCallback="callback"
:actions="subUpdateActions"></FormComponent>
</el-dialog>
<el-dialog :close-on-click-modal="false" title="作业步骤" :visible.sync="showSteptable" width="800"
:before-close="handleClose" destroy-on-close>
<TableComponent :tableData="currentStepTableData" :tableColumn="subTableColumn" :showFooter="false"
style="margin-bottom: 20px;">
<el-table ref="multipleTable" :data="currentStepTableData.datas" tooltip-effect="dark" height="250" border style="width: 100%">
<template v-for="item in subTableColumn">
<el-table-column :prop="item.key" :show-overflow-tooltip="item.showTip"
:label="item.name" :width="item.width" :key="item.key">
</el-table-column>
<el-dialog :close-on-click-modal="false" :title="`作业步骤（共${currentStepTableData.datas.length}步）`"
:visible.sync="showSteptable" width="800" :before-close="handleClose" destroy-on-close>
<el-steps direction="vertical" class="steps">
<template v-for="(item,index) in currentStepTableData.datas" >
<el-step :title="`${item.name}`">
<template slot="icon">
<span>步骤 {{index + 1}}</span>
</template>
</el-table>
</TableComponent>
<template slot="description">
<el-input autosize type="textarea" class="description" disabled placeholder="请输入内容"
v-model="item.description">
</el-input>
<div class="basic-content">
<div class="content-item">作业地点：<span>{{item.location}}</span></div>
<div class="content-item">责任人：<span>{{item.chargeUserName}}</span></div>
<div class="content-item">作业人：<span>{{item.workerName}}</span></div>
</div>
</template>
</el-step>
</template>
<el-step class="end-step">
<template slot="icon">{{null}}
</template>
</el-step>
<span class="end-title">结束</span>
</el-steps>
</el-dialog>
</div>

200
src/views/risk/assessment/work/work.component.vue
View File

@ -111,19 +111,41 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
public updateOptions: FormOption<BtnOption>[] = [];
public updateActions = [] as any;
public updateActionsForm() {
this.updateActions = [{
name: "取消",
value: "cancel"
}, {
name: "保存并继续添加",
value: "saveAndContinue",
type: "primary",
hide:this.updateParams.id
}, {
name: "保存",
value: "save",
type: "primary"
}];
}
public subUpdateActions = [] as any;
public subUpdateActionsForm() {
this.subUpdateActions = [{
name: "取消",
value: "cancel"
}, {
name: "保存并继续添加",
value: "saveAndContinue",
type: "primary",
hide:this.stepUpdateParams.index
}, {
name: "保存",
value: "save",
type: "primary"
}];
}
public updateActions = [{
name: "取消",
value: "cancel"
}, {
name: "保存并继续添加",
value: "saveAndContinue",
type: "primary"
}, {
name: "保存",
value: "save",
type: "primary"
}];
public showSubUpdate = false;
@ -136,6 +158,7 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
}
created() {
//
}
public buildUpdateForm() {
@ -445,8 +468,8 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
if (row) {
this.stepUpdateParams = JSON.parse(JSON.stringify(row));
}
this.showSubUpdate = true;
this.subUpdateActionsForm();
}
public doSubDelete(indexs) {
@ -519,6 +542,7 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
identifyTime: moment().format('YYYY-MM-DD'),
identifyUserId: this.account.userId,
} as any;
this.updateActionsForm()
} else {
this.tableService.getListDetail({ id: row.id }).then((res) => {
this.updateParams = JSON.parse(JSON.stringify(res.data));
@ -532,14 +556,19 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
if (!isRead) {
this.updateParams.postCode = this.updateParams.postCode.split(",").map(item => +item);
this.updateParams.safetyFactor = this.updateParams.safetyFactor.split(",").map(item => +item);
this.loadUnitData(this.updateParams.areaId)
} else {
this.updateParams.safetyFactor = this.updateParams.safetyFactor.split(",").map(item => +item);
this.updateParams.safetyFactorName = this.updateParams.safetyFactor.map(item => this.$store.getters.prevention_safe_reason_map[item]).join(",")
}
this.updateActionsForm()
})
}
this.buildUpdateForm()
// 防止选中后影响表单内列表选中
this.selectData = [];
this.showUpdate = true
@ -554,7 +583,7 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
this.showSteptable = false;
this.isReadonly = false;
this.showUpdate = false;
this.updateParams = {} as any;
this.updateParams = { steps: [] } as any;
}
@ -580,12 +609,149 @@ export default class WorkManagerComponent extends BaseRecordComponent<any> {
public handleSelectionChange(data) {
this.selectData = data;
}
//添加作业步骤
public addWorkSteps() {
this.showSubUpdateModel();
}
}
</script>
<style lang="scss" scoped src="../../../common.component.scss">
<style lang="scss" scoped src="../../../common.component.scss"></style>
<style lang="scss" scoped>
::v-deep {
.el-dialog__body .common-btn-box {
justify-content: flex-start !important;
.el-step__line {
background-color: #409EFF;
text-align: center;
}
.el-step.is-vertical .el-step__head {
width: 64px;
text-align: center;
}
.el-step__icon.is-text {
width: 64px;
background: #409EFF;
border-radius: 4px;
color: #fff;
border: 0px;
font-size: 12px;
}
.el-step__description {
padding-right: 20px;
}
.el-step.is-vertical .el-step__main {
padding-left: 16px;
}
.el-step.is-vertical .el-step__title {
font-size: 16px;
font-weight: 500;
color: #409EFF;
padding-bottom: 16px;
display: flex;
justify-content: space-between;
}
.el-step.is-vertical .el-step__line {
left: 32px;
opacity: 0.3;
}
.description {
.el-textarea.is-disabled .el-textarea__inner {
background: rgba(64, 158, 255, 0.05) !important;
}
.el-textarea__inner {
font-size: 14px !important;
font-weight: 400 !important;
color: rgba(0, 0, 0, 0.6) !important;
background: rgba(64, 158, 255, 0.05) !important;
border-radius: 4px;
border-color: #fff !important;
padding: 16px;
}
}
.basic-content {
padding: 18px 0px;
font-size: 14px;
font-weight: 500;
color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: flex-start;
.content-item {
width: 33%;
span {
color: rgba(0, 0, 0, 0.6);
}
}
}
.end-step {
.el-step__head.is-wait {
height: 9px !important;
}
.el-step__icon.is-text {
width: 9px;
height: 9px;
background: #C5E1FF;
border-radius: 50%;
margin-left: 2px;
margin-bottom: 6px;
}
}
.end-title {
height: 17px;
font-size: 12px;
font-weight: 500;
color: #C5E1FF;
line-height: 17px;
padding-left: 22px;
margin-bottom: 20px;
}
.add-steps-btn {
width: 100%;
text-align: center;
height: 40px;
background: #ECF5FF;
border-radius: 4px;
border: 1px solid #409EFF;
line-height: 40px;
color: #409EFF;
cursor: pointer;
margin: 0px 20px 20px 20px;
}
.modify-img {
background: #409EFF;
width: 24px;
height: 24px;
border-radius: 50%;
cursor: pointer;
}
.delete-img {
width: 24px;
height: 24px;
margin-left: 20px;
margin-right: 20px;
cursor: pointer;
}
}
</style>

36
src/views/risk/assessment/work/workAnal.component.html
View File

@ -98,8 +98,38 @@
:show.sync="showSubUpdate" :tabledata.sync="updateParams" :areaList="areaList" :type="'work'"
:checkRiskType="checkRiskType"></AnalEvaluationComponent>
</el-dialog>
<!-- 检查项目 -->
<el-dialog :close-on-click-modal="false" title="作业步骤" :show-close="false" :visible.sync="showProtable"
<!-- 作业步骤 -->
<el-dialog :close-on-click-modal="false" :title="`作业步骤（共${currentProTableData.datas.length}步）`"
:visible.sync="showProtable" width="940px" :before-close="workHandleClose" destroy-on-close>
<el-steps direction="vertical" class="steps">
<template v-for="(item,index) in currentProTableData.datas">
<el-step :title="`${item.name}`">
<template slot="icon">
<span>步骤 {{index + 1}}</span>
</template>
<template slot="description">
<el-input autosize type="textarea" class="description" disabled placeholder="请输入内容"
v-model="item.description">
</el-input>
<div class="basic-content">
<div class="content-item">风险源：<span>{{item.riskSource}}</span></div>
<div class="content-item">可能发生事故：<span>{{!item.seriousResult ? '--'
:item.seriousResult.split(",").map(items =>
seriousResultMap[items]).join(",")}}</span></div>
<div class="content-item">风险等级： <span style="color: #fff;" :class="`color_level_${item.riskLevel}`">{{!item.riskLevel ? '--':riskLevelMap[item.riskLevel]}}</span></div>
<div class="content-item">残余风险等级：<span style="color: #fff;" :class="`color_level_${item.remainLevel}`" >{{!item.remainLevel ? '--':riskLevelMap[item.remainLevel]}}</span></div>
</div>
</template>
</el-step>
</template>
<el-step class="end-step">
<template slot="icon">{{null}}
</template>
</el-step>
<span class="end-title">结束</span>
</el-steps>
</el-dialog>
<!-- <el-dialog :close-on-click-modal="false" title="作业步骤" :show-close="false" :visible.sync="showProtable"
width="940px">
<FormComponent labelWidth="110px" labelAlign="right" :actions="proActions" @actionCallback="proCallback"
:full-btn="true" btnPosition="center">
@ -118,5 +148,5 @@
</el-table>
</TableComponent>
</FormComponent>
</el-dialog>
</el-dialog> -->
</div>

144
src/views/risk/assessment/work/workAnal.component.vue
View File

@ -157,6 +157,10 @@ export default class WorkAnalManagerComponent extends BaseRecordComponent<any> {
public labelWidth = "140px";
public seriousResultMap = {} as any;
public riskLevelMap = {} as any;
public buildUpdateForm() {
this.updateOptions = [{
name: "区域名称",
@ -756,6 +760,8 @@ export default class WorkAnalManagerComponent extends BaseRecordComponent<any> {
public showPros(el, data) {
const isTarget = el.target.classList.contains("link");
if (isTarget) {
this.seriousResultMap = this.$store.getters.prevention_serious_result_map;
this.riskLevelMap = this.$store.getters.prevention_risk_level_map;
this.currentId = data.id;
this.tableService.selectStepById({ jobAnalId: this.currentId }).then((res: any) => {
if (res.code === 200) {
@ -850,8 +856,12 @@ export default class WorkAnalManagerComponent extends BaseRecordComponent<any> {
this.showUpdate = false;
}
public workHandleClose() {
this.showProtable = false;
}
public handleAnalyClose() {
this.showSubUpdate = false
this.showSubUpdate = false;
}
//保存 更新
@ -1015,3 +1025,135 @@ export default class WorkAnalManagerComponent extends BaseRecordComponent<any> {
}
</script>
<style lang="scss" scoped src="../../../common.component.scss"></style>
<style lang="scss" scoped>
::v-deep {
.el-step__line {
background-color: #409EFF;
text-align: center;
}
.el-step.is-vertical .el-step__head {
width: 64px;
text-align: center;
}
.el-step__icon.is-text {
width: 64px;
background: #409EFF;
border-radius: 4px;
color: #fff;
border: 0px;
font-size: 12px;
}
.el-step__description {
padding-right: 20px;
}
.el-step.is-vertical .el-step__main {
padding-left: 16px;
}
.el-step.is-vertical .el-step__title {
font-size: 16px;
font-weight: 500;
color: #409EFF;
padding-bottom: 16px;
display: flex;
justify-content: space-between;
}
.el-step.is-vertical .el-step__line {
left: 32px;
opacity: 0.3;
}
.description {
.el-textarea.is-disabled .el-textarea__inner {
background: rgba(64, 158, 255, 0.05) !important;
}
.el-textarea__inner {
font-size: 14px !important;
font-weight: 400 !important;
color: rgba(0, 0, 0, 0.6) !important;
background: rgba(64, 158, 255, 0.05) !important;
border-radius: 4px;
border-color: #fff !important;
padding: 16px;
}
}
.basic-content {
padding: 18px 0px;
font-size: 14px;
font-weight: 500;
color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: flex-start;
.content-item {
width: 24%;
span {
color: rgba(0, 0, 0, 0.6);
}
}
}
.end-step {
.el-step__head.is-wait {
height: 9px !important;
}
.el-step__icon.is-text {
width: 9px;
height: 9px;
background: #C5E1FF;
border-radius: 50%;
margin-left: 2px;
margin-bottom: 6px;
}
}
.end-title {
height: 17px;
font-size: 12px;
font-weight: 500;
color: #C5E1FF;
line-height: 17px;
padding-left: 22px;
margin-bottom: 20px;
}
.add-steps-btn {
width: 100%;
text-align: center;
height: 40px;
background: #ECF5FF;
border-radius: 4px;
border: 1px solid #409EFF;
line-height: 40px;
color: #409EFF;
cursor: pointer;
margin: 0px 20px 20px 20px;
}
.modify-img {
background: #409EFF;
width: 24px;
height: 24px;
border-radius: 50%;
cursor: pointer;
}
.delete-img {
width: 24px;
height: 24px;
margin-left: 20px;
margin-right: 20px;
cursor: pointer;
}
}
</style>

10
src/views/risk/duty/dutyRecords.component.vue
View File

@ -233,7 +233,12 @@ export default class DutyRecordsManagerComponent extends BaseRecordComponent<any
if (data.ownerName) {
return data.ownerName
} else {
return '--'
if (data.ownerId) {
return this.$store.getters.user_map[data.ownerId]
} else {
return '--'
}
}
}
});
@ -371,7 +376,8 @@ export default class DutyRecordsManagerComponent extends BaseRecordComponent<any
resultName: row.result === 1 ? '正常' : '异常',
dangerFlagName: row.dangerFlag === 0 ? '否' : row.dangerFlag === 1 ? '是' : null,
dangerTypeName: this.$store.getters.prevention_hazard_category_map[row.dangerType],
checkUserName: this.$store.getters.user_map[row.checkUserId]
checkUserName: this.$store.getters.user_map[row.checkUserId],
ownerName: this.$store.getters.user_map[row.ownerId],
}, row)
this.showUpdate = true
this.updateParams.resourceId = null

2
src/views/threecards/riskCard.component.vue
View File

@ -327,7 +327,7 @@ export default class RiskCard extends BaseRecordComponent<any> {
this.tableColumn.push({ name: '岗位名称', key: "postName", });
this.tableColumn.push({ name: '主要危险有害因素', key: "harmfulFactors", });
this.tableColumn.push({
name: '风险等级', key: "riskLevel", render: (data) => {
name: '风险等级', key: "riskLevel",width:"150px", render: (data) => {
if (data.riskLevel) {
return "<span class='color_level_" + data.riskLevel + "'>" + (data.riskLevel ? (this.$store.getters.prevention_risk_level_map[data.riskLevel]) : '') + "</span>"
}

10
src/views/threecards/safeCard.component.vue
View File

@ -268,10 +268,10 @@ export default class SafeCard extends BaseRecordComponent<any> {
this.tableColumn.push({ name: '承诺人', key: "promiserName", });
this.tableColumn.push({ name: '岗位', key: "postName", });
this.tableColumn.push({ name: '承诺事项', key: "content", showTip: true, });
this.tableColumn.push({ name: '上级领导', key: "leaderName", });
this.tableColumn.push({ name: '承诺日期', key: "promiseTime", });
this.tableColumn.push({ name: '上级领导', key: "leaderName", width: "130px" });
this.tableColumn.push({ name: '承诺日期', key: "promiseTime", width: "130px" });
this.tableColumn.push({
name: '附件', key: "resourceName", showTip: true, render: (data) => {
name: '附件', key: "resourceName", showTip: true, width: "300px", render: (data) => {
if (data.resourceName) {
return `<span class="link">${data.resourceName}</span>`
}
@ -505,12 +505,12 @@ export default class SafeCard extends BaseRecordComponent<any> {
//预览附件
public previewFile(url,file) {
public previewFile(url, file) {
if (file.type.indexOf("png") >= 0 || file.type.indexOf("jp") >= 0) {
this.currentUrl = file.url;
this.showFile = true;
} else {
window.open('http://119.45.186.133:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(url)), "_blank")
window.open('http://119.45.186.133:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(url)), "_blank")
}
}

6
src/views/workprogress/leader.component.vue
View File

@ -284,13 +284,13 @@ export default class LeadershipStructure extends BaseRecordComponent<any> {
public buildTable() {
this.tableColumn.push({ name: '机构名称', key: "name", width: "200px" });
this.tableColumn.push({ name: '机构负责人', key: "chargeUserName", width: "200px" });
this.tableColumn.push({ name: '机构负责人', key: "chargeUserName", width: "120px" });
this.tableColumn.push({
name: '成员信息', key: "memberNumber", width: "150px", render: (data) => {
name: '成员信息', key: "memberNumber", width: "100px", render: (data) => {
return "<span class='link memberNumber'>" + (data.memberNumber ? data.memberNumber : 0) + "</span>"
}
});
this.tableColumn.push({ name: '机构主要职责', key: "duty", width: "200px", showTip: true, });
this.tableColumn.push({ name: '机构主要职责', key: "duty", width: "250px", showTip: true, });
this.tableColumn.push({ name: '单位名称', key: "orgName", width: "150px", });
this.tableColumn.push({
name: '附件', width: "300px", key: "resourceName", showTip: true, render: (data) => {

4
src/views/workprogress/managementSystem.component.vue
View File

@ -262,7 +262,7 @@ export default class ManagementSystem extends BaseRecordComponent<any> {
this.tableColumn.push({ name: '制度名称', key: "name", width: "200px" });
this.tableColumn.push({ name: '适用部门', key: "suitDeptName", width: "200px" });
this.tableColumn.push({ name: '内容摘要', key: "content", width: "150px", showTip: true, });
this.tableColumn.push({ name: '发布部门', key: "publishDeptName", width: "200px", });
this.tableColumn.push({ name: '发布部门', key: "publishDeptName", width: "100px", });
this.tableColumn.push({ name: '发布时间', key: "publishTime", width: "150px", });
this.tableColumn.push({
name: '附件', width: "300px", key: "resourceName", showTip: true, render: (data) => {
@ -272,7 +272,7 @@ export default class ManagementSystem extends BaseRecordComponent<any> {
}
});
this.tableColumn.push({
name: '状态', key: "status", render: (data) => {
name: '状态', key: "status",width:"80px", render: (data) => {
if (data.status) {
if (data.status === 1) {
return `<span class="color_1">${'在用'}</span>`

2
src/views/workprogress/programme.component.vue
View File

@ -266,7 +266,7 @@ export default class Programme extends BaseRecordComponent<any> {
public buildTable() {
this.tableColumn.push({ name: '方案名称', key: "name", width: "200px" });
this.tableColumn.push({
name: '适用年度', key: "suitYear", width: "200px", render: (data) => {
name: '适用年度', key: "suitYear", width: "120px", render: (data) => {
if (data.suitYear === 1) {
return '永久'
} else {

6
src/views/workprogress/trainRecords.component.vue
View File

@ -286,7 +286,7 @@ export default class TrainRecords extends BaseRecordComponent<any> {
public buildTable() {
this.tableColumn.push({ name: '培训名称', key: "name", width: "200px" });
this.tableColumn.push({ name: '培训名称', key: "name"});
this.tableColumn.push({
name: '培训类型', key: "type", render: (data) => {
if (data.type === 1) {
@ -309,13 +309,13 @@ export default class TrainRecords extends BaseRecordComponent<any> {
}
});
this.tableColumn.push({
name: '培训层级', key: "level", width: "150px", render: (data) => {
name: '培训层级', key: "level", render: (data) => {
if (data.level) {
return this.$store.getters.prevention_training_level_map[data.level]
}
}
});
this.tableColumn.push({ name: '参加人数', width: "100px", key: "memberNumber", });
this.tableColumn.push({ name: '参加人数', key: "memberNumber", });
this.tableColumn.push({ name: '讲师姓名', key: "lecturerName" });