Skip to content

M
Muse
Commit 6f12d720 authored by zhengke's avatar zhengke
Browse files
Options

修改

parent 55128f11
Show whitespace changes
Inline Side-by-side
Showing with 116 additions and 104 deletions
src/components/viitto/saleGuestTable.vue
View file @ 6f12d720
......@@ -130,32 +130,10 @@
</tr>
<tr class="saleSecondTh">
<th></th>
<template v-for="item in companyList">
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
<th>销售额</th>
<th>收客人数</th>
</template>
</th>
</tr>
</thead>
......@@ -177,6 +155,7 @@ export default {
data(){
return {
loading:false,
oldDataList:[],
dataList:[],
msg:{
yearstr:0,
......@@ -207,43 +186,9 @@ export default {
let url='http://47.96.23.199:5001/api/order/get_sale_numandpreferprice_statistics'
this.apiRequest(url,{msg:this.msg},r=>{
if(r.data.resultCode==1){
console.log(r,'errrrrr');
this.oldDataList=r.data.data;
let data = r.data.data;
this.dataList=data;
this.getCompany(data);
let tempArr = [];
// for (let i = 0; i < data.length; i++) {
// if (tempArr.indexOf(data[i].MonthStr) === -1) {
// this.dataList.push({
// month: data[i].MonthStr,
// List: [data[i]]
// });
// tempArr.push(data[i].MonthStr);
// } else {
// for (let j = 0; j < this.dataList.length; j++) {
// if (this.dataList[j].month == data[i].MonthStr) {
// this.dataList[j].List.push(data[i]);
// break;
// }
// }
// }
// }
// console.log(this.dataList,'datalist');
// //数量不够push空
// this.dataList.forEach(x=>{
// if(x.List.length<this.companyList.length){
// for(var i=0;i<this.companyList.length-x.List.length;i++){
// x.List.push({
// GuestNum:'',
// MonthStr:'',
// OutBranchName:'',
// PreferPrice:'',
// RB_Branch_Id:'',
// YearStr:''
// })
// }
// }
// })
}
})
},
......@@ -259,11 +204,10 @@ export default {
}
}
let Arr = [];
this.companyList.forEach((cItem, cIndex) => {
let Arr2=[];
this.dataList = [];
this.monthList.forEach((mItem, mIndex) => {
let Arr2=[];
this.companyList.forEach((cItem, cIndex) => {
var bMonth = this.getOtherMonth(cItem.RB_Branch_Id, mItem);
let Obj = {
GuestNum:0,
......@@ -274,39 +218,38 @@ export default {
YearStr:''
}
if (bMonth) {
console.log(bMonth,'bMonth');
Obj.GuestNum=bMonth.GuestNum
Obj.MonthStr=bMonth.MonthStr
Obj.OutBranchName=bMonth.OutBranchName
Obj.PreferPrice=bMonth.PreferPrice
Obj.RB_Branch_Id=bMonth.RB_Branch_Id
Obj.YearStr=bMonth.YearStr
console.log(Arr2,'Arrrrrrrr');
let Obj = {
GuestNum:bMonth.GuestNum,
MonthStr:bMonth.MonthStr,
OutBranchName:bMonth.OutBranchName,
PreferPrice:bMonth.PreferPrice,
RB_Branch_Id:bMonth.RB_Branch_Id,
YearStr:bMonth.YearStr
}
Arr2.push(Obj);
} else {
Obj.GuestNum=0
Obj.MonthStr=bMonth.MonthStr
Obj.OutBranchName=bMonth.OutBranchName
Obj.PreferPrice=0
Obj.RB_Branch_Id=bMonth.RB_Branch_Id
Obj.YearStr=bMonth.YearStr
let Obj = {
GuestNum:0,
MonthStr:mItem,
OutBranchName:cItem.OutBranchName,
PreferPrice:0,
RB_Branch_Id:0,
YearStr:''
}
Arr2.push(Obj)
}
Arr2.push(obj)
});
var obj = {
month: cItem.MonthStr,
month: mItem,
List:Arr2,
};
Arr.push(obj);
this.dataList.push(obj);
});
// console.log(Arr,'Arrrrrrrr');
},
getOtherMonth(branchId, monthStr) {
var obj = "";
this.dataList.forEach(dItem => {
this.oldDataList.forEach(dItem => {
if (dItem.RB_Branch_Id == branchId && monthStr == dItem.MonthStr) {
obj = dItem;
}
......
src/components/viitto/salesGuestList.vue
View file @ 6f12d720
......@@ -111,18 +111,51 @@
margin-right: 5px;
}
.MapIcon {
/* float:right; */
color: #fff;
text-align: right;
/* margin-top:10px; */
width:234px;
height:27px;
background-color: #151A30;
line-height: 27px;
border-radius:14px;
position: absolute;
z-index:9999;
right:0;
}
.MapIcon img{
width:14px;
position: relative;
top:1px;
}
.MapIcon span {
display: inline-block;
margin-right: 10px;
font-size:14px;
width:33%;
text-align: center;
cursor: pointer;
}
.checkedSpan{
color:#459BC7;
.saleSlider{
width:33%;
height:100%;
position: absolute;
left:0;
background: -webkit-gradient(
linear,
left top,
right top,
from(rgba(147, 69, 248, 1)),
to(rgba(63, 210, 243, 1))
);
background: linear-gradient(
90deg,
rgba(147, 69, 248, 1),
rgba(63, 210, 243, 1)
);
border-radius: 14px;
color: white;
text-align: center;
line-height: 27px;
color:#fff;
}
</style>
<template>
......@@ -141,7 +174,7 @@
<div>
<el-select v-model="msg.yearstr" placeholder="请选择" @change="getList" popper-class="company-class">
<el-option label="不限" :value="-1"></el-option>
<el-option v-for="item in yearList" :label="item" :value="item"></el-option>
<el-option v-for="(item,index) in yearList" :key="index" :label="item" :value="item"></el-option>
</el-select>
</div>
</div>
......@@ -176,10 +209,23 @@
</el-row>
</div>
<div class="content" >
<div style="position:relative;">
<div class="MapIcon">
<span @click="getAll()" :class="{'checkedSpan':checkIndex==1}">不限</span>
<span @click="LineMap()" :class="{'checkedSpan':checkIndex==2}">折线图</span>
<span @click="BarMap()" :class="{'checkedSpan':checkIndex==3}">柱状图</span>
<span @click="getAll()"><img src="../../assets/img/viitto/buxianIcon.png"/>&nbsp;不限</span>
<span @click="LineMap()"><img src="../../assets/img/viitto/quxian.png"/>&nbsp;折线图</span>
<span @click="BarMap()"><img src="../../assets/img/viitto/zhuzhuang.png"/>&nbsp;柱状图</span>
<span class="saleSlider" ref="saleSlider">
<template v-if="checkIndex==1">
<img src="../../assets/img/viitto/buxianIcon.png"/>&nbsp;不限
</template>
<template v-if="checkIndex==2">
<img src="../../assets/img/viitto/quxian.png"/>&nbsp;折线图
</template>
<template v-if="checkIndex==3">
<img src="../../assets/img/viitto/zhuzhuang.png"/>&nbsp;柱状图
</template>
</span>
</div>
</div>
<div class="myecharts" ref="myecharts" >
......@@ -239,7 +285,7 @@ export default {
getCompany(dataList) {
this.Mydatalist=[];
this.companyList = [];
this.monthList = [];
this.monthList = [1,2,3,4,5,6,7,8,9,10,11,12];
var obj = {};
if (dataList && dataList.length > 0) {
for (var i = 0; i < dataList.length; i++) {
......@@ -247,10 +293,10 @@ export default {
this.companyList.push(dataList[i]);
obj[dataList[i].OutBranchName] = true;
}
if (!obj[dataList[i].MonthStr]) {
this.monthList.push(dataList[i].MonthStr);
obj[dataList[i].MonthStr] = true;
}
// if (!obj[dataList[i].MonthStr]) {
// this.monthList.push(dataList[i].MonthStr);
// obj[dataList[i].MonthStr] = true;
// }
}
}
let Arr = [];
......@@ -322,6 +368,7 @@ export default {
//点击切换为折现图
LineMap() {
this.animate(this.$refs.saleSlider,75)
this.checkIndex=2;
let newArr = JSON.parse(JSON.stringify(this.Mydatalist));
let myArr = [];
......@@ -350,6 +397,7 @@ export default {
//点击切换为柱状图
BarMap() {
this.checkIndex=3;
this.animate(this.$refs.saleSlider,155)
let newArr = this.Mydatalist;
let myArr = [];
newArr.forEach(x => {
......@@ -374,8 +422,10 @@ export default {
});
this.init(companyArr1,myArr);
},
//切换为所有
getAll(){
this.checkIndex=1;
this.animate(this.$refs.saleSlider,0)
let companyArr1 = [];
this.companyList.forEach((item, index) => {
let obj2 = {
......@@ -393,6 +443,25 @@ export default {
});
this.init(companyArr1,this.Mydatalist);
},
//移动方法
animate(element, target) {
//清理定时器
clearInterval(element.timeId);
element.timeId = setInterval(function () {
//获取元素的当前位置
var current = element.offsetLeft;
//移动的步数
var step = 10;
step = target > current ? step : -step;
current += step;
if (Math.abs(current - target) > Math.abs(step)) {
element.style.left = current + "px";
} else {
clearInterval(element.timeId);
element.style.left = target + "px";
}
}, 20);
},
//获取年份
getYear() {
var myDate = new Date();
......
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