phoneList.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view class="box">
  3. <view class="main">
  4. <view class="phoneListBox">
  5. <view class="phoneLine" v-for="(item,index) in phoneList" @click="lineClick(item)">
  6. <view class="phoneLeft">
  7. <view class="name">{{item.name}}</view>
  8. <view class="phoneNUm">{{item.phone}}</view>
  9. <view class="default" v-show="item.isDefault==1">默认</view>
  10. </view>
  11. <view @click.stop="edit(item)">
  12. <image src="../../static/img/icon_edit.png" mode="aspectFit" class="phoneEdit"></image>
  13. </view>
  14. </view>
  15. <view class="phoneLine" style="border: none;" @click="goadd">
  16. <view class="addTxt">新增联系人</view>
  17. <view class="addjt">></view>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. </template>
  23. <script>
  24. export default {
  25. data() {
  26. return {
  27. page:1,
  28. phoneList:[],
  29. }
  30. },
  31. onLoad() {
  32. },
  33. onShow() {
  34. this.page=1;
  35. this.phoneList=[];
  36. this.getList()
  37. },
  38. methods: {
  39. lineClick(item){
  40. console.log(item);
  41. uni.setStorage({
  42. key: 'phoneData',
  43. data: item,
  44. success: function () {
  45. uni.navigateBack({
  46. delta:1
  47. })
  48. }
  49. });
  50. },
  51. getList(){
  52. uni.showLoading({
  53. title: '加载中'
  54. })
  55. this.$http('worldKeepCar/keepCarMy/listTMemberContactPage', {
  56. page:this.page,
  57. limit:10,
  58. },'GET').then(res => {
  59. uni.hideLoading();
  60. var a=res.data.Items
  61. this.phoneList=this.phoneList.concat(a);
  62. })
  63. },
  64. goadd(){
  65. uni.navigateTo({
  66. url:'addphone'
  67. })
  68. },
  69. edit(item){
  70. item=JSON.stringify(item)
  71. uni.navigateTo({
  72. url:'addphone?item='+item
  73. })
  74. },
  75. }
  76. }
  77. </script>
  78. <style scoped>
  79. .box{
  80. min-height: 100vh;
  81. background:#F4F5F7 ;
  82. }
  83. .main{
  84. padding: 24rpx;
  85. }
  86. .phoneListBox{
  87. background: #FFFFFF;
  88. border-radius: 10rpx;
  89. padding: 0 24rpx;
  90. }
  91. .phoneLine{
  92. display: flex;
  93. justify-content: space-between;
  94. padding: 30rpx;
  95. border-bottom: 1rpx solid #EEEEEE;
  96. }
  97. .phoneEdit{
  98. width: 40rpx;
  99. height: 40rpx;
  100. }
  101. .name{
  102. font-size: 28rpx;
  103. font-family: PingFangSC-Medium, PingFang SC;
  104. font-weight: 500;
  105. color: #3C3C3C;
  106. width: 200rpx;
  107. }
  108. .phoneNUm{
  109. font-size: 28rpx;
  110. font-family: PingFangSC-Regular, PingFang SC;
  111. font-weight: 400;
  112. color: #3C3C3C;
  113. }
  114. .phoneLeft{
  115. display: flex;
  116. }
  117. .default{
  118. width: 64rpx;
  119. height: 30rpx;
  120. background: rgba(255, 79, 0, 0.06);
  121. border-radius: 4rpx;
  122. text-align: center;line-height: 30rpx;
  123. color: #FF4F00;font-size: 22rpx;
  124. margin-left: 30rpx;margin-top: 4rpx;
  125. }
  126. .addTxt{
  127. color: #FF4F00;
  128. font-size: 30rpx;
  129. }
  130. .addjt{
  131. color: #CCCCCC;
  132. font-size: 30rpx;
  133. }
  134. </style>