登录界面的修正

pages/login/login.vue

@@ -6,7 +6,7 @@
     <view class="imgbox">
       <image src="https://api.ccttiot.com/smartmeter/img/static/uGPwljIaEppyKAT1iQaW" mode=""></image>
     </view>
-		<button class="button" :disabled="!hasAgreed" :class="{ 'button-disabled': !hasAgreed }" @click="getPhoneNumber"   >
+    <button class="button" @click="getPhoneNumber">
       授权登录
     </button>
     <view class="tip">
@@ -31,6 +31,7 @@
           <rich-text :nodes="serviceTermsContent"></rich-text>
         </scroll-view>
         <view class="popup-footer">
+          <text class="popup-tip">请仔细阅读服务条款，阅读完毕后点击同意</text>
           <button class="popup-btn" @click="agreeServiceTerms">同意</button>
         </view>
       </view>
@@ -47,6 +48,7 @@
           <rich-text :nodes="privacyPolicyContent"></rich-text>
         </scroll-view>
         <view class="popup-footer">
+          <text class="popup-tip">请仔细阅读隐私政策，阅读完毕后点击同意</text>
           <button class="popup-btn" @click="agreePrivacyPolicy">同意</button>
         </view>
       </view>
@@ -60,7 +62,7 @@ import { wxLogin } from "@/api/auth/auth.js";
 import { forceHideLoading, AutoLoadingManager } from "@/utils/request.js";
 import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
 
-	export default {
+export default {
   data() {
     return {
       bgc: {
@@ -162,16 +164,30 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
       this.showPrivacyPolicyPopup = false;
     },
     // 同意服务条款
-			agreeServiceTerms() {
+    async agreeServiceTerms() {
       this.hasReadServiceTerms = true;
       this.closeServiceTermsPopup();
       this.checkAgreementStatus();
+
+      // 如果隐私政策还未阅读，自动显示隐私政策
+      if (!this.hasReadPrivacyPolicy) {
+        setTimeout(() => {
+          this.showPrivacyPolicy();
+        }, 500); // 延迟500ms，让用户看到服务条款已同意
+      }
     },
     // 同意隐私政策
-			agreePrivacyPolicy() {
+    async agreePrivacyPolicy() {
       this.hasReadPrivacyPolicy = true;
       this.closePrivacyPolicyPopup();
       this.checkAgreementStatus();
+
+      // 如果服务条款还未阅读，自动显示服务条款
+      if (!this.hasReadServiceTerms) {
+        setTimeout(() => {
+          this.showServiceTerms();
+        }, 500); // 延迟500ms，让用户看到隐私政策已同意
+      }
     },
     // 检查同意状态
     checkAgreementStatus() {
@@ -180,13 +196,32 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
         this.hasAgreed = true;
       }
     },
+
+    // 显示未阅读的条款
+    async showUnreadTerms() {
+      // 如果服务条款未阅读，先显示服务条款
+      if (!this.hasReadServiceTerms) {
+        await this.showServiceTerms();
+        return;
+      }
+
+      // 如果隐私政策未阅读，显示隐私政策
+      if (!this.hasReadPrivacyPolicy) {
+        await this.showPrivacyPolicy();
+        return;
+      }
+    },
     getPhoneNumber() {
-				// 检查是否同意条款
+      // 检查是否已阅读条款
-				if (!this.hasAgreed) {
+      if (!this.hasReadServiceTerms || !this.hasReadPrivacyPolicy) {
         uni.showToast({
-						title: '请先同意服务条款和隐私政策',
+          title: '请先阅读服务条款和隐私政策',
-						icon: 'none'
+          icon: 'none',
+          duration: 2000
         });
+
+        // 自动弹出未阅读的条款
+        this.showUnreadTerms();
         return;
       }
 
@@ -267,18 +302,18 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
       navigateToPage('index');
     },
   }
-	}
+}
 </script>
 
 <style lang="scss" >
-	page{
+page{
   background: #FFFFFF;
-	}
+}
-	.page {
+.page {
   position: relative; /* 添加相对定位 */
-	}
+}
 
-	.imgbox {
+.imgbox {
   margin:102rpx auto ;
   width: 730rpx;
   height: 422rpx;
@@ -288,8 +323,8 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
     width: 730rpx;
     height: 422rpx;
   }
-	}
+}
-	.button{
+.button{
   margin-top: 200rpx;
   width: 586rpx;
   height: 90rpx;
@@ -298,12 +333,9 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
   font-weight: 500;
   font-size: 40rpx;
   color: #FFFFFF;
-	}
+}
-	.button-disabled {
+
-		background: #CCCCCC !important;
+.tip{
-		color: #999999 !important;
-	}
-	.tip{
   margin-top:128rpx ;
   display: flex;
   flex-wrap: nowrap;
@@ -316,17 +348,17 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
     color: #4C97E7;
     text-decoration: underline;
   }
-	}
+}
 
-	/* 自定义勾选按钮样式 */
+/* 自定义勾选按钮样式 */
-	.checkbox-container {
+.checkbox-container {
   display: flex;
   align-items: center;
   margin-right: 10rpx;
   cursor: pointer;
-	}
+}
 
-	.checkbox {
+.checkbox {
   width: 26rpx;
   height: 26rpx;
   border: 2rpx solid #CCCCCC;
@@ -336,67 +368,76 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
   justify-content: center;
   background-color: #FFFFFF;
   transition: all 0.3s ease;
-	}
+}
 
-	.checkbox.checked {
+.checkbox.checked {
   background-color: #4C97E7;
   border-color: #4C97E7;
-	}
+}
 
-	.checkmark {
+.checkmark {
   color: #FFFFFF;
   font-size: 16rpx;
   font-weight: bold;
   line-height: 1;
-	}
+}
 
-	/* 弹窗样式 */
+/* 弹窗样式 */
-	.popup-content {
+.popup-content {
   background: #fff;
   border-radius: 20rpx;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   height: 100%;
-	}
+}
 
-	.popup-header {
+.popup-header {
   padding: 30rpx;
   border-bottom: 1rpx solid #eee;
   display: flex;
   justify-content: space-between;
   align-items: center;
   background: #f8f8f8;
-	}
+}
 
-	.popup-title {
+.popup-title {
   font-size: 32rpx;
   font-weight: bold;
   color: #333;
-	}
+}
 
-	.popup-close {
+.popup-close {
   font-size: 40rpx;
   color: #999;
   cursor: pointer;
   padding: 10rpx;
-	}
+}
 
-	.popup-body {
+.popup-body {
   flex: 1;
   padding: 30rpx;
   line-height: 1.6;
   font-size: 28rpx;
   color: #333;
-	}
+}
 
-	.popup-footer {
+.popup-footer {
   padding: 30rpx;
   border-top: 1rpx solid #eee;
   background: #f8f8f8;
-	}
+}
 
-	.popup-btn {
+.popup-tip {
+  display: block;
+  font-size: 24rpx;
+  color: #666;
+  text-align: center;
+  margin-bottom: 20rpx;
+  line-height: 1.4;
+}
+
+.popup-btn {
   width: 100%;
   height: 80rpx;
   background: #4C97E7;
@@ -405,5 +446,5 @@ import { getServiceTerms, getPrivacyPolicy } from "@/api/article/article.js";
   border-radius: 40rpx;
   font-size: 30rpx;
   font-weight: 500;
-	}
+}
 </style>