<template>
  <view class="container safe-area-inset-bottom">
    <MessageNotification />
    <view class="none">
      <!-- 授权登录 -->
      <view class="conter">
        <view class="title">
          欢迎登录
        </view>
        <image src="@/static/empty/login.png" mode="aspectFit"></image>

        <!-- 修改点1：移除 disabled 属性和 bg 样式判断，使其始终可点击且显示激活颜色 -->
        <button class="btn" @click="handleLoginClick">一键登录</button>

        <view class="word">
          <u-icon size="35" :color="form['check']?'#2979FF':'#E5E5E5'" name="checkmark-circle-fill"
                  @click="form['check']=!form['check']"></u-icon>
          <view class="agreement">
            我已阅读并同意
            <text @click="getInfo(1)">《用户服务协议》</text>
            和
            <text @click="getInfo(2)">《隐私政策》</text>
          </view>
        </view>
        <view class="text" @click="back">取消登录</view>
      </view>
    </view>

    <!-- 原有的协议内容展示弹窗 -->
    <!-- 修复：添加 z-index 属性，确保协议详情弹窗层级高于确认弹窗(确认弹窗默认z-index较低) -->
    <u-popup v-model="show" :safe-area-inset-bottom="true" mode="bottom" height="88%" border-radius="20"
             :closeable="true" z-index="20000">
      <view class="agreen">
        <u-parse :html="content"></u-parse>
      </view>
    </u-popup>

    <!-- 修改点2：新增未勾选协议时的确认模态框 -->
    <!-- 确认弹窗 z-index 保持默认或稍低，确保详情弹窗能覆盖它 -->
    <u-popup v-model="showConfirm" mode="center" border-radius="24" width="600" z-index="10075">
      <view class="confirm-modal">
        <view class="confirm-title">服务协议和隐私政策</view>
        <view class="confirm-desc">
          请您在使用前仔细阅读并同意
          <text class="link" @click="getInfo(1)">《用户服务协议》</text>
          和
          <text class="link" @click="getInfo(2)">《隐私政策》</text>
          。
        </view>
        <view class="confirm-footer">
          <button class="cancel-btn" @click="showConfirm = false">不同意</button>
          <button class="agree-btn" @click="agreeAndLogin">同意并登录</button>
        </view>
      </view>
    </u-popup>

    <u-toast ref="uToast" />
  </view>
</template>

<script>
import {
  getAgreem,
  getLogin,
  getsLogin, storeChange
} from '../../request/api/api.js'
import {bindUserApi} from "@/request/api/salesperson";
import { clearGuestMode, getRedirectInfo, clearRedirectInfo, buildUrlWithParams } from '@/common/utils/auth.js';
import { performLogin } from '@/utils/login.js';

export default {
  data() {
    return {
      code: "",
      form: {
        check: false
      },
      encryptedData: "",
      iv: "",
      session_key: "",
      show: false,
      showConfirm: false, // 控制确认弹窗显示
      content: ``,
      type: 1,
      id: 1,
      isShow_envVersion: uni.getStorageSync('isShow_envVersion')
    }
  },
  onLoad(e) {
    this.type = e.type
    this.id = e.id
    uni.removeStorageSync('token')
    uni.removeStorageSync('userinfo')
  },
  created() {

  },
  methods: {
    back() {
      uni.reLaunch({
        url: "/pages/home/home",
        fail: (e) => {
          // console.log(e);
        },
        success() {
        }
      })
    },

    // 修改点3：处理登录点击逻辑
    handleLoginClick() {
      if (!this.form.check) {
        // 如果未勾选，显示确认弹窗
        this.showConfirm = true;
      } else {
        // 如果已勾选，直接登录
        this.getToLogin();
      }
    },

    // 修改点4：同意协议并登录
    agreeAndLogin() {
      this.form.check = true; // 勾选协议
      this.showConfirm = false; // 关闭弹窗
      this.getToLogin(); // 执行登录
    },

    getPhoneNumber(e) {
      uni.loading({
        title: "加载中"
      });

      setTimeout(function () {
        uni.hideLoading();
      }, 800)
      return;
    },

    toLogon() {
      uni.navigateTo({
        url: '/pages/login/logon',
        fail: function(res) {
          // console.log(res);
        }
      })
    },

    // 协议
    getInfo(e) {
      this.show = true

      getAgreem({
        method: "post",
        data: {
          end: 1,
          store_id: uni.getStorageSync('store_id') || '11001',
        }
      }).then((res) => {
        if (e == 1) {
          this.content = res.data.data[0].content
        } else {
          this.content = res.data.data[1].content
        }
      })
    },

    async getToLogin(e) {
      // 使用抽离的登录函数，非静默模式（显示提示，执行跳转）
      const result = await performLogin({
        silent: false,
        toastRef: this.$refs.uToast
      });

      // 登录成功后的处理已在 performLogin 中完成
      // 这里可以添加额外的处理逻辑（如果需要）
    },
  },
  mounted() {
    const token = uni.getStorageSync('token')
    const user_id = uni.getStorageSync('user_id')
    const userInfo = uni.getStorageSync('userinfo')
    const token_h5 = uni.getStorageSync('token_h5')
    if (token && user_id && userInfo && token_h5) {
      uni.reLaunch({
        url: "/pages/home/home",
      })
    } else {
      uni.removeStorageSync('token')
      uni.removeStorageSync('user_id')
    }
  }
}
</script>

<style lang="scss" scoped>
.text {
  margin-top: 20rpx;
  color: #666;
}
.container {
  width: 100vw;
  height: 100vh;
  padding-bottom: env(safe-area-inset-bottom);

  .none {
    width: 750rpx;
    padding-top: 100rpx;
    background: linear-gradient(180deg, #EAF2FF 0%, #FFFFFF 100%);

    .conter {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin: 0rpx auto 380rpx;

      image {
        width: 431rpx;
        height: 339rpx;
        vertical-align: middle;
        margin-bottom: 110rpx;
      }

      .title {
        font-size: 48rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        color: #232323;
        margin-bottom: 114rpx;
      }

      .word {
        display: flex;
        flex-direction: row;
        color: #475569;
        font-size: 28rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        margin-top: 34rpx;

        .agreement {
          font-size: 24rpx;
          font-family: PingFang SC-Regular, PingFang SC;
          font-weight: 400;
          color: #6C7380;
          margin-left: 16rpx;

          text {
            color: #2979FF;
            size: 24rpx;
          }
        }
      }

      .footer {
        width: 710rpx;
        height: 90rpx;
        line-height: 90rpx;
        position: fixed;
        bottom: 60rpx;
        left: 0;
        text-align: center;
        font-size: 26rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        color: #232323;
        margin: 0 auto;
      }

      .btn {
        width: 648rpx;
        height: 88rpx;
        background: #4175EE;
        line-height: 88rpx;
        font-size: 32rpx;
        text-align: center;
        font-family: PingFang SC-Medium, PingFang SC;
        font-weight: 400;
        color: #FFFFFF;
        border-radius: 64rpx;
      }

      // 移除了 .bg 样式，因为现在按钮始终是激活颜色
    }

  }

  .agreen {
    padding: 60rpx 50rpx 20rpx;
  }

  // 确认弹窗样式
  .confirm-modal {
    padding: 40rpx 30rpx;
    background: #fff;

    .confirm-title {
      font-size: 34rpx;
      font-weight: bold;
      color: #333;
      text-align: center;
      margin-bottom: 30rpx;
    }

    .confirm-desc {
      font-size: 28rpx;
      color: #666;
      line-height: 1.6;
      margin-bottom: 40rpx;
      text-align: center;

      .link {
        color: #2979FF;
      }
    }

    .confirm-footer {
      display: flex;
      justify-content: space-between;
      gap: 20rpx;

      button {
        flex: 1;
        height: 80rpx;
        line-height: 80rpx;
        border-radius: 40rpx;
        font-size: 30rpx;
        border: none;

        &::after {
          border: none;
        }
      }

      .cancel-btn {
        background: #F5F7FA;
        color: #909399;
      }

      .agree-btn {
        background: #4175EE;
        color: #FFFFFF;
      }
    }
  }
}
</style>
