Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 

1545 wiersze
43 KiB

  1. <template>
  2. <view>
  3. <!-- 选择器 -->
  4. <view class="boxtittab">
  5. <view class="tabbox" @click="timeshow = true">
  6. {{ time }}
  7. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  8. </view>
  9. <view class="tabbox" @click="timeshow = true">
  10. {{ team }}
  11. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  12. </view>
  13. <view class="tabbox" @click="selectshow = true">
  14. {{ guwen }}
  15. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  16. </view>
  17. <view class="tabbox" @click="huashuShow = true">
  18. {{huashu}}<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  19. </view>
  20. </view>
  21. <!--<view class="timetabct">
  22. <view class="timetabctview">
  23. <view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0)">7天</view>
  24. </view>
  25. <view class="timetabctview">
  26. <view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1)">15天</view>
  27. </view>
  28. <view class="timetabctview">
  29. <view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2)">30天</view>
  30. </view>
  31. </view> -->
  32. <view class="timepick">
  33. <view class="timepicktime">
  34. <view @click="tabtimetap(3)">{{sheartime1}}</view>
  35. <view>
  36. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  37. </view>
  38. </view>
  39. <view class="timepickpick">
  40. <view @click="checkboxChange()" style="width: 40rpx;height:40rpx;border: 1rpx solid #E0E0E0;">
  41. <image v-if="timepickpickisshow" style="width: 40rpx;height: 40rpx;"
  42. src="../../../static/images/xuanzhong.png" mode=""></image>
  43. </view>
  44. <view style="font-size:26rpx;text-indent: 12rpx;">对比</view>
  45. </view>
  46. <view class="timepicktime" v-if="timepickpickisshow">
  47. <view @click="tabtimetap(4)">{{sheartime2}}</view>
  48. <view>
  49. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  50. </view>
  51. </view>
  52. </view>
  53. <view class="timeduibi">
  54. <view class="timeshow">数据起始时间:<text style="color: #333333;">{{kanbanlist.kaishitime}}</text></view>
  55. <view class="timeshow" v-if="kanbanlist.duibitime.length!=0">
  56. 数据对比时间:
  57. <text style="color: #333333;">{{kanbanlist.duibitime}}</text>
  58. </view>
  59. </view>
  60. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  61. <!-- 简报 -->
  62. <view class="boxzonglan" style="min-height: 100rpx;">
  63. <view class="zonglantit">简报</view>
  64. <view class="zonglanbox">
  65. <view class="grid" v-for="(item,index) in numlist" :key="index"
  66. style="height: auto;padding-bottom: 20rpx;">
  67. <view class="audonum" v-if="item.name=='接待时长'">{{item.name}}/分</view>
  68. <view class="audonum" v-else>{{item.name}}</view>
  69. <view class="num">
  70. <view class="" style="width: 35%;">
  71. {{index==1?item.num+'%':item.num}}
  72. </view>
  73. <view class="comparesize" v-if="compareFlag&&timepickpickisshow">
  74. <text style="margin-right: 10rpx;">对比:{{index==1?item.num1+'%':item.num1}} </text>
  75. <template v-if="item.num2*1 != 0">
  76. <text
  77. :style="{color:item.num2*1>0?'red':'green'}">{{item.num2+'%'}}{{item.num2*1 > 0 ? '↑':'↓'}}</text>
  78. </template>
  79. <template v-else>
  80. <text
  81. :style="{color:item.num2*1>0?'red':'green'}">{{item.num2+'%'}}</text>
  82. </template>
  83. </view>
  84. </view>
  85. </view>
  86. </view>
  87. </view>
  88. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  89. <view class="boxtittab" style="border: none;height: 82rpx;">
  90. <!-- <view class="tabbox">
  91. <view :class="{ activecllasscet2: newactiveTotal == 0 }" @click="tabxuanxiangtap(0)">项目</view>
  92. </view>
  93. <view class="tabbox">
  94. <view :class="{ activecllasscet2: newactiveTotal == 1 }" @click="tabxuanxiangtap(1)">顾问</view>
  95. </view>
  96. <view class="tabbox">
  97. <view :class="{ activecllasscet2: newactiveTotal == 2 }" @click="tabxuanxiangtap(2)">团队</view>
  98. </view> -->
  99. <view class="tabbox">
  100. <view :class="{ activecllasscet2: newactiveTotal == 0 }" @click="tabxuanxiangtap(0)">平均执行率</view>
  101. </view>
  102. <view class="tabbox">
  103. <view :class="{ activecllasscet2: newactiveTotal == 1 }" @click="tabxuanxiangtap(1)">平均挖掘率</view>
  104. </view>
  105. <view class="tabbox">
  106. <view :class="{ activecllasscet2: newactiveTotal == 2 }" @click="tabxuanxiangtap(2)">挖掘场景</view>
  107. </view>
  108. <view class="tabbox">
  109. <view :class="{ activecllasscet2: newactiveTotal == 3 }" @click="tabxuanxiangtap(3)">销讲一级</view>
  110. </view>
  111. <view class="tabbox">
  112. <view :class="{ activecllasscet2: newactiveTotal == 4 }" @click="tabxuanxiangtap(4)">销讲二级</view>
  113. </view>
  114. </view>
  115. <view class="chart">
  116. <!-- <view
  117. style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;"
  118. v-if="guwenshow&&lopanobj.name" @click="oninputtap()">
  119. <view class="title2-che" style="width: 220rpx;">{{lopanobj.name}}
  120. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  121. </view>
  122. </view> -->
  123. <view style="padding: 30rpx;padding-bottom: 20rpx;align-items: center;" v-if="Selectlevel">
  124. <view style="display: flex;align-items: center;border-bottom: 1px solid #C9C9C9;height: 80rpx;">
  125. <view>选择一级:</view>
  126. <view style="width:75%;">
  127. <input @click="oninputtap2()" v-model="Selectlevelobj.name" type="text" disabled="true"
  128. :border="border" placeholder="请选择" />
  129. </view>
  130. <view>
  131. <image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/qf/more.png"
  132. style="width:12rpx;height:23rpx;margin-left: 16rpx;">
  133. </view>
  134. <!-- <view style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;"
  135. v-if="Selectlevelobj.name" @click="oninputtap2()">
  136. <view class="title2-che" style="width: 220rpx;">{{Selectlevelobj.name}}
  137. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  138. </view>
  139. </view> -->
  140. </view>
  141. <view style="display: flex;align-items: center;border-bottom: 1px solid #C9C9C9;height: 80rpx;">
  142. <view>选择二级:</view>
  143. <view style="width:75%;">
  144. <input @click="oninputtap3()" v-model="erSelectlevelobj.name" type="text" disabled="true"
  145. :border="border" placeholder="请选择" />
  146. </view>
  147. <view>
  148. <image src="https://qufang.oss-cn-beijing.aliyuncs.com/upload/icon/xcx/jjycrm/qf/more.png"
  149. style="width:12rpx;height:23rpx;margin-left: 16rpx;">
  150. </view>
  151. <!-- <view style="display: flex;justify-content:center;padding-left: 30rpx;padding-right: 30rpx;margin-top: 16rpx;"
  152. v-if="erSelectlevelobj.name" @click="oninputtap3()">
  153. <view class="title2-che" style="width: 220rpx;">{{erSelectlevelobj.name}}
  154. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  155. </view>
  156. </view> -->
  157. </view>
  158. </view>
  159. <view style="display: flex;align-items: center;height: 80rpx;justify-content: center;"
  160. v-if="Selecttuandui&&Selecttuanduiobj.name" @click="oninputtap4()">
  161. <view class="title2-che" style="width: 220rpx;">{{Selecttuanduiobj.name}}
  162. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  163. </view>
  164. </view>
  165. <view class="single">
  166. <!-- <view class="danwei" style="margin-top: 10rpx;">销讲词执行率</view> -->
  167. <view class="uchaserbox" :class="{ uchaserboxs : newactiveTotal == 1 || newactiveTotal == 3 }"
  168. v-if="lineOptsect.series.length!=0">
  169. <qiun-data-charts :style="!showCanvas?'display:none':''" :type="linetype" :chartData="lineOptsect"
  170. background="none" :ontouch="true" canvasId="wangxiaohuaerlingeryilingwuyibao" :opts="opts"
  171. :canvas2d="true" />
  172. </view>
  173. <view v-else style="width: 100%;">
  174. <view style="width: 100%;text-align: center;">
  175. <image style="width: 200rpx;height: 200rpx;"
  176. src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  177. </view>
  178. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  179. </view>
  180. </view>
  181. </view>
  182. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  183. <view class="single" v-if="timepickpickisshow">
  184. <view class="title">
  185. <view class="title1">对比报表</view>
  186. </view>
  187. <view class="table" v-if="!guwenFlag">
  188. <view v-for="(item,index) in tableDate" :key="index">
  189. <view class="tr">
  190. <view v-for="(item1,index1) in item" :key="index" style="width: 100%;">
  191. <view v-if="index1<item.length-1||index==0" class="td"
  192. style="border-right:1px solid #E0E0E0;">{{item1}}</view>
  193. <view v-if="index>0 && index1==item.length-1" class="td"
  194. style="border-right:1px solid #E0E0E0;" :style="{color:item1*1>0?'red':'green'}">
  195. {{item1==0?'--':item1+'%'}}{{item1*1>0?'↑':item1*1<0?'↓':''}}
  196. </view>
  197. </view>
  198. </view>
  199. </view>
  200. </view>
  201. <view class="table" v-if="guwenFlag" style="width: 100%;">
  202. <scroll-view scroll-x="true" style="white-space: nowrap;">
  203. <view v-for="(item,index) in tableDate" :key="index"
  204. :style="{display:index==0?'inline-block':'block'}">
  205. <view class="tr" style="display: inline-block;">
  206. <view v-for="(item1,index1) in item" :key="index1" class="trd"
  207. style="display: inline-block;">
  208. <view v-if="index==1&&index1>0" class="td" :style="{color:item1*1>0?'red':'green'}"
  209. style="border-right:1px solid #E0E0E0;">
  210. {{item1==0?'--':item1+'%'}}{{item1*1>0?'↑':item1*1<0?'↓':''}}
  211. </view>
  212. <view v-else-if="index>1&&index1>0" class="td" style="border-right:1px solid #E0E0E0;">
  213. {{item1+'%'}}
  214. </view>
  215. <view v-else class="td" style="border-right:1px solid #E0E0E0;">{{item1}}</view>
  216. </view>
  217. </view>
  218. </view>
  219. </scroll-view>
  220. </view>
  221. </view>
  222. <view style="width: 100%;height: 60rpx;"></view>
  223. <u-select v-model="Showhiddenunits" mode="single-column" :list="selectlist" @confirm="confirm"
  224. :default-value="selindexList">
  225. </u-select>
  226. <u-select v-model="Showhiddenunits2" mode="single-column" :list="selectlist2" @confirm="confirm2"
  227. :default-value="selindex">
  228. </u-select>
  229. <u-select v-model="Showhiddenunits3" mode="single-column" :list="selectlist3" @confirm="confirm3"
  230. :default-value="selindex">
  231. </u-select>
  232. <u-select v-model="Showhiddenunits4" mode="single-column" :list="selectlist4" @confirm="confirm4"
  233. :default-value="selindexList4">
  234. </u-select>
  235. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  236. <newcalendar v-model="totalTimeShow2" :planNum='intervaltime' mode="date" @change="totalTimeChange2">
  237. </newcalendar>
  238. <!-- 接待时间 -到访时间-->
  239. <u-popup v-model="timeshow" mode="bottom">
  240. <view class="timeview" :style="{ color: activeTotal == 5 ? '#2B6EFF' : '#333333' }"
  241. @click="tabtimetap(5, '接待时间')">
  242. 全部</view>
  243. <view class="timeview" :style="{ color: activeTotal == 0 ? '#2B6EFF' : '#333333' }"
  244. @click="tabtimetap(0, '今天')">
  245. 今天</view>
  246. <view class="timeview" :style="{ color: activeTotal == 1 ? '#2B6EFF' : '#333333' }"
  247. @click="tabtimetap(1, '昨天')">
  248. 昨天</view>
  249. <view class="timeview" :style="{ color: activeTotal == 2 ? '#2B6EFF' : '#333333' }"
  250. @click="tabtimetap(2, '近7天')">
  251. 近7天</view>
  252. <view class="timeview" :style="{ color: activeTotal == 3 ? '#2B6EFF' : '#333333' }"
  253. @click="tabtimetap(3, '近30天')">
  254. 近30天</view>
  255. <view class="timeview" :style="{ color: activeTotal == 4 ? '#2B6EFF' : '#333333' }"
  256. @click="tabtimetap(4, '')">
  257. 自定义</view>
  258. </u-popup>
  259. <!-- 顾问 -->
  260. <u-select v-model="selectshow" :list="freeList" @confirm="actionSelectCallback"></u-select>
  261. <!-- 全部话术 -->
  262. <u-select v-model="huashushow" :list="huashuList" @confirm="actionSelectCallback1"></u-select>
  263. <!-- 加载组件 -->
  264. <loading v-model="LOADING"></loading>
  265. </view>
  266. </template>
  267. <script>
  268. import newcalendar from '@/components/newcalendar/newcalendar.vue';
  269. import loading from "@/components/loading/index.vue"
  270. export default {
  271. components: {
  272. newcalendar,
  273. loading
  274. },
  275. data() {
  276. return {
  277. time: '接待时间',
  278. team: '部门',
  279. guwen: '顾问',
  280. huashu: '全部话术',
  281. huashuList: false,
  282. huashuShow: false,
  283. freeList: [], //顾问
  284. selindexList: [0], // 默认选中第一项
  285. selindexList4: [0], // 默认选中第一项
  286. compareFlag: false,
  287. numlist: [{
  288. name: '接待量',
  289. num: '10',
  290. num1: '0',
  291. num2: '0'
  292. },
  293. {
  294. name: '平均执行率',
  295. num: '10',
  296. num1: '0',
  297. num2: '0'
  298. },
  299. {
  300. name: '接待时长',
  301. num: '10',
  302. num1: '0',
  303. num2: '0'
  304. },
  305. {
  306. name: '有效接待',
  307. num: '10',
  308. num1: '0',
  309. num2: '0'
  310. },
  311. ],
  312. activeTotal: 0, //时间下标
  313. newactiveTotal: 0, //tab下标
  314. totalTimeShow: false,
  315. totalTimeShow2: false,
  316. totalTimeShow3: false,
  317. cWidth: uni.upx2px(690),
  318. cHeight: uni.upx2px(453),
  319. AcHeight: uni.upx2px(500),
  320. kanbanlist: { //录音和测评的数据
  321. kaishitime: '',
  322. duibitime: '',
  323. audonum: '',
  324. audotime: "",
  325. avgDuration: '',
  326. fraction: ''
  327. },
  328. pamect: { //接口参数
  329. houseId: '',
  330. timeType: "4",
  331. firstStartDate: '', //第一次开始时间
  332. firstEndDate: '', //第一次结束时间
  333. lastStartDate: '',
  334. lastEndDate: '',
  335. accountId: '', //顾问ids
  336. marketingId: '', //二级销讲id
  337. deptId: "", //部门id
  338. showStatus: 0
  339. },
  340. linetype: "line",
  341. lineOptsect: {}, //图表数据
  342. Showhiddenunits: false,
  343. selectlist: [],
  344. guwenshow: false,
  345. lopanobj: {
  346. id: '',
  347. name: ''
  348. },
  349. //二级相关
  350. Selectlevel: false,
  351. Selectlevelobj: {
  352. id: '',
  353. name: ''
  354. },
  355. erSelectlevelobj: {
  356. id: '',
  357. name: ''
  358. },
  359. Showhiddenunits2: false,
  360. Showhiddenunits3: false,
  361. selectlist2: [],
  362. selectlist3: [],
  363. //团队相关
  364. Selecttuandui: false,
  365. selectlist4: [],
  366. Selecttuanduiobj: {
  367. id: '',
  368. name: ''
  369. },
  370. Showhiddenunits4: false,
  371. showCanvas: true,
  372. timepickpickisshow: false,
  373. sheartime1: "",
  374. sheartime2: "",
  375. intervaltime: 0,
  376. tableDate: [],
  377. guwenFlag: false,
  378. opts: {}, // 配置项为空
  379. };
  380. },
  381. onLoad(option) {
  382. this.LOADING = true
  383. this.pamect.houseId = uni.getStorageSync('buildingID').id;
  384. this.init()
  385. this.getFreeList()
  386. if (option.type == 1) {
  387. this.timepickpickisshow = true
  388. this.pamect.firstStartDate = option.staTime
  389. this.pamect.firstEndDate = option.endtime
  390. this.pamect.lastStartDate = option.staTime1
  391. this.pamect.lastEndDate = option.endtime1
  392. this.pamect.timeType = ''
  393. this.sheartime1 = `${this.fomatDate(this.pamect.firstStartDate)}-${this.fomatDate(this.pamect.firstEndDate)}`
  394. this.sheartime2 = `${this.fomatDate(this.pamect.lastStartDate)}-${this.fomatDate(this.pamect.lastEndDate)}`
  395. this.tabxuanxiangtap(3)
  396. this.$forceUpdate()
  397. }
  398. },
  399. onPullDownRefresh() {
  400. this.init()
  401. setTimeout(function() {
  402. uni.stopPullDownRefresh();
  403. }, 1000);
  404. },
  405. watch: {
  406. Showhiddenunits(newValue, oldValue) {
  407. this.showCanvas = !newValue
  408. },
  409. Showhiddenunits2(newValue, oldValue) {
  410. this.showCanvas = !newValue
  411. },
  412. Showhiddenunits3(newValue, oldValue) {
  413. this.showCanvas = !newValue
  414. },
  415. Showhiddenunits4(newValue, oldValue) {
  416. this.showCanvas = !newValue
  417. },
  418. totalTimeShow(newValue, oldValue) {
  419. this.showCanvas = !newValue
  420. },
  421. totalTimeShow2(newValue, oldValue) {
  422. this.showCanvas = !newValue
  423. },
  424. totalTimeShow3(newValue, oldValue) {
  425. this.showCanvas = !newValue
  426. },
  427. },
  428. methods: {
  429. // 顾问
  430. actionSelectCallback(e) {
  431. // this.screen.agentId = e[0].value;
  432. // this.counselorName = e[0].label;
  433. },
  434. // 话术
  435. actionSelectCallback1(e) {
  436. // this.screen.agentId = e[0].value;
  437. // this.counselorName = e[0].label;
  438. },
  439. //获取顾问列表
  440. getFreeList() {
  441. this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
  442. houseId: this.pamect.houseId
  443. }).then(res => {
  444. this.freeList = res;
  445. this.huashuList = res;
  446. if(this.freeList.length){
  447. this.freeList.forEach(item => {
  448. item.label = item.name;
  449. item.value = item.accountId
  450. })
  451. }
  452. })
  453. },
  454. // 时间格式转换
  455. fomatDate(date) {
  456. if (!date) return '--'
  457. let arr = date.split(' ')
  458. let str = arr[0]
  459. let result = str.split('-')
  460. return `${result[1]}-${result[2]}`
  461. },
  462. //是否对比
  463. checkboxChange() {
  464. if (this.newactiveTotal == 3) {
  465. uni.showToast({
  466. title: '销讲一级无对比',
  467. duration: 2000
  468. });
  469. return
  470. }
  471. if (this.newactiveTotal == 2) {
  472. if (this.Selecttuanduiobj.id == '') {
  473. uni.showToast({
  474. title: '全部团队无对比',
  475. duration: 2000
  476. });
  477. return
  478. }
  479. }
  480. if (this.timepickpickisshow == true) {
  481. this.timepickpickisshow = false;
  482. this.pamect.showStatus = 0;
  483. this.init()
  484. } else {
  485. this.timepickpickisshow = true;
  486. this.pamect.showStatus = 1;
  487. }
  488. this.activeTotal = 8;
  489. },
  490. init() {
  491. this.$u.post("/cusLvStatistics/lyAndcp", this.pamect).then(data => {
  492. this.pamect.lastStartDate = data.lastStartDate;
  493. this.pamect.lastEndDate = data.lastEndDate;
  494. this.numlist[0].num = data.startSumCustomer
  495. this.numlist[1].num = data.startFraction;
  496. this.numlist[2].num = Math.floor(data.startSumDuration / 60) || 0;
  497. if (data.endSumDuration != null) {
  498. this.compareFlag = true
  499. // return
  500. this.numlist[0].num1 = data.endSumCustomer
  501. this.numlist[1].num1 = data.endFraction;
  502. this.numlist[2].num1 = Math.floor(data.endSumDuration / 60) || 0;
  503. this.numlist[0].num2 = data.contrastSumCustomer
  504. this.numlist[1].num2 = data.contrastFraction;
  505. this.numlist[2].num2 = data.contrastSumDuration || 0;
  506. } else {
  507. this.compareFlag = false
  508. }
  509. this.sheartime1 = data.lastStartDate.substring(5, 10) + "--" + data.lastEndDate.substring(5,
  510. 10);
  511. this.sheartime2 = '请选择';
  512. this.kanbanlist.duibitime = '';
  513. var kaishi = this.DateDiff(data.lastStartDate, data.lastEndDate);
  514. this.kanbanlist.kaishitime = data.lastStartDate + "至" + data.lastEndDate + "(" + kaishi + "天)";
  515. if (this.pamect.showStatus == 1) {
  516. this.sheartime2 = data.firstStartDate.substring(5, 10) + "--" + data.firstEndDate
  517. .substring(5, 10);
  518. var jeishu = this.DateDiff(data.firstStartDate, data.firstEndDate);
  519. this.kanbanlist.duibitime = data.firstStartDate + "至" + data.firstEndDate + "(" + jeishu +
  520. "天)";
  521. }
  522. this.kanbanlist.audonum = data.sumCustomer;
  523. this.kanbanlist.audotime = data.avgDuration;
  524. this.kanbanlist.avgDuration = data.fraction;
  525. this.kanbanlist.fraction = data.fraction;
  526. if (this.newactiveTotal == 0) {
  527. this.ProjectDimension()
  528. } else if (this.newactiveTotal == 1) {
  529. if (this.pamect.accountId == "") {
  530. this.getguwenlist()
  531. } else {
  532. this.ConsultantDimension()
  533. }
  534. } else if (this.newactiveTotal == 2) {
  535. if (this.pamect.deptId == "") {
  536. this.getuanduilist()
  537. } else {
  538. this.TeamCompared()
  539. }
  540. } else if (this.newactiveTotal == 3) {
  541. this.speakingLevel()
  542. } else {
  543. if (this.pamect.marketingId == '') {
  544. this.getonsyiji()
  545. } else {
  546. this.aboutEecondary()
  547. }
  548. }
  549. setTimeout(() => {
  550. this.LOADING = false
  551. }, 1500)
  552. }).catch(e => {
  553. this.LOADING = false
  554. })
  555. },
  556. //起始时间
  557. totalTimeChange(e) {
  558. this.pamect.lastStartDate = e.startDate;
  559. this.pamect.lastEndDate = e.endDate;
  560. var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
  561. this.kanbanlist.kaishitime = this.pamect.lastStartDate + "至" + this.pamect.lastEndDate + "(" + kaishi +
  562. "天)";
  563. if (this.pamect.showStatus == 0) {
  564. this.init()
  565. this.totalTimeShow = false;
  566. } else {
  567. if (this.pamect.firstStartDate.length == 0) {
  568. uni.showToast({
  569. title: '请选择对比时间',
  570. duration: 2000
  571. });
  572. } else {
  573. var jshu = this.DateDiff(this.pamect.firstStartDate, this.pamect.firstEndDate)
  574. if (kaishi == jshu) {
  575. this.init()
  576. } else {
  577. uni.showToast({
  578. title: '请选择相同天数',
  579. duration: 2000
  580. });
  581. }
  582. }
  583. this.totalTimeShow = false;
  584. }
  585. },
  586. //对比时间
  587. totalTimeChange2(e) {
  588. console.log(e)
  589. var d = new Date(e.result.replace(/\-/g, '/'));
  590. d.setDate(d.getDate() + this.intervaltime);
  591. var year = d.getFullYear();
  592. var month = d.getMonth() + 1;
  593. if (month < 10) month = '0' + month;
  594. var day = d.getDate();
  595. if (day < 10) day = '0' + day;
  596. this.pamect.firstStartDate = e.result;
  597. this.pamect.firstEndDate = year + '-' + month + '-' + day;
  598. console.log(this.pamect.firstStartDate)
  599. var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
  600. var jeishu = this.DateDiff(this.pamect.firstStartDate, this.pamect.firstEndDate)
  601. this.kanbanlist.duibitime = this.pamect.firstStartDate + "至" + this.pamect.firstEndDate + "(" + jeishu +
  602. "天)";
  603. console.log(this.pamect.lastStartDate, this.pamect.lastEndDate, kaishi, jeishu)
  604. if (kaishi == jeishu) {
  605. this.init()
  606. } else {
  607. uni.showToast({
  608. title: '请选择相同天数',
  609. duration: 2000
  610. });
  611. }
  612. this.totalTimeShow2 = false;
  613. },
  614. //自定义时间
  615. totalTimeChange3(e) {
  616. this.pamect.firstStartDate = "";
  617. this.pamect.firstEndDate = "";
  618. this.pamect.lastStartDate = e.startDate;
  619. this.pamect.lastEndDate = e.endDate;
  620. this.init()
  621. this.totalTimeShow3 = false;
  622. },
  623. //时间切换
  624. tabtimetap(index) {
  625. if (index == 0) {
  626. this.pamect.timeType = "4";
  627. this.pamect.firstStartDate = '';
  628. this.pamect.firstEndDate = '';
  629. this.pamect.lastStartDate = '';
  630. this.pamect.lastEndDate = '';
  631. this.init()
  632. } else if (index == 1) {
  633. this.pamect.timeType = "5";
  634. this.pamect.firstStartDate = '';
  635. this.pamect.firstEndDate = '';
  636. this.pamect.lastStartDate = '';
  637. this.pamect.lastEndDate = '';
  638. this.init()
  639. } else if (index == 2) {
  640. this.pamect.timeType = "6";
  641. this.pamect.firstStartDate = '';
  642. this.pamect.firstEndDate = '';
  643. this.pamect.lastStartDate = '';
  644. this.pamect.lastEndDate = '';
  645. this.init()
  646. } else if (index == 3) {
  647. this.pamect.timeType = "";
  648. this.totalTimeShow = true;
  649. } else if (index == 4) {
  650. this.pamect.timeType = "";
  651. var kaishi = this.DateDiff(this.pamect.lastStartDate, this.pamect.lastEndDate)
  652. console.log(kaishi)
  653. this.intervaltime = kaishi - 1;
  654. this.totalTimeShow2 = true;
  655. } else {
  656. this.pamect.timeType = "";
  657. this.totalTimeShow3 = true;
  658. }
  659. this.activeTotal = index;
  660. },
  661. //tab切换
  662. tabxuanxiangtap(index) {
  663. this.newactiveTotal = index;
  664. this.guwenshow = false;
  665. this.Selectlevel = false;
  666. this.Selecttuandui = false;
  667. // this.tableDate = []
  668. // this.pamect.showStatus = 0;
  669. // this.pamect.timeType = "4";
  670. // this.pamect.firstStartDate = '';
  671. // this.pamect.firstEndDate = '';
  672. // this.pamect.lastStartDate = '';
  673. // this.pamect.lastEndDate = '';
  674. // this.pamect.accountId = '';
  675. // this.pamect.marketingId = '';
  676. // this.pamect.deptId = ""
  677. // this.activeTotal = 0;
  678. this.timepickpickisshow = false;
  679. this.init()
  680. if (index == 1) {
  681. this.guwenshow = true;
  682. }
  683. },
  684. //项目维度
  685. ProjectDimension() {
  686. const that = this;
  687. that.lineOptsect = {
  688. categories: [],
  689. series: []
  690. };
  691. this.linetype = "line";
  692. this.$u.post("/cusLvStatistics/teamOrOneValueShow", this.pamect).then(data => {
  693. if (this.pamect.showStatus == 0) {
  694. that.lineOptsect = {
  695. categories: [],
  696. series: [{
  697. name: '起始时间',
  698. data: [],
  699. color: '#7ED3F4'
  700. }]
  701. }
  702. data.lastValue.forEach((child, zxc) => {
  703. that.lineOptsect.categories.push(child.statDate.substring(5, 10))
  704. })
  705. that.lineOptsect.series[0].data = data.lastValue.map(item => item.fraction);
  706. } else {
  707. that.lineOptsect = {
  708. categories: [],
  709. series: [{
  710. name: '起始时间',
  711. data: [],
  712. color: '#7ED3F4'
  713. },
  714. {
  715. name: '对比时间',
  716. data: [],
  717. color: '#FF7070'
  718. },
  719. ]
  720. }
  721. data.firstValue.forEach((item, sdf) => {
  722. data.lastValue.forEach((child, zxc) => {
  723. if (sdf == zxc) {
  724. that.lineOptsect.categories.push(
  725. child.statDate.substring(5, 10) + 'vs' + item.statDate
  726. .substring(5, 10)
  727. )
  728. }
  729. })
  730. })
  731. that.lineOptsect.series[1].data = data.firstValue.map(item => item.fraction);
  732. that.lineOptsect.series[0].data = data.lastValue.map(item => item.fraction)
  733. that.guwenFlag = false
  734. // // 处理表格数据
  735. let arr = [
  736. ['时间', '时段一', '时段二', '变化']
  737. // {
  738. // time:'时间',
  739. // time1:'时段一',
  740. // time2:'时段二',
  741. // compare:'变化'
  742. // },
  743. ]
  744. that.lineOptsect.categories.map((item, index) => {
  745. let newarr = [item, data.lastValue[index].fraction, data.firstValue[index]
  746. .fraction, data.contrast[index].data
  747. ]
  748. // obj.time=item
  749. // obj.time1=data.firstValue[index].fraction
  750. // obj.time2=data.lastValue[index].fraction
  751. // obj.compare=data.contrast[index].data
  752. // arr.push(obj)
  753. arr.push(newarr)
  754. })
  755. // console.log(arr)
  756. that.tableDate = arr
  757. }
  758. });
  759. },
  760. //顾问维度
  761. ConsultantDimension() {
  762. const that = this;
  763. that.lineOptsect = {
  764. categories: [],
  765. series: []
  766. };
  767. this.linetype = "radar";
  768. this.$u.post("/cusLvStatistics/accFirstLevelContrast", this.pamect).then(data => {
  769. // return
  770. let max = data.firstList[0].total
  771. for (let i = 0; i < data.firstList.length; i++) {
  772. if (max < data.firstList[i]) max = data.firstList[i];
  773. }
  774. this.opts = {
  775. ...this.opts,
  776. fontSize: 10,
  777. extra: {
  778. radar: {
  779. max: max + 25
  780. }
  781. }
  782. }
  783. if (this.pamect.showStatus == 0) {
  784. that.lineOptsect = {
  785. categories: [],
  786. series: [{
  787. name: '时段一',
  788. data: [],
  789. color: '#7ED3F4'
  790. }]
  791. }
  792. data.firstList.forEach((item, sdf) => {
  793. that.lineOptsect.categories.push(item.name)
  794. that.lineOptsect.series[0].data.push(data.firstList[sdf].total)
  795. })
  796. console.log(this.lineOptsect, 'console.log(this.lineOptsect)')
  797. // that.lineOptsect.series[0].data = data.lastValue.map(item => item.fraction);
  798. } else {
  799. // 当有对比的时候
  800. that.lineOptsect = {
  801. categories: [],
  802. series: [{
  803. name: '时段一',
  804. data: [],
  805. color: '#7ED3F4'
  806. },
  807. {
  808. name: '时段二',
  809. data: [],
  810. color: '#FF7070'
  811. },
  812. ]
  813. }
  814. data.headerList.forEach((item, sdf) => {
  815. that.lineOptsect.categories.push(item.name)
  816. that.lineOptsect.series[0].data.push(data.firstList[sdf].total)
  817. that.lineOptsect.series[1].data.push(data.secondList[sdf].total)
  818. })
  819. // return
  820. // // 处理表格数据
  821. that.guwenFlag = true
  822. let arr = []
  823. arr[0] = ['时间', ...that.lineOptsect.categories]
  824. arr[1] = ['变化']
  825. arr[2] = ['时段一']
  826. arr[3] = ['时段二']
  827. // console.log(arr)
  828. data.firstList.map((item, index) => {
  829. arr[2].push(item.total)
  830. arr[3].push(data.secondList[index].total)
  831. arr[1].push(data.thirdList[index].total)
  832. })
  833. that.tableDate = arr
  834. console.log(this.lineOptsect, 'console.log(this.lineOptsect)')
  835. }
  836. });
  837. },
  838. // 顾问纬度选择顾问
  839. oninputtap() {
  840. this.Showhiddenunits = true;
  841. },
  842. // 顾问选择确认
  843. confirm(e) {
  844. this.lopanobj.id = e[0].value;
  845. this.lopanobj.name = e[0].label;
  846. this.pamect.accountId = this.lopanobj.id;
  847. this.ConsultantDimension()
  848. this.Showhiddenunits = false;
  849. for (let i = 0; i < this.selectlist.length; i++) {
  850. if (e[0].value == this.selectlist[i].value) {
  851. this.selindexList[0] = i
  852. }
  853. }
  854. },
  855. //获取顾问
  856. getguwenlist() {
  857. this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
  858. houseId: this.pamect.houseId
  859. }).then(data => {
  860. this.selectlist = [];
  861. if (data.length == 0) {
  862. this.lineOptsect = {
  863. categories: [],
  864. series: []
  865. };
  866. this.guwenshow = false;
  867. return
  868. } else {
  869. this.guwenshow = true;
  870. data.forEach(item => {
  871. this.selectlist.push({
  872. value: item.accountId,
  873. label: item.name
  874. })
  875. })
  876. this.lopanobj.id = data[0].accountId;
  877. this.lopanobj.name = data[0].name;
  878. this.pamect.accountId = this.lopanobj.id;
  879. this.ConsultantDimension()
  880. }
  881. })
  882. },
  883. //销讲一级
  884. speakingLevel() {
  885. this.linetype = "radar";
  886. this.lineOptsect = {
  887. categories: [],
  888. series: []
  889. };
  890. this.$u.post("/cusLvStatistics/firstLevelContrast", this.pamect).then(data => {
  891. if (data.length == 0) {
  892. return
  893. } else {
  894. let max = data[0].avgExecutionRate
  895. let list = data.map(item => {
  896. return item.name
  897. });
  898. let list1 = data.map(item => {
  899. if (item.avgExecutionRate == null) {
  900. item.avgExecutionRate = 0
  901. } else {
  902. item.avgExecutionRate = item.avgExecutionRate
  903. }
  904. if (max < item.avgExecutionRate) max = item.avgExecutionRate;
  905. return item.avgExecutionRate
  906. });
  907. this.opts = {
  908. ...this.opts,
  909. fontSize: 10,
  910. extra: {
  911. radar: {
  912. max: max + 25
  913. }
  914. }
  915. }
  916. this.lineOptsect = {
  917. "categories": list,
  918. "series": [{
  919. "name": "销讲一级",
  920. "data": list1
  921. }]
  922. }
  923. }
  924. })
  925. },
  926. //销讲二级
  927. aboutEecondary() {
  928. this.lineOptsect = {};
  929. this.linetype = "line";
  930. this.$u.post("/cusLvStatistics/level2Contrast", this.pamect).then(data => {
  931. if (this.pamect.showStatus == 0) {
  932. this.lineOptsect = {
  933. categories: [],
  934. series: [{
  935. name: '起始时间',
  936. data: [],
  937. color: '#7ED3F4'
  938. }]
  939. }
  940. data.lastList.forEach((item, sdf) => {
  941. this.lineOptsect.categories.push(item.statDate.substring(5, 10))
  942. })
  943. this.lineOptsect.series[0].data = data.lastList.map(item => item.avgExecutionRate);
  944. } else {
  945. this.lineOptsect = {
  946. categories: [],
  947. series: [{
  948. name: '起始时间',
  949. data: [],
  950. color: '#7ED3F4'
  951. },
  952. {
  953. name: '对比时间',
  954. data: [],
  955. color: '#FF7070'
  956. },
  957. ]
  958. }
  959. data.firstList.forEach((item, sdf) => {
  960. data.lastList.forEach((child, zxc) => {
  961. if (sdf == zxc) {
  962. this.lineOptsect.categories.push(
  963. child.statDate.substring(5, 10) + 'vs' + item.statDate
  964. .substring(5, 10)
  965. )
  966. }
  967. })
  968. })
  969. this.lineOptsect.series[1].data = data.firstList.map(item => item.avgExecutionRate);
  970. this.lineOptsect.series[0].data = data.lastList.map(item => item.avgExecutionRate)
  971. let that = this
  972. this.guwenFlag = false
  973. // // 处理表格数据
  974. let arr = [
  975. ['时间', '时段一', '时段二', '变化']
  976. ]
  977. that.lineOptsect.categories.map((item, index) => {
  978. let newarr = [item, data.lastList[
  979. index].avgExecutionRate, data.firstList[index].avgExecutionRate,
  980. data.contrast[index].data
  981. ]
  982. arr.push(newarr)
  983. })
  984. // console.log(arr)
  985. that.tableDate = arr
  986. }
  987. })
  988. },
  989. //销讲二级:获取一级
  990. getonsyiji() {
  991. this.$u.post("/cusLvStatistics/findAllFirstLevel", {
  992. houseId: this.pamect.houseId
  993. }).then(data => {
  994. this.selectlist2 = [];
  995. if (data.length == 0) {
  996. this.Selectlevel = false;
  997. this.lineOptsect = {
  998. categories: [],
  999. series: []
  1000. };
  1001. return
  1002. } else {
  1003. this.Selectlevel = true;
  1004. data.forEach(item => {
  1005. this.selectlist2.push({
  1006. value: item.marketingId,
  1007. label: item.name
  1008. })
  1009. })
  1010. this.Selectlevelobj.id = data[0].marketingId;
  1011. this.Selectlevelobj.name = data[0].name;
  1012. this.getonserji(this.Selectlevelobj.id)
  1013. }
  1014. })
  1015. },
  1016. //销讲二级:通过一级获取二级
  1017. getonserji(ccd) {
  1018. this.$u.post("/cusLvStatistics/findLevel2ByFirstLevel", {
  1019. houseId: this.pamect.houseId,
  1020. marketingId: ccd
  1021. }).then(data => {
  1022. this.selectlist3 = [];
  1023. data.forEach(item => {
  1024. this.selectlist3.push({
  1025. value: item.marketingId,
  1026. label: item.name
  1027. })
  1028. })
  1029. this.erSelectlevelobj.id = data[0].marketingId;
  1030. this.erSelectlevelobj.name = data[0].name;
  1031. this.pamect.marketingId = this.erSelectlevelobj.id;
  1032. this.aboutEecondary()
  1033. })
  1034. },
  1035. //销讲二级:一级选择
  1036. oninputtap2() {
  1037. this.Showhiddenunits2 = true;
  1038. },
  1039. //销讲二级:二级选择
  1040. oninputtap3() {
  1041. if (this.Selectlevelobj.id == "") {
  1042. uni.showToast({
  1043. title: '请先选择一级',
  1044. duration: 2000
  1045. });
  1046. } else {
  1047. this.Showhiddenunits3 = true;
  1048. }
  1049. },
  1050. //销讲二级:一级选择确认
  1051. confirm2(e) {
  1052. this.Selectlevelobj.id = e[0].value;
  1053. this.Selectlevelobj.name = e[0].label;
  1054. this.getonserji(this.Selectlevelobj.id)
  1055. },
  1056. //销讲二级:二级选择确认
  1057. confirm3(e) {
  1058. this.erSelectlevelobj.id = e[0].value;
  1059. this.erSelectlevelobj.name = e[0].label;
  1060. this.pamect.marketingId = this.erSelectlevelobj.id;
  1061. this.aboutEecondary()
  1062. },
  1063. //团队请选择
  1064. oninputtap4() {
  1065. this.Showhiddenunits4 = true;
  1066. },
  1067. //团队选择确认
  1068. confirm4(e) {
  1069. this.Selecttuanduiobj.id = e[0].value;
  1070. this.Selecttuanduiobj.name = e[0].label;
  1071. this.pamect.deptId = this.Selecttuanduiobj.id;
  1072. this.pamect.showStatus = 0;
  1073. this.pamect.timeType = "4";
  1074. this.pamect.firstStartDate = '';
  1075. this.pamect.firstEndDate = '';
  1076. this.pamect.lastStartDate = '';
  1077. this.pamect.lastEndDate = '';
  1078. this.activeTotal = 0;
  1079. this.timepickpickisshow = false;
  1080. this.init()
  1081. this.TeamCompared()
  1082. for (let i = 0; i < this.selectlist4.length; i++) {
  1083. if (e[0].value == this.selectlist4[i].value) {
  1084. this.selindexList4[0] = i
  1085. }
  1086. }
  1087. },
  1088. //获取团队列表
  1089. getuanduilist() {
  1090. this.$u.post("/cusLvStatistics/findAllDeptIdByHouseId ", {
  1091. houseId: this.pamect.houseId
  1092. }).then(data => {
  1093. this.selectlist4 = [{
  1094. value: "",
  1095. label: "全部"
  1096. }];
  1097. if (data.length == 0) {
  1098. this.Selecttuandui = false;
  1099. this.lineOptsect = {
  1100. categories: [],
  1101. series: []
  1102. };
  1103. return
  1104. } else {
  1105. this.Selecttuandui = true;
  1106. data.forEach(item => {
  1107. this.selectlist4.push({
  1108. value: item.deptId,
  1109. label: item.deptName
  1110. })
  1111. })
  1112. this.Selecttuanduiobj.id = "";
  1113. this.Selecttuanduiobj.name = "全部";
  1114. this.pamect.deptId = this.Selecttuanduiobj.id;
  1115. // this.TeamCompared()
  1116. }
  1117. })
  1118. },
  1119. //团队对比
  1120. TeamCompared() {
  1121. const that = this;
  1122. that.lineOptsect = {};
  1123. this.linetype = "line";
  1124. this.$u.post("/cusLvStatistics/teamOrOneValueShowByDept", this.pamect).then(data => {
  1125. if (this.Selecttuanduiobj.id == "") {
  1126. var newlist = [];
  1127. for (var i in data) {
  1128. var ect = data[i].receptionStatList.map(item => {
  1129. if (item.fraction == null) {
  1130. item.fraction = 0
  1131. } else {
  1132. item.fraction = item.fraction
  1133. }
  1134. return item.fraction
  1135. });
  1136. newlist.push({
  1137. name: data[i].deptName,
  1138. data: ect
  1139. })
  1140. }
  1141. var timelist = [];
  1142. for (var i in data) {
  1143. var ect = data[i].receptionStatList.map(item => {
  1144. return item.statDate
  1145. });
  1146. timelist.push({
  1147. name: data[i].deptName,
  1148. data: ect
  1149. })
  1150. }
  1151. var xAxisdata = [];
  1152. timelist[0].data.forEach((item, sdf) => {
  1153. xAxisdata.push(item.substring(5, 10))
  1154. })
  1155. that.lineOptsect = {
  1156. categories: xAxisdata,
  1157. series: newlist
  1158. }
  1159. } else {
  1160. if (this.pamect.showStatus == 0) {
  1161. that.lineOptsect = {
  1162. categories: [],
  1163. series: [{
  1164. name: '起始时间',
  1165. data: [],
  1166. color: '#7ED3F4'
  1167. }]
  1168. }
  1169. data.lastValue.receptionStatList.forEach((item, sdf) => {
  1170. that.lineOptsect.categories.push(item.statDate.substring(5, 10))
  1171. })
  1172. that.lineOptsect.series[0].data = data.lastValue.receptionStatList.map(item => item
  1173. .fraction);
  1174. } else {
  1175. that.lineOptsect = {
  1176. categories: [],
  1177. series: [{
  1178. name: '起始时间',
  1179. data: [],
  1180. color: '#7ED3F4'
  1181. },
  1182. {
  1183. name: '对比时间',
  1184. data: [],
  1185. color: '#FF7070'
  1186. },
  1187. ]
  1188. }
  1189. data.firstValue.receptionStatList.forEach((item, sdf) => {
  1190. data.lastValue.receptionStatList.forEach((child, zxc) => {
  1191. if (sdf == zxc) {
  1192. that.lineOptsect.categories.push(
  1193. child.statDate.substring(5, 10) + 'vs' + item
  1194. .statDate.substring(5, 10)
  1195. )
  1196. }
  1197. })
  1198. })
  1199. that.lineOptsect.series[1].data = data.firstValue.receptionStatList.map(item => item
  1200. .fraction);
  1201. that.lineOptsect.series[0].data = data.lastValue.receptionStatList.map(item => item
  1202. .fraction)
  1203. that.guwenFlag = false
  1204. // 团队处理数据
  1205. // // 处理表格数据
  1206. let arr = [
  1207. ['时间', '时段一', '时段二', '变化']
  1208. // {
  1209. // time:'时间',
  1210. // time1:'时段一',
  1211. // time2:'时段二',
  1212. // compare:'变化'
  1213. // },
  1214. ]
  1215. that.lineOptsect.categories.map((item, index) => {
  1216. let newarr = [item, data
  1217. .lastValue.receptionStatList[index].fraction, data.firstValue
  1218. .receptionStatList[index].fraction, data.contrast
  1219. .receptionStatList[index].data
  1220. ]
  1221. // obj.time=item
  1222. // obj.time1=data.firstValue[index].fraction
  1223. // obj.time2=data.lastValue[index].fraction
  1224. // obj.compare=data.contrast[index].data
  1225. // arr.push(obj)
  1226. arr.push(newarr)
  1227. })
  1228. // console.log(arr)
  1229. that.tableDate = arr
  1230. }
  1231. }
  1232. });
  1233. },
  1234. //算相隔天数
  1235. DateDiff(sDate1, sDate2) {
  1236. var aDate, oDate1, oDate2, iDays;
  1237. aDate = sDate1.split("-");
  1238. oDate1 = new Date(aDate[1] + '/' + aDate[2] + '/' + aDate[0]); //转换为yyyy-MM-dd格式
  1239. aDate = sDate2.split("-");
  1240. oDate2 = new Date(aDate[1] + '/' + aDate[2] + '/' + aDate[0]);
  1241. iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24); //把相差的毫秒数转换为天数
  1242. return iDays + 1; //返回相差天数
  1243. },
  1244. },
  1245. }
  1246. </script>
  1247. <style lang="scss" scoped>
  1248. .title2-che {
  1249. width: 178rpx;
  1250. height: 48rpx;
  1251. background: #FFFFFF;
  1252. border-radius: 6rpx;
  1253. border: 1px solid #E0E0E0;
  1254. line-height: 48rpx;
  1255. font-size: 28rpx;
  1256. font-weight: 400;
  1257. color: #666666;
  1258. text-indent: 12rpx;
  1259. margin-left: 35rpx;
  1260. position: relative;
  1261. .righttochoose {
  1262. width: 18rpx;
  1263. height: 24rpx;
  1264. position: absolute;
  1265. top: 12rpx;
  1266. right: 12rpx;
  1267. }
  1268. }
  1269. .table {
  1270. border: 0px solid darkgray;
  1271. .tr {
  1272. display: flex;
  1273. // width: 100%;
  1274. justify-content: center;
  1275. height: 64rpx;
  1276. align-items: center;
  1277. border-bottom: 1px solid #E0E0E0;
  1278. flex-wrap: nowrap;
  1279. .td {
  1280. text-align: center;
  1281. font-size: 24rpx;
  1282. font-weight: 400;
  1283. color: #333333;
  1284. height: 64rpx;
  1285. line-height: 64rpx;
  1286. // flex-shrink: 0;
  1287. }
  1288. .trd {
  1289. flex-shrink: 0;
  1290. min-width: 300rpx;
  1291. // border-bottom: 1px solid #ccc;
  1292. }
  1293. .th {
  1294. height: 64rpx;
  1295. text-align: center;
  1296. font-size: 28rpx;
  1297. font-weight: 400;
  1298. color: #666666;
  1299. line-height: 64rpx;
  1300. }
  1301. }
  1302. }
  1303. .uchaserbox {
  1304. width: 100%;
  1305. }
  1306. .uchaserboxs {
  1307. width: 100%;
  1308. height: 70vh;
  1309. }
  1310. .activecllasscet2 {
  1311. color: #2671E2;
  1312. border-bottom: 2px solid #2671E2;
  1313. }
  1314. .timeduibi {
  1315. width: 100%;
  1316. background: #FFFFFF;
  1317. padding-bottom: 10rpx;
  1318. .timeshow {
  1319. color: #666666;
  1320. width: 100%;
  1321. height: 50rpx;
  1322. font-size: 28rpx;
  1323. line-height: 50rpx;
  1324. text-indent: 30rpx;
  1325. }
  1326. }
  1327. // 顶部时间切换
  1328. .timetabct {
  1329. width: 100%;
  1330. height: 98rpx;
  1331. display: flex;
  1332. align-items: center;
  1333. border-bottom: 1px solid #E0E0E0;
  1334. }
  1335. .timetabctview {
  1336. flex: 1;
  1337. height: 100%;
  1338. display: flex;
  1339. justify-content: center;
  1340. align-items: center;
  1341. }
  1342. .timetabct view {
  1343. width: 94rpx;
  1344. text-align: center;
  1345. height: 100%;
  1346. line-height: 98rpx;
  1347. font-size: 28rpx;
  1348. font-family: PingFangSC-Regular, PingFang SC;
  1349. font-weight: 400;
  1350. color: #666666;
  1351. }
  1352. .activecllasscet {
  1353. border-bottom: 2px solid #2671E2;
  1354. }
  1355. // 对比时间切换
  1356. .timepick {
  1357. width: 100%;
  1358. height: 90rpx;
  1359. display: flex;
  1360. align-items: center;
  1361. background: #FFFFFF;
  1362. }
  1363. .timepicktime {
  1364. width: 260rpx;
  1365. height: 50rpx;
  1366. border: 1rpx solid #E0E0E0;
  1367. margin-left: 30rpx;
  1368. display: flex;
  1369. background: #FFFFFF;
  1370. }
  1371. .timepicktime>view:nth-of-type(1) {
  1372. width: 210rpx;
  1373. height: 100%;
  1374. line-height: 50rpx;
  1375. font-size: 26rpx;
  1376. font-weight: 400;
  1377. text-align: center;
  1378. }
  1379. .timepicktime>view:nth-of-type(2) {
  1380. width: 49rpx;
  1381. height: 100%;
  1382. // border-left: 1px solid #E0E0E0;
  1383. }
  1384. .timepickpick {
  1385. width: 110rpx;
  1386. height: 50rpx;
  1387. margin-left: 30rpx;
  1388. display: flex;
  1389. align-items: center;
  1390. }
  1391. .Underimg {
  1392. width: 50rpx;
  1393. height: 50rpx;
  1394. margin-top: -2rpx;
  1395. }
  1396. .timeButton {
  1397. width: 100%;
  1398. height: 60rpx;
  1399. display: flex;
  1400. color: #b1b1b1;
  1401. font-size: 28rpx;
  1402. .item {
  1403. text-align: center;
  1404. line-height: 60rpx;
  1405. padding-left: 12rpx;
  1406. padding-right: 12rpx;
  1407. border-radius: 8rpx;
  1408. border: 1px solid #E0E0E0;
  1409. margin-right: 20rpx;
  1410. &.active {
  1411. color: #FFFFFF;
  1412. background-color: #2671E2;
  1413. }
  1414. }
  1415. }
  1416. .boardbox {
  1417. width: 100%;
  1418. height: 172rpx;
  1419. display: flex;
  1420. align-items: center;
  1421. background: #F4F8FD;
  1422. border-radius: 8rpx;
  1423. margin-top: 28rpx;
  1424. .boardbox-zuo {
  1425. width: 50%;
  1426. height: 120rpx;
  1427. border-right: 1px solid #E0E0E0;
  1428. }
  1429. .boardbox-you {
  1430. width: 50%;
  1431. height: 120rpx;
  1432. }
  1433. .boardbox-text1 {
  1434. width: 100%;
  1435. text-align: center;
  1436. font-size: 28rpx;
  1437. color: #333333;
  1438. }
  1439. .boardbox-text2 {
  1440. width: 100%;
  1441. text-align: center;
  1442. font-size: 26rpx;
  1443. color: #333333;
  1444. margin-top: 10rpx;
  1445. }
  1446. }
  1447. .comparesize {
  1448. flex: 1;
  1449. font-size: 24rpx;
  1450. color: #666666;
  1451. margin-top: 10rpx;
  1452. }
  1453. .grid:nth-child(1) {
  1454. border-right: none;
  1455. border-bottom: none;
  1456. }
  1457. .grid:nth-child(2) {
  1458. border-bottom: none;
  1459. }
  1460. .grid:nth-child(3) {
  1461. width: 50%;
  1462. border-right: none;
  1463. }
  1464. </style>