update - 首页

master
yinq 12 months ago
parent 26f99d8c0a
commit fae47815c7

@ -62,7 +62,7 @@ export default {
this.chart = echarts.init(this.$el, 'macarons')
this.setOptions(this.chartData)
},
setOptions({expectedData, actualData} = {}) {
setOptions({expectedData, actualData,expedData} = {}) {
const week = () =>{
let today = new Date();
let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
@ -77,7 +77,7 @@ export default {
}
this.chart.setOption({
title: {
text: `${week()}`,
text: `${week()}产量`,
textStyle: {
align: 'center',
color: '#000',
@ -87,7 +87,7 @@ export default {
left: '0%',
},
xAxis: {
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
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
@ -124,7 +124,7 @@ export default {
},
series: [
{
name: 'actual1',
name: '订单违约率',
type: 'bar',
yAxisIndex:1,
itemStyle: {
@ -144,7 +144,7 @@ export default {
animationEasing: 'quadraticOut'
},
{
name: 'actual',
name: '产量',
smooth: false,
type: 'line',
itemStyle: {
@ -159,7 +159,7 @@ export default {
}
}
},
data: actualData,
data: expedData,
animationDuration: 1000,
animationEasing: 'quadraticOut'
}

@ -76,7 +76,7 @@ export default {
}
this.chart.setOption({
title: {
text: `${week()}`,
text: `${week()}清单率`,
textStyle: {
align: 'center',
color: '#000',
@ -86,7 +86,7 @@ export default {
left: '0%',
},
xAxis: {
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
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
@ -117,7 +117,7 @@ export default {
series: [
{
name: 'actual',
name: '清单率',
smooth: false,
type: 'line',
itemStyle: {

@ -9,7 +9,7 @@
<div class="card-panel-text">
计划工单数量
</div>
<count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" />
<count-to :start-val="0" :end-val="25" :duration="10" class="card-panel-num" />
</div>
</div>
</el-col>
@ -22,7 +22,7 @@
<div class="card-panel-text">
在制工单数量
</div>
<count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" />
<count-to :start-val="0" :end-val="12" :duration="2" class="card-panel-num" />
</div>
</div>
</el-col>
@ -35,7 +35,7 @@
<div class="card-panel-text">
今日计划产量
</div>
<count-to :start-val="0" :end-val="9280" :duration="3200" class="card-panel-num" />
<count-to :start-val="0" :end-val="3500" :duration="3500" class="card-panel-num" />
</div>
</div>
</el-col>
@ -48,7 +48,7 @@
<div class="card-panel-text">
今日完成产量
</div>
<count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" />
<count-to :start-val="0" :end-val="1500" :duration="1500" class="card-panel-num" />
</div>
</div>
</el-col>
@ -64,7 +64,7 @@ export default {
},
methods: {
handleSetLineChartData(type) {
this.$emit('handleSetLineChartData', type)
// this.$emit('handleSetLineChartData', type)
}
}
}

@ -58,7 +58,7 @@ export default {
}
this.chart.setOption({
title: {
text: `${week()}`,
text: `${week()}质量缺陷分布`,
textStyle: {
align: 'center',
color: '#000',

@ -1,10 +1,10 @@
<template>
<div class="dashboard-editor-container">
<panel-group @handleSetLineChartData="handleSetLineChartData" />
<panel-group @handleSetLineChartData="handleSetLineChartData"/>
<el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
<line-chart :chart-data="lineChartData" />
<line-chart :chart-data="lineChartData"/>
</el-row>
<el-row :gutter="32">
@ -15,7 +15,7 @@
</el-col>
<el-col :xs="24" :sm="24" :lg="8">
<div class="chart-wrapper">
<pie-chart />
<pie-chart/>
</div>
</el-col>
</el-row>
@ -34,8 +34,9 @@ import BarChart from './dashboard/BarChart'
const lineChartData = {
newVisitis: {
expectedData: [100, 120, 161, 134, 105, 160, 165],
actualData: [120, 82, 91, 154, 162, 140, 145]
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],
@ -87,7 +88,7 @@ export default {
}
}
@media (max-width:1024px) {
@media (max-width: 1024px) {
.chart-wrapper {
padding: 8px;
}

Loading…
Cancel
Save