Skip to content

M
Muse
Commit 126f40e0 authored by 华国豪's avatar 华国豪 🙄
Browse files
Options

1

parent 516cfe58
Show whitespace changes
Inline Side-by-side
Showing with 463 additions and 296 deletions
src/components/viitto/dataLook.vue
View file @ 126f40e0
......@@ -15,6 +15,9 @@
text-align: right;
font-family: 'pingfangR';
}
.pingfangR{
font-family: 'pingfangR';
}
.type-box>div{
background:rgba(19,25,44,1);
box-shadow:0px 0px 5px 0px rgba(2,3,6, .55);
......@@ -67,7 +70,8 @@
border: none !important;
}
.content{
height: calc(100vh - 122px);
height: 88%;
/* height: calc(100vh - 122px); */
padding: 30px 40px;
box-sizing: border-box;
}
......@@ -82,23 +86,21 @@
overflow-y: auto;
overflow-x: hidden;
}
.right-data::-webkit-scrollbar{
.right-data::-webkit-scrollbar {
/*滚动条整体样式*/
width: 0;
width: 6px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 0;
height: 47px;
}
.right-data::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 0;
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0);
background: #c9c9c9;
border-radius: 4px;
background: rgba(106,116,146, .35);
}
.right-data::-webkit-scrollbar-track {
/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0);
border-radius: 0;
background: #EDEDED;
border-radius: 4px;
background: #252D48;
}
.tab span{
display: inline-block;
......@@ -166,14 +168,17 @@
.sub{
font-size: 20px;
}
.width-100{
width: 100%;
}
</style>
<template>
<div class="dataLook">
<div class="dataLook" v-loading="!loding">
<div class="nav">
<el-row :gutter="70">
<el-col :span="18">
<el-row :gutter="70">
<el-col :span="8" class="type-box">
<el-col :span="12" class="type-box">
<div>
<div class="danris " :class="{active: navActive == 0 ? 'active' : ''}" @click="setNavActive(0)">
单日数据展示图
......@@ -187,71 +192,65 @@
<div class="xilie">
<div>系列</div>
<div>
<el-select v-model="value" filterable placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-cascader class="width-100" :options="lineList" :props="{ checkStrictly: true }" v-model="selectedRegion" change-on-select/>
</div>
</div>
</el-col>
<el-col :span="8">
<!-- <el-col :span="8">
<div class="xilie">
<div>年度</div>
<div>
<el-date-picker
@change="init"
v-model="StartTime"
value-format="yyyy-MM-dd"
type="date"
placeholder="选择日期">
</el-date-picker>
</div>
</div>
</el-col>
</el-col> -->
</el-row>
</el-col>
<el-col :span="6" class="name">
微途科技数据看板
印象之旅线路看板
</el-col>
</el-row>
</div>
<div class="content">
<el-row :gutter="40">
<el-col :span="16">
<lineChart />
<lineChart v-if="chartShow" :zoom="zoom" :preferpriceList="preferpriceList" :guestnumList="guestnumList" :clickcountList="clickcountList" :ordercountList="ordercountList" :unitpriceList="unitpriceList" :day_total_guestprice="day_total_guestprice" :dateList="dateList"/>
</el-col>
<el-col :span="8">
<div class="right-data">
<!-- 报名人数 -->
<div>
<div class="tab"><span>报名人数</span></div>
<div class="tab pingfangR"><span>报名人数</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_avg_num && day_avg_num.length > 0">
<div class="item">
<div>5日平均</div>
<div>
39 <img src="../../assets/img/viitto/lvsedian.png" alt="">
{{(day_avg_num[0].OrderAvgCount + '').split('.')[0]}} <img src="../../assets/img/viitto/lvsedian.png" alt="">
</div>
</div>
<div class="item">
<!-- <div class="item">
<div>10日平均</div>
<div>
40 <img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
{{Math.round(day_avg_num[1].OrderAvgCount* 100) / 100}}{{day_avg_num[1].OrderAvgCount}} <img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div> -->
<div class="item">
<div>20日平均</div>
<div>
32 <img src="../../assets/img/viitto/hongsedian.png" alt="">
{{(day_avg_num[2].OrderAvgCount + '').split('.')[0]}} <img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div>
<div class="item">
<div>60日平均</div>
<div>
28 <img src="../../assets/img/viitto/hongsedian.png" alt="">
{{(day_avg_num[3].OrderAvgCount + '').split('.')[0]}} <img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div>
</div>
......@@ -260,129 +259,129 @@
<!-- 线路占比 -->
<div>
<div class="tab"><span>线路占比</span></div>
<div class="tab pingfangR"><span>线路占比</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_line_statics && day_line_statics.length > 0">
<div class="item">
<div>30日平均</div>
<div>
39<span class="sub">%</span><img src="../../assets/img/viitto/lvsedian.png" alt="">
{{day_line_statics[0].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/lvsedian.png" alt="">
</div>
</div>
<div class="item">
<div>60日平均</div>
<div>
40<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
{{day_line_statics[1].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div>
<div class="item">
<div>90日平均</div>
<div>
32<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
{{day_line_statics[1].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div>
<div class="item">
<!-- <div class="item">
<div>180日平均</div>
<div>
28<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
{{day_line_statics[1].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div>
</div> -->
</div>
<!-- 报名单 -->
<div>
<div class="tab"><span>报名单</span></div>
<div class="tab pingfangR"><span>报名单</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_order_statics && day_order_statics.length > 0">
<div class="item">
<div>当日</div>
<div class="bl-color">
39
{{(day_order_statics[0].OrderCount + '').split('.')[0]}}
</div>
</div>
<div class="item">
<div>5日平均</div>
<div>
40
{{(day_order_statics[1].OrderCount + '').split('.')[0]}}
</div>
</div>
<div class="item">
<div>10日平均</div>
<div>
32
{{(day_order_statics[2].OrderCount + '').split('.')[0]}}
</div>
</div>
</div>
<!-- 产品点击 -->
<div>
<div class="tab"><span>产品点击</span></div>
<div class="tab pingfangR"><span>产品点击</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_click_statics && day_click_statics.length > 0">
<div class="item">
<div>当日</div>
<div class="pink-color">
39
{{(day_click_statics[0].ClickCount + '').split('.')[0]}}
</div>
</div>
<div class="item">
<div>5日平均</div>
<div>
40
{{(day_click_statics[1].ClickCount + '').split('.')[0]}}
</div>
</div>
<div class="item">
<div>10日平均</div>
<div>
32
{{(day_click_statics[2].ClickCount + '').split('.')[0]}}
</div>
</div>
</div>
<!-- 历史卖价 -->
<div>
<div class="tab"><span>历史卖价</span></div>
<div class="tab pingfangR"><span>历史卖价</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_history_price && day_history_price.length > 0">
<div class="item">
<div>最高</div>
<div class="red-color">
12896.<span class="sub">00</span>
{{Math.round(day_history_price[0].MaxPrice* 100) / 100}}<span class="sub"></span>
</div>
</div>
<div class="item">
<div>最低</div>
<div>
98688.<span class="sub">00</span>
{{Math.round(day_history_price[0].MinPrice* 100) / 100}}<span class="sub"></span>
</div>
</div>
<div class="item">
<div>平均</div>
<div class="gree-color">
10228.<span class="sub">00</span>
{{Math.round(day_history_price[0].AvgPrice* 100) / 100}}<span class="sub"></span>
</div>
</div>
</div>
<!-- 成交量 -->
<div>
<div class="tab"><span>成交量</span></div>
<div class="tab pingfangR"><span>成交量</span></div>
</div>
<div class="item-box">
<div class="item-box" v-if="day_history_preferprice && day_history_preferprice.length > 0">
<div class="item">
<div>最高</div>
<div class="org-color">
12896.<span class="sub">00</span>
{{day_history_preferprice[0].MaxPreferPrice}}<span class="sub"></span>
</div>
</div>
<div class="item">
<div>最低</div>
<div>
98688.<span class="sub">00</span>
{{day_history_preferprice[0].MinPreferPrice}}<span class="sub"></span>
</div>
</div>
<div class="item">
<div>平均</div>
<div>
10228.<span class="sub">00</span>
{{day_history_preferprice[0].AvgPreferPrice}}<span class="sub"></span>
</div>
</div>
</div>
......@@ -401,33 +400,138 @@ export default {
},
data(){
return {
selectedRegion: [],
navActive: 0,
options: [],
value: '',
value1: '',
StartTime: ''
StartTime: '',
day_avg_num: [],
day_history_price: [{}],
clickcountList: [],
guestnumList: [],
preferpriceList: [],
ordercountList: [],
unitpriceList: [],
dateList: [],
chartShow: false,
lineList: [],
prolineId: 0,
slineId: 0,
LineTeamList: [],
day_order_statics: [],
day_click_statics: [],
day_history_preferprice: [],
zoom: 1,
day_line_statics: [],
day_total_guestprice: {},
loding: false,
}
},
watch: {
selectedRegion(nv) {
this.loadRegionChild(nv)
},
},created(){
this.apipost("line_post_GetAllList_V2", {LineDirection: 0}, res => {
if (res.data.resultCode == 1) {
let data = res.data.data;
data.map(x=>{
x.label = x.LineName,
x.value = x.LineID,
x.children = []
})
this.lineList = data
}
});
},mounted() {
let nowDay = new Date().toLocaleDateString();
this.StartTime = nowDay;
let Height = window.innerHeight
this.zoom = Math.round((Height/1080) * 100) / 100
var day2 = new Date();
day2.setTime(day2.getTime());
var s2 = day2.getFullYear()+"-" + (day2.getMonth()+1) + "-" + day2.getDate();
this.StartTime = s2;
this.init()
// setTimeout(() => {
// this.init()
// }, 1000);
},methods:{
loadRegionChild(regionIdArr) {
let lineId = 0,
slineId = 0;
if (regionIdArr.length == 1) {
lineId = regionIdArr[0]
} else {
slineId = regionIdArr[1]
}
if (this.prolineId == lineId) {
return
}
this.prolineId = lineId
this.slineId = slineId
this.init()
this.apipost("team_post_GetList", {
lineID: lineId,
isTOOP: 1
}, res => {
if (res.data.resultCode == 1) {
let data = res.data.data;
data.map(x=>{
x.value = x.LtID
x.label = x.LtName
})
this.lineList.map(x=>{
if (x.value == lineId) {
x.children = data
}
})
}
});
} ,
init(){
this.loding = false;
this.chartShow = false;
let url='http://47.96.23.199:5001/api/order/get_single_data'
let msg={
startdate: this.StartTime,
lineid: 0,
ltid: 0
lineid: this.prolineId,
ltid: this.slineId
}
this.apiRequest(url,msg,r=>{
this.apiRequest(url,{msg:msg},r=>{
if(r.data.resultCode==1){
console.log(r)
let data = r.data.data;
this.day_avg_num = data.day_avg_num
this.day_history_price = data.day_history_price
this.day_order_statics = data.day_order_statics
this.day_click_statics = data.day_click_statics
this.day_history_preferprice = data.day_history_preferprice
this.day_line_statics = data.day_line_statics
// 点击
this.clickcountList = data.day_guestprice.clickcountList
// 人数
this.guestnumList = data.day_guestprice.guestnumList
// 钱
this.unitpriceList = data.day_guestprice.unitpriceList
// 成交
this.preferpriceList = data.day_guestprice.preferpriceList
// 报名单
this.ordercountList = data.day_guestprice.ordercountList
// 时间
this.dateList = data.day_guestprice.dateList
// 合计
this.day_total_guestprice = data.day_total_guestprice[0]
this.chartShow = true;
this.$forceUpdate()
}else{
this.Error(r.data.message);
}
this.loding = true;
});
},
setNavActive: function(n){
......
src/components/viitto/lineChart.vue
View file @ 126f40e0
......@@ -25,26 +25,43 @@
}
</style>
<template>
<div class="myecharts" ref="myecharts">
<div class="myecharts" ref="myecharts" >
</div>
</template>
<script>
let timeData = ['2:00', '3:00', '4:00', '5:00', '6:00', '7:00', '8:00', '9:00', '10:00', '11:00', '12:00']
let preferpriceList = [],guestnumList = [],clickcountList = [],ordercountList = [],unitpriceList = [],day_total_guestprice = [],dateList = [];
let myChart = null
export default {
components: {
},
props:[
'preferpriceList',
'guestnumList',
'clickcountList',
'ordercountList',
'unitpriceList',
'day_total_guestprice',
'dateList',
'zoom'
],
data(){
return {
}
},created(){
},mounted() {
myChart = this.$echarts.init(this.$refs.myecharts);
preferpriceList = this.preferpriceList
guestnumList = this.guestnumList
clickcountList = this.clickcountList
ordercountList = this.ordercountList
unitpriceList = this.unitpriceList
day_total_guestprice = this.day_total_guestprice
dateList = this.dateList
this.init()
},methods:{
init() {
let myChart = this.$echarts.init(this.$refs.myecharts);
var dataAxis = [];
let _this = this;
let option = {
textStyle: {
fontFamily: 'PINGFANG REGULAR',
......@@ -65,7 +82,39 @@ export default {
backgroundColor: '#E62382',
confine: true,
},
dataZoom: [
{
show: true,
realtime: true,
start: 99,
end: 100,
xAxisIndex: [0, 1],
textStyle: {
color: "#ffffff"
},
dataBackground: {
lineStyle: {
color: '#ffffff'
}
}
},
{
type: 'inside',
realtime: true,
start: 99,
end: 100,
xAxisIndex: [0, 1],
bottom: 0,
textStyle: {
color: "#ffffff"
},
dataBackground: {
lineStyle: {
color: '#ffffff'
}
}
}
],
axisPointer: {
snap: true,
link: {xAxisIndex: 'all'}
......@@ -74,70 +123,77 @@ export default {
grid: [{
left: 50,
right: 50,
height: '17%'
}, {
left: 50,
right: 50,
top: '31%',
height: '17%'
}, {
left: 50,
right: 50,
top: '55%',
height: '17%'
}, {
left: 50,
right: 50,
top: '80%',
height: '17%'
}],
// height: '17%'
}
// , {
// left: 50,
// right: 50,
// top: '31%',
// height: '17%'
// }, {
// left: 50,
// right: 50,
// top: '55%',
// height: '17%'
// }, {
// left: 50,
// right: 50,
// top: '80%',
// height: '17%'
// }
],
xAxis : [
{
type : 'category',
boundaryGap : false,
data: timeData,
"show": false,
data: dateList,
// "show": false,
axisLabel: {
color: '#fff',
formatter: function (value, index) {
return value.substring(0, 10);
}
},
{
type : 'category',
boundaryGap : false,
data: timeData,
"show": false,
},
{
gridIndex: 1,
type : 'category',
boundaryGap : false,
data: timeData,
position: 'bottom',
"show": false
},
{
gridIndex: 2,
type : 'category',
boundaryGap : false,
data: timeData,
position: 'bottom',
data: dateList,
"show": false,
},
{
gridIndex: 3,
type : 'category',
boundaryGap : false,
data: timeData,
position: 'bottom',
"show": true,
axisLabel: {
color: '#fff',
},
}
// {
// gridIndex: 1,
// type : 'category',
// boundaryGap : false,
// data: _this.dateList,
// position: 'bottom',
// "show": false
// },
// {
// gridIndex: 2,
// type : 'category',
// boundaryGap : false,
// data: _this.dateList,
// position: 'bottom',
// "show": false,
// },
// {
// gridIndex: 3,
// type : 'category',
// boundaryGap : false,
// data: _this.dateList,
// position: 'bottom',
// "show": true,
// axisLabel: {
// color: '#fff',
// },
// }
],
yAxis : [
{
gridIndex: 0,
name : '人数 5人',
name : '人数 '+ _this.day_total_guestprice.GuestNum +'人',
type : 'value',
max : 100,
splitLine: {
lineStyle: {
color: '#30374E',
......@@ -158,7 +214,6 @@ export default {
name : '价格',
type : 'value',
position: 'right',
max : 59999,
splitLine: {
show: false,
lineStyle: {
......@@ -175,66 +230,66 @@ export default {
color: '#12BBFF',
},
},
{
gridIndex: 1,
name : '成交总量 ￥688.55元',
type : 'value',
inverse: false,
splitLine: {
lineStyle: {
color: '#30374E',
type: 'dashed'
}
},
nameTextStyle: {
color: '#ffffff',
padding: [0, 0, 0, 160],
fontSize: 18
},
axisLabel: {
color: '#F5AF19',
}
},
{
gridIndex: 2,
name : '报名单数 88',
type : 'value',
inverse: false,
splitLine: {
lineStyle: {
color: '#30374E',
type: 'dashed'
}
},
nameTextStyle: {
color: '#ffffff',
padding: [0, 0, 0, 80],
fontSize: 18
},
axisLabel: {
color: '#3FD2F3',
}
},
{
gridIndex: 3,
name : '产品点击 1699',
type : 'value',
inverse: false,
splitLine: {
lineStyle: {
color: '#30374E',
type: 'dashed'
}
},
nameTextStyle: {
color: '#ffffff',
padding: [10, 0, 0, 110],
fontSize: 18
},
axisLabel: {
color: '#EE4454',
}
}
// {
// gridIndex: 1,
// name : '成交总量 ￥'+ _this.day_total_guestprice.PreferPrice +'元',
// type : 'value',
// inverse: false,
// splitLine: {
// lineStyle: {
// color: '#30374E',
// type: 'dashed'
// }
// },
// nameTextStyle: {
// color: '#ffffff',
// padding: [0, 0, 0, 160],
// fontSize: 18
// },
// axisLabel: {
// color: '#F5AF19',
// }
// },
// {
// gridIndex: 2,
// name : '报名单数 '+ _this.day_total_guestprice.OrderCount,
// type : 'value',
// inverse: false,
// splitLine: {
// lineStyle: {
// color: '#30374E',
// type: 'dashed'
// }
// },
// nameTextStyle: {
// color: '#ffffff',
// padding: [0, 0, 0, 80],
// fontSize: 18
// },
// axisLabel: {
// color: '#3FD2F3',
// }
// },
// {
// gridIndex: 3,
// name : '产品点击 '+ _this.day_total_guestprice.ClickCount,
// type : 'value',
// inverse: false,
// splitLine: {
// lineStyle: {
// color: '#30374E',
// type: 'dashed'
// }
// },
// nameTextStyle: {
// color: '#ffffff',
// padding: [10, 0, 0, 110],
// fontSize: 18
// },
// axisLabel: {
// color: '#EE4454',
// }
// }
],
series : [
{
......@@ -246,18 +301,19 @@ export default {
hoverAnimation: true,
smooth: true,
showSymbol: false,
data:[4,15,20,29,5,18,12,23,26,10,21],
data: guestnumList,
itemStyle: {
borderWidth: 2,
color: '#0F56FF',
shadowBlur: 10,
shadowColor: 'rgba(255,250,0,1)'
},
sampling: 'average',
lineStyle: {
color: "#12BBFF",
shadowBlur: 10,
width: 5,
shadowColor: "#0F56FF"
shadowBlur: 0,
width: 2,
// shadowColor: "#0F56FF"
},
areaStyle: {
normal: {
......@@ -281,7 +337,8 @@ export default {
smooth: true,
// symbol: 'none',
showSymbol: false,
data:[5,15.02,4,45,1988.95,15888.65,888.66,666,5466.88,1536,1235,2334.56],
data: unitpriceList,
sampling: 'average',
itemStyle: {
borderWidth: 2,
color: '#44D6AC',
......@@ -290,9 +347,9 @@ export default {
},
lineStyle: {
color: "#A7DE8A",
shadowBlur: 10,
width: 5,
shadowColor: "#44D6AC"
shadowBlur: 0,
width: 2,
// shadowColor: "#44D6AC"
},
areaStyle: {
normal: {
......@@ -303,101 +360,101 @@ export default {
}
},
},
{
name:'成交总量',
type:'line',
xAxisIndex: 2,
yAxisIndex: 2,
symbolSize: 2,
hoverAnimation: true,
smooth: true,
showSymbol: false,
data: [23,88,12,45,26,33,24,26,28,26,29],
itemStyle: {
borderWidth: 2,
color: '#F5AF19',
shadowBlur: 10,
shadowColor: 'rgba(255,250,0,1)'
},
lineStyle: {
color: "#F5AF19",
shadowBlur: 10,
width: 5,
shadowColor: "#F5AF19"
},
areaStyle: {
normal: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "rgba(245,175,25,1)" },
{ offset: 1, color: "rgba(245,175,25,0)" }
])
}
},
}
,
{
name:'报名单数',
type:'line',
xAxisIndex: 3,
yAxisIndex: 3,
symbolSize: 2,
hoverAnimation: true,
smooth: true,
showSymbol: false,
data: [8,5,6,7,11,2,6,8,4,5,5],
itemStyle: {
borderWidth: 2,
color: '#3FD2F3',
shadowBlur: 10,
shadowColor: 'rgba(255,250,0,1)'
},
lineStyle: {
color: "#9345F8",
shadowBlur: 10,
width: 5,
shadowColor: "#3FD2F3"
},
areaStyle: {
normal: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "rgba(147,69,248,1)" },
{ offset: 1, color: "rgba(147,69,248,0)" }
])
}
},
}
,
{
name:'产品点击',
type:'line',
xAxisIndex: 4,
yAxisIndex: 4,
symbolSize: 2,
hoverAnimation: true,
smooth: true,
showSymbol: false,
data: [67,96,33,108,222,68,156,263,108,123,12],
itemStyle: {
borderWidth: 2,
color: '#EE4454',
shadowBlur: 10,
shadowColor: 'rgba(255,250,0,1)'
},
lineStyle: {
color: "#FFAA85",
width: 5,
shadowBlur: 10,
shadowColor: "#EE4454"
},
areaStyle: {
normal: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "rgba(239,71,86,1)" },
{ offset: 1, color: "rgba(239,71,86,0)" }
])
}
},
}
// {
// name:'成交总量',
// type:'line',
// xAxisIndex: 2,
// yAxisIndex: 2,
// symbolSize: 2,
// hoverAnimation: true,
// smooth: true,
// showSymbol: false,
// data: _this.preferpriceList,
// itemStyle: {
// borderWidth: 2,
// color: '#F5AF19',
// shadowBlur: 10,
// shadowColor: 'rgba(255,250,0,1)'
// },
// lineStyle: {
// color: "#F5AF19",
// shadowBlur: 10,
// width: 5,
// shadowColor: "#F5AF19"
// },
// areaStyle: {
// normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
// { offset: 0, color: "rgba(245,175,25,1)" },
// { offset: 1, color: "rgba(245,175,25,0)" }
// ])
// }
// },
// }
// ,
// {
// name:'报名单数',
// type:'line',
// xAxisIndex: 3,
// yAxisIndex: 3,
// symbolSize: 2,
// hoverAnimation: true,
// smooth: true,
// showSymbol: false,
// data: _this.ordercountList,
// itemStyle: {
// borderWidth: 2,
// color: '#3FD2F3',
// shadowBlur: 10,
// shadowColor: 'rgba(255,250,0,1)'
// },
// lineStyle: {
// color: "#9345F8",
// shadowBlur: 10,
// width: 5,
// shadowColor: "#3FD2F3"
// },
// areaStyle: {
// normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
// { offset: 0, color: "rgba(147,69,248,1)" },
// { offset: 1, color: "rgba(147,69,248,0)" }
// ])
// }
// },
// }
// ,
// {
// name:'产品点击',
// type:'line',
// xAxisIndex: 4,
// yAxisIndex: 4,
// symbolSize: 2,
// hoverAnimation: true,
// smooth: true,
// showSymbol: false,
// data: _this.clickcountList,
// itemStyle: {
// borderWidth: 2,
// color: '#EE4454',
// shadowBlur: 10,
// shadowColor: 'rgba(255,250,0,1)'
// },
// lineStyle: {
// color: "#FFAA85",
// width: 5,
// shadowBlur: 10,
// shadowColor: "#EE4454"
// },
// areaStyle: {
// normal: {
// color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
// { offset: 0, color: "rgba(239,71,86,1)" },
// { offset: 1, color: "rgba(239,71,86,0)" }
// ])
// }
// },
// }
]
}
myChart.setOption(option);
......
src/components/viitto/viittoData.vue
View file @ 126f40e0
......@@ -290,7 +290,7 @@ ul li {
</style>
<template>
<div class="viittoData" v-if="dataList">
<div class="viittoData" v-if="dataList" :style="{zoom: zoom}">
<div class="content-box" style="width:96%;margin:0 auto">
<el-col :span="7">
<el-row class="left-top">
......@@ -416,9 +416,12 @@ export default {
dataList: null,
//标点
dataArea:[],
num:1
num:1,
zoom: 1,
}
},mounted() {
let Height = window.innerHeight
this.zoom = Math.round((Height/1080) * 100) / 100
this.init();
setTimeout(() => {
this.connec();
......
src/components/viitto/viittoData2.vue
View file @ 126f40e0
......@@ -239,7 +239,7 @@
}
</style>
<template>
<div class="viittoData2">
<div class="viittoData2" :style="{zoom: zoom}">
<el-row class="viittoRow">
<el-col :span="5">
<div class="clearfix" style="visibility:hidden">
......@@ -356,10 +356,13 @@ export default {
//传递子组件活跃用户
ActiveArr:[],
//传递不活跃用户
InActiveArr:[]
InActiveArr:[],
zoom: 1
};
},
mounted() {
let Height = window.innerHeight
this.zoom = Math.round((Height/1080) * 100) / 100
this.getB2BAddress();
this.getdata();
setTimeout(() => {
......
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