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
Unified 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> <template>
<view> <loading-state ref="pageView" @request="request">
<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>
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> <image src="../../static/edit_bg.png" style="width: 100%;height: 40vw;z-index: 0;"></image>
<view style="flex: 1;display: flex;flex-direction: column;z-index: 1;margin-left: 15px;"> <view style="display: flex;flex-direction: column;margin-top: -40vw;">
<view style="font-size: 17px;color: #FFFFFF;height: 8vw;line-height: 8vw;margin-top: 5vw;"> <view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;">
{{data.state}} <view style="flex: 1;display: flex;flex-direction: column;z-index: 1;margin-left: 15px;">
</view> <view style="font-size: 17px;color: #FFFFFF;height: 8vw;line-height: 8vw;margin-top: 5vw;">
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #f1f2f3;"> {{data.state}}
{{data.name}} </view>
</view> <view
<view style="font-size: 12px;color: white;line-height: 4vw;height: 4vw;color: #f1f2f3;"> style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #f1f2f3;box-sizing: border-box;">
{{data.time}} {{data.name}}
</view>
<view style="font-size: 12px;color: white;line-height: 4vw;height: 4vw;color: #f1f2f3;">
{{data.time}}
</view>
</view> </view>
<image src='../../static/gift2.png'
style="width: 40px;height: 40px;padding-right: 30px;flex-shrink: 0;">
</image>
</view> </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 <view
style="display: flex;flex-direction: row;align-items: center;border-bottom: 1rpx #f1f2f3 solid;padding-bottom: 10px;"> 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/mingxi.png" style="width: 15px;height: 15px;"></image> <image src="../../static/pName.png" style="width: 15px;height: 15px;margin-left: 15px;"></image>
<view style="margin-left: 10px;font-size: 14px;">商品明细</view> <view style="margin-left: 15px;font-size: 14px;">{{data.pname}}</view>
</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="background: #FFFFFF;border-radius: 20rpx;padding: 15px;margin: 10px 15px;">
<view style="margin-left: 10px;margin-right: 10px;">
<text class="text" style="flex: 1;font-weight: 500;">background: #FFFFFF;border-radius: <view
20rpx;padding: 15px;margin: 10px 15px; style="display: flex;flex-direction: row;align-items: center;border-bottom: 1rpx #f1f2f3 solid;padding-bottom: 10px;">
</text> <image src="../../static/mingxi.png" style="width: 15px;height: 15px;"></image>
<view style="font-size: 12px;color: #666666;">可用数量：{{item.lNum}}</view> <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 style="flex-shrink: 0;font-size: 12px;color: #666666;">x{{item.num}}</view>
</view> </view>
</view> </view>
</view>
<view style="height: 60px;"></view> <view style="height: 60px;"></view>
<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;"> 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 style="flex: 1;"></view>
<view class="btn" style="flex-shrink: 0;font-size: 30rpx;color: #191919;"> <view v-if="data.showRecord" class="btn" style="flex-shrink: 0;font-size: 22rpx;color: #191919;">
预约记录</view> 预约记录</view>
<view class="btn" style="flex-shrink: 0;font-size: 30rpx;color: royalblue;">预约提货</view> <view v-if="data.showBtn" class="btn" style="flex-shrink: 0;font-size: 22rpx;color: royalblue;">预约提货
</view>
</view>
</view> </view>
</view>
</loading-state>
</template> </template>
<script> <script>
@ -65,70 +71,34 @@
sid: '' sid: ''
}, },
data: { data: {
time: "2023.10.20-2025.10.20", time: "",
name: "卡号:123456789", name: "",
pname: "闭包名称", pname: "",
state: "已失效", state: "",
showBtn: false, showBtn: false,
list: [{ showRecord: false,
goods: '大白菜', goodsVos: []
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
}]
} }
} }
}, },
onLoad(options) { onLoad(options) {
this.page.sid = options.sid this.page.sid = options.sid
this.request()
}, },
methods: { 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> </script>
@ -152,12 +122,12 @@
.btn { .btn {
border: 1px solid; border: 1px solid;
padding-left: 25rpx; padding-left: 30rpx;
padding-right: 25rpx; padding-right: 30rpx;
padding-top: 10rpx; padding-top: 10rpx;
padding-bottom: 10rpx; padding-bottom: 10rpx;
border-radius: 50rpx; border-radius: 50rpx;
height: 20px; height: 15px;
margin-left: 25rpx; margin-left: 25rpx;
} }
</style> </style>
Write Preview
Loading…
Cancel
Save