YTAPP/pages/waybillNo/waybillNoLog.vue

<template>
	<view class="history">
		<view class="item" v-for="(item, i) in waybillNoHistory" :key="i">
			<view>
				<view>
					<text class="type">库位</text>
					<text class="code" :style="{ color: item.status ? 'green' : '#666' }">{{ item.space }}</text>
				</view>
				<view>
					<text class="type">单号</text>
					<text class="code" :style="{ color: item.status ? 'green' : '#666' }">{{ item.code }}</text>
				</view>
				<view class="space-time">
					<text>
						{{ item.createTime }}
					</text>
				</view>
			</view>
			<view>
				<uni-icons v-if="item.status" type="checkmarkempty" class="status" size="16"
					color="green"></uni-icons>
				<text class="status fail" v-else>F</text>
			</view>
		</view>
		<view v-if="waybillNoHistory.length === 0" class="is-empty">暂无历史</view>
	</view>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
const waybillNoHistory = ref([]);
const getHistory = async () => {
	waybillNoHistory.value = await uni.getStorageSync('waybillNoHistory');
};
onLoad(async () => {
	await getHistory();
});
</script>

<style lang="scss" scoped>
.history {
		display: flex;
		width: 100%;
		flex-direction: column;
		justify-items: start;

		.title {
			padding: 20rpx;
			font-size: 24rpx;
			font-weight: 600;
		}

		.type {
			padding-right: 20rpx;
			font-size: 24rpx;
		}

		.code {
			font-weight: 600;
		}

		.item {
			padding: 20rpx;
			font-size: 20rpx;
			color: #666;
			display: flex;
			flex-direction: row;

			.status {
				padding-left: 20rpx;
			}

			.fail {
				font-weight: 600;
				color: #f00;
			}
		}

		.is-empty {
			text-align: center;
			margin: 40px 0;
			color: #999;
		}
	}
</style>