yxt_product
/
yxt-yyth-ui-miniprogram
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

商品详情

master
wong1988 2 years ago
parent
ee61b4c414
commit
505721d393
3 changed files with 94 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 33
      pages/card/card_booking.vue
  2. 17
      pages/card/card_detail.vue
  3. 76
      pages/good/goodsDetail.vue

33
pages/card/card_booking.vue
View File

@ -40,10 +40,11 @@
</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>
<input placeholder="请输入提货人"
<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" />
:value="data.userName" @input="onKeyInput1" />
</view>
<view
style="display: flex;align-items: center;padding-right: 10px;margin-top: 6px;margin-bottom: 8px;">
@ -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,12 +161,12 @@
this.shortToast('请输入手机号码')
return
}
if (this.data.userPhone.length!=11) {
if (this.data.userPhone.length != 11) {
this.shortToast('手机号码格式不对')
return
}
let num = 0;
for (var i = 0; i < this.data.goodsVos.length; i++) {
num += Number(this.data.goodsVos[i].select);
@ -184,10 +186,9 @@
})
},
goodDetail(sid){
// 商品详情
itemClick(goodsSid) {
uni.navigateTo({
url: '/pages/good/goodsDetail?sid=' + sid
url: '/pages/good/goodsDetail?sid=' + goodsSid
})
}
}

17
pages/card/card_detail.vue
View File

@ -36,18 +36,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" :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>
<view style="font-size: 12px;color: #666666;margin-top: 10px;">{{item.remarks}}</view>
</view>
<view style="display: flex;flex-direction: row;">
<text style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}
</text>
<view style="font-size: 12px;color: #666666;">剩余：{{item.lnum}}</view>
<text style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}
</text>
<view style="font-size: 12px;color: #666666;">剩余：{{item.lnum}}</view>
</view>
</view>
</view>
@ -58,7 +58,7 @@
style="position: fixed;bottom: 0;height: 50px;background: #f3f4f6;border-top: 1rpx #cacaca solid;width: 100%;display: flex;flex-direction: row;box-sizing: border-box;align-items: center;padding-right: 15px;">
<view style="flex: 1;"></view>
<view v-if="data.showRecord" class="btn" style="flex-shrink: 0;color: #191919;"
@click.stop="showRecord(page.sid)">
@click.stop="showRecord(page.sid)">
预约记录</view>
<view v-if="data.showBtn" class="btn" style="flex-shrink: 0;color: royalblue;"
@click.stop="booking(page.sid)">预约提货
@ -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
})
}
}

76
pages/good/goodsDetail.vue
View File

@ -1,22 +1,84 @@
<template>
<view>
</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>
</style>
uni-page-body,
page {
background: #f3f4f6;
}
</style>
Write Preview
Loading…
Cancel
Save