商品详情
This commit is contained in:
parent
d94fb80ee2
commit
2910af7bd7
GPG Key ID:
A7972FD973317FF3
@ -119,6 +119,11 @@ export default {
|
||||
return vm.$u.post('Store/getStoreImgVideoList', {
|
||||
id: id
|
||||
});
|
||||
},
|
||||
goodsInfo({id}){
|
||||
return vm.$u.post('goods/goodsInfo', {
|
||||
goods_id: id
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -91,7 +91,7 @@
|
||||
"https" : false
|
||||
},
|
||||
"router" : {
|
||||
"base" : "history"
|
||||
"base" : ""
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,12 +1,14 @@
|
||||
<template>
|
||||
<view class="guige">
|
||||
<view class="title">
|
||||
选择尺码
|
||||
{{title}}
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>均码</text>
|
||||
<text :class="select == 1 ? 'xuanzhong' : ''">S</text>
|
||||
<text>M</text>
|
||||
<text v-for="(i,j) in item" @click="select = j" :class="select == j ? 'xuanzhong' : ''" :key="j">
|
||||
{{i}}
|
||||
</text>
|
||||
<!-- <text @click="select = 1" :class="select == 1 ? 'xuanzhong' : ''">S</text> -->
|
||||
<!-- <text @click="select = 2" :class="select == 2 ? 'xuanzhong' : ''">M</text> -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -48,7 +50,14 @@ export default {
|
||||
name:"guige",
|
||||
data(){
|
||||
return {
|
||||
select:true
|
||||
select:0
|
||||
}
|
||||
},
|
||||
props:['item','title'],
|
||||
watch:{
|
||||
select(){
|
||||
// console.log(this.select)
|
||||
this.$emit("sel",this.select)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -12,33 +12,27 @@
|
||||
<view class="button" style="background:rgba(253,211,96,0.6);">试穿试送</view>
|
||||
<view class="button" style="background:rgba(253,211,96,1);" @click="buy(2)">加入购物车</view>
|
||||
<view class="button" style="background:rgba(255,120,15,1);" @click="buy(1)">立即购买</view>
|
||||
<u-toast ref="uToast" />
|
||||
|
||||
</view>
|
||||
<u-popup v-model="show" mode="bottom">
|
||||
<scroll-view scroll-y="true" class="popup">
|
||||
<view>
|
||||
<view class="head">
|
||||
<image class="image"></image>
|
||||
<image class="image" :src="info.goods_image"></image>
|
||||
<view class="info">
|
||||
<text class="u-line-2">套装新款小个子春季时尚韩版短袖衬
|
||||
衫套装新款小个子春季时尚韩版...套装新款小个子春季时尚韩版短袖衬衫套装新款小个子春季时尚韩版...</text>
|
||||
<text>￥99</text>
|
||||
<text class="u-line-2">{{info.goods_name}}</text>
|
||||
<text>￥{{info.goods_price}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige></guige>
|
||||
<guige @sel="self" ref="guige" v-for="(item,index) in info.spec_value" :key="index" :title="info.spec_name[index]" :item="item"></guige>
|
||||
<view class="num">
|
||||
<text>购买数量</text>
|
||||
<u-number-box v-model="value" @change="valChange"></u-number-box>
|
||||
</view>
|
||||
<view style="height:180rpx"></view>
|
||||
</view>
|
||||
<u-toast ref="uToast" />
|
||||
|
||||
</scroll-view>
|
||||
</u-popup>
|
||||
</view>
|
||||
@ -48,36 +42,68 @@
|
||||
import guige from "./guige"
|
||||
export default {
|
||||
name:"tloos",
|
||||
props: ['id'],
|
||||
props: ['id','info'],
|
||||
components:{
|
||||
guige
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
show:true,
|
||||
value:1
|
||||
show:false,
|
||||
value:1,
|
||||
sel:"",
|
||||
quanxuan:false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//添加购物车
|
||||
addCart() {
|
||||
this.$u.api.addCart({
|
||||
goods_id: this.id,
|
||||
quantity: 1,
|
||||
}).then(res => {
|
||||
this.$refs.uToast.show({
|
||||
title: res.message,
|
||||
type: res.errCode == 0 ? 'success' : 'warning',
|
||||
})
|
||||
})
|
||||
},
|
||||
buy(type){
|
||||
this.show = true
|
||||
let that = this;
|
||||
if(this.show){
|
||||
if(this.info.spec_value == null){
|
||||
this.$emit("buy",{type,value:that.value})
|
||||
}else if(this.quanxuan){
|
||||
this.$emit("buy",{type,value:that.value})
|
||||
}else{
|
||||
this.$refs.uToast.show({
|
||||
title: '请选择规格',
|
||||
type: 'warning',
|
||||
})
|
||||
}
|
||||
}else{
|
||||
this.show = true
|
||||
}
|
||||
|
||||
},
|
||||
valChange(e) {
|
||||
console.log('当前值为: ' + e.value)
|
||||
console.log(this.value)
|
||||
},
|
||||
self(){
|
||||
// console.log(this.$refs.guige)
|
||||
let index = 0;
|
||||
let arr = [];
|
||||
for(let i in this.info.spec_value){
|
||||
// console.log(i)
|
||||
// console.log(this.$refs.guige[index++].select)
|
||||
// index++;
|
||||
let sel = this.$refs.guige[index++].select
|
||||
if(sel != 0){
|
||||
arr.push(sel)
|
||||
}
|
||||
|
||||
}
|
||||
// console.log(arr.length)
|
||||
if(arr.length == index){
|
||||
this.sel = arr.join("|")
|
||||
this.quanxuan = true
|
||||
// console.log(this.sel)
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
watch:{
|
||||
sel(){
|
||||
// console.log(this.sel)
|
||||
this.$emit('xuanze',this.sel)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -23,18 +23,22 @@
|
||||
<view class="rich">
|
||||
<rich-text :nodes="goodsInfo.mobile_body"></rich-text>
|
||||
</view>
|
||||
<tloos :id="goodsInfo.goods_commonid"></tloos>
|
||||
<tloos @buy="buy" @xuanze="xuanze" :id="goodsInfo.goods_commonid" :info="info"></tloos>
|
||||
<u-toast ref="uToast" />
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import navs from "../components/sdetails/navs"
|
||||
import tloos from "../components/sdetails/tloos"
|
||||
export default {
|
||||
export default {
|
||||
name:"sdetails",
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
goodsInfo: {},
|
||||
goodsInfo: {},
|
||||
info:{},
|
||||
glist:[],
|
||||
id:0
|
||||
}
|
||||
},
|
||||
components:{
|
||||
@ -42,10 +46,25 @@ export default {
|
||||
tloos
|
||||
},
|
||||
onLoad(option) {
|
||||
this.getGoodsDetails(option.id);
|
||||
this.getGoodsDetails(option.id);
|
||||
|
||||
},
|
||||
methods: {
|
||||
buy(info){
|
||||
if(info.type == 2){
|
||||
this.$u.api.addCart({
|
||||
goods_id: this.id,
|
||||
quantity: info.value,
|
||||
}).then(res => {
|
||||
this.$refs.uToast.show({
|
||||
title: res.errCode[1],
|
||||
type: res.errCode == 0 ? 'success' : 'warning',
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
getGoodsDetails(id) {
|
||||
this.id = id;
|
||||
this.$u.api.getGoodsDetails({ id: id }).then((res)=>{
|
||||
if (res.errCode == 0) {
|
||||
this.goodsInfo = res.data;
|
||||
@ -58,8 +77,17 @@ export default {
|
||||
// console.log(this.goodsInfo.mobile_body);
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$u.api.goodsInfo({id}).then((res)=>{
|
||||
console.log(res)
|
||||
this.info = res.data.goods;
|
||||
this.glist = res.data.spec_list;
|
||||
})
|
||||
},
|
||||
xuanze(id){
|
||||
console.log(id)
|
||||
this.getGoodsDetails(this.glist[id])
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user