index.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. <template>
  2. <view class="opinion">
  3. <!-- 反馈 -->
  4. <view class="list">
  5. <button class="item" :open-type="item.id === 0 ? 'feedback' : '' " v-for="item in opinionList" :key="item.id" @click="clickOpinion(item)">
  6. <text>{{ item.label }}</text>
  7. <van-icon name="arrow" size="22rpx"/>
  8. </button>
  9. </view>
  10. <!-- 退出登录 -->
  11. <view class="login-out" @click="outLogin">
  12. 退出登录
  13. </view>
  14. </view>
  15. </template>
  16. <script>
  17. import Tip from '@/utils/tip'
  18. const opinionList = Object.freeze([
  19. {
  20. id: 0,
  21. label: '意见反馈'
  22. }
  23. ])
  24. export default {
  25. name: 'setting',
  26. onUnload () {
  27. clearTimeout(this.time)
  28. },
  29. data () {
  30. return {
  31. opinionList,
  32. time: ''
  33. }
  34. },
  35. methods: {
  36. clickOpinion(records) {
  37. console.log(records);
  38. switch (records.id) {
  39. case 0:
  40. uni.
  41. break;
  42. default:
  43. break;
  44. }
  45. },
  46. outLogin () {
  47. Tip.confirm('确定要退出吗?').then(res => {
  48. if (res) {
  49. Tip.loading('正在退出')
  50. this.time = setTimeout( () => {
  51. Tip.loaded()
  52. uni.clearStorageSync()
  53. uni.reLaunch({
  54. url: '/pages/index/index'
  55. })
  56. }, 1000)
  57. }
  58. })
  59. }
  60. },
  61. }
  62. </script>
  63. <style scoped lang="less">
  64. .opinion {
  65. width: 100vw;
  66. height: 100vh;
  67. background: #F9F7F7;
  68. overflow: hidden;
  69. font-size: 28rpx;
  70. font-weight: 600;
  71. color: #161616;
  72. .list {
  73. width: 686rpx;
  74. background: #FFFFFF;
  75. box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(235, 235, 235, 0.5);
  76. margin: 0 auto;
  77. border-radius: 20rpx;
  78. overflow: hidden;
  79. margin-top: 24rpx;
  80. .item {
  81. display: flex;
  82. justify-content: space-between;
  83. align-items: center;
  84. height: 100rpx;
  85. padding: 0rpx 24rpx 0rpx 32rpx;
  86. box-sizing: border-box;
  87. border: none;
  88. background-color: #fff;
  89. text {
  90. font-size: 32rpx;
  91. font-weight: 500;
  92. color: #333333;
  93. }
  94. }
  95. .item::after {
  96. border: none;
  97. }
  98. }
  99. .login-out {
  100. width: 534rpx;
  101. height: 92rpx;
  102. background: #1677FF;
  103. box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(235, 235, 235, 0.5);
  104. border-radius: 46rpx;
  105. display: flex;
  106. justify-content: center;
  107. align-items: center;
  108. font-size: 28rpx;
  109. font-family: PingFangSC-Medium, PingFang SC;
  110. font-weight: 500;
  111. color: #FFFFFF;
  112. margin: 0 auto;
  113. margin-top: 80rpx;
  114. }
  115. }
  116. </style>