teamMember.vue 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  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(phone)" style="color: #007AFF;">
  50. {{phone?(phone.substring(0,3)+'****'+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>{{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. phone: "",
  69. createTime: "",
  70. }
  71. },
  72. computed: {
  73. ...mapState(['userInfo']),
  74. getHeight() {
  75. let height = uni.getSystemInfoSync().windowHeight - uni.upx2px(770);
  76. return `height: ${height}px;`;
  77. }
  78. },
  79. // 监听导航栏的按钮
  80. onNavigationBarButtonTap(e) {
  81. if (e.index == 0) {
  82. this.navigate({
  83. url: '/pages/index/index'
  84. }, "switchTab", true);
  85. }
  86. },
  87. onLoad() {
  88. const eventChannel = this.getOpenerEventChannel()
  89. // 监听acceptData事件,获取上一页面通过eventChannel传送到当前页面的数据
  90. eventChannel.on('acceptData', async (data) => {
  91. this.info = data.item;
  92. let res = await this.$http.get('/app/customer/' + this.info.id);
  93. if (res.code == '200') {
  94. this.phone = res.data.phone;
  95. this.createTime = res.data.createTime;
  96. }
  97. })
  98. },
  99. methods: {
  100. callPhone(tel) {
  101. uni.makePhoneCall({
  102. phoneNumber: tel,
  103. success: () => {
  104. console.log("成功拨打电话")
  105. }
  106. })
  107. },
  108. // toTeam() {
  109. // this.navigate({
  110. // url: '/pages/tools/team/team?id=' + this.staffInfo.sysUser.id + '&name=' + this.staffInfo
  111. // .sysUser.name
  112. // }, "navigateTo", true)
  113. // }
  114. }
  115. }
  116. </script>
  117. <style>
  118. page {
  119. background: #F1F1F3;
  120. }
  121. .achievementInfo,
  122. .teamInfo,
  123. .personInfo {
  124. margin-top: 20rpx;
  125. background: #FFFFFF;
  126. }
  127. /* 业绩信息Start */
  128. .infoTitle {
  129. height: 80rpx;
  130. padding: 0rpx 20rpx;
  131. border-bottom: 1px solid #EDEDED;
  132. }
  133. .achievementStatistics {
  134. /* height: 140rpx; */
  135. border-bottom: 1px solid #EDEDED;
  136. }
  137. .achievementStatistics_item {
  138. padding: 10rpx 0;
  139. box-sizing: border-box;
  140. }
  141. .achievementStatistics_item>view:nth-of-type(1) {
  142. font-size: 32rpx;
  143. line-height: 60rpx;
  144. color: #4D4D4D;
  145. }
  146. .achievementStatistics_item>view:nth-of-type(2) {
  147. font-size: 32rpx;
  148. color: #D30500;
  149. }
  150. .achievementAssessment {
  151. border-bottom: 1px solid #EDEDED;
  152. }
  153. .achievementAssessment_item {
  154. padding: 15rpx 0;
  155. }
  156. .achievementAssessment .achievementAssessment_item:nth-child(1) {
  157. border-right: 1px solid #F1F1F1;
  158. flex: 2;
  159. }
  160. .achievementAssessment .achievementAssessment_item:nth-child(1)>view:nth-of-type(2) {
  161. display: inline-block;
  162. background-color: #007AFF;
  163. padding: 0rpx 10rpx;
  164. border-radius: 20rpx;
  165. font-size: 20rpx;
  166. text-align: center;
  167. color: #fff;
  168. margin-left: 20rpx;
  169. }
  170. .achievementAssessment .achievementAssessment_item:nth-child(2) {
  171. padding-left: 40rpx;
  172. box-sizing: border-box;
  173. flex: 3;
  174. color: #5F5F5F;
  175. }
  176. /* 业绩信息End */
  177. .teamInfo-list-hover {
  178. background: #f4f4f4;
  179. }
  180. .teamInfo_item>view:first-child {
  181. color: #000;
  182. }
  183. .teamInfo_item>view:last-child {
  184. color: #6A6A6A;
  185. }
  186. .personInfo_item,
  187. .teamInfo_item {
  188. padding: 15upx 30upx;
  189. border-top: 1upx solid #F4F4F4;
  190. border-bottom: 1upx solid #F4F4F4;
  191. }
  192. .personInfo_item>view:first-child {
  193. color: #3C3C3C;
  194. }
  195. .personInfo_item>view:first-child>view {
  196. margin-right: 20upx;
  197. }
  198. .personInfo_item>view:last-child {
  199. color: #6A6A6A;
  200. }
  201. </style>