Skip to content

飞
飞鹤小程序
Commit 0dbad40a authored by spc's avatar spc
Browse files
Options

json

parent 49c6ba9a
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 864 additions and 168 deletions
activity0915/act0915/act0915.vue
View file @ 0dbad40a
This diff is collapsed.
activity0915/act0915/act915page.less
View file @ 0dbad40a
// 加载状态样式
.loading-container {
width: 750rpx;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: #f5f5f5;
text {
font-size: 32rpx;
color: #666;
}
}
// 915活动页面样式
.act915page {
width: 750rpx;
......@@ -5,6 +20,8 @@
left: 0rpx;
top: 0rpx;
position: absolute;
max-width: 100vw; // 确保不超过视口宽度
overflow-x: hidden; // 防止水平滚动
.act915pagebg {
width: 750rpx;
......@@ -46,31 +63,50 @@
background-position: center;
}
.act915pagegoods3products {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
gap: 10rpx; // 进一步减小间距
padding: 10rpx; // 进一步减小内边距
pointer-events: none; // 让子元素可以点击
.act915pagegoods3product {
flex: 1;
height: 100%;
position: relative;
pointer-events: auto; // 恢复点击事件
cursor: pointer;
transition: opacity 0.3s ease;
border-radius: 4rpx; // 进一步调整圆角
&:hover {
opacity: 0.8;
}
}
}
.act915pagegoods3products {
position: absolute;
top: 13rpx;
left: 10rpx;
width: 203rpx;
height: 286rpx;
display: flex;
gap: 14rpx; // 商品之间的间距
padding: 25rpx; // 容器内边距
pointer-events: none; // 让子元素可以点击
.act915pagegoods3product {
flex: 1;
height: 286rpx; // 固定高度，确保商品项有足够空间
position: relative;
pointer-events: auto; // 恢复点击事件
cursor: pointer;
transition: all 0.3s ease;
border-radius: 16rpx; // 圆角
background: rgba(255, 0, 0, 0.3); // 深红色背景，便于调试
min-width: 200rpx; // 最小宽度确保可点击性
border: 3rpx solid rgba(255, 0, 0, 0.6); // 深红色边框
&:hover {
opacity: 0.8;
transform: scale(1.02);
background: rgba(255, 0, 0, 0.5); // 悬停时背景更深
border-color: rgba(255, 0, 0, 0.8);
}
// 为不同位置的商品设置不同的点击区域
&.product-left {
// 左侧商品点击区域
}
&.product-center {
// 中间商品点击区域
}
&.product-right {
// 右侧商品点击区域
}
}
}
}
.act915pagegoodslist2 {
......@@ -84,6 +120,83 @@
background-position: center;
}
.act915pagegoodslist2-container {
width: 701rpx;
height: 791rpx;
left: 24rpx;
top: 3369rpx;
position: absolute;
.act915pagegoodslist2bg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.act915pagegoodslist2products {
position: absolute;
top: 110rpx;
left: 10rpx;
width: 654rpx;
height: 316 * 2rpx;
display: grid;
grid-template-columns: 1fr 1fr 1fr; // 3列等宽
grid-template-rows: 1fr 1fr; // 2行等高
gap: 0rpx; // 网格间距
padding: 20rpx; // 容器内边距
pointer-events: none; // 让子元素可以点击
.act915pagegoodslist2product {
position: relative;
pointer-events: auto; // 恢复点击事件
cursor: pointer;
transition: all 0.3s ease;
border-radius: 16rpx; // 圆角
background: rgba(0, 0, 255, 0.3); // 深蓝色背景，便于调试
width: 204rpx;
height: 295rpx;
border: 3rpx solid rgba(0, 0, 255, 0.6); // 深蓝色边框
&:hover {
opacity: 0.8;
transform: scale(1.02);
background: rgba(0, 0, 255, 0.5); // 悬停时背景更深
border-color: rgba(0, 0, 255, 0.8);
}
// 为不同位置的商品设置不同的点击区域
&.product-1 {
// 第一行左侧商品
}
&.product-2 {
// 第一行中间商品
}
&.product-3 {
// 第一行右侧商品
}
&.product-4 {
// 第二行左侧商品
}
&.product-5 {
// 第二行中间商品
}
&.product-6 {
// 第二行右侧商品
}
}
}
}
.act915pagegoodslist1-container {
width: 701rpx;
height: 795rpx;
......@@ -102,31 +215,63 @@
background-position: center;
}
.act915pagegoodslist1products {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 10rpx; // 进一步减小间距
padding: 10rpx; // 进一步减小内边距
pointer-events: none; // 让子元素可以点击
.act915pagegoodslist1product {
position: relative;
pointer-events: auto; // 恢复点击事件
cursor: pointer;
transition: opacity 0.3s ease;
border-radius: 4rpx; // 进一步调整圆角
&:hover {
opacity: 0.8;
}
}
}
.act915pagegoodslist1products {
position: absolute;
top: 113rpx;
left: 10rpx;
width: 654rpx;
height: 316 * 2rpx;
display: grid;
grid-template-columns: 1fr 1fr 1fr; // 3列等宽
grid-template-rows: 1fr 1fr; // 2行等高
gap: 0rpx; // 网格间距
padding: 20rpx; // 容器内边距
pointer-events: none; // 让子元素可以点击
.act915pagegoodslist1product {
position: relative;
pointer-events: auto; // 恢复点击事件
cursor: pointer;
transition: all 0.3s ease;
border-radius: 16rpx; // 圆角
background: rgba(0, 255, 0, 0.3); // 深绿色背景，便于调试
width: 204rpx;
height: 295rpx;
border: 3rpx solid rgba(0, 255, 0, 0.6); // 深绿色边框
&:hover {
opacity: 0.8;
transform: scale(1.02);
background: rgba(0, 255, 0, 0.5); // 悬停时背景更深
border-color: rgba(0, 255, 0, 0.8);
}
// 为不同位置的商品设置不同的点击区域
&.product-1 {
// 第一行左侧商品
}
&.product-2 {
// 第一行中间商品
}
&.product-3 {
// 第一行右侧商品
}
&.product-4 {
// 第二行左侧商品
}
&.product-5 {
// 第二行中间商品
}
&.product-6 {
// 第二行右侧商品
}
}
}
}
.act915pageinvitecon {
......
api/activity0915/index.js
View file @ 0dbad40a
......@@ -24,3 +24,5 @@ export const getAct915LotteryInfo = () => api.get('/c/activity/act915/lottery/in
* @returns
*/
export const getAct915LotteryDraw = () => api.post('/c/activity/act915/lottery/draw')
export const fetchAct915JSON = () => api.get('/c/front/content', {type: 'act915'})
mock/act915.json 0 → 100644
View file @ 0dbad40a
{
"act915pagebg": "activity0915/act915/bg.png",
"act915pagegoods1": "activity0915/act915/goods1.png",
"act915pagegoods3bg": "activity0915/act915/goods3.png",
"act915pagegoodslist1bg": "activity0915/act915/goodslist1.png",
"act915pagegoodslist2bg": "activity0915/act915/goodslist2.png",
"act915pageinviteconbg": "activity0915/act915/inviteConBg.png",
"act915pageinviteconbtn": "activity0915/act915/inviteConBtn.png",
"act915pageinviteconstatusno2": "activity0915/act915/inviteConStatusNo2.png",
"act915pageinviteconstatusno1": "activity0915/act915/inviteConStatusNo1.png",
"act915pageinviteconstatusyes2": "activity0915/act915/inviteConStatusYes2.png",
"act915pageinviteconstatusyes1": "activity0915/act915/inviteConStatusYes1.png",
"act915pageinviteconimg": "activity0915/act915/inviteConImg.png",
"act915pagelotterybanner": "activity0915/act915/lotteryBanner.png",
"act915pagebanner": [
"activity0915/act915/banner1.png",
"activity0915/act915/banner2.png",
"activity0915/act915/banner3.png"
],
"act915pagebanner2": "activity0915/act915/banner2.png",
"act915pagebanner3": "activity0915/act915/banner3.png",
"texts": {
"inviteTitle": "邀请好友助力，赢取精美礼品"
},
"goods": {
"goods3": [
{
"id": 1,
"name": "爱本跃动蛋白",
"weight": "200g",
"price": "¥138",
"image": "activity0915/act915/goods3_1.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=1"
}
},
{
"id": 2,
"name": "爱本跃动蛋白",
"weight": "",
"price": "¥21.99",
"image": "activity0915/act915/goods3_2.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=2"
}
},
{
"id": 3,
"name": "爱本跃动蛋白",
"weight": "600g",
"price": "¥69",
"image": "activity0915/act915/goods3_3.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=3"
}
}
],
"goodslist1": [
{
"id": 1,
"name": "爱本跃动蛋白",
"weight": "200g",
"price": "¥138",
"image": "activity0915/act915/goodslist1_1.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=4"
}
},
{
"id": 2,
"name": "爱本纤纤",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist1_2.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=5"
}
},
{
"id": 3,
"name": "爱本跃动蛋白",
"weight": "600g",
"price": "¥138",
"image": "activity0915/act915/goodslist1_3.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=6"
}
},
{
"id": 4,
"name": "爱本乳铁蛋白配方奶粉",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist1_4.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=7"
}
},
{
"id": 5,
"name": "爱本缮骨配方奶粉",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist1_5.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=8"
}
},
{
"id": 6,
"name": "爱本乳铁蛋白配方奶粉",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist1_6.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=9"
}
}
],
"goodslist2": [
{
"id": 1,
"name": "商品1",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_1.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=10"
}
},
{
"id": 2,
"name": "商品2",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_2.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=11"
}
},
{
"id": 3,
"name": "商品3",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_3.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=12"
}
},
{
"id": 4,
"name": "商品4",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_4.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=13"
}
},
{
"id": 5,
"name": "商品5",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_5.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=14"
}
},
{
"id": 6,
"name": "商品6",
"weight": "",
"price": "¥138",
"image": "activity0915/act915/goodslist2_6.png",
"link": {
"extra": {},
"type": 1,
"url": "/pages/goodsDetail/goodsDetail?id=15"
}
}
]
},
"config": {
"images": {
"background": "act915pagebg",
"goods1": "act915pagegoods1",
"goods3": "act915pagegoods3bg",
"goodslist1": "act915pagegoodslist1bg",
"goodslist2": "act915pagegoodslist2bg",
"inviteConBg": "act915pageinviteconbg",
"inviteConBtn": "act915pageinviteconbtn",
"inviteConStatusNo2": "act915pageinviteconstatusno2",
"inviteConStatusNo1": "act915pageinviteconstatusno1",
"inviteConStatusYes2": "act915pageinviteconstatusyes2",
"inviteConStatusYes1": "act915pageinviteconstatusyes1",
"inviteConImg": "act915pageinviteconimg",
"lotteryBanner": "act915pagelotterybanner",
"banner": "act915pagebanner",
"banner2": "act915pagebanner2",
"banner3": "act915pagebanner3"
},
"texts": {
"inviteTitle": "邀请好友助力，赢取精美礼品"
}
},
"links": {
"lotteryBanner": {
"extra": {},
"type": 1,
"url": "/activity0915/lottery/lottery"
},
"inviteBtn": {
"extra": {},
"type": 1,
"url": "/pages/invite/invite"
},
"banner": [
{
"extra": {},
"type": 1,
"url": "/pages/syWebview/syWebview?p=act915_banner1"
},
{
"extra": {},
"type": 1,
"url": "/pages/syWebview/syWebview?p=act915_banner2"
},
{
"extra": {},
"type": 1,
"url": "/pages/syWebview/syWebview?p=act915_banner3"
}
]
}
}
mock/node_act915.js 0 → 100644
View file @ 0dbad40a
const act915Data = require('./act915.json')
module.exports = {
// 处理 act915 接口请求
handleAct915Request: (req, res) => {
const { type } = req.query
if (type === 'act915') {
res.json({
code: 200,
message: 'success',
data: act915Data
})
} else {
res.json({
code: 400,
message: 'Invalid type parameter',
data: null
})
}
}
}
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