Commit 42cabc89 authored by xuzhuo's avatar xuzhuo

按钮颜色修改

parent 6c9c20b1
<template>
<div class="target-achievement">
<div class="menu">
<input type="button" value="上海事业部" @click="changeDimension('L022')">
<input type="button" value="广东事业部" @click="changeDimension('L026')">
<input type="button" value="江苏事业部" @click="changeDimension('L024')">
<input type="button" value="天津事业部" @click="changeDimension('L025')">
<input type="button" value="成都事业部" @click="changeDimension('L004')">
<input type="button" value="山东事业部" @click="changeDimension('L005')">
<input type="button" value="河南事业部" @click="changeDimension('L007')">
<input type="button" value="华西事业部" @click="changeDimension('L008')">
<input type="button" value="湛江事业部" @click="changeDimension('L009')">
<input type="button" value="上海事业部" @click="changeDimension('L022', 1)" :style="dynamicStyle(1)">
<input type="button" value="广东事业部" @click="changeDimension('L026', 2)" :style="dynamicStyle(2)">
<input type="button" value="江苏事业部" @click="changeDimension('L024', 3)" :style="dynamicStyle(3)">
<input type="button" value="天津事业部" @click="changeDimension('L025', 4)" :style="dynamicStyle(4)">
<input type="button" value="成都事业部" @click="changeDimension('L004', 5)" :style="dynamicStyle(5)">
<input type="button" value="山东事业部" @click="changeDimension('L005', 6)" :style="dynamicStyle(6)">
<input type="button" value="河南事业部" @click="changeDimension('L007', 7)" :style="dynamicStyle(7)">
<input type="button" value="华西事业部" @click="changeDimension('L008', 8)" :style="dynamicStyle(8)">
<input type="button" value="湛江事业部" @click="changeDimension('L009', 9)" :style="dynamicStyle(9)">
</div>
<div class="chart">
<div ref="chart" style="width: 100%;height: 100%;"/>
......@@ -31,6 +31,7 @@ export default {
return {
// today: "2023-06-30",
today: moment().format("yyyy-MM-DD"),
current_index: 1,
discountOption: {
tooltip: {
trigger: 'axis'
......@@ -65,8 +66,14 @@ export default {
this.chart.resize();
}
},
dynamicStyle(index) {
return {
background: index === this.current_index ? '#00F6F0' : null,
color: index === this.current_index ? '#000000' : null,
};
},
//dimension 事业部code
async changeDimension(dimension) {
async changeDimension(dimension, index) {
this.currentBtn = dimension;
// this.chart.dispose();
let chartDom = this.$refs.chart;
......@@ -81,6 +88,9 @@ export default {
//柱状图加载
this.discountOption.series = this.currentData.seriesBar;
this.bar.setOption(this.discountOption);
this.current_index = index;
console.log(this.current_index);
},
},
......@@ -92,7 +102,7 @@ export default {
let barDom = this.$refs.bar;
this.bar = echarts.init(barDom);
this.changeDimension('L022');
this.changeDimension('L022', 1);
window.addEventListener('resize', this.resizeChart);
}, 500);
......@@ -102,6 +112,10 @@ export default {
</script>
<style scoped>
.bg_color {
background-color: #00F6F0;
}
.turnover-detail {
width: 100%;
height: 100%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment