<template>
	<view>
		<view style="padding: 22rpx 30rpx;">
			<view v-for="(item,index) in demandList" :key="index" >
				<comDemandList :rowData="item" :isInclude="true" @delete="handleDelete"></comDemandList>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	import {
		listClientDemandGET,
		delDemandByIds
	} from '@/api/workbench/index.js';
		import comDemandList from '@/components/custom/demand.vue'
	export default {
		components:{
			comDemandList
		},
		data() {
			return {
				queryParams: {
					pageNum: 1,
					pageSize: 10,
				},
				demandList: [], //需求列表
				total: 0
			}
		},
		onLoad() {
			console.log(this.userInfo.userId)
			this.$set(this.queryParams,'userId',this.userInfo.userId)
			this.getDemandList()
		},
		computed: {
			...mapGetters(['userInfo'])
		},
		onReachBottom() {
			if (this.queryParams.pageNum * this.queryParams.pageSize >= this.total) return
			this.queryParams.pageNum++
			this.getDemandList()
		},
		methods: {
			// 获取需求列表
			async getDemandList() {
				const res = await listClientDemandGET(this.queryParams)
				this.demandList = [...this.demandList,...res.rows]
				this.total = res.total
			},
			
			handleDelete(demandId){
				uni.showModal({
					title: '提示',
					content: '您确定要删除动态吗?',
					success: async res => {
						if (res.confirm) {
							const res = await delDemandByIds(demandId)
							uni.showToast({
								title:'删除成功!',
								icon:'none'
							})
							this.reset()
						} else if (res.cancel) {
							console.log('取消');
						}
					}
				});
			},
			reset(){
				this.queryParams.pageNum = 1
				this.demandList = []
				this.getDemandList()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 26rpx 30rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		margin-bottom: 20rpx;

		.title {
			font-size: 30rpx;
			color: #303949;
			font-weight: bold;
		}

		.avatar {
			width: 48rpx;
			height: 48rpx;
			background: #F83D3D;
			border-radius: 50%;
		}

		.name {
			font-size: 26rpx;
			color: #303949;
			font-weight: bold;
			margin: 0 8rpx;
		}

		.area,
		.address {
			font-size: 24rpx;
			color: #666666;
		}

		span {
			color: #333333;
			font-weight: bold;
		}

		.operate {
			padding-top: 10rpx;
			border-top: 1px solid #ECECEC;

			&-budget {
				font-size: 24rpx;
				color: #666666;
			}

			&-price {
				font-size: 30rpx;
				color: #1572FF;
				font-weight: bold;
				margin-left: 8rpx;
			}

			&-delete {
				font-size: 24rpx;
				color: #FF3141;
			}
		}
	}
</style>