mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 02:06:38 +08:00
For Baidu recommendation columns
This commit is contained in:
Vion
parent
d9b3ddb7fd
commit
804a5cfc82
@ -44,7 +44,7 @@
|
||||
.ts-carousel-indicator{
|
||||
bottom:0;
|
||||
/deep/.swiper-pagination-bullet{
|
||||
margin-left:.5rem;
|
||||
margin-right:.5rem;
|
||||
}
|
||||
/deep/.swiper-pagination-bullet-active{
|
||||
background:#E2001A;
|
||||
|
||||
@ -187,6 +187,162 @@ let devData={
|
||||
],
|
||||
}
|
||||
]
|
||||
},
|
||||
breed:{
|
||||
dog:[
|
||||
{
|
||||
title: "皇家贵宾犬幼犬全价粮",
|
||||
productimage: "/images/breed/dog-1.png",
|
||||
detail: "帮助支持自身保护力 助消化、宜肠胃 帮助支持被毛浓密生长",
|
||||
ecPrice: "￥237",
|
||||
productCode:'14200300',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14200300,1420030002",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家拉布拉多成犬全价粮",
|
||||
productimage: "/images/breed/dog-2.png",
|
||||
detail: "帮助维持理想体重 呵护关节健康 帮助保持皮肤和被毛健康",
|
||||
ecPrice: "￥542",
|
||||
productCode:'14731200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14731200,14730300",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家比熊成犬全价粮",
|
||||
productimage: "/images/breed/dog-3.png",
|
||||
detail: "帮助减少尿结石形成 滋养被毛丰盈亮泽 帮助减少脂肪堆积",
|
||||
ecPrice: "￥270",
|
||||
productCode:'14610300F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14610300F07",
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
cat:[
|
||||
{
|
||||
title: "皇家英国短毛猫成猫全价粮",
|
||||
productimage: "/images/breed/cat-1.png",
|
||||
detail: "帮助减少脂肪堆积维持肌肉力量 帮助呵护关节健康 有助心肌收缩维持心脏健康",
|
||||
ecPrice: "￥721",
|
||||
productCode:'23040200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23040200,2304004003,2304020002,23040450",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家布偶猫成猫全价粮",
|
||||
productimage: "/images/breed/cat-2.png",
|
||||
detail: "帮助皮肤健康被毛亮泽 帮助呵护关节健康 有助心肌收缩维持心脏健康",
|
||||
ecPrice: "￥370",
|
||||
productCode:'23570200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23570200,2357020002,23570450",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家缅因成猫全价粮",
|
||||
productimage: "/images/breed/cat-3.png",
|
||||
detail: "帮助支持骨络与关节健康 帮助保持皮肤被毛健康 帮助支持心脏健康",
|
||||
ecPrice: "￥184",
|
||||
productCode:'23050200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23050200,2305020002",
|
||||
},
|
||||
],
|
||||
}
|
||||
]
|
||||
},
|
||||
wet:{
|
||||
dog:[
|
||||
{
|
||||
title: "皇家离乳期幼犬慕斯奶糕罐头",
|
||||
productimage: "/images/wet/dog-1.png",
|
||||
detail: "质地细腻绵密 适合离乳期幼犬舔食 亲和肠胃易吸收",
|
||||
ecPrice: "￥78",
|
||||
productCode:'81220020F06',
|
||||
productList: [
|
||||
{
|
||||
productCode: "81220020F06,81220020F03,81220020F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家小型犬成犬全价湿粮",
|
||||
productimage: "/images/wet/dog-2.png",
|
||||
detail: "帮助支持消化系统健康 帮助保持皮肤和被毛健康 帮助支持TA对能量的需求",
|
||||
ecPrice: "￥136",
|
||||
productCode:'81110008012',
|
||||
productList: [
|
||||
{
|
||||
productCode: "81110008012,8111000807,81110008024",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家中型犬成犬全价湿粮",
|
||||
productimage: "/images/wet/dog-3.png",
|
||||
detail: "帮助支持消化系统健康 帮助保持皮肤和被毛健康 帮助支持自身保护力",
|
||||
ecPrice: "￥271",
|
||||
productCode:'8113001012',
|
||||
productList: [
|
||||
{
|
||||
productCode: "8113001012,8113001007,8113001024",
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
cat:[
|
||||
{
|
||||
title: "皇家离乳期幼猫慕斯奶糕罐头",
|
||||
productimage: "/images/wet/cat-3.png",
|
||||
detail: "质地细腻绵密 适合离乳期幼猫舔食 亲和肠胃易吸收",
|
||||
ecPrice: "￥165",
|
||||
productCode:'80210020F06',
|
||||
productList: [
|
||||
{
|
||||
productCode: "80210020F06,80210020F03,80210020F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家幼猫全价猫湿粮混合口味",
|
||||
productimage: "/images/wet/cat-2.png",
|
||||
detail: "三种质地多重享受 满足猫咪挑嘴天性 健肠胃、助消化",
|
||||
ecPrice: "￥93",
|
||||
productCode:'8023450008F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "8023450008F07,8023450008F12,8023450008F24",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家成年期去毛球全价猫湿粮",
|
||||
productimage: "/images/wet/cat-3.png",
|
||||
detail: "排除毛球减少形成 健康倍护美味加分 满足不同年龄阶段猫咪的营养需求",
|
||||
ecPrice: "￥94",
|
||||
productCode:'80310008F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "80310008F07,80310008F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
|
||||
};
|
||||
@ -381,6 +537,162 @@ let prdData={
|
||||
],
|
||||
},
|
||||
]
|
||||
},
|
||||
breed:{
|
||||
dog:[
|
||||
{
|
||||
title: "皇家贵宾犬幼犬全价粮",
|
||||
productimage: "/images/breed/dog-1.png",
|
||||
detail: "帮助支持自身保护力 助消化、宜肠胃 帮助支持被毛浓密生长",
|
||||
ecPrice: "￥237",
|
||||
productCode:'14200300',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14200300,1420030002",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家拉布拉多成犬全价粮",
|
||||
productimage: "/images/breed/dog-2.png",
|
||||
detail: "帮助维持理想体重 呵护关节健康 帮助保持皮肤和被毛健康",
|
||||
ecPrice: "￥542",
|
||||
productCode:'14731200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14731200,14730300",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家比熊成犬全价粮",
|
||||
productimage: "/images/breed/dog-3.png",
|
||||
detail: "帮助减少尿结石形成 滋养被毛丰盈亮泽 帮助减少脂肪堆积",
|
||||
ecPrice: "￥270",
|
||||
productCode:'14610300F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "14610300F07",
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
cat:[
|
||||
{
|
||||
title: "皇家英国短毛猫成猫全价粮",
|
||||
productimage: "/images/breed/cat-1.png",
|
||||
detail: "帮助减少脂肪堆积维持肌肉力量 帮助呵护关节健康 有助心肌收缩维持心脏健康",
|
||||
ecPrice: "￥721",
|
||||
productCode:'23040200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23040200,2304004003,2304020002,23040450",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家布偶猫成猫全价粮",
|
||||
productimage: "/images/breed/cat-2.png",
|
||||
detail: "帮助皮肤健康被毛亮泽 帮助呵护关节健康 有助心肌收缩维持心脏健康",
|
||||
ecPrice: "￥370",
|
||||
productCode:'23570200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23570200,2357020002,23570450",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家缅因成猫全价粮",
|
||||
productimage: "/images/breed/cat-3.png",
|
||||
detail: "帮助支持骨络与关节健康 帮助保持皮肤被毛健康 帮助支持心脏健康",
|
||||
ecPrice: "￥184",
|
||||
productCode:'23050200',
|
||||
productList: [
|
||||
{
|
||||
productCode: "23050200,2305020002",
|
||||
},
|
||||
],
|
||||
}
|
||||
]
|
||||
},
|
||||
wet:{
|
||||
dog:[
|
||||
{
|
||||
title: "皇家离乳期幼犬慕斯奶糕罐头",
|
||||
productimage: "/images/wet/dog-1.png",
|
||||
detail: "质地细腻绵密 适合离乳期幼犬舔食 亲和肠胃易吸收",
|
||||
ecPrice: "￥78",
|
||||
productCode:'81220020F06',
|
||||
productList: [
|
||||
{
|
||||
productCode: "81220020F06,81220020F03,81220020F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家小型犬成犬全价湿粮",
|
||||
productimage: "/images/wet/dog-2.png",
|
||||
detail: "帮助支持消化系统健康 帮助保持皮肤和被毛健康 帮助支持TA对能量的需求",
|
||||
ecPrice: "￥136",
|
||||
productCode:'81110008012',
|
||||
productList: [
|
||||
{
|
||||
productCode: "81110008012,8111000807,81110008024",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家中型犬成犬全价湿粮",
|
||||
productimage: "/images/wet/dog-3.png",
|
||||
detail: "帮助支持消化系统健康 帮助保持皮肤和被毛健康 帮助支持自身保护力",
|
||||
ecPrice: "￥271",
|
||||
productCode:'8113001012',
|
||||
productList: [
|
||||
{
|
||||
productCode: "8113001012,8113001007,8113001024",
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
cat:[
|
||||
{
|
||||
title: "皇家离乳期幼猫慕斯奶糕罐头",
|
||||
productimage: "/images/wet/cat-3.png",
|
||||
detail: "质地细腻绵密 适合离乳期幼猫舔食 亲和肠胃易吸收",
|
||||
ecPrice: "￥165",
|
||||
productCode:'80210020F06',
|
||||
productList: [
|
||||
{
|
||||
productCode: "80210020F06,80210020F03,80210020F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家幼猫全价猫湿粮混合口味",
|
||||
productimage: "/images/wet/cat-2.png",
|
||||
detail: "三种质地多重享受 满足猫咪挑嘴天性 健肠胃、助消化",
|
||||
ecPrice: "￥93",
|
||||
productCode:'8023450008F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "8023450008F07,8023450008F12,8023450008F24",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "皇家成年期去毛球全价猫湿粮",
|
||||
productimage: "/images/wet/cat-3.png",
|
||||
detail: "排除毛球减少形成 健康倍护美味加分 满足不同年龄阶段猫咪的营养需求",
|
||||
ecPrice: "￥94",
|
||||
productCode:'80310008F07',
|
||||
productList: [
|
||||
{
|
||||
productCode: "80310008F07,80310008F12",
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
};
|
||||
//Production data end
|
||||
|
||||
@ -1,125 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<van-address-edit
|
||||
:area-list="areaList"
|
||||
:address-info="{
|
||||
name: editAddressData.name,
|
||||
tel: editAddressData.tel,
|
||||
addressDetail: editAddressData.detailAddress,
|
||||
areaCode: areaCode,
|
||||
}"
|
||||
show-delete
|
||||
show-set-default
|
||||
show-search-result
|
||||
:search-result="searchResult"
|
||||
@save="onSave"
|
||||
@delete="onDelete"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { Toast } from "vant";
|
||||
import { areaList } from "@vant/area-data";
|
||||
var _ = require("lodash");
|
||||
import { memberAddress } from "../../ajax/getData";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
areaList,
|
||||
searchResult: [],
|
||||
areaCode: "",
|
||||
};
|
||||
},
|
||||
props: ["editAddressData"],
|
||||
computed: {},
|
||||
methods: {
|
||||
async onSave(content) {
|
||||
// Toast('save');
|
||||
let provinceId = Number(content.areaCode.substring(0, 2)); //省份id
|
||||
let cityId = Number(content.areaCode.substring(2, 4)); //城市id
|
||||
let districtId = Number(content.areaCode.substring(4, 7)); //区域编码
|
||||
//id 详细地址 /收货人姓名 电话号码 省份id/城市id/区域编码
|
||||
let memberId = JSON.parse(localStorage.getItem("userInfo")).data.id;
|
||||
let postData = {
|
||||
memberId,
|
||||
provinceId: 25,
|
||||
cityId: 36,
|
||||
districtId: 418,
|
||||
// provinceId,
|
||||
// cityId,
|
||||
// districtId,
|
||||
detailAddress: content.addressDetail,
|
||||
recipient: content.name,
|
||||
recipientPhone: content.tel,
|
||||
default: content.default,
|
||||
};
|
||||
let saveType = this.editAddressData.saveType ? "update" : "add";
|
||||
let data = await memberAddress(saveType, postData);
|
||||
if (data) {
|
||||
this.$message({
|
||||
type: "warning",
|
||||
message: data.msg,
|
||||
});
|
||||
if (data.code == "0") {
|
||||
this.$emit("isClose", false);
|
||||
}
|
||||
}
|
||||
},
|
||||
async onDelete() {
|
||||
// Toast("delete");
|
||||
let postData = {
|
||||
ids: this.editAddressData.id,
|
||||
memberId: this.editAddressData.memberId,
|
||||
};
|
||||
let data = await memberAddress("delete", postData);
|
||||
if (data) {
|
||||
this.$message({
|
||||
type: "warning",
|
||||
message: data.msg,
|
||||
});
|
||||
if (data.code == "0") {
|
||||
this.$emit("isClose", false);
|
||||
}
|
||||
}
|
||||
},
|
||||
async areaCodeInit() {
|
||||
var city = this.editAddressData.city;
|
||||
var district = this.editAddressData.district;
|
||||
this.areaCode = "1310001";
|
||||
// _.forEach(this.areaList.city_list, (o, c) => {
|
||||
// if (o == city) {
|
||||
// // let cityId = String(_.take(c, 2));
|
||||
// let cityId = c.substring(0, 4);
|
||||
// _.forEach(this.areaList.county_list, (i, a) => {
|
||||
// if (i == district) {
|
||||
// // let districtId = String(_.take(a, 2));
|
||||
// let districtId = a.substring(0, 4);
|
||||
// if (cityId == districtId) {
|
||||
// this.areaCode = a;
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.areaCodeInit();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.van-area {
|
||||
width: 400px;
|
||||
margin: 0 auto;
|
||||
border: 1px solid #808285;
|
||||
}
|
||||
.van-popup {
|
||||
background-color: transparent;
|
||||
}
|
||||
.van-overlay {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
</style>
|
||||
239
rc-busness/pages/resentation/breed.vue
Normal file
239
rc-busness/pages/resentation/breed.vue
Normal file
@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div class="ts-resentation rc-padding-y--lg">
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<div class="ts-banner-swiper-container">
|
||||
<picture>
|
||||
<source
|
||||
media="(max-width: 768px)"
|
||||
srcset="/images/breed/banner-mobile.png"
|
||||
/>
|
||||
<source
|
||||
media="(min-width: 769px)"
|
||||
srcset="/images/breed/banner.png"
|
||||
/>
|
||||
<img src="/images/banner/pc-weixin.png" />
|
||||
</picture>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="rc-alpha rc-margin-y--md rc-text--center rc-margin-y--lg--mobile">明星犬粮</h2>
|
||||
<ul class="ts-product-list rc-margin-bottom--lg rc-md-up">
|
||||
<li
|
||||
v-for="(item, index) in dataList.breed.dog"
|
||||
:key="index"
|
||||
class="rc-margin-top--md"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<span>{{ item.title }}</span>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="rc-md-down ts-product-list">
|
||||
<swiper :options="swiperAOption">
|
||||
<swiper-slide
|
||||
v-for="(item, index) in dataList.breed.dog"
|
||||
:key="index"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<h2 class="rc-beta">{{ item.title }}</h2>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
<div id="swiperAPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
|
||||
<div id="swiperAprev" class="swiper-button-prev ts-swiper-arrow"></div>
|
||||
<div id="swiperAnext" class="swiper-button-next ts-swiper-arrow"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contair rc-margin-y--lg--mobile">
|
||||
<nuxt-link :to="`/productdetails/productlist/?stype=1`">
|
||||
<span class="ts-standard-btn center">查看更多</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<!-- Dog end -->
|
||||
<div class="online bold rc-margin-y--lg"></div>
|
||||
<!-- Cat start -->
|
||||
<div>
|
||||
<h2 class="rc-alpha rc-margin-y--md rc-text--center rc-margin-y--lg--mobile">明星猫粮</h2>
|
||||
<ul class="ts-product-list rc-margin-bottom--lg rc-md-up">
|
||||
<li
|
||||
v-for="(item, index) in dataList.breed.cat"
|
||||
:key="index"
|
||||
class="rc-margin-top--md"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<span>{{ item.title }}</span>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="rc-md-down ts-product-list">
|
||||
<swiper :options="swiperBOption">
|
||||
<swiper-slide
|
||||
v-for="(item, index) in dataList.breed.cat"
|
||||
:key="index"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<h2 class="rc-beta">{{ item.title }}</h2>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
<div id="swiperBPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
|
||||
<div id="swiperBprev" class="swiper-button-prev ts-swiper-arrow"></div>
|
||||
<div id="swiperBnext" class="swiper-button-next ts-swiper-arrow"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contair rc-margin-y--lg--mobile">
|
||||
<nuxt-link :to="`/productdetails/productlist/?stype=0`">
|
||||
<span class="ts-standard-btn center">查看更多</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<!-- Cat end-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Myheader from "~/components/header.vue";
|
||||
import envData from "~/config/env-data.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
envData,
|
||||
dataList:{breed:{dog:[],cat:[]}},
|
||||
swiperAOption: {
|
||||
loop: false,
|
||||
slidesPerView: "auto",
|
||||
centeredSlides: true,
|
||||
speed: 1000,
|
||||
spaceBetween: 0,
|
||||
pagination: {
|
||||
el: "#swiperAPagnation",
|
||||
clickable: true,
|
||||
},
|
||||
loopAdditionalSlides: 100,
|
||||
navigation: {
|
||||
nextEl: "#swiperAprev",
|
||||
prevEl: "#swiperAnext",
|
||||
}
|
||||
},
|
||||
swiperBOption: {
|
||||
loop: false,
|
||||
slidesPerView: "auto",
|
||||
centeredSlides: true,
|
||||
speed: 1000,
|
||||
spaceBetween: 0,
|
||||
pagination: {
|
||||
el: "#swiperBPagnation",
|
||||
clickable: true,
|
||||
},
|
||||
loopAdditionalSlides: 100,
|
||||
navigation: {
|
||||
nextEl: "#swiperBprev",
|
||||
prevEl: "#swiperBnext",
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Myheader,
|
||||
},
|
||||
mounted(){
|
||||
let env=process.env.NODE_ENV;
|
||||
this.dataList=this.envData[env];
|
||||
},
|
||||
methods:{
|
||||
selectproduce(item) {
|
||||
let isRxGoods = false;
|
||||
let productCode = [];
|
||||
let mainProductCode = item.productCode;
|
||||
if (!item.ecPrice && !item.price) {
|
||||
isRxGoods = 1;
|
||||
productCode = [item.productCode];
|
||||
} else {
|
||||
for (let i of item.productList) {
|
||||
productCode.push(i.productCode);
|
||||
}
|
||||
}
|
||||
this.$router.push({
|
||||
path: "/productdetails/producted",
|
||||
query: {
|
||||
stype: 1,
|
||||
isRxGoods: isRxGoods,
|
||||
mainProductCode: mainProductCode,
|
||||
productCode: productCode.join(","),
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped >
|
||||
@import url("../../assets/css/resentation.less");
|
||||
</style>
|
||||
@ -1,130 +0,0 @@
|
||||
<template>
|
||||
<div class="rc-padding-y--lg">
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<div class="ts-banner-swiper-container">
|
||||
<picture>
|
||||
<source
|
||||
media="(max-width: 768px)"
|
||||
srcset="/images/rc-phone.png"
|
||||
/>
|
||||
<source
|
||||
media="(min-width: 769px)"
|
||||
srcset="/images/userbanner.png"
|
||||
/>
|
||||
<img src="/images/banner/pc-weixin.png" />
|
||||
</picture>
|
||||
</div>
|
||||
<div>
|
||||
<ul class="ts-product-list rc-margin-bottom--lg">
|
||||
<li
|
||||
v-for="(item, index) in dataList.amature"
|
||||
:key="index"
|
||||
class="rc-margin-top--md"
|
||||
>
|
||||
<h2 class="rc-beta rc-margin-y--md">{{ index==1?'明星猫粮':'明星犬粮' }}</h2>
|
||||
<div
|
||||
class="rc-click rc-margin-bottom--md"
|
||||
@click="selectproduce(item, index)"
|
||||
>
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<span>{{ item.title }}</span>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="contair">
|
||||
<nuxt-link :to="`/productdetails/productlist/`">
|
||||
<span class="ts-standard-btn center">查看更多</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Myheader from "~/components/header.vue";
|
||||
import envData from "~/config/env-data.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
envData,
|
||||
dataList:{amature:[]}
|
||||
};
|
||||
},
|
||||
components: {
|
||||
Myheader,
|
||||
},
|
||||
mounted(){
|
||||
let env=process.env.NODE_ENV;
|
||||
this.dataList=this.envData[env];
|
||||
},
|
||||
methods:{
|
||||
selectproduce(item) {
|
||||
let isRxGoods = false;
|
||||
let productCode = [];
|
||||
let mainProductCode = item.productCode;
|
||||
if (!item.ecPrice && !item.price) {
|
||||
isRxGoods = 1;
|
||||
productCode = [item.productCode];
|
||||
} else {
|
||||
for (let i of item.productList) {
|
||||
productCode.push(i.productCode);
|
||||
}
|
||||
}
|
||||
this.$router.push({
|
||||
path: "/productdetails/producted",
|
||||
query: {
|
||||
stype: 1,
|
||||
isRxGoods: isRxGoods,
|
||||
mainProductCode: mainProductCode,
|
||||
productCode: productCode.join(","),
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped >
|
||||
.ts-banner-swiper-container {
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
.ts-product-list li{
|
||||
border:none;
|
||||
max-width:22.75rem;
|
||||
min-width:22.75rem;
|
||||
width:22.75rem;
|
||||
h2{
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
font-weight: bold;
|
||||
}
|
||||
.rc-column span {
|
||||
height:auto;
|
||||
}
|
||||
.desc {
|
||||
width:13rem;
|
||||
height:auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
239
rc-busness/pages/resentation/wet.vue
Normal file
239
rc-busness/pages/resentation/wet.vue
Normal file
@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div class="ts-resentation rc-padding-y--lg">
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<div class="ts-banner-swiper-container">
|
||||
<picture>
|
||||
<source
|
||||
media="(max-width: 768px)"
|
||||
srcset="/images/wet/banner-mobile.png"
|
||||
/>
|
||||
<source
|
||||
media="(min-width: 769px)"
|
||||
srcset="/images/wet/banner.png"
|
||||
/>
|
||||
<img src="/images/banner/pc-weixin.png" />
|
||||
</picture>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="rc-alpha rc-margin-y--md rc-text--center rc-margin-y--lg--mobile">明星犬粮</h2>
|
||||
<ul class="ts-product-list rc-margin-bottom--lg rc-md-up">
|
||||
<li
|
||||
v-for="(item, index) in dataList.wet.dog"
|
||||
:key="index"
|
||||
class="rc-margin-top--md"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<span>{{ item.title }}</span>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="rc-md-down ts-product-list">
|
||||
<swiper :options="swiperAOption">
|
||||
<swiper-slide
|
||||
v-for="(item, index) in dataList.wet.dog"
|
||||
:key="index"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<h2 class="rc-beta">{{ item.title }}</h2>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
<div id="swiperAPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
|
||||
<div id="swiperAprev" class="swiper-button-prev ts-swiper-arrow"></div>
|
||||
<div id="swiperAnext" class="swiper-button-next ts-swiper-arrow"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contair rc-margin-y--lg--mobile">
|
||||
<nuxt-link :to="`/productdetails/productlist/?stype=1`">
|
||||
<span class="ts-standard-btn center">查看更多</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<!-- Dog end -->
|
||||
<div class="online bold rc-margin-y--lg"></div>
|
||||
<!-- Cat start -->
|
||||
<div>
|
||||
<h2 class="rc-alpha rc-margin-y--md rc-text--center rc-margin-y--lg--mobile">明星猫粮</h2>
|
||||
<ul class="ts-product-list rc-margin-bottom--lg rc-md-up">
|
||||
<li
|
||||
v-for="(item, index) in dataList.wet.cat"
|
||||
:key="index"
|
||||
class="rc-margin-top--md"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<span>{{ item.title }}</span>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="rc-md-down ts-product-list">
|
||||
<swiper :options="swiperBOption">
|
||||
<swiper-slide
|
||||
v-for="(item, index) in dataList.wet.cat"
|
||||
:key="index"
|
||||
>
|
||||
<div class="rc-click rc-margin-bottom--md" @click="selectproduce(item, index)">
|
||||
<div class="rc-rccontair">
|
||||
<img :src="item.productimage" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rc-column">
|
||||
<div class="rc-click" @click="selectproduce(item, index)">
|
||||
<h2 class="rc-beta">{{ item.title }}</h2>
|
||||
<div class="desc">{{ item.detail }}</div>
|
||||
</div>
|
||||
<strong
|
||||
class="
|
||||
ts-standard-btn ts-standard-btn--two
|
||||
rc-margin-y--md
|
||||
center
|
||||
"
|
||||
@click="selectproduce(item, index)"
|
||||
>立即购买</strong
|
||||
>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
<div id="swiperBPagnation" class="swiper-pagination ts-carousel-indicator center"></div>
|
||||
<div id="swiperBprev" class="swiper-button-prev ts-swiper-arrow"></div>
|
||||
<div id="swiperBnext" class="swiper-button-next ts-swiper-arrow"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contair rc-margin-y--lg--mobile">
|
||||
<nuxt-link :to="`/productdetails/productlist/?stype=0`">
|
||||
<span class="ts-standard-btn center">查看更多</span>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<!-- Cat end-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Myheader from "~/components/header.vue";
|
||||
import envData from "~/config/env-data.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
envData,
|
||||
dataList:{wet:{dog:[],cat:[]}},
|
||||
swiperAOption: {
|
||||
loop: false,
|
||||
slidesPerView: "auto",
|
||||
centeredSlides: true,
|
||||
speed: 1000,
|
||||
spaceBetween: 0,
|
||||
pagination: {
|
||||
el: "#swiperAPagnation",
|
||||
clickable: true,
|
||||
},
|
||||
loopAdditionalSlides: 100,
|
||||
navigation: {
|
||||
nextEl: "#swiperAprev",
|
||||
prevEl: "#swiperAnext",
|
||||
}
|
||||
},
|
||||
swiperBOption: {
|
||||
loop: false,
|
||||
slidesPerView: "auto",
|
||||
centeredSlides: true,
|
||||
speed: 1000,
|
||||
spaceBetween: 0,
|
||||
pagination: {
|
||||
el: "#swiperBPagnation",
|
||||
clickable: true,
|
||||
},
|
||||
loopAdditionalSlides: 100,
|
||||
navigation: {
|
||||
nextEl: "#swiperBprev",
|
||||
prevEl: "#swiperBnext",
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Myheader,
|
||||
},
|
||||
mounted(){
|
||||
let env=process.env.NODE_ENV;
|
||||
this.dataList=this.envData[env];
|
||||
},
|
||||
methods:{
|
||||
selectproduce(item) {
|
||||
let isRxGoods = false;
|
||||
let productCode = [];
|
||||
let mainProductCode = item.productCode;
|
||||
if (!item.ecPrice && !item.price) {
|
||||
isRxGoods = 1;
|
||||
productCode = [item.productCode];
|
||||
} else {
|
||||
for (let i of item.productList) {
|
||||
productCode.push(i.productCode);
|
||||
}
|
||||
}
|
||||
this.$router.push({
|
||||
path: "/productdetails/producted",
|
||||
query: {
|
||||
stype: 1,
|
||||
isRxGoods: isRxGoods,
|
||||
mainProductCode: mainProductCode,
|
||||
productCode: productCode.join(","),
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped >
|
||||
@import url("../../assets/css/resentation.less");
|
||||
</style>
|
||||
BIN
rc-busness/static/images/breed/banner-mobile.png
Normal file
BIN
rc-busness/static/images/breed/banner-mobile.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 161 KiB |
BIN
rc-busness/static/images/breed/banner.png
Normal file
BIN
rc-busness/static/images/breed/banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 238 KiB |
BIN
rc-busness/static/images/breed/cat-1.png
Normal file
BIN
rc-busness/static/images/breed/cat-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
rc-busness/static/images/breed/cat-2.png
Normal file
BIN
rc-busness/static/images/breed/cat-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
rc-busness/static/images/breed/cat-3.png
Normal file
BIN
rc-busness/static/images/breed/cat-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
rc-busness/static/images/breed/dog-1.png
Normal file
BIN
rc-busness/static/images/breed/dog-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
rc-busness/static/images/breed/dog-2.png
Normal file
BIN
rc-busness/static/images/breed/dog-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
rc-busness/static/images/breed/dog-3.png
Normal file
BIN
rc-busness/static/images/breed/dog-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
rc-busness/static/images/wet/banner-mobile.png
Normal file
BIN
rc-busness/static/images/wet/banner-mobile.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 146 KiB |
BIN
rc-busness/static/images/wet/banner.png
Normal file
BIN
rc-busness/static/images/wet/banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 222 KiB |
BIN
rc-busness/static/images/wet/cat-1.png
Normal file
BIN
rc-busness/static/images/wet/cat-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
rc-busness/static/images/wet/cat-2.png
Normal file
BIN
rc-busness/static/images/wet/cat-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
rc-busness/static/images/wet/cat-3.png
Normal file
BIN
rc-busness/static/images/wet/cat-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
rc-busness/static/images/wet/dog-1.png
Normal file
BIN
rc-busness/static/images/wet/dog-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
rc-busness/static/images/wet/dog-2.png
Normal file
BIN
rc-busness/static/images/wet/dog-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
rc-busness/static/images/wet/dog-3.png
Normal file
BIN
rc-busness/static/images/wet/dog-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Loading…
Reference in New Issue
Block a user