lb #12

Merged
gtz217 merged 27 commits from lb into master 2022-11-18 17:04:51 +08:00
2 changed files with 56 additions and 14 deletions
Showing only changes of commit 16a335d71f - Show all commits

View File

@ -143,10 +143,10 @@
<div class="grow">
<techy-box class="" style="padding: calc(16px * var(--beilv));">
<techy-analysis-header>产品成品率</techy-analysis-header>
<new-line-stack />
<new-line-stack :data-update-token="dataUpdateToken" />
<div class="date-select">
<span :class="{ 'date-select__active': dateMode2 === 'day' }" @click="dateMode2 = 'day'"></span>
<span :class="{ 'date-select__active': dateMode2 === 'month' }" @click="dateMode2 = 'month'">
<span :class="{ 'date-select__active': dateMode2 === 'day' }" @click="dateMode2 = 'day'; dataUpdateToken=''+Math.random()"></span>
<span :class="{ 'date-select__active': dateMode2 === 'month' }" @click="dateMode2 = 'month'; dataUpdateToken=''+Math.random()">
</span>
</div>
@ -281,6 +281,7 @@ export default {
]
return {
dataUpdateToken: 'xx-token',
plMode: 'a',
dateMode: 'month',
dateMode2: 'month',
@ -423,7 +424,8 @@ export default {
.quality-analysis__body__row-1 {
height: calc(216px * var(--beilv));
overflow: hidden;
/* overflow: hidden; */
overflow: initial;
display: flex;
gap: calc(16px * var(--beilv));
}

View File

@ -9,7 +9,12 @@ import resize from '@/views/OperationalOverview/components/mixins/resize'
export default {
name: 'PlFaultAnalysisPieChart',
mixins: [resize],
props: {},
props: {
dataUpdateToken: {
type: String,
default: 'default-token'
}
},
data() {
return {
chart: null,
@ -17,6 +22,7 @@ export default {
color: ['#FB418C', '#DDB112', '#1A99FF', '#A691FF', '#49FBD6'],
tooltip: {
trigger: 'axis',
extraCssText: 'width: 180px !important; ',
axisPointer: {
type: 'cross',
label: {
@ -24,9 +30,6 @@ export default {
}
}
},
// legend: {
// data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
// },
grid: {
top: '15%',
left: '2%',
@ -73,6 +76,7 @@ export default {
show: false
},
axisLabel: {
formatter: '{value} %',
textStyle: {
color: 'rgba(255,255,255,0.5)' //
}
@ -114,7 +118,10 @@ export default {
emphasis: {
focus: 'series'
},
data: [11, 199, 140, 63, 185, 5, 78]
data: [11, 199, 140, 63, 185, 5, 78].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
},
{
name: '磨边机',
@ -145,7 +152,10 @@ export default {
emphasis: {
focus: 'series'
},
data: [151, 57, 31, 7, 77, 88, 119]
data: [151, 57, 31, 7, 77, 88, 119].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
},
{
name: '镀膜机',
@ -176,7 +186,10 @@ export default {
emphasis: {
focus: 'series'
},
data: [58, 3, 67, 100, 42, 96, 124]
data: [58, 3, 67, 100, 42, 96, 124].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
},
{
name: '包装纸',
@ -207,7 +220,10 @@ export default {
emphasis: {
focus: 'series'
},
data: [92, 88, 122, 169, 108, 130, 147]
data: [92, 88, 122, 169, 108, 130, 147].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
},
{
name: '丝印',
@ -242,12 +258,22 @@ export default {
emphasis: {
focus: 'series'
},
data: [44, 40, 118, 197, 123, 95, 96]
data: [44, 40, 118, 197, 123, 95, 96].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
}
]
}
}
},
watch: {
dataUpdateToken(val) {
this.refreshData()
}
},
mounted() {
window.addEventListener('resize', function() {
if (this.chart) {
@ -263,7 +289,17 @@ export default {
this.chart.resize()
})
},
methods: {}
methods: {
refreshData() {
this.configs.series.forEach(item => {
item.data = [44, 40, 118, 197, 123, 95, 96].map(_ => {
let v = Math.floor(Math.random() * 100)
return v
})
})
if (this.chart) this.chart.setOption(this.configs)
}
}
}
</script>
@ -271,4 +307,8 @@ export default {
.chartContainer >>> div {
width: 100% !important;
}
.diy-linestack-tooltip {
color: red;
}
</style>