|
@@ -1,9 +1,10 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <div class="ABtarage">
|
|
|
|
|
|
|
+ <div class="ABtarage HomeTarget">
|
|
|
|
|
+ <!-- labelStyle 垃圾,不能全匹配,需要特殊处理 -->
|
|
|
<template>
|
|
<template>
|
|
|
- <div class="container linep" style="margin: 0">
|
|
|
|
|
|
|
+ <div class="container linep">
|
|
|
<van-collapse v-model="activeNames">
|
|
<van-collapse v-model="activeNames">
|
|
|
- <div v-for="(homePageItem, index) in homePageIndicatorDate" :key="index">
|
|
|
|
|
|
|
+ <div v-for="(homePageItem, index) in homePageIndicatorList" :key="index">
|
|
|
<van-collapse-item
|
|
<van-collapse-item
|
|
|
v-if="homePageItem.labelStyle == 1"
|
|
v-if="homePageItem.labelStyle == 1"
|
|
|
:name="(index + 1).toString()"
|
|
:name="(index + 1).toString()"
|
|
@@ -13,13 +14,12 @@
|
|
|
<div
|
|
<div
|
|
|
v-for="(periodItem, periodIndex) in homePageItem.children"
|
|
v-for="(periodItem, periodIndex) in homePageItem.children"
|
|
|
:key="'title-' + periodIndex">
|
|
:key="'title-' + periodIndex">
|
|
|
- <van-col span="12">
|
|
|
|
|
|
|
+ <van-col span="12" v-if="periodItem.name">
|
|
|
<span :class="periodIndex % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
|
|
<span :class="periodIndex % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
|
|
|
periodItem.name
|
|
periodItem.name
|
|
|
}}</span>
|
|
}}</span>
|
|
|
</van-col>
|
|
</van-col>
|
|
|
</div>
|
|
</div>
|
|
|
-
|
|
|
|
|
<!-- 动态渲染指标项 -->
|
|
<!-- 动态渲染指标项 -->
|
|
|
<div v-if="homePageItem.children.length >= 2">
|
|
<div v-if="homePageItem.children.length >= 2">
|
|
|
<!-- 遍历第一个周期的所有指标 -->
|
|
<!-- 遍历第一个周期的所有指标 -->
|
|
@@ -31,13 +31,7 @@
|
|
|
<p>
|
|
<p>
|
|
|
{{ metric.name }}:
|
|
{{ metric.name }}:
|
|
|
<span class="colorblack">
|
|
<span class="colorblack">
|
|
|
- <template v-if="metric.indicatorUnit === '%'"
|
|
|
|
|
- >{{ metric.indicatorValue }}%</template
|
|
|
|
|
- >
|
|
|
|
|
- <template v-else>
|
|
|
|
|
- {{ Micrometer(metric.indicatorValue) }}
|
|
|
|
|
- {{ metric.indicatorUnit }}
|
|
|
|
|
- </template>
|
|
|
|
|
|
|
+ {{ metric.indicatorDisplayValue }}
|
|
|
</span>
|
|
</span>
|
|
|
</p>
|
|
</p>
|
|
|
</van-col>
|
|
</van-col>
|
|
@@ -46,20 +40,9 @@
|
|
|
<p>
|
|
<p>
|
|
|
{{ homePageItem.children[1]?.children[metricIndex]?.name || '-' }}:
|
|
{{ homePageItem.children[1]?.children[metricIndex]?.name || '-' }}:
|
|
|
<span class="colorblack">
|
|
<span class="colorblack">
|
|
|
- <template
|
|
|
|
|
- v-if="
|
|
|
|
|
- homePageItem.children[1]?.children[metricIndex]?.indicatorUnit === '%'
|
|
|
|
|
- ">
|
|
|
|
|
- {{ homePageItem.children[1]?.children[metricIndex]?.indicatorValue }}%
|
|
|
|
|
- </template>
|
|
|
|
|
- <template v-else>
|
|
|
|
|
- {{
|
|
|
|
|
- Micrometer(
|
|
|
|
|
- homePageItem.children[1]?.children[metricIndex]?.indicatorValue,
|
|
|
|
|
- )
|
|
|
|
|
- }}
|
|
|
|
|
- {{ homePageItem.children[1]?.children[metricIndex]?.indicatorUnit }}
|
|
|
|
|
- </template>
|
|
|
|
|
|
|
+ {{
|
|
|
|
|
+ homePageItem.children[1]?.children[metricIndex]?.indicatorDisplayValue
|
|
|
|
|
+ }}
|
|
|
</span>
|
|
</span>
|
|
|
</p>
|
|
</p>
|
|
|
</van-col>
|
|
</van-col>
|
|
@@ -76,7 +59,7 @@
|
|
|
v-for="(category, index) in homePageItem.children"
|
|
v-for="(category, index) in homePageItem.children"
|
|
|
:key="index"
|
|
:key="index"
|
|
|
:style="{ marginTop: index > 0 ? '10px' : '0' }">
|
|
:style="{ marginTop: index > 0 ? '10px' : '0' }">
|
|
|
- <van-col span="24">
|
|
|
|
|
|
|
+ <van-col span="24" v-if="category.name">
|
|
|
<span :class="index % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
|
|
<span :class="index % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
|
|
|
category.name
|
|
category.name
|
|
|
}}</span>
|
|
}}</span>
|
|
@@ -90,7 +73,7 @@
|
|
|
:style="labelStyle(item.clickable)"
|
|
:style="labelStyle(item.clickable)"
|
|
|
@click="onClick(item.clickable)"
|
|
@click="onClick(item.clickable)"
|
|
|
class="colorbalck"
|
|
class="colorbalck"
|
|
|
- >{{ Micrometer(item.indicatorValue) }}{{ item.indicatorUnit }}</span
|
|
|
|
|
|
|
+ >{{ item.indicatorDisplayValue }}</span
|
|
|
>
|
|
>
|
|
|
</p>
|
|
</p>
|
|
|
</van-col>
|
|
</van-col>
|
|
@@ -114,7 +97,65 @@
|
|
|
:style="labelStyle(item.clickable)"
|
|
:style="labelStyle(item.clickable)"
|
|
|
@click="onClick(item.clickable)"
|
|
@click="onClick(item.clickable)"
|
|
|
class="colorbalck"
|
|
class="colorbalck"
|
|
|
- >{{ Micrometer(item.indicatorValue) }}{{ item.indicatorUnit }}</span
|
|
|
|
|
|
|
+ >{{ item.indicatorDisplayValue }}</span
|
|
|
|
|
+ >
|
|
|
|
|
+ </p>
|
|
|
|
|
+ </van-col>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </van-row>
|
|
|
|
|
+ </van-collapse-item>
|
|
|
|
|
+ <van-collapse-item
|
|
|
|
|
+ v-if="homePageItem.labelStyle == 4"
|
|
|
|
|
+ :name="(index + 1).toString()"
|
|
|
|
|
+ :title="homePageItem.name">
|
|
|
|
|
+ <!-- 外层循环:遍历主要类别 -->
|
|
|
|
|
+ <template v-for="(category, index) in homePageItem.children">
|
|
|
|
|
+ <van-row
|
|
|
|
|
+ :style="{
|
|
|
|
|
+ width: category.name ? '49%' : '100%',
|
|
|
|
|
+ float: category.name ? 'left' : 'none',
|
|
|
|
|
+ }">
|
|
|
|
|
+ <van-col
|
|
|
|
|
+ span="20"
|
|
|
|
|
+ :class="index % 2 === 0 ? 'leftTitle' : 'rightTitle'"
|
|
|
|
|
+ v-if="category.name">
|
|
|
|
|
+ <span>{{ category.name }}</span>
|
|
|
|
|
+ </van-col>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 内层循环:遍历各个统计项 -->
|
|
|
|
|
+ <div v-for="(item, idx) in category.children" :key="idx">
|
|
|
|
|
+ <van-col :span="24">
|
|
|
|
|
+ <p>
|
|
|
|
|
+ {{ item.name }}:<span
|
|
|
|
|
+ :style="labelStyle(item.clickable)"
|
|
|
|
|
+ @click="onClick(item.clickable)"
|
|
|
|
|
+ class="colorbalck"
|
|
|
|
|
+ >{{ item.indicatorDisplayValue }}</span
|
|
|
|
|
+ >
|
|
|
|
|
+ </p>
|
|
|
|
|
+ </van-col>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </van-row>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </van-collapse-item>
|
|
|
|
|
+ <van-collapse-item
|
|
|
|
|
+ v-if="homePageItem.labelStyle == 5"
|
|
|
|
|
+ :name="(index + 1).toString()"
|
|
|
|
|
+ :title="homePageItem.name">
|
|
|
|
|
+ <!-- 外层循环:遍历主要类别 -->
|
|
|
|
|
+ <van-row
|
|
|
|
|
+ v-for="(category, index) in homePageItem.children"
|
|
|
|
|
+ :key="index"
|
|
|
|
|
+ :style="{ marginTop: index == 0 ? '-10px' : '0' }">
|
|
|
|
|
+ <!-- 内层循环:遍历各个统计项 -->
|
|
|
|
|
+ <div v-for="(item, idx) in category.children" :key="idx">
|
|
|
|
|
+ <van-col :span="24">
|
|
|
|
|
+ <p>
|
|
|
|
|
+ {{ item.name }}:<span
|
|
|
|
|
+ :style="labelStyle(item.clickable)"
|
|
|
|
|
+ @click="onClick(item.clickable)"
|
|
|
|
|
+ class="colorbalck"
|
|
|
|
|
+ >{{ item.indicatorDisplayValue }}</span
|
|
|
>
|
|
>
|
|
|
</p>
|
|
</p>
|
|
|
</van-col>
|
|
</van-col>
|
|
@@ -130,11 +171,19 @@
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
import store from '@/store';
|
|
import store from '@/store';
|
|
|
|
|
+import { userTodayPlanNum, getReportInfo } from '@/api/index';
|
|
|
|
|
+import { mapState } from 'vuex';
|
|
|
export default {
|
|
export default {
|
|
|
name: 'home',
|
|
name: 'home',
|
|
|
|
|
+ computed: {
|
|
|
|
|
+ ...mapState({
|
|
|
|
|
+ reportInfo: (state) => state.user.reportInfo,
|
|
|
|
|
+ }),
|
|
|
|
|
+ },
|
|
|
props: {
|
|
props: {
|
|
|
- homePageIndicatorDate: {
|
|
|
|
|
- type: Array,
|
|
|
|
|
|
|
+ tabVal: {
|
|
|
|
|
+ type: [String, Number],
|
|
|
|
|
+ default: '-1',
|
|
|
},
|
|
},
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
@@ -208,6 +257,25 @@ export default {
|
|
|
GZdata: false,
|
|
GZdata: false,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
|
|
+ watch: {
|
|
|
|
|
+ // tabVal: {
|
|
|
|
|
+ // handler(val) {
|
|
|
|
|
+ // if (val == 2) {
|
|
|
|
|
+ // // keep-alive 模式watch执行了两次
|
|
|
|
|
+ // this.initData();
|
|
|
|
|
+ // }
|
|
|
|
|
+ // },
|
|
|
|
|
+ // immediate: true,
|
|
|
|
|
+ // },
|
|
|
|
|
+ reportInfo: {
|
|
|
|
|
+ handler(val) {
|
|
|
|
|
+ if (val) {
|
|
|
|
|
+ this.initData();
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ immediate: true,
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
methods: {
|
|
methods: {
|
|
|
labelStyle(val) {
|
|
labelStyle(val) {
|
|
|
return {
|
|
return {
|
|
@@ -222,6 +290,72 @@ export default {
|
|
|
this.$router.push({ path: '/noVisit' });
|
|
this.$router.push({ path: '/noVisit' });
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
|
|
+ initData() {
|
|
|
|
|
+ console.log(this.tabVal);
|
|
|
|
|
+ this.getReportInfo();
|
|
|
|
|
+ this.userTodayPlanNum();
|
|
|
|
|
+ },
|
|
|
|
|
+ getReportInfo() {
|
|
|
|
|
+ if (this.reportInfo && this.reportInfo.homePageIndicatorList != null) {
|
|
|
|
|
+ this.homePageIndicatorList = this.reportInfo.homePageIndicatorList;
|
|
|
|
|
+ this.updataTime = this.reportInfo.homePageIndicatorUpdateTime;
|
|
|
|
|
+ }
|
|
|
|
|
+ return;
|
|
|
|
|
+ let loading1 = this.$toast.loading({
|
|
|
|
|
+ duration: 0,
|
|
|
|
|
+ message: '加载中...',
|
|
|
|
|
+ forbidClick: true,
|
|
|
|
|
+ });
|
|
|
|
|
+ getReportInfo({ isContent: false }).then((res) => {
|
|
|
|
|
+ if (res.code == 200) {
|
|
|
|
|
+ loading1.clear();
|
|
|
|
|
+ localStorage.setItem('powerGrade', res.data.positionId);
|
|
|
|
|
+ localStorage.setItem('userDeptLevel', res.data.userDeptLevel);
|
|
|
|
|
+ localStorage.setItem('isDiy', res.data.diy);
|
|
|
|
|
+ localStorage.setItem('uType', res.data.userType);
|
|
|
|
|
+ localStorage.setItem('jzType', res.data.jzType);
|
|
|
|
|
+ localStorage.setItem('customerVisits', res.data.customerManagerVisits);
|
|
|
|
|
+ localStorage.setItem('postType', res.data.postType);
|
|
|
|
|
+ if (res.data.homePageIndicatorList != null) {
|
|
|
|
|
+ this.homePageIndicatorList = res.data.homePageIndicatorList;
|
|
|
|
|
+ this.updataTime = res.data.homePageIndicatorUpdateTime;
|
|
|
|
|
+ }
|
|
|
|
|
+ this.type = res.data.userType;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$toast(res.msg);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ userTodayPlanNum() {
|
|
|
|
|
+ localStorage.setItem('outvstoreName', '');
|
|
|
|
|
+ localStorage.setItem('outvchainName', '');
|
|
|
|
|
+ localStorage.removeItem('outvstoreLabelTypes');
|
|
|
|
|
+ localStorage.removeItem('outvjpdStoreLevelTypes');
|
|
|
|
|
+ localStorage.removeItem('outvstoreCategoryList');
|
|
|
|
|
+ localStorage.setItem('outvchainCode', '');
|
|
|
|
|
+ localStorage.setItem('outvstoreName', '');
|
|
|
|
|
+ localStorage.setItem('deviveStoreName', '');
|
|
|
|
|
+ localStorage.setItem('outvsortType', '');
|
|
|
|
|
+ localStorage.setItem('outsortParam', '');
|
|
|
|
|
+ localStorage.setItem('lat', '');
|
|
|
|
|
+ localStorage.setItem('lon', '');
|
|
|
|
|
+ userTodayPlanNum().then((res) => {
|
|
|
|
|
+ if (res.code == 200) {
|
|
|
|
|
+ this.todayGoal = res.data;
|
|
|
|
|
+ this.progressWidth = (this.todayGoal.finishNum / this.todayGoal.planNum) * 100 + '%';
|
|
|
|
|
+ localStorage.setItem('nickName', res.data.user.nickName);
|
|
|
|
|
+ localStorage.setItem('postName', res.data.user.postName);
|
|
|
|
|
+ localStorage.setItem('zipPhoto', res.data.zipPhoto);
|
|
|
|
|
+ localStorage.setItem('storeType', res.data.user.type);
|
|
|
|
|
+ localStorage.setItem('deptLevel', res.data.user.depts[0].deptLevel);
|
|
|
|
|
+ localStorage.setItem('userId', res.data.user.userId);
|
|
|
|
|
+ localStorage.setItem('deptIds', JSON.stringify(res.data.user.deptIds));
|
|
|
|
|
+ this.monthNoVisit = res.data.monthNoVisit;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$toast(res.msg);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
},
|
|
},
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|
|
@@ -236,7 +370,7 @@ export default {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.container {
|
|
.container {
|
|
|
- /* margin: 10px; */
|
|
|
|
|
|
|
+ margin: 10px 0;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.container .van-collapse-item {
|
|
.container .van-collapse-item {
|
|
@@ -348,8 +482,9 @@ export default {
|
|
|
padding: 14px 0px;
|
|
padding: 14px 0px;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.storeTypeHome .van-collapse-item__content {
|
|
|
|
|
- padding: 0;
|
|
|
|
|
|
|
+.HomeTarget .van-collapse-item__content {
|
|
|
|
|
+ padding: 0px 15px 15px 15px;
|
|
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.storeTypeHome .storeTypeHomeList .van-cell__title {
|
|
.storeTypeHome .storeTypeHomeList .van-cell__title {
|