<template>
	<view class="page">
		<view class="bg">
			<image src="/static/bg.jpg"></image>
		</view>
		<view class="back" @click="home"><image src="../../static/left.png"></image></view>
		<pyh-nv ref="nv" :config="nvConfig"></pyh-nv>
		<view class="listBox" :style="{'padding-top':(pageTop+'px')}">
			<view class="content">
			 <view class="search-index">
			 	<view class="search">
			 		<view class="iconfont"><image src="../../static/search.png"></image></view>
					<text class="shu">|</text>
			 		<input type="text" placeholder="请输入关键词" v-model="from.name"/>
					<text style="width: 100rpx;text-align: center;" @click="searchjg">搜索</text>
			 	</view>
			 </view>
			 <view class="toptitle">公益</view>
			<view class="article-list">
				<view class="list" style="margin-bottom: 20rpx;" @click="institutiondetail(item)" v-for="item in gylist">
					<view class="item">
						<view class="title">
							<text>{{item.name}}</text>
						</view>
						<view class="like">
							<image src="../../static/institution1.png"></image>
							<text>{{item.address}}</text>
						</view>
						<view class="like">
							<image src="../../static/institution2.png"></image>
							<text>{{item.operatingHours}}</text>
						</view>
					</view>
					<view class="thumb">
						<image :src="Baseapi + item.image[0]" mode=""></image>
					</view>
				</view>
			</view>
			<view class="toptitle">经营</view>
			<view class="article-list">
				<view class="list" style="margin-bottom: 20rpx;" @click="institutiondetail(item)" v-for="item in jylist">
					<view class="item">
						<view class="title">
							<text>{{item.name}}</text>
						</view>
						<view class="like">
							<image src="../../static/institution1.png"></image>
							<text>{{item.address}}</text>
						</view>
						<view class="like">
							<image src="../../static/institution2.png"></image>
							<text>{{item.operatingHours}}</text>
						</view>
					</view>
					<view class="thumb">
						<image :src="Baseapi + item.image[0]" mode=""></image>
					</view>
				</view>
			</view>
			
		</view>
		</view>
		<!-- tabbar -->
		<TabBar :tabBarShow="1"></TabBar>
	</view>
</template>

<script>
	import TabBar from '../../components/TabBar/TabBar.vue';
	export default {
		components: {
			TabBar
		},
		data() {
			return {
				nvConfig:{
					title:"殡葬公共服务",
					bgColor:"#ffffff",
					color:"#000000",
					fixedAssist:{
						hide:true,
					},
					transparent:{
						initColor:"#000",
					},
					back:{
						hide:true
					},
				},
				
				gylist:[],
				jylist:[],
				
				from:{
					pageNum:1,
					pageSize:10,
					name:null
				}
			}
		},
		onPageScroll(e) {this.$refs.nv.pageScroll(e)},
		computed:{
			pageTop(){return parseInt(88*uni.getSystemInfoSync().windowWidth/750) + uni.getSystemInfoSync().statusBarHeight}
		},
		onLoad() {
			uni.hideTabBar();
			this.getlist();
		},
		methods: {
			getlist(){
				this.API.getjg().then(res=>{
					console.log("机构列表",res);
					this.gylist = []
					this.jylist = []
					for(let i = 0;i < res.rows.length;i++){
						if(res.rows[i].type == "公益"){
							res.rows[i].image = res.rows[i].image.split(',')
							this.gylist.push(res.rows[i])
						}else{
							res.rows[i].image = res.rows[i].image.split(',')
							this.jylist.push(res.rows[i])
						}
					}
					console.log("this.gylist",this.gylist);
					
				})
			},
			// 搜索
			searchjg(){
				this.API.searchjg(this.from).then(res=>{
					console.log("查询",res);
					this.gylist = []
					this.jylist = []
					for(let i = 0;i < res.rows.length;i++){
						if(res.rows[i].type == "公益"){
							res.rows[i].image = res.rows[i].image.split(',')
							this.gylist.push(res.rows[i])
						}else{
							res.rows[i].image = res.rows[i].image.split(',')
							this.jylist.push(res.rows[i])
						}
					}
				})
			},
			home() {
				uni.navigateTo({
					url: '/pages/home/home'
				})
			},
			institutiondetail(item) {
				var info = JSON.stringify(item)
				uni.navigateTo({
					url: '/pages/institutiondetail/institutiondetail?info=' + info
				})
			},
		}
	};
</script>

<style scoped lang="scss">
	@import 'institution.scss';
</style>
