manage_mobile/pages/purchase/detail.vue

<style lang="scss">
	.container{
		min-height:100%;
		background:#f6f6f6;
		padding:30rpx 0;

		.card{
			&>view{
				&+view{
					border-top:2rpx solid rgba(216, 216, 216, 0.3);
					margin-top:20rpx;
					padding-top:20rpx;
				}
				.head{
					display: flex;
					align-items: center;
					text{
						&:first-child{
							height:40rpx;
							line-height: 40rpx;
							min-width:80rpx;
							padding:0 6rpx;
							background:#10C176;
							border-radius: 0 20rpx 0 20rpx;
							font-size:20rpx;
							color:#fff;
							text-align: center;
							margin-right:20rpx;
						}
						&:nth-child(3){
							color:#999;
							font-size:24rpx;
						}
					}
				}
				.info{
					display: flex;
					align-items: center;
					font-size:24rpx;
					color:#999;
					margin-top:14rpx;
					text{
						&:first-child{
							flex-shrink: 0;
							margin-right:15rpx;
						}
						&:nth-child(3){
							flex-shrink: 0;
							color:#333;
							font-size:28rpx;
							margin-left:auto;
							&:after{
								content:"("attr(data-total)")";
								font-size:24rpx;
								color:#999;
							}
						}
					}
				}
			}
		}
	}
</style>
<template>
	<view class="container">
		<view style="margin:0 30rpx;">申请日期：{{date}}</view>
		<view class="card">
			<view v-for="(v,k) in list" :key="k">
				<view class="head">
					<text>{{v.detailedParentName}}</text> <text>{{v.goodsName}}</text> <text>({{v.goodsSpecification}})</text>
				</view>
				<view class="info">
					<text>{{v.detailedType}}</text> <text class="over">{{v.supplier}}</text> <text :data-total="v.heft">{{v.packing}}</text>
				</view>
			</view>
			<u-empty v-if="list.length==0" text="未查询到相关信息" width="70%" icon="/static/noData.png"/>
		</view>
	</view>
</template>
<script>
import request from '@/common/request'
export default {
	data(){
		return{
			date:"",
			list:[],
		}
	},
	onLoad(options){
		this.date=options.date
		this.getPurchaseDetail(options.id)
	},
	methods:{
		async getPurchaseDetail(purchaseId){
			var res=await request("/api/purchase/purchaseSubList",{
				params:{
					purchaseId
				}
			})
			if(res.statu){
				this.list=res.data
			}else{
				uni.showModal({
					title:"提示",
					content:res.msg||"获取采购详情失败！",
					showCancel:false,
				})
			}
		},
	}
}
</script>