選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

Theteamcompared.vue 32 KiB

3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
2年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
2年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
2年前
2年前
2年前
2年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
2年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
3年前
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131
  1. <template>
  2. <view class="box">
  3. <view class="boxtittab">
  4. <view class="tabbox">
  5. <view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4)">近七天</view>
  6. </view>
  7. <view class="tabbox">
  8. <view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5)">近15天</view>
  9. </view>
  10. <view class="tabbox">
  11. <view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6)">近30天</view>
  12. </view>
  13. <view class="tabbox">
  14. <view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3)">自定义</view>
  15. </view>
  16. </view>
  17. <view class="timepick">
  18. <view class="timepicktime" @click="chiocStaff(0)">
  19. <view>{{staff1.label}}</view>
  20. <view>
  21. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  22. </view>
  23. </view>
  24. <view class="timepickpick" v-if="staff1.value">
  25. <view @click="checkboxChange()" style="width: 40rpx;height:40rpx;border: 1rpx solid #E0E0E0;">
  26. <image v-if="timepickpickisshow" style="width: 40rpx;height: 40rpx;"
  27. src="../../../static/images/xuanzhong.png" mode=""></image>
  28. </view>
  29. <view style="font-size:26rpx;text-indent: 12rpx;">对比</view>
  30. </view>
  31. <view class="timepicktime" v-if="timepickpickisshow" @click="chiocStaff(1)">
  32. <view>{{staff2.label}}</view>
  33. <view>
  34. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  35. </view>
  36. </view>
  37. </view>
  38. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  39. <view class="single">
  40. <view class="title">
  41. <view class="title1" style="flex: 1;">接待量</view>
  42. <view class="title3" style="flex: 1;">
  43. <view class="title3-box" @click="tabtimetap1(0)">
  44. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 0 }">排名</view>
  45. </view>
  46. <view class="title3-box" @click="tabtimetap1(1)">
  47. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active1 == 1 }">趋势</view>
  48. </view>
  49. </view>
  50. </view>
  51. <view class="hejibox">
  52. <view class="heji">{{!staff1.value?'团队总数':staff1.label}}:{{newTeam1||0}}</view>
  53. <view class="heji">{{!staff2.value?'团队平均':staff2.label}}:{{newAvg1||0}}</view>
  54. </view>
  55. <view class="" v-if=" eharTab.active1 == 1 ">
  56. <view class="danwei">接待量</view>
  57. <view class="uchaserbox">
  58. <template v-if="showLineOptsect1">
  59. <qiun-data-charts type="line" :chartData="lineOptsect1" background="none" :ontouch="true"
  60. canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" />
  61. </template>
  62. </view>
  63. </view>
  64. <view class="jindu" v-if=" eharTab.active1 == 0 ">
  65. <view class="jindu-box" v-for="(item,index) in newlisttabinfo1" :key="index">
  66. <view class="jindu-boxche">
  67. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  68. <view style="width: 440rpx;margin-left: 10rpx;">
  69. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  70. :percent="item.zxl1 || 0"></u-line-progress>
  71. </view>
  72. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  73. </view>
  74. </view>
  75. </view>
  76. </view>
  77. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  78. <view class="single">
  79. <view class="title">
  80. <view class="title1" style="flex: 1;">接待时长</view>
  81. <view class="title3" style="flex: 1;">
  82. <view class="title3-box" @click="tabtimetap2(0)">
  83. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active2 == 0 }">排名</view>
  84. </view>
  85. <view class="title3-box" @click="tabtimetap2(1)">
  86. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active2 == 1 }">趋势</view>
  87. </view>
  88. </view>
  89. </view>
  90. <view class="hejibox">
  91. <view class="heji">{{!staff1.value?'团队总数':staff1.label}}:{{newTeam2||0}}</view>
  92. <view class="heji">{{!staff2.value?'团队平均':staff2.label}}:{{newAvg2||0}}</view>
  93. </view>
  94. <view class="" v-if=" eharTab.active2 == 1 ">
  95. <view class="danwei">录音时长</view>
  96. <view class="uchaserbox">
  97. <template v-if="showLineOptsect2">
  98. <qiun-data-charts type="line" :chartData="lineOptsect2" background="none" :ontouch="true"
  99. canvasId="wangxiaohuaerlingeryilingwuyibb" :canvas2d="true" />
  100. </template>
  101. </view>
  102. </view>
  103. <view class="jindu" v-if=" eharTab.active2 == 0 ">
  104. <view class="jindu-box" v-for="(item,index) in newlisttabinfo2" :key="index">
  105. <view class="jindu-boxche">
  106. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  107. <view style="width: 440rpx;margin-left: 10rpx;">
  108. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  109. :percent="item.zxl1"></u-line-progress>
  110. </view>
  111. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  112. </view>
  113. </view>
  114. </view>
  115. </view>
  116. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  117. <view class="single">
  118. <view class="title">
  119. <view class="title1" style="flex: 1;">销讲执行率</view>
  120. <view class="title3" style="flex: 1;">
  121. <view class="title3-box" @click="tabtimetap3(0)">
  122. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active3 == 0 }">排名</view>
  123. </view>
  124. <view class="title3-box" @click="tabtimetap3(1)">
  125. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active3 == 1 }">趋势</view>
  126. </view>
  127. </view>
  128. </view>
  129. <view class="" v-if=" eharTab.active3 == 1 ">
  130. <view class="danwei">执行率</view>
  131. <view class="uchaserbox">
  132. <template v-if="showLineOptsect3">
  133. <qiun-data-charts type="line" :chartData="lineOptsect3" background="none" :ontouch="true"
  134. canvasId="wangxiaohuaerlingeryilingwuyib" :canvas2d="true" :opts="lineOpts" />
  135. </template>
  136. </view>
  137. </view>
  138. <view class="jindu" v-if=" eharTab.active3 == 0 ">
  139. <view class="jindu-box" v-for="(item,index) in newlisttabinfo3" :key="index">
  140. <view class="jindu-boxche">
  141. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  142. <view style="width: 440rpx;margin-left: 10rpx;">
  143. <u-line-progress height="24" :show-percent="false" active-color="#FBA448"
  144. :percent="item.zxl1"></u-line-progress>
  145. </view>
  146. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}%</view>
  147. </view>
  148. </view>
  149. </view>
  150. </view>
  151. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  152. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  153. <view class="single">
  154. <view class="title" style="padding-right: 30rpx;">
  155. <view class="title1" style="flex: 1;">销讲能力</view>
  156. <view class="title2" style="flex: 1;justify-content: flex-end;" @click="goTeam">
  157. <view class="title2-che">团队
  158. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  159. </view>
  160. </view>
  161. </view>
  162. <view class="uchaserbox uchaserboxs">
  163. <template v-if="showChartData1">
  164. <qiun-data-charts type="radar" :opts="opts" :chartData="chartData1" :canvas2d="true"
  165. canvasId="wangxiaohuaerlingeryilingwuyib88" background="none" />
  166. </template>
  167. </view>
  168. </view>
  169. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  170. <!-- <view class="single">
  171. <view class="title">
  172. <view class="title1" style="flex: 1;">禁忌执行率</view>
  173. <view class="title3" style="flex: 1;">
  174. <view class="title3-box" @click="tabtimetap4(0)">
  175. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active4 == 0 }">排名</view>
  176. </view>
  177. <view class="title3-box" @click="tabtimetap4(1)">
  178. <view style="height: 42rpx;" :class="{ activecltab: eharTab.active4 == 1 }">趋势</view>
  179. </view>
  180. <view class="title3-box">
  181. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 2 }">表格</view>
  182. </view>
  183. </view>
  184. </view>
  185. <view class="hejibox">
  186. <view class="heji">{{!staff1.value?'团队':staff1.label}}:{{newTeam4||0}}</view>
  187. <view class="heji">{{!staff2.value?'均值':staff2.label}}:{{newAvg4||0}}</view>
  188. </view>
  189. <view class="" v-if=" eharTab.active4 == 1 ">
  190. <view class="danwei">来访(人)</view>
  191. <view class="uchaserbox">
  192. <qiun-data-charts
  193. type="line"
  194. :chartData="lineOptsect4"
  195. background="none"
  196. :ontouch="true"
  197. canvasId="wangxiaohuaerlingeryilingwuyi"
  198. :canvas2d="true"
  199. />
  200. </view>
  201. </view>
  202. <view class="jindu" v-if=" eharTab.active4 == 0 ">
  203. <view class="jindu-box" v-for="(item,index) in newlisttabinfo4" :key="index">
  204. <view class="jindu-boxche">
  205. <view class="jindu-name">{{item.name.substring(0, 4)}}</view>
  206. <view style="width: 440rpx;margin-left: 10rpx;">
  207. <u-line-progress height="24" :show-percent="false" active-color="#FBA448" :percent="item.zxl"></u-line-progress>
  208. </view>
  209. <view class="jindu-zxl">{{item.zxl==null?0:item.zxl}}</view>
  210. </view>
  211. </view>
  212. </view>
  213. </view> -->
  214. <!-- <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view> -->
  215. <!-- <view class="single">
  216. <view class="title" style="padding-right: 30rpx;">
  217. <view class="title1" style="flex: 1;">违禁能力(TOP10)</view>
  218. <view class="title2" style="flex: 1;justify-content: flex-end;">
  219. <view class="title2-che">项目
  220. <image class="righttochoose" src="../../../static/images/righttochoose.png" mode=""></image>
  221. </view>
  222. </view>
  223. </view>
  224. <view class="hejibox">
  225. <view class="heji">合计:50</view>
  226. <view class="heji">均值:25</view>
  227. </view>
  228. <view class="uchaserbox">
  229. <qiun-data-charts
  230. type="radar"
  231. :chartData="chartData"
  232. :canvas2d="true"
  233. canvasId="wangxiaohuaerlingeryilingwuyib89"
  234. background="none"
  235. />
  236. </view>
  237. </view> -->
  238. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  239. <!-- 选择部门的选择框 -->
  240. <u-select v-model="staffShow" :list="staffList" @confirm="staffSelectCallback" :default-value='selindex'>
  241. </u-select>
  242. <u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'>
  243. </u-select>
  244. </view>
  245. </template>
  246. <script>
  247. var app = getApp();
  248. var util = require("../../../utils/util.js");
  249. var config = require("../../../config");
  250. export default {
  251. data() {
  252. return {
  253. activeTotal: 4,
  254. eharTab: {
  255. active1: 0,
  256. active2: 0,
  257. active3: 0,
  258. active4: 0,
  259. },
  260. deptids: '',
  261. bocindex: 0,
  262. timepickpickisshow: false,
  263. totalTimeShow: false,
  264. // 项目id
  265. houseId: '',
  266. staffList: [],
  267. staffList1: [],
  268. staffShow: false,
  269. staffShow1: false,
  270. staff1: {
  271. value: '',
  272. label: ''
  273. },
  274. staff2: {
  275. value: '',
  276. label: '平均'
  277. },
  278. lastStartDate: '',
  279. lastEndDate: '',
  280. selindex: [0],
  281. choseStaffFlag: false,
  282. lineOptsect1: {
  283. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  284. "series": [{
  285. "name": "成交量1",
  286. "data": [35, 8, 25, 37, 4, 20]
  287. },
  288. {
  289. "name": "成交量2",
  290. "data": [40, 18, 45, 44, 10, 60]
  291. }
  292. ]
  293. },
  294. lineOptsect2: {
  295. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  296. "series": [{
  297. "name": "成交量1",
  298. "data": [35, 8, 25, 37, 4, 20]
  299. },
  300. {
  301. "name": "成交量2",
  302. "data": [40, 18, 45, 44, 10, 60]
  303. }
  304. ]
  305. },
  306. lineOptsect3: {
  307. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  308. "series": [{
  309. "name": "成交量1",
  310. "data": [35, 8, 25, 37, 4, 20]
  311. },
  312. {
  313. "name": "成交量2",
  314. "data": [40, 18, 45, 44, 10, 60]
  315. }
  316. ]
  317. },
  318. lineOptsect4: {
  319. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  320. "series": [{
  321. "name": "成交量1",
  322. "data": [35, 8, 25, 37, 4, 20]
  323. },
  324. {
  325. "name": "成交量2",
  326. "data": [40, 18, 45, 44, 10, 60]
  327. }
  328. ]
  329. },
  330. newlisttabinfo1: [{
  331. name: '接待量',
  332. zxl: '10'
  333. },
  334. {
  335. name: '平均执行率',
  336. zxl: '50'
  337. },
  338. {
  339. name: '接待客户',
  340. zxl: '80'
  341. },
  342. ],
  343. newlisttabinfo2: [{
  344. name: '接待量',
  345. zxl: '10'
  346. },
  347. {
  348. name: '平均执行率',
  349. zxl: '50'
  350. },
  351. {
  352. name: '接待客户',
  353. zxl: '80'
  354. },
  355. ],
  356. newlisttabinfo3: [{
  357. name: '接待量',
  358. zxl: '10'
  359. },
  360. {
  361. name: '平均执行率',
  362. zxl: '50'
  363. },
  364. {
  365. name: '接待客户',
  366. zxl: '80'
  367. },
  368. ],
  369. newlisttabinfo4: [{
  370. name: '接待量',
  371. zxl: '10'
  372. },
  373. {
  374. name: '平均执行率',
  375. zxl: '50'
  376. },
  377. {
  378. name: '接待客户',
  379. zxl: '80'
  380. },
  381. ],
  382. newTeam1: '',
  383. newAvg1: '',
  384. newTeam2: '',
  385. newAvg2: '',
  386. newTeam3: '',
  387. newAvg3: '',
  388. newTeam4: '',
  389. newAvg4: '',
  390. chartData1: {
  391. "categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],
  392. "series": [{
  393. "name": "成交量",
  394. "data": [90, 110, 165, 195, 187, 172]
  395. }]
  396. },
  397. chartData2: {
  398. "categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],
  399. "series": [{
  400. "name": "成交量",
  401. "data": [90, 110, 165, 195, 187, 172]
  402. }]
  403. },
  404. opts: {
  405. fontSize: 10,
  406. extra: {
  407. radar: {
  408. max: ''
  409. }
  410. }
  411. },
  412. lineOpts: {
  413. yAxis: {
  414. data: [
  415. {
  416. max: 100,
  417. min: 0,
  418. }
  419. ]
  420. }
  421. },
  422. };
  423. },
  424. computed: {
  425. showLineOptsect1() {
  426. return this.lineOptsect1.series.length > 0
  427. },
  428. showLineOptsect2() {
  429. return this.lineOptsect2.series.length > 0
  430. },
  431. showLineOptsect3() {
  432. return this.lineOptsect3.series.length > 0
  433. },
  434. showChartData1() {
  435. return this.chartData1.series.length > 0
  436. },
  437. },
  438. onLoad() {
  439. let that = this
  440. uni.$on('update', function(data) {
  441. // console.log(data)
  442. that.deptids = data.arr.join(',')
  443. // 获取销奖能力
  444. that.getPowerList()
  445. })
  446. // 获取项目id
  447. this.houseId = uni.getStorageSync('buildingID').id;
  448. // this.buildingname = uni.getStorageSync('buildingID').name;
  449. // 请求接口获取所有置业顾问员工的列表
  450. this.getSectionList()
  451. },
  452. onPullDownRefresh() {
  453. let that = this
  454. uni.$on('update', function(data) {
  455. // console.log(data)
  456. that.deptids = data.arr.join(',')
  457. // 获取销奖能力
  458. that.getPowerList()
  459. })
  460. // 获取项目id
  461. this.houseId = uni.getStorageSync('buildingID').id;
  462. // this.buildingname = uni.getStorageSync('buildingID').name;
  463. // 请求接口获取所有置业顾问员工的列表
  464. this.getSectionList()
  465. setTimeout(function() {
  466. uni.stopPullDownRefresh();
  467. }, 1000);
  468. },
  469. methods: {
  470. //是否对比
  471. checkboxChange() {
  472. this.timepickpickisshow = !this.timepickpickisshow;
  473. this.staff2.label = '平均'
  474. this.staff2.value = ''
  475. // 团队对比接待量
  476. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  477. // 团队对比接待时长
  478. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  479. /* 销奖执行率 */
  480. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  481. // 获取销奖能力
  482. this.getPowerList()
  483. },
  484. // 获取部门列表
  485. getSectionList() {
  486. this.$u.post('/cusLvStatistics/findAllDeptIdByHouseId', {
  487. houseId: this.houseId
  488. })
  489. .then(res => {
  490. this.staffList = []
  491. this.staffList1 = []
  492. res.map(item => {
  493. let obj = {}
  494. obj.value = item.deptId
  495. obj.label = item.deptName
  496. this.staffList.push(obj)
  497. })
  498. this.staffList1 = [...this.staffList]
  499. this.staffList.unshift({
  500. value: '',
  501. label: '全部'
  502. })
  503. this.staffList1.unshift({
  504. value: '',
  505. label: '平均'
  506. })
  507. this.staff1 = this.staffList[0]
  508. // 团队对比接待量
  509. this.receptionCountList(0, 1, '/cusLvStatistics/teamAnalysisReception')
  510. // 团队对比接待时长
  511. this.receptionCountList(0, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  512. /* 销奖执行率 */
  513. this.receptionCountList(0, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  514. // 获取销奖能力
  515. this.getPowerList()
  516. })
  517. },
  518. // 点击部门对比
  519. chiocStaff(idx) {
  520. if (idx == 0) {
  521. // 当选择了第一个的时候
  522. this.choseStaffFlag = false
  523. this.staffShow = true
  524. } else {
  525. this.choseStaffFlag = true
  526. this.staffShow1 = true
  527. }
  528. },
  529. //时间切换
  530. tabtimetap(index) {
  531. if (index == 3) {
  532. this.totalTimeShow = true;
  533. } else {
  534. this.activeTotal = index;
  535. this.lastEndDate = ''
  536. this.lastStartDate = ''
  537. // 获取数据
  538. // 团队对比接待量
  539. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  540. // 团队对比接待时长
  541. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  542. /* 销奖执行率 */
  543. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  544. // 获取销奖能力
  545. this.getPowerList()
  546. }
  547. },
  548. // 接待量
  549. tabtimetap1(idx) {
  550. this.eharTab.active1 = idx
  551. // 调用方法
  552. this.receptionCountList(idx, 1, '/cusLvStatistics/teamAnalysisReception')
  553. },
  554. // 接待时长
  555. tabtimetap2(idx) {
  556. this.eharTab.active2 = idx
  557. // 调用方法
  558. this.receptionCountList(idx, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  559. },
  560. tabtimetap3(idx) {
  561. this.eharTab.active3 = idx
  562. // 调用方法
  563. this.receptionCountList(idx, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  564. },
  565. tabtimetap4(idx) {
  566. this.eharTab.active4 = idx
  567. // 调用方法
  568. // this.getRecordList()
  569. },
  570. //自定义时间
  571. totalTimeChange(e) {
  572. console.log(e.startDate, e.endDate)
  573. this.activeTotal = 3;
  574. this.lastEndDate = e.endDate
  575. this.lastStartDate = e.startDate
  576. // 获取数据
  577. // 团队对比接待量
  578. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  579. // 团队对比接待时长
  580. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  581. /* 销奖执行率 */
  582. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  583. // 获取销奖能力
  584. this.getPowerList()
  585. },
  586. //指标执行率分析tab
  587. tapspagek2(index) {
  588. this.bocindex = index;
  589. },
  590. //集团对比
  591. Groupcontrast() {
  592. uni.navigateTo({
  593. url: '/pages/center/Piabodata/Groupcontrast'
  594. });
  595. },
  596. // 去选择团队
  597. goTeam() {
  598. uni.navigateTo({
  599. url: `/pages/center/Piabodata/selectTeam?ids=${this.deptids}`
  600. })
  601. },
  602. staffSelectCallback(e) {
  603. if (this.choseStaffFlag) {
  604. // 第二个客户
  605. // console.log(e,'第二个')
  606. this.staff2 = e[0]
  607. } else {
  608. // 第一个客户
  609. // console.log(e,'第一个')
  610. // 当选择全部时
  611. if (!e.value) {
  612. this.timepickpickisshow = false
  613. this.staff2.label = '平均'
  614. this.staff2.value = ''
  615. }
  616. this.staff1 = e[0]
  617. }
  618. if (this.staff1.label == this.staff2.label) {
  619. uni.showToast({
  620. title: '请勿选择重复',
  621. icon: 'none'
  622. })
  623. this.staff2.label = '请选择'
  624. // this.staff2.label='平均'
  625. // this.staff2.value=''
  626. return
  627. } else {
  628. // 获取数据
  629. // 团队对比接待量
  630. this.receptionCountList(this.eharTab.active1, 1, '/cusLvStatistics/teamAnalysisReception')
  631. // 团队对比接待时长
  632. this.receptionCountList(this.eharTab.active2, 2, '/cusLvStatistics/teamAnalysisReceptionTime')
  633. /* 销奖执行率 */
  634. this.receptionCountList(this.eharTab.active3, 3, '/cusLvStatistics/teamAnalysisExecutionRate')
  635. // 获取销奖能力
  636. this.getPowerList()
  637. }
  638. },
  639. // 团队对比接待量
  640. // receptionCountList(idx){
  641. // this.$u.post('/cusLvStatistics/teamAnalysisReception',{
  642. // // userA:this.staff1.value,
  643. // // userB:this.staff2.value,
  644. // deptIds:[this.staff1.value,this.staff2.value].filter(item=>item).join(','),
  645. // showRank:idx,
  646. // houseId:this.houseId,
  647. // timeType:this.lastEndDate?null:this.activeTotal+'',
  648. // lastEndDate:this.lastEndDate,
  649. // lastStartDate:this.lastStartDate
  650. // })
  651. // .then(res=>{
  652. // // console.log(res)
  653. // let result=res.result
  654. // this.newTeam=res.avg[0]
  655. // this.newAvg=res.avg[1]
  656. // if(idx==0){
  657. // // 当选择的是牌名时
  658. // // 处理数据
  659. // // 先处理牌名数据,需要进行判断全部还是单个
  660. // // 当为全部时
  661. // this.newlisttabinfo=[]
  662. // // 当选择全部时
  663. // if(!this.staff1.value&&!this.staff2.value){
  664. // // console.log(1)
  665. // result[0].map(item=>{
  666. // let obj={}
  667. // obj.name=item.deptName
  668. // obj.zxl=item.receptionCount
  669. // this.newlisttabinfo.push(obj)
  670. // })
  671. // }
  672. // // 当选择只有一个时
  673. // else if(this.staff1.value&&!this.staff2.value){
  674. // // console.log(2)
  675. // result[0].map(item=>{
  676. // let obj={}
  677. // obj.name=item.deptName
  678. // obj.zxl=item.receptionCount
  679. // this.newlisttabinfo.push(obj)
  680. // })
  681. // // 判断是否显示平均
  682. // // 如果显示对比
  683. // if(this.timepickpickisshow){
  684. // result[1].map(item=>{
  685. // let obj={}
  686. // obj.name='平均'
  687. // obj.zxl=item.receptionCount
  688. // this.newlisttabinfo.push(obj)
  689. // })
  690. // }
  691. // }else{
  692. // // console.log(3)
  693. // // 当两个都选择的时候
  694. // result[0].map(item=>{
  695. // let obj={}
  696. // obj.name=item.deptName
  697. // obj.zxl=item.receptionCount
  698. // this.newlisttabinfo.push(obj)
  699. // })
  700. // result[1].map(item=>{
  701. // let obj={}
  702. // obj.name=item.deptName
  703. // obj.zxl=item.receptionCount
  704. // this.newlisttabinfo.push(obj)
  705. // })
  706. // }
  707. // }else{
  708. // // 当选择趋势时
  709. // // this.lineOptsect={
  710. // // categories:[],
  711. // // series:[]
  712. // // }
  713. // let allobj={
  714. // categories:[],
  715. // series:[]
  716. // }
  717. // // 先处理时间
  718. // // 当选择全部时
  719. // if(!this.staff1.value&&!this.staff2.value){
  720. // // console.log(1)
  721. // result.map((item,idx)=>{
  722. // let obj={}
  723. // obj.name=item[0].deptName
  724. // obj.data=[]
  725. // item.map(item1=>{
  726. // // 时间的处理
  727. // if(idx==0){
  728. // allobj.categories.push(item1.statDate.slice(5,10))
  729. // }
  730. // obj.data.push(item1.receptionCount)
  731. // })
  732. // allobj.series.push(obj)
  733. // })
  734. // }
  735. // // 当选择只有一个时
  736. // else if(this.staff1.value&&!this.staff2.value){
  737. // // console.log(2)
  738. // let obj={}
  739. // obj.data=[]
  740. // obj.name=result[0][0].deptName
  741. // result[0].map(item=>{
  742. // allobj.categories.push(item.statDate.slice(5,10))
  743. // obj.data.push(item.receptionCount)
  744. // })
  745. // allobj.series.push(obj)
  746. // // 判断是否显示平均
  747. // // 如果显示对比
  748. // if(this.timepickpickisshow){
  749. // let obj={}
  750. // obj.data=[]
  751. // obj.name='平均'
  752. // result[1].map(item=>{
  753. // obj.data.push(item.receptionCount)
  754. // })
  755. // allobj.series.push(obj)
  756. // }
  757. // }else{
  758. // // console.log(3)
  759. // // 当两个都选择的时候
  760. // let obj={}
  761. // let obj1={}
  762. // obj.data=[]
  763. // obj1.data=[]
  764. // obj.name=result[0][0].deptName
  765. // obj1.name=result[1][0].deptName
  766. // result[0].map(item=>{
  767. // allobj.categories.push(item.statDate.slice(5,10))
  768. // obj.data.push(item.receptionCount)
  769. // })
  770. // result[1].map(item=>{
  771. // obj1.data.push(item.receptionCount)
  772. // })
  773. // allobj.series.push(obj)
  774. // allobj.series.push(obj1)
  775. // }
  776. // this.lineOptsect=allobj
  777. // }
  778. // })
  779. // },
  780. // 接待时长
  781. receptionCountList(idx, index, url) {
  782. this.$u.post(url, {
  783. // userA:this.staff1.value,
  784. // userB:this.staff2.value,
  785. deptIds: [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  786. showRank: idx,
  787. houseId: this.houseId,
  788. timeType: this.lastEndDate ? null : this.activeTotal + '',
  789. lastEndDate: this.lastEndDate,
  790. lastStartDate: this.lastStartDate
  791. })
  792. .then(res => {
  793. // console.log(res)
  794. let result = res.result
  795. this['newTeam' + index] = res.avg[0]
  796. this['newAvg' + index] = res.avg[1]
  797. if (idx == 0) {
  798. // 当选择的是牌名时
  799. // 处理数据
  800. // 先处理牌名数据,需要进行判断全部还是单个
  801. // 当为全部时
  802. this['newlisttabinfo' + index] = []
  803. let arr = []
  804. // 当选择全部时
  805. if (!this.staff1.value && !this.staff2.value) {
  806. // console.log(1)
  807. result[0].map(item => {
  808. let obj = {}
  809. obj.name = item.deptName
  810. obj.zxl = item.data
  811. arr.push(obj)
  812. })
  813. arr = this.dealData(arr)
  814. this['newlisttabinfo' + index] = arr
  815. }
  816. // 当选择只有一个时
  817. else if (this.staff1.value && !this.staff2.value) {
  818. // console.log(2)
  819. result[0].map(item => {
  820. let obj = {}
  821. obj.name = item.deptName
  822. obj.zxl = item.data
  823. arr.push(obj)
  824. })
  825. // 判断是否显示平均
  826. // 如果显示对比
  827. if (this.timepickpickisshow) {
  828. result[1].map(item => {
  829. let obj = {}
  830. obj.name = '平均'
  831. obj.zxl = item.data
  832. arr.push(obj)
  833. })
  834. }
  835. arr = this.dealData(arr)
  836. this['newlisttabinfo' + index] = arr
  837. } else {
  838. // console.log(3)
  839. // 当两个都选择的时候
  840. result[0].map(item => {
  841. let obj = {}
  842. obj.name = item.deptName
  843. obj.zxl = item.data
  844. arr.push(obj)
  845. })
  846. result[1].map(item => {
  847. let obj = {}
  848. obj.name = item.deptName
  849. obj.zxl = item.data
  850. arr.push(obj)
  851. })
  852. arr = this.dealData(arr)
  853. this['newlisttabinfo' + index] = arr
  854. }
  855. } else {
  856. // 当选择趋势时
  857. this['lineOptsect' + index] = {}
  858. let allobj = {
  859. categories: [],
  860. series: []
  861. }
  862. // 先处理时间
  863. // 当选择全部时
  864. if (!this.staff1.value && !this.staff2.value) {
  865. result.map((item, idx) => {
  866. let obj = {}
  867. obj.name = item[0].deptName
  868. obj.data = []
  869. item.map(item1 => {
  870. // 时间的处理
  871. if (idx == 0) {
  872. allobj.categories.push(item1.statDate.slice(5, 10))
  873. }
  874. obj.data.push(item1.data)
  875. })
  876. allobj.series.push(obj)
  877. })
  878. }
  879. // 当选择只有一个时
  880. else if (this.staff1.value && !this.staff2.value) {
  881. // console.log(2)
  882. let obj = {}
  883. obj.data = []
  884. obj.name = result[0][0].deptName
  885. result[0].map(item => {
  886. allobj.categories.push(item.statDate.slice(5, 10))
  887. obj.data.push(item.data)
  888. })
  889. allobj.series.push(obj)
  890. // 判断是否显示平均
  891. // 如果显示对比
  892. if (this.timepickpickisshow) {
  893. let obj = {}
  894. obj.data = []
  895. obj.name = '平均'
  896. result[1].map(item => {
  897. obj.data.push(item.data)
  898. })
  899. allobj.series.push(obj)
  900. }
  901. } else {
  902. // console.log(3)
  903. // 当两个都选择的时候
  904. let obj = {}
  905. let obj1 = {}
  906. obj.data = []
  907. obj1.data = []
  908. obj.name = result[0][0].deptName
  909. obj1.name = result[1][0].deptName
  910. result[0].map(item => {
  911. allobj.categories.push(item.statDate.slice(5, 10))
  912. obj.data.push(item.data)
  913. })
  914. result[1].map(item => {
  915. obj1.data.push(item.data)
  916. })
  917. allobj.series.push(obj)
  918. allobj.series.push(obj1)
  919. }
  920. // console.log(allobj)
  921. // return
  922. // this.lineOptsect1=allobj
  923. this['lineOptsect' + index] = allobj
  924. // this['lineOptsect'+index].series=allobj.series
  925. // this['lineOptsect'+index].categories=allobj.categories
  926. }
  927. })
  928. },
  929. // 获取销奖能力
  930. getPowerList() {
  931. this.$u.post('/cusLvStatistics/teamAnalysisMarketingAbility', {
  932. deptIds: this.deptids || [this.staff1.value, this.staff2.value].filter(item => item).join(','),
  933. houseId: this.houseId,
  934. timeType: this.lastEndDate ? null : this.activeTotal + '',
  935. lastEndDate: this.lastEndDate,
  936. lastStartDate: this.lastStartDate
  937. })
  938. .then(res => {
  939. // console.log(res)
  940. // 处理数据
  941. this.chartData1 = {
  942. categories: [],
  943. series: []
  944. }
  945. let allobj = {
  946. categories: [],
  947. series: []
  948. }
  949. let max = 0;
  950. // 当选择全部时
  951. if (!this.staff1.value && !this.staff2.value) {
  952. // let first=res.first
  953. res.first.map((item, index) => {
  954. let obj = {
  955. name: item[0].deptName,
  956. data: []
  957. }
  958. item.map((item1) => {
  959. if (index == 0) {
  960. allobj.categories.push(item1.name)
  961. }
  962. obj.data.push(item1.avgExecutionRate)
  963. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  964. })
  965. allobj.series.push(obj)
  966. })
  967. }
  968. // 当选择只有一个时
  969. else if (this.staff1.value && !this.staff2.value) {
  970. res.first.map((item, index) => {
  971. let obj = {
  972. name: item[0].deptName,
  973. data: []
  974. }
  975. item.map((item1) => {
  976. if (index == 0) {
  977. allobj.categories.push(item1.name)
  978. }
  979. obj.data.push(item1.avgExecutionRate)
  980. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  981. })
  982. allobj.series.push(obj)
  983. })
  984. // 判断是否显示平均
  985. // 如果显示对比
  986. if (this.timepickpickisshow) {
  987. res.second.map((item, index) => {
  988. let obj = {
  989. name: '平均',
  990. data: []
  991. }
  992. item.map((item1) => {
  993. obj.data.push(item1.avgExecutionRate)
  994. })
  995. allobj.series.push(obj)
  996. })
  997. }
  998. } else {
  999. // console.log(3)
  1000. // 当两个都选择的时候
  1001. res.first.map((item, index) => {
  1002. let obj = {
  1003. name: item[0].deptName,
  1004. data: []
  1005. }
  1006. item.map((item1) => {
  1007. if (index == 0) {
  1008. allobj.categories.push(item1.name)
  1009. }
  1010. obj.data.push(item1.avgExecutionRate)
  1011. if (max < item1.avgExecutionRate) max = item1.avgExecutionRate;
  1012. })
  1013. allobj.series.push(obj)
  1014. })
  1015. }
  1016. this.opts.extra.radar.max = max + 25
  1017. // console.log(allobj)
  1018. this.chartData1 = allobj
  1019. this.$forceUpdate()
  1020. })
  1021. },
  1022. // 定义一个公共方法对数据进行处理
  1023. dealData(arr) {
  1024. // 获取最大值
  1025. let num = Math.max.apply(Math, arr.map(function(o) {
  1026. return o.zxl
  1027. })) //结果:3
  1028. // console.log(num)
  1029. if (num > 100) {
  1030. // 获取最大值的下标
  1031. // let idx=arr.findIndex(item=>item.zxl==num)
  1032. // console.log(idx,123)
  1033. arr.map(item => {
  1034. item.zxl1 = Math.floor(item.zxl / num * 100)
  1035. })
  1036. // console.log(arr)
  1037. return arr
  1038. } else {
  1039. arr.map(item => {
  1040. item.zxl1 = item.zxl
  1041. })
  1042. return arr
  1043. }
  1044. },
  1045. }
  1046. };
  1047. </script>
  1048. <style lang="scss" scoped>
  1049. .uchaserboxs {
  1050. width: 100%;
  1051. height: 70vh;
  1052. }
  1053. .box {
  1054. width: 100%;
  1055. height: 100%;
  1056. background: #FAFAFA;
  1057. padding-bottom: 60rpx;
  1058. }
  1059. // 对比时间切换
  1060. .timepick {
  1061. width: 100%;
  1062. height: 90rpx;
  1063. display: flex;
  1064. align-items: center;
  1065. background: #FAFAFA;
  1066. }
  1067. .timepicktime {
  1068. width: 260rpx;
  1069. height: 50rpx;
  1070. border: 1rpx solid #E0E0E0;
  1071. margin-left: 30rpx;
  1072. display: flex;
  1073. background: #FFFFFF;
  1074. }
  1075. .timepicktime>view:nth-of-type(1) {
  1076. width: 210rpx;
  1077. height: 100%;
  1078. line-height: 50rpx;
  1079. font-size: 26rpx;
  1080. font-weight: 400;
  1081. text-align: center;
  1082. }
  1083. .timepicktime>view:nth-of-type(2) {
  1084. width: 49rpx;
  1085. height: 100%;
  1086. // border-left: 1px solid #E0E0E0;
  1087. }
  1088. .timepickpick {
  1089. width: 110rpx;
  1090. height: 50rpx;
  1091. margin-left: 30rpx;
  1092. display: flex;
  1093. align-items: center;
  1094. }
  1095. .Underimg {
  1096. width: 50rpx;
  1097. height: 50rpx;
  1098. margin-top: -2rpx;
  1099. }
  1100. </style>