对接uniapp端登录[C

2025-03-27 16:01:29 +08:00
parent aa59dd79c1
commit 2b674966fe
15 changed files with 381 additions and 140 deletions
--- a/Cunkebao/pages/agreement/privacy.vue
+++ b/Cunkebao/pages/agreement/privacy.vue
@@ -6,13 +6,13 @@
    ></u-navbar>
    
    <view class="content">
-      <view class="title">村客宝隐私政策</view>
+      <view class="title">存客宝隐私政策</view>
      <view class="date">生效日期：2023年1月1日</view>
      
      <view class="section">
        <view class="section-title">一、引言</view>
        <view class="paragraph">
-          村客宝（以下简称"我们"）非常重视您的隐私和个人信息保护。本隐私政策旨在向您说明我们如何收集、使用、存储、共享和保护您的个人信息，以及您享有的相关权利。
+          存客宝（以下简称"我们"）非常重视您的隐私和个人信息保护。本隐私政策旨在向您说明我们如何收集、使用、存储、共享和保护您的个人信息，以及您享有的相关权利。
        </view>
        <view class="paragraph">
          请您在使用我们的服务前，仔细阅读并了解本隐私政策的全部内容。如您对本隐私政策有任何疑问，可随时联系我们的客服。
--- a/Cunkebao/pages/agreement/user.vue
+++ b/Cunkebao/pages/agreement/user.vue
@@ -6,26 +6,26 @@
    ></u-navbar>
    
    <view class="content">
-      <view class="title">村客宝用户协议</view>
+      <view class="title">存客宝用户协议</view>
      <view class="date">生效日期：2023年1月1日</view>
      
      <view class="section">
-        <view class="section-title">一、总则</view>
+        <view class="section-title">一、协议的接受与变更</view>
        <view class="paragraph">
-          1.1 村客宝用户协议（以下简称"本协议"）是您与村客宝平台（以下简称"我们"）之间就村客宝平台服务等相关事宜所订立的契约。
+          1.1 存客宝用户协议（以下简称"本协议"）是您与存客宝平台（以下简称"我们"）之间就存客宝平台服务等相关事宜所订立的契约。
        </view>
        <view class="paragraph">
-          1.2 您应当在使用村客宝平台服务之前认真阅读本协议全部内容。如您对本协议有任何疑问，可随时咨询我们的客服。
+          1.2 您应当在使用存客宝平台服务之前认真阅读本协议全部内容。如您对本协议有任何疑问，可随时咨询我们的客服。
        </view>
        <view class="paragraph">
-          1.3 您点击"同意"或"下一步"，或您使用村客宝平台服务，即视为您已阅读并同意签署本协议。本协议自您确认同意之时起生效。
+          1.3 您点击"同意"或"下一步"，或您使用存客宝平台服务，即视为您已阅读并同意签署本协议。本协议自您确认同意之时起生效。
        </view>
      </view>
      
      <view class="section">
        <view class="section-title">二、账号注册与使用</view>
        <view class="paragraph">
-          2.1 您应当保证您具有完全民事行为能力，能够独立承担民事责任，并独立承担使用村客宝平台服务的一切法律责任。
+          2.1 您应当保证您具有完全民事行为能力，能够独立承担民事责任，并独立承担使用存客宝平台服务的一切法律责任。
        </view>
        <view class="paragraph">
          2.2 您注册成功后，我们将给予您一个用户账号及相应的密码，该用户账号和密码由您负责保管。
@@ -38,7 +38,7 @@
      <view class="section">
        <view class="section-title">三、服务内容</view>
        <view class="paragraph">
-          3.1 村客宝平台服务的具体内容由我们根据实际情况提供，包括但不限于信息发布、交易撮合、数据统计等。
+          3.1 存客宝平台服务的具体内容由我们根据实际情况提供，包括但不限于信息发布、交易撮合、数据统计等。
        </view>
        <view class="paragraph">
          3.2 我们有权不经事先通知，随时变更、中断或终止部分或全部的服务。
@@ -46,19 +46,19 @@
      </view>
      
      <view class="section">
-        <view class="section-title">四、用户义务</view>
+        <view class="section-title">四、用户行为规范</view>
        <view class="paragraph">
-          4.1 您在使用村客宝平台服务时，必须遵守中华人民共和国相关法律法规。
+          4.1 您在使用存客宝平台服务时，必须遵守中华人民共和国相关法律法规。
        </view>
        <view class="paragraph">
-          4.2 您不得利用村客宝平台服务从事违法违规行为，包括但不限于发布违法信息、侵犯他人知识产权等。
+          4.2 您不得利用存客宝平台服务从事违法违规行为，包括但不限于发布违法信息、侵犯他人知识产权等。
        </view>
      </view>
      
      <view class="section">
        <view class="section-title">五、知识产权</view>
        <view class="paragraph">
-          5.1 村客宝平台所包含的全部智力成果，包括但不限于程序、源代码、图标、图饰、图像、图表、文字等，均受著作权法、商标法、专利法及其他知识产权法律法规的保护。
+          5.1 存客宝平台所包含的全部智力成果，包括但不限于程序、源代码、图标、图饰、图像、图表、文字等，均受著作权法、商标法、专利法及其他知识产权法律法规的保护。
        </view>
      </view>
      
@@ -78,7 +78,7 @@
          7.1 我们有权随时修改本协议，并在修改后的协议生效前通过适当方式通知您。
        </view>
        <view class="paragraph">
-          7.2 如您不同意修改后的协议，可以选择停止使用村客宝平台服务；如您继续使用村客宝平台服务，则视为您已同意修改后的协议。
+          7.2 如您不同意修改后的协议，可以选择停止使用存客宝平台服务；如您继续使用存客宝平台服务，则视为您已同意修改后的协议。
        </view>
      </view>
      
--- a/Cunkebao/pages/index/index.vue
+++ b/Cunkebao/pages/index/index.vue
@@ -100,6 +100,8 @@
 <script>
 import LineChart from '@/components/LineChart.vue'
 import CustomTabBar from '@/components/CustomTabBar.vue'
+import Auth from '@/utils/auth'
+import { getUserInfo, logout } from '@/api/user'

 export default {
  components: {
@@ -119,14 +121,42 @@ export default {
        { icon: 'coupon', color: 'yellow', count: 167, label: '海报获客' },
        { icon: 'play-right', color: 'black', count: 156, label: '抖音获客' },
        { icon: 'heart', color: 'red', count: 89, label: '小红书获客' }
-      ]
+      ],
+      userInfo: null
    }
  },
  onLoad() {
+    // 检查登录状态
+    if (!Auth.isLogin()) {
+      uni.reLaunch({
+        url: '/pages/login/index'
+      });
+      return;
+    }
+    
+    // 获取用户信息
+    this.fetchUserInfo();
+    
    // 加载数据
    this.loadData();
  },
  methods: {
+    // 获取用户信息
+    fetchUserInfo() {
+      // 先尝试从缓存获取
+      this.userInfo = Auth.getUserInfo();
+      
+      // 然后从服务器获取最新信息
+      getUserInfo().then(res => {
+        if (res.code === 200) {
+          this.userInfo = res.data;
+          Auth.setUserInfo(res.data);
+        }
+      }).catch(err => {
+        console.error('获取用户信息失败:', err);
+      });
+    },
+    
    // 加载数据
    loadData() {
      // 这里可以添加API调用获取实际数据
@@ -139,6 +169,34 @@ export default {
      uni.navigateTo({
        url: '/pages/notification/index'
      });
+    },
+    
+    // 退出登录
+    handleLogout() {
+      uni.showModal({
+        title: '提示',
+        content: '确认退出登录吗？',
+        success: (res) => {
+          if (res.confirm) {
+            // 直接清除本地保存的登录信息
+            Auth.removeAll();
+            
+            // 显示退出成功提示
+            uni.showToast({
+              title: '退出成功',
+              icon: 'success',
+              duration: 1500
+            });
+            
+            // 跳转到登录页面
+            setTimeout(() => {
+              uni.reLaunch({
+                url: '/pages/login/index'
+              });
+            }, 1500);
+          }
+        }
+      });
    }
  }
 }
@@ -174,6 +232,25 @@ export default {
    display: flex;
    color: black;
    align-items: center;
+    
+    .user-info {
+      display: flex;
+      align-items: center;
+      margin-right: 20rpx;
+      padding: 8rpx 20rpx;
+      background-color: #f5f5f5;
+      border-radius: 30rpx;
+      
+      .user-name {
+        font-size: 28rpx;
+        color: #333;
+        margin-right: 8rpx;
+      }
+    }
+    
+    .icon-bell {
+      margin-left: 10rpx;
+    }
  }
 }

--- a/Cunkebao/pages/login/index.vue
+++ b/Cunkebao/pages/login/index.vue
@@ -24,10 +24,10 @@
      <!-- 手机号输入 -->
      <view class="input-box">
        <u--input
-          v-model="form.mobile"
+          v-model="form.account"
          placeholder="+86手机号"
          prefixIcon="phone"
-          prefixIconStyle="font-size: 52rpx;color: #909399;padding-right: 16rpx;"
+          prefixIconStyle="font-size: 40rpx; color: #909399; padding-right: 16rpx;"
          clearable
          type="number"
          maxlength="11"
@@ -71,7 +71,7 @@
          fontSize="30rpx"
          suffixIcon="eye"
          @clickSuffixIcon="showPassword = !showPassword"
-          suffixIconStyle="font-size: 45rpx;"
+          suffixIconStyle="font-size: 40rpx;"
        ></u--input>
      </view>
      
@@ -101,9 +101,10 @@
      <!-- 登录按钮 -->
      <u-button
        text="登录"
-        type="primary"
+        type="info"
+        :disabled="!canLogin"
        @click="handleLogin"
-        customStyle="width: 100%; margin-top: 40rpx; height: 96rpx; border-radius: 24rpx; font-size: 32rpx; font-weight: 500;"
+        customStyle="width: 100%; margin-top: 40rpx; height: 96rpx; border-radius: 24rpx; font-size: 40rpx; font-weight: bold; background-color: #2563eb; color: #fff;"
      ></u-button>
      
      <!-- 分割线 -->
@@ -117,13 +118,13 @@
      <view class="other-login">
        <!-- 微信登录 -->
        <button class="wechat-btn" @click="handleWechatLogin">
-          <u-icon name="weixin-fill" size="56" color="#07c160" class="wechat-icon"></u-icon>
+          <u-icon name="weixin-fill" size="44" color="#07c160" class="wechat-icon"></u-icon>
          <text>使用微信登录</text>
        </button>
        
        <!-- Apple登录 -->
        <button class="apple-btn" @click="handleAppleLogin">
-          <u-icon name="apple-fill" size="56" color="#333333" class="apple-icon"></u-icon>
+          <u-icon name="apple-fill" size="44" color="#333333" class="apple-icon"></u-icon>
          <text>使用 Apple 登录</text>
        </button>
      </view>
@@ -135,6 +136,9 @@
 </template>

 <script>
+import { login, mobileLogin, sendCode } from '@/api/user'
+import Auth from '@/utils/auth'
+
 export default {
  data() {
    return {
@@ -144,9 +148,10 @@ export default {
      ],
      current: 0,
      form: {
-        mobile: '',
+        account: '',
        code: '',
-        password: ''
+        password: '',
+        typeId: 1 // 默认账号类型为运营后台/操盘手
      },
      showPassword: false,
      isAgree: false,
@@ -161,7 +166,7 @@ export default {
  },
  computed: {
    isValidMobile() {
-      return /^1\d{10}$/.test(this.form.mobile)
+      return /^1\d{10}$/.test(this.form.account)
    },
    canLogin() {
      if (!this.isAgree || !this.isValidMobile) return false
@@ -185,18 +190,48 @@ export default {
    },
    getCode() {
      if (this.sending || !this.isValidMobile) return
-      this.sending = true
-      this.codeTips = '60s'
-      let seconds = 60
-      const timer = setInterval(() => {
-        seconds--
-        this.codeTips = `${seconds}s`
-        if (seconds <= 0) {
-          clearInterval(timer)
+      
+      // 发送验证码接口调用
+      sendCode({
+        account: this.form.account,
+        type: 'login'
+      }).then(res => {
+        if (res.code === 200) {
+          // 发送成功，开始倒计时
+          this.sending = true
+          this.codeTips = '60s'
+          let seconds = 60
+          const timer = setInterval(() => {
+            seconds--
+            this.codeTips = `${seconds}s`
+            if (seconds <= 0) {
+              clearInterval(timer)
+              this.sending = false
+              this.codeTips = '发送验证码'
+            }
+          }, 1000)
+          
+          // 提示用户
+          uni.showToast({
+            title: '验证码已发送',
+            icon: 'success'
+          })
+        } else {
+          // 发送失败
+          uni.showToast({
+            title: res.msg || '验证码发送失败',
+            icon: 'none'
+          })
          this.sending = false
-          this.codeTips = '发送验证码'
        }
-      }, 1000)
+      }).catch(err => {
+        console.error('发送验证码失败:', err)
+        uni.showToast({
+          title: '验证码发送失败，请重试',
+          icon: 'none'
+        })
+        this.sending = false
+      })
    },
    handleLogin() {
      if (!this.canLogin) {
@@ -237,42 +272,69 @@ export default {
        mask: true
      })
      
-      // 模拟登录成功
-      setTimeout(() => {
+      // 根据当前登录方式选择不同的登录API
+      const loginAction = this.current === 0 ? 
+        mobileLogin({ 
+          account: this.form.account, 
+          code: this.form.code,
+          typeId: this.form.typeId
+        }) : 
+        login({ 
+          account: this.form.account, 
+          password: this.form.password,
+          typeId: this.form.typeId
+        });
+      
+      // 调用登录接口
+      loginAction.then(res => {
        // 隐藏加载提示
        uni.hideLoading()
        
-        // 保存登录状态和用户信息
-        uni.setStorageSync('token', 'mock_token_' + Date.now())
-        uni.setStorageSync('userInfo', {
-          mobile: this.form.mobile,
-          loginTime: Date.now()
-        })
-        
-        // 显示登录成功提示
-        uni.showToast({
-          title: '登录成功',
-          icon: 'success',
-          duration: 1500
-        })
-        
-        // 延迟跳转到首页
-        setTimeout(() => {
-          uni.reLaunch({
-            url: '/pages/index/index',
-            success: () => {
-              console.log('跳转到首页成功')
-            },
-            fail: (err) => {
-              console.error('跳转失败:', err)
-              uni.showToast({
-                title: '跳转失败，请重试',
-                icon: 'none'
-              })
-            }
+        if (res.code === 200) {
+          // 登录成功，保存token和用户信息
+          Auth.setToken(res.data.token, res.data.token_expired - Math.floor(Date.now() / 1000));
+          Auth.setUserInfo(res.data.member);
+          
+          // 显示登录成功提示
+          uni.showToast({
+            title: '登录成功',
+            icon: 'success',
+            duration: 1500
          })
-        }, 1500)
-      }, 1000)
+          
+          // 延迟跳转到首页
+          setTimeout(() => {
+            uni.reLaunch({
+              url: '/pages/index/index',
+              success: () => {
+                console.log('跳转到首页成功')
+              },
+              fail: (err) => {
+                console.error('跳转失败:', err)
+                uni.showToast({
+                  title: '跳转失败，请重试',
+                  icon: 'none'
+                })
+              }
+            })
+          }, 1500)
+        } else {
+          // 登录失败
+          uni.showToast({
+            title: res.msg || '登录失败',
+            icon: 'none'
+          })
+        }
+      }).catch(err => {
+        // 隐藏加载提示
+        uni.hideLoading()
+        
+        console.error('登录失败:', err)
+        uni.showToast({
+          title: '登录失败，请重试',
+          icon: 'none'
+        })
+      })
    },
    handleWechatLogin() {
      console.log('微信登录')
--- a/Cunkebao/pages/profile/index.vue
+++ b/Cunkebao/pages/profile/index.vue
@@ -12,7 +12,7 @@
    <!-- 用户信息卡片 -->
    <view class="user-card">
      <view class="avatar-wrap">
-        <template v-if="userInfo.avatar">
+        <template v-if="userInfo && userInfo.avatar">
          <image class="avatar" :src="userInfo.avatar"></image>
        </template>
        <template v-else>
@@ -22,8 +22,8 @@
        </template>
      </view>
      <view class="user-info">
-        <view class="username">卡若</view>
-        <view class="account">账号: 84675209</view>
+        <view class="username">{{ userInfo && userInfo.username ? userInfo.username : '未设置昵称' }}</view>
+        <view class="account">账号: {{ userInfo && userInfo.account ? userInfo.account : '未登录' }}</view>
        <view class="edit-profile-btn" @click="editProfile">
          编辑资料
        </view>
@@ -74,6 +74,8 @@

 <script>
 import CustomTabBar from '@/components/CustomTabBar.vue'
+import Auth from '@/utils/auth'
+import { getUserInfo, logout } from '@/api/user'

 export default {
  components: {
@@ -81,28 +83,48 @@ export default {
  },
  data() {
    return {
-      userInfo: {
-        avatar: null,
-        username: '卡若',
-        account: '84675209'
-      }
+      userInfo: null
    }
  },
+  onShow() {
+    // 每次显示页面时获取最新的用户信息
+    this.getUserInfo();
+  },
  onLoad() {
+    // 检查登录状态
+    if (!Auth.isLogin()) {
+      uni.reLaunch({
+        url: '/pages/login/index'
+      });
+      return;
+    }
+    
    // 获取用户信息
    this.getUserInfo();
  },
  methods: {
    // 获取用户信息
    getUserInfo() {
-      // 这里可以添加获取用户信息的API调用
-      console.log('获取用户信息');
-      // 示例数据，实际应从API获取
-      this.userInfo = {
-        avatar: 'https://images.unsplash.com/photo-1568602471122-7832951cc4c5?w=400&h=400&auto=format&fit=crop',
-        username: '卡若',
-        account: '84675209'
-      };
+      // 先从本地缓存获取
+      const cachedUserInfo = Auth.getUserInfo();
+      if (cachedUserInfo) {
+        this.userInfo = cachedUserInfo;
+      }
+      
+      // 同时从服务器获取最新信息
+      getUserInfo().then(res => {
+        if (res.code === 200) {
+          this.userInfo = res.data;
+          // 更新本地缓存
+          Auth.setUserInfo(res.data);
+        }
+      }).catch(err => {
+        console.error('获取用户信息失败:', err);
+        // 如果获取失败但有缓存，使用缓存数据
+        if (!this.userInfo) {
+          this.userInfo = Auth.getUserInfo();
+        }
+      });
    },
    
    // 跳转到设置页面
@@ -140,14 +162,22 @@ export default {
        content: '确定要退出登录吗？',
        success: (res) => {
          if (res.confirm) {
-            // 清除登录状态
-            // uni.removeStorageSync('token');
-            // uni.removeStorageSync('userInfo');
+            // 直接清除本地保存的登录信息
+            Auth.removeAll();
+            
+            // 显示退出成功提示
+            uni.showToast({
+              title: '退出成功',
+              icon: 'success',
+              duration: 1500
+            });
            
            // 跳转到登录页面
-            uni.reLaunch({
-              url: '/pages/login/index'
-            });
+            setTimeout(() => {
+              uni.reLaunch({
+                url: '/pages/login/index'
+              });
+            }, 1500);
          }
        }
      });
@@ -178,7 +208,9 @@ export default {
  z-index: 999;
  
  .title {
-    font-size: 40rpx;
+    font-size: 45rpx;
+    font-weight: bold;
+    color: #2664ec;
  }
  
  .header-icons {