zhengwei
/
buying


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441
							<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="${base}/static/mobile/frame/mui/css/mui.css?v=${version}">
    <link rel="stylesheet" href="${base}/static/mobile/frame/mui/css/iconfont.css?v=${version}">
    <link rel="stylesheet" href="${base}/static/mobile/css/style.css?v=${version}">
    <script type="text/javascript">
        var base = '${base}';
        var imgUrl = "${imgUrl}";
        var mapData = ${data.map};
    </script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
    <script src="${base}/static/web/frame/jquery/jquery-1.10.2.min.js"></script>
    <script src="${base}/static/mobile/frame/mui/js/rem.js"></script>
    <script src="${base}/static/mobile/frame/layer-mobile/layer.js"></script>
    <script src="${base}/static/mobile/frame/mui/js/mui.min.js"></script>
    <script src="${base}/mobile/common/common.js?v=${version}"></script>
    <link rel="stylesheet" href="${base}/static/mobile/frame/mui/css/mui.indexedlist.css?v=${version}">
    <script src="${base}/yiqing/getList?v=${version}"></script>
    <script src="${base}/static/web/frame/echarts/echarts.min.js"></script>
    <script type="text/javascript" src="https://www.echartsjs.com/examples/vendors/echarts/map/js/china.js?_v_=1578305236132"></script>
    <title>上饶市新型肺炎疫情信息</title>
    <script>
        share = {
            "title": "上饶市新型肺炎疫情信息",
            "link": "http://www.3water.cn/buying/yiqing",
            "imgUrl": "http://www.3water.cn/buying/static/mobile/image/yiqing.jpg",
            "desc": "@所有上饶人！这里有你最想知道的疫情信息"
        };
    </script>
    <style>
        .num {
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: .3rem;
            position: relative;
            z-index: 2;
            background: #ffffff;
        }

        .num .icbar:first-child:first-child {
            border-radius: .2rem 0 0 .2rem;
        }

        .num .icbar:first-child, .num .icbar:first-child .text {
            border-radius: 0 0 0 .2rem;
        }

        .icbar.confirm {
            background-color: #FDF1F1;
        }

        .num .icbar {
            width: 25%;
            margin-right: 2px;
            position: relative;
            text-align: center;
        }

        .num.showAdd .add {
            display: block;
        }

        .num .add {
            padding-top: .1rem;
            color: #7C7C7C;
            font-size: .2rem;
            font-weight: 500;
            display: none;
        }

        .num .icbar.confirm .number, .num .icbar.confirm .add span {
            color: #F55253;
        }

        .num .icbar.confirm .number, .num .icbar.confirm .add span {
            color: #F55253;
        }

        .num .icbar .number {
            font-size: .36rem;
            font-weight: 600;
            margin: .1rem 0rem .2rem 0;
        }

        .num .icbar:first-child, .num .icbar:first-child .text {
            border-radius: 0 0 0 .2rem;
        }

        .num .icbar .text {
            font-size: .24rem;
            height: .5rem;
            line-height: .5rem;
            color: #222;
            font-weight: 500;
        }

        .icbar.confirm .text {
            background-color: #FFE0E0;
        }

        .icbar.suspect {
            background-color: #FFF7ED;
            position: relative;
        }

        .icbar.suspect .text {
            background-color: #FFEED9;
        }

        .num .icbar.suspect .number, .num .icbar.suspect .add span {
            color: #FF961E;
        }

        .icbar.cure {
            background-color: #F1F8F4;
        }

        .num .icbar.cure .number, .num .icbar.cure .add span {
            color: #178B50;
        }

        .icbar.cure .text {
            background-color: #DFEEE6;
        }

        .num .icbar:last-child:last-child {
            border-radius: 0 .2rem .2rem 0;
        }

        .num .icbar:last-child, .num .icbar:last-child .text {
            border-radius: 0 0 .2rem 0;
        }

        .num .icbar:last-child {
            margin-right: 0;
        }

        .icbar.dead {
            background-color: #F8F8F8;
        }

        .num .icbar:last-child, .num .icbar:last-child .text {
            border-radius: 0 0 .2rem 0;
        }

        .icbar.dead .text {
            background-color: #EEEEEE;
        }

        .map {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            height: .68rem;
            margin-top: .2rem;
            padding: 0 .16rem;
            font-weight: 500;
            line-height: .68rem;
            background: #fff;
            color: #333;
            border-bottom: .01rem solid #ebebeb;
        }

        .map i {
            display: inline-block;
            width: .04rem;
            height: .28rem;
            margin-right: .08rem;
            vertical-align: middle;
            background: #4169e2;
        }
        .placeItem.nav {
            background-color: #fff;
            font-size: .24rem;
        }
        .placeItem {
            height: .84rem;
            line-height: .84rem;
            font-size: .28rem;
            color: #222;
            text-align: center;
            padding: 0 .3rem;
            background-color: #f8f8f8;
            position: relative;
        }
        .placeItem .blue {
            color: #005dff;
        }
        .placeItem  div:first-child {
            width: 1.67rem;
            height: 100%;
            float: left;
            text-align: left;
            font-weight: 400;
            overflow: hidden;
            font-size: .24rem;
        }
        .placeItem > div {
            width: 1.28rem;
            height: 100%;
            overflow: hidden;
            float: left;
        }
        .placeArea div:first-child {
            font-size: .3rem;
        }
        .placeCity {
            height: .68rem;
            line-height: .68rem;
            font-size: .26rem;
            color: #737373;
            background-color: rgba(248, 248, 248, 0.3);
        }
        .placeItem .add {
            color: #005dff;
            font-weight: 400;
        }
        .header{
            bottom: 0;
        }
        #map{
            background-color: #ffffff!important;
        }
        .pt10{
            padding-top: .2rem;
        }
        .nearby{
            width: 100%;
            display: inline-block;
            background-color: #EEF4FF;
            padding: .2rem 0;
            border-radius: .1rem;
            color: #333;
            text-align: center;
            font-size: .28rem;
        }
        body {
            -webkit-text-size-adjust: none !important;
        }
        body {
            -webkit-text-size-adjust: 100% !important;
        }
    </style>
</head>

<body>
<div class="header">
    <div class="mui-table-view no-bg no-line"
         style="background-color: rgba(0, 0, 0, 0.5);height: 1rem;">
        <div class="mui-table-view-cell mui-media"
             style="padding: 0.1rem 0.2rem;">
            <img class="mui-media-object mui-pull-left wechat_logo" src="${base}/static/mobile/image/ishangrao.jpg">
            <div class="mui-media-body" style="line-height: 0.4rem">
                <span class="fs14 color0 wechat_name">i上饶<span class="fs12 color3">&#12288;技术支持:yikao0929(微信)</span></span>
                <p class="mui-ellipsis fs12 color0 wechat_summary">点击关注，查询上饶最新疫情信息</p>
            </div>
            <div class="mui-btn mui-btn-primary guanzhu"
                 style="padding: 0.06rem 0.26rem; right: 0.86rem;">关注
            </div>
            <i class="mui-icon iconfont icon-cha"></i>
        </div>
    </div>
</div>
<div class="mui-content" style="margin-bottom: 1rem;">
    <img src="${base}/static/mobile/image/yq_bg.jpg" style="width: 100%;display: block">
    <div class="color2 fs13 pt10 bgcolor1 pl15">数据更新于2020-03-02</div>
    <div class="num showAdd">
        <div class="icbar confirm">
            <div class="add">较上日<span>+0</span></div>
            <div class="number">123</div>
            <div class="text">全市确诊</div>
        </div>
        <div class="icbar suspect">
            <div class="add">较上日<span>+0</span></div>
            <div class="number">1</div>
            <div class="text"><span>重症人数</span></div>
        </div>
        <div class="icbar cure">
            <div class="add">较上日<span>+5</span></div>
            <div class="number">116</div>
            <div class="text">治愈人数</div>
        </div>
        <div class="icbar dead">
            <div class="add">较上日<span>+0</span></div>
            <div class="number">0</div>
            <div class="text">死亡人数</div>
        </div>
    </div>
    <div class="bgcolor1" style="padding: 0rem .3rem .3rem .3rem">
        <a href="http://www.3water.cn/buying/mobile/yiqing.jsp" class="nearby"><i class="mui-icon iconfont icon-wodeweizhi fs18"></i>附近疫情查询</a>
    </div>

    <div class="map"><i></i>疫情地图<span class="mapTapTip"></span></div>
    <div id="map" style="width: 100%;height: 300px;background-color: #ffffff"></div>
    <div class="clearfix placeItem nav" id="placeNav">
        <div class="blue">地区</div>
        <div class="blue">新增确诊</div>
        <div>累计确诊</div>
        <div>治愈</div>
        <div>死亡</div>
    </div>
    <div id="area" class="bgcolor1">
        <c:forEach items="${data.list}" var="item" varStatus="status">
            <c:if test="${status.index==0}">
            <div class="clearfix placeItem placeArea">
                <div class="blue">${item.county_name}</div>
                <%--<c:if test="${item.num1==0}">--%>
                    <%--<div class="add">待更新</div>--%>
                <%--</c:if>--%>
                <%--<c:if test="${item.num1!=0}">--%>
                    <%--<div class="add">${item.num1}</div>--%>
                <%--</c:if>--%>
                <div class="add">${item.num1}</div>
                <div>${item.num2}</div>
                <div>${item.num3}</div>
                <div>${item.num4}</div>
            </div>
            </c:if>
            <c:if test="${status.index!=0}">
            <div class="clearfix placeItem placeCity">
                <div>${item.county_name}</div>
                <%--<c:if test="${item.num1==0}">--%>
                    <%--<div class="add">待更新</div>--%>
                <%--</c:if>--%>
                <%--<c:if test="${item.num1!=0}">--%>
                    <%--<div class="add">${item.num1}</div>--%>
                <%--</c:if>--%>
                <div class="add">${item.num1}</div>
                <div>${item.num2}</div>
                <div>${item.num3}</div>
                <div>${item.num4}</div>
            </div>
            </c:if>
        </c:forEach>
    </div>
    <div class="pd15 bgcolor1 bold">坚定信心，坚决打赢疫情防控阻击战，上饶加油！</div>
</div>
</body>
<script>
    (function() {
        if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
            handleFontSize();
        } else {
            if (document.addEventListener) {
                document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
            } else if (document.attachEvent) {
                //IE浏览器，非W3C规范
                document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
            }
        }
        function handleFontSize() {
            // 设置网页字体为默认大小
            WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
            // 重写设置网页字体大小的事件
            WeixinJSBridge.on('menu:setfont', function() {
                WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
            });
        }
    })();
    mui.init();
    mui.ready(function () {
        initChart();
        $(".header").on("tap",".guanzhu",function(e){
            var html=[];
            html.push('<img src="'+base+'/static/mobile/image/qrcode.jpg" style="width:100%"><div>长按识别二维码</div>');
            mui.alert(html.join(""), '关注“<span class="main-color">i上饶</span>”');
        });
        $(".header").on("tap",".icon-cha",function(e){
            $(".header .mui-table-view").hide();
            $(".mui-content").css("margin-bottom","0");
        });
    });
    function initChart() {
        var myChart = echarts.init(document.getElementById('map'));
        $.get(base+'/static/web/frame/echarts/map/shangrao.json', function (geoJson) {
            myChart.hideLoading();
            echarts.registerMap('上饶市', geoJson);
            myChart.setOption(option = {
                tooltip: {
                    trigger: 'item',
                    formatter: '{b}{c}例'
                },
                visualMap: {
                    show:true,
                    type: 'piecewise',
                    min: 0,
                    max: 50,
                    pieces: [                           //自定义『分段式视觉映射组件（visualMapPiecewise）』的每一段的范围，以及每一段的文字，以及每一段的特别的样式
                        {min: 30,color:'#C91014'},                     // 不指定 max，表示 max 为无限大（Infinity）。
                        {min: 10, max: 30,color:'#E64B47'},
                        {min: 5, max: 10,color:'#FE8664'},
                        {min: 3, max: 5,color:'#FFD2A0'},
                        {min: 1, max: 2,color:'#FFEFD7'},
                    ],
                    realtime: false,
                    calculable: true,
                },
                series: [
                    {
                        type: 'map',
                        mapType: '上饶市', // 自定义扩展图表类型
                        label: {
                            show: true
                        },
                        itemStyle: {
                            normal: {
                                label: {
                                    show: true,
                                    color: '#000000'
                                },
                                borderColor: '#00000',
                            },
                            emphasis: {
                                label: {
                                    show: true,
                                    color: '#00000'
                                },
                                areaColor: '#ffffff',
                            }
                        },
                        data: mapData
                    }
                ]
            });
        });
    }
</script>
</html>