teamMember.vue 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. <template>
  2. <view class="page">
  3. <view class="achievementInfo">
  4. <view class="infoTitle d-flex a-center">业绩信息</view>
  5. <view class="achievementStatistics d-flex">
  6. <view class="achievementStatistics_item d-flex flex-1 flex-column">
  7. <view class="d-flex a-center j-center">签单保费</view>
  8. <view class="d-flex a-center j-center">0</view>
  9. </view>
  10. <view class="achievementStatistics_item d-flex flex-1 flex-column">
  11. <view class="d-flex a-center j-center">出单人力</view>
  12. <view class="d-flex a-center j-center">0</view>
  13. </view>
  14. <view class="achievementStatistics_item d-flex flex-1 flex-column">
  15. <view class="d-flex a-center j-center">平均保费</view>
  16. <view class="d-flex a-center j-center">0</view>
  17. </view>
  18. </view>
  19. <view class="achievementAssessment d-flex">
  20. <view class="achievementAssessment_item d-flex a-center j-center flex-1">
  21. <view>机制考核</view><br />
  22. <view>守维持</view>
  23. </view>
  24. <view class="achievementAssessment_item d-flex flex-1 flex-column">
  25. <view>差距:3000 (标保)</view>
  26. <view>差距: (出单人力)</view>
  27. <view>差距: (继续率)</view>
  28. </view>
  29. </view>
  30. </view>
  31. <!-- <view class="teamInfo">
  32. <view class="teamInfo_item d-flex a-center j-sb" hover-class="teamInfo-list-hover">
  33. <view class="d-flex a-center">团队信息</view>
  34. <view class="icon iconfont icon-youjiantou" @tap="toTeam"></view>
  35. </view>
  36. </view> -->
  37. <view class="personInfo">
  38. <view class="infoTitle d-flex a-center">个人信息</view>
  39. <view class="personInfo_item d-flex a-center j-sb">
  40. <view class="d-flex a-center">姓名</view>
  41. <view>{{info.username}}</view>
  42. </view>
  43. <view class="personInfo_item d-flex a-center j-sb">
  44. <view class="d-flex a-center">会员号</view>
  45. <view>{{info.id}}</view>
  46. </view>
  47. <view class="personInfo_item d-flex a-center j-sb">
  48. <view class="d-flex a-center">手机</view>
  49. <view @tap="callPhone(info.phone)" style="color: #007AFF;">
  50. {{info.phone?(info.phone.substring(0,3)+'****'+info.phone.substring(7)):''}}
  51. </view>
  52. </view>
  53. <view class="personInfo_item d-flex a-center j-sb">
  54. <view class="d-flex a-center">注册时间</view>
  55. <view>{{info.createTime}}</view>
  56. </view>
  57. </view>
  58. </view>
  59. </template>
  60. <script>
  61. import {
  62. mapState
  63. } from "vuex";
  64. export default {
  65. data() {
  66. return {
  67. info: {},
  68. }
  69. },
  70. computed: {
  71. ...mapState(['userInfo']),
  72. getHeight() {
  73. let height = uni.getSystemInfoSync().windowHeight - uni.upx2px(770);
  74. return `height: ${height}px;`;
  75. }
  76. },
  77. // 监听导航栏的按钮
  78. onNavigationBarButtonTap(e) {
  79. if (e.index == 0) {
  80. this.navigate({
  81. url: '/pages/index/index'
  82. }, "switchTab", true);
  83. }
  84. },
  85. onLoad() {
  86. const eventChannel = this.getOpenerEventChannel()
  87. // 监听acceptData事件,获取上一页面通过eventChannel传送到当前页面的数据
  88. eventChannel.on('acceptData', async (data) => {
  89. this.info = data.item;
  90. let res = await this.$http.get('/app/customer/' + this.info.id);
  91. if (res.code == '200') {
  92. this.info.phone = res.data.phone;
  93. this.info.createTime = res.data.createTime;
  94. }
  95. })
  96. },
  97. methods: {
  98. callPhone(tel) {
  99. uni.makePhoneCall({
  100. phoneNumber: tel,
  101. success: () => {
  102. console.log("成功拨打电话")
  103. }
  104. })
  105. },
  106. // toTeam() {
  107. // this.navigate({
  108. // url: '/pages/tools/team/team?id=' + this.staffInfo.sysUser.id + '&name=' + this.staffInfo
  109. // .sysUser.name
  110. // }, "navigateTo", true)
  111. // }
  112. }
  113. }
  114. </script>
  115. <style>
  116. page {
  117. background: #F1F1F3;
  118. }
  119. .achievementInfo,
  120. .teamInfo,
  121. .personInfo {
  122. margin-top: 20rpx;
  123. background: #FFFFFF;
  124. }
  125. /* 业绩信息Start */
  126. .infoTitle {
  127. height: 80rpx;
  128. padding: 0rpx 20rpx;
  129. border-bottom: 1px solid #EDEDED;
  130. }
  131. .achievementStatistics {
  132. /* height: 140rpx; */
  133. border-bottom: 1px solid #EDEDED;
  134. }
  135. .achievementStatistics_item {
  136. padding: 10rpx 0;
  137. box-sizing: border-box;
  138. }
  139. .achievementStatistics_item>view:nth-of-type(1) {
  140. font-size: 32rpx;
  141. line-height: 60rpx;
  142. color: #4D4D4D;
  143. }
  144. .achievementStatistics_item>view:nth-of-type(2) {
  145. font-size: 32rpx;
  146. color: #D30500;
  147. }
  148. .achievementAssessment {
  149. border-bottom: 1px solid #EDEDED;
  150. }
  151. .achievementAssessment_item {
  152. padding: 15rpx 0;
  153. }
  154. .achievementAssessment .achievementAssessment_item:nth-child(1) {
  155. border-right: 1px solid #F1F1F1;
  156. flex: 2;
  157. }
  158. .achievementAssessment .achievementAssessment_item:nth-child(1)>view:nth-of-type(2) {
  159. display: inline-block;
  160. background-color: #007AFF;
  161. padding: 0rpx 10rpx;
  162. border-radius: 20rpx;
  163. font-size: 20rpx;
  164. text-align: center;
  165. color: #fff;
  166. margin-left: 20rpx;
  167. }
  168. .achievementAssessment .achievementAssessment_item:nth-child(2) {
  169. padding-left: 40rpx;
  170. box-sizing: border-box;
  171. flex: 3;
  172. color: #5F5F5F;
  173. }
  174. /* 业绩信息End */
  175. .teamInfo-list-hover {
  176. background: #f4f4f4;
  177. }
  178. .teamInfo_item>view:first-child {
  179. color: #000;
  180. }
  181. .teamInfo_item>view:last-child {
  182. color: #6A6A6A;
  183. }
  184. .personInfo_item,
  185. .teamInfo_item {
  186. padding: 15upx 30upx;
  187. border-top: 1upx solid #F4F4F4;
  188. border-bottom: 1upx solid #F4F4F4;
  189. }
  190. .personInfo_item>view:first-child {
  191. color: #3C3C3C;
  192. }
  193. .personInfo_item>view:first-child>view {
  194. margin-right: 20upx;
  195. }
  196. .personInfo_item>view:last-child {
  197. color: #6A6A6A;
  198. }
  199. </style>