miao/miaomiao/www/templates/home/index.html

<ion-view view-title="瞄喵">
    <ion-nav-buttons side="left">
        <button ng-if='step==0' style='color:#00C3DA' class="button button-clear"  ng-click="qrscan()">
            <i class="icon iconfont icon-tubiaozhizuomoban"></i>  
        </button>
        <button ng-if='step!=0' class="button button-clear"  ng-click="qrscan()">
            <i class="icon iconfont icon-tubiaozhizuomoban"></i>  
        </button>
        <button ng-if='step==1' style='color:#00C3DA' class="button button-clear" ng-click="toggleLeftSideMenu()">
            <i class="icon iconfont icon-shaixuan"></i>
        </button>
        <button ng-if='step!=1' class="button button-clear" ng-click="toggleLeftSideMenu()">
            <i class="icon iconfont icon-shaixuan"></i>
        </button>
    </ion-nav-buttons>
    <ion-nav-buttons side="right">
        <button ng-if='step==1' style='color:#00C3DA' class="button button-clear" ui-sref="app.home_search" style="margin-top:-3px">
            <i class="icon iconfont icon-sousuo"></i>
        </button>
        <button ng-if='step!=1' class="button button-clear" ui-sref="app.home_search" style="margin-top:-3px">
            <i class="icon iconfont icon-sousuo"></i>
        </button>
        <button class="button button-clear" style="height: 37px; margin-top: 2px;" ui-sref="app.message">
            <img ng-if="step==0" src="img/message.png" style="height: 10px; width: 60px;">
            <img ng-if="showMessage==1&&step!=0" src="img/icon_message_h.svg" style="height: 60%; width: 100%">
            <img ng-if="showMessage==0&&step!=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 ng-if="step==0" ng-click="changeStep()" ng-class="screenWidth" style="background: #252525; z-index: 999999;">
                    <img src="img/home1.png" style="width: 100%; height: 100%;" alt="">
                </div>
                <div ng-if="step==1" ng-click="changeStep()" ng-class="screenWidth" style="background: #252525; z-index: 999999;">
                    <img src="img/home2.png" style="width: 100%;" alt="">
                </div>
                <!-- 新手引导 结束 -->
                <div ng-if="step!=0&&step!=1">
                    <!--下拉刷新-->
                    <div class="tabs-striped tabs-top">
                        <div class="tabs" style="top: 0px">
                            <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-slide-box style="height: 150px" auto-play="true" slide-interval="2000"  does-continue="true">
                            <ion-slide ng-repeat="banner in index.banners">
                                <div class="box banner"><img ng-src="{{banner.value}}" style="width: 100%; " /></div>
                            </ion-slide>
                        </ion-slide-box>
                        <!-- end 轮播图-->
                        <div class="row" ng-if="index.users.length>0" style="background: #FAFAFA;height:80px;">
                            <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)">
                                <div style="position: relative; display: inline-block; width: 33%; text-align: center; height: 100%;" class="subcontent" ng-repeat="user in index.users">
                                    <span style="border-radius: 100%; position: absolute; right: 5%; width: 22px; height: 22px; line-height: 22px; border-radius: 100%; font-size: 13px; background-color: #EF4941;">新</span>
                                    <img ng-click="clickAvatar(user.id,user.dream_id)" ng-if="$index<4" ng-src="{{user.avatar |avator}}" class="chosenClass" style="width: 65%;" />
                                </div>
                            </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 class="age">{{item.user.birthday | getage}}岁</span></div>
                                            <div class="mysecond">{{item.user.city}}<span class="sign" ng-if="item.signs!=''" ng-repeat="sign in item.signs">{{sign}}</span></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 + item.add_care_number}}</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>
                </div>
            </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>
                            <input class="item" style="padding:0">
                            <p style="font-weight:bold;font-size:1.1rem">年龄</p>
                            <ion-checkbox type="checkbox" ng-repeat="age in ages" name="age" ng-value="age.value">{{age.age}}</ion-checkbox>
                        </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>
                    </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>