eam-uniapp/pages/workOrderList/index.vue

<template>
	<view class="container">
		<u-navbar back-icon-color='#fff' :background="{ background: '#409eff'}" back-text="" title-color='#fff'
			:title="title">
			<template v-slot:right>
				<u-icon name="plus" color="#fff" size="36" style="padding-right: 30rpx;" @click="addForm"></u-icon>
			</template>
		</u-navbar>
		<Search @search='search' @screen='screen' />
		
		<workOrderList :data="data" :labelList='labelList' @itemClick="itemClick"></workOrderList>
		<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom);"></view>
	</view>
</template>

<script>
	import workOrderList from '@/components/workOrderList/index.vue'
	export default {
		components: {
			workOrderList
		},
		data() {
			return {
				title:'',
				type:'',
				labelList:[{
					label: '报修单号',
					field: 'dec1',
				},{
					label: '设备名称',
					field: 'dec2',
				},{
					label: '设备编号',
					field: 'dec3',
				},{
					label: '存放位置',
					field: 'dec4',
				},{
					label: '紧急程度',
					field: 'dec5',
				}],
				data: {
					isShowTime: true,
					list: [{
						title: '设备报修205245',
						dec1: 'BX-20224648',
						dec2: 'BX-20224648',
						dec3: 'BX-20224648',
						dec4: 'BX-20224648',
						dec5: 'BX-20224648',
						time: '2023-12-12 06:00:00',
						status: 6
					}, {
						title: '设备报修205245',
						dec1: 'BX-20224648',
						dec2: 'BX-20224648',
						dec3: 'BX-20224648',
						dec4: 'BX-20224648',
						dec5: 'BX-20224648',
						time: '2023-12-12 06:00:00',
						status: 2
					}, {
						title: '设备报修205245',
						dec1: 'BX-20224648',
						dec2: 'BX-20224648',
						dec3: 'BX-20224648',
						dec4: 'BX-20224648',
						dec5: 'BX-20224648',
						time: '2023-12-12 06:00:00',
						status: 3
					}, {
						title: '设备报修205245',
						dec1: 'BX-20224648',
						dec2: 'BX-20224648',
						dec3: 'BX-20224648',
						dec4: 'BX-20224648',
						dec5: 'BX-20224648',
						time: '2023-12-12 06:00:00',
						status: 4
					}]
				}

			}
		},
		methods: {
			// 筛选
			screen() {
				this.$tab.navigateTo(`/pages/workOrderList/screen?type=${this.type}`)
			},
			itemClick(item,index){
				this.$tab.navigateTo(`/pages/workOrderList/detail?type=${this.type}`)
			},
			addForm(){
				this.$tab.navigateTo(`/pages/workOrderList/addForm?type=${this.type}`)
			},
			// 获取设备保修列表
			
		},
		onLoad(option) {
			this.type = option.type
			if(option.type == 1){
				this.title = '设备报修'
			}else if(option.type == 2){
				this.title = '维修工单'
			}else if(option.type == 3){
				this.title = '检修工单'
			}else if(option.type == 4){
				this.title = '点检工单'
			}else if(option.type == 5){
				this.title = '保养工单'
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	.list{
		background: #f5f5f5;
		margin-top: 20rpx;
		.item{
			padding: 30rpx 30rpx 0px 30rpx;
			margin-top: 20rpx;
			background: white;
			.title{
				display: flex;
				align-items: center;
				padding-bottom: 20rpx;
				.title-txt{
					color: #409eff;
					font-weight: bold;
					font-size: 36rpx;
					width: 0px;
					flex: 1;
				}
				.time{
					color: #919191;
					
				}
			}
			.dec{
				padding-bottom: 20rpx;
				span{
					color: #999999;
				}
			}
			.last{
				padding-bottom: 30rpx;
			}
			.bottom{
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-top: 1px solid #E4E4E4;
				padding: 20rpx 0px;
				
			}
		}
	}

</style>