Skip to content

H
hu-shoujijingfen-h5
Commit 90898223 by chenweisong
Options

营销模块改bug

parent e90d9907
Showing with 159 additions and 34 deletions
src/libs/urls.js
...@@ -152,7 +152,9 @@ export const urls = { ...@@ -152,7 +152,9 @@ export const urls = {
// 网络营销 指标列表 // 网络营销 指标列表
data483: "mobile/data/483", data483: "mobile/data/483",
// 网络营销 大类接口
data402: "mobile/data/402",
dataPublic402: "mobile/public/data/402",
// 网络营销 判断是否把当前用户权限升级到全省 // 网络营销 判断是否把当前用户权限升级到全省
isInRiseList: "mobile/user/isInRiseList", isInRiseList: "mobile/user/isInRiseList",
......
src/views/app/gridMarketing.vue
...@@ -68,6 +68,11 @@ ...@@ -68,6 +68,11 @@
v-if="popObjMouth.visable" v-if="popObjMouth.visable"
:obj="popObjMouth"></Popup> :obj="popObjMouth"></Popup>
</div> </div>
<div class="select-bar">
<select @change="handleSelect">
<option :key="i" v-for="(item,i) in categories" :value="item.id">{{item.name}}</option>
</select>
</div>
</div> </div>
<div ref="kpiRef" class="kpis"> <div ref="kpiRef" class="kpis">
<div class="kpi" :style="{width: kpiWidth}"> <div class="kpi" :style="{width: kpiWidth}">
...@@ -90,12 +95,13 @@ ...@@ -90,12 +95,13 @@
<table v-if="isShowTable" class="table" cellpadding="0" cellspacing="0" ref="table"> <table v-if="isShowTable" class="table" cellpadding="0" cellspacing="0" ref="table">
<thead ref="theadDetails"> <thead ref="theadDetails">
<tr> <tr>
<th width="33.33333%" class="rows cross">区域</th> <th width="25%" class="rows cross">区域</th>
<template v-if="tabActive === 1"> <template v-if="tabActive === 1">
<th class="rows" v-if="!hide">目标值</th> <th class="rows" v-if="!hide">目标值</th>
<th width="33.33333%" class="rows">完成值</th> <th width="25%" class="rows">完成值</th>
<th class="rows" v-if="!hide">完成进度</th> <th class="rows" v-if="!hide">完成进度</th>
<th width="33.33333%" class="rows">环比</th> <th width="25%" class="rows">环比</th>
<th width="25%" class="rows">在网用户数</th>
<th v-if=" !hide && selectArea.level >= 1" class="rows">省内排名</th> <th v-if=" !hide && selectArea.level >= 1" class="rows">省内排名</th>
<th v-if=" !hide && selectArea.level >= 2" class="rows">市内排名</th> <th v-if=" !hide && selectArea.level >= 2" class="rows">市内排名</th>
<th v-if=" !hide && selectArea.level >= 3" class="rows">县内排名</th> <th v-if=" !hide && selectArea.level >= 3" class="rows">县内排名</th>
...@@ -126,6 +132,7 @@ ...@@ -126,6 +132,7 @@
<td>{{b.complete}}</td> <td>{{b.complete}}</td>
<td v-if="!hide">{{b.rate }}</td> <td v-if="!hide">{{b.rate }}</td>
<td>{{b.ratio }}</td> <td>{{b.ratio }}</td>
<td>{{b.cust_num }}</td>
</template> </template>
<template v-if="tabActive === 2"> <template v-if="tabActive === 2">
<td v-if="!hide">{{b.month_task_value}}</td> <td v-if="!hide">{{b.month_task_value}}</td>
...@@ -174,11 +181,13 @@ ...@@ -174,11 +181,13 @@
computed: { computed: {
hide() { hide() {
let item = this.activeKpiItem; let item = this.activeKpiItem;
return !!item.hide; return item && !!item.hide;
} }
}, },
data() { data() {
return { return {
categories: [],
categoriesOrigin: [],
public: true, public: true,
tabActive: REAL_TIME, tabActive: REAL_TIME,
showUpperLevel: false, showUpperLevel: false,
...@@ -293,6 +302,37 @@ ...@@ -293,6 +302,37 @@
} }
}, },
methods: { methods: {
handleSelect(e) {
let id = parseInt(e.target.value);
this.kpiList = [];
this.bodyList = [];
this.activeKpiItem = {};
this.activeKpiCode = "";
let category = this.categories.find((iten) => {
return iten.id === id
});
if (category.children && category.children.length) {
this.kpiList = category.children;
if (this.kpiList.length) {
this.activeKpiItem = this.kpiList[0];
this.activeKpiCode = this.kpiList[0].kpi_code;
this.getData();
}
setTimeout(() => {
let len = 0;
let doms = document.getElementsByClassName("kpi-item");
let length = doms.length;
for (let i = 0; i < doms.length; i++) {
len += doms[i].offsetWidth;
}
let width = window.screen.width;
this.kpiWidth = len <= width ? width + "px" : len + length + "px";
}, 20);
} else {
Toast("指标开发中，敬请期待");
}
},
hidePop(type) { hidePop(type) {
this.popObjMouth.visable = false; this.popObjMouth.visable = false;
this.popObjMouth.remark = ""; this.popObjMouth.remark = "";
...@@ -415,6 +455,7 @@ ...@@ -415,6 +455,7 @@
this.getData(); this.getData();
}, },
// eslint-disable-next-line no-unused-vars
clickKpi(kpiItem, index) { clickKpi(kpiItem, index) {
// console.log({ kpiItem, index }) // console.log({ kpiItem, index })
this.activeKpiItem = kpiItem; this.activeKpiItem = kpiItem;
...@@ -424,16 +465,38 @@ ...@@ -424,16 +465,38 @@
clickTab(type) { clickTab(type) {
this.tabActive = type; this.tabActive = type;
this.kpiList = []; this.kpiList = [];
this.bodyList = [];
this.activeKpiItem = {};
this.activeKpiCode = "";
this.categories = [];
this.$nextTick(() => { this.$nextTick(() => {
for (let i = 0; i < this.kpiListOrigin.length; i++) { this.categories = JSON.parse(JSON.stringify(this.categoriesOrigin)).filter((k) => {
const kpi = this.kpiListOrigin[i]; return k.type === type;
if (kpi.type === type) { });
this.kpiList.push(kpi); let kpiListOrigin = JSON.parse(JSON.stringify(this.kpiListOrigin)).filter((k) => {
return k.type === type;
});
this.categories.forEach((c) => {
let kpis = kpiListOrigin.filter((k) => {
return k.pid === c.id;
});
if (!c.children) {
c.children = [];
} }
} c.children = kpis;
if (this.kpiList.length) { })
if (this.categories[0].children.length) {
this.kpiList = [];
this.kpiList = this.categories[0].children;
this.activeKpiItem = this.kpiList[0]; this.activeKpiItem = this.kpiList[0];
this.activeKpiCode = this.kpiList[0].kpi_code; this.activeKpiCode = this.kpiList[0].kpi_code;
this.showSelectDateValue = formatDateTime(
type === REAL_TIME ? this.activeDate : this.mouthActiveDate,
"YYYY-MM-DD mm:ss"
).slice(0, 10);
this.getData();
} else {
Toast("指标开发中，敬请期待");
} }
setTimeout(() => { setTimeout(() => {
let len = 0; let len = 0;
...@@ -446,13 +509,8 @@ ...@@ -446,13 +509,8 @@
this.kpiWidth = len <= width ? width + "px" : len + length + "px"; this.kpiWidth = len <= width ? width + "px" : len + length + "px";
// console.log('tabWidth :', this.tabWidth) // console.log('tabWidth :', this.tabWidth)
}, 20); }, 20);
this.showSelectDateValue = formatDateTime( console.log(this.categories[0].children);
type === REAL_TIME ? this.activeDate : this.mouthActiveDate,
"YYYY-MM-DD mm:ss"
).slice(0, 10);
this.getData();
}) })
}, },
async fetch() { async fetch() {
let res = null; let res = null;
...@@ -465,31 +523,62 @@ ...@@ -465,31 +523,62 @@
} }
// Indicator.close(); // Indicator.close();
if (res === null) return; if (res === null) return;
this.kpiListOrigin = res; this.kpiListOrigin = res;
this.kpiList = []; this.kpiList = [];
for (let i = 0; i < res.length; i++) { for (let i = 0; i < res.length; i++) {
const r = res[i]; const r = res[i];
if (r.type === REAL_TIME) { this.categories.forEach(category => {
this.kpiList.push(r); if (category.id === r.pid) {
if (!category.children) {
category.children = [];
}
category.children.push(r);
}
})
// if (r.type === REAL_TIME) {
// this.kpiList.push(r);
// }
}
if (this.categories.length && this.categories[0].children) {
this.kpiList = this.categories[0].children;
if (this.kpiList.length) {
this.activeKpiItem = this.kpiList[0];
this.activeKpiCode = this.kpiList[0].kpi_code;
} }
setTimeout(() => {
let len = 0;
let doms = document.getElementsByClassName("kpi-item");
let length = doms.length;
for (let i = 0; i < doms.length; i++) {
len += doms[i].offsetWidth;
}
let width = window.screen.width;
this.kpiWidth = len <= width ? width + "px" : len + length + "px";
// console.log('tabWidth :', this.tabWidth)
}, 20);
} else {
Toast("指标开发中，敬请期待");
} }
if (this.kpiList.length) { // console.log('res :', res)
this.activeKpiItem = this.kpiList[0]; },
this.activeKpiCode = this.kpiList[0].kpi_code; async fetchCategory() {
let res = null;
try {
res = await this.post(this.public ? this.$urls.data402 : this.$urls.dataPublic402, {});
} catch (error) {
console.log("error :", error);
Indicator.close();
return;
} }
// Indicator.close();
setTimeout(() => { if (res === null) return;
let len = 0; this.categoriesOrigin = res;
let doms = document.getElementsByClassName("kpi-item"); res.forEach((c) => {
let length = doms.length; if (c.type == REAL_TIME) {
for (let i = 0; i < doms.length; i++) { this.categories.push(c);
len += doms[i].offsetWidth;
} }
let width = window.screen.width; })
this.kpiWidth = len <= width ? width + "px" : len + length + "px";
// console.log('tabWidth :', this.tabWidth)
}, 20);
// console.log('res :', res)
}, },
async getData() { async getData() {
if (!this.activeKpiCode) { if (!this.activeKpiCode) {
...@@ -855,6 +944,7 @@ ...@@ -855,6 +944,7 @@
this.public = true; this.public = true;
this.isExistedCollect(); this.isExistedCollect();
} }
await this.fetchCategory();
await this.fetch(); await this.fetch();
await this.getData(); await this.getData();
} }
...@@ -986,12 +1076,45 @@ ...@@ -986,12 +1076,45 @@
} }
.select-bar {
position: absolute;
top: 0.21rem;
left: .15rem;
height: 0.5rem;
color: #999;
select {
border: none;
/* //清除select聚焦时候的边框颜色 */
outline: none;
line-height: 0.3rem;
/* //隐藏select的下拉图标 */
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
/* //通过padding-left的值让文字居中 */
text-align: center;
background: transparent;
color: #2b90fa;
font-size: .05rem;
width: 1.58rem;
height: 100%;
option {
font-size: .05rem;
}
}
}
.bore { .bore {
position: absolute; position: absolute;
top: 0.3rem; top: 0.3rem;
right: .35rem; right: .35rem;
height: 0.5rem; height: 0.5rem;
color: #999; color: #999;
font-size: .05rem;
.question { .question {
display: inline-block; display: inline-block;
......
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