unbindWechat.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. <template>
  2. <view class="unbind-wechat-container">
  3. <view class="header">解绑微信</view>
  4. <view class="desc">当前绑定微信:{{ wechatName }}</view>
  5. <button class="submit-btn" type="warn" @click="submit">确认解绑</button>
  6. </view>
  7. </template>
  8. <script>
  9. export default {
  10. data() {
  11. return {
  12. wechatName: ''
  13. }
  14. },
  15. onLoad() {
  16. // 假设已存储微信名
  17. this.wechatName = uni.getStorageSync('wechatName') || '未绑定'
  18. },
  19. methods: {
  20. submit() {
  21. uni.showModal({
  22. title: '确认解绑',
  23. content: '解绑后将无法使用微信快捷登录,是否继续?',
  24. success: (res) => {
  25. if (res.confirm) {
  26. uni.request({
  27. url: 'http://localhost:9527/api/unbindWechat',
  28. method: 'POST',
  29. data: { uid: uni.getStorageSync('uid') },
  30. success: (res) => {
  31. if (res.statusCode === 200 && res.data.code === 200) {
  32. uni.showToast({ title: '解绑成功', icon: 'success' })
  33. setTimeout(() => uni.navigateBack(), 1000)
  34. } else {
  35. uni.showToast({ title: res.data.message || '解绑失败', icon: 'none' })
  36. }
  37. }
  38. })
  39. }
  40. }
  41. })
  42. }
  43. }
  44. }
  45. </script>
  46. <style scoped>
  47. .unbind-wechat-container {
  48. min-height: 100vh;
  49. background: #f7f8fa;
  50. padding: 40rpx 0;
  51. display: flex;
  52. flex-direction: column;
  53. align-items: center;
  54. }
  55. .header {
  56. text-align: center;
  57. font-size: 36rpx;
  58. font-weight: bold;
  59. margin-bottom: 40rpx;
  60. background: #fff;
  61. padding: 32rpx 0;
  62. width: 100%;
  63. }
  64. .desc {
  65. font-size: 28rpx;
  66. color: #333;
  67. margin: 60rpx 0 40rpx 0;
  68. text-align: center;
  69. padding: 0 32rpx;
  70. }
  71. .submit-btn {
  72. width: 80%;
  73. background: #e74c3c;
  74. color: #fff;
  75. border-radius: 12rpx;
  76. font-size: 32rpx;
  77. margin-top: 16rpx;
  78. height: 80rpx;
  79. }
  80. </style>