234 lines
7.9 KiB
Vue
234 lines
7.9 KiB
Vue
<template>
|
||
<el-container>
|
||
<el-header>
|
||
<div class="left-panel">
|
||
<div style="margin-right: 20px">交接班日志</div>
|
||
<el-date-picker v-model="query.start_time__gte" type="date" value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD"
|
||
placeholder="开始时间" style=" width: 120px" />
|
||
<el-date-picker v-model="query.end_time__lt" type="date" value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD"
|
||
placeholder="结束时间" style="margin-left: 2px; width: 120px" />
|
||
<el-select v-model="query.shift" placeholder="班次" clearable style="margin-left: 2px; width: 120px">
|
||
<el-option v-for="item in optionsShift" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
||
</el-select>
|
||
<el-select v-model="query.team" placeholder="班组" clearable style="margin-left: 2px; width: 120px">
|
||
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
||
</el-select>
|
||
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
|
||
</div>
|
||
</el-header>
|
||
<el-main class="nopadding">
|
||
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="query" highlightCurrentRow @row-click="rowClick">
|
||
<el-table-column type="index" width="50" />
|
||
<el-table-column label="开始时间" prop="start_time">
|
||
<template #default="scope">
|
||
<span>{{ scope.row.start_time.slice(0, 16) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="结束时间" prop="end_time">
|
||
<template #default="scope">
|
||
<span>{{ scope.row.end_time.slice(0, 16) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="班组名称" prop="team_name"></el-table-column>
|
||
<el-table-column label="当前班次" prop="shift_name"></el-table-column>
|
||
<el-table-column label="班长" prop="leader_name"></el-table-column>
|
||
<el-table-column label="检验时间">
|
||
<template #default="scope">
|
||
<span v-if="scope.row.last_test_time">{{ scope.row.last_test_time.slice(0, 16) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" fixed="right" align="center" width="150">
|
||
<template #default="scope">
|
||
<el-button link size="small" @click="sflog_edit(scope.row)" type="primary">编辑</el-button>
|
||
<el-divider direction="vertical"></el-divider>
|
||
<el-button link size="small" @click="sflog_export(scope.row)" type="success">报表</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</scTable>
|
||
</el-main>
|
||
<el-drawer v-model="limitedExport" size="60%" :show-close="false">
|
||
<template #header="{ close, titleId, titleClass }">
|
||
<h4 :id="titleId" :class="titleClass">交接班日志</h4>
|
||
<el-button type="danger" @click="close">
|
||
<el-icon class="el-icon--left">
|
||
<CircleCloseFilled />
|
||
</el-icon>
|
||
关闭
|
||
</el-button>
|
||
</template>
|
||
<div class="left-panel">
|
||
<el-button type="primary" @click="exportExcel()" :loading="exportLoading">导出xlsx
|
||
</el-button>
|
||
<el-button type="primary" @click="handlePrint">打印
|
||
</el-button>
|
||
</div>
|
||
<el-main class="nopadding">
|
||
<div ref="print" id="myReport" class="printContainer">
|
||
<div style="margin-right: 20px;text-align: center;font-size: 16px;font-weight: bold;margin-bottom: 20px;">
|
||
<span v-if="sflogItem.end_time">{{ sflogItem.end_time.slice(0, 10) }}{{ sflogItem.shift_name }}</span>
|
||
<span v-if="sflogItem.team_name">{{ sflogItem.team_name }}</span>
|
||
交接班记录
|
||
</div>
|
||
<table border="1" width="1000" cellspacing="0" :key="timeStamp" id="myTable">
|
||
<tbody>
|
||
<tr>
|
||
<td class="numCell">日期</td>
|
||
<td class="numCell" v-if="sflogItem.end_time">{{ sflogItem.end_time.slice(0, 10) }}</td>
|
||
<td class="numCell">班次</td>
|
||
<td class="numCell">{{ sflogItem.shift_name }}</td>
|
||
<td class="numCell">班组</td>
|
||
<td class="numCell"><span v-if="sflogItem.team_name">{{ sflogItem.team_name }}</span></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="numCell">产量（t）</td>
|
||
<td class="numCell">{{ reportItem.total_production }}</td>
|
||
<td class="numCell">单位产品分布电耗（KW·h/t）</td>
|
||
<td class="numCell">{{ reportItem.elec_consume_unit }}</td>
|
||
<td class="numCell">单位成本（元/吨）</td>
|
||
<td class="numCell">{{ reportItem.production_cost_unit }}</td>
|
||
</tr>
|
||
<tr v-if="sflogexpList.length > 0">
|
||
<td class="numCell" :rowspan="sflogexpList.length + 1">生产情况记录</td>
|
||
<td class="numCell">时间</td>
|
||
<td class="numCell">类别</td>
|
||
<td class="numCell">原因</td>
|
||
<td class="numCell">处置措施</td>
|
||
<td class="numCell">处置人</td>
|
||
</tr>
|
||
<tr v-for="item in sflogexpList" :key="item.id">
|
||
<td class="numCell">{{ item.happen_time }}</td>
|
||
<td class="numCell">{{ item.cate }}</td>
|
||
<td class="numCell">{{ item.reason }}</td>
|
||
<td class="numCell">{{ item.measure }}</td>
|
||
<td class="numCell">{{ item.handler }}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</el-main>
|
||
</el-drawer>
|
||
</el-container>
|
||
</template>
|
||
<script>
|
||
export default {
|
||
name: "sflog",
|
||
data() {
|
||
return {
|
||
apiObj: this.$API.wpm.sflog.list,
|
||
apiObj2: null,
|
||
query: {
|
||
mgroup: '3346491835287007232',
|
||
},
|
||
deptId: '3345780809943797760',
|
||
sflogItem: {},
|
||
options: [],
|
||
optionsShift: [],
|
||
limitedExport: false,
|
||
reportItem: {},
|
||
sflogexpList: [],
|
||
};
|
||
},
|
||
mounted() {
|
||
this.getTeam();
|
||
this.getShfit();
|
||
},
|
||
methods: {
|
||
getTeam() {
|
||
let form = {};
|
||
form.page = 0;
|
||
form.belong_dept = this.deptId;
|
||
this.$API.mtm.team.list.req(form).then(res => {
|
||
this.options = res;
|
||
})
|
||
},
|
||
getShfit() {
|
||
this.$API.mtm.shift.list.req({ page: 0 }).then(res => {
|
||
this.optionsShift = res;
|
||
})
|
||
},
|
||
handleQuery() {
|
||
this.$refs.table.queryData(this.query);
|
||
},
|
||
sflog_export() {
|
||
this.limitedExport = true;
|
||
},
|
||
rowClick(row) {
|
||
this.sflogId = row.id;
|
||
this.sflogItem = row;
|
||
this.getSflogItem(row.id);
|
||
this.getSflogexp(row.id);
|
||
},
|
||
getSflogexp(id) {
|
||
let that = this;
|
||
that.$API.wpm.sflogexp.list.req({ page: 0, sflog: id }).then(res => {
|
||
that.sflogexpList = res;
|
||
})
|
||
},
|
||
getSflogItem(id) {
|
||
let that = this;
|
||
that.$API.enm.enstat.req({ type: 'sflog', sflog: id, page: 0 }).then(res => {
|
||
if (res.length > 0) {
|
||
that.reportItem = res[0];
|
||
}
|
||
console.log(res[0])
|
||
})
|
||
},
|
||
//编辑
|
||
sflog_edit(row) {
|
||
let jsonStr = JSON.stringify(row);
|
||
this.$TOOL.data.remove("sflogItem")
|
||
this.$TOOL.data.set('sflogItem', jsonStr)
|
||
this.$router.push({
|
||
name: "logDetail",
|
||
query: {
|
||
mgroupId: row.mgroup,
|
||
deptId: this.deptId
|
||
},
|
||
});
|
||
},
|
||
handlePrint() {
|
||
this.$PRINT('#myReport');
|
||
},
|
||
exportExcel() {
|
||
this.exportLoading = true;
|
||
this.$XLSX('#myTable', this.tableName)
|
||
this.exportLoading = false;
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
#numTable {
|
||
margin-left: 37px;
|
||
}
|
||
|
||
#numTable td {
|
||
height: 32px;
|
||
padding-left: 5px;
|
||
}
|
||
|
||
.numCell {
|
||
width: 80px;
|
||
}
|
||
|
||
.numCell.numCell_last {
|
||
width: 100px;
|
||
}
|
||
|
||
.searchHead {
|
||
display: flex
|
||
}
|
||
|
||
.middleText {
|
||
height: 32px;
|
||
line-height: 32px;
|
||
margin: 0 5px;
|
||
display: inline-block;
|
||
}
|
||
|
||
.searchBtn {
|
||
margin-left: 5px;
|
||
}
|
||
</style>
|
||
|