446 lines
10 KiB
Vue
446 lines
10 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="120"
|
||
>
|
||
<template #default="scope">
|
||
<el-button
|
||
link
|
||
size="small"
|
||
@click="sflog_edit(scope.row)"
|
||
v-auth="'sflog.update'"
|
||
type="primary"
|
||
>编辑</el-button
|
||
>
|
||
<!-- <el-button link size="small" @click="sflog_check(scope.row)" type="primary">质量检验</el-button> -->
|
||
<!-- <el-button link size="small" @click="sflog_other(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)
|
||
}}</span>
|
||
<span
|
||
v-if="sflogItem.shift_name"
|
||
style="margin: 0 10px"
|
||
>{{ 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">台时（t/h）</td>
|
||
<td class="numCell">
|
||
{{ reportItem.production_hour }}
|
||
</td>
|
||
<td class="numCell">运转时间（h）</td>
|
||
<td class="numCell">
|
||
{{ reportItem.run_hour }}
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="numCell">运转率（%）</td>
|
||
<td class="numCell">
|
||
{{ reportItem.run_rate }}
|
||
</td>
|
||
<td class="numCell">停机时长（h）</td>
|
||
<td class="numCell">
|
||
{{ reportItem.shut_hour }}
|
||
</td>
|
||
<td class="numCell">
|
||
当期单位产品电耗（kW·h/t）
|
||
</td>
|
||
<td class="numCell">
|
||
{{ reportItem.elec_consume_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.stlog_.start_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: null,
|
||
apiObj2: null,
|
||
query: {
|
||
mgroup: "",
|
||
},
|
||
deptId: "",
|
||
sflogItem: {},
|
||
selection: [],
|
||
modelValue: true,
|
||
showClose: true,
|
||
echartType: "line",
|
||
asynDialog: false,
|
||
options: [],
|
||
optionsShift: [],
|
||
teamOptions: [],
|
||
limitedExport: false,
|
||
reportItem: {},
|
||
sflogexpList: [],
|
||
};
|
||
},
|
||
mounted() {
|
||
this.$API.mtm.mgroup.list
|
||
.req({ page: 0, search: "原料磨" })
|
||
.then((res) => {
|
||
console.log("原料磨", res);
|
||
this.mgroupItem = res[0];
|
||
this.query.mgroup = res[0].id;
|
||
this.apiObj = this.$API.wpm.sflog.list;
|
||
this.deptId = res[0].belong_dept;
|
||
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,
|
||
},
|
||
});
|
||
// this.dialog.save = true;
|
||
// this.$nextTick(() => {
|
||
// this.$refs.saveDialog.open("edit").setData(row);
|
||
// });
|
||
},
|
||
|
||
//质量检验
|
||
sflog_check(row) {
|
||
this.dialog.check = true;
|
||
this.$nextTick(() => {
|
||
this.$refs.checkDialog.open("edit").setData(row);
|
||
});
|
||
},
|
||
|
||
//删除
|
||
async table_del(row) {
|
||
this.$API.wpm.sflog.delete
|
||
.req(row.id)
|
||
.then((res) => {
|
||
this.$message.success("删除成功");
|
||
return res;
|
||
})
|
||
.catch((err) => {
|
||
return err;
|
||
});
|
||
},
|
||
//新增岗位后更新数据
|
||
handleSaveSuccess(data, mode) {
|
||
this.$refs.table.refresh();
|
||
this.dialog.save = false;
|
||
},
|
||
handleOtherSuccess() {
|
||
this.dialog.other = false;
|
||
},
|
||
handleCheckSuccess() {
|
||
this.dialog.check = false;
|
||
},
|
||
closed() {
|
||
this.dialog.save = false;
|
||
this.$refs.table2.refresh();
|
||
},
|
||
handleDel(row) {
|
||
this.$confirm(`确定删除选中的记录吗？`, "提示", {
|
||
type: "warning",
|
||
})
|
||
.then(() => {
|
||
this.$API.wpm.shift.delete.req(row.id).then((res) => {
|
||
if (res.err_msg) {
|
||
this.$message.error(res.err_msg);
|
||
} else {
|
||
// const loading = this.$loading();
|
||
// this.$refs.table2.refresh();
|
||
// loading.close();
|
||
// this.$message.success("操作成功");
|
||
}
|
||
});
|
||
})
|
||
.catch(() => {});
|
||
},
|
||
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>
|