damao
/
marketingsystem_temp_h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

C端所有图片切换

This commit is contained in:
zhangguoping 2024-08-30 14:41:23 +08:00
parent 7a6c27ca33
commit 9be978fb97
9 changed files with 73 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
src/router/index.ts
View File

@ -1,94 +1,102 @@
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router' import {
createRouter,
createWebHashHistory,
createWebHistory,
} from "vue-router";
import { LOGIN, QUERY } from "@/router/api"; import { LOGIN, QUERY } from "@/router/api";
// 公共路由 // 公共路由
const routePublic = [ const routePublic = [
{ {
// 商品中转（空白页） // 商品中转（空白页）
path: '/proTransfer', path: "/proTransfer",
name: 'proTransfer', name: "proTransfer",
component: () => {} component: () => ({}),
}, },
{ {
// 中转失败页 // 中转失败页
path: '/transferError', path: "/transferError",
name: 'transferError', name: "transferError",
component: () => import('../views/transferError.vue') component: () => import("../views/transferError.vue"),
}, },
]; ];
// 模版路由 命名：cmsXXX // 模版路由 命名：cmsXXX
// 需要：类组件开发、样式外部 index.scss 文件引入（禁用 vh，fixed 窗口相关样式） // 需要：类组件开发、样式外部 index.scss 文件引入（禁用 vh，fixed 窗口相关样式）
const routeTemplate = [ const routeTemplate = [
{ {
// 商品列表模版 // 商品列表模版
path: '/cmsList', path: "/cmsList",
name: 'cmsList', name: "cmsList",
component: () => import('@/views/templates/cmsList/index.vue') component: () => import("@/views/templates/cmsList/index.vue"),
}, },
{ {
// 商品详情模版 // 商品详情模版
path: '/cmsDetail', path: "/cmsDetail",
name: 'cmsDetail', name: "cmsDetail",
component: () => import('@/views/templates/cmsDetail/index.vue') component: () => import("@/views/templates/cmsDetail/index.vue"),
}, },
{ {
path: '/cmsCash', path: "/cmsCash",
name: 'cmsCash', name: "cmsCash",
component: () => import('@/views/templates/cmsCash/index.vue') component: () => import("@/views/templates/cmsCash/index.vue"),
}, },
{ {
path: '/cmsVoucher', path: "/cmsVoucher",
name: 'cmsVoucher', name: "cmsVoucher",
component: () => import('@/views/templates/cmsVoucher/index.vue') component: () => import("@/views/templates/cmsVoucher/index.vue"),
} },
]; ];
// H5 路由 // H5 路由
const routePage = [ const routePage = [
{ {
// 组合商品页 // 组合商品页
path: '/comProduct', path: "/comProduct",
name: 'comProduct', name: "comProduct",
component: () => import('../views/pages/comProduct/index.vue') component: () => import("../views/pages/comProduct/index.vue"),
}, },
] ];
const routes= [ ...routePublic, ...routeTemplate, ...routePage ]; const routes = [...routePublic, ...routeTemplate, ...routePage];
const router = createRouter({ const router = createRouter({
history: createWebHistory(), history: createWebHistory(),
routes routes,
}) });
router.beforeEach(async (to, from, next) => { router.beforeEach(async (to, from, next) => {
if (to.path === '/proTransfer') { // 商品中转 if (to.path === "/proTransfer") {
// 商品中转
// console.log('---proTransfer-router.beforeEach---', to, from); // console.log('---proTransfer-router.beforeEach---', to, from);
try { try {
const key = to.query.key || 'rPBVzOCs0FN4P7jNMqHo5IVfb0oaAyigbfNBmCKnavs='; const key =
to.query.key || "rPBVzOCs0FN4P7jNMqHo5IVfb0oaAyigbfNBmCKnavs=";
const res = await LOGIN({ key: key }); // 请求 token const res = await LOGIN({ key: key }); // 请求 token
if (res && res.code === 200) { if (res && res.code === 200) {
res.data.Token = res.data.Token =
"admingL_q2QjDlD_MdeU11q5ILoeLFEqhbGBtcEptfs-OHzI53vbrgX9GFCh-SB4fSJBGwgSTl.uDPUoyiPjJ2O6e7zUBzExUUXhsdnPxtyLwncYc8.vy9ikZRp-wUba2POZJlTERJxnLbK6DzpQFQTxuYfcNM_yl3Avo7hgCjkS-ot5QgzNiO5TE"; "admingL_q2QjDlD_MdeU11q5ILoeLFEqhbGBtcEptfs-OHzI53vbrgX9GFCh-SB4fSJBGwgSTl.uDPUoyiPjJ2O6e7zUBzExUUXhsdnPxtyLwncYc8.vy9ikZRp-wUba2POZJlTERJxnLbK6DzpQFQTxuYfcNM_yl3Avo7hgCjkS-ot5QgzNiO5TE";
if (res.data.Token) { if (res.data.Token) {
localStorage.setItem('token', res.data.Token); localStorage.setItem("token", res.data.Token);
const resList = await QUERY({ key: key }) // 根据商品判断 跳转指定路由 const resList = await QUERY({ key: key }); // 根据商品判断 跳转指定路由
if (resList && resList.code === 200) { if (resList && resList.code === 200) {
localStorage.setItem('key', String(key)); localStorage.setItem("key", String(key));
sessionStorage.removeItem('transferError_page_identify'); sessionStorage.removeItem("transferError_page_identify");
if (resList.data.length !== 1) { if (resList.data.length !== 1) {
sessionStorage.setItem('transferProListData', JSON.stringify(resList.data)); sessionStorage.setItem(
"transferProListData",
JSON.stringify(resList.data)
);
return next({ return next({
path: '/cmsList', path: "/cmsList",
query: { key: key } query: { key: key },
}); // 商品列表 }); // 商品列表
} else { } else {
const pro = resList.data[0] const pro = resList.data[0];
if (pro.goods.group_id) { if (pro.goods.group_id) {
return next({ return next({
path: '/comProduct', path: "/comProduct",
query: { group_id: pro.goods.group_id } query: { group_id: pro.goods.group_id },
}); // 组合商品 }); // 组合商品
} else { } else {
// todo 3 种商品的详情页 // todo 3 种商品的详情页
@ -96,24 +104,24 @@ router.beforeEach(async (to, from, next) => {
} }
} }
} else { } else {
showToast('登录失败'); showToast("登录失败");
} }
} else { } else {
showToast(res.message); showToast(res.message);
} }
next({ next({
path: '/transferError', path: "/transferError",
query: { redirect: to.fullPath } query: { redirect: to.fullPath },
}); });
} catch (error) { } catch (error) {
next({ next({
path: '/transferError', path: "/transferError",
query: { redirect: to.fullPath } query: { redirect: to.fullPath },
}); });
} }
} else { } else {
next(); // 对于非匹配路由，直接放行 next(); // 对于非匹配路由，直接放行
} }
}) });
export default router; export default router;

8
src/views/templates/cmsCash/index.scss
View File

@ -25,7 +25,7 @@
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_main_1.png") no-repeat; background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/common_img_main_1.png") no-repeat;
background-size: 100%; background-size: 100%;
} }
@ -52,7 +52,7 @@
#redPacketsViews .bt { #redPacketsViews .bt {
width: 200px; width: 200px;
height: 46px; height: 46px;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/but_back_img.png"); background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/but_back_img.png");
background-size: 100% 100%; background-size: 100% 100%;
margin: 0 auto; margin: 0 auto;
margin-top: 100px; margin-top: 100px;
@ -127,14 +127,14 @@
#redPacketsViews .instruction-header { #redPacketsViews .instruction-header {
width: 100%; width: 100%;
height: 43px; height: 43px;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_header.png") no-repeat; background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/common_img_header.png") no-repeat;
background-size: 100%; background-size: 100%;
margin-bottom: -3px; margin-bottom: -3px;
} }
#redPacketsViews .instruction { #redPacketsViews .instruction {
width: 100%; width: 100%;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_text.png") no-repeat; background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/common_img_text.png") no-repeat;
min-height: 450px; min-height: 450px;
background-size: 100% 100%; background-size: 100% 100%;
font-size: 11px; font-size: 11px;

4
src/views/templates/cmsCash/index.vue
View File

@ -4,7 +4,7 @@
<img <img
@click="backGoodsFn" @click="backGoodsFn"
class="backIcon" class="backIcon"
src="https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" src="https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/backprepageBtn.png"
alt="" alt=""
/> />
@ -54,7 +54,7 @@
<p class="center"> <p class="center">
<img <img
class="notice" class="notice"
src="https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/redPacktes/common_title_notice.png" src="https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/common_title_notice.png"
alt="" alt=""
/> />
</p> </p>

2
src/views/templates/cmsDetail/config.ts
View File

@ -42,7 +42,7 @@ export default [
url: "#", url: "#",
listType: "picture-card", listType: "picture-card",
dragFlag: true, dragFlag: true,
ossPath: "image", ossPath: "image/front",
fileType: ".png,.jpg,.jpeg", fileType: ".png,.jpg,.jpeg",
fieldName: "bottomImg", fieldName: "bottomImg",
removeFunc: true, removeFunc: true,

6
src/views/templates/cmsDetail/index.vue
View File

@ -25,7 +25,7 @@
<div v-if="cssData.activityDescType === 3 && cssData.floatText" class="description-3" v-html="cssData.floatText" /> <div v-if="cssData.activityDescType === 3 && cssData.floatText" class="description-3" v-html="cssData.floatText" />
<div v-if="popComStatus" class="popWrapper"> <div v-if="popComStatus" class="popWrapper">
<img @click="changePopComStatus" class="backImg" src="https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt=""> <img @click="changePopComStatus" class="backImg" src="https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/backprepageBtn.png" alt="">
<p class="title">活动规则</p> <p class="title">活动规则</p>
<div v-if="cssData.floatText" class="description-2" v-html="cssData.floatText"></div> <div v-if="cssData.floatText" class="description-2" v-html="cssData.floatText"></div>
</div> </div>
@ -62,11 +62,11 @@ export default {
activityDescType: 1, //活动说明：1 图片 2 悬浮 3 富文本 activityDescType: 1, //活动说明：1 图片 2 悬浮 3 富文本
bottomImg: [] as Array<any>, bottomImg: [] as Array<any>,
floatImg: 'https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/acticeTextTip.png', floatImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/acticeTextTip.png',
floatText: '', floatText: '',
// 默认背景 // 默认背景
carouselImg: 'https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/detailtop.png', carouselImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/detailtop.png',
defaultList: ['', ''], defaultList: ['', ''],
defaultListImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/uploads/2024-08-22/91D7DF7C-663C-4379-9BE1-E911B53D0801.png', defaultListImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/uploads/2024-08-22/91D7DF7C-663C-4379-9BE1-E911B53D0801.png',
}, },

4
src/views/templates/cmsList/config.ts
View File

@ -63,7 +63,7 @@ export default [
listType: "picture-card", listType: "picture-card",
dragFlag: true, dragFlag: true,
fileSize: 10, fileSize: 10,
ossPath: "image", ossPath: "image/front",
fileType: ".png,.jpg,.jpeg", fileType: ".png,.jpg,.jpeg",
fieldName: "bannerTop", fieldName: "bannerTop",
removeFunc: true, removeFunc: true,
@ -109,7 +109,7 @@ export default [
listType: "picture-card", listType: "picture-card",
dragFlag: true, dragFlag: true,
fileSize: 10, fileSize: 10,
ossPath: "image", ossPath: "image/front",
fileType: ".png,.jpg,.jpeg", fileType: ".png,.jpg,.jpeg",
fieldName: "bottomImg", fieldName: "bottomImg",
removeFunc: true, removeFunc: true,

8
src/views/templates/cmsList/index.vue
View File

@ -35,7 +35,7 @@
<div v-if="cssData.activityDescType === 3 && cssData.floatText" class="description-3" v-html="cssData.floatText" /> <div v-if="cssData.activityDescType === 3 && cssData.floatText" class="description-3" v-html="cssData.floatText" />
<div v-if="popComStatus" class="popWrapper"> <div v-if="popComStatus" class="popWrapper">
<img @click="changePopComStatus" class="backImg" src="https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt=""> <img @click="changePopComStatus" class="backImg" src="https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/backprepageBtn.png" alt="">
<p class="title">活动规则</p> <p class="title">活动规则</p>
<div v-if="cssData.floatText" class="description-2" v-html="cssData.floatText"></div> <div v-if="cssData.floatText" class="description-2" v-html="cssData.floatText"></div>
</div> </div>
@ -97,16 +97,16 @@ export default {
pageData: null, pageData: null,
cssData: { cssData: {
bannerUrl: '', bannerUrl: '',
bannerTop: [{ name: '', url: 'https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/goodstop.png'}], bannerTop: [{ name: '', url: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/goodstop.png'}],
btnColor: 'rgb(255, 255, 255)', btnColor: 'rgb(255, 255, 255)',
btnBgc: 'rgb(250, 205, 106)', btnBgc: 'rgb(250, 205, 106)',
contentType: 1, // 样式：1 轮播 2 列表 3 矩阵 contentType: 1, // 样式：1 轮播 2 列表 3 矩阵
activityDescType: 1, //活动说明：1 图片 2 悬浮 3 富文本 activityDescType: 1, //活动说明：1 图片 2 悬浮 3 富文本
bottomImg: [] as Array<any>, bottomImg: [] as Array<any>,
floatImg: 'https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/acticeTextTip.png', floatImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/acticeTextTip.png',
floatText: '', floatText: '',
carouselImg: 'https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/swiper.png', carouselImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/swiper.png',
defaultList: [1, 2, 3, 4, 5], defaultList: [1, 2, 3, 4, 5],
defaultListImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/uploads/2024-08-20/A89BB503-00DC-456e-B757-CA04ADFA9C06.png', defaultListImg: 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/uploads/2024-08-20/A89BB503-00DC-456e-B757-CA04ADFA9C06.png',
defaultMatrix: [1, 2, 3, 4, 5, 6], defaultMatrix: [1, 2, 3, 4, 5, 6],

4
src/views/templates/cmsVoucher/index.scss
View File

@ -28,7 +28,7 @@
min-height: 90px; min-height: 90px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/reduce/coupon.png"); background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/coupon.png");
background-size: 100% 100%; background-size: 100% 100%;
} }
@ -115,7 +115,7 @@
#reduce .receiveBtn { #reduce .receiveBtn {
width: 178px; width: 178px;
height: 46px; height: 46px;
background: url("https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/reduce/btnbg.png") no-repeat 100% 100% / cover; background: url("https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/btnbg.png") no-repeat 100% 100% / cover;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

2
src/views/templates/cmsVoucher/index.vue
View File

@ -51,7 +51,7 @@
@click="backgoodsFn" @click="backgoodsFn"
v-if="backAble" v-if="backAble"
class="backIcon" class="backIcon"
src="https://lsxdemall.oss-cn-chengdu.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" src="https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/backprepageBtn.png"
alt="" alt=""
/> />
</span> </span>