feat: 登录页

src/pages.json

@@ -9,6 +9,14 @@
       }
     },
     {
+      "path": "pages/index/login",
+      "style": {
+        "navigationBarTitleText": "登录",
+        "navigationStyle": "custom",
+        "navigationBarTextStyle": "white"
+      }
+    },
+    {
       "path": "pages/food/restaurant/index",
       "style": {
         "navigationBarTitleText": "美食首页"
@@ -28,13 +36,6 @@
       }
     },
     {
-      "path": "pages/food/submit-order-remark/index",
-      "style": {
-        "navigationBarTitleText": "备注"
-      }
-    },
-
-    {
       "path": "pages/common/textarea-page/index",
       "style": {
         "navigationBarTitleText": ""

src/pages/index/login.vue

@@ -0,0 +1,72 @@
+<template>
+  <view class="content">
+    <image class="logo" src="/static/img/logo.png"></image>
+    <image class="login-bc" src="/static/img/login_bc.png"></image>
+    <text class="welcome">您好，欢迎登录逍遥游</text>
+    <button
+      class="btn"
+      type="primary"
+      open-type="getPhoneNumber"
+      @getPhoneNumber="getPhoneNumber"
+    >
+      手机号快捷登录
+    </button>
+  </view>
+</template>
+
+<script setup>
+function getPhoneNumber(e) {
+  console.log(e.detail.code);
+  if (e.detail.errMsg === 'getPhoneNumber:ok') {
+    wx.request({
+      url: `${import.meta.env.VITE_API_BASE_URL}/xxx`, // 后端接口地址
+      method: 'POST',
+      data: {
+        code: e.detail.code,
+      },
+      success: function (res) {
+        console.log('手机号:', res.data.phoneNumber);
+      },
+    });
+  } else {
+    console.error('获取手机号失败');
+  }
+}
+</script>
+
+<style>
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.welcome {
+  margin-top: 7%;
+  margin-bottom: 4%;
+}
+
+.logo {
+  height: 44px;
+  width: 80px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 4.5%;
+}
+
+.login-bc {
+  width: 280px;
+  height: 215px;
+}
+
+.btn {
+  width: 296px;
+  height: 48px;
+  line-height: 48px;
+  background: #fd9a00;
+  border-radius: 27px 27px 27px 27px;
+  box-shadow: 1px 2px 8px 0px #fd9a00;
+}
+</style>