页面调整
This commit is contained in:
parent
860a3132ff
commit
5ace5dab9d
|
|
@ -149,7 +149,7 @@ export default {
|
|||
height: 90%;
|
||||
|
||||
.active-ring-name {
|
||||
font-size: 20px !important;
|
||||
font-size: 30px !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -15,28 +15,9 @@
|
|||
</div>
|
||||
|
||||
<div class="cc-main-container">
|
||||
<div class="ccmc-left">
|
||||
<div class="ccmc-title">
|
||||
本月工单概况
|
||||
</div>
|
||||
<div class="ccmc-items">
|
||||
<div class="station-info" v-for="(item, index) in leftData" :key="index">
|
||||
<img :src="item.icon" alt="icon" class="station-icon">
|
||||
<div class="station-value">{{ item.value }}</div>
|
||||
<div class="station-name">{{ item.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <dv-active-ring-chart class="ccmc-middle" :config="config" /> -->
|
||||
<div class="ccmc-middle">
|
||||
<PieChart :dataType="dataType"></PieChart>
|
||||
</div>
|
||||
|
||||
<div class="ccmc-right">
|
||||
<div class="ccmc-title">
|
||||
{{dataType=='3'?'未完成订单数量':'保养及备料信息'}}
|
||||
本月工单概况
|
||||
</div>
|
||||
<!-- <div class="ccmc-items">
|
||||
<div class="station-info" v-for="(item, index) in rightData" :key="index">
|
||||
|
|
@ -69,7 +50,7 @@
|
|||
<div class="second-row">
|
||||
<div
|
||||
class="item-card"
|
||||
v-for="(item, index) in rightData"
|
||||
v-for="(item, index) in leftData"
|
||||
:key="index"
|
||||
>
|
||||
<img :src="item.icon" class="sc-icon">
|
||||
|
|
@ -80,6 +61,29 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <dv-active-ring-chart class="ccmc-middle" :config="config" /> -->
|
||||
<div class="ccmc-middle">
|
||||
<PieChart :dataType="dataType"></PieChart>
|
||||
</div>
|
||||
<div class="ccmc-left">
|
||||
<div class="ccmc-title">
|
||||
{{dataType=='3'?'未完成订单数量':'保养及备料信息'}}
|
||||
</div>
|
||||
<div class="new-bar-chart" v-show="dataType !='3'">
|
||||
<div id="echarts-new" style="height: 400px;width: 800px;"></div>
|
||||
</div>
|
||||
<div class="ccmc-items" v-show="dataType=='3'">
|
||||
<div class="station-info" v-for="(item, index) in rightData" :key="index">
|
||||
<img :src="item.icon" alt="icon" class="station-icon">
|
||||
<div class="station-value">{{ item.value }}</div>
|
||||
<div class="station-name">{{ item.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <LabelTag :config="labelConfig" /> -->
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -88,6 +92,7 @@
|
|||
<script>
|
||||
import LabelTag from './LabelTag'
|
||||
import PieChart from './pieChart.vue'
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
name: 'CenterCmp',
|
||||
components: {
|
||||
|
|
@ -103,10 +108,10 @@ export default {
|
|||
// 定义原始数据
|
||||
const originalLeftData = [
|
||||
|
||||
{ icon: require(`@/img/icons/1.png`), name: '本月订单数', value: '1120' },
|
||||
{ icon: require(`@/img/icons/2.png`), name: '本月派工数', value: '600' },
|
||||
{ icon: require(`@/img/icons/3.png`), name: '本月派工未完成数', value: '60%' },
|
||||
{ icon: require(`@/img/icons/3.png`), name: '本月派工完成率', value: '100%' }
|
||||
{ icon: require(`@/img/icons/12.png`), name: '本月订单数', value: '1120' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '本月派工数', value: '600' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '本月派工未完成数', value: '800' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '本月派工完成率', value: '100%' }
|
||||
];
|
||||
const originalLeftData2 = [
|
||||
{ icon: require(`@/img/icons/1.png`), name: '完成工单数', value: '1120' },
|
||||
|
|
@ -115,10 +120,11 @@ export default {
|
|||
];
|
||||
|
||||
const originalRightData = [
|
||||
{ icon: require(`@/img/icons/12.png`), name: '保养台数', value: '20' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '直通率', value: '100%' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '机芯备料进度', value: '98%' },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '盖板备料进度', value: '85%' }
|
||||
{ icon: require(`@/img/icons/12.png`), name: '保养率', value: 20 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '直通率', value: 100 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '整机备料率', value: 90 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '盖板备料率', value: 85 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '机芯备料率', value: 90 },
|
||||
];
|
||||
const originalRightData2 = [
|
||||
{ icon: require(`@/img/icons/12.png`), name: '水件', value: '12000' },
|
||||
|
|
@ -153,6 +159,15 @@ export default {
|
|||
radius: '55%',
|
||||
activeRadius: '60%'
|
||||
},
|
||||
config1:{
|
||||
showValue:true,
|
||||
data:[
|
||||
{ icon: require(`@/img/icons/12.png`), name: '保养率', value: 20 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '直通率', value: 100 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '机芯备料进度', value: 90 },
|
||||
{ icon: require(`@/img/icons/12.png`), name: '盖板备料进度', value: 85 }
|
||||
]
|
||||
},
|
||||
|
||||
labelConfig: {
|
||||
|
||||
|
|
@ -162,7 +177,127 @@ export default {
|
|||
leftData: this.dataType == '3'?originalLeftData2:originalLeftData,
|
||||
rightData: this.dataType == '3'?originalRightData2:originalRightData
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.createData();
|
||||
},
|
||||
methods: {
|
||||
createData() {
|
||||
// 原始数据（每个柱子的总高度，单位：%）
|
||||
const rawData = this.rightData.map(item=>{return item.value});
|
||||
const categories = this.rightData.map(item=>{return item.name});
|
||||
|
||||
// 将数据按 10% 分段，生成堆叠数据
|
||||
const generateStackData = (value) => {
|
||||
const segments = [];
|
||||
let remaining = value;
|
||||
for (let i = 0; i < 10; i++) { // 最多分成 10 段（100%）
|
||||
const segmentValue = remaining >= 10 ? 10 : remaining;
|
||||
if (segmentValue <= 0) break;
|
||||
segments.push(segmentValue);
|
||||
remaining -= segmentValue;
|
||||
}
|
||||
return segments;
|
||||
};
|
||||
|
||||
// 生成堆叠数据系列
|
||||
const series = [];
|
||||
for (let i = 0; i < 10; i++) { // 最多 10 个堆叠层
|
||||
series.push({
|
||||
type: 'bar',
|
||||
stack: 'total', // 堆叠组名
|
||||
data: rawData.map(value => {
|
||||
const segments = generateStackData(value);
|
||||
return i < segments.length ? segments[i] : 0; // 超出分段返回 0
|
||||
}),
|
||||
itemStyle: {
|
||||
color: `rgba(135, 206, 235, ${i * 0.1+0.2})`, // 从下往上透明度变化,
|
||||
borderColor: 'transparent',
|
||||
borderWidth: 3,
|
||||
},
|
||||
barGap: '0%', // 柱子间无间隔
|
||||
barCategoryGap: '20%' // 类目间留间隙
|
||||
});
|
||||
}
|
||||
var myChart = echarts.init(document.getElementById('echarts-new'));
|
||||
// this.option = {
|
||||
// xAxis: {
|
||||
// type: 'category',
|
||||
// data: this.rightData.map(item=>{return item.name}),
|
||||
// axisLabel: {
|
||||
// fontSize: 18, // 设置 Y 轴字体大小
|
||||
// color: '#fff', // 可选：设置字体颜色
|
||||
// },
|
||||
// },
|
||||
// yAxis: {
|
||||
// type: 'value',
|
||||
// splitLine: {
|
||||
// show: false, // 显示 y 轴辅助线
|
||||
// },
|
||||
// axisLabel: {
|
||||
// fontSize: 25, // 设置 Y 轴字体大小
|
||||
// color: '#fff', // 可选：设置字体颜色
|
||||
// // 只显示偶数的 y 轴标签
|
||||
// },
|
||||
|
||||
// },
|
||||
// series: [
|
||||
// {
|
||||
// data: this.rightData.map(item=>{return item.value}),
|
||||
// type: 'bar',
|
||||
// showBackground: true,
|
||||
// backgroundStyle: {
|
||||
// color: 'rgba(180, 180, 180, 0.2)'
|
||||
// },
|
||||
// barWidth: '60%',
|
||||
// itemStyle: {
|
||||
// borderRadius: [5, 5, 0, 0], // 顶部圆角，模拟切除效果
|
||||
// color: {
|
||||
// type: 'linear', // 线性渐变
|
||||
// x: 0, // 从左到右
|
||||
// y: 0,
|
||||
// x2: 0, // 从下到上
|
||||
// y2: 1,
|
||||
// colorStops: [
|
||||
// { offset: 0, color: '#3399FF' }, // 浅蓝色，起始颜色
|
||||
// { offset: 0.5, color: '#08e5ff' }, // 浅蓝色，起始颜色
|
||||
|
||||
// { offset: 1, color: '#F4f4f4' } // 白色，结束颜色
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// };
|
||||
|
||||
this.option = {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: categories,
|
||||
axisLabel: {
|
||||
fontSize: 19, // 设置 Y 轴字体大小
|
||||
color: '#fff', // 可选：设置字体颜色
|
||||
fontWight:'bold'
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
max: 100,
|
||||
// axisLine: { show: false },
|
||||
splitLine: {
|
||||
show: false, // 显示 y 轴辅助线
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 25, // 设置 Y 轴字体大小
|
||||
color: '#fff', // 可选：设置字体颜色
|
||||
// 只显示偶数的 y 轴标签
|
||||
},
|
||||
},
|
||||
series: series
|
||||
}
|
||||
myChart.setOption(this.option);
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -234,9 +369,16 @@ export default {
|
|||
height: 90%;
|
||||
|
||||
.active-ring-name {
|
||||
font-size: 25px !important;
|
||||
width: 150px;
|
||||
font-size: 30px !important;
|
||||
font-weight: bold;
|
||||
height:100px;
|
||||
}
|
||||
.dv-digital-flop {
|
||||
font-size: 100px;
|
||||
// width: 100px;
|
||||
// height: 30px;
|
||||
font-weight: bold;
|
||||
height:80px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -389,7 +531,7 @@ export default {
|
|||
font-weight: bold;
|
||||
}
|
||||
.sc-name{
|
||||
font-size:25px;
|
||||
font-size:20px;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -406,7 +548,11 @@ export default {
|
|||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.new-bar-chart{
|
||||
position: absolute;
|
||||
top: 110px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -52,7 +52,7 @@ export default {
|
|||
title: {
|
||||
text: '近一周产量趋势',
|
||||
textStyle: {
|
||||
fontSize:25,
|
||||
fontSize:30,
|
||||
fontWight:'bold',
|
||||
color: '#fff'
|
||||
}
|
||||
|
|
@ -61,10 +61,14 @@ export default {
|
|||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: this.dataType == '整机' ? ['整机线'] : ['机芯1线', '机芯2线', '盖板线'],
|
||||
icon: 'rect',
|
||||
itemWidth: 20, // 色块宽度
|
||||
itemHeight: 20, // 色块高度
|
||||
itemGap: 40, // 图例之间的间距
|
||||
data: this.dataType == '整机' ? ['整机线'] : ['整机', '机芯', '盖板'],
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize:25,
|
||||
fontSize:30,
|
||||
fontWight:'bold'
|
||||
}
|
||||
},
|
||||
|
|
@ -76,15 +80,21 @@ export default {
|
|||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
boundaryGap: true,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
|
||||
axisLabel: {
|
||||
fontSize: 20, // 设置 Y 轴字体大小
|
||||
color: '#fff' // 可选：设置字体颜色
|
||||
fontSize: 35, // 设置 Y 轴字体大小
|
||||
color: '#fff', // 可选：设置字体颜色
|
||||
onZero: false ,// 确保 y 轴不与第一个数据点对齐
|
||||
// 只显示奇数索引的 x 轴标签
|
||||
// formatter: function (value, index) {
|
||||
// return index % 2 === 1 ? value : ''; // 奇数索引显示，偶数索引隐藏
|
||||
// }
|
||||
},
|
||||
|
||||
data: getRecentWeekDates()
|
||||
|
|
@ -96,9 +106,23 @@ export default {
|
|||
color: '#fff'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: true, // 显示 y 轴辅助线
|
||||
lineStyle: {
|
||||
type: 'dashed', // 设置为虚线
|
||||
color: '#999', // 虚线颜色
|
||||
width: 2, // 虚线宽度
|
||||
height:1,
|
||||
dashArray: [15, 5]
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 20, // 设置 Y 轴字体大小
|
||||
color: '#fff' // 可选：设置字体颜色
|
||||
fontSize: 35, // 设置 Y 轴字体大小
|
||||
color: '#fff', // 可选：设置字体颜色
|
||||
// 只显示偶数的 y 轴标签
|
||||
formatter: function (value) {
|
||||
return value % 200 === 0 ? value : ''; // 偶数显示，奇数隐藏
|
||||
}
|
||||
},
|
||||
},
|
||||
series:
|
||||
|
|
@ -108,29 +132,48 @@ export default {
|
|||
name: '整机线',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [133, 162, 191, 134, 130, 230, 310]
|
||||
data: [133, 162, 191, 134, 130, 230, 310],
|
||||
lineStyle: {
|
||||
width: 4, // 数据线加粗
|
||||
}
|
||||
}
|
||||
] :
|
||||
[
|
||||
|
||||
{
|
||||
name: '机芯1线',
|
||||
name: '整机',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [120, 132, 101, 134, 90, 230, 210],
|
||||
lineStyle: {
|
||||
width: 4, // 数据线加粗
|
||||
},
|
||||
symbolSize: 12, // 数据点大小
|
||||
},
|
||||
{
|
||||
name: '机芯2线',
|
||||
name: '机芯',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [150, 142, 111, 114, 120, 120, 110]
|
||||
smooth: true,
|
||||
data: [150, 142, 111, 114, 120, 120, 110],
|
||||
lineStyle: {
|
||||
width: 4, // 数据线加粗
|
||||
},
|
||||
symbolSize: 12, // 数据点大小
|
||||
},
|
||||
{
|
||||
name: '盖板线',
|
||||
name: '盖板',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [130, 232, 201, 154, 190, 330, 410]
|
||||
}
|
||||
smooth: true,
|
||||
data: [130, 232, 201, 154, 190, 330, 410],
|
||||
lineStyle: {
|
||||
width: 4, // 数据线加粗
|
||||
},
|
||||
symbolSize: 12, // 数据点大小
|
||||
},
|
||||
|
||||
]
|
||||
};
|
||||
myChart.setOption(this.option);
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ function getRecentSixMonths() {
|
|||
|
||||
return months;
|
||||
}
|
||||
import { color } from 'chart.js/helpers';
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
name: 'RoseChart',
|
||||
|
|
@ -47,15 +48,15 @@ export default {
|
|||
console.log(myChart)
|
||||
this.option = {
|
||||
title: {
|
||||
text: '月生产情况',
|
||||
subtext: '完成率',
|
||||
subtextStyle:{
|
||||
fontSize:20,
|
||||
fontWight:'bold',
|
||||
color:'#fff'
|
||||
},
|
||||
text: '近半年产量情况',
|
||||
// subtext: '完成率',
|
||||
// subtextStyle:{
|
||||
// fontSize:20,
|
||||
// fontWight:'bold',
|
||||
// color:'#fff'
|
||||
// },
|
||||
textStyle:{
|
||||
fontSize:25,
|
||||
fontSize:30,
|
||||
fontWight:'bold',
|
||||
color:'#fff'
|
||||
}
|
||||
|
|
@ -64,12 +65,24 @@ export default {
|
|||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: this.dataType == '整机' ?['机芯1线', '机芯2线', '盖板线'] : ['整机线'],
|
||||
textStyle:{
|
||||
fontSize:25,
|
||||
color:'#fff'
|
||||
icon: 'rect',
|
||||
itemWidth: 20, // 色块宽度
|
||||
itemHeight: 20, // 色块高度
|
||||
itemGap: 40, // 图例之间的间距
|
||||
data: this.dataType == '整机' ?['整机线']:['整机', '机芯', '盖板'],
|
||||
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize:30,
|
||||
fontWight:'bold'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '7%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
toolbox: {
|
||||
},
|
||||
calculable: true,
|
||||
|
|
@ -82,7 +95,7 @@ export default {
|
|||
}
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 20, // 设置 Y 轴字体大小
|
||||
fontSize: 35, // 设置 Y 轴字体大小
|
||||
color: '#fff' // 可选：设置字体颜色
|
||||
},
|
||||
// prettier-ignore
|
||||
|
|
@ -98,9 +111,19 @@ export default {
|
|||
}
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 20, // 设置 Y 轴字体大小
|
||||
color: '#fff' // 可选：设置字体颜色
|
||||
},
|
||||
fontSize: 35, // 设置 Y 轴字体大小
|
||||
color: '#fff' // 可选：设置字体颜色
|
||||
},
|
||||
splitLine: {
|
||||
show: false, // 显示 y 轴辅助线
|
||||
lineStyle: {
|
||||
type: 'dashed', // 设置为虚线
|
||||
color: '#999', // 虚线颜色
|
||||
width: 2, // 虚线宽度
|
||||
height:1,
|
||||
dashArray: [15, 5]
|
||||
}
|
||||
},
|
||||
}
|
||||
],
|
||||
series:
|
||||
|
|
@ -119,17 +142,25 @@ export default {
|
|||
]
|
||||
},
|
||||
markLine: {
|
||||
data: [{ type: 'average', name: 'Avg' }]
|
||||
data: [{ type: 'average', name: 'Avg' }],
|
||||
lineStyle:{
|
||||
width: 2, // 虚线宽度
|
||||
},
|
||||
label:{
|
||||
fontSize:'20',
|
||||
// color:'red'
|
||||
}
|
||||
}
|
||||
}
|
||||
]:
|
||||
[
|
||||
{
|
||||
name: '机芯1线',
|
||||
name: '整机',
|
||||
type: 'bar',
|
||||
data: [
|
||||
75, 65, 68, 69, 40, 82
|
||||
],
|
||||
barWidth: 30, // 设置柱状图宽度为 20px
|
||||
markPoint: {
|
||||
data: [
|
||||
{ type: 'max', name: 'Max' },
|
||||
|
|
@ -137,15 +168,23 @@ export default {
|
|||
]
|
||||
},
|
||||
markLine: {
|
||||
data: [{ type: 'average', name: 'Avg' }]
|
||||
data: [{ type: 'average', name: 'Avg' }],
|
||||
lineStyle:{
|
||||
width: 2, // 虚线宽度
|
||||
},
|
||||
label:{
|
||||
fontSize:'20',
|
||||
color:'#ffffff'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '机芯2线',
|
||||
name: '机芯',
|
||||
type: 'bar',
|
||||
data: [
|
||||
70, 75, 88, 85, 97, 85, 75, 78, 59, 80, 82, 63
|
||||
],
|
||||
barWidth: 30, // 设置柱状图宽度为 20px
|
||||
markPoint: {
|
||||
data: [
|
||||
{ name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
|
||||
|
|
@ -153,15 +192,23 @@ export default {
|
|||
]
|
||||
},
|
||||
markLine: {
|
||||
data: [{ type: 'average', name: 'Avg' }]
|
||||
data: [{ type: 'average', name: 'Avg' }],
|
||||
lineStyle:{
|
||||
width: 2, // 虚线宽度
|
||||
},
|
||||
label:{
|
||||
fontSize:'20',
|
||||
color:'#ffffff'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '盖板线',
|
||||
name: '盖板',
|
||||
type: 'bar',
|
||||
data: [
|
||||
80, 85, 78, 75, 67, 45, 55, 68, 49, 50, 72, 93
|
||||
],
|
||||
barWidth: 30, // 设置柱状图宽度为 20px
|
||||
markPoint: {
|
||||
data: [
|
||||
{ name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
|
||||
|
|
@ -169,7 +216,14 @@ export default {
|
|||
]
|
||||
},
|
||||
markLine: {
|
||||
data: [{ type: 'average', name: 'Avg' }]
|
||||
data: [{ type: 'average', name: 'Avg' }],
|
||||
lineStyle:{
|
||||
width: 2, // 虚线宽度
|
||||
},
|
||||
label:{
|
||||
fontSize:'20',
|
||||
color:'#ffffff'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -72,9 +72,9 @@ export default {
|
|||
this.dataType = ''; // 如果不是 '1'，则设置为空
|
||||
}
|
||||
|
||||
setInterval(() => {
|
||||
this.switchType = this.switchType == 1 ? 2 : 1
|
||||
}, 15000); // 10000 毫秒 = 10 秒
|
||||
// setInterval(() => {
|
||||
// this.switchType = this.switchType == 1 ? 2 : 1
|
||||
// }, 15000); // 10000 毫秒 = 10 秒
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -73,8 +73,8 @@
|
|||
],
|
||||
color: ['#3de7c9','#88a8f4','#ffdc9d','#eb7e41'],
|
||||
lineWidth: 40,
|
||||
radius: '55%',
|
||||
activeRadius: '60%'
|
||||
radius: '75%',
|
||||
activeRadius: '80%'
|
||||
},
|
||||
testchartData:[
|
||||
{
|
||||
|
|
@ -94,6 +94,10 @@
|
|||
name: "组件产量",
|
||||
},
|
||||
],
|
||||
digitalFlopStyle: {
|
||||
fontSize: 45,
|
||||
fill: '#fff'
|
||||
},
|
||||
option: {}
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue