feat: 调整项目结构

src/pages/login/index.vue

@@ -0,0 +1,160 @@
+<template>
+  <view class="login-wrapper" :style="{ backgroundImage: `url(${loginBg})` }">
+    <!-- 返回按钮 -->
+    <view class="back-btn" @click="goBack">
+      <uni-icons fontFamily="znicons" size="24" color="#333">
+        {{ zniconsMap["zn-nav-arrow-left"] }}
+      </uni-icons>
+    </view>
+
+    <!-- 头部内容 -->
+    <view class="login-header">
+      <!-- 卡通形象 -->
+      <image class="login-avatar" :src="logo" mode="widthFix"></image>
+      <image class="login-title" :src="subLogo" mode="widthFix"></image>
+
+      <!-- 描述 -->
+      <view class="login-desc">{{ loginDesc }}</view>
+    </view>
+
+    <!-- 按钮区域 -->
+    <view class="login-btn-area">
+      <!-- 同意隐私协议并获取手机号按钮 -->
+
+      <button
+        v-if="!isAgree"
+        class="login-btn"
+        type="primary"
+        @click="handleAgreeAndGetPhone"
+      >
+        微信一键登录
+      </button>
+      <button
+        v-if="isAgree"
+        class="login-btn"
+        open-type="getPhoneNumber"
+        type="primary"
+        @getphonenumber="getPhoneNumber"
+      >
+        微信一键登录
+      </button>
+    </view>
+
+    <!-- 协议勾选 -->
+    <view class="login-agreement">
+      <CheckBox v-model="isAgree">
+        <text class="login-agreement-text">阅读并同意</text>
+        <text
+          class="login-agreement-link"
+          @click.stop="handleAgreeClick('service')"
+          >《服务协议》</text
+        >
+        <text class="login-agreement-text">和</text>
+        <text
+          class="login-agreement-link"
+          @click.stop="handleAgreeClick('privacy')"
+          >《隐私协议》</text
+        >
+      </CheckBox>
+    </view>
+
+    <AgreePopup
+      ref="agreePopup"
+      :visible="visible"
+      :agreement="computedAgreement"
+      @close="visible = false"
+    />
+  </view>
+</template>
+
+<script setup>
+import { ref, computed } from "vue";
+import {
+  getServiceAgreement,
+  getPrivacyAgreement,
+} from "@/request/api/LoginApi";
+import { onLogin, goBack } from "@/hooks/useGoLogin";
+import loginBg from "./images/bg.png";
+import CheckBox from "@/components/CheckBox/index.vue";
+import AgreePopup from "./components/AgreePopup/index.vue";
+import { zniconsMap } from "@/static/fonts/znicons.js";
+import { getCurrentConfig } from "@/constant/base";
+
+const isAgree = ref(false);
+const visible = ref(false);
+const serviceAgreement = ref("");
+const privacyAgreement = ref("");
+// 协议类型
+const AgreeType = ref("service");
+const logo = computed(() => getCurrentConfig().logo);
+const subLogo = computed(() => getCurrentConfig().subLogo);
+const loginDesc = computed(() => getCurrentConfig().loginDesc);
+const clientId = computed(() => getCurrentConfig().clientId);
+
+// 同意隐私协议并获取手机号
+const handleAgreeAndGetPhone = () => {
+  if (!isAgree.value) {
+    uni.showToast({
+      title: "请先同意服务协议和隐私协议",
+      icon: "none",
+    });
+    return;
+  }
+};
+
+const getPhoneNumber = (e) => {
+  onLogin(e)
+    .then(() => {
+      uni.showToast({
+        title: "登录成功",
+        icon: "success",
+      });
+      goBack();
+    })
+    .catch(() => {
+      uni.showToast({
+        title: "登录失败",
+        icon: "none",
+      });
+    });
+};
+
+// 处理同意协议点击事件
+const handleAgreeClick = (type) => {
+  visible.value = true;
+  AgreeType.value = type;
+};
+
+// 计算协议类型
+const computedAgreement = computed(() => {
+  if (AgreeType.value === "service") {
+    return serviceAgreement.value;
+  } else {
+    return privacyAgreement.value;
+  }
+});
+
+// 获取服务协议数据
+const getServiceAgreementData = async () => {
+  const { data } = await getServiceAgreement();
+  serviceAgreement.value = data;
+};
+
+getServiceAgreementData();
+
+// 获取隐私协议数据
+const getPrivacyAgreementData = async () => {
+  const { data } = await getPrivacyAgreement();
+  privacyAgreement.value = data;
+};
+
+getPrivacyAgreementData();
+</script>
+
+<style lang="scss" scoped>
+@use "./styles/index.scss";
+@font-face {
+  font-family: znicons;
+  src: url("@/static/fonts/znicons.ttf");
+}
+</style>