采购列表添加分页

pageQuota/purchase_product_offer/index.vue

@@ -4,11 +4,9 @@
 		<view class="content">
 			<up-transition :show="true" mode="slide-left">
 				<view v-if="goodsList1.length>0">
-					<view class="card" v-for="(item,index) in goodsList1" :key='index'>
+					<up-list @scrolltolower="getGoodsList">
-						<view class="head">
+						<up-list-item v-for="(item, index) in goodsList1" :key="index">
-							<!-- <text> {{orer_sn}}</text> -->
+							<view class="card">
-							<!-- <text style="color: #989898;">{{time}}</text> -->
-						</view>
 								<view class="card-content">
 									<view class="card-content-l" style="width: 152rpx;height: 152rpx;">
 										<image style="width: 152rpx;height: 152rpx;" :src="item.image" mode=""></image>
@@ -40,17 +38,17 @@
 											</view>
 										</view>
 									</view>
-
 								</view>
-
 								<view class="card-footer">
 									<up-button size="small" type="primary" shape="circle" @click="cancleOrder(item)"
 										v-if="item.buyer_confirm==0">确认已采购</up-button>
-							<up-button size="small" type="success" shape="circle" v-else @click="cancleOrder(item)"
+									<up-button size="small" type="success" shape="circle" v-else
-							>修改采购信息</up-button>
+										@click="cancleOrder(item)">修改采购信息</up-button>
 								</view>
 								<up-line style="margin-top: 30rpx;" color="#F3F3F3"></up-line>
 							</view>
+						</up-list-item>
+					</up-list>
 				</view>
 				<up-empty @click='test2' v-else mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
 				</up-empty>
@@ -63,24 +61,20 @@
 								<span>{{supplierText}}</span>
 							</template>
 						</up-input> -->
-						       <next-search-select
+						<next-search-select :multiple="false" :list="supplierList" label-key="mer_name" value-key="id"
-						            :multiple="false"
+							placeholder=" 请选择供应商" title="选择供应商" v-model:value="formData.supplier_id"
-						            :list="supplierList"
+							@change="changeCallback" @search="getSupplierList" clearable></next-search-select>
-						            label-key="mer_name"
-						            value-key="id"
-						            placeholder=" 请选择供应商"
-						            title="选择供应商"
-						            v-model:value="formData.supplier_id"
-						            @change="changeCallback"
-									@search="getSupplierList"
-						            clearable
-						        ></next-search-select>
 					</up-form-item>
 					<up-form-item label="名称">
 						<up-input v-model="formData.store_name" border="none" disabled=""></up-input>
 					</up-form-item>
-					<up-form-item label="数量">
+					<up-form-item label="需求数量">
-						<up-input v-model="formData.buyer_nums" @change='changeInputPrice' readonly> <template #suffix>
+						<up-input v-model="formData.need_num" disabled> <template #suffix>
+								<span>{{formData.unit_name}}</span>
+							</template></up-input>
+					</up-form-item>
+					<up-form-item label="采购数量">
+						<up-input v-model="formData.buyer_nums" @change='changeInputPrice'> <template #suffix>
 								<span>{{formData.unit_name}}</span>
 							</template></up-input>
 					</up-form-item>
@@ -147,7 +141,8 @@
 		supplier_id: '',
 		purchase: '',
 		total_price: '',
-		buyer_nums: 0,
+		buyer_nums: '',
+		need_num: 0,
 		package: '',
 		store_info: '',
 		marques: '',
@@ -156,7 +151,13 @@
 		source_order_info: []
 	})
 	// tabsindex
-	const radiolist1=ref([{name:'赊账', value: 1},{name:'现金', value: 2}])
+	const radiolist1 = ref([{
+		name: '赊账',
+		value: 1
+	}, {
+		name: '现金',
+		value: 2
+	}])
 	const radio_value = ref('赊账')
 	const tabIndex = ref(1)
 	const {
@@ -176,18 +177,35 @@
 	const goodsList = ref([])
 	const goodsList1 = ref([])
 	const where = ref({
-		buyer_confirm: 0
+		buyer_confirm: 0,
+		page_no: 0,
+		page_size: 15
 	})
+	const loadEnd = ref(false)
 	const getGoodsList = async () => {
+		if (loadEnd.value) {
+			return
+		}
+		where.value.page_no++
 		let res = await purchaseProductOfferLists(where.value)
+		if (where.value.page_no == 1) {
 			goodsList1.value = res.data.lists
+		} else {
+			goodsList1.value.push(...res.data.lists)
+		}
+		if (res.data.lists.length < where.value.page_size) {
+			loadEnd.value = true
+		}
 	}
 	const supplierList = ref([])
 	const getSupplierList = (val = '') => {
-		supplierListApi({mer_name:val}).then(res => {
+		supplierListApi({
+			mer_name: val
+		}).then(res => {
 			supplierList.value = res.data.lists
 		})
 	}
+
 	function changeCallback(item) {
 		console.log("选中的item：", item)
 	}
@@ -207,7 +225,8 @@
 		formData.value.store_name = item['store_name']
 		formData.value.id = item['id']
 		formData.value.bhoid = item.order_id
-		formData.value.buyer_nums = item['need_num']
+		formData.value.need_num = item['need_num']
+		formData.value.buyer_nums = ''
 		formData.value.product_id = item['product_id']
 		formData.value.unit_name = item['unit_name']
 		formData.value.package = item.package
@@ -249,6 +268,8 @@
 		}
 	}
 	const sectionChange = (index) => {
+		loadEnd.value = false
+		where.value.page_no = 0
 		where.value.buyer_confirm = index
 		goodsList1.value = []
 		getGoodsList()