161 lines
3.8 KiB
Vue
161 lines
3.8 KiB
Vue
<template>
|
|
<view class="content bg" style="background-image: url('@@:static/bags_bg.png');">
|
|
|
|
<view class="title">
|
|
<view class="back" @click="toBack()">
|
|
<image src="@@:static/ic_back.png" mode=""></image>
|
|
</view>
|
|
<text>订单管理</text>
|
|
<view class="back"></view>
|
|
</view>
|
|
|
|
<view class="" style="width: 100%; margin-top: 54.86rpx; overflow: auto;">
|
|
|
|
<view class="" v-for="(item,index) in dataList"
|
|
style="width: 689.58rpx; height: 404.86rpx; background-color: white; border-radius: 16rpx; margin: 0 auto 15.28rpx; position: relative;">
|
|
|
|
|
|
<image src=""
|
|
style="position: absolute; width: 125rpx; height: 125rpx; background-color: #9B9285; border-radius: 16rpx; left: 30.56rpx; top: 59.72rpx;"
|
|
mode=""></image>
|
|
|
|
<text
|
|
style="font-size: 23.58rpx; color: #FF8B36; position: absolute; top: 30.56rpx; right: 23.61rpx;">待发货</text>
|
|
|
|
<text
|
|
style="font-size: 23.58rpx; color: #6E5B51; position: absolute; left: 171.53rpx; top: 65.97rpx;">{{item.title}}</text>
|
|
|
|
<text
|
|
style="font-size: 19.42rpx; color: #8C8574; position: absolute; left: 173.61rpx; top: 102.8rpx;">{{item.name}}</text>
|
|
|
|
<text
|
|
style="font-size: 29.13rpx; color: #6E5B51; position: absolute; left: 172.92rpx; top: 154.17rpx;">￥{{item.price}}</text>
|
|
|
|
|
|
<text
|
|
style="font-size: 19.42rpx; color: #8C8574; position: absolute; top: 103.47rpx; right: 25rpx;">x{{item.num}}</text>
|
|
|
|
|
|
<view class="row" style="align-items: center; position: absolute; left: 30.56rpx; top: 227.08rpx;">
|
|
<image src="@@:static/ic_address.png" style="width: 19.44rpx; height: 22.92rpx;" mode=""></image>
|
|
<text style="font-size: 23.58rpx; color: #6E5B51; margin-left: 10rpx;">{{item.address}}</text>
|
|
</view>
|
|
|
|
<text
|
|
style="font-size: 19.42rpx; color: #8C8574; position: absolute; left: 60.58rpx; top: 263.19rpx;">{{item.phone}}</text>
|
|
|
|
|
|
<view class="row" style="position: absolute; right: 24.31rpx; bottom: 31.94rpx;">
|
|
<image src="@@:static/ic_logistics.png" style="width: 143.75rpx; height: 59.72rpx;"
|
|
@click="toDetails(index)" mode=""></image>
|
|
<image src="@@:static/confirm_receipt.png"
|
|
style="width: 143.75rpx; height: 59.72rpx; margin-left: 25.69rpx;" mode=""></image>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
|
|
dataList: [{
|
|
imgUrl: "",
|
|
title: "坂本日常 吧唧",
|
|
name: "坂本",
|
|
price: 20,
|
|
num: 1,
|
|
type: 0,
|
|
address: "某某小区",
|
|
phone: "某某 13333333333",
|
|
isTakeOver: false
|
|
}, {
|
|
imgUrl: "",
|
|
title: "坂本日常 吧唧",
|
|
name: "坂本",
|
|
price: 20,
|
|
num: 1,
|
|
type: 0,
|
|
address: "某某小区",
|
|
phone: "某某 13333333333",
|
|
isTakeOver: false
|
|
}, {
|
|
imgUrl: "",
|
|
title: "坂本日常 吧唧",
|
|
name: "坂本",
|
|
price: 20,
|
|
num: 1,
|
|
type: 0,
|
|
address: "某某小区",
|
|
phone: "某某 13333333333",
|
|
isTakeOver: false
|
|
}, {
|
|
imgUrl: "",
|
|
title: "坂本日常 吧唧",
|
|
name: "坂本",
|
|
price: 20,
|
|
num: 1,
|
|
type: 0,
|
|
address: "某某小区",
|
|
phone: "某某 13333333333",
|
|
isTakeOver: false
|
|
}, ]
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
toBack() {
|
|
uni.navigateBack();
|
|
},
|
|
|
|
//物流详情
|
|
toDetails(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/me/logistics-details-page?id' + id
|
|
});
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content {
|
|
width: 100%;
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.title {
|
|
width: 688.88rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
margin-top: 119.44rpx;
|
|
|
|
text {
|
|
font-size: 29.17rpx;
|
|
color: #6E5B51;
|
|
}
|
|
}
|
|
|
|
.back {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
|
|
image {
|
|
width: 14.58rpx;
|
|
height: 27.08rpx;
|
|
}
|
|
}
|
|
</style> |