Skip to content

飞
飞鹤小程序
Commit 17d20f25 authored by chenkai1's avatar chenkai1
Browse files
Options

Merge branch 'feature/fh_gaiban' of http://gitlab2.dui88.com/fh/20250528_FHQ1... 

Merge branch 'feature/fh_gaiban' of http://gitlab2.dui88.com/fh/20250528_FHQ1 into feature/fh_gaiban

# Conflicts:
#	mock/home.json
#	views/Home.vue
parents 165d02d5 93242848
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 3673 additions and 1813 deletions
.DS_Store
View file @ 17d20f25
No preview for this file type
api/request.js
View file @ 17d20f25
...@@ -25,9 +25,9 @@ const request = (options = {}) => { ...@@ -25,9 +25,9 @@ const request = (options = {}) => {
// 例如： // 例如：
// options.header = { // options.header = {
// "Content-Type": "application/x-www-form-urlencoded" // "Content-Type": "application/x-www-form-urlencoded"
// } // }
// if(options.url == '/c/ai/chat/query'){ // if(options.url == '/c/ai/chat/query'){
// baseUrl = "https://docs.dui88.com/mock/1956"; // baseUrl = "https://docs.dui88.com/mock/1956";
// } // }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
uni uni
......
components/ScrollableTabs.vue 0 → 100644
View file @ 17d20f25
<template>
<view class="scrollable-tabs">
<scroll-view
class="tabs-scroll"
scroll-x="true"
show-scrollbar="false"
:scroll-into-view="'tab-' + currentIndex"
:scroll-with-animation="true"
>
<view class="tabs-container">
<view
v-for="(item, index) in tabs"
:key="index"
:id="'tab-' + index"
class="tab-item"
:class="{ 'tab-active': currentIndex === index }"
@tap="handleTabClick(index)"
>
{{ item }}
</view>
</view>
</scroll-view>
</view>
</template>
<script setup>
import { defineProps, defineEmits } from 'vue'
const props = defineProps({
tabs: {
type: Array,
default: () => []
},
currentIndex: {
type: Number,
default: 0
}
})
const emit = defineEmits(['change'])
const handleTabClick = (index) => {
emit('change', index)
}
</script>
<style lang="less" scoped>
.scrollable-tabs {
width: 100%;
.tabs-scroll {
width: 100%;
white-space: nowrap;
.tabs-container {
display: flex;
align-items: center;
padding: 0 20rpx;
min-width: 100%;
.tab-item {
color: #333;
background-color: #e9edf1;
padding: 15rpx 20rpx;
font-size: 22rpx;
margin-right: 15rpx;
border-radius: 30rpx;
flex-shrink: 0;
white-space: nowrap;
transition: all 0.3s ease;
&:last-child {
margin-right: 0;
}
&.tab-active {
color: white;
background-color: #D3A358;
}
}
}
}
}
/* 响应式设计 */
@media screen and (max-width: 750rpx) {
.scrollable-tabs {
.tabs-scroll {
.tabs-container {
.tab-item {
padding: 12rpx 16rpx;
font-size: 20rpx;
margin-right: 12rpx;
}
}
}
}
}
</style>
\ No newline at end of file
docs/可滚动标签实现指南.md 0 → 100644
View file @ 17d20f25
# 可滚动标签实现指南
## 问题描述
当标签项（tabitem）总宽度超出父容器宽度时，需要实现左右滑动功能，让用户能够查看所有标签。
## 解决方案
### 方案一：修改现有代码（已实现）
#### 1. 修改模板结构
```vue
<scroll-view class="listbox" scroll-x="true" show-scrollbar="false" :scroll-into-view="'tab-' + channelTabIndex">
<view class="tab-container">
<view
v-for="(item, index) in productTabList"
:key="index"
:id="'tab-' + index"
:class="channelTabIndex === index ? 'tabitem tabActive' : 'tabitem'"
@tap="channelTabHandler(index, $event)"
>
{{ item }}
</view>
</view>
</scroll-view>
```
#### 2. 修改样式
```css
.listbox {
margin-top: 15rpx;
width: 686rpx;
white-space: nowrap;
.tab-container {
display: flex;
align-items: center;
padding: 0 20rpx;
min-width: 100%;
.tabitem {
color: @color-black-deep;
background-color: #e9edf1;
padding: 15rpx 20rpx;
font-size: 22rpx;
margin-right: 15rpx;
border-radius: 30rpx;
flex-shrink: 0; /* 防止压缩 */
white-space: nowrap; /* 防止换行 */
&:last-child {
margin-right: 0;
}
}
.tabActive {
color: white;
background-color: @color-gold-main;
}
}
}
```
### 方案二：使用可复用组件（推荐）
#### 1. 使用 ScrollableTabs 组件
```vue
<template>
<view class="productcontai">
<text class="maintitle">{{ erqiPeizhi.title1 }}</text>
<ScrollableTabs
:tabs="productTabList"
:currentIndex="channelTabIndex"
@change="handleTabChange"
/>
</view>
</template>
<script setup>
import ScrollableTabs from '../components/ScrollableTabs.vue'
const handleTabChange = (index) => {
channelTabIndex.value = index
}
</script>
```
## 关键属性说明
### 1. scroll-view 属性
```vue
<scroll-view
scroll-x="true" <!-- 启用横向滚动 -->
show-scrollbar="false" <!-- 隐藏滚动条 -->
:scroll-into-view="'tab-' + currentIndex" <!-- 自动滚动到指定元素 -->
:scroll-with-animation="true" <!-- 启用滚动动画 -->
>
```
### 2. 样式关键属性
```css
/* 容器样式 */
.listbox {
white-space: nowrap; /* 防止换行 */
}
.tab-container {
display: flex; /* 弹性布局 */
min-width: 100%; /* 最小宽度 */
padding: 0 20rpx; /* 左右内边距 */
}
.tabitem {
flex-shrink: 0; /* 防止压缩 */
white-space: nowrap; /* 防止换行 */
margin-right: 15rpx; /* 右边距 */
}
```
## 实现效果
### 功能特性
- ✅ 支持横向滚动
- ✅ 自动滚动到选中项
- ✅ 隐藏滚动条
- ✅ 平滑滚动动画
- ✅ 响应式设计
- ✅ 防止标签压缩
### 用户体验
- 当标签总宽度超出容器时，可以左右滑动查看
- 点击标签时自动滚动到可见区域
- 滚动过程平滑自然
- 适配不同屏幕尺寸
## 最佳实践
### 1. 标签间距设置
```css
.tabitem {
margin-right: 15rpx; /* 标签间距 */
&:last-child {
margin-right: 0; /* 最后一个标签无右边距 */
}
}
```
### 2. 容器内边距
```css
.tab-container {
padding: 0 20rpx; /* 左右留出空间 */
}
```
### 3. 防止压缩
```css
.tabitem {
flex-shrink: 0; /* 防止标签被压缩 */
white-space: nowrap; /* 防止文字换行 */
}
```
### 4. 自动滚动
```vue
:scroll-into-view="'tab-' + currentIndex"
```
## 常见问题解决
### 1. 滚动不生效
- 检查 `scroll-x="true"` 是否设置
- 确认容器宽度小于内容宽度
- 检查 `flex-shrink: 0` 是否设置
### 2. 标签被压缩
- 添加 `flex-shrink: 0`
- 设置 `white-space: nowrap`
### 3. 滚动条显示
- 设置 `show-scrollbar="false"`
### 4. 自动滚动不工作
- 确认 `scroll-into-view` 的 ID 正确
- 检查元素 ID 是否唯一
## 响应式设计
### 移动端优化
```css
@media screen and (max-width: 750rpx) {
.tabitem {
padding: 12rpx 16rpx; /* 减小内边距 */
font-size: 20rpx; /* 减小字体 */
margin-right: 12rpx; /* 减小间距 */
}
}
```
### 平板端优化
```css
@media screen and (min-width: 751rpx) and (max-width: 1024rpx) {
.tab-container {
padding: 0 30rpx; /* 增加内边距 */
}
}
```
## 性能优化
### 1. 使用 transform 动画
```css
.tabitem {
transition: all 0.3s ease;
}
```
### 2. 避免频繁重绘
```css
.tab-container {
will-change: transform; /* 优化滚动性能 */
}
```
### 3. 合理设置滚动阈值
```vue
<scroll-view
:scroll-into-view="shouldScroll ? 'tab-' + currentIndex : ''"
>
```
## 总结
通过以上实现，标签列表现在支持：
1. **横向滚动**：当标签总宽度超出容器时自动启用
2. **自动定位**：点击标签时自动滚动到可见区域
3. **平滑动画**：滚动过程自然流畅
4. **响应式设计**：适配不同屏幕尺寸
5. **性能优化**：避免不必要的重绘和计算
这种实现方式既保持了原有功能，又提供了更好的用户体验，特别适合标签数量较多或标签文字较长的场景。
\ No newline at end of file
pages.json
View file @ 17d20f25
{ {
"pages": [ "pages": [
{ {
"path": "pages/index/index", "path": "pages/index/index",
"style": { "style": {
...@@ -22,7 +22,6 @@ ...@@ -22,7 +22,6 @@
} }
}, },
{ {
"path": "pages/search/search", "path": "pages/search/search",
"style": { "style": {
"navigationStyle": "custom", "navigationStyle": "custom",
...@@ -33,12 +32,11 @@ ...@@ -33,12 +32,11 @@
} }
}, },
{ {
"path" : "pages/product/product", "path": "pages/product/product",
"style" : "style": {
{ "navigationBarTitleText": "",
"navigationBarTitleText": "", "navigationBarBackgroundColor": "#ffffff",
"navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black"
"navigationBarTextStyle": "black"
} }
}, },
{ {
...@@ -48,42 +46,44 @@ ...@@ -48,42 +46,44 @@
} }
}, },
{ {
"path" : "pages/goodsDetail/goodsDetail", "path": "pages/goodsDetail/goodsDetail",
"style" : "style": {
{ "navigationBarTitleText": ""
"navigationBarTitleText" : ""
} }
}, },
{ {
"path" : "pages/rightsDetail/rightsDetail", "path": "pages/rightsDetail/rightsDetail",
"style" : "style": {
{ "navigationBarTitleText": ""
"navigationBarTitleText" : ""
} }
}, },
{ {
"path" : "pages/naming/naming", "path": "pages/naming/naming",
"style" : "style": {
{ "navigationBarTitleText": "宝宝取名",
"navigationBarTitleText" : "宝宝取名", "enablePullDownRefresh": false,
"enablePullDownRefresh" : false,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
{ {
"path" : "pages/naming/namingResult", "path": "pages/naming/namingResult",
"style" : "style": {
{ "navigationBarTitleText": "AI-宝宝取名",
"navigationBarTitleText" : "AI-宝宝取名", "enablePullDownRefresh": false,
"enablePullDownRefresh" : false,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
{ {
"path" : "pages/expertTeamPage/expertTeamPage", "path": "pages/expertTeamPage/expertTeamPage",
"style" : "style": {
{ "navigationBarTitleText": ""
"navigationBarTitleText" : "" }
},
{
"path": "pages/syWebview/syWebview",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom"
} }
} }
], ],
...@@ -93,7 +93,6 @@ ...@@ -93,7 +93,6 @@
"navigationBarBackgroundColor": "#F8F8F8", "navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8", "backgroundColor": "#F8F8F8",
"navigationStyle": "default" "navigationStyle": "default"
}, },
"uniIdRouter": {} "uniIdRouter": {}
} }
\ No newline at end of file
pages/syWebview/syWebview.vue 0 → 100644
View file @ 17d20f25
<!--
Webview页面使用说明：
1. 基本使用：
uni.navigateTo({
url: '/pages/syWebview/syWebview?url=' + encodeURIComponent('https://example.com')
});
2. 带标题的使用：
uni.navigateTo({
url: '/pages/syWebview/syWebview?url=' + encodeURIComponent('https://example.com') + '&title=' + encodeURIComponent('页面标题')
});
3. 分享功能：
- 页面会自动接收webview发送的消息
- 消息格式：{ title: '标题', link: '链接', imgUrl: '图片', desc: '描述' }
- 支持数组格式：[{ title: '标题', link: '链接', imgUrl: '图片', desc: '描述' }]
4. 分享数据示例：
{
title: '分享标题',
link: 'https://example.com/share',
imgUrl: 'https://example.com/image.jpg',
desc: '分享描述'
}
-->
<template>
<view class="webview-container">
<!-- Webview内容 -->
<web-view :src="webviewUrl" @message="getMessage" @load="onWebviewLoad" @error="onWebviewError"
class="webview-content"></web-view>
</view>
</template>
<script>
import { useUserStore } from '@/stores/user.js';
import { useGlobalStore } from '../../stores/global';
export default {
data() {
return {
statusBarHeight: 0,
webviewUrl: '',
pageTitle: '加载中...',
share: null, // 分享数据
pageOptions: {} // 页面参数
}
},
async onLoad(options) {
// 获取状态栏高度
const systemInfo = uni.getSystemInfoSync();
this.statusBarHeight = systemInfo.statusBarHeight || 0;
// 确保登录以获取 cuk（异步回调，可能未立即生效）
await this.wxAutoLogin();
// 固定写死的 URL（不从 options 读取 baseUrl）
const baseUrl = 'https://25niansuyuan.feihe.com/projects/Firmus/dev/index';
const store = useGlobalStore();
const cuk = store.cuk || uni.getStorageSync('cuk');
// 可选：设置页面标题（不从 params 移除，仍然透传到 H5）
if (options && options.title) {
try { this.pageTitle = decodeURIComponent(options.title); } catch (_) { this.pageTitle = options.title; }
}
// 将 options 的所有参数原样作为查询参数传给 H5，并补齐 cuk
const params = { ...(options || {}) };
if (cuk && !params.cuk) params.cuk = cuk;
const paramStr = Object.keys(params)
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
.join('&');
this.webviewUrl = paramStr
? baseUrl + (baseUrl.includes('?') ? '&' : '?') + paramStr
: baseUrl;
console.log('Webview页面加载，URL:', this.webviewUrl);
},
onShareAppMessage(options) {
// 分享功能
const { share } = this;
console.warn(share?.link, "share.link--------", JSON.stringify(options));
if (share) {
const shareurl = share.link;
return {
title: share.title,
path: shareurl,
imageUrl: share.imgUrl || '',
success: function (res) {
console.log(res, '分享成功');
uni.showToast({
title: '分享成功',
icon: 'success'
});
},
fail: function (res) {
console.log(res, '分享失败');
uni.showToast({
title: '分享失败',
icon: 'none'
});
},
complete: function (res) {
console.log(res, '分享完成');
}
};
}
},
methods: {
// 登录获取 cuk
async wxAutoLogin() {
const userStore = useUserStore();
await userStore.wxAutoLogin();
},
// 接收webview消息
getMessage(e) {
const {
data
} = e.detail;
console.log(data, "data")
if (data) {
this.share = data[data.length - 1]
}
},
// Webview加载完成
onWebviewLoad(e) {
console.log('Webview加载完成:', e);
if (this.pageTitle === '加载中...') {
this.pageTitle = '网页';
}
},
// Webview加载错误
onWebviewError(e) {
console.error('Webview加载错误:', e);
uni.showToast({
title: '页面加载失败',
icon: 'none'
});
},
// 返回上一页
goBack() {
uni.navigateBack({
delta: 1
});
}
}
}
</script>
<style lang="less" scoped>
.webview-container {
width: 100%;
height: 100vh;
display: flex;
flex-direction: column;
background-color: #fff;
}
.webview-content {
flex: 1;
width: 100%;
}
</style>
stores/home.js
View file @ 17d20f25
...@@ -9,6 +9,7 @@ export const useHomeStore = defineStore("homeInfo", { ...@@ -9,6 +9,7 @@ export const useHomeStore = defineStore("homeInfo", {
homeInfo: null, homeInfo: null,
isLogin: false, isLogin: false,
babyExistence: false, babyExistence: false,
hasShownPopup: false, // 记录是否已经显示过弹窗（全局状态）
}; };
}, },
actions: { actions: {
...@@ -30,6 +31,20 @@ export const useHomeStore = defineStore("homeInfo", { ...@@ -30,6 +31,20 @@ export const useHomeStore = defineStore("homeInfo", {
this.babyExistence = !babyExistence; this.babyExistence = !babyExistence;
}, },
/**
* 标记弹窗已显示
*/
markPopupAsShown() {
this.hasShownPopup = true;
},
/**
* 重置弹窗状态（用于测试或特殊需求）
*/
resetPopupState() {
this.hasShownPopup = false;
},
/** /**
* 获取首页信息 * 获取首页信息
*/ */
...@@ -38,8 +53,9 @@ export const useHomeStore = defineStore("homeInfo", { ...@@ -38,8 +53,9 @@ export const useHomeStore = defineStore("homeInfo", {
console.log("loadHomeInfo", data); console.log("loadHomeInfo", data);
if (data) { if (data) {
this.setHomeInfo(data); this.setHomeInfo(data);
// 通过参数传入的方式使用 $sensors
// 通过参数传入的方式使用 $sensors
this.hasShownPopup = false
const userStore = useUserStore(); const userStore = useUserStore();
const mdData = { const mdData = {
......
stores/pageCfg.js
View file @ 17d20f25
This diff is collapsed.
views/Brand.vue
View file @ 17d20f25
This diff is collapsed.
views/Home.vue
View file @ 17d20f25
This diff is collapsed.
views/Integral.vue
View file @ 17d20f25
...@@ -288,7 +288,7 @@ ...@@ -288,7 +288,7 @@
> >
<!-- <image <!-- <image
class="goods-img-bg"productIdUrl class="goods-img-bg"productIdUrl
:src="$baseUrl + `integral/1013/listItemImgBg.png`" :src="$baseUrl + `integral/1008/listItemImgBg.png`"
mode="aspectFit" mode="aspectFit"
/> --> /> -->
<view class="goods-item-container" @click="handleGoodsItemClick('xingpin',i)"> <view class="goods-item-container" @click="handleGoodsItemClick('xingpin',i)">
...@@ -413,11 +413,11 @@ ...@@ -413,11 +413,11 @@
const integralData = ref({ const integralData = ref({
"tupianBanben": "1013", "tupianBanben": "1008",
"swiper": [ "swiper": [
{ {
"bannerImg": "integralBannerBg0.png", "bannerImg": "integralBannerBg0.png",
"url": "subPackages/shopMainList/topicNew/index?id=1001057", "url": "subPackages/shopMainList/topicNew/index?id=1000916",
"type": 2, "type": 2,
"extra": { "extra": {
"appId": "wx4205ec55b793245e", "appId": "wx4205ec55b793245e",
...@@ -594,9 +594,10 @@ ...@@ -594,9 +594,10 @@
} }
] ]
}, },
"vipActive": [{ "vipActive": [
{
"img": "vipAct0.png", "img": "vipAct0.png",
"url": "subPackages/shopMainList/topicNew/index?id=1001057", "url": "subPackages/shopMainList/topicNew/index?id=1000911",
"type": 2, "type": 2,
"extra": { "extra": {
"appId": "wx4205ec55b793245e", "appId": "wx4205ec55b793245e",
...@@ -624,7 +625,7 @@ ...@@ -624,7 +625,7 @@
], ],
"goodsListData": { "goodsListData": {
"listCommon": { "listCommon": {
"listItemImgBg": "integral/1013/listItemImgBg.png" "listItemImgBg": "integral/1008/listItemImgBg.png"
}, },
"tabInfo": { "tabInfo": {
"tabBg": "tapSelectBg.png", "tabBg": "tapSelectBg.png",
...@@ -1471,6 +1472,7 @@ ...@@ -1471,6 +1472,7 @@
//banner点击事件 //banner点击事件
const bannerHandler = (item) => { const bannerHandler = (item) => {
md.sensorLogTake({ md.sensorLogTake({
xcxClick: "积分服务页-首屏页面点击", xcxClick: "积分服务页-首屏页面点击",
pageName: "积分服务页-首屏", pageName: "积分服务页-首屏",
...@@ -1875,7 +1877,7 @@ ...@@ -1875,7 +1877,7 @@
height: 154rpx; height: 154rpx;
// margin-left: 32rpx; // margin-left: 32rpx;
// margin-right: 32rpx; // margin-right: 32rpx;
// background: url('@{baseUrl}integral/1013/vipDetailBg.png') no-repeat center/cover; // background: url('@{baseUrl}integral/1008/vipDetailBg.png') no-repeat center/cover;
flex-direction: row; flex-direction: row;
position: relative; position: relative;
display: flex; display: flex;
...@@ -1935,7 +1937,7 @@ ...@@ -1935,7 +1937,7 @@
height: 37rpx; height: 37rpx;
margin-left: 10rpx; margin-left: 10rpx;
margin-top: 5rpx; margin-top: 5rpx;
// background: url('@{baseUrl}integral/1013/tabNowBg.png') no-repeat center/contain; // background: url('@{baseUrl}integral/1008/tabNowBg.png') no-repeat center/contain;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
...@@ -1971,7 +1973,7 @@ ...@@ -1971,7 +1973,7 @@
// flex: 1; // flex: 1;
height: 144rpx; height: 144rpx;
width: 492rpx; width: 492rpx;
// background: url('@{baseUrl}integral/1013/inteBarAreaBg.png') no-repeat center/cover; // background: url('@{baseUrl}integral/1008/inteBarAreaBg.png') no-repeat center/cover;
margin-left: 16rpx; margin-left: 16rpx;
// padding: 16rpx 24rpx; // padding: 16rpx 24rpx;
.integralClick { .integralClick {
...@@ -2230,8 +2232,8 @@ ...@@ -2230,8 +2232,8 @@
justify-content: center; justify-content: center;
&.active { &.active {
//https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/integral/1013/tapSelectBg.png //https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/integral/1008/tapSelectBg.png
// background-image: url('@{baseUrl}integral/1013/tapSelectBg.png'); // background-image: url('@{baseUrl}integral/1008/tapSelectBg.png');
background-size: 100% 100%; background-size: 100% 100%;
.tab-line1 { color: #1d1e25; } .tab-line1 { color: #1d1e25; }
.tab-line2 { color: #b27c1e; } .tab-line2 { color: #b27c1e; }
......
views/My.vue
View file @ 17d20f25
...@@ -100,9 +100,9 @@ ...@@ -100,9 +100,9 @@
</view> </view>
<!-- 积分账户 --> <!-- 积分账户 -->
<view class="integral-account"> <view class="integral-account">
<text class="integral-account-text"> 积分账户： </text> <text class="integral-account-text"> 账号： </text>
<text class="integral-account-value"> <text class="integral-account-value">
{{ babyInfo.points || "0" }}</text {{ userStore.memberInfo?.mobile || '' }}</text
> >
</view> </view>
...@@ -116,6 +116,16 @@ ...@@ -116,6 +116,16 @@
@add="onAddBaby" @add="onAddBaby"
/> />
</view> </view>
<view class="integralContainer">
<image
class="integralIcon"
src="https://course.feihe.com/momclub-picture/my/integralBg.png"
mode="aspectFit"
/>
<text class="integralText0">{{ babyInfo.points || "0" }}</text>
<text class="integralText1">积分</text>
</view>
</view> </view>
<!-- user desc --> <!-- user desc -->
<view v-if="cfgStatus.showDetail" class="user-desc"> <view v-if="cfgStatus.showDetail" class="user-desc">
...@@ -171,6 +181,28 @@ ...@@ -171,6 +181,28 @@
</view> </view>
</view> </view>
<view class="vip-active-area" v-if="pageCfgStore?.contentCfg?.activeInfo?.length > 0">
<text class="vip-title">精彩活动</text>
<swiper
class="vip-active-swiper"
:indicator-dots="pageCfgStore?.contentCfg?.activeInfo?.length > 1"
:autoplay="true"
:circular="true"
indicator-color="#dfddd9"
indicator-active-color="#b27c1e"
:indicator-top="32"
>
<swiper-item v-for="(item, index) in pageCfgStore?.contentCfg?.activeInfo" :key="index">
<image
class="vip-active-img"
:src="item?.img"
mode="aspectFit"
@click="handleVipActiveClick(index, item)"
/>
</swiper-item>
</swiper>
</view>
<!-- 协议 --> <!-- 协议 -->
<view class="protocol-container"> <view class="protocol-container">
<image :src="$baseUrl + 'my/protocol.png'" mode="aspectFit" /> <image :src="$baseUrl + 'my/protocol.png'" mode="aspectFit" />
...@@ -433,7 +465,11 @@ onMounted(async () => { ...@@ -433,7 +465,11 @@ onMounted(async () => {
pageName: "我的页面", pageName: "我的页面",
}); });
showLoading(); showLoading();
await userStore.loadMemberInfo();
await pageCfgStore.fetchCfg(); await pageCfgStore.fetchCfg();
console.log("pageCfgStore.contentCfg====", pageCfgStore.contentCfg);
initData(); initData();
hideLoading(); hideLoading();
}); });
...@@ -443,6 +479,38 @@ watch([() => userStore.userInfo, () => userStore.babyInfo], () => { ...@@ -443,6 +479,38 @@ watch([() => userStore.userInfo, () => userStore.babyInfo], () => {
initData(); initData();
}); });
//会员活动点击事件
const handleVipActiveClick = (index, item) => {
// let buttonName = '';
// switch(index){
// case 0:
// buttonName = '第一张焦点图';
// break;
// case 1:
// buttonName = '第二张焦点图';
// break;
// case 2:
// buttonName = '第三张焦点图';
// break;
// }
// md.sensorLogTake({
// xcxClick: "积分服务页-二屏页面点击",
// pageName: "积分服务页-二屏",
// buttonName: buttonName,
// });
const url = item?.url;
const type = item?.type;
const extra = item?.extra;
jump({
type: type,
url: url,
extra:extra
})
}
// 定义页面配置 // 定义页面配置
defineExpose({}); defineExpose({});
</script> </script>
...@@ -585,8 +653,41 @@ defineExpose({}); ...@@ -585,8 +653,41 @@ defineExpose({});
color: #1d1e25; color: #1d1e25;
} }
} }
} }
.integralContainer {
position: absolute;
top: 0rpx;
right: 0rpx;
.integralIcon {
position: absolute;
width: 226rpx;
height: 166rpx;
right: 0rpx;
}
.integralText0 {
position: absolute;
font-size: 24rpx;
color: #1d1e25;
top: 45rpx;
right: 0rpx;
width: 167rpx;
text-align: center;
}
.integralText1 {
position: absolute;
font-size: 24rpx;
color: #1d1e25;
width: 167rpx;
text-align: center;
right: 0rpx;
top: 81rpx;
}
}
.edit-btn { .edit-btn {
image { image {
width: 40rpx; width: 40rpx;
...@@ -625,7 +726,7 @@ defineExpose({}); ...@@ -625,7 +726,7 @@ defineExpose({});
border-radius: 32rpx; border-radius: 32rpx;
padding: 32rpx 30rpx; padding: 32rpx 30rpx;
box-sizing: border-box; box-sizing: border-box;
margin-top: 161rpx; margin-top: 180rpx;
.desc-top { .desc-top {
display: flex; display: flex;
...@@ -720,6 +821,27 @@ defineExpose({}); ...@@ -720,6 +821,27 @@ defineExpose({});
} }
} }
.vip-active-area {
margin-left: 28rpx;
margin-top: 60rpx;
.vip-title {
margin-left: 20rpx;
}
.vip-active-swiper {
width: 692rpx;
height: 204rpx;
flex-shrink: 0;
margin-top: 30rpx;
margin-bottom: 100rpx;
.vip-active-img {
width: 100%;
height: 100%;
// border-radius: 16rpx;
}
}
}
.protocol-container { .protocol-container {
width: 360rpx; width: 360rpx;
height: 25rpx; height: 25rpx;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment