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

1111

master
wangjiahai 2 years ago
parent
87acee7242
commit
6264fe5c86
1 changed files with 74 additions and 104 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. 178
      pages/card/card_detail.vue

178
pages/card/card_detail.vue
View File

@ -1,60 +1,66 @@
<template>
<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;">
{{data.name}}
</view>
<view style="font-size: 12px;color: white;line-height: 4vw;height: 4vw;color: #f1f2f3;">
{{data.time}}
<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>
<image src='../../static/gift2.png'
style="width: 40px;height: 40px;padding-right: 20px;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>
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 v-for="(item,index) in data.list" style="display: flex;flex-direction: row;margin-top: 15px;">
<image src="../../static/logo.png" style="width: 60px;height: 60px;flex-shrink: 0;"></image>
<view style="margin-left: 10px;margin-right: 10px;">
<text class="text" style="flex: 1;font-weight: 500;">background: #FFFFFF;border-radius:
20rpx;padding: 15px;margin: 10px 15px;
</text>
<view style="font-size: 12px;color: #666666;">可用数量：{{item.lNum}}</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 style="flex-shrink: 0;font-size: 12px;color: #666666;">x{{item.num}}</view>
</view>
</view>
</view>
<view style="height: 60px;"></view>
<view
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 class="btn" style="flex-shrink: 0;font-size: 30rpx;color: #191919;">
预约记录</view>
<view class="btn" style="flex-shrink: 0;font-size: 30rpx;color: royalblue;">预约提货</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>
</view>
</loading-state>
</template>
<script>
@ -65,70 +71,34 @@
sid: ''
},
data: {
time: "2023.10.20-2025.10.20",
name: "卡号:123456789",
pname: "闭包名称",
state: "已失效",
time: "",
name: "",
pname: "",
state: "",
showBtn: false,
list: [{
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}, {
goods: '大白菜',
pic: '',
num: 10,
lNum: 1
}]
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>
@ -152,12 +122,12 @@
.btn {
border: 1px solid;
padding-left: 25rpx;
padding-right: 25rpx;
padding-left: 30rpx;
padding-right: 30rpx;
padding-top: 10rpx;
padding-bottom: 10rpx;
border-radius: 50rpx;
height: 20px;
height: 15px;
margin-left: 25rpx;
}
</style>
Write Preview
Loading…
Cancel
Save