forked from xxhjsb/hbt-prevention-ui
467 lines
12 KiB
Vue
467 lines
12 KiB
Vue
<script lang="ts">
|
|
import { Component } from 'vue-property-decorator';
|
|
import template from "./estimate.component.html"
|
|
import BaseRecordComponent from "hbt-common/components/common/baseRecord.component.vue"
|
|
import FormComponent from "hbt-common/components/common/form.component.vue"
|
|
import TableComponent from "hbt-common/components/common/table.component.vue"
|
|
import FormOption from "hbt-common/models/formOptions"
|
|
import BtnOption from "hbt-common/models/btnOptions"
|
|
import DrawComponent from '@/components/draw.component.vue';
|
|
import CheckResumptionService from '@/service/checkResumption.service';
|
|
import moment from 'moment';
|
|
|
|
@Component({
|
|
template,
|
|
components: {
|
|
FormComponent,
|
|
TableComponent,
|
|
DrawComponent,
|
|
BtnOption,
|
|
FormOption
|
|
},
|
|
})
|
|
export default class checkResumption extends BaseRecordComponent<any> {
|
|
public tableService = new CheckResumptionService();
|
|
|
|
|
|
public params = {
|
|
majorHazard: null,
|
|
|
|
time: null,
|
|
} as any;
|
|
//tab页切换
|
|
public type = 1;
|
|
|
|
public showProtable = false;
|
|
|
|
public tableColumn = [] as any;
|
|
|
|
public showUpdate = false;
|
|
|
|
public updateParams = {} as any;
|
|
|
|
public selectData = [];
|
|
|
|
public isReadonly = false;
|
|
|
|
public hideOperate = true;
|
|
|
|
public showFile = false;
|
|
|
|
public currentUrl = null;
|
|
|
|
public showSubUpdate = false;
|
|
|
|
public isCheckTask = true;
|
|
|
|
public reportTable = {} as any;
|
|
|
|
public isPublicity = null;
|
|
|
|
public cycleList = [] as any;
|
|
|
|
public riskSourceMap = {} as any;
|
|
|
|
public dangerTypeMap = { 1: '主要负责人', 2: '技术负责人', 3: '操作负责人' };
|
|
|
|
public dangerType = [{
|
|
value: 0,
|
|
name: "全部",
|
|
},
|
|
{
|
|
value: 1,
|
|
name: "主要负责人",
|
|
},
|
|
{
|
|
value: 2,
|
|
name: "技术负责人",
|
|
},
|
|
{
|
|
value: 3,
|
|
name: "操作负责人",
|
|
},]
|
|
|
|
public tabs = [{
|
|
name: "统计台账",
|
|
value: 1
|
|
}, {
|
|
name: "查看报表",
|
|
value: 2
|
|
},]
|
|
|
|
public formActions = [{
|
|
name: "查询",
|
|
value: "search",
|
|
icon: "el-icon-search",
|
|
type: "primary"
|
|
}, {
|
|
name: "清空",
|
|
icon: "el-icon-tickets",
|
|
value: "reset"
|
|
}];
|
|
|
|
public tableActions = [{
|
|
name: "批量删除",
|
|
value: "delete",
|
|
plain: true,
|
|
icon: "el-icon-delete",
|
|
type: "danger"
|
|
}];
|
|
|
|
public footerActions = [{
|
|
name: "选择全部",
|
|
value: "selectAll",
|
|
type: "primary"
|
|
}, {
|
|
name: "反向选择",
|
|
value: "reverse"
|
|
}];
|
|
|
|
public formOptions: FormOption<BtnOption>[] = [];
|
|
|
|
public buildFormOptions() {
|
|
this.formOptions = [{
|
|
name: "重大危险源名称",
|
|
key: "majorHazard",
|
|
type: "select",
|
|
datas: this.$store.state.prevention.prevention_risk_source
|
|
},
|
|
{
|
|
name: "周期",
|
|
key: "cycle",
|
|
type: "select",
|
|
datas: this.cycleList,
|
|
hide: this.type === 2,
|
|
},
|
|
{
|
|
name: "包保责任人类型",
|
|
key: "type",
|
|
type: "select",
|
|
datas: this.dangerType,
|
|
hide: this.type === 2,
|
|
},
|
|
{
|
|
name: "周期",
|
|
key: "time",
|
|
type: "date",
|
|
subType: "week",
|
|
format: "yyyy 第 WW 周",
|
|
valueFormat: "yyyy-MM-dd",
|
|
hide: this.type === 1,
|
|
pickerOptions: { "firstDayOfWeek": 1 }
|
|
},
|
|
];
|
|
}
|
|
|
|
public subActions = [{
|
|
name: "取消",
|
|
value: "cancel"
|
|
}];
|
|
|
|
|
|
public updateActions = [{
|
|
name: "取消",
|
|
value: "cancel"
|
|
}, {
|
|
name: "保存并继续添加",
|
|
value: "saveAndContinue",
|
|
type: "primary"
|
|
}, {
|
|
name: "保存",
|
|
value: "save",
|
|
type: "primary"
|
|
}];
|
|
|
|
|
|
public updateOptions: FormOption<BtnOption>[] = [] as any;
|
|
|
|
|
|
created() {
|
|
//获取周期
|
|
this.getCycleListData();
|
|
this.buildFormOptions()
|
|
this.riskSourceMap = this.$store.getters.prevention_risk_source_map
|
|
}
|
|
|
|
//获取周期
|
|
public getCycleListData() {
|
|
this.tableService.selectCycleData({}).then((res: any) => {
|
|
res.data.forEach((item) => {
|
|
let itemList = {} as any;
|
|
itemList.name = item;
|
|
itemList.value = item;
|
|
this.cycleList.push(itemList)
|
|
})
|
|
})
|
|
}
|
|
|
|
public tabTableChange(type) {
|
|
this.params.pageNum = 1;
|
|
if (type === 1) {
|
|
this.buildFormOptions()
|
|
this.getTableData()
|
|
} else if (type === 2) {
|
|
this.buildFormOptions()
|
|
this.getReportTableData()
|
|
}
|
|
this.type = type
|
|
}
|
|
|
|
public change(data, item) {
|
|
//
|
|
}
|
|
|
|
|
|
public buildTable() {
|
|
this.tableColumn.push({ name: '周期', key: "cycle" });
|
|
this.tableColumn.push({
|
|
name: '重大危险源', key: "majorHazard", render: (data) => {
|
|
return this.$store.getters.prevention_risk_source_map[data.majorHazard]
|
|
}
|
|
});
|
|
this.tableColumn.push({ name: '包保责任人姓名', key: "taskChargeUserName", });
|
|
this.tableColumn.push({
|
|
name: '包保责任人类型', key: "type", render: (data) => {
|
|
return data.type ? this.dangerTypeMap[data.type] : '--'
|
|
}
|
|
});
|
|
this.tableColumn.push({ name: '排查任务数', key: "taskNumber", });
|
|
this.tableColumn.push({ name: '完成任务数', key: "completeNumber", });
|
|
this.tableColumn.push({
|
|
name: '完成率 /%', key: "completeRate", render: (data) => {
|
|
return (data.completeRate * 100).toFixed(2) + '%'
|
|
}
|
|
});
|
|
}
|
|
|
|
public callback(data, type) {
|
|
if (type) {
|
|
if (this.type === 1) {
|
|
if (type === 'pageSize' || type === 'pageNum') {
|
|
this.params[type] = data;
|
|
}
|
|
this.getTableData()
|
|
} else {
|
|
this.getReportTableData()
|
|
}
|
|
return
|
|
}
|
|
// 查询
|
|
if (data.value === "search") {
|
|
if (this.type === 1) {
|
|
this.getTableData()
|
|
} else {
|
|
this.getReportTableData()
|
|
}
|
|
// 重置
|
|
} else if (data.value === "reset") {
|
|
this.reset()
|
|
// 反选
|
|
} else if (data.value === "reverse") {
|
|
this.toggleAll()
|
|
// 全选
|
|
} else if (data.value === "selectAll") {
|
|
this.selectAll()
|
|
} else if (data.value === "delete") {
|
|
this.deleteData(this.selectData.map((item: any) => item.id))
|
|
} else if (data.value === 'add') {
|
|
this.showUpdate = true
|
|
}
|
|
}
|
|
// 分页数据
|
|
public getTableData() {
|
|
const tmpParams = Object.assign(JSON.parse(JSON.stringify(this.params)), {
|
|
type: this.params.type ? this.params.type : null
|
|
})
|
|
this.tableService.selectByPage(tmpParams).then(res => {
|
|
if (res.data) {
|
|
this.tableData = res.data as any;
|
|
}
|
|
|
|
})
|
|
}
|
|
//报表数据
|
|
public getReportTableData() {
|
|
if (this.params.time) {
|
|
this.params.startTime = moment(this.params.time).startOf('week').format('YYYY-MM-DD');
|
|
this.params.endTime = moment(this.params.time).endOf('week').format('YYYY-MM-DD');
|
|
}
|
|
this.tableService.selectReportData(this.params).then((res: any) => {
|
|
if (res.data) {
|
|
this.reportTable = res.data as any;
|
|
}
|
|
})
|
|
}
|
|
// 重置数据
|
|
public reset() {
|
|
this.params.pageSize = 20;
|
|
this.params.pageNum = 1;
|
|
this.params.cycle = null;
|
|
this.params.majorHazard = null;
|
|
this.params.startTime = null;
|
|
this.params.endTime = null;
|
|
this.params.time = null;
|
|
this.params.type = null;
|
|
if (this.type === 1) {
|
|
this.getTableData()
|
|
} else {
|
|
this.getReportTableData()
|
|
}
|
|
}
|
|
|
|
public handleClose() {
|
|
this.showUpdate = false;
|
|
}
|
|
|
|
public selectable(row) {
|
|
//
|
|
}
|
|
|
|
public toggleAll() {
|
|
|
|
this.tableData.datas.forEach((item, index) => {
|
|
(this.$refs.multipleTable as any).toggleRowSelection(item);
|
|
})
|
|
}
|
|
public selectAll() {
|
|
if (!this.selectData.length) {
|
|
this.toggleAll()
|
|
} else {
|
|
this.tableData.datas.forEach((item, index) => {
|
|
const find = this.selectData.find((data: any) => data.id === item.id);
|
|
if (!find) {
|
|
(this.$refs.multipleTable as any).toggleRowSelection(item);
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|
|
public handleSelectionChange(data) {
|
|
this.selectData = data;
|
|
}
|
|
|
|
public subCallback(data) {
|
|
if (data.value === "cancel") {
|
|
this.showUpdate = false
|
|
}
|
|
}
|
|
|
|
public rowClass({ row, column, rowIndex, columnIndex }) {
|
|
if (row.startTime == '合计：') {
|
|
return 'fixed-row'
|
|
}
|
|
}
|
|
|
|
//合计行
|
|
public summaryMethod(params) {
|
|
const { columns, data } = params;
|
|
const sums = [] as any;
|
|
|
|
columns.forEach((column, index) => {
|
|
|
|
if (index === 0) {
|
|
sums[index] = "合计";
|
|
return;
|
|
}
|
|
if (index === 2) {
|
|
sums[index] = this.reportTable.allTotalCompleted;
|
|
return;
|
|
}
|
|
if (index === 3) {
|
|
sums[index] = this.reportTable.allTotal;
|
|
return;
|
|
}
|
|
if (index === 4) {
|
|
sums[index] = this.reportTable.allTotalCompletionRate;
|
|
return;
|
|
}
|
|
if (index === 5) {
|
|
sums[index] = this.reportTable.allMainCompleted;
|
|
return;
|
|
}
|
|
if (index === 6) {
|
|
sums[index] = this.reportTable.allMain;
|
|
return;
|
|
}
|
|
if (index === 7) {
|
|
sums[index] = this.reportTable.allMainCompletionRate;
|
|
return;
|
|
}
|
|
if (index === 8) {
|
|
sums[index] = this.reportTable.allTechnologyCompleted;
|
|
return;
|
|
}
|
|
if (index === 9) {
|
|
sums[index] = this.reportTable.allTechnology;
|
|
return;
|
|
}
|
|
if (index === 10) {
|
|
sums[index] = this.reportTable.allTechnologyCompletionRate;
|
|
return;
|
|
}
|
|
if (index === 11) {
|
|
sums[index] = this.reportTable.allOperateCompleted;
|
|
return;
|
|
}
|
|
if (index === 12) {
|
|
sums[index] = this.reportTable.allOperate;
|
|
return;
|
|
}
|
|
if (index === 13) {
|
|
sums[index] = this.reportTable.allOperateCompletionRate;
|
|
return;
|
|
}
|
|
// if (this.reportTable.length == 0) {
|
|
// sums[index] = "";
|
|
// return;
|
|
// }
|
|
|
|
});
|
|
|
|
return sums;
|
|
}
|
|
}
|
|
|
|
</script>
|
|
<style lang="scss" scoped src="../common.component.scss"></style>
|
|
<style lang="scss" scoped>
|
|
::v-deep {
|
|
.el-table thead.is-group th.el-table__cell {
|
|
background: #fff;
|
|
}
|
|
|
|
.reportTable {
|
|
flex: 1;
|
|
height: 1px;
|
|
width: 100%;
|
|
|
|
.el-table__body {
|
|
|
|
// 吸底
|
|
.fixed-row {
|
|
display: inline-block;
|
|
position: sticky;
|
|
bottom: 0;
|
|
width: 100%;
|
|
|
|
td {
|
|
border: 1px solid #fff;
|
|
box-shadow: 2px -2px 3px 0px #ddd;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.reportTable {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.el-radio-button__inner {
|
|
border: none !important;
|
|
}
|
|
|
|
.el-radio-button__orig-radio:checked+.el-radio-button__inner {
|
|
border-bottom: 2px solid #409EFF !important;
|
|
}
|
|
</style> |