168 lines
3.9 KiB
Vue
168 lines
3.9 KiB
Vue
<template>
|
|
<div>
|
|
<scEcharts height="300px" :option="option" style="margin-top: 10px;"></scEcharts>
|
|
<el-table :data="tableData" class="exportTables">
|
|
<el-table-column type="index" width="50" />
|
|
<el-table-column label="工段" prop="工段">
|
|
</el-table-column>
|
|
<el-table-column
|
|
label="物料名"
|
|
prop="物料名"
|
|
min-width="100"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column label="任务数" prop="任务数">
|
|
</el-table-column>
|
|
<el-table-column label="生产数" prop="生产数">
|
|
</el-table-column>
|
|
<el-table-column label="合格数" prop="合格数">
|
|
</el-table-column>
|
|
<el-table-column label="不合格数" prop="不合格数">
|
|
</el-table-column>
|
|
<el-table-column label="完成进度" prop="完成进度">
|
|
<template #default="scope">
|
|
<span v-if="scope.row.完成进度&&scope.row.完成进度>0">{{(scope.row.完成进度).toFixed(2)}}%</span>
|
|
<span v-else>{{scope.row.完成进度}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="合格率" prop="合格率">
|
|
<template #default="scope">
|
|
<span v-if="scope.row.合格率&&scope.row.合格率>0">{{(scope.row.合格率).toFixed(2)}}%</span>
|
|
<span v-else>{{scope.row.合格率}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import scEcharts from "@/components/scEcharts";
|
|
export default {
|
|
name: "all_sc_gx",
|
|
components: {
|
|
scEcharts,
|
|
},
|
|
props: {
|
|
queryType:{
|
|
type: String,
|
|
default: "月"
|
|
},
|
|
queryDate:{
|
|
type: String,
|
|
default: ""
|
|
},
|
|
start_date:{
|
|
type: String,
|
|
default: ""
|
|
},
|
|
end_date:{
|
|
type: String,
|
|
default: ""
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
currentYear: "",
|
|
currentMonth: "",
|
|
typeOptions: ["月", "年"],
|
|
option: {
|
|
title: {
|
|
text: "6车间工序合格数统计",
|
|
left: "center",
|
|
},
|
|
grid: {
|
|
top: "80px",
|
|
},
|
|
tooltip: {
|
|
trigger: "axis",
|
|
},
|
|
legend: {
|
|
top: "10%",
|
|
icon: "stack",
|
|
right:'10%',
|
|
},
|
|
xAxis: {
|
|
type: "category",
|
|
data: [],
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
},
|
|
series: [],
|
|
},
|
|
processData: [],
|
|
xAxisData: [],
|
|
tableData: [],
|
|
};
|
|
},
|
|
mounted() {
|
|
let that = this;
|
|
that.$nextTick(() => {
|
|
that.getData6();
|
|
})
|
|
},
|
|
methods: {
|
|
getData6() {
|
|
let that = this;
|
|
let obj = {
|
|
query: {
|
|
start_date: that.start_date,
|
|
end_date: that.end_date,
|
|
dept_name: "6车间",
|
|
select_cols_material: "",
|
|
group_bys_material: "",
|
|
order_bys_material: "",
|
|
is_count_utask: -1,
|
|
select_cols_mgroup: ", mgroup.name AS 工段",
|
|
group_bys_mgroup: ", mgroup.name",
|
|
order_bys_mgroup:",工段"
|
|
},
|
|
raise_exception: true,
|
|
};
|
|
if (that.queryType == "月") {
|
|
obj.query.select_cols_date =
|
|
",EXTRACT ( MONTH FROM mlog.handle_date ) AS 月";
|
|
obj.query.group_bys_date =
|
|
",EXTRACT ( MONTH FROM mlog.handle_date )";
|
|
obj.query.order_bys_date = ", 月";
|
|
}
|
|
let xAxisData = [],nameData=[],seriesData=[];
|
|
that.$API.bi.dataset.exec.req("lineWeek", obj).then((res) => {
|
|
let data = res.data2.ds0;
|
|
that.tableData = data;
|
|
data.forEach((item) => {
|
|
if (xAxisData.indexOf(item.工段) > -1) {
|
|
} else {
|
|
xAxisData.push(item.工段);
|
|
}
|
|
if (nameData.indexOf(item.物料名) > -1) {
|
|
} else {
|
|
nameData.push(item.物料名);
|
|
let obj = {
|
|
name:'',
|
|
type: "bar",
|
|
label:{
|
|
show: true,
|
|
position: "top",
|
|
formatter: "{c}"
|
|
},
|
|
barWidth: "15px",
|
|
data:[0, 0, 0, 0, 0, 0, 0, 0],
|
|
};
|
|
obj.name=item.物料名,
|
|
seriesData.push(obj);
|
|
}
|
|
let index = xAxisData.indexOf(item.工段);
|
|
let indexY = nameData.indexOf(item.物料名);
|
|
seriesData[indexY].data[index] += item.合格数;
|
|
});
|
|
that.xAxisData = xAxisData;
|
|
that.option.xAxis.data = that.xAxisData;
|
|
that.option.series = seriesData;
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|