Skip to content

飞
飞鹤小程序
Commit 859400e8 authored by 王炽's avatar 王炽
Browse files
Options

内容页图片冲切

parent 3eaf072d
Hide whitespace changes
Inline Side-by-side
Showing with 1131 additions and 288 deletions
a.json
View file @ 859400e8
{ {
"swiper": [ bannerList: [
{ {
"bannerImg": "integralBannerBg0.png", bgUrl: "banner-cl0.png",
"url": "subPackages/shopMainList/topicNew/index?id=1000916", url: "https://mp.weixin.qq.com/s/Xn5dh96OaQ9CcsVMZ5jnvg"
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e",
"envVersion": "release"
}
}
],
"viplv": {
"imgs": [
"imgPlatinum0.png",
"imgPlatinum1.png",
"imgPlatinum2.png",
"imgPlatinum3.png",
"imgPlatinum4.png"
]
},
"vipIntegral": {
"gonglue": {
"url": "https://mom.feihe.com/member/mine/pointStrategy",
"type": 3,
"img": "strategyBtn.png"
},
"progressBar": {
"barImg": "progressBarIntegral.png",
"barBgImg": "progressBarBgIntegral.png"
}, },
"excharge": { {
"url": "subPackages/shopMainList/topicNew/index?id=1000187", bgUrl: "banner-cl1.png",
"type": 2, url: "https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg"
"img": "integralExchargeBtn.png",
"extra": {
"appId": "wx4205ec55b793245e",
"envVersion": "release"
}
},
"vipCardInfo": {
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot",
"type": 2,
"extra": {
"appId": "wx4205ec55b793245e",
"envVersion": "release"
}
}, },
"jifenmingxi": { {
"url": "https://mom.feihe.com/member/mine/newPointDetail?crmId={crmid}&appCode=XMH", bgUrl: "banner-cl2.png",
"type": 3 url: "https://mp.weixin.qq.com/s/W75YKmpxJdDqZtAixkltyQ"
} }
],
tabConfigs: {
expert: ["疾病护理", "脑育科普", "孕期护理"],
nutrition: ["辅食制作", "奶粉百科", "全家营养"],
momTalk: ["新鲜热议", "家庭生活", "心理成长"],
parentingLife: ["早教学习", "动画故事", "家庭关系"]
}, },
"qunyiInfo": { product: [
"vipRule": { [
"url": "https://mom.feihe.com/member/mine/pointStrategy",
"type": 3
},
"imgInfos": [
{ {
"img": "yueyueliBtn.png", bgUrl: "contentLibrary/1003/item0-list0-0.png",
"width": "68rpx", desc: "孩子出游腿疼≠在长...",
"height": "87rpx", link: {
"name": "月月礼" url: "https://mp.weixin.qq.com/s/RGzeUaabqKm6xM6jjbZPIQ",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "shengriBtn.png", bgUrl: "contentLibrary/1003/item1-list0-0.png",
"width": "70rpx", desc: "打完疫苗就走？这30...",
"height": "91rpx", link: {
"name": "生日礼" url: "https://mp.weixin.qq.com/s/HcQbburuQGgPyGahj1RA6Q",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "yuerBtn.png", bgUrl: "contentLibrary/1003/show-img0-list0.png",
"width": "94rpx", desc: "已有儿童中招，严重可瘫痪！夏季防蜱虫最全...",
"height": "87rpx", link: {
"name": "育儿礼" url: "https://mp.weixin.qq.com/s/fL5UZjWUXmPrjJgSe2Hr5g",
}, type: 3
},
width: 686,
height: 484,
imgHeight: 347,
textWidth: 625,
bottom: 53
}
],
[
{ {
"img": "heliBtn.png", bgUrl: "contentLibrary/1003/item0-list0-1.png",
"width": "48rpx", desc: "怕娃不聪明？5招开...",
"height": "87rpx", link: {
"name": "贺礼" url: "https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "xinrenliBtn.png", bgUrl: "contentLibrary/1003/item1-list0-1.png",
"width": "71rpx", desc: "情绪失控≠熊孩子！全...",
"height": "88rpx", link: {
"name": "新人礼" url: "https://mp.weixin.qq.com/s/NSyo1U6A1Yrw1WymPwm48A",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 309,
bottom: 43
}, },
{ {
"img": "mianfeiBtn.png", bgUrl: "contentLibrary/1003/show-img0-list1.png",
"width": "95rpx", desc: "认清脑育认知的三大误区！让娃赢在起点",
"height": "87rpx", link: {
"name": "免费礼" url: "https://mp.weixin.qq.com/s/f1Y59OJ9FBZ3tF47PJ9aBw",
type: 3
},
width: 686,
height: 484,
imgHeight: 347,
textWidth: 625,
bottom: 53
}
],
[
{
bgUrl: "contentLibrary/1003/item0-list0-2.png",
desc: "孕期最重要的6次产...",
link: {
url: "https://mp.weixin.qq.com/s/R1557EIof8dHnalMQNNXhg",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "zhuanduanli.png", bgUrl: "contentLibrary/1003/item1-list0-2.png",
"width": "70rpx", desc: "孕期或哺乳期感染新...",
"height": "86rpx", link: {
"name": "专端礼" url: "https://mp.weixin.qq.com/s/XSViARdv9AOidSz2DKahTQ",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "changxianBtn.png", bgUrl: "contentLibrary/1003/show-img0-list2.png",
"width": "94rpx", desc: "除了叶酸，孕期妈妈还应该补什么?",
"height": "87rpx", link: {
"name": "尝鲜礼" url: "https://mp.weixin.qq.com/s/qmUf3fW8bYi7C33hXQcnfQ",
type: 3
},
width: 686,
height: 484,
imgHeight: 347,
textWidth: 625,
bottom: 53
}
],
[
{
bgUrl: "contentLibrary/1003/show-img1-list1.png",
desc: "奶粉罐上的OPO是智商税吗？一文说清它到底 值不值得买！",
link: {
url: "https://mp.weixin.qq.com/s/BOENbTE-5fNe0rwnlvzeng",
type: 3
},
width: 686,
height: 484,
imgHeight: 347,
textWidth: 625,
bottom: 53
}, },
{ {
"img": "jinjiBtn.png", bgUrl: "contentLibrary/1003/item0-list1-1.png",
"width": "70rpx", desc: "宝妈必看！养娃不可...",
"height": "89rpx", link: {
"name": "进阶礼" url: "https://mp.weixin.qq.com/s/Evqc7KJMsNYS_MQox1oCfw",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
}, },
{ {
"img": "suyuanBtn.png", bgUrl: "contentLibrary/1003/item1-list1-1.png",
"width": "71rpx", desc: "警惕！冬季奶粉喂养...",
"height": "90rpx", link: {
"name": "溯源礼" url: "https://mp.weixin.qq.com/s/JjqPDlyGkodZPulv-2gQBA",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 309,
bottom: 43
} }
], ],
"rule": { [
"url": "https://mom.feihe.com/member/mine/pointStrategy", {
"type": 3 bgUrl: "contentLibrary/1003/show-img1-list2.png",
}, desc: "一篇掌握全龄饮食黄金指南！",
"vipQuanyiUrl": { link: {
"url": "subPackages/xmhMainProcess/member/index?entrySource=xmh_wechatmp_points_recgoodsbot", url: "https://mp.weixin.qq.com/s/9CUJMqjNmUlUjnjUFb40eg",
"type": 2, type: 3
"extra": { },
"appId": "wx4205ec55b793245e", width: 686,
"envVersion": "release" height: 484,
imgHeight: 347,
textWidth: 625,
bottom: 53
},
{
bgUrl: "contentLibrary/1003/item0-list1-2.png",
desc: "五一春游零食清单，全...",
link: {
url: "https://mp.weixin.qq.com/s/3WHTYk-nEyN9CtSn4ZCj0A",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 315,
bottom: 43
},
{
bgUrl: "contentLibrary/1003/item1-list1-2.png",
desc: "解锁适合全家的美味...",
link: {
url: "https://mp.weixin.qq.com/s/ksRxfSzFxLHahB48bnKMuQ",
type: 3
},
width: 332,
height: 410,
imgHeight: 293,
textWidth: 300,
bottom: 43
} }
}, ],
"vipLvsQuanyi": [ [
{ {
"qunyiList": [0, 2, 4, 5], bgUrl: "contentLibrary/1003/item0-list2-0.png",
"isNewArr": [] desc: "《六姊妹》大结局引 热议！如何成为...",
link: {
url: "https://mp.weixin.qq.com/s/1ge3dA0f3IbfgPghFJKqJg",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 53
}, },
{ {
"qunyiList": [6, 7, 0, 2, 4, 5], bgUrl: "contentLibrary/1003/item1-list2-0.png",
"isNewArr": [6, 7] desc: "家长必看！《哪吒2》 票房火爆背后，竟...",
link: {
url: "https://mp.weixin.qq.com/s/kX37uMOZTAQyo4Ng7IbQdQ",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
}, },
{ {
"qunyiList": [7, 8, 0, 2, 4, 5], bgUrl: "contentLibrary/1003/item2-list2-0.png",
"isNewArr": [7, 8] desc: "哺乳期出门=荒野求生？ 哺乳妈妈的高阶出...",
link: {
url: "https://mp.weixin.qq.com/s/ku3wiGGXvczq6BOpwmd8bg",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 310,
bottom: 43
}
],
[
{
bgUrl: "contentLibrary/1003/item0-list2-1.png",
desc: "砸2万上早教不如逛 100次菜市场？真相…",
link: {
url: "https://mp.weixin.qq.com/s/BtuaNnl-thV5M30_tqKpvA",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 53
}, },
{ {
"qunyiList": [9, 0, 2, 4, 5, 6, 7, 8], bgUrl: "contentLibrary/1003/item1-list2-1.png",
"isNewArr": [9] desc: "聪明家长必备！这两 种平衡拿捏好，解...",
link: {
url: "https://mp.weixin.qq.com/s/HS4UPDRtAtqlf-urGALD5w",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
}, },
{ {
"qunyiList": [9, 0, 2, 4, 5, 6, 7, 8], bgUrl: "contentLibrary/1003/item2-list2-1.png",
"isNewArr": [9] desc: "多孩家庭：80%父母 可能正陷入\"偏爱盲...",
link: {
url: "https://mp.weixin.qq.com/s/6sKO12QCs5jvmENoGczqmw",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
} }
] ],
}, [
"vipActive": [ {
{ bgUrl: "contentLibrary/1003/item0-list2-2.png",
"img": "vipAct0.png", desc: "女性结婚有娃后，友 谊就注定变淡吗?",
"url": "subPackages/shopMainList/topicNew/index?id=1000911", link: {
"type": 2, url: "https://mp.weixin.qq.com/s/89dJzmlmrhM0fqSUufaSnA",
"extra": { type: 3
"appId": "wx4205ec55b793245e", },
"envVersion": "release" width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 53
},
{
bgUrl: "contentLibrary/1003/item1-list2-2.png",
desc: "一套过节\"高情商回话 公式\"，专治嘴笨...",
link: {
url: "https://mp.weixin.qq.com/s/UohhkMxB6rXH4yQeC3EF6A",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
},
{
bgUrl: "contentLibrary/1003/item2-list2-2.png",
desc: "真正压垮女性的，从 来不只是\"家务劳...",
link: {
url: "https://mp.weixin.qq.com/s/nUWBqqaykIdWXcTX6G0OJw",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
} }
}, ],
{ [
"img": "vipAct1.png", {
"url": "subPackages/shopMainList/topicNew/index?id=1000912", bgUrl: "contentLibrary/1003/item0-list3-0.png",
"type": 2, desc: "超实用！0-3岁宝宝居 家早教攻略，轻松...",
"extra": { link: {
"appId": "wx4205ec55b793245e", url: "https://mp.weixin.qq.com/s/CVtfzrmY8ER64rO8CBdFIg",
"envVersion": "release" type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 53
},
{
bgUrl: "contentLibrary/1003/item1-list3-0.png",
desc: "0-3岁不花钱早教，也 能让宝宝的智商赢...",
link: {
url: "https://mp.weixin.qq.com/s/4NpvNlpa1MF-pYpMJ7Zi0w",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
},
{
bgUrl: "contentLibrary/1003/item2-list3-0.png",
desc: "0~3岁保姆级教程，不 用花钱早教，就能...",
link: {
url: "https://mp.weixin.qq.com/s/y0kPoMPQI_skcEbh6gVKRA",
type: 3
},
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 310,
bottom: 43
} }
}, ],
{ [
"img": "vipAct2.png", {
"url": "/subPackages/shopMainProcess/lottery/index?utm_campaign=%E6%BA%AF%E6%BA%90%E6%8A%BD%E5%A5%96&_channel_track_key=ngSppZAj", bgUrl: "contentLibrary/1003/item0-list3-1.png",
"type": 2, desc: "毛毛镇\n《集落叶大行动》",
"extra": { url: "contentLibrary/1003/libraryVideo0.mp4",
"appId": "wx4205ec55b793245e", videoUrl: "contentLibrary/1003/libraryVideo0.mp4",
"envVersion": "release" isvideo: true,
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 53
},
{
bgUrl: "contentLibrary/1003/item1-list3-1.png",
desc: "毛毛镇\n《弹力条条》",
url: "contentLibrary/1003/libraryVideo1.mp4",
videoUrl: "contentLibrary/1003/libraryVideo1.mp4",
isvideo: true,
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
},
{
bgUrl: "contentLibrary/1003/item2-list3-1.png",
desc: "毛毛镇\n《你好春天》",
url: "contentLibrary/1003/libraryVideo2.mp4",
videoUrl: "contentLibrary/1003/libraryVideo2.mp4",
isvideo: true,
width: 687,
height: 192,
imgHeight: 192,
imgWidth: 357,
textWidth: 290,
bottom: 43
} }
} ],
], [
"goodsListData": { {
"listCommon": { bgUrl: "contentLibrary/1003/item0-list3-2.png",
"listItemImgBg": "integral/1001/listItemImgBg.png" desc: "读了50位妈妈的育儿 经验发现：亲子...",
}, link: {
"tabInfo": { url: "https://mp.weixin.qq.com/s/ubpkqXVXjQj74fH0SPztwA",
"tabBg": "tapSelectBg.png", type: 3
"tabTexts": [ },
{ width: 687,
"line1": "星品榜单", height: 192,
"line2": "" imgHeight: 192,
}, imgWidth: 357,
{ textWidth: 290,
"line1": "0元爆款", bottom: 53
"line2": "" },
}, {
{ bgUrl: "contentLibrary/1003/item1-list3-2.png",
"line1": "北纬专场", desc: "家庭教育很重要！做 好这6点，养出优...",
"line2": "" link: {
} url: "https://mp.weixin.qq.com/s/xwRZUyeWR6nD5Z0NtpXojQ",
] type: 3
}, },
"goodsData": [ width: 687,
{ height: 192,
"titles": [ imgHeight: 192,
"六水香清禾香大米2.5kg", "EDI纯水手口湿巾迷你...", "全麦手撕面包麦香浓郁...", "艾草植萃除菌除螨洗衣...", imgWidth: 357,
"内衣专护洗衣液", "婴儿专护除菌除螨洗衣...", "宝宝钙维生素D软胶囊...", "北纬47度鲜甜低GI水果...", textWidth: 290,
"牙博士青柠亮白牙膏", "六水香泰来大米2.5kg", "钙铁锌牛乳软饼干6g*...", "飞鹤茁然儿童配方奶2...", bottom: 43
"酵素洗衣皂抑菌柔护尿...", "云柔保湿纸巾乳霜纸...", "超级飞侠儿童绘画笔套...", "婴蓓INBER 儿童糖果..." },
], {
"prices": [ bgUrl: "contentLibrary/1003/item2-list3-2.png",
3200, 990, 1990, 1990, desc: "宝宝一犯错就上头？ 掌握这7个办法解...",
1590, 2190, 2680, 990, link: {
1580, 4000, 2490, 5200, url: "https://mp.weixin.qq.com/s/DzCEhMCvj4A5tSvdvxZBtA",
1990, 3900, 7900, 1990 type: 3
], },
"goodsImgs": [ width: 687,
"listItemImgJx0.png", "listItemImgJx1.png", "listItemImgJx2.png", "listItemImgJx3.png", height: 192,
"listItemImgJx4.png", "listItemImgJx5.png", "listItemImgJx6.png", "listItemImgJx7.png", imgHeight: 192,
"listItemImgJx8.png", "listItemImgJx9.png", "listItemImgJx10.png", "listItemImgJx11.png", imgWidth: 357,
"listItemImgJx12.png", "listItemImgJx13.png", "listItemImgJx14.png", "listItemImgJx15.png" textWidth: 290,
] bottom: 43
},
{
"titles": [
"星飞帆4段儿童成长...", "星飞帆卓睿4段儿童...", "金装1962-高锌多维学...", "香葱流心可颂面包500g",
"茁然 茁护儿童配方奶...", "六水香清禾香大米5kg", "星蕴孕产妇奶粉听装700g", "美维仕宝宝钙维生素...",
"金装1962-中老年高钙...", "金装1962-高钙高蛋白...", "茁然纯牛奶(A2 B酪蛋...", "北纬47度黄糯鲜玉米",
"钙铁锌牛乳软饼干6g*...", "迪奥口红 烈焰蓝金唇...", "浅香(ASAKA)百合氨基...", "心相印茶语精选320抽..."
],
"prices": [188, 368, 89, 19.9, 268, 69, 158, 78, 89, 89, 65, 66, 39.9, 158.51, 31, 29],
"goodsImgs": [
"listItemImgXL0.png", "listItemImgXL1.png", "listItemImgXL2.png", "listItemImgXL3.png",
"listItemImgXL4.png", "listItemImgXL5.png", "listItemImgXL6.png", "listItemImgXL7.png",
"listItemImgXL8.png", "listItemImgXL9.png", "listItemImgXL10.png", "listItemImgXL11.png",
"listItemImgXL12.png", "listItemImgXL13.png", "listItemImgXL14.png", "listItemImgXL15.png"
]
},
{
"titles": [
"北纬47度水果玉米", "北纬47度黄糯鲜玉米", "北纬47度白甜糯玉米", "北纬47度东北烧烤...",
"北纬47度花甜糯玉米", "北纬47度黑珍珠玉米", "N47°植物酵素乳245...", "N47°水果玉米汁245..."
],
"prices": [4200, 3840, 3840, 5990, 4200, 4200, 5500, 4990],
"goodsImgs": [
"listItemImgPzh0.png", "listItemImgPzh1.png", "listItemImgPzh2.png", "listItemImgPzh3.png",
"listItemImgPzh4.png", "listItemImgPzh5.png", "listItemImgPzh6.png", "listItemImgPzh7.png"
]
} }
] ]
} ]
} }
\ No newline at end of file
api/contentLibrary.js 0 → 100644
View file @ 859400e8
import requestModule from './request.js';
const {
api
} = requestModule;
/**
* 获取积分信息
* @returns
*/
export const fetchContentLibraryJSON = () => api.get('/c/front/content',{type:'contentLibrary'});
\ No newline at end of file
main.js
View file @ 859400e8
...@@ -2,8 +2,8 @@ import App from "./App"; ...@@ -2,8 +2,8 @@ import App from "./App";
// import apiRequest from "@/api/request.js"; // import apiRequest from "@/api/request.js";
import * as Pinia from 'pinia'; import * as Pinia from 'pinia';
// const BASE_URL = 'https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/'; const BASE_URL = 'https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/';
const BASE_URL = 'https://firmus-member-test-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/'; // const BASE_URL = 'https://firmus-member-test-1253290912.cos.ap-beijing.myqcloud.com/xmh-mini-program/';
// #ifndef VUE3 // #ifndef VUE3
import Vue from "vue"; import Vue from "vue";
......
pages/library/ContentLibrary.vue
View file @ 859400e8
...@@ -20,8 +20,9 @@ ...@@ -20,8 +20,9 @@
</swiper> </swiper>
<image @tap="backHandler" class="btnback" :src="$baseUrl+'searchpage/btnback.png'"></image> <image @tap="backHandler" class="btnback" :src="$baseUrl+'searchpage/btnback.png'"></image>
<image class="search-icon" :src="$baseUrl + 'contentLibrary/1001/Seach.png'"></image> <image class="search-icon" :src="$baseUrl + 'contentLibrary/1003/Seach.png'"></image>
<!-- 专家来了 -->
<view class="list-area-container"> <view class="list-area-container">
<text class="list-title">{{ listTitles[0] }}</text> <text class="list-title">{{ listTitles[0] }}</text>
<!-- 引入Tab组件 --> <!-- 引入Tab组件 -->
...@@ -155,7 +156,8 @@ ...@@ -155,7 +156,8 @@
class="item-img1" class="item-img1"
:src="$baseUrl + `${item?.img}`" :src="$baseUrl + `${item?.img}`"
:style="{ :style="{
height: item.imgHeight + 'rpx' height: item.imgHeight + 'rpx',
width: item.imgWidth + 'rpx'
}" }"
@click="xingmaHandler(item.url)" @click="xingmaHandler(item.url)"
mode="aspectFit" mode="aspectFit"
...@@ -204,10 +206,11 @@ ...@@ -204,10 +206,11 @@
class="item-img1" class="item-img1"
:src="$baseUrl + `${item?.img}`" :src="$baseUrl + `${item?.img}`"
:style="{ :style="{
height: item.imgHeight + 'rpx' height: item.imgHeight + 'rpx',
width: item.imgWidth + 'rpx'
}" }"
mode="aspectFit" mode="aspectFit"
@click="qinziHandler(item.url)" @click="qinziHandler(item)"
/> />
<text <text
class="item-text2" class="item-text2"
...@@ -228,13 +231,18 @@ ...@@ -228,13 +231,18 @@
</view> </view>
<view class="bottom-space"></view> <view class="bottom-space"></view>
<view v-if="showVideo" class="video-popup">
<video :src="currentVideoUrl" controls autoplay style="width: 100vw; height: 56vw;"></video>
<view class="close-btn-bottom" @tap="closeVideo">×</view>
</view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref , onMounted, getCurrentInstance } from 'vue' import { ref , onMounted, getCurrentInstance, onBeforeMount } from 'vue'
import TabBarConLibrary from '@/components/TabBarConLibrary.vue'; import TabBarConLibrary from '@/components/TabBarConLibrary.vue';
import { jump, JumpType } from '@/utils/index.js'; import { jump, JumpType } from '@/utils/index.js';
import { fetchContentLibraryJSON } from '../../api/contentlibrary';
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const $baseUrl = proxy.$baseUrl; const $baseUrl = proxy.$baseUrl;
...@@ -264,384 +272,408 @@ ...@@ -264,384 +272,408 @@
}, },
contentList0: [ contentList0: [
{ {
img: 'contentLibrary/1001/item0-list0-0.png', img: 'contentLibrary/1003/item0-list0-0.png',
text: '孩子出游腿疼≠在长...', text: '孩子出游腿疼≠在长...',
url: 'https://mp.weixin.qq.com/s/RGzeUaabqKm6xM6jjbZPIQ', url: 'https://mp.weixin.qq.com/s/RGzeUaabqKm6xM6jjbZPIQ',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list0-0.png', img: 'contentLibrary/1003/item1-list0-0.png',
text: '打完疫苗就走？这30...', text: '打完疫苗就走？这30...',
url: 'https://mp.weixin.qq.com/s/HcQbburuQGgPyGahj1RA6Q', url: 'https://mp.weixin.qq.com/s/HcQbburuQGgPyGahj1RA6Q',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/show-img0-list0.png', img: 'contentLibrary/1003/show-img0-list0.png',
text: '已有儿童中招，严重可瘫痪！夏季防蜱虫最全...', text: '已有儿童中招，严重可瘫痪！夏季防蜱虫最全...',
url:'https://mp.weixin.qq.com/s/fL5UZjWUXmPrjJgSe2Hr5g', url:'https://mp.weixin.qq.com/s/fL5UZjWUXmPrjJgSe2Hr5g',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
}, },
], ],
contentList1: [ contentList1: [
{ {
img: 'contentLibrary/1001/item0-list0-1.png', img: 'contentLibrary/1003/item0-list0-1.png',
text: '怕娃不聪明？5招开...', text: '怕娃不聪明？5招开...',
url: 'https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg', url: 'https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list0-1.png', img: 'contentLibrary/1003/item1-list0-1.png',
text: '情绪失控≠熊孩子！全...', text: '情绪失控≠熊孩子！全...',
url: 'https://mp.weixin.qq.com/s/NSyo1U6A1Yrw1WymPwm48A', url: 'https://mp.weixin.qq.com/s/NSyo1U6A1Yrw1WymPwm48A',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 309, textWidth: 309,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/show-img0-list1.png', img: 'contentLibrary/1003/show-img0-list1.png',
text: '认清脑育认知的三大误区！让娃赢在起点', text: '认清脑育认知的三大误区！让娃赢在起点',
url: 'https://mp.weixin.qq.com/s/f1Y59OJ9FBZ3tF47PJ9aBw', url: 'https://mp.weixin.qq.com/s/f1Y59OJ9FBZ3tF47PJ9aBw',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
} }
], ],
contentList2: [ contentList2: [
{ {
img: 'contentLibrary/1001/item0-list0-2.png', img: 'contentLibrary/1003/item0-list0-2.png',
text: '孕期最重要的6次产...', text: '孕期最重要的6次产...',
url: 'https://mp.weixin.qq.com/s/R1557EIof8dHnalMQNNXhg', url: 'https://mp.weixin.qq.com/s/R1557EIof8dHnalMQNNXhg',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list0-2.png', img: 'contentLibrary/1003/item1-list0-2.png',
text: '孕期或哺乳期感染新...', text: '孕期或哺乳期感染新...',
url: 'https://mp.weixin.qq.com/s/XSViARdv9AOidSz2DKahTQ', url: 'https://mp.weixin.qq.com/s/XSViARdv9AOidSz2DKahTQ',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/show-img0-list2.png', img: 'contentLibrary/1003/show-img0-list2.png',
text: '除了叶酸，孕期妈妈还应该补什么?', text: '除了叶酸，孕期妈妈还应该补什么?',
url: 'https://mp.weixin.qq.com/s/qmUf3fW8bYi7C33hXQcnfQ', url: 'https://mp.weixin.qq.com/s/qmUf3fW8bYi7C33hXQcnfQ',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
} }
], ],
contentList01:[ contentList01:[
{ {
img: 'contentLibrary/1001/show-img1-list0.png', img: 'contentLibrary/1003/show-img1-list0.png',
text: '宝宝大脑发育关键期，DHA这样补，轻松拿捏...', text: '宝宝大脑发育关键期，DHA这样补，轻松拿捏...',
url:'https://mp.weixin.qq.com/s/Gdv3fTIvuqa6hBs7dUCZkg', url:'https://mp.weixin.qq.com/s/Gdv3fTIvuqa6hBs7dUCZkg',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item0-list1-0.png', img: 'contentLibrary/1003/item0-list1-0.png',
text: '不贫血≠不缺铁！宝...', text: '不贫血≠不缺铁！宝...',
url:'https://mp.weixin.qq.com/s/pPFFgpcFYrtrMlOZeYYFoA', url:'https://mp.weixin.qq.com/s/pPFFgpcFYrtrMlOZeYYFoA',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list1-0.png', img: 'contentLibrary/1003/item1-list1-0.png',
text: '辅食界 “显眼包” 来...', text: '辅食界 “显眼包” 来...',
url:'https://mp.weixin.qq.com/s/EBXHkjowOJQ8qhu-GpoUcQ', url:'https://mp.weixin.qq.com/s/EBXHkjowOJQ8qhu-GpoUcQ',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
} }
], ],
contentList11:[ contentList11:[
{ {
img: 'contentLibrary/1001/show-img1-list1.png', img: 'contentLibrary/1003/show-img1-list1.png',
text: '奶粉罐上的OPO是智商税吗？一文说清它到底 值不值得买！', text: '奶粉罐上的OPO是智商税吗？一文说清它到底 值不值得买！',
url:'https://mp.weixin.qq.com/s/BOENbTE-5fNe0rwnlvzeng', url:'https://mp.weixin.qq.com/s/BOENbTE-5fNe0rwnlvzeng',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item0-list1-1.png', img: 'contentLibrary/1003/item0-list1-1.png',
text: '宝妈必看！养娃不可...', text: '宝妈必看！养娃不可...',
url:'https://mp.weixin.qq.com/s/Evqc7KJMsNYS_MQox1oCfw', url:'https://mp.weixin.qq.com/s/Evqc7KJMsNYS_MQox1oCfw',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list1-1.png', img: 'contentLibrary/1003/item1-list1-1.png',
text: '警惕！冬季奶粉喂养...', text: '警惕！冬季奶粉喂养...',
url:'https://mp.weixin.qq.com/s/JjqPDlyGkodZPulv-2gQBA', url:'https://mp.weixin.qq.com/s/JjqPDlyGkodZPulv-2gQBA',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 309, textWidth: 309,
bottom: 43 bottom: 43
} }
], ],
contentList21:[ contentList21:[
{ {
img: 'contentLibrary/1001/show-img1-list2.png', img: 'contentLibrary/1003/show-img1-list2.png',
text: '一篇掌握全龄饮食黄金指南！', text: '一篇掌握全龄饮食黄金指南！',
url:'https://mp.weixin.qq.com/s/9CUJMqjNmUlUjnjUFb40eg', url:'https://mp.weixin.qq.com/s/9CUJMqjNmUlUjnjUFb40eg',
width: 686, width: 686,
height: 484, height: 484,
imgHeight: 484, imgHeight: 347,
textWidth: 625, textWidth: 625,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item0-list1-2.png', img: 'contentLibrary/1003/item0-list1-2.png',
text: '五一春游零食清单，全...', text: '五一春游零食清单，全...',
url:'https://mp.weixin.qq.com/s/3WHTYk-nEyN9CtSn4ZCj0A', url:'https://mp.weixin.qq.com/s/3WHTYk-nEyN9CtSn4ZCj0A',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 315, textWidth: 315,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item1-list1-2.png', img: 'contentLibrary/1003/item1-list1-2.png',
text: '解锁适合全家的美味...', text: '解锁适合全家的美味...',
url:'https://mp.weixin.qq.com/s/ksRxfSzFxLHahB48bnKMuQ', url:'https://mp.weixin.qq.com/s/ksRxfSzFxLHahB48bnKMuQ',
width: 332, width: 332,
height: 410, height: 410,
imgHeight: 410, imgHeight: 293,
textWidth: 300, textWidth: 300,
bottom: 43 bottom: 43
} }
], ],
contentList02:[ contentList02:[
{ {
img: 'contentLibrary/1001/item0-list2-0.png', img: 'contentLibrary/1003/item0-list2-0.png',
text: '《六姊妹》大结局引 热议！如何成为...', text: '《六姊妹》大结局引 热议！如何成为...',
url: 'https://mp.weixin.qq.com/s/1ge3dA0f3IbfgPghFJKqJg', url: 'https://mp.weixin.qq.com/s/1ge3dA0f3IbfgPghFJKqJg',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list2-0.png', img: 'contentLibrary/1003/item1-list2-0.png',
text: '家长必看！《哪吒2》 票房火爆背后，竟...', text: '家长必看！《哪吒2》 票房火爆背后，竟...',
url: 'https://mp.weixin.qq.com/s/kX37uMOZTAQyo4Ng7IbQdQ', url: 'https://mp.weixin.qq.com/s/kX37uMOZTAQyo4Ng7IbQdQ',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list2-0.png', img: 'contentLibrary/1003/item2-list2-0.png',
text: '哺乳期出门=荒野求生？ 哺乳妈妈的高阶出...', text: '哺乳期出门=荒野求生？ 哺乳妈妈的高阶出...',
url: 'https://mp.weixin.qq.com/s/ku3wiGGXvczq6BOpwmd8bg', url: 'https://mp.weixin.qq.com/s/ku3wiGGXvczq6BOpwmd8bg',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 310, textWidth: 310,
bottom: 43 bottom: 43
} }
], ],
contentList12:[ contentList12:[
{ {
img: 'contentLibrary/1001/item0-list2-1.png', img: 'contentLibrary/1003/item0-list2-1.png',
text: '砸2万上早教不如逛 100次菜市场？真相…', text: '砸2万上早教不如逛 100次菜市场？真相…',
url: 'https://mp.weixin.qq.com/s/BtuaNnl-thV5M30_tqKpvA', url: 'https://mp.weixin.qq.com/s/BtuaNnl-thV5M30_tqKpvA',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list2-1.png', img: 'contentLibrary/1003/item1-list2-1.png',
text: '聪明家长必备！这两 种平衡拿捏好，解...', text: '聪明家长必备！这两 种平衡拿捏好，解...',
url: 'https://mp.weixin.qq.com/s/HS4UPDRtAtqlf-urGALD5w', url: 'https://mp.weixin.qq.com/s/HS4UPDRtAtqlf-urGALD5w',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list2-1.png', img: 'contentLibrary/1003/item2-list2-1.png',
text: '多孩家庭：80%父母 可能正陷入“偏爱盲...', text: '多孩家庭：80%父母 可能正陷入“偏爱盲...',
url: 'https://mp.weixin.qq.com/s/6sKO12QCs5jvmENoGczqmw', url: 'https://mp.weixin.qq.com/s/6sKO12QCs5jvmENoGczqmw',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
} }
], ],
contentList22:[ contentList22:[
{ {
img: 'contentLibrary/1001/item0-list2-2.png', img: 'contentLibrary/1003/item0-list2-2.png',
text: '女性结婚有娃后，友 谊就注定变淡吗?', text: '女性结婚有娃后，友 谊就注定变淡吗?',
url: 'https://mp.weixin.qq.com/s/89dJzmlmrhM0fqSUufaSnA', url: 'https://mp.weixin.qq.com/s/89dJzmlmrhM0fqSUufaSnA',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list2-2.png', img: 'contentLibrary/1003/item1-list2-2.png',
text: '一套过节“高情商回话 公式”，专治嘴笨...', text: '一套过节“高情商回话 公式”，专治嘴笨...',
url: 'https://mp.weixin.qq.com/s/UohhkMxB6rXH4yQeC3EF6A', url: 'https://mp.weixin.qq.com/s/UohhkMxB6rXH4yQeC3EF6A',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list2-2.png', img: 'contentLibrary/1003/item2-list2-2.png',
text: '真正压垮女性的，从 来不只是“家务劳...', text: '真正压垮女性的，从 来不只是“家务劳...',
url: 'https://mp.weixin.qq.com/s/nUWBqqaykIdWXcTX6G0OJw', url: 'https://mp.weixin.qq.com/s/nUWBqqaykIdWXcTX6G0OJw',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
} }
], ],
contentList03:[ contentList03:[
{ {
img: 'contentLibrary/1001/item0-list3-0.png', img: 'contentLibrary/1003/item0-list3-0.png',
text: '超实用！0-3岁宝宝居 家早教攻略，轻松...', text: '超实用！0-3岁宝宝居 家早教攻略，轻松...',
url:'https://mp.weixin.qq.com/s/CVtfzrmY8ER64rO8CBdFIg', url:'https://mp.weixin.qq.com/s/CVtfzrmY8ER64rO8CBdFIg',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list3-0.png', img: 'contentLibrary/1003/item1-list3-0.png',
text: '0-3岁不花钱早教，也 能让宝宝的智商赢...', text: '0-3岁不花钱早教，也 能让宝宝的智商赢...',
url:'https://mp.weixin.qq.com/s/4NpvNlpa1MF-pYpMJ7Zi0w', url:'https://mp.weixin.qq.com/s/4NpvNlpa1MF-pYpMJ7Zi0w',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list3-0.png', img: 'contentLibrary/1003/item2-list3-0.png',
text: '0~3岁保姆级教程，不 用花钱早教，就能...', text: '0~3岁保姆级教程，不 用花钱早教，就能...',
url:'https://mp.weixin.qq.com/s/y0kPoMPQI_skcEbh6gVKRA', url:'https://mp.weixin.qq.com/s/y0kPoMPQI_skcEbh6gVKRA',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 310, textWidth: 310,
bottom: 43 bottom: 43
} }
], ],
contentList13:[ contentList13:[
{ {
img: 'contentLibrary/1001/item0-list3-1.png', img: 'contentLibrary/1003/item0-list3-1.png',
text: '毛毛镇\n《集落叶大行动》', text: '毛毛镇\n《集落叶大行动》',
url:'', url:'contentLibrary/1003/libraryVideo0.mp4',
videoUrl:'contentLibrary/1003/libraryVideo0.mp4',
isvideo:true,
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list3-1.png', img: 'contentLibrary/1003/item1-list3-1.png',
text: '毛毛镇\n《弹力条条》', text: '毛毛镇\n《弹力条条》',
url:'', url:'contentLibrary/1003/libraryVideo1.mp4',
videoUrl:'contentLibrary/1003/libraryVideo1.mp4',
isvideo:true,
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list3-1.png', img: 'contentLibrary/1003/item2-list3-1.png',
text: '毛毛镇\n《你好春天》', text: '毛毛镇\n《你好春天》',
url:'', url:'contentLibrary/1003/libraryVideo2.mp4',
videoUrl:'contentLibrary/1003/libraryVideo2.mp4',
isvideo:true,
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
} }
], ],
contentList23:[ contentList23:[
{ {
img: 'contentLibrary/1001/item0-list3-2.png', img: 'contentLibrary/1003/item0-list3-2.png',
text: '读了50位妈妈的育儿 经验发现：亲子...', text: '读了50位妈妈的育儿 经验发现：亲子...',
url:'https://mp.weixin.qq.com/s/ubpkqXVXjQj74fH0SPztwA', url:'https://mp.weixin.qq.com/s/ubpkqXVXjQj74fH0SPztwA',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 53 bottom: 53
}, },
{ {
img: 'contentLibrary/1001/item1-list3-2.png', img: 'contentLibrary/1003/item1-list3-2.png',
text: '家庭教育很重要！做 好这6点，养出优...', text: '家庭教育很重要！做 好这6点，养出优...',
url:'https://mp.weixin.qq.com/s/xwRZUyeWR6nD5Z0NtpXojQ', url:'https://mp.weixin.qq.com/s/xwRZUyeWR6nD5Z0NtpXojQ',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
}, },
{ {
img: 'contentLibrary/1001/item2-list3-2.png', img: 'contentLibrary/1003/item2-list3-2.png',
text: '宝宝一犯错就上头？ 掌握这7个办法解...', text: '宝宝一犯错就上头？ 掌握这7个办法解...',
url:'https://mp.weixin.qq.com/s/DzCEhMCvj4A5tSvdvxZBtA', url:'https://mp.weixin.qq.com/s/DzCEhMCvj4A5tSvdvxZBtA',
width: 687, width: 687,
height: 192, height: 192,
imgHeight: 192, imgHeight: 192,
imgWidth: 357,
textWidth: 290, textWidth: 290,
bottom: 43 bottom: 43
} }
...@@ -650,22 +682,525 @@ ...@@ -650,22 +682,525 @@
}); });
// const libraryData = ref(
// {
// bannerList: [
// {
// bgUrl: "banner-cl0.png",
// url: "https://mp.weixin.qq.com/s/Xn5dh96OaQ9CcsVMZ5jnvg"
// },
// {
// bgUrl: "banner-cl1.png",
// url: "https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg"
// },
// {
// bgUrl: "banner-cl2.png",
// url: "https://mp.weixin.qq.com/s/W75YKmpxJdDqZtAixkltyQ"
// }
// ],
// tabConfigs: {
// expert: ["疾病护理", "脑育科普", "孕期护理"],
// nutrition: ["辅食制作", "奶粉百科", "全家营养"],
// momTalk: ["新鲜热议", "家庭生活", "心理成长"],
// parentingLife: ["早教学习", "动画故事", "家庭关系"]
// },
// product: [
// [
// {
// bgUrl: "contentLibrary/1003/item0-list0-0.png",
// desc: "孩子出游腿疼≠在长...",
// link: {
// url: "https://mp.weixin.qq.com/s/RGzeUaabqKm6xM6jjbZPIQ",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item1-list0-0.png",
// desc: "打完疫苗就走？这30...",
// link: {
// url: "https://mp.weixin.qq.com/s/HcQbburuQGgPyGahj1RA6Q",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/show-img0-list0.png",
// desc: "已有儿童中招，严重可瘫痪！夏季防蜱虫最全...",
// link: {
// url: "https://mp.weixin.qq.com/s/fL5UZjWUXmPrjJgSe2Hr5g",
// type: 3
// },
// width: 686,
// height: 484,
// imgHeight: 347,
// textWidth: 625,
// bottom: 53
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list0-1.png",
// desc: "怕娃不聪明？5招开...",
// link: {
// url: "https://mp.weixin.qq.com/s/xzDYoPdMMIt5e3KYxHnwYg",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item1-list0-1.png",
// desc: "情绪失控≠熊孩子！全...",
// link: {
// url: "https://mp.weixin.qq.com/s/NSyo1U6A1Yrw1WymPwm48A",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 309,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/show-img0-list1.png",
// desc: "认清脑育认知的三大误区！让娃赢在起点",
// link: {
// url: "https://mp.weixin.qq.com/s/f1Y59OJ9FBZ3tF47PJ9aBw",
// type: 3
// },
// width: 686,
// height: 484,
// imgHeight: 347,
// textWidth: 625,
// bottom: 53
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list0-2.png",
// desc: "孕期最重要的6次产...",
// link: {
// url: "https://mp.weixin.qq.com/s/R1557EIof8dHnalMQNNXhg",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item1-list0-2.png",
// desc: "孕期或哺乳期感染新...",
// link: {
// url: "https://mp.weixin.qq.com/s/XSViARdv9AOidSz2DKahTQ",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/show-img0-list2.png",
// desc: "除了叶酸，孕期妈妈还应该补什么?",
// link: {
// url: "https://mp.weixin.qq.com/s/qmUf3fW8bYi7C33hXQcnfQ",
// type: 3
// },
// width: 686,
// height: 484,
// imgHeight: 347,
// textWidth: 625,
// bottom: 53
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/show-img1-list1.png",
// desc: "奶粉罐上的OPO是智商税吗？一文说清它到底 值不值得买！",
// link: {
// url: "https://mp.weixin.qq.com/s/BOENbTE-5fNe0rwnlvzeng",
// type: 3
// },
// width: 686,
// height: 484,
// imgHeight: 347,
// textWidth: 625,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item0-list1-1.png",
// desc: "宝妈必看！养娃不可...",
// link: {
// url: "https://mp.weixin.qq.com/s/Evqc7KJMsNYS_MQox1oCfw",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item1-list1-1.png",
// desc: "警惕！冬季奶粉喂养...",
// link: {
// url: "https://mp.weixin.qq.com/s/JjqPDlyGkodZPulv-2gQBA",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 309,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/show-img1-list2.png",
// desc: "一篇掌握全龄饮食黄金指南！",
// link: {
// url: "https://mp.weixin.qq.com/s/9CUJMqjNmUlUjnjUFb40eg",
// type: 3
// },
// width: 686,
// height: 484,
// imgHeight: 347,
// textWidth: 625,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item0-list1-2.png",
// desc: "五一春游零食清单，全...",
// link: {
// url: "https://mp.weixin.qq.com/s/3WHTYk-nEyN9CtSn4ZCj0A",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 315,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item1-list1-2.png",
// desc: "解锁适合全家的美味...",
// link: {
// url: "https://mp.weixin.qq.com/s/ksRxfSzFxLHahB48bnKMuQ",
// type: 3
// },
// width: 332,
// height: 410,
// imgHeight: 293,
// textWidth: 300,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list2-0.png",
// desc: "《六姊妹》大结局引 热议！如何成为...",
// link: {
// url: "https://mp.weixin.qq.com/s/1ge3dA0f3IbfgPghFJKqJg",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list2-0.png",
// desc: "家长必看！《哪吒2》 票房火爆背后，竟...",
// link: {
// url: "https://mp.weixin.qq.com/s/kX37uMOZTAQyo4Ng7IbQdQ",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list2-0.png",
// desc: "哺乳期出门=荒野求生？ 哺乳妈妈的高阶出...",
// link: {
// url: "https://mp.weixin.qq.com/s/ku3wiGGXvczq6BOpwmd8bg",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 310,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list2-1.png",
// desc: "砸2万上早教不如逛 100次菜市场？真相…",
// link: {
// url: "https://mp.weixin.qq.com/s/BtuaNnl-thV5M30_tqKpvA",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list2-1.png",
// desc: "聪明家长必备！这两 种平衡拿捏好，解...",
// link: {
// url: "https://mp.weixin.qq.com/s/HS4UPDRtAtqlf-urGALD5w",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list2-1.png",
// desc: "多孩家庭：80%父母 可能正陷入\"偏爱盲...",
// link: {
// url: "https://mp.weixin.qq.com/s/6sKO12QCs5jvmENoGczqmw",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list2-2.png",
// desc: "女性结婚有娃后，友 谊就注定变淡吗?",
// link: {
// url: "https://mp.weixin.qq.com/s/89dJzmlmrhM0fqSUufaSnA",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list2-2.png",
// desc: "一套过节\"高情商回话 公式\"，专治嘴笨...",
// link: {
// url: "https://mp.weixin.qq.com/s/UohhkMxB6rXH4yQeC3EF6A",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list2-2.png",
// desc: "真正压垮女性的，从 来不只是\"家务劳...",
// link: {
// url: "https://mp.weixin.qq.com/s/nUWBqqaykIdWXcTX6G0OJw",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list3-0.png",
// desc: "超实用！0-3岁宝宝居 家早教攻略，轻松...",
// link: {
// url: "https://mp.weixin.qq.com/s/CVtfzrmY8ER64rO8CBdFIg",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list3-0.png",
// desc: "0-3岁不花钱早教，也 能让宝宝的智商赢...",
// link: {
// url: "https://mp.weixin.qq.com/s/4NpvNlpa1MF-pYpMJ7Zi0w",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list3-0.png",
// desc: "0~3岁保姆级教程，不 用花钱早教，就能...",
// link: {
// url: "https://mp.weixin.qq.com/s/y0kPoMPQI_skcEbh6gVKRA",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 310,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list3-1.png",
// desc: "毛毛镇\n《集落叶大行动》",
// url: "contentLibrary/1003/libraryVideo0.mp4",
// videoUrl: "contentLibrary/1003/libraryVideo0.mp4",
// isvideo: true,
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list3-1.png",
// desc: "毛毛镇\n《弹力条条》",
// url: "contentLibrary/1003/libraryVideo1.mp4",
// videoUrl: "contentLibrary/1003/libraryVideo1.mp4",
// isvideo: true,
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list3-1.png",
// desc: "毛毛镇\n《你好春天》",
// url: "contentLibrary/1003/libraryVideo2.mp4",
// videoUrl: "contentLibrary/1003/libraryVideo2.mp4",
// isvideo: true,
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// }
// ],
// [
// {
// bgUrl: "contentLibrary/1003/item0-list3-2.png",
// desc: "读了50位妈妈的育儿 经验发现：亲子...",
// link: {
// url: "https://mp.weixin.qq.com/s/ubpkqXVXjQj74fH0SPztwA",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 53
// },
// {
// bgUrl: "contentLibrary/1003/item1-list3-2.png",
// desc: "家庭教育很重要！做 好这6点，养出优...",
// link: {
// url: "https://mp.weixin.qq.com/s/xwRZUyeWR6nD5Z0NtpXojQ",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// },
// {
// bgUrl: "contentLibrary/1003/item2-list3-2.png",
// desc: "宝宝一犯错就上头？ 掌握这7个办法解...",
// link: {
// url: "https://mp.weixin.qq.com/s/DzCEhMCvj4A5tSvdvxZBtA",
// type: 3
// },
// width: 687,
// height: 192,
// imgHeight: 192,
// imgWidth: 357,
// textWidth: 290,
// bottom: 43
// }
// ]
// ]
// });
const bannerList = ref([ const bannerList = ref([
{ {
img: $baseUrl + `contentLibrary/1001/${libraryData?.value?.bannerList[0]?.img}`, img: $baseUrl + `contentLibrary/1003/${libraryData?.value?.bannerList[0]?.img}`,
url: `${libraryData?.value?.bannerList[0]?.url}` url: `${libraryData?.value?.bannerList[0]?.url}`
}, },
{ {
img: $baseUrl + `contentLibrary/1001/${libraryData?.value?.bannerList[1]?.img}`, img: $baseUrl + `contentLibrary/1003/${libraryData?.value?.bannerList[1]?.img}`,
url: `${libraryData?.value?.bannerList[1]?.url}` url: `${libraryData?.value?.bannerList[1]?.url}`
}, },
{ {
img: $baseUrl + `contentLibrary/1001/${libraryData?.value?.bannerList[2]?.img}`, img: $baseUrl + `contentLibrary/1003/${libraryData?.value?.bannerList[2]?.img}`,
url: `${libraryData?.value?.bannerList[2]?.url}` url: `${libraryData?.value?.bannerList[2]?.url}`
} }
]); ]);
const showVideo = ref(false);
const currentVideoUrl = ref('');
const closeVideo = () => {
showVideo.value = false;
}
const openVideo = (url) => {
showVideo.value = true;
currentVideoUrl.value = url;
}
const listTitles = ref([ const listTitles = ref([
'专家来了', '专家来了',
...@@ -681,10 +1216,12 @@ ...@@ -681,10 +1216,12 @@
parentingLife: libraryData?.value?.tabConfigs?.parentingLife parentingLife: libraryData?.value?.tabConfigs?.parentingLife
}); });
const contentList0 = ref(libraryData?.value?.contentList0); // const contentList0 = ref(libraryData?.value?.product[0]);
// const contentList1 = ref(libraryData?.value?.product[1]);
// const contentList2 = ref(libraryData?.value?.product[2]);
const contentList0 = ref(libraryData?.value?.contentList0);
const contentList1 = ref(libraryData?.value?.contentList1); const contentList1 = ref(libraryData?.value?.contentList1);
const contentList2 = ref(libraryData?.value?.contentList2); const contentList2 = ref(libraryData?.value?.contentList2);
...@@ -697,6 +1234,11 @@ ...@@ -697,6 +1234,11 @@
} }
//营养辅食 //营养辅食
// const contentList01 = ref(libraryData?.value?.product[3])
// const contentList11 = ref(libraryData?.value?.product[4])
// const contentList21 = ref(libraryData?.value?.product[5])
const contentList01 = ref(libraryData?.value?.contentList01) const contentList01 = ref(libraryData?.value?.contentList01)
const contentList11 = ref(libraryData?.value?.contentList11) const contentList11 = ref(libraryData?.value?.contentList11)
const contentList21 = ref(libraryData?.value?.contentList21) const contentList21 = ref(libraryData?.value?.contentList21)
...@@ -710,9 +1252,12 @@ ...@@ -710,9 +1252,12 @@
} }
//星妈Talk //星妈Talk
// const contentList02 = ref(libraryData?.value?.product[6])
// const contentList12 = ref(libraryData?.value?.product[7])
// const contentList22 = ref(libraryData?.value?.product[8])
const contentList02 = ref(libraryData?.value?.contentList02) const contentList02 = ref(libraryData?.value?.contentList02)
const contentList12 = ref(libraryData?.value?.contentList12) const contentList12 = ref(libraryData?.value?.contentList12)
const contentList22 = ref(libraryData?.value?.contentList22) const contentList22 = ref(libraryData?.value?.contentList22)
const listData3 = ref([]); const listData3 = ref([]);
...@@ -724,9 +1269,12 @@ ...@@ -724,9 +1269,12 @@
} }
//亲子生活 //亲子生活
// const contentList03 = ref(libraryData?.value?.product[9])
// const contentList13 = ref(libraryData?.value?.product[10])
// const contentList23 = ref(libraryData?.value?.product[11])
const contentList03 = ref(libraryData?.value?.contentList03) const contentList03 = ref(libraryData?.value?.contentList03)
const contentList13 = ref(libraryData?.value?.contentList13) const contentList13 = ref(libraryData?.value?.contentList13)
const contentList23 = ref(libraryData?.value?.contentList23) const contentList23 = ref(libraryData?.value?.contentList23)
const listData4 = ref([]); const listData4 = ref([]);
...@@ -737,8 +1285,17 @@ ...@@ -737,8 +1285,17 @@
activeTab4.value = e.index activeTab4.value = e.index
} }
onBeforeMount(async() => {
const {data} = await fetchContentLibraryJSON();
// libraryData.value = {...data};
// console.log('integralData.value',libraryData.value);
console.log('libraryData.value===',libraryData.value.bannerList,bannerList.value);
})
// 页面加载 // 页面加载
onMounted(() => { onMounted(() => {
listData1.value = [contentList0.value, contentList1.value, contentList2.value]; listData1.value = [contentList0.value, contentList1.value, contentList2.value];
listData2.value = [contentList01.value, contentList11.value, contentList21.value]; listData2.value = [contentList01.value, contentList11.value, contentList21.value];
listData3.value = [contentList02.value, contentList12.value, contentList22.value]; listData3.value = [contentList02.value, contentList12.value, contentList22.value];
...@@ -788,14 +1345,13 @@ ...@@ -788,14 +1345,13 @@
} }
//第四个三切页列表，亲子生活 //第四个三切页列表，亲子生活
const qinziHandler = (url) => { const qinziHandler = (item) => {
if(url == ''){ if(item.isvideo){
openVideo($baseUrl + item.videoUrl);
}else{ }else{
jump({ jump({
type: JumpType.H5, type: JumpType.H5,
url: url url: item.url
}) })
} }
} }
...@@ -862,8 +1418,13 @@ ...@@ -862,8 +1418,13 @@
margin-right: auto; margin-right: auto;
.dynamic-item { .dynamic-item {
background-color: #fff;
border-radius: 16rpx;
width: 332;
height: 410rpx;
position: relative; position: relative;
.item-img { .item-img {
top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
...@@ -915,6 +1476,8 @@ ...@@ -915,6 +1476,8 @@
.dynamic-item1 { .dynamic-item1 {
position: relative; position: relative;
background-color: #fff;
border-radius: 16rpx;
.item-img1 { .item-img1 {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -952,7 +1515,35 @@ ...@@ -952,7 +1515,35 @@
} }
.video-popup {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.7);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 9999;
}
.close-btn-bottom {
margin: 32rpx auto 0 auto;
width: 64rpx;
height: 64rpx;
border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
color: #fff;
font-size: 44rpx;
line-height: 64rpx;
text-align: center;
z-index: 10001;
display: flex;
align-items: center;
justify-content: center;
}
......
views/Integral.vue
View file @ 859400e8
...@@ -1124,6 +1124,12 @@ ...@@ -1124,6 +1124,12 @@
//积分兑换按钮点击事件 //积分兑换按钮点击事件
const handleExchargeClick = () => { const handleExchargeClick = () => {
jump({
type: 1,
url: '/pages/library/ContentLibrary'
});return;
const url = vipIntegral.value.excharge.url; const url = vipIntegral.value.excharge.url;
const type = vipIntegral.value.excharge.type; const type = vipIntegral.value.excharge.type;
const extra = vipIntegral.value.excharge.extra; const extra = vipIntegral.value.excharge.extra;
......
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