feat(auth): access token 缩到 2 小时 + refresh token 机制 #3
@@ -277,10 +277,6 @@ page{scrollbar-width:none;-ms-overflow-style:none}
|
|||||||
padding:var(--sp-2) var(--sp-4);align-items:center;gap:var(--sp-2);color:var(--muted);font-weight:var(--fw-b);font-size:var(--fs-md);
|
padding:var(--sp-2) var(--sp-4);align-items:center;gap:var(--sp-2);color:var(--muted);font-weight:var(--fw-b);font-size:var(--fs-md);
|
||||||
}
|
}
|
||||||
.pet-chip.active{color:var(--primary-dark);background:var(--primary-soft);border-color:var(--primary-line)}
|
.pet-chip.active{color:var(--primary-dark);background:var(--primary-soft);border-color:var(--primary-line)}
|
||||||
.pet-chip .mini-avatar{
|
|
||||||
width:52rpx;height:52rpx;border-radius:var(--r-sm);display:flex;align-items:center;
|
|
||||||
justify-content:center;background:#FFE4B7;font-size:30rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 任务列表 */
|
/* 任务列表 */
|
||||||
.task-list{display:flex;flex-direction:column;gap:var(--sp-2)}
|
.task-list{display:flex;flex-direction:column;gap:var(--sp-2)}
|
||||||
|
|||||||
@@ -1,5 +1,12 @@
|
|||||||
Component({
|
Component({
|
||||||
options: { addGlobalClass: true },
|
options: { addGlobalClass: true },
|
||||||
|
properties: {
|
||||||
|
// 之前漏声明,icon 一直没传进来,pt-icon 收到空值退到 note 兜底字形,
|
||||||
|
// 首页那个「文档」图标就是这么来的
|
||||||
|
icon: { type: String, value: 'plus' },
|
||||||
|
// 首页快速记录用肉垫造型(呼应「肉垫计划」),社区发帖仍用普通图标
|
||||||
|
paw: { type: Boolean, value: false },
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onTap() {
|
onTap() {
|
||||||
this.triggerEvent('tap');
|
this.triggerEvent('tap');
|
||||||
|
|||||||
@@ -1 +1,11 @@
|
|||||||
<view class="fab" bindtap="onTap"><pt-icon name="{{icon}}" size="{{48}}"></pt-icon></view>
|
<view class="fab {{paw ? 'fab-paw' : ''}}" bindtap="onTap">
|
||||||
|
<!-- 肉垫:一个大掌垫 + 四个脚趾垫,纯 CSS 画,呼应 app 名 -->
|
||||||
|
<view wx:if="{{paw}}" class="paw">
|
||||||
|
<view class="bean bean-1"></view>
|
||||||
|
<view class="bean bean-2"></view>
|
||||||
|
<view class="bean bean-3"></view>
|
||||||
|
<view class="bean bean-4"></view>
|
||||||
|
<view class="pad"></view>
|
||||||
|
</view>
|
||||||
|
<pt-icon wx:else name="{{icon}}" size="{{48}}"></pt-icon>
|
||||||
|
</view>
|
||||||
|
|||||||
@@ -8,3 +8,26 @@
|
|||||||
z-index:60;
|
z-index:60;
|
||||||
}
|
}
|
||||||
.fab:active{transform:scale(.96)}
|
.fab:active{transform:scale(.96)}
|
||||||
|
|
||||||
|
/* 肉垫造型:暖橘圆钮,中间一只奶白肉垫。圆形更像脚印落下的样子,
|
||||||
|
阴影带橘调让它从奶白背景上浮起来 */
|
||||||
|
.fab-paw{
|
||||||
|
width:116rpx;height:116rpx;border-radius:50%;
|
||||||
|
background:linear-gradient(150deg,#FFB865,#F5943E);
|
||||||
|
box-shadow:0 12rpx 28rpx rgba(214,138,52,.42),0 2rpx 6rpx rgba(214,138,52,.3);
|
||||||
|
}
|
||||||
|
.fab-paw:active{transform:scale(.94)}
|
||||||
|
|
||||||
|
.paw{position:relative;width:66rpx;height:60rpx}
|
||||||
|
/* 掌垫:上窄下宽的圆角心形块,坐在下方 */
|
||||||
|
.paw .pad{
|
||||||
|
position:absolute;left:50%;bottom:0;transform:translateX(-50%);
|
||||||
|
width:44rpx;height:36rpx;background:#FFF7EC;
|
||||||
|
border-radius:48% 48% 44% 44%/62% 62% 40% 40%;
|
||||||
|
}
|
||||||
|
/* 四个脚趾垫,沿上方弧线排开,外侧两个更低、内侧两个更高 */
|
||||||
|
.paw .bean{position:absolute;background:#FFF7EC;border-radius:50%}
|
||||||
|
.paw .bean-1{width:15rpx;height:20rpx;left:0;top:20rpx;transform:rotate(-20deg)}
|
||||||
|
.paw .bean-2{width:16rpx;height:22rpx;left:18rpx;top:5rpx;transform:rotate(-7deg)}
|
||||||
|
.paw .bean-3{width:16rpx;height:22rpx;right:18rpx;top:5rpx;transform:rotate(7deg)}
|
||||||
|
.paw .bean-4{width:15rpx;height:20rpx;right:0;top:20rpx;transform:rotate(20deg)}
|
||||||
|
|||||||
@@ -1,13 +1,7 @@
|
|||||||
<scroll-view class="pet-switch" scroll-x="true" enhanced="{{true}}" show-scrollbar="{{false}}">
|
<scroll-view class="pet-switch" scroll-x="true" enhanced="{{true}}" show-scrollbar="{{false}}">
|
||||||
|
<!-- 纯文字筛选:带头像时不同宠物 chip 高度对不齐,这里只作切换用,文字最稳 -->
|
||||||
<view wx:for="{{pets}}" wx:key="id"
|
<view wx:for="{{pets}}" wx:key="id"
|
||||||
class="pet-chip {{item.id === currentId ? 'active' : ''}}"
|
class="pet-chip {{item.id === currentId ? 'active' : ''}}"
|
||||||
data-id="{{item.id}}" bindtap="onPick">
|
data-id="{{item.id}}" bindtap="onPick">{{item.name}}</view>
|
||||||
<view class="mini-avatar">
|
<view wx:if="{{showAdd}}" class="pet-chip pet-chip-add" bindtap="onAdd">+ 添加</view>
|
||||||
<image wx:if="{{item.avatar_url}}" class="mini-avatar-img" src="{{item.avatar_url}}" mode="aspectFill"></image>
|
|
||||||
<block wx:else>{{item.emoji}}</block>
|
|
||||||
</view>{{item.name}}
|
|
||||||
</view>
|
|
||||||
<view wx:if="{{showAdd}}" class="pet-chip" bindtap="onAdd">
|
|
||||||
<view class="mini-avatar"><pt-icon name="plus" size="{{30}}"></pt-icon></view>添加
|
|
||||||
</view>
|
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
|
|||||||
@@ -1,9 +1,11 @@
|
|||||||
.pet-switch{
|
.pet-switch{
|
||||||
display:block;white-space:nowrap;width:100%;
|
display:block;white-space:nowrap;width:100%;font-size:0;
|
||||||
|
}
|
||||||
|
/* chip 是 inline-flex,行内盒默认按 baseline 对齐,不同内容会高低不齐;
|
||||||
|
统一固定高度 + vertical-align:middle,彻底对齐。父级 font-size:0 消掉 chip 间的空白基线 */
|
||||||
|
.pet-switch .pet-chip{
|
||||||
|
margin-right:20rpx;vertical-align:middle;
|
||||||
|
height:64rpx;padding-top:0;padding-bottom:0;font-size:var(--fs-md);
|
||||||
}
|
}
|
||||||
.pet-switch .pet-chip{margin-right:20rpx}
|
|
||||||
.pet-switch .pet-chip:last-child{margin-right:0}
|
.pet-switch .pet-chip:last-child{margin-right:0}
|
||||||
/* flex 子项默认 min-width:auto,图片的固有尺寸(320×240)会把 chip 撑大,
|
.pet-chip-add{color:var(--muted)}
|
||||||
真机比模拟器更明显。flex:none 锁死成 app.wxss 里定的 52rpx 见方 */
|
|
||||||
.mini-avatar{overflow:hidden;flex:none}
|
|
||||||
.mini-avatar-img{width:52rpx;height:52rpx;display:block}
|
|
||||||
|
|||||||
@@ -115,4 +115,4 @@
|
|||||||
</view>
|
</view>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
|
|
||||||
<fab icon="plus" bind:tap="onQuickRecord"></fab>
|
<fab paw bind:tap="onQuickRecord"></fab>
|
||||||
|
|||||||
@@ -44,6 +44,7 @@ function ageFromBirthday(bdayStr) {
|
|||||||
|
|
||||||
Page({
|
Page({
|
||||||
data: {
|
data: {
|
||||||
|
booting: true, // 冷启动先显示闪屏,静默登录 + 拉宠物期间不闪建档向导
|
||||||
step: 0,
|
step: 0,
|
||||||
petType: '猫猫',
|
petType: '猫猫',
|
||||||
petEmoji: '🐱',
|
petEmoji: '🐱',
|
||||||
@@ -68,15 +69,19 @@ Page({
|
|||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
this.setData({ today: today(), arrivedAt: today() });
|
this.setData({ today: today(), arrivedAt: today() });
|
||||||
// 已有宠物则直接进首页
|
// 闪屏期间就把登录 + 宠物拉完,保证进首页时数据已经到位。
|
||||||
|
// 有宠物直接进首页;没有才落到建档向导。登录失败也别卡在闪屏,
|
||||||
|
// 放用户进向导(提交时会再 store.ready 重试)
|
||||||
store
|
store
|
||||||
.ready()
|
.ready()
|
||||||
.then(() => {
|
.then(() => {
|
||||||
if (store.getPets().length > 0) {
|
if (store.getPets().length > 0) {
|
||||||
wx.switchTab({ url: '/pages/home/home' });
|
wx.switchTab({ url: '/pages/home/home' });
|
||||||
|
} else {
|
||||||
|
this.setData({ booting: false });
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(() => {});
|
.catch(() => this.setData({ booting: false }));
|
||||||
},
|
},
|
||||||
nextStep() {
|
nextStep() {
|
||||||
this.setData({ step: Math.min(this.data.step + 1, 5) });
|
this.setData({ step: Math.min(this.data.step + 1, 5) });
|
||||||
|
|||||||
@@ -1,3 +1,17 @@
|
|||||||
|
<!-- 冷启动闪屏:登录 + 拉宠物期间显示,不再闪一下建档向导 -->
|
||||||
|
<view wx:if="{{booting}}" class="boot">
|
||||||
|
<view class="boot-badge">
|
||||||
|
<view class="paw">
|
||||||
|
<view class="bean bean-1"></view><view class="bean bean-2"></view>
|
||||||
|
<view class="bean bean-3"></view><view class="bean bean-4"></view>
|
||||||
|
<view class="pad"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="boot-name">肉垫计划</view>
|
||||||
|
<view class="boot-tip">正在准备今天的养护计划…</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<block wx:else>
|
||||||
<nav-bar title="肉垫计划"></nav-bar>
|
<nav-bar title="肉垫计划"></nav-bar>
|
||||||
|
|
||||||
<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
|
<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
|
||||||
@@ -5,14 +19,20 @@
|
|||||||
<!-- step 0 欢迎 -->
|
<!-- step 0 欢迎 -->
|
||||||
<view wx:if="{{step === 0}}" class="step">
|
<view wx:if="{{step === 0}}" class="step">
|
||||||
<view class="hero">
|
<view class="hero">
|
||||||
<view class="pet-logo"><pt-icon name="community" size="{{88}}" color="#fff"></pt-icon></view>
|
<view class="pet-logo">
|
||||||
|
<view class="paw">
|
||||||
|
<view class="bean bean-1"></view><view class="bean bean-2"></view>
|
||||||
|
<view class="bean bean-3"></view><view class="bean bean-4"></view>
|
||||||
|
<view class="pad"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
<view class="hero-h1">肉垫计划</view>
|
<view class="hero-h1">肉垫计划</view>
|
||||||
<view class="hero-sub">新手养宠的养护日历、健康记录和成长报告。先生成计划,再每天照着做。</view>
|
<view class="hero-sub">新手养宠的养护日历、健康记录和成长报告。先生成计划,再每天照着做。</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="proof-row">
|
<view class="proof-row">
|
||||||
<view class="proof"><text class="proof-b">30天</text><text class="proof-s">新手计划</text></view>
|
<view class="proof"><text class="proof-b">30天</text><text class="proof-s">新手计划</text></view>
|
||||||
<view class="proof"><text class="proof-b">8类</text><text class="proof-s">快速记录</text></view>
|
<view class="proof"><text class="proof-b">24类</text><text class="proof-s">快速记录</text></view>
|
||||||
<view class="proof"><text class="proof-b">AI</text><text class="proof-s">观察建议</text></view>
|
<view class="proof"><text class="proof-b">成长</text><text class="proof-s">报告卡片</text></view>
|
||||||
</view>
|
</view>
|
||||||
<button class="btn btn-primary btn-block" bindtap="nextStep">开始建档,生成计划</button>
|
<button class="btn btn-primary btn-block" bindtap="nextStep">开始建档,生成计划</button>
|
||||||
<view class="skip-link" bindtap="skipBrowse">先随便看看</view>
|
<view class="skip-link" bindtap="skipBrowse">先随便看看</view>
|
||||||
@@ -104,3 +124,4 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
|
</block>
|
||||||
|
|||||||
@@ -9,13 +9,46 @@
|
|||||||
.skip-link{text-align:center;margin-top:var(--sp-4);color:var(--muted);font-size:var(--fs-md);padding:var(--sp-2)}
|
.skip-link{text-align:center;margin-top:var(--sp-4);color:var(--muted);font-size:var(--fs-md);padding:var(--sp-2)}
|
||||||
@keyframes fade{from{opacity:0;transform:translateY(16rpx)}to{opacity:1;transform:none}}
|
@keyframes fade{from{opacity:0;transform:translateY(16rpx)}to{opacity:1;transform:none}}
|
||||||
|
|
||||||
|
/* 冷启动闪屏 */
|
||||||
|
.boot{
|
||||||
|
position:fixed;inset:0;z-index:200;
|
||||||
|
display:flex;flex-direction:column;align-items:center;justify-content:center;
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at 50% 32%, rgba(253,179,92,.28), transparent 55%),
|
||||||
|
var(--bg);
|
||||||
|
}
|
||||||
|
.boot-badge{
|
||||||
|
width:184rpx;height:184rpx;border-radius:44rpx;
|
||||||
|
background:linear-gradient(150deg,#FFB865,#F5943E);
|
||||||
|
display:flex;align-items:center;justify-content:center;
|
||||||
|
box-shadow:0 18rpx 42rpx rgba(214,138,52,.4);
|
||||||
|
animation:boot-pop .5s ease both, boot-breathe 2.4s ease-in-out .5s infinite;
|
||||||
|
}
|
||||||
|
.boot-name{margin-top:var(--sp-5);font-size:var(--fs-2xl);font-weight:var(--fw-b);letter-spacing:-1rpx}
|
||||||
|
.boot-tip{margin-top:var(--sp-2);color:var(--muted);font-size:var(--fs-md)}
|
||||||
|
@keyframes boot-pop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
|
||||||
|
@keyframes boot-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-10rpx)}}
|
||||||
|
|
||||||
.hero{text-align:center;padding:60rpx 0 var(--sp-5)}
|
.hero{text-align:center;padding:60rpx 0 var(--sp-5)}
|
||||||
.pet-logo{
|
.pet-logo{
|
||||||
width:176rpx;height:176rpx;margin:0 auto var(--sp-5);border-radius:var(--r-lg);
|
width:176rpx;height:176rpx;margin:0 auto var(--sp-5);border-radius:var(--r-lg);
|
||||||
background:linear-gradient(135deg,#FFE0AB,#FDB35C);
|
background:linear-gradient(135deg,#FFB865,#F5943E);
|
||||||
display:flex;align-items:center;justify-content:center;font-size:88rpx;
|
display:flex;align-items:center;justify-content:center;
|
||||||
box-shadow:var(--sd-2);
|
box-shadow:var(--sd-2);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 肉垫(呼应「肉垫计划」)——奶白掌垫 + 四趾垫,闪屏和欢迎屏共用 */
|
||||||
|
.paw{position:relative;width:100rpx;height:92rpx}
|
||||||
|
.paw .pad{
|
||||||
|
position:absolute;left:50%;bottom:0;transform:translateX(-50%);
|
||||||
|
width:66rpx;height:54rpx;background:#FFF7EC;
|
||||||
|
border-radius:48% 48% 44% 44%/62% 62% 40% 40%;
|
||||||
|
}
|
||||||
|
.paw .bean{position:absolute;background:#FFF7EC;border-radius:50%}
|
||||||
|
.paw .bean-1{width:22rpx;height:30rpx;left:0;top:30rpx;transform:rotate(-20deg)}
|
||||||
|
.paw .bean-2{width:24rpx;height:33rpx;left:27rpx;top:6rpx;transform:rotate(-7deg)}
|
||||||
|
.paw .bean-3{width:24rpx;height:33rpx;right:27rpx;top:6rpx;transform:rotate(7deg)}
|
||||||
|
.paw .bean-4{width:22rpx;height:30rpx;right:0;top:30rpx;transform:rotate(20deg)}
|
||||||
.hero-h1{font-size:var(--fs-2xl);letter-spacing:-1.2rpx;font-weight:var(--fw-b)}
|
.hero-h1{font-size:var(--fs-2xl);letter-spacing:-1.2rpx;font-weight:var(--fw-b)}
|
||||||
.hero-sub{margin-top:var(--sp-3);line-height:1.65;color:var(--muted);font-size:var(--fs-md)}
|
.hero-sub{margin-top:var(--sp-3);line-height:1.65;color:var(--muted);font-size:var(--fs-md)}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user