feat:页面UI优化

src/components/analEvaluation.component.vue

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

src/views/risk/assessment/areaAnal/areaAnal.component.html

@@ -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"
+            <TableComponent :tableData="tableData" :tableColumn="tableColumn" @actionCallback="callback($event)"
-                @actionCallback="callback($event)" @pageNumberChange="callback($event,'pageNum')"
+                @pageNumberChange="callback($event,'pageNum')" @pageSizeChange="callback($event,'pageSize')"
-                @pageSizeChange="callback($event,'pageSize')" :actions="tableActions">
+                :actions="tableActions">
 
-                <el-table ref="multipleTable" :data="tableData.datas" height="100%" border
+                <el-table ref="multipleTable" :data="tableData.datas" height="100%" border style="width: 100%">
-                    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>

src/views/risk/assessment/areaAnal/areaAnal.component.vue

@@ -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:"查询",
+        name: "查询",
-        value:"search",
+        value: "search",
-        icon:"el-icon-search",
+        icon: "el-icon-search",
-        type:"primary"
+        type: "primary"
-    },{
+    }, {
-        name:"清空",
+        name: "清空",
-        icon:"el-icon-tickets",
+        icon: "el-icon-tickets",
-        value:"reset"
+        value: "reset"
     }];
     public tableActions = [{
-        name:"评估标准",
+        name: "评估标准",
-        value:"rules",
+        value: "rules",
-        type:"primary"
+        type: "primary"
     }];
-    public formOptions:FormOption<BtnOption>[] = [{
+    public formOptions: FormOption<BtnOption>[] = [{
-        name:"区域名称",
+        name: "区域名称",
-        key:"name",
+        key: "name",
-        type:"text",
+        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 showPop = false;
-    public popTitle = "";
+    public popTitle = "L";
 
-    public currentRow:any;
+    public currentRow: any;
+    //暂存当前行数据
+    public cacheCurrentRow: any;
 
-    public popBtns = [{
+    public stepsActive = 1;
-        name:"保存",
-        value:"save",
-        type:"primary"
-    },{
-        name:"取消",
-        value:"cancel",
-        type:""
-    }];
-    public numberForMat = ["","(Ⅳ)","(Ⅲ)","(Ⅱ)","(Ⅰ)"]
 
+    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(){
+    public buildTable() {
-        this.tableColumn.push({name:'区域名称',key:"name"});
+        this.tableColumn.push({ name: '区域名称', key: "name" });
-        this.tableColumn.push({name:'区域内发生事故的可能性/L',width:"195",render:(data)=>{
+        this.tableColumn.push({
-            if(!data.analFlag|| data.edit){
+            name: '区域内发生事故的可能性（L | S）', render: (data) => {
-                return "<span class='link l-value'>"+(data.analLikelihoodValue || "选取L值")+"</span>"
+                if (!data.analFlag || data.edit) {
-            }else{
+                    return "<span class='link'>" + (data.analLikelihoodValue && data.analSeverityValue ? ('L：' + data.analLikelihoodValue + '&nbsp' + ' | ' + '&nbsp' + 'S：' + data.analSeverityValue) : "点击去评估") + "</span>"
-                return data.analLikelihoodValue
+                } 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({
-        this.tableColumn.push({name:'区域固有风险',render:(data)=>{
+            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>"
+                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: '评估完成情况', 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?){
+    public callback(data, type?) {
-        if(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,
+            pageNum: 1,
-            pageSize:20,
+            pageSize: 20,
         } as any;
     }
 
 
 
-    public showUpdateModel(id){
+    public showUpdateModel(id) {
         // if(id!==-1){
         // }
         this.showUpdate = true
     }
 
-    // 添加L/S值
+    // 新增 添加L/S值
-    public addVal(el,row){
+    public addVal(el, row) {
         this.currentRow = row;
-        const isL = el.target.classList.contains("l-value");
+        this.cacheCurrentRow = JSON.parse(JSON.stringify(row));
-        this.popTitle = isL?"L值取值":"S值取值";
+        this.riskLDatas = riskLData;
-        this.riskDatas = isL?riskLData:riskSData;
+        this.popTitle = 'L';
-        const  data = isL?JSON.parse(row.analLikelihoodContent || "[]"):JSON.parse(row.analSeverityContent || "[]");
+        const lData = JSON.parse(row.analLikelihoodContent || "[]");
-        if(data.length){
+        const sData = JSON.parse(row.analSeverityContent || "[]");
-            this.riskDatas.forEach((item,i)=>{
+        if (lData.length) {
-                item.value = data[i];
+            this.riskLDatas.forEach((item, i) => {
-                item.result = isL? this.currentRow.analLikelihoodValue : this.currentRow.analSeverityValue
+                item.value = lData[i];
+                item.result = this.currentRow.analLikelihoodValue
             })
-        }else{
+        } else {
             // 如果没有值 则用字符串代替
-            this.riskDatas.forEach(item=>{
+            this.riskLDatas.forEach(item => {
-                item.value = isL?"Ln"+item.index:"Sn"+item.index
+                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){
+    public saveVal(row) {
-        if(!row.analLikelihoodValue){
+        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.analRiskLevel = riskLevel[row.analLikelihoodValue - 1][row.analSeverityValue - 1];
-            row.analFlag = 1;
+        row.analFlag = 1;
-        this.tableService.addOrUpdate(row,false,true).then((res)=>{
+        this.tableService.addOrUpdate(row, false, true).then((res) => {
             this.$message.success("保存成功")
             row.edit = false;
         })
     }
 
 
-    public colSpan({ row, column, rowIndex, columnIndex }){
+    public colSpan({ row, column, rowIndex, columnIndex }) {
-        if(columnIndex===8){
+        if (columnIndex === 7) {
             return {
                 rowspan: 6,
                 colspan: 1
@@ -186,66 +208,179 @@ export default class AreaAnalComponent extends BaseRecordComponent<any> {
         }
     }
 
-    public  selectRow(row,data){
+    public tableCellClassName({ row, column, rowIndex, columnIndex }) {
-        if(row.index===6 && data && data!==4 && this.popTitle==="L值取值"){
+        //注意这里是解构
+        //利用单元格的 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(){
+    public getTableCallback() {
-        this.tableData.datas = this.tableData.datas.map(item=>{
+        this.tableData.datas = this.tableData.datas.map(item => {
-            return Object.assign({edit:false,analFlag:0,analLikelihoodContent:"",analLikelihoodValue:null,analSeverityContent:"",analSeverityValue:null,analRiskLevel:0},item)
+            return Object.assign({ edit: false, analFlag: 0, analLikelihoodContent: "", analLikelihoodValue: null, analSeverityContent: "", analSeverityValue: null, analRiskLevel: 0 }, item)
         });
     }
 
-    public popCallback(data){
+    public popCallback(data) {
-        if(data.value === "save"){
+        if (data.value === "save") {
             let pass = true;
-            const datas:number[] = [];
+            const datas: number[] = [];
-            for(const item of this.riskDatas){
+            let tmpRiskData = this.popTitle === 'L' ? this.riskLDatas : this.riskSDatas;
-                if(typeof item.value !== "number"){
+            //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;
+            const length = datas.filter(item => item !== 0).length;
-            if(!length){
+            if (!length) {
                 this.$message.error("所有项目不可选为不涉及");
                 return
             }
-            const total = datas.reduce((total,cur)=>{
+            const total = datas.reduce((total, cur) => {
-                return total+cur
+                return total + cur
-            },0);
+            }, 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;
             }
-            
+        } else if (data.value === "cancel") {
-            this.riskDatas[0].value = value;
+            this.currentRow = this.cacheCurrentRow;
-            this.showPop = false;
-            this.currentRow = null;
-
-        }else if (data.value === "cancel"){
             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>

src/views/risk/assessment/work/work.component.html

@@ -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"
+            <FormComponent :inline="true" :options="formOptions" :data.sync="params" @actionCallback="callback"
-                :full-btn="false" @change="changes" btn-position="end"></FormComponent>
+                :actions="formActions" :full-btn="false" @change="changes" btn-position="end"></FormComponent>
         </div>
         <div class="table-box flex-1">
-            <TableComponent :tableData="tableData" :tableColumn="tableColumn"
+            <TableComponent :tableData="tableData" :tableColumn="tableColumn" @actionCallback="callback($event)"
-                @actionCallback="callback($event)" @pageNumberChange="callback($event,'pageNum')"
+                @pageNumberChange="callback($event,'pageNum')" @pageSizeChange="callback($event,'pageSize')"
-                @pageSizeChange="callback($event,'pageSize')" :footerActions="footerActions" :actions="tableActions">
+                :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>
-
+            <el-steps v-if="updateParams.steps.length > 0" direction="vertical" class="steps" style="width: 100%;">
-            <TableComponent :tableData="currentStepTableData" :tableColumn="subTableColumn"
+                <template v-for="(item,index) in updateParams.steps">
-                @actionCallback="callback($event)" :actions="!isReadonly?subTableActions:[]" actionPosition="flex-start"
+                    <el-step>
-                :showFooter="false" style="margin-bottom: 20px;">
+                        <template slot="icon">
-
+                            <span>步骤 {{index + 1}}</span>
-                <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>
                         </template>
-                    </el-table-column>
+                        <template slot="title">
-                </el-table>
+                            <span>{{item.name}}</span>
-
+                            <div v-if="!isReadonly">
-            </TableComponent>
+                                <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>
+        width="500" :before-close="handleClose" destroy-on-close>
-        <FormComponent :options="subUpdateOptions" labelWidth="110px"  @change="changes"  labelAlign="right" :data.sync="stepUpdateParams"
+        <FormComponent :options="subUpdateOptions" labelWidth="110px" @change="changes" labelAlign="right"
-            :full-btn="true" btnPosition="center" @actionCallback="callback" :actions="updateActions"></FormComponent>
+            :data.sync="stepUpdateParams" :full-btn="true" btnPosition="center" @actionCallback="callback"
+            :actions="subUpdateActions"></FormComponent>
     </el-dialog>
 
-
+    <el-dialog :close-on-click-modal="false" :title="`作业步骤（共${currentStepTableData.datas.length}步）`"
-
+        :visible.sync="showSteptable" width="800" :before-close="handleClose" destroy-on-close>
-    <el-dialog :close-on-click-modal="false" title="作业步骤" :visible.sync="showSteptable" width="800"
+        <el-steps direction="vertical" class="steps">
-        :before-close="handleClose"  destroy-on-close>
+            <template v-for="(item,index) in currentStepTableData.datas" >
-        <TableComponent :tableData="currentStepTableData" :tableColumn="subTableColumn" :showFooter="false"
+                <el-step :title="`${item.name}`">
-            style="margin-bottom: 20px;">
+                    <template slot="icon">
-            <el-table ref="multipleTable" :data="currentStepTableData.datas" tooltip-effect="dark" height="250" border style="width: 100%">
+                        <span>步骤 {{index + 1}}</span>
-                    <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>
                     </template>
-                </el-table>
+                    <template slot="description">
-        </TableComponent>
+                        <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>

src/views/risk/assessment/work/work.component.vue

@@ -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>

src/views/risk/assessment/work/workAnal.component.html

@@ -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>

src/views/risk/assessment/work/workAnal.component.vue

@@ -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>

src/views/risk/duty/dutyRecords.component.vue

@@ -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

src/views/threecards/riskCard.component.vue

@@ -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>"
                 }

src/views/threecards/safeCard.component.vue

@@ -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: "leaderName", width: "130px" });
-        this.tableColumn.push({ name: '承诺日期', key: "promiseTime", });
+        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")
         }
     }
 

src/views/workprogress/leader.component.vue

@@ -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) => {

src/views/workprogress/managementSystem.component.vue

@@ -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>`

src/views/workprogress/programme.component.vue

@@ -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 {

src/views/workprogress/trainRecords.component.vue

@@ -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" });