258 lines
7.4 KiB
Vue
258 lines
7.4 KiB
Vue
<template>
|
|
<el-container>
|
|
<el-header>
|
|
<div class="right-panel">
|
|
<el-input v-model="query.batch"
|
|
placeholder="大批号"
|
|
clearable
|
|
style="width: 180px;"
|
|
></el-input>
|
|
<el-input v-model="query.sub_batch"
|
|
placeholder="子批号"
|
|
clearable
|
|
style="width: 180px; margin: 5px"
|
|
></el-input>
|
|
<el-select
|
|
v-model="query.kind"
|
|
placeholder="白料口径"
|
|
style="width: 130px;"
|
|
:clearable="true"
|
|
>
|
|
<el-option label="黑化领用" value="黑化领用"></el-option>
|
|
<el-option label="入库数量" value="入库数量"></el-option>
|
|
<el-option label="谱系兜底" value="谱系兜底"></el-option>
|
|
</el-select>
|
|
<el-date-picker
|
|
v-model="query.time_start"
|
|
type="date"
|
|
placeholder="最后操作开始日期"
|
|
value-format="YYYY-MM-DD"
|
|
clearable
|
|
style="width: 150px; margin: 5px"
|
|
></el-date-picker>
|
|
<el-date-picker
|
|
v-model="query.time_end"
|
|
type="date"
|
|
placeholder="最后操作结束日期"
|
|
value-format="YYYY-MM-DD"
|
|
clearable
|
|
style="width: 150px; margin:0"
|
|
></el-date-picker>
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-search"
|
|
@click="handleQuery"
|
|
></el-button>
|
|
<el-button
|
|
@click="handleExport"
|
|
class="tables"
|
|
type="primary"
|
|
>导出</el-button>
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<el-table
|
|
ref="table"
|
|
:data="tableData"
|
|
id="exportDiv"
|
|
stripe
|
|
class="totalFooterTable"
|
|
style="height: 100%;"
|
|
:summary-method="getSummaries"
|
|
show-summary
|
|
>
|
|
<el-table-column type="expand">
|
|
<template #default="scope">
|
|
<el-descriptions :column="4" size="small" border style="margin: 0 20px;">
|
|
<el-descriptions-item v-for="(v, k) in displayData(scope.row.data)" :key="k" :label="k">{{ v }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="大批号" prop="batch" min-width="200" fixed="left">
|
|
<template #default="scope"><span>{{ scope.row.batch }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="物料" min-width="140">
|
|
<template #default="scope"><span>{{ scope.row.material_start_name }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="白料数" class-name="colorheader1">
|
|
<template #default="scope"><span>{{ scope.row.data.直通_白料数 }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="直通总合格数" class-name="colorheader1">
|
|
<template #default="scope"><span>{{ scope.row.data.直通_总合格数 }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="直通良率(%)" class-name="colorheader5">
|
|
<template #default="scope"><span>{{ scope.row.data.直通_良率 }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="白料口径" width="120">
|
|
<template #default="scope"><span>{{ scope.row.data.直通_口径 }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="子批数" width="70">
|
|
<template #default="scope"><span>{{ subCount(scope.row) }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="子批次" min-width="260" show-overflow-tooltip>
|
|
<template #default="scope"><span>{{ scope.row.data.直通_子批次 }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="首次操作" width="100">
|
|
<template #default="scope"><span>{{ (scope.row.first_time || '').slice(0, 10) }}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="最后操作" width="100">
|
|
<template #default="scope"><span>{{ (scope.row.last_time || '').slice(0, 10) }}</span></template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-main>
|
|
<el-footer>
|
|
<el-pagination
|
|
background
|
|
:small="true"
|
|
:total="dataTotal"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:page-size="params.page_size"
|
|
:page-sizes="[20, 50, 100, 200]"
|
|
:current-page="params.page"
|
|
@current-change="getList"
|
|
@update:page-size="getList2"
|
|
></el-pagination>
|
|
</el-footer>
|
|
</el-container>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "zt_batch_gx",
|
|
data() {
|
|
return {
|
|
query: {
|
|
batch: '',
|
|
sub_batch: '',
|
|
kind: '',
|
|
time_start: '',
|
|
time_end: '',
|
|
},
|
|
params: {
|
|
page: 1,
|
|
page_size: 20,
|
|
ordering: "-last_time",
|
|
querys: [
|
|
[{field: "data__has_key", compare: "", value: "直通_白料数"}]
|
|
],
|
|
},
|
|
dataTotal: 0,
|
|
tableData: [],
|
|
};
|
|
},
|
|
mounted() {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
subCount(row) {
|
|
let s = row.data.直通_子批次;
|
|
return s ? s.split(";").length : 0;
|
|
},
|
|
displayData(data) {
|
|
// count_* 字段后缀翻译为中文展示(注意 _count_ok_full 须在 _count_ok 之前替换)
|
|
const map = [
|
|
["_count_ok_full", "_完全合格数"],
|
|
["_count_notok", "_不合格数"],
|
|
["_count_ok", "_合格数"],
|
|
["_count_use", "_领用数"],
|
|
["_count_real", "_生产数"],
|
|
["_count_pn_jgqbl", "_加工前不良"],
|
|
];
|
|
const out = {};
|
|
for (const k in data) {
|
|
let nk = k;
|
|
for (const [en, cn] of map) {
|
|
if (nk.includes(en)) {
|
|
nk = nk.replace(en, cn);
|
|
break;
|
|
}
|
|
}
|
|
out[nk] = data[k];
|
|
}
|
|
return out;
|
|
},
|
|
getList(val) {
|
|
let that = this;
|
|
that.params.page = val ? val : 1;
|
|
that.$API.wpm.batchstquery.req(that.params).then((res) => {
|
|
if (res.count > 0) {
|
|
that.tableData = res.results;
|
|
that.dataTotal = res.count;
|
|
} else {
|
|
that.tableData = [];
|
|
that.dataTotal = 0;
|
|
}
|
|
});
|
|
},
|
|
getList2(val) {
|
|
let that = this;
|
|
that.params.page = 1;
|
|
that.params.page_size = val;
|
|
that.getList(1);
|
|
},
|
|
handleQuery() {
|
|
let that = this;
|
|
that.params.page = 1;
|
|
let arr = [{field: "data__has_key", compare: "", value: "直通_白料数"}];
|
|
for (let key in that.query) {
|
|
if (that.query[key] != "" && that.query[key] != null && that.query[key] != undefined) {
|
|
let obj = {};
|
|
obj.value = that.query[key];
|
|
if (key == 'batch') {
|
|
obj.field = "batch";
|
|
obj.compare = "contains";
|
|
} else if (key == 'sub_batch') {
|
|
// JSONField 键上 contains 是 JSON 包含语义, 子串匹配须用 icontains
|
|
obj.field = "data__直通_子批次";
|
|
obj.compare = "icontains";
|
|
} else if (key == 'kind') {
|
|
obj.field = "data__直通_口径";
|
|
obj.compare = "icontains";
|
|
} else if (key == 'time_start') {
|
|
obj.compare = "gte";
|
|
obj.field = "last_time";
|
|
} else if (key == 'time_end') {
|
|
obj.compare = "lte";
|
|
obj.field = "last_time";
|
|
obj.value = that.query[key] + " 23:59:59";
|
|
}
|
|
arr.push(obj);
|
|
}
|
|
}
|
|
that.params.querys = [arr];
|
|
this.getList();
|
|
},
|
|
getSummaries({ columns, data }) {
|
|
const sums = [];
|
|
let whiteSum = 0, okSum = 0;
|
|
data.forEach((r) => {
|
|
whiteSum += Number(r.data.直通_白料数) || 0;
|
|
okSum += Number(r.data.直通_总合格数) || 0;
|
|
});
|
|
columns.forEach((column, index) => {
|
|
if (index === 1) {
|
|
sums[index] = "合计";
|
|
return;
|
|
}
|
|
if (column.label == "白料数") {
|
|
sums[index] = whiteSum ? Number(whiteSum.toFixed(1)) : "";
|
|
} else if (column.label == "直通总合格数") {
|
|
sums[index] = okSum || "";
|
|
} else if (column.label == "直通良率(%)") {
|
|
sums[index] = whiteSum ? ((okSum / whiteSum) * 100).toFixed(2) : "";
|
|
} else {
|
|
sums[index] = "";
|
|
}
|
|
});
|
|
return sums;
|
|
},
|
|
handleExport() {
|
|
this.$XLSX("#exportDiv", "大批直通良率统计");
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
</style>
|