111

app.js

@@ -0,0 +1,5 @@
+App({
+    onLaunch() {
+        console.log('小程序启动啦！')
+    }
+})

app.json

@@ -0,0 +1,10 @@
+{
+    "pages": [
+        "pages/index/index"
+    ],
+    "window": {
+        "navigationBarTitleText": "我的第一个小程序"
+    },
+    "style": "v2",
+    "sitemapLocation": "sitemap.json"
+}

pages/index/index.js

@@ -0,0 +1,228 @@
+Page({
+    data: {
+        todayDate: '', // 用于存储今天的日期
+        // 1. 桌面上现在展示的牌 (initial: null)
+        currentCard: null,
+        isRevealed: false, // 是否已经翻牌
+        explanation: '', // 用于存储动态生成的解牌文案
+        cardBackImage: '/images/beimian.png', // 牌背图片
+
+        // 3. 前缀文案列表（随机抽取）
+        prefixList: [
+            "今天，这张牌提醒你：",
+            "此刻，宇宙传递的信息：",
+            "这张牌想告诉你：",
+            "请收下这份指引："
+        ],
+
+        // 2. 完整的 22 张大阿尔卡那牌组（包含逆位含义）
+        cardList: [
+            {
+                name: "0. 愚者",
+                keyword: "新的开始",
+                meaning: "放下恐惧，勇敢迈出第一步，世界充满无限可能。",
+                reversedMeaning: "也许有些太冲动了？停下来检查一下背包，确保安全再出发。",
+                image: "/images/yuzhe.png"
+            },
+            {
+                name: "I. 魔术师",
+                keyword: "创造力",
+                meaning: "你拥有实现目标所需的一切资源，现在是行动的时候。",
+                reversedMeaning: "你是否低估了自己的能力？或者在犹豫不决？相信自己，工具就在手边。",
+                image: "/images/moshushi.png"
+            },
+            {
+                name: "II. 女祭司",
+                keyword: "直觉",
+                meaning: "倾听内心的声音，答案就在你潜意识的深处。",
+                reversedMeaning: "暂时听不见内心的声音了吗？别急着向外寻找，先让自己静下来。",
+                image: "/images/nvjishi.png"
+            },
+            {
+                name: "III. 皇后",
+                keyword: "丰饶",
+                meaning: "享受生活的美好，去创造、去关爱，收获也是一种能力。",
+                reversedMeaning: "是否忽略了对自己的关爱？或者有些过度保护？给彼此一点呼吸的空间。",
+                image: "/images/nvhuang.png"
+            },
+            {
+                name: "IV. 皇帝",
+                keyword: "秩序",
+                meaning: "建立规则和结构，理性地掌控局面，承担起责任。",
+                reversedMeaning: "有时候太固执会让人疲惫，适度放权，弹性也是一种力量。",
+                image: "/images/huangdi.png"
+            },
+            {
+                name: "V. 教皇",
+                keyword: "指引",
+                meaning: "寻求传统智慧的帮助，或者成为他人的精神导师。",
+                reversedMeaning: "不必拘泥于陈规旧矩，试着打破常规，寻找适合你自己的那条路。",
+                image: "/images/jiaohuang.png"
+            },
+            {
+                name: "VI. 恋人",
+                keyword: "选择",
+                meaning: "跟随你的心，在关系中寻找和谐，做出忠于自我的决定。",
+                reversedMeaning: "现在的关系是否有些失衡？先爱自己，才能更好地爱别人。",
+                image: "/images/lianren.png"
+            },
+            {
+                name: "VII. 战车",
+                keyword: "意志",
+                meaning: "认准目标，克服相反的力量，胜利属于坚持到底的人。",
+                reversedMeaning: "感觉失去了方向控制？慢下来，重新调整导航，欲速则不达。",
+                image: "/images/zhanche.png"
+            },
+            {
+                name: "VIII. 力量",
+                keyword: "勇气",
+                meaning: "真正的力量是温柔的坚持，用耐心驯服内心的野兽。",
+                reversedMeaning: "不要怀疑自己的韧性，面对内心的软弱并不是坏事，那是温柔的开始。",
+                image: "/images/liliang.png"
+            },
+            {
+                name: "IX. 隐士",
+                keyword: "内省",
+                meaning: "暂时远离喧嚣，向内探索，寻找属于你自己的光。",
+                reversedMeaning: "`是不是一个人待太久了？试着走出洞穴，和外界建立一点连接吧。",
+                image: "/images/yinzhe.png"
+            },
+            {
+                name: "X. 命运之轮",
+                keyword: "转折",
+                meaning: "改变是永恒的，顺势而为，抓住出现在你面前的机会。",
+                reversedMeaning: "运气暂时不在你这边，但没关系，低谷正是蓄力反弹的好时机。",
+                image: "/images/mingyunzhilun.png"
+            },
+            {
+                name: "XI. 正义",
+                keyword: "因果",
+                meaning: "诚实面对真相，所有的决定都会带来相应的结果。",
+                reversedMeaning: "即使结果不尽如人意，也要问心无愧。对自己诚实，比什么都重要。",
+                image: "/images/zhengyi.png"
+            },
+            {
+                name: "XII. 倒吊人",
+                keyword: "换位",
+                meaning: "换一个角度看世界，有时候牺牲是为了更大的获得。",
+                reversedMeaning: "挣扎只会更累，不如彻底放松，换个角度看世界，也许心结就解开了。",
+                image: "/images/daodiaoren.png"
+            },
+            {
+                name: "XIII. 死神",
+                keyword: "新生",
+                meaning: "结束是为了新的开始，彻底告别过去，才能拥抱未来。",
+                reversedMeaning: "还在紧抓着过去不放吗？只有腾出双手，才能接住新的礼物。",
+                image: "/images/sishen.png"
+            },
+            {
+                name: "XIV. 节制",
+                keyword: "平衡",
+                meaning: "在极端之间寻找中庸之道，融合对立，通过耐心获得疗愈。",
+                reversedMeaning: "是不是有些失衡了？在这忙乱的世界里，找回你内心的节奏和中点。",
+                image: "/images/jiezhi.png"
+            },
+            {
+                name: "XV. 恶魔",
+                keyword: "束缚",
+                meaning: "觉察那些控制你的欲望或习惯，唯有觉知才能带来解脱。",
+                reversedMeaning: "别被眼前的诱惑蒙蔽，或者感觉被束缚。其实锁链是松的，你随时可以走。",
+                image: "/images/emo.png"
+            },
+            {
+                name: "XVI. 高塔",
+                keyword: "崩塌",
+                meaning: "不要害怕突如其来的剧变，它在摧毁虚假的根基，让你重建真实。",
+                reversedMeaning: "废墟中反而能看清地基。既然倒了，正好可以按照你真正想要的样子重建。",
+                image: "/images/ta.png"
+            },
+            {
+                name: "XVII. 星星",
+                keyword: "希望",
+                meaning: "黑暗之后必有星光，保持信心，未来充满治愈与灵感。",
+                reversedMeaning: "暂时看不见星星也没关系，它们还在那里。给自己一点信心，黎明就在前方。",
+                image: "/images/xingxing.png"
+            },
+            {
+                name: "XVIII. 月亮",
+                keyword: "幻象",
+                meaning: "直面内心的不安与迷茫，并非所有事情都如表象般真实。",
+                reversedMeaning: "恐惧只是长长的影子，别被它吓住。随着天亮，迷雾终会散去。",
+                image: "/images/yueliang.png"
+            },
+            {
+                name: "XIX. 太阳",
+                keyword: "喜悦",
+                meaning: "快乐、成功与活力，尽情地发光发热，享受当下的幸福。",
+                reversedMeaning: "乌云暂时遮住了阳光，但这只是暂时的。保持乐观，你心里的光谁也偷不走。",
+                image: "/images/taiyang.png"
+            },
+            {
+                name: "XX. 审判",
+                keyword: "觉醒",
+                meaning: "听到内心的召唤，回顾过往，做出决定，获得新生。",
+                reversedMeaning: "不要对他人的评价太敏感，也不要自我怀疑。如果你准备好了，就出发吧。",
+                image: "/images/shenpan.png"
+            },
+            {
+                name: "XXI. 世界",
+                keyword: "圆满",
+                meaning: "一段旅程的完美终点，成就感与整合，准备开始新的循环。",
+                reversedMeaning: "机遇还没完全成熟，再耐心一点点。检查一下还有什么细节没完成？",
+                image: "/images/shijie.png"
+            }
+        ]
+    },
+
+    onLoad: function () {
+        // 获取当前日期
+        const now = new Date();
+        const year = now.getFullYear();
+        const month = (now.getMonth() + 1).toString().padStart(2, '0');
+        const day = now.getDate().toString().padStart(2, '0');
+        const dateStr = `${year}-${month}-${day}`;
+
+        this.setData({
+            todayDate: dateStr
+        });
+
+        console.log('塔罗牌（完整版 22 张 + 逆位文案）已经洗好了...')
+    },
+
+    // --- 抽一张牌 ---
+    // --- 抽一张牌 ---
+    drawCard: function () {
+        const allCards = this.data.cardList;
+        const randomIndex = Math.floor(Math.random() * allCards.length);
+
+        // 1. 复制这张牌的数据（这也是为了安全，不弄脏牌库）
+        // Object.assign 是这一行特殊的复制魔法
+        const selected = Object.assign({}, allCards[randomIndex]);
+
+        // 2. 扔硬币：50% 概率决定是否逆位 (isReversed)
+        selected.isReversed = Math.random() >= 0.5;
+
+        // 3. 随机选择一个前缀
+        const prefixes = this.data.prefixList;
+        const randomPrefixIndex = Math.floor(Math.random() * prefixes.length);
+        const selectedPrefix = prefixes[randomPrefixIndex];
+
+        // 4. 拍桌子 (先盖着牌)
+        this.setData({
+            currentCard: selected,
+            isRevealed: false, // 刚抽的时候是盖着的
+            explanation: `${selectedPrefix}${selected.isReversed ? selected.reversedMeaning : selected.meaning}`
+        });
+
+        console.log("抽到了：", selected.name, selected.isReversed ? "逆位" : "正位");
+    },
+
+    // --- 翻牌动作 ---
+    revealCard: function () {
+        if (this.data.isRevealed) return; // 如果已经翻开了，就别动了
+
+        this.setData({
+            isRevealed: true
+        });
+    }
+})

pages/index/index.wxml

@@ -0,0 +1,49 @@
+<view class="container">
+  <view class="title-area">
+  <text class="app-title">塔罗 · 今日指引</text>
+  <text class="app-subtitle">📅 今日指引 · {{todayDate}}</text>
+  <text class="instruction" style="font-size: 14px; margin-top: 5px; opacity: 0.8; color: #ccc;">当你需要一个答案时</text>
+</view>
+
+  <!-- 标题区域 -->
+  <view class="header">
+    <text class="app-title">🔮 神秘塔罗 🔮</text>
+  </view>
+
+  <!-- 1. 抽卡前的状态：如果还没抽卡 (!currentCard)，显示这个 -->
+  <view class="intro" wx:if="{{!currentCard}}">
+    <text class="instruction">请静下心来，排除杂念</text>
+    <text class="instruction">默念你想询问的问题...</text>
+    <text class="instruction" style="font-size: 12px; margin-top: 20px; color: #666;">（点击下方按钮开始洗牌）</text>
+  </view>
+
+  <!-- 2. 抽卡后的状态：如果抽了卡 (currentCard)，显示这个 -->
+    <view class="card-display" wx:if="{{currentCard}}">
+        <view class="flip-scene" bindtap="revealCard">
+            <view class="flip-card {{isRevealed ? 'flipped' : ''}}">
+                <!-- A. 牌背 (正面朝上时显示) -->
+                <view class="card-face face-back">
+                    <image class="card-image" src="{{cardBackImage}}" mode="widthFix"></image>
+                    <text class="hint-text">👆 点击揭晓</text>
+                </view>
+
+                <!-- B. 牌面 (翻转后显示) -->
+                <view class="card-face face-front">
+                    <image class="card-image {{currentCard.isReversed ? 'reversed' : ''}}" src="{{currentCard.image}}" mode="widthFix"></image>
+                </view>
+            </view>
+        </view>
+    
+        <!-- 此处文字区域只在翻牌后显示，加一个淡入动画 -->
+        <view class="card-info {{isRevealed ? 'visible' : ''}}">
+            <text class="card-name">{{currentCard.name}} {{currentCard.isReversed ? '(逆位)' : ''}}</text>
+            <text class="card-meaning">{{explanation}}</text>
+        </view>
+  </view>
+
+  <!-- 3. 抽卡按钮：点击触发 drawCard -->
+  <button class="draw-btn" bindtap="drawCard" type="primary">
+    {{currentCard ? '重抽一张' : '✨ 抽一张塔罗牌'}}
+  </button>
+
+</view>

pages/index/index.wxss

@@ -0,0 +1,196 @@
+/* 让整个页面背景变黑，制造神秘感 */
+page {
+  background-color: #1a1a2e; /*以此颜色为底 */
+  min-height: 100%; /* 使用 min-height 允许滚动 */
+  box-sizing: border-box;
+}
+
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  /* 去掉 justify-content: center，防止内容过多时顶部被裁切 */
+  min-height: 100%;
+  padding: 15px; /* 减小内边距 */
+  padding-bottom: 40px; /* 底部预留空间，防止按钮太靠底 */
+  box-sizing: border-box;
+}
+
+/* 标题区域 */
+.title-area {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-bottom: 20px; /* 减小间距 */
+  margin-top: 10px;
+}
+
+.app-title {
+  font-size: 24px; /* 减小字号 */
+  color: #e94560; 
+  font-weight: bold;
+  letter-spacing: 2px;
+  margin-bottom: 5px; 
+}
+
+.app-subtitle {
+  display: block;
+  font-size: 16px; /* 减小字号 */
+  color: #fff; 
+  margin-bottom: 5px;
+  font-weight: bold;
+}
+
+/* 还没抽卡时的提示字 */
+.intro {
+  text-align: center;
+  margin-bottom: 30px;
+}
+
+.instruction {
+  display: block;
+  color: #fff;
+  font-size: 14px;
+  margin-bottom: 8px;
+  opacity: 0.8;
+}
+
+/* 卡牌展示出的框框 */
+.card-display {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background-color: #16213e;
+  padding: 15px; /* 减小内边距 */
+  border-radius: 12px;
+  box-shadow: 0 0 15px rgba(233, 69, 96, 0.3); 
+  margin-bottom: 20px; /* 减小间距 */
+  /* width: 90%;  保持这一行，或者在下面的 flip-scene 里控制宽度 */
+}
+
+/* --- 翻牌动画核心样式 --- */
+
+/* 1. 场景容器：提供 3D 景深 */
+.flip-scene {
+  width: 200px; /* 限制宽度，根据具体图片比例调整 */
+  height: 333px; /* 假设图片比例 3:5，根据实际显示调整 */
+  perspective: 1000px;
+  margin-bottom: 20px;
+  position: relative; /* 让提示文字可以定位 */
+}
+
+/* 2. 翻转实体：包含正反两面，执行旋转 */
+.flip-card {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  transition: transform 0.6s; /* 复位时使用普通过渡 */
+  transform-style: preserve-3d;
+}
+
+/* 定义呼吸翻牌关键帧 - 疗愈版 */
+@keyframes breathFlip {
+  0% { transform: scale(1) rotateY(0deg); }
+  35% { transform: scale(0.97) rotateY(0deg); } /* 缓慢吸气 */
+  60% { transform: scale(1.02) rotateY(0deg); } /* 连贯呼气 */
+  100% { transform: scale(1) rotateY(180deg); } /* 稳步翻转 */
+}
+
+/* 翻转状态：应用动画 */
+.flip-card.flipped {
+  /* 延长到 1.8s，使用更舒缓的贝塞尔曲线 */
+  animation: breathFlip 1.8s cubic-bezier(0.3, 0.0, 0.4, 1) forwards;
+}
+
+/* 3. 正反面公共样式 */
+.card-face {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  backface-visibility: hidden; /* 背面不可见 */
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  border-radius: 12px;
+  overflow: hidden; /* 防止图片溢出圆角 */
+}
+
+/* 背面（Face Back）：初始正面朝上，旋转 0 度 */
+.face-back {
+  background-color: #16213e;
+  transform: rotateY(0deg);
+  z-index: 2;
+}
+
+/* 正面（Face Front）：初始背面朝上，预先旋 180 度 */
+.face-front {
+  background-color: #16213e;
+  transform: rotateY(180deg);
+}
+
+/* 图片填满容器 */
+.card-image {
+  width: 100%;
+  height: 100%; 
+  display: block; /* 消除图片底部缝隙 */
+}
+
+/* 提示点击的文字 */
+.hint-text {
+  position: absolute;
+  bottom: 20px;
+  color: #fff;
+  font-size: 14px;
+  background-color: rgba(0,0,0,0.5);
+  padding: 5px 10px;
+  border-radius: 15px;
+  z-index: 3;
+}
+
+/* --- 文字信息淡入动画 --- */
+.card-info {
+  opacity: 0;
+  transform: translateY(20px);
+  /* 配合 1.8s 的总时长，延迟到 1.0s 左右开始浮现 */
+  transition: opacity 0.8s ease 1.0s, transform 0.8s ease 1.0s; 
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.card-info.visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+.card-name {
+  color: #e94560;
+  font-size: 20px;
+  font-weight: bold;
+  margin-bottom: 5px;
+}
+
+.card-meaning {
+  color: #fff;
+  font-size: 14px;
+  text-align: center;
+  line-height: 1.4;
+}
+
+/* 按钮稍微美化一下 */
+.draw-btn {
+  background-color: #0f3460 !important;
+  border: 1px solid #e94560 !important;
+  color: #fff !important;
+  width: 65% !important;
+  border-radius: 25px;
+  font-size: 16px !important;
+  padding: 8px 0 !important;
+}
+
+/* 逆位时的图片样式：旋转 180 度 */
+.card-image.reversed {
+  transform: rotate(180deg);
+  transition: transform 0.5s; 
+}

project.config.json

@@ -0,0 +1,38 @@
+{
+  "description": "我的第一个小程序",
+  "setting": {
+    "urlCheck": false,
+    "es6": true,
+    "postcss": true,
+    "minified": true,
+    "compileWorklet": false,
+    "uglifyFileName": false,
+    "uploadWithSourceMap": true,
+    "enhance": false,
+    "packNpmManually": false,
+    "packNpmRelationList": [],
+    "minifyWXSS": true,
+    "minifyWXML": true,
+    "localPlugins": false,
+    "disableUseStrict": false,
+    "useCompilerPlugins": false,
+    "condition": false,
+    "swc": false,
+    "disableSWC": true,
+    "babelSetting": {
+      "ignore": [],
+      "disablePlugins": [],
+      "outputPath": ""
+    }
+  },
+  "compileType": "miniprogram",
+  "libVersion": "3.14.0",
+  "appid": "wx16a275637dbd4603",
+  "projectname": "my-first-mini-program",
+  "simulatorPluginLibVersion": {},
+  "packOptions": {
+    "ignore": [],
+    "include": []
+  },
+  "editorSetting": {}
+}

project.private.config.json

@@ -0,0 +1,21 @@
+{
+  "libVersion": "3.14.0",
+  "projectname": "I%20code",
+  "setting": {
+    "urlCheck": false,
+    "coverView": false,
+    "lazyloadPlaceholderEnable": false,
+    "skylineRenderEnable": false,
+    "preloadBackgroundData": false,
+    "autoAudits": false,
+    "useApiHook": true,
+    "showShadowRootInWxmlPanel": false,
+    "useStaticServer": false,
+    "useLanDebug": false,
+    "showES6CompileOption": false,
+    "compileHotReLoad": true,
+    "checkInvalidKey": true,
+    "ignoreDevUnusedFiles": true,
+    "bigPackageSizeSupport": false
+  }
+}

sitemap.json

@@ -0,0 +1,9 @@
+{
+    "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
+    "rules": [
+        {
+            "action": "allow",
+            "page": "*"
+        }
+    ]
+}