aiot-app/pages/pda/workOrder/index/index.vue

<template>
	<view class="content-box">
		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="工单列表" background-color="#157A2C" color="#fff"
			@clickLeft="back"></uni-nav-bar>

		<view class="top-wrapper">
			<uni-section>
				<uni-easyinput prefixIcon="search" style="width: 480rpx" v-model="searchFrom.keyWord" placeholder="请输入">
				</uni-easyinput>
			</uni-section>

			<button class="search_btn" @click="doSearch">搜索</button>

			<image class="menu_icon" src="~@/static/pda/menu.svg"></image>



		</view>

		<view class="list_box">

			<u-list @scrolltolower="scrolltolower" key="list" :preLoadScreen="page * 10">
				<u-list-item v-for="(item, index) in dataList" :key="index">
					<workCard :item="item"   @handleDetail="handleDetail"></workCard>
				</u-list-item>


				<u-list-item v-if="dataList.length === 0">
					<view class="nodata"> 暂无数据 </view>
				</u-list-item>

			</u-list>
		</view>

	</view>
</template>

<script>
	import workCard from '../../components/workCard.vue'
	import { workorderPage } from '@/api/pda/workOrder.js'
	let [isEnd] = [false]
	export default {
		components: {
			workCard
		},
		data() {
			return {
				page: 1,

				dataList: [],

				searchFrom: {
					keyWord: null
				},
				

			}
		},
		onShow() {
			 this.getList()
		},
		methods: {
		async	getList() {
				let params = {
					 page: this.page,
					 size: 5,
					 status: [4,5,6,7],
					 ...this.searchFrom
				}
				
				 isEnd = false
				 const res = await workorderPage(params)
				 console.log(res)
				 
				 if (params.page === 1) {
				   this.dataList = []
				 }
				 
				   this.dataList.push(...res.list)
				   
				      isEnd = this.dataList.length >= res.count
				 
			},


			doSearch() {},


			scrolltolower() {
				if (isEnd) return
				this.page++
				this.getList()
			},
			
			
			handleDetail (item) {


             let  url= '/pages/pda/workOrder/extrusionMolding/index'
			
			  url += `?id=1&title=挤压成型`
			  console.log(url)
			  uni.navigateTo({
			    url
			  })
			  console.log(item)
			},
		

		}
	}
</script>

<style lang="scss" scoped>
	.content-box {
		height: 100vh;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		background-color: $page-bg;
	}

	.top-wrapper {
		background-color: #fff;
		display: flex;
		width: 750rpx;
		height: 88rpx;
		padding: 16rpx 32rpx;
		align-items: center;
		gap: 16rpx;

		/deep/.uni-section {
			margin-top: 0px;
		}

		/deep/.uni-section-header {
			padding: 0px;

		}

		.search_btn {
			width: 120rpx;
			height: 70rpx;
			line-height: 70rpx;
			padding: 0 24rpx;
			background: $theme-color;
			font-size: 32rpx;
			color: #fff;
			margin: 0;
		}

		.menu_icon {
			width: 44rpx;
			height: 44rpx;

		}
	}


	.list_box {
		flex: 1;
		overflow: hidden;
		padding: 16rpx 0;

		.u-list {
			height: 100% !important;
		}
	}


	.nodata {
		font-size: 40rpx;
		text-align: center;
		padding-top: 30rpx;
	}
</style>