feat: enhance Zodiac page with date ranges, keywords, relationship tips, daily actions, and summary
This commit is contained in:
parent
8a09d6e12f
commit
0377c41888
4
app.json
4
app.json
|
|
@ -1,6 +1,8 @@
|
||||||
{
|
{
|
||||||
"pages": [
|
"pages": [
|
||||||
"pages/index/index"
|
"pages/home/home",
|
||||||
|
"pages/index/index",
|
||||||
|
"pages/zodiac/index"
|
||||||
],
|
],
|
||||||
"window": {
|
"window": {
|
||||||
"navigationBarTitleText": "我的第一个小程序"
|
"navigationBarTitleText": "我的第一个小程序"
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
Page({
|
||||||
|
goToTarot: function () {
|
||||||
|
wx.navigateTo({
|
||||||
|
url: '/pages/index/index'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
goToZodiac: function () {
|
||||||
|
wx.navigateTo({
|
||||||
|
url: '/pages/zodiac/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "首页"
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
<view class="container">
|
||||||
|
<!-- 顶部引导文案 -->
|
||||||
|
<view class="header-text">
|
||||||
|
<text class="line-one">今天，</text>
|
||||||
|
<text class="line-two">你想从哪里获得指引？</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 选择区域 -->
|
||||||
|
<view class="selection-area">
|
||||||
|
<!-- 塔罗入口 -->
|
||||||
|
<view class="direction-card" bindtap="goToTarot" hover-class="card-hover">
|
||||||
|
<view class="card-icon">🔮</view>
|
||||||
|
<view class="card-content">
|
||||||
|
<text class="card-title">塔罗指引</text>
|
||||||
|
<text class="card-subtitle">探索潜意识的答案</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 星座入口 -->
|
||||||
|
<view class="direction-card" bindtap="goToZodiac" hover-class="card-hover">
|
||||||
|
<view class="card-icon">♒</view>
|
||||||
|
<view class="card-content">
|
||||||
|
<text class="card-title">星座运势</text>
|
||||||
|
<text class="card-subtitle">解析星体给你的启示</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
@ -0,0 +1,89 @@
|
||||||
|
page {
|
||||||
|
background-color: #1a1a2e;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
padding: 40px 30px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
align-items: flex-start; /* 左对齐更有叙述感 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 顶部引导文案 */
|
||||||
|
.header-text {
|
||||||
|
margin-top: 40px;
|
||||||
|
margin-bottom: 60px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-one {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 300; /* 细一点显得高级 */
|
||||||
|
margin-bottom: 10px;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-two {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: 300;
|
||||||
|
opacity: 0.7; /* 稍微淡一点 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 选择区域 */
|
||||||
|
.selection-area {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 25px; /* 卡片之间的间距 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 方向卡片 */
|
||||||
|
.direction-card {
|
||||||
|
background-color: rgba(255, 255, 255, 0.05); /* 极低透明度背景 */
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 25px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 点击/按压时的效果 */
|
||||||
|
.card-hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-icon {
|
||||||
|
font-size: 32px;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-title {
|
||||||
|
color: #e94560;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-subtitle {
|
||||||
|
color: #ccc;
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
@ -224,5 +224,10 @@ Page({
|
||||||
this.setData({
|
this.setData({
|
||||||
isRevealed: true
|
isRevealed: true
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// --- 跳转星座运势 (占位) ---
|
||||||
|
goToHoroscope: function () {
|
||||||
|
console.log("用户点击了星座入口，准备跳转...");
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
@ -38,6 +38,11 @@
|
||||||
<view class="card-info {{isRevealed ? 'visible' : ''}}">
|
<view class="card-info {{isRevealed ? 'visible' : ''}}">
|
||||||
<text class="card-name">{{currentCard.name}} {{currentCard.isReversed ? '(逆位)' : ''}}</text>
|
<text class="card-name">{{currentCard.name}} {{currentCard.isReversed ? '(逆位)' : ''}}</text>
|
||||||
<text class="card-meaning">{{explanation}}</text>
|
<text class="card-meaning">{{explanation}}</text>
|
||||||
|
|
||||||
|
<!-- 星座入口占位 -->
|
||||||
|
<view class="horoscope-entry" bindtap="goToHoroscope">
|
||||||
|
<text>👉 查看今日星座运势</text>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -178,6 +178,20 @@ page {
|
||||||
line-height: 1.4;
|
line-height: 1.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 星座入口样式 */
|
||||||
|
.horoscope-entry {
|
||||||
|
margin-top: 20px;
|
||||||
|
padding: 10px;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.horoscope-entry text {
|
||||||
|
color: #a29bfe; /* 浅紫色，以此区分 */
|
||||||
|
font-size: 14px;
|
||||||
|
text-decoration: underline; /*以此暗示可点击*/
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
/* 按钮稍微美化一下 */
|
/* 按钮稍微美化一下 */
|
||||||
.draw-btn {
|
.draw-btn {
|
||||||
background-color: #0f3460 !important;
|
background-color: #0f3460 !important;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,341 @@
|
||||||
|
Page({
|
||||||
|
data: {
|
||||||
|
selectedZodiac: null,
|
||||||
|
currentFortune: null, // { keyword, today, lucky, notice, match, action, summary }
|
||||||
|
isMatchExpanded: false, // 控制关系提示的展开状态
|
||||||
|
|
||||||
|
// 12星座数据 - 增加 summary 字段
|
||||||
|
zodiacList: [
|
||||||
|
{
|
||||||
|
name: '白羊座',
|
||||||
|
symbol: '♈',
|
||||||
|
range: '3.21 – 4.19',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '开启',
|
||||||
|
today: '感觉能量在一点点回升，像温柔的晨光，正如适合开启一个小计划。',
|
||||||
|
lucky: '试着做一件从未做过的小事，哪怕只是换条路漫步回家。',
|
||||||
|
notice: '稍微慢下来也没关系，深呼吸，给自己一点缓冲的时间。',
|
||||||
|
action: '也许可以尝试一项简单的运动，或者把那个想了很久的小决定做了。',
|
||||||
|
match: '狮子座',
|
||||||
|
summary: '整体氛围积极向上，适宜迈出新的一步。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '直觉',
|
||||||
|
today: '直觉敏锐的一天，内心的声音会温柔地指引你去对的地方。',
|
||||||
|
lucky: '流一点汗，让身体的能量自由流动起来。',
|
||||||
|
notice: '倾听也是一种力量，试着先听听别人的想法。',
|
||||||
|
action: '相信你的第一反应，今天不需要过度分析，跟着感觉走就好。',
|
||||||
|
match: '射手座',
|
||||||
|
summary: '这是一个依靠感性而非逻辑的时刻，信任直觉。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '金牛座',
|
||||||
|
symbol: '♉',
|
||||||
|
range: '4.20 – 5.20',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '安稳',
|
||||||
|
today: '享受当下的安稳就好，物质的触感能带给你实实在在的安全感。',
|
||||||
|
lucky: '一杯温热的茶，或是一顿用心准备的晚餐，都是很好的滋养。',
|
||||||
|
notice: '柔软一点，你会发现世界比想象中更宽阔。',
|
||||||
|
action: '花点时间整理一下钱包或书桌，有序的环境会让你感到平静。',
|
||||||
|
match: '处女座',
|
||||||
|
summary: '平稳是今日的主基调，无需向外过多索求。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '秩序',
|
||||||
|
today: '按部就班也很好，秩序感会让你感到踏实和放松。',
|
||||||
|
lucky: '在整理收纳中梳理思绪，享受物品归位的快乐。',
|
||||||
|
notice: '试着松开手，有时候放手反而能拥有更多。',
|
||||||
|
action: '去做一次舒缓的按摩，或者仅仅是静静地听一段白噪音。',
|
||||||
|
match: '摩羯座',
|
||||||
|
summary: '在规则与秩序中能找到内心的宁静。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '双子座',
|
||||||
|
symbol: '♊',
|
||||||
|
range: '5.21 – 6.21',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '灵感',
|
||||||
|
today: '思维很活跃，灵感像小火花一样在闪烁。',
|
||||||
|
lucky: '翻翻新书的目录，或和陌生人简单聊几句。',
|
||||||
|
notice: '试着一次只做一件事情，专注会让你更舒服。',
|
||||||
|
action: '随身带一个小本子，记录下今天那些有趣的小念头。',
|
||||||
|
match: '水瓶座',
|
||||||
|
summary: '思维跳跃的一天，由于灵感的迸发而显得生动。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '表达',
|
||||||
|
today: '沟通的桥梁已经架好，适合真实而轻松地表达自己。',
|
||||||
|
lucky: '记录下脑海中一闪而过的念头，它们很珍贵。',
|
||||||
|
notice: '有时候稍微沉默一下，给自己留点空间。',
|
||||||
|
action: '给许久未见的老朋友发个信息，简单的问候就很好。',
|
||||||
|
match: '天秤座',
|
||||||
|
summary: '适宜交流与分享，信息的流动会带来新的机会。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '巨蟹座',
|
||||||
|
symbol: '♋',
|
||||||
|
range: '6.22 – 7.22',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '疗愈',
|
||||||
|
today: '情感细腻丰富，适合向内探索，疗愈旧日的伤口。',
|
||||||
|
lucky: '去水边走走，水的包容会让你感到平静。',
|
||||||
|
notice: '保护好自己的情绪边界，不用对所有人的话都太在意。',
|
||||||
|
action: '今晚给自己做一顿暖胃的食物，或者泡一个舒服的热水澡。',
|
||||||
|
match: '双鱼座',
|
||||||
|
summary: '向内关注自我，是一个适合自我修复的温和日子。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '关怀',
|
||||||
|
today: '温柔是你的铠甲，你对他人的关怀也会回流到自己身上。',
|
||||||
|
lucky: '给家人打个电话，或者照顾一株植物。',
|
||||||
|
notice: '过去已去，当下才是最真实的，试着活在此时此刻。',
|
||||||
|
action: '整理一下旧照片，保留快乐的记忆就好。',
|
||||||
|
match: '天蝎座',
|
||||||
|
summary: '被温柔的情绪包围，付出与接受都自然发生。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '狮子座',
|
||||||
|
symbol: '♌',
|
||||||
|
range: '7.23 – 8.22',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '舞台',
|
||||||
|
today: '自信的光芒很美，你本身就是舞台的中心。',
|
||||||
|
lucky: '穿一件喜欢的亮色衣服，或者大方地接受别人的赞美。',
|
||||||
|
notice: '真正的王者懂得示弱的艺术，柔软也是一种力量。',
|
||||||
|
action: '对着镜子里的自己微笑，肯定自己的一个优点。',
|
||||||
|
match: '白羊座',
|
||||||
|
summary: '光芒外露，适宜展示自我，但也需张弛有度。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '创造',
|
||||||
|
today: '创造力在涌动，与其等待机会，不如自己创造一个小舞台。',
|
||||||
|
lucky: '像孩子一样去玩耍，画画或者唱歌都很棒。',
|
||||||
|
notice: '保持谦逊，你会看到更多不一样的风景。',
|
||||||
|
action: '尝试一种新的娱乐方式，或者去一个从未去过的店。',
|
||||||
|
match: '射手座',
|
||||||
|
summary: '创造力充沛，是表达个性和释放天性的好时机。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '处女座',
|
||||||
|
symbol: '♍',
|
||||||
|
range: '8.23 – 9.22',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '清晰',
|
||||||
|
today: '逻辑很清晰，能看透事物的本质，混乱将离你而去。',
|
||||||
|
lucky: '列一张简单的清单，每划掉一项都是一种治愈。',
|
||||||
|
notice: '对自己宽容一点，完美是一个方向，而不是必须到达的终点。',
|
||||||
|
action: '清理手机里无用的截图和APP，数字极简也能带来清爽。',
|
||||||
|
match: '金牛座',
|
||||||
|
summary: '条理清晰，事半功倍，适合处理复杂的细节事务。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '服务',
|
||||||
|
today: '助人的愿望很美好，你的细心能帮到很多人。',
|
||||||
|
lucky: '做一次深度的清洁，无论是环境还是心灵。',
|
||||||
|
notice: '偶尔也要抬头看看森林，不要总是盯着细节看。',
|
||||||
|
action: '在这个周末，尝试“一次只做一件事”，体验专注的快乐。',
|
||||||
|
match: '摩羯座',
|
||||||
|
summary: '在付出中获得满足感，但也需注意微观与宏观的平衡。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '天秤座',
|
||||||
|
symbol: '♎',
|
||||||
|
range: '9.23 – 10.23',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '平衡',
|
||||||
|
today: '追求和谐与美，在平衡中找到内心的宁静。',
|
||||||
|
lucky: '去美术馆逛逛，或者欣赏一首优美的乐曲。',
|
||||||
|
notice: '不要为了取悦他人而委屈自己，温和地拒绝也是可以的。',
|
||||||
|
action: '更换一下手机或电脑的壁纸，换成一张让你觉得美的图片。',
|
||||||
|
match: '双子座',
|
||||||
|
summary: '适宜在审美与艺术中寻找平衡，享受片刻的优雅。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '连接',
|
||||||
|
today: '人际关系很顺畅，适合化解误会，建立新的连接。',
|
||||||
|
lucky: '买一束花插在瓶中，为生活增添一点仪式感。',
|
||||||
|
notice: '犹豫不决时，抛硬币也是一种把命运交给天意的智慧。',
|
||||||
|
action: '主动赞美身边的一个人，真诚的赞美会让大家都很开心。',
|
||||||
|
match: '水瓶座',
|
||||||
|
summary: '良性的互动会带来好运，人际关系是今日的重点。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '天蝎座',
|
||||||
|
symbol: '♏',
|
||||||
|
range: '10.24 – 11.22',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '洞察',
|
||||||
|
today: '洞察力很强，能看穿表象，直达事物的核心。',
|
||||||
|
lucky: '在日记本里写下秘密，或者进行一次深刻的冥想。',
|
||||||
|
notice: '放下执念，学会像蛇蜕皮一样重生。',
|
||||||
|
action: '读一本悬疑小说或者看一部深度电影，满足你的探索欲。',
|
||||||
|
match: '巨蟹座',
|
||||||
|
summary: '直觉与洞察力并存，适合深入思考而非浅尝辄止。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '坚定',
|
||||||
|
today: '意志力坚定，现在是攻克难题的好时机。',
|
||||||
|
lucky: '独处，享受一个人的高质量时光。',
|
||||||
|
notice: '试着交付一点信任，你会发现没有那么多需要防备的事。',
|
||||||
|
action: '尝试与一个信任的人进行一次深度谈话，不设防的那种。',
|
||||||
|
match: '双鱼座'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '射手座',
|
||||||
|
symbol: '♐',
|
||||||
|
range: '11.23 – 12.21',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '自由',
|
||||||
|
today: '视野开阔，心向远方，自由的感觉真好。',
|
||||||
|
lucky: '规划一次未来的旅行，或者看一部异国电影。',
|
||||||
|
notice: '承诺之前先想一下，不要因为一时兴起而许下诺言。',
|
||||||
|
action: '去户外走走，甚至只是去楼下公园转一圈，看看天空。',
|
||||||
|
match: '白羊座',
|
||||||
|
summary: '心向自由，适合拓展视野，不宜被琐事困住眼界。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '乐观',
|
||||||
|
today: '乐观的精神很有感染力，你是身边人的开心果。',
|
||||||
|
lucky: '去户外奔跑，去接触大自然和新鲜空气。',
|
||||||
|
notice: '检查一下随身物品，细心一点能避免小麻烦。',
|
||||||
|
action: '学习一个全新的冷知识，或者尝试一种异国料理。',
|
||||||
|
match: '狮子座',
|
||||||
|
summary: '积极乐观的一天，行动力是好运的来源。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '摩羯座',
|
||||||
|
symbol: '♑',
|
||||||
|
range: '12.22 – 1.19',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '踏实',
|
||||||
|
today: '脚踏实地，每一步都算数，成就感源于自律。',
|
||||||
|
lucky: '制定一个长期的目标，并迈出第一步。',
|
||||||
|
notice: '不要把自己逼得太紧，工作之余也要学会“虚度时光”。',
|
||||||
|
action: '复盘一下本周的计划，把完成的事项画上大大的勾。',
|
||||||
|
match: '金牛座',
|
||||||
|
summary: '耕耘即有收获，适合专注于当下脚踏实地的积累。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '权威',
|
||||||
|
today: '权威感提升，你的专业度会得到大家的认可。',
|
||||||
|
lucky: '向一位长辈或导师请教，汲取传统的智慧。',
|
||||||
|
notice: '给生活加点糖，不用总是那么严肃。',
|
||||||
|
action: '给自己泡一杯好茶或好咖啡，在工作间隙享受片刻宁静。',
|
||||||
|
match: '处女座',
|
||||||
|
summary: '专业与稳重是今日的通行证，但也需适度放松。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水瓶座',
|
||||||
|
symbol: '♒',
|
||||||
|
range: '1.20 – 2.18',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '创意',
|
||||||
|
today: '特立独行的一天，你的怪念头也许就是天才的创意。',
|
||||||
|
lucky: '尝试一种新的科技产品，或者研究一个小众领域。',
|
||||||
|
notice: '给身边人一点温度，理智之外也需要温情。',
|
||||||
|
action: '去浏览一些前沿科技或艺术资讯，给大脑“充充电”。',
|
||||||
|
match: '双子座',
|
||||||
|
summary: '思维活跃且独特，适合进行创造性的脑力活动。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '理想',
|
||||||
|
today: '为了理想而战，你的视野超越了当下，看向未来。',
|
||||||
|
lucky: '参加一个社群活动，寻找志同道合的伙伴。',
|
||||||
|
notice: '保持开放的心态，固执己见和坚持真理只有一线之隔。',
|
||||||
|
action: '换一条平时不走的路去上班/回家，观察沿途的新风景。',
|
||||||
|
match: '天秤座',
|
||||||
|
summary: '目光长远，适合规划未来，不宜纠结于眼前的小节。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '双鱼座',
|
||||||
|
symbol: '♓',
|
||||||
|
range: '2.19 – 3.20',
|
||||||
|
fortunes: [
|
||||||
|
{
|
||||||
|
keyword: '灵感',
|
||||||
|
today: '梦幻与现实的边界模糊，灵感如潮水般涌来。',
|
||||||
|
lucky: '听海浪的声音，或者在睡前读一首诗。',
|
||||||
|
notice: '勇敢面对现实问题，比躲进幻想更有效。',
|
||||||
|
action: '听一首纯音乐，闭上眼睛想象一个完美的场景。',
|
||||||
|
match: '巨蟹座',
|
||||||
|
summary: '感受力极强的一天，适合艺术创作与精神探索。'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
keyword: '同理心',
|
||||||
|
today: '同理心爆棚，你能轻易感知他人的悲喜。',
|
||||||
|
lucky: '做一件善事，哪怕只是给流浪猫一点食物。',
|
||||||
|
notice: '学会自我净化，不要做情绪的海绵。',
|
||||||
|
action: '写下一件让你感到焦虑的事，然后把纸条撕碎扔掉。',
|
||||||
|
match: '天蝎座',
|
||||||
|
summary: '情感流动充沛，在关怀他人的同时也需照顾好自己。'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
// 选择星座
|
||||||
|
selectZodiac: function (e) {
|
||||||
|
const index = e.currentTarget.dataset.index;
|
||||||
|
const zodiac = this.data.zodiacList[index];
|
||||||
|
|
||||||
|
const randomIdx = Math.floor(Math.random() * zodiac.fortunes.length);
|
||||||
|
const fortuneData = zodiac.fortunes[randomIdx];
|
||||||
|
|
||||||
|
this.setData({
|
||||||
|
selectedZodiac: zodiac,
|
||||||
|
currentFortune: fortuneData,
|
||||||
|
isMatchExpanded: false // 重置展开状态
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 切换关系提示展开状态
|
||||||
|
toggleMatch: function () {
|
||||||
|
this.setData({
|
||||||
|
isMatchExpanded: !this.data.isMatchExpanded
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 返回列表
|
||||||
|
backToList: function () {
|
||||||
|
this.setData({
|
||||||
|
selectedZodiac: null,
|
||||||
|
currentFortune: null,
|
||||||
|
isMatchExpanded: false // 重置展开状态
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "星座运势"
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
<view class="container">
|
||||||
|
|
||||||
|
<!-- 状态1: 星座列表 -->
|
||||||
|
<view class="zodiac-grid" wx:if="{{!selectedZodiac}}">
|
||||||
|
<view class="header-tip">选择你的星座</view>
|
||||||
|
<view class="grid-container">
|
||||||
|
<block wx:for="{{zodiacList}}" wx:key="name">
|
||||||
|
<view class="zodiac-item" bindtap="selectZodiac" data-index="{{index}}">
|
||||||
|
<text class="zodiac-symbol">{{item.symbol}}</text>
|
||||||
|
<text class="zodiac-name">{{item.name}}</text>
|
||||||
|
<text class="zodiac-range">{{item.range}}</text>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 状态2: 运势展示 -->
|
||||||
|
<view class="result-container" wx:if="{{selectedZodiac}}">
|
||||||
|
<view class="result-header">
|
||||||
|
<text class="result-symbol">{{selectedZodiac.symbol}}</text>
|
||||||
|
<text class="today-title">今日指引 · {{selectedZodiac.name}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 三段式卡片 -->
|
||||||
|
<view class="fortune-card">
|
||||||
|
|
||||||
|
<!-- 0. 今日关键词 (NEW) -->
|
||||||
|
<view class="keyword-card">
|
||||||
|
<text class="keyword-label">✨ 今日关键词</text>
|
||||||
|
<text class="keyword-text">{{currentFortune.keyword}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 1. 今日运势 -->
|
||||||
|
<view class="section primary-section">
|
||||||
|
<text class="section-label">✨ 今日运势</text>
|
||||||
|
<text class="section-content">{{currentFortune.today}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 2. 幸运提示 -->
|
||||||
|
<view class="section">
|
||||||
|
<text class="section-label">🍀 幸运提示</text>
|
||||||
|
<text class="section-content">{{currentFortune.lucky}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 3. 注意事项 -->
|
||||||
|
<view class="section">
|
||||||
|
<text class="section-label">💡 注意事项</text>
|
||||||
|
<text class="section-content">{{currentFortune.notice}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 4. 今日行动建议 (NEW) -->
|
||||||
|
<view class="section last-section">
|
||||||
|
<text class="section-label">🌱 今日行动建议</text>
|
||||||
|
<text class="section-content">{{currentFortune.action}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 5. 关系提示 (可展开) -->
|
||||||
|
<view class="status-divider"></view> <!-- 分隔线 -->
|
||||||
|
<view class="match-module" bindtap="toggleMatch">
|
||||||
|
<text class="match-trigger">{{isMatchExpanded ? '收起关系提示' : '🌸 今日关系提示（点击查看）'}}</text>
|
||||||
|
|
||||||
|
<view class="match-content" wx:if="{{isMatchExpanded}}">
|
||||||
|
<text class="match-intro">今天，与你能量更顺的星座是：</text>
|
||||||
|
<text class="match-name">{{currentFortune.match}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 总体结论 (收束模块) -->
|
||||||
|
<view class="summary-text">{{currentFortune.summary}}</view>
|
||||||
|
|
||||||
|
<view class="action-area" bindtap="backToList">
|
||||||
|
<text class="back-btn">⬅ 选其他星座</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
@ -0,0 +1,247 @@
|
||||||
|
/* 保持与整体风格一致的暗色背景 */
|
||||||
|
page {
|
||||||
|
background-color: #1a1a2e;
|
||||||
|
height: 100%;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
padding: 30px 20px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
min-height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- 列表状态样式 --- */
|
||||||
|
.header-tip {
|
||||||
|
font-size: 20px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
text-align: center;
|
||||||
|
opacity: 0.9;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-container {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.zodiac-item {
|
||||||
|
width: 30%; /* 三列布局 */
|
||||||
|
background-color: rgba(255, 255, 255, 0.05);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding: 20px 0;
|
||||||
|
border-radius: 12px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.zodiac-symbol {
|
||||||
|
font-size: 28px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.zodiac-name {
|
||||||
|
font-size: 14px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.zodiac-range {
|
||||||
|
font-size: 10px;
|
||||||
|
opacity: 0.5;
|
||||||
|
margin-top: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- 结果状态样式 --- */
|
||||||
|
.result-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
flex: 1;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-header {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
animation: fadeIn 0.8s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-symbol {
|
||||||
|
font-size: 50px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
color: #e94560;
|
||||||
|
}
|
||||||
|
|
||||||
|
.today-title {
|
||||||
|
font-size: 18px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fortune-card {
|
||||||
|
width: 100%;
|
||||||
|
padding: 25px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.05);
|
||||||
|
border-radius: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
border: 1px solid rgba(233, 69, 96, 0.3);
|
||||||
|
animation: slideUp 0.8s ease;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 0. 关键词卡片样式 */
|
||||||
|
.keyword-card {
|
||||||
|
background-color: rgba(0, 0, 0, 0.2);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 15px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyword-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #a29bfe;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.keyword-text {
|
||||||
|
font-size: 32px; /* 进一步加大关键词字号 */
|
||||||
|
color: #fff;
|
||||||
|
font-weight: bold;
|
||||||
|
letter-spacing: 4px;
|
||||||
|
margin-top: 5px;
|
||||||
|
text-shadow: 0 2px 10px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 三段式内容的样式 */
|
||||||
|
.section {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
border-bottom: 1px dashed rgba(255, 255, 255, 0.1); /* 分隔线 */
|
||||||
|
padding-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.last-section {
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-bottom: none;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #a29bfe; /* 浅紫色标签 */
|
||||||
|
margin-bottom: 8px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-content {
|
||||||
|
font-size: 14px; /* 二级信息字号调小 */
|
||||||
|
line-height: 1.6;
|
||||||
|
color: #fff;
|
||||||
|
opacity: 0.75; /* 二级信息透明度降低 */
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 一级信息强调样式 */
|
||||||
|
.primary-section .section-content {
|
||||||
|
font-size: 17px;
|
||||||
|
opacity: 1;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.7;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-section .section-label {
|
||||||
|
font-size: 15px;
|
||||||
|
color: #e94560; /* 稍微强调标题颜色 */
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.back-btn {
|
||||||
|
font-size: 14px;
|
||||||
|
opacity: 0.6;
|
||||||
|
text-decoration: underline;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 简单的动效 */
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from { opacity: 0; }
|
||||||
|
to { opacity: 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideUp {
|
||||||
|
from { opacity: 0; transform: translateY(20px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 关系模块样式 */
|
||||||
|
.status-divider {
|
||||||
|
width: 100%;
|
||||||
|
height: 1px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.05);
|
||||||
|
margin: 15px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.match-module {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px 0;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.match-trigger {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fbaceb; /* 淡淡的粉色 */
|
||||||
|
opacity: 0.8;
|
||||||
|
text-decoration: underline;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.match-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 15px;
|
||||||
|
animation: fadeIn 0.5s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.match-intro {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #fff;
|
||||||
|
opacity: 0.6;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.match-name {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 总体结论样式 */
|
||||||
|
.summary-text {
|
||||||
|
font-size: 13px;
|
||||||
|
color: rgba(255, 255, 255, 0.5); /* 中性灰 */
|
||||||
|
margin-top: -20px; /* 调整间距 */
|
||||||
|
margin-bottom: 30px;
|
||||||
|
text-align: center;
|
||||||
|
max-width: 80%;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue