前端
This commit is contained in:
xvv
parent
c54811e52a
commit
e498bcec62
@ -11,9 +11,8 @@ VUE_APP_BASE_API = '/dev-api'
|
||||
VUE_APP_PUBLIC_PATH = '/'
|
||||
|
||||
# 后端接口地址
|
||||
#VUE_APP_SERVER_URL = 'http://192.168.31.96:8080/'
|
||||
#VUE_APP_SERVER_URL = 'http://192.168.31.178:8081'
|
||||
VUE_APP_SERVER_URL = 'http://localhost:8080/'
|
||||
|
||||
VUE_APP_SERVER_URL = 'http://192.168.31.72:8099/'
|
||||
|
||||
# cp端地址
|
||||
# VUE_PC_SERVER_URL = 'http://47.95.206.185:85/'
|
||||
|
||||
@ -46,25 +46,7 @@
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisible"
|
||||
width="30%"
|
||||
:before-close="handleClose">
|
||||
<el-form-item label="密码" prop="name">
|
||||
<el-input v-model="ruleForm.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="name">
|
||||
<el-input v-model="ruleForm.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="name">
|
||||
<el-input v-model="ruleForm.name"></el-input>
|
||||
</el-form-item>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="prsswrod()">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@ -114,15 +114,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="hui-hang"></div>
|
||||
<div class="d-s" >
|
||||
<div>
|
||||
<div class="h-tt" >活跃油站</div>
|
||||
<div id="ccc" style="width: 300px;height: 200px; "></div>
|
||||
</div>
|
||||
<div id="cccc" style="width: 300px;height: 200px;"></div>
|
||||
<div id="ccct" style="width: 300px;height: 200px;"></div>
|
||||
<div id="cttt" style="width: 340px;height: 200px;"></div>
|
||||
|
||||
<div class="h-tt" >活跃油站</div>
|
||||
<div class="d-s" style="justify-content: space-around" >
|
||||
<div id="ccc" style="width: 750px;height: 600px;"></div>
|
||||
<div>
|
||||
<div id="cttt" style="width: 350px;height: 300px;"></div>
|
||||
<div id="ccct" style="width: 350px;height: 300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-t">
|
||||
@ -155,6 +153,7 @@
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div id="ctct" style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
|
||||
<div id="cccc" style="width: 300px;height: 200px;"></div>
|
||||
|
||||
</div>
|
||||
|
||||
@ -328,7 +327,6 @@ export default {
|
||||
const chart2= echarts.init(document.getElementById('ccct'))
|
||||
const chart4= echarts.init(document.getElementById('cttt'))
|
||||
const chart3= echarts.init(document.getElementById('ctct'))
|
||||
|
||||
let hourList = []
|
||||
let storeNumList = []
|
||||
let tradeAmountList = []
|
||||
@ -359,37 +357,71 @@ export default {
|
||||
tradeNumList = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]
|
||||
}
|
||||
|
||||
const option = {
|
||||
const option = {
|
||||
color: [
|
||||
'#3B6ADE',
|
||||
'#409eff',
|
||||
'#179726',
|
||||
'#FFB519',
|
||||
],
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b}: {c} ({d}%)'
|
||||
},
|
||||
|
||||
legend: {
|
||||
top: '0%',
|
||||
left: 'center'
|
||||
},
|
||||
|
||||
series: [
|
||||
{
|
||||
name: 'Access From',
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: '80%',
|
||||
selectedMode: 'single',
|
||||
radius: [0, '35%'],
|
||||
label: {
|
||||
position: 'inner',
|
||||
fontSize: 14,
|
||||
formatter: '{d}%'
|
||||
},
|
||||
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
// { value: 28, name: '28%' },
|
||||
// { value: 72, name: '72%' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.noStoreTotal),Number(this.storeAmount.noStoreTotal) + Number(this.storeAmount.storeTotal)), name: '非7日活跃油站' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.storeTotal),Number(this.storeAmount.noStoreTotal) + Number(this.storeAmount.storeTotal)), name: '7日活跃油站' },
|
||||
|
||||
{ value: Number(this.storeAmount.noStoreTotal), name: '非7日活跃油站' },
|
||||
{ value: Number(this.storeAmount.storeTotal), name: '7日活跃油站' },
|
||||
|
||||
],
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
{ value: 1548, name: '非七日活跃' },
|
||||
{ value: 775, name: '七日活跃' }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: ['45%', '68%'],
|
||||
labelLine: {
|
||||
length: 30
|
||||
},
|
||||
label: {
|
||||
formatter: '{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',
|
||||
rich: {
|
||||
b: {
|
||||
color: '#4C5058',
|
||||
fontSize: 14,
|
||||
fontWeight: 'bold',
|
||||
lineHeight: 14
|
||||
},
|
||||
per: {
|
||||
color: '#fff',
|
||||
backgroundColor: '#4C5058',
|
||||
padding: [3, 4],
|
||||
borderRadius: 4
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '本月新增' },
|
||||
{ value: 335, name: '非本月新增' }
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
@ -428,35 +460,39 @@ export default {
|
||||
]
|
||||
};
|
||||
const option2 = {
|
||||
color: [
|
||||
'#0DC291',
|
||||
'#FFB519',
|
||||
],
|
||||
color: ['#fe7e01', '#48c837'],
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
trigger: 'item',
|
||||
formatter: '{d}%'
|
||||
},
|
||||
legend: {
|
||||
bottom: '0%',
|
||||
left: 'center'
|
||||
},
|
||||
|
||||
series: [
|
||||
{
|
||||
name: 'Access From',
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: '80%',
|
||||
data: [
|
||||
// { value: 28, name: '28%' },
|
||||
// { value: 72, name: '72%' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.weekStoreTotal),Number(this.storeAmount.weekStoreTotal) + Number(this.storeAmount.noWeekStoreTotal)), name: '本月新增7日活跃油站' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.noWeekStoreTotal),Number(this.storeAmount.weekStoreTotal) + Number(this.storeAmount.noWeekStoreTotal)), name: '本月新增非7日活跃油站' },
|
||||
{ value: Number(this.storeAmount.weekStoreTotal), name: '本月新增7日活跃油站' },
|
||||
{ value: Number(this.storeAmount.noWeekStoreTotal), name: '本月新增非7日活跃油站' },
|
||||
radius: ['40%', '80%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 10
|
||||
},
|
||||
|
||||
data: [
|
||||
{ value: 50, name: '富友交易金额占比 ' },
|
||||
{ value: 50, name: '拉卡拉交易金额占比' }
|
||||
// { value: this.countPercentage(Number(this.storeAmount.fuYouAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '富友占比' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.laKaLaAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '拉卡拉占比' }
|
||||
],
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
label: {
|
||||
show: true,
|
||||
position: "inside",
|
||||
color:'#fff',
|
||||
formatter: `{d}%`,
|
||||
},
|
||||
}
|
||||
]
|
||||
};
|
||||
@ -564,16 +600,20 @@ export default {
|
||||
|
||||
};
|
||||
const option4 ={
|
||||
color: ['#f82f2f', '#179627'],
|
||||
color: ['#fe7e01', '#48c837'],
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
trigger: 'item',
|
||||
formatter: '{d}%'
|
||||
},
|
||||
legend: {
|
||||
bottom: '0%',
|
||||
left: 'center'
|
||||
},
|
||||
|
||||
series: [
|
||||
{
|
||||
name: 'Access From',
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: ['40%', '70%'],
|
||||
radius: ['40%', '80%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
@ -581,20 +621,18 @@ export default {
|
||||
borderWidth: 10
|
||||
},
|
||||
|
||||
emphasis: {
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: 40,
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
},
|
||||
|
||||
data: [
|
||||
// { value: 225, name: '富友占比' },
|
||||
// { value: 735, name: '拉卡拉占比' }
|
||||
{ value: this.countPercentage(Number(this.storeAmount.fuYouAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '富友占比' },
|
||||
{ value: this.countPercentage(Number(this.storeAmount.laKaLaAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '拉卡拉占比' }
|
||||
]
|
||||
{ value: 50, name: '富友交易金额占比 ' },
|
||||
{ value: 50, name: '拉卡拉交易金额占比' }
|
||||
// { value: this.countPercentage(Number(this.storeAmount.fuYouAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '富友占比' },
|
||||
// { value: this.countPercentage(Number(this.storeAmount.laKaLaAmount),Number(this.storeAmount.fuYouAmount) + Number(this.storeAmount.laKaLaAmount)), name: '拉卡拉占比' }
|
||||
],
|
||||
label: {
|
||||
show: true,
|
||||
position: "inside",
|
||||
color:'#fff',
|
||||
formatter: `{d}%`,
|
||||
},
|
||||
}
|
||||
]
|
||||
};
|
||||
@ -639,7 +677,7 @@ export default {
|
||||
.b-bs{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
justify-content: space-between;
|
||||
margin-top: 20px;
|
||||
}
|
||||
@ -662,11 +700,11 @@ export default {
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
border: 1px solid #FFFFFF;
|
||||
height: 380px;
|
||||
|
||||
|
||||
}
|
||||
.right-box{
|
||||
width: 25%;
|
||||
width: 26%;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
border: 1px solid #FFFFFF;
|
||||
@ -675,11 +713,11 @@ export default {
|
||||
padding: 15px;
|
||||
}
|
||||
.right-box-t{
|
||||
width: 25%;
|
||||
width: 26%;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
border: 1px solid #FFFFFF;
|
||||
height: 380px;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user