<template>
	<view>
		<view class="flex content1">
			<view class=" search-wrap">
				<view class="search flex justify-space-between align-item-center flex-between" @click="search">
					<view class="left flex  align-item-center">
						<image class="dSLComVueTopLeftImg" style="width: 30rpx;height: 30rpx;flex: none;"
							src="@/static/image/card/search.png"></image>
						<view class="search-val"> {{searchVal?searchVal:'搜索店铺或服务 '}}</view>
					</view>
		
					<view class="right">
						<image style='width:32rpx;height:32rpx;' v-if="searchVal" @click.stop="delSearchVal"
							src="@/static/image/card/searchdel.png" mode="widthFix"></image>
					</view>
				</view>
			</view>
		</view>
		<mescroll-uni :up="upOption" :down="downOption" ref="mescrollRef" @init="mescrollInit" @up="upCallback"
			@down="downCallback" :top="108">
			<view class='findItem' v-for='item in findList'>
				<view style='align-items: flex-start;' class='flex'>
					<view class="left">
						<view class='cover'>
							<u--image radius='4' :showLoading="true" :src="item.coverImage" width="86px"
								height="86px" @click="click"></u--image>
						</view>
					</view>
					<view class="right">
						<view class='flex'>
							<view  class='flex'>
								<view class="main-body">
									{{item.mainBody=="商铺"?'商铺':'个人'}}
								</view>
								<view class='name'>{{item.shopNames}}</view>
							</view>
							<view>
								<!-- <view class='iconfont applet-androidgengduo'></view> -->
								</view>
						</view>
						<view class='description'>
							<mote-lines-divide :dt="item.serviceDescription" :line="3" expandText="展开"
								foldHint="收起" />
						</view>
					</view>
				</view>
				<view class='address flex justify-space-between'>
					<view class='flex'>
						<view class='iconfont applet-dizhi'></view>
						<view @click.stop="toShopDetail(item)">{{item.detailedAddress}}</view>
					</view>
					<view class='flex'>
						<view @click='edit(item)' class='default_button'>编辑</view>
						<view @click='del(item)' class='default_button'>删除</view>
					</view>
					
				</view>
			</view>
		</mescroll-uni>
	</view>
</template>

<script>
	var that
	import MoteLinesDivide from "@/components/text-over-flow/text-over-flow.vue"
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	export default {
		components: {
			MoteLinesDivide,
		},
		mixins: [MescrollMixin],
		data() {
			return {
				searchVal:'',
				findList:[],
				handleList:[],
				curPageLen:0,
				totalPage:0,
				currectData:{},
			}
		},
		onLoad() {
			that = this
		},
		onShow() {
			if (uni.getStorageSync("search_val")) {
				this.searchVal = uni.getStorageSync("search_val")
				this.mescroll.resetUpScroll()
			}
		},
		methods: {
			edit(item){
				uni.navigateTo({
					url: "/pageA/find/edit?id="+item.id
				})
			},
			del(item){
				that.currectData = item
				uni.showModal({
					title: '提示',
					content: '确定删除发布内容？',
					success (res) {
					    if (res.confirm) {
							that.$u.debounce(that.delSubmit, 500)
					    } else if (res.cancel) {
					      console.log('用户点击取消')
					    }
					  }
				})
			},
			delSubmit() {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				this.$request.baseRequest('admin.tourism.productManagement', 'delete', {
					id: this.currectData.id
				}, failres => {
					uni.showToast({
						icon: "none",
						title: failres.errmsg,
						duration: 3000
					});
			
					uni.hideLoading()
				}).then(res => {
					uni.showToast({
						icon: "success",
						title: '删除成功！',
						duration: 2000
					});
					that.mescroll.resetUpScroll()
			
				})
			},
			toShopDetail(val){
				console.log(val)
				uni.navigateTo({
					url: "/pageA/food/detailMap?val="+JSON.stringify(val)
				})
				
			},
			delSearchVal() {
				this.searchVal = ''
				uni.removeStorageSync("search_val")
				that.mescroll.resetUpScroll()
			},
			search() {
				// if (this.userInfo.phone) {
				uni.navigateTo({
					url: "/pageA/find/search"
				})
				// } else {
				// 	this.showAuthorizePhone = true
				// }
			},
			async upCallback(page) {
				// if (uni.getStorageSync("userInfo").id) {
				uni.showLoading({
					title: '数据加载中'
				})
			
				var finddata = await that.getfindList(page)
				if (page.num == 1) that.findList = [], that.handleList = [];
				that.curPageLen = finddata.data.items.length;
				that.handleList = finddata.data.items
				that.totalPage = finddata.data.total;
				if (that.handleList.length > 0) {
					that.findList = that.handleList
				}
				uni.hideLoading()
				that.$nextTick(() => {
					that.mescroll.endBySize(that.curPageLen, that.totalPage)
				});
			
				// }
			},
			getfindList(page) {
				return new Promise((resolve, reject) => {
					that.$request.baseRequest('admin.tourism.productManagement', 'list', {
						page: page.num,
						limit: page.size,
						searchKeyWord: this.searchVal,
						myFlag:1,
						compId:uni.getStorageSync("userInfo").id
						// classify: this.typeName
					}, failres => {
						uni.showToast({
							icon: "none",
							title: failres.errmsg,
							duration: 3000
						});
						
					}).then(res => {
						resolve(res)
					})
				})
			
			},
		}
	}
</script>

<style lang='scss' scoped>
	.content1 {
		position: fixed;
		top: 0;
		left: 0;
		padding: 20rpx;
		background-color: #fff;
		z-index: 99;
		width: 100vw;
	
		.search {
			// color: #9199af;
			// background: #f9d27d;
			border-radius: 50rpx;
			padding: 10rpx 0 10rpx 30rpx;
			box-sizing: border-box;
			margin-right: 20rpx;
		}
	
		.left {
			width: 80%;
	
			view {
				height: 40rpx;
				line-height: 40rpx;
				white-space: nowrap;
				overflow: scroll;
				position: relative;
				margin-left: 20rpx;
				color: #9199af;
			}
		}
	
		.right {
			// width:14%;
			margin-right: 20rpx
		}
	}
	
	.search-wrap {
		width: 100%;
		background: #f9f9f9;
		// border: 1px solid #f9d27d;
		border-radius: 50rpx;
	}
	.findItem {
		background: #fff;
		margin: 10rpx;
		border-radius: 20rpx;
		padding: 20rpx;
		font-size: 32rpx;
	
		.main-body {
			color: #E95700;
			background: #FDF2E5;
			font-size: 12px;
			padding: 6rpx 14rpx;
			box-sizing: border-box;
			border-radius: 10rpx;
			width:80rpx;
		}
	
		.left {
			margin-right: 20rpx;
	
			.cover {
				border-radius: 8rpx;
			}
		}
	
		.name {
			font-size: 30rpx;
			color: #333;
			margin-left: 10rpx;
			overflow-x: scroll;
			white-space: nowrap;
			width: 49vw;
			font-weight: 600;
			letter-spacing: 3rpx;
		}
	
		.description {
			color: #333;
			margin-top: 10rpx;
			width: 67vw;
			font-size: 28rpx;
		}
	
		.address {
			margin-top: 20rpx;
			width: 100%;
			font-size: 28rpx;
			color: #999;
		}
	}
	
	.applet-dianpu1 {
		font-size: 44rpx;
		color: #eaad1a;
	}
	
	.applet-dizhi {
		font-size: 38rpx;
		color: #393733;
	}
</style>
