wangjiahai
2 years ago
1 changed files with 133 additions and 0 deletions
@ -0,0 +1,133 @@ |
|||||
|
<template> |
||||
|
|
||||
|
<loading-state ref="pageView" @request="request"> |
||||
|
|
||||
|
<view> |
||||
|
<image src="../../static/edit_bg.png" style="width: 100%;height: 40vw;z-index: 0;"></image> |
||||
|
<view style="display: flex;flex-direction: column;margin-top: -40vw;"> |
||||
|
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
||||
|
<view style="flex: 1;display: flex;flex-direction: column;z-index: 1;margin-left: 15px;"> |
||||
|
<view style="font-size: 17px;color: #FFFFFF;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
||||
|
{{data.state}} |
||||
|
</view> |
||||
|
<view |
||||
|
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #f1f2f3;box-sizing: border-box;"> |
||||
|
{{data.name}} |
||||
|
</view> |
||||
|
<view style="font-size: 12px;color: white;line-height: 4vw;height: 4vw;color: #f1f2f3;"> |
||||
|
{{data.time}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<image src='../../static/gift2.png' |
||||
|
style="width: 40px;height: 40px;padding-right: 30px;flex-shrink: 0;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
<view |
||||
|
style="background: #FFFFFF;border-radius: 20rpx;z-index: 1;height: 14vw;margin-left: 15px;margin-right: 15px;margin-top: 4vw;display: flex;align-items: center;"> |
||||
|
<image src="../../static/pName.png" style="width: 15px;height: 15px;margin-left: 15px;"></image> |
||||
|
<view style="margin-left: 15px;font-size: 14px;">{{data.pname}}</view> |
||||
|
</view> |
||||
|
|
||||
|
<view style="background: #FFFFFF;border-radius: 20rpx;padding: 15px;margin: 10px 15px;"> |
||||
|
|
||||
|
<view |
||||
|
style="display: flex;flex-direction: row;align-items: center;border-bottom: 1rpx #f1f2f3 solid;padding-bottom: 10px;"> |
||||
|
<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" |
||||
|
style="display: flex;flex-direction: row;margin-top: 15px;"> |
||||
|
<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;">剩余数量：{{item.lnum}}</view> |
||||
|
</view> |
||||
|
<view style="flex-shrink: 0;font-size: 12px;color: #666666;">x{{item.num}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view style="height: 60px;"></view> |
||||
|
<view v-if="data.showBtn||data.showRecord" |
||||
|
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;font-size: 22rpx;color: #191919;"> |
||||
|
预约记录</view> |
||||
|
<view v-if="data.showBtn" class="btn" style="flex-shrink: 0;font-size: 22rpx;color: royalblue;">预约提货 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</loading-state> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
page: { |
||||
|
sid: '' |
||||
|
}, |
||||
|
data: { |
||||
|
time: "", |
||||
|
name: "", |
||||
|
pname: "", |
||||
|
state: "", |
||||
|
showBtn: false, |
||||
|
showRecord: false, |
||||
|
goodsVos: [] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options) { |
||||
|
this.page.sid = options.sid |
||||
|
this.request() |
||||
|
}, |
||||
|
methods: { |
||||
|
request() { |
||||
|
let _this = this |
||||
|
_this.$api.cardDetail(this.page.sid).then((resp) => { |
||||
|
_this.data = resp |
||||
|
_this.$nextTick(() => { |
||||
|
_this.$refs.pageView.setLoadState(2) |
||||
|
}) |
||||
|
}).catch(e => { |
||||
|
_this.$nextTick(() => { |
||||
|
_this.$refs.pageView.setLoadState(1) |
||||
|
}) |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
.text { |
||||
|
white-space: normal; |
||||
|
text-overflow: -o-ellipsis-lastline; |
||||
|
overflow: hidden; |
||||
|
text-overflow: ellipsis; |
||||
|
display: -webkit-box; |
||||
|
-webkit-line-clamp: 2; |
||||
|
line-clamp: 2; |
||||
|
-webkit-box-orient: vertical; |
||||
|
} |
||||
|
|
||||
|
uni-page-body, |
||||
|
page { |
||||
|
background: #F1F2F3; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
border: 1px solid; |
||||
|
padding-left: 30rpx; |
||||
|
padding-right: 30rpx; |
||||
|
padding-top: 10rpx; |
||||
|
padding-bottom: 10rpx; |
||||
|
border-radius: 50rpx; |
||||
|
height: 15px; |
||||
|
margin-left: 25rpx; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue