Compare commits

..

3 Commits

Author SHA1 Message Date
inman
fc81f5a568 优化登录页与锚点滚动体验 2026-07-24 17:11:21 +08:00
inman
ffbbbc2408 修复生产登录页面缓存 2026-07-24 16:47:07 +08:00
inman
3207220d1a 优化登录体验并更新小程序域名 2026-07-24 16:09:55 +08:00
12 changed files with 70 additions and 39 deletions

View File

@@ -18,4 +18,4 @@ VITE_MEDIA_PUBLIC_BASE_URL=""
VITE_WECOM_CUSTOMER_SERVICE_URL="https://work.weixin.qq.com/kfid/your-customer-service-link"
VITE_WECOM_CORP_ID="ww_your_corp_id"
# Taro 会将这个地址编译进微信小程序;生产环境请填写已备案并加入 request 合法域名的 HTTPS API 地址
TARO_APP_API_BASE_URL="https://biz.wanderqtrip.com/api"
TARO_APP_API_BASE_URL="https://bizwanderq.nianxx.com/api"

View File

@@ -1,2 +1,2 @@
TARO_APP_API_BASE_URL="https://biz.wanderqtrip.com/api"
TARO_APP_H5_URL="https://www.example.com"
TARO_APP_API_BASE_URL="https://bizwanderq.nianxx.com/api"
TARO_APP_H5_URL="https://wanderq.nianxx.com"

View File

@@ -21,7 +21,8 @@ MINIAPP_MEMORY_DB=1 npm run dev:api:memory
在根目录环境中设置:
```bash
TARO_APP_API_BASE_URL="https://biz.wanderqtrip.com/api"
TARO_APP_API_BASE_URL="https://bizwanderq.nianxx.com/api"
TARO_APP_H5_URL="https://wanderq.nianxx.com"
```
然后执行:

View File

@@ -3,7 +3,7 @@ import { fileURLToPath } from "node:url";
import { defineConfig, type UserConfigExport } from "@tarojs/cli";
const appRoot = path.resolve(fileURLToPath(new URL("..", import.meta.url)));
const DEFAULT_API_BASE_URL = "https://biz.wanderqtrip.com/api";
const DEFAULT_API_BASE_URL = "https://bizwanderq.nianxx.com/api";
class StripWxssWebpackBannersPlugin {
apply(compiler: any) {

View File

@@ -127,18 +127,25 @@ page, view, text, image, input, button, scroll-view, swiper, swiper-item {
.contact-fallback { background: #e8f1e9; }
.contact-back { width: 100%; color: #19766a; background: transparent; border: 1px solid #bcd3c5; border-radius: 999px; font-size: 22px; }
.login-page { display: grid; align-content: start; gap: 22px; min-height: 100vh; padding: 64px 32px 100px; background: #f6f4ee; }
.login-hero { display: grid; gap: 14px; padding: 16px 4px 30px; }
.login-title { display: block; color: #182522; font-size: 42px; font-weight: 800; line-height: 1.3; }
.login-note { display: block; color: #718079; font-size: 22px; line-height: 1.6; }
.phone-login-button { width: 100%; color: #fff; background: #19766a; border-radius: 999px; font-size: 25px; }
.login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 40px 28px calc(40px + env(safe-area-inset-bottom)); background: #fff; }
.login-content { width: 100%; max-width: 334px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.login-logo { width: 174px; height: auto; margin-bottom: 38px; }
.login-title { display: block; margin-bottom: 42px; color: #182522; font-size: 34px; font-weight: 800; line-height: 1.3; white-space: nowrap; }
.phone-login-button { width: 100%; min-height: 58px; padding: 0 16px; color: #fff; background: #287642; border: 0; border-radius: 999px; box-shadow: 0 10px 22px rgba(40, 118, 66, .18); font-size: 24px; font-weight: 700; line-height: 58px; }
.phone-login-button::after { border: 0; }
.phone-login-button[disabled] { opacity: .6; }
.login-message { display: block; color: #b15842; text-align: center; font-size: 20px; line-height: 1.5; }
.login-privacy { display: block; color: #87938c; text-align: center; font-size: 17px; line-height: 1.5; }
.login-message { display: block; margin-top: 16px; padding: 12px 14px; border-radius: 14px; background: #fff1ec; color: #b15842; text-align: center; font-size: 18px; line-height: 1.5; }
.login-benefits { width: 100%; display: flex; justify-content: center; gap: 24px; margin-top: 30px; }
.login-benefit { flex: 1 1 0; min-width: 0; color: #287642; font-size: 17px; font-weight: 700; line-height: 1.3; text-align: center; white-space: nowrap; }
@media (max-width: 680px) {
.product-grid { grid-template-columns: 1fr; }
.hero-copy > text:nth-child(2), .hero-fallback > text:nth-of-type(1) { font-size: 34px; }
.section-title { font-size: 31px; }
.key-fact-grid { grid-template-columns: 1fr 1fr; }
.login-logo { width: 158px; }
.login-title { font-size: 31px; }
.phone-login-button { font-size: 22px; }
.login-benefits { gap: 10px; }
.login-benefit { font-size: 15px; }
}

View File

@@ -4,7 +4,7 @@ import { useDidShow } from "@tarojs/taro";
import { createH5Ticket, getToken } from "../../services/api";
const H5_URL = String(process.env.TARO_APP_H5_URL ?? "https://wanderq.nianxx.com");
const H5_CACHE_VERSION = "auth-20260724-v1";
const H5_CACHE_VERSION = "auth-20260724-v2";
function buildH5Src(ticket?: string) {
const separator = H5_URL.includes("?") ? "&" : "?";

View File

@@ -1,4 +1,7 @@
export default definePageConfig({
navigationBarTitleText: "微信手机号登录",
navigationBarBackgroundColor: "#ffffff",
backgroundColor: "#ffffff",
backgroundColorContent: "#ffffff",
backgroundTextStyle: "light",
});

View File

@@ -1,7 +1,8 @@
import { Button, Text, View } from "@tarojs/components";
import { Button, Image, Text, View } from "@tarojs/components";
import { useState } from "react";
import Taro, { useLoad } from "@tarojs/taro";
import { clearToken, loginMiniProgramWithPhone } from "../../services/api";
import WANDERQ_LOGO_URL from "./wanderq-logo-black-green.png";
type LoginPageParams = {
mode?: string;
@@ -43,11 +44,9 @@ export default function LoginPage() {
return (
<View className="login-page">
<View className="login-hero">
<Text className="eyebrow"></Text>
<Text className="login-title"> H5 </Text>
<Text className="login-note"></Text>
</View>
<View className="login-content">
<Image className="login-logo" src={WANDERQ_LOGO_URL} mode="widthFix" />
<Text className="login-title"></Text>
<Button
className="phone-login-button"
openType="getPhoneNumber"
@@ -57,7 +56,12 @@ export default function LoginPage() {
{loading ? "登录中..." : "微信手机号一键登录"}
</Button>
{message ? <Text className="login-message">{message}</Text> : null}
<Text className="login-privacy"></Text>
<View className="login-benefits">
<Text className="login-benefit"></Text>
<Text className="login-benefit"></Text>
<Text className="login-benefit"></Text>
</View>
</View>
</View>
);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.2 KiB

View File

@@ -1,6 +1,6 @@
import Taro from "@tarojs/taro";
const DEFAULT_API_BASE_URL = "https://biz.wanderqtrip.com/api";
const DEFAULT_API_BASE_URL = "https://bizwanderq.nianxx.com/api";
const API_BASE = String(process.env.TARO_APP_API_BASE_URL || DEFAULT_API_BASE_URL).replace(/\/+$/, "");
const TOKEN_KEY = "wanqu_mini_program_token";
const LOCAL_FAVORITES_KEY = "wanqu_mini_program_favorites";

View File

@@ -5,6 +5,12 @@ server {
root /usr/share/nginx/html;
index index.html;
location = /index.html {
add_header Cache-Control "no-cache, no-store, must-revalidate" always;
add_header Pragma "no-cache" always;
add_header Expires "0" always;
}
location / {
try_files $uri $uri/ /index.html;
}

View File

@@ -1182,6 +1182,25 @@ function AnchorTabs({ activeTab, tabs, onSearch }: { activeTab: string; tabs: Ar
document.getElementById(id)?.scrollIntoView({ behavior: "smooth", block: "start" });
};
useEffect(() => {
const container = tabsRef.current;
const activeButton = container?.querySelector<HTMLButtonElement>("button.active");
if (!container || !activeButton) return;
const buttonStart = activeButton.offsetLeft;
const buttonEnd = buttonStart + activeButton.offsetWidth;
const visibleStart = container.scrollLeft;
const visibleEnd = visibleStart + container.clientWidth;
if (buttonStart >= visibleStart && buttonEnd <= visibleEnd) return;
const targetLeft = buttonStart - (container.clientWidth - activeButton.offsetWidth) / 2;
const maxScrollLeft = Math.max(0, container.scrollWidth - container.clientWidth);
container.scrollTo({
left: Math.max(0, Math.min(targetLeft, maxScrollLeft)),
behavior: "smooth",
});
}, [activeTab]);
if (!tabs.length) return null;
return (
@@ -3866,7 +3885,7 @@ export default function App() {
const changeView = (nextView: AppView) => {
if (nextView === "mine" && !authUser) {
showAuthSheet("进入“我的”前,请先完成微信手机号登录。");
handleLogin();
return;
}
setSelectedProduct(null);
@@ -4068,15 +4087,6 @@ export default function App() {
};
}, [anchorTabs]);
useEffect(() => {
if (!activeTab) return;
document.querySelector(".anchor-tabs-scroll button.active")?.scrollIntoView({
block: "nearest",
inline: "center",
behavior: "smooth",
});
}, [activeTab]);
const renderHomeModule = (module: HomeModuleConfig) => {
const templateType = module.templateType ?? module.id;
const items = module.content?.items;