product_platform/yxt-yyth-ui-miniprogram
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

商品详情

Browse Source
This commit is contained in:
wong1988
2023-12-02 16:23:53 +08:00
parent ee61b4c414
commit 505721d393
3 changed files with 94 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
pages/card/card_booking.vue
View File

@@ -40,7 +40,8 @@
</view>
<view
style="display: flex;align-items: center;padding-right: 10px;margin-top: 6px;margin-bottom: 8px;">
<text style="flex-shrink: 0;font-size: 13px;margin-left: 10px;margin-right: 10px; " decode="true">提&ensp;货&ensp;人</text>
<text style="flex-shrink: 0;font-size: 13px;margin-left: 10px;margin-right: 10px; "
decode="true">提&ensp;货&ensp;人</text>
<input placeholder="请输入提货人"
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;"
:value="data.userName" @input="onKeyInput1" />
@@ -62,17 +63,18 @@
<image src="../../static/mingxi.png" style="width: 15px;height: 15px;"></image>
<view style="margin-left: 10px;font-size: 14px;">商品明细</view>
</view>
<view v-for="(item,index) in data.goodsVos"
<view v-for="(item,index) in data.goodsVos" @click="itemClick(item.goodsSid)"
style="display: flex;flex-direction: row;margin-top: 15px;">
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;" @click="goodDetail(item.goodsSid)"></image>
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image>
<view
style="margin-left: 10px;margin-right: 10px;flex: 1;display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end;">
<text class="text" style="font-weight: 500;width: 100%;">{{item.goods}}
</text>
<text class="text" style="width: 100%;font-size: 12px; color: #666666;margin-top: 10px;">{{item.remarks}}
<text class="text"
style="width: 100%;font-size: 12px; color: #666666;margin-top: 10px;">{{item.remarks}}
</text>
<uni-number-box ref="box" style="margin-top: -25px;" :min="0" :max="item.lnum" v-model="item.select"
:showTextView="page.showTextView"></uni-number-box>
<uni-number-box ref="box" style="margin-top: -25px;" :min="0" :max="item.lnum"
v-model="item.select" :showTextView="page.showTextView"></uni-number-box>
</view>
</view>
</view>
@@ -108,8 +110,8 @@
goodsVos: [],
value: "",
select: [],
userName:"",
userPhone:"",
userName: "",
userPhone: "",
}
}
},
@@ -159,7 +161,7 @@
this.shortToast('请输入手机号码')
return
}
if (this.data.userPhone.length!=11) {
if (this.data.userPhone.length != 11) {
this.shortToast('手机号码格式不对')
return
}
@@ -184,10 +186,9 @@
})
},
goodDetail(sid){
// 商品详情
itemClick(goodsSid) {
uni.navigateTo({
url: '/pages/good/goodsDetail?sid=' + sid
url: '/pages/good/goodsDetail?sid=' + goodsSid
})
}
}

9
pages/card/card_detail.vue
View File

@@ -36,9 +36,9 @@
<image src="../../static/mingxi.png" style="width: 15px;height: 15px;"></image>
<view style="margin-left: 10px;font-size: 14px;">商品明细</view>
</view>
<view v-for="(item,index) in data.goodsVos" :key="index"
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)"
style="display: flex;flex-direction: row;margin-top: 15px;">
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;" @click="goodDetail(item.goodsSid)"></image>
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image>
<view style="margin-left: 10px;margin-right: 10px;flex: 1;">
<text class="text" style="font-weight: 500;">{{item.goods}}
</text>
@@ -124,10 +124,9 @@
url: '/pages/card/card_booking?sid=' + sid
})
},
goodDetail(sid){
// 商品详情
itemClick(goodsSid) {
uni.navigateTo({
url: '/pages/good/goodsDetail?sid=' + sid
url: '/pages/good/goodsDetail?sid=' + goodsSid
})
}
}

70
pages/good/goodsDetail.vue
View File

@@ -1,22 +1,84 @@
<template>
<view>
<loading-state ref="pageView" @request="request">
<view>
<image :src="data.picUrl" style="width: 100vw;height: 100vw;background-color: #FFFFFF;"></image>
<view
style="margin-top: 9px;margin-left: 9px;margin-right: 9px;border-top-left-radius: 13px;border-top-right-radius: 13px;display: flex;flex-direction: column;align-items: center;background-color: #FFFFFF;padding-top: 11px;">
<image src="../../static/goods_price_bg.png"
style="width: 90vw;height: 16vw;border-radius: 10px;position: absolute;"></image>
<view
style="display: flex;flex-direction: row;justify-content: space-between;width: 80vw;position: relative;height: 16vw;align-items: center;color: white;">
<view>
<text style="font-size: 14px;font-weight: 600;">￥</text>
<text style="font-size: 24px;margin-left: 7px;font-weight: 500;">{{data.price}}</text>
</view>
<view>价值</view>
</view>
<view
style="left: 25px;font-size: 18px;width: 90vw;margin: 10px 0px;font-weight: 600;margin-left: 18px;">
{{data.name}}
</view>
</view>
<view style="display: flex;flex-direction: column;align-items: center;margin-left: 9px;margin-right: 9px;">
<view
style="border-bottom-left-radius: 13px;border-bottom-right-radius: 13px;background-color: #f9f9f9;width: 100%;display: flex;flex-direction: row;">
<image src="../../static/guige.png"
style="width: 21px;height: 21px;margin-left: 12px;margin-top: 9px;margin-bottom: 12px;"></image>
<view
style="height: 21px;line-height: 21px;margin-top: 9px;font-size: 13px;color: #666666;margin-left: 5px;">
规格：
{{data.remarks}}
</view>
</view>
</view>
</view>
</loading-state>
</template>
<script>
export default {
data() {
return {
page: {
sid: ''
},
data: {
picUrl: '',
name: '',
price: '',
remarks: ''
}
}
},
onLoad(options) {
this.page.sid = options.sid
this.request()
},
methods: {
request() {
let _this = this
_this.$api.goodsDetail(this.page.sid).then((resp) => {
console.log(resp);
_this.data = resp
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(2)
})
}).catch(e => {
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(1)
})
})
}
}
}
</script>
<style>
uni-page-body,
page {
background: #f3f4f6;
}
</style>