baize 1 year ago
parent
commit
70ae98efe8
2 changed files with 89 additions and 5 deletions
  1. 41 0
      src/components/userAgreement/userAgreement.vue
  2. 48 5
      src/pages/login/index.vue

+ 41 - 0
src/components/userAgreement/userAgreement.vue

@@ -0,0 +1,41 @@
+<template>
+  <view>
+    <u-modal :title="title" :show="show" @confirm="handleConfirm" width="500rpx">
+      <view>
+        <!-- 占位 -->
+        <slot></slot>
+      </view>
+    </u-modal>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'userAgreement',
+  props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
+    title: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {};
+  },
+
+  //组件挂载时触发
+  mounted() {
+    console.log(8888); //看看有没有触发本组件
+  },
+
+  methods: {
+    //点击弹框内确认
+    handleConfirm() {
+      this.$emit('handleConfirm');
+    },
+  },
+};
+</script>

+ 48 - 5
src/pages/login/index.vue

@@ -25,7 +25,7 @@
       <view @click="showPrivacyPolicy">《隐私政策》</view>
     </view>
 
-    <u-modal
+    <!-- <u-modal
       :show="show"
       content="请阅读并勾选用户协议"
       @confirm="confirmUserAgreement"
@@ -43,16 +43,37 @@
         隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容隐私政策的内容
       </view>
       <u-button shape="circle" @click="closePrivacyPolicyDialog">X</u-button>
-    </u-modal>
+    </u-modal> -->
+
+    <userAgreement v-if="show" :title="title" :show="show" @handleConfirm="handleConfirm">
+      <!-- 如果点击的是用户协议 -->
+      <view v-if="isUserAgreement">
+        <p>1.1246461456</p>
+        <p>1.1246461456</p>
+        <p>1.1246461456</p>
+      </view>
+      <!-- 否则 也就是点击隐私政策 -->
+      <view v-else>
+        <p>8888888888</p>
+        <p>8888888888</p>
+        <p>8888888888</p>
+        <p>8888888888</p>
+        <p>8888888888</p>
+      </view>
+    </userAgreement>
   </view>
 </template>
 
 <script>
 import { getWxLoginCode } from '@/api/login.js';
-
+import userAgreement from '@/components/userAgreement/userAgreement.vue';
 export default {
+  components: {
+    userAgreement,
+  },
   data() {
     return {
+      isUserAgreement: false,
       loading: false,
       form: {
         client_id: 'chelvc_client',
@@ -61,6 +82,7 @@ export default {
         token: '',
       },
       checked: [],
+      title: '',
       show: false, // 添加show数据属性,并初始化为false
       showUserAgreementDialog: false,
       showPrivacyPolicyDialog: false,
@@ -79,11 +101,32 @@ export default {
       // 在确认按钮点击后执行页面跳转的代码
       this.$Router.back();
     },
+
+    // showUserAgreement() {
+    //   this.showUserAgreementDialog = true;
+    // },
+
+    //点击用户协议
     showUserAgreement() {
-      this.showUserAgreementDialog = true;
+      this.isUserAgreement = true;
+      this.show = true; //打开弹框
+      this.title = '用户协议'; //赋值标题
+    },
+
+    //点击用户协议弹框内的确定
+    handleConfirm() {
+      console.log(222);
+      this.show = false; //关闭弹框
     },
+
+    // showPrivacyPolicy() {
+    //   this.showPrivacyPolicyDialog = true;
+    // },
+
     showPrivacyPolicy() {
-      this.showPrivacyPolicyDialog = true;
+      this.isUserAgreement = false;
+      this.show = true; //打开弹框
+      this.title = '隐私政策'; //赋值标题
     },
 
     //点击微信用户一键登录