jack/yuxingu-Miniprogram-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 愈心魔方 Tab 与首页入口改版

Browse Source 
新增愈心魔方 WebView Tab、首页魔方横幅与四宫格入口（心理测评/咨询/情绪压力评估/就医保障）；H5 地址配置于 yxgConfig.js。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
jackyu66git
2026-08-25 00:41:14 +08:00
co-authored by Cursor
parent c3c9db3151
commit 69d9825b63
14 changed files with 227 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DEPLOY.md
+37
View File
@@ -0,0 +1,37 @@
# 愈心谷小程序部署说明
完整文档（含 H5、Go API、Nginx、微信后台配置）见 monorepo：
**[`digital-psychology/docs/DEPLOY-MINI-PROGRAM-H5.md`](../digital-psychology/docs/DEPLOY-MINI-PROGRAM-H5.md)**
---
## 本仓库快速步骤
### 1. 确认 H5 已部署
生产 H5 必须可访问：
```text
https://h5.yuxingu.com.cn/psy/?mp=1
```
地址配置：`util/yxgConfig.js`
### 2. HBuilderX 发行
1. 打开本项目
2. **发行 → 小程序-微信**
3. 微信开发者工具打开 `unpackage/dist/build/mp-weixin/`
4. 上传体验版 / 提交审核
### 3. 微信后台
- **业务域名**：`h5.yuxingu.com.cn`
- **request 合法域名**：`miniapp.yuxingu.com.cn`、`h5.yuxingu.com.cn`
### 4. 验收
- 首页紫色「愈心魔方」条 → 切 Tab 加载 H5
- 底部 Tab：**首页 | 愈心魔方 | 心理咨询 | 心理测评 | 我的**
- 咨询/测评仍正常（`miniapp.yuxingu.com.cn`）
package-lock.json
Generated
+1 -1
View File
@@ -1,5 +1,5 @@
{
"name": "yuxingu-miniprogram",
"name": "yuxingu-Miniprogram-dev",
"lockfileVersion": 3,
"requires": true,
"packages": {
pages.json
+12
View File
@@ -6,6 +6,12 @@
"navigationBarTitleText": "愈心谷"
}
},
{
"path": "pages/yxg-magic/index",
"style": {
"navigationBarTitleText": "愈心魔方"
}
},
{
"path": "pages/healing/healing-list",
"style": {
@@ -183,6 +189,12 @@
"pagePath": "pages/index/index",
"text": "首页"
},
{
"iconPath": "./static/n-menu/mf-n.png",
"selectedIconPath": "./static/n-menu/mf-c.png",
"pagePath": "pages/yxg-magic/index",
"text": "愈心魔方"
},
{
"iconPath": "./static/n-menu/zx-n.png",
"selectedIconPath": "./static/n-menu/zx-c.png",
pages/index/index.vue
+152 -15
View File
@@ -20,6 +20,17 @@
</swiper>
</uni-swiper-dot>
</view>
<view class="yxg-magic-entry" @click="toYxgMagic">
<view class="yxg-magic-banner-wrap">
<image
class="yxg-magic-banner"
src="/static/n-main/yxg-magic-cube.jpg"
mode="widthFix"
></image>
<text class="yxg-magic-title">愈心魔方</text>
</view>
<text class="yxg-magic-desc">数字魔方、亲子魔方、艺术魔方、急救魔方、情感魔方、成长魔方、解构魔方</text>
</view>
<view
style="width: 670rpx;display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx;">
<!-- 左边部分 -->
@@ -27,16 +38,19 @@
background: linear-gradient(180deg, #FFE6DF 2%, #FCF3EA 100%);
box-sizing: border-box;
display: flex;
align-items: center;
padding-right: 36rpx;
" @click="toTestList">
<view style="display: flex;flex-direction: column;margin-top: 26rpx;">
<text style="margin-left: 26rpx;color: #614D49;
<view style="display: flex;flex-direction: column;flex: 1;min-width: 0;justify-content: center;margin-left: 20rpx;">
<text style="color: #614D49;
font-family: SourceHanSansBold;font-variation-settings: 'opsz' auto;
font-size: 30rpx;
line-height: normal;
letter-spacing: 0px;">
line-height: 1.2;
letter-spacing: 0px;
white-space: nowrap;">
心理测评
</text>
<text style="margin-left: 26rpx;color: #B88973;
<text style="margin-top: 8rpx;color: #B88973;
font-family: SourceHanSans;ont-variation-settings: 'opsz' auto;
font-size: 24rpx;
font-weight: normal;
@@ -45,24 +59,27 @@
探寻自我
</text>
</view>
<image src="/static/n-main/left.png"
style="margin-top:50rpx;width: 90rpx;margin-left: 70rpx;height: 90rpx;"></image>
<image src="/static/n-main/icon-emotion-assess.png"
style="flex-shrink: 0;width: 90rpx;height: 90rpx;margin-left: 6rpx;"></image>
</view>
<!-- 右边部分 -->
<view style="width: 324rpx;height: 168rpx;border-radius: 10rpx;
background: linear-gradient(180deg, #FFE6DF 2%, #FCF3EA 100%);
box-sizing: border-box;
display: flex;
align-items: center;
padding-right: 36rpx;
" @click="toZxList">
<view style="display: flex;flex-direction: column;margin-top: 26rpx;">
<text style="margin-left: 26rpx;color: #614D49;
<view style="display: flex;flex-direction: column;flex: 1;min-width: 0;justify-content: center;margin-left: 20rpx;">
<text style="color: #614D49;
font-family: SourceHanSansBold;font-variation-settings: 'opsz' auto;
font-size: 30rpx;
line-height: normal;
letter-spacing: 0px;">
letter-spacing: 0px;
white-space: nowrap;">
心理咨询
</text>
<text style="margin-left: 26rpx;color: #B88973;
<text style="margin-top: 8rpx;color: #B88973;
font-family: SourceHanSans;ont-variation-settings: 'opsz' auto;
font-size: 24rpx;
font-weight: normal;
@@ -71,8 +88,67 @@
严选咨询师
</text>
</view>
<image src="/static/n-main/right.png"
style="margin-top:58rpx;width: 82rpx;margin-left: 70rpx;height: 82rpx;"></image>
<image src="/static/n-main/icon-consult.png"
style="flex-shrink: 0;width: 82rpx;height: 82rpx;margin-left: 6rpx;"></image>
</view>
</view>
<view
style="width: 670rpx;display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx;">
<view style="width: 324rpx;height: 168rpx;border-radius: 10rpx;
background: linear-gradient(180deg, #FFE6DF 2%, #FCF3EA 100%);
box-sizing: border-box;
display: flex;
align-items: center;
padding-right: 36rpx;
" @click="toBioelectric">
<view style="display: flex;flex-direction: column;flex: 1;min-width: 0;justify-content: center;margin-left: 20rpx;">
<text style="color: #614D49;
font-family: SourceHanSansBold;font-variation-settings: 'opsz' auto;
font-size: 30rpx;
line-height: normal;
letter-spacing: 0px;
white-space: nowrap;">
情绪压力评估
</text>
<text style="margin-top: 8rpx;color: #B88973;
font-family: SourceHanSans;ont-variation-settings: 'opsz' auto;
font-size: 24rpx;
font-weight: normal;
line-height: normal;
letter-spacing: 0px;">
脑机检测
</text>
</view>
<image src="/static/n-main/icon-bioelectric.png"
style="flex-shrink: 0;width: 90rpx;height: 90rpx;margin-left: 6rpx;"></image>
</view>
<view style="width: 324rpx;height: 168rpx;border-radius: 10rpx;
background: linear-gradient(180deg, #FFE6DF 2%, #FCF3EA 100%);
box-sizing: border-box;
display: flex;
align-items: center;
padding-right: 36rpx;
" @click="toMedicalService">
<view style="display: flex;flex-direction: column;flex: 1;min-width: 0;justify-content: center;margin-left: 20rpx;">
<text style="color: #614D49;
font-family: SourceHanSansBold;font-variation-settings: 'opsz' auto;
font-size: 30rpx;
line-height: normal;
letter-spacing: 0px;
white-space: nowrap;">
就医保障
</text>
<text style="margin-top: 8rpx;color: #B88973;
font-family: SourceHanSans;ont-variation-settings: 'opsz' auto;
font-size: 24rpx;
font-weight: normal;
line-height: normal;
letter-spacing: 0px;">
绿色就医
</text>
</view>
<image src="/static/n-main/icon-medical.png"
style="flex-shrink: 0;width: 82rpx;height: 82rpx;margin-left: 6rpx;"></image>
</view>
</view>
@@ -622,6 +698,26 @@
"animationType": "pop-in"
})
}
const toYxgMagic = () => {
uni.switchTab({
url: '/pages/yxg-magic/index'
})
}
const toMedicalService = () => {
uni.showToast({
title: '就医保障即将上线',
icon: 'none'
})
}
const toBioelectric = () => {
uni.showToast({
title: '情绪压力评估即将上线',
icon: 'none'
})
}
</script>
<style scoped>
@@ -640,13 +736,54 @@
background-position: center;
background-repeat: no-repeat;
width: 750rpx;
height: 660rpx;
min-height: 660rpx;
padding-bottom: 24rpx;
display: flex;
flex-direction: column;
justify-content: center;
justify-content: flex-start;
align-items: center;
}
.yxg-magic-entry {
width: 670rpx;
margin-top: 20rpx;
}
.yxg-magic-banner-wrap {
position: relative;
border-radius: 10rpx;
overflow: hidden;
}
.yxg-magic-banner {
width: 670rpx;
display: block;
border-radius: 10rpx;
}
.yxg-magic-title {
position: absolute;
top: 20rpx;
left: 24rpx;
color: #ffffff;
font-family: SourceHanSansBold;
font-size: 32rpx;
line-height: 1.2;
z-index: 1;
text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.28);
}
.yxg-magic-desc {
display: block;
margin-top: 12rpx;
padding: 0 4rpx;
color: #9B918C;
font-family: SourceHanSans;
font-size: 24rpx;
line-height: 1.55;
letter-spacing: 0.5rpx;
}
.choce-view {
display: flex;
pages/webview-page/webview-page.vue
+13
View File
@@ -0,0 +1,13 @@
<template>
<web-view :src="url"></web-view>
</template>
<script setup>
const url = ref('')
onLoad((options) => {
if (options.url) {
url.value = decodeURIComponent(options.url)
}
})
</script>
pages/yxg-magic/index.vue
+9
View File
@@ -0,0 +1,9 @@
<template>
<web-view :src="h5Url"></web-view>
</template>
<script setup>
import { YXG_H5_HOME_URL } from '@/util/yxgConfig.js'
const h5Url = YXG_H5_HOME_URL
</script>
static/n-main/icon-bioelectric.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

static/n-main/icon-consult.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

static/n-main/icon-emotion-assess.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.8 KiB

static/n-main/icon-medical.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

static/n-main/yxg-magic-cube.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 357 KiB

static/n-menu/mf-c.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

static/n-menu/mf-n.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

util/yxgConfig.js
+3
View File
@@ -0,0 +1,3 @@
/** 愈心魔方 H5（digital-psychology user-h5） */
export const YXG_H5_BASE = 'https://h5.yuxingu.com.cn/psy/'
export const YXG_H5_HOME_URL = `${YXG_H5_BASE}?mp=1`