46 lines
959 B
Vue
46 lines
959 B
Vue
<template>
|
|
<view class="container">
|
|
<view class="header">
|
|
<text class="title">我的订单</text>
|
|
</view>
|
|
<view class="order-list">
|
|
<view v-for="order in orders" :key="order.id" class="order-item">
|
|
<text class="order-no">{{ order.orderNo }}</text>
|
|
<text class="order-amount">¥{{ order.amount }}</text>
|
|
<text class="order-status">{{ order.status }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue'
|
|
|
|
const orders = ref([
|
|
{ id: 1, orderNo: 'O202401010001', amount: '199.99', status: '已完成' },
|
|
{ id: 2, orderNo: 'O202401010002', amount: '99.99', status: '待支付' }
|
|
])
|
|
</script>
|
|
|
|
<style scoped>
|
|
.container {
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.order-list {
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.order-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx;
|
|
border-bottom: 1rpx solid #eee;
|
|
}
|
|
|
|
.order-amount {
|
|
color: #ff0000;
|
|
font-weight: bold;
|
|
}
|
|
</style>
|