订单详情页面

<template>
    <view class="info" >
    <view class="goods_list">
        <view class="goods_item" v-for="item in goods" :key="item.order_id">
            <view class="left_image">  <!-- 左侧图片 -->
                <image :src="item.super_goods_pic" mode="heightFix"></image>
            </view>
            <view class="right_text">
                <view class="goods_name">{{item.super_goods_name}}</view>
            
                <view class="goods_info">总价：{{item.total_price}}元</view>
                <view class="goods_info">数目：{{item.num}}</view>
                
                <view class="goods_info">时间：{{item.createtime}}</view>
                
            </view>    
        </view>     
    </view>    
    
        <view class="gds_item" >
            <view class="left_image">  <!-- 左侧图片 -->
                
            </view>
            <view class="rht_text">
                <view class="gds_name">收货信息</view>
            
                <view class="gds_info">用户姓名：{{user.user_name}}</view>
                <view class="gds_info">收货地址：{{user.user_address}}</view>
                
                <view class="gds_info">联系电话：{{user.user_phone_number}}</view>
                
            </view>    
        </view>
        
        <!-- <view class="bottom">
            <view><button class="bt" @click="addcart()" >再次购买</button></view>
            <view class="boxx">
                
            </view>
            <view><button class="bt" @click="navitocart()" >前往购物车</button></view>
        </view> -->
    </view>
</template>

<script>
    export default{
        data(){
            return{
                value:0,
                orderInfo: {
                    'order_id':0,
                },
                goods:[],
                data:{
                    'user_id':'1',
                    
                    'super_goods_id':'0',
                    'super_union_id':'1',
                    'number':1,
                    
                },
                user:[],
            }
        },
        methods:{
            async addcart(){
                
                this.data.super_goods_id=this.goods.super_goods_id;
                console.log(JSON.stringify(this.data))
                const res = await this.$myRequest({
                url: '/cart/addIntoCart',
                method: 'POST',
                data :JSON.stringify(this.data),
                })
                console.log(res);
                
            },
            navitocart(){
                uni.navigateTo({
                    url:''//跳转购物车
                });
            },
            
            async getOutInfo(){//这里和主页一样，从后台拿数据动态加载到界面上
            this.orderInfo.order_id=parseInt(this.orderInfo.order_id)
                console.log(JSON.stringify(this.orderInfo))
                const res = await this.$myRequest({
                url: '/order/getDetailsByOrderId',
                method: 'POST',
                data :JSON.stringify(this.orderInfo),
                })
                console.log(res)
                this.goods=res.data.description
                this.user=res.data.user_info    
                    },
                
            },
        
        onLoad(e){
            console.log(e)
            this.orderInfo.order_id=e.order_id;
            this.getOutInfo();
        }
    }
</script>

<style lang="scss">
    .info {
        .goods_list {
            .goods_item {
                background: white;
                display: flex;
                border-bottom: 8rpx solid #eee;
                .left_image {
                    image {
                        // padding: 12rpx;  
                        height:300rpx;
                        max-width:300rpx;
                        
                    }
                }
                
                .right_text {
                    
                     padding: 10rpx;
                    
                    word-wrap: break-word; // 允许换行
                    .goods_name {
                        font-size: 40rpx;
                        line-height: 60rpx;
                    }
                    
                    .goods_info {
                        font-size: 35rpx;
                        line-height: 70rpx;
                        color: #555555;
                    }
                    .number{
                        // height: 60rpx;
                        // width: 60rpx;
                        display: flex;
                        flex-direction: row;
                        align-items: flex-end;
                        }
                }
            }
            .gds_item {
                background: white;
                display: flex;
                border-bottom: 8rpx solid #eee;
                .left_image {
                    image {
                        // padding: 12rpx;  
                        height:300rpx;
                        max-width:300rpx;
                        
                    }
                }
                
                .rht_text {
                    height: 60rpx;
                    
                     padding: 20rpx;
                    
                    word-wrap: break-word; // 允许换行
                    .gds_name {
                        font-size: 40rpx;
                        line-height: 60rpx;
                    }
                    
                    .gds_info {
                        font-size: 35rpx;
                        line-height: 70rpx;
                        color: #555555;
                    }
                    
                }
            }
        }
        
        // .bt{
        //     width: 100%;
        //                     height: 80rpx;
        //                     color: white;
        //                     background: #007AFF;
        //                     border-radius: 50px;
        //                     justify-content: center;
        //                     align-items: center;
        // }
    }
</style>