junggilparrk 2 years ago
parent
commit
65c1a8b3f2

+ 2 - 2
src/main/resources/static/application/op/00.main/main-pwd-change-pop-up.js

@@ -35,7 +35,7 @@ $(()=>{
 
     
     creatBtn($('.save-btn'), 'save', '저장', '저장', 'outlined', changePwd);
-    creatBtn($('.cancel-btn'), 'close', '닫기', '닫기', 'outlined', ()=>{window.close()});
+    creatBtn($('.cancel-btn'), 'close', '취소', '취소', 'outlined', ()=>{window.close()});
     
 })
 
@@ -99,4 +99,4 @@ function changePwd(){
             inputMap.get('old_pwd').get('box').focus();
         }
     }
-}
+}

+ 3 - 3
src/main/resources/static/application/op/01.traffic-manager/02.syop-traf/syop-traf-popup-map.js

@@ -314,7 +314,7 @@ $(() => {
         .dxTabPanel("instance");
 
     doMap();
-    
+
 });
 
 /**
@@ -344,7 +344,7 @@ function doMap() {
 let _selCnt = 1;
 function onSelectObjFunc(ALyrIdx, ALyrName, ANmbr, ACoordX, ACoordY, X, Y) {
     let dataSource = _selectSectionList.option('dataSource');
-    
+
     if (ALyrIdx != _lyrIdx) {
         return;
     }
@@ -449,7 +449,7 @@ function fetchBaseData() {
 //             _mapManager.makeLayer(LayerIndex.Node, values[0]);
 //             _mapManager.makeTrafficObject(_lyrType, values[1]);
 //             _mapManager.makeLayer(_lyrIdx, values[2]);
-            
+
 //             if(_mapLevel === 1){
 //                 values[1].map((item)=>{
 //                     if(item.link_id) item.id = item.link_id;

+ 1 - 3
src/main/resources/static/application/op/09.cros/03.statistics/01.drct-statistics/drct-statistics.js

@@ -158,9 +158,7 @@ function fetchBaseData(){
     const uri = "/api/scrs/tb_sc_ixr_mngm";
     getDataAsync(uri, (jsonData)=>{
         if (jsonData.length > 0) {
-            jsonData.sort(function (a, b){
-                return Number(a.ixr_id) > Number(b.ixr_id) ? 1 : Number(a.ixr_id) === Number(b.ixr_id) ? 0 : -1;
-            })
+            dataSorting(jsonData, 'ixr_nm')
             _ixrId.setValue(jsonData[0].ixr_id);
             getDataAsync('/api/scrs/tb_sc_ixr_cmra_mngm/' + encodeURIComponent(jsonData[0].ixr_id), drawList);
         }

+ 1 - 3
src/main/resources/static/application/op/09.cros/03.statistics/01.statistics-hs/statistics-hs.js

@@ -430,9 +430,7 @@ function fetchBaseData(){
         })
     }
     getDataAsync(uri, (jsonData)=>{
-        jsonData.sort(function(a,b){
-            return Number(a.ixr_id) > Number(b.ixr_id) ? 1 : Number(a.ixr_id) === Number(b.ixr_id) ? 0 : -1;
-        })
+        dataSorting(jsonData, 'ixr_nm');
         _ixrId.setDataSource(jsonData);
         if (jsonData[0]) {
             _ixrId.setValue(jsonData[0].ixr_id);

+ 2 - 2
src/main/resources/static/application/op/09.cros/03.statistics/02.traf-hs/traf-hs.js

@@ -263,7 +263,7 @@ $(()=>{
         ],
     }).dxDataGrid('instance');
 
-    ixrNm     = new dxSelect($(".ixr_nm"), 'outlined', 200, 30, 'ixr_nm', 'ixr_id', false, 'ixr_id', '교차로명');
+    ixrNm     = new dxSelect($(".ixr_nm"), 'outlined', 300, 30, 'ixr_nm', 'ixr_id', false, 'ixr_id', '교차로명');
     istlLctn  = new dxSelect($(".istl_lctn"), 'outlined', 300, 30, 'desc', 'cmra_id', false, 'cmra_id', '설치위치');
     unit      = new dxSelect($(".unit"), 'outlined', 150, 30, 'desc', 'unit', false, 'unit', '단위');
     strtDt    = new dxDate($(".strt-dt"), 'yyyy-MM-dd', '조회기간 시작일', 110, 30, 'date', null, '', null);
@@ -465,7 +465,7 @@ function fetchBaseData(){
         })
     }
     getDataAsync(uri, (jsonData)=>{
-        dataSorting(jsonData, 'ixr_id');
+        dataSorting(jsonData, 'ixr_nm');
         ixrNm.setDataSource(jsonData);
         if (jsonData[0]) {
             ixrNm.setValue(jsonData[0].ixr_id);

+ 130 - 54
src/main/resources/static/application/wall/main/main-func.js

@@ -21,11 +21,12 @@ let _isBlur               = false;
 let _rollingNum;
 let _visualNum;
 let _liNum;
-const _arrowSize          = new Array();
-const _lineSize           = new Array();
-const _strokeWidth        = new Array();
-const _imgSize            = new Array();
+const _arrowSize          = [];
+const _lineSize           = [];
+const _strokeWidth        = [];
+const _imgSize            = [];
 const drctMap   = new Map();
+
 drctMap.set(1, 0);
 drctMap.set(2, 90);
 drctMap.set(3, 180);
@@ -35,18 +36,22 @@ drctMap.set(6, 135);
 drctMap.set(7, 225);
 drctMap.set(8, 315);
 
-_arrowSize[16] = 8;
-_arrowSize[17] = 12;
-_arrowSize[18] = 24;
+_arrowSize[15] = 6;
+_arrowSize[16] = 6;
+_arrowSize[17] = 10;
+_arrowSize[18] = 18;
 
+_lineSize[15] = 3;
 _lineSize[16] = 3;
 _lineSize[17] = 5;
 _lineSize[18] = 8;
 
+_strokeWidth[15] = 3;
 _strokeWidth[16] = 3;
 _strokeWidth[17] = 5;
-_strokeWidth[18] = 10;
+_strokeWidth[18] = 8;
 
+_imgSize[15] = 55;
 _imgSize[16] = 55;
 _imgSize[17] = 90;
 _imgSize[18] = 175;
@@ -68,16 +73,34 @@ _signalLyr = new ol.layer.VectorImage({
     zIndex : 99,
     visible : false,
 });
+// _dotLyr = new ol.layer.Vector({
+//     source: new ol.source.Vector({
+//         features: [],
+//     }),
+//     style: function (feature, res) {
+//         return getDotStyle(feature, res);
+//     },
+//     zIndex: 99,
+//     visible: false,
+// } );
 _dotLyr = new ol.layer.Vector({
     source: new ol.source.Vector({
         features: [],
     }),
-    style: function(feature, res){
-        return getDotStyle(feature, res)
+    style: function (feature, res) {
+        return getDotLineStyle(feature, res);
     },
-    zIndex : 99,
-    visible : false,
+    zIndex: 99,
+    visible: false,
 });
+function getDotLineStyle(feature, res) {
+    let zoom = _mapManager.map.getView().getZoom();
+    let style = new ol.style.Style({
+        fill: new ol.style.Fill({ color: "yellow", weight: _lineSize[zoom] }),
+        stroke: new ol.style.Stroke({ color: "yellow", width: _lineSize[zoom] }),
+    });
+    return style;
+}
 class SigDrawer {
     constructor(sig, obj) {
         this.cntl_mode     = sig.cntl_mode;
@@ -90,8 +113,8 @@ class SigDrawer {
         this.dir_b         = sig.dir_b ;
         this.posA          = null;
         this.posB          = null;
-        this.coordAPointArr = new Array();
-        this.coordBPointArr = new Array();
+        this.coordAPointArr = [];
+        this.coordBPointArr = [];
         this.sgnl_ixr_nmbr = sig.sgnl_ixr_nmbr;
         this.spcl_cntl     = sig.spcl_cntl;
         this.endArrawA     = false;
@@ -129,8 +152,8 @@ class SigDrawer {
                 obj : this,
         });
         _circleLayer.getSource().addFeature(feature);
-        if (this.spcl_cntl === 1 && 
-            _mapManager.layerArr[LayerIndex.Sig].objMap.size > 0 && 
+        if (this.spcl_cntl === 1 &&
+            _mapManager.layerArr[LayerIndex.Sig].objMap.size > 0 &&
             $('.itsSIG')[0].src.indexOf('btnSIGOn.png') > -1) {
             let div = $('<div id="marker_' + _mapManager.map.getView().getZoom() +'"></div>')
             $('body').append(div);
@@ -166,45 +189,61 @@ class SigDrawer {
         let gapAngle;
         this.initDraw();
         if (a === 1 || a === 2) {   // 직진, 좌회전
-            gapAngle = (a === 1) ? 270 : 90;
+            //gapAngle = (a === 1) ? 270 : 90;
+            gapAngle = (a === 2) ? 270 : 90; //for 평택
             Adeg = ai + gapAngle;
             if (Adeg >= 360) Adeg = Adeg - 360;
-            this.posA = getDestinationPoint(this.coordinates[1], this.coordinates[0], Adeg, 8); 
+            this.posA = getDestinationPoint(this.coordinates[1], this.coordinates[0], Adeg, 8);
             this.endArrawA = true;
         }
         else if (a === 5) {
             // 보행신호
-            Adeg = ai + 270;
+            // Adeg = ai + 270;
+            // if (Adeg >= 360) Adeg = Adeg - 360;
+            // this.posA = getDestinationPoint(this.coordinates[1], this.coordinates[0], Adeg, 8);
+            gapAngle = 90; // FOR 평택
+            Adeg = ai + gapAngle;
             if (Adeg >= 360) Adeg = Adeg - 360;
             this.posA = getDestinationPoint(this.coordinates[1], this.coordinates[0], Adeg, 8);
         }
         this.coordAPointArr.push(getDestinationPoint(this.posA[1], this.posA[0], ai, 24));
         this.coordAPointArr.push(this.posA);
-        this.coordAPointArr.push(getDestinationPoint(this.posA[1], this.posA[0], ao, 24));
+        this.coordAPointArr.push(getDestinationPoint(this.posA[1], this.posA[0], ao, 22));
 
         if (b === 1 || b === 2) {
-            gapAngle = (b === 1) ? 270 : 90;
+            //gapAngle = (b === 1) ? 270 : 90;
+            gapAngle = (b === 2) ? 270 : 90; // for 평택
             Bdeg = bi + gapAngle;
             if (Bdeg >= 360) Bdeg = Bdeg - 360;
             this.posB = getDestinationPoint(this.coordinates[1], this.coordinates[0], Bdeg, 8);
             this.endArrawB = true;
         }
-        else if (a === 5) {
-            Bdeg = bi + 270;
+        else if (b === 5) {
+            // Bdeg = bi + 270;
+            // if (Bdeg >= 360) Bdeg = Bdeg - 360;
+            // this.posB = getDestinationPoint(this.coordinates[1], this.coordinates[0], Bdeg, 8);
+            gapAngle = 270; // FOR 평택
+            Bdeg = bi + gapAngle;
             if (Bdeg >= 360) Bdeg = Bdeg - 360;
             this.posB = getDestinationPoint(this.coordinates[1], this.coordinates[0], Bdeg, 8);
         }
-        this.coordBPointArr.push(getDestinationPoint(this.posB[1], this.posB[0], bi, 24));
-        this.coordBPointArr.push(this.posB);
-        this.coordBPointArr.push(getDestinationPoint(this.posB[1], this.posB[0], bo, 24));
-
+        if (a === 5 && b === 5) {
+            this.coordBPointArr = this.coordAPointArr;
+        } else {
+            this.coordBPointArr.push(getDestinationPoint(this.posB[1], this.posB[0], bi, 24));
+            this.coordBPointArr.push(this.posB);
+            this.coordBPointArr.push(getDestinationPoint(this.posB[1], this.posB[0], bo, 24));
+        }
         if (ai != 0 && ao != 0 && bi != 0 && bo != 0) {
-            this.drawSignalMap(ai, ao, bi, bo);
+            this.drawSignalMap();
         }
     }
 
     drawSignalMap() {
-        if (this.aCode != 0) {
+        if (this.spcl_cntl === 1) {
+            return;
+        }
+        if (this.coordAPointArr.length !== 0) {
             if (this.endArrawA) {
                 const feature = new ol.Feature({
                     geometry : new ol.geom.LineString([this.coordAPointArr[0], this.coordAPointArr[1], this.coordAPointArr[2]]),
@@ -214,18 +253,25 @@ class SigDrawer {
                 this.lineAFeatrue = feature;
             }
             else {
-                this.coordAPointArr.map((item)=>{
-                    const circle1 = new ol.geom.Circle(ol.proj.transform(item, "EPSG:4326", "EPSG:3857"), 4).transform("EPSG:3857", "EPSG:4326");
+                // this.coordAPointArr.map((item)=>{
+                //     let circle1 = new ol.geom.Circle(ol.proj.transform(item, "EPSG:4326", "EPSG:3857"), 4).transform("EPSG:3857", "EPSG:4326");
+                //     let doteFeature = new ol.Feature({
+                //         geometry: circle1,
+                //     });
+                //     _dotLyr.getSource().addFeature(doteFeature);
+                // });
+                if (this.coordAPointArr.length === 3) {
                     const feature = new ol.Feature({
-                        geometry: circle1,
+                        geometry: new ol.geom.LineString([this.coordAPointArr[0], this.coordAPointArr[1], this.coordAPointArr[2]]),
+                        obj: this,
                     });
-                    _dotLyr.getSource().addFeature(feature);
+                    _dotLyr.getSource().addFeature( feature );
                     this.lineAdote = feature;
-                })
+                }
             }
         }
 
-        if (this.bCode != 0) {
+        if (this.coordBPointArr.length !== 0) {
             if (this.endArrawB) {
                 const feature = new ol.Feature({
                     geometry : new ol.geom.LineString([this.coordBPointArr[0], this.coordBPointArr[1], this.coordBPointArr[2]]),
@@ -235,14 +281,21 @@ class SigDrawer {
                 this.lineBFeatrue = feature;
             }
             else {
-                this.coordBPointArr.map((item)=>{
-                    const circle1 = new ol.geom.Circle(ol.proj.transform(item, "EPSG:4326", "EPSG:3857"), 4).transform("EPSG:3857", "EPSG:4326");
+                // this.coordBPointArr.map((item)=>{
+                //     let circle1 = new ol.geom.Circle(ol.proj.transform(item, "EPSG:4326", "EPSG:3857"), 4).transform("EPSG:3857", "EPSG:4326");
+                //     let doteFeature = new ol.Feature({
+                //         geometry: circle1,
+                //     });
+                //     _dotLyr.getSource().addFeature(doteFeature);
+                // });
+                if (this.coordBPointArr.length === 3) {
                     const feature = new ol.Feature({
-                        geometry: circle1,
+                        geometry: new ol.geom.LineString([this.coordBPointArr[0], this.coordBPointArr[1], this.coordBPointArr[2]]),
+                        obj: this,
                     });
-                    _dotLyr.getSource().addFeature(feature);
+                    _dotLyr.getSource().addFeature( feature );
                     this.lineBdote = feature;
-                });
+                }
             }
         }
     }
@@ -258,13 +311,13 @@ class SigDrawer {
      * 신호 현시 선 색상
      * @param {*} spcl 0 없음, 1 점멸, 2 소등, 3 수동, 4 감응
      * @param {*} cntl 0 온라인, 1 오프라인, 2 트랜스, 3 통신장애
-     * @returns 
+     * @returns
      */
     setStrokeColor(spcl, cntl) {
         //제어 상태에 따른 선 색상 구분
         //기본값 #0000FF, 3 - 통신장애 #FF0000
-        
-        //특수 제어에 따른 선 색상 구분 
+
+        //특수 제어에 따른 선 색상 구분
         //기본값 #0000FF, 2 - 소등 #000000, 4 - 감응 #FF0000, 시차제 #FF00FF TODO 코드값 확인
         let strokeColor = '#0000FF'; //일반
         if (spcl === 2) {
@@ -368,7 +421,16 @@ function getStyle(feature, res) {
     flowStyle.setArrowSize([_arrowSize[zoom], _arrowSize[zoom]]);
     return flowStyle;
 }
-
+function getLineStyle(feature, res) {
+    let zoom = _mapManager.map.getView().getZoom();
+    let style = new ol.style.Style({
+        stroke: new ol.style.Stroke({
+            color: 'yellow',
+            width: _lineSize[zoom],
+        }),
+    })
+    return style;
+}
 function getDotStyle(feature, res) {
     let style = new ol.style.Style({
         image: new ol.style.Circle({
@@ -480,13 +542,22 @@ function onSocketReceived(AClientType, AMessage) {
         // VMS 메시지 생성 저장
     }
     else if (command === "sigPhaseStts") {
+        const start = new Date();
         initLayer();
+        const end1 = new Date();
         jsonData.map((sig)=>{
-            let obj = new SigDrawer(sig, _mapManager.layerArr[LayerIndex.Sig].objMap.get(sig.sgnl_ixr_nmbr));
-            obj.setCircle();
-            obj.setArrow();
-            _sigDrawerArr.push(obj);
-        })
+            const sigObj = _mapManager.layerArr[LayerIndex.Sig].objMap.get(sig.sgnl_ixr_nmbr);
+            if (sigObj !== undefined) {
+                let obj = new SigDrawer(sig, sigObj);
+                _sigDrawerArr.push(obj);
+                obj.setCircle();
+                if (obj.spcl_cntl !== 1 && obj.cntl_stts != 3) {
+                    obj.setArrow();
+                }
+            }
+        });
+        const end = new Date();
+        console.log(end1 - start, end - start);
     }
 }
 
@@ -536,11 +607,13 @@ export function doMap() {
 
 function onMapMoveEndFunc(AZoom, ACenterX, ACenterY, ALeft, ABottom, ARight, ATop) {
     if ($('.itsSIG').prop('src').indexOf('btnSIGOn.png') > -1) {
-        let stts = AZoom >= 16;
+        let stts = AZoom >= 15;
         _mapManager.showFacilityLayer('신호제어기', !stts);
-        _circleLayer.setVisible(stts);
-        _signalLyr.setVisible(stts);
-        _dotLyr.setVisible(stts);
+        if (_circleLayer.getVisible() !== stts) {
+            _circleLayer.setVisible(stts);
+            _signalLyr.setVisible(stts);
+            _dotLyr.setVisible(stts);
+        }
         let display = stts ? 'block' : 'none';
         $('.sig-img').css('display', display);
         if (_markerArr.length > 0) {
@@ -570,6 +643,7 @@ function onMouseClickFunc(ALyrIdx, ALyrName, ANmbr, ACoordX, ACoordY, X, Y) {
         fetchVmsDsplMsg(obj.NMBR, obj.NAME, obj.LAT, obj.LNG);
     } else if (ALyrName === "CCTV" || ALyrName === '웹카메라' || ALyrName === '교차로카메라') {
         //cctvMarkerClick(obj.NAME, obj.strmRtmpAddr, obj.LAT, obj.LNG); // 실무용
+        //console.log(X, Y);
         //cctvMarkerClick(obj.ID, obj.NAME, obj.rtc_id, obj.rtc_svr_ip, obj.rtc_svr_port, obj.LAT, obj.LNG); //개발용
         cctvMarkerClick(obj.ID, obj.NAME, obj.rtc_id, obj.rtc_svr_ip, obj.rtc_svr_port, X, Y); //개발용
     }
@@ -1584,6 +1658,8 @@ function openCCTV(RTC_ID, RTC_SVR_IP, RTC_SVR_PORT, ID) {
     const cctvBox = $('.' + ID);
     videoBox.on('dblclick', function (){
         let video = $('#video_' + ID)[0];
+        console.log(video.width);
+        console.log(cctvBox);
         if (video.width === 300) {
             cctvBox.css('width', 614);
             cctvBox.css('height', 550);
@@ -1637,7 +1713,7 @@ function calcCCtvDisplayTime(x, y) {
                 BIS._cctvOverlay.setPosition(undefined);
                 videojsCheck.Stop();
                 clearCctvInterval();
-                videojsCheck = null;
+                //videojsCheck = null;
             }
         });
     }

+ 13 - 7
src/main/resources/static/application/wall/main/main.css

@@ -737,19 +737,25 @@ hr { display:none !important; visibility:hidden; }
     width: 40px;
     height: 40px;
     background: url('/images/application_wall/sig/lightBlink_55.gif');
-    background-size: 40px 40px;
+    background-size: 38px 38px;
+}
+#marker_15{
+    width: 22px;
+    height: 22px;
+    background: url('/images/application_wall/sig/lightBlink_55.gif');
+    background-size: 22px 22px;
 }
 #marker_17{
-    width: 80px;
-    height: 80px;
+    width: 75px;
+    height: 75px;
     background: url('/images/application_wall/sig/lightBlink_90.gif');
-    background-size: 80px 80px;
+    background-size: 75px 75px;
 }
 #marker_18{
-    width: 160px;
-    height: 160px;
+    width: 150px;
+    height: 150px;
     background: url('/images/application_wall/sig/lightBlink_175.gif');
-    background-size: 160px 160px;
+    background-size: 150px 150px;
 }
 /* cctv팝업 */
 .map_popup_cctv {

+ 1 - 1
src/main/resources/static/libs/v6.14.1-dist/ol-ext/ol-ext.js

@@ -37505,7 +37505,7 @@ ol.style.FlowLine.prototype.getArrowSize = function() {
   return this._arrowSize || [16,16];
 };
 /** setArrowSize
- * @param {number|ol.size} size
+ * @param {*[]} size
  */
 ol.style.FlowLine.prototype.setArrowSize = function(size) {
   if (Array.isArray(size)) this._arrowSize = size;