index_win.html 11.3 KB

原文件审查历史永久链接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title></title>
    <script src="../../assets/js/fontsize.js"></script>
    <link rel="stylesheet" href="../../assets/css/weui.min.css">
    <link rel="stylesheet" href="../../assets/css/api.css"/>
    <!--<link rel="stylesheet" href="http://at.alicdn.com/t/font_641470_jg64l6ijsg4lsor.css">-->
    <link rel="stylesheet" href="../../assets/css/my_f.css"/>
    <link rel="stylesheet" href="../../assets/css/index.css">
    <link rel="stylesheet" href="../../assets/icon/iconfont.css">
    <style>
        header {
            width: 100%;
            height: auto;
            font-size: 20px;
            /*background-color: #dbb25f;*/
        }

        .headers {
            background-color: #dbb25f;
        }

        .app_name {
            padding-right: 0.8rem;
            font-family: "fzjt";
            font-size: 20px;
        }

        .triangle_border_up span {
            display: block;
            width: 0;
            height: 0;
            border-width: 0 5px 5px;
            border-style: solid;
            border-color: transparent transparent #fff; /*透明 透明  黄*/
            position: absolute;
            bottom: 0;
            right: 0.55rem;
        }

        .mold_index {
            position: absolute;
        }

        #container {
            width: 0;
            height: 0;
        }

        .index1 .icon-fenxiang-tianchong {
            color: #d8b25f;
        }

        .my_top {
            overflow: hidden;
        }

        .dot {
            position: absolute;
            height: 10px;
            width: 10px;
            background-color: #EE6449;
            border-radius: 50%;
            right: 0.44rem;
            top: 0.37rem;
            z-index: 100000;
        }

        .my_top_icon_box {
            background-color: #ddbb72;
            padding:0.2rem 0.5rem 0.2rem 0;
        }

    </style>
</head>
<body>
<div id="app" v-cloak>
    <div id="container"></div>
    <header :class="index===0?'headers':''">
        <div class="index_header" v-if="index==0">
            <div class="index_left" >
                <div class="index_left_img">
                    <div class="iconfont icon-dizhi"></div>
                </div>
                <span @click.stop="goToCity">{{cityname?cityname:'定位中...'}}</span>
            </div>
            <span class="app_name">慈界医养</span>
            <div class="index_right" @click="show_menu">
                <img src="../../assets/image/plus.png" alt="" :class="[img_active?'img_transform':'img_transform1']">
            </div>
        </div>
        <div class="index1" v-else-if="index==1">
            <div class="index1_item index_on">
                <!--<div class="index1_item index_on">-->
                <div></div>
                <div class="iconfont icon-fenxiang-tianchong"></div>
            </div>
        </div>
        <div class="my_top_icon_box" v-else>
            <span class="iconfont icon-xiaoxi" @click="my_news"></span>
            <span class="dot" v-show="newList.length!=0"></span>
        </div>
        <div class="triangle_border_up" v-show="img_active">
            <span></span>
        </div>
    </header>
    <footer>
        <div class="footer_item" :class="{footer_item_active:index==0}" @click="changeTab(0)">
            <i class="iconfont icon-yuanjiaojuxingkaobei"></i>
            <span>严选</span>
        </div>
        <div class="footer_item" :class="{footer_item_active:index==1}" @click="changeTab(1)">
            <i class="iconfont icon-xingzhuang"></i>
            <span>投资</span>
        </div>
        <div class="footer_item" :class="{footer_item_active:index==2}" @click="changeTab(2)">
            <i class="iconfont icon-wo"></i>
            <span>我的</span>
        </div>
        <div class="mold_index" v-show="img_active" @click="hideMenu"></div>
    </footer>
</div>
</body>
</html>
<script>
    window.onLoad = function () {
        var map = new AMap.Map('container');
    }
    var url = 'https://webapi.amap.com/maps?v=1.4.8&key=ef53760bd959a4df08b7d4587280e642&callback=onLoad';
    var jsapi = document.createElement('script');
    jsapi.charset = 'utf-8';
    jsapi.src = url;
    document.head.appendChild(jsapi);
</script>
<script type="text/javascript" src="../../assets/js/api.js"></script>
<script type="text/javascript" src="../../assets/js/weui.min.js"></script>
<script type="text/javascript" src="../../assets/js/public.js"></script>
<script type="text/javascript" src="../../assets/js/fastclick.js"></script>
<script>
    new FastClick(document.body);
</script>
<script type="text/javascript" src="../../assets/js/vue.min.js"></script>
<script type="text/javascript" src="../../assets/icon/iconfont.js"></script>
<script type="text/javascript" src="../../assets/js/axios.min.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            index: 0,
            headerH: '',
            footerH: '',
            getlng: '',
            getlat: '',
            cityindex: '',
            cityname: '',
            img_active: false,
            map: {},
            newList: []
        },
        created: function () {
            apiready = function () {
                api.addEventListener({
                    name: 'city'
                }, function (ret, err) {
                    app.cityname = ret.value.city;
                });
                app.headerH = $api.offset($api.dom('header')).h;
                app.footerH = $api.offset($api.dom('footer')).h;
                api.openFrameGroup({
                    name: 'index_fm',
                    scrollEnabled: false,
                    index: app.index,
                    preload: 0,
                    reload: true,
                    rect: {
                        x: 0,
                        y: app.headerH,
                        w: 'auto',
                        h: api.winHeight - app.headerH - app.footerH
                    },
                    frames: [
                        {
                            name: 'index_f',
                            url: '../index/index_f.html',
                            bounces: false,
                        },
                        {
                            name: 'strict_f',
                            url: '../strict/strict_f.html',
                            bounces: false
                        },
                        {
                            name: 'my_f',
                            url: '../my/my_f.html',
                            bounces: false
                        }
                    ],

                });
                api.addEventListener({
                    name: 'index0'
                }, function (ret, err) {
                    api.setFrameGroupIndex({
                        name: 'index_fm',
                        index: ret.value.index
                    })
                });

                api.addEventListener({
                    name: 'index1'
                }, function (ret, err) {
                    api.setFrameGroupIndex({
                        name: 'index_fm',
                        index: ret.value.index
                    })
                });
                api.addEventListener({
                    name: 'hide_menu'
                }, function (ret, err) {
                    app.img_active = ret.value.img_active;
                });
                app.get_city();
                app.getNews();
            }
        },
        methods: {
            // 我的消息
            my_news: function () {
                openView('my_news', 'my/my_news', '消息通知', 'my_news', false, {new_type: 0})
            },
            // 有无消息判断
            getNews: function () {
                var header = {
                    "XX-Device-Type": getDevice(),
                    'XX-Token': getToken()
                };
                getRequest('post', 'user/index/getUserMessageList', null, header).then(function (res) {
                    if (res.data.code == 1) {
                        app.newList = res.data.data.unread;
                    } else {
                        toastMsg(res.data.msg)
                    }
                    loadEnd();
                })
            },
            // 定位当前城市
            get_city: function () {
                app.map = new AMap.Map('container', {});
                app.map.plugin('AMap.Geolocation', function () {
                    var geolocation = new AMap.Geolocation({
                        // 是否使用高精度定位，默认：true
                        enableHighAccuracy: true,
                        // 设置定位超时时间，默认：无穷大
                        timeout: 10000,
                    });
                    geolocation.getCurrentPosition();
                    AMap.event.addListener(geolocation, 'complete', onComplete)
                    AMap.event.addListener(geolocation, 'error', onError)

                    function onComplete(data) {
                        // console.log(JSON.stringify(data))
                        app.cityname = data.addressComponent.province
                        // data是具体的定位信息
                    }

                    function onError(erro) {
                        // 定位出错
                        toastMsg('请开启定位功能')
                    }
                })
            },
            // 切换底部导航
            changeTab: function (res) {

                setTimeout(function () {
                    app.index = res;
                    api.setFrameGroupIndex({
                        name: 'index_fm',
                        index: res
                    })
                }, 300);
                app.img_active = false;
                api.sendEvent({
                    name: 'show_menu',
                    extra: {
                        img_active: app.img_active
                    }
                });
            },
            // 切换当前城市
            goToCity: function () {
                if (app.cityname == '') {
                    toastMsg('定位中')
                } else {
                    api.openWin({
                        name: 'city_win',
                        url: '../index/city_win.html',
                        pageParam: {
                            cityname: app.cityname
                        }
                    });
                }
            },
            // 显示快捷菜单
            show_menu: function () {
                if (app.img_active == false) {
                    app.img_active = true
                } else {
                    app.img_active = false
                }
                api.sendEvent({
                    name: 'show_menu',
                    extra: {
                        img_active: app.img_active
                    }
                });
            },
            // 隐藏快捷菜单
            hideMenu: function () {
                app.img_active = !app.img_active;
                api.sendEvent({
                    name: 'show_menu',
                    extra: {
                        img_active: app.img_active
                    }
                });
            },

        }
    })
</script>