您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符
 
 
 

768 行
21 KiB

  1. <template>
  2. <view>
  3. <view class="boxtittabs">
  4. <div class="items" @tap="screenShow = true">{{ showTimeText }}<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon></div>
  5. <div class="items" @tap="showTemplate = true">{{ showBeText }}<u-icon name="arrow-down" size="24" style="padding-left: 12rpx"></u-icon></div>
  6. </view>
  7. <view class="timepick">
  8. <view class="timepicktime" @click="chiocStaff(0)">
  9. <view>{{staff1.label}}</view>
  10. <view>
  11. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  12. </view>
  13. </view>
  14. <view class="timepickpick">
  15. <view @click="checkboxChange()" style="width: 40rpx;height:40rpx;border: 1rpx solid #E0E0E0;">
  16. <image v-if="timepickpickisshow" style="width: 40rpx;height: 40rpx;"
  17. src="../../../static/images/xuanzhong.png" mode=""></image>
  18. </view>
  19. <view style="font-size:26rpx;text-indent: 12rpx;">对比</view>
  20. </view>
  21. <view class="timepicktime" v-if="timepickpickisshow" @click="chiocStaff(1)">
  22. <view>{{staff2.label}}</view>
  23. <view>
  24. <image class="Underimg" src="../../../static/images/Underimg.png" mode=""></image>
  25. </view>
  26. </view>
  27. </view>
  28. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  29. <view class="single">
  30. <view class="title">
  31. <view class="title1" style="flex: 1;">接待量</view>
  32. </view>
  33. <view class="hejibox">
  34. <view class="heji">{{staff1.label}}:{{newTeam1||0}}</view>
  35. <view class="heji" v-if="timepickpickisshow">{{staff2.label}}:{{newAvg1||0}}</view>
  36. </view>
  37. <view class="danwei">来访(人)</view>
  38. <view class="uchaserbox">
  39. <qiun-data-charts type="line" :chartData="lineOptsect" background="none" :ontouch="true"
  40. canvasId="wangxiaohuaerlingeryilingwuyibbb" :canvas2d="true" />
  41. </view>
  42. </view>
  43. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  44. <view class="single">
  45. <view class="title">
  46. <view class="title1" style="flex: 1;">录音时长</view>
  47. <view class="title3" style="flex: 1;">
  48. <!-- <view class="title3-box" style="width: 40%;" @click="tabtimetap1(0)">
  49. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 0 }">有效录音</view>
  50. </view>
  51. <view class="title3-box" style="width: 40%;"@click="tabtimetap1(1)">
  52. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 1 }">录音时长</view>
  53. </view> -->
  54. </view>
  55. </view>
  56. <view class="hejibox">
  57. <view class="heji">{{staff1.label}}:{{newTeam2||0}}</view>
  58. <view class="heji" v-if="timepickpickisshow">{{staff2.label}}:{{newAvg2||0}}</view>
  59. </view>
  60. <view class="danwei">录音时长</view>
  61. <view class="uchaserbox">
  62. <qiun-data-charts type="line" :chartData="lineOptsect1" background="none" :ontouch="true"
  63. canvasId="wangxiaouaerlingeryilingwuyibhh" :canvas2d="true" />
  64. </view>
  65. </view>
  66. <view style="width: 100%;height: 20rpx;background: #FAFAFA;" v-if="wajue"></view>
  67. <view class="single" v-if="wajue">
  68. <view class="title">
  69. <view class="title1" style="flex: 1;">平均需求挖掘率趋势</view>
  70. <view class="title3" style="flex: 1;">
  71. </view>
  72. </view>
  73. <view class="hejibox">
  74. <view class="heji">{{staff1.label}}:{{newTeam2||0}}</view>
  75. <view class="heji" v-if="timepickpickisshow">{{staff2.label}}:{{newAvg2||0}}</view>
  76. </view>
  77. <view class="danwei">录音时长</view>
  78. <view class="uchaserbox">
  79. <qiun-data-charts type="line" :chartData="lineOptsect1" background="none" :ontouch="true"
  80. canvasId="wangxiaouaerlingeryilingwuyibhh" :canvas2d="true" />
  81. </view>
  82. </view>
  83. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  84. <view class="single">
  85. <view class="title">
  86. <view class="title1" style="flex: 1;">销讲执行率</view>
  87. <view class="title3" style="flex: 1;">
  88. <!-- <view class="title3-box" style="width: 40%;" @click="tabtimetap1(0)">
  89. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 0 }">有效录音</view>
  90. </view>
  91. <view class="title3-box" style="width: 40%;"@click="tabtimetap1(1)">
  92. <view style="height: 42rpx;" :class="{ activecltab: activeTotal2 == 1 }">录音时长</view>
  93. </view> -->
  94. </view>
  95. </view>
  96. <view class="hejibox">
  97. <view class="heji">{{staff1.label}}:{{newTeam3||0}}</view>
  98. <view class="heji" v-if="timepickpickisshow">{{staff2.label}}:{{newAvg3||0}}</view>
  99. </view>
  100. <!-- <view class="danwei">录音时长</view> -->
  101. <view class="uchaserbox">
  102. <qiun-data-charts type="line" :chartData="lineOptsect2" background="none" :ontouch="true"
  103. canvasId="wangxiaohuaerlingryilingwuyibhh" :canvas2d="true" :opts="lineOpts" />
  104. </view>
  105. </view>
  106. <view style="width: 100%;height: 20rpx;background: #FAFAFA;"></view>
  107. <view class="single">
  108. <view class="title" style="padding-right: 30rpx;">
  109. <view class="title1" style="flex: 1;">销讲能力</view>
  110. </view>
  111. <view class="uchaserbox" style="height: 70vh;">
  112. <qiun-data-charts type="radar" :chartData="chartData" :canvas2d="true"
  113. canvasId="wangxiaohuaerlingeryilinwuycsdx" background="none" :opts="opts" />
  114. </view>
  115. </view>
  116. <!-- <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar> -->
  117. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  118. <!-- 选择客户的选择框 -->
  119. <u-select v-model="staffShow" :list="staffList" @confirm="staffSelectCallback" :default-value='selindex'>
  120. </u-select>
  121. <u-select v-model="staffShow1" :list="staffList1" @confirm="staffSelectCallback" :default-value='selindex'>
  122. </u-select>
  123. <!-- 更多筛选 -->
  124. <u-popup v-model="screenShow" mode="bottom" height="368">
  125. <view class="screen">
  126. <view class="boxtittab">
  127. <view class="tabbox">
  128. <view :class="{ activecllasscet: activeTotal == 4 }" @click="tabtimetap(4, '近七天')">近七天</view>
  129. </view>
  130. <view class="tabbox">
  131. <view :class="{ activecllasscet: activeTotal == 5 }" @click="tabtimetap(5, '近15天')">近15天</view>
  132. </view>
  133. <view class="tabbox">
  134. <view :class="{ activecllasscet: activeTotal == 6 }" @click="tabtimetap(6, '近30天')">近30天</view>
  135. </view>
  136. <view class="tabbox">
  137. <view :class="{ activecllasscet: activeTotal == 3 }" @click="tabtimetap(3, '自定义')">自定义</view>
  138. </view>
  139. </view>
  140. </view>
  141. </u-popup>
  142. <!-- 销讲业务 -->
  143. <u-select :mask-close-able="false" label-name="templateName" value-name="id" v-model="showTemplate"
  144. mode="single-column" :list="templateList" @cancel="templateCancel" @confirm="templateConfirm"></u-select>
  145. <!-- 加载组件 -->
  146. <loading v-model="LOADING"></loading>
  147. </view>
  148. </template>
  149. <script>
  150. import loading from "@/components/loading/index.vue"
  151. export default {
  152. components: {
  153. loading
  154. },
  155. data() {
  156. return {
  157. wajue: false,
  158. timepickpickisshow: true,
  159. totalTimeShow: false,
  160. activeTotal: 4,
  161. activeTotal2: 1,
  162. // 项目id
  163. houseId: '',
  164. staffList: [],
  165. staffList1: [],
  166. staffShow: false,
  167. staffShow1: false,
  168. newTeam1: '',
  169. newAvg1: '',
  170. newTeam2: '',
  171. newAvg2: '',
  172. newTeam3: '',
  173. newAvg3: '',
  174. staff1: {
  175. value: '',
  176. label: ''
  177. },
  178. staff2: {
  179. value: '',
  180. label: '平均'
  181. },
  182. lineOpts: {
  183. yAxis: {
  184. data: [{
  185. max: 100,
  186. min: 0,
  187. }]
  188. }
  189. },
  190. opts: {
  191. fontSize: 10,
  192. extra: {
  193. radar: {
  194. max: 100
  195. }
  196. }
  197. },
  198. lastStartDate: '',
  199. lastEndDate: '',
  200. selindex: [0],
  201. choseStaffFlag: false,
  202. lineOptsect: {
  203. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  204. "series": [{
  205. "name": "成交量1",
  206. "data": [35, 8, 25, 37, 4, 20]
  207. },
  208. {
  209. "name": "成交量2",
  210. "data": [40, 18, 45, 44, 10, 60]
  211. }
  212. ]
  213. },
  214. lineOptsect1: {
  215. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  216. "series": [{
  217. "name": "成交量1",
  218. "data": [35, 8, 25, 37, 4, 20]
  219. },
  220. {
  221. "name": "成交量2",
  222. "data": [40, 18, 45, 44, 10, 60]
  223. }
  224. ]
  225. },
  226. lineOptsect2: {
  227. "categories": ["2016", "2017", "2018", "2019", "2020", "2021"],
  228. "series": [{
  229. "name": "成交量1",
  230. "data": [35, 8, 25, 37, 4, 20]
  231. },
  232. {
  233. "name": "成交量2",
  234. "data": [40, 18, 45, 44, 10, 60]
  235. }
  236. ]
  237. },
  238. chartData: {
  239. "categories": ["维度1", "维度2", "维度3", "维度4", "维度5", "维度6"],
  240. "series": [{
  241. "name": "成交量",
  242. "data": [90, 110, 165, 195, 187, 172]
  243. }]
  244. },
  245. screenShow: false, // 时间筛选弹窗
  246. showTimeText: '近七天', // 展示文字
  247. showBeText: '全部业务', //
  248. templateList: [], // 销讲业务
  249. showTemplate: false, // 展示选择销讲业务弹窗
  250. marketingBusiness: '', // 选择的业务id
  251. };
  252. },
  253. onLoad(option) {
  254. this.LOADING = true
  255. // 获取项目id
  256. this.houseId = uni.getStorageSync('buildingID').id;
  257. // 请求接口获取所有置业顾问员工的列表
  258. this.getStaffList(option)
  259. this.getMarketingBusiness()
  260. },
  261. onPullDownRefresh() {
  262. this.getMarketingBusiness()
  263. this.getStaffList()
  264. setTimeout(function() {
  265. uni.stopPullDownRefresh();
  266. }, 1000);
  267. },
  268. methods: {
  269. // 销讲业务方法
  270. templateCancel() {
  271. this.showTemplate = false;
  272. },
  273. // 确认选择销讲业务
  274. templateConfirm(e) {
  275. this.showTemplate = false;
  276. this.marketingBusiness = e[0].value
  277. this.showBeText = e[0].label
  278. this.getdata()
  279. },
  280. // 获取销讲业务
  281. getMarketingBusiness() {
  282. this.$u.get('/customer/marketingBusiness', {
  283. houseId: uni.getStorageSync('buildingID').id,
  284. }).then(res => {
  285. this.templateList = res
  286. this.templateList.unshift({
  287. templateName: '全部业务',
  288. id: ''
  289. })
  290. })
  291. },
  292. //是否对比
  293. checkboxChange() {
  294. this.timepickpickisshow = !this.timepickpickisshow;
  295. this.staff2.value = ''
  296. this.staff2.label = '平均'
  297. this.getdata()
  298. },
  299. // 点击员工对比
  300. chiocStaff(idx) {
  301. if (idx == 0) {
  302. // 当选择了第一个的时候
  303. this.choseStaffFlag = false
  304. this.staffShow = true
  305. } else {
  306. this.choseStaffFlag = true
  307. this.staffShow1 = true
  308. }
  309. },
  310. // 获取员工列表
  311. getStaffList(option) {
  312. this.$u.post('/cusLvStatistics/selectAllAccountIdByHouseId', {
  313. houseId: this.houseId
  314. })
  315. .then(res => {
  316. // console.log(res,'123')
  317. this.staffList = []
  318. this.staffList1 = []
  319. res.map(item => {
  320. let obj = {}
  321. obj.value = item.accountId
  322. obj.label = item.name
  323. this.staffList.push(obj)
  324. })
  325. this.staffList1 = [...this.staffList]
  326. this.staffList1.unshift({
  327. value: '',
  328. label: '平均'
  329. })
  330. this.staff1 = this.staffList[0]
  331. console.log('我进来了', option)
  332. if (option.type == 1) {
  333. this.activeTotal = 3;
  334. this.lastEndDate = option.endDate
  335. this.lastStartDate = option.startDate
  336. let obj = this.staffList1.find(item => {
  337. return item.value == option.id
  338. })
  339. console.log(obj, 'obj')
  340. this.staff1.label = obj.label
  341. this.staff1.value = option.id
  342. }
  343. this.getdata()
  344. })
  345. },
  346. getdata() {
  347. this.getreception()
  348. this.getRecordList()
  349. this.getAward()
  350. this.getAwardList()
  351. },
  352. // 获取接待量数据
  353. getreception() {
  354. this.$u.post('/cusLvStatistics/employeeAnalysisReception', {
  355. userA: this.staff1.value,
  356. userB: this.staff2.value,
  357. houseId: this.houseId,
  358. timeType: this.lastEndDate ? null : this.activeTotal + '',
  359. lastEndDate: this.lastEndDate,
  360. lastStartDate: this.lastStartDate,
  361. marketingBusiness: this.marketingBusiness,
  362. })
  363. .then(res => {
  364. this.newTeam1 = res.avg[0]
  365. this.newAvg1 = res.avg[1]
  366. // console.log(res)
  367. let first = res.first
  368. let second = res.second
  369. this.lineOptsect.categories = []
  370. if (!this.timepickpickisshow) {
  371. this.lineOptsect.series = [{
  372. name: first[0].accountName,
  373. data: []
  374. }]
  375. first.map(item => {
  376. this.lineOptsect.categories.push(item.statDate.slice(5, 10))
  377. this.lineOptsect.series[0].data.push(item.receptionCount || 0)
  378. })
  379. } else {
  380. this.lineOptsect.series = [{
  381. name: first[0].accountName,
  382. data: []
  383. },
  384. {
  385. "name": second[0].accountName,
  386. "data": []
  387. }
  388. ]
  389. first.map(item => {
  390. this.lineOptsect.categories.push(item.statDate.slice(5, 10))
  391. this.lineOptsect.series[0].data.push(item.receptionCount)
  392. })
  393. second.map(item => {
  394. this.lineOptsect.series[1].data.push(item.receptionCount)
  395. })
  396. }
  397. // console.log(this.lineOptsect,'1')
  398. })
  399. },
  400. // 销奖趋势
  401. getAward() {
  402. this.$u.post('/cusLvStatistics/employeeAnalysisExacutiveRate', {
  403. userA: this.staff1.value,
  404. userB: this.staff2.value,
  405. houseId: this.houseId,
  406. timeType: this.lastEndDate ? null : this.activeTotal + '',
  407. lastEndDate: this.lastEndDate,
  408. lastStartDate: this.lastStartDate,
  409. marketingBusiness: this.marketingBusiness,
  410. })
  411. .then(res => {
  412. this.newTeam3 = res.avg[0]
  413. this.newAvg3 = res.avg[1]
  414. // console.log(res)
  415. let first = res.first
  416. let second = res.second
  417. this.lineOptsect2.categories = []
  418. if (!this.timepickpickisshow) {
  419. this.lineOptsect2.series = [{
  420. name: first[0].accountName,
  421. data: []
  422. }]
  423. first.map(item => {
  424. // console.log(item)
  425. this.lineOptsect2.categories.push(item.statDate.slice(5, 10))
  426. this.lineOptsect2.series[0].data.push(item.sumFraction)
  427. })
  428. } else {
  429. this.lineOptsect2.series = [{
  430. name: first[0].accountName,
  431. data: []
  432. },
  433. {
  434. "name": second[0].accountName,
  435. "data": []
  436. }
  437. ]
  438. first.map(item => {
  439. this.lineOptsect2.categories.push(item.statDate.slice(5, 10))
  440. this.lineOptsect2.series[0].data.push(item.sumFraction)
  441. })
  442. second.map(item => {
  443. this.lineOptsect2.series[1].data.push(item.sumFraction)
  444. })
  445. }
  446. // console.log(this.lineOptsect2,'3')
  447. })
  448. },
  449. // 获取有效录音
  450. async getRecordList() {
  451. // 当选择有效录音时
  452. let res = null
  453. if (this.activeTotal2 == 0) {
  454. res = await this.$u.post('/cusLvStatistics/employeeAnalysisEffectiveRecording', {
  455. userA: this.staff1.value,
  456. userB: this.staff2.value,
  457. houseId: this.houseId,
  458. timeType: this.lastEndDate ? null : this.activeTotal + '',
  459. lastEndDate: this.lastEndDate,
  460. lastStartDate: this.lastStartDate,
  461. marketingBusiness: this.marketingBusiness,
  462. })
  463. } else {
  464. res = await this.$u.post('/cusLvStatistics/employeeAnalysisRecordingTime', {
  465. userA: this.staff1.value,
  466. userB: this.staff2.value,
  467. houseId: this.houseId,
  468. timeType: this.lastEndDate ? null : this.activeTotal + '',
  469. lastEndDate: this.lastEndDate,
  470. lastStartDate: this.lastStartDate,
  471. marketingBusiness: this.marketingBusiness,
  472. })
  473. }
  474. // console.log(res)
  475. this.newTeam2 = res.avg[0]
  476. this.newAvg2 = res.avg[1]
  477. let first = res.first
  478. let second = res.second
  479. this.lineOptsect1.categories = []
  480. if (!this.timepickpickisshow) {
  481. this.lineOptsect1.series = [{
  482. name: first[0].accountName,
  483. data: []
  484. }]
  485. first.map(item => {
  486. this.lineOptsect1.categories.push(item.statDate.slice(5, 10))
  487. this.lineOptsect1.series[0].data.push(item.sumDuration)
  488. })
  489. } else {
  490. this.lineOptsect1.series = [{
  491. name: first[0].accountName,
  492. data: []
  493. },
  494. {
  495. "name": second[0].accountName,
  496. "data": []
  497. }
  498. ]
  499. first.map(item => {
  500. this.lineOptsect1.categories.push(item.statDate.slice(5, 10))
  501. this.lineOptsect1.series[0].data.push(item.sumDuration)
  502. })
  503. second.map(item => {
  504. this.lineOptsect1.series[1].data.push(item.sumDuration)
  505. })
  506. }
  507. // console.log(this.lineOptsect1,'2')
  508. },
  509. // 获取销奖能力
  510. getAwardList() {
  511. this.$u.post('/cusLvStatistics/employeeAnalysisLevel1Fraction', {
  512. userA: this.staff1.value,
  513. userB: this.staff2.value,
  514. houseId: this.houseId,
  515. timeType: this.lastEndDate ? null : this.activeTotal + '',
  516. lastEndDate: this.lastEndDate,
  517. lastStartDate: this.lastStartDate,
  518. marketingBusiness: this.marketingBusiness,
  519. })
  520. .then(res => {
  521. this.LOADING = false
  522. // console.log(res)
  523. let first = res.first
  524. let second = res.second
  525. let xAxis = [] // 制作雷达图的x轴
  526. first.forEach(item => {
  527. if (xAxis.findIndex(res => res.marketingId == item.marketingId) == -1) {
  528. xAxis.push(item)
  529. }
  530. })
  531. second.forEach(item => {
  532. if (xAxis.findIndex(res => res.marketingId == item.marketingId) == -1) {
  533. xAxis.push(item)
  534. }
  535. })
  536. this.chartData.categories = []
  537. if (!this.timepickpickisshow) {
  538. this.chartData.series = [{
  539. name: first[0].accountName,
  540. data: []
  541. }]
  542. first.map(item => {
  543. this.chartData.categories.push(item.name)
  544. if (item.avgExecutionRate < 0) {
  545. this.chartData.series[0].data.push(0)
  546. } else if (item.avgExecutionRate > 100) {
  547. this.chartData.series[0].data.push(100)
  548. } else {
  549. this.chartData.series[0].data.push(item.avgExecutionRate)
  550. }
  551. })
  552. } else {
  553. this.chartData.series = [{
  554. name: first[0].accountName,
  555. data: []
  556. },
  557. {
  558. name: second[0].accountName,
  559. data: []
  560. }
  561. ]
  562. console.log(xAxis, 'sdaklijdklsajdklasjkdlsjal')
  563. xAxis.map(item => {
  564. this.chartData.categories.push(item.name)
  565. let obj1 = first.find(res => res.marketingId == item.marketingId)
  566. let obj2 = second.find(res => res.marketingId == item.marketingId)
  567. if (obj1 && Object.keys(obj1).length > 0) {
  568. this.chartData.series[0].data.push(this.checkRange(obj1.avgExecutionRate))
  569. } else {
  570. this.chartData.series[0].data.push(0)
  571. }
  572. if (obj2 && Object.keys(obj2).length > 0) {
  573. this.chartData.series[1].data.push(this.checkRange(obj2.avgExecutionRate))
  574. } else {
  575. this.chartData.series[1].data.push(0)
  576. }
  577. })
  578. this.$forceUpdate()
  579. }
  580. }).catch(e => {
  581. this.LOADING = false
  582. })
  583. },
  584. // 检测范围
  585. checkRange(num) {
  586. if (num < 0) {
  587. return 0
  588. } else if (num > 100) {
  589. return 100
  590. } else {
  591. return num
  592. }
  593. },
  594. tabtimetap(index, text) {
  595. if (index == 3) {
  596. this.totalTimeShow = true;
  597. this.screenShow = false
  598. } else {
  599. this.screenShow = false
  600. this.showTimeText = text
  601. this.activeTotal = index;
  602. this.lastEndDate = ''
  603. this.lastStartDate = ''
  604. // 获取数据
  605. this.getdata()
  606. }
  607. },
  608. tabtimetap1(index) {
  609. this.activeTotal2 = index;
  610. // 调用方法
  611. this.getRecordList()
  612. },
  613. //自定义时间
  614. totalTimeChange(e) {
  615. console.log(e.startDate, e.endDate)
  616. this.screenShow = false
  617. this.showTimeText = `${e.startDate}-${e.endDate}`
  618. this.activeTotal = 3;
  619. this.lastEndDate = e.endDate
  620. this.lastStartDate = e.startDate
  621. // 获取数据
  622. // this.getreception()
  623. // this.getRecordList()
  624. // this.getAwardList()
  625. this.getdata()
  626. },
  627. staffSelectCallback(e) {
  628. if (this.choseStaffFlag) {
  629. // 第二个客户
  630. // console.log(e,'第二个')
  631. this.staff2 = e[0]
  632. } else {
  633. // 第一个客户
  634. // console.log(e,'第一个')
  635. this.staff1 = e[0]
  636. }
  637. if (this.staff1.label == this.staff2.label) {
  638. uni.showToast({
  639. title: '请勿选择重复',
  640. icon: 'none'
  641. })
  642. this.staff2.label = '请选择'
  643. // this.staff2.label='平均'
  644. // this.staff2.value=''
  645. return
  646. } else {
  647. // 获取数据
  648. // this.getreception()
  649. // this.getRecordList()
  650. // this.getAwardList()
  651. this.getdata()
  652. }
  653. },
  654. },
  655. }
  656. </script>
  657. <style lang="scss" scoped>
  658. .boxtittabs {
  659. width: 100%;
  660. height: 92rpx;
  661. background: #FFFFFF;
  662. display: flex;
  663. align-items: center;
  664. .items {
  665. padding: 0 24rpx;
  666. width: 50%;
  667. height: 100%;
  668. display: flex;
  669. align-items: center;
  670. justify-content: center;
  671. overflow: hidden;
  672. white-space: nowrap;
  673. text-overflow: ellipsis;
  674. }
  675. }
  676. .screen {
  677. width: 100%;
  678. .boxtittab {
  679. width: 100%;
  680. flex-direction: column;
  681. border: none;
  682. .tabbox {
  683. width: 100%;
  684. }
  685. }
  686. }
  687. // 对比时间切换
  688. .timepick {
  689. width: 100%;
  690. height: 90rpx;
  691. display: flex;
  692. align-items: center;
  693. background: #FAFAFA;
  694. }
  695. .timepicktime {
  696. width: 260rpx;
  697. height: 50rpx;
  698. border: 1rpx solid #E0E0E0;
  699. margin-left: 30rpx;
  700. display: flex;
  701. background: #FFFFFF;
  702. }
  703. .timepicktime>view:nth-of-type(1) {
  704. width: 210rpx;
  705. height: 100%;
  706. line-height: 50rpx;
  707. font-size: 26rpx;
  708. font-weight: 400;
  709. text-align: center;
  710. }
  711. .timepicktime>view:nth-of-type(2) {
  712. width: 49rpx;
  713. height: 100%;
  714. // border-left: 1px solid #E0E0E0;
  715. }
  716. .timepickpick {
  717. width: 110rpx;
  718. height: 50rpx;
  719. margin-left: 30rpx;
  720. display: flex;
  721. align-items: center;
  722. }
  723. .Underimg {
  724. width: 50rpx;
  725. height: 50rpx;
  726. margin-top: -2rpx;
  727. }
  728. </style>