代理商申请实现信息提交提示，和协议自动弹窗

pages.json

@@ -1,17 +1,17 @@
 {
   "pages": [
-    {
+		{
-      "path": "pages/index/index",
+			"path": "pages/index/index",
-      "style": {
+			"style": {
         "navigationBarTitleText": "设备租赁",
         "navigationStyle": "custom"
-      }
+			}
-    },
+		},
-    {
+		{
-      "path": "pages/login/login",
+			"path": "pages/login/login",
-      "style": {
+			"style": {
-        "navigationStyle": "custom"
+				"navigationStyle": "custom"
-      }
+			}
     },
     {
       "path": "pages/lease/lease",
@@ -80,8 +80,8 @@
       "style": {
         "navigationStyle": "custom"
       }
-    }
+		}
-  ],
+	],
   "tabBar": {
     "color": "#999999",
     "selectedColor": "#ff6b6b",
@@ -107,11 +107,11 @@
       }
     ]
   },
-  "globalStyle": {
+	"globalStyle": {
-    "navigationBarTextStyle": "black",
+		"navigationBarTextStyle": "black",
     "navigationBarTitleText": "设备租赁",
     "navigationBarBackgroundColor": "#fff"
-  },
+	},
   "uniIdRouter": {},
   "mp-weixin": {
     "requiredPrivateInfos": [

pages/agents/agents.vue

@@ -58,9 +58,9 @@
               @change="onProvinceChange"
             >
               <view class="picker-display">
-                <text class="picker-text">{{
+                <text class="picker-text"
-                  selectedProvince ? selectedProvince.name : '请选择省份'
+                  >{{ selectedProvince ? selectedProvince.name : '请选择省份' }}
-                }}</text>
+                </text>
                 <text class="picker-arrow">▼</text>
               </view>
             </picker>
@@ -76,9 +76,9 @@
               @change="onCityChange"
             >
               <view class="picker-display">
-                <text class="picker-text">{{
+                <text class="picker-text"
-                  selectedCity ? selectedCity.name : '请选择城市'
+                  >{{ selectedCity ? selectedCity.name : '请选择城市' }}
-                }}</text>
+                </text>
                 <text class="picker-arrow">▼</text>
               </view>
             </picker>
@@ -94,9 +94,9 @@
               @change="onDistrictChange"
             >
               <view class="picker-display">
-                <text class="picker-text">{{
+                <text class="picker-text"
-                  selectedDistrict ? selectedDistrict.name : '请选择区县'
+                  >{{ selectedDistrict ? selectedDistrict.name : '请选择区县' }}
-                }}</text>
+                </text>
                 <text class="picker-arrow">▼</text>
               </view>
             </picker>
@@ -159,7 +159,19 @@
           <rich-text :nodes="agreementContent"></rich-text>
         </scroll-view>
         <view class="agreement-modal-footer">
-          <button class="agreement-modal-btn" @click="hideAgreement">我知道了</button>
+          <view class="agreement-modal-checkbox" @click="toggleAgreement">
+            <view :class="{ checked: formData.agreed }" class="modal-checkbox">
+              <text v-if="formData.agreed" class="checkmark">✓</text>
+            </view>
+            <text class="modal-checkbox-text">我已阅读并同意《代理商协议》</text>
+          </view>
+          <button
+            :class="{ disabled: !formData.agreed }"
+            class="agreement-modal-btn"
+            @click="hideAgreement"
+          >
+            {{ formData.agreed ? '确定' : '请先同意协议' }}
+          </button>
         </view>
       </view>
     </view>
@@ -179,12 +191,11 @@ export default {
     },
     canSubmit() {
       return (
-        this.formData.name &&
+        // this.formData.name &&
-        this.formData.phone &&
+        // this.formData.phone &&
-        this.formData.idCard &&
+        // this.formData.idCard &&
-        this.selectedDistrict && // 必须选择到区县级别
+        // this.selectedDistrict && // 必须选择到区县级别
-        this.formData.detailAddress &&
+        // this.formData.detailAddress &&
-        this.formData.agreed &&
         !this.submitting
       )
     },
@@ -195,18 +206,21 @@ export default {
     this.loadAgreement()
     this.loadRegionTreeData()
 
+    // 重置协议同意状态，用于测试协议弹窗功能
+    this.formData.agreed = false
+
     // 添加测试数据
     console.log('页面加载完成，三级选择器已初始化')
   },
   data() {
     return {
       formData: {
-        name: '张珊珊',
+        name: '',
         phone: '',
         idCard: '',
         serviceArea: '',
-        detailAddress: '太姥山镇秦屿大道2号',
+        detailAddress: '',
-        agreed: true,
+        agreed: false,
       },
       submitting: false,
       serviceAreas: [],
@@ -384,6 +398,16 @@ export default {
 
     // 提交申请
     async submitApplication() {
+      // 检查是否同意协议，如果未同意则自动弹窗
+      if (!this.formData.agreed) {
+        this.showAgreement()
+        uni.showToast({
+          title: '请先阅读并同意代理商协议',
+          icon: 'none',
+        })
+        return
+      }
+
       if (!this.validateForm()) {
         return
       }
@@ -827,6 +851,39 @@ export default {
   border-top: 1rpx solid #e8e8e8;
   background: #f8f8f8;
 
+  .agreement-modal-checkbox {
+    display: flex;
+    align-items: center;
+    margin-bottom: 20rpx;
+
+    .modal-checkbox {
+      width: 32rpx;
+      height: 32rpx;
+      border: 2rpx solid #ff6b6b;
+      border-radius: 6rpx;
+      margin-right: 10rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: #ffffff;
+
+      &.checked {
+        background: #f15a04;
+      }
+
+      .checkmark {
+        color: #ffffff;
+        font-size: 20rpx;
+        font-weight: bold;
+      }
+    }
+
+    .modal-checkbox-text {
+      font-size: 26rpx;
+      color: #666;
+    }
+  }
+
   .agreement-modal-btn {
     width: 100%;
     height: 80rpx;
@@ -843,6 +900,16 @@ export default {
     &:active {
       transform: scale(0.98);
     }
+
+    &.disabled {
+      background: #cccccc;
+      color: #999999;
+      cursor: not-allowed;
+
+      &:active {
+        transform: none;
+      }
+    }
   }
 }