#

luxiaotao1123

2022-02-26 9bfdc39e8e7aade92db4e7c57586a90e2a4c91bf

#

 src/main/java/com/zy/sc/common/web/UploadController.java

@@ -1,9 +1,13 @@
package com.zy.sc.common.web;

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.core.annotations.ManagerAuth;
import com.core.common.Cools;
import com.core.common.R;
import com.zy.sc.common.service.OssService;
import com.zy.sc.manager.entity.Issue;
import com.zy.sc.manager.service.IssueService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@@ -12,6 +16,7 @@

import java.io.IOException;
import java.io.InputStream;
import java.util.Date;

/**
 * Created by vincent on 2020/10/7
@@ -21,6 +26,8 @@

    @Autowired
    private OssService ossService;
    @Autowired
    private IssueService issueService;

    @PostMapping("/upload.action")
    public R upload(MultipartFile file) {
@@ -35,9 +42,21 @@
        return R.ok(Cools.add("url", upload));
    }

    @PostMapping("/sensor/upload.action")
    @PostMapping("/issue/upload.action")
    @ManagerAuth(memo = "图片上传")
    public R sensorUpload(MultipartFile file, @RequestParam("sensorId") Long sensorId) {
    public R sensorUpload(MultipartFile file, @RequestParam("issueId") Long issueId) {
        Issue issue = issueService.selectById(issueId);
        if (null == issue) {
            return R.error("设备不存在");
        }
        String img = issue.getImg();
        JSONArray jsonArray = JSON.parseArray(img);
        if (jsonArray == null) {
            jsonArray = new JSONArray();
        }
        if (jsonArray.size() >= 5) {
            return R.error("图片上传数量已到上限");
        }
        // oss
        String suffix = file.getName().substring(file.getName().lastIndexOf(".") + 1);
        InputStream inputStream = null;
@@ -53,5 +72,30 @@
        return R.ok(Cools.add("src", upload));
    }

    @PostMapping("/issue/remove.action")
    @ManagerAuth(memo = "图片移除")
    public R sensorRemove(@RequestParam("issueId") Long issueId, @RequestParam("src") String src) {
        Issue issue = issueService.selectById(issueId);
        if (null == issue) {
            return R.error("设备不存在");
        }
        String img = issue.getImg();
        JSONArray jsonArray = JSON.parseArray(img);
        if (jsonArray == null) {
            jsonArray = new JSONArray();
        }
        if (jsonArray.size() < 1) {
            return R.error("没有可删除的图片");
        }
        jsonArray.remove(src);
        // 持久化
        issue.setImg(jsonArray.toJSONString());
        issue.setUpdateBy(getUserId());
        issue.setUpdateTime(new Date());
        if (!issueService.updateById(issue)) {
            return R.error("保持数据库失败");
        }
        return R.ok("删除成功");
    }

}

 src/main/java/com/zy/sc/manager/controller/IssueController.java

@@ -1,22 +1,24 @@
package com.zy.sc.manager.controller;

import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.core.common.DateUtils;
import com.zy.sc.manager.entity.Issue;
import com.zy.sc.manager.service.IssueService;
import com.core.annotations.ManagerAuth;
import com.core.common.BaseRes;
import com.core.common.Cools;
import com.core.common.DateUtils;
import com.core.common.R;
import com.zy.sc.common.web.BaseController;
import com.zy.sc.manager.entity.Issue;
import com.zy.sc.manager.service.IssueService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.*;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@RestController
public class IssueController extends BaseController {
@@ -26,7 +28,8 @@

    @RequestMapping(value = "/issue/{id}/auth")
    @ManagerAuth
    public R get(@PathVariable("id") String id) {
    public R get(@PathVariable("id") String id) throws InterruptedException {
        Thread.sleep(600);
        return R.ok(issueService.selectById(String.valueOf(id)));
    }

@@ -38,6 +41,7 @@
                  @RequestParam(required = false)String orderByType,
                  @RequestParam Map<String, Object> param){
        EntityWrapper<Issue> wrapper = new EntityWrapper<>();
        wrapper.orderBy("settle").orderBy("create_time", false);
        excludeTrash(param);
        convert(param, wrapper);
        if (!Cools.isEmpty(orderByField)){wrapper.orderBy(humpToLine(orderByField), "asc".equals(orderByType));}

 src/main/java/com/zy/sc/manager/entity/Issue.java

@@ -338,4 +338,7 @@
        return list;
    }

    public Boolean getOnline() {
        return this.settle==5;
    }
}

 src/main/webapp/static/js/issue/issue.js

@@ -99,6 +99,9 @@
    table.on('tool(issueTable)', function(obj){
        var data = obj.data;
        switch (obj.event) {
            case 'detl':
                top.issueByDetl = data.id;
                break;
            case 'edit':
                showEditModel(data);
                break;

 src/main/webapp/views/home/console.html

@@ -409,204 +409,204 @@
    // option && myChart.setOption(option);

    // 地图 -----------------------------------------------------------------
    var map = new AMap.Map('map', {
        zoom: 4.85,
        pitch: 40,
        viewMode: '3D',
        center: [105.202202,32.699006],
        // mapStyle: 'amap://styles/8108947b4fec714c52ef08aa183a2237',
        // mapStyle: 'amap://styles/4fd4357cc9f7c46f0c227c9763f67a2d',
        mapStyle: 'amap://styles/7f20373ddc5b2456e7095fce1dab4aba',
        // mapStyle: 'amap://styles/dd57f58da78602dc3871efc29b2ba43d',
    });

    var loca = new Loca.Container({
        map,
    });

    var geo;
    var iconLayer = new Loca.IconLayer({
        zIndex: 10,
        opacity: 1,
    });
    function getMapData() {
        $.ajax({
            url: baseUrl + "/sensor/map/auth",
            headers: {'token': localStorage.getItem('token')},
            method: 'GET',
            success: function (res) {
                if (res.code === 200) {
                    geo = new Loca.GeoJSONSource({
                        data: res.data,
                    });
                    iconLayer.setSource(geo);
                    iconLayer.setStyle({
                        unit: 'px',
                        icon: (index, feature) => {
                            let data = feature.properties.rawData;
                            return trafficIcons[data.type % Object.keys(trafficIcons).length];
                        },
                        iconSize: [20,20],
                        rotation: 0,
                    })
                    loca.add(iconLayer);
                } else if (res.code === 403) {
                    top.location.href = baseUrl + "/";
                } else {
                    layer.msg(res.msg, {icon: 2})
                }
            }
        })
    }
    getMapData();


    // 拾取
    map.on('click', (e) => {
        const feat = iconLayer.queryFeature(e.pixel.toArray());
        if (feat) {
            map.setZoomAndCenter(19, new AMap.LngLat(feat.properties.rawData.lng, feat.properties.rawData.lat));
            iconLayer.setStyle({
                unit: 'px',
                icon: (index, feature) => {
                    let data = feature.properties.rawData;
                    return trafficIcons[data.type % Object.keys(trafficIcons).length];
                },
                iconSize: (i, feature) => {
                    if (feature === feat) {
                        return [40, 40];
                    }
                    return [20, 20];
                },
            });
            top.sensorByMap = feat.properties.rawData.sensorId;
            layer.open({
                type: 2
                ,id: 'LAY_adminPopupR'
                ,area: '700px'
                // ,url: 'sensor_detl.html'
                ,anim: -1
                ,title: false
                ,closeBtn: false
                ,offset: 'r'
                ,shade: 0.1
                ,shadeClose: true
                ,window: 'top'
                ,skin: 'layui-anim layui-anim-rl layui-layer-adminRight0'
                ,content: '../sensor_detl.html'
            });
        }
    });

    // --------------------------------------

    // https://www.highcharts.com.cn/demo/highcharts/3d-area-multiple
    // https://echarts.apache.org/examples/zh/editor.html?c=scatter3D-dataset&gl=1&version=5.2.1
    layui.config({
        base: baseUrl + "/static/layui/lay/modules/"
    }).extend({
        dropdown: 'dropdown/dropdown'
    }).use(['layer', 'carousel', 'element', 'admin', 'dropdown'], function () {
        var element = layui.element;
        var $ = layui.jquery;
        var layer = layui.layer;
        var carousel = layui.carousel;
        var device = layui.device();
        var admin = layui.admin;

        // 数据中心
        $('#toDataV').click(function () {
            window.open("https://lbs.amap.com/tools/picker");
        })

        getHeaderData();
        getBodyData();

        setInterval(function () {
            getHeaderData();
            getBodyData();
        }, 3000)

        // 渲染轮播
        carousel.render({
            elem: '#workplaceNewsCarousel',
            width: '100%',
            height: '70px',
            arrow: 'none',
            autoplay: true,
            trigger: device.ios || device.android ? 'click' : 'hover',
            anim: 'fade'
        });

        // 头部
        function getHeaderData() {
            $.ajax({
                url: baseUrl + "/console/header/auth",
                headers: {'token': localStorage.getItem('token')},
                method: 'GET',
                success: function (res) {
                    if (res.code === 200) {
                        var result = res.data;
                        $('#logQtyDay').text(result.logQtyDay);
                        $('#logQty').text(result.logQty);

                        $('#sensorQty').text(result.sensorQty);
                        $('#sensorOnlineQty').text(result.sensorOnlineQty);

                        $('#commandQty').text(result.commandQty);
                        $('#commandQtyMonth').text(result.commandQtyMonth);

                        $('#usersQty').text(result.usersQty);
                        $('#deptQty').text(result.deptQty);
                        $('#optQty').text(result.optQty);
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/";
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        }

        // 主体
        function getBodyData() {
            $.ajax({
                url: baseUrl + "/console/body/auth",
                headers: {'token': localStorage.getItem('token')},
                method: 'GET',
                success: function (res) {
                    if (res.code === 200) {
                        // 安全库存
                        var tpl = $('#safeQuaTpl').html();
                        var template = Handlebars.compile(tpl);
                        var html = template(res.data);
                        $('#warnList').html(html);
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/";
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        }

    });

    // 地图重置
    document.getElementById("map-reset").addEventListener("click", function () {
        map.setZoomAndCenter(4.85, new AMap.LngLat(105.202202, 32.699006));
        map.setRotation(0);
        map.setPitch(40);
        iconLayer.setStyle({
            unit: 'px',
            icon: (index, feature) => {
                let data = feature.properties.rawData;
                return trafficIcons[data.type % Object.keys(trafficIcons).length];
            },
            iconSize: [20,20],
            rotation: 0,
        })
    })
    // var map = new AMap.Map('map', {
    //     zoom: 4.85,
    //     pitch: 40,
    //     viewMode: '3D',
    //     center: [105.202202,32.699006],
    //     // mapStyle: 'amap://styles/8108947b4fec714c52ef08aa183a2237',
    //     // mapStyle: 'amap://styles/4fd4357cc9f7c46f0c227c9763f67a2d',
    //     mapStyle: 'amap://styles/7f20373ddc5b2456e7095fce1dab4aba',
    //     // mapStyle: 'amap://styles/dd57f58da78602dc3871efc29b2ba43d',
    // });
    //
    // var loca = new Loca.Container({
    //     map,
    // });
    //
    // var geo;
    // var iconLayer = new Loca.IconLayer({
    //     zIndex: 10,
    //     opacity: 1,
    // });
    // function getMapData() {
    //     $.ajax({
    //         url: baseUrl + "/sensor/map/auth",
    //         headers: {'token': localStorage.getItem('token')},
    //         method: 'GET',
    //         success: function (res) {
    //             if (res.code === 200) {
    //                 geo = new Loca.GeoJSONSource({
    //                     data: res.data,
    //                 });
    //                 iconLayer.setSource(geo);
    //                 iconLayer.setStyle({
    //                     unit: 'px',
    //                     icon: (index, feature) => {
    //                         let data = feature.properties.rawData;
    //                         return trafficIcons[data.type % Object.keys(trafficIcons).length];
    //                     },
    //                     iconSize: [20,20],
    //                     rotation: 0,
    //                 })
    //                 loca.add(iconLayer);
    //             } else if (res.code === 403) {
    //                 top.location.href = baseUrl + "/";
    //             } else {
    //                 layer.msg(res.msg, {icon: 2})
    //             }
    //         }
    //     })
    // }
    // getMapData();
    //
    //
    // // 拾取
    // map.on('click', (e) => {
    //     const feat = iconLayer.queryFeature(e.pixel.toArray());
    //     if (feat) {
    //         map.setZoomAndCenter(19, new AMap.LngLat(feat.properties.rawData.lng, feat.properties.rawData.lat));
    //         iconLayer.setStyle({
    //             unit: 'px',
    //             icon: (index, feature) => {
    //                 let data = feature.properties.rawData;
    //                 return trafficIcons[data.type % Object.keys(trafficIcons).length];
    //             },
    //             iconSize: (i, feature) => {
    //                 if (feature === feat) {
    //                     return [40, 40];
    //                 }
    //                 return [20, 20];
    //             },
    //         });
    //         top.sensorByMap = feat.properties.rawData.sensorId;
    //         layer.open({
    //             type: 2
    //             ,id: 'LAY_adminPopupR'
    //             ,area: '700px'
    //             // ,url: 'sensor_detl.html'
    //             ,anim: -1
    //             ,title: false
    //             ,closeBtn: false
    //             ,offset: 'r'
    //             ,shade: 0.1
    //             ,shadeClose: true
    //             ,window: 'top'
    //             ,skin: 'layui-anim layui-anim-rl layui-layer-adminRight0'
    //             ,content: '../sensor_detl.html'
    //         });
    //     }
    // });
    //
    // // --------------------------------------
    //
    // // https://www.highcharts.com.cn/demo/highcharts/3d-area-multiple
    // // https://echarts.apache.org/examples/zh/editor.html?c=scatter3D-dataset&gl=1&version=5.2.1
    // layui.config({
    //     base: baseUrl + "/static/layui/lay/modules/"
    // }).extend({
    //     dropdown: 'dropdown/dropdown'
    // }).use(['layer', 'carousel', 'element', 'admin', 'dropdown'], function () {
    //     var element = layui.element;
    //     var $ = layui.jquery;
    //     var layer = layui.layer;
    //     var carousel = layui.carousel;
    //     var device = layui.device();
    //     var admin = layui.admin;
    //
    //     // 数据中心
    //     $('#toDataV').click(function () {
    //         window.open("https://lbs.amap.com/tools/picker");
    //     })
    //
    //     getHeaderData();
    //     getBodyData();
    //
    //     setInterval(function () {
    //         getHeaderData();
    //         getBodyData();
    //     }, 3000)
    //
    //     // 渲染轮播
    //     carousel.render({
    //         elem: '#workplaceNewsCarousel',
    //         width: '100%',
    //         height: '70px',
    //         arrow: 'none',
    //         autoplay: true,
    //         trigger: device.ios || device.android ? 'click' : 'hover',
    //         anim: 'fade'
    //     });
    //
    //     // 头部
    //     function getHeaderData() {
    //         $.ajax({
    //             url: baseUrl + "/console/header/auth",
    //             headers: {'token': localStorage.getItem('token')},
    //             method: 'GET',
    //             success: function (res) {
    //                 if (res.code === 200) {
    //                     var result = res.data;
    //                     $('#logQtyDay').text(result.logQtyDay);
    //                     $('#logQty').text(result.logQty);
    //
    //                     $('#sensorQty').text(result.sensorQty);
    //                     $('#sensorOnlineQty').text(result.sensorOnlineQty);
    //
    //                     $('#commandQty').text(result.commandQty);
    //                     $('#commandQtyMonth').text(result.commandQtyMonth);
    //
    //                     $('#usersQty').text(result.usersQty);
    //                     $('#deptQty').text(result.deptQty);
    //                     $('#optQty').text(result.optQty);
    //                 } else if (res.code === 403) {
    //                     top.location.href = baseUrl + "/";
    //                 } else {
    //                     layer.msg(res.msg, {icon: 2})
    //                 }
    //             }
    //         })
    //     }
    //
    //     // 主体
    //     function getBodyData() {
    //         $.ajax({
    //             url: baseUrl + "/console/body/auth",
    //             headers: {'token': localStorage.getItem('token')},
    //             method: 'GET',
    //             success: function (res) {
    //                 if (res.code === 200) {
    //                     // 安全库存
    //                     var tpl = $('#safeQuaTpl').html();
    //                     var template = Handlebars.compile(tpl);
    //                     var html = template(res.data);
    //                     $('#warnList').html(html);
    //                 } else if (res.code === 403) {
    //                     top.location.href = baseUrl + "/";
    //                 } else {
    //                     layer.msg(res.msg, {icon: 2})
    //                 }
    //             }
    //         })
    //     }
    //
    // });
    //
    // // 地图重置
    // document.getElementById("map-reset").addEventListener("click", function () {
    //     map.setZoomAndCenter(4.85, new AMap.LngLat(105.202202, 32.699006));
    //     map.setRotation(0);
    //     map.setPitch(40);
    //     iconLayer.setStyle({
    //         unit: 'px',
    //         icon: (index, feature) => {
    //             let data = feature.properties.rawData;
    //             return trafficIcons[data.type % Object.keys(trafficIcons).length];
    //         },
    //         iconSize: [20,20],
    //         rotation: 0,
    //     })
    // })

</script>
<script type="text/template" id="safeQuaTpl">

 src/main/webapp/views/index.html

@@ -164,42 +164,42 @@
        var url = logout.getAttribute('href');
        logout.setAttribute('href', baseUrl + "/login");

        setInterval(function () {
            $.ajax({
                url: baseUrl + "/alarm/index/auth",
                headers: {'token': localStorage.getItem('token')},
                method: 'GET',
                success: function (res) {
                    if (res.code === 200) {
                        if (res.data != null) {
                            notice["error"]({
                                theme: "dark",
                                animateInside: true,
                                layout: 2,
                                rtl: false,
                                displayMode: 1,
                                position: "bottomRight",
                                transitionIn: "fadeInLeft",
                                transitionOut: "fadeOutRight",
                                title: res.data.sensorType$ + "设备报警",
                                message: "#" + res.data.uuid + "#" + res.data.desc,
                                pauseOnHover: false,
                                resetOnHover: false,
                                timeout: false,
                                progressBar: false,
                                onOpened: function () {
                                    $(".iziToast-message").css("cursor", "pointer")
                                }
                            });
                        }
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/login";
                    } else {
                        layer.msg(res.msg, {icon: 2});
                    }
                }
            });
        }, 5000);
        // setInterval(function () {
        //     $.ajax({
        //         url: baseUrl + "/alarm/index/auth",
        //         headers: {'token': localStorage.getItem('token')},
        //         method: 'GET',
        //         success: function (res) {
        //             if (res.code === 200) {
        //                 if (res.data != null) {
        //                     notice["error"]({
        //                         theme: "dark",
        //                         animateInside: true,
        //                         layout: 2,
        //                         rtl: false,
        //                         displayMode: 1,
        //                         position: "bottomRight",
        //                         transitionIn: "fadeInLeft",
        //                         transitionOut: "fadeOutRight",
        //                         title: res.data.sensorType$ + "设备报警",
        //                         message: "#" + res.data.uuid + "#" + res.data.desc,
        //                         pauseOnHover: false,
        //                         resetOnHover: false,
        //                         timeout: false,
        //                         progressBar: false,
        //                         onOpened: function () {
        //                             $(".iziToast-message").css("cursor", "pointer")
        //                         }
        //                     });
        //                 }
        //             } else if (res.code === 403) {
        //                 top.location.href = baseUrl + "/login";
        //             } else {
        //                 layer.msg(res.msg, {icon: 2});
        //             }
        //         }
        //     });
        // }, 5000);

        $(document).on('click', '.iziToast-message', function(el) {
            var alarmUuid = el.target.innerText.match(/#(\S*)#/)[1];

 src/main/webapp/views/issue/issue_detl.html

@@ -38,7 +38,7 @@
        margin-bottom: 5px !important;
        background: #c8d1dabd;
    }
    .sensor-label {
    .issue-label {
        display: inline-block;
        float: left;
        font-size: 16px;
@@ -276,7 +276,7 @@
        <div>
            <span class="online-info">在线，可以进行远程操作</span>
            <div class="cool-divider"></div>
            <span class="sensor-label"></span>
            <span class="issue-label"></span>
        </div>
        <button class="layui-btn" lay-filter="refresh" lay-submit><i class="layui-icon">&#xe666;</i>&emsp;刷新&emsp;</button>
    </div>
@@ -311,8 +311,8 @@
                success: function (res) {
                    notice.destroy();
                    if (res.code === 200) {
                        var issue = res.data;
                        top.sensorByDetl = null;
                        let issue = res.data;
                        top.issueByDetl = null;
                        // 地图
                        // map = new AMap.Map('map', {
                        //     resizeEnable: true,
@@ -325,16 +325,16 @@
                        // });
                        // marker.setMap(map);
                        // 设备唯一码
                        $('.sensor-label').text(issue.uuid);
                        $('.issue-label').text(issue.uuid);
                        // 设备明细
                        form.val('formAdvForm', issue);
                        // 日志表格
                        initLogTable(issue.id);
                        // 图片
                        initImgs(sensor.id, issue.imgArr);
                        initImgs(issue.id, issue.imgArr);
                        // 在线情况
                        $('.online-info').attr("class", sensor.online?"online-info online-success":"online-info online-fail");
                        $('.online-info').text(sensor.online?"在线，可以进行远程操作":"离线，不能进行远程操作");
                        $('.online-info').attr("class", issue.online?"online-info online-success":"online-info online-fail");
                        $('.online-info').text(issue.online?"已完成":"作业中");
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/";
                    } else {
@@ -411,11 +411,11 @@
            // https://gitee.com/gouguoyin/ajax-image-upload?_from=gitee_search#http://www.gouguoyin.cn/ajax-image-upload
            $(".image-box").ajaxImageUpload({
                fileInput : 'file',
                postUrl : baseUrl + '/sensor/upload.action', //上传的服务器地址
                postUrl : baseUrl + '/issue/upload.action', //上传的服务器地址
                width : 180,
                height : 180,
                imageUrl: imgArr,
                postData : { sensorId: sensorId },
                postData : { issueId: issueId },
                maxNum: 5, //允许上传图片数量
                allowZoom : true, //允许放大
                maxSize : 3, //允许上传图片的最大尺寸，单位M
@@ -430,11 +430,11 @@
                },
                delete : function (src) {
                    $.ajax({
                        url: baseUrl + "/sensor/remove.action",
                        url: baseUrl + "/issue/remove.action",
                        headers: {'token': localStorage.getItem('token')},
                        method: 'POST',
                        data: {
                            sensorId: sensorId,
                            issueId: issueId,
                            src: src
                        },
                        // async: false,