|
|
@@ -0,0 +1,150 @@
|
|
|
+<template>
|
|
|
+ <view class="u-page">
|
|
|
+ <u-list @scrolltolower="scrolltolower">
|
|
|
+ <view class="list-wrap">
|
|
|
+ <view v-for="(item, index) in detailList" :key="index" class="card-item">
|
|
|
+ <view class="info-item">
|
|
|
+ <u-col span="6">
|
|
|
+ <text class="label">商品名称：{{item.itemName}}</text>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="6">
|
|
|
+ <text class="label">体积：{{ item.cube }} m³</text>
|
|
|
+ </u-col>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <u-col span="6">
|
|
|
+ <text class="label">重量：{{ item.weight }} kg</text>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="6">
|
|
|
+ <text class="label">数量：{{ item.peiceNum }} 件</text>
|
|
|
+ </u-col>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-list>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { getOrderDetailList } from '@/api/index.js';
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ detailList: [],
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ // loadStatus: 'loadmore',
|
|
|
+ total: 0
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ onLoad(options) {
|
|
|
+ console.log(options)
|
|
|
+ let item = {}
|
|
|
+ item.accountId = options.accountId
|
|
|
+ item.orderCenterOrderId = options.orderCenterOrderId
|
|
|
+ this.getDetailList(item);
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ // 获取明细列表数据
|
|
|
+
|
|
|
+ // let params = {
|
|
|
+ // accountId: item.ACCOUNT_ID,
|
|
|
+ // userId: item.USER_ID,
|
|
|
+ // orderCenterOrderId: item.ORDER_CENTER_ORDER_ID
|
|
|
+ // }
|
|
|
+ // getOrderDetailList(params).then(res => {
|
|
|
+ // if (res.data) {
|
|
|
+ // console.log(res.data)
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ async getDetailList(item) {
|
|
|
+ try {
|
|
|
+ // this.loadStatus = 'loading';
|
|
|
+ // 这里替换为实际的API调用
|
|
|
+ const res = await getOrderDetailList({
|
|
|
+ accountId: item.accountId,
|
|
|
+ userId: item.userId,
|
|
|
+ orderCenterOrderId: item.orderCenterOrderId
|
|
|
+ });
|
|
|
+
|
|
|
+ console.log(1111)
|
|
|
+ console.log(res)
|
|
|
+ if (res.code === 'success') {
|
|
|
+ this.detailList = res.data
|
|
|
+ } else {
|
|
|
+ // this.loadStatus = 'loadmore';
|
|
|
+ uni.$u.toast(res.message || '获取数据失败');
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ // this.loadStatus = 'loadmore';
|
|
|
+ uni.$u.toast('获取数据失败');
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // // 滚动到底部触发
|
|
|
+ // scrolltolower() {
|
|
|
+ // if (this.loadStatus === 'loadmore') {
|
|
|
+ // this.page++;
|
|
|
+ // this.getDetailList();
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.u-page {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.list-wrap {
|
|
|
+ padding: 15px;
|
|
|
+ background-color: #f8f8f8;
|
|
|
+}
|
|
|
+
|
|
|
+.card-item {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 8px;
|
|
|
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
|
|
+ padding: 12px;
|
|
|
+ border: 1px solid #eaeaea;
|
|
|
+}
|
|
|
+
|
|
|
+.info-item {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 8px 0;
|
|
|
+
|
|
|
+ &:not(:last-child) {
|
|
|
+ border-bottom: 1px solid #f0f0f0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label {
|
|
|
+ color: #333;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-right: 5px;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ display: inline-block;
|
|
|
+ width: 1px;
|
|
|
+ height: 12px;
|
|
|
+ background-color: #dcdfe6;
|
|
|
+ margin: 0 8px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .value {
|
|
|
+ color: #666;
|
|
|
+ font-size: 14px;
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
luhuan