<template>
	<view class="content-store">
		<view class="input-search">
			<u-search placeholder="请输入店铺名称/电话号码" class="search" :show-action="false" input-align="center" v-model="queryWord" @input="getRow(1)"></u-search>
		</view>
		<scroll-view scroll-y class="list" @scrolltolower="onreachBottom">
			<view class="list-item flex align_center" v-for="item in list" :key="item.id" @click="addStore(item.id)">
				<u-image :src="item.reverseReceiveAddress &&item.reverseReceiveAddress.headerImageList?item.reverseReceiveAddress.headerImageList[0]:'/static/home_shop.png'" width="160" height="160"></u-image>
				<view class="item-right flex_1 flex justify_between align_center"> 
					<view class="right-item flex flex_column">
						<view >{{item.name || '--'}}</view>
						<view>{{item.mobile || '--'}}</view>
						<view>{{item.address || '--'}}</view>
					</view>
					<u-icon name="arrow-right" color="#9DA8B5" font-size="30"></u-icon>
				</view>
			</view>
			<view class="nodata flex justify_center align_center" v-if="list.length==0 && status!='loading'">
				<u-empty src="/static/def_result.png" :text="noDataText" icon-size="260" ></u-empty>
			</view>
			<view v-if="index==current" style="padding: 20upx;">
				<u-loadmore v-if="total>pageSize || status=='loading'" :status="status" />
			</view>
		</scroll-view>
		<view class="footer" @click="addStore()">
			<view class="add-btn flex justify_center align_center">新增店铺</view>
		</view>
	</view>
</template>

<script>
	import { shopList } from '@/api/shop.js'
	export default {
		data() {
			return {
				list: [], // 列表数据
				pageNo: 1,  //  当前页码
				pageSize: 20,  //  每页条数
				total: 0,  //  数据总条数
				noDataText: '暂无数据',  //  列表请求状态提示语
				status: 'loadmore',  //  加载中状态
				queryWord:''
			}
		},
		onLoad() {
			this.pageInit()
			// 开启分享
			uni.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			})
		},
		onShow() {
			this.getRow(1)
		},
		methods: {
			pageInit() {
				this.pageNo = 1
				this.pageSize = 20
				this.total = 0
				this.list = []
				this.getRow(1)
			},
			// 打电话
			callPhone(phone) {
				uni.makePhoneCall({
				    phoneNumber: phone
				});
			},
			// 进入详情
			intoDetail(item) {
				uni.navigateTo({
					url: '/pages/order/hisOrderDetail?orderNo='+item.orderReserveNo
				})
			},
			// scroll-view到底部加载更多
			onreachBottom() {
				this.action = 'onreachBottom'
					if (this.list.length < this.total) {
						this.pageNo += 1
						this.getRow()
					} else {
						if(this.list.length) {
							uni.showToast({
								title: '已经到底了',
								icon: 'none'
							});
						}
						this.status = "nomore"
					}
				
			},
			getArea(obj,state) {
			var index=obj.lastIndexOf("\市");
			if(state==0){
			obj=obj.substring(0,index);
			}else {
			obj=obj.substring(index+1,obj.length);
			}
			return obj;
			},
			// 查询列表
			getRow(pageNo) {
				this.status = "loadmore"
				if (pageNo) {
					this.pageNo = pageNo
				}
				let params = {
					pageNo: this.pageNo,
					pageSize: this.pageSize,
					queryWord:this.queryWord
				}
				this.noDataText = '暂无数据'
				this.status = "loading"
				shopList(params).then(res => {
					if (res.status == 200) {
						res.data.list.map(item=>{
							if(item.reverseReceiveAddress){
								if(item.reverseReceiveAddress.receiveAreasName){
									item.cityAddress=this.getArea(item.reverseReceiveAddress.receiveAreasName,1)
								}
							}
							console.log(item.cityAddress,'-----------item.cityAddress=============')
							item.address=item.reverseReceiveAddress ? ((item.reverseReceiveAddress.receiveAddress? item.reverseReceiveAddress.receiveAddress:'')+(item.cityAddress? '('+item.cityAddress+')':'')) : ''
						})
						if (this.pageNo > 1) {
							this.list = this.list.concat(res.data.list || [])
						} else {
							this.list = res.data.list || []
						}
						this.total = res.data.count || 0
					} else {
						this.list = []
						this.total = 0
						this.noDataText = res.message
					}
					this.status = "loadmore"
				})
			},
			// 新增店铺
			addStore(id){
				const storeId=id ? id : ''
				uni.navigateTo({
					url:`/pages/store/addStore?id=${storeId}`
				})
			}
		}
	}
</script>

<style lang="less">
	.content-store{
		width: 100%;
		height: 100vh;
		background: #F5F5F5;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		.input-search{
			width: 100%;
			height: 86upx;
			background-color: #fff;
			border-bottom: 1px solid #e5e5e5;
			// position: fixed;
			// top:0;
			// left:0;
			padding:14upx 32upx ;
			.search{
				width: 100%;
				border-radius: 18px;
			}
		}
		.list{
			flex: 1;
			overflow-y: scroll;
			.list-item{
				padding: 32upx;
				background-color: #fff;
				.item-right{
					margin-left:16upx;
					border-bottom: 1px solid #e5e5e5;
					.right-item{
						min-height: 160upx;
						view{
							min-height: 53upx;
						}
					}
				}
			}
			.nodata{
				padding-top: 30vh;
			}
		}
		.footer{
			width: 100%;
			padding: 14upx 32upx 32upx;
			background-color: #fff;
			color: #fff;
			font-weight: 500;
			.add-btn{
				height: 84upx;
				background: #1995FF;
				opacity: 1;
				border-radius: 16upx;
			}
		}
	}
	
</style>
