mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 10:16:38 +08:00
产品详情页
This commit is contained in:
summation
parent
4809866df6
commit
e7b12f5e0b
@ -144,10 +144,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/deep/.el-dialog {
|
|
||||||
width: 80%;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.rc-discount {
|
.rc-discount {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -169,8 +165,7 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
color: #e1001a;
|
color: #e1001a;
|
||||||
padding-right: 21px;
|
width: 34%;
|
||||||
width: 30%;
|
|
||||||
float: left;
|
float: left;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
i {
|
i {
|
||||||
@ -190,7 +185,7 @@
|
|||||||
.rc-right {
|
.rc-right {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin-left: 36px;
|
padding-left: 20px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
i {
|
i {
|
||||||
@ -204,7 +199,7 @@
|
|||||||
}
|
}
|
||||||
span {
|
span {
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: 8px;
|
margin-top: 2px;
|
||||||
}
|
}
|
||||||
em {
|
em {
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -405,11 +400,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/deep/.el-dialog {
|
|
||||||
width: 440px;
|
|
||||||
height: 432px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.rc-discount {
|
.rc-discount {
|
||||||
position: relative;
|
position: relative;
|
||||||
img {
|
img {
|
||||||
@ -430,8 +420,7 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
color: #e1001a;
|
color: #e1001a;
|
||||||
padding-right: 21px;
|
width: 34%;
|
||||||
width: 30%;
|
|
||||||
float: left;
|
float: left;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
i {
|
i {
|
||||||
@ -451,7 +440,7 @@
|
|||||||
.rc-right {
|
.rc-right {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin-left: 36px;
|
padding-left: 20px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
i {
|
i {
|
||||||
@ -465,7 +454,7 @@
|
|||||||
}
|
}
|
||||||
span {
|
span {
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: 8px;
|
margin-top: 2px;
|
||||||
}
|
}
|
||||||
em {
|
em {
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -587,3 +576,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.rc-carousel__gallery-thumbnail{
|
||||||
|
display: inline;
|
||||||
|
.rc-img--square{
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
&.rc-carousel__gallery-thumbnail--active{
|
||||||
|
.rc-img--square{
|
||||||
|
border: 1px solid #E2001A;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
127
rc-busness/pages/address/address.vue
Normal file
127
rc-busness/pages/address/address.vue
Normal file
@ -0,0 +1,127 @@
|
|||||||
|
<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;
|
||||||
|
}
|
||||||
|
.v-modal {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -366,6 +366,7 @@ ul li ol li em strong i {
|
|||||||
.diallog_width{
|
.diallog_width{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 440px;
|
max-width: 440px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
.el-dialog{
|
.el-dialog{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@ -95,10 +95,10 @@
|
|||||||
</div>
|
</div>
|
||||||
<el-dialog :visible.sync="dialogAdd" class="diallog_width" width="'100%">
|
<el-dialog :visible.sync="dialogAdd" class="diallog_width" width="'100%">
|
||||||
<div class="tc dl_cont" v-if="dialogAdd">
|
<div class="tc dl_cont" v-if="dialogAdd">
|
||||||
<!-- <myAddress
|
<myAddress
|
||||||
@isClose="dialogCtrl"
|
@isClose="dialogCtrl"
|
||||||
:editAddressData="editAddressData"
|
:editAddressData="editAddressData"
|
||||||
></myAddress> -->
|
></myAddress>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
@ -108,7 +108,8 @@
|
|||||||
import Myheader from "~/components/header.vue";
|
import Myheader from "~/components/header.vue";
|
||||||
import { userin, memberAddress, generateOrderWX } from "../../ajax/getData";
|
import { userin, memberAddress, generateOrderWX } from "../../ajax/getData";
|
||||||
import tabs from "@/components/tabs.vue";
|
import tabs from "@/components/tabs.vue";
|
||||||
// import myAddress from "../address/address.vue";
|
import myAddress from "../address/address.vue";
|
||||||
|
|
||||||
import itemMixin from "../../../smart-admin-web/src/components/main/components/side-menu/item-mixin";
|
import itemMixin from "../../../smart-admin-web/src/components/main/components/side-menu/item-mixin";
|
||||||
export default {
|
export default {
|
||||||
middleware: "metaTitle",
|
middleware: "metaTitle",
|
||||||
@ -311,7 +312,7 @@ export default {
|
|||||||
components: {
|
components: {
|
||||||
Myheader,
|
Myheader,
|
||||||
tabs,
|
tabs,
|
||||||
// myAddress,
|
myAddress,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,49 +1,92 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="user" v-for="(item,index) in newlist" :key="index">
|
<div class="user">
|
||||||
<Myheader></Myheader>
|
<Myheader></Myheader>
|
||||||
<unlogin></unlogin>
|
<unlogin></unlogin>
|
||||||
<tabs></tabs>
|
<tabs></tabs>
|
||||||
<div class="online" id="fixed-catbar-seperator"></div>
|
<div class="online" id="fixed-catbar-seperator"></div>
|
||||||
<div class="rc-top"></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">
|
<div
|
||||||
|
class="
|
||||||
|
rc-usermain
|
||||||
|
ts-product-detail
|
||||||
|
rc-max-width--xl
|
||||||
|
rc-layout-container rc-two-column rc-border-bottom
|
||||||
|
rc-border-colour--brand4
|
||||||
|
"
|
||||||
|
>
|
||||||
<div class="rc-column">
|
<div class="rc-column">
|
||||||
<div data-js-carousel="" data-image-gallery="true">
|
<div data-js-carousel="" data-image-gallery="true">
|
||||||
<div class="rc-carousel rc-carousel__gallery-image" data-zoom-container="328b2e5f-6904-4cac-9709-51ed18d2500f" data-zoom-factor="2">
|
<div
|
||||||
|
class="rc-carousel rc-carousel__gallery-image"
|
||||||
|
data-zoom-container="328b2e5f-6904-4cac-9709-51ed18d2500f"
|
||||||
|
data-zoom-factor="2"
|
||||||
|
>
|
||||||
<!-- Big images-->
|
<!-- Big images-->
|
||||||
|
<div v-for="(item, index) in productAttachmentList" :key="index">
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<img :src="item.attachmentPath" />
|
||||||
<img src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress" alt="Product alt text" />
|
<!-- <img
|
||||||
|
src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress"
|
||||||
|
alt="Product alt text"
|
||||||
|
/> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<!-- <div>
|
||||||
<div>
|
<div>
|
||||||
<img src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress" alt="Product alt text" />
|
<img src="https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=420&fm=jpg&auto=compress" alt="Product alt text" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<!-- Big images end-->
|
<!-- Big images end-->
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-carousel__gallery-thumbnails-wrapper">
|
<div class="rc-carousel__gallery-thumbnails-wrapper">
|
||||||
<div class="rc-carousel rc-carousel__gallery-thumbnails">
|
<div class="rc-carousel rc-carousel__gallery-thumbnails">
|
||||||
<!-- Thunb images-->
|
<!-- Thunb images-->
|
||||||
<div class="rc-carousel__gallery-thumbnail">
|
<div class="rc-carousel__gallery-thumbnail tns-item tns-slide-active"
|
||||||
<figure class="rc-img--square" style="background-image: url('https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=64&fm=jpg&auto=compress')">
|
v-for="(item, index) in productAttachmentList"
|
||||||
<figcaption class="rc-screen-reader-text">Product caption text</figcaption>
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="rc-img--square">
|
||||||
|
<img :src="item.attachmentPath" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="rc-carousel__gallery-thumbnail">
|
||||||
|
<figure
|
||||||
|
class="rc-img--square"
|
||||||
|
style="
|
||||||
|
background-image: url('https://cdn.royalcanin-weshare-online.io/m2kia2QBG95Xk-RBC8jn/v1/medium-maxi-giant-pos-2012-packshots-ma-ad-shn-packshot?w=64&fm=jpg&auto=compress');
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<figcaption class="rc-screen-reader-text">
|
||||||
|
Product caption text
|
||||||
|
</figcaption>
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-carousel__gallery-thumbnail">
|
<div class="rc-carousel__gallery-thumbnail">
|
||||||
<figure class="rc-img--square" style="background-image: url('https://cdn.royalcanin-weshare-online.io/UCEUa2QBaxEApS7L_-Xz/v2/fbn-2013-graphiccodes-packshots-siam-ad-int-fbn-packshot?w=64&fm=jpg&auto=compress')">
|
<figure
|
||||||
<figcaption class="rc-screen-reader-text">Product caption text</figcaption>
|
class="rc-img--square"
|
||||||
|
style="
|
||||||
|
background-image: url('https://cdn.royalcanin-weshare-online.io/UCEUa2QBaxEApS7L_-Xz/v2/fbn-2013-graphiccodes-packshots-siam-ad-int-fbn-packshot?w=64&fm=jpg&auto=compress');
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<figcaption class="rc-screen-reader-text">
|
||||||
|
Product caption text
|
||||||
|
</figcaption>
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div> -->
|
||||||
<!-- Thunb images end-->
|
<!-- Thunb images end-->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ts-product-header rc-column" id="328b2e5f-6904-4cac-9709-51ed18d2500f">
|
<div
|
||||||
|
class="ts-product-header rc-column"
|
||||||
|
id="328b2e5f-6904-4cac-9709-51ed18d2500f"
|
||||||
|
v-for="(item, index) in newlist"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<div class="usermain">
|
<div class="usermain">
|
||||||
<div class="online bold rc-md-down"></div>
|
<div class="online bold rc-md-down"></div>
|
||||||
<div class="rc-main">
|
<div class="rc-main">
|
||||||
@ -57,7 +100,9 @@
|
|||||||
<div class="rc-productdetail">
|
<div class="rc-productdetail">
|
||||||
<i class="ts-row-title">商品价格：</i>
|
<i class="ts-row-title">商品价格：</i>
|
||||||
<span class="ts-realprice">￥{{ item.rsp }}</span>
|
<span class="ts-realprice">￥{{ item.rsp }}</span>
|
||||||
<span class="ts-remove ts-ecprice">￥{{ item.ecPrice }} </span>
|
<span class="ts-remove ts-ecprice"
|
||||||
|
>￥{{ item.ecPrice }}
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-productdetai">
|
<div class="rc-productdetai">
|
||||||
<div>
|
<div>
|
||||||
@ -83,7 +128,7 @@
|
|||||||
{{ item.title }}
|
{{ item.title }}
|
||||||
</em> -->
|
</em> -->
|
||||||
|
|
||||||
<em class='active'>
|
<em class="active">
|
||||||
{{ item.specifications }}
|
{{ item.specifications }}
|
||||||
</em>
|
</em>
|
||||||
</div>
|
</div>
|
||||||
@ -91,9 +136,17 @@
|
|||||||
<div class="rc-main">
|
<div class="rc-main">
|
||||||
<div class="rc-produnnum">
|
<div class="rc-produnnum">
|
||||||
<div><i class="ts-row-title">商品数量：</i></div>
|
<div><i class="ts-row-title">商品数量：</i></div>
|
||||||
<img src="../../assets/image/userjian.png" alt="" @click="sub()" />
|
<img
|
||||||
|
src="../../assets/image/userjian.png"
|
||||||
|
alt=""
|
||||||
|
@click="sub()"
|
||||||
|
/>
|
||||||
<strong>{{ sales_num }}</strong>
|
<strong>{{ sales_num }}</strong>
|
||||||
<img src="../../assets/image/userjia.png" alt="" @click="plus()" />
|
<img
|
||||||
|
src="../../assets/image/userjia.png"
|
||||||
|
alt=""
|
||||||
|
@click="plus()"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-main rc-md-up">
|
<div class="rc-main rc-md-up">
|
||||||
@ -105,23 +158,28 @@
|
|||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<span
|
<span
|
||||||
><i class="ts-row-title">服务说明：</i><i>当天14点前完成付款即日安排发货;当天14点后完成付款次日安排发货(周日及国家法定节假日顺延至下一个工作日发货,活动期间发货或有延迟敬请理解)</i></span
|
><i class="ts-row-title">服务说明：</i
|
||||||
|
><i
|
||||||
|
>当天14点前完成付款即日安排发货;当天14点后完成付款次日安排发货(周日及国家法定节假日顺延至下一个工作日发货,活动期间发货或有延迟敬请理解)</i
|
||||||
|
></span
|
||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<span
|
<span
|
||||||
><i class="ts-row-title">商品运费：</i><i>全场包邮(港澳除外)</i></span
|
><i class="ts-row-title">商品运费：</i
|
||||||
|
><i>全场包邮(港澳除外)</i></span
|
||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li>
|
<li>
|
||||||
<span
|
<span
|
||||||
><i class="ts-row-title">商品编号：</i><i>{{ item.brandCode }}</i></span
|
><i class="ts-row-title">商品编号：</i
|
||||||
|
><i>{{ item.brandCode }}</i></span
|
||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-button" v-if="!userbuy">
|
<div class="rc-button" v-if="userbuy">
|
||||||
<span @click="usertanchu(item, 0)">加入购物车</span>
|
<span @click="usertanchu(item, 0)">加入购物车</span>
|
||||||
<span @click="usertanchu(item, 1)">立即购买</span>
|
<span @click="usertanchu(item, 1)">立即购买</span>
|
||||||
</div>
|
</div>
|
||||||
@ -129,32 +187,30 @@
|
|||||||
<div class="online bold rc-md-down"></div>
|
<div class="online bold rc-md-down"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-footimage rc-main">
|
<div class="rc-footimage rc-main">
|
||||||
<img :src=item.showImgFile alt="">
|
<!-- <img :src="item.showImgFile" alt="" /> -->
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-fixright">
|
<div class="rc-fixright">
|
||||||
<ul>
|
<ul>
|
||||||
<li v-for="(userfixed,index) in fixedlist" :key="index" @click="lianxi(userfixed,index)">
|
<li
|
||||||
<img :src="userfixed.catimage" alt="">
|
v-for="(userfixed, index) in fixedlist"
|
||||||
|
:key="index"
|
||||||
|
@click="lianxi(userfixed, index)"
|
||||||
|
>
|
||||||
|
<img :src="userfixed.catimage" alt="" />
|
||||||
<span> {{ userfixed.title }}</span>
|
<span> {{ userfixed.title }}</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="tuntop" @click="toTop" v-show="gotop">
|
<div class="tuntop" @click="toTop" v-show="gotop">
|
||||||
<img src="../../assets/image/turntop.png" alt="">
|
<img src="../../assets/image/turntop.png" alt="" />
|
||||||
<span>回到顶部</span>
|
<span>回到顶部</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Myfooter v-on:litentop='showmesg'></Myfooter>
|
<Myfooter v-on:litentop="showmesg"></Myfooter>
|
||||||
</div>
|
</div>
|
||||||
<el-dialog
|
<el-dialog :visible.sync="dialogInfo1" @close="userclose">
|
||||||
:visible.sync="dialogInfo1"
|
|
||||||
hegight="700px"
|
|
||||||
@close='userclose'
|
|
||||||
>
|
|
||||||
<div class="rs-dis">
|
<div class="rs-dis">
|
||||||
<div
|
<div
|
||||||
class="rc-discount"
|
class="rc-discount"
|
||||||
@ -172,7 +228,7 @@
|
|||||||
<i>
|
<i>
|
||||||
{{ item.couponDesc }}
|
{{ item.couponDesc }}
|
||||||
</i>
|
</i>
|
||||||
<div class="rc-main" id="rc-main">
|
<div>
|
||||||
<span>有效期</span>
|
<span>有效期</span>
|
||||||
<em>{{ item.validTo }}</em>
|
<em>{{ item.validTo }}</em>
|
||||||
</div>
|
</div>
|
||||||
@ -180,36 +236,25 @@
|
|||||||
<span @click="usergetconf(item)">立即领取</span>
|
<span @click="usergetconf(item)">立即领取</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
<el-dialog
|
<el-dialog :visible.sync="dialogInfo2" @close="userclose">
|
||||||
:visible.sync="dialogInfo2"
|
|
||||||
@close='userclose'
|
|
||||||
>
|
|
||||||
<div class="rc-headera">
|
<div class="rc-headera">
|
||||||
<div class="rc-title">
|
<div class="rc-title">
|
||||||
<img src="../../assets/error.png" alt="">
|
<img src="../../assets/error.png" alt="" />
|
||||||
</div>
|
</div>
|
||||||
<div class="rc-logmain">
|
<div class="rc-logmain">
|
||||||
<h3>温馨提示</h3>
|
<h3>温馨提示</h3>
|
||||||
<span>请先点击下方进行登录/注册</span>
|
<span>请先点击下方进行登录/注册</span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<nuxt-link :to="`/userlogin/login/`">
|
<nuxt-link :to="`/userlogin/login/`">
|
||||||
<div class="userer">
|
<div class="userer">
|
||||||
<span>立即登录</span>
|
<span>立即登录</span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</nuxt-link>
|
</nuxt-link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
<div class="rc-button rc-md-down">
|
<div class="rc-button rc-md-down">
|
||||||
<span @click="usertanchu(item, 0)">加入购物车</span>
|
<span @click="usertanchu(item, 0)">加入购物车</span>
|
||||||
@ -224,7 +269,13 @@ import tabs from "@/components/tabs.vue";
|
|||||||
import unlogin from "~/components/unlogin.vue";
|
import unlogin from "~/components/unlogin.vue";
|
||||||
import { mapMutations } from "vuex";
|
import { mapMutations } from "vuex";
|
||||||
import Myfooter from "~/components/rc-footer.vue";
|
import Myfooter from "~/components/rc-footer.vue";
|
||||||
import { goodsmessage,getConfig,postCourseId,getdraw,alldiscount } from "../../ajax/getData";
|
import {
|
||||||
|
goodsmessage,
|
||||||
|
getConfig,
|
||||||
|
postCourseId,
|
||||||
|
getdraw,
|
||||||
|
alldiscount,
|
||||||
|
} from "../../ajax/getData";
|
||||||
const settings = require("@/config");
|
const settings = require("@/config");
|
||||||
export default {
|
export default {
|
||||||
// middleware: 'metaTitle',
|
// middleware: 'metaTitle',
|
||||||
@ -242,14 +293,15 @@ export default {
|
|||||||
drawlist: [], //用户可以领取的优惠券
|
drawlist: [], //用户可以领取的优惠券
|
||||||
alldraw: [],
|
alldraw: [],
|
||||||
userlistmenu: [],
|
userlistmenu: [],
|
||||||
msg:['11111111'],
|
msg: ["11111111"],
|
||||||
parent_msg:['111'],
|
parent_msg: ["111"],
|
||||||
usermessage: [],
|
usermessage: [],
|
||||||
dialogInfo2: false,
|
dialogInfo2: false,
|
||||||
productCode:'',//商品code
|
productCode: "", //商品code
|
||||||
productlist: [],
|
productlist: [],
|
||||||
userbuy: true,
|
userbuy: true,
|
||||||
sales_num: 1,
|
sales_num: 1,
|
||||||
|
productAttachmentList: [],
|
||||||
usernewlist: [
|
usernewlist: [
|
||||||
{
|
{
|
||||||
price: "30",
|
price: "30",
|
||||||
@ -272,23 +324,17 @@ export default {
|
|||||||
{
|
{
|
||||||
title: "购物车",
|
title: "购物车",
|
||||||
catimage: require("../../assets/buy.png"),
|
catimage: require("../../assets/buy.png"),
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "在线客服",
|
title: "在线客服",
|
||||||
catimage: require("../../assets/service.png"),
|
catimage: require("../../assets/service.png"),
|
||||||
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "营养专家",
|
title: "营养专家",
|
||||||
catimage: require("../../assets/consult.png"),
|
catimage: require("../../assets/consult.png"),
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
],
|
],
|
||||||
|
|
||||||
|
|
||||||
newlist: [
|
newlist: [
|
||||||
{
|
{
|
||||||
price: "167.00",
|
price: "167.00",
|
||||||
@ -309,104 +355,106 @@ export default {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
Myheader,
|
Myheader,
|
||||||
tabs,
|
tabs,
|
||||||
unlogin,
|
unlogin,
|
||||||
Myfooter
|
Myfooter,
|
||||||
|
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
window.addEventListener("scroll", this.handleScroll, true);
|
window.addEventListener("scroll", this.handleScroll, true);
|
||||||
if(this.usermessage!=='' ||this.usermessage.data!==undefined){
|
if (this.usermessage !== "" || this.usermessage.data !== undefined) {
|
||||||
this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
|
this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
|
||||||
let stype = this.$route.query.stype;
|
let stype = this.$route.query.stype;
|
||||||
this.productCode = this.$route.query.productCode;
|
this.productCode = this.$route.query.productCode;
|
||||||
console.log(this.productCode)
|
// console.log(this.productCode);
|
||||||
this.userquery(this.productCode);
|
this.userquery(this.productCode);
|
||||||
console.log(this.userlistmenu)
|
// console.log(this.userlistmenu);
|
||||||
this.$nextTick(()=>{
|
this.$nextTick(() => {});
|
||||||
|
|
||||||
})
|
|
||||||
if (stype == 1) {
|
if (stype == 1) {
|
||||||
this.userbuy = true;
|
this.userbuy = true;
|
||||||
} else if (stype == 2) {
|
} else if (stype == 2) {
|
||||||
console.log('这是要消失的')
|
// console.log("这是要消失的");
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.userbuy = false;
|
this.userbuy = false;
|
||||||
|
});
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapMutations(["changemessage"]),
|
...mapMutations(["changemessage"]),
|
||||||
handleScroll(e)
|
handleScroll(e) {
|
||||||
{
|
let fixedCatbarSeperator = document.querySelector(
|
||||||
let fixedCatbarSeperator = document.querySelector("#fixed-catbar-seperator");
|
"#fixed-catbar-seperator"
|
||||||
let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
|
);
|
||||||
if(fixedCatbarSeperator!=='null' ){
|
let scrolltop =
|
||||||
if((scrolltop-fixedCatbarSeperator.offsetTop))
|
document.documentElement.scrollTop || document.body.scrollTop;
|
||||||
{
|
if (fixedCatbarSeperator !== "null") {
|
||||||
this.gotop = true
|
if (scrolltop - fixedCatbarSeperator.offsetTop) {
|
||||||
}
|
this.gotop = true;
|
||||||
else
|
} else {
|
||||||
{
|
|
||||||
this.gotop = false;
|
this.gotop = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
lianxi(item, index) {
|
lianxi(item, index) {
|
||||||
console.log(item, index);
|
console.log(item, index);
|
||||||
if(item.title=='在线客服'){
|
if (item.title == "在线客服") {
|
||||||
var option = {
|
var option = {
|
||||||
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'}
|
customer: {
|
||||||
}
|
id: "",
|
||||||
|
name: "",
|
||||||
|
email: "",
|
||||||
|
mobile: "",
|
||||||
|
memberId: "999999",
|
||||||
|
},
|
||||||
|
};
|
||||||
dis_livchat(option);
|
dis_livchat(option);
|
||||||
}
|
}
|
||||||
if(item.title=='购物车'){
|
if (item.title == "购物车") {
|
||||||
console.log('---12314');
|
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
path: "../../myorder/userrecord",
|
path: "../../myorder/userrecord",
|
||||||
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if(item.title=='营养专家'){
|
if (item.title == "营养专家") {
|
||||||
var option = {
|
var option = {
|
||||||
customer: {id: '', name: '', email: '', mobile: '', memberId: '999999'}
|
customer: {
|
||||||
}
|
id: "",
|
||||||
|
name: "",
|
||||||
|
email: "",
|
||||||
|
mobile: "",
|
||||||
|
memberId: "999999",
|
||||||
|
},
|
||||||
|
};
|
||||||
dis_livchat(option);
|
dis_livchat(option);
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
toTop() {
|
toTop() {
|
||||||
let top = document.documentElement.scrollTop || document.body.scrollTop;
|
let top = document.documentElement.scrollTop || document.body.scrollTop;
|
||||||
// 实现滚动效果
|
// 实现滚动效果
|
||||||
const timeTop = setInterval(() => {
|
const timeTop = setInterval(() => {
|
||||||
document.body.scrollTop = document.documentElement.scrollTop = top -= 400;
|
document.body.scrollTop =
|
||||||
|
document.documentElement.scrollTop =
|
||||||
|
top -=
|
||||||
|
400;
|
||||||
if (top <= 0) {
|
if (top <= 0) {
|
||||||
clearInterval(timeTop);
|
clearInterval(timeTop);
|
||||||
}
|
}
|
||||||
}, 10);
|
}, 10);
|
||||||
},
|
},
|
||||||
showmesg() {
|
showmesg() {
|
||||||
console.log('-----');
|
|
||||||
this.toTop();
|
this.toTop();
|
||||||
},
|
},
|
||||||
toTop() {
|
toTop() {
|
||||||
let top = document.documentElement.scrollTop || document.body.scrollTop;
|
let top = document.documentElement.scrollTop || document.body.scrollTop;
|
||||||
// 实现滚动效果
|
// 实现滚动效果
|
||||||
const timeTop = setInterval(() => {
|
const timeTop = setInterval(() => {
|
||||||
document.body.scrollTop = document.documentElement.scrollTop = top -= 400;
|
document.body.scrollTop =
|
||||||
|
document.documentElement.scrollTop =
|
||||||
|
top -=
|
||||||
|
400;
|
||||||
if (top <= 0) {
|
if (top <= 0) {
|
||||||
clearInterval(timeTop);
|
clearInterval(timeTop);
|
||||||
}
|
}
|
||||||
@ -416,7 +464,7 @@ this.usermessage= JSON.parse(localStorage.getItem("userInfo"));
|
|||||||
//领取优惠券
|
//领取优惠券
|
||||||
usergetconf(item) {
|
usergetconf(item) {
|
||||||
console.log(item);
|
console.log(item);
|
||||||
if(this.usermessage.data!==''||this.usermessage.data!==undefined){
|
if (this.usermessage.data !== "" || this.usermessage.data !== undefined) {
|
||||||
this.getconf(this.usermessage.data.id, item.couponId);
|
this.getconf(this.usermessage.data.id, item.couponId);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -425,45 +473,35 @@ if(this.usermessage.data!==''||this.usermessage.data!==undefined){
|
|||||||
async getconf(memberId, couponId) {
|
async getconf(memberId, couponId) {
|
||||||
let data = await getConfig(memberId, couponId);
|
let data = await getConfig(memberId, couponId);
|
||||||
if (data) {
|
if (data) {
|
||||||
|
|
||||||
this.$message({
|
this.$message({
|
||||||
type: 'warning',
|
type: "warning",
|
||||||
message: data.msg
|
message: data.msg,
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(data);
|
console.log(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// changeName(newName){
|
// changeName(newName){
|
||||||
// this.name = newName;
|
// this.name = newName;
|
||||||
// },
|
// },
|
||||||
|
|
||||||
|
|
||||||
userclose() {
|
userclose() {
|
||||||
console.log('这是关闭的');
|
|
||||||
this.userlist = [];
|
this.userlist = [];
|
||||||
},
|
},
|
||||||
async userquery() {
|
async userquery() {
|
||||||
console.log("-----");
|
|
||||||
|
|
||||||
let data = await goodsmessage(this.productCode);
|
let data = await goodsmessage(this.productCode);
|
||||||
if (data) {
|
if (data) {
|
||||||
this.newlist = data.data;
|
this.newlist = data.data;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
this.productAttachmentList = this.newlist[0].productAttachmentList;
|
||||||
|
|
||||||
this.userlistmenu = this.newlist[0].productAttachmentList;
|
this.userlistmenu = this.newlist[0].productAttachmentList;
|
||||||
let changemess = JSON.stringify(this.userlistmenu);
|
let changemess = JSON.stringify(this.userlistmenu);
|
||||||
console.log(changemess);
|
console.log(changemess);
|
||||||
this.changemessage({ data: changemess });
|
this.changemessage({ data: changemess });
|
||||||
this.parent_msg = this.userlistmenu;
|
this.parent_msg = this.userlistmenu;
|
||||||
console.log( this.userlistmenu)
|
console.log(this.userlistmenu);
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
//获取用户领取的优惠券
|
//获取用户领取的优惠券
|
||||||
@ -472,7 +510,6 @@ if(this.usermessage.data!==''||this.usermessage.data!==undefined){
|
|||||||
if (data) {
|
if (data) {
|
||||||
this.drawlist = data.data;
|
this.drawlist = data.data;
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
//获取所有的优惠券
|
//获取所有的优惠券
|
||||||
@ -486,121 +523,100 @@ if(this.usermessage.data!==''||this.usermessage.data!==undefined){
|
|||||||
let alllist = [];
|
let alllist = [];
|
||||||
this.userlist = this.alldraw.data;
|
this.userlist = this.alldraw.data;
|
||||||
this.userlist.forEach((element, index) => {
|
this.userlist.forEach((element, index) => {
|
||||||
if(typeof element.productCodes=='string'){
|
if (typeof element.productCodes == "string") {
|
||||||
userlist.push(element);
|
userlist.push(element);
|
||||||
// let s=element.productCodes.split(',');
|
// let s=element.productCodes.split(',');
|
||||||
// console.log(s.indexOf(this.productCode) != -1 )
|
// console.log(s.indexOf(this.productCode) != -1 )
|
||||||
// console.log('这是字符串')
|
// console.log('这是字符串')
|
||||||
|
|
||||||
}
|
}
|
||||||
|
});
|
||||||
})
|
|
||||||
let menualist = [];
|
let menualist = [];
|
||||||
userlist.filter(item=>{
|
userlist.filter((item) => {
|
||||||
console.log(item);
|
console.log(item);
|
||||||
item.productCodes=item.productCodes.split(',')
|
item.productCodes = item.productCodes.split(",");
|
||||||
item.productCodes.forEach(element=>{
|
item.productCodes.forEach((element) => {
|
||||||
if (element == this.productCode && item.activityId !== 10) {
|
if (element == this.productCode && item.activityId !== 10) {
|
||||||
console.log(element)
|
console.log(element);
|
||||||
console.log(this.productCode)
|
console.log(this.productCode);
|
||||||
menualist.push(item);
|
menualist.push(item);
|
||||||
|
|
||||||
console.log('----');
|
console.log("----");
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
|
});
|
||||||
|
|
||||||
})
|
|
||||||
this.usernewlist = menualist;
|
this.usernewlist = menualist;
|
||||||
console.log(this.usernewlist);
|
console.log(this.usernewlist);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
plus(num, index) {
|
plus(num, index) {
|
||||||
|
|
||||||
this.sales_num = parseInt(this.sales_num) + 1;
|
this.sales_num = parseInt(this.sales_num) + 1;
|
||||||
console.log( this.sales_num);
|
|
||||||
},
|
},
|
||||||
// 数量减方法
|
// 数量减方法
|
||||||
sub(num, index) {
|
sub(num, index) {
|
||||||
if (this.sales_num <= 1) {
|
if (this.sales_num <= 1) {
|
||||||
this.sales_num = 1;
|
this.sales_num = 1;
|
||||||
}
|
} else {
|
||||||
else{
|
|
||||||
this.sales_num = parseInt(this.sales_num) - 1;
|
this.sales_num = parseInt(this.sales_num) - 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
async courseId(item) {
|
async courseId(item) {
|
||||||
console.log(item);
|
|
||||||
console.log(this.usermessage);
|
|
||||||
// let userid=JSON.parse(location.getItem('userInfo'));
|
// let userid=JSON.parse(location.getItem('userInfo'));
|
||||||
// let mobile=JSON.parse(location.getItem('userInfo'));
|
// let mobile=JSON.parse(location.getItem('userInfo'));
|
||||||
// console.log(userid,mobile);
|
// console.log(userid,mobile);
|
||||||
let data = await postCourseId( this.productCode,this.sales_num,this.usermessage.data.id,this.usermessage.data.mobile,item.picFile,item.productName,item.basePrice,item.specifications);
|
let data = await postCourseId(
|
||||||
|
this.productCode,
|
||||||
|
this.sales_num,
|
||||||
|
this.usermessage.data.id,
|
||||||
|
this.usermessage.data.mobile,
|
||||||
|
item.picFile,
|
||||||
|
item.productName,
|
||||||
|
item.basePrice,
|
||||||
|
item.specifications
|
||||||
|
);
|
||||||
if (data) {
|
if (data) {
|
||||||
this.productlist = data;
|
this.productlist = data;
|
||||||
}
|
}
|
||||||
console.log(data);
|
|
||||||
},
|
},
|
||||||
usertanchu(item, orderm) {
|
usertanchu(item, orderm) {
|
||||||
|
|
||||||
let user = localStorage.getItem("userInfo");
|
let user = localStorage.getItem("userInfo");
|
||||||
if(user==undefined||user==null||user==''){
|
if (user == undefined || user == null || user == "") {
|
||||||
this.dialogInfo2 = true;
|
this.dialogInfo2 = true;
|
||||||
return
|
return;
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
this.courseId(item);
|
this.courseId(item);
|
||||||
if (orderm == 0) {
|
if (orderm == 0) {
|
||||||
this.$message({
|
this.$message({
|
||||||
type: 'warning',
|
type: "warning",
|
||||||
message: '加入购物车成功'
|
message: "加入购物车成功",
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (orderm == 1) {
|
if (orderm == 1) {
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
path: "/myorder/userrecord",
|
path: "/myorder/userrecord",
|
||||||
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
userget() {
|
userget() {
|
||||||
|
|
||||||
|
|
||||||
let user = localStorage.getItem("userInfo");
|
let user = localStorage.getItem("userInfo");
|
||||||
if(user==undefined||user==null||user==''){
|
if (user == undefined || user == null || user == "") {
|
||||||
this.dialogInfo2 = true;
|
this.dialogInfo2 = true;
|
||||||
return
|
return;
|
||||||
} else {
|
} else {
|
||||||
this.userdraw(this.usermessage.data.mobile);
|
this.userdraw(this.usermessage.data.mobile);
|
||||||
this.alldrawlist(this.usermessage.data.id);
|
this.alldrawlist(this.usermessage.data.id);
|
||||||
this.dialogInfo1 = true;
|
this.dialogInfo1 = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
selectsearch(item, index) {
|
selectsearch(item, index) {
|
||||||
|
|
||||||
this.activeIndexa = index;
|
this.activeIndexa = index;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
onceproduct(){
|
onceproduct() {},
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user