!12 2022-1-13 Jiamin

Merge pull request !12 from Admin/sit-jiamin-v2
This commit is contained in:
Admin 2022-01-13 15:13:46 +00:00 committed by Gitee
commit 34d4fe3070
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
15 changed files with 406 additions and 329 deletions

View File

@ -0,0 +1,319 @@
@media screen and (max-width:768px){
.allmain{
.rc-top{
margin-top: 2.5rem;
}
}
.active {
font-size: 14px;
color: #E2001A;
}
.unactive {
font-size: 14px;
color: #444444;
}
.rc-usermain{
.online{
margin-top: 0;
}
.rc {
height: 64px;
display: flex;
align-items: center;
margin-left: 23px;
span {
display: block;
margin-left: 32px;
font-weight: bold;
}
span:first-child {
margin-left: 0;
}
}
}
.rc-discount {
margin-left: 20px;
display: flex;
margin-top: 16px;
width: 335px;
background: #ffffff;
position: relative;
img {
display: block;
width: 100%;
height: 100%;
}
.rc-contair {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 8;
}
.rc-left {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #e1001a;
text-align: center;
width: 30%;
font-weight: bold;
float: left;
height: 100%;
i {
font-style: normal;
font-size: 12px;
}
span {
font-size: 26px;
}
strong {
font-style: normal;
font-size: 12px;
display: block;
}
}
.rc-right {
display: flex;
flex-direction: column;
height: 100%;
i {
font-style: normal;
font-size: 14px;
color: #e1001a;
}
.rc-userfont {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #999999;
font-size: 12px;
strong{
display: block;
margin-top: 8px;
}
}
em {
font-style: normal;
}
.ts-stand{
display: flex;
align-items: center;
justify-content: end;
padding-right: 17px;
margin-bottom: 8px;
}
.ts-standard-btn{
width: 72px;
display: flex;
height: 25px;
background: #E2001A;
border-radius: 100px;
align-items: center;
font-size: 12px;
justify-content: center;
margin-top: 8px;
}
span{
margin-top: 0;
}
margin-top: 17px;
padding-left: 36px;
}
.rc-footer {
display: flex;
align-items:flex-end
span {
width: 72px;
height: 25px;
background: #e2001a;
text-align: center;
line-height: 25px;
font-size: 12px;
color: #ffffff;
margin-bottom: 8px;
border-radius: 100px;
margin-right: 30px;
}
}
}
}
@media screen and (min-width: 769px){
.allmain{
.rc-top{
margin-top: 1.5rem;
}
.rs-dis{
display: flex;
flex-flow: wrap;
justify-content: center;
}
}
.active {
font-size: 14px;
color: #E2001A;
}
.unactive {
font-size: 14px;
color: #444444;
}
.rc-usermain{
.online{
margin-top: 0;
}
.rc {
height: 96px;
display: flex;
align-items: center;
margin-left: 23px;
justify-content: center;
span {
display: block;
margin-left: 40px;
font-size: 16px;
font-weight: bold;
}
span:first-child {
margin-left: 0;
}
}
}
.rc-discount {
margin-left: 20px;
display: flex;
margin-top: 16px;
width: 335px;
background: #ffffff;
position: relative;
img {
display: block;
width: 100%;
height: 100%;
}
.rc-contair {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 8;
}
.rc-left {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #e1001a;
text-align: center;
width: 30%;
font-weight: bold;
float: left;
height: 100%;
i {
font-style: normal;
font-size: 12px;
}
span {
font-size: 26px;
}
strong {
font-style: normal;
font-size: 12px;
display: block;
}
}
.rc-right {
display: flex;
flex-direction: column;
height: 100%;
i {
font-style: normal;
font-size: 16px;
color: #e1001a;
}
.rc-userfont {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #999999;
font-size: 12px;
strong{
display: block;
margin-top: 8px;
}
}
em {
font-style: normal;
}
.ts-stand{
display: flex;
align-items: center;
justify-content: end;
padding-right: 17px;
margin-bottom: 8px;
}
.ts-standard-btn{
width: 72px;
display: flex;
height: 25px;
background: #E2001A;
border-radius: 100px;
align-items: center;
font-size: 12px;
justify-content: center;
margin-top: 8px;
}
span{
margin-top: 0;
}
margin-top: 17px;
padding-left: 36px;
}
.rc-footer {
display: flex;
align-items:flex-end;
span {
width: 72px;
height: 25px;
background: #e2001a;
text-align: center;
line-height: 25px;
font-size: 12px;
color: #ffffff;
margin-bottom: 8px;
border-radius: 100px;
margin-right: 30px;
}
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

View File

@ -37,7 +37,7 @@
</span>
<div class="ts-hover-show">
<span class="rc-text--center">微信扫一扫</span>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/royalcanincn-qrcode.jpg">
<img src="../assets/showimage/royalcanincn-qrcode.jpg">
</div>
</a>
@ -92,7 +92,8 @@
<div class="rc-full-width rc-max-width--xl rc-padding--sm">
<ul class="rc-list rc-list--blank rc-list--align ts-list--four-column" role="menubar">
<li class="rc-list__item rc-list__item--group">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/sub-nav/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs">
<img src="../assets/showimage/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#cats" class="rc-list__header rc-margin--none" role="menuitem"></a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
@ -113,7 +114,7 @@
</ul>
</li>
<li class="rc-list__item rc-list__item--group">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/sub-nav/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs">
<img src="../assets/showimage/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#dogs" class="rc-list__header rc-margin--none" role="menuitem"></a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
@ -134,7 +135,7 @@
</ul>
</li>
<li class="rc-list__item rc-list__item--group">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/sub-nav/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs">
<img src="../assets/showimage/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#tailored-nutrition" class="rc-list__header rc-margin--none" role="menuitem">定制营养方案</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
@ -146,7 +147,7 @@
</ul>
</li>
<li class="rc-list__item rc-list__item--group">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/sub-nav/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs">
<img src="../assets/showimage/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="#about" class="rc-list__header rc-margin--none" role="menuitem">关于我们</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
@ -329,7 +330,7 @@
微信公众号
<div class="ts-hover-show">
<span class="rc-text--center">微信长按识别</span>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/royalcanincn-qrcode.jpg">
<img src="../assets/showimage/royalcanincn-qrcode.jpg">
</div>
</a>
</li>

View File

@ -149,15 +149,15 @@
<div class="ts-row-body">
<p>
<a href="https://weibo.com/chinaroyalcanin" target='_blank' class="rc-img--round rc-img--round--sm rc-margin-right--xs">
<img src='#profiles/custom/royal_canin_profile/themes/royal_canin/images/ico-weibo.png'>
<img src="../assets/showimage/ico-weibo.png">
</a>
<a href="https://www.zhihu.com/org/huang-jia-chong-wu-shi-pin" target='_blank' class="rc-img--round rc-img--round--sm rc-margin-right--xs">
<img src='#profiles/custom/royal_canin_profile/themes/royal_canin/images/ico-zhihu.png'>
<img src="../assets/showimage/ico-zhihu.png">
</a>
<a href="https://space.bilibili.com/2136859062" target='_blank' class="rc-img--round rc-img--round--sm rc-margin-right--xs">
<img src='#profiles/custom/royal_canin_profile/themes/royal_canin/images/ico-bilibili.png'>
<img src="../assets/showimage/ico-bilibili.png">
</a>
</p>
</div>
@ -176,7 +176,7 @@
<div class="rc-four-column rc-layout-container">
<div class="rc-column ts-qr-container rc-text--center">
<a href="weixin://dl/business/?t=xjjEG3b5Ycu" target='_blank' onclick='return bindTracking(this,2000)' evt-name='页脚跳转' evt-cat='footerLinkClick' evt-val='产品验证'>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/qrcode-chanpin.jpg">
<img src="../assets/showimage/qrcode-chanpin.jpg">
<span>
产品验证
</span>
@ -185,7 +185,7 @@
<div class="rc-column ts-qr-container rc-text--center">
<a href="weixin://dl/business/?t=BE1OA2AngRs" target='_blank' onclick='return bindTracking(this,2000)' evt-name='页脚跳转' evt-cat='footerLinkClick' evt-val='皇家爱宠荟会员中心'>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/qrcode-aichong.jpg">
<img src="../assets/showimage/qrcode-aichong.jpg">
<span>
皇家爱宠荟会员中心
</span>
@ -193,7 +193,7 @@
</div>
<div class="rc-column ts-qr-container rc-text--center">
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/qrcode-royal-elite.jpg">
<img src="../assets/showimage/qrcode-royal-elite.jpg">
<span class='rc-text-center'>
皇家兽医精英荟
</span>
@ -201,7 +201,7 @@
<div class="rc-column ts-qr-container rc-text--center">
<a href="https://v.douyin.com/e12mtGA/" target='_blank'>
<img src="#profiles/custom/royal_canin_profile/themes/royal_canin/images/qrcode-douyin.jpg">
<img src="../assets/showimage/qrcode-douyin.jpg">
<span>
皇家宠物食品抖音官方账号
</span>

View File

@ -76,6 +76,7 @@ export default {
},
// Build Configuration: https://go.nuxtjs.dev/config-build
build: {
analyze: true, assetFilter: function(assetFilename) { return assetFilename.endsWith('.js'); }
},
// axios: {

View File

@ -2,7 +2,6 @@
<div>
<!-- Suppose in header end -->
<Myheader></Myheader>
<unlogin></unlogin>
@ -1331,8 +1330,11 @@ dogtop.scrollIntoView(true);
},
handleScroll(e)
{
let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator");
let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
let fixedCatbarSeperator = document.querySelector("#fixed-catbar-seperator");
// console.log(fixedCatbarSeperator.offsetTop,scrolltop);
if(fixedCatbarSeperator!=='null' &&fixedCatbarSeperator!=='underfined'){
console.log('-====');
if((scrolltop-fixedCatbarSeperator.offsetTop)>0)
{
this.gotop = true
@ -1343,6 +1345,10 @@ dogtop.scrollIntoView(true);
this.gotop = false;
this.searchBar=true
}
}
},
toTop() {
let top = document.documentElement.scrollTop || document.body.scrollTop;

View File

@ -1,10 +1,13 @@
<template>
<div>
<div class="allmain">
<Myheader></Myheader>
<tabs></tabs>
<div class="rc-main">
<div class="online bold rc-md-down" id="fixed-catbar-seperator"></div>
<!-- <tabs></tabs> -->
<div class="rc-top"></div>
<div class="rc-usermain">
<div class="rc-header">
<div class="online bold"></div>
<div class="rc">
<span
v-for="(item, index) in discountlist"
:key="index"
@ -15,6 +18,8 @@
</span>
<!-- <span @click="tanchu()">弹出</span> -->
</div>
<div class="online bold"></div>
<div class="rs-dis">
<div
class="rc-discount"
@ -31,15 +36,16 @@
</div>
<div class="rc-right">
<i>
{{ item.couponDesc }}
{{ item.couponName }}
</i>
<div class="rc-main" id="rc-main">
<span>有效期{{item.validFrom}}</span>
<div class="rc-userfont">
<strong>有效期</strong>
<span>{{item.validFrom}}</span>
<em>{{ item.validTo }}</em>
</div>
<nuxt-link :to="`/`">
<div class="rc-footer" v-if="userload">
<span @click="usertiao()">立即使用</span>
<nuxt-link :to="`/productdetails/productlist`">
<div v-if="userload" class="ts-stand">
<span @click="usertiao()" class="ts-standard-btn">立即使用</span>
</div>
</nuxt-link>
</div>
@ -50,17 +56,16 @@
</div>
</div>
</div>
</div>
</template>
<script>
import {allConfig,getdraw} from "../../ajax/getData";
import tabs from "@/components/tabs.vue";
// import tabs from "@/components/tabs.vue";
export default {
middleware: 'metaTitle',
// middleware: 'metaTitle',
meta: {title: '优惠券'},
// // middleware: 'metaTitle',
// meta: {title: ''},
data() {
return {
userload: true,
@ -202,7 +207,7 @@ export default {
this.pastdue = true;
this.userimage = require("../../assets/image/hasused.png");
this.userstates=1
this.userdraw(this.usermessage.data.mobile,1)
this.userdraw(this.usermessage.data.mobile,0)
}
if (this.activeIndex == 0) {
this.userload = true;
@ -215,7 +220,7 @@ export default {
if (this.activeIndex == 2) {
this.userload = false;
this.pastdue = true;
this.userdraw(this.usermessage.data.mobile,2)
this.userdraw(this.usermessage.data.mobile,0)
this.userstates=2
this.userimage = require("../../assets/image/expired.png");
}
@ -223,12 +228,9 @@ export default {
},
usertiao(){
this.$router.push({
path: "/",
query: {
stype: 1,
},
});
this.$router.push({ name: "productdetails-productlist",
})
},
@ -251,7 +253,6 @@ export default {
},
components: {
Myheader,
tabs
},
};
import Myheader from "~/components/header.vue";
@ -259,260 +260,6 @@ import Myheader from "~/components/header.vue";
<style lang="less" scoped>
//
@media screen and(min-width: 320px) and(max-width:768px) {
.active {
font-size: 14px;
color: #e2001a;
}
.unactive {
font-size: 14px;
color: #444444;
}
.rc-header {
height: 64px;
display: flex;
align-items: center;
margin-left: 23px;
span {
display: block;
margin-left: 32px;
}
span:first-child {
margin-left: 0;
}
}
.rc-discount {
margin-left: 23px;
display: flex;
margin-top: 16px;
width: 335px;
background: #ffffff;
position: relative;
height: 120px;
img {
display: block;
width: 100%;
height: 100%;
}
.rc-contair {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.rc-left {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #e1001a;
padding-right: 21px;
width: 30%;
float: left;
height: 100%;
i {
font-style: normal;
font-size: 12px;
}
span {
font-size: 26px;
}
strong {
font-style: normal;
font-size: 12px;
display: block;
margin-top: 8px;
}
}
.rc-right {
display: flex;
flex-direction: column;
margin-left: 36px;
justify-content: center;
height: 100%;
i {
font-style: normal;
font-size: 14px;
color: #e1001a;
}
.rc-main {
color: #999999;
font-size: 12px;
}
span {
display: block;
margin-top: 8px;
}
em {
font-style: normal;
}
}
.rc-footer {
display: flex;
justify-content: flex-end;
span {
width: 72px;
height: 25px;
background: #e2001a;
text-align: center;
line-height: 25px;
font-size: 12px;
color: #ffffff;
margin-bottom: 8px;
border-radius: 100px;
margin-right: 30px;
}
}
}
}
// // /* 768px1920 *pc/
@media screen and (min-width: 768px) and (max-width: 1920px) {
.rc-main {
width: 100%;
.rc-usermain {
width: 92%;
margin: 0 auto;
}
}
.active {
font-size: 16px;
color: #e2001a;
cursor: pointer;
}
.unactive {
font-size: 16px;
color: #444444;
cursor: pointer;
}
.rc-header {
height: 64px;
display: flex;
align-items: center;
margin-left: 23px;
justify-content: center;
span {
display: block;
margin-left: 32px;
}
span:first-child {
margin-left: 0;
}
}
.rs-dis {
margin-top: 70px;
}
.rc-discount {
margin-left: 50px;
display: flex;
margin-top: 40px;
width: 335px;
background: #ffffff;
position: relative;
height: 120px;
float: left;
img {
display: block;
width: 100%;
height: 100%;
}
.rc-contair {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.rc-left {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #e1001a;
padding-right: 21px;
width: 30%;
float: left;
height: 100%;
i {
font-style: normal;
font-size: 12px;
}
span {
font-size: 26px;
}
strong {
font-style: normal;
font-size: 12px;
display: block;
margin-top: 8px;
}
}
.rc-right {
display: flex;
flex-direction: column;
margin-left: 36px;
justify-content: center;
height: 100%;
i {
font-style: normal;
font-size: 16px;
color: #e1001a;
}
.rc-main {
color: #999999;
font-size: 12px;
}
span {
display: block;
margin-top: 8px;
}
em {
font-style: normal;
}
}
.rc-footer {
display: flex;
justify-content: flex-end;
margin-right: 10px;
span {
width: 72px;
height: 25px;
background: #e2001a;
text-align: center;
line-height: 25px;
font-size: 12px;
color: #ffffff;
margin-bottom: 8px;
border-radius: 100px;
margin-right: 30px;
}
}
.rc-userright {
display: flex;
align-items: center;
width: 78px;
justify-content: center;
height: 78px;
border: 2px solid #999999;
border-radius: 50%;
span {
width: 60px;
height: 60px;
border: 1px solid #999999;
border-radius: 50%;
display: flex;
align-items: center;
text-align: center;
justify-content: center;
}
}
}
}
@import url("../../assets/css/global.less");
@import url("../../assets/css/discount.less");
</style>

View File

@ -1,7 +1,7 @@
<template>
<div>
<Myheader></Myheader>
<tabs></tabs>
<!-- <tabs></tabs> -->
<div class="rc-top"></div>
<div class="rc-layout-container rc-one-column rc-full-width ts-mypersonal">
<div class="rc-column">

View File

@ -4,7 +4,7 @@
<Myheader></Myheader>
<unlogin></unlogin>
<tabs></tabs>
<div class="online" ></div>
<div class="online" id="fixed-catbar-seperator"></div>
<div class="rc-top"></div>
<div class="rc-usermain ts-product-detail rc-max-width--xl rc-layout-container rc-two-column rc-border-bottom rc-border-colour--brand4">
<!--
@ -148,7 +148,7 @@
</ul>
<div class="tuntop" @click="toTop" v-show="gotop">
<img src="../../assets/image/turntop.png" alt="">
回到顶部
<span>回到顶部</span>
</div>
</div>
<Myfooter v-on:litentop='showmesg'></Myfooter>
@ -231,9 +231,9 @@ import { mapMutations } from "vuex";
import { goodsmessage,getConfig,postCourseId,getdraw,alldiscount } from "../../ajax/getData";
const settings = require("@/config");
export default {
middleware: 'metaTitle',
// middleware: 'metaTitle',
meta: {title: '产品详情'},
// // middleware: 'metaTitle',
// meta: {title: ''},
data() {
return {
tableLabelTest:[],
@ -356,8 +356,9 @@ this.usermessage= JSON.parse(localStorage.getItem("userInfo"));
...mapMutations(["changemessage"]),
handleScroll(e)
{
let fixedCatbarSeperator = document.getElementById("fixed-catbar-seperator");
let fixedCatbarSeperator = document.querySelector("#fixed-catbar-seperator");
let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
if(fixedCatbarSeperator!=='null' ){
if((scrolltop-fixedCatbarSeperator.offsetTop))
{
this.gotop = true
@ -366,6 +367,8 @@ this.usermessage= JSON.parse(localStorage.getItem("userInfo"));
{
this.gotop = false;
}
}
},
lianxi(item,index){
console.log(item,index);