<template>
	<view>
		<view class="status_bar">
			<!-- 这里是状态栏 -->
		</view>
		<uni-nav-bar shadow left-icon="left" title="出库明细" @clickLeft="back" />
		<view v-for="item in dataList" :key="item.id">
			<uni-card :is-shadow="false" margin="5px" @click='goPage(item)'>
				<template v-slot:title>
					<uni-list>
						<uni-list-item :title="'出库单号'+item.code" showArrow />
					</uni-list>
				</template>
				<view class="card-content">
					<text>提单号:{{item.no}}</text>
					<text>件数:{{item.qty}}</text>
					<text>货物名称:{{item.goodsName}}</text>
					<text>库区:{{item.stock}}</text>
				</view>

			</uni-card>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList: [{
						id: 1,
						code: "111",
						no: 'QD-1',
						name: '客户1',
						date: '2020-01-01',
						goodsName: '货物1',
						qty: '2',
						stock: '库区1'
					},
					{
						id: 2,
						code: "222",
						no: 'QD-2',
						name: '客户2',
						date: '2020-01-02',
						goodsName: '货物2',
						qty: '3',
						stock: '库区2'
					}
				]
			};
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			search() {
				uni.showToast({
					title: '搜索'
				})
			},
			goPage(row) {
				uni.navigateTo({
					url: '../addTags',
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
		background-color: rgb(52, 120, 243);
	}

	.card-content {
		display: flex;
		flex-direction: column;

		text: {
			color: #000000
		}
	}
</style>
