大屏提交1：首页、GIS、视频页面

czt

2 天以前 d24dd35d265a0b6bd0620285d226b5bed3d4566e

大屏提交1：首页、GIS、视频页面

 fzzy-igdss-core/src/main/java/com/fzzy/igds/constant/Constant.java

@@ -12,10 +12,25 @@
     */
    public static final String APP_NAME = "igdss";
    /**
     * ç”¨æˆ·ç±»åž‹
     */
    public static String USER_TYPE_10 = "10";  //监管用户
    public static String USER_TYPE_20 = "20";  //银行用户
    public static String USER_TYPE_30 = "30";  //库区用户

    /**
     * éƒ¨é—¨ç±»åž‹
     */
    public static String DEPT_TYPE_10 = "10";  //公司
    public static String DEPT_TYPE_20 = "20";  //库区

    /**
     * åŒºåˆ’类型
     */
    public static final String AREA_TYPE_1 = "1";  //省
    public static final String AREA_TYPE_2 = "2";  //市
    public static final String AREA_TYPE_3 = "3";  //区县

    //是，启用
    public static final String YN_Y = "Y";
    //否，禁用

 fzzy-igdss-core/src/main/java/com/fzzy/igds/domain/DicArea.java

@@ -4,11 +4,10 @@
import com.baomidou.mybatisplus.annotation.TableName;
import com.fzzy.igds.constant.Constant;
import lombok.Data;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.Id;
import javax.persistence.Table;

import javax.persistence.*;
import java.io.Serializable;
import java.util.List;

/**
 * @Description åŒºåˆ’码
@@ -56,4 +55,8 @@
    @Column(name = "remark", columnDefinition = "varchar(100) COMMENT '备注说明'")
    @TableField("remark")
    private String remark;

    @Transient
    @TableField(exist = false)
    private List<DicArea> children;
}

 fzzy-igdss-core/src/main/java/com/fzzy/igds/service/DicAreaService.java

@@ -40,13 +40,13 @@

        QueryWrapper<DicArea> queryWrapper = new QueryWrapper<>();
        if (StringUtils.isNotBlank(parentCode)) {
            queryWrapper.like("parent_code", parentCode);
            queryWrapper.eq("parent_code", parentCode);
        }
        if (StringUtils.isNotBlank(name)) {
            queryWrapper.like("name", name);
        }
        if (StringUtils.isNotBlank(code)) {
            queryWrapper.like("code", code);
            queryWrapper.eq("code", code);
        }
        return dicAreaMapper.selectList(queryWrapper);
    }

 fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/SysIndexController.java

@@ -55,8 +55,22 @@
        //获取登录人信息
        SysUser user = getSysUser();

        if(Constant.USER_TYPE_30.equals(user.getUserType())){
            //单库区主页
            return "redirect:index?deptId=" + user.getDeptId();
        }
        if(Constant.USER_TYPE_10.equals(user.getUserType()) || Constant.USER_TYPE_20.equals(user.getUserType())){
            //大屏页面
            return "redirect:group/index";
        }
        //单库区主页
        return "redirect:index?deptId=" + user.getDeptId();
    }

    @GetMapping("/home")
    public String home(ModelMap mmap) {
        mmap.put("version", FrameworkConfig.getVersion());
        return "main_v2";
    }

    // ç³»ç»Ÿé¦–页
@@ -82,7 +96,7 @@
        mmap.put("deptId", deptId);

        //后台默认页面
        String welcomeUrl = "/group/gis";
        String welcomeUrl = "/home";
        mmap.put("welcomeUrl", welcomeUrl);

        // æ ¹æ®ç”¨æˆ·id取出菜单

 fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/group/GIsController.java

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/group/GroupController.java

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,103 @@
package com.fzzy.sys.controller.group;

import com.fzzy.igds.constant.Constant;
import com.fzzy.igds.domain.Dept;
import com.fzzy.igds.domain.DicArea;
import com.fzzy.igds.utils.ContextUtil;
import com.fzzy.sys.manager.group.GroupManager;
import com.ruoyi.common.core.domain.entity.SysUser;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.annotation.Resource;
import java.util.List;

/**
 * @Description å¤§å±æŽ§åˆ¶å±‚
 * @Author CZT
 * @Date 2025/12/10 18:31
 */
@Controller
@RequestMapping("group")
public class GroupController {


    @Resource
    private GroupManager groupManager;

    private String prefix = "group";


    /**
     * æ€»è§ˆå¤§å±é¡µé¢
     * @return
     */
    @RequestMapping("/index")
    public String index(ModelMap view) {
        SysUser user = ContextUtil.getLoginUser();
        view.put(Constant.MODEL_KEY_LOGIN_USER, user);

        view.put("deptId", user.getDeptId());

        view.put("sysName", "智慧粮库质押监管大屏");


        //查询库区信息
        List<Dept> deptList = groupManager.getAllDept(user.getCompanyId());
        view.put("deptList", deptList);

        return prefix + "/index";
    }

    /**
     * æ€»è§ˆå¤§å±é¡µé¢
     * @return
     */
    @RequestMapping("/video")
    public String video(ModelMap view) {
        SysUser user = ContextUtil.getLoginUser();
        view.put(Constant.MODEL_KEY_LOGIN_USER, user);

        view.put("deptId", user.getDeptId());

        view.put("sysName", "智慧粮库质押监管大屏");


        //查询库区信息
        List<Dept> deptList = groupManager.getAllDept(user.getCompanyId());
        view.put("deptList", deptList);

        return prefix + "/video";
    }

    /**
     * æ€»è§ˆå¤§å±é¡µé¢
     * @return
     */
    @RequestMapping("/gis")
    public String gis(ModelMap view) {
        SysUser user = ContextUtil.getLoginUser();
        view.put(Constant.MODEL_KEY_LOGIN_USER, user);

        view.put("deptId", user.getDeptId());

        view.put("sysName", "智慧粮库质押监管大屏");

        view.put("defaultAreaCode", "650000");

        //获取新疆区划信息
        List<DicArea> areaList = groupManager.getAreaAndChild("650000");
        view.put("areaList", areaList);

        //获取新疆及下属市州
        List<DicArea> allArea = groupManager.getArea("650000");
        view.put("allArea", allArea);

        //获取所有库区
        List<Dept> deptList = groupManager.getAllDept(user.getCompanyId());
        view.put("deptList", deptList);

        return prefix + "/gis";
    }

}

 fzzy-igdss-web/src/main/java/com/fzzy/sys/manager/group/GroupManager.java

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,90 @@
package com.fzzy.sys.manager.group;

import com.fzzy.igds.constant.Constant;
import com.fzzy.igds.domain.Dept;
import com.fzzy.igds.domain.DicArea;
import com.fzzy.igds.service.CoreDeptService;
import com.fzzy.igds.service.DicAreaService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;

import javax.annotation.Resource;
import java.util.ArrayList;
import java.util.List;

/**
 * @Description
 * @Author CZT
 * @Date 2025/12/11 15:48
 */
@Slf4j
@Component
public class GroupManager {

    @Resource
    private DicAreaService dicAreaService;
    @Resource
    private CoreDeptService deptService;

    /**
     * èŽ·å–省及下属市州集合
     *
     * @param areaCode
     * @return
     */
    public List<DicArea> getArea(String areaCode) {

        DicArea area = dicAreaService.listDicAreaByCode(areaCode);
        if (null == area) {
            return null;
        }

        List<DicArea> list = new ArrayList<>();
        list.add(area);
        if (Constant.AREA_TYPE_1.equals(area.getType())) {
            List<DicArea> children = dicAreaService.listData(area.getCode(), null, null);
            if (null != children && children.size() > 0) {
                list.addAll(children);
            }
        }

        return list;
    }

    /**
     * èŽ·å–对应省份及下属市州children
     *
     * @param areaCode
     * @return
     */
    public List<DicArea> getAreaAndChild(String areaCode) {

        List<DicArea> areaList = dicAreaService.listData(null, null, areaCode);
        if (null == areaList || areaList.isEmpty()) {
            return null;
        }

        List<DicArea> children;
        for (DicArea dicArea : areaList) {
            if (Constant.AREA_TYPE_1.equals(dicArea.getType())) {
                children = dicAreaService.listData(dicArea.getCode(), null, null);
                if (null != children && children.size() > 0) {
                    dicArea.setChildren(children);
                }
            }
        }

        return areaList;
    }

    /**
     * èŽ·å–组织下所有库区信息
     *
     * @param companyId
     * @return
     */
    public List<Dept> getAllDept(String companyId) {

        return deptService.listDept(null, companyId, null);
    }
}

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/layer.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,2 @@
/*! layer-v3.5.1 Web é€šç”¨å¼¹å‡ºå±‚组件 MIT License */
 ;!function(e,t){"use strict";var i,n,a=e.layui&&layui.define,o={getPath:function(){var t=document.currentScript?document.currentScript.src:function(){for(var e,t=document.scripts,i=t.length-1,n=i;n>0;n--)if("interactive"===t[n].readyState){e=t[n].src;break}return e||t[i].src}(),i=e.LAYUI_GLOBAL||{};return i.layer_dir||t.substring(0,t.lastIndexOf("/")+1)}(),config:{},end:{},minIndex:0,minLeft:[],btn:["&#x786E;&#x5B9A;","&#x53D6;&#x6D88;"],type:["dialog","page","iframe","loading","tips"],getStyle:function(t,i){var n=t.currentStyle?t.currentStyle:e.getComputedStyle(t,null);return n[n.getPropertyValue?"getPropertyValue":"getAttribute"](i)},link:function(t,i,n){if(r.path){var a=document.getElementsByTagName("head")[0],s=document.createElement("link");"string"==typeof i&&(n=i);var l=(n||t).replace(/\.|\//g,""),f="layuicss-"+l,c="creating",u=0;s.rel="stylesheet",s.href=r.path+t,s.id=f,document.getElementById(f)||a.appendChild(s),"function"==typeof i&&!function d(t){var n=100,a=document.getElementById(f);return++u>1e4/n?e.console&&console.error(l+".css: Invalid"):void(1989===parseInt(o.getStyle(a,"width"))?(t===c&&a.removeAttribute("lay-status"),a.getAttribute("lay-status")===c?setTimeout(d,n):i()):(a.setAttribute("lay-status",c),setTimeout(function(){d(c)},n)))}()}}},r={v:"3.5.1",ie:function(){var t=navigator.userAgent.toLowerCase();return!!(e.ActiveXObject||"ActiveXObject"in e)&&((t.match(/msie\s(\d+)/)||[])[1]||"11")}(),index:e.layer&&e.layer.v?1e5:0,path:o.getPath,config:function(e,t){return e=e||{},r.cache=o.config=i.extend({},o.config,e),r.path=o.config.path||r.path,"string"==typeof e.extend&&(e.extend=[e.extend]),o.config.path&&r.ready(),e.extend?(a?layui.addcss("modules/layer/"+e.extend):o.link("theme/"+e.extend),this):this},ready:function(e){var t="layer",i="",n=(a?"modules/layer/":"theme/")+"default/layer.css?v="+r.v+i;return a?layui.addcss(n,e,t):o.link(n,e,t),this},alert:function(e,t,n){var a="function"==typeof t;return a&&(n=t),r.open(i.extend({content:e,yes:n},a?{}:t))},confirm:function(e,t,n,a){var s="function"==typeof t;return s&&(a=n,n=t),r.open(i.extend({content:e,btn:o.btn,yes:n,btn2:a},s?{}:t))},msg:function(e,n,a){var s="function"==typeof n,f=o.config.skin,c=(f?f+" "+f+"-msg":"")||"layui-layer-msg",u=l.anim.length-1;return s&&(a=n),r.open(i.extend({content:e,time:3e3,shade:!1,skin:c,title:!1,closeBtn:!1,btn:!1,resize:!1,end:a},s&&!o.config.skin?{skin:c+" layui-layer-hui",anim:u}:function(){return n=n||{},(n.icon===-1||n.icon===t&&!o.config.skin)&&(n.skin=c+" "+(n.skin||"layui-layer-hui")),n}()))},load:function(e,t){return r.open(i.extend({type:3,icon:e||0,resize:!1,shade:.01},t))},tips:function(e,t,n){return r.open(i.extend({type:4,content:[e,t],closeBtn:!1,time:3e3,shade:!1,resize:!1,fixed:!1,maxWidth:260},n))}},s=function(e){var t=this,a=function(){t.creat()};t.index=++r.index,t.config.maxWidth=i(n).width()-30,t.config=i.extend({},t.config,o.config,e),document.body?a():setTimeout(function(){a()},30)};s.pt=s.prototype;var l=["layui-layer",".layui-layer-title",".layui-layer-main",".layui-layer-dialog","layui-layer-iframe","layui-layer-content","layui-layer-btn","layui-layer-close"];l.anim=["layer-anim-00","layer-anim-01","layer-anim-02","layer-anim-03","layer-anim-04","layer-anim-05","layer-anim-06"],l.SHADE="layui-layer-shade",l.MOVE="layui-layer-move",s.pt.config={type:0,shade:.3,fixed:!0,move:l[1],title:"&#x4FE1;&#x606F;",offset:"auto",area:"auto",closeBtn:1,time:0,zIndex:19891014,maxWidth:360,anim:0,isOutAnim:!0,minStack:!0,icon:-1,moveType:1,resize:!0,scrollbar:!0,tips:2},s.pt.vessel=function(e,t){var n=this,a=n.index,r=n.config,s=r.zIndex+a,f="object"==typeof r.title,c=r.maxmin&&(1===r.type||2===r.type),u=r.title?'<div class="layui-layer-title" style="'+(f?r.title[1]:"")+'">'+(f?r.title[0]:r.title)+"</div>":"";return r.zIndex=s,t([r.shade?'<div class="'+l.SHADE+'" id="'+l.SHADE+a+'" times="'+a+'" style="'+("z-index:"+(s-1)+"; ")+'"></div>':"",'<div class="'+l[0]+(" layui-layer-"+o.type[r.type])+(0!=r.type&&2!=r.type||r.shade?"":" layui-layer-border")+" "+(r.skin||"")+'" id="'+l[0]+a+'" type="'+o.type[r.type]+'" times="'+a+'" showtime="'+r.time+'" conType="'+(e?"object":"string")+'" style="z-index: '+s+"; width:"+r.area[0]+";height:"+r.area[1]+";position:"+(r.fixed?"fixed;":"absolute;")+'">'+(e&&2!=r.type?"":u)+'<div id="'+(r.id||"")+'" class="layui-layer-content'+(0==r.type&&r.icon!==-1?" layui-layer-padding":"")+(3==r.type?" layui-layer-loading"+r.icon:"")+'">'+(0==r.type&&r.icon!==-1?'<i class="layui-layer-ico layui-layer-ico'+r.icon+'"></i>':"")+(1==r.type&&e?"":r.content||"")+'</div><span class="layui-layer-setwin">'+function(){var e=c?'<a class="layui-layer-min" href="javascript:;"><cite></cite></a><a class="layui-layer-ico layui-layer-max" href="javascript:;"></a>':"";return r.closeBtn&&(e+='<a class="layui-layer-ico '+l[7]+" "+l[7]+(r.title?r.closeBtn:4==r.type?"1":"2")+'" href="javascript:;"></a>'),e}()+"</span>"+(r.btn?function(){var e="";"string"==typeof r.btn&&(r.btn=[r.btn]);for(var t=0,i=r.btn.length;t<i;t++)e+='<a class="'+l[6]+t+'">'+r.btn[t]+"</a>";return'<div class="'+l[6]+" layui-layer-btn-"+(r.btnAlign||"")+'">'+e+"</div>"}():"")+(r.resize?'<span class="layui-layer-resize"></span>':"")+"</div>"],u,i('<div class="'+l.MOVE+'" id="'+l.MOVE+'"></div>')),n},s.pt.creat=function(){var e=this,t=e.config,a=e.index,s=t.content,f="object"==typeof s,c=i("body");if(!t.id||!i("#"+t.id)[0]){switch("string"==typeof t.area&&(t.area="auto"===t.area?["",""]:[t.area,""]),t.shift&&(t.anim=t.shift),6==r.ie&&(t.fixed=!1),t.type){case 0:t.btn="btn"in t?t.btn:o.btn[0],r.closeAll("dialog");break;case 2:var s=t.content=f?t.content:[t.content||"","auto"];t.content='<iframe scrolling="'+(t.content[1]||"auto")+'" allowtransparency="true" id="'+l[4]+a+'" name="'+l[4]+a+'" onload="this.className=\'\';" class="layui-layer-load" frameborder="0" src="'+t.content[0]+'"></iframe>';break;case 3:delete t.title,delete t.closeBtn,t.icon===-1&&0===t.icon,r.closeAll("loading");break;case 4:f||(t.content=[t.content,"body"]),t.follow=t.content[1],t.content=t.content[0]+'<i class="layui-layer-TipsG"></i>',delete t.title,t.tips="object"==typeof t.tips?t.tips:[t.tips,!0],t.tipsMore||r.closeAll("tips")}if(e.vessel(f,function(n,r,u){c.append(n[0]),f?function(){2==t.type||4==t.type?function(){i("body").append(n[1])}():function(){s.parents("."+l[0])[0]||(s.data("display",s.css("display")).show().addClass("layui-layer-wrap").wrap(n[1]),i("#"+l[0]+a).find("."+l[5]).before(r))}()}():c.append(n[1]),i("#"+l.MOVE)[0]||c.append(o.moveElem=u),e.layero=i("#"+l[0]+a),e.shadeo=i("#"+l.SHADE+a),t.scrollbar||l.html.css("overflow","hidden").attr("layer-full",a)}).auto(a),e.shadeo.css({"background-color":t.shade[1]||"#000",opacity:t.shade[0]||t.shade}),2==t.type&&6==r.ie&&e.layero.find("iframe").attr("src",s[0]),4==t.type?e.tips():function(){e.offset(),parseInt(o.getStyle(document.getElementById(l.MOVE),"z-index"))||function(){e.layero.css("visibility","hidden"),r.ready(function(){e.offset(),e.layero.css("visibility","visible")})}()}(),t.fixed&&n.on("resize",function(){e.offset(),(/^\d+%$/.test(t.area[0])||/^\d+%$/.test(t.area[1]))&&e.auto(a),4==t.type&&e.tips()}),t.time<=0||setTimeout(function(){r.close(e.index)},t.time),e.move().callback(),l.anim[t.anim]){var u="layer-anim "+l.anim[t.anim];e.layero.addClass(u).one("webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend",function(){i(this).removeClass(u)})}t.isOutAnim&&e.layero.data("isOutAnim",!0)}},s.pt.auto=function(e){var t=this,a=t.config,o=i("#"+l[0]+e);""===a.area[0]&&a.maxWidth>0&&(r.ie&&r.ie<8&&a.btn&&o.width(o.innerWidth()),o.outerWidth()>a.maxWidth&&o.width(a.maxWidth));var s=[o.innerWidth(),o.innerHeight()],f=o.find(l[1]).outerHeight()||0,c=o.find("."+l[6]).outerHeight()||0,u=function(e){e=o.find(e),e.height(s[1]-f-c-2*(0|parseFloat(e.css("padding-top"))))};switch(a.type){case 2:u("iframe");break;default:""===a.area[1]?a.maxHeight>0&&o.outerHeight()>a.maxHeight?(s[1]=a.maxHeight,u("."+l[5])):a.fixed&&s[1]>=n.height()&&(s[1]=n.height(),u("."+l[5])):u("."+l[5])}return t},s.pt.offset=function(){var e=this,t=e.config,i=e.layero,a=[i.outerWidth(),i.outerHeight()],o="object"==typeof t.offset;e.offsetTop=(n.height()-a[1])/2,e.offsetLeft=(n.width()-a[0])/2,o?(e.offsetTop=t.offset[0],e.offsetLeft=t.offset[1]||e.offsetLeft):"auto"!==t.offset&&("t"===t.offset?e.offsetTop=0:"r"===t.offset?e.offsetLeft=n.width()-a[0]:"b"===t.offset?e.offsetTop=n.height()-a[1]:"l"===t.offset?e.offsetLeft=0:"lt"===t.offset?(e.offsetTop=0,e.offsetLeft=0):"lb"===t.offset?(e.offsetTop=n.height()-a[1],e.offsetLeft=0):"rt"===t.offset?(e.offsetTop=0,e.offsetLeft=n.width()-a[0]):"rb"===t.offset?(e.offsetTop=n.height()-a[1],e.offsetLeft=n.width()-a[0]):e.offsetTop=t.offset),t.fixed||(e.offsetTop=/%$/.test(e.offsetTop)?n.height()*parseFloat(e.offsetTop)/100:parseFloat(e.offsetTop),e.offsetLeft=/%$/.test(e.offsetLeft)?n.width()*parseFloat(e.offsetLeft)/100:parseFloat(e.offsetLeft),e.offsetTop+=n.scrollTop(),e.offsetLeft+=n.scrollLeft()),i.attr("minLeft")&&(e.offsetTop=n.height()-(i.find(l[1]).outerHeight()||0),e.offsetLeft=i.css("left")),i.css({top:e.offsetTop,left:e.offsetLeft})},s.pt.tips=function(){var e=this,t=e.config,a=e.layero,o=[a.outerWidth(),a.outerHeight()],r=i(t.follow);r[0]||(r=i("body"));var s={width:r.outerWidth(),height:r.outerHeight(),top:r.offset().top,left:r.offset().left},f=a.find(".layui-layer-TipsG"),c=t.tips[0];t.tips[1]||f.remove(),s.autoLeft=function(){s.left+o[0]-n.width()>0?(s.tipLeft=s.left+s.width-o[0],f.css({right:12,left:"auto"})):s.tipLeft=s.left},s.where=[function(){s.autoLeft(),s.tipTop=s.top-o[1]-10,f.removeClass("layui-layer-TipsB").addClass("layui-layer-TipsT").css("border-right-color",t.tips[1])},function(){s.tipLeft=s.left+s.width+10,s.tipTop=s.top,f.removeClass("layui-layer-TipsL").addClass("layui-layer-TipsR").css("border-bottom-color",t.tips[1])},function(){s.autoLeft(),s.tipTop=s.top+s.height+10,f.removeClass("layui-layer-TipsT").addClass("layui-layer-TipsB").css("border-right-color",t.tips[1])},function(){s.tipLeft=s.left-o[0]-10,s.tipTop=s.top,f.removeClass("layui-layer-TipsR").addClass("layui-layer-TipsL").css("border-bottom-color",t.tips[1])}],s.where[c-1](),1===c?s.top-(n.scrollTop()+o[1]+16)<0&&s.where[2]():2===c?n.width()-(s.left+s.width+o[0]+16)>0||s.where[3]():3===c?s.top-n.scrollTop()+s.height+o[1]+16-n.height()>0&&s.where[0]():4===c&&o[0]+16-s.left>0&&s.where[1](),a.find("."+l[5]).css({"background-color":t.tips[1],"padding-right":t.closeBtn?"30px":""}),a.css({left:s.tipLeft-(t.fixed?n.scrollLeft():0),top:s.tipTop-(t.fixed?n.scrollTop():0)})},s.pt.move=function(){var e=this,t=e.config,a=i(document),s=e.layero,l=s.find(t.move),f=s.find(".layui-layer-resize"),c={};return t.move&&l.css("cursor","move"),l.on("mousedown",function(e){e.preventDefault(),t.move&&(c.moveStart=!0,c.offset=[e.clientX-parseFloat(s.css("left")),e.clientY-parseFloat(s.css("top"))],o.moveElem.css("cursor","move").show())}),f.on("mousedown",function(e){e.preventDefault(),c.resizeStart=!0,c.offset=[e.clientX,e.clientY],c.area=[s.outerWidth(),s.outerHeight()],o.moveElem.css("cursor","se-resize").show()}),a.on("mousemove",function(i){if(c.moveStart){var a=i.clientX-c.offset[0],o=i.clientY-c.offset[1],l="fixed"===s.css("position");if(i.preventDefault(),c.stX=l?0:n.scrollLeft(),c.stY=l?0:n.scrollTop(),!t.moveOut){var f=n.width()-s.outerWidth()+c.stX,u=n.height()-s.outerHeight()+c.stY;a<c.stX&&(a=c.stX),a>f&&(a=f),o<c.stY&&(o=c.stY),o>u&&(o=u)}s.css({left:a,top:o})}if(t.resize&&c.resizeStart){var a=i.clientX-c.offset[0],o=i.clientY-c.offset[1];i.preventDefault(),r.style(e.index,{width:c.area[0]+a,height:c.area[1]+o}),c.isResize=!0,t.resizing&&t.resizing(s)}}).on("mouseup",function(e){c.moveStart&&(delete c.moveStart,o.moveElem.hide(),t.moveEnd&&t.moveEnd(s)),c.resizeStart&&(delete c.resizeStart,o.moveElem.hide())}),e},s.pt.callback=function(){function e(){var e=a.cancel&&a.cancel(t.index,n);e===!1||r.close(t.index)}var t=this,n=t.layero,a=t.config;t.openLayer(),a.success&&(2==a.type?n.find("iframe").on("load",function(){a.success(n,t.index)}):a.success(n,t.index)),6==r.ie&&t.IE6(n),n.find("."+l[6]).children("a").on("click",function(){var e=i(this).index();if(0===e)a.yes?a.yes(t.index,n):a.btn1?a.btn1(t.index,n):r.close(t.index);else{var o=a["btn"+(e+1)]&&a["btn"+(e+1)](t.index,n);o===!1||r.close(t.index)}}),n.find("."+l[7]).on("click",e),a.shadeClose&&t.shadeo.on("click",function(){r.close(t.index)}),n.find(".layui-layer-min").on("click",function(){var e=a.min&&a.min(n,t.index);e===!1||r.min(t.index,a)}),n.find(".layui-layer-max").on("click",function(){i(this).hasClass("layui-layer-maxmin")?(r.restore(t.index),a.restore&&a.restore(n,t.index)):(r.full(t.index,a),setTimeout(function(){a.full&&a.full(n,t.index)},100))}),a.end&&(o.end[t.index]=a.end)},o.reselect=function(){i.each(i("select"),function(e,t){var n=i(this);n.parents("."+l[0])[0]||1==n.attr("layer")&&i("."+l[0]).length<1&&n.removeAttr("layer").show(),n=null})},s.pt.IE6=function(e){i("select").each(function(e,t){var n=i(this);n.parents("."+l[0])[0]||"none"===n.css("display")||n.attr({layer:"1"}).hide(),n=null})},s.pt.openLayer=function(){var e=this;r.zIndex=e.config.zIndex,r.setTop=function(e){var t=function(){r.zIndex++,e.css("z-index",r.zIndex+1)};return r.zIndex=parseInt(e[0].style.zIndex),e.on("mousedown",t),r.zIndex}},o.record=function(e){var t=[e.width(),e.height(),e.position().top,e.position().left+parseFloat(e.css("margin-left"))];e.find(".layui-layer-max").addClass("layui-layer-maxmin"),e.attr({area:t})},o.rescollbar=function(e){l.html.attr("layer-full")==e&&(l.html[0].style.removeProperty?l.html[0].style.removeProperty("overflow"):l.html[0].style.removeAttribute("overflow"),l.html.removeAttr("layer-full"))},e.layer=r,r.getChildFrame=function(e,t){return t=t||i("."+l[4]).attr("times"),i("#"+l[0]+t).find("iframe").contents().find(e)},r.getFrameIndex=function(e){return i("#"+e).parents("."+l[4]).attr("times")},r.iframeAuto=function(e){if(e){var t=r.getChildFrame("html",e).outerHeight(),n=i("#"+l[0]+e),a=n.find(l[1]).outerHeight()||0,o=n.find("."+l[6]).outerHeight()||0;n.css({height:t+a+o}),n.find("iframe").css({height:t})}},r.iframeSrc=function(e,t){i("#"+l[0]+e).find("iframe").attr("src",t)},r.style=function(e,t,n){var a=i("#"+l[0]+e),r=a.find(".layui-layer-content"),s=a.attr("type"),f=a.find(l[1]).outerHeight()||0,c=a.find("."+l[6]).outerHeight()||0;a.attr("minLeft");s!==o.type[3]&&s!==o.type[4]&&(n||(parseFloat(t.width)<=260&&(t.width=260),parseFloat(t.height)-f-c<=64&&(t.height=64+f+c)),a.css(t),c=a.find("."+l[6]).outerHeight(),s===o.type[2]?a.find("iframe").css({height:parseFloat(t.height)-f-c}):r.css({height:parseFloat(t.height)-f-c-parseFloat(r.css("padding-top"))-parseFloat(r.css("padding-bottom"))}))},r.min=function(e,t){t=t||{};var a=i("#"+l[0]+e),s=i("#"+l.SHADE+e),f=a.find(l[1]).outerHeight()||0,c=a.attr("minLeft")||181*o.minIndex+"px",u=a.css("position"),d={width:180,height:f,position:"fixed",overflow:"hidden"};o.record(a),o.minLeft[0]&&(c=o.minLeft[0],o.minLeft.shift()),t.minStack&&(d.left=c,d.top=n.height()-f,a.attr("minLeft")||o.minIndex++,a.attr("minLeft",c)),a.attr("position",u),r.style(e,d,!0),a.find(".layui-layer-min").hide(),"page"===a.attr("type")&&a.find(l[4]).hide(),o.rescollbar(e),s.hide()},r.restore=function(e){var t=i("#"+l[0]+e),n=i("#"+l.SHADE+e),a=t.attr("area").split(",");t.attr("type");r.style(e,{width:parseFloat(a[0]),height:parseFloat(a[1]),top:parseFloat(a[2]),left:parseFloat(a[3]),position:t.attr("position"),overflow:"visible"},!0),t.find(".layui-layer-max").removeClass("layui-layer-maxmin"),t.find(".layui-layer-min").show(),"page"===t.attr("type")&&t.find(l[4]).show(),o.rescollbar(e),n.show()},r.full=function(e){var t,a=i("#"+l[0]+e);o.record(a),l.html.attr("layer-full")||l.html.css("overflow","hidden").attr("layer-full",e),clearTimeout(t),t=setTimeout(function(){var t="fixed"===a.css("position");r.style(e,{top:t?0:n.scrollTop(),left:t?0:n.scrollLeft(),width:n.width(),height:n.height()},!0),a.find(".layui-layer-min").hide()},100)},r.title=function(e,t){var n=i("#"+l[0]+(t||r.index)).find(l[1]);n.html(e)},r.close=function(e,t){var n=i("#"+l[0]+e),a=n.attr("type"),s="layer-anim-close";if(n[0]){var f="layui-layer-wrap",c=function(){if(a===o.type[1]&&"object"===n.attr("conType")){n.children(":not(."+l[5]+")").remove();for(var r=n.find("."+f),s=0;s<2;s++)r.unwrap();r.css("display",r.data("display")).removeClass(f)}else{if(a===o.type[2])try{var c=i("#"+l[4]+e)[0];c.contentWindow.document.write(""),c.contentWindow.close(),n.find("."+l[5])[0].removeChild(c)}catch(u){}n[0].innerHTML="",n.remove()}"function"==typeof o.end[e]&&o.end[e](),delete o.end[e],"function"==typeof t&&t()};n.data("isOutAnim")&&n.addClass("layer-anim "+s),i("#layui-layer-moves, #"+l.SHADE+e).remove(),6==r.ie&&o.reselect(),o.rescollbar(e),n.attr("minLeft")&&(o.minIndex--,o.minLeft.push(n.attr("minLeft"))),r.ie&&r.ie<10||!n.data("isOutAnim")?c():setTimeout(function(){c()},200)}},r.closeAll=function(e,t){"function"==typeof e&&(t=e,e=null);var n=i("."+l[0]);i.each(n,function(a){var o=i(this),s=e?o.attr("type")===e:1;s&&r.close(o.attr("times"),a===n.length-1?t:null),s=null}),0===n.length&&"function"==typeof t&&t()};var f=r.cache||{},c=function(e){return f.skin?" "+f.skin+" "+f.skin+"-"+e:""};r.prompt=function(e,t){var a="";if(e=e||{},"function"==typeof e&&(t=e),e.area){var o=e.area;a='style="width: '+o[0]+"; height: "+o[1]+';"',delete e.area}var s,l=2==e.formType?'<textarea class="layui-layer-input"'+a+"></textarea>":function(){return'<input type="'+(1==e.formType?"password":"text")+'" class="layui-layer-input">'}(),f=e.success;return delete e.success,r.open(i.extend({type:1,btn:["&#x786E;&#x5B9A;","&#x53D6;&#x6D88;"],content:l,skin:"layui-layer-prompt"+c("prompt"),maxWidth:n.width(),success:function(t){s=t.find(".layui-layer-input"),s.val(e.value||"").focus(),"function"==typeof f&&f(t)},resize:!1,yes:function(i){var n=s.val();""===n?s.focus():n.length>(e.maxlength||500)?r.tips("&#x6700;&#x591A;&#x8F93;&#x5165;"+(e.maxlength||500)+"&#x4E2A;&#x5B57;&#x6570;",s,{tips:1}):t&&t(n,i,s)}},e))},r.tab=function(e){e=e||{};var t=e.tab||{},n="layui-this",a=e.success;return delete e.success,r.open(i.extend({type:1,skin:"layui-layer-tab"+c("tab"),resize:!1,title:function(){var e=t.length,i=1,a="";if(e>0)for(a='<span class="'+n+'">'+t[0].title+"</span>";i<e;i++)a+="<span>"+t[i].title+"</span>";return a}(),content:'<ul class="layui-layer-tabmain">'+function(){var e=t.length,i=1,a="";if(e>0)for(a='<li class="layui-layer-tabli '+n+'">'+(t[0].content||"no content")+"</li>";i<e;i++)a+='<li class="layui-layer-tabli">'+(t[i].content||"no  content")+"</li>";return a}()+"</ul>",success:function(t){var o=t.find(".layui-layer-title").children(),r=t.find(".layui-layer-tabmain").children();o.on("mousedown",function(t){t.stopPropagation?t.stopPropagation():t.cancelBubble=!0;var a=i(this),o=a.index();a.addClass(n).siblings().removeClass(n),r.eq(o).show().siblings().hide(),"function"==typeof e.change&&e.change(o)}),"function"==typeof a&&a(t)}},e))},r.photos=function(t,n,a){function o(e,t,i){var n=new Image;return n.src=e,n.complete?t(n):(n.onload=function(){n.onload=null,t(n)},void(n.onerror=function(e){n.onerror=null,i(e)}))}var s={};if(t=t||{},t.photos){var l=!("string"==typeof t.photos||t.photos instanceof i),f=l?t.photos:{},u=f.data||[],d=f.start||0;s.imgIndex=(0|d)+1,t.img=t.img||"img";var y=t.success;if(delete t.success,l){if(0===u.length)return r.msg("&#x6CA1;&#x6709;&#x56FE;&#x7247;")}else{var p=i(t.photos),h=function(){u=[],p.find(t.img).each(function(e){var t=i(this);t.attr("layer-index",e),u.push({alt:t.attr("alt"),pid:t.attr("layer-pid"),src:t.attr("layer-src")||t.attr("src"),thumb:t.attr("src")})})};if(h(),0===u.length)return;if(n||p.on("click",t.img,function(){h();var e=i(this),n=e.attr("layer-index");r.photos(i.extend(t,{photos:{start:n,data:u,tab:t.tab},full:t.full}),!0)}),!n)return}s.imgprev=function(e){s.imgIndex--,s.imgIndex<1&&(s.imgIndex=u.length),s.tabimg(e)},s.imgnext=function(e,t){s.imgIndex++,s.imgIndex>u.length&&(s.imgIndex=1,t)||s.tabimg(e)},s.keyup=function(e){if(!s.end){var t=e.keyCode;e.preventDefault(),37===t?s.imgprev(!0):39===t?s.imgnext(!0):27===t&&r.close(s.index)}},s.tabimg=function(e){if(!(u.length<=1))return f.start=s.imgIndex-1,r.close(s.index),r.photos(t,!0,e)},s.event=function(){s.bigimg.find(".layui-layer-imgprev").on("click",function(e){e.preventDefault(),s.imgprev(!0)}),s.bigimg.find(".layui-layer-imgnext").on("click",function(e){e.preventDefault(),s.imgnext(!0)}),i(document).on("keyup",s.keyup)},s.loadi=r.load(1,{shade:!("shade"in t)&&.9,scrollbar:!1}),o(u[d].src,function(n){r.close(s.loadi),a&&(t.anim=-1),s.index=r.open(i.extend({type:1,id:"layui-layer-photos",area:function(){var a=[n.width,n.height],o=[i(e).width()-100,i(e).height()-100];if(!t.full&&(a[0]>o[0]||a[1]>o[1])){var r=[a[0]/o[0],a[1]/o[1]];r[0]>r[1]?(a[0]=a[0]/r[0],a[1]=a[1]/r[0]):r[0]<r[1]&&(a[0]=a[0]/r[1],a[1]=a[1]/r[1])}return[a[0]+"px",a[1]+"px"]}(),title:!1,shade:.9,shadeClose:!0,closeBtn:!1,move:".layui-layer-phimg img",moveType:1,scrollbar:!1,moveOut:!0,anim:5,isOutAnim:!1,skin:"layui-layer-photos"+c("photos"),content:'<div class="layui-layer-phimg"><img src="'+u[d].src+'" alt="'+(u[d].alt||"")+'" layer-pid="'+u[d].pid+'">'+function(){return u.length>1?'<div class="layui-layer-imgsee"><span class="layui-layer-imguide"><a href="javascript:;" class="layui-layer-iconext layui-layer-imgprev"></a><a href="javascript:;" class="layui-layer-iconext layui-layer-imgnext"></a></span><div class="layui-layer-imgbar" style="display:'+(a?"block":"")+'"><span class="layui-layer-imgtit"><a href="javascript:;">'+(u[d].alt||"")+"</a><em>"+s.imgIndex+" / "+u.length+"</em></span></div></div>":""}()+"</div>",success:function(e,i){s.bigimg=e.find(".layui-layer-phimg"),s.imgsee=e.find(".layui-layer-imgbar"),s.event(e),t.tab&&t.tab(u[d],e),"function"==typeof y&&y(e)},end:function(){s.end=!0,i(document).off("keyup",s.keyup)}},t))},function(){r.close(s.loadi),r.msg("&#x5F53;&#x524D;&#x56FE;&#x7247;&#x5730;&#x5740;&#x5F02;&#x5E38;<br>&#x662F;&#x5426;&#x7EE7;&#x7EED;&#x67E5;&#x770B;&#x4E0B;&#x4E00;&#x5F20;&#xFF1F;",{time:3e4,btn:["&#x4E0B;&#x4E00;&#x5F20;","&#x4E0D;&#x770B;&#x4E86;"],yes:function(){u.length>1&&s.imgnext(!0,!0)}})})}},o.run=function(t){i=t,n=i(e),l.html=i("html"),r.open=function(e){var t=new s(e);return t.index}},e.layui&&layui.define?(r.ready(),layui.define("jquery",function(t){r.path=layui.cache.dir,o.run(layui.$),e.layer=r,t("layer",r)})):"function"==typeof define&&define.amd?define(["jquery"],function(){return o.run(e.jQuery),r}):function(){r.ready(),o.run(e.jQuery)}()}(window);

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/mobile/layer.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,2 @@
/*! layer mobile-v2.0.0 Web é€šç”¨å¼¹å‡ºå±‚组件 MIT License */
 ;!function(e){"use strict";var t=document,n="querySelectorAll",i="getElementsByClassName",a=function(e){return t[n](e)},s={type:0,shade:!0,shadeClose:!0,fixed:!0,anim:"scale"},l={extend:function(e){var t=JSON.parse(JSON.stringify(s));for(var n in e)t[n]=e[n];return t},timer:{},end:{}};l.touch=function(e,t){e.addEventListener("click",function(e){t.call(this,e)},!1)};var r=0,o=["layui-m-layer"],c=function(e){var t=this;t.config=l.extend(e),t.view()};c.prototype.view=function(){var e=this,n=e.config,s=t.createElement("div");e.id=s.id=o[0]+r,s.setAttribute("class",o[0]+" "+o[0]+(n.type||0)),s.setAttribute("index",r);var l=function(){var e="object"==typeof n.title;return n.title?'<h3 style="'+(e?n.title[1]:"")+'">'+(e?n.title[0]:n.title)+"</h3>":""}(),c=function(){"string"==typeof n.btn&&(n.btn=[n.btn]);var e,t=(n.btn||[]).length;return 0!==t&&n.btn?(e='<span yes type="1">'+n.btn[0]+"</span>",2===t&&(e='<span no type="0">'+n.btn[1]+"</span>"+e),'<div class="layui-m-layerbtn">'+e+"</div>"):""}();if(n.fixed||(n.top=n.hasOwnProperty("top")?n.top:100,n.style=n.style||"",n.style+=" top:"+(t.body.scrollTop+n.top)+"px"),2===n.type&&(n.content='<i></i><i class="layui-m-layerload"></i><i></i><p>'+(n.content||"")+"</p>"),n.skin&&(n.anim="up"),"msg"===n.skin&&(n.shade=!1),s.innerHTML=(n.shade?"<div "+("string"==typeof n.shade?'style="'+n.shade+'"':"")+' class="layui-m-layershade"></div>':"")+'<div class="layui-m-layermain" '+(n.fixed?"":'style="position:static;"')+'><div class="layui-m-layersection"><div class="layui-m-layerchild '+(n.skin?"layui-m-layer-"+n.skin+" ":"")+(n.className?n.className:"")+" "+(n.anim?"layui-m-anim-"+n.anim:"")+'" '+(n.style?'style="'+n.style+'"':"")+">"+l+'<div class="layui-m-layercont">'+n.content+"</div>"+c+"</div></div></div>",!n.type||2===n.type){var d=t[i](o[0]+n.type),y=d.length;y>=1&&layer.close(d[0].getAttribute("index"))}document.body.appendChild(s);var u=e.elem=a("#"+e.id)[0];n.success&&n.success(u),e.index=r++,e.action(n,u)},c.prototype.action=function(e,t){var n=this;e.time&&(l.timer[n.index]=setTimeout(function(){layer.close(n.index)},1e3*e.time));var a=function(){var t=this.getAttribute("type");0==t?(e.no&&e.no(),layer.close(n.index)):e.yes?e.yes(n.index):layer.close(n.index)};if(e.btn)for(var s=t[i]("layui-m-layerbtn")[0].children,r=s.length,o=0;o<r;o++)l.touch(s[o],a);if(e.shade&&e.shadeClose){var c=t[i]("layui-m-layershade")[0];l.touch(c,function(){layer.close(n.index,e.end)})}e.end&&(l.end[n.index]=e.end)},e.layer={v:"2.0",index:r,open:function(e){var t=new c(e||{});return t.index},close:function(e){var n=a("#"+o[0]+e)[0];n&&(n.innerHTML="",t.body.removeChild(n),clearTimeout(l.timer[e]),delete l.timer[e],"function"==typeof l.end[e]&&l.end[e](),delete l.end[e])},closeAll:function(){for(var e=t[i](o[0]),n=0,a=e.length;n<a;n++)layer.close(0|e[0].getAttribute("index"))}},"function"==typeof define?define(function(){return layer}):function(){var e=document.scripts,n=e[e.length-1],i=n.src,a=i.substring(0,i.lastIndexOf("/")+1);n.getAttribute("merge")||document.head.appendChild(function(){var e=t.createElement("link");return e.href=a+"need/layer.css?2.0",e.type="text/css",e.rel="styleSheet",e.id="layermcss",e}())}()}(window);

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/mobile/need/layer.css

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1 @@
.layui-m-layer{position:relative;z-index:19891014}.layui-m-layer *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.layui-m-layermain,.layui-m-layershade{position:fixed;left:0;top:0;width:100%;height:100%}.layui-m-layershade{background-color:rgba(0,0,0,.7);pointer-events:auto}.layui-m-layermain{display:table;font-family:Helvetica,arial,sans-serif;pointer-events:none}.layui-m-layermain .layui-m-layersection{display:table-cell;vertical-align:middle;text-align:center}.layui-m-layerchild{position:relative;display:inline-block;text-align:left;background-color:#fff;font-size:14px;border-radius:5px;box-shadow:0 0 8px rgba(0,0,0,.1);pointer-events:auto;-webkit-overflow-scrolling:touch;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@-webkit-keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.layui-m-anim-scale{animation-name:layui-m-anim-scale;-webkit-animation-name:layui-m-anim-scale}@-webkit-keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.layui-m-anim-up{-webkit-animation-name:layui-m-anim-up;animation-name:layui-m-anim-up}.layui-m-layer0 .layui-m-layerchild{width:90%;max-width:640px}.layui-m-layer1 .layui-m-layerchild{border:none;border-radius:0}.layui-m-layer2 .layui-m-layerchild{width:auto;max-width:260px;min-width:40px;border:none;background:0 0;box-shadow:none;color:#fff}.layui-m-layerchild h3{padding:0 10px;height:60px;line-height:60px;font-size:16px;font-weight:400;border-radius:5px 5px 0 0;text-align:center}.layui-m-layerbtn span,.layui-m-layerchild h3{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.layui-m-layercont{padding:50px 30px;line-height:22px;text-align:center}.layui-m-layer1 .layui-m-layercont{padding:0;text-align:left}.layui-m-layer2 .layui-m-layercont{text-align:center;padding:0;line-height:0}.layui-m-layer2 .layui-m-layercont i{width:25px;height:25px;margin-left:8px;display:inline-block;background-color:#fff;border-radius:100%;-webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out;animation:layui-m-anim-loading 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.layui-m-layerbtn,.layui-m-layerbtn span{position:relative;text-align:center;border-radius:0 0 5px 5px}.layui-m-layer2 .layui-m-layercont p{margin-top:20px}@-webkit-keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.layui-m-layer2 .layui-m-layercont i:first-child{margin-left:0;-webkit-animation-delay:-.32s;animation-delay:-.32s}.layui-m-layer2 .layui-m-layercont i.layui-m-layerload{-webkit-animation-delay:-.16s;animation-delay:-.16s}.layui-m-layer2 .layui-m-layercont>div{line-height:22px;padding-top:7px;margin-bottom:20px;font-size:14px}.layui-m-layerbtn{display:box;display:-moz-box;display:-webkit-box;width:100%;height:50px;line-height:50px;font-size:0;border-top:1px solid #D0D0D0;background-color:#F2F2F2}.layui-m-layerbtn span{display:block;-moz-box-flex:1;box-flex:1;-webkit-box-flex:1;font-size:14px;cursor:pointer}.layui-m-layerbtn span[yes]{color:#40AFFE}.layui-m-layerbtn span[no]{border-right:1px solid #D0D0D0;border-radius:0 0 0 5px}.layui-m-layerbtn span:active{background-color:#F6F6F6}.layui-m-layerend{position:absolute;right:7px;top:10px;width:30px;height:30px;border:0;font-weight:400;background:0 0;cursor:pointer;-webkit-appearance:none;font-size:30px}.layui-m-layerend::after,.layui-m-layerend::before{position:absolute;left:5px;top:15px;content:'';width:18px;height:1px;background-color:#999;transform:rotate(45deg);-webkit-transform:rotate(45deg);border-radius:3px}.layui-m-layerend::after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}body .layui-m-layer .layui-m-layer-footer{position:fixed;width:95%;max-width:100%;margin:0 auto;left:0;right:0;bottom:10px;background:0 0}.layui-m-layer-footer .layui-m-layercont{padding:20px;border-radius:5px 5px 0 0;background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn{display:block;height:auto;background:0 0;border-top:none}.layui-m-layer-footer .layui-m-layerbtn span{background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn span[no]{color:#FD482C;border-top:1px solid #c2c2c2;border-radius:0 0 5px 5px}.layui-m-layer-footer .layui-m-layerbtn span[yes]{margin-top:10px;border-radius:5px}body .layui-m-layer .layui-m-layer-msg{width:auto;max-width:90%;margin:0 auto;bottom:-150px;background-color:rgba(0,0,0,.7);color:#fff}.layui-m-layer-msg .layui-m-layercont{padding:10px 20px}

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/icon-ext.png

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/icon.png

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/layer.css

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1 @@
.layui-layer-imgbar,.layui-layer-imgtit a,.layui-layer-tab .layui-layer-title span,.layui-layer-title{text-overflow:ellipsis;white-space:nowrap}html #layuicss-layer{display:none;position:absolute;width:1989px}.layui-layer,.layui-layer-shade{position:fixed;_position:absolute;pointer-events:auto}.layui-layer-shade{top:0;left:0;width:100%;height:100%;_height:expression(document.body.offsetHeight+"px")}.layui-layer{-webkit-overflow-scrolling:touch;top:150px;left:0;margin:0;padding:0;background-color:#fff;-webkit-background-clip:content;border-radius:2px;box-shadow:1px 1px 50px rgba(0,0,0,.3)}.layui-layer-close{position:absolute}.layui-layer-content{position:relative}.layui-layer-border{border:1px solid #B2B2B2;border:1px solid rgba(0,0,0,.1);box-shadow:1px 1px 5px rgba(0,0,0,.2)}.layui-layer-load{background:url(loading-1.gif) center center no-repeat #eee}.layui-layer-ico{background:url(icon.png) no-repeat}.layui-layer-btn a,.layui-layer-dialog .layui-layer-ico,.layui-layer-setwin a{display:inline-block;*display:inline;*zoom:1;vertical-align:top}.layui-layer-move{display:none;position:fixed;*position:absolute;left:0;top:0;width:100%;height:100%;cursor:move;opacity:0;filter:alpha(opacity=0);background-color:#fff;z-index:2147483647}.layui-layer-resize{position:absolute;width:15px;height:15px;right:0;bottom:0;cursor:se-resize}.layer-anim{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.3s;animation-duration:.3s}@-webkit-keyframes layer-bounceIn{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layer-bounceIn{0%{opacity:0;-webkit-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.layer-anim-00{-webkit-animation-name:layer-bounceIn;animation-name:layer-bounceIn}@-webkit-keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-01{-webkit-animation-name:layer-zoomInDown;animation-name:layer-zoomInDown}@-webkit-keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.layer-anim-02{-webkit-animation-name:layer-fadeInUpBig;animation-name:layer-fadeInUpBig}@-webkit-keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-03{-webkit-animation-name:layer-zoomInLeft;animation-name:layer-zoomInLeft}@-webkit-keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0)}}@keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0) rotate(0);-ms-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0)}}.layer-anim-04{-webkit-animation-name:layer-rollIn;animation-name:layer-rollIn}@keyframes layer-fadeIn{0%{opacity:0}100%{opacity:1}}.layer-anim-05{-webkit-animation-name:layer-fadeIn;animation-name:layer-fadeIn}@-webkit-keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.layer-anim-06{-webkit-animation-name:layer-shake;animation-name:layer-shake}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.layui-layer-title{padding:0 80px 0 20px;height:50px;line-height:50px;border-bottom:1px solid #F0F0F0;font-size:14px;color:#333;overflow:hidden;border-radius:2px 2px 0 0}.layui-layer-setwin{position:absolute;right:15px;*right:0;top:17px;font-size:0;line-height:initial}.layui-layer-setwin a{position:relative;width:16px;height:16px;margin-left:10px;font-size:12px;_overflow:hidden}.layui-layer-setwin .layui-layer-min cite{position:absolute;width:14px;height:2px;left:0;top:50%;margin-top:-1px;background-color:#2E2D3C;cursor:pointer;_overflow:hidden}.layui-layer-setwin .layui-layer-min:hover cite{background-color:#2D93CA}.layui-layer-setwin .layui-layer-max{background-position:-32px -40px}.layui-layer-setwin .layui-layer-max:hover{background-position:-16px -40px}.layui-layer-setwin .layui-layer-maxmin{background-position:-65px -40px}.layui-layer-setwin .layui-layer-maxmin:hover{background-position:-49px -40px}.layui-layer-setwin .layui-layer-close1{background-position:1px -40px;cursor:pointer}.layui-layer-setwin .layui-layer-close1:hover{opacity:.7}.layui-layer-setwin .layui-layer-close2{position:absolute;right:-28px;top:-28px;width:30px;height:30px;margin-left:0;background-position:-149px -31px;*right:-18px;_display:none}.layui-layer-setwin .layui-layer-close2:hover{background-position:-180px -31px}.layui-layer-btn{text-align:right;padding:0 15px 12px;pointer-events:auto;user-select:none;-webkit-user-select:none}.layui-layer-btn a{height:28px;line-height:28px;margin:5px 5px 0;padding:0 15px;border:1px solid #dedede;background-color:#fff;color:#333;border-radius:2px;font-weight:400;cursor:pointer;text-decoration:none}.layui-layer-btn a:hover{opacity:.9;text-decoration:none}.layui-layer-btn a:active{opacity:.8}.layui-layer-btn .layui-layer-btn0{border-color:#1E9FFF;background-color:#1E9FFF;color:#fff}.layui-layer-btn-l{text-align:left}.layui-layer-btn-c{text-align:center}.layui-layer-dialog{min-width:300px}.layui-layer-dialog .layui-layer-content{position:relative;padding:20px;line-height:24px;word-break:break-all;overflow:hidden;font-size:14px;overflow-x:hidden;overflow-y:auto}.layui-layer-dialog .layui-layer-content .layui-layer-ico{position:absolute;top:16px;left:15px;_left:-40px;width:30px;height:30px}.layui-layer-ico1{background-position:-30px 0}.layui-layer-ico2{background-position:-60px 0}.layui-layer-ico3{background-position:-90px 0}.layui-layer-ico4{background-position:-120px 0}.layui-layer-ico5{background-position:-150px 0}.layui-layer-ico6{background-position:-180px 0}.layui-layer-rim{border:6px solid #8D8D8D;border:6px solid rgba(0,0,0,.3);border-radius:5px;box-shadow:none}.layui-layer-msg{min-width:180px;border:1px solid #D3D4D3;box-shadow:none}.layui-layer-hui{min-width:100px;background-color:#000;filter:alpha(opacity=60);background-color:rgba(0,0,0,.6);color:#fff;border:none}.layui-layer-hui .layui-layer-content{padding:12px 25px;text-align:center}.layui-layer-dialog .layui-layer-padding{padding:20px 20px 20px 55px;text-align:left}.layui-layer-page .layui-layer-content{position:relative;overflow:auto}.layui-layer-iframe .layui-layer-btn,.layui-layer-page .layui-layer-btn{padding-top:10px}.layui-layer-nobg{background:0 0}.layui-layer-iframe iframe{display:block;width:100%}.layui-layer-loading{border-radius:100%;background:0 0;box-shadow:none;border:none}.layui-layer-loading .layui-layer-content{width:60px;height:24px;background:url(loading-0.gif) no-repeat}.layui-layer-loading .layui-layer-loading1{width:37px;height:37px;background:url(loading-1.gif) no-repeat}.layui-layer-ico16,.layui-layer-loading .layui-layer-loading2{width:32px;height:32px;background:url(loading-2.gif) no-repeat}.layui-layer-tips{background:0 0;box-shadow:none;border:none}.layui-layer-tips .layui-layer-content{position:relative;line-height:22px;min-width:12px;padding:8px 15px;font-size:12px;_float:left;border-radius:2px;box-shadow:1px 1px 3px rgba(0,0,0,.2);background-color:#000;color:#fff}.layui-layer-tips .layui-layer-close{right:-2px;top:-1px}.layui-layer-tips i.layui-layer-TipsG{position:absolute;width:0;height:0;border-width:8px;border-color:transparent;border-style:dashed;*overflow:hidden}.layui-layer-tips i.layui-layer-TipsB,.layui-layer-tips i.layui-layer-TipsT{left:5px;border-right-style:solid;border-right-color:#000}.layui-layer-tips i.layui-layer-TipsT{bottom:-8px}.layui-layer-tips i.layui-layer-TipsB{top:-8px}.layui-layer-tips i.layui-layer-TipsL,.layui-layer-tips i.layui-layer-TipsR{top:5px;border-bottom-style:solid;border-bottom-color:#000}.layui-layer-tips i.layui-layer-TipsR{left:-8px}.layui-layer-tips i.layui-layer-TipsL{right:-8px}.layui-layer-lan[type=dialog]{min-width:280px}.layui-layer-lan .layui-layer-title{background:#4476A7;color:#fff;border:none}.layui-layer-lan .layui-layer-btn{padding:5px 10px 10px;text-align:right;border-top:1px solid #E9E7E7}.layui-layer-lan .layui-layer-btn a{background:#fff;border-color:#E9E7E7;color:#333}.layui-layer-lan .layui-layer-btn .layui-layer-btn1{background:#C9C5C5}.layui-layer-molv .layui-layer-title{background:#009f95;color:#fff;border:none}.layui-layer-molv .layui-layer-btn a{background:#009f95;border-color:#009f95}.layui-layer-molv .layui-layer-btn .layui-layer-btn1{background:#92B8B1}.layui-layer-iconext{background:url(icon-ext.png) no-repeat}.layui-layer-prompt .layui-layer-input{display:block;width:260px;height:36px;margin:0 auto;line-height:30px;padding-left:10px;border:1px solid #e6e6e6;color:#333}.layui-layer-prompt textarea.layui-layer-input{width:300px;height:100px;line-height:20px;padding:6px 10px}.layui-layer-prompt .layui-layer-content{padding:20px}.layui-layer-prompt .layui-layer-btn{padding-top:0}.layui-layer-tab{box-shadow:1px 1px 50px rgba(0,0,0,.4)}.layui-layer-tab .layui-layer-title{padding-left:0;overflow:visible}.layui-layer-tab .layui-layer-title span{position:relative;float:left;min-width:80px;max-width:300px;padding:0 20px;text-align:center;overflow:hidden;cursor:pointer}.layui-layer-tab .layui-layer-title span.layui-this{height:51px;border-left:1px solid #eee;border-right:1px solid #eee;background-color:#fff;z-index:10}.layui-layer-tab .layui-layer-title span:first-child{border-left:none}.layui-layer-tabmain{line-height:24px;clear:both}.layui-layer-tabmain .layui-layer-tabli{display:none}.layui-layer-tabmain .layui-layer-tabli.layui-this{display:block}.layui-layer-photos{background:0 0;box-shadow:none}.layui-layer-photos .layui-layer-content{overflow:hidden;text-align:center}.layui-layer-photos .layui-layer-phimg img{position:relative;width:100%;display:inline-block;*display:inline;*zoom:1;vertical-align:top}.layui-layer-imgnext,.layui-layer-imgprev{position:fixed;top:50%;width:27px;_width:44px;height:44px;margin-top:-22px;outline:0;blr:expression(this.onFocus=this.blur())}.layui-layer-imgprev{left:30px;background-position:-5px -5px;_background-position:-70px -5px}.layui-layer-imgprev:hover{background-position:-33px -5px;_background-position:-120px -5px}.layui-layer-imgnext{right:30px;_right:8px;background-position:-5px -50px;_background-position:-70px -50px}.layui-layer-imgnext:hover{background-position:-33px -50px;_background-position:-120px -50px}.layui-layer-imgbar{position:fixed;left:0;right:0;bottom:0;width:100%;height:40px;line-height:40px;background-color:#000\9;filter:Alpha(opacity=60);background-color:rgba(2,0,0,.35);color:#fff;overflow:hidden;font-size:0}.layui-layer-imgtit *{display:inline-block;*display:inline;*zoom:1;vertical-align:top;font-size:12px}.layui-layer-imgtit a{max-width:65%;overflow:hidden;color:#fff}.layui-layer-imgtit a:hover{color:#fff;text-decoration:underline}.layui-layer-imgtit em{padding-left:10px;font-style:normal}@-webkit-keyframes layer-bounceOut{100%{opacity:0;-webkit-transform:scale(.7);transform:scale(.7)}30%{-webkit-transform:scale(1.05);transform:scale(1.05)}0%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes layer-bounceOut{100%{opacity:0;-webkit-transform:scale(.7);-ms-transform:scale(.7);transform:scale(.7)}30%{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.layer-anim-close{-webkit-animation-name:layer-bounceOut;animation-name:layer-bounceOut;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@media screen and (max-width:1100px){.layui-layer-iframe{overflow-y:auto;-webkit-overflow-scrolling:touch}}

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/loading-0.gif

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/loading-1.gif

 fzzy-igdss-web/src/main/resources/static/ajax/libs/layer/theme/default/loading-2.gif

 fzzy-igdss-web/src/main/resources/static/common/igds-common.js

@@ -216,23 +216,69 @@
 * @param pageTag
 */
function changePage(pageTag) {
    var url = "../dept-board/index";
    var url = "/group/board";

    if ("inout" == pageTag) {
        url = "../dept-board/inout";
    }
    if ("ai" == pageTag) {
        url = "../dept-board/ai";
    }
    if ("video" == pageTag) {
        url = "../dept-board/video";
    }
    //后台管理首页
    if ("backstage" == pageTag) {
        url = "../index";
        window.parent.open(url, "_self");
    if ("logout" == pageTag) {
        window.top.location.href = "/logout";
        return;
    }

    if ("index" == pageTag) {
        url = "/group/index";
    }
    if ("gis" == pageTag) {
        url = "/group/gis";
    }
    if ("video" == pageTag) {
        url = "/group/video";
    }

    window.location.href = url;
}

//浏览器全屏
var fullscreen = false;

function changeScreen() {
    const element = document.documentElement
    // å¦‚果是全屏状态
    if (fullscreen) {
        // å¦‚果浏览器有这个Function
        if (document.exitFullscreen) {
            document.exitFullscreen()
        } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen()
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen()
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen()
        }
    } else {
        // å¦‚果浏览器有这个Function
        if (element.requestFullscreen) {
            element.requestFullscreen()
        } else if (element.webkitRequestFullScreen) {
            element.webkitRequestFullScreen()
        } else if (element.mozRequestFullScreen) {
            element.mozRequestFullScreen()
        } else if (element.msRequestFullscreen) {
            element.msRequestFullscreen()
        }
    }
    // åˆ¤æ–­å…¨å±çŠ¶æ€çš„变量
    fullscreen = !fullscreen
}

function exitFullScreen() {
    // å¦‚果浏览器有这个Function
    if (document.exitFullscreen) {
        document.exitFullscreen()
    } else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen()
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen()
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen()
    }
    fullscreen = false;
}

 fzzy-igdss-web/src/main/resources/static/group/gis-chart.js

@@ -218,7 +218,7 @@
                    },
                    img: {
                        backgroundColor: {
                            image: '/static/group/img/c-i1.png',
                            image: '/img/web/group/c-i1.png',
                        },
                        width: 17,
                        align: 'left',
@@ -308,15 +308,14 @@
}

window.onload = function () {
   // barChartLoad(null);
    barChartLoad(null);
    /*粮食品种*/
    window.onresize = function (e) {
        if (breedChart) {
            breedChart.resize();
        }
    }

  //  ajaxFoodNum();
    // ajaxFoodNum();
}

/**

 fzzy-igdss-web/src/main/resources/static/group/gis-common.js

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/static/group/gis-map.js

@@ -13,6 +13,35 @@
    return hex;
}

//---------------------------------------------------------------------------------
//just some colors
// var colors = [
//     "#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00",
//     "#b82e2e", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707",
//     "#651067", "#329262", "#5574a6", "#3b3eac"
// ];
// var colors = [
//     "#3366cc",
//     "#191970",
//     "#000080",
//     "#6495ED",
//     "#483D8B",
//     "#6A5ACD",
//     "#0000CD",
//     "#7B68EE",
//     "#4169E1",
//     "#8470FF",
//     "#0000FF",
//     "#1E90FF",
//     "#00BFFF",
//     "#87CEEB",
//     "#87CEFA",
//     "#4682B4",
//     "#B0C4DE",
//     "#ADD8E6",
//     "#B0E0E6",
//     "#3b3eac"
// ];
// é¢œè‰²è¾…助方法
var colors = [];
var num = 0;
@@ -27,6 +56,7 @@
        eventSupport: true, //打开事件支持
        map: map
    });
    console.log(districtExplorer);
    //监听feature的hover事件
    districtExplorer.on('featureMouseout featureMouseover', function(e, feature) {
        toggleHoverFeature(feature, e.type === 'featureMouseover',
@@ -41,6 +71,7 @@

//feature被点击
    districtExplorer.on('featureClick', function(e, feature) {

        var props = feature.properties;
        //如果存在子节点
        // if (props.childrenNum > 0) {
@@ -52,15 +83,18 @@

//外部区域被点击
    districtExplorer.on('outsideClick', function(e) {

        districtExplorer.locatePosition(e.originalEvent.lnglat, function(error, routeFeatures) {

            if (routeFeatures && routeFeatures.length > 1) {
                //切换到省级区域
               // switch2AreaNode(routeFeatures[1].properties.adcode);
                renderAreas(routeFeatures[1].properties.adcode);
            } else {
                //切换到全国
                switch2AreaNode(defaultAreaCode);
                switch2AreaNode(650000);
            }

        }, {
            levelLimit: 2
        });
@@ -69,8 +103,10 @@

//当前聚焦的区域
var currentAreaNode = null;

//鼠标hover提示内容
var $tipMarkerContent = $('<div class="tipMarker top" style="color: #1E9CFF;font-size: 18px;weight:100px;"></div>');

var tipMarker = new AMap.Marker({
    content: $tipMarkerContent.get(0),
    offset: new AMap.Pixel(0, 0),
@@ -79,12 +115,17 @@

//根据Hover状态设置相关样式
function toggleHoverFeature(feature, isHover, position) {

    tipMarker.setMap(isHover ? map : null);

    if (!feature) {
        return;
    }

    var props = feature.properties;

    if (isHover) {

        //更新提示内容
        $tipMarkerContent.html("　　　" + props.name);
        //更新位置
@@ -96,6 +137,7 @@
    //更新相关多边形的样式
    var polys = districtExplorer.findFeaturePolygonsByAdcode(props.adcode);
    for (var i = 0, len = polys.length; i < len; i++) {

        polys[i].setOptions({
            fillOpacity: isHover ? 0.5 : 0.35
        });
@@ -106,34 +148,47 @@

//绘制区域面板的节点
function renderAreaPanelNode(ele, props, color) {

    var $box = $('<li/>').addClass('lv_' + props.level);

    var $h2 = $('<h2/>').addClass('lv_' + props.level).attr({
        'data-adcode': props.adcode,
        'data-level': props.level,
        'data-children-num': props.childrenNum || void(0),
        'data-center': props.center.join(',')
    }).html(props.name).appendTo($box);

    if (color) {
        $h2.css('borderColor', color);
    }

    //如果存在子节点
    if (props.childrenNum > 0) {

        //显示隐藏
        $('<div class="showHideBtn"></div>').appendTo($box);

        //子区域列表
        $('<ul/>').addClass('sublist lv_' + props.level).appendTo($box);

        $('<div class="clear"></div>').appendTo($box);

        if (props.level !== 'country') {
            $box.addClass('hide-sub');
        }
    }

    $box.appendTo(ele);
}


//填充某个节点的子区域列表
function renderAreaPanel(areaNode) {

    var props = areaNode.getProps();

    var $subBox = $('#area-tree').find('h2[data-adcode="' + props.adcode + '"]').siblings('ul.sublist');

    if (!$subBox.length && props.childrenNum) {
        //父节点不存在，先创建
        renderAreaPanelNode($('#area-tree'), props);
@@ -142,8 +197,11 @@
    if ($subBox.attr('data-loaded') === 'rendered') {
        return;
    }

    $subBox.attr('data-loaded', 'rendered');

    var subFeatures = areaNode.getSubFeatures();

    //填充子区域
    for (var i = 0, len = subFeatures.length; i < len; i++) {
        renderAreaPanelNode($subBox, areaNode.getPropsOfFeature(subFeatures[i]), colors[i % colors.length]);
@@ -154,12 +212,16 @@
function renderAreaPolygons(areaNode) {
    //更新地图视野
    map.setBounds(areaNode.getBounds(), null, null, true);

    //清除已有的绘制内容
    districtExplorer.clearFeaturePolygons();

    //绘制子区域
    districtExplorer.renderSubFeatures(areaNode, function(feature, i) {

        var fillColor = colors[i % colors.length];
        var strokeColor = colors[colors.length - 1 - i % colors.length];

        return {
            cursor: 'default',
            bubble: true,
@@ -170,6 +232,7 @@
            fillOpacity: 0.35, //填充透明度
        };
    });

    //绘制父区域
    districtExplorer.renderParentFeature(areaNode, {
        cursor: 'default',
@@ -181,16 +244,24 @@
        fillOpacity: 0.35, //填充透明度
    });
}

//切换区域后刷新显示内容
function refreshAreaNode(areaNode) {

    districtExplorer.setHoverFeature(null);

    renderAreaPolygons(areaNode);

    //更新选中节点的class
    var $nodeEles = $('#area-tree').find('h2');

    $nodeEles.removeClass('selected');

    var $selectedNode = $nodeEles.filter('h2[data-adcode=' + areaNode.getAdcode() + ']').addClass('selected');

    //展开下层节点
    $selectedNode.closest('li').removeClass('hide-sub');

    //折叠下层的子节点
    $selectedNode.siblings('ul.sublist').children().addClass('hide-sub');
}
@@ -199,21 +270,31 @@
function switch2AreaNode(adcode, callback) {
    //-----------------------刷新数据
    county = adcode;
    ajaxFoodNum();
    // ajaxFoodNum();


    if (currentAreaNode && ('' + currentAreaNode.getAdcode() === '' + adcode)) {
        return;
    }

    loadAreaNode(adcode, function(error, areaNode) {

        if (error) {

            if (callback) {
                callback(error);
            }

            return;
        }

        currentAreaNode = window.currentAreaNode = areaNode;

        //设置当前使用的定位用节点
        districtExplorer.setAreaNodesForLocating([currentAreaNode]);

        refreshAreaNode(areaNode);

        if (callback) {
            callback(null, areaNode);
        }
@@ -222,15 +303,22 @@

//加载区域
function loadAreaNode(adcode, callback) {

    districtExplorer.loadAreaNode(adcode, function(error, areaNode) {

        if (error) {

            if (callback) {
                callback(error);
            }

            console.error(error);

            return;
        }

        renderAreaPanel(areaNode);

        if (callback) {
            callback(null, areaNode);
        }
@@ -238,11 +326,14 @@
}

$('#area-tree').on('mouseenter mouseleave', 'h2[data-adcode]', function(e) {

    if (e.type === 'mouseleave') {
        districtExplorer.setHoverFeature(null);
        return;
    }

    var adcode = $(this).attr('data-adcode');

    districtExplorer.setHoverFeature(currentAreaNode.getSubFeatureByAdcode(adcode));
});

@@ -253,19 +344,28 @@
});

$('#area-tree').on('click', '.showHideBtn', function() {

    var $li = $(this).closest('li');

    $li.toggleClass('hide-sub');

    if (!$li.hasClass('hide-sub')) {

        //子节点列表被展开
        var $subList = $li.children('ul.sublist');

        //尚未加载
        if (!$subList.attr('data-loaded')) {

            $subList.attr('data-loaded', 'loading');

            $li.addClass('loading');

            //加载
            loadAreaNode($li.children('h2').attr('data-adcode'), function() {

                $li.removeClass('loading');
            });
        }
    }
});
});

 fzzy-igdss-web/src/main/resources/static/group/gis.css

@@ -5,7 +5,7 @@


.i-nav3.on{
  background-image: url(../group/img/c-btn3.png);
  background-image: url(../img/web/group/c-btn3.png);
}
.c-main{
  position: relative;
@@ -33,7 +33,7 @@
  padding: 90px 20px 20px;
  width: 518px;
  height: 910px;
  background: url(../group/img/cd-bg1.png) no-repeat center;
  background: url(../img/web/group/cd-bg1.png) no-repeat center;
  background-size: 100% 100%;
  box-sizing: border-box;
}
@@ -48,7 +48,7 @@
  padding-top: 80px;
  width: 399px;
  height: 910px;
  background: url(../group/img/cd-bg2.png) no-repeat center;
  background: url(../img/web/group/cd-bg2.png) no-repeat center;
  background-size: 100% 100%;
  box-sizing: border-box;
}
@@ -116,7 +116,7 @@
  width: 100%;
  height: 100%;
  display: block;
  background: url(../group/img/c-bg1.png) no-repeat center;
  background: url(../img/web/group/c-bg1.png) no-repeat center;
  background-size: contain;
}
.m-box1 .chartbox::after{
@@ -128,7 +128,7 @@
  width: 100%;
  height: 100%;
  display: block;
  background: url(../group/img/c-bg2.png) no-repeat center;
  background: url(../img/web/group/c-bg2.png) no-repeat center;
  background-size: contain;
}
.m-box1 .chartbox .txt{
@@ -244,7 +244,7 @@
  font-size: 18px;
  color: #fff;
  padding-left: 25px;
  background: url(../group/img/c-i1.png) no-repeat left center;
  background: url(../img/web/group/c-i1.png) no-repeat left center;
  background-size: 17px;
}
.m-box2 .num{
@@ -285,13 +285,13 @@
.m-nav .arr{
  width: 24px;
  height: 20px;
  background: url(../group/img/c-i3.png) no-repeat center;
  background: url(../img/web/group/c-i3.png) no-repeat center;
  background-size: contain;
}
.m-nav .icon{
  width: 50px;
  height: 50px;
  background: url(../group/img/c-i2.png) no-repeat center;
  background: url(../img/web/group/c-i2.png) no-repeat center;
  background-size: contain;
  flex-shrink: 0;
}
@@ -322,7 +322,7 @@
.m-nav .three .icon{
  width: 16px;
  height: 16px;
  background-image: url(../group/img/c-i4.png);
  background-image: url(../img/web/group/c-i4.png);
  margin: 4px 8px 0 0;
}
.m-nav .three .v1{

 fzzy-igdss-web/src/main/resources/static/group/gis.js

ÎļþÃû´Ó fzzy-igdss-web/src/main/resources/static/group/gis-index.js ÐÞ¸Ä
@@ -1,8 +1,8 @@
var colors = {};
var map;
var disProvince;//行政区颜色渲染
var deptAreasMap = {};
var allDeptMap = {};
var deptListMap = {};
var allAreaMap = {};
var markers = [];//点标记
var type = "0";
var county = "all";
@@ -10,18 +10,21 @@
//var switch2AreaNode2;

$(function () {
    if (deptAreas) {
        for (var i = 0; i < deptAreas.length; i++) {
            deptAreasMap[deptAreas[i].id] = deptAreas[i];
    //所有库区
    if (deptList) {
        for (var i = 0; i < deptList.length; i++) {
            deptListMap[deptList[i].id] = deptList[i];
        }
    }
    if (allDept) {
        for (var i = 0; i < allDept.length; i++) {
            allDeptMap[allDept[i].id] = allDept[i];
    //所有省市
    if (allArea) {
        for (var i = 0; i < allArea.length; i++) {
            allAreaMap[allArea[i].code] = allArea[i];
        }
    }

    //初始化时间
    //initTime();
    initTime();

    //初始化地图
    initMap();
@@ -37,16 +40,29 @@
    );

    //渲染部门
    //renderDepts();
    renderList();

    //大屏标语
    //initDicSlogan();

    //renderAreas(654000);
    setTimeout(function () {
         renderAreas(654000);
        renderAreas(650000);
    }, 2000);

    $('.sup-menu-title').click(function(){
        var kai = $(this).parent(".sup-menu-group")
        if (kai.hasClass('menu-group')) {
            kai.removeClass('menu-group')
        } else{
            kai.addClass('menu-group')
        }

    });
    $('.sup-menu-h').click(function(){
        var kai2 = $(this).parents(".sup-menu-ul")
        if (kai2.hasClass('menu-h')) {
            kai2.removeClass('menu-h')
        } else{
            kai2.addClass('menu-h')
        }
    });
});

// åˆ·æ–°æ—¶é—´
@@ -60,8 +76,8 @@

function initMap() {
    map = new AMap.Map('map_container', {
        center: [81.323691, 43.917106],
        zoom: 9,
        center: [83.721646, 40.627714],
        zoom: 5.6,
        mapStyle: 'amap://styles/41f8248740d3659ddc65dc363078592c',
        // rotateEnable:true,
        // pitchEnable:true,
@@ -74,7 +90,7 @@
    new AMap.DistrictSearch({
        extensions: 'all',
        subdistrict: 0
    }).search('伊犁哈萨克自治州', function (status, result) {
    }).search('新疆维吾尔自治区', function (status, result) {
        // å¤–多边形坐标数组和内多边形坐标数组
        var outer = [
            new AMap.LngLat(-360, 90, true),
@@ -105,52 +121,34 @@


    //默认行政区域编码
    renderColor(defaultAreaCode);
}

//socket信息返回處理
function socketOnMessage(pocket) {

    if (pocket.userId == "slogan") {
        var data = pocket.data;
        dicSlogan = data;
        initDicSlogan();
    }
    // renderColor(defaultAreaCode);
}

/**
 * åˆå§‹æ ‡è¯­æ•°æ®
 * èŽ·å–市州下库区信息
 */
function initDicSlogan() {
    if (dicSlogan) {
        if (dicSlogan.color == "red") {
            $("#sloganText").css({
                color: "#DE2910"
            });
        } else {
            $("#sloganText").css({
                color: "#7ddfff"
            });
        }
        $("#sloganText").text(dicSlogan.content);
    }
}

/**
 * æ ¹æ®åŒºåŽ¿èŽ·å–库区
 */
function getDeptArea(city, county) {
function getDeptArea(province, county) {
    var list = [];
    if (deptAreas) {
        for (var i = 0; i < deptAreas.length; i++) {
            if (city == deptAreas[i].deptCity) {
                list.push(deptAreas[i]);
    if (deptList) {
        if (province && province.length > 0) {
            var str1 = province.substring(0, 2);
            for (var i = 0; i < deptList.length; i++){
                if(deptList[i].xzqhdm.startsWith(str1)){
                    list.push(deptList[i]);
                }
            }
            if (county == deptAreas[i].deptCounty) {
                list.push(deptAreas[i]);

        }
        if (county && county.length > 0) {
            var str2 = county.substring(0, 4);
            for (var i = 0; i < deptList.length; i++) {
                if(deptList[i].xzqhdm.startsWith(str2)){
                    list.push(deptList[i]);
                }
            }
        }
    }

    return list;
}

@@ -158,7 +156,7 @@
 * ç”¨æˆ·ç‚¹å‡»åŸŽå¸‚或者县级区级渲染库区点位
 */
function renderAreas(deptId) {
    var d = allDeptMap[deptId];
    var d = allAreaMap[deptId];
    if (d) {
        closeInfoWindow();
        removeColor();
@@ -166,10 +164,10 @@
        //map.setCity(deptId);
        renderColor(deptId);
        var a = [];
        if ("10" == d.type) {
        if ("1" == d.type) {
            a = getDeptArea(deptId, "")
        }
        if ("11" == d.type) {
        if ("2" == d.type) {
            a = getDeptArea("", deptId)
        }
        if (a && a.length > 0) {
@@ -179,12 +177,10 @@
        }
        //刷新数据
        county = deptId;
       // ajaxFoodNum();
        // ajaxFoodNum();
    } else {
        console.log("没有获取到该行政区划:" + deptId);
    }
    //陕西

}

/**
@@ -192,7 +188,7 @@
 * @param deptAreaId
 */
function showAreaInfo(deptAreaId) {
    var d = deptAreasMap[deptAreaId];
    var d = deptListMap[deptAreaId];
    if (d) {
        closeInfoWindow();
        removeColor();
@@ -209,40 +205,40 @@
/**
 * æ¸²æŸ“库区列表
 */
function renderDepts() {
    if (depts) {
function renderList() {
    if (areaList) {
        var html = "";
        var childs = [];
        var areas = [];
        for (var i = 0; i < depts.length; i++) {
        for (var i = 0; i < areaList.length; i++) {
            html += "<div style=\"width: 305px; overflow: hidden\">" +
                "<div class=\"sup-menu-group menu-group\">" +
                "<div class=\"sup-menu-title\">" +
                "<i class=\"i-icon fl\"><img src=\"/static/images/visual/icon-sj.png\"/></i>" +
                "<a href=\"###\" onclick=\"renderAreas('" + depts[i].id + "')\">" +
                "<span class=\"i-icon32 fl\"><img src=\"/static/images/visual/c-i2.png\"/></span>" +
                (depts[i].name ? depts[i].name : "") +
                "<i class=\"i-icon fl\"><img src=\"/img/web/group/icon-sj.png\"/></i>" +
                "<a href=\"###\" onclick=\"renderAreas('" + areaList[i].code + "')\">" +
                "<span class=\"i-icon32 fl\"><img src=\"/img/web/group/c-i2.png\"/></span>" +
                (areaList[i].name ? areaList[i].name : "") +
                "</a>" +
                "</div>";
            if (depts[i].children && depts[i].children.length > 0) {
                childs = depts[i].children;
            if (areaList[i].children && areaList[i].children.length > 0) {
                childs = areaList[i].children;
                for (var j = 0; j < childs.length; j++) {
                    html += "<ul class=\"sup-menu-ul  menu-h\">" +
                        "<li>" +
                        "<div class=\"sup-menu-h\">" +
                        "<i class=\"i-icon fl\"><img src=\"/static/images/visual/icon-sj.png\"/></i>" +
                        "<a href=\"###\" onclick=\"renderAreas('" + childs[j].id + "')\">" +
                        "<span class=\"i-icon32 fl\"><img src=\"/static/images/visual/c-i2.png\"/></span>" +
                        "<i class=\"i-icon fl\"><img src=\"/img/web/group/icon-sj.png\"/></i>" +
                        "<a href=\"###\" onclick=\"renderAreas('" + childs[j].code + "')\">" +
                        "<span class=\"i-icon32 fl\"><img src=\"/img/web/group/c-i2.png\"/></span>" +
                        (childs[j].name ? childs[j].name : "") +
                        "</a>" +
                        "</div>";
                    areas = getDeptArea("", childs[j].id);
                    areas = getDeptArea("", childs[j].code);
                    if (areas && areas.length > 0) {
                        for (var k = 0; k < areas.length; k++) {
                            html += "<div class=\"sup-menu-box\">" +
                                "<p>" +
                                "<span class=\"i-icon32 fl\"><img src=\"/static/images/visual/icon-kuqu.png\"/></span>" +
                                "<a href=\"#\" onclick=\"showAreaInfo('" + areas[k].id + "')\">" + areas[k].name + "</a>" +
                                "<span class=\"i-icon32 fl\"><img src=\"/img/web/group/icon-kuqu.png\"/></span>" +
                                "<a href=\"#\" onclick=\"showAreaInfo('" + areas[k].id + "')\">" + areas[k].kqmc + "</a>" +
                                "</p>" +
                                "</div>";
                        }
@@ -252,15 +248,15 @@
                }
            } else {
                //没有子节点，直接就是区级别
                areas = getDeptArea("", depts[i].id);
                areas = getDeptArea("", areaList[i].code);
                if (areas && areas.length > 0) {
                    for (var k = 0; k < areas.length; k++) {
                        html += "<ul class=\"sup-menu-ul\">" +
                            "<li>" +
                            "<div class=\"sup-menu-h\">" +
                            "<i class=\"i-icon fl\"><img src=\"/static/images/visual/icon-sj.png\"/></i>" +
                            "<a href=\"###\" onclick=\"renderAreas('" + areas[k].id + "')\">" +
                            "<span class=\"i-icon32 fl\"><img src=\"/static/images/visual/icon-kuqu.png\"/></span>" +
                            "<i class=\"i-icon fl\"><img src=\"/img/web/group/icon-sj.png\"/></i>" +
                            "<a href=\"###\" onclick=\"renderAreas('" + areas[k].code + "')\">" +
                            "<span class=\"i-icon32 fl\"><img src=\"/img/web/group/icon-kuqu.png\"/></span>" +
                            (areas[k].name ? areas[k].name : "") +
                            "</a>" +
                            "</div>";
@@ -305,7 +301,7 @@
            // "                        <p>天府新区</p>" +
            "                        <span class=\"map-round\"></span>" +
            "                    </div>";
        var position = [deptArea.lon, deptArea.lat];
        var position = [deptArea.jd, deptArea.wd];
        var marker = new AMap.Marker({
            position: position,
            // å°† html ä¼ ç»™ content
@@ -375,54 +371,54 @@
        "<div class=\"BMap_bubble_center\" style=\"z-index: 3; position: relative; height: 324px; width: 376px;\">" +
        "<div class=\"BMap_bubble_content\" style=\"font-size: 14px; line-height: 24px; position: absolute; top: 2px; color: rgb(85, 85, 85); width: 364px; height: 324px; overflow: auto;\">" +
        '<div style=\"height:100%;box-sizing:border-box;\">' +
        '<div style="height: 34px;">'+
        '<div style="height: 34px;">' +
        '<div style="width: 320px;float: left;">';
    if (deptArea.name.length>17) {
        content += '<h3 style="margin:0 0 10px 0;line-height:24px;font-size:14px;color:#fff;">' + (deptArea.name ? deptArea.name : "没有获取到库区信息") + '</h3>' ;
    }else{
        content +=  '<h3 style="margin:0 0 10px 0;line-height:24px;font-size:18px;color:#fff;">' + (deptArea.name ? deptArea.name : "没有获取到库区信息") + '</h3>' ;
    if (deptArea.kqmc.length > 17) {
        content += '<h3 style="margin:0 0 10px 0;line-height:24px;font-size:14px;color:#fff;">' + (deptArea.kqmc ? deptArea.kqmc : "没有获取到库区信息") + '</h3>';
    } else {
        content += '<h3 style="margin:0 0 10px 0;line-height:24px;font-size:18px;color:#fff;">' + (deptArea.kqmc ? deptArea.kqmc : "没有获取到库区信息") + '</h3>';
    }
    content += '</div>'+
    content += '</div>' +
        '<div style="width: 40px;float: left;">' +
        '<img style="height: 20px;" src="../../static/images/visual/icon_close.png" onclick="closeInfoWindow()"></img>' +
        '</div>'+
        '</div>'+
        '<img style="height: 20px;" src="/img/web/group/icon_close.png" onclick="closeInfoWindow()"></img>' +
        '</div>' +
        '</div>' +

        '<p style="line-height:24px;font-size:12px;color:#fff;margin-right: 15px;"><img src="../../static/images/visual/icon-address.png" alt="" style="float:left;width: 16px;height: 16px;margin-right:3px;margin-top: 5px;"/>' + (deptArea.address ? deptArea.address + "(" + deptArea.lon + "," + deptArea.lat + ")" : "没有获取到库区信息") + '</P>' +
        '<p style="line-height:24px;font-size:12px;color:#fff;margin-right: 15px;"><img src="/img/web/group/icon-address.png" alt="" style="float:left;width: 16px;height: 16px;margin-right:3px;margin-top: 5px;"/>' + (deptArea.kqdz ? deptArea.kqdz + "(" + deptArea.jd + "," + deptArea.wd + ")" : "没有获取到库区信息") + '</P>' +
        '<div class="right-topInfo-kd " style="height: 80px;width: 270px;margin: 5px auto 10px auto;">' +
        '<div class="right-topInfo-kd-item">' +
        '<h3>粮仓个数(个)</h3>' +
        '<p>' + (deptArea.depotNum ? deptArea.depotNum : 0) + '</p>' +
        '<p>' + (deptArea.cfs ? deptArea.cfs : 0) + '</p>' +
        '</div>' +
        '<div class="right-topInfo-kd-item">' +
        '<h3>油罐个数(个)</h3>' +
        '<p>' + (deptArea.depotOilNum ? deptArea.depotOilNum : 0) + '</p>' +
        '<p>' + (deptArea.cfs ? deptArea.cfs : 0) + '</p>' +
        '</div>' +
        '</div>' +
        '<ul class="right-topInfo-kd-list right-topInfo-jg sup-topInfo-list">' +
        '<li>';
    if (deptArea.storage && (deptArea.storage + "").length > 4) {
        content += '<p style="font-size: 22px">' + (deptArea.storage ? deptArea.storage.toFixed(3) : 0) + '</p>';
    if (deptArea.cfs && (deptArea.cfs + "").length > 4) {
        content += '<p style="font-size: 22px">' + (deptArea.cfs ? deptArea.cfs.toFixed(3) : 0) + '</p>';
    } else {
        content += '<p style="font-size: 22px">' + (deptArea.storage ? deptArea.storage.toFixed(3) : 0) + '</p>';
        content += '<p style="font-size: 22px">' + (deptArea.cfs ? deptArea.cfs.toFixed(3) : 0) + '</p>';

    }
    content += '<h3>粮食储量(吨)</h3>'+
    content += '<h3>粮食储量(吨)</h3>' +
        '</li>' +
        '<li>';
    if (deptArea.storage && (deptArea.oilStorage + "").length > 4) {
        content += '<p style="font-size: 22px">' + (deptArea.oilStorage ? deptArea.oilStorage.toFixed(3) : 0) + '</p>';
    if (deptArea.cfs && (deptArea.cfs + "").length > 4) {
        content += '<p style="font-size: 22px">' + (deptArea.cfs ? deptArea.cfs.toFixed(3) : 0) + '</p>';
    } else {
        content += '<p style="font-size: 22px">' + (deptArea.oilStorage ? deptArea.oilStorage.toFixed(3) : 0) + '</p>';
        content += '<p style="font-size: 22px">' + (deptArea.cfs ? deptArea.cfs.toFixed(3) : 0) + '</p>';
    }
    content += '<h3>植物油储量(吨)</h3>' +
        '</li>' +
        '<li>' +
        '<p style="font-size: 22px" >' + (deptArea.area ? deptArea.area : 0) + '</p>' +
        '<p style="font-size: 22px" >' + (deptArea.zdmj ? deptArea.zdmj : 0) + '</p>' +
        '<h3>占地面积（㎡）</h3>' +
        '</li>' +
        '</ul>' +
        '<a href="javaScript:;" onclick="toHomeDetail(\'' + deptAreaId + '\')"  class="sup-deatil-link"><img src="../../static/images/visual/spu-detail-btn.png" alt="" style="width:100%;height:100%;"/></a>' +
        '<a href="javaScript:;" onclick="toHomeDetail(\'' + deptAreaId + '\')"  class="sup-deatil-link"><img src="/img/web/group/spu-detail-btn.png" alt="" style="width:100%;height:100%;"/></a>' +
        '</div>' +
        "</div></div><div class=\"BMap_bubble_bottom\" style=\"display: block; z-index: 2; position: absolute; width: 376px;\">" +
        "</div><img style=\"z-index: 1; position: absolute; width: 58px; height: 31px; left: 159px; bottom: -30px; top: 356px;\" src=\"http://webmap0.bdimg.com/image/api/iw_tail.png\"></div>";
@@ -435,7 +431,7 @@
 * @param id
 */
function toHomeDetail(id) {
    var url = "../home?t=grain&deptAreaId=" + id;
    var url = "/index?deptId=" + id;
    window.parent.open(url, "_self");
};

@@ -444,23 +440,6 @@
 * @param adcode
 */
function renderColor(adcode) {
    // disProvince = new AMap.DistrictLayer.Province({
    //     zIndex: 12,
    //     adcode: adcode,
    //     depth: 2,
    //     opacity: 0.6,
    //     styles: {
    //         'fill': function (properties) {
    //             var adcode = properties.adcode;
    //             return getColorByAdcode(adcode);
    //         },
    //         'province-stroke': 'cornflowerblue',
    //         'city-stroke': 'white',//中国地级市边界
    //         'county-stroke': 'rgba(255,255,255,0.5)'//中国区县边界
    //     }
    // });
    // disProvince.setMap(map);
    //window.switch2AreaNode2(adcode);
    switch2AreaNode(adcode);
}


 fzzy-igdss-web/src/main/resources/static/group/img/fenping_4.png

Binary files differ

 fzzy-igdss-web/src/main/resources/static/group/img/fenping_4_active.png

Binary files differ

 fzzy-igdss-web/src/main/resources/static/group/img/fenping_9.png

Binary files differ

 fzzy-igdss-web/src/main/resources/static/group/img/fenping_9_active.png

Binary files differ

 fzzy-igdss-web/src/main/resources/static/group/index.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1126 @@
var nowClientWidth = document.documentElement.clientWidth; // å½“前视口宽度
var pieVarietyChart = null;   // å“ç§é¥¼çŠ¶å›¾ -- ç²®é£Ÿ
var pieTypeChart = null;      // æ€§è´¨é¥¼çŠ¶å›¾ -- ç²®é£Ÿ
var pieLevelChart = null;     // ç­‰çº§é¥¼çŠ¶å›¾ -- ç²®é£Ÿ
var pieYearChart = null;      // å¹´ä»½é¥¼çŠ¶å›¾ -- ç²®é£Ÿ
var pieAreaChart = null;      // åŒºåŸŸé¥¼çŠ¶å›¾ -- ç²®é£Ÿ
var hisVarietyChart = null;   // å“ç§æŸ±çŠ¶å›¾
var deptAreaAllList = null;   // æ‰€æœ‰åº“区列表信息
var deptAreaList = null;      // å­˜æ”¾åˆ‡æ¢åº“区列表信息
var companyList = null;       // å…¬å¸ä¿¡æ¯
var deptCode = null;          // å½“前闪烁地区的编码
var timer1;     // åº“区定时
var index1 = 0; // åº“区切换下标
var timer2;     // ç²®é£Ÿæ•°é‡å®šæ—¶
var index2 = 0; // ç²®é£Ÿæ•°é‡åˆ‡æ¢ä¸‹æ ‡
var number2 = 2;// ç²®é£Ÿæ•°é‡åˆ‡æ¢æ€»æ•°é‡
var timer3;     // å‚¨é‡é¥¼å›¾å®šæ—¶
var index3 = 0; // å‚¨é‡é¥¼å›¾åˆ‡æ¢ä¸‹æ ‡
var number3 = 2;// å‚¨é‡é¥¼å›¾åˆ‡æ¢æ€»æ•°é‡

var mapChart = null;
var geoMap = [{name: '乌鲁木齐', value: [87.617733, 43.792818]}]; //默认点位
var map = chinaMapOutline; //默认加载全国地图
$(function () {
    // åˆå§‹åŒ–页面
    init();

    //提醒
    // showTip("双击页面标语，切换全屏");
});


// åˆå§‹åŒ–页面
function init() {
    // é€‚应屏幕大小
    initScrollbar();
    // æ—¶é—´
    initTime();
    // åˆå§‹åŒ–图表
    initChart();

    //初始化地图
    initMap();

    //加载指定地区地图
    renderMapPoints("新疆维吾尔自治区");
    // è¯·æ±‚库区信息
    // ajaxDeptArea();
    // èŽ·å–公司信息
    // ajaxCompany();
    // è¯·æ±‚粮食数量统计信息
    // ajaxFoodNum();
    // è¯·æ±‚获取库区动态信息
    // ajaxMsg();
}

//加载库区地图位置
function renderMap() {
    var myChart = mapChart;
    //注入地图边界
    echarts.registerMap('chinaMapOutline', map);
    myChart.option.series[1].data = geoMap;
    myChart.chart.setOption(myChart.option, true);
    mapChart = myChart;
}

//加载指定地区地图和点位
function renderMapPoints(areaName) {
    if(!areaName){
        return;
    }
    var names = areaName.split(",");
    if(names.length < 1){
        return;
    }

    //根据需要设置某个地区的地图
    var all = chinaMap.features;
    map = {
        "type": "FeatureCollection",
        "features": []
    };

    //默认获取省份省会坐标
    geoMap = [];
    for (var j = 0; j < names.length; j++) {
        for (var i = 0; i < all.length; i++) {
            if(all[i].properties.name == names[j]){
                map.features.push(all[i]);
                geoMap.push({
                    name: all[i].properties.centerName,
                    value: [all[i].properties.center[0], all[i].properties.center[1], 12]
                });
                renderMap();
                break;
            }
        }
    }
}

/**
 * åˆå§‹åŒ–加载地图
 * @param areaName é»˜è®¤å…¨å›½åœ°å›¾
 */
function initMap() {
    var myChart = echarts.init(document.getElementById('map'));

    //注入地图边界
    echarts.registerMap('chinaMapOutline', map);

    var option = {
        backgroundColor:'transparent',
        tooltip: {
            show: false,
            trigger: 'item'
        },
        geo: {
            silent: true,
            map: 'chinaMapOutline',
            show: false,
            zoom: 0.8,
            top: '0%',
            label: {
                normal: {
                    show: false,
                    textStyle: {
                        color: '#fff'
                    }
                },
                emphasis: {
                    textStyle: {
                        color: '#fff'
                    }
                }
            },

            roam: false,
            itemStyle: {
                normal: {
                    areaColor: {
                        type: 'linear-gradient',
                        x: 0.5,
                        y: 0.5,
                        r: 0.8,
                        colorStops: [{
                            offset: 0,
                            color: 'rgba(45,68,121,0.15)' // 0% å¤„的颜色
                        },
                            {
                                offset: 1,
                                color: 'rgba(45,68,121,0.18)' // 100% å¤„的颜色
                            }
                        ],
                        global: true // ç¼ºçœä¸º false
                    },
                    // areaColor: 'transparent',
                    borderColor: '#83BAFF',
                    borderWidth: 1,
                    shadowColor: 'rgba(56,164,255,.26)',
                    opacity: 0.5,
                    shadowOffsetX: 5,
                    shadowOffsetY: 5,
                    shadowBlur: 5,
                    show: true, // æ˜¯å¦æ˜¾ç¤ºå¯¹åº”地名
                    textStyle: {
                        //字体颜色
                        color: '#797979'
                    }
                },
                emphasis: {
                    color: 'transparent', //悬浮背景
                    textStyle: {
                        color: '#fff'
                    }
                }
            }
        },
        visualMap: {
            type: 'piecewise',
            show: false,
            textStyle: {
                color: '#fff'
            },
            color: ['#68cc5c']
        },
        series: [
            {
                map: 'chinaMapOutline',
                silent: true,
                type: 'map',
                zoom: 1,
                label: {
                    normal: {
                        show: false,
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    emphasis: {
                        textStyle: {
                            color: '#fff'
                        }
                    }
                },
                top: '0%',
                roam: false,
                itemStyle: {
                    normal: {
                        areaColor: 'rgba(0,255,255,.02)',
                        borderColor: '#02a5f4',
                        borderWidth: 1.5,
                        shadowColor: '#02a5f4',
                        shadowOffsetX: 0,
                        shadowOffsetY: 4,
                        shadowBlur: 10,
                    },
                    emphasis: {
                        areaColor: 'transparent', //悬浮背景
                        textStyle: {
                            color: '#fff'
                        }
                    }
                }
            },
            {
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: geoMap,
                symbolSize:  function (val) {
                    return val[2];
                },
                rippleEffect: {
                    color: '#68cc5c'
                },
                showEffectOn: 'render',
                label: {
                    normal: {
                        show: true,
                        position: 'top',
                        formatter: '{b}',
                        color: '#ffffff',
                        fontSize: nowSize(15)
                    },
                    emphasis: {
                        show: false
                    }
                },
                itemStyle: {
                    emphasis: {
                        borderColor: '#fff',
                        borderWidth: 1
                    }
                }
            }
        ]
    };

    myChart.setOption( option );
    mapChart = {"chart": myChart, "option": option};
}

/**
 * èŽ·å–公司信息
 */
function ajaxCompany() {
    $.ajax({
        type: "POST",
        url: "../../visual/index-company",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
                companyList = result.data;
            }
        }
    });
}

/**
 * è¯·æ±‚获取动态信息
 */
function ajaxMsg() {
    $.ajax({
        type: "POST",
        url: "../../visual/index-info",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
                renderMsg(result.data);
            }
        },
        error: function (error) {

        }
    });
}

// æ›´æ–°åŠ¨æ€ä¿¡æ¯
function renderMsg(data) {
    var html = '';
    var flag = false;
    var num1 = '';
    var num7 = '';
    if (data != null && data.length > 0) {
        $.each(data, function (index, item) {
            var deptAreaId = item.deptAreaId;
            if(item.dailyTotal === 0){
                num1 = '当日一切正常';
            }else{
                num1 = '当日数量'+ item.dailyTotal + '个';
            }
            if(item.warnNum7 === 0){
                num7 = '近七天一切正常';
            }else{
                num7 = '近七天数量'+ item.warnNum7 + '个';
            }
            html += '<div class="panel-content-body-tr">';
            if (item.level && item.level === "01") {
                flag = true;
                // html += '<img src="../../static/images/visual/l1.png"  style="width:10%; height:85%;" alt="">';
                html += '<span class="body-item sp" style="color: #bc2032;" onclick=\"toAiHome('+'\''+ deptAreaId+'\'' + ')\" >' + item.deptAreaName + '</span>';
                html += '<span class="body-item sp" style="color: #bc2032;">' + num1 + '</span>';
                html += '<span class="body-item sp" style="color: #bc2032;">' + num7 + '</span>';
                // html += '<span class="body-item" style="color: #bc2032; flex: 0.3;">' + item.createTime + '</span>';
            } else if (item.level && item.level === "02") {
                flag = true;
                // html += '<img src="../../static/images/visual/l2.png" style="width:10%; height:85%;" alt="">';
                html += '<span class="body-item sp" style="color: #f37b3d;" onclick=\"toAiHome('+'\''+ deptAreaId+'\'' + ')\"  >' + item.deptAreaName + '</span>';
                html += '<span class="body-item sp" style="color: #f37b3d;">' + num1+ '</span>';
                html += '<span class="body-item sp" style="color: #f37b3d;">' + num7 + '</span>';
                // html += '<span class="body-item" style="color: #f37b3d; flex: 0.3;">' + item.createTime + '</span>';
            } else if (item.level && item.level === "03"){
                flag = true;
                // html += '<img src="../../static/images/visual/l3.png" style="width:10%; height:85%;" alt="">';
                html += '<span class="body-item sp"  onclick=\"toAiHome('+'\''+ deptAreaId+'\'' + ')\" >' + item.deptAreaName + '</span>';
                html += '<span class="body-item sp">' + num1 + '</span>';
                html += '<span class="body-item sp">' + num7 + '</span>';
                // html += '<span class="body-item" style="flex: 0.3;">' + item.createTime + '</span>';
            }else {
                flag = true;
                // html += '<img src="../../static/images/visual/l3.png" style="width:10%; height:85%;" alt="">';
                html += '<span class="body-item sp"  onclick=\"toAiHome('+'\''+ deptAreaId+'\'' + ')\" >' + item.deptAreaName + '</span>';
                html += '<span class="body-item sp">' + num1 + '</span>';
                html += '<span class="body-item sp">' + num7 + '</span>';
                // html += '<span class="body-item" style="flex: 0.3;">' + item.createTime + '</span>';
            }
            html += '</div>';
        })
    } else {
        if (deptAreaList != null && deptAreaList.length > 0) {
            $.each(deptAreaList, function (index, item) {
                html += '<div class="panel-content-body-tr">';
                html += '<span class="body-item sp">' + item.name + '</span>';
                html += '<span class="body-item sp">' + '当日分析一切正常' + '</span>';
                html += '<span class="body-item" style="flex: 0.3;">' + formatDate('mm/dd', new Date()) + '</span>';
                html += '</div>';
            });
        }
    }
    $("#panel-title").html('监管动态信息  <i class="dot"></i>');
    $("#inventoryInfo").html(html);
}

/**
 * è·³è½¬è‡³åŽå°é¢„警页面
 * @param deptAreaId
 */
function toAiHome(deptAreaId) {
    var url = "../home?t=WarnInfo&deptAreaId="+deptAreaId;
    window.parent.open(url, "_self");
}

/**
 * è¯·æ±‚获取库区相关信息
 */
function ajaxDeptArea() {
    // $.ajax({
    //     type: "POST",
    //     url: "../../visual/index-dept-area",
    //     dataType: "json",
    //     contentType: "application/json;charset=UTF-8",
    //     data: JSON.stringify({
    //         "companyId": companyId
    //     }),
    //     success: function (result) {
    //         if (result.code == "0000") {
    //             deptAreaAllList = result.data;
    //             getChangeDeptArea(null);
    //         }
    //     },
    //     error: function (error) {
    //
    //     }
    // });

    //加载库区地图
    geoMap = updateDeptMap();
    renderMap();
}

function updateDeptMap() {
    var points = [];
    $.each(deptList, function(index, item) {
        var val = [];
        var name = '';
        // if(index == deptNum){
        //     name = item.name;
        //     val = [item.lon, item.lat, 17];
        // }else {
            val = [item.jd, item.wd, 8];
        // }
        points.push({
            name: name,
            value: val
        });
    });
    return points;
}

/* ---------- èŽ·å–要切换库区的数据信息 ---------- */
function getChangeDeptArea(id) {
    deptAreaList = [];
    index1 = 0;
    clearInterval(timer1);

    if (id) {
        if (id === "511400") {
            deptAreaList = deptAreaAllList;
        } else {
            if (deptAreaAllList != null && deptAreaAllList.length > 0) {
                $.each(deptAreaAllList, function (index, item) {
                    if (id.length > 6 && id == item.deptCompany) {
                        deptAreaList.push(item);
                    }
                    if (id.length == 6 && id == item.deptCounty) {
                        deptAreaList.push(item);
                    }
                })
            }
        }
    } else {
        deptAreaList = deptAreaAllList;
    }

    deptAreaSwitch();
}

/* ---------- åº“区定时切换 ---------- */
function deptAreaSwitch() {
    timer1 = setInterval(function () {
        if (index1 == deptAreaList.length) {
            index1 = 0;
        }

        renderDeptArea();

        index1 += 1;

    }, 3000);
}

// æ›´æ–°åº“区信息
function renderDeptArea() {

    if (deptAreaList == null || deptAreaList.length <= 0) {
        return;
    }

    $("#cityAndCounty").html(deptAreaList[index1].deptCityName + "-" + deptAreaList[index1].deptCountyName);
    $("#deptAreaName").html(deptAreaList[index1].name);
    $("#depotNum").html(deptAreaList[index1].depotNum == null ? "0" : deptAreaList[index1].depotNum);
    $("#depotOilNum").html(deptAreaList[index1].depotOilNum == null ? "0" : deptAreaList[index1].depotOilNum);

    if (deptAreaList[index1].storageStr.length > 9
        || deptAreaList[index1].oilStorageStr.length > 9
        || deptAreaList[index1].areaStr.length > 9) {
        $("#foodNum").css("font-size", "28px");
        $("#oilNum").css("font-size", "28px");
        $("#area").css("font-size", "28px");
    } else if(deptAreaList[index1].storageStr.length > 5
        || deptAreaList[index1].oilStorageStr.length > 5
        || deptAreaList[index1].areaStr.length > 5){
        $("#foodNum").css("font-size", "30px");
        $("#oilNum").css("font-size", "30px");
        $("#area").css("font-size", "30px");
    } else {
        $("#foodNum").css("font-size", "46px");
        $("#oilNum").css("font-size", "46px");
        $("#area").css("font-size", "46px");
    }
    $("#foodNum").html(deptAreaList[index1].storageStr);
    $("#oilNum").html(deptAreaList[index1].oilStorageStr);
    $("#area").html(deptAreaList[index1].areaStr);

    if (deptCode) {
        $("#" + deptCode).removeClass("kuqu-h");
    }
    deptCode = deptAreaList[index1].deptCounty;
    $("#" + deptCode).addClass("kuqu-h");
}

/**
 * è¯·æ±‚获取相关数量信息
 */
function ajaxFoodNum() {
    $.ajax({
        type: "POST",
        url: "../../visual/index-food-number",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
                var data = result.data;
                renderFoodNum(data);
            }
        },
        error: function (error) {

        }
    });
}

// æ›´æ–°åº“区信息
function renderFoodNum(data) {

    if (!data) {
        return;
    }

    /*----- ç›‘管库点信息 -----*/
    $("#companyNum").html(data.companyNum);
    $("#deptAreaNum").html(data.deptAreaNum);
    $("#depotSum").html(data.depotNum);

    /*----- ç›‘管数量信息 -----*/
    if (data.foodSum.length > 8 || data.oilSum.length > 8) {
        $("#foodSum").css("font-size", "32px");
        $("#oilSum").css("font-size", "32px");
    }
    $("#foodSum").html(data.foodSum);
    $("#oilSum").html(data.oilSum);

    if (data.goodsFoodSum.length > 8 || data.goodsOilSum.length > 8) {
        $("#goodsFoodSum").css("font-size", "32px");
        $("#goodsOilSum").css("font-size", "32px");
    }
    $("#goodsFoodSum").html(data.goodsFoodSum);
    $("#goodsOilSum").html(data.goodsOilSum);


    /*----- åˆ†å“ç§æŸ±çŠ¶å›¾ -----*/
    if (data.xaxis.length > 0 && data.seriesData.length > 0) {
        var hisFoodVariety = hisVarietyChart;
        hisFoodVariety.option.xAxis.data = data.xaxis;
        hisFoodVariety.option.series[0].data = data.seriesData;
        hisFoodVariety.chart.setOption(hisFoodVariety.option, true);
        hisVarietyChart = hisFoodVariety;
    }

    /*----- é¥¼å›¾ -----*/
    // å“ç§ -- ç²®é£Ÿ
    if (data.varietyChartPie.length > 0) {
        var varietyChart = pieVarietyChart;
        varietyChart.option.series[0].data = data.varietyChartPie;
        varietyChart.chart.setOption(varietyChart.option, true);
        pieVarietyChart = varietyChart;
    }
    // æ€§è´¨ -- ç²®é£Ÿ
    if (data.typeChartPie.length > 0) {
        var typeChart = pieTypeChart;
        typeChart.option.series[0].data = data.typeChartPie;
        typeChart.chart.setOption(typeChart.option, true);
        pieTypeChart = typeChart;
    }
    // ç­‰çº§ -- ç²®é£Ÿ
    if (data.levelChartPie.length > 0) {
        var levelChart = pieLevelChart;
        levelChart.option.series[0].data = data.levelChartPie;
        levelChart.chart.setOption(levelChart.option, true);
        pieLevelChart = levelChart;
    }
    // å¹´ä»½ -- ç²®é£Ÿ
    if (data.yearChartPie.length > 0) {
        var yearChart = pieYearChart;
        yearChart.option.series[0].data = data.yearChartPie;
        yearChart.chart.setOption(yearChart.option, true);
        pieYearChart = yearChart;
    }
    // åŒºåŸŸ -- ç²®é£Ÿ
    if (data.areaChartPie.length > 0) {
        var areaChart = pieAreaChart;
        areaChart.option.series[0].data = data.areaChartPie;
        areaChart.chart.setOption(areaChart.option, true);
        pieAreaChart = areaChart;
    }

    // ç²®é£Ÿç›‘管数量切换
    foodNumSwitch();
    // ç²®é£Ÿé¥¼å›¾åˆ‡æ¢
    pieChartSwitch();
}

/* ---------- ç²®é£Ÿæ•°é‡ç›‘管切换 ---------- */
function foodNumSwitch() {
    $(".lb-body .right-topInfo-jg").eq(0).show().siblings().hide();
    StartLunbo();

    $(".lb-tab").hover(function () {
        clearInterval(timer2);
        index2 = $(this).index();
        ShowPicTab();
    }, function () {
        StartLunbo();
    });

    $(".lb-btn1").click(function () {
        clearInterval(timer2);
        index2--;
        if (index2 == -1) {
            index2 = number2 - 1;
        }

        ShowPicTab();
        StartLunbo();
    });

    $(".lb-btn2").click(function () {
        clearInterval(timer2);
        index2++;
        if (index2 == number2) {
            index2 = 0;
        }
        ShowPicTab();
        StartLunbo();
    });
}

function ShowPicTab() {
    if (index2 === 0) {
        $("#foodNumTitle").html("储备粮油");
    } else if (index2 === 1) {
        $("#foodNumTitle").html("商品粮油");
    }
    // else if (index2 === 2) {
    //     $("#foodNumTitle").html("小包装粮油");
    // }
    $(".lb-body .right-topInfo-jg").eq(index2).fadeIn(300).siblings().fadeOut(300);
    $(".lb-tab").eq(index2).addClass("bg").siblings().removeClass("bg");
}

function StartLunbo() {
    timer2 = setInterval(function () {
        index2++;
        if (index2 >= number2) {
            index2 = 0;
        }
        ShowPicTab();
    }, 3000);
}

/* ---------- ç²®é£Ÿé¥¼å›¾åˆ‡æ¢ ---------- */
function pieChartSwitch() {
    $(".tubiao-Carousel .stats-chart-box").eq(0).show().siblings().hide();
    StartCarousel();

    $(".carousel-tab").hover(function () {
        clearInterval(timer3);
        index3 = $(this).index();
        ShowTubiao();

    }, function () {
        StartCarousel();
    });

    $(".carousel-btn1").click(function () {
        clearInterval(timer3);
        index3--;
        if (index3 == -1) {
            index3 = number3 - 1;
        }

        ShowTubiao();
        StartCarousel();
    });

    $(".carousel-btn2").click(function () {
        clearInterval(timer3);
        index3++;
        if (index3 == number3) {
            index3 = 0;
        }
        ShowTubiao();
        StartCarousel();
    });
}

function ShowTubiao() {
    if (index3 === 0) {
        $("#pieCharTitle").html("粮食数量统计(吨)");
    } else if (index3 === 1) {
        $("#pieCharTitle").html("油脂数量统计(吨)");
    }
    $(".tubiao-Carousel .stats-chart-box").eq(index3).fadeIn(300).siblings().fadeOut(300);
    $(".carousel-tab").eq(index3).addClass("bg").siblings().removeClass("bg");
}

function StartCarousel() {
    timer3 = setInterval(function () {
        index3++;
        if (index3 >= number3) {
            index3 = 0;
        }
        ShowTubiao();
    }, 3000);
}

// åˆ·æ–°æ—¶é—´
function initTime() {
    setInterval(function () {
        $("#navBarDate").html(formatDate('mm月dd日', new Date()));
        $("#navBarTime").html(formatDate('HH:MM:SS', new Date()));
        $("#navBarWeek").html(getWeekDate());
    }, 1000);
}

/**
 * åˆå§‹åŒ–屏幕大小
 */
function initScrollbar() {

    if (pieVarietyChart) {
        pieVarietyChart.resize();
    }

    if (pieTypeChart) {
        pieTypeChart.resize();
    }

    if (pieLevelChart) {
        pieLevelChart.resize();
    }

    if (pieYearChart) {
        pieYearChart.resize();
    }

    if (pieAreaChart) {
        pieAreaChart.resize();
    }

    if (hisVarietyChart) {
        hisVarietyChart.resize();
    }

    setInterval(function () {
        if (!hasScrollbar()) {
            document.getElementById('inventoryInfoBox').scrollTop = 0;
        } else {
            if (document.getElementById('inventoryInfoBox').scrollTop >= (document.getElementById('inventoryInfo').clientHeight - document.getElementById('inventoryInfoBox').clientHeight)) {
                document.getElementById('inventoryInfoBox').scrollTop = 0;
            } else {
                document.getElementById('inventoryInfoBox').scrollTop++;
            }
        }
    }, 60);
}

/**
 * åˆ¤æ–­åº•éƒ¨æ˜¯å¦å‡ºçŽ°æ»šåŠ¨æ¡
 *
 * @return {boolean}
 */
function hasScrollbar() {
    return document.getElementById('inventoryInfo').clientHeight > document.getElementById('inventoryInfoBox').clientHeight;
}

// åˆå§‹åŒ–图表
function initChart() {

    /* åº“存图表加载 */
    allInventoryChartLoad(
        ['小麦', '玉米', '稻谷', '成品粮',  '成品油', '其他'],
        [1000, 1200, 1500, 1300, 1100, 1600]
    );

    /* å“ç§ - ç²®é£Ÿ */
    pieChartLoad(
        [
            {value: 0, name: '稻谷'},
            {value: 0, name: '玉米'},
            {value: 0, name: '小麦'}
        ],
        'pieVarietyChart'
    );
    /* æ€§è´¨ - ç²®é£Ÿ */
    pieChartLoad(
        [
            {value: 0, name: '省级储备'},
            {value: 0, name: '市级储备'},
            {value: 0, name: '县级储备'}
        ],
        'pieTypeChart'
    );
    /* ç­‰çº§ - ç²®é£Ÿ */
    pieChartLoad(
        [
            {value: 0, name: '一等'},
            {value: 0, name: '二等'},
            {value: 0, name: '三等'},
            {value: 0, name: '四等'},
            {value: 0, name: '五等'},
            {value: 0, name: '等外'}
        ],
        'pieLevelChart'
    );
    /* å¹´ä»½ - ç²®é£Ÿ */
    pieChartLoad(
        [
            {value: 0, name: '2019'},
            {value: 0, name: '2020'},
            {value: 0, name: '2021'},
            {value: 0, name: '2022'},
            {value: 0, name: '2023'}

        ],
        'pieYearChart'
    );
    /* åœ°åŸŸ - ç²®é£Ÿ */
    pieChartLoad(
        [
            {value: 0, name: '2019'},
            {value: 0, name: '2020'},
            {value: 0, name: '2021'},
            {value: 0, name: '2022'},
            {value: 0, name: '2023'}
        ], 'pieAreaChart'
    );
}

/**
 * æŸ±çŠ¶å›¾åŠ è½½
 *
 * @param names
 * @param data
 */
function allInventoryChartLoad(names, data) {
    var dom = document.getElementById('allInventoryChart');
    var myChart = echarts.init(dom);

    var options = {
        grid: {
            left: '2%',
            right: '1%',
            bottom: '1%',
            top: '15%',
            containLabel: true
        },
        tooltip: {
            show: true,
        },
        xAxis: {
            type: 'category',
            // ç½‘格样式
            splitLine: {
                show: false,
            },
            axisLine: {
                show: true,
                lineStyle: {
                    color: "#39c9ff"
                }
            },
            axisTick: {
                show: false,
            },
            axisLabel: {
                textStyle: {
                    color: '#ffffff',
                    fontSize: nowSize(16),
                },
                interval: 0,
                margin: nowSize(15),
            },
            data: names,
        },
        yAxis: {
            type: 'value',
            // ç½‘格样式
            splitLine: {
                show: false,
            },
            axisLine: {
                show: false,
            },
            axisTick: {
                show: false,
            },
            axisLabel: {
                show: false,
            },
        },
        series: [{
            name: '',
            data: data,
            type: 'bar',
            barWidth: '40%',
            label: {
                show: true,
                position: 'top',
                color: '#ffffff',
                fontSize: nowSize(12),
                distance: 0,
                lineHeight: nowSize(25),
            },
            // showBackground: false,
            // backgroundStyle: {
            // color: 'rgba(16,52,94,0.41)',
            // },
            itemStyle: {
                normal: {
                    color: function (params) {
                        var colorList = [
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#ff5600'}, {offset: 1, color: '#f27f44'}]
                            ),
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#ffb335'}, {offset: 1, color: '#ffcc77'}]
                            ),
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#08e53e'}, {offset: 1, color: '#59ff81'}]
                            ),
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#02a5f4'}, {offset: 1, color: '#60cbff'}]
                            ),
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#0a43bc'}, {offset: 1, color: '#3571f0'}]
                            ),
                            new echarts.graphic.LinearGradient(
                                0, 1, 0, 0,
                                [{offset: 0, color: '#af1f2e'}, {offset: 1, color: '#ef3476'}]
                            )
                        ];

                        return colorList[params.dataIndex]
                    }
                }
            }
        }]
    };
    myChart.setOption(options);
    hisVarietyChart = {"chart": myChart, "option": options};
}

/**
 * é¥¼å›¾åŠ è½½
 *
 * @param obj
 * @param id
 */
function pieChartLoad(data, id) {
    var dom = document.getElementById(id);
    var pieChart = echarts.init(dom);

    var option = {
        tooltip: {
            trigger: 'item'
        },
        legend: {
            bottom: 10,
            right: 10,
            left: 10,
            textStyle: {
                color: '#fff',
                fontSize: 12
            },
            itemWidth: 8,
            itemHeight: 8,
            icon: "circle",
            // ä½¿ç”¨å›žè°ƒå‡½æ•°
            formatter:function(name) {

                var than = option.series[0].data;
                var total = 0;
                var tarValue;
                for (var i = 0, l = than.length; i < l; i++) {
                    total += Number(than[i].value);
                    if (than[i].name == name) {
                        tarValue = Number(than[i].value);
                    }
                }
                var p = 0.0;
                if(total > 0){
                    p = (tarValue / total) * 100;
                }
                return name + " " + " " + p.toFixed(2) + "%";
            }
        },

        color: ['#26a2cf', '#d36b37', '#d49327', '#2d6be9', '#36b994', '#bc2032', '#d3614f'],
        series: [
            {
                name: '',
                type: 'pie',
                radius: ['20%', '50%'],
                center: ['center', '30%'],
                avoidLabelOverlap: false,
                itemStyle: {
                    borderRadius: 10,
                    borderColor: '#041636',
                    borderWidth: 8,
                },
                label: {
                    show: false,
                    color: '#fff',
                    formatter: '{b}\n{d}%',
                    fontSize: nowSize(16),
                    lineHeight: nowSize(25),
                },
                labelLine: {
                    show: true,
                    lineStyle: {
                        cap: 'round',
                    }
                },
                data: data
            }
        ]
    };

    pieChart.setOption(option);

    if (id === 'pieVarietyChart') {
        pieVarietyChart = {"chart": pieChart, "option": option};
    } else if (id === 'pieTypeChart') {
        pieTypeChart = {"chart": pieChart, "option": option};
    } else if (id === 'pieLevelChart') {
        pieLevelChart = {"chart": pieChart, "option": option};
    } else if (id === 'pieYearChart') {
        pieYearChart = {"chart": pieChart, "option": option};
    } else if (id === 'pieAreaChart') {
        pieAreaChart = {"chart": pieChart, "option": option};
    }
}

/**
 * æ¢ç®—方法
 *
 * @param val
 * @param initWidth
 * @return {number}
 */
nowSize = function (val) {
    var initWidth = 1920;
    return val * (nowClientWidth / initWidth);
};

/**
 * æ ¼å¼åŒ–日期
 *
 * @param fmt
 * @param date
 * @return {*}
 */
function formatDate(fmt, date) {
    var ret;
    var opt = {
        "Y+": date.getFullYear().toString(),        // å¹´
        "m+": (date.getMonth() + 1).toString(),     // æœˆ
        "d+": date.getDate().toString(),            // æ—¥
        "H+": date.getHours().toString(),           // æ—¶
        "M+": date.getMinutes().toString(),         // åˆ†
        "S+": date.getSeconds().toString()          // ç§’
        // æœ‰å…¶ä»–格式化字符需求可以继续添加，必须转化成字符串
    };
    for (var k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
        }
    }
    return fmt;
}

/**
 * èŽ·å–当前星期几
 */
function getWeekDate() {
    var now = new Date();
    var day = now.getDay();
    var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
    var week = weeks[day];
    return week;
}

// å³ä¸‹è§’提醒信息
function showTip(msg) {
    layer.open({
        // type: 1,
        btn: null,
        title: "提示",
        skin: 'layui-layer-lan',
        content: msg,
        // offset: 'rb',
        offset: 'rt',
        time: 1500,
        area: ['250px', '120px'],
        anim: 1,
        // shade: false,
        shadeClose: true
    });
}

 fzzy-igdss-web/src/main/resources/static/group/map.js

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/static/group/mapList.js

¶Ô±ÈÐÂÎļþ
ÎļþÌ«´ó

 fzzy-igdss-web/src/main/resources/static/group/master.css

@@ -9,6 +9,7 @@
    font-family: DINCond-Bold;
    src: url('../fonts/DINCond-Bold.otf');
}

/*common*/

.i-icon {
@@ -30,7 +31,7 @@

.i-icon img,
.i-icon32 img {
    /*width: 100%;*/
    width: 100%;
    height: 100%;
    vertical-align: top;
}
@@ -42,10 +43,10 @@

.container {
    overflow: hidden;
/*    height: 1080px;
    width: 1920px;*/
    height: 1080px;
    width: 1920px;
    position: relative;
    background: url(../group/img/i-body.png) center top no-repeat;
    background: url(../img/web/group/i-body.png) center top no-repeat;
    background-size: 100% 100%;
    padding-right: 0;
    padding-left: 0;
@@ -55,7 +56,7 @@
.i-top {
    height: 140px;
    width: 100%;
    background: url(../group/img/i-top-bg.png) center top no-repeat;
    background: url(../img/web/group/i-top-bg.png) center top no-repeat;
    background-size: 100% 100%;
    position: relative;
}
@@ -106,14 +107,14 @@
.i-nav2,
.i-nav3,
.i-nav4 {
    background: url(../group/img/i-navBg-l.png) no-repeat;
    background: url(../img/web/group/i-navBg-l.png) no-repeat;
    left: 50%;
}

.i-nav5,
.i-nav6,
.i-nav7 {
    background: url(../group/img/i-navBg-r.png) no-repeat;
    background: url(../img/web/group/i-navBg-r.png) no-repeat;
    right: 50%;
}

@@ -124,7 +125,7 @@
.i-nav2:hover,
.i-nav3:hover,
.i-nav4:hover{
    background: url(../group/img/i-navBg-l_on.png) no-repeat;
    background: url(../img/web/group/i-navBg-l_on.png) no-repeat;
    left: 50%;
}
.i-nav5.active,
@@ -133,7 +134,7 @@
.i-nav5:hover,
.i-nav6:hover,
.i-nav7:hover{
    background: url(../group/img/i-navBg-r_on.png) no-repeat;
    background: url(../img/web/group/i-navBg-r_on.png) no-repeat;
    right: 50%;
}

@@ -213,7 +214,7 @@
    position: relative;
    width: 100%;
    height: 185px;
    background: url("../group/img/left-box1.png") no-repeat;
    background: url("../img/web/group/left-box1.png") no-repeat;
    background-size: 100% 100%;
    margin-bottom: 18px;
    padding: 36px 20px 8px 20px;
@@ -235,13 +236,14 @@
    background-size: 100% 100%;
}


.panel-title  .dot {
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align:middle;
    margin:-2px 0 0 5px;
    background: url("../group/img/icon_dot.png") no-repeat;
    background: url("../img/web/group/icon_dot.png") no-repeat;
    -webkit-animation: title 2.5s ease-in-out infinite;
    animation: title 2.5s ease-in-out infinite;
}
@@ -262,7 +264,7 @@
    height: 90px;
    width: 481px;
    overflow: hidden;
    background: url(../group/img/left-m1-bg.png) no-repeat;
    background: url(../img/web/group/left-m1-bg.png) no-repeat;
    margin-top: 35px;
}

@@ -311,7 +313,7 @@


.left-m2 {
    background: url("../group/img/left-box2.png") no-repeat;
    background: url("../img/web/group/left-box2.png") no-repeat;
    width: 100%;
    height: 362px;
    box-sizing: border-box;
@@ -325,7 +327,7 @@
    width: 100%;
    height: 31px;
    line-height: 31px;
    background: url("../group/img/left-m2-bg.png") no-repeat;
    background: url("../img/web/group/left-m2-bg.png") no-repeat;
    background-size: 100% 100%;
    display: flex;
    font-size: 14px;
@@ -381,7 +383,7 @@
    position: relative;
    width: 100%;
    height: 328px;
    background: url("../group/img/left-box3.png") no-repeat;
    background: url("../img/web/group/left-box3.png") no-repeat;
    background-size: 100% 100%;
    margin-bottom: 1vw;
}
@@ -430,14 +432,18 @@
}

.right-map>img {
    width: 700px;
    height: 540px;
    /* width: 700px;
    height: 540px; */
    width: 350px;
    height: 627px;
    margin-top: -40px;
}

.right-map-item {
    position: absolute;
    text-align: center;
    z-index: 3;
/*     z-index: 3; */
    cursor: pointer;
}

.right-map-item p {
@@ -447,32 +453,31 @@
}

.right-map-item1 {
    left: 420px;
    top: 55px;
    left: 386px;
    top: 59px;
}

.right-map-item2 {
    left: 505px;
    top: 95px;
    left: 385px;
    top: 202px;
}

.right-map-item3 {
    left: 250px;
    top: 180px;
    left: 368px;
    top: 275px;
}
.right-map-item04 {
    left: 340px;
    top: 115px;
    left: 357px;
    top: 320px;
}

.right-map-item4 {
    left: 388px;
    top: 170px;
    left: 382px;
    top: 349px;
}

.right-map-item5 {
    left: 575px;
    top: 200px;
    left: 435px;
    top: 370px;
}

.right-map-item6 {
@@ -481,15 +486,23 @@
}

.right-map-item7 {
    left: 130px;
    top: 420px;
    left: 283px;
    top: 351px;
}

.right-map-item8{
    left: 295px;
    top: 428px;
}
.right-map-item9{
    left: 387px;
    top: 451px;
}
/* åœ°å›¾å¼¹çª— */

.right-map .map-lay{
    width:280px;
    height:186px;
    background-image:url(../group/img/sup-popBg3.png);
    background-image:url(../img/web/group/sup-popBg3.png);
    background-repeat:no-repeat;
    background-size:100% 100%;
    position: absolute;
@@ -504,7 +517,7 @@
.right-map .map-lay .close{
    width:10px;
    height:10px;
    background:url(../group/img/icon_close.png) no-repeat;
    background:url(../img/web/group/icon_close.png) no-repeat;
    background-size:100% 100%;
    float:right;
    margin:-5px 20px 0 0 ;
@@ -520,12 +533,12 @@
    text-align:left;
    overflow:hidden;
    text-overflow: ellipsis;
    background:url(../group/img/dbx1.png) no-repeat left bottom;
    background:url(../img/web/group/dbx1.png) no-repeat left bottom;
    background-size:100% 1px;
    white-space:nowrap;
}
.right-map .map-lay  li:last-child{
    background:none;.right-map-item3
    background:none;
}
.right-map-item04 .map-lay{
    top:8px;
@@ -533,7 +546,7 @@
}

.right-map-item3 .map-lay,.right-map-item5 .map-lay,.right-map-item6 .map-lay{
    background-image:url(../group/img/sup-popBg1.png);
    background-image:url(../img/web/group/sup-popBg1.png);
    top:-138px;
    left:-250px;
}
@@ -541,10 +554,11 @@
    margin:0;
}
.right-map-item7 .map-lay{
    background-image:url(../group/img/sup-popBg2.png);
    background-image:url(../img/web/group/sup-popBg2.png);
    top:-148px;
    left:-115px;
}


.right-map .map-lay  li a{
    color:#fff
@@ -557,46 +571,36 @@
    display: inline-block;
    height: 50px;
    width: 50px;
    background: url("../group/img/icon-dian.png") no-repeat;
    z-index:0;
    background: url("../img/web/group/icon-dian.png") no-repeat;
    -webkit-animation: title 2.5s ease-in-out infinite;
    animation: title 2.5s ease-in-out infinite;
}

.xianqu {
    background: url("../group/img/icon-dian.png") no-repeat;
}
/*.xianqu {*/
/*    background: url("../img/web/group/icon-dian.png") no-repeat;*/
/*}*/

.right-map-item:hover .xianqu{
    background: url("../group/img/icon-dian-h.png") no-repeat;
}
/*.right-map-item:hover .xianqu{*/
/*    background: url("../img/web/group/icon-dian-h.png") no-repeat;*/
/*}*/

.gongsi{
    background: url("../group/img/icon-gongsi.png") no-repeat;
}
/*.gongsi{*/
/*    background: url("../img/web/group/icon-gongsi.png") no-repeat;*/
/*}*/

.right-map-item:hover .gongsi{
    background: url("../group/img/icon-gongsi-h.png") no-repeat;
}
/*.right-map-item:hover .gongsi{*/
/*    background: url("../img/web/group/icon-gongsi-h.png") no-repeat;*/
/*}*/

.gongsi1{
    background: url("../group/img/icon-gongsi1.png") no-repeat;
}
/*.kuqu{*/
/*    background: url("../img/web/group/icon-kuqu.png") no-repeat;*/
/*}*/

.right-map-item:hover .gongsi1{
    background: url("../group/img/icon-gongsi1-h.png") no-repeat;
}
/*.right-map-item:hover .kuqu{*/
/*    background: url("../img/web/group/icon-kuqu-h.png") no-repeat;*/
/*}*/

.kuqu{
    background: url("../group/img/icon-kuqu.png") no-repeat;
}

.kuqu-h{
    background: url("../group/img/icon-kuqu-h.png") no-repeat;
}

.right-map-item:hover .kuqu{
    background: url("../group/img/icon-kuqu-h.png") no-repeat;
}

@keyframes title {
    from {
@@ -636,7 +640,7 @@
    position: relative;
    width: 100%;
    height: 185px;
    background: url("../group/img/left-box1.png") no-repeat;
    background: url("../img/web/group/left-box1.png") no-repeat;
    background-size: 100% 100%;
    margin-bottom: 18px;
    padding: 36px 20px 8px 20px;
@@ -682,7 +686,7 @@
}

.right-topInfo-box2 {
    background: url("../group/img/left-box2.png") no-repeat;
    background: url("../img/web/group/left-box2.png") no-repeat;
    width: 100%;
    height: 362px;
    box-sizing: border-box;
@@ -704,7 +708,7 @@
    height: 90px;
    margin: 20px auto;
    overflow: hidden;
    background: url("../group/img/right-m2-bg.png") no-repeat;
    background: url("../img/web/group/right-m2-bg.png") no-repeat;
    background-size: 100% 100%;
}

@@ -748,7 +752,7 @@


.right-bottom {
    background: url("../group/img/bottom-box.png") no-repeat;
    background: url("../img/web/group/bottom-box.png") no-repeat;
    width: 1320px;
    height: 328px;
    box-sizing: border-box;
@@ -757,7 +761,7 @@
}

.bottom-container .panel-content .stats-chart-box {
    display: inline-block;
    /* display: inline-block; */
    vertical-align: top;
    height: 100%;
    width: 100%;
@@ -769,11 +773,11 @@
    width: 158px;
    height: 36px;
    line-height: 36px;
    background: url("../group/img/bottom-titbg.png") no-repeat;
    background: url("../img/web/group/bottom-titbg.png") no-repeat;
    background-size: 100% 100%;
    font-size: 18px;
    color: #ffffff;
    margin-top: 10px;
    margin-top: 2px;
}


@@ -782,7 +786,7 @@
    vertical-align: top;
    height: 100%;
    width: calc(100% / 5);
    background: url("../group/img/bg-line.png") right bottom no-repeat;
    background: url("../img/web/group/bg-line.png") right bottom no-repeat;
    box-sizing: border-box;
    text-align: center;
    float: left;
@@ -796,8 +800,9 @@
    width: 100%;
    height: calc(100% - 36px);
}


.chart-box{
    margin-top: -15px;
}

/* data */
.data-top {
@@ -810,7 +815,7 @@
    position: relative;
    width: 529px;
    height: 358px;
    background: url("../group/img/data-left-boxBg.png") no-repeat;
    background: url("../img/web/group/data-left-boxBg.png") no-repeat;
    background-size: 100% 100%;
    padding: 36px 20px 8px 20px;
    box-sizing: border-box;
@@ -863,7 +868,7 @@
    width: 135px;
    height: 30px;
    line-height: 30px;
    background: url("../group/img/select-bg.png") no-repeat;
    background: url("../img/web/group/select-bg.png") no-repeat;
    background-size: 100% 100%;
    color: #fff;
    text-align: center;
@@ -923,7 +928,7 @@
    left: 1px;
    width: 18px;
    height: 18px;
    background: url(../group/img/icon-duihao.png) no-repeat;
    background: url(../img/web/group/icon-duihao.png) no-repeat;
}


@@ -951,7 +956,7 @@
.data-top-btn:last-child{
    width: -webkit-calc(50% - 5px);
    width: calc(50% - 5px);

	
}

.data-top-btn:first-child{
@@ -960,13 +965,13 @@

.data-top-btn:first-child:active,
.data-top-btn:first-child:hover{
    background: url("../group/img/data-top-btn_03.png") no-repeat;
    background: url("../img/web/group/data-top-btn_03.png") no-repeat;
    background-size: 100% 100%;
}

.data-top-btn:last-child:active,
.data-top-btn:last-child:hover{
    background: url("../group/img/data-btn-h_04.png") no-repeat;
    background: url("../img/web/group/data-btn-h_04.png") no-repeat;
    background-size: 100% 100%;
}

@@ -979,7 +984,7 @@


.data-top-right {
    background: url(".../group/img/data-right-box.png") no-repeat;
    background: url("../img/web/group/data-right-box.png") no-repeat;
    width: 1320px;
    height: 358px;
    box-sizing: border-box;
@@ -989,7 +994,7 @@
}

.data-bottom {
    background: url("../group/img/data-bottom-box.png") no-repeat;
    background: url("../img/web/group/data-bottom-box.png") no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 486px;
@@ -1003,7 +1008,7 @@
    min-width: 100%;
    height: 448px;
    overflow: auto;

	
}

.data-tableBox::-webkit-scrollbar {
@@ -1027,8 +1032,9 @@
}

.data-table-hd{
    height: 72px;
    height: 36px;
    min-width: 100%;
    background: rgba(9, 70, 154, 0.6);
    border-radius: 10px;
    white-space: nowrap;
    display: inline-block;
@@ -1048,8 +1054,8 @@
    position: relative;
    line-height: 36px;
    display: inline-block;
    font-size: 15px;
    text-align: left;
    font-size: 18px;
    text-align: center;
    width: 80px;
    box-sizing: border-box;
    margin: 0 10px;
@@ -1091,7 +1097,7 @@
    white-space: nowrap;
    z-index: 3;
    text-align: center;
    background: url(../group/img/bottom-titbg.png) no-repeat;
    background: url(../img/web/group/bottom-titbg.png) no-repeat;
    background-size: 100% 100%;
    padding: 0 30px;
    box-sizing: border-box;
@@ -1113,7 +1119,7 @@
/* supervise */

.sup-body{
    background: url("../group/img/sup-body.png") no-repeat;
    background: url("../img/web/group/sup-body.png") no-repeat;
    width: 1869px;
    height: 853px;
    background-size: 100% 100%;
@@ -1163,7 +1169,7 @@
}

.sup-topInfo-kd .right-topInfo-kd-item p {

	
    font-size: 40px;
    line-height: 55px;
    font-weight: normal;
@@ -1193,7 +1199,7 @@
.sup-right{
    width: 381px;
    height: 853px;
    background: url("../group/img/sup-right2.png") no-repeat;
    background: url("../img/web/group/sup-right2.png") no-repeat;
    background-size: 100% 100%;
}

@@ -1207,12 +1213,12 @@
    height: 277px;
    margin-top: -138px;
    cursor: pointer;
    background: url("../group/img/sup-right-btn.png") no-repeat;
    background: url("../img/web/group/sup-right-btn-on.png") no-repeat;
    background-size: 100% 100%;
}

.sup-rightWrap.showOn .sup-right-btn{
    background: url("../group/img/sup-right-btn-on.png") no-repeat;
    background: url("../img/web/group/sup-right-btn.png") no-repeat;
    background-size: 100% 100%;
}

@@ -1284,6 +1290,8 @@
}




/* plan */
.plan-top-center,
.plan-top-left{
@@ -1295,7 +1303,7 @@
}

.plan-top-left{
    background: url(../group/img/plan-left-boxBg.png) no-repeat;
    background: url(../img/web/group/plan-left-boxBg.png) no-repeat;
    background-size: 100% 100%;
    padding: 36px 20px 2px 20px;
}
@@ -1310,7 +1318,7 @@

.plan-top-left .data-area-select{
    width: 236px;
    background: url("../group/img/select-bg-lang.png") no-repeat;
    background: url("../img/web/group/select-bg-lang.png") no-repeat;
    background-size: 100% 100%;
}

@@ -1337,7 +1345,7 @@

.plan-top-center{
    margin-left: 25px;
    background: url(../group/img/plan-center-boxBg.png) no-repeat;
    background: url(../img/web/group/plan-center-boxBg.png) no-repeat;
    background-size: 100% 100%;
    padding: 36px 30px 9px 30px;
}
@@ -1345,7 +1353,7 @@
.plan-center-top{
    height: 51px;
    line-height: 50px;
    background: url(../group/img/plan-center-top.png) center no-repeat;
    background: url(../img/web/group/plan-center-top.png) center no-repeat;
    background-size: 100% 100%;
    padding: 0 10px;
    margin-top: 7px;
@@ -1427,8 +1435,8 @@
    width: 80px;
    position: relative;
    display: table;


	
	
}
.plan-progress-group dt span{
    line-height: 24px;
@@ -1494,7 +1502,7 @@
    width: 922px;
    background-size: 100% 100%;
    height: 355px;
    background: url("../group/img/plan-right-box.png") no-repeat;
    background: url("../img/web/group/plan-right-box.png") no-repeat;
}

.plan-top-right .panel-content .stats-chart-box .chart-item{
@@ -1518,7 +1526,7 @@

.animate{
    -webkit-animation: animate-positive 2s;
    animation: animate-positive 2s;
    animation: animate-positive 2s;
}

@-webkit-keyframes animate-positive{
@@ -1526,7 +1534,7 @@
}

@keyframes animate-positive{
    0%{ width: 0; }
    0%{ width: 0; }
}


@@ -1559,13 +1567,13 @@
    height: 6px;
    margin: 0 3px;
    display: inline-block;
    background: url(../group/img/visual/lb-tab.png)  no-repeat;
    background: url(../img/web/group/lb-tab.png)  no-repeat;
}

.carousel-tab.bg,
.lb-tab.bg{
    width: 26px;
    background: url(../group/img/lb-tab-on.png)  no-repeat;
    background: url(../img/web/group/lb-tab-on.png)  no-repeat;
}

.lb-btn{
@@ -1608,4 +1616,14 @@
.tubiao-Carousel .stats-chart-box{
    position: absolute;
    width: 100%;
}
}











 fzzy-igdss-web/src/main/resources/static/group/pc-reset.css

@@ -28,11 +28,11 @@
    background: none;
}

/*html,*/
/*body {*/
/*    width: 1920px;*/
/*    height: 1080px;*/
/*}*/
html,
body {
    width: 1920px;
    height: 1080px;
}

h1,
h2,

 fzzy-igdss-web/src/main/resources/static/group/video.css

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1047 @@
@charset "utf-8";
html,body,div,h1,h2,h3,h4,h5,h6,ul,li,ol,dl,dt,dd,blockquote,pre,form,fieldset,table,th,td,span,p,label,input,select,textarea,header,hgroup,main,nav,section,article,aside,footer,
figure,figcaption,menu,button {
    padding: 0;
    margin: 0;
    text-decoration: none;
}

body {
    margin: 0px auto;
    padding: 0px;
    font-family: "微软雅黑", Arial, sans-serif;
    font-size: 14px;
    background-color: #04162d;

}

button {
    -webkit-appearance: none;
    border: 0;
    background: none;
    overflow: visible;
}

button,
select {
    text-transform: none;
}

ul,
li {
    list-style: none;
}

img {
    border: none;
    vertical-align: top;
    -ms-interpolation-mode: bicubic;
}

i,
em,
address,
th {
    font-style: normal;
    font-weight: normal;
}

td,
th {
    font-size: 14px;
    color: #666;
}

table {
    border: 0;
    border-collapse: collapse;
}

a {
    text-decoration: none;
}

a:link,
a:visited,
a:hover {
    text-decoration: none;
    outline: 0;
}

a:active,
a:focus {
    outline: none;
    star: expression(this.onFocus=this.blur());
}

p {
    font-size: 16px;
}

p.indent {
    text-indent: 2em;
}

q:before,
q:after {
    content: '';
}

/* æµ®åŠ¨ */
.fl {
    float: left;

}
.fr {
    float: right;

}
.fn {
    float: none;

}

/*---------------
  æ¸…-除-æµ®-动(clear)
  ----------------*/
.cl:after {
    clear: both;
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    overflow: hidden;
    content: ".";
    visibility: hidden;
}

.cl {
    zoom:1;
}

* html .cl {
    height: 1%;
}

/* æ˜¾ç¤º */

body .show {
    display: block !important;
}

a {
    color: #666;
}



@font-face {
    font-family: DINCond-Bold;
    src: url('../fonts/DINCond-Bold.otf');
}


/*index*/

.container {
    overflow: hidden;
    height: 1080px;
    width: 1920px;
    position: relative;
    background: url(../img/web/group/i-body.png) center top no-repeat;
    background-size: 100% 100%;
    padding-right: 0;
    padding-left: 0;
}


.i-top {
    height: 140px;
    width: 100%;
    background: url(../img/web/group/i-top-bg.png) center top no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.i-top-tit {
    height: 70px;
    text-align: center;
    color: #fff;
    font-size: 36px;
    line-height: 70px;
    font-weight: bold;
}


.i-top-p {
    color: #fff;
    font-size: 26px;
    text-align: center;
    width: 100%;
    font-weight: bold;
    margin-top: 5px;
    line-height: 60px;
}

.i-navBar {
    position: absolute;
    height: 34px;
    left: 0;
    right: 0;
    top: 33px;
    padding: 0 35px;
}


.i-navBar a {
    display: block;
    width: 164px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    color: #fff;
    font-size: 16px;
    position: absolute;
    top: 0;
}

.i-nav1,
.i-nav2,
.i-nav3,
.i-nav4 {
    background: url(../img/web/group/i-navBg-l.png) no-repeat;
    left: 50%;
}

.i-nav5,
.i-nav6,
.i-nav7 {
    background: url(../img/web/group/i-navBg-r.png) no-repeat;
    right: 50%;
}

.i-nav1.active,
.i-nav2.active,
.i-nav3.active,
.i-nav4.active,.i-nav1:hover,
.i-nav2:hover,
.i-nav3:hover,
.i-nav4:hover{
    background: url(../img/web/group/i-navBg-l_on.png) no-repeat;
    left: 50%;
}
.i-nav5.active,
.i-nav6.active,
.i-nav7.active,
.i-nav5:hover,
.i-nav6:hover,
.i-nav7:hover{
    background: url(../img/web/group/i-navBg-r_on.png) no-repeat;
    right: 50%;
}

.i-nav4 {
    margin-left: -432px;
}

.i-nav3 {
    margin-left: -586px;
}

.i-nav2 {
    margin-left: -740px;
}

.i-nav1 {
    margin-left: -894px;
}

.i-nav5 {
    margin-right: -432px;
}

.i-nav6 {
    margin-right: -586px;
}

.i-nav7 {
    margin-right: -740px;
}


.date-time-module {
    position: absolute;
    top: 15px;
    width: 180px;
    text-align: center;
    right: 30px;
    color: #ffffff;
    line-height: 3vw;
}

.i-top-date {
    width: 100%;
    line-height: 30px;
    font-size: 20px;
}

.i-top-date span {
    display: inline-block;
}


.date-time-module #navBarTime {
    font-size: 30px;
    line-height: 40px;
    font-family: Arial, Helvetica, sans-serif;
    display: block;

}



.i-main {
    padding: 10px 30px 0 30px;
    /* width: 1860px; */
}


.left-container {
    width: 430px;
    height: 100%;
    float: left;
}

.left-m1 {
    position: relative;
    width: 430px;
    height: 255px;
    background: url("../img/web/group/left-box1-monitor.png") no-repeat;
    background-size: 100% 100%;
    margin-bottom: 30px;
    padding: 36px 20px 8px 20px;
    box-sizing: border-box;
}

.panel-title {
    position: absolute;
    left: 20px;
    top: 0px;
    display: inline-block;
    width: 170px;
    height: 36px;
    line-height: 36px;
    font-size: 18px;
    color: #ffffff;
    box-sizing: border-box;

    background-size: 100% 100%;
}


.panel-title  .dot {
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align:middle;
    margin:-2px 0 0 5px;
    background: url("../img/web/group/icon_dot.png") no-repeat;
    -webkit-animation: title 2.5s ease-in-out infinite;
    animation: title 2.5s ease-in-out infinite;
}

.panel-content {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.left-m1 .panel-content>div {
    display: inline-block;
    vertical-align: top;
}

.left-m2 {
    position: relative;
    width: 430px;
    height: 610px;
    background: url("../img/web/group/left-box2-monitor.png") no-repeat;
    background-size: 100% 100%;
    padding: 56px 20px 20px 20px;
    box-sizing: border-box;
}


.left-m2 .panel-content .panel-content-head {
    width: 100%;
    height: 31px;
    line-height: 31px;
    background: url("../img/web/group/left-m2-bg.png") no-repeat;
    background-size: 100% 100%;
    display: flex;
    font-size: 14px;
    color: #91ceff;
    box-sizing: border-box;
}

.left-m2 .head-item,
.left-m2 .body-item {
    text-align: center;
}

.left-m2 .panel-content .panel-content-head .head-item {
    flex: 1;
}


.left-m2 .panel-content .panel-content-body {
    width: 100%;
    height: calc(100% - 2vw);
    box-sizing: border-box;
    overflow: hidden;
    overflow-y: auto;
}

.left-m2 .panel-content .panel-content-body::-webkit-scrollbar {
    width: 6px;
    background-color: rgba(51, 238, 255, 0.2);
}

.left-m2 .panel-content .panel-content-body::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(2, 160, 251, 0.3);
    background-color: rgba(2, 158, 249, 0.5);
    border-radius: 3px;
}

.left-m2 .panel-content .panel-content-body .panel-content-body-tr {
    width: 100%;
    height: 30px;
    line-height: 30px;
    display: flex;
    padding-top: 6px;
    padding-bottom: 5px;
    border-bottom: 1px solid #4c5354c7;
}

.left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item {
    flex: 1;
    font-size: 14px;
    color: #ffffff;
    user-select: none;
}


.panel-box1-item{
    width: 100%;
    height: 2.1vw;
    line-height: 2.1vw;
    font-size: 0.9vw;
    color: #fff;
    margin-top: 0.5vw;
    background: url("../img/web/group/bg_panel_1_item.png") no-repeat;
}

.panel-box1-title a{
    color: #fff;
}

.panel-box1-title a span{
    margin-left: 15px;
    font-family: '宋体';
    top: 2px;
}


.panel-box1-item p{
    height: 2.1vw;
    overflow: hidden;
}

.panel-box1-item p i{
    display: block;
    float: left;
    width: 2.1vw;
    height: 2.1vw;
}

.panel-box1-item p i img{
    width: 100%;
    height: 100%;
}

.right-container {
    float: right;
    height: 100%;
    width: 1410px;
}

.right-top {
    margin-bottom: 18px;
    width: 100%;
    overflow: hidden;
    height: 565px;
}

@keyframes title {
    from {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }

    to {
        opacity: 0.5;
    }
}

@-webkit-keyframes title {
    from {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }

    to {
        opacity: 0.5;
    }
}



.right-bottom {
    position: relative;
    width: 1415px;
    height: 895px;
    background: url("../img/web/group/bottom-box-monitor.png") no-repeat;
    background-size: 100% 100%;
    padding: 36px 20px 20px 20px;
    box-sizing: border-box;
}

.bottom-container .panel-content .stats-chart-box {
    /* display: inline-block; */
    vertical-align: top;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}

.chart-item-title {
    display: inline-block;
    width: 158px;
    height: 36px;
    line-height: 36px;
    background: url("../img/web/group/bottom-titbg.png") no-repeat;
    background-size: 100% 100%;
    font-size: 18px;
    color: #ffffff;
    margin-top: 10px;
}


.bottom-container .panel-content .stats-chart-box .chart-item {
    display: inline-block;
    vertical-align: top;
    height: 100%;
    width: calc(100% / 5);
    background: url("../img/web/group/bg-line.png") right bottom no-repeat;
    box-sizing: border-box;
    text-align: center;
    float: left;
}

.bottom-container .panel-content .stats-chart-box .chart-item:last-child {
    border-right: 0px;
}

.bottom-container .panel-content .stats-chart-box .chart-item .chart-box {
    width: 100%;
    height: calc(100% - 36px);
}


/* data */
.data-top {
    margin-bottom: 45px;
    width: 100%;
    height: 358px;
}

.data-top-left {
    position: relative;
    width: 529px;
    height: 358px;
    background: url("../img/web/group/data-left-boxBg.png") no-repeat;
    background-size: 100% 100%;
    padding: 36px 20px 8px 20px;
    box-sizing: border-box;
    float: left;
}


.data-top-left .right-topInfo-jg{
    margin-top: 30px;
}


.data-area{
    margin-top: 20px;
    padding: 0 5px;
}


.data-area-dl {
    height: 30px;
}

.data-area-dl dt,
.data-area-dl dd {
    float: left;
}

.data-area-dl dt{
    line-height: 28px;
    font-size: 18px;
    color: #fff;
    /* margin-right: 10px; */
}

.data-area-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    -khtml-appearance: none;
}

.data-area-select::-ms-expand {
    display: none;
}


.data-area-select {
    width: 135px;
    height: 30px;
    line-height: 30px;
    background: url("../img/web/group/select-bg.png") no-repeat;
    background-size: 100% 100%;
    color: #fff;
    text-align: center;
    padding-right: 30px;
    font-size: 16px;
    box-sizing: border-box;
    border: 0;
}

.data-area-select option{
    color: #000;
    line-height: 28px;
}

.data-checkBox{
    margin-top: 20px;
    padding: 0 0 0 5px;
}

.data-area-check-dd>span{
    color: #fff;
    display: inline-block;
    height: 20px;
    margin-left: 2px;
    font-size: 18px;
    line-height: 20px;
    margin-top: 5px;
}
.data-area-check-dd>span:first-child{
    margin-left: 0;
}
.regular-checkbox {
    display: none;
}

.regular-checkbox + label {
    border: 1px solid #38cbff;
    padding: 8px;
    display: inline-block;
    position: relative;
    float: left;
    margin-right: 3px;
    margin-top: 2px;
}


.regular-checkbox:checked + label {
    /* color: #99a1a7; */
}

.regular-checkbox:checked + label:after {
    content: '';
    display: block;
    font-size: 14px;
    position: absolute;
    top: -1px;
    left: 1px;
    width: 18px;
    height: 18px;
    background: url(../img/web/group/icon-duihao.png) no-repeat;
}


.data-top-btnBox{
    width: 100%;
    height: 58px;
    position: absolute;
    bottom: 1px;
    left: 0;
    right: 0;
    z-index: 3;
}

.data-top-btn{
    width: 50%;
    height: 57px;
    line-height: 57px;
    text-align: center;
    color: #fff;
    font-size: 24px;
    float: left;
    display: block;
    position: relative;
}
.data-top-btn:last-child{
    width: -webkit-calc(50% - 5px);
    width: calc(50% - 5px);
	
}

.data-top-btn:first-child{
    right: -1px;
}

.data-top-btn:first-child:active,
.data-top-btn:first-child:hover{
    background: url("../img/web/group/data-top-btn_03.png") no-repeat;
    background-size: 100% 100%;
}

.data-top-btn:last-child:active,
.data-top-btn:last-child:hover{
    background: url("../img/web/group/data-btn-h_04.png") no-repeat;
    background-size: 100% 100%;
}

.data-top-btn:first-child:active,
.data-top-btn:last-child:active{
    font-size: 26px;
}




.data-top-right {
    background: url("../img/web/group/data-right-box.png") no-repeat;
    width: 1320px;
    height: 358px;
    box-sizing: border-box;
    padding: 36px 20px 20px 20px;
    position: relative;
    float: right;
}

.data-bottom {
    background: url("../img/web/group/data-bottom-box.png") no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 486px;
    box-sizing: border-box;
    padding: 36px 15px 20px 10px;
    overflow: hidden;
    position: relative;
}

.data-tableBox{
    min-width: 100%;
    height: 448px;
    overflow: auto;
	
}

.data-tableBox::-webkit-scrollbar {
    width: 0px;
    background-color: rgba(51, 238, 255, 0.2);
}

.data-tableBox::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(2, 160, 251, 0.3);
    background-color: rgba(2, 158, 249, 0.5);
    border-radius: 3px;
}


.data-table{
    /* overflow: hidden; */
}
.data-table-top{
    height: 36px;
    margin-bottom: 16px;
}

.data-table-hd{
    height: 36px;
    min-width: 100%;
    background: rgba(9, 70, 154, 0.6);
    border-radius: 10px;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle;
}

.data-table-bd{
    height: 340px;
    /* overflow-x: hidden; */
    min-width: 100%;
    white-space: nowrap;
    box-sizing: border-box;
    /* padding-top: 15px; */
}

.data-table-hd-group{
    position: relative;
    line-height: 36px;
    display: inline-block;
    font-size: 18px;
    text-align: center;
    width: 80px;
    box-sizing: border-box;
    margin: 0 10px;
    vertical-align: middle;
}


.data-table-hd .data-table-hd-group{
    color: #91ceff;
}

.data-table-bd .data-table-hd-group{
    color: #fff;
    overflow: hidden;
}

.data-table-hd-group span{
    padding: 0 5px;
    display: inline-block;
    height: 36px;
    width: 80px;
    box-sizing: border-box;
    float: left;
    overflow: hidden;
}


.data-table-h{
    min-width: 158px;
    height: 36px;
    line-height: 36px;
    font-size: 18px;
    color: #fff;
    position: absolute;
    top: -53px;
    left: 50%;
    /* margin-left: -79px; */
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 3;
    text-align: center;
    background: url(../img/web/group/bottom-titbg.png) no-repeat;
    background-size: 100% 100%;
    padding: 0 30px;
    box-sizing: border-box;
}


.data-table-list{
    margin-top: 15px;
}

.data-table-list li{
    white-space: nowrap;
    /* margin-top: 10px; */
    line-height: 36px;
}



/* supervise */

.sup-body{
    background: url("../img/web/group/sup-body.png") no-repeat;
    width: 1869px;
    height: 853px;
    background-size: 100% 100%;
    box-sizing: border-box;
    padding: 36px 20px 20px 20px;
    position: relative;
    margin-top: 25px;
    overflow: hidden;
}


#map_container {
    width: 100%;
    height: 100%;
    margin: 0;
}

.animate{
    -webkit-animation: animate-positive 2s;
    animation: animate-positive 2s;
}

@-webkit-keyframes animate-positive{
    0%{ width: 0; }
}

@keyframes animate-positive{
    0%{ width: 0; }
}



/* index-xg */

.lb-body{
    overflow: hidden;
    margin-top: 20px;
    position: relative;
    height: 100px;
}
.lb-body .right-topInfo-jg{
    margin-top: 0;
    position: absolute;
    width: 100%;
}

.carousel-tabs,
.lb-tabs{
    height: 6px;
    text-align: center;
    width: 100%;
}

.carousel-tab,
.lb-tab{
    cursor: pointer;
    width: 22px;
    height: 6px;
    margin: 0 3px;
    display: inline-block;
    background: url(../img/web/group/lb-tab.png)  no-repeat;
}

.carousel-tab.bg,
.lb-tab.bg{
    width: 26px;
    background: url(../img/web/group/lb-tab-on.png)  no-repeat;
}

.lb-btn{
    width: 24px;
    height: 24px;
    background: rgba(2, 158, 249, 0.5);
    color: #fff;
    position: absolute;
    z-index: 9;
    top: 50%;
    margin-top: -12px;
    font-family: "宋体";
    text-align: center;
    line-height: 24px;
    font-weight: bold;
    cursor: pointer;
}

.carousel-btn1,
.lb-btn1{
    left: 20px;
}

.carousel-btn2,
.lb-btn2{
    right: 20px;
}

.lb-btn:hover{
    background: rgba(2, 158, 249, 1);
}


.tubiao-Carousel{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.tubiao-Carousel .stats-chart-box{
    position: absolute;
    width: 100%;
}


.right-videoWrap {
    overflow: hidden;
    flex: 1;
}

.right-video {
    width: 100%;
}

.right-video li {
    width: 49%;
    height: 400px;
    margin: 6px;
    float: left;
    position: relative;
}
.right-video li h4 {
    position: absolute;
    height: 1.5vw;
    line-height: 1.5vw;
    width: 8.5vw;
    display: block;
    background: url(../img/web/group/bg-jiankong-tit.png) no-repeat;
    background-size: 100% 100%;
    text-indent: 1vw;
    color: #fff;
    font-size: 0.8vw;
}

.video-box, .video-pic {
    width: 100%;
    height: 100%;
}

.video-box, .video-pic {
    width: 100%;
    height: 100%;
}
img {
    border: 0;
    vertical-align: middle;
    max-width: 100%;
}











 fzzy-igdss-web/src/main/resources/static/group/video.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1475 @@
var time;
var splitWin = 1;  //分屏数，默认4分屏
var deptCur = null; //当前库区
var cameraList = null;  //监控列表
var cameraIndex = -1;  //监控下标
var cameraTimer;     // åº“区定时
var selectTag = 0; //播放标签：0-自动轮播，1-手动选择
var windowsNum = 1; //播放窗口下标，手动选择模式下使用
var handCameraIndex = null;  //手动选择监控的下标
var gundongTimer;     //监控列表滚动定时器

var playUrl1 = null;
var videoId1 = null;
let webrtc1;
let mediaStream1;
var playUrl2 = null;
var videoId2 = null;
let webrtc2;
let mediaStream2;
var playUrl3 = null;
var videoId3 = null;
let webrtc3;
let mediaStream3;
var playUrl4 = null;
var videoId4 = null;
let webrtc4;
let mediaStream4;
var playUrl5 = null;
var videoId5 = null;
let webrtc5;
let mediaStream5;
var playUrl6 = null;
var videoId6 = null;
let webrtc6;
let mediaStream6;
var playUrl7 = null;
var videoId7 = null;
let webrtc7;
let mediaStream7;
var playUrl8 = null;
var videoId8 = null;
let webrtc8;
let mediaStream8;
var playUrl9 = null;
var videoId9 = null;
let webrtc9;
let mediaStream9;
var playUrl10 = null;
var videoId10 = null;
let webrtc10;
let mediaStream10;
var playUrl11 = null;
var videoId11 = null;
let webrtc11;
let mediaStream11;
var playUrl12 = null;
var videoId12 = null;
let webrtc12;
let mediaStream12;
var playUrl13 = null;
var videoId13 = null;
let webrtc13;
let mediaStream13;
var playUrl14 = null;
var videoId14 = null;
let webrtc14;
let mediaStream14;
var playUrl15 = null;
var videoId15 = null;
let webrtc15;
let mediaStream15;
var playUrl16 = null;
var videoId16 = null;
let webrtc16;
let mediaStream16;

$(function () {
    // åˆå§‹åŒ–页面
    initHtml();
});

// åˆå§‹åŒ–页面
function initHtml() {
    // æ—¶é—´
    initTime();

    //监控点信息适应滚动
    initScrollbar(60);
    //库区信息
    // renderDeptArea();
    //
    // renderCamera();
}


// æ¸²æŸ“库区信息
function renderDeptArea() {
    if (deptCur) {
        $("#deptName").html(deptCur.deptName);
        $("#deptAddress").html(deptCur.addr == null ? "---" : deptCur.addr);
        $("#cameraSum").html(deptCur.cameraSum == null ? "---" : deptCur.cameraSum);
        $("#cameraCn").html(deptCur.cameraCn == null ? "---" : deptCur.cameraCn);
        $("#cameraYw").html(deptCur.cameraYw == null ? "---" : deptCur.cameraYw);
        $("#cameraAf").html(deptCur.cameraAf == null ? "---" : deptCur.cameraAf);
    }
}

// æ¸²æŸ“监控列表
function renderCamera() {
    var html = '';
    if (cameraList != null && cameraList.length > 0) {
        var divcameraIndex = "";
        $.each(cameraList, function (index, item) {
            divcameraIndex = "divCamera" + index;
            html += '<div class="panel-content-body-tr" id="' + divcameraIndex + '" ondblclick="selectHand(' + index + ')">';
            html += '<span class="body-item" style="flex: 1.4">';
            html += item.name;
            html += '</span>';
            html += '<span class="body-item" style="flex: 0.6">';
            if (item.spjklx == "02") {
                html += '球机';
            } else {
                html += '枪机';
            }
            html += '</span></div>';
        })
    } else {
        html += '<div class="panel-content-body-tr">';
        html += '<span class="body-item" style="flex: 1.4">暂无数据</span>';
        html += '<span class="body-item" style="flex: 0.6"></span>';
        html += '</div>';
    }
    $("#inventoryInfo").html(html);
    if (selectTag == 0) {
        cameraSwitch1();
    }
}

/* ---------- ç›‘控切换 ---------- */
function cameraSwitch1() {
    clearInterval(cameraTimer);
    cameraSwitch2()
    //5分钟切换视频
    cameraTimer = setInterval(function () {
        cameraSwitch2()
    }, 60000);
}

function cameraSwitch2() {
    for (var i = 1; i <= splitWin; i++) {
        cameraIndex++;
        //播放视频
        startPlay(i);
    }
}

//视频播放-请求摄像头信息
/**
 *
 * @param cameraNum   æ‘„像头列表下标
 * @param windowsNum æ’­æ”¾çª—口下标
 */
function startPlay(windowsNum) {
    if (cameraIndex === cameraList.length) {
        cameraIndex = 0;
    }

    var data = cameraList[cameraIndex];
    if (!data) {
        $("#f" + splitWin + "_d" + windowsNum).html("未获取到摄像头播放信息！！");
        return;
    }
    if (data.urlIn) {
        if (windowsNum === 1) {
            playUrl1 = null;
            mediaStream1 = null;
            playUrl1 = cameraList[cameraIndex].urlIn;
            videoId1 = cameraList[cameraIndex].id;
            webRtcToPlay1();
        }else if (windowsNum === 2) {
            playUrl2 = null;
            mediaStream2 = null;
            playUrl2 = cameraList[cameraIndex].urlIn;
            videoId2 = cameraList[cameraIndex].id;
            webRtcToPlay2();
        }else if (windowsNum === 3) {
            playUrl3 = null;
            mediaStream3 = null;
            playUrl3 = cameraList[cameraIndex].urlIn;
            videoId3 = cameraList[cameraIndex].id;
            webRtcToPlay3();
        }else if (windowsNum === 4) {
            playUrl4 = null;
            mediaStream4 = null;
            playUrl4 = cameraList[cameraIndex].urlIn;
            videoId4 = cameraList[cameraIndex].id;
            webRtcToPlay4();
        }else if (windowsNum === 5) {
            playUrl5 = null;
            mediaStream5 = null;
            playUrl5 = cameraList[cameraIndex].urlIn;
            videoId5 = cameraList[cameraIndex].id;
            webRtcToPlay5();
        }else if (windowsNum === 6) {
            playUrl6 = null;
            mediaStream6 = null;
            playUrl6 = cameraList[cameraIndex].urlIn;
            videoId6 = cameraList[cameraIndex].id;
            webRtcToPlay6();
        }else if (windowsNum === 7) {
            playUrl7 = null;
            mediaStream7 = null;
            playUrl7 = cameraList[cameraIndex].urlIn;
            videoId7 = cameraList[cameraIndex].id;
            webRtcToPlay7();
        }else if (windowsNum === 8) {
            playUrl8 = null;
            mediaStream8 = null;
            playUrl8 = cameraList[cameraIndex].urlIn;
            videoId8 = cameraList[cameraIndex].id;
            webRtcToPlay8();
        }else if (windowsNum === 9) {
            playUr9 = null;
            mediaStream9 = null;
            playUrl9 = cameraList[cameraIndex].urlIn;
            videoId9 = cameraList[cameraIndex].id;
            webRtcToPlay9();
        }else if (windowsNum === 10) {
            playUrl10 = null;
            mediaStream10 = null;
            playUrl10 = cameraList[cameraIndex].urlIn;
            videoId10 = cameraList[cameraIndex].id;
            webRtcToPlay10();
        }else if (windowsNum === 11) {
            playUrl11 = null;
            mediaStream11 = null;
            playUrl11 = cameraList[cameraIndex].urlIn;
            videoId11 = cameraList[cameraIndex].id;
            webRtcToPlay11();
        }else if (windowsNum === 12) {
            playUrl12 = null;
            mediaStream12 = null;
            playUrl12 = cameraList[cameraIndex].urlIn;
            videoId12 = cameraList[cameraIndex].id;
            webRtcToPlay12();
        }else if (windowsNum === 13) {
            playUrl13 = null;
            mediaStream13 = null;
            playUrl13 = cameraList[cameraIndex].urlIn;
            videoId13 = cameraList[cameraIndex].id;
            webRtcToPlay13();
        }else if (windowsNum === 14) {
            playUrl14 = null;
            mediaStream14 = null;
            playUrl14 = cameraList[cameraIndex].urlIn;
            videoId14 = cameraList[cameraIndex].id;
            webRtcToPlay14();
        }else if (windowsNum === 15) {
            playUrl15 = null;
            mediaStream15 = null;
            playUrl15 = cameraList[cameraIndex].urlIn;
            videoId15 = cameraList[cameraIndex].id;
            webRtcToPlay15();
        }else if (windowsNum === 16) {
            playUrl16 = null;
            mediaStream16 = null;
            playUrl16 = cameraList[cameraIndex].urlIn;
            videoId16 = cameraList[cameraIndex].id;
            webRtcToPlay16();
        }
    } else {
        $("#f" + splitWin + "_d" + windowsNum).html("未获取到摄像头(" + data.name + ")播放信息！！");
    }
}

/**
 * åˆ†å±åˆ‡æ¢
 * @param tagNum  åˆ†å±æ•°
 */
function fenping(tagNum) {
    //重置切换前的分屏窗口
    reloadView(splitWin);

    //赋值当前分屏数
    splitWin = tagNum;

    //重置切换后的分屏窗口
    reloadView(splitWin);

    //切换分屏图标及页面
    if (tagNum == 1) {
        $("#f_1").attr("src", "/img/web/group/fp_1_active.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'block');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 4) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4_active.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'block');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 9) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9_active.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'block');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 16) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16_active.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'block');
    }
    //当前库区重新播放，监控列表播放下标重置为0
    cameraIndex = 0;
    clearInterval(cameraTimer);
    windowsNum = 1;
    //判断播放方式
    if (selectTag == 0) {
        cameraSwitch1();
    }
}

//重置4分屏和9分屏的各个播放窗口
function reloadView(num) {
    var html;
    for (var i = 1; i <= num; i++) {
        html = '';
        html += '<video className="video" id="video' + num + '_' + i + ' autoPlay="" muted="" playsInline=""></video>';
        $("#f" + num + "_d" + i).html(html);
    }
}

/**
 * æ‰‹åŠ¨é€‰æ‹©æ’­æ”¾
 * @param index é€‰æ‹©ç›‘控的监控列表下标
 */
function selectHand(index) {
    if (selectTag == 0) {

        //清除列表滚动，重新设置滚动时间
        clearInterval(gundongTimer);
        initScrollbar(1000 * 30);

        showTip("已切换手动播放模式！双击左侧列表监控进行播放！");

        windowsNum = 1;
        selectTag = 1;
        reloadView(splitWin);
    }

    if (windowsNum > splitWin) {
        windowsNum = 1;
    }
    cameraIndex = index;
    startPlay(windowsNum);
    windowsNum++;

    //清除上次选中效果，赋值新选中效果
    $("#divCamera" + handCameraIndex).removeClass("handSelect");
    $("#divCamera" + index).addClass("handSelect");
    handCameraIndex = index;
}

// åˆ·æ–°æ—¶é—´
function initTime() {
    setInterval(function () {
        $("#navBarDate").html(formatDate('mm月dd日', new Date()));
        $("#navBarTime").html(formatDate('HH:MM:SS', new Date()));
        $("#navBarWeek").html(getWeekDate());
    }, 1000);
}

/**
 * æ ¼å¼åŒ–日期
 *
 * @param fmt
 * @param date
 * @return {*}
 */
function formatDate(fmt, date) {
    var ret;
    var opt = {
        "Y+": date.getFullYear().toString(),        // å¹´
        "m+": (date.getMonth() + 1).toString(),     // æœˆ
        "d+": date.getDate().toString(),            // æ—¥
        "H+": date.getHours().toString(),           // æ—¶
        "M+": date.getMinutes().toString(),         // åˆ†
        "S+": date.getSeconds().toString()          // ç§’
        // æœ‰å…¶ä»–格式化字符需求可以继续添加，必须转化成字符串
    };
    for (var k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
        }
    }
    return fmt;
}

/**
 * èŽ·å–当前星期几
 */
function getWeekDate() {
    var now = new Date();
    var day = now.getDay();
    var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
    var week = weeks[day];
    return week;
}

//监控点信息滚动
function initScrollbar(num) {
    gundongTimer = setInterval(function () {
        if (!hasScrollbar()) {
            document.getElementById('inventoryInfoBox').scrollTop = 0;
        } else {
            if (document.getElementById('inventoryInfoBox').scrollTop >= (document.getElementById('inventoryInfo').clientHeight - document.getElementById('inventoryInfoBox').clientHeight)) {
                document.getElementById('inventoryInfoBox').scrollTop = 0;
            } else {
                document.getElementById('inventoryInfoBox').scrollTop++;
            }
        }
    }, num);
}

//判断底部是否出现滚动条
function hasScrollbar() {
    return document.getElementById('inventoryInfo').clientHeight > document.getElementById('inventoryInfoBox').clientHeight;
}

// å³ä¸‹è§’提醒信息
function showTip(msg) {
    layer.msg(msg);
}


/*============= webRtc视频播放1 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay1() {
    if (playUrl1) {
        mediaStream1 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream1;
        webrtc1 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc1.onsignalingstatechange = signalingstatechange1;

        webrtc1.ontrack = ontrack1
        let offer = await webrtc1.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc1.setLocalDescription(offer);
    }
}

function ontrack1(event) {
    mediaStream1.addTrack(event.track);
}

async function signalingstatechange1() {
    switch (webrtc1.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl1 + "?uuid=" + videoId1 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc1.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc1.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc1.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放2 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay2() {
    if (playUrl2) {
        mediaStream2 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream2;
        webrtc2 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc2.onsignalingstatechange = signalingstatechange2;

        webrtc2.ontrack = ontrack2
        let offer = await webrtc2.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc2.setLocalDescription(offer);
    }
}

function ontrack2(event) {
    mediaStream2.addTrack(event.track);
}

async function signalingstatechange2() {
    switch (webrtc2.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl2 + "?uuid=" + videoId2 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc2.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc2.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc2.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放3 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay3() {
    if (playUrl3) {
        mediaStream3 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream3;
        webrtc3 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc3.onsignalingstatechange = signalingstatechange3;

        webrtc3.ontrack = ontrack3
        let offer = await webrtc3.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc3.setLocalDescription(offer);
    }
}

function ontrack3(event) {
    mediaStream3.addTrack(event.track);
}

async function signalingstatechange3() {
    switch (webrtc3.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl3 + "?uuid=" + videoId3 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc3.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc3.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc3.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放4 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay4() {
    if (playUrl4) {
        mediaStream4 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream4;
        webrtc4 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc4.onsignalingstatechange = signalingstatechange4;

        webrtc4.ontrack = ontrack4
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc4.setLocalDescription(offer);
    }
}

function ontrack4(event) {
    mediaStream4.addTrack(event.track);
}

async function signalingstatechange4() {
    switch (webrtc4.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl4 + "?uuid=" + videoId4 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc4.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc4.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc4.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/
/*============= webRtc视频播放5 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay5() {
    if (playUrl5) {
        mediaStream5 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream5;
        webrtc5 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc5.onsignalingstatechange = signalingstatechange5;

        webrtc5.ontrack = ontrack5
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc5.setLocalDescription(offer);
    }
}

function ontrack5(event) {
    mediaStream5.addTrack(event.track);
}

async function signalingstatechange5() {
    switch (webrtc5.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl5 + "?uuid=" + videoId5 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc5.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc5.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc5.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/
/*============= webRtc视频播放4 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay6() {
    if (playUrl6) {
        mediaStream6 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream6;
        webrtc6 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc6.onsignalingstatechange = signalingstatechange6;

        webrtc6.ontrack = ontrack6
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc6.setLocalDescription(offer);
    }
}

function ontrack6(event) {
    mediaStream6.addTrack(event.track);
}

async function signalingstatechange6() {
    switch (webrtc6.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl6 + "?uuid=" + videoId6 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc6.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc6.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc6.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放7 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay7() {
    if (playUrl7) {
        mediaStream7 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream7;
        webrtc7 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc7.onsignalingstatechange = signalingstatechange7;

        webrtc7.ontrack = ontrack7
        let offer = await webrtc7.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc7.setLocalDescription(offer);
    }
}

function ontrack7(event) {
    mediaStream7.addTrack(event.track);
}

async function signalingstatechange7() {
    switch (webrtc7.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl7 + "?uuid=" + videoId7 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc7.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc7.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc7.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放8 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay8() {
    if (playUrl8) {
        mediaStream8 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream8;
        webrtc8 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrt8.onsignalingstatechange = signalingstatechange8;

        webrtc8.ontrack = ontrack8
        let offer = await webrtc8.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc8.setLocalDescription(offer);
    }
}

function ontrack8(event) {
    mediaStream8.addTrack(event.track);
}

async function signalingstatechange8() {
    switch (webrtc8.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl8 + "?uuid=" + videoId8 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc8.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc8.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc8.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放9 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay9() {
    if (playUrl9) {
        mediaStream9 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream9;
        webrtc9 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc9.onsignalingstatechange = signalingstatechange9;

        webrtc9.ontrack = ontrack9
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc9.setLocalDescription(offer);
    }
}

function ontrack9(event) {
    mediaStream9.addTrack(event.track);
}

async function signalingstatechange9() {
    switch (webrtc9.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl9 + "?uuid=" + videoId9 + "&channel=0";
            $.post(url, {
                data: btoa(webrt9.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc9.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc9.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放10 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay10() {
    if (playUrl10) {
        mediaStream10 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream10;
        webrtc10 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc10.onsignalingstatechange = signalingstatechange10;

        webrtc10.ontrack = ontrack10
        let offer = await webrtc10.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc10.setLocalDescription(offer);
    }
}

function ontrack10(event) {
    mediaStream10.addTrack(event.track);
}

async function signalingstatechange10() {
    switch (webrtc10.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl10 + "?uuid=" + videoId10 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc10.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc10.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc10.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放11 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay11() {
    if (playUrl11) {
        mediaStream11 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream11;
        webrtc11 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc11.onsignalingstatechange = signalingstatechange11;

        webrtc11.ontrack = ontrack11
        let offer = await webrtc11.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc11.setLocalDescription(offer);
    }
}

function ontrack11(event) {
    mediaStream11.addTrack(event.track);
}

async function signalingstatechange11() {
    switch (webrtc11.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl11 + "?uuid=" + videoId11 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc11.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc11.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc11.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放12 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay12() {
    if (playUrl12) {
        mediaStream12 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream12;
        webrtc12 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc12.onsignalingstatechange = signalingstatechange12;

        webrtc12.ontrack = ontrack12
        let offer = await webrtc12.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc12.setLocalDescription(offer);
    }
}

function ontrack12(event) {
    mediaStream12.addTrack(event.track);
}

async function signalingstatechange12() {
    switch (webrtc12.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl12 + "?uuid=" + videoId12 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc12.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc12.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc12.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放13 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay13() {
    if (playUrl13) {
        mediaStream13 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream13;
        webrtc13 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc13.onsignalingstatechange = signalingstatechange13;

        webrtc13.ontrack = ontrack13
        let offer = await webrtc13.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc13.setLocalDescription(offer);
    }
}

function ontrack13(event) {
    mediaStream13.addTrack(event.track);
}

async function signalingstatechange13() {
    switch (webrtc13.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl13 + "?uuid=" + videoId13 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc13.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc13.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc13.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放14 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay14() {
    if (playUrl14) {
        mediaStream14 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream14;
        webrtc14 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc14.onsignalingstatechange = signalingstatechange14;

        webrtc14.ontrack = ontrack14
        let offer = await webrtc14.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc14.setLocalDescription(offer);
    }
}

function ontrack14(event) {
    mediaStream14.addTrack(event.track);
}

async function signalingstatechange14() {
    switch (webrtc14.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl14 + "?uuid=" + videoId14 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc14.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc14.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc14.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放15 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay15() {
    if (playUrl15) {
        mediaStream15 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream15;
        webrtc15 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc15.onsignalingstatechange = signalingstatechange15;

        webrtc15.ontrack = ontrack15
        let offer = await webrtc15.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc15.setLocalDescription(offer);
    }
}

function ontrack15(event) {
    mediaStream15.addTrack(event.track);
}

async function signalingstatechange15() {
    switch (webrtc15.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl15 + "?uuid=" + videoId15 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc15.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc15.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc15.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

/*============= webRtc视频播放16 ----- å¼€å§‹ ===============*/
/**
 * å¼€å§‹æ’­æ”¾
 * @param winTag  æ’­æ”¾çª—口
 * @returns {Promise<void>}
 */
async function webRtcToPlay16() {
    if (playUrl16) {
        mediaStream16 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream16;
        webrtc16 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc16.onsignalingstatechange = signalingstatechange16;

        webrtc16.ontrack = ontrack16
        let offer = await webrtc16.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc16.setLocalDescription(offer);
    }
}

function ontrack16(event) {
    mediaStream16.addTrack(event.track);
}

async function signalingstatechange16() {
    switch (webrtc16.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl16 + "?uuid=" + videoId16 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc16.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc16.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc16.signalingState}`);
            break;
    }
}

/*============= è§†é¢‘播放 ----- ç»“束 ===============*/

 fzzy-igdss-web/src/main/resources/static/img/web/group/banner.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bf_sd.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bf_sd_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bf_zd.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bf_zd_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bg-jiankong-tit.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bg-line.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bg_panel_1_item.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bk1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bk2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bk3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bk4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bk5.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bottom-box-monitor.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bottom-box.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/bottom-titbg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-bg1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-bg2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-btn1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-btn2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-btn3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-i1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-i2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-i3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-i4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/c-map.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/cd-bg1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/cd-bg2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-bottom-box.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-btn-h_03.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-btn-h_04.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-left-box.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-left-boxBg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-right-box.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/data-top-btn_03.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/dbx1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/dw.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_16.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_16_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_1_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_4_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_9.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/fp_9_active.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-body.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-navBg-l.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-navBg-l_on.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-navBg-r.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-navBg-r_on.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/i-top-bg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-address.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-af.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-cf.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-dian-h.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-dian.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-duihao.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-gongsi-h.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-gongsi.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-gongsi1-h.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-gongsi1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-kuqu-h.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-kuqu.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-phone.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-radio_03.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-shu.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-sj.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-time.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-user.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-yw.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon-zhi.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon_close.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon_dot-2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon_dot.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon_dot2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/icon_qh.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/img-map-xa.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/img-map.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/img-map2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/l1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/l2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/l3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/l4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/lb-tab-on.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/lb-tab.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-box1-monitor.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-box1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-box2-monitor.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-box2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-box3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-m1-bg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/left-m2-bg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/plan-center-boxBg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/plan-center-top.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/plan-left-boxBg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/plan-right-box.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/right-m2-bg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/select-bg-lang.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/select-bg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/spu-detail-btn.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-body.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-popBg.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-popBg1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-popBg2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-popBg3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-right-btn-on.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-right-btn.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-right.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/sup-right2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/time.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/video-pic_03.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/yj1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/yj2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/yj3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/yj4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy1.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy2.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy3.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy4.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy5.png

 fzzy-igdss-web/src/main/resources/static/img/web/group/zy6.png

 fzzy-igdss-web/src/main/resources/templates/group/gis-index-bak.html

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/templates/group/gis-index-bak3.html

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/templates/group/gis-index-bakl2.html

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/templates/group/gis-index.html

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/templates/group/gis-indexbak4.html

ÎļþÒÑɾ³ý

 fzzy-igdss-web/src/main/resources/templates/group/gis.html

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,464 @@
<!DOCTYPE html>
<html lang="zh-cn" xmlns:th=http://www.thymeleaf.org>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

    <meta name="renderer" content="webkit">
    <title>库区可视化监管</title>

    <link th:href="@{/group/pc-reset.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/group/master.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/group/gis.css}" rel="stylesheet" type="text/css">
    <style>
        .anchorBL,
        .BMap_cpyCtrl.anchorBL {
            display: none !important;
            ;
        }

        .BMap_bubble_pop {
            background: url(/img/web/group/sup-popBg2.png) no-repeat;
            background-size: 100% 100%;
            padding: 3px 20px 30px 20px !important;
            background-color: transparent !important;
            border: 0 !important;
            box-sizing: border-box;
            overflow: hidden;
        }

        /*地图标题*/
        .BMap_bubble_top {
            display: none !important;
            ;
        }

        /* æ¶ˆæ¯å†…容 */
        .BMap_bubble_center {
            background: transparent !important;
            box-sizing: border-box;
            overflow: hidden;

        }

        /* å·¦ä¸Šè§’删除按键 */
        .BMap_bubble_pop>img {
            display: none !important;
            top: -99999px !important;
            ;
        }
    </style>
</head>

<body>

    <div class="container">
        <div class="i-top">
            <h1 ondblclick="changeScreen()" class="i-top-tit"><span th:text="${sysName}">省级储备粮监管平台</span></h1>
            <div class="i-navBar">
                <a href="javaScript:;" onclick="changePage('index')" class="i-nav3">首页</a>
                <a href="javaScript:;" onclick="changePage('gis')" class="i-nav4 active">GIS监管</a>
                <a href="javaScript:;" onclick="changePage('video')" class="i-nav5">视频监管</a>
                <a href="javaScript:;" onclick="changePage('logout')" class="i-nav6">退出系统</a>
            </div>
            <div class="date-time-module">
                <span id="navBarTime"></span>
                <div class="i-top-date">
                    <span id="navBarDate"></span>
                    <span id="navBarWeek"></span>
                </div>
            </div>
            <!-- <div id="data"></div> -->

        </div><!--i-top end-->

        <div class="c-main cl">
            <div class="c-cen" id="map_container">
                <!--                <img src="../images/visual/c-map.png" alt="">-->
            </div>
            <div class="c-left">
                <div class="o-btn">
<!--                    <img src="../images/visual/c-btn1.png" alt="">-->
                    <img th:src="@{/img/web/group/c-btn1.png}"/>
                </div>
                <div class="inner">
                    <div class="close"></div>
                    <div class="m-box1">
                        <div class="l">
                            <div class="chartbox">
                                <div class="chart" id="breedChart"></div>
                                <div class="txt">
                                    <div class="n" id="foodSum">1433331 </div>
                                    <div class="p">吨 </div>
                                </div>
                            </div>
                        </div>
                        <div class="r">
                            <ul class="ul-listb1" id="foodNumPer">
                                <li>
                                    <div class="con" style="background-color: rgba(0, 228, 250,.05);">
                                        <div class="dot" style="background-color: rgb(0, 228, 250);"></div>
                                        <div class="num" style="color: rgb(0, 228, 250);">42.2%</div>
                                        <div class="type">混合小麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(22, 226, 173,.05);">
                                        <div class="dot" style="background-color: rgb(22, 226, 173);"></div>
                                        <div class="num" style="color: rgb(22, 226, 173);">12.6%</div>
                                        <div class="type">小麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(255, 181, 23,.05);">
                                        <div class="dot" style="background-color: rgb(255, 181, 23);"></div>
                                        <div class="num" style="color: rgb(255, 181, 23);">21.0%</div>
                                        <div class="type">玉米</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(238, 60, 72,.05);">
                                        <div class="dot" style="background-color: rgb(238, 60, 72);"></div>
                                        <div class="num" style="color: rgb(238, 60, 72);">5.8%</div>
                                        <div class="type">稻谷</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(135, 103, 255,.05);">
                                        <div class="dot" style="background-color: rgb(135, 103, 255);"></div>
                                        <div class="num" style="color: rgb(135, 103, 255);">0.9%</div>
                                        <div class="type">青稞</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(41, 122, 255,.05);">
                                        <div class="dot" style="background-color: rgb(41, 122, 255);"></div>
                                        <div class="num" style="color: rgb(41, 122, 255);">10.2%</div>
                                        <div class="type">苦荞麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(238, 60, 144,.05);">
                                        <div class="dot" style="background-color: rgb(238, 60, 144);"></div>
                                        <div class="num" style="color: rgb(238, 60, 144);">16.2%</div>
                                        <div class="type">大豆</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(0, 228, 250,.05);">
                                        <div class="dot" style="background-color: rgb(0, 228, 250);"></div>
                                        <div class="num" style="color: rgb(0, 228, 250);">42.2%</div>
                                        <div class="type">混合小麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(22, 226, 173,.05);">
                                        <div class="dot" style="background-color: rgb(22, 226, 173);"></div>
                                        <div class="num" style="color: rgb(22, 226, 173);">12.6%</div>
                                        <div class="type">小麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(255, 181, 23,.05);">
                                        <div class="dot" style="background-color: rgb(255, 181, 23);"></div>
                                        <div class="num" style="color: rgb(255, 181, 23);">21.0%</div>
                                        <div class="type">玉米</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(238, 60, 72,.05);">
                                        <div class="dot" style="background-color: rgb(238, 60, 72);"></div>
                                        <div class="num" style="color: rgb(238, 60, 72);">5.8%</div>
                                        <div class="type">稻谷</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(135, 103, 255,.05);">
                                        <div class="dot" style="background-color: rgb(135, 103, 255);"></div>
                                        <div class="num" style="color: rgb(135, 103, 255);">0.9%</div>
                                        <div class="type">青稞</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(41, 122, 255,.05);">
                                        <div class="dot" style="background-color: rgb(41, 122, 255);"></div>
                                        <div class="num" style="color: rgb(41, 122, 255);">10.2%</div>
                                        <div class="type">苦荞麦</div>
                                    </div>
                                </li>
                                <li>
                                    <div class="con" style="background-color: rgba(238, 60, 144,.05);">
                                        <div class="dot" style="background-color: rgb(238, 60, 144);"></div>
                                        <div class="num" style="color: rgb(238, 60, 144);">16.2%</div>
                                        <div class="type">大豆</div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="m-box2">
                        <div class="item">
							
                            <div class="bot">
                                <div class="chart" id="ss"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="c-right">
                <div class="o-btn">
                    <img th:src="@{/img/web/group/c-btn2.png}"/>
                </div>
                <div class="inner">
                    <div class="close"></div>
                    <div class="m-nav" id="menuDiv">
                        <div class="con">
                            <div class="tit">
                                <div class="arr"></div>
                                <a href="javascript:;" class="v1"><i class="icon"></i><b class="t">新疆维吾尔自治区</b></a>
                            </div>
                            <div class="sub two">
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">乌鲁木齐市</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">克拉玛依市</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">吐鲁番市</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">哈密市</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">昌吉回族自治州</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">博尔塔拉蒙古自治州</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">巴音郭楞蒙古自治州</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">阿克苏地区</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">克孜勒苏柯尔克孜自治州</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">喀什地区</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">和田地区</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">伊犁哈萨克自治州</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">塔城地区</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="con">
                                    <div class="tit">
                                        <div class="arr"></div>
                                        <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">阿勒泰地区</span></a>
                                    </div>
                                    <div class="sub three">
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称1</span></a>
                                        </div>
                                        <div class="tit">
                                            <a href="javascript:;" class="v1"><i class="icon"></i><span class="t">库区名称2</span></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div><!--i-main end-->

    </div>



    <!-- <script src="../js/bootstrap.min.js" type="text/javascript"></script> -->

    <script>
        window._AMapSecurityConfig = {
            securityJsCode:'39051edca2c561cb80d8f49b4624ab17',
        }
    </script>
    <script th:inline="javascript">
        var userId = [[${loginUser.loginName}]];
        var companyId = [[${loginUser.companyId}]];
        var deptId = [[${deptId}]];
        var areaList = [[${areaList}]];
        var allArea = [[${allArea}]];
        var deptList = [[${deptList}]];
        var bizType = [[${bizType}]];
        var dicSlogan = [[${dicSlogan}]];
        var defaultAreaCode = [[${defaultAreaCode}]];
    </script>
    <script th:src="@{https://webapi.amap.com/maps?v=2.0&key=5249315a4ba00ea7212898d4449b8c0e&plugin=AMap.DistrictSearch}" src="https://webapi.amap.com/maps?v=2.0&key=5249315a4ba00ea7212898d4449b8c0e"></script>
    <!-- UI组件库 1.0 -->
    <script th:src="@{https://webapi.amap.com/ui/1.1/main.js?v=1.1.1}" src="//webapi.amap.com/ui/1.1/main.js?v=1.1.1"></script>
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/plugins/echarts/echarts.js}"></script>
    <script th:src="@{/common/constant.js}"></script>
    <script th:src="@{/common/igds-common.js}"></script>

    <script th:src="@{/group/gis.js}"></script>
    <script th:src="@{/group/gis-map.js}"></script>
    <script th:src="@{/group/gis-chart.js}"></script>
</body>

</html>

 fzzy-igdss-web/src/main/resources/templates/group/index.html

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,275 @@
<!DOCTYPE html>
<html lang="zh-cn" xmlns:th=http://www.thymeleaf.org>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <title>首页</title>

    <link th:href="@{/group/pc-reset.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/group/master.css}" rel="stylesheet" type="text/css">
    <style>
        .sp {
            overflow: hidden;
        }

        .jkcloumn1 > img {
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body style="overflow:hidden;">

<div class="container">
    <div class="i-top">
        <h1 ondblclick="changeScreen()" class="i-top-tit"><span th:text="${sysName}">政策性储备粮油监管平台</span></h1>
        <div class="i-navBar">
            <a href="javaScript:;" onclick="changePage('index')" class="i-nav3 active">首页</a>
            <a href="javaScript:;" onclick="changePage('gis')" class="i-nav4">GIS监管</a>
            <a href="javaScript:;" onclick="changePage('video')" class="i-nav5">视频监管</a>
            <a href="javaScript:;" onclick="changePage('logout')" class="i-nav6">退出系统</a>
        </div>
        <div class="date-time-module">
            <span id="navBarTime"></span>
            <div class="i-top-date">
                <span id="navBarDate"></span>
                <span id="navBarWeek"></span>
            </div>
        </div>
        <!-- <div id="data"></div> -->

    </div><!--i-top end-->

    <div class="i-main cl">
        <div class="left-container">

            <div class="left-m1">
                <div class="panel-title">监管库点</div>

                <div class="panel-content">
                    <ul class="left-m1-ul">
                        <li>
                            <h3>企业（个）</h3>
                            <p id="companyNum">0</p>
                        </li>
                        <li>
                            <h3>库点（个）</h3>
                            <p id="deptAreaNum">0</p>
                        </li>
                        <li>
                            <h3>仓库（个）</h3>
                            <p id="depotSum">0</p>
                        </li>
                        <li>
                            <h3>筒仓（个）</h3>
                            <p id="depotOilSum">0</p>
                        </li>
                    </ul>

                </div>
            </div><!-- i-m1 end -->

            <div class="left-m2">
                <div class="panel-title" id="panel-title">监管动态信息</div>

                <div class="panel-content">
                    <div class="panel-content-head">
                        <span class="head-item">所属库点</span>
                        <span class="head-item">当日分析</span>
                        <span class="head-item">近七天累计次数</span>
                    </div>

                    <div class="panel-content-body" id="inventoryInfoBox">
                        <div id="inventoryInfo">
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区1</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区2</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区3</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区4</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区5</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区6</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区7</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区8</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区9</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item">库区10</span>
                                <span class="body-item">当日分析一切正常</span>
                                <span class="body-item" style="flex: 0.3;">04/22</span>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <div class="left-m3">
                <div class="panel-title">分品种库存</div>

                <div class="panel-content">
                    <div class="chart-box1" id="allInventoryChart"></div>

                    <div class="details-unit">单位（吨）</div>

                </div>
            </div>

        </div><!-- left end -->
        <div class="right-container">
            <div class="right-top">
                <div class="right-map" id="map">

                </div>

                <div class="right-topInfo">

                    <div class="right-topInfo-box1">
                        <div class="panel-title" id="foodNumTitle">储粮数量</div>

                        <div class="panel-content">
                            <div class="lb-wrap">
                                <div class="lb-body">
                                    <ul class="right-topInfo-jg">
                                        <li>
                                            <p id="foodSum">0</p>
                                            <h3>散粮 (吨)</h3>
                                        </li>
                                        <li>
                                            <p id="oilSum">0</p>
                                            <h3>成品 (吨)</h3>
                                        </li>
                                    </ul>
                                </div>
                            </div><!-- lb-wrap end -->
                        </div>
                    </div>

                    <div class="right-topInfo-box2">
                        <div class="panel-title">库点信息</div>
                        <div class="right-topInfo-address">
                            <i class="i-icon32"><img th:src="@{/img/web/group/icon-address.png}" alt=""></i>
                            <span id="cityAndCounty">乌鲁木齐市</span>
                        </div>
                        <div class="panel-content">

                            <h2 class="right-topInfo-kd-h" id="deptAreaName">库区1</h2>
                            <div class="right-topInfo-kd">
                                <div class="right-topInfo-kd-item">
                                    <h3>当日入库数（个）</h3>
                                    <p id="depotNum">0</p>
                                </div>
                                <div class="right-topInfo-kd-item">
                                    <h3>当日出库数（个）</h3>
                                    <p id="depotOilNum">0</p>
                                </div>
                            </div>
                            <ul class="right-topInfo-kd-list right-topInfo-jg">
                                <li>
                                    <p id="foodNum">0</p>
                                    <h3>仓库数（个）</h3>
                                </li>
                                <li>
                                    <p id="oilNum">0</p>
                                    <h3>储粮数（吨）</h3>
                                </li>
                                <li>
                                    <p id="area">0</p>
                                    <h3>占地面积（m²）</h3>
                                </li>
                            </ul>
                        </div>
                    </div>

                </div><!-- right-topInfo end -->

            </div><!-- right-top end -->

            <div class="right-bottom bottom-container">
                <div class="panel-title" id="pieCharTitle">数量统计</div>

                <div class="panel-content" style="position: relative;">
                    <div class="tubiao-Carousel">

                        <div class="stats-chart-box">
                            <div class="chart-item">
                                <div class="chart-item-title">品种</div>
                                <div class="chart-box" id="pieVarietyChart" style="height: 266px; width:256px"></div>
                            </div>
                            <div class="chart-item">
                                <div class="chart-item-title">性质</div>
                                <div class="chart-box" id="pieTypeChart" style="height: 266px; width:256px"></div>
                            </div>
                            <div class="chart-item">
                                <div class="chart-item-title">等级</div>
                                <div class="chart-box" id="pieLevelChart" style="height: 266px; width:256px"></div>
                            </div>
                            <div class="chart-item">
                                <div class="chart-item-title">年份</div>
                                <div class="chart-box" id="pieYearChart" style="height: 266px; width:256px"></div>
                            </div>
                            <div class="chart-item">
                                <div class="chart-item-title">地域划分</div>
                                <div class="chart-box" id="pieAreaChart" style="height: 266px; width:256px"></div>
                            </div>
                        </div>
                    </div><!-- tubiao-Carousel end -->
                </div>

            </div><!-- right-bottom end -->


        </div> <!-- right end -->

    </div><!--i-main end-->

</div>

<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/plugins/echarts/echarts.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.js}"></script>
<script th:src="@{/common/constant.js}"></script>
<script th:src="@{/common/igds-common.js}"></script>
<script th:src="@{/group/mapList.js}"></script>
<script th:src="@{/group/index.js}"></script>
<script th:inline="javascript">
    var userId = [[${loginUser.loginName}]];
    var companyId = [[${loginUser.companyId}]];
    var deptId = [[${deptId}]];
    var deptList = [[${deptList}]];
</script>
</body>
</html>

 fzzy-igdss-web/src/main/resources/templates/group/video.html

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,420 @@
<!DOCTYPE html>
<html lang="zh-cn" xmlns:th=http://www.thymeleaf.org>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <title>监管大屏-视频监管</title>

    <link th:href="@{/group/video.css}" rel="stylesheet" type="text/css">
    <style>
        .deptNameStyle {
            font-family: å¾®è½¯é›…黑, 'Helvetica Neue', Helvetica, Arial, sans-serif;
        }

        .right-videoWrap {
            padding-top: 10px;
            height: 830px;
        }

        .text_fp {
            font-size: 14px;
            margin-right: 0px;
            color: #FFF;
        }

        .fenping_icon {
            position: absolute;
            right: 60px;
            top: 8px;
        }

        .text_select_play {
            font-size: 14px;
            margin-right: 0px;
            color: #FFF;
        }

        .select_play_icon {
            position: absolute;
            right: 20px;
            top: 8px;
        }
        .div_v1 {
            width: 99.88%;
            height: 829px;
            float: left;
            background-color: #333;

            text-align: center;
            line-height: 826px;
            color: #FFF;
            font-size: 20px;
        }

        .div_v4 {
            width: 49.88%;
            height: 414px;
            float: left;
            background-color: #333;

            text-align: center;
            line-height: 413px;
            color: #FFF;
            font-size: 20px;
        }

        .div_v9 {
            width: 33.23%;
            height: 275.8px;
            float: left;
            background-color: #333;

            text-align: center;
            line-height: 275.4px;
            color: #FFF;
            font-size: 20px;
        }

        .div_v16 {
            width: 24.9%;
            height: 206.5px;
            float: left;
            background-color: #333;

            text-align: center;
            line-height: 206.5px;
            color: #FFF;
            font-size: 20px;
        }

        .bor_t_l {
            border-top: 1px solid #ff0000;
            border-left: 1px solid #ff0000;
        }

        .bor_b {
            border-bottom: 1px solid #ff0000;
        }

        .bor_r {
            border-right: 1px solid #ff0000;
        }
        .handSelect {
            background-color: #1e9fff
        }
        .i-main {
            padding: 0px 30px 0px;
            width: unset;
        }
        .right-videoWrap {
             height: unset;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr {
             padding-top: unset;
            height: 40px;
            line-height: 40px;
        }
        .left-m2 .panel-content .panel-content-body .panel-content-body-tr .body-item {
            font-size: 18px;
        }
        .left-m2 .panel-content .panel-content-head {
            line-height: unset;
            font-size: 18px;
        }
        .text_select_play {
            font-size: 16px;
        }
        .video {
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body style="overflow: hidden;">

<div class="container row-main">
    <div class="i-top">
        <h1 ondblclick="changeScreen()" class="i-top-tit"><span th:text="${sysName}">政策性储备粮油监管平台</span></h1>
        <div class="i-navBar">
            <a href="javaScript:;" onclick="changePage('index')" class="i-nav3">首页</a>
            <a href="javaScript:;" onclick="changePage('gis')" class="i-nav4">GIS监管</a>
            <a href="javaScript:;" onclick="changePage('video')" class="i-nav5 active">视频监管</a>
            <a href="javaScript:;" onclick="changePage('logout')" class="i-nav6">退出系统</a>
        </div>
        <div class="date-time-module">
            <span id="navBarTime"></span>
            <div class="i-top-date">
                <span id="navBarDate"></span>
                <span id="navBarWeek"></span>
            </div>
        </div>
        <!-- <div id="data"></div> -->

    </div><!--i-top end-->
    <div class="i-main cl">
        <div class="left-container">
            <div class="left-m1">
                <div class="panel-title">库区信息</div>
                <div class="panel-content">
                    <div class="panel-box1-item">
                        <div class="company-cut"></div>
                        <h3 id="deptNameBox" class="panel-box1-title t1">
                            <span id="deptName" class="deptNameStyle d1" style="margin-left: 10px;">
                            åº“区名称1
                            </span>
                        </h3>
                    </div>
                    <div class="panel-box1-item t2">
                        <p><i><img th:src="@{/img/web/group/icon-address.png}"/></i>
                            <span id="deptAddress" class="d1">
                                ä¹Œé²æœ¨é½å¸‚
                            </span>
                        </p>
                    </div>
                    <div class="panel-box1-item">
                        <p><i><img th:src="@{/img/web/group/icon-user.png}"/></i>
                            <span id="deptContact">
                                å¼ ä¸‰
                            </span>
                        </p>
                    </div>
                    <div class="panel-box1-item">
                        <p><i><img th:src="@{/img/web/group/icon-phone.png}"/></i>
                            <span id="deptPhone">
                                18638530750
                            </span>
                        </p>
                    </div>
                </div>
            </div><!-- i-m1 end -->
            <div class="left-m2">
                <div>
                    <div class="panel-title" id="panel-title">监控点信息</div>
                </div>
                <div class="panel-content">
                    <div class="panel-content-head">
                        <span class="head-item" style="flex: 1.4">监控名称</span>
                        <span class="head-item" style="flex: 0.6">监控类型</span>
                    </div>

                    <div class="panel-content-body" id="inventoryInfoBox">
                        <div id="inventoryInfo">
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙1</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙2</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙3</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙4</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙5</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙6</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙7</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙8</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙9</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙10</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙11</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙12</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙13</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙14</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙15</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                            <div class="panel-content-body-tr">
                                <span class="body-item" style="flex: 1.4">安防-北围墙16</span>
                                <span class="body-item" style="flex: 0.6">枪机</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- left end -->
        <div class="right-container">
            <div class="right-bottom bottom-container">
                <div>
                    <div class="panel-title" id="pieCharTitle">视频监控</div>
                    <div class="fenping_icon">
                        <img onclick="fenping(1)" id="f_1" style="width: 30px" th:src="@{/img/web/group/fp_1_active.png}"/>
                        <img onclick="fenping(4)" id="f_4" style="width: 30px" th:src="@{/img/web/group/fp_4.png}"/>
                        <img onclick="fenping(9)" id="f_9" style="width: 30px" th:src="@{/img/web/group/fp_9.png}"/>
                        <img onclick="fenping(16)" id="f_16" style="width: 30px" th:src="@{/img/web/group/fp_16.png}"/>
                    </div>
                </div>
                <!--一分屏 é»˜è®¤æ˜¾ç¤º-->
                <div id="video_1" class="right-videoWrap">
                    <div id="f1_d1" class="div_v1 bor_t_l bor_b bor_r">
                        <video class="video" id="video1_1" autoplay="" muted="" playsinline=""></video>
                    </div>
                </div>

                <!--四分屏 é»˜è®¤æ˜¾ç¤º-->
                <div id="video_4" class="right-videoWrap" style="display: none;">
                    <div id="f4_d1" class="div_v4 bor_t_l">
                        <video class="video" id="video4_1" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f4_d2" class="div_v4 bor_t_l bor_r">
                        <video class="video" id="video4_2" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f4_d3" class="div_v4 bor_t_l bor_b">
                        <video class="video" id="video4_3" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f4_d4" class="div_v4 bor_t_l bor_b bor_r">
                        <video class="video" id="video4_4" autoplay="" muted="" playsinline=""></video>
                    </div>
                </div>

                <!--九分屏 é»˜è®¤éšè—-->
                <div id="video_9" class="right-videoWrap" style="display: none;">
                    <div id="f9_d1" class="div_v9 bor_t_l">
                        <video class="video" id="video9_1" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d2" class="div_v9 bor_t_l">
                        <video class="video" id="video9_2" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d3" class="div_v9 bor_t_l bor_r">
                        <video class="video" id="video9_3" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d4" class="div_v9 bor_t_l">
                        <video class="video" id="video9_4" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d5" class="div_v9 bor_t_l">
                        <video class="video" id="video9_5" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d6" class="div_v9 bor_t_l bor_r">
                        <video class="video" id="video9_6" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d7" class="div_v9 bor_t_l bor_b">
                        <video class="video" id="video9_7" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d8" class="div_v9 bor_t_l bor_b">
                        <video class="video" id="video9_8" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f9_d9" class="div_v9 bor_t_l bor_b bor_r">
                        <video class="video" id="video9_9" autoplay="" muted="" playsinline=""></video>
                    </div>
                </div>

                <!--十六分屏 é»˜è®¤éšè—-->
                <div id="video_16" class="right-videoWrap" style="display: none;">
                    <div id="f16_d1" class="div_v16 bor_t_l">
                        <video class="video" id="video16_1" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d2" class="div_v16 bor_t_l">
                        <video class="video" id="video16_2" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d3" class="div_v16 bor_t_l">
                        <video class="video" id="video16_3" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d4" class="div_v16 bor_t_l bor_r">
                        <video class="video" id="video16_4" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d5" class="div_v16 bor_t_l">
                        <video class="video" id="video16_5" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d6" class="div_v16 bor_t_l">
                        <video class="video" id="video16_6" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d7" class="div_v16 bor_t_l">
                        <video class="video" id="video16_7" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d8" class="div_v16 bor_t_l bor_r">
                        <video class="video" id="video16_8" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d9" class="div_v16 bor_t_l">
                        <video class="video" id="video16_9" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d10" class="div_v16 bor_t_l">
                        <video class="video" id="video16_10" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d11" class="div_v16 bor_t_l">
                        <video class="video" id="video16_11" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d12" class="div_v16 bor_t_l bor_r">
                        <video class="video" id="video16_12" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d13" class="div_v16 bor_t_l bor_b">
                        <video class="video" id="video16_13" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d14" class="div_v16 bor_t_l bor_b">
                        <video class="video" id="video16_14" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d15" class="div_v16 bor_t_l bor_b">
                        <video class="video" id="video16_15" autoplay="" muted="" playsinline=""></video>
                    </div>
                    <div id="f16_d16" class="div_v16 bor_t_l bor_b bor_r">
                        <video class="video" id="video16_16" autoplay="" muted="" playsinline=""></video>
                    </div>
                </div>

            </div> <!-- right end -->

        </div><!--i-main end-->

    </div>
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/ajax/libs/layui/layui.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.js}"></script>
<script th:src="@{/common/constant.js}"></script>
<script th:src="@{/common/igds-common.js}"></script>
<script th:src="@{/group/video.js}"></script>
<script th:inline="javascript">

    var deptCur = [[${deptInfo}]]
    var deptId = [[${deptId}]];
    var dicSlogan = [[${dicSlogan}]];
    var cameraList = [[${cameraList}]];

    //设置定时刷新页面，主要为了防止掉线
    var timer2;
    window.onload = function () {
        if (timer2) {
            clearInterval(timer2);
        }
        timer2 = setInterval(function () {
            window.location.href = window.location.href;
        }, 60 * 60 * 1000);
    };
</script>
</body>
</html>

 fzzy-igdss-web/src/main/resources/templates/security/quantity.html

@@ -154,10 +154,10 @@
            <div class="card">
                <div class="card-header">
                    <h2>数量走势分析</h2>
                    <select class="layui-form-select">
                        <option>近7天</option>
                        <option>近30天</option>
                    </select>
<!--                    <select class="layui-form-select">-->
<!--                        <option>近7天</option>-->
<!--                        <option>近30天</option>-->
<!--                    </select>-->
                </div>
                <div class="card-body">
                    <div style="height: 250px;" id="temperatureChart"></div>