|
- <template>
- <view>
- <view class="boxtittabs">
- <div class="items" @tap="screenShow = true">{{ showTimeText }}
- <u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon>
- </div>
- <div class="items" @tap="showTemplate = true">{{ showBeText }}
- <u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon>
- </div>
- </view>
-
- <!-- <view class="timetabct">
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0)">7天</view>
- </view>
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1)">15天</view>
- </view>
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2)">30天</view>
- </view>
- </view> -->
-
- <view class="timepick">
- <view class="timepicktime">
- <view @click="tabtimetap(3)">{{sheartime1}}
- <image class="Underimg" src="../../../static/images/down.png" mode=""></image>
- </view>
- </view>
- <view class="timepickpick" @click="checkboxChange()">
- <image v-if="timepickpickisshow" style="width: 30rpx;height: 30rpx;"
- src="../../../static/images/xuanzhong.png" mode=""></image>
- <view v-else style="width: 30rpx;height:30rpx;border: 1px solid #E0E0E0;box-sizing:border-box;"></view>
- <view style="font-size:26rpx;text-indent: 12rpx;">对比</view>
- </view>
- <view class="timepicktime" v-if="timepickpickisshow">
- <view @click="tabtimetap(4)">{{sheartime2}}
- <image class="Underimg" src="../../../static/images/down.png" mode=""></image>
- </view>
- </view>
- </view>
-
- <view class="timeduibi">
- <view class="timeshow">数据起始时间:<text style="color: #333333;">{{kanbanlist.kaishitime}}</text></view>
- <view class="timeshow" v-if="kanbanlist.duibitime.length!=0">
- 数据对比时间:
- <text style="color: #333333;">{{kanbanlist.duibitime}}</text>
- </view>
- </view>
- <view class="boxzonglan" style="min-height: 100rpx;">
- <view class="zonglantit">简报</view>
- <view class="zonglanbox">
- <view class="grid" v-for="(item,index) in numlist" :key="index">
- <view class="audonum">
- <view class="circle"></view>
- {{item.name}}
- </view>
- <view class="num u-flex" v-if="item.name==='平均执行率'">
- {{item.num}}%
- <!-- <image style="margin-left: 2rpx;width: 28rpx;height: 14rpx" src="../../../static/images/excute.png" mode="" /> -->
- </view>
- <view class="num" v-else-if="item.name==='有效接待'">{{item.num||'--'}}</view>
- <view class="num" v-else-if="item.name==='平均接待时长'">{{item.num}}分</view>
- <view class="num" v-else>{{item.num||0}}</view>
- <view class="comparesize" v-if="compareFlag&&timepickpickisshow">
- <text style="margin-right: 50rpx;">对比:{{item.name==='平均执行率'?item.num1+'%':item.num1}}</text>
- <text :style="{color:item.num2*1>0?'red':'green'}">
- {{item.num2}}
- <template v-if="item.name==='平均执行率'">
- %
- </template>
- {{(item.num2*1) > 0 ? '↑' : '↓'}}</text>
- </view>
- </view>
- </view>
- </view>
- <view class="boxtittab" style="border: none;height: 82rpx;">
- <view class="tabbox">
- <view :class="{ activecllasscet2: newactiveTotal == 0 }" @click="tabxuanxiangtap(0)">项目</view>
- </view>
- <view class="tabbox">
- <view :class="{ activecllasscet2: newactiveTotal == 1 }" @click="tabxuanxiangtap(1)">顾问</view>
- </view>
- <view class="tabbox">
- <view :class="{ activecllasscet2: newactiveTotal == 2 }" @click="tabxuanxiangtap(2)">团队</view>
- </view>
- <view class="tabbox">
- <view :class="{ activecllasscet2: newactiveTotal == 3 }" @click="tabxuanxiangtap(3)">销讲一级</view>
- </view>
- <view class="tabbox">
- <view :class="{ activecllasscet2: newactiveTotal == 4 }" @click="tabxuanxiangtap(4)">销讲二级</view>
- </view>
- </view>
-
-
- <view class="chart">
- <view style="display: flex;padding: 0 0 40rpx 0;justify-content: center;">
- <!-- <view class="marketingBusiness">
- <view class="marketingBusinesstext" style="min-width: 50rpx;" @click="showMarketingBusiness = true">
- {{ marketingBusinessText }}
- <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
- </view>
- </view> -->
- <view
- style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 0rpx;"
- v-if="guwenshow&&lopanobj.name" @click="oninputtap()">
- <view class="title2-che u-flex" style="width: 220rpx;">{{lopanobj.name}}
- <image class="righttochoose" src="../../../static/images/down.png" mode=""></image>
- </view>
- </view>
- </view>
- <view style="padding: 30rpx;padding-bottom: 20rpx;align-items: center;" v-if="Selectlevel">
- <view style="display: flex;align-items: center;border-bottom: 1px solid #C9C9C9;height: 80rpx;">
- <view>选择一级:</view>
- <view style="width:75%;">
- <input @click="oninputtap2()" v-model="Selectlevelobj.name" type="text" disabled="true"
- :border="border" placeholder="请选择" />
- </view>
- <view>
- <image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/qf/more.png"
- style="width:12rpx;height:23rpx;margin-left: 16rpx;">
- </view>
- </view>
-
-
- <view style="display: flex;align-items: center;border-bottom: 1px solid #C9C9C9;height: 80rpx;">
- <view>选择二级:</view>
- <view style="width:75%;">
- <input @click="oninputtap3()" v-model="erSelectlevelobj.name" type="text" disabled="true"
- :border="border" placeholder="请选择" />
- </view>
- <view>
- <image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/qf/more.png"
- style="width:12rpx;height:23rpx;margin-left: 16rpx;">
- </view>
- <!-- <view style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;"
- v-if="erSelectlevelobj.name" @click="oninputtap3()">
- <view class="title2-che" style="width: 220rpx;">{{erSelectlevelobj.name}}
- <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
- </view>
- </view> -->
- </view>
- </view>
-
- <view style="display: flex;align-items: center;height: 80rpx;justify-content: center;"
- v-if="Selecttuandui&&Selecttuanduiobj.name" @click="oninputtap4()">
- <view class="title2-che u-flex" style="width: 220rpx;">{{Selecttuanduiobj.name}}
- <image class="righttochoose" src="../../../static/images/down.png" mode=""></image>
- </view>
- </view>
-
- <view class="single">
- <view class="danwei" style="margin: 20rpx 0" v-if="newactiveTotal==0||newactiveTotal==4">单位(%)</view>
- <view class="uchaserbox" v-if="lineOptsect.series.length!=0">
- <qiun-data-charts :style="!showCanvas?'display:none':''" :type="linetype" :opts="opts"
- :chartData="lineOptsect" background="none" :ontouch="true"
- canvasId="wangxiaohuaerlingeryilingwuyibao" :canvas2d="true" />
- </view>
- <view v-else style="width: 100%;">
- <view style="width: 100%;text-align: center;">
- <image style="width: 200rpx;height: 200rpx;"
- src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
- </view>
- <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
- </view>
- </view>
-
- </view>
-
- <view class="single" v-if="timepickpickisshow">
- <view class="title">
- <view class="title1">对比报表</view>
- </view>
- <view class="table" v-if="!guwenFlag">
- <view v-for="(item,index) in tableDate" :key="index">
- <view class="tr">
- <view v-for="(item1,index1) in item" :key="index" style="width: 100%;">
- <view v-if="index1<item.length-1||index==0" class="td"
- style="border-right:1px solid #E0E0E0;">{{item1}}</view>
- <view v-if="index>0 && index1==item.length-1" class="td"
- style="border-right:1px solid #E0E0E0;" :style="{color:item1*1>0?'red':'green'}">
- {{item1==0?'--':item1+'%'}}{{item1*1>0?'↑':item1*1<0?'↓':''}}
- </view>
- </view>
- </view>
- </view>
- </view>
- <view class="table" v-if="guwenFlag" style="width: 100%;">
- <scroll-view scroll-x="true" style="white-space: nowrap;">
- <view v-for="(item,index) in tableDate" :key="index"
- :style="{display:index==0?'inline-block':'block'}">
- <view class="tr" style="display: inline-block;">
- <view v-for="(item1,index1) in item" :key="index1" class="trd"
- style="display: inline-block;">
- <view v-if="index==1&&index1>0" class="td" :style="{color:item1*1>0?'red':'green'}"
- style="border-right:1px solid #E0E0E0;">
- {{item1==0?'--':item1+'%'}}{{item1*1>0?'↑':item1*1<0?'↓':''}}
- </view>
- <view v-else-if="index>1&&index1>0" class="td" style="border-right:1px solid #E0E0E0;">
- {{item1+'%'}}
- </view>
- <view v-else class="td" style="border-right:1px solid #E0E0E0;">{{item1}}</view>
- </view>
- </view>
- </view>
- </scroll-view>
- </view>
- </view>
- <u-select v-model="Showhiddenunits" mode="single-column" :list="selectlist" @confirm="confirm"
- :default-value="selindexList">
- </u-select>
- <u-select v-model="Showhiddenunits2" mode="single-column" :list="selectlist2" @confirm="confirm2"
- :default-value="selindex">
- </u-select>
- <u-select v-model="Showhiddenunits3" mode="single-column" :list="selectlist3" @confirm="confirm3"
- :default-value="selindex">
- </u-select>
- <u-select v-model="Showhiddenunits4" mode="single-column" :list="selectlist4" @confirm="confirm4"
- :default-value="selindex">
- </u-select>
- <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
- <newcalendar v-model="totalTimeShow2" :planNum='intervaltime' mode="date" @change="totalTimeChange2">
- </newcalendar>
- <!--
- <u-select v-model="showMarketingBusiness" mode="single-column" :list="showMarketingList"
- label-name="templateName" value-name="id" @confirm="selectMarketingBusiness"></u-select>
- -->
- <!-- 加载组件 -->
- <u-loadings v-model="LOADING"></u-loadings>
-
- <!-- 销讲业务 -->
- <u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate"
- mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select>
-
-
- <!-- 更多筛选 -->
- <u-popup v-model="screenShow" mode="bottom" height="368">
- <view class="screen">
- <view class="timetabct">
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0, '7天')">7天</view>
- </view>
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1, '15天')">15天</view>
- </view>
- <view class="timetabctview">
- <view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2, '30天')">30天</view>
- </view>
- </view>
- </view>
- </u-popup>
-
-
- </view>
- </template>
- <script>
- import newcalendar from '@/components/newcalendar/newcalendar.vue';
- var config = require(".../../../config");
- export default {
- data() {
- return {
- selindexList: [0], // 默认选中第一项
- compareFlag: false,
- numlist: [{
- name: '平均执行率',
- num: '10',
- num1: '0',
- num2: '0'
- },
- {
- name: '平均接待时长',
- num: '10',
- num1: '0',
- num2: '0'
- },
- {
- name: '接待量',
- num: '10',
- num1: '0',
- num2: '0'
- },
- {
- name: '有效接待',
- num: '10',
- num1: '0',
- num2: '0'
- },
- ],
- activeTotal: 0, //时间下标
- newactiveTotal: 0, //tab下标
- totalTimeShow: false,
- totalTimeShow2: false,
- totalTimeShow3: false,
- cWidth: uni.upx2px(690),
- cHeight: uni.upx2px(453),
- AcHeight: uni.upx2px(500),
- kanbanlist: { //录音和测评的数据
- kaishitime: '',
- duibitime: '',
- audonum: '',
- audotime: "",
- avgDuration: '',
- fraction: ''
- },
- pamect: { //接口参数
- houseId: '',
- timeType: "4",
- firstStartDate: '', //第一次开始时间
- firstEndDate: '', //第一次结束时间
- lastStartDate: '',
- lastEndDate: '',
- accountId: '', //顾问ids
- marketingId: '', //二级销讲id
- deptId: "", //部门id
- showStatus: 0
- },
- linetype: "line",
- lineOptsect: {}, //图表数据
- Showhiddenunits: false,
- selectlist: [],
- guwenshow: false,
- lopanobj: {
- id: '',
- name: ''
- },
- //二级相关
- Selectlevel: false,
- Selectlevelobj: {
- id: '',
- name: ''
- },
- erSelectlevelobj: {
- id: '',
- name: ''
- },
- Showhiddenunits2: false,
- Showhiddenunits3: false,
- selectlist2: [],
- selectlist3: [],
- //团队相关
- Selecttuandui: false,
- selectlist4: [],
- Selecttuanduiobj: {
- id: '',
- name: ''
- },
- Showhiddenunits4: false,
- showCanvas: true,
-
- timepickpickisshow: false,
- sheartime1: "",
- sheartime2: "",
- intervaltime: 0,
- tableDate: [],
- guwenFlag: false,
- opts: {
- xAxis: {
- disableGrid: true,
- scrollShow: true,
- itemCount: 8
- },
- yAxis: {
- data: [{
- max: 100,
- min: 0,
- }]
- },
- fontSize: 10,
- extra: {
- radar: {
- max: 100
- }
- }
- },
-
-
-
- marketingBusinessText: '请选择销讲业务',
- showMarketingBusiness: false, // 展示可选择的销讲业务
- showMarketingList: [], // 销讲业务列表
- marketingBusiness: '', // 销讲业务
- screenShow: false, // 时间筛选弹窗
- showTimeText: '近七天', // 展示文字
- showBeText: '全部业务', //
- templateList: [], // 销讲业务
- showTemplate: false, // 展示选择销讲业务弹窗
- showTemplates: false, // 展示选择销讲业务弹窗
- templateLists: [], // 销讲业务
- marketingBusinessId: '', // 选择的业务id
- };
-
- },
- components: {
- newcalendar
- },
- onLoad(options) {
- this.LOADING = true
- this.pamect.houseId = uni.getStorageSync('buildingID').id;
- this.init()
- this.getMarketingBusiness()
- },
- onPullDownRefresh() {
- this.init()
- setTimeout(function() {
- uni.stopPullDownRefresh();
- }, 1000);
- },
- watch: {
- Showhiddenunits(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- Showhiddenunits2(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- Showhiddenunits3(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- Showhiddenunits4(newValue, oldValue) {
- this.showCanvas = !newValue
- },
-
- totalTimeShow(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- totalTimeShow2(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- totalTimeShow3(newValue, oldValue) {
- this.showCanvas = !newValue
- },
- },
- methods: {
-
- // 销讲业务方法
- templateCancel() {
- this.showTemplate = false;
- },
-
- // 确认选择销讲业务
- templateConfirm(e) {
- this.showTemplate = false;
- this.marketingBusiness = e[0].value
- this.showBeText = e[0].label
- this.init()
- },
-
-
- // 获取销讲业务
- getMarketingBusiness() {
- this.$u.get('/customer/marketingBusiness', {
- houseId: uni.getStorageSync('buildingID').id,
- }).then(res => {
- this.templateLists = res.map(item => {
- return item
- })
- this.templateList = res
- this.templateList.unshift({
- templateName: '全部业务',
- id: ''
- })
- })
- },
-
- // 选择趋势分析
- selectMarketingBusiness(e) {
- this.marketingBusinessText = e[0].label
- this.marketingBusiness = e[0].value
- this.init()
- },
-
- //是否对比
- checkboxChange() {
- if (this.newactiveTotal == 3) {
- uni.showToast({
- title: '销讲一级无对比',
- duration: 2000
- });
- return
- }
- if (this.newactiveTotal == 2) {
- if (this.Selecttuanduiobj.id == '') {
- uni.showToast({
- title: '全部团队无对比',
- duration: 2000
- });
- return
- }
- }
-
- if (this.timepickpickisshow == true) {
- this.timepickpickisshow = false;
- this.pamect.showStatus = 0;
- this.init()
- } else {
- this.timepickpickisshow = true;
- this.pamect.showStatus = 1;
- }
- this.activeTotal = 8;
- },
-
- init() {
- this.pamect.marketingBusiness = this.marketingBusiness
- this.$u.post("/cusLvStatistics/lyAndcp", this.pamect).then(data => {
- this.pamect.lastStartDate = data.lastStartDate;
- this.pamect.lastEndDate = data.lastEndDate;
- this.numlist[3].num = data.startSumCustomer
- this.numlist[0].num = data.startFraction;
- this.numlist[1].num = data.startSumDuration || 0;
- this.numlist[2].num = data.startReceptionCount || 0
- // startReceptionCount开始接待量
- // endReceptionCount结束接待量
- // contrastReceptionCount接待量对比
- if (data.endSumDuration != null) {
- this.compareFlag = true
- // return
- this.numlist[3].num1 = data.endSumCustomer
- this.numlist[0].num1 = data.endFraction;
- this.numlist[1].num1 = data.endSumDuration || 0;
- this.numlist[2].num1 = data.endReceptionCount || 0
- this.numlist[3].num2 = data.contrastSumCustomer
- this.numlist[0].num2 = data.contrastFraction;
- this.numlist[1].num2 = data.contrastSumDuration || 0;
- this.numlist[2].num = data.startReceptionCount || 0
- this.numlist[2].num2 = data.contrastReceptionCount || 0
- } else {
- this.compareFlag = false
- }
- this.sheartime1 = data.lastStartDate.substring(5, 10) + "--" + data.lastEndDate.substring(5,
- 10);
- this.sheartime2 = '请选择';
- this.kanbanlist.duibitime = '';
- var kaishi = this.DateDiff(data.lastStartDate, data.lastEndDate);
- this.kanbanlist.kaishitime = data.lastStartDate + "至" + data.lastEndDate + "(" + kaishi + "天)";
- if (this.pamect.showStatus == 1) {
- this.sheartime2 = data.firstStartDate.substring(5, 10) + "--" + data.firstEndDate
- .substring(5, 10);
- var jeishu = this.DateDiff(data.firstStartDate, data.firstEndDate);
- this.kanbanlist.duibitime = data.firstStartDate + "至" + data.firstEndDate + "(" + jeishu +
- "天)";
- }
- this.kanbanlist.audonum = data.sumCustomer;
- this.kanbanlist.audotime = data.avgDuration;
- this.kanbanlist.avgDuration = data.fraction;
- this.kanbanlist.fraction = data.fraction;
-
- if (this.newactiveTotal == 0) {
- this.ProjectDimension()
- } else if (this.newactiveTotal == 1) {
- if (this.pamect.accountId == "") {
- this.getguwenlist()
- } else {
- this.ConsultantDimension()
- }
- } else if (this.newactiveTotal == 2) {
- if (this.pamect.deptId == "") {
- this.getuanduilist()
- } else {
- this.TeamCompared()
- }
- } else if (this.newactiveTotal == 3) {
- this.speakingLevel()
- } else {
- if (this.pamect.marketingId == '') {
- this.getonsyiji()
- } else {
- this.aboutEecondary()
- }
- }
-
- setTimeout(() => {
- this.LOADING = false
- }, 1500)
- });
- },
- //起始时间
- totalTimeChange(e) {
- this.pamect.lastStartDate = e.startDate;
- this.pamect.lastEndDate = e.endDate;
- var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
- this.kanbanlist.kaishitime = this.pamect.lastStartDate + "至" + this.pamect.lastEndDate + "(" + kaishi +
- "天)";
-
- if (this.pamect.showStatus == 0) {
- this.init()
- this.totalTimeShow = false;
- } else {
- if (this.pamect.firstStartDate.length == 0) {
- uni.showToast({
- title: '请选择对比时间',
- duration: 2000
- });
- } else {
- var jshu = this.DateDiff(this.pamect.firstStartDate, this.pamect.firstEndDate)
- if (kaishi == jshu) {
- this.init()
- } else {
- uni.showToast({
- title: '请选择相同天数',
- duration: 2000
- });
- }
- }
- this.totalTimeShow = false;
- }
- },
- //对比时间
- totalTimeChange2(e) {
- var d = new Date(e.result.replace(/\-/g, '/'));
- d.setDate(d.getDate() + this.intervaltime);
- var year = d.getFullYear();
- var month = d.getMonth() + 1;
- if (month < 10) month = '0' + month;
- var day = d.getDate();
- if (day < 10) day = '0' + day;
- this.pamect.firstStartDate = e.result;
- this.pamect.firstEndDate = year + '-' + month + '-' + day;
- console.log(this.pamect.firstStartDate)
- var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
- var jeishu = this.DateDiff(this.pamect.firstStartDate, this.pamect.firstEndDate)
- this.kanbanlist.duibitime = this.pamect.firstStartDate + "至" + this.pamect.firstEndDate + "(" + jeishu +
- "天)";
-
- console.log(this.pamect.lastStartDate, this.pamect.lastEndDate, kaishi, jeishu)
- if (kaishi == jeishu) {
- this.init()
- } else {
- uni.showToast({
- title: '请选择相同天数',
- duration: 2000
- });
- }
- this.totalTimeShow2 = false;
- },
- //自定义时间
- totalTimeChange3(e) {
- this.pamect.firstStartDate = "";
- this.pamect.firstEndDate = "";
- this.pamect.lastStartDate = e.startDate;
- this.pamect.lastEndDate = e.endDate;
- this.init()
- this.totalTimeShow3 = false;
- },
-
-
- //时间切换
- tabtimetap(index, text) {
- if (index == 0) {
- this.screenShow = false
- this.showTimeText = text
- this.activeTotal = index;
- this.pamect.timeType = "4";
- this.pamect.firstStartDate = '';
- this.pamect.firstEndDate = '';
- this.pamect.lastStartDate = '';
- this.pamect.lastEndDate = '';
- this.init()
- } else if (index == 1) {
- this.screenShow = false
- this.showTimeText = text
- this.activeTotal = index;
- this.pamect.timeType = "5";
- this.pamect.firstStartDate = '';
- this.pamect.firstEndDate = '';
- this.pamect.lastStartDate = '';
- this.pamect.lastEndDate = '';
- this.init()
- } else if (index == 2) {
- this.screenShow = false
- this.showTimeText = text
- this.activeTotal = index;
- this.pamect.timeType = "6";
- this.pamect.firstStartDate = '';
- this.pamect.firstEndDate = '';
- this.pamect.lastStartDate = '';
- this.pamect.lastEndDate = '';
- this.init()
- } else if (index == 3) {
- this.pamect.timeType = "";
- this.totalTimeShow = true;
- } else if (index == 4) {
- this.pamect.timeType = "";
- var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
- console.log(kaishi)
- this.intervaltime = kaishi - 1;
- this.totalTimeShow2 = true;
- } else {
- this.pamect.timeType = "";
- this.totalTimeShow3 = true;
- }
- this.activeTotal = index;
- },
- //tab切换
- tabxuanxiangtap(index) {
- // if (index == 1 || index == 3 || index == 4) {
- // if (this.showMarketingList.findIndex(item => item.id == '') != -1) {
- // this.showMarketingList.shift()
- // }
- // this.marketingBusinessText = this.showMarketingList[0].templateName
- // this.marketingBusiness = this.showMarketingList[0].id
- // } else {
- // this.showMarketingList.unshift({
- // templateName: '全部',
- // id: ''
- // })
- // this.marketingBusiness = ''
- // this.marketingBusinessText = '请选择销讲业务'
- // }
- this.newactiveTotal = index;
- this.guwenshow = false;
- this.Selectlevel = false;
- this.Selecttuandui = false;
- this.tableDate = []
- // this.pamect.showStatus = 0;
- // this.pamect.timeType = "4";
- // this.pamect.firstStartDate = '';
- // this.pamect.firstEndDate = '';
- // this.pamect.lastStartDate = '';
- // this.pamect.lastEndDate = '';
- // this.pamect.accountId = '';
- // this.pamect.marketingId = '';
- // this.pamect.deptId = ""
- // this.activeTotal = 0;
- this.timepickpickisshow = false;
- this.init()
- if (index == 4) {
- this.Selectlevel = true
- }
- if (index == 1) {
- this.guwenshow = true;
- }
- },
- //项目维度
- ProjectDimension() {
- const that = this;
- that.lineOptsect = {
- categories: [],
- series: []
- };
- this.linetype = "line";
- this.$u.post("/cusLvStatistics/teamOrOneValueShow", this.pamect).then(data => {
- if (this.pamect.showStatus == 0) {
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- }]
- }
- data.startList.forEach((child, zxc) => {
- that.lineOptsect.categories.push(child.statDate.substring(5, 10))
- })
- that.lineOptsect.series[0].data = data.startList.map(item => item.fraction);
- console.log(that.lineOptsect.series, 'asdasdsadsadass00000000000000')
- } else {
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- },
- {
- name: '对比时间',
- data: [],
- color: '#FF7070'
- },
- ]
- }
- data.startList.forEach((item, sdf) => {
- data.endList.forEach((child, zxc) => {
- if (sdf == zxc) {
- that.lineOptsect.categories.push(
- child.statDate.substring(5, 10) + 'vs' + item
- .statDate
- .substring(5, 10)
- )
- }
- })
- })
- that.lineOptsect.series[1].data = data.startList.map(item => item.fraction);
- that.lineOptsect.series[0].data = data.endList.map(item => item.fraction)
- that.guwenFlag = false
- // // 处理表格数据
- let arr = [
- ['时间', '时段一', '时段二', '变化']
- // {
- // time:'时间',
- // time1:'时段一',
- // time2:'时段二',
- // compare:'变化'
- // },
- ]
- that.lineOptsect.categories.map((item, index) => {
- let newarr = [item, data.endList[index].fraction, data.startList[index]
- .fraction, data.comparedList[index].fraction
- ]
- // obj.time=item
- // obj.time1=data.firstValue[index].fraction
- // obj.time2=data.lastValue[index].fraction
- // obj.compare=data.contrast[index].data
- // arr.push(obj)
- arr.push(newarr)
- })
- // console.log(arr)
- that.tableDate = arr
- console.log(that.lineOptsect.series, 'asdasdsadsadass00000000000000else')
- }
- });
-
- },
- //顾问维度
- ConsultantDimension() {
- const that = this;
- that.lineOptsect = {
- categories: [],
- series: []
- };
- this.linetype = "radar";
- this.$u.post("/cusLvStatistics/accFirstLevelContrast", this.pamect).then(data => {
- // return
- if (this.pamect.showStatus == 0) {
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '时段一',
- data: [],
- color: '#7ED3F4'
- }]
- }
- data.firstList.forEach((item, sdf) => {
- that.lineOptsect.categories.push(item.name)
- that.lineOptsect.series[0].data.push(data.firstList[sdf].total)
- })
- // that.lineOptsect.series[0].data = data.lastValue.map(item => item.fraction);
- } else {
- // 当有对比的时候
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '时段一',
- data: [],
- color: '#7ED3F4'
- },
- {
- name: '时段二',
- data: [],
- color: '#FF7070'
- },
- ]
- }
- data.headerList.forEach((item, sdf) => {
- that.lineOptsect.categories.push(item.name)
- that.lineOptsect.series[0].data.push(data.firstList[sdf].total)
- that.lineOptsect.series[1].data.push(data.secondList[sdf].total)
- })
- // return
- // // 处理表格数据
- that.guwenFlag = true
- let arr = []
- arr[0] = ['时间', ...that.lineOptsect.categories]
- arr[1] = ['变化']
- arr[2] = ['时段一']
- arr[3] = ['时段二']
- // console.log(arr)
- data.firstList.map((item, index) => {
- arr[2].push(item.total)
- arr[3].push(data.secondList[index].total)
- arr[1].push(data.thirdList[index].total)
- })
- that.tableDate = arr
- }
- });
- },
- // 顾问纬度选择顾问
- oninputtap() {
- this.Showhiddenunits = true;
- },
- // 顾问选择确认
- confirm(e) {
- this.lopanobj.id = e[0].value;
- this.lopanobj.name = e[0].label;
- this.pamect.accountId = this.lopanobj.id;
- this.ConsultantDimension()
- this.Showhiddenunits = false;
- for (let i = 0; i < this.selectlist.length; i++) {
- if (e[0].value == this.selectlist[i].value) {
- this.selindexList[0] = i
- }
- }
- },
- //获取顾问
- getguwenlist() {
- this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
- houseId: this.pamect.houseId
- }).then(data => {
- this.selectlist = [];
- if (data.length == 0) {
- this.lineOptsect = {
- categories: [],
- series: []
- };
- this.guwenshow = false;
- return
- } else {
- this.guwenshow = true;
- data.forEach(item => {
- this.selectlist.push({
- value: item.accountId,
- label: item.name
- })
- })
- this.lopanobj.id = data[0].accountId;
- this.lopanobj.name = data[0].name;
- this.pamect.accountId = this.lopanobj.id;
- this.ConsultantDimension()
- }
- })
- },
- //销讲一级
- speakingLevel() {
- this.linetype = "radar";
- this.lineOptsect = {
- categories: [],
- series: []
- };
- this.$u.post("/cusLvStatistics/firstLevelContrast", this.pamect).then(data => {
- if (data.length == 0) {
- return
- } else {
- let list = data.map(item => {
- return item.name
- });
- let list1 = data.map(item => {
- if (item.avgExecutionRate == null) {
- item.avgExecutionRate = 0
- } else {
- item.avgExecutionRate = item.avgExecutionRate
- }
- return item.avgExecutionRate
- });
- this.lineOptsect = {
- "categories": list,
- "series": [{
- "name": "销讲一级",
- "data": list1
- }]
- }
- }
- })
- },
- //销讲二级
- aboutEecondary() {
- this.lineOptsect = {};
- this.linetype = "line";
- this.$u.post("/cusLvStatistics/level2Contrast", this.pamect).then(data => {
- if (this.pamect.showStatus == 0) {
- this.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- }]
- }
- data.lastList.forEach((item, sdf) => {
- this.lineOptsect.categories.push(item.statDate.substring(5, 10))
- })
- this.lineOptsect.series[0].data = data.lastList.map(item => item.avgExecutionRate);
- } else {
- this.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- },
- {
- name: '对比时间',
- data: [],
- color: '#FF7070'
- },
- ]
- }
- data.firstList.forEach((item, sdf) => {
- data.lastList.forEach((child, zxc) => {
- if (sdf == zxc) {
- this.lineOptsect.categories.push(
- child.statDate.substring(5, 10) + 'vs' + item.statDate
- .substring(5, 10)
- )
- }
- })
- })
- this.lineOptsect.series[1].data = data.firstList.map(item => item.avgExecutionRate);
- this.lineOptsect.series[0].data = data.lastList.map(item => item.avgExecutionRate)
- let that = this
- this.guwenFlag = false
- // // 处理表格数据
- let arr = [
- ['时间', '时段一', '时段二', '变化']
- ]
- that.lineOptsect.categories.map((item, index) => {
- let newarr = [item, data.lastList[
- index].avgExecutionRate, data.firstList[index].avgExecutionRate,
- data.contrast[index].data
- ]
- arr.push(newarr)
- })
- // console.log(arr)
- that.tableDate = arr
- }
- })
- },
- //销讲二级:获取一级
- getonsyiji() {
- this.$u.post("/cusLvStatistics/findAllFirstLevel", {
- houseId: this.pamect.houseId
- }).then(data => {
- this.selectlist2 = [];
- if (data.length == 0) {
- this.Selectlevel = false;
- this.lineOptsect = {
- categories: [],
- series: []
- };
- return
- } else {
- this.Selectlevel = true;
- data.forEach(item => {
- this.selectlist2.push({
- value: item.marketingId,
- label: item.name
- })
- })
- this.Selectlevelobj.id = data[0].marketingId;
- this.Selectlevelobj.name = data[0].name;
- this.getonserji(this.Selectlevelobj.id)
- }
- })
- },
- //销讲二级:通过一级获取二级
- getonserji(ccd) {
- this.$u.post("/cusLvStatistics/findLevel2ByFirstLevel", {
- houseId: this.pamect.houseId,
- marketingId: ccd
- }).then(data => {
- this.selectlist3 = [];
- data.forEach(item => {
- this.selectlist3.push({
- value: item.marketingId,
- label: item.name
- })
- })
- this.erSelectlevelobj.id = data[0].marketingId;
- this.erSelectlevelobj.name = data[0].name;
- this.pamect.marketingId = this.erSelectlevelobj.id;
- this.aboutEecondary()
- })
- },
- //销讲二级:一级选择
- oninputtap2() {
- this.Showhiddenunits2 = true;
- },
- //销讲二级:二级选择
- oninputtap3() {
- if (this.Selectlevelobj.id == "") {
- uni.showToast({
- title: '请先选择一级',
- duration: 2000
- });
- } else {
- this.Showhiddenunits3 = true;
- }
- },
- //销讲二级:一级选择确认
- confirm2(e) {
- this.Selectlevelobj.id = e[0].value;
- this.Selectlevelobj.name = e[0].label;
- this.getonserji(this.Selectlevelobj.id)
- },
- //销讲二级:二级选择确认
- confirm3(e) {
- this.erSelectlevelobj.id = e[0].value;
- this.erSelectlevelobj.name = e[0].label;
- this.pamect.marketingId = this.erSelectlevelobj.id;
- this.aboutEecondary()
- },
-
-
-
-
-
- //团队请选择
- oninputtap4() {
- this.Showhiddenunits4 = true;
- },
- //团队选择确认
- confirm4(e) {
- this.Selecttuanduiobj.id = e[0].value;
- this.Selecttuanduiobj.name = e[0].label;
- this.pamect.deptId = this.Selecttuanduiobj.id;
-
- this.pamect.showStatus = 0;
- this.pamect.timeType = "4";
- this.pamect.firstStartDate = '';
- this.pamect.firstEndDate = '';
- this.pamect.lastStartDate = '';
- this.pamect.lastEndDate = '';
- this.activeTotal = 0;
- this.timepickpickisshow = false;
- this.init()
- this.TeamCompared()
- },
- //获取团队列表
- getuanduilist() {
- uni.request({
- url: config.service.findListByUser + "?houseId=" + this.pamect.houseId,
- method: "GET",
- header: {
- 'content-type': 'application/json',
- 'Authorization': 'Bearer ' + uni.getStorageSync('weapp_session_login_data').token
- },
- success: (data) => {
- if (data.data.data.length == 0) {
- this.Selecttuandui = false;
- this.lineOptsect = {
- categories: [],
- series: []
- };
- return
- } else {
- this.Selecttuandui = true;
- data.data.data.forEach(item => {
- this.selectlist4.push({
- value: item.deptId,
- label: item.name
- })
- })
- this.Selecttuanduiobj.id = this.selectlist4[0].value;
- this.Selecttuanduiobj.name = this.selectlist4[0].label;
- this.pamect.deptId = this.Selecttuanduiobj.id;
- this.TeamCompared()
- }
- }
- })
-
- // this.$u.post("/cusLvStatistics/findAllDeptIdByHouseId ", {
- // houseId: this.pamect.houseId
- // }).then(data => {
- // this.selectlist4 = [{
- // value: "",
- // label: "全部"
- // }];
- // if (data.length == 0) {
- // this.Selecttuandui = false;
- // this.lineOptsect = {
- // categories: [],
- // series: []
- // };
- // return
- // } else {
- // this.Selecttuandui = true;
- // data.forEach(item => {
- // this.selectlist4.push({
- // value: item.deptId,
- // label: item.deptName
- // })
- // })
- // this.Selecttuanduiobj.id = "";
- // this.Selecttuanduiobj.name = "全部";
- // this.pamect.deptId = this.Selecttuanduiobj.id;
- // this.TeamCompared()
- // }
- // })
- },
- //团队对比
- TeamCompared() {
- const that = this;
- that.lineOptsect = {};
- this.linetype = "line";
- this.$u.post("/cusLvStatistics/teamOrOneValueShowByDept", this.pamect).then(data => {
- if (this.Selecttuanduiobj.id == "") {
- var newlist = [];
- for (var i in data) {
- var ect = data[i].receptionStatList.map(item => {
- if (item.fraction == null) {
- item.fraction = 0
- } else {
- item.fraction = item.fraction
- }
- return item.fraction
- });
- newlist.push({
- name: data[i].deptName,
- data: ect
- })
- }
- var timelist = [];
- for (var i in data) {
- var ect = data[i].receptionStatList.map(item => {
- return item.statDate
- });
- timelist.push({
- name: data[i].deptName,
- data: ect
- })
- }
- var xAxisdata = [];
- timelist[0].data.forEach((item, sdf) => {
- xAxisdata.push(item.substring(5, 10))
- })
- that.lineOptsect = {
- categories: xAxisdata,
- series: newlist
- }
- } else {
- if (this.pamect.showStatus == 0) {
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- }]
- }
- data.lastValue.receptionStatList.forEach((item, sdf) => {
- that.lineOptsect.categories.push(item.statDate.substring(5, 10))
- })
- that.lineOptsect.series[0].data = data.lastValue.receptionStatList.map(item => item
- .fraction);
- } else {
- that.lineOptsect = {
- categories: [],
- series: [{
- name: '起始时间',
- data: [],
- color: '#7ED3F4'
- },
- {
- name: '对比时间',
- data: [],
- color: '#FF7070'
- },
- ]
- }
- data.firstValue.receptionStatList.forEach((item, sdf) => {
- data.lastValue.receptionStatList.forEach((child, zxc) => {
- if (sdf == zxc) {
- that.lineOptsect.categories.push(
- child.statDate.substring(5, 10) + 'vs' + item
- .statDate.substring(5, 10)
- )
- }
- })
- })
- that.lineOptsect.series[1].data = data.firstValue.receptionStatList.map(item => item
- .fraction);
- that.lineOptsect.series[0].data = data.lastValue.receptionStatList.map(item => item
- .fraction)
- that.guwenFlag = false
- // 团队处理数据
- // // 处理表格数据
- let arr = [
- ['时间', '时段一', '时段二', '变化']
- ]
- that.lineOptsect.categories.map((item, index) => {
- let newarr = [item, data
- .lastValue.receptionStatList[index].fraction, data.firstValue
- .receptionStatList[index].fraction, data.contrast
- .receptionStatList[index].data
- ]
- arr.push(newarr)
- })
- that.tableDate = arr
- }
- }
- });
- },
-
- //算相隔天数
- DateDiff(sDate1, sDate2) {
- var aDate, oDate1, oDate2, iDays;
- aDate = sDate1.split("-");
- oDate1 = new Date(aDate[1] + '/' + aDate[2] + '/' + aDate[0]); //转换为yyyy-MM-dd格式
- aDate = sDate2.split("-");
- oDate2 = new Date(aDate[1] + '/' + aDate[2] + '/' + aDate[0]);
- iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24); //把相差的毫秒数转换为天数
- return iDays + 1; //返回相差天数
- },
- },
- }
- </script>
- <style lang="scss" scoped>
- .boxtittabs {
- width: 100%;
- height: 92rpx;
- background: #FFFFFF;
- display: flex;
- align-items: center;
-
- .items {
- padding: 0 24rpx;
- width: 50%;
- height: 100%;
- display: flex;
- align-items: center;
- justify-content: center;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
- }
-
- .boxtittabs {
- position: sticky;
- top: var(--window-top);
- z-index: 999;
- }
-
- .boxtittab .tabbox {
- flex: none;
- padding: 0 35rpx;
- }
-
- .uchaserbox {
- height: 500rpx;
- }
-
- .title2-che {
- width: 178rpx;
- height: 80rpx;
- background: #FFFFFF;
- border-radius: 6rpx;
- line-height: 80rpx;
- font-size: 28rpx;
- font-weight: 400;
- color: #666666;
- text-indent: 12rpx;
- margin-left: 35rpx;
- margin-top: 20rpx;
-
- .righttochoose {
- width: 28rpx;
- height: 14rpx;
- margin-left: 12rpx;
- }
- }
-
- .table {
- border: 0px solid darkgray;
-
- .tr {
- display: flex;
- // width: 100%;
- justify-content: center;
- height: 64rpx;
- align-items: center;
- border-bottom: 1px solid #E0E0E0;
- flex-wrap: nowrap;
-
- .td {
- text-align: center;
- font-size: 24rpx;
- font-weight: 400;
- color: #333333;
- height: 64rpx;
- line-height: 64rpx;
- // flex-shrink: 0;
- }
-
- .trd {
- flex-shrink: 0;
- min-width: 300rpx;
- // border-bottom: 1px solid #ccc;
- }
-
- .th {
- height: 64rpx;
- text-align: center;
- font-size: 28rpx;
- font-weight: 400;
- color: #666666;
- line-height: 64rpx;
- }
- }
- }
-
- .activecllasscet2 {
- color: #2671E2;
- font-weight: 600;
- border-bottom: 4rpx solid #2671E2;
- }
-
- .timeduibi {
- width: 100%;
- background: #FFFFFF;
- padding-bottom: 10rpx;
-
- .timeshow {
- color: #666666;
- width: 100%;
- height: 50rpx;
- font-size: 28rpx;
- line-height: 50rpx;
- text-indent: 30rpx;
- }
- }
-
-
-
-
- .screen {
-
- // 顶部时间切换
- .timetabct {
- // position: sticky;
- // top: var(--window-top);
- // z-index: 999;
- // background: #fff;
- width: 100%;
- height: 98rpx;
- display: flex;
- border-bottom: 1rpx solid #E0E0E0;
- color: #666;
- flex-direction: column;
- border: none;
- }
-
- .timetabctview {
- flex: 1;
- text-align: center;
- line-height: 98rpx;
- font-size: 28rpx;
- font-family: PingFangSC-Regular, PingFang SC;
- font-weight: 400;
- height: 100%;
- display: flex;
- justify-content: center;
- }
-
- .timetabctview view {
- width: 100rpx;
- }
- }
-
-
- .activecllasscet {
- color: #2671E2;
- font-weight: 600;
- border-bottom: 4rpx solid #2671E2;
- }
-
- // 对比时间切换
- .timepick {
- width: 100%;
- height: 90rpx;
- display: flex;
- align-items: center;
- background: #FFFFFF;
- }
-
- .timepicktime {
- width: 260rpx;
- height: 50rpx;
- line-height: 50rpx;
- margin-left: 30rpx;
- display: flex;
- background: #FFFFFF;
- }
-
- .timepickpick {
- width: 110rpx;
- height: 50rpx;
- margin-left: 30rpx;
- display: flex;
- align-items: center;
- }
-
- .Underimg {
- width: 28rpx;
- height: 14rpx;
- margin-left: 12rpx;
- }
-
-
-
-
- .timeButton {
- width: 100%;
- height: 60rpx;
- display: flex;
- color: #b1b1b1;
- font-size: 28rpx;
-
- .item {
- text-align: center;
- line-height: 60rpx;
- padding-left: 12rpx;
- padding-right: 12rpx;
- border-radius: 8rpx;
- border: 1px solid #E0E0E0;
- margin-right: 20rpx;
-
- &.active {
- color: #FFFFFF;
- background-color: #2671E2;
- }
- }
- }
-
-
-
- .boardbox {
- width: 100%;
- height: 172rpx;
- display: flex;
- align-items: center;
- background: #F4F8FD;
- border-radius: 8rpx;
- margin-top: 28rpx;
-
- .boardbox-zuo {
- width: 50%;
- height: 120rpx;
- border-right: 1px solid #E0E0E0;
- }
-
- .boardbox-you {
- width: 50%;
- height: 120rpx;
- }
-
- .boardbox-text1 {
- width: 100%;
- text-align: center;
- font-size: 28rpx;
- color: #333333;
- }
-
- .boardbox-text2 {
- width: 100%;
- text-align: center;
- font-size: 26rpx;
- color: #333333;
- margin-top: 10rpx;
- }
- }
-
- .comparesize {
- font-size: 26rpx;
- color: #333;
- margin: 30rpx 30rpx 0 30rpx;
- display: flex;
- align-items: center;
- }
-
- .grid:nth-child(1) {
- border-right: 1rpx solid #E0E0E0;
- border-bottom: 1rpx solid #E0E0E0;
- }
-
- .grid:nth-child(2) {
- border-bottom: 1rpx solid #E0E0E0;
- }
-
- .grid:nth-child(3) {
- border-right: 1rpx solid #E0E0E0;
- }
-
- .chart {
- padding: 40rpx 0 20rpx;
- min-height: 50vh;
-
- .marketingBusiness {
- display: flex;
- justify-content: center;
- align-items: center;
-
- .marketingBusinesstext {
- padding: 0 20rpx;
- display: flex;
- align-items: center;
- border-radius: 8rpx;
- border: 1rpx solid #666666;
-
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
-
- .righttochoose {
- margin-left: 12rpx;
- width: 18rpx;
- height: 24rpx;
- }
- }
- }
- }
-
- .screen {
- width: 100%;
-
- .boxtittab {
- width: 100%;
- flex-direction: column;
- border: none;
-
- .tabbox {
- width: 100%;
- }
- }
- }
- </style>
|