my-list-item.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <template>
  2. <view>
  3. <view class="home-list-item d-flex a-center j-sb animated fadeIn fast" hover-class="home-list-hover"
  4. @tap="clickevent">
  5. <view class="d-flex a-center">
  6. <view v-if="item.icon" class="icon iconfont" :class="['icon-'+item.icon]"></view> {{item.name}}
  7. </view>
  8. <view class="d-flex a-center j-center rightText">
  9. {{item.text}}
  10. <view class="icon iconfont" :class="{'icon-youjiantou':!item.data}">{{item.data || ''}}</view>
  11. </view>
  12. </view>
  13. </view>
  14. </template>
  15. <script>
  16. const PACKAGE_INFO_KEY = '__package_info__'
  17. export default {
  18. data() {
  19. return {}
  20. },
  21. props: {
  22. item: Object,
  23. index: Number
  24. },
  25. methods: {
  26. clickevent() {
  27. switch (this.item.clicktype) {
  28. case "navigateTo":
  29. if (this.item.url) {
  30. let option = {
  31. url: this.item.url
  32. };
  33. if (this.item.auth) {
  34. return this.navigate(option, 'navigateTo', true);
  35. }
  36. uni.navigateTo(option);
  37. }
  38. break;
  39. case "switchTab":
  40. if (this.item.url) {
  41. let option = {
  42. url: this.item.url
  43. };
  44. if (this.item.auth) {
  45. return this.navigate(option, 'switchTab', true);
  46. }
  47. uni.switchTab(option);
  48. }
  49. break;
  50. case "clear":
  51. uni.showModal({
  52. title: '提示',
  53. content: '是否要清除缓存?',
  54. confirmText: '立刻清除',
  55. success: res => {
  56. if (res.confirm) {
  57. uni.showToast({
  58. title: '清除缓存成功!',
  59. icon: "none"
  60. });
  61. }
  62. },
  63. });
  64. break;
  65. case "bind":
  66. if (this.User.userbind[this.item.provider]) return;
  67. this.bindother();
  68. break;
  69. case "nothing":
  70. uni.showToast({
  71. title: '更新中...',
  72. icon: 'none'
  73. });
  74. break;
  75. }
  76. },
  77. // 绑定第三方登录
  78. bindother() {
  79. uni.login({
  80. provider: this.item.provider,
  81. // #ifdef MP-ALIPAY
  82. scopes: 'auth_user', //支付宝小程序需设置授权类型
  83. // #endif
  84. success: (res) => {
  85. uni.getUserInfo({
  86. provider: this.item.provider,
  87. success: (infoRes) => {
  88. let options = Object.assign(infoRes, res);
  89. this.bindEvent(this.User.__formatOtherLogin(this.item.provider,
  90. options));
  91. }
  92. });
  93. },
  94. fail: (err) => {
  95. uni.showToast({
  96. title: '绑定失败',
  97. icon: "none"
  98. });
  99. console.log('login fail:', err);
  100. }
  101. });
  102. },
  103. async bindEvent(data) {
  104. uni.showLoading({
  105. title: '绑定中...',
  106. mask: false
  107. });
  108. let [err, res] = await this.$http.post("/user/bindother", data, {
  109. token: true,
  110. checkToken: true
  111. })
  112. if (!this.$http.errorCheck(err, res)) return uni.hideLoading();
  113. // 绑定成功
  114. uni.hideLoading();
  115. uni.showToast({
  116. title: '绑定成功!'
  117. });
  118. // 修改状态,缓存
  119. this.User.userbind[this.item.provider] = {
  120. nickname: data.nickName
  121. }
  122. uni.setStorageSync("userbind", this.User.userbind);
  123. this.$emit('updateuserbind');
  124. },
  125. }
  126. }
  127. </script>
  128. <style scoped>
  129. .home-list-item {
  130. padding: 20upx;
  131. border-top: 1upx solid #F4F4F4;
  132. border-bottom: 1upx solid #F4F4F4;
  133. }
  134. .home-list-item>view:first-child {
  135. color: #333333;
  136. }
  137. .home-list-item>view:first-child>view {
  138. margin-right: 10upx;
  139. font-size: 32upx;
  140. }
  141. .home-list-item>view:last-child {
  142. color: #CCCCCC;
  143. }
  144. .home-list-hover {
  145. background: #f4f4f4;
  146. }
  147. .rightText {
  148. font-size: 30upx;
  149. }
  150. .icon {
  151. margin-left: 10upx;
  152. font-size: 24upx;
  153. }
  154. </style>