used-car-h5/pages/index/mine - 副本.vue

<template>
	<view class="page">
		<!-- 列表 -->
		<z-paging  ref="paging"  v-model="list" @query="queryList" empty-view-text="暂无数据！">
			<!-- <uni-nav-bar leftText=" " :fixed="true" :border="false" color="#fff" backgroundColor="#3F435B" :statusBar="true" title="首页"></uni-nav-bar> -->
			<!-- 顶部：标题 + 搜索（不想要搜索可直接删除这一块） -->
			<view class="page-head">
				<view class="head-search">
					<u-search
					  v-model="keyword"
					  placeholder="请输入关键词"
					  :show-action="false"
					  shape="round"
					  @change="onKeywordChange"
					  @search="onSearch"
					  @clear="onSearch"
					/>
				</view>
			</view>
			<view class="list-wrap">
				<uni-swipe-action-item
					v-for="item in list"
					:key="item.id"
					:right-options="options1"
					@click="swipeClick($event, item)"
				>
					<CarCard
						:item="item"
						@pdfchange="onSearch"
						@request-price="onRequestPrice"
					/>
				</uni-swipe-action-item>
			</view>
		</z-paging>
		<uni-popup ref="inputDialog" type="dialog">
		  <uni-popup-dialog
		    mode="input"
		    title="请输入价格"
		    :value="priceDialogValue"
		    placeholder="请输入车辆价格"
		    @confirm="dialogInputConfirm"
		  />
		</uni-popup>
	</view>
</template>

<script>
	import { request } from '@/api/apiT.js'
	import CarCard from '@/components/CarCard/CarCard.vue'

	export default {
		components: {
			CarCard
		},
		data() {
			return {
				priceDialogItem: null,
				priceDialogIndex: -1,
				priceDialogValue: '',
				options1: [{
						text: '编辑',
						style: {
							backgroundColor: '#007aff'
						}
					},
					{
						text: '删除',
						style: {
							backgroundColor: '#F56C6C'
						}
					}
				],
				keyword: '',
				page: 1,
				pageSize: 10,
				loading: false,
				finished: false,
				list: []
			}
		},
		onLoad() {
			// H5：处理分享兜底参数 r（如果路由没命中/经历登录回跳，会先落到首页）
			// #ifdef H5
			try {
				const u = new URL(window.location.href)
				const r = u.searchParams.get('r')
				if (r) {
					const target = decodeURIComponent(r)
					// 清理地址栏的 r，避免反复跳转
					u.searchParams.delete('r')
					window.history.replaceState({}, '', u.toString())
					// 让首页加载完再跳
					setTimeout(() => {
						uni.navigateTo({ url: target })
					}, 50)
				}
			} catch (e) {}
			// #endif
		},
		methods: {
			onRequestPrice(payload) {
				// payload: { item, index }
				this.priceDialogItem = payload && payload.item ? payload.item : null
				this.priceDialogIndex = payload && typeof payload.index === 'number' ? payload.index : -1
				this.priceDialogValue = ''
				this.$nextTick(() => {
					this.$refs.inputDialog && this.$refs.inputDialog.open()
				})
			},
			dialogInputConfirm(val) {
				const item = this.priceDialogItem
				const index = this.priceDialogIndex
				const price = String(val || '').trim()
			
				if (!item) return
				if (!price) {
					uni.showToast({ title: '请输入价格', icon: 'none' })
					return
				}
				if (isNaN(price) || Number(price) <= 0) {
					uni.showToast({ title: '请输入有效的价格', icon: 'none' })
					return
				}
			
				request({
					url: 'common/usedcar/produce/pdf',
					method: 'get',
					data: { id: item.id, price }
				}).then(res => {
					if (res.data.code == 200) {
						// 通知刷新列表（你原来就是靠这个事件刷新）
						this.onSearch()
			
						// 直接调用对应卡片实例的下载方法（如果 ref 数组存在的话）
						const cards = this.$refs.carCard
						const card = Array.isArray(cards) ? cards[index] : cards
						if (card && typeof card.downloadpdf === 'function') {
							card.downloadpdf(item)
						}
					} else {
						uni.showToast({ title: res.data.msg || '生成失败', icon: 'none' })
					}
				})
			},
			onKeywordChange(val) {
			    // val 是输入值（uView 通常会传）
			    this.keyword = val
			
			    // 防抖：300ms 内持续输入只触发一次
			    if (this._kwTimer) clearTimeout(this._kwTimer)
			    this._kwTimer = setTimeout(() => {
			      this.onSearch()
			    }, 300)
			},
			onSearch() {
				this.queryList(this.page,this.pageSize)
			},
			queryList(pageNo, pageSize, from) {
				this.loading = true;
				var that = this;
				const params = {
					current:pageNo,
					status:1,
					size:10
				};
				params.keyword = this.keyword;
				params.scene = 'self';
				request({
					url:'common/usedcar/list',
					method:'get',
					data: params
				}).then(res => {
					if(res.data.code ==200){
						var datas = res.data.data.records;
						this.$refs.paging.complete(datas);
					}else{
					} 
					uni.stopPullDownRefresh();
					//
				})
			},
			swipeClick(e,item){
				let {
					content
				} = e;
				if (content.text === '删除') {
					uni.showModal({
						title: '提示',
						content: '是否删除',
						success: res => {
							if (res.confirm) {
								request({
									url:'common/usedcar/destroy',
									method:'post',
									data: {id:item.id}
								}).then(res => {
									uni.showToast({
										title: res.data.message,
										icon: 'none'
									});
									this.queryList()
								})
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				} else {
					const id = item.id
					uni.navigateTo({
						url: `/pages/index/publishedit?id=${id}`
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		min-height: 100vh;
		background: #f4f6f8;
	}

	.page-head {
		position: fixed;
		width: 100%;
		bottom: 50px;
		z-index: 99;
		// padding: 28rpx 24rpx 18rpx;
		// background: linear-gradient(180deg, rgba(255, 151, 47, 0.22) 0%, rgba(255, 151, 47, 0.06) 55%, #f4f6f8 100%);
	}

	.head-search {
		background: rgba(255, 255, 255, 1);
		border-radius: 18rpx;
		padding: 20rpx 10px;
		box-shadow: 0 10rpx 28rpx rgba(0, 0, 0, 0.06);
	}

	.list-wrap {
		padding: 18rpx 24rpx 40rpx;
	}

	.loadmore {
		padding: 18rpx 0 6rpx;
	}
</style>