yinq
/
aucma-mes-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改接口

Browse Source
master
夜笙歌 11 months ago
parent 2279f6014a
commit e63956dfd8
11 changed files with 351 additions and 375 deletions
Show Stats Download Patch File Download Diff File

2
src/api/board/mixData.js
Unescape Escape View File

@ -11,7 +11,7 @@ export function mixData(params) {
method: params?.i || ''
}).then(val2 => {
(params?.f || (() => {
}))(val2)
}))(val2?.data || [])
})
}
})

10
src/api/index.js
Unescape Escape View File

@ -0,0 +1,10 @@
import request from '@/utils/request'
// 登录方法
export function getData(data) {
return request({
url: '/boardReport/homePageInterface',
method: 'post',
data: data
})
}

13
src/views/board/liner/index.vue
Unescape Escape View File

@ -279,6 +279,7 @@ export default {
e: 'nd-07',
i: "SCADA_INV_STATS_01('')",
f: (e) => {
console.log(e)
this.$refs.chart2.setData({
tooltip: {
trigger: "axis",
@ -295,7 +296,7 @@ export default {
containLabel: true,
},
legend: {
data: e.y.map(val => val.name),
data:['内胆','箱壳'],
right: 'center',
top: 0,
textStyle: {
@ -307,7 +308,7 @@ export default {
},
xAxis: {
type: "category",
data: e.x,
data: e.map(val=>val.X_VALUE),
axisLine: {
lineStyle: {
color: "white",
@ -337,7 +338,7 @@ export default {
},
series: [
{
name: e.y[0].name,
name: '内胆',
type: "bar",
barWidth: "30%",
barMaxWidth: 50,
@ -367,10 +368,10 @@ export default {
]),
},
},
data: e.y[0].data,
data: e.map(val=>val.Y_VALUE_ONE),
},
{
name: e.y[1].name,
name: '箱壳',
type: "bar",
barWidth: "30%",
barMaxWidth: 50,
@ -400,7 +401,7 @@ export default {
]),
},
},
data: e.y[1].data,
data: e.map(val=>val.Y_VALUE_TWO),
},
],
})

135
src/views/dashboard/LineChart.vue
Unescape Escape View File

@ -32,6 +32,7 @@ export default {
type: Object,
required: true
}
},
data() {
return {
@ -61,139 +62,9 @@ export default {
methods: {
initChart() {
this.chart = echarts.init(this.$el, 'macarons')
this.setOptions(this.chartData)
},
setOptions({expectedData, actualData,expedData} = {}) {
const week = () =>{
let today = new Date();
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
let dayOfWeek = firstDayOfYear.getDay();
let spendDay = 1;
if (dayOfWeek != 0) {
spendDay = 7 - dayOfWeek + 1;
}
firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
return Math.ceil((d / 7) + 1)
}
this.chart.setOption({
title: {
text: `第${week()}周产量`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
top: '0%',
left: '0%',
},
xAxis: {
data: ['2023-12-11', '2023-12-12', '2023-12-13', '2023-12-14', '2023-12-15', '2023-12-16', '2023-12-17'],
// boundaryGap: false,
axisTick: {
show: false
}
},
grid: {
left: 10,
right: 10,
bottom: 20,
top: 50,
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
},
padding: [5, 10]
},
yAxis: [
{
axisTick: {
show: false
}
},
{
axisTick: {
show: false
},
axisLabel:{
formatter:'{value}%'
}
}
],
legend: {
data: ['expected', 'actual']
},
series: [
{
name: '订单履约率',
type: 'line',
yAxisIndex:1,
itemStyle: {
normal: {
color: '#3888fa',
lineStyle: {
color: '#3888fa',
width: 2
},
// areaStyle: {
// color: '#f3f8ff'
// }
}
},
label: {
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.75 * vw,
},
},
},
data: expectedData,
animationDuration: 1000,
animationEasing: 'quadraticOut'
},
{
name: '产量',
smooth: false,
type: 'bar',
barMaxWidth:60,
label: {
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.75 * vw,
},
},
},
itemStyle: {
normal: {
color: '#9fe080',
lineStyle: {
color: '#9fe080',
width: 2
},
areaStyle: {
color: '#f3f8ff'
}
}
},
data: expedData,
animationDuration: 1000,
animationEasing: 'quadraticOut'
}
]
})
setOptions(val) {
this.chart.setOption(val)
}
}
}

82
src/views/dashboard/LineChart1.vue
Unescape Escape View File

@ -59,87 +59,9 @@ export default {
methods: {
initChart() {
this.chart = echarts.init(this.$el, 'macarons')
this.setOptions(this.chartData)
},
setOptions({ expectedData, actualData } = {}) {
const week = () =>{
let today = new Date();
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
let dayOfWeek = firstDayOfYear.getDay();
let spendDay = 1;
if (dayOfWeek != 0) {
spendDay = 7 - dayOfWeek + 1;
}
firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
return Math.ceil((d / 7) + 1)
}
this.chart.setOption({
title: {
text: `第${week()}周清单率`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
top: '0%',
left: '0%',
},
xAxis: {
data: ['2023-12-11', '2023-12-12', '2023-12-13', '2023-12-14', '2023-12-15', '2023-12-16', '2023-12-17'],
boundaryGap: false,
axisTick: {
show: false
}
},
grid: {
left: 10,
right: 10,
bottom: 20,
top: 50,
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
},
padding: [5, 10]
},
yAxis: {
axisTick: {
show: false
},
axisLabel:{
formatter:'{value}%'
}
},
legend: {
data: ['expected', 'actual']
},
series: [
{
name: '清单率',
smooth: false,
type: 'line',
itemStyle: {
normal: {
color: '#3888fa',
lineStyle: {
color: '#3888fa',
width: 2
},
areaStyle: {
color: '#f3f8ff'
}
}
},
data: actualData,
animationDuration: 2800,
animationEasing: 'quadraticOut'
}]
})
setOptions(val) {
this.chart.setOption(val)
}
}
}

49
src/views/dashboard/PanelGroup.vue
Unescape Escape View File

@ -1,54 +1,54 @@
<template>
<el-row :gutter="40" class="panel-group">
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('newVisitis')">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-people">
<svg-icon icon-class="list" class-name="card-panel-icon" />
<svg-icon icon-class="list" class-name="card-panel-icon"/>
</div>
<div class="card-panel-description">
<div class="card-panel-text">
计划工单数量
</div>
<count-to :start-val="0" :end-val="25" :duration="10" class="card-panel-num" />
<count-to :start-val="0" :end-val="topData.value1" :duration="3000" class="card-panel-num"/>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('messages')">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-message">
<svg-icon icon-class="time" class-name="card-panel-icon" />
<svg-icon icon-class="time" class-name="card-panel-icon"/>
</div>
<div class="card-panel-description">
<div class="card-panel-text">
在制工单数量
</div>
<count-to :start-val="0" :end-val="12" :duration="2" class="card-panel-num" />
<count-to :start-val="0" :end-val="topData.value2" :duration="3000" class="card-panel-num"/>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('purchases')">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-money">
<svg-icon icon-class="chart" class-name="card-panel-icon" />
<svg-icon icon-class="chart" class-name="card-panel-icon"/>
</div>
<div class="card-panel-description">
<div class="card-panel-text">
今日计划产量
</div>
<count-to :start-val="0" :end-val="3500" :duration="3500" class="card-panel-num" />
<count-to :start-val="0" :end-val="topData.value3" :duration="3000" class="card-panel-num"/>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel" @click="handleSetLineChartData('shoppings')">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-shopping">
<svg-icon icon-class="checkbox" class-name="card-panel-icon" />
<svg-icon icon-class="checkbox" class-name="card-panel-icon"/>
</div>
<div class="card-panel-description">
<div class="card-panel-text">
今日完成产量
</div>
<count-to :start-val="0" :end-val="1500" :duration="1500" class="card-panel-num" />
<count-to :start-val="0" :end-val="topData.value4" :duration="3000" class="card-panel-num"/>
</div>
</div>
</el-col>
@ -57,16 +57,33 @@
<script>
import CountTo from 'vue-count-to'
import {getData} from "@/api";
export default {
components: {
CountTo
},
methods: {
handleSetLineChartData(type) {
// this.$emit('handleSetLineChartData', type)
props: {
topData: {
type: Object,
default: {}
}
},
data() {
return {
topData: this.topData
// {
// value1: 0,
// value2: 0,
// value3: 0,
// value4: 0,
// }
}
},
mounted() {
console.log(this.topData)
},
}
</script>
@ -160,7 +177,7 @@ export default {
}
}
@media (max-width:550px) {
@media (max-width: 550px) {
.card-panel-description {
display: none;
}

70
src/views/dashboard/PieChart.vue
Unescape Escape View File

@ -21,6 +21,14 @@ export default {
height: {
type: String,
default: '350px'
},
autoResize: {
type: Boolean,
default: true
},
chartData: {
type: Object,
required: true
}
},
data() {
@ -28,6 +36,14 @@ export default {
chart: null
}
},
watch: {
chartData: {
deep: true,
handler(val) {
this.setOptions(val)
}
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
@ -43,58 +59,10 @@ export default {
methods: {
initChart() {
this.chart = echarts.init(this.$el, 'macarons')
const week = () =>{
let today = new Date();
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
let dayOfWeek = firstDayOfYear.getDay();
let spendDay = 1;
if (dayOfWeek != 0) {
spendDay = 7 - dayOfWeek + 1;
}
firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
return Math.ceil((d / 7) + 1)
}
this.chart.setOption({
title: {
text: `第${week()}周质量缺陷分布`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
top: '0%',
left: '0%',
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
left: 'center',
bottom: '10',
data: ['Industries', 'Technology', 'Forex', 'Gold', 'Forecasts']
},
series: [
{
name: 'WEEKLY WRITE ARTICLES',
type: 'pie',
roseType: 'radius',
radius: [15, 95],
center: ['50%', '46%'],
data: [
{ value: 320, name: 'Industries' },
{ value: 240, name: 'Technology' },
{ value: 149, name: 'Forex' },
{ value: 100, name: 'Gold' },
{ value: 59, name: 'Forecasts' }
],
animationEasing: 'cubicInOut',
animationDuration: 2600
}
]
})
setOptions(val) {
console.log(val)
this.chart.setOption(val)
}
}
}

337
src/views/index_v1.vue
Unescape Escape View File

@ -1,7 +1,7 @@
<template>
<div class="dashboard-editor-container">
<panel-group @handleSetLineChartData="handleSetLineChartData"/>
<panel-group :topData="topData"/>
<el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
<el-table
@ -10,46 +10,42 @@
cell-style="text-align:center"
style="width: 100%">
<el-table-column
prop="no"
prop="ROWSEQ"
label="序号"
width="50">
width="80">
</el-table-column>
<el-table-column
prop="plant"
prop="FACTORY_CODE"
label="工厂"
width="80">
</el-table-column>
<el-table-column
prop="productionLine"
label="产线">
</el-table-column>
<el-table-column
prop="workOrderNumber"
label="SAP计划编号">
prop="ORDER_CODE"
label="订单编号">
</el-table-column>
<el-table-column
prop="SalesOrderNumber"
label="销售单号">
prop="MATERIAL_NAME"
label="物料名称">
</el-table-column>
<el-table-column
prop="productCode"
label="产品编码">
prop="MATERIAL_CODE"
label="物料编号">
</el-table-column>
<el-table-column
prop="productName"
label="产品名称">
prop="ORDER_AMOUNT"
label="计划数">
</el-table-column>
<el-table-column
prop="scheduledProduction"
label="计划产量">
prop="COMPLETE_AMOUNT"
label="完成数">
</el-table-column>
<el-table-column
prop="FinishedOutput"
label="完成产量">
prop="RATE"
label="完成率">
</el-table-column>
<el-table-column
prop="percentageComplete"
label="完成率">
prop="PLAN_DATE"
label="计划日期">
</el-table-column>
</el-table>
</el-row>
@ -61,12 +57,12 @@
<el-row :gutter="32">
<el-col :xs="24" :sm="24" :lg="16">
<div class="chart-wrapper">
<LineChart1 :chart-data="lineChartData"/>
<LineChart1 :chart-data="lineChartData1"/>
</div>
</el-col>
<el-col :xs="24" :sm="24" :lg="8">
<div class="chart-wrapper">
<pie-chart/>
<pie-chart :chart-data="pieChartData"/>
</div>
</el-col>
</el-row>
@ -82,28 +78,21 @@ import LineChart1 from './dashboard/LineChart1'
import RaddarChart from './dashboard/RaddarChart'
import PieChart from './dashboard/PieChart'
import BarChart from './dashboard/BarChart'
import {getData} from '@/api/index'
const lineChartData = {
newVisitis: {
expectedData: [99, 98, 95, 93, 96, 93, 97],
actualData: [99, 98, 95, 93, 96, 93, 97],
expedData: [200, 192, 120, 144, 160, 130, 140]
},
messages: {
expectedData: [200, 192, 120, 144, 160, 130, 140],
actualData: [180, 160, 151, 106, 145, 150, 130],
expedData: [200, 192, 120, 144, 160, 130, 140]
},
purchases: {
expectedData: [80, 100, 121, 104, 105, 90, 100],
actualData: [120, 90, 100, 138, 142, 130, 130],
expedData: [200, 192, 120, 144, 160, 130, 140]
},
shoppings: {
expectedData: [130, 140, 141, 142, 145, 150, 160],
actualData: [120, 82, 91, 154, 162, 140, 130],
expedData: [200, 192, 120, 144, 160, 130, 140]
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
const week = () => {
let today = new Date();
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
let dayOfWeek = firstDayOfYear.getDay();
let spendDay = 1;
if (dayOfWeek != 0) {
spendDay = 7 - dayOfWeek + 1;
}
firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
return Math.ceil((d / 7) + 1)
}
export default {
@ -118,52 +107,242 @@ export default {
},
data() {
return {
lineChartData: lineChartData.newVisitis,
tableData: [
topData: {},
lineChartData: {},
lineChartData1: {},
pieChartData: {},
tableData: []
}
},
mounted() {
getData({}).then(e => {
let data = e.data
this.topData = {
value1: data.planOrderSum,
value2: data.prodOrderSum,
value3: data.planProductSum,
value4: data.compProductSum,
}
this.tableData = data.todayOrderList
this.lineChartData = {
legend: {},
title: {
text: `第${week()}周产量`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
top: '0%',
left: '0%',
},
xAxis: {
data: data.columnarList.map(val => val.BEGIN_DATE),
// boundaryGap: false,
axisTick: {
show: false
}
},
grid: {
left: 10,
right: 10,
bottom: 20,
top: 50,
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
},
padding: [5, 10]
},
yAxis: [
{
no: '1',
plant: '1301',
productionLine: '新产线',
workOrderNumber: '11236564',
productName: 'SC-187,C,特需',
productCode: '9002005735',
SalesOrderNumber: '0000055258',
scheduledProduction: '100',
FinishedOutput: '0',
percentageComplete: '0%'
axisTick: {
show: false
}
},
{
no: '2',
plant: '1301',
productionLine: '新产线',
workOrderNumber: '11236570',
productName: 'SC-281C,C,特需',
productCode: '9002007012',
SalesOrderNumber: '0000055621',
scheduledProduction: '150',
FinishedOutput: '149',
percentageComplete: '99.33%'
axisTick: {
show: false
},
axisLabel: {
formatter: '{value}%'
}
}
],
series: [
{
no: '3',
plant: '1301',
productionLine: '新产线',
workOrderNumber: '11234730',
productName: 'SC-500Y,YZ怡宝24YP,C',
productCode: '9002006928',
SalesOrderNumber: '0000055537',
scheduledProduction: '400',
FinishedOutput: '399',
percentageComplete: '99.75%'
name: '订单履约率',
type: 'line',
yAxisIndex: 1,
itemStyle: {
normal: {
color: '#3888fa',
lineStyle: {
color: '#3888fa',
width: 2
},
// areaStyle: {
// color: '#f3f8ff'
// }
}
},
label: {
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.75 * vw,
},
},
},
data: data.columnarList.map(val => val.RATE),
animationDuration: 1000,
animationEasing: 'quadraticOut'
},
{
name: '产量',
smooth: false,
type: 'bar',
barMaxWidth: 60,
label: {
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.75 * vw,
},
},
},
itemStyle: {
normal: {
color: '#9fe080',
lineStyle: {
color: '#9fe080',
width: 2
},
areaStyle: {
color: '#f3f8ff'
}
}
},
data: data.columnarList.map(val => val.COMPLETE_AMOUNT),
animationDuration: 1000,
animationEasing: 'quadraticOut'
}
]
}
this.lineChartData1 = {
title: {
text: `第${week()}周清单率`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
methods: {
handleSetLineChartData(type) {
this.lineChartData = lineChartData[type]
top: '0%',
left: '0%',
},
xAxis: {
data: data.lineList.map(val => val.BEGIN_DATE),
boundaryGap: false,
axisTick: {
show: false
}
},
grid: {
left: 10,
right: 10,
bottom: 20,
top: 50,
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
},
padding: [5, 10]
},
yAxis: {
axisTick: {
show: false
},
axisLabel: {
formatter: '{value}%'
}
},
legend: {},
series: [
{
name: '清单率',
smooth: false,
type: 'line',
itemStyle: {
normal: {
color: '#3888fa',
lineStyle: {
color: '#3888fa',
width: 2
},
areaStyle: {
color: '#f3f8ff'
}
}
},
data: data.lineList.map(val => val.COMPLETE_AMOUNT),
animationDuration: 2800,
animationEasing: 'quadraticOut'
}]
}
this.pieChartData = {
title: {
text: `第${week()}周质量缺陷分布`,
textStyle: {
align: 'center',
color: '#000',
fontSize: 20,
},
top: '0%',
left: '0%',
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
left: 'center',
bottom: '10',
},
series: [
{
type: 'pie',
roseType: 'radius',
radius: [15, 95],
center: ['50%', '46%'],
data: data.pieList.map(val => {
return {
value: val.SUM,
name: val.QUALITY_DEFECT_NAME
}
}),
animationEasing: 'cubicInOut',
animationDuration: 2600
}
]
}
})
},
methods: {}
}
</script>

1
src/views/model/companyIntroduction.vue
Unescape Escape View File

@ -85,6 +85,7 @@ export default {
color: #0d2765;
font-size: 1.8vw;
font-weight: bold;
line-height: 3vw;
p{
text-indent: 2em;

2
src/views/model/dataCentre.vue
Unescape Escape View File

@ -88,7 +88,7 @@ export default {
value: Math.random() * 200
}],
title: [
'三日订单执行情况',
'三日清单',
'产品发布',
'场景升级',
'重点工序监控',

7
vue.config.js
Unescape Escape View File

@ -43,6 +43,13 @@ module.exports = {
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
},
'/3DBoard': {
target: `http://192.168.153.1:9999`,
changeOrigin: true,
pathRewrite: {
['^' + '/3DBoard']: ''
}
}
},
disableHostCheck: true

Write Preview
Loading…
Cancel
Save