<ion-view view-title="瞄瞄">
    <ion-nav-buttons side="left">
        <button class="button button-clear" style="height: 30px; width: 30px;margin-top: 1.6px;margin-left: 2px;" ng-click="openPopover($event)">
            <img src="img/icon_menu.svg" style="height: 60%; width: 100%;">
        </button>
        <button class="button button-clear" style="height: 30px; width: 30px;font-size: 25px; margin-top: 0.5px" ng-click="toggleLeftSideMenu()">
            <img src="img/btn_filter.svg" style="height: 63%; width: 100%;">
        </button>
    </ion-nav-buttons>
    <ion-nav-buttons side="right">
        <button class="button button-clear" style="height: 30px; width: 30px; margin-top: 2px" ui-sref="app.home_search">
            <img src="img/icon_search.svg" style="height: 67%; width: 100%">
        </button>
        <button class="button button-clear" style="height: 37px; margin-top: 0.8px" ui-sref="app.message">
            <img ng-if="showMessage==1" src="img/icon_message_h.svg" style="height: 60%; width: 100%">
            <img ng-if="showMessage==0" src="img/icon_message_n.svg" style="height: 55%; width: 100%">
        </button>
    </ion-nav-buttons>
    <ion-side-menus>
        <ion-side-menu-content drag-content="false">
            <ion-content>
                    <!--下拉刷新-->
                    <ion-refresher pulling-text="下拉刷新" on-refresh="load(true)">
                    </ion-refresher>
                    <div class="tabs-striped tabs-top">
                        <div class="tabs" style="top:0">
                            <a ng-class="type=='hot'?'tab-item active':'tab-item'" ng-click="changetype('hot')">
                                热门
                            </a>
                            <a ng-class="type=='trend'?'tab-item active':'tab-item'" ng-click="changetype('trend')">
                                潮流
                            </a>
                            <a ng-class="type=='news'?'tab-item active':'tab-item'" ng-click="changetype('news')">
                                最新
                            </a>
                        </div>
                    </div>
                    <div class="icontent">
                        <ion-slides options="data.sliderOptions" slider="data.sliderDelegate">
                            <ion-slide-page ng-repeat="banner in index.banners">
                                <div class="box banner" style="height: 150px"><img ng-src="{{banner.value}}" style="width: 100%; height: 100%" /></div>
                            </ion-slide-page>
                        </ion-slides>
                        <div class="row" ng-if="index.users.length>0" style="background: #FAFAFA;height:80px;padding: 0 5px;">
                            <div class="col col-10" style="margin-top: 7%" ng-click="next(1)">
                                <i class="icon ion-ios-arrow-left" style="font-size: 1.5rem; color: #00C3DA; line-height: 100%"></i>
                            </div>
                            <div class="col" style="overflow: hidden;padding:0 5px;" on-drag-right="next(2)" on-drag-left="next(1)">
                                <span class="subcontent" ng-repeat="user in index.users">
                                    <img ng-click="clickAvatar(user.other_user.id)" ng-if="$index<4" ng-src="{{user.other_user.avatar |avator}}" ng-class="{'defaultClass':user.dream_number<1,'chosenClass':user.dream_number>0}" style="padding: 0.5%;" />
                                </span>
                            </div>
                            <div class="col col-10" style="margin-top: 7%; text-align: right" ng-click="next(2)">
                                <i class="icon ion-ios-arrow-right" style="font-size: 1.5rem; color: #00C3DA;"></i>
                            </div>
                        </div>
                        <div style="background:#E6E6E6;height:10px;">
                        </div>
                        <div class="list">
                            <div class="item mainitem" ng-repeat="item in index.dreams">
                                <div class="row">
                                    <div class="col avatarCol">
                                        <div class="fl" style="width: 27%">
                                            <img ng-src="{{item.user.avatar | avator}}" ng-click="toUserDetail(item.user.id)" />
                                        </div>
                                        <div class="myblock">
                                            <div>{{item.user.nickname}}<span>{{item.user.birthday | getage}}岁</span></div>
                                            <div class="mysecond">{{item.user.city}}</div>
                                        </div>
                                    </div>
                                    <div class="col" style="text-align:right">
                                        <div style="margin-top:4px">
                                            <img ng-src="img/icon_follow.svg" class="iheart">
                                            <span style="color: #F16571">{{item.care_num}}</span>
                                            <span>人关注</span>
                                        </div>
                                        <div class="mysecond">{{item.end_time | lastDate}}</div>
                                    </div>
                                </div>
                                <div ng-click="toDetail(item.id)">
                                    <img ng-src="{{item.img.pic}}" />
                                    <div class="homeDream">
                                        <p style="font-size: 16px">{{ item.name }}</p>
                                        <p>{{ item.about }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--上拉更多-->
                    <ion-infinite-scroll ng-if="filter.hasMore" on-infinite="load(false)" distance="10%"></ion-infinite-scroll>
            </ion-content>
        </ion-side-menu-content>
        <!-- Left menu -->
        <ion-side-menu side="left" width="200">
            <ion-header-bar class="expanded" menu-close>
                喵喵
            </ion-header-bar>
            <ion-content class="stable-bg has-expanded-header">
                <ion-list>
                    <ion-item>
                      <span style="font-weight:bold;font-size:1.1rem">性别</span>
<div class="list">
     <div class="item">
         <img ng-src="{{filter.sex==1?'img/icon_man_h.svg':'img/icon_man_n.svg'}}" ng-click="changeFilter('1')"  style="width:35%;" />
         <img ng-src="{{filter.sex==2?'img/icon_woman_h.svg':'img/icon_woman_n.svg'}}" ng-click="changeFilter('2')" style="width:35%;margin-left:15px"  />
   </div>
   <div class="item" style="padding:0">
       <p style="font-weight:bold;font-size:1.1rem">年龄</p>
       <div class="list radiodiv">
           <ion-radio ng-model="filter.age" ng-value="'1'">18-21</ion-radio>
           <ion-radio ng-model="filter.age" ng-value="'2'">22-25</ion-radio>
           <ion-radio ng-model="filter.age" ng-value="'3'">26-29</ion-radio>
           <ion-radio ng-model="filter.age" ng-value="'4'">30-33</ion-radio>
           <ion-radio ng-model="filter.age" ng-value="'5'">34-37</ion-radio>
           <ion-radio ng-model="filter.age" ng-value="'6'">>38</ion-radio>
       </div>
        
   </div>
  <label class="item item-select item-select-width">
    <span class="input-label">地区</span>
    <select name="city" ng-model="filter.city">
        <option value="" selected>所有</option>
        <option value="北京">北京</option>
        <option value="上海">上海</option>
        <option value="广州">广州</option>
        <option value="深圳">深圳</option>
        <option value="成都">成都</option>
        <option value="杭州">杭州</option>
        <option value="武汉">武汉</option>
        <option value="重庆">重庆</option>
        <option value="南京">南京</option>
        <option value="天津">天津</option>
        <option value="苏州">苏州</option>
        <option value="西安">西安</option>
        <option value="长沙">长沙</option>
        <option value="沈阳">沈阳</option>
        <option value="青岛">青岛</option>
        <option value="郑州">郑州</option>
        <option value="大连">大连</option>
        <option value="东莞">东莞</option>
        <option value="宁波">宁波</option>
    </select>
  </label>
    <div class="padding">
        <button class="button button-block button-calm" style="border-radius:25px" menu-close ng-click="doFilter()">
            确定
        </button>
    </div>
</div>
                    </ion-item>
                </ion-list>
            </ion-content>
        </ion-side-menu>
    </ion-side-menus>
    <script id="my-popover.html" type="text/ng-template">
        <ion-popover-view class="pview">
            <ion-content>
                <div class="list">
                    <a class="item item-icon-left" ng-click="qrscan()">
                        <i class="icon ion-qr-scanner"></i>
                        扫一扫
                    </a>
                    <a class="item item-icon-left" ui-sref="app.home_add">
                        <i class="icon ion-plus"></i>
                        创造梦想
                    </a>
                    <a class="item item-icon-left" ui-sref="app.my">
                        <i class="icon ion-android-person"></i>
                        个人中心
                    </a>
                    <a class="item item-icon-left" ui-sref="app.home_collect">
                        <i class="icon ion-ios-folder-outline"></i>
                        我的收藏
                    </a>
                </div>
            </ion-content>
        </ion-popover-view>
    </script>
</ion-view>