@@ -234,8 +234,10 @@ export default {
const option = {
color: [
- '#0DC291',
- '#FFB519',
+ '#b7f1e2',
+ '#fc7150',
+ '#fea500',
+ '#5facfe',
],
tooltip: {
trigger: 'item'
@@ -245,15 +247,20 @@ export default {
{
name: 'Access From',
type: 'pie',
- radius: '80%',
+ roseType: 'area',
+ radius: [5, '80%'],
data: [
- { value: 28, name: '28%' },
- { value: 72, name: '72%' },
+ { value: 36, name: '#98汽油占比' },
+ { value: 42, name: '0#柴油占比' },
+ { value: 40, name: '#95汽油占比' },
+ { value: 38, name: '#92柴油占比' },
+
],
emphasis: {
itemStyle: {
shadowBlur: 10,
+ borderRadius: 8,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
@@ -292,8 +299,10 @@ export default {
};
const option2 = {
color: [
- '#0DC291',
- '#FFB519',
+ '#46c2c4',
+ '#6e4dd8',
+ '#214790',
+ '#d55f5f',
],
tooltip: {
trigger: 'item'
@@ -303,10 +312,12 @@ export default {
{
name: 'Access From',
type: 'pie',
- radius: '80%',
+ radius: [50, '80%'],
data: [
- { value: 28, name: '28%' },
- { value: 72, name: '72%' },
+ { value: 28, name: '会员充值占比' },
+ { value: 72, name: '积分商城交易占比' },
+ { value: 28, name: '油品交易占比' },
+ { value: 72, name: '便利店交易占比' },
],
emphasis: {
@@ -319,8 +330,8 @@ export default {
}
]
};
+
const option3 = {
- color: ['#FF9655', '#0DC291', '#409EFF'],
tooltip: {
trigger: 'axis',
axisPointer: {
@@ -332,25 +343,12 @@ export default {
},
legend: {
- data: ['交易金额', '交易笔数', '活跃油站数']
+ data: ['Evaporation', '会员余额', '会员充值金额']
},
xAxis: [
{
type: 'category',
- data: [
- '00:00',
- '02:00',
- '04:00',
- '06:00',
- '08:00',
- '10:00',
- '12:00',
- '14:00',
- '16:00',
- '18:00',
- '20:00',
- '22:00'
- ],
+ data: ['中建锦绣广场1站', '中建锦绣广场2站', '中建锦绣广场3站', '中建锦绣广场4站', '中建锦绣广场5站', '中建锦绣广场6站', '中建锦绣广场7站'],
axisPointer: {
type: 'shadow'
}
@@ -360,67 +358,120 @@ export default {
{
type: 'value',
name: '金额(元)',
-
min: 0,
max: 250,
interval: 50,
axisLabel: {
- formatter: '{value} '
+ formatter: '{value}'
}
},
{
type: 'value',
- name: '笔数',
+ name: '',
min: 0,
max: 25,
interval: 5,
axisLabel: {
- formatter: '{value}'
+ formatter: '{value} '
}
}
],
series: [
{
- name: '活跃油站数',
+ name: '会员余额',
+ color: '#D55F5F',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
- return value + ' ml';
+ return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
- //这里设置柱形图圆角 5左上角，右上角，右下角，左下角]
barBorderRadius: [50, 50, 0, 0]
}
},
data: [
- 30.0, 31.9, 71.0, 23.2, 41.6, 31.7, 21.6, 30.0, 31.9, 71.0, 23.2, 41.6
+ 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
]
},
-
{
- name: '交易金额',
- type: 'line',
- yAxisIndex: 1,
+ name: '会员充值金额',
+ color: '#0DC291',
+ type: 'bar',
tooltip: {
valueFormatter: function (value) {
- return value + ' °C';
+ return value;
}
},
- data: [3.0, 3.9, 7.0, 2.2, 4.6, 3.7, 2.6, 3.0, 3.9, 7.0, 3.2, 4.6]
+ barWidth: 13,
+ itemStyle: {
+ normal: {
+ barBorderRadius: [50, 50, 0, 0]
+ }
+ },
+ data: [
+ 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
+ ]
},
{
- name: '交易笔数',
- type: 'line',
- yAxisIndex: 1,
+ name: '会员消费金额',
+ color: '#409EFF',
+ type: 'bar',
tooltip: {
valueFormatter: function (value) {
- return value + ' °C';
+ return value;
}
},
- data: [2.0, 3.9, 4.0, 5.2, 4.6, 6.7, 7.6, 6.0, 5.9, 4.0, 4.2, 2.6]
+ barWidth: 13,
+ itemStyle: {
+ normal: {
+ barBorderRadius: [50, 50, 0, 0]
+ }
+ },
+ data: [
+ 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
+ ]
+ },
+ {
+ name: '油品交易额',
+ color: '#FF9655',
+ type: 'bar',
+ tooltip: {
+ valueFormatter: function (value) {
+ return value;
+ }
+ },
+ barWidth: 13,
+ itemStyle: {
+ normal: {
+ barBorderRadius: [50, 50, 0, 0]
+ }
+ },
+ barGap: '60%',
+ data: [
+ 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
+ ]
+ },
+ {
+ name: '非油品交易额',
+ color: '#55F3FF',
+ type: 'bar',
+ tooltip: {
+ valueFormatter: function (value) {
+ return value;
+ }
+ },
+ barWidth: 13,
+ itemStyle: {
+ normal: {
+ barBorderRadius: [50, 50, 0, 0]
+ }
+ },
+ data: [
+ 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
+ ]
}
],
grid: {
@@ -429,7 +480,6 @@ export default {
bottom: '3%',
containLabel: true
}
-
};
chart.setOption(option)
diff --git a/fuintAdmin_zt/src/views/index.vue b/fuintAdmin_zt/src/views/index.vue
index 36a1e3bc4..08f8cd989 100644
--- a/fuintAdmin_zt/src/views/index.vue
+++ b/fuintAdmin_zt/src/views/index.vue
@@ -13,7 +13,7 @@ import shopowner from "@/views/homeComponents/shopowner.vue"
export default {
data(){
return{
- power:1
+ power:2
}
},
created() {