teamMember.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  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>{{staffInfo.sysUser.name}}</view>
  42. </view>
  43. <view class="personInfo_item d-flex a-center j-sb">
  44. <view class="d-flex a-center">会员号</view>
  45. <view>{{staffInfo.sysUser.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(staffInfo.sysUser.mobile)" style="color: #007AFF;">{{staffInfo.sysUser.mobile?(staffInfo.sysUser.mobile.substring(0,3)+'****'+staffInfo.sysUser.mobile.substring(7)):''}}</view>
  50. </view>
  51. <view class="personInfo_item d-flex a-center j-sb">
  52. <view class="d-flex a-center">注册时间</view>
  53. <view>{{staffInfo.esmUserInternal.intime}}</view>
  54. </view>
  55. </view>
  56. </view>
  57. </template>
  58. <script>
  59. export default {
  60. data() {
  61. return {
  62. staffInfo:{
  63. sysUser:{
  64. name:"",
  65. id:"",
  66. mobile:"",
  67. },
  68. esmUserInternal:{
  69. intime:""
  70. }
  71. }
  72. }
  73. },
  74. // 监听导航栏的按钮
  75. onNavigationBarButtonTap(e) {
  76. if (e.index == 0) {
  77. this.navigate({
  78. url: '/pages/index/index'
  79. }, "switchTab",true);
  80. }
  81. },
  82. onLoad() {
  83. const eventChannel = this.getOpenerEventChannel()
  84. // 监听acceptData事件,获取上一页面通过eventChannel传送到当前页面的数据
  85. eventChannel.on('acceptData', (data) => {
  86. this.staffInfo = data.item;
  87. })
  88. },
  89. methods: {
  90. callPhone(tel){
  91. uni.makePhoneCall({
  92. phoneNumber: tel,
  93. success: () => {
  94. console.log("成功拨打电话")
  95. }
  96. })
  97. },
  98. toTeam(){
  99. this.navigate({url:'/pages/tools/team/team?id='+this.staffInfo.sysUser.id+'&name='+this.staffInfo.sysUser.name},"navigateTo",true)
  100. }
  101. }
  102. }
  103. </script>
  104. <style>
  105. page{
  106. background: #F1F1F3;
  107. }
  108. .achievementInfo,.teamInfo,.personInfo{
  109. margin-top: 20rpx;
  110. background:#FFFFFF;
  111. }
  112. /* 业绩信息Start */
  113. .infoTitle{
  114. height: 80rpx;
  115. padding: 0rpx 20rpx;
  116. border-bottom: 1px solid #EDEDED;
  117. }
  118. .achievementStatistics{
  119. /* height: 140rpx; */
  120. border-bottom: 1px solid #EDEDED;
  121. }
  122. .achievementStatistics_item{
  123. padding: 10rpx 0;
  124. box-sizing: border-box;
  125. }
  126. .achievementStatistics_item>view:nth-of-type(1){
  127. font-size: 32rpx;
  128. line-height: 60rpx;
  129. color: #4D4D4D;
  130. }
  131. .achievementStatistics_item>view:nth-of-type(2){
  132. font-size: 32rpx;
  133. color: #D30500;
  134. }
  135. .achievementAssessment{
  136. border-bottom: 1px solid #EDEDED;
  137. }
  138. .achievementAssessment_item{
  139. padding: 15rpx 0;
  140. }
  141. .achievementAssessment .achievementAssessment_item:nth-child(1){
  142. border-right: 1px solid #F1F1F1;
  143. flex: 2;
  144. }
  145. .achievementAssessment .achievementAssessment_item:nth-child(1)>view:nth-of-type(2){
  146. display: inline-block;
  147. background-color: #007AFF;
  148. padding: 0rpx 10rpx;
  149. border-radius:20rpx;
  150. font-size: 20rpx;
  151. text-align: center;
  152. color: #fff;
  153. margin-left: 20rpx;
  154. }
  155. .achievementAssessment .achievementAssessment_item:nth-child(2){
  156. padding-left: 40rpx;
  157. box-sizing: border-box;
  158. flex: 3;
  159. color: #5F5F5F;
  160. }
  161. /* 业绩信息End */
  162. .teamInfo-list-hover{
  163. background: #f4f4f4;
  164. }
  165. .teamInfo_item>view:first-child{
  166. color: #000;
  167. }
  168. .teamInfo_item>view:last-child{
  169. color: #6A6A6A;
  170. }
  171. .personInfo_item,.teamInfo_item{
  172. padding: 15upx 30upx;
  173. border-top: 1upx solid #F4F4F4;
  174. border-bottom: 1upx solid #F4F4F4;
  175. }
  176. .personInfo_item>view:first-child{
  177. color: #3C3C3C;
  178. }
  179. .personInfo_item>view:first-child>view{
  180. margin-right: 20upx;
  181. }
  182. .personInfo_item>view:last-child{
  183. color: #6A6A6A;
  184. }
  185. </style>