You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

716 lines
19 KiB

  1. <template>
  2. <view class="cented-box">
  3. <view class="Switchingbox">
  4. <view class="Switching1">
  5. <image class="Switching1-img" src="../../static/images/building.png" mode=""></image>
  6. </view>
  7. <view class="Switching2">楼盘:</view>
  8. <view class="Switching3">{{buildingname}}</view>
  9. <view class="Switching4" v-if="buildingishow" @click="piskbuilding()">切换楼盘</view>
  10. </view>
  11. <view class="title" style="margin-top: 30rpx;" v-if="Myworkcard">我的工牌</view>
  12. <view v-if="Myworkcard">
  13. <view class="Workcard" v-if="Whetheroffline==true">
  14. <view class="Workcard-box">
  15. <view class="Workcardimg">
  16. <view class="Workcardimg1">
  17. <view v-if="percentage>20" class="bar" :style="{width : percentage + '%' }"></view>
  18. <view v-if="percentage<20" class="bar1" :style="{width : percentage + '%' }"></view>
  19. </view>
  20. </view>
  21. <view class="Workcardtext">电量:{{percentage}}%</view>
  22. </view>
  23. <view class="Workcard-box">
  24. <view class="Workcardimg">
  25. <image v-if="signalDevice==''" class="Workcardimg2" src="../../static/images/signal0.png"
  26. mode=""></image>
  27. <image v-else-if="signalDevice<20 && signalDevice>0" class="Workcardimg2"
  28. src="../../static/images/signal1.png" mode=""></image>
  29. <image v-else-if="signalDevice<50 && signalDevice>20" class="Workcardimg2"
  30. src="../../static/images/signal2.png" mode=""></image>
  31. <image v-else-if="signalDevice<70 && signalDevice>50" class="Workcardimg2"
  32. src="../../static/images/signal3.png" mode=""></image>
  33. <image v-else-if="signalDevice<90 && signalDevice>70" class="Workcardimg2"
  34. src="../../static/images/signal4.png" mode=""></image>
  35. <image v-else-if="signalDevice<=100 && signalDevice>90" class="Workcardimg2"
  36. src="../../static/images/signal5.png" mode=""></image>
  37. </view>
  38. <view class="Workcardtext">信号:{{signalDevicetext}}</view>
  39. </view>
  40. <view class="Workcard-box">
  41. <view class="Workcardimg">
  42. <image v-if="audioStatus=='true'" class="Workcardimg3"
  43. src="../../static/images/Thtapedrive1.png" mode=""></image>
  44. <image v-if="audioStatus=='false'" class="Workcardimg3"
  45. src="../../static/images/Thtapedrive2.png" mode=""></image>
  46. </view>
  47. <view v-if="audioStatus=='true'" class="Workcardtext">录音:已开启</view>
  48. <view v-if="audioStatus=='false'" class="Workcardtext">录音:未开启</view>
  49. </view>
  50. </view>
  51. <view class="Workcard" v-if="Whetheroffline==false">
  52. <view class="Workcard-box">
  53. <view class="Workcardimg">
  54. <image class="Workcardimg4" src="../../static/images/offline.png" mode=""></image>
  55. </view>
  56. <view class="Workcardtext">设备离线</view>
  57. </view>
  58. </view>
  59. </view>
  60. <view class="title" v-if="equipmentisshow">设备</view>
  61. <view class="shebenbox" v-if="equipmentisshow" >
  62. <view class="shebenche" @click="tapjumpequipment(0)">
  63. <view class="shebenchenum">{{equipmentobj.totalNum || 0}}</view>
  64. <view class="shebenchetext">设备总数</view>
  65. </view>
  66. <view class="shebenche" @click="tapjumpequipment(1)">
  67. <view class="shebenchenum">{{equipmentobj.onlineNum || 0}}</view>
  68. <view class="shebenchetext">在线</view>
  69. </view>
  70. <view class="shebenche" @click="tapjumpequipment(3)">
  71. <view class="shebenchenum">{{equipmentobj.activeNum || 0}}</view>
  72. <view class="shebenchetext">活跃</view>
  73. </view>
  74. <view class="shebenche" @click="tapjumpequipment(2)">
  75. <view class="shebenchenum" style="color: red;">{{equipmentobj.lowPowerNum || 0}}</view>
  76. <view class="shebenchetext">急需充电</view>
  77. </view>
  78. </view>
  79. <view class="title">实时统计</view>
  80. <view class="real-timebox">
  81. <view class="timebox">
  82. <view class="real" @click="tapjumpreception('1')">
  83. <view class="realnum">{{realtimeobj.receptionCount || 0}}</view>
  84. <view class="realtext">接待量</view>
  85. </view>
  86. <view class="real" @click="tapjumpreception('2')">
  87. <view class="realnum">{{realtimeobj.receivingCustomer || 0}}</view>
  88. <view class="realtext">正在接待</view>
  89. </view>
  90. <view class="real" @click="tapjumpreception('4')">
  91. <view class="realnum">{{realtimeobj.tagCustomer || 0}}</view>
  92. <view class="realtext">未标顾问</view>
  93. </view>
  94. </view>
  95. <view class="timebox">
  96. <view class="real" @click="tapjumpreception('1')">
  97. <view class="realnum">{{realtimeobj.avgDuration|| 0}}</view>
  98. <view class="realtext">平均接待时长</view>
  99. </view>
  100. <view class="real" @click="tapjumpreception('1')">
  101. <view class="realnum">{{realtimeobj.fraction || 0}}%</view>
  102. <view class="realtext">平均执行率</view>
  103. </view>
  104. <view class="real" >
  105. <view @click="prohibitedtap(1)" v-if="methodsisshow==true" class="realnum" style="color: red;" >{{realtimeobj.prohibitedCustomer || 0}}</view>
  106. <view @click="prohibitedtap(1)" v-if="methodsisshow==true" class="realtext">违禁预警</view>
  107. </view>
  108. </view>
  109. </view>
  110. <view class="title">本周工作</view>
  111. <view class="real-timebox">
  112. <view class="timebox">
  113. <view class="real" @click="tapjumpreception('3')">
  114. <view class="realnum">{{Thisweekobj.receptionCount || 0}}</view>
  115. <view class="realtext">接待量</view>
  116. </view>
  117. <view class="real" @click="tapjumpreception('3')">
  118. <view class="realnum">{{Thisweekobj.fraction || 0}}%</view>
  119. <view class="realtext">平均执行率</view>
  120. </view>
  121. <view class="real" @click="tapjumpreception('3')">
  122. <view class="realnum">{{Thisweekobj.avgDuration|| 0}}</view>
  123. <view class="realtext">平均接待时长</view>
  124. </view>
  125. <view class="real" @click="prohibitedtap(2)" v-if="methodsisshow==true">
  126. <view class="realnum" style="color: red;" >{{Thisweekobj.prohibitedCustomer || 0}}</view>
  127. <view class="realtext">违禁预警</view>
  128. </view>
  129. </view>
  130. </view>
  131. <view class="title">常用功能</view>
  132. <view class="commonly-box">
  133. <view class="commonly" @click="Piabodata(item.name)" v-for="(item,index) in Menulist" :key='index'>
  134. <view class="commonly-img">
  135. <image v-if="item.name=='客户管理'" class="commonly-img1" src="../../static/images/function1.png"
  136. mode=""></image>
  137. <image v-if="item.name=='接待记录'" class="commonly-img1" src="../../static/images/function2.png"
  138. mode=""></image>
  139. <image v-if="item.name=='销讲数据'" class="commonly-img1" src="../../static/images/function4.png"
  140. mode=""></image>
  141. <image v-if="item.name=='设备管理'" class="commonly-img1" src="../../static/images/function5.png"
  142. mode=""></image>
  143. <image v-if="item.name=='值班顾问'" class="commonly-img1" src="../../static/images/function6.png"
  144. mode=""></image>
  145. <image v-if="item.name=='顾问排名'" class="commonly-img1" src="../../static/images/rankingguwen.png"
  146. mode=""></image>
  147. <image v-if="item.name=='违禁记录'" class="commonly-img1" src="../../static/images/prohibited.png"
  148. mode=""></image>
  149. </view>
  150. <view class="commonly-text">{{item.name}}</view>
  151. </view>
  152. </view>
  153. <!-- 楼盘切换 -->
  154. <view v-if="Showhiddenunits">
  155. <u-select :mask-close-able="false" v-model="Showhiddenunits" mode="single-column" :list="lpanlist"
  156. @cancel="cancel" @confirm="confirm"></u-select>
  157. </view>
  158. </view>
  159. </template>
  160. <script>
  161. var config = require("../../config");
  162. export default {
  163. data() {
  164. return {
  165. userInfo: {},
  166. Showhiddenunits: false,
  167. lpanlist: [], //楼盘列表
  168. buildingname: '', //楼盘名
  169. buildingID: '', //楼盘id
  170. buildingishow: false, //是否选择楼盘
  171. Myworkcard: false,
  172. percentage: '', //设备电量
  173. Whetheroffline: false, //是否离线
  174. signalDevice: 0, //信号
  175. signalDevicetext: "",
  176. audioStatus: false,
  177. equipmentisshow: false,
  178. equipmentobj: {
  179. totalNum: '',
  180. onlineNum: '',
  181. activeNum: '',
  182. lowPowerNum: '',
  183. },
  184. Menulist: [],
  185. realtimeobj: {
  186. sumCustomer: '',
  187. receivingCustomer: '',
  188. activeCustomer: '',
  189. prohibitedCustomer: '',
  190. tagCustomer: '',
  191. fraction: '',
  192. receptionCount:''
  193. },
  194. Thisweekobj: {
  195. sumCustomer: '',
  196. receivingCustomer: '',
  197. activeCustomer: '',
  198. prohibitedCustomer: '',
  199. tagCustomer: '',
  200. fraction: '',
  201. receptionCount:''
  202. },
  203. methodsisshow:false
  204. };
  205. },
  206. components: {},
  207. onShow() {
  208. this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');
  209. this.Menulist = uni.getStorageSync('weapp_session_Menu_data');
  210. if(this.userInfo.dataCode==6 || this.userInfo.dataCode==3){
  211. this.methodsisshow=false;
  212. }else{
  213. this.methodsisshow=true;
  214. }
  215. if (this.userInfo.zkProperties.length == 1) {
  216. this.buildingID = uni.getStorageSync('buildingID').id;
  217. this.buildingname = uni.getStorageSync('buildingID').name;
  218. this.buildingishow = false;
  219. } else {
  220. this.buildingishow = true;
  221. this.buildingname = uni.getStorageSync('buildingID').name;
  222. this.buildingID = uni.getStorageSync('buildingID').id;
  223. this.userInfo.zkProperties.forEach(item => {
  224. item.label = item.propertyName;
  225. item.value = item.id
  226. })
  227. this.lpanlist = this.userInfo.zkProperties
  228. }
  229. if (this.userInfo.dataCode == 6) {
  230. this.Myworkcard = true;
  231. this.equipmentisshow = false;
  232. this.iniodianloang()
  233. } else {
  234. this.equipmentisshow = true;
  235. this.Myworkcard = false;
  236. this.initequipment()
  237. }
  238. this.initworkThisWeek()
  239. this.initrealTimeStatistics()
  240. },
  241. methods: {
  242. initworkThisWeek() {
  243. uni.request({
  244. url: config.service.workThisWeek,
  245. method: "POST",
  246. header: {
  247. 'content-type': 'application/json',
  248. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  249. },
  250. data: {
  251. houseId: this.buildingID
  252. },
  253. success: (data) => {
  254. if (data.data.data == null) {
  255. return
  256. } else {
  257. this.Thisweekobj = {
  258. sumCustomer: data.data.data.sumCustomer,
  259. receivingCustomer: data.data.data.receivingCustomer,
  260. activeCustomer: data.data.data.activeCustomer,
  261. prohibitedCustomer: data.data.data.prohibitedCustomer,
  262. avgDuration: Math.floor(data.data.data.avgDuration/60) ||0,
  263. tagCustomer: data.data.data.tagCustomer,
  264. fraction: data.data.data.fraction,
  265. receptionCount:data.data.data.receptionCount
  266. }
  267. }
  268. }
  269. })
  270. },
  271. //实时统计
  272. initrealTimeStatistics() {
  273. uni.request({
  274. url: config.service.realTimeStatistics,
  275. method: "POST",
  276. header: {
  277. 'content-type': 'application/json',
  278. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  279. },
  280. data: {
  281. houseId: this.buildingID
  282. },
  283. success: (data) => {
  284. if (data.data.data == null) {
  285. return
  286. } else {
  287. this.realtimeobj = {
  288. sumCustomer: data.data.data.sumCustomer,
  289. receivingCustomer: data.data.data.receivingCustomer,
  290. activeCustomer: data.data.data.activeCustomer,
  291. prohibitedCustomer: data.data.data.prohibitedCustomer,
  292. avgDuration: Math.floor(data.data.data.avgDuration/60) ||0,
  293. tagCustomer: data.data.data.tagCustomer,
  294. fraction: data.data.data.fraction,
  295. receptionCount:data.data.data.receptionCount
  296. }
  297. }
  298. }
  299. })
  300. },
  301. //设备
  302. initequipment() {
  303. uni.request({
  304. url: config.service.findEquipmentState,
  305. method: "POST",
  306. header: {
  307. 'content-type': 'application/json',
  308. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  309. },
  310. data: {
  311. propertyId: this.buildingID
  312. },
  313. success: (data) => {
  314. if (data.data.data == null) {
  315. return
  316. } else {
  317. this.equipmentobj = {
  318. totalNum: data.data.data.totalNum,
  319. onlineNum: data.data.data.onlineNum,
  320. activeNum: data.data.data.activeNum,
  321. lowPowerNum: data.data.data.lowPowerNum,
  322. }
  323. }
  324. }
  325. })
  326. },
  327. //我的工牌
  328. iniodianloang() {
  329. uni.request({
  330. url: config.service.findElectricity,
  331. method: "POST",
  332. header: {
  333. 'content-type': 'application/json',
  334. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  335. },
  336. data: {},
  337. success: (data) => {
  338. if (data.data.data == null) {
  339. return
  340. } else {
  341. if (data.data.data > 100) {
  342. this.percentage = 100;
  343. } else {
  344. if (data.data.data.onLine == 0) {
  345. this.Whetheroffline = false;
  346. } else {
  347. this.Whetheroffline = true;
  348. this.percentage = data.data.data.electricity;
  349. this.signalDevice = data.data.data.signalDevice / 1;
  350. console.log(this.signalDevice)
  351. this.audioStatus = data.data.data.audioStatus;
  352. if (this.signalDevice > 80) {
  353. this.signalDevicetext = '高';
  354. } else {
  355. if (this.signalDevice == 0) {
  356. this.signalDevicetext = '无';
  357. } else {
  358. this.signalDevicetext = '低';
  359. }
  360. }
  361. }
  362. }
  363. }
  364. }
  365. })
  366. },
  367. //选择楼盘弹框
  368. piskbuilding() {
  369. this.Showhiddenunits = true;
  370. },
  371. // 楼盘选择确认
  372. confirm(e) {
  373. this.buildingname = e[0].label;
  374. this.buildingID = e[0].value;
  375. let lopan = {
  376. id: e[0].value,
  377. name: e[0].label
  378. }
  379. uni.setStorageSync("buildingID", lopan); //楼盘id写入缓存
  380. this.initworkThisWeek()
  381. this.initrealTimeStatistics()
  382. this.initequipment()
  383. this.iniodianloang()
  384. },
  385. // 楼盘选择取消
  386. cancel() {
  387. this.Showhiddenunits = false;
  388. },
  389. tapjumpequipment(i){
  390. this.Menulist.forEach(item=>{
  391. if(item.name=='设备管理'){
  392. uni.navigateTo({
  393. url: '/pages/mine/equipment/index?active='+i
  394. });
  395. }
  396. })
  397. },
  398. prohibitedtap(i){
  399. if(i==1){
  400. uni.navigateTo({
  401. url: '/pages/center/prohibited/index?refresh='+'refresh'+'&activeTotal='+'0'
  402. });
  403. }else{
  404. uni.navigateTo({
  405. url: '/pages/center/prohibited/index?refresh='+'refresh'+'&activeTotal='+'2'
  406. });
  407. }
  408. },
  409. tapjumpreception(i){
  410. this.Menulist.forEach(item=>{
  411. if(item.name=='接待记录'){
  412. if(i==1){
  413. uni.navigateTo({
  414. url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal='+'0'
  415. });
  416. }else if(i==2){
  417. uni.switchTab({
  418. url: '/pages/index/customer'
  419. });
  420. }else if(i==3){
  421. uni.navigateTo({
  422. url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal='+'2'
  423. });
  424. }else{
  425. uni.navigateTo({
  426. url: '/pages/center/records/index?refresh='+'refresh'+'&activeTotal=0'+'&markAdvisor=0'
  427. });
  428. }
  429. }
  430. })
  431. },
  432. Piabodata(item) {
  433. if (item == '销讲数据') {
  434. uni.navigateTo({
  435. url: '/pages/center/Piabodata/index'
  436. });
  437. } else if (item == '接待记录') {
  438. uni.navigateTo({
  439. url: '/pages/center/records/index?refresh='+'refresh'
  440. });
  441. } else if (item == '值班顾问') {
  442. uni.navigateTo({
  443. url: '/pages/mine/consultanonduty/index'
  444. });
  445. } else if (item == '设备管理') {
  446. uni.navigateTo({
  447. url: '/pages/mine/equipment/index'
  448. });
  449. } else if(item == '顾问排名') {
  450. uni.navigateTo({
  451. url: '/pages/center/Piabodata/Employeesstatistics'
  452. });
  453. }else if(item == '违禁记录'){
  454. uni.navigateTo({
  455. url: '/pages/center/prohibited/index?refresh='+'refresh'
  456. });
  457. }else{
  458. uni.navigateTo({
  459. url: '/pages/center/consumer/index?refresh='+'refresh'
  460. });
  461. }
  462. },
  463. },
  464. };
  465. </script>
  466. <style lang="scss" scoped>
  467. .cented-box {
  468. padding: 30rpx;
  469. background: #F8F8F8;
  470. width: 100%;
  471. height: 100%;
  472. }
  473. .Switchingbox {
  474. width: 100%;
  475. height: 44rpx;
  476. display: flex;
  477. align-items: center;
  478. .Switching1 {
  479. width: 44rpx;
  480. height: 44rpx;
  481. .Switching1-img {
  482. width: 44rpx;
  483. height: 44rpx;
  484. }
  485. }
  486. .Switching2 {
  487. margin-left: 12rpx;
  488. font-size: 32rpx;
  489. color: #303030;
  490. font-weight: 500;
  491. }
  492. .Switching3 {
  493. width: calc(100% - 280rpx);
  494. font-size: 32rpx;
  495. color: #303030;
  496. font-weight: 500;
  497. }
  498. .Switching4 {
  499. width: 112rpx;
  500. font-size: 28rpx;
  501. color: #303030;
  502. font-weight: 400;
  503. text-align: right;
  504. text-decoration: underline
  505. }
  506. }
  507. .Workcard {
  508. width: 100%;
  509. background: #FFFFFF;
  510. height: 154rpx;
  511. box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);
  512. border-radius: 12rpx;
  513. display: flex;
  514. .Workcard-box {
  515. flex: 1;
  516. height: 100%;
  517. .Workcardimg {
  518. width: 100%;
  519. display: flex;
  520. justify-content: center;
  521. margin-top: 42rpx;
  522. .Workcardimg1 {
  523. width: 64rpx;
  524. height: 36rpx;
  525. background-image: url(../../static/images/battery.png);
  526. background-size: 100% 100%;
  527. padding: 8rpx;
  528. .bar {
  529. background-color: #43CD80;
  530. height: 100%;
  531. border-radius: 4rpx;
  532. }
  533. .bar1 {
  534. background-color: red;
  535. height: 100%;
  536. border-radius: 4rpx;
  537. }
  538. }
  539. .Workcardimg2 {
  540. width: 56rpx;
  541. height: 36rpx;
  542. }
  543. .Workcardimg3 {
  544. width: 34rpx;
  545. height: 36rpx;
  546. }
  547. .Workcardimg4 {
  548. width: 50rpx;
  549. height: 40rpx;
  550. }
  551. }
  552. .Workcardtext {
  553. width: 100%;
  554. text-align: center;
  555. font-size: 24rpx;
  556. font-weight: 400;
  557. color: #666666;
  558. margin-top: 20rpx;
  559. }
  560. }
  561. }
  562. .title {
  563. width: 100%;
  564. height: 30rpx;
  565. font-size: 30rpx;
  566. font-weight: 600;
  567. color: #333333;
  568. margin-top: 40rpx;
  569. margin-bottom: 24rpx;
  570. }
  571. .shebenbox {
  572. width: 100%;
  573. height: 156rpx;
  574. background: #FFFFFF;
  575. box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);
  576. border-radius: 12rpx;
  577. display: flex;
  578. .shebenche {
  579. width: 25%;
  580. height: 100%;
  581. .shebenchenum {
  582. width: 100%;
  583. font-size: 36rpx;
  584. font-weight: 600;
  585. color: #333333;
  586. text-align: center;
  587. margin-top: 28rpx;
  588. }
  589. .shebenchetext {
  590. width: 100%;
  591. font-size: 24rpx;
  592. font-weight: 400;
  593. color: #666666;
  594. text-align: center;
  595. margin-top: 24rpx;
  596. }
  597. }
  598. }
  599. .real-timebox {
  600. width: 100%;
  601. background: #FFFFFF;
  602. box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);
  603. border-radius: 12rpx;
  604. padding-bottom: 36rpx;
  605. .timebox {
  606. width: 100%;
  607. display: flex;
  608. .real {
  609. flex: 1;
  610. height: 100%;
  611. .realnum {
  612. width: 100%;
  613. font-size: 36rpx;
  614. font-weight: 600;
  615. color: #333333;
  616. text-align: center;
  617. margin-top: 36rpx;
  618. }
  619. .realtext {
  620. width: 100%;
  621. font-size: 24rpx;
  622. font-weight: 400;
  623. color: #666666;
  624. text-align: center;
  625. margin-top: 24rpx;
  626. }
  627. }
  628. }
  629. }
  630. .commonly-box {
  631. width: 100%;
  632. background: #FFFFFF;
  633. box-shadow: 0px 0px 12px 0px rgba(224, 224, 224, 0.3);
  634. border-radius: 12rpx;
  635. display: flex;
  636. flex-wrap: wrap;
  637. padding-bottom: 36rpx;
  638. .commonly {
  639. width: 25%;
  640. margin-top: 36rpx;
  641. .commonly-img {
  642. width: 100%;
  643. height: 68rpx;
  644. text-align: center;
  645. .commonly-img1 {
  646. width: 68rpx;
  647. height: 68rpx;
  648. border-radius: 50%;
  649. }
  650. }
  651. .commonly-text {
  652. width: 100%;
  653. text-align: center;
  654. font-size: 24rpx;
  655. font-weight: 400;
  656. color: #333333;
  657. margin-top: 16rpx;
  658. }
  659. }
  660. }
  661. </style>