Merge branch 'master' of http://175.27.215.92:3000/yinq/aucma-mes-ui
yinq
5 months ago
commit
6c240afefb
@ -0,0 +1,274 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :inline="true" :model="form" ref="form">
|
||||
<el-form-item label="年度" prop="year">
|
||||
<el-date-picker
|
||||
v-model="form.year"
|
||||
type="year"
|
||||
format="yyyy"
|
||||
value-format="yyyy"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="产线" prop="productionLine">
|
||||
<el-select v-model="form.productionLine" placeholder="选择产线">
|
||||
<el-option :label="i.label" :value="i.value" v-for="i in option"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
<el-button @click="resetForm('form')">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="date"
|
||||
label="工序"
|
||||
width="150">
|
||||
</el-table-column>
|
||||
<el-table-column :label="i.label" v-for="i in tableHead">
|
||||
<el-table-column
|
||||
v-for="item in i"
|
||||
:prop="item.value"
|
||||
:label="item.label"
|
||||
width="120">
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {findProductLineList} from '@//api/base/productLine'
|
||||
import {parseTime} from '@//utils/ruoyi'
|
||||
import {
|
||||
boxTraceabilityDetailReport,
|
||||
boxTraceabilityReport,
|
||||
} from '@//api/report/reportAPI'
|
||||
|
||||
export default {
|
||||
name: 'ProductOffLine',
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-02',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-04',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-08',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-06',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}, {
|
||||
date: '2016-05-07',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
city: '普陀区',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
zip: 200333
|
||||
}],
|
||||
form: {},
|
||||
option: [
|
||||
{
|
||||
value: '11',
|
||||
label: '一号线'
|
||||
},
|
||||
{
|
||||
value: '22',
|
||||
label: '二号线'
|
||||
},
|
||||
],
|
||||
tableHead:[
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'今年1月',
|
||||
children:[
|
||||
{
|
||||
label:'不良数',
|
||||
value:'column1_1',
|
||||
},
|
||||
{
|
||||
label:'总产量',
|
||||
value:'column1_2',
|
||||
},
|
||||
{
|
||||
label:'不良率',
|
||||
value:'column1_3',
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
onSubmit(){
|
||||
console.log(this.form)
|
||||
},
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/deep/ .el-table .cell{
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :inline="true" :model="form" ref="form">
|
||||
<el-form-item label="工厂" prop="factory">
|
||||
<el-select v-model="form.factory" placeholder="选择工厂">
|
||||
<el-option :label="i.label" :value="i.value" v-for="i in option"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="产线" prop="productionLine">
|
||||
<el-select v-model="form.productionLine" placeholder="选择产线">
|
||||
<el-option :label="i.label" :value="i.value" v-for="i in option1"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="下线时间" prop="date">
|
||||
<el-date-picker
|
||||
v-model="form.date"
|
||||
type="daterange"
|
||||
format="yyyy-mm-dd"
|
||||
value-format="yyyy-mm-dd"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList">查询</el-button>
|
||||
<el-button @click="resetForm('form')">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
type="index"
|
||||
label="序号"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="type"
|
||||
label="产品型号">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="num"
|
||||
label="问题数量">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="form.pageNum"
|
||||
:limit.sync="form.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<h3 style="font-weight: 600">高故障Top20柱状图</h3>
|
||||
<div style="width: 100%;height: 30vw">
|
||||
<Chart ref="chart1"></Chart>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from "@/components/board/Chart";
|
||||
|
||||
export default {
|
||||
name: 'ProductOffLine',
|
||||
components:{
|
||||
Chart,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total:100,
|
||||
form: {
|
||||
pageNum:1,
|
||||
pageSize:10
|
||||
},
|
||||
option: [
|
||||
{
|
||||
value: '11',
|
||||
label: '工厂一'
|
||||
},
|
||||
{
|
||||
value: '22',
|
||||
label: '工厂二'
|
||||
},
|
||||
],
|
||||
option1: [
|
||||
{
|
||||
value: '11',
|
||||
label: '产线一'
|
||||
},
|
||||
{
|
||||
value: '22',
|
||||
label: '产线二'
|
||||
},
|
||||
],
|
||||
tableData: [
|
||||
{
|
||||
type:'1',
|
||||
num:1,
|
||||
},
|
||||
{
|
||||
type:'1',
|
||||
num:1,
|
||||
},
|
||||
{
|
||||
type:'1',
|
||||
num:1,
|
||||
},
|
||||
{
|
||||
type:'1',
|
||||
num:1,
|
||||
},
|
||||
{
|
||||
type:'1',
|
||||
num:1,
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$refs.chart1.setData({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'value',
|
||||
position:'top',
|
||||
boundaryGap: [0, 0.01]
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: ['Brazil', 'Indonesia', 'USA', 'India', 'China', 'World']
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '数量',
|
||||
type: 'bar',
|
||||
data: [18203, 23489, 29034, 104970, 131744, 630230]
|
||||
},
|
||||
]
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getList(){
|
||||
console.log(this.form)
|
||||
},
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/deep/ .el-table .cell{
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,282 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :inline="true" :model="form" ref="form">
|
||||
<el-form-item label="年份" prop="year">
|
||||
<el-date-picker
|
||||
v-model="form.year"
|
||||
type="year"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="周期" prop="period">
|
||||
<el-select v-model="form.period" placeholder="选择周期">
|
||||
<el-option :label="i.label" :value="i.value" v-for="i in option"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList">查询</el-button>
|
||||
<el-button @click="resetForm('form')">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="type"
|
||||
label="工序"
|
||||
width="150">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="i in tableHead"
|
||||
:prop="i.value"
|
||||
:label="i.label"
|
||||
width="120">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="form.pageNum"
|
||||
:limit.sync="form.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<h3 style="font-weight: 600">焊漏率折线图</h3>
|
||||
<div style="width: 100%;height: 30vw">
|
||||
<Chart ref="chart1"></Chart>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from "@/components/board/Chart";
|
||||
|
||||
export default {
|
||||
name: 'ProductOffLine',
|
||||
components: {
|
||||
Chart,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 100,
|
||||
form: {
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
option: [
|
||||
{
|
||||
value: '11',
|
||||
label: '日'
|
||||
},
|
||||
{
|
||||
value: '22',
|
||||
label: '月'
|
||||
},
|
||||
{
|
||||
value: '33',
|
||||
label: '年'
|
||||
},
|
||||
],
|
||||
tableData: [
|
||||
{
|
||||
type: '1',
|
||||
column1: 1,
|
||||
},
|
||||
{
|
||||
type: '1',
|
||||
column1: 1,
|
||||
},
|
||||
{
|
||||
type: '1',
|
||||
column1: 1,
|
||||
},
|
||||
{
|
||||
type: '1',
|
||||
column1: 1,
|
||||
},
|
||||
{
|
||||
type: '1',
|
||||
column1: 1,
|
||||
},
|
||||
],
|
||||
|
||||
tableHead: [
|
||||
{
|
||||
label: '第1周',
|
||||
value: 'column1',
|
||||
},
|
||||
{
|
||||
label: '第2周',
|
||||
value: 'column1',
|
||||
},
|
||||
{
|
||||
label: '第3周',
|
||||
value: 'column1',
|
||||
},
|
||||
{
|
||||
label: '第4周',
|
||||
value: 'column1',
|
||||
},
|
||||
{
|
||||
label: '第5周',
|
||||
value: 'column1',
|
||||
},
|
||||
{
|
||||
label: '第6周',
|
||||
value: 'column1',
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
,
|
||||
mounted() {
|
||||
this.$refs.chart1.setData({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
},
|
||||
legend: {},
|
||||
grid: {
|
||||
top: "middle",
|
||||
left: "3%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
height: "80%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: [100, 200, 20, 30, 60, 89],
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#999",
|
||||
},
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#DDD",
|
||||
},
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
color: "#333",
|
||||
},
|
||||
},
|
||||
nameTextStyle: {
|
||||
color: "#999",
|
||||
},
|
||||
splitArea: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "冰箱A线",
|
||||
type: "line",
|
||||
data: [800, 900, 220, 130, 660, 289],
|
||||
color: "#F58080",
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2,
|
||||
color: {
|
||||
type: "linear",
|
||||
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#FFCAD4", // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 0.4,
|
||||
color: "#F58080", // 100% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#F58080", // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
globalCoord: false, // 缺省为 false
|
||||
},
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#F58080",
|
||||
borderWidth: 10,
|
||||
/*shadowColor: 'rgba(72,216,191, 0.3)',
|
||||
shadowBlur: 100,*/
|
||||
borderColor: "#F58080",
|
||||
},
|
||||
},
|
||||
smooth: true,
|
||||
},
|
||||
{
|
||||
name: "冰箱B线",
|
||||
type: "line",
|
||||
data: [123, 568, 111, 222, 123, 56],
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2,
|
||||
color: {
|
||||
type: "linear",
|
||||
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#AAF487", // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 0.4,
|
||||
color: "#47D8BE", // 100% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#47D8BE", // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
globalCoord: false, // 缺省为 false
|
||||
},
|
||||
shadowColor: "rgba(71,216,190, 0.5)",
|
||||
shadowBlur: 10,
|
||||
shadowOffsetY: 7,
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#AAF487",
|
||||
borderWidth: 10,
|
||||
/*shadowColor: 'rgba(72,216,191, 0.3)',
|
||||
shadowBlur: 100,*/
|
||||
borderColor: "#AAF487",
|
||||
},
|
||||
},
|
||||
smooth: true,
|
||||
},
|
||||
],
|
||||
})
|
||||
}
|
||||
,
|
||||
methods: {
|
||||
getList() {
|
||||
console.log(this.form)
|
||||
}
|
||||
,
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/deep/ .el-table .cell {
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue