更新模块
This commit is contained in:
‘937886381’
311
src/views/modules/shipment/CDiagram.vue
Normal file
311
src/views/modules/shipment/CDiagram.vue
Normal file
@@ -0,0 +1,311 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:12
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-select v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')">
|
||||
<el-option v-for="item in characteristicsList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.grouping')">
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="0">批号</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="1">年</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="2">月</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="3">日</el-radio>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/c/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList: [],
|
||||
characteristicsList: [],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
divideIntoGroup:null
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize: null,
|
||||
divideIntoGroup: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.characteristicsList[0].id = res.data.id
|
||||
this.characteristicsList[0].name = res.data.parameterName
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.dataForm.startTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[0] : null
|
||||
this.dataForm.endTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[1] : null
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.dataForm
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
let defectNumberArr = []
|
||||
let xAxisData = []
|
||||
res.data.forEach((item) => {
|
||||
defectNumberArr.push(item.defectNumber)
|
||||
this.dataForm.divideIntoGroup === 0 ? xAxisData.push(item.batchNo) : this.dataForm.divideIntoGroup === 1 ? xAxisData.push(item.year) : this.dataForm.divideIntoGroup === 2 ? xAxisData.push(item.month) : this.dataForm.divideIntoGroup === 3 ? xAxisData.push(item.day) : ''
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: 'C图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: ' 缺陷数',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: defectNumberArr
|
||||
}
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
317
src/views/modules/shipment/NPDiagram.vue
Normal file
317
src/views/modules/shipment/NPDiagram.vue
Normal file
@@ -0,0 +1,317 @@
|
||||
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:36
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-select v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')">
|
||||
<el-option v-for="item in characteristicsList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.grouping')">
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="0">批号</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="1">年</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="2">月</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="3">日</el-radio>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/np/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList: [],
|
||||
characteristicsList: [],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
divideIntoGroup:null
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize: null,
|
||||
divideIntoGroup: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.characteristicsList[0].id = res.data.id
|
||||
this.characteristicsList[0].name = res.data.parameterName
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.dataForm.startTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[0] : null
|
||||
this.dataForm.endTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[1] : null
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.dataForm
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
let xAxisData = []
|
||||
res.data.forEach((item) => {
|
||||
this.dataForm.divideIntoGroup === 0 ? xAxisData.push(item.batchNo) : this.dataForm.divideIntoGroup === 1 ? xAxisData.push(item.year) : this.dataForm.divideIntoGroup === 2 ? xAxisData.push(item.month) : this.dataForm.divideIntoGroup === 3 ? xAxisData.push(item.day) : ''
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: 'C图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
data: dpuData
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '缺陷数量',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: res.data.map(i => { return i.defectNumber })
|
||||
}
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
328
src/views/modules/shipment/UDiagram.vue
Normal file
328
src/views/modules/shipment/UDiagram.vue
Normal file
@@ -0,0 +1,328 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:56:30
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-select v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')">
|
||||
<el-option v-for="item in characteristicsList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.grouping')">
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="0">批号</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="1">年</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="2">月</el-radio>
|
||||
<el-radio v-model="dataForm.divideIntoGroup" label="3">日</el-radio>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/u/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList: [],
|
||||
characteristicsList: [],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
divideIntoGroup:null
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize: null,
|
||||
divideIntoGroup: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.characteristicsList[0].id = res.data.id
|
||||
this.characteristicsList[0].name = res.data.parameterName
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.dataForm.startTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[0] : null
|
||||
this.dataForm.endTime = this.dataForm.timeSlot ? this.dataForm.timeSlot[1] : null
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.dataForm
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
let xAxisData = []
|
||||
res.data.forEach((item) => {
|
||||
this.dataForm.divideIntoGroup === 0 ? xAxisData.push(item.batchNo) : this.dataForm.divideIntoGroup === 1 ? xAxisData.push(item.year) : this.dataForm.divideIntoGroup === 2 ? xAxisData.push(item.month) : this.dataForm.divideIntoGroup === 3 ? xAxisData.push(item.day) : ''
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: 'C图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
data: res.data.map(i => { return i.dpu })
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: ' 单位缺陷',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: res.data.map(i => { return i.dpu })
|
||||
},
|
||||
{
|
||||
name: ' UCL',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: res.data.map(i => { return i.ucl })
|
||||
},
|
||||
{
|
||||
name: 'LCL',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: res.data.map(i => { return i.lcl })
|
||||
}
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
370
src/views/modules/shipment/boxplot.vue
Normal file
370
src/views/modules/shipment/boxplot.vue
Normal file
@@ -0,0 +1,370 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:03
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-input v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/box/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList:[],
|
||||
listQuery: {
|
||||
characteristicsId:null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize:null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId:val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.characteristicsId = res.data.parameterName
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text:'箱线图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: 'item', // axis显示该列下所有坐标轴对应数据，item只显示该点数据
|
||||
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
||||
type: 'line' // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
var res = `
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'min:' + res.data.min}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'Q1:' + res.data.Q1}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'median:' + res.data.median}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'Q3:' + res.data.Q3}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'max:' + res.data.max}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
style='display: inline-block;
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
color: ${params.color}'
|
||||
>●</div>
|
||||
<span>${'outlier:' + res.data.outlier}</span>
|
||||
</div>
|
||||
`
|
||||
return params.name + res
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: [this.dataForm.characteristicsId ],
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '最大值',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [res.data.max]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
254
src/views/modules/shipment/components/meanMovingRangeRange.vue
Normal file
254
src/views/modules/shipment/components/meanMovingRangeRange.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 11:23:41
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/mean/range/chart",
|
||||
},
|
||||
tableData: [],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
rangeCl: res.data.rangeCl,
|
||||
rangeLcl: res.data.rangeCl,
|
||||
rangeUcl: res.data.rangeCl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
console.log(res)
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: [1, 2131, 312, 231321, 321312, 321321, 321312, 321321],
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,254 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 11:23:43
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/mean/range/chart",
|
||||
},
|
||||
tableData: [],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
rangeCl: res.data.rangeCl,
|
||||
rangeLcl: res.data.rangeCl,
|
||||
rangeUcl: res.data.rangeCl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
console.log(res)
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: [1, 2131, 312, 231321, 321312, 321321, 321312, 321321],
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
264
src/views/modules/shipment/components/meanRange.vue
Normal file
264
src/views/modules/shipment/components/meanRange.vue
Normal file
@@ -0,0 +1,264 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 14:11:35
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/mean/range/chart",
|
||||
},
|
||||
tableData:[],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
rangeCl: res.data.rangeCl,
|
||||
rangeLcl: res.data.rangeLcl,
|
||||
rangeUcl: res.data.rangeUcl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
res.data.shipmentRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
xAxisData.push(ele.batchNo + ele.groupNo)
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageCl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
264
src/views/modules/shipment/components/meanStandard.vue
Normal file
264
src/views/modules/shipment/components/meanStandard.vue
Normal file
@@ -0,0 +1,264 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 14:11:30
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/mean/standard/deviation/chart",
|
||||
},
|
||||
tableData: [],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'averageCl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
standardDeviationCl: res.data.standardDeviationCl,
|
||||
standardDeviationLcl: res.data.standardDeviationLcl,
|
||||
standardDeviationUcl: res.data.standardDeviationUcl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
res.data.shipmentRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
xAxisData.push(ele.batchNo + ele.groupNo)
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.standardDeviationUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageCl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.standardDeviationCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
271
src/views/modules/shipment/components/medianRange.vue
Normal file
271
src/views/modules/shipment/components/medianRange.vue
Normal file
@@ -0,0 +1,271 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 14:11:13
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/median/range/chart",
|
||||
},
|
||||
tableData: [],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'median',
|
||||
label: '中位数',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
rangeCl: res.data.rangeCl,
|
||||
rangeLcl: res.data.rangeCl,
|
||||
rangeUcl: res.data.rangeCl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
res.data.shipmentRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
this.tableData.push(ele.median)
|
||||
})
|
||||
let xAxisData = []
|
||||
res.data.shipmentRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
xAxisData.push(ele.batchNo + ele.groupNo)
|
||||
})
|
||||
console.log(res)
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
264
src/views/modules/shipment/components/singleValueMovingRange.vue
Normal file
264
src/views/modules/shipment/components/singleValueMovingRange.vue
Normal file
@@ -0,0 +1,264 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-06-19 09:19:53
|
||||
* @LastEditTime: 2023-06-20 14:11:05
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="18">
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table style="width: 100%" :data="getValues" :show-header="false">
|
||||
<el-table-column width="180" v-for="(item, index) in getHeaders" :key="index" :prop="item">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/single/value/movement/range/chart",
|
||||
},
|
||||
tableData: [],
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
methods: {
|
||||
getData(listQuery) {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.tableData.push({
|
||||
average: res.data.average,
|
||||
averageCl: res.data.averageCl,
|
||||
averageLcl: res.data.averageLcl,
|
||||
averageUcl: res.data.averageUcl,
|
||||
ca: res.data.ca,
|
||||
cp: res.data.cp,
|
||||
cpk: res.data.cpk,
|
||||
groupNum: res.data.groupNum,
|
||||
lsl: res.data.lsl,
|
||||
ppk: res.data.ppk,
|
||||
rangeCl: res.data.rangeCl,
|
||||
rangeLcl: res.data.rangeCl,
|
||||
rangeUcl: res.data.rangeCl,
|
||||
standardDeviationWhole: res.data.standardDeviationWhole,
|
||||
usl: res.data.usl,
|
||||
max: res.data.max,
|
||||
min: res.data.min,
|
||||
})
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
res.data.shipmentRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
xAxisData.push(ele.batchNo + ele.groupNo)
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '均值极差图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: xAxisData,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'lsl',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.lsl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageUcl]
|
||||
},
|
||||
{
|
||||
name: 'UCL(图二)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeUcl]
|
||||
},
|
||||
{
|
||||
name: 'USL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.usl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.rangeCl]
|
||||
},
|
||||
{
|
||||
name: 'CL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageCl]
|
||||
},
|
||||
{
|
||||
name: 'LCL(图一)',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.averageLcl]
|
||||
},
|
||||
{
|
||||
name: 'SL',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: [res.data.sl]
|
||||
},
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
442
src/views/modules/shipment/controlDiagram.vue
Normal file
442
src/views/modules/shipment/controlDiagram.vue
Normal file
@@ -0,0 +1,442 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:28
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-input v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getOriginalData">{{ $t('code.originalData') }}}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane :label="$t('code.meanRange')" name="first">
|
||||
<mean-range ref="meanRange"></mean-range>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('code.meanStandard')" name="second">
|
||||
<mean-standard ref="meanStandard">
|
||||
</mean-standard>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label=" $t('code.medianRange')" name="third">
|
||||
<median-range ref="medianRange">
|
||||
</median-range>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('code.singleValueMovingRange')" name="fourth">
|
||||
<single-valueMovingRange ref="singleValueMovingRange">
|
||||
</single-valueMovingRange>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('code.meanMovingRangeRange')" name="fifth">
|
||||
<mean-MovingRangeRange ref="meanMovingRangeRange">
|
||||
</mean-MovingRangeRange>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('code.meanMovingRangeStandardDeviation')" name="sixth">
|
||||
<mean-movingRangeStandardDeviation ref="meanMovingRangeStandardDeviation">
|
||||
</mean-movingRangeStandardDeviation>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<base-table id="palletTable" :table-props="tableProps" :page="listQuery.page" ref="palletTable1"
|
||||
highlight-current-row :limit="listQuery.limit" :table-data="tableData">
|
||||
</base-table>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import meanRange from "./components/meanRange.vue"
|
||||
import meanStandard from "./components/meanStandard.vue"
|
||||
import medianRange from "./components/medianRange.vue"
|
||||
import singleValueMovingRange from "./components/singleValueMovingRange.vue"
|
||||
import meanMovingRangeRange from "./components/meanMovingRangeRange.vue"
|
||||
import meanMovingRangeStandardDeviation from "./components/meanMovingRangeStandardDeviation.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
const tableProps = [
|
||||
{
|
||||
prop: "orderNumber",
|
||||
label: i18n.t('code.inspectionNumber'),
|
||||
},
|
||||
{
|
||||
prop: "batchNo",
|
||||
label: i18n.t('code.batchNo'),
|
||||
},
|
||||
{
|
||||
prop: "locationNo",
|
||||
label: i18n.t('code.locationNo'),
|
||||
},
|
||||
{
|
||||
prop: "groupNo",
|
||||
label: i18n.t('code.groupNo'),
|
||||
},
|
||||
{
|
||||
prop: "meteringValue",
|
||||
label: i18n.t('code.assayValue'),
|
||||
},
|
||||
{
|
||||
prop: "createDate",
|
||||
label: i18n.t('code.parsingTime'),
|
||||
}
|
||||
];
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getXBarURL: '',
|
||||
getDataListURL: "/code/shipmentRegistration/mean/range/chart",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getOriginalDataURL: '/code/shipmentRegistration/raw/data',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
tableData:[],
|
||||
tableProps,
|
||||
factoryList: [],
|
||||
productList: [],
|
||||
meanRangeShow:false,
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
activeName:null,
|
||||
headers: [
|
||||
{
|
||||
prop: 'usl',
|
||||
label: 'USL',
|
||||
},
|
||||
{
|
||||
prop: 'sl',
|
||||
label: 'SL',
|
||||
},
|
||||
{
|
||||
prop: 'lsl',
|
||||
label: 'LSL',
|
||||
},
|
||||
{
|
||||
prop: 'rangeUcl',
|
||||
label: 'CL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'averageUcl',
|
||||
label: 'UCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'rangeLcl',
|
||||
label: 'LCL(图一)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationCl',
|
||||
label: 'CL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationLcl',
|
||||
label: 'LCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationUcl',
|
||||
label: 'UCL(图二)',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationGroup',
|
||||
label: '标准差',
|
||||
},
|
||||
{
|
||||
prop: 'cpk',
|
||||
label: 'cpk',
|
||||
},
|
||||
{
|
||||
prop: 'standardDeviationWhole',
|
||||
label: '总体标准差',
|
||||
},
|
||||
{
|
||||
prop: 'ppk',
|
||||
label: 'ppk',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'cp',
|
||||
label: 'cp',
|
||||
},
|
||||
{
|
||||
prop: 'ca',
|
||||
label: 'ca',
|
||||
},
|
||||
{
|
||||
prop: 'average',
|
||||
label: '均值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
{
|
||||
prop: 'max',
|
||||
label: '最大值',
|
||||
},
|
||||
],
|
||||
tableData: [],
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize: null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
meanRange,
|
||||
meanStandard,
|
||||
medianRange,
|
||||
singleValueMovingRange,
|
||||
meanMovingRangeRange,
|
||||
meanMovingRangeStandardDeviation
|
||||
},
|
||||
computed: {
|
||||
getHeaders() {
|
||||
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
|
||||
},
|
||||
getValues() {
|
||||
return this.headers.map(item => {
|
||||
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
handleClick(val) {
|
||||
if (this.activeName === 'first') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.meanRange.getData(this.listQuery)
|
||||
})
|
||||
} else if (this.activeName === 'second') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.meanStandard.getData(this.listQuery)
|
||||
})
|
||||
} else if (this.activeName === 'third') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.medianRange.getData(this.listQuery)
|
||||
})
|
||||
} else if (this.activeName === 'fourth') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.singleValueMovingRange.getData(this.listQuery)
|
||||
})
|
||||
} else if (this.activeName === 'fifth') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.meanMovingRangeRange.getData(this.listQuery)
|
||||
})
|
||||
} else if (this.activeName === 'sixth') {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.meanMovingRangeStandardDeviation.getData(this.listQuery)
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.characteristicsId = res.data.parameterName
|
||||
}
|
||||
})
|
||||
},
|
||||
getOriginalData() {
|
||||
this.$http.get(this.urlOptions.getOriginalDataURL, {
|
||||
params:this.listQuery
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
312
src/views/modules/shipment/paretoDiagram.vue
Normal file
312
src/views/modules/shipment/paretoDiagram.vue
Normal file
@@ -0,0 +1,312 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:48
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<!--
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-input v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/pareto/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList:[],
|
||||
listQuery: {
|
||||
characteristicsId:null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize:null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
// gerCharacteristics(val) {
|
||||
// this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
// params: {
|
||||
// productId:val
|
||||
// },
|
||||
// })
|
||||
// .then(({ data: res }) => {
|
||||
// if (res.code === 0) {
|
||||
// this.dataForm.characteristicsId = res.data.parameterName
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
getData() {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res)
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text:'帕累托图'
|
||||
},
|
||||
tooltip: {
|
||||
formatter: (params) => {
|
||||
// 打印确认params是对象还是数组
|
||||
console.log(params)
|
||||
// 对象：取鼠标悬浮当前项索引params.dataIndex
|
||||
// 数组：取鼠标悬浮当前项索引params[0].dataIndex
|
||||
let index = params.dataIndex
|
||||
let obj = res.data[index] // 通过索引取当前项完整的接口返回值
|
||||
let str = `缺陷数量:${obj.number}<br/>
|
||||
缺陷率${obj.defectRate}<br/>`
|
||||
return str
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
data: res.data.map(i => { return i.propertyName })
|
||||
},
|
||||
yAxis: [{
|
||||
type: 'value',
|
||||
name: '缺陷数量',
|
||||
show: true,
|
||||
interval: 10,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#5e859e',
|
||||
width: 2
|
||||
}
|
||||
}
|
||||
}],
|
||||
series: [{
|
||||
name: '缺陷率',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: res.data.map(i => { return i.defectRate })
|
||||
}, {
|
||||
name: '缺陷数量',
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
data: res.data.map(i => { return i.number })
|
||||
}]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
// this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
// this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
// this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
303
src/views/modules/shipment/scatterPlot.vue
Normal file
303
src/views/modules/shipment/scatterPlot.vue
Normal file
@@ -0,0 +1,303 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:55:57
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-input v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/phase/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList:[],
|
||||
listQuery: {
|
||||
characteristicsId:null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize:null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId:val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.characteristicsId = res.data.parameterName
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text:'散点图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: res.data.abscissaList,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [{
|
||||
name: '缺陷率',
|
||||
type: 'bar',
|
||||
barWidth: '50%',
|
||||
data: res.data.ordinateList
|
||||
}]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
298
src/views/modules/shipment/stageDiagram.vue
Normal file
298
src/views/modules/shipment/stageDiagram.vue
Normal file
@@ -0,0 +1,298 @@
|
||||
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:56:04
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-input v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/phase/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList:[],
|
||||
listQuery: {
|
||||
characteristicsId:null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize:null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId:val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.characteristicsId = res.data.parameterName
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text:'阶段图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: res.data.purchaseRegistrationCharacteristicsDTOList.length,
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
319
src/views/modules/shipment/trendChart.vue
Normal file
319
src/views/modules/shipment/trendChart.vue
Normal file
@@ -0,0 +1,319 @@
|
||||
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2023-01-11 09:24:58
|
||||
* @LastEditTime: 2023-06-20 15:56:14
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card shadow="never" class="aui-card--fill">
|
||||
<div class="mod-sys__user">
|
||||
<el-form :inline="true" :model="dataForm" class="demo-form-inline">
|
||||
<el-form-item :label="$t('code.inspectionTime')" prop="timeSlot">
|
||||
<el-date-picker v-model="dataForm.timeSlot" size="small" type="datetimerange" format='yyyy-MM-dd HH:mm:ss'
|
||||
@change="getFactory" valueFormat='yyyy-MM-ddTHH:mm:ss' :start-placeholder="$t('gage.startTime')"
|
||||
:end-placeholder="$t('gage.endTime')" :range-separator="$t('gage.to')" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.factoryName')">
|
||||
<el-select v-model="dataForm.factoryId" :placeholder="$t('code.factoryName')" @change="getInspectionType">
|
||||
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.productName')">
|
||||
<el-select v-model="dataForm.productId" :placeholder="$t('code.productName')" @change="gerCharacteristics">
|
||||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('code.inspectionType')">
|
||||
<el-select v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')">
|
||||
<el-option v-for="item in inspectionTypeList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('code.inspectionType')">
|
||||
<el-input v-model="dataForm.inspectionType" :placeholder="$t('code.inspectionType')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.characteristics')">
|
||||
<el-select v-model="dataForm.characteristicsId" :placeholder="$t('code.characteristics')">
|
||||
<el-option v-for="item in characteristicsList" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('code.sampleSize')">
|
||||
<el-input v-model="dataForm.sampleSize" :placeholder="$t('code.sampleSize')"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getData">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="priceMain" :style="{ width: '100%', height: '500px' }" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import available from "./components/gageAvailable.vue"
|
||||
import i18n from "@/i18n"
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
myChart: null,
|
||||
urlOptions: {
|
||||
getDataListURL: "/code/shipmentRegistration/transition/diagram",
|
||||
getFactoryURL: '/code/shipmentRegistration/query/factory',
|
||||
getProductURL: '/code/shipmentRegistration/query/product',
|
||||
getInspectionTypeURL: '/code/shipmentRegistration/query/inspection/type',
|
||||
getPurchaseRegistrationTypeURL: '/code/shipmentRegistration/query/checkout/project',
|
||||
},
|
||||
factoryList: [],
|
||||
productList: [],
|
||||
characteristicsList:[],
|
||||
listQuery: {
|
||||
characteristicsId: null,
|
||||
factoryId: null,
|
||||
inspectionType: null,
|
||||
productId: null,
|
||||
sampleSize: null,
|
||||
endTime: null,
|
||||
startTime: null,
|
||||
},
|
||||
dataForm: {
|
||||
productId: null,
|
||||
timeSlot: [],
|
||||
factoryId: null,
|
||||
characteristicsId: null,
|
||||
inspectionType: null,
|
||||
sampleSize: null
|
||||
},
|
||||
selectOptions: [{
|
||||
id: 0,
|
||||
name: '监控'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: '电芯来料检验'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
lname: 'IQC抽检'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'IQC抽检2'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '原料抽检'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '进货外观检验'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '库内原料检验'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '来料检验'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '胶片'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '抽检'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
name: '巡检'
|
||||
}, {
|
||||
id: 11,
|
||||
name: '首检'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: '末检'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: '实时监测'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
name: 'FQC抽检'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
name: 'OQC抽检'
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
// components: {
|
||||
// AddOrUpdate,
|
||||
// },
|
||||
mounted() {
|
||||
this.getData()
|
||||
// this.getDict()
|
||||
},
|
||||
methods: {
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
alert(JSON.stringify(val))
|
||||
},
|
||||
getFactory(val) {
|
||||
console.log(val)
|
||||
this.$http.get(this.urlOptions.getFactoryURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.factoryList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.factoryId,
|
||||
name: item.factoryName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$http.get(this.urlOptions.getProductURL, {
|
||||
params: {
|
||||
startTime: val[0],
|
||||
endTime: val[1]
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.productList = res.data.map((item) => {
|
||||
return {
|
||||
id: item.productId,
|
||||
name: item.productName
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getInspectionType(val) {
|
||||
this.$http.get(this.urlOptions.getInspectionTypeURL, {
|
||||
params: {
|
||||
startTime: this.dataForm.timeSlot[0],
|
||||
endTime: this.dataForm.timeSlot[1],
|
||||
factoryId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.dataForm.inspectionType = res.data.inspectionType
|
||||
}
|
||||
})
|
||||
},
|
||||
gerCharacteristics(val) {
|
||||
this.$http.get(this.urlOptions.getPurchaseRegistrationTypeURL, {
|
||||
params: {
|
||||
productId: val
|
||||
},
|
||||
})
|
||||
.then(({ data: res }) => {
|
||||
if (res.code === 0) {
|
||||
this.characteristicsList[0].id = res.data.id
|
||||
this.characteristicsList[0].name = res.data.parameterName
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
getData() {
|
||||
this.$http
|
||||
.post(this.urlOptions.getDataListURL, {
|
||||
params: this.listQuery
|
||||
}
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res)
|
||||
let xAxisData = []
|
||||
let yAxisData = []
|
||||
res.data.purchaseRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
xAxisData.push(ele.batchNo + ele.groupNo)
|
||||
})
|
||||
res.data.purchaseRegistrationCharacteristicsDTOList.forEach(ele => {
|
||||
yAxisData.push(ele.countValue)
|
||||
})
|
||||
var chartDom = document.getElementById('priceMain');
|
||||
var myChart = echarts.init(chartDom)
|
||||
this.myChart = myChart
|
||||
var option;
|
||||
// myChart.on('click', function (params) {
|
||||
// console.log(params);
|
||||
// });
|
||||
myChart.on('click', 'xAxis.category', function (params) {
|
||||
console.log(params);
|
||||
});
|
||||
option = {
|
||||
title: {
|
||||
text: '推移图'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ['推移图']
|
||||
// },
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
data: res.data.map(i => { return i.batchNo + i.groupNo }),
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
clickable: true
|
||||
},
|
||||
silent: false,
|
||||
triggerEvent: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '计数型值',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: res.data.map(i => { return i.countValue })
|
||||
}
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
})
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case "search":
|
||||
this.dataForm.sampleSize = val.sampleSize ? val.sampleSize : null
|
||||
this.dataForm.inspectionType = val.inspectionType ? val.inspectionType : null
|
||||
this.dataForm.characteristicsId = val.characteristicsId ? val.characteristicsId : null
|
||||
this.dataForm.factoryId = val.factoryId ? val.factoryId : null
|
||||
this.dataForm.productId = val.productId ? val.productId : null
|
||||
this.dataForm.startTime = val.timeSlot ? val.timeSlot[0] : null
|
||||
this.dataForm.endTime = val.timeSlot ? val.timeSlot[1] : null
|
||||
this.getData()
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(val)
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user