Merge branch 'master' of http://192.168.31.244:3000/byx/oilSystem
This commit is contained in:
DESKTOP-369JRHT\12997
commit
68b67c6e1a
@ -1,8 +1,14 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="bannser">
|
||||
<img src="../../assets/images/banner.png" alt="" >
|
||||
</div>
|
||||
<el-carousel height="230px">
|
||||
<el-carousel-item v-for="item in 4" :key="item">
|
||||
<div class="bannser">
|
||||
|
||||
<img src="../../assets/images/banner.png" alt="" >
|
||||
</div>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
|
||||
<div class="b-bs">
|
||||
<div class="left-box">
|
||||
<div class="san-box">
|
||||
@ -113,10 +119,10 @@
|
||||
</div>
|
||||
<div class="h-r-ba"></div>
|
||||
<div>
|
||||
<div class="h-tt" >活跃油站</div>
|
||||
|
||||
<div class="d-s" style="justify-content: space-between">
|
||||
<div id="cccc" style="width: 300px;height: 200px;margin-right: 50px"></div>
|
||||
<div id="ccct" style="width: 300px;height: 200px;"></div>
|
||||
<div id="ccct" style="width: 300px;height: 200px; margin-left: 50px"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -234,8 +240,10 @@ export default {
|
||||
|
||||
const option = {
|
||||
color: [
|
||||
'#0DC291',
|
||||
'#FFB519',
|
||||
'#b7f1e2',
|
||||
'#fc7150',
|
||||
'#fea500',
|
||||
'#5facfe',
|
||||
],
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
@ -245,15 +253,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 +305,10 @@ export default {
|
||||
};
|
||||
const option2 = {
|
||||
color: [
|
||||
'#0DC291',
|
||||
'#FFB519',
|
||||
'#46c2c4',
|
||||
'#6e4dd8',
|
||||
'#214790',
|
||||
'#d55f5f',
|
||||
],
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
@ -303,10 +318,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 +336,8 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
const option3 = {
|
||||
color: ['#FF9655', '#0DC291', '#409EFF'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
@ -332,25 +349,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 +364,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 +486,6 @@ export default {
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
chart.setOption(option)
|
||||
|
||||
@ -639,6 +639,5 @@ export default {
|
||||
background: #FF9655 !important;
|
||||
border: 1px solid #FF9655 !important;
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -13,7 +13,7 @@ import shopowner from "@/views/homeComponents/shopowner.vue"
|
||||
export default {
|
||||
data(){
|
||||
return{
|
||||
power:1
|
||||
power:2
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
52
fuintAdmin_zt/src/views/system/notify/index.vue
Normal file
52
fuintAdmin_zt/src/views/system/notify/index.vue
Normal file
@ -0,0 +1,52 @@
|
||||
<script >
|
||||
export default {
|
||||
data(){
|
||||
return{
|
||||
activeindex:0,
|
||||
tablist:[
|
||||
{
|
||||
name:'通知模板',
|
||||
},
|
||||
{
|
||||
name:'通知记录',
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="tab-box">
|
||||
<div class="f-box" v-for="(item,index) in tablist" :key="index" @click="activeindex=index" :class="{ 'active' :activeindex==index}">{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.tab-box{
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
padding: 0px 50px;
|
||||
}
|
||||
|
||||
.f-box{
|
||||
height: 40px;
|
||||
color: #999999;
|
||||
margin-right: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.active{
|
||||
color: #FF9655 !important;
|
||||
border-bottom: 2px solid #FF9655 !important;
|
||||
}
|
||||
.container{
|
||||
background: #F4F5F9;
|
||||
height: 100vh;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user