Skip to content

J
JINRUN-DP
Commit 18bfc848 authored by xinzhedeai's avatar xinzhedeai
Browse files
Options

add：dp init

parent d7899a86
Hide whitespace changes
Inline Side-by-side
Showing with 2582 additions and 195 deletions
public/index.html
View file @ 18bfc848
...@@ -12,6 +12,9 @@ ...@@ -12,6 +12,9 @@
</title> </title>
<script src="./Cesium/Cesium.js"></script> <script src="./Cesium/Cesium.js"></script>
<link rel="stylesheet" href="./Cesium/Widgets/widgets.css"> <link rel="stylesheet" href="./Cesium/Widgets/widgets.css">
<script src="js/qf_web.min.js"></script>
<script type="text/javascript">qf.openCalcLayout({ dpr: 1 });</script>
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]--> <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
......
public/js/qf_web.min.js 0 → 100644
View file @ 18bfc848
/*
name: qf_web
version: V1.04190
*/
function _0x496d(_0x54e0ae,_0x1c5d36){var _0x2389fc=_0x587d();return _0x496d=function(_0x476bbf,_0x2c9267){_0x476bbf=_0x476bbf-0x11b;var _0x587dca=_0x2389fc[_0x476bbf];return _0x587dca;},_0x496d(_0x54e0ae,_0x1c5d36);}function _0x587d(){var _0x94a737=['attachEvent','exports','3544974YRBFSP','createElement','pid','body','1517761YnAuYx','webkitCancelAnimationFrame','wpr','touchstart','innerHeight','apply','children','parseInt','extend','contentWindow','848338JYHmzx','86280dvHwQT','requestAnimationFrame','constructor','__esModule','140eCYjsQ','clientHeight','286ZMIKgp','catch','mousedown','timerPointer','prototype','webkitRequestAnimationFrame','[[PromiseResult]]','Window\x20object\x20not\x20found!','run','rem;height:','transform','finally','prt','defineProperty','oCancelRequestAnimationFrame','rem;opacity:1','253466sLPkKt','layer','search','px\x200;font-size:','split','3YqHYTe','addEventListener','toStringTag','test','8qeXabM','nodeType','loaded','name','t,webkitT,MozT,msT,OT','charAt','devicePixelRatio','oRequestAnimationFrame','undefined','bind','touchend','appVersion','style','replace','Module','views','706320mFKflM','fontSize','scale(','ontouchstart','call','then','abort','resize','(((.+)+)+)+$','sort','ready','length','dpr','push','height','touchcancel','display:block;width:','object','0\x200','__proto__','timer','isArray','setting','random','document','function','remBase','msCancelRequestAnimationFrame','calcLayout','xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx','touchmove','default','transition','xxxxxxxx','mozRequestAnimationFrame','userAgent','msRequestAnimationFrame','toString','mousemove','toUpperCase','toLowerCase','init','keys','[object\x20Array]','clientWidth','mouseup','readyState','26625PScSAS','[[PromiseState]]','hasOwnProperty','mozCancelRequestAnimationFrame','getElementById','cssText','eval','rejected','join','dprb','envir','transformOrigin'];_0x587d=function(){return _0x94a737;};return _0x587d();}(function(_0x5301ce,_0x374081){var _0x539bdc={_0x56a371:0x15b,_0x2a14c5:0x149,_0x3ffbac:0x174,_0x5ab9a2:0x136,_0x28af6f:0x14b},_0x2a435f=_0x496d,_0x5f0305=_0x5301ce();while(!![]){try{var _0x5b3058=parseInt(_0x2a435f(_0x539bdc._0x56a371))/0x1+-parseInt(_0x2a435f(0x144))/0x2*(-parseInt(_0x2a435f(0x160))/0x3)+parseInt(_0x2a435f(_0x539bdc._0x2a14c5))/0x4*(-parseInt(_0x2a435f(0x128))/0x5)+parseInt(_0x2a435f(_0x539bdc._0x3ffbac))/0x6+-parseInt(_0x2a435f(0x13a))/0x7*(parseInt(_0x2a435f(0x164))/0x8)+-parseInt(_0x2a435f(_0x539bdc._0x5ab9a2))/0x9+parseInt(_0x2a435f(0x145))/0xa*(parseInt(_0x2a435f(_0x539bdc._0x28af6f))/0xb);if(_0x5b3058===_0x374081)break;else _0x5f0305['push'](_0x5f0305['shift']());}catch(_0xbe639){_0x5f0305['push'](_0x5f0305['shift']());}}}(_0x587d,0x36587),!function(_0x22a1e5){var _0x3f7d95={_0x12fa7a:0x12a,_0x10f4fb:0x178},_0xe9910b={_0x336e9e:0x185,_0x4e90a0:0x148},_0x4a870a={_0x9d6463:0x16c,_0x90584b:0x162,_0x48bd19:0x172},_0x347868={_0x13980b:0x178,_0x3b7641:0x135},_0x571734={_0x2b97d2:0x15d,_0x26c35a:0x17c},_0x222da9=(function(){var _0x43bf06=!![];return function(_0x4edeed,_0x410783){var _0x562fe0=_0x43bf06?function(){var _0x375242=_0x496d;if(_0x410783){var _0x4965b5=_0x410783[_0x375242(0x13f)](_0x4edeed,arguments);return _0x410783=null,_0x4965b5;}}:function(){};return _0x43bf06=![],_0x562fe0;};}()),_0x35d817={};function _0x2380d2(_0x3f7612){var _0x3906a1=_0x496d,_0x4b7144=_0x222da9(this,function(){var _0x26bd10=_0x496d;return _0x4b7144[_0x26bd10(0x11e)]()[_0x26bd10(_0x571734._0x2b97d2)](_0x26bd10(0x17c))[_0x26bd10(0x11e)]()['constructor'](_0x4b7144)['search'](_0x26bd10(_0x571734._0x26c35a));});_0x4b7144();if(_0x35d817[_0x3f7612])return _0x35d817[_0x3f7612][_0x3906a1(0x135)];var _0x4c7263=_0x35d817[_0x3f7612]={'i':_0x3f7612,'l':!0x1,'exports':{}};return _0x22a1e5[_0x3f7612][_0x3906a1(_0x347868._0x13980b)](_0x4c7263[_0x3906a1(_0x347868._0x3b7641)],_0x4c7263,_0x4c7263[_0x3906a1(0x135)],_0x2380d2),_0x4c7263['l']=!0x0,_0x4c7263[_0x3906a1(0x135)];}_0x2380d2['m']=_0x22a1e5,_0x2380d2['c']=_0x35d817,_0x2380d2['d']=function(_0x1d8de1,_0x5737f2,_0x4515f3){var _0x31e119=_0x496d;_0x2380d2['o'](_0x1d8de1,_0x5737f2)||Object[_0x31e119(0x158)](_0x1d8de1,_0x5737f2,{'enumerable':!0x0,'get':_0x4515f3});},_0x2380d2['r']=function(_0x25a4ab){var _0x136f1a=_0x496d;_0x136f1a(_0x4a870a._0x9d6463)!=typeof Symbol&&Symbol[_0x136f1a(_0x4a870a._0x90584b)]&&Object['defineProperty'](_0x25a4ab,Symbol[_0x136f1a(0x162)],{'value':_0x136f1a(_0x4a870a._0x48bd19)}),Object['defineProperty'](_0x25a4ab,'__esModule',{'value':!0x0});},_0x2380d2['t']=function(_0x2ca310,_0x21ea12){var _0x5cc6af=_0x496d;if(0x1&_0x21ea12&&(_0x2ca310=_0x2380d2(_0x2ca310)),0x8&_0x21ea12)return _0x2ca310;if(0x4&_0x21ea12&&_0x5cc6af(_0xe9910b._0x336e9e)==typeof _0x2ca310&&_0x2ca310&&_0x2ca310[_0x5cc6af(_0xe9910b._0x4e90a0)])return _0x2ca310;var _0x239fc9=Object['create'](null);if(_0x2380d2['r'](_0x239fc9),Object[_0x5cc6af(0x158)](_0x239fc9,_0x5cc6af(0x193),{'enumerable':!0x0,'value':_0x2ca310}),0x2&_0x21ea12&&'string'!=typeof _0x2ca310){for(var _0x24da86 in _0x2ca310)_0x2380d2['d'](_0x239fc9,_0x24da86,function(_0x31a804){return _0x2ca310[_0x31a804];}[_0x5cc6af(0x16d)](null,_0x24da86));}return _0x239fc9;},_0x2380d2['n']=function(_0x66708b){var _0x3f07c2=_0x66708b&&_0x66708b['__esModule']?function(){return _0x66708b['default'];}:function(){return _0x66708b;};return _0x2380d2['d'](_0x3f07c2,'a',_0x3f07c2),_0x3f07c2;},_0x2380d2['o']=function(_0x12304f,_0x13b72b){var _0x1d29d6=_0x496d;return Object[_0x1d29d6(0x14f)][_0x1d29d6(_0x3f7d95._0x12fa7a)][_0x1d29d6(_0x3f7d95._0x10f4fb)](_0x12304f,_0x13b72b);},_0x2380d2['p']='',_0x2380d2(_0x2380d2['s']=0x0);}([function(_0x25b95c,_0x4d8f91,_0x34b70d){var _0x302764=_0x496d;_0x25b95c[_0x302764(0x135)]=_0x34b70d(0x1);},function(_0x1fb5b6,_0x135f46,_0x4506ee){var _0x5b64b4={_0x3b584:0x18c};!function(_0x46b135,_0x387766){var _0x3bfc2c={_0x1498b4:0x11c,_0x3101a7:0x121,_0x4619ef:0x163,_0x4bd8be:0x177,_0x323c23:0x14d,_0x463f12:0x192,_0x2ac216:0x16e,_0x1cfd32:0x183,_0x1e0ae9:0x126,_0x4db927:0x146,_0x9acceb:0x11b,_0x2495c3:0x16b,_0x3676c3:0x11d,_0x2b8650:0x13b,_0x15e6ce:0x125,_0x257fac:0x139,_0x1d821b:0x16a,_0xab6140:0x14f,_0x1f56c7:0x142,_0x2d73c0:0x142,_0x1476aa:0x161},_0x422219={_0x280db7:0x17f,_0x3580ac:0x178},_0x25bda4={_0x3e6f9e:0x189,_0x488eb4:0x17e},_0x12227f={_0x2e8e8e:0x180,_0x287f3b:0x18a,_0x3b82bf:0x18a,_0x4ea94b:0x18e,_0x3a653a:0x13c,_0x34dcdc:0x17e},_0x2b727c={_0x47483d:0x18a},_0xd0d28c={_0x3bec70:0x18a,_0x10b617:0x131,_0x106789:0x155,_0x39f47e:0x182,_0x5bcb27:0x170},_0x931070={_0x5d06d2:0x132},_0x5a2475={_0x461145:0x141},_0x14c8f0={_0x333b56:0x13e},_0x4613fe={_0x439979:0x13f},_0x3fb04b={_0x35e98f:0x171},_0xd0db21={_0x2c7103:0x124,_0x4f4fa8:0x11e,_0x1c8214:0x178},_0x5b5f76={_0xf6ddc3:0x169},_0x1a957e=_0x496d;if(!_0x46b135[_0x1a957e(_0x5b64b4._0x3b584)])throw new Error(_0x1a957e(0x152));(function(_0x55739d,_0x1494b9){var _0x5a7f26={_0x1f7904:0x17e},_0x1400e3={_0x1ee0a7:0x142},_0x1368d8={_0x5a51a7:0x12c,_0x11ddee:0x173,_0x40ab92:0x184,_0x55273e:0x15a},_0x1cc747={_0x37f63c:0x125,_0x473ff8:0x190},_0x1ed2c0={_0x82a5d4:0x132,_0x3ee92f:0x13c},_0x5ef2d6={_0x493dea:0x163},_0x2e3962={_0x2b7813:0x185},_0x2a41d1={_0x1ca0ff:0x165},_0x1aa684={_0x107578:0x12e,_0x33cf4f:0x178},_0x21eb9a={_0x39851e:0x127},_0x143a5e={_0x26da0f:0x143},_0x1ad6e8={_0x27f314:0x157,_0x449105:0x122},_0x1f140b={_0x33fe3d:0x15f},_0x114188=_0x1a957e,_0x5bc215=document,_0xfff213=_0x5bc215['body'],_0x192bf5=_0x5bc215[_0x114188(0x137)]('div')[_0x114188(0x170)],_0x456b72=(function(){var _0x1b0989=_0x114188;for(var _0x46ffad=_0x1b0989(0x168)[_0x1b0989(_0x1f140b._0x33fe3d)](','),_0x3bab21=0x0,_0x324b46=_0x46ffad[_0x1b0989(0x17f)];_0x3bab21<_0x324b46;_0x3bab21++)if(_0x46ffad[_0x3bab21]+'ransform'in _0x192bf5)return _0x46ffad[_0x3bab21]['substr'](0x0,_0x46ffad[_0x3bab21][_0x1b0989(0x17f)]-0x1);return!0x1;}()),_0x487d4e=function(_0x1d2be1){var _0xfe9dd=_0x114188;return''===_0x456b72?_0x1d2be1:_0x456b72+_0x1d2be1[_0xfe9dd(_0x5b5f76._0xf6ddc3)](0x0)[_0xfe9dd(0x120)]()+_0x1d2be1['substr'](0x1);},_0x59d2a7=(navigator[_0x114188(_0x3bfc2c._0x1498b4)][_0x114188(_0x3bfc2c._0x3101a7)](),_0x487d4e('transform')),_0xb28ccc=(_0x487d4e(_0x114188(0x194)),/hp-tablet/gi[_0x114188(_0x3bfc2c._0x4619ef)](navigator[_0x114188(0x16f)])),_0x1f05f4=_0x114188(_0x3bfc2c._0x4bd8be)in _0x55739d&&!_0xb28ccc,_0x4262c4=_0x1f05f4?_0x114188(0x13d):_0x114188(_0x3bfc2c._0x323c23),_0x442d34=_0x1f05f4?_0x114188(_0x3bfc2c._0x463f12):_0x114188(0x11f),_0x2efc4a=_0x1f05f4?_0x114188(_0x3bfc2c._0x2ac216):_0x114188(0x126),_0xe6eb18=_0x1f05f4?_0x114188(_0x3bfc2c._0x1cfd32):_0x114188(_0x3bfc2c._0x1e0ae9),_0x38f2ff=[],_0x438790=(_0x55739d[_0x114188(_0x3bfc2c._0x4db927)]||_0x55739d[_0x114188(0x150)]||_0x55739d[_0x114188(_0x3bfc2c._0x9acceb)]||_0x55739d[_0x114188(_0x3bfc2c._0x2495c3)]||_0x55739d[_0x114188(_0x3bfc2c._0x3676c3)],_0x55739d['cancelRequestAnimationFrame']||_0x55739d[_0x114188(_0x3bfc2c._0x2b8650)]||_0x55739d['webkitCancelRequestAnimationFrame']||_0x55739d[_0x114188(0x12b)]||_0x55739d[_0x114188(0x159)]||_0x55739d[_0x114188(0x18f)]||clearTimeout,function(_0x49ac0a,_0x5a0e1d){var _0x54c39c=_0x114188;return new _0x438790[(_0x54c39c(_0x1ad6e8._0x27f314))][(_0x54c39c(_0x1ad6e8._0x449105))](_0x49ac0a,_0x5a0e1d);}),_0x148572=_0x5bc215['documentElement'],_0x239734=(_0x148572[_0x114188(_0x3bfc2c._0x15e6ce)]||_0x148572[_0x114188(0x139)]&&_0x148572[_0x114188(_0x3bfc2c._0x257fac)]['clientWidth'],_0x55739d['devicePixelRatio']>=0x2?0x2:_0x55739d[_0x114188(_0x3bfc2c._0x1d821b)]);_0x438790['prt']=_0x438790[_0x114188(_0x3bfc2c._0xab6140)]={'constructor':_0x438790,'splice':[]['splice']},_0x438790[_0x114188(_0x3bfc2c._0x1f56c7)]=function(){var _0x229dd1,_0x4a8e12=arguments[0x0];for(_0x229dd1 in _0x4a8e12)this[_0x229dd1]=_0x4a8e12[_0x229dd1];return this;},_0x438790[_0x114188(0x142)]({'envir':{'dummyStyle':_0x192bf5,'vendor':_0x456b72,'dpr':_0x239734,'hasTouch':_0x1f05f4,'event':{'start':_0x4262c4,'move':_0x442d34,'end':_0x2efc4a,'cancel':_0xe6eb18}},'setting':{'w':0x780,'h':0x438,'mw':0x258,'fs':0xc,'stb':0x5a0,'stw':0x780,'dprb':0x64}}),_0x438790[_0x114188(_0x3bfc2c._0x2d73c0)]({'iframeLoad':function(_0x461c10){var _0xafb1fd=this[0x0];_0xafb1fd['onload']=function(_0x4946d5){var _0x8cb6f0=_0x496d;_0x461c10&&_0x461c10(_0xafb1fd[_0x8cb6f0(_0x143a5e._0x26da0f)],_0x4946d5);};},'ready':function(_0x2c526d,_0x5a29f1){var _0x5e8bde=_0x114188,_0x56e68a=function(){var _0xf52273=_0x496d;_0x5a29f1&&(_0xfff213=_0x5bc215[_0xf52273(0x139)]),_0x438790[_0xf52273(0x127)]=!0x0,_0x2c526d&&_0x2c526d(_0x438790);};_0x438790[_0x5e8bde(_0x21eb9a._0x39851e)]?_0x2c526d&&_0x2c526d(_0x438790):_0x55739d['addEventListener']?_0x55739d['addEventListener']('load',_0x56e68a,!0x1):_0x55739d[_0x5e8bde(0x134)]('onload',_0x56e68a);},'isArray':function(_0x428e7d){var _0xc5214e=_0x114188;return _0x428e7d&&_0xc5214e(_0xd0db21._0x2c7103)===Object[_0xc5214e(0x14f)][_0xc5214e(_0xd0db21._0x4f4fa8)][_0xc5214e(_0xd0db21._0x1c8214)](_0x428e7d);},'trim':function(_0xe39185){var _0x526659=_0x114188;return null==_0xe39185?'':(_0xe39185+'')[_0x526659(_0x3fb04b._0x35e98f)](/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,'');},'eval':function(_0x4c265d){var _0x470303=_0x114188;return new Function('return\x20('+_0x4c265d+')')[_0x470303(0x178)](this);},'dataRender':function(_0x27d539,_0x12815f,_0x120790){var _0x5bc739=_0x114188;return _0x27d539[_0x5bc739(0x171)](/\{{(.+?)\}}/g,function(_0x14b5c8,_0x19bdef){var _0x1d9b05=_0x5bc739;return _0x120790?_0x120790(_0x14b5c8,_0x19bdef):_0x438790[_0x1d9b05(_0x1aa684._0x107578)][_0x1d9b05(_0x1aa684._0x33cf4f)](_0x12815f,_0x19bdef);});},'resize':function(_0x104311){var _0x4f669d=_0x114188;_0x104311&&_0x104311[_0x4f669d(_0x4613fe._0x439979)]&&_0x38f2ff[_0x4f669d(0x181)](_0x104311);},'isElement':function(_0x5bc82d){var _0x37854d=_0x114188;return(_0x37854d(_0x2e3962._0x2b7813)==typeof HTMLElement?function(_0x50e117){return _0x50e117 instanceof HTMLElement;}:function(_0x624520){var _0x58ff8f=_0x37854d;return _0x624520&&0x1===_0x624520[_0x58ff8f(_0x2a41d1._0x1ca0ff)];})(_0x5bc82d);},'isPhoneNum':function(_0x343233){var _0x22fc94=_0x114188;return/^[1][3,4,5,6.7,8,9][0-9]{9}$/[_0x22fc94(_0x5ef2d6._0x493dea)](_0x343233);}}),_0x438790[_0x114188(_0x3bfc2c._0x1f56c7)]({'getWindowHeight':function(){var _0x363b50=_0x114188;return _0x55739d[_0x363b50(_0x14c8f0._0x333b56)]||_0x5bc215[_0x363b50(0x14a)]||_0x148572['clientHeight'];},'parseRem':function(_0x383a95){var _0x58c1b4=_0x114188;return _0x55739d[_0x58c1b4(_0x5a2475._0x461145)](_0x383a95)*this['envir']['remBase'];},'parsePixel':function(_0x31509b){var _0x42dd99=_0x114188;return _0x31509b/this[_0x42dd99(_0x931070._0x5d06d2)][_0x42dd99(0x18e)];},'parseRpx':function(_0x44c7e){var _0x4847ef=_0x114188;return _0x44c7e*this[_0x4847ef(_0x1ed2c0._0x82a5d4)][_0x4847ef(_0x1ed2c0._0x3ee92f)];},'parseWpx':function(_0x20e7f1){var _0x57a36c=_0x114188;return _0x20e7f1/this['envir'][_0x57a36c(0x13c)];},'rpxToRem':function(_0x1d1e38){var _0x30b145=_0x114188;return _0x1d1e38/this[_0x30b145(0x132)]['wpr']*this['envir']['remBase'];},'areaVisualNormal':function(_0x916b24){var _0xd73720=_0x114188,_0x541d8b=this[_0xd73720(_0xd0d28c._0x3bec70)]['dpr'],_0x19d379=this[_0xd73720(0x18a)][_0xd73720(_0xd0d28c._0x10b617)]/_0x541d8b+'%';_0x916b24['style'][_0xd73720(0x133)]=_0xd73720(0x186),_0x916b24['style'][_0xd73720(_0xd0d28c._0x106789)]=_0xd73720(0x176)+_0x541d8b+')',_0x916b24[_0xd73720(0x170)][_0xd73720(_0xd0d28c._0x39f47e)]=_0x19d379,_0x916b24[_0xd73720(0x170)]['width']=_0x19d379,_0x916b24[_0xd73720(_0xd0d28c._0x5bcb27)][_0xd73720(0x175)]=this[_0xd73720(_0xd0d28c._0x3bec70)]['fs']+'px';},'openCalcLayout':function(_0x54cdc4){var _0x19b46a=_0x114188;this[_0x19b46a(0x18a)]['dpr']=_0x54cdc4&&_0x54cdc4['dpr']||_0x239734;var _0x16064f=this[_0x19b46a(_0x2b727c._0x47483d)]['h']/this[_0x19b46a(0x18a)]['w'],_0x30f336=this['setting']['mw'],_0x4dc8be=function(){var _0x5cf930=_0x19b46a,_0x5e2e2c=_0x148572[_0x5cf930(_0x1cc747._0x37f63c)]>_0x30f336?_0x148572['clientWidth']:_0x30f336,_0x59a6d1=_0x5e2e2c*_0x16064f;_0x438790[_0x5cf930(_0x1cc747._0x473ff8)](_0x59a6d1,_0x5e2e2c);};_0x4dc8be(),this['resize'](_0x4dc8be);},'calcLayout':function(_0x1c299d,_0x28abe5){var _0x4a63e6=_0x114188;if(_0x28abe5){var _0x1173ed=this['setting'][_0x4a63e6(_0x12227f._0x2e8e8e)],_0x94f8=this['setting']['fs']*_0x1173ed,_0x55317c=this[_0x4a63e6(_0x12227f._0x287f3b)]['w'],_0x2c2d4b=_0x55317c/this[_0x4a63e6(_0x12227f._0x3b82bf)]['dprb'],_0x3b5090=_0x2c2d4b/_0x55317c,_0xd58388=0x1/_0x1173ed,_0x46ff90=_0x28abe5-_0x55317c,_0x3642e6=_0x46ff90>0x0?_0x55317c:!(_0x46ff90=0x0)&&_0x28abe5;this[_0x4a63e6(0x132)][_0x4a63e6(_0x12227f._0x4ea94b)]=_0x3b5090,this[_0x4a63e6(0x132)][_0x4a63e6(_0x12227f._0x3a653a)]=_0x3642e6/_0x55317c*_0x1173ed,_0x148572['style']['fontSize']=this['setting']['dprb']*(_0x3642e6/_0x55317c)*_0x1173ed+'px';var _0x137054=function(){var _0x4e8920=_0x4a63e6;(document[_0x4e8920(_0x1368d8._0x5a51a7)](_0x4e8920(_0x1368d8._0x11ddee))||_0xfff213)[_0x4e8920(0x170)][_0x4e8920(0x12d)]=_0x4e8920(_0x1368d8._0x40ab92)+_0x2c2d4b+_0x4e8920(0x154)+0x64*_0x1173ed+'%;'+_0x59d2a7+':scale('+_0xd58388+');'+_0x59d2a7+'-origin:'+_0x46ff90+_0x4e8920(0x15e)+_0x3b5090*_0x94f8+_0x4e8920(_0x1368d8._0x55273e);};_0xfff213?_0x137054():_0x438790[_0x4a63e6(_0x12227f._0x34dcdc)](_0x137054);}}}),_0x438790[_0x114188(_0x3bfc2c._0x2d73c0)]({'funchain':function(_0x5f0825,_0x45e075){var _0x427ff5={_0x5b32f5:0x122},_0x52d917={_0x4f1bc3:0x178,_0x5a1c3b:0x135,_0x3ed3b0:0x166,_0x2cfca4:0x135},_0x1b95a5=_0x114188;_0x45e075=_0x438790[_0x1b95a5(_0x25bda4._0x3e6f9e)](_0x45e075)?_0x45e075:[_0x5f0825,[]][_0x438790[_0x1b95a5(0x189)](_0x5f0825)?~~(_0x5f0825=void 0x0):0x1],len=_0x45e075['length'],_0x438790[_0x1b95a5(_0x25bda4._0x488eb4)](function(){var _0x3ae403=_0x1b95a5;function _0x4244ca(_0x144ad4){var _0x36b364=_0x496d;if(_0x2d9c49[_0x144ad4])return _0x2d9c49[_0x144ad4][_0x36b364(0x135)];var _0x5f4f21=_0x2d9c49[_0x144ad4]={'exports':{},'id':_0x144ad4,'loaded':!0x1,'prev':function(){return _0x4244ca(_0x144ad4&&_0x144ad4-0x1);},'next':function(){return _0x144ad4<len-0x1?_0x4244ca(_0x144ad4+0x1):null;},'first':function(){return _0x4244ca(0x0);},'last':function(){return _0x4244ca(len-0x1);}};return _0x5f4f21['loaded']=!0x0,_0x4244ca['i']=_0x144ad4,_0x45e075[_0x144ad4]?_0x45e075[_0x144ad4][_0x36b364(_0x52d917._0x4f1bc3)](_0x5f4f21,_0x5f4f21['exports'],_0x4244ca,_0x144ad4):_0x5f0825[_0x36b364(0x178)](_0x5f4f21,function(_0x2b2ea8){_0x4244ca(_0x2b2ea8||0x0);},_0x5f4f21[_0x36b364(_0x52d917._0x5a1c3b)],_0x4244ca),_0x5f4f21[_0x36b364(_0x52d917._0x3ed3b0)],_0x5f4f21[_0x36b364(_0x52d917._0x2cfca4)];}var _0x2d9c49={};return _0x4244ca['m']=_0x45e075,_0x4244ca['c']=_0x2d9c49,_0x4244ca['p']='',_0x4244ca(_0x5f0825?_0x3ae403(_0x427ff5._0x5b32f5):0x0);});},'Async':new function(){var _0x19d9c3={_0x34e401:0x129,_0x2b0834:0x187,_0x4cfe19:0x179,_0xc432ed:0x156,_0x2d7e80:0x17a},_0x29e129={_0x4e1960:0x14c},_0x2ddd2a={_0x4cfea2:0x17f,_0x588cce:0x16d},_0x3c1b82={_0x501b8c:0x153,_0x205bd7:0x178},_0x4f4375={_0x4ef553:0x14e},_0x370992=_0x114188;_0x438790[_0x370992(_0x1400e3._0x1ee0a7)]['call'](this,{'timeoutFilter':function(_0x26e911){var _0x2eed15=0x0;return _0x26e911=_0x26e911||0x3e8,_0x3490cf=>{_0x2eed15&&clearTimeout(_0x2eed15),_0x2eed15=setTimeout(_0x3490cf&&_0x3490cf||function(){},_0x26e911);};},'timerCtrl':function(_0x36f54d,_0x29e09d){var _0x23a567={_0x25b110:0x14e},_0x1dd5c0={_0x24009a:0x153},_0x179991={_0x167ef0:0x188,_0x594acb:0x15c},_0x549a11={_0x38d39d:0x14e,_0x393c06:0x15c,_0x48e5db:0x16d},_0x536e16={'timer':_0x36f54d||0x1388,'name':_0x29e09d,'run':function(_0x3a0603){var _0x24b206=_0x496d;clearInterval(_0x536e16['timerPointer']),_0x536e16[_0x24b206(_0x549a11._0x38d39d)]=setInterval(_0x536e16['fn'][_0x24b206(0x16d)](_0x536e16[_0x24b206(_0x549a11._0x393c06)]),_0x536e16[_0x24b206(0x188)]),_0x3a0603&&_0x536e16['fn'][_0x24b206(_0x549a11._0x48e5db)](_0x536e16[_0x24b206(0x15c)])();}},_0x15a99c=function(_0x468e4f){var _0x5b4374={_0x4a594a:0x167,_0x3bd9af:0x188},_0x21d996=_0x496d;_0x536e16[_0x21d996(_0x179991._0x167ef0)]=_0x468e4f,_0x536e16[_0x21d996(_0x179991._0x594acb)]=this;var _0x5d1107=function(_0x419c93,_0x30ca81,_0x4a39b5){var _0x217b25=_0x21d996;_0x217b25(0x18d)==typeof _0x419c93&&(_0x536e16[_0x217b25(_0x5b4374._0x4a594a)]=_0x4a39b5,_0x30ca81&&(_0x536e16[_0x217b25(_0x5b4374._0x3bd9af)]=_0x30ca81),_0x536e16['fn']=_0x419c93,_0x536e16[_0x217b25(0x153)][_0x217b25(0x178)](this));};return _0x5d1107['__proto__']=this['__proto__'],_0x5d1107;};return _0x15a99c['prototype']={'stop':function(){var _0xec4047=_0x496d;_0x536e16[_0xec4047(_0x4f4375._0x4ef553)]&&clearInterval(_0x536e16['timerPointer']);},'start':function(_0x5cab29){var _0x2c22d4=_0x496d;_0x536e16['fn']&&_0x536e16[_0x2c22d4(_0x1dd5c0._0x24009a)][_0x2c22d4(0x178)](this,_0x5cab29);},'setTime':function(_0x2d96e9){var _0xcbf590=_0x496d;_0x2d96e9&&(_0x536e16['timer']=_0x2d96e9),_0x536e16['fn']&&_0x536e16[_0xcbf590(_0x3c1b82._0x501b8c)][_0xcbf590(_0x3c1b82._0x205bd7)](this);},'clear':function(){var _0x4a66b5=_0x496d;_0x536e16[_0x4a66b5(0x14e)]&&clearInterval(_0x536e16[_0x4a66b5(_0x23a567._0x25b110)]),_0x536e16={'timer':0x1388};}},new _0x15a99c(_0x36f54d);},'loopList':function(_0x2233b0,_0x4850e9,_0x5b46df){var _0x560e64={_0xe4efec:0x178},_0x133930={_0x3dd7f3:0x178},_0x25d29f=_0x370992,_0x19eddb='object'==typeof _0x2233b0?Object[_0x25d29f(0x123)](_0x2233b0):_0x2233b0||[],_0x7d0ae2=_0x19eddb[_0x25d29f(_0x2ddd2a._0x4cfea2)];(function _0x14af2d(_0x5caec2){var _0xec87e4={_0xf351ee:0x178};_0x5caec2<_0x7d0ae2?((()=>{var _0x24ec9a=_0x496d,_0x1d687d=_0x19eddb[_0x5caec2];_0x4850e9&&_0x4850e9[_0x24ec9a(_0x133930._0x3dd7f3)](this,_0x1d687d,_0x2233b0[_0x1d687d],()=>{var _0x3b195d=_0x24ec9a;_0x14af2d[_0x3b195d(_0xec87e4._0xf351ee)](this,++_0x5caec2);},_0x5caec2);})()):((()=>{var _0x43ebf4=_0x496d;_0x5b46df&&_0x5b46df[_0x43ebf4(_0x560e64._0xe4efec)](this);})());}[_0x25d29f(_0x2ddd2a._0x588cce)](this)(0x0));},'Promise':function(_0x2c7f26){var _0x5205f2={_0x3c09f2:0x12f},_0x2eec8c={_0x581754:0x147},_0x4ca635={_0x2c686c:0x12f},_0x58b083=_0x370992;let _0x13a97a=_0x58b083(0x158),_0x28e54a=_0x58b083(0x151),_0x455bf4=_0x58b083(_0x19d9c3._0x34e401),_0x5c4694=new Promise(function(_0xf67463,_0x1e7fd5){_0x2c7f26['abort']=function(){var _0x10097c=_0x496d;_0x1e7fd5(arguments[0x0]),Object[_0x13a97a](_0x3a7775,_0x455bf4,{'value':_0x10097c(_0x4ca635._0x2c686c),'writable':!0x0});},_0x2c7f26(_0xf67463,_0x1e7fd5);}),_0x3a7775=new function(){var _0x40829a=_0x58b083;this[_0x40829a(0x187)]['constructor']=_0x5c4694[_0x40829a(_0x2eec8c._0x581754)];}(),_0x1c1a7b=_0x3a7775[_0x58b083(_0x19d9c3._0x2b0834)];return Object[_0x13a97a](_0x1c1a7b,_0x58b083(_0x19d9c3._0x4cfe19),{'value':function(){let _0x2b3511=arguments[0x0];return _0x5c4694=_0x5c4694['then'](async function(){var _0x353397=_0x496d;if(_0x353397(_0x5205f2._0x3c09f2)!==_0x3a7775[_0x455bf4]){var _0x17dbe3=await _0x2b3511(_0x3a7775[_0x28e54a]||arguments[0x0]);return Object[_0x13a97a](_0x3a7775,_0x28e54a,{'value':_0x17dbe3||_0x3a7775[_0x28e54a],'writable':!0x0}),_0x17dbe3;}},function(_0x20022a){}),_0x3a7775;}}),Object[_0x13a97a](_0x1c1a7b,_0x58b083(0x14c),{'value':function(){var _0x122086=_0x58b083;return _0x5c4694[_0x122086(_0x29e129._0x4e1960)](arguments[0x0]),_0x3a7775;}}),Object[_0x13a97a](_0x1c1a7b,_0x58b083(_0x19d9c3._0xc432ed),{'value':function(){let _0x4a2722=arguments[0x0];return _0x5c4694['finally'](function(){return _0x4a2722&&_0x4a2722(),_0x3a7775;}),_0x3a7775;}}),Object[_0x13a97a](_0x1c1a7b,_0x58b083(_0x19d9c3._0x2d7e80),{'value':_0x2c7f26[_0x58b083(_0x19d9c3._0x2d7e80)]}),_0x3a7775;}});}(),'Utils':new function(){var _0x5daabd={_0x3dbfcb:0x123,_0x224e3e:0x17d};return{'UUID':function(){var _0x36db59={_0x310484:0x11e},_0x5adc2e=_0x496d;return _0x5adc2e(0x191)[_0x5adc2e(0x171)](/[xy]/g,function(_0xcf846a){var _0x2f23ab=_0x5adc2e,_0x117881=0x10*Math[_0x2f23ab(0x18b)]()|0x0;return('x'==_0xcf846a?_0x117881:0x3&_0x117881|0x8)[_0x2f23ab(_0x36db59._0x310484)](0x10);});},'Guid':function(_0x2d8672,_0x282269){var _0x35a260={_0x3fc61b:0x18b},_0x3b7ca7=_0x496d;return(_0x2d8672||'')+(_0x282269?new Array(_0x282269+0x1)[_0x3b7ca7(0x130)]('x'):_0x3b7ca7(0x195))['replace'](/[xy]/g,function(_0x41625a){var _0x20ae91=_0x3b7ca7,_0x910dac=0x10*Math[_0x20ae91(_0x35a260._0x3fc61b)]()|0x0;return('x'==_0x41625a?_0x910dac:0x3&_0x910dac|0x8)[_0x20ae91(0x11e)](0x10);});},'treeListBuild':function(_0x421983){var _0x2b65e5=_0x496d;for(var _0x385a23={},_0x53c2c5={},_0x12aaed=_0x421983[_0x2b65e5(0x17f)],_0x4e5d0b=0x0;_0x4e5d0b<_0x12aaed;_0x4e5d0b++){_0x385a23[~~(_0x151852=_0x421983[_0x4e5d0b])['pid']]=_0x53c2c5[_0x151852['id']]=_0x151852;}for(var _0x151852 of _0x421983){var _0x21e8d2=_0x53c2c5[_0x151852[_0x2b65e5(0x138)]];if(_0x21e8d2){var _0x1ed75d=_0x21e8d2['children'];_0x21e8d2[_0x2b65e5(0x140)]=_0x1ed75d&&_0x1ed75d[_0x2b65e5(0x181)](_0x151852)&&_0x1ed75d||[_0x151852];}}return _0x53c2c5=null,_0x385a23[Object[_0x2b65e5(_0x5daabd._0x3dbfcb)](_0x385a23)[_0x2b65e5(_0x5daabd._0x224e3e)]()[0x0]];}};}()}),_0x55739d[_0x114188(_0x3bfc2c._0x1476aa)](_0x114188(0x17b),function(){var _0x15755c=_0x114188;for(var _0x5ac4e7=_0x38f2ff[_0x15755c(_0x422219._0x280db7)],_0x22595d=0x0;_0x22595d<_0x5ac4e7;_0x22595d++)_0x38f2ff[_0x22595d][_0x15755c(_0x422219._0x3580ac)](_0x438790);},!0x1),(_0x438790['prt']['init']=function(_0x4be45c,_0x10dd02){var _0xc7d12=_0x114188;return _0x4be45c[_0xc7d12(0x165)]?(this[0x0]=_0x4be45c,this['length']=0x1,this):typeof _0x4be45c==='function'?_0x438790[_0xc7d12(_0x5a7f26._0x1f7904)](_0x4be45c,_0x10dd02):_0x4be45c;})[_0x114188(0x14f)]=_0x438790[_0x114188(0x157)],_0x438790(function(){},0x1),_0x55739d['qf']=_0x135f46['qf']=_0x438790;}(_0x46b135));}('undefined'!=typeof window?window:this);}]));
\ No newline at end of file
public/js/qf_web_ui.min.js 0 → 100644
View file @ 18bfc848
/*
name: qf_web_ui
version: V1.157
*/
!function(e){var t={};function n(i){if(t[i])return t[i].exports;var o=t[i]={i:i,l:!1,exports:{}};return e[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(i,o,function(t){return e[t]}.bind(null,o));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){e.exports=n(1)},function(e,t,n){!function(e){document;var t=document.body;window;new function(){var i={},o={getRegistStyle:function(e){return{loader:[{i:0,k:"@keyframes loader-a1",v:"0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}"},{i:1,k:"@keyframes loader-a2",v:"0%{transform:rotate(0deg)}100%{transform:rotate(-360deg)}"},{i:2,k:".kim-loader:before,.kim-loader:after",v:'content:"";position:absolute;border-radius:50%;border:4px solid #1276E3;'},{i:3,k:".kim-loader:before",v:"height:60px;width:60px;border-left-color:transparent;border-bottom:0;animation:loader-a1 1s cubic-bezier(.42, .61, .58, .41) infinite;"},{i:4,k:".kim-loader:after",v:"height:40px;width:40px;border-top-color:transparent;border-right:0;animation:loader-a2 1s cubic-bezier(.42, .61, .58, .41) infinite;"}]}[e]},createStyleElement:function(e,t){var n=document.createElement("style");return n.type="text/css",n.id=e||"kmb-popmd-e3d8-style",t?t.appendChild(n):document.head.appendChild(n),n},getStyleSheet:function(e,t){return(document.getElementById(e||"kmb-popmd-e3d8-style")||this.createStyleElement(e,t)).sheet},setStyleSheet:function(e,t,n,i){var o=i||this.getStyleSheet();o&&(o.insertRule?o.insertRule(e+"{"+t+"}",n):o.addRule(e,t,n))},setStyleSheets:function(e){var t=this.getStyleSheet();if(!t.rules[e[0].i])for(var n of e){var i=n.k,o=n.v,r=n.i;t.insertRule?t.insertRule(i+"{"+o+"}",r):t.addRule(i,o,r)}}};let r=function(e){var t=e.zIndex||2023,n=e.className?" "+e.className:"",i=e.backgroundColor||"rgba(0,0,0,.5)",o=document.getElementById(e.id||"kmbBaseLayer_e3d8")||document.createElement("div");o.id=e.id||"kmbBaseLayer_e3d8",o.className="kmb-basepopuplayer"+n;var r=e.coverFull?"width:100%;justify-content:center;":"";return o.style.cssText="position:fixed;top:0;left:0;width:0;height:100%;"+r+"z-index:"+t+";background-color:"+i+";display:flex;align-items:center;",o},a=function(t,n){if("Object"===n.constructor.name&&n.show){var i=e.extend.call({size:12,point:"top",x:0,y:0,borderColor:"#3EB7EA",background:"rgba(0,0,0,.9)"},n||{}),o=i.size||12,r=i.point||"top",a=i.x||0,s=i.y||0,l=i.borderColor||"#3EB7EA",c=i.background||"rgba(0,0,0,.9)",u=0-o/2,d=~~Math.sqrt(o*o*2)-o-1,h="left",m="top",f=d,p=u,v=45;"left"===r||"right"===r?(f=u,p=d,v="right"===r?(h="right")&&135:-45):"bottom"===r&&(m="bottom",v=225);var g=~~(o+2)+"px",b='content:"";position:absolute;'+(m+":"+(p+s)+"px")+";"+(h+":"+(f+a)+"px")+";height:"+o+"px;width:"+o+"px;",y="border-color:"+l+" transparent transparent "+l+";",x=document.createElement("i");x.style.cssText=b+"background-color:"+c+";border-style:solid;border-width:1px;"+y+"transform:rotate("+v+"deg);clip-path:polygon(0% 0, "+g+" 0, 0% "+g+");",t.appendChild(x)}},s=function(e,t){var n=(t="Object"===t.constructor.name?t:{horizontal:"right",vertical:"top"}).vertical||"top",i=t.horizontal||"right",o=document.createElement("i");o.innerText="＋",o.className="close",o.style.cssText="position:absolute;"+n+":-.13rem;"+i+":-.13rem;height:.26rem;width:.26rem;font-style:normal;font-size:.30rem;font-weight:100;border:1px solid #3EB7EA;display:flex;justify-content:center;align-items:center;border-radius:.20rem;transform:rotate(45deg);background:rgba(0,0,0,.5);cursor:pointer;color:#3EB7EA;user-select:none;",e.appendChild(o)};e.extend.call(this,{popupLayer:function(e){var t=e.title&&(e.title.indexOf("<")>-1?e.title:"<span>"+e.title+"</span>")||"",n=e.closeBtnColor?"color:"+e.closeBtnColor:"",i=t?'<div class="qfui-message-box el-message-box__header"><div class="el-message-box__title">'+t+"</div></div>":"",o=e.confirm,r="[object Function]"===Object.prototype.toString.call(o)?'<div class="el-message-box__btns"><button type="button" aria-label="Confirm" class="el-button el-button--default el-button--small el-button--primary">确定</button></div>':"",a='<div class="kmb-message-box custom-alert">'+i+'<div class="el-message-box__content" style="min-width:300px;width:'+e.width+'"><div class="alert-ctbox">'+(e.html||"")+"</div></div>"+r+'<button class="el-message-box__headerbtn el-icon-close" aria-label="Close" style="'+n+'"></button></div>',s=document.createElement("div");s.id="culayer",s.className="el-message-box__wrapper "+(e.className||""),s.style.cssText="z-index:2001;background-color:rgba(0,0,0,.5);",s.innerHTML=a,document.body.appendChild(s);var l=s.querySelector(".alert-ctbox");e.onload&&e.onload(l),s.onclick=function(t){var n=t.target||t.srcElement;"BUTTON"===n.nodeName&&("Confirm"===n.getAttribute("aria-label")?(document.body.removeChild(s),e.confirm&&e.confirm(l)):"Close"===n.getAttribute("aria-label")&&(document.body.removeChild(s),e.close&&e.close()))}},scrollingPreview:function(t){var n=0,i=function(t){var i=this;this.box=t,this.init(),e.resize((function(){this.rTimer&&clearTimeout(this.rTimer),delete this.rTimer;var e=i.boundary.dist,o=e?e/(i.boundary=i.getBoundary()).dist:1;t.scrollTop=n/=o,this.rTimer=setTimeout(()=>{!i.animId&&i.start()},1500)}))};return i.prototype={init:function(){var e=this;this.flag=this.getPointer(),this.box.onmousedown=function(){e.cancel()},this.box.onmouseup=function(t){t.target.className.match("scrolling4")&&(n=t.target.scrollTop),e.start()},e.start()},getBoundary:function(){var e=this.box.scrollHeight-this.box.offsetHeight;return{dist:e,apex:e*((this.flag+1)/2)}},getPointer:function(){return Math.abs(this.box.scrollTop-1)-this.box.scrollTop},getItemHeight:function(e){return(e.children.length>2?e.lastElementChild:{}).offsetHeight||30},start:function(){this.boundary=this.getBoundary(),this.childHeight=this.getItemHeight(this.box),this.boundary.dist>this.childHeight&&this.animloop()},animloop:function(){this.box.scrollTop*this.flag>=this.boundary.apex?(this.flag=this.getPointer(),this.boundary=this.getBoundary(),this.boundary.dist>this.childHeight?this.animloop():this.cancel()):(this.box.scrollTop=n,t.scrollHeight-t.offsetHeight<n&&(this.flag=this.getPointer(),this.boundary=this.getBoundary()),n+=.3333*this.flag,this.animId=window.requestAnimationFrame(this.animloop.bind(this)))},cancel:function(){this.animId&&cancelAnimationFrame(this.animId),delete this.animId},update:function(){this.cancel(),this.start()}},{update:function(){new i(t).update()}}},Notify:function(n){var i=this,o={close:!0},r=(n=n||{}).duration||2e4,a=n.title||"提示",s=n.type||"warning",l=n.message||"提示内容！",c=n.zIndex||2e3;return position=n.position||"bottom",this.__proto__={open:function(u){u=u||{},o.ctn=o.ctn||document.createElement("div"),o.ctn.className="el-notification right el-notification-fade-enter el-notification-fade-leave-active",o.ctn.style=position+":16px;z-index:"+c+";",o.ctn.innerHTML='<i class="el-notification__icon el-icon-'+s+'"></i><div class="el-notification__group is-with-icon"><h2 class="el-notification__title">'+(u.title||a)+'</h2><div class="el-notification__content">'+(u.content||l)+'</div><div class="el-notification__closeBtn el-icon-close"></div></div>',t.appendChild(o.ctn),setTimeout((function(){o.ctn.classList.remove("el-notification-fade-enter","el-notification-fade-leave-active")}),100),o.timer=e.Async.timeout((function(){i.close()}),r),o.ctn.onclick=function(e){var t=e.target||e.srcElement;t.classList.contains("el-icon-close")?i.close():n.onClick&&n.onClick(t)},o.ctn.addEventListener("mouseenter",(function(){!o.await&&o.timer.pause()}),!1),o.ctn.addEventListener("mouseleave",(function(){!o.await&&o.timer.continued()}),!1)},close:function(e){o.close&&(o.await=!0,o.ctn.classList.add("el-notification-fade-leave-active"),o.timer.clear(),setTimeout((function(){t.removeChild(o.ctn),!e&&n.onClose&&n.onClose()}),200),delete o.close)},pause:function(){o.await=!0,o.timer.pause()},recover:function(){o.timer.continued(),o.await=!1}},n.autoOpen&&this.open(),this},baseLayer:function(e){var t=e.html||'<div class="kmbbase-wrap"></div>',i=e.moudelClass?" "+e.moudelClass:"",o=e.container||document.body,a=e.name||"",s=e.id||n.Guid("k");return function(){var n,l,c=(n=o,(l=function(){var o,l,c=this.Wrap=(o=document.createElement("div"),l="k"+s+i,o.className="kmb-popmd-e3d8 "+l,o.style.cssText="position:absolute;display:none;",o.innerHTML=t,o),u=e.cover?this.parent=r(e).appendChild(c).parentNode:c;n.appendChild(u),this.el=this.Wrap.firstElementChild||this.Wrap,this.container=u,this.parent=this.parent||n,this.id=s,this.name=a,u.onclick=function(t){t.target||t.srcElement,e.click&&e.click(t)},this.open()}).prototype={open:function(){this.Wrap.style.display="block",this.show=!0},close:function(){this.Wrap.style.display="none",this.show=!1,e.close&&e.close()},remove:function(t){this.Wrap.remove(),this.show=!1,n!==this.parent&&!this.parent.firstElementChild&&n.removeChild(this.parent),e.close&&e.close(t)},setStyle:function(e,t){Object.assign((e||this.Wrap).style,t)}},new l);return this.prototype={},e.onload&&e.onload(c),c}.call((function(){}))},popWindow:function(e){e=e||{};var t=this.baseLayer(e);e.pointer&&a(t.Wrap,e.pointer),e.closeButton&&(e.closeEvent=!0)&&s(t.Wrap,e.closeButton);var n=e.click;return e.click=function(i){var o=i.target||i.srcElement;n&&n(o),e.closeEvent&&o.classList.contains("close")&&o.parentNode===t.Wrap&&t.remove(i)},t},checkListRender:function(e){var t=(e=e||{}).list||[],i=e.select||[],o=e.type||"radio",r="radio"===o?'name="'+n.Guid("k")+'" ':"",a="",s=(document.createElement("div"),function(e){for(var t of i)return e===t});for(var l of t){var c=l[e.name||"name"],u=l[e.value||"value"];a+='<dd><label style="display:flex;user-select:none;cursor:pointer;"><span style="display:flex;"><input type="'+o+'" '+(s(u)?'checked="true"':"")+' value="'+u+'" '+r+' data-name="'+c+'"></span><span class="el-'+o+'__label"><span>'+c+"</span></span></label></dd>"}return'<div class="kmb-checkbox" style="position:relative;height:100%;"><dl class="scrolling4">'+a+"</dl></div>"},selectRender:function(e,t,n){for(var i=t.length,o="",r=0;r<i;r++){var a=t[r];o+='<option value="'+a[n.value||"value"]+'" data-index="'+r+'">'+a[n.name||"name"]+"</option>"}return n.onchange&&(e.onchange=function(e){var t=(e.target||e.srcElement).selectedOptions[0];n.onchange(t.value,t)}),e.innerHTML=o,n.onload&&n.onload(e.options[0]&&e.options[0].value),e},progressBar:function(t){t=t||{};var n=this;return e.UI.popWindow({name:"div_1",html:'<div class="progress" style="width:7rem;"><div class="progress-bar" style="width:0%">0</div></div>',onload:function(e){var i=o.getStyleSheet("progressStyle",e.Wrap);o.setStyleSheet(".progress","position:relative;height:15px;line-height:14px;border-radius:20px;box-sizing:content-box;color:#fff;font-size:12px;text-align:center;user-select:none;",0,i),o.setStyleSheet(".progress .progress-bar","animation:reverse progress-bar-stripes 0.80s linear infinite,animate-positive 1s;border-radius:20px;background-color:#5bc0de;background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:40px 40px;height:100%;transition:width .3s ease;",1,i),o.setStyleSheet("@keyframes progress-bar-stripes","from{background-position:40px 0}to{background-position:0 0}",2,i),o.setStyleSheet("@keyframes animate-positive","0%{width:0}",3,i),e.setStyle(e.Wrap,t);var r=e.el.firstElementChild;e.setValue=function(e){r.innerText=e+"%",r.style.width=e+"%"},n.model=e}}),n.model},loading:function(t){var r=(t=t||{}).timer||0,a=t.zIndex||1e3,s=t.container||document.body,l=s.dataset.loaderid||n.Guid(),c="loadingUI_"+l+(t.id||""),u=i[c];return u?(u.clearTimer(),r&&u.timeout(r),u.res):(s.dataset.loaderid=l,o.setStyleSheets(o.getRegistStyle("loader")),u=i[c]={id:c,layer:function(){var n='<div class="kim-loader" style="position:absolute;top:50%;left:50%;height:80px;width:80px;margin:-40px 0 0 -40px;display:flex;justify-content:center;align-items:center;"></div>';if("none"!==t.mask){var i=t.maskColor||"rgba(0,0,0, .5)";return e.UI.baseLayer({closeEvent:!0,container:s,html:n,onload:function(e){e.setStyle(e.Wrap,{top:0,left:0,height:"100%",width:"100%",backgroundColor:i,zIndex:a})}})}var o=document.createElement("div");return o.innerHTML=n,s.appendChild(o.firstElementChild)}(),timeout:function(e){this.timerId=setTimeout(()=>{this.layer.remove(),delete i[c]},e)},clearTimer:function(e){delete i[c],this.timerId&&clearTimeout(this.timerId)}},r&&u.timeout(r),u.res={close:function(){u.clearTimer(),u.layer.remove()}})},tabStyleActive:function(e,t,n,i){if(!t.classList.contains(n)){var o=e.querySelector("."+n);o&&o.classList.remove(n),t.classList.add(n),i&&i()}}}),e.UI=this},new function(){var t=e.Async||this;t.__proto__={intervalLoop:function(e,t,n){var i=function(e,t,n){t&&t(),this.timer=setInterval((function(){n?n():t()}),e||3e3)};return i.prototype={clear:function(){clearInterval(this.timer)}},"function"==typeof t?new i(e,t,n):console.log("intervalLoop param must contain function")},timeout:function(e,t){return t=t||3e3,new function(){var n,i,o;return this.__proto__={start:function(t){i=(new Date).getTime(),n=setTimeout((function(){t=i=o=0,e&&e()}),t)},pause:function(){
//!pauseTime && (pauseTime = new Date().getTime());this.clear()
o=(new Date).getTime(),this.clear()},continued:function(e){t-=o-i,o&&t>0&&this.start(e||t)},clear:function(){clearTimeout(n)}},this.start(t),this}},randomRuntimer:function(t,n){if("randomRuntimer"!==this.constructor.name)return Error("Please instance this object first");let i={getDefaultTime:function(){return 1e3*(4+~~(6*Math.random()+1))},nowCallback:!1,firstTimer:null},o=(n=n||i).firstTimer||i.getDefaultTime(),r=e.Async.timeoutFilter(5e3),a=new e.Async.timerCtrl(o,"timerA");return a((function(){a.stop();let e=i.getDefaultTime(),n=t&&t(e);!1!==n&&a.setTime(n||e)})),n.nowCallback&&a.start(!0),this.run=function(){a.stop(),r((function(){a.setTime(getDefaultTime())}))},this}}},new function(){var t=e.Vue||this;t.__proto__={onEventInfos:function(e){var t=this.toString.$state._vm,n=t.$root.constructor;n.config.errorHandler=function(i,o){t.$nextTick(()=>{var t=o.$el._prevClass,n=[];if(t.match("el-select"))if(o.selected[0])for(var i of o.selected)n.push({name:i.label,value:i.value});else n={name:o.selectedLabel,value:o.value};else if(t.match("el-radio-group")){var r=o.$children;for(var a of r)a.$el.ariaChecked&&(n={name:a.$el.innerText,value:o.value})}else if(t.match("el-checkbox-group")){r=o.$children;for(var a of r)a.isChecked&&n.push({name:a.$el.innerText,value:a.label})}e&&e.call(this,o.value,n,o.hoverIndex)}),n.config.errorHandler=null}.bind(this);var i=new Promise((function(e,t){}));return i.catch=function(e,t,n){e(Error)},i},renderTo:function(e){var t=window.__VUE_HOT_MAP__,n=(this.toString.$state||{})._vm||this;return new(t?t[Object.keys(t)[0]].Ctor.super:n.$root.constructor)({el:e.el,data:e.data,render:function(t){var n=this,i=n._self._c,o=e.attrs;o="function"==typeof o?o.call(n._self):Object.assign({},o);var r={style:e.style,attrs:o,on:{change:e.change||""},model:{value:n._self[e.datakey||e.value],callback:function(t){n.$set(n._self,e.value,t)}}};return i(e.name,r)}})}},e.Vue=t},new function(){var t=e.Event||this;t.__proto__={eventRegister:function(e){var t,n,i,o=e.eventEl,r=!e.event,a=function(e,t){o.addEventListener(e,t,!1)},s=function(e,t){o.removeEventListener(e,t,!1)},l=function(){this.eventHandler=function(e){return this.eventTrigger=function(){a("mousemove",e),a("mouseup",e),a("mouseleave",e)},this.eventRemove=function(){s("mousemove",e),s("mouseup",e),s("mouseleave",e)},this.addEvent=function(){a("mousedown",e)},this.removeEvent=function(){s("mousedown",e)},this}.call({},this),this.eventHandler.addEvent(),e.event&&this.eventHandler.eventTrigger()};return l.prototype={handleEvent:function(e){switch(e.type){case"mousedown":this.start(e);break;case"mousemove":this.move(e);break;case"mouseup":this.up(e);break;case"mouseout":case"mouseover":case"mouseleave":this.end(e)}},start:function(o){t=o.pageX,n=o.pageY,o.timeStamp-i<280&&this.sX===t&&this.sY===n?(this.isDb=!this.isDb,clearTimeout(this.timeout),e.dblclick&&e.dblclick(o)):e.start&&e.start(o),this.sX=t,this.sY=n,i=o.timeStamp,!e.event&&this.eventHandler.eventTrigger()||(r=!0)},move:function(t){r&&(e.disc?"y"===e.disc?t.destY=t.pageY-this.sY:t.destX=t.pageX-this.sX:(t.destX=t.pageX-this.sX,t.destY=t.pageY-this.sY)),e.move&&e.move(t)},end:function(t){e.end&&e.end(t),!e.event&&this.eventHandler.eventRemove()||(r=!1)},up:function(t){var n=this;!(e.mouseup&&e.mouseup(t))&&this.end(t),e.click&&"mouseup"===t.type&&t.timeStamp-i<180&&this.sX===t.pageX&&this.sY===t.pageY&&(clearTimeout(this.timeout),this.timeout=setTimeout((function(){n.isDb?n.isDb=!n.isDb:e.click(t)}),150))}},new l}},e.Event=t};const n=new function(){var t=e.Utils||this;return t.__proto__={generateMixed:function(e){for(var t=["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"],n="",i=0;i<e;i++){n+=t[Math.ceil(35*Math.random())]}return n},Dates:function(e){return{format:function(t){var n=e?new Date(e):new Date,i={"M+":n.getMonth()+1,"d+":n.getDate(),"h+":n.getHours()%12==0?12:n.getHours()%12,"H+":n.getHours(),"m+":n.getMinutes(),"s+":n.getSeconds(),"q+":Math.floor((n.getMonth()+3)/3),S:n.getMilliseconds()};for(var o in/(y+)/.test(t)&&(t=t.replace(RegExp.$1,(n.getFullYear()+"").substr(4-RegExp.$1.length))),/(E+)/.test(t)&&(t=t.replace(RegExp.$1,(RegExp.$1.length>1?RegExp.$1.length>2?"星期":"周":"")+{0:"日",1:"一",2:"二",3:"三",4:"四",5:"五",6:"六"}[n.getDay()+""])),i)new RegExp("("+o+")").test(t)&&(t=t.replace(RegExp.$1,1==RegExp.$1.length?i[o]:("00"+i[o]).substr((""+i[o]).length)));return t},getDayStamp:function(){return{start:new Date((new Date).toLocaleDateString()).getTime()/1e3,end:~~((new Date).getTime()/1e3)}}}},arrayToJsonDict:function(e,t,n){var i={};if(e[0]&&e.push)for(var o=0,r=e.length;o<r;o++){var a=e[o];i[a[t||"id"]||o]=n?a[n]||n:a}return i},imageToBase64:function(e,t,n){var i=function(e,t){var n=new Image;n.src=e,n.crossOrigin="*",n.onerror=function(){new Error("图片加载失败")},n.onload=function(){var e=n.width,i=n.height;return t(function(e,t,n){var i=document.createElement("canvas");i.width=t,i.height=n;var o=i.getContext("2d");o.fillStyle="transparent",o.fillRect(0,0,t,n),o.drawImage(e,0,0,t,n);var r={};return r.base64=i.toDataURL("image/jpeg",.7),r.base64Len=r.base64.length,i=null,r}(n,e,i),n=null)}},o=e&&e.files[0];return new Promise((n,r)=>{if(!(o.name.indexOf(".jpg")>0||o.name.indexOf(".png")>0))return e.value="",r({type:4,msg:"图片文件类型不正确！"});var a="string"==typeof o?o:URL.createObjectURL(o);i(a,(function(e){return e.base64Len?t&&t(e)||n(e):r(e)}))})},strAverageCut:function(e,t){for(var n=e.length,i=~~(n/(t=(t>n?n:t)||1)),o=n%t,r=[],a=0,s=0;s<t;s++){var l=i+~~(s<o);r[s]=e.substr(a,l),a+=l}return r},getRandomColor:function(e){for(var t=this.strAverageCut(e,3),n=0,i=t.length;n<i;n++)t[n]=(parseInt(t[n],16)>>16&255)/255;return t},recursion:function(e,t,n,i){return function e(o){for(var r of o)n?!t(r)&&r[n]&&e(r[n]):(i=t(r))&&i&&e(r[i])}(e)}},t}}(qf)}]);
\ No newline at end of file
src/layout/index-2.vue 0 → 100644
View file @ 18bfc848
<template>
<div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
<sidebar v-if="!sidebar.hide" class="sidebar-container"/>
<div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
<div :class="{'fixed-header':fixedHeader}">
<navbar/>
<tags-view v-if="needTagsView"/>
</div>
<app-main/>
<right-panel>
<settings/>
</right-panel>
</div>
</div>
</template>
<script>
import RightPanel from '@/components/RightPanel'
import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
import ResizeMixin from './mixin/ResizeHandler'
import { mapState } from 'vuex'
import variables from '@/assets/styles/variables.scss'
export default {
name: 'Layout',
components: {
AppMain,
Navbar,
RightPanel,
Settings,
Sidebar,
TagsView
},
mixins: [ResizeMixin],
computed: {
...mapState({
theme: state => state.settings.theme,
sideTheme: state => state.settings.sideTheme,
sidebar: state => state.app.sidebar,
device: state => state.app.device,
needTagsView: state => state.settings.tagsView,
fixedHeader: state => state.settings.fixedHeader
}),
classObj() {
return {
hideSidebar: !this.sidebar.opened,
openSidebar: this.sidebar.opened,
withoutAnimation: this.sidebar.withoutAnimation,
mobile: this.device === 'mobile'
}
},
variables() {
return variables;
}
},
methods: {
handleClickOutside() {
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/mixin.scss";
@import "~@/assets/styles/variables.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
&.mobile.openSidebar {
position: fixed;
top: 0;
}
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header {
position: fixed;
top: 0;
right: 0;
z-index: 9;
width: calc(100% - #{$base-sidebar-width});
transition: width 0.28s;
}
.hideSidebar .fixed-header {
width: calc(100% - 54px);
}
.sidebarHide .fixed-header {
width: 100%;
}
.mobile .fixed-header {
width: 100%;
}
</style>
src/layout/index-singlepage.vue deleted 100644 → 0
View file @ d7899a86
<template>
<div
:class="classObj"
class="app-wrapper"
:style="{ '--current-color': theme }"
>
<!-- <div
v-if="device === 'mobile' && sidebar.opened"
class="drawer-bg"
@click="handleClickOutside"
/>
<sidebar v-if="!sidebar.hide" class="sidebar-container" /> -->
<div
:class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }"
class="main-container"
>
<!-- <div :class="{ 'fixed-header': fixedHeader }">
<navbar />
<tags-view v-if="needTagsView" />
</div> -->
<app-main />
<!-- <right-panel>
<settings/>
</right-panel> -->
</div>
</div>
</template>
<script>
import RightPanel from "@/components/RightPanel";
import { AppMain, Navbar, Settings, Sidebar, TagsView } from "./components";
import ResizeMixin from "./mixin/ResizeHandler";
import { mapState } from "vuex";
import variables from "@/assets/styles/variables.scss";
export default {
name: "Layout",
components: {
AppMain,
Navbar,
RightPanel,
Settings,
Sidebar,
TagsView,
},
mixins: [ResizeMixin],
computed: {
...mapState({
theme: (state) => state.settings.theme,
sideTheme: (state) => state.settings.sideTheme,
sidebar: (state) => state.app.sidebar,
device: (state) => state.app.device,
needTagsView: (state) => state.settings.tagsView,
fixedHeader: (state) => state.settings.fixedHeader,
}),
classObj() {
return {
hideSidebar: !this.sidebar.opened,
openSidebar: this.sidebar.opened,
withoutAnimation: this.sidebar.withoutAnimation,
mobile: this.device === "mobile",
};
},
variables() {
return variables;
},
},
methods: {
handleClickOutside() {
this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
},
},
};
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/mixin.scss";
@import "~@/assets/styles/variables.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
&.mobile.openSidebar {
position: fixed;
top: 0;
}
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header {
position: fixed;
top: 0;
right: 0;
z-index: 9;
width: calc(100% - #{$base-sidebar-width});
transition: width 0.28s;
}
.hideSidebar .fixed-header {
width: calc(100% - 54px);
}
.sidebarHide .fixed-header {
width: 100%;
}
.mobile .fixed-header {
width: 100%;
}
.main-container {
margin-left: 0px !important;
}
</style>
src/layout/index.vue
View file @ 18bfc848
<template> <template>
<div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}"> <div
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/> :class="classObj"
<sidebar v-if="!sidebar.hide" class="sidebar-container"/> class="app-wrapper"
<div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container"> :style="{ '--current-color': theme }"
<div :class="{'fixed-header':fixedHeader}"> >
<navbar/> <!-- <div
<tags-view v-if="needTagsView"/> v-if="device === 'mobile' && sidebar.opened"
</div> class="drawer-bg"
<app-main/> @click="handleClickOutside"
<right-panel> />
<sidebar v-if="!sidebar.hide" class="sidebar-container" /> -->
<div
:class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }"
class="main-container"
>
<!-- <div :class="{ 'fixed-header': fixedHeader }">
<navbar />
<tags-view v-if="needTagsView" />
</div> -->
<app-main />
<!-- <right-panel>
<settings/> <settings/>
</right-panel> </right-panel> -->
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import RightPanel from '@/components/RightPanel' import RightPanel from "@/components/RightPanel";
import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components' import { AppMain, Navbar, Settings, Sidebar, TagsView } from "./components";
import ResizeMixin from './mixin/ResizeHandler' import ResizeMixin from "./mixin/ResizeHandler";
import { mapState } from 'vuex' import { mapState } from "vuex";
import variables from '@/assets/styles/variables.scss' import variables from "@/assets/styles/variables.scss";
export default { export default {
name: 'Layout', name: "Layout",
components: { components: {
AppMain, AppMain,
Navbar, Navbar,
RightPanel, RightPanel,
Settings, Settings,
Sidebar, Sidebar,
TagsView TagsView,
}, },
mixins: [ResizeMixin], mixins: [ResizeMixin],
computed: { computed: {
...mapState({ ...mapState({
theme: state => state.settings.theme, theme: (state) => state.settings.theme,
sideTheme: state => state.settings.sideTheme, sideTheme: (state) => state.settings.sideTheme,
sidebar: state => state.app.sidebar, sidebar: (state) => state.app.sidebar,
device: state => state.app.device, device: (state) => state.app.device,
needTagsView: state => state.settings.tagsView, needTagsView: (state) => state.settings.tagsView,
fixedHeader: state => state.settings.fixedHeader fixedHeader: (state) => state.settings.fixedHeader,
}), }),
classObj() { classObj() {
return { return {
hideSidebar: !this.sidebar.opened, hideSidebar: !this.sidebar.opened,
openSidebar: this.sidebar.opened, openSidebar: this.sidebar.opened,
withoutAnimation: this.sidebar.withoutAnimation, withoutAnimation: this.sidebar.withoutAnimation,
mobile: this.device === 'mobile' mobile: this.device === "mobile",
} };
}, },
variables() { variables() {
return variables; return variables;
} },
}, },
methods: { methods: {
handleClickOutside() { handleClickOutside() {
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "~@/assets/styles/mixin.scss"; @import "~@/assets/styles/mixin.scss";
@import "~@/assets/styles/variables.scss"; @import "~@/assets/styles/variables.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
&.mobile.openSidebar { .app-wrapper {
position: fixed; @include clearfix;
top: 0; position: relative;
} height: 100%;
} width: 100%;
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header { &.mobile.openSidebar {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0;
z-index: 9;
width: calc(100% - #{$base-sidebar-width});
transition: width 0.28s;
} }
}
.hideSidebar .fixed-header { .drawer-bg {
width: calc(100% - 54px); background: #000;
} opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.sidebarHide .fixed-header { .fixed-header {
width: 100%; position: fixed;
} top: 0;
right: 0;
z-index: 9;
width: calc(100% - #{$base-sidebar-width});
transition: width 0.28s;
}
.mobile .fixed-header { .hideSidebar .fixed-header {
width: 100%; width: calc(100% - 54px);
} }
.sidebarHide .fixed-header {
width: 100%;
}
.mobile .fixed-header {
width: 100%;
}
.main-container {
margin-left: 0px !important;
}
</style> </style>
src/router/index.js
View file @ 18bfc848
...@@ -88,6 +88,19 @@ export const constantRoutes = [ ...@@ -88,6 +88,19 @@ export const constantRoutes = [
} }
] ]
}, },
{
path: '/dp',
component: Layout,
redirect: 'noredirect',
children: [
{
path: 'screen',
component: () => import('@/views/index-dp'),
name: 'Screen',
meta: { title: '首页-DP', icon: 'dashboard', affix: true }
}
]
},
{ {
path: '/user', path: '/user',
component: Layout, component: Layout,
...@@ -204,7 +217,7 @@ router.beforeEach((to, from, next) => { ...@@ -204,7 +217,7 @@ router.beforeEach((to, from, next) => {
// const token = localStg.get('token') // const token = localStg.get('token')
// if (token && !wsManager.isOpen()) { // if (token && !wsManager.isOpen()) {
// wsManager.init(wsUrl) // wsManager.init(wsUrl)
connect() // connect()
// } // }
next() next()
}) })
......
src/views/index-dp copy.vue 0 → 100644
View file @ 18bfc848
<template>
<div class="Screen cm-layout">
<div class="a_0">
<div id="cesiumContainer" class="cesium-ctn"></div>
<div class="a0_">
<header id="header">
<div class="b1_bg">
<h2>威海高新区科技企业孵化信息平台</h2>
</div>
<div class="a0a_" id="a0a_">
<ul>
<li data-id="5" class="active">风险分析管控</li>
<li data-id="6">隐患排查治理</li>
<li data-id="7">安全教育培训</li>
<li data-id="8">数据统计分析</li>
</ul>
<ul>
<li data-id="1">行业信息预警</li>
<li data-id="2">危险作业备案</li>
<li data-id="3">企业安全档案</li>
<li data-id="4">分类分级管理</li>
</ul>
</div>
<div class="more">
<ul>
<li data-id="0" class="active"></li>
<li class="sys"><a href="javascript:void(0)"></a></li>
</ul>
</div>
<div class="go-back">
<a href="/business/incubator">进入后台</a>
</div>
</header>
</div>
<div class="map-mask"></div>
</div>
<div class="b_0">
<section class="b0_" id="b0_">
<div class="b0_a active">
<div class="side b0_left show">
<div class="a-md31" id="amd31">
<div class="abs-full">
<div class="m-tt">
<h4>孵化数据总览</h4>
</div>
<div class="ct-box">
<div class="wrap">
<ul>
<li>
<font>156</font>
<h6>孵化企业总数</h6>
</li>
<li>
<font>23</font>
<h6>高新技术企业</h6>
</li>
<li>
<font>45</font>
<h6>科技型中小企业</h6>
</li>
<li>
<font>1.25亿</font>
<h6>年度总产值</h6>
</li>
<li>
<font>326</font>
<h6>创业就业人数</h6>
</li>
<li>
<font>187</font>
<h6>知识产权数量</h6>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="a-md32" id="amd32">
<div class="abs-full">
<div class="m-tt">
<h4>孵化总收入排行榜</h4>
</div>
<div class="ct-box">
<div class="wrap">
<!-- 静态图表占位 -->
<div
style="padding: 20px; text-align: center; color: #7ae2ff"
>
<p>企业A: 1200万元</p>
<p>企业B: 980万元</p>
<p>企业C: 850万元</p>
<p>企业D: 720万元</p>
<p>企业E: 650万元</p>
</div>
</div>
</div>
</div>
</div>
<div class="a-md33" id="amd33">
<div class="abs-full">
<div class="m-tt">
<h4>产品展示</h4>
</div>
<div class="ct-box">
<div class="rel-fixd">
<div class="wrap">
<p>科技创新企业-智能监测设备</p>
<img
src="~@/assets/images/layout/product-placeholder.png"
alt="智能监测设备"
style="max-width: 100%; height: auto"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="side b0_right show">
<div class="a-md34" id="amd34">
<div class="abs-full">
<div class="m-tt">
<h4>企业创新创业数据分析</h4>
</div>
<div class="ct-box">
<div class="wrap">
<!-- 静态图表占位 -->
<div
style="padding: 20px; text-align: center; color: #7ae2ff"
>
<p>技术创新投入: 42%</p>
<p>产品研发投入: 28%</p>
<p>市场拓展投入: 18%</p>
<p>人才培养投入: 12%</p>
</div>
</div>
</div>
</div>
</div>
<div class="a-md35" id="amd35">
<div class="abs-full">
<div class="m-tt">
<h4>孵化器孵化企业数据分析</h4>
</div>
<div class="ct-box">
<div class="wrap">
<!-- 静态图表占位 -->
<div
style="padding: 20px; text-align: center; color: #7ae2ff"
>
<p>电子信息: 35家</p>
<p>生物医药: 28家</p>
<p>新材料: 22家</p>
<p>智能制造: 41家</p>
<p>其他行业: 30家</p>
</div>
</div>
</div>
</div>
</div>
<div class="a-md36" id="amd36">
<div class="abs-full">
<div class="m-tt">
<h4>孵化企业年度上缴税费变化趋势</h4>
</div>
<div class="ct-box">
<div class="wrap">
<!-- 静态图表占位 -->
<div
style="padding: 20px; text-align: center; color: #7ae2ff"
>
<p>2020年: 1200万元</p>
<p>2021年: 1800万元</p>
<p>2022年: 2500万元</p>
<p>2023年: 3200万元</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</template>
<script>
export default {
data() {
return {
navActive: null,
view0: {
md1: [],
md2: [],
md3: [],
},
};
},
mounted() {
var that = this;
this.$nextTick(() => {
var views = that.$el.querySelectorAll("#b0_>div");
var header = that.$el.querySelector("#header");
});
},
methods: {},
};
</script>
<style lang="scss" scope>
// @font-face {
// font-family: "diget year";
// src: url("~@/assets/fonts/DS-Digital.ttf");
// }
// @font-face {
// font-family: "ShuHei";
// src: url("~@/assets/fonts/AlimamaShuHeiTi-Bold.ttf");
// }
.font_digit {
font-family: diget year;
}
.font_ShuHei {
font-family: ShuHei;
}
.Screen {
position: relative;
height: 100%;
width: 100%;
overflow: hidden;
.a_0,
.b_0 {
position: absolute;
}
> .actv {
display: block;
}
.a_0 {
top: 0;
left: 0;
height: 100%;
width: 100%;
.cesium-ctn {
height: 100%;
width: 100%;
position: relative;
z-index: 1;
.kmb-popmd-e3d8.alarm {
& > i:nth-child(2) {
border-color: #ff0000 transparent transparent #ff0000 !important;
}
& > i:nth-child(3) {
border-color: #ff0000 !important;
color: #ff0000 !important;
}
}
.close {
right: 5px !important;
top: 5px !important;
border-width: 0 !important;
color: #fff !important;
background: transparent !important;
}
h4 {
margin-top: 0.05rem;
position: relative;
height: 0.38rem;
line-height: 0.38rem;
text-align: center;
font-weight: normal;
font-size: 0.18rem;
background-image: linear-gradient(
to right,
transparent 15%,
#25affa 50%,
transparent 85%
);
&:before,
&:after {
content: "";
position: absolute;
left: 0;
height: 1px;
width: 100%;
}
&:before {
top: 0;
background-image: linear-gradient(
to right,
transparent 15%,
#4de4ff 50%,
transparent 85%
);
}
&:after {
bottom: 0;
background-image: linear-gradient(
to right,
transparent 15%,
#4de4ff 50%,
transparent 85%
);
}
}
dl {
font-size: 0.16rem;
margin-top: 0.1rem;
dd {
line-height: 0.3rem;
color: #7ae2ff;
margin: 0 0.3rem;
}
}
}
.a0_ {
position: absolute;
top: 0;
left: 0;
height: auto;
width: 100%;
z-index: 3;
header {
position: absolute;
top: 0;
left: 0;
height: 0;
width: 100%;
z-index: 5;
display: flex;
user-select: none;
.b1_bg {
position: relative;
height: 0.98rem;
width: 100%;
margin: 0 auto;
background: no-repeat top center
url("~@/assets/images/layout/s_hd_m.png");
background-size: auto 0.98rem;
display: flex;
justify-content: center;
pointer-events: none;
h2 {
font-size: 0.4rem;
line-height: 1;
margin: 0.23rem 0 0 0rem;
font-weight: bold;
font-family: "element-icons";
color: #fff;
background-image: -webkit-linear-gradient(
top,
#fff,
#c6dafb,
#90b6f5
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: 0.06rem;
}
}
.go-back {
position: absolute;
top: 0.3rem;
left: 0.1rem;
height: 0.4rem;
width: 1.17rem;
background: no-repeat top center
url("~@/assets/images/layout/h_btn_2.png");
background-size: 100%;
display: flex;
justify-content: center;
align-items: center;
a {
color: #fff;
text-decoration: none;
font-size: 0.168rem;
}
}
.a0a_ {
position: absolute;
top: 0;
left: 0;
height: 0;
width: 100%;
display: flex;
justify-content: space-between;
ul {
height: 0;
display: flex;
margin-top: 0.42rem;
width: 5.15rem;
li {
width: 1.17rem;
height: 0.4rem;
cursor: pointer;
border-radius: 0.05rem;
background-repeat: no-repeat;
background-position: top center;
background-size: 100% 100%;
display: flex;
justify-content: center;
align-items: center;
font-size: 0.16rem;
&:hover {
box-shadow: inset 0 0 0.08rem 0.03rem rgba(42, 248, 251, 0.8);
}
}
li.active {
}
li:last-child {
margin-right: 0;
}
}
ul:first-child {
margin-left: 0.14rem;
li {
margin-right: 0.13rem;
}
}
ul:last-child {
margin-right: 0.14rem;
li {
margin-left: 0.13rem;
}
}
}
.more {
position: absolute;
top: 0.07rem;
right: 0.3rem;
ul {
display: flex;
}
li {
height: 0.31rem;
width: 0.31rem;
margin-left: 0.2rem;
cursor: pointer;
background-repeat: no-repeat;
background-position: center center;
background-size: 0.29rem 0.29rem;
border-radius: 0.29rem;
&:hover {
box-shadow: inset 0 0 0.04rem 0.02rem rgba(42, 248, 251, 0.8);
}
}
li:first-child {
}
li:last-child {
}
}
}
}
.map-mask {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 2;
pointer-events: none;
// background: no-repeat center center url("~@/assets/images/map_mask.png");
background-size: 100% 100%;
}
}
.b_0 {
display: flex;
top: 0.96rem;
left: 0;
bottom: 0;
width: 0;
background-color: rgba(0, 0, 0, 0.15);
z-index: 2;
.b0_ {
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
width: 0;
.kmb-checkbox {
dd {
line-height: 0.35rem;
}
}
.side {
// display:none;
width: 4.6rem;
height: 0;
display: flex;
flex-direction: column;
justify-content: center;
user-select: none;
color: #fff;
.abs-full {
display: flex;
flex-direction: column;
//padding:.08rem .10rem;
//background:no-repeat center center url('~@/assets/images/layout/side_l_md.png');background-size:100% 100%;
background-color: rgba(29, 57, 110, 0.65);
.chart {
position: relative;
}
}
.m-tt {
height: 0.42rem;
width: 100%;
background: no-repeat center center
url("~@/assets/images/layout/md_hd_l.png");
background-size: 100% 100%;
h4 {
height: 100%;
line-height: 0.4rem;
font-size: 0.18rem;
letter-spacing: 0.01rem;
padding-left: 0.4rem;
//background-image:linear-gradient(to bottom,#fff,#f3fffc,#e4fff9);
//-webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
}
.ct-box {
flex: 1;
display: flex;
position: relative;
font-size: 0.13rem;
.tab2 {
margin-top: 0.1rem;
ul {
display: flex;
height: 0.24rem;
margin: 0 0.1rem;
}
li {
flex: 1;
text-align: center;
line-height: 0.2rem;
margin: 0 0.15rem;
max-width: 0.99rem;
border-radius: 0.05rem;
font-size: 0.15rem;
color: #37b5b4;
border: 1px solid #1e527a;
cursor: pointer;
box-shadow: inset 0 0 0.1rem 0.03rem rgba(16, 88, 148, 0.8);
}
li.actv {
border: 1px solid #01b0ff;
color: #34fcfa;
}
}
.wrap {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.flex1 {
position: relative;
}
}
.shadow1 {
box-shadow: inset 0 0 0.15rem 0.05rem rgba(1, 95, 121, 0.8);
background-color: rgba(0, 0, 0, 0.4);
}
.a-md31 {
height: 3.2rem;
ul {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
display: grid;
grid-template-columns: 33.33% 33.33% 33.33%;
li {
position: relative;
line-height: 1;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
&:before {
content: "";
height: 0.4rem;
width: 0.4rem;
background-repeat: no-repeat;
background-position: center center;
background-size: 100% auto;
//background-image:url('~@/assets/images/layout/md31_i1.png');
}
h6 {
font-size: 0.14rem;
color: #dcebff;
margin-top: 0.1rem;
}
font {
font-size: 0.32rem;
font-family: diget year;
margin-top: 0.15rem;
line-height: 0.23rem;
background-image: -webkit-linear-gradient(
top,
#fff,
#fff,
#ffea98
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
li:nth-child(1) {
&:before {
background-image: url("~@/assets/images/layout/md31_i1.png");
}
}
li:nth-child(2) {
&:before {
background-image: url("~@/assets/images/layout/md31_i2.png");
}
}
li:nth-child(3) {
&:before {
background-image: url("~@/assets/images/layout/md31_i3.png");
}
}
li:nth-child(4) {
&:before {
background-image: url("~@/assets/images/layout/md31_i4.png");
}
}
li:nth-child(5) {
&:before {
background-image: url("~@/assets/images/layout/md31_i5.png");
}
}
li:nth-child(6) {
&:before {
background-image: url("~@/assets/images/layout/md31_i6.png");
}
}
}
}
.a-md32 {
height: 3.7rem;
}
.a-md33 {
height: 2.8rem;
.cu-slider {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow: hidden;
.el-carousel {
width: 100%;
height: 100%;
}
.el-carousel__container {
.el-carousel__item {
display: flex;
flex-direction: column;
.rel-fixd {
flex: 1;
position: relative;
margin: 0.1rem;
}
.wrap {
display: flex;
justify-content: center;
p {
position: absolute;
top: 0;
left: 0;
font-size: 0.16rem;
padding: 0.05rem 0.1rem;
background-color: rgba(0, 0, 0, 0.6);
border-radius: 0 0.05rem 0.05rem 0;
}
img {
height: 100%;
}
}
}
}
.el-carousel__arrow {
display: none;
}
}
}
.a-md34 {
height: 3.2rem;
}
.a-md35 {
height: 3.7rem;
}
.a-md36 {
height: 2.8rem;
}
}
> div {
display: none;
//display:flex;
width: 19.2rem;
height: 0;
justify-content: space-between;
.b0_left {
margin-left: 0.1rem;
/* .ct-box{
margin-top:.06rem;
background-image:linear-gradient(to right, rgba(21, 59, 85, .5), rgba(21, 59, 85, .1));
} */
}
.b0_right {
margin-right: 0.1rem;
}
}
div.active {
display: flex;
//.side{display:flex;}
}
.b0_a {
.side {
& > div {
flex: none;
position: relative;
margin-bottom: 0.1rem;
min-height: 2.6rem;
max-height: 28.5vh;
}
}
}
div.el-date-editor {
border-color: #2f8dc2;
background: rgba(0, 0, 0, 0.5);
input {
background-color: transparent;
color: #eee;
}
span {
color: #aaa;
width: 20px;
}
}
.b0_b {
.l-panel {
width: 5rem;
height: 0;
display: flex;
flex-direction: column;
justify-content: center;
}
}
.b0_e {
.side {
}
}
.b0_i {
}
}
.num_blue1 {
font-family: diget year;
text-shadow: #00aef7 0px 0px 0.1rem;
}
.num_orange {
font-family: diget year;
text-shadow: #d9fa03 0px 0px 0.1rem;
}
.num_liuhuang {
font-family: diget year;
text-shadow: #c1fa00 0px 0px 0.1rem;
}
.num_qingse {
font-family: diget year;
text-shadow: #03cee0 0px 0px 0.1rem;
}
}
.scrolling4 {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow-y: auto;
}
// 进度条
.progress {
position: relative;
height: 4px;
overflow: visible;
border-radius: 0.15rem;
background-color: rgba(0, 28, 64, 0.8);
}
.progress-bar {
position: relative;
border-radius: 0.15rem;
background-image: linear-gradient(to right, rgba(0, 77, 225, 0.8), #01bbff);
width: 100%;
height: 100%;
color: #fff;
transition: width 0.6s ease;
font-size: 0.13rem;
display: flex;
align-items: center;
&:before {
content: "";
position: absolute;
right: -3px;
height: 6px;
width: 6px;
border-radius: 6px;
background-color: #01bbff;
}
&:after {
content: "";
position: absolute;
right: -8px;
height: 16px;
width: 16px;
border-radius: 16px;
background-color: rgba(1, 187, 255, 0.4);
}
}
@keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
@keyframes animate-positive {
0% {
width: 0;
}
}
.half {
flex: 1; /* height:50%;width:100%; */
display: flex;
align-items: center;
font-size: 0.15rem;
.info {
flex: 1;
display: flex;
height: 0.73rem;
margin: 0 0.2rem;
border-radius: 0.73rem;
background-image: linear-gradient(
to right,
transparent,
rgba(2, 93, 148, 0.5),
rgba(2, 93, 148, 1)
);
li {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
color: #fff;
padding-left: 0.12rem;
position: relative;
font {
margin-bottom: 0.05rem;
font-size: 0.34rem;
}
em {
font-style: normal;
color: #a4f5f6;
margin-left: 0.08rem;
}
}
li:first-child {
display: flex;
align-items: center;
}
li:last-child:before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
border-width: 0 0 0 2px;
border-style: solid;
border-image: linear-gradient(
to bottom,
transparent 15%,
#286793 50%,
transparent 85%
)
1;
}
.chart-ctn {
position: absolute;
height: 1.14rem;
width: 1.14rem;
}
.chart1 {
color: #3097fc;
}
}
}
.half.reverse {
.info {
flex-direction: row-reverse;
background-image: linear-gradient(
to right,
rgba(60, 216, 216, 0.6),
rgba(74, 216, 216, 0.3),
transparent
);
li {
padding-left: 0.18rem;
}
li:last-child:before {
left: auto;
right: 0;
border-image: linear-gradient(
to bottom,
transparent 15%,
#54909a 50%,
transparent 85%
)
1;
}
}
}
/* 弹窗背景图 */
.popupBgImage {
background-image: url("/static/images/frame1.png");
background-repeat: no-repeat;
background-position: center center;
background-size: 100% 100%;
}
/* 加载动画 */
.loader {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
&:before {
content: "";
position: absolute;
height: 60px;
width: 60px;
border: 4px solid #1276e3;
border-left-color: transparent;
border-bottom: 0;
border-radius: 50%;
animation: loader-1-outter 1s cubic-bezier(0.42, 0.61, 0.58, 0.41)
infinite;
}
&:after {
content: "";
position: absolute;
height: 40px;
width: 40px;
border-radius: 50%;
border: 4px solid #1276e3;
border-right: 0;
border-top-color: transparent;
animation: loader-1-inner 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
}
}
video:before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: auto;
border: 1px solid red;
}
.weather {
flex: 1;
display: flex;
font-size: 0.14rem;
.mleft {
display: none;
}
.wtpath {
display: none;
}
.mright {
flex: 1;
text-align: center;
}
img {
display: block;
width: 2vw !important;
height: auto !important;
margin: 0 auto;
}
ul {
margin: 5px 0;
color: #d0d2ff;
}
#mobile05 {
flex: 1;
display: flex;
flex-direction: column;
position: relative;
margin: 0 0.05rem;
.today {
height: 0.6rem;
display: flex;
background-image: linear-gradient(
to right,
rgba(0, 28, 53, 0.7),
rgba(0, 28, 53, 0.4),
transparent
);
> div {
flex: 1;
display: flex;
> a {
display: flex;
align-items: center;
font {
margin-left: 0.15rem;
color: #eee;
}
}
.wt {
display: flex;
align-items: center;
margin-left: 0.15rem;
font {
margin-left: 0.1rem;
}
}
.zl {
display: flex;
align-items: center;
margin-left: 0.2rem;
a {
color: #eee;
}
}
}
}
.more {
flex: 1;
display: flex;
margin-top: 0.08rem;
> div {
margin-right: 0.07rem;
background-image: linear-gradient(
to bottom,
rgba(24, 69, 99, 0.8),
rgba(24, 69, 99, 0.5),
transparent
);
}
> div:nth-child(4) {
margin-right: 0;
}
.mright:last-child {
display: none;
}
.wt {
margin-top: 0.25rem;
li {
margin-top: 0.15rem;
}
}
}
}
//#mobile05>div:last-child{display:none;}
/* #mright_1{
top:0;left:0;height:auto;width:100%;display:flex;
ul{margin:0;color:#03d3fe;}
.wt{display:flex;align-items:center;margin-left:140px;}
.day{display:none;}
span:last-child{display:block;
position:absolute;top:4px;left:0px;height:auto;
font-size:26px;
}
font{margin:6px 0 0 10px;color:#35ecfa}
} */
//a{text-decoration:none;}
}
}
/* 登录 */
.login-ctn {
user-select: none;
background: no-repeat top left url("/static/images/login-min.jpg");
background-size: 100% 100%;
.liner {
height: 100%;
width: 100%;
display: flex;
.l-left {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
width: 50%;
padding-left: 0.3rem;
background-color: rgba(9, 119, 198, 0.55);
h3,
h4 {
line-height: 1;
color: #fff;
text-shadow: rgba(0, 0, 0, 0.4) -0.01rem 0.07rem 0.07rem;
}
h3 {
font-size: 0.3rem;
margin-top: -0.1rem;
}
h4 {
font-size: 0.37rem;
margin-top: 0.15rem;
letter-spacing: 0.03rem;
}
}
}
.pop-login {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 50%;
background-color: rgba(255, 255, 255, 0.9);
.inbox-range {
position: absolute;
flex: 1;
width: 75%;
max-width: 260px;
min-width: 190px;
.el-form {
.title {
position: relative;
color: #000;
letter-spacing: 0.04rem;
text-indent: 0.04rem;
font-size: 0.28rem;
line-height: 1;
padding-bottom: 0.13rem;
margin-bottom: 0.6rem;
display: flex;
justify-content: center;
&:after {
content: "";
position: absolute;
bottom: 0;
height: 0.04rem;
width: 0.76rem;
background-color: #1890ff;
border-radius: 20%;
}
}
.el-form-item {
margin-bottom: 20px;
position: relative;
}
.el-form-item:last-child {
margin-bottom: 0;
}
//>div:last-child{margin-top:45px;}
.el-input__prefix {
width: 30px;
left: 0;
font-size: 20px;
display: flex;
align-items: center;
justify-content: center;
}
.el-form-item__error {
display: none;
}
.el-form-item__error.open {
display: block;
}
.login-code {
img {
width: 100px;
display: flex;
cursor: pointer;
}
}
.el-form-item__content {
&:after,
&:before {
content: none;
}
}
.el-button--medium {
margin-top: 5px;
}
}
}
}
}
@keyframes rotate {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
@keyframes loader-1-outter {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes loader-1-inner {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
}
</style>
\ No newline at end of file
src/views/index-dp.vue 0 → 100644
View file @ 18bfc848
<template>
<div class="screen-container">
<!-- Cesium地图背景 -->
<div id="cesiumContainer" class="cesium-background"></div>
<!-- 顶部标题栏 -->
<header class="top-title-bar">
<h1 class="system-title">数据监测分析系统</h1>
<div class="header-info">
<div class="current-time">{{ currentTime }}</div>
<div class="system-status">
<span class="status-dot online"></span>
<span>系统正常运行中</span>
</div>
</div>
</header>
<!-- 菜单栏 -->
<nav class="menu-bar">
<ul class="menu-list">
<li class="menu-item active">
<span class="menu-icon home-icon"></span>
<span>首页概览</span>
</li>
<li class="menu-item">
<span class="menu-icon monitor-icon"></span>
<span>实时监测</span>
</li>
<li class="menu-item">
<span class="menu-icon alarm-icon"></span>
<span>报警管理</span>
</li>
<li class="menu-item">
<span class="menu-icon analysis-icon"></span>
<span>数据分析</span>
</li>
<li class="menu-item">
<span class="menu-icon system-icon"></span>
<span>系统设置</span>
</li>
</ul>
</nav>
<!-- 主内容区 -->
<main class="main-content">
<!-- 左侧数据模块 -->
<div class="left-modules">
<!-- 模块1：数据总览 -->
<div class="data-module">
<div class="module-header">
<h3>数据总览</h3>
<span class="refresh-icon"></span>
</div>
<div class="module-body">
<div class="data-stats">
<div class="stat-item">
<span class="stat-label">监测点位</span>
<span class="stat-value">256</span>
</div>
<div class="stat-item">
<span class="stat-label">在线设备</span>
<span class="stat-value online">245</span>
</div>
<div class="stat-item">
<span class="stat-label">数据采集量</span>
<span class="stat-value">1.2万</span>
</div>
</div>
<div class="progress-bars">
<div class="progress-item">
<span class="progress-label">设备在线率</span>
<div class="progress-container">
<div class="progress-bar" style="width: 95%"></div>
</div>
<span class="progress-value">95.7%</span>
</div>
</div>
</div>
</div>
<!-- 模块2：实时报警 -->
<div class="data-module">
<div class="module-header">
<h3>实时报警</h3>
<span class="alarm-count">5</span>
</div>
<div class="module-body">
<div class="alarm-list">
<div class="alarm-item level-1">
<span class="alarm-level">紧急</span>
<span class="alarm-content">温度异常</span>
<span class="alarm-point">A-12区</span>
<span class="alarm-time">10:23</span>
</div>
<div class="alarm-item level-2">
<span class="alarm-level">重要</span>
<span class="alarm-content">设备离线</span>
<span class="alarm-point">B-05区</span>
<span class="alarm-time">09:45</span>
</div>
<div class="alarm-item level-3">
<span class="alarm-level">一般</span>
<span class="alarm-content">数据异常</span>
<span class="alarm-point">C-08区</span>
<span class="alarm-time">08:30</span>
</div>
<div class="alarm-item level-3">
<span class="alarm-level">一般</span>
<span class="alarm-content">压力偏低</span>
<span class="alarm-point">D-01区</span>
<span class="alarm-time">07:55</span>
</div>
</div>
</div>
</div>
<!-- 模块3：环境监测 -->
<div class="data-module">
<div class="module-header">
<h3>环境监测</h3>
<span class="time-range">今日</span>
</div>
<div class="module-body">
<div class="env-data-grid">
<div class="env-item">
<span class="env-icon temp"></span>
<span class="env-label">平均温度</span>
<span class="env-value">26.3°C</span>
</div>
<div class="env-item">
<span class="env-icon humidity"></span>
<span class="env-label">平均湿度</span>
<span class="env-value">65.8%</span>
</div>
<div class="env-item">
<span class="env-icon pressure"></span>
<span class="env-label">平均气压</span>
<span class="env-value">101.5kPa</span>
</div>
<div class="env-item">
<span class="env-icon wind"></span>
<span class="env-label">平均风速</span>
<span class="env-value">3.2m/s</span>
</div>
</div>
</div>
</div>
</div>
<!-- 右侧数据模块 -->
<div class="right-modules">
<!-- 模块4：趋势分析 -->
<div class="data-module">
<div class="module-header">
<h3>数据趋势分析</h3>
<span class="chart-type">24小时</span>
</div>
<div class="module-body">
<div class="chart-container" id="trendChart"></div>
</div>
</div>
<!-- 模块5：设备状态 -->
<div class="data-module">
<div class="module-header">
<h3>设备运行状态</h3>
<span class="view-more">查看全部</span>
</div>
<div class="module-body">
<div class="device-status-list">
<div class="device-item">
<span class="device-name">传感器A-1</span>
<span class="device-status normal">正常</span>
<span class="device-value">125.6</span>
<span class="device-time">3分钟前</span>
</div>
<div class="device-item">
<span class="device-name">传感器B-3</span>
<span class="device-status normal">正常</span>
<span class="device-value">89.2</span>
<span class="device-time">5分钟前</span>
</div>
<div class="device-item">
<span class="device-name">传感器C-2</span>
<span class="device-status warning">警告</span>
<span class="device-value">185.3</span>
<span class="device-time">1分钟前</span>
</div>
<div class="device-item">
<span class="device-name">传感器D-5</span>
<span class="device-status offline">离线</span>
<span class="device-value">--</span>
<span class="device-time">2小时前</span>
</div>
</div>
</div>
</div>
<!-- 模块6：系统负载 -->
<div class="data-module">
<div class="module-header">
<h3>系统资源监控</h3>
<span class="system-time">{{ currentTimeShort }}</span>
</div>
<div class="module-body">
<div class="system-resources">
<div class="resource-item">
<span class="resource-label">CPU使用率</span>
<div class="resource-bar-container">
<div class="resource-bar cpu-bar" style="width: 42%"></div>
</div>
<span class="resource-value">42%</span>
</div>
<div class="resource-item">
<span class="resource-label">内存使用率</span>
<div class="resource-bar-container">
<div class="resource-bar mem-bar" style="width: 68%"></div>
</div>
<span class="resource-value">68%</span>
</div>
<div class="resource-item">
<span class="resource-label">磁盘使用率</span>
<div class="resource-bar-container">
<div class="resource-bar disk-bar" style="width: 35%"></div>
</div>
<span class="resource-value">35%</span>
</div>
</div>
</div>
</div>
</div>
</main>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: "",
currentTimeShort: "",
viewer: null,
};
},
mounted() {
// 初始化时间
this.updateTime();
setInterval(() => this.updateTime(), 1000);
// 初始化Cesium地图
this.initCesium();
// 初始化图表
this.$nextTick(() => {
this.drawTrendChart();
});
// 监听窗口大小变化
window.addEventListener("resize", this.handleResize);
},
beforeDestroy() {
window.removeEventListener("resize", this.handleResize);
if (this.viewer) {
this.viewer.destroy();
}
},
methods: {
// 更新时间
updateTime() {
const now = new Date();
// 完整时间格式
this.currentTime = now.toLocaleString("zh-CN", {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
});
// 短时间格式
this.currentTimeShort = now.toLocaleTimeString("zh-CN", {
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
});
},
// 初始化Cesium地图
initCesium() {
try {
// 设置Cesium基础路径
window.CESIUM_BASE_URL = "/cesium/";
// 创建Cesium视图
this.viewer = new Cesium.Viewer("cesiumContainer", {
imageryProvider: new Cesium.BingMapsImageryProvider({
url: "https://dev.virtualearth.net",
mapStyle: Cesium.BingMapsStyle.AERIAL,
key: "your-bing-maps-key", // 请替换为实际的Bing Maps密钥
}),
baseLayerPicker: false,
timeline: false,
animation: false,
fullscreenButton: false,
geocoder: false,
homeButton: false,
infoBox: false,
sceneModePicker: false,
navigationHelpButton: false,
navigationInstructionsInitiallyVisible: false,
});
// 设置相机位置
this.viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(
116.397428,
39.90923,
10000.0
),
orientation: {
heading: Cesium.Math.toRadians(0.0),
pitch: Cesium.Math.toRadians(-90.0),
roll: 0.0,
},
});
// 禁用默认的点击事件
this.viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(
Cesium.ScreenSpaceEventType.LEFT_CLICK
);
} catch (error) {
console.error("Cesium初始化失败:", error);
// 设置备用背景
const container = document.getElementById("cesiumContainer");
container.style.backgroundColor = "#001a33";
container.style.backgroundImage =
"linear-gradient(45deg, #001a33 25%, #00264d 25%, #00264d 50%, #001a33 50%, #001a33 75%, #00264d 75%, #00264d 100%)";
container.style.backgroundSize = "10px 10px";
}
},
// 绘制趋势图
drawTrendChart() {
const container = document.getElementById("trendChart");
if (!container) return;
const canvas = document.createElement("canvas");
canvas.width = container.clientWidth;
canvas.height = container.clientHeight;
container.appendChild(canvas);
const ctx = canvas.getContext("2d");
// 模拟数据
const data = [
12, 19, 15, 25, 32, 28, 22, 35, 29, 21, 18, 24, 27, 31, 26, 29, 33, 38,
35, 30, 28, 25, 22, 27,
];
const labels = Array.from({ length: 24 }, (_, i) => `${i}h`);
// 设置画布大小和边距
const padding = { top: 20, right: 20, bottom: 30, left: 40 };
const width = canvas.width - padding.left - padding.right;
const height = canvas.height - padding.top - padding.bottom;
// 计算数据范围
const maxValue = Math.max(...data);
const minValue = Math.min(...data);
const valueRange = maxValue - minValue || 1;
// 绘制背景
ctx.fillStyle = "rgba(0, 20, 40, 0.5)";
ctx.fillRect(padding.left, padding.top, width, height);
// 绘制网格线
ctx.strokeStyle = "rgba(100, 150, 200, 0.3)";
ctx.lineWidth = 1;
// 垂直网格线
for (let i = 0; i <= 24; i++) {
const x = padding.left + (width / 24) * i;
ctx.beginPath();
ctx.moveTo(x, padding.top);
ctx.lineTo(x, padding.top + height);
ctx.stroke();
}
// 水平网格线
for (let i = 0; i <= 5; i++) {
const y = padding.top + (height / 5) * i;
ctx.beginPath();
ctx.moveTo(padding.left, y);
ctx.lineTo(padding.left + width, y);
ctx.stroke();
}
// 绘制趋势线
ctx.strokeStyle = "#00ffcc";
ctx.lineWidth = 2;
ctx.beginPath();
data.forEach((value, index) => {
const x = padding.left + (width / 23) * index;
const y =
padding.top + height - ((value - minValue) / valueRange) * height;
if (index === 0) {
ctx.moveTo(x, y);
} else {
ctx.lineTo(x, y);
}
});
ctx.stroke();
// 绘制数据点
ctx.fillStyle = "#00ffcc";
data.forEach((value, index) => {
const x = padding.left + (width / 23) * index;
const y =
padding.top + height - ((value - minValue) / valueRange) * height;
ctx.beginPath();
ctx.arc(x, y, 3, 0, Math.PI * 2);
ctx.fill();
});
// 绘制时间标签
ctx.fillStyle = "#ffffff";
ctx.font = "10px Arial";
ctx.textAlign = "center";
for (let i = 0; i < labels.length; i += 3) {
const x = padding.left + (width / 23) * i;
const y = padding.top + height + 15;
ctx.fillText(labels[i], x, y);
}
},
// 处理窗口大小变化
handleResize() {
// 重新调整Cesium视图大小
if (this.viewer) {
this.viewer.resize();
}
// 重新绘制图表
const chartContainer = document.getElementById("trendChart");
if (chartContainer && chartContainer.firstChild) {
chartContainer.removeChild(chartContainer.firstChild);
this.drawTrendChart();
}
},
},
};
</script>
<style lang="scss" scope>
// 基础样式 - 1rem = 100px
html {
font-size: 100px;
}
// 屏幕容器
.screen-container {
position: relative;
width: 100vw;
height: 100vh;
background-color: #000;
color: #fff;
font-family: "Microsoft YaHei", Arial, sans-serif;
overflow: hidden;
}
// Cesium地图背景
.cesium-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
// 顶部标题栏
.top-title-bar {
position: relative;
height: 0.6rem;
background: linear-gradient(to right, #003366, #0066cc);
border-bottom: 2px solid #00aaff;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 0.4rem;
z-index: 100;
box-shadow: 0 2px 10px rgba(0, 170, 255, 0.3);
.system-title {
font-size: 0.22rem;
font-weight: bold;
color: #ffffff;
text-shadow: 0 0 10px rgba(0, 170, 255, 0.5);
margin: 0;
}
.header-info {
display: flex;
align-items: center;
gap: 0.3rem;
}
.current-time {
font-size: 0.14rem;
color: #00ffcc;
font-weight: 500;
}
.system-status {
display: flex;
align-items: center;
gap: 0.08rem;
font-size: 0.14rem;
}
.status-dot {
width: 0.08rem;
height: 0.08rem;
border-radius: 50%;
&.online {
background-color: #00ff00;
box-shadow: 0 0 0.05rem #00ff00;
}
&.offline {
background-color: #ff3333;
box-shadow: 0 0 0.05rem #ff3333;
}
}
}
// 菜单栏
.menu-bar {
position: relative;
height: 0.4rem;
background: rgba(0, 30, 60, 0.9);
border-bottom: 1px solid #005080;
z-index: 99;
.menu-list {
display: flex;
align-items: center;
height: 100%;
margin: 0;
padding: 0 0.2rem;
list-style: none;
}
.menu-item {
display: flex;
align-items: center;
gap: 0.08rem;
padding: 0 0.2rem;
height: 0.3rem;
margin-right: 0.2rem;
border-radius: 0.04rem;
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.14rem;
&:hover {
background: rgba(0, 170, 255, 0.2);
}
&.active {
background: linear-gradient(to right, #005080, #0078b0);
box-shadow: 0 0 0.1rem rgba(0, 170, 255, 0.5);
}
}
.menu-icon {
width: 0.16rem;
height: 0.16rem;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.home-icon {
background-image: url("/static/images/home-icon.png");
}
.monitor-icon {
background-image: url("/static/images/monitor-icon.png");
}
.alarm-icon {
background-image: url("/static/images/alarm-icon.png");
}
.analysis-icon {
background-image: url("/static/images/analysis-icon.png");
}
.system-icon {
background-image: url("/static/images/system-icon.png");
}
}
// 主内容区
.main-content {
position: relative;
display: flex;
justify-content: space-between;
padding: 0.2rem;
height: calc(100vh - 1rem);
z-index: 2;
}
// 左右模块容器
.left-modules,
.right-modules {
width: 3.6rem;
display: flex;
flex-direction: column;
gap: 0.2rem;
}
// 数据模块通用样式
.data-module {
background: rgba(0, 20, 40, 0.85);
border: 1px solid #005080;
border-radius: 0.04rem;
overflow: hidden;
display: flex;
flex-direction: column;
backdrop-filter: blur(0.05rem);
box-shadow: 0 0 0.15rem rgba(0, 100, 200, 0.3);
&:nth-child(1) {
height: 2.2rem;
}
&:nth-child(2) {
height: 2.5rem;
}
&:nth-child(3) {
height: 2rem;
}
}
// 模块头部
.module-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.12rem 0.16rem;
background: linear-gradient(to right, #003060, #005090);
border-bottom: 1px solid #0070b0;
h3 {
margin: 0;
font-size: 0.16rem;
font-weight: 500;
color: #00ffcc;
}
.refresh-icon,
.view-more {
font-size: 0.12rem;
color: #99ccff;
cursor: pointer;
}
.alarm-count {
background-color: #ff3333;
color: #fff;
padding: 0.02rem 0.08rem;
border-radius: 0.1rem;
font-size: 0.12rem;
font-weight: bold;
}
.time-range,
.chart-type,
.system-time {
font-size: 0.12rem;
color: #66ccff;
}
}
// 模块内容区
.module-body {
flex: 1;
padding: 0.16rem;
overflow: hidden;
}
// 数据总览样式
.data-stats {
display: flex;
justify-content: space-between;
margin-bottom: 0.16rem;
}
.stat-item {
display: flex;
flex-direction: column;
align-items: center;
min-width: 0.8rem;
}
.stat-label {
font-size: 0.12rem;
color: #99ccff;
margin-bottom: 0.05rem;
}
.stat-value {
font-size: 0.2rem;
font-weight: bold;
color: #ffffff;
&.online {
color: #00ff00;
}
}
.progress-bars {
margin-top: 0.1rem;
}
.progress-item {
display: flex;
align-items: center;
gap: 0.1rem;
margin-bottom: 0.08rem;
}
.progress-label {
font-size: 0.12rem;
color: #ffffff;
width: 0.8rem;
}
.progress-container {
flex: 1;
height: 0.06rem;
background: rgba(0, 40, 80, 0.6);
border: 1px solid #005080;
border-radius: 0.03rem;
overflow: hidden;
}
.progress-bar {
height: 100%;
background: linear-gradient(to right, #00aaff, #00ffcc);
box-shadow: 0 0 0.05rem rgba(0, 255, 204, 0.7);
}
.progress-value {
font-size: 0.12rem;
color: #00ffcc;
font-weight: bold;
width: 0.4rem;
text-align: right;
}
// 报警列表样式
.alarm-list {
height: 100%;
overflow-y: auto;
&::-webkit-scrollbar {
width: 0.04rem;
}
&::-webkit-scrollbar-track {
background: rgba(0, 40, 80, 0.5);
}
&::-webkit-scrollbar-thumb {
background: #0070b0;
border-radius: 0.02rem;
}
}
.alarm-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.1rem;
margin-bottom: 0.08rem;
border-radius: 0.04rem;
border-left: 3px solid;
background: rgba(0, 30, 60, 0.7);
font-size: 0.12rem;
&.level-1 {
border-color: #ff3333;
background: rgba(255, 51, 51, 0.1);
}
&.level-2 {
border-color: #ff9900;
background: rgba(255, 153, 0, 0.1);
}
&.level-3 {
border-color: #ffff00;
background: rgba(255, 255, 0, 0.1);
}
}
.alarm-level {
font-weight: bold;
width: 0.35rem;
.alarm-item.level-1 & {
color: #ff3333;
}
.alarm-item.level-2 & {
color: #ff9900;
}
.alarm-item.level-3 & {
color: #ffff00;
}
}
.alarm-content {
flex: 1;
color: #ffffff;
}
.alarm-point {
color: #99ccff;
width: 0.5rem;
}
.alarm-time {
color: #66ccff;
font-size: 0.11rem;
}
// 环境数据样式
.env-data-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.15rem;
height: 100%;
}
.env-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: rgba(0, 30, 60, 0.7);
border-radius: 0.04rem;
border: 1px solid #005080;
padding: 0.1rem;
}
.env-icon {
width: 0.3rem;
height: 0.3rem;
margin-bottom: 0.08rem;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.env-icon.temp {
background-image: url("/static/images/temp-icon.png");
}
.env-icon.humidity {
background-image: url("/static/images/humidity-icon.png");
}
.env-icon.pressure {
background-image: url("/static/images/pressure-icon.png");
}
.env-icon.wind {
background-image: url("/static/images/wind-icon.png");
}
.env-label {
font-size: 0.12rem;
color: #99ccff;
margin-bottom: 0.05rem;
}
.env-value {
font-size: 0.16rem;
font-weight: bold;
color: #00ffcc;
}
// 图表容器
.chart-container {
width: 100%;
height: 100%;
min-height: 1.5rem;
}
// 设备状态列表
.device-status-list {
height: 100%;
overflow-y: auto;
&::-webkit-scrollbar {
width: 0.04rem;
}
&::-webkit-scrollbar-track {
background: rgba(0, 40, 80, 0.5);
}
&::-webkit-scrollbar-thumb {
background: #0070b0;
border-radius: 0.02rem;
}
}
.device-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.1rem 0;
border-bottom: 1px solid rgba(0, 100, 200, 0.2);
font-size: 0.12rem;
&:last-child {
border-bottom: none;
}
}
.device-name {
color: #ffffff;
width: 0.8rem;
}
.device-status {
padding: 0.02rem 0.08rem;
border-radius: 0.03rem;
font-size: 0.11rem;
font-weight: bold;
&.normal {
background: rgba(0, 255, 0, 0.2);
color: #00ff00;
}
&.warning {
background: rgba(255, 153, 0, 0.2);
color: #ff9900;
}
&.offline {
background: rgba(255, 51, 51, 0.2);
color: #ff3333;
}
}
.device-value {
color: #00ffcc;
font-weight: bold;
width: 0.6rem;
text-align: right;
}
.device-time {
color: #66ccff;
font-size: 0.11rem;
}
// 系统资源监控
.system-resources {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-around;
}
.resource-item {
display: flex;
align-items: center;
gap: 0.1rem;
}
.resource-label {
font-size: 0.12rem;
color: #ffffff;
width: 0.9rem;
}
.resource-bar-container {
flex: 1;
height: 0.08rem;
background: rgba(0, 40, 80, 0.6);
border: 1px solid #005080;
border-radius: 0.04rem;
overflow: hidden;
}
.resource-bar {
height: 100%;
box-shadow: 0 0 0.05rem;
&.cpu-bar {
background: linear-gradient(to right, #00aaff, #00ffcc);
box-shadow: 0 0 0.05rem rgba(0, 255, 204, 0.7);
}
&.mem-bar {
background: linear-gradient(to right, #ff9900, #ffcc00);
box-shadow: 0 0 0.05rem rgba(255, 204, 0, 0.7);
}
&.disk-bar {
background: linear-gradient(to right, #00cc66, #00ff99);
box-shadow: 0 0 0.05rem rgba(0, 255, 153, 0.7);
}
}
.resource-value {
font-size: 0.12rem;
font-weight: bold;
width: 0.4rem;
text-align: right;
&.low {
color: #00ff00;
}
&.medium {
color: #ffcc00;
}
&.high {
color: #ff3333;
}
}
// 响应式设计 - 基于1920*1080分辨率的适配
@media (max-width: 1600px) {
html {
font-size: 83.3px; // 1600/1920 * 100
}
}
@media (max-width: 1440px) {
html {
font-size: 75px; // 1440/1920 * 100
}
.left-modules,
.right-modules {
width: 3rem;
}
}
@media (max-width: 1280px) {
html {
font-size: 66.7px; // 1280/1920 * 100
}
.left-modules,
.right-modules {
width: 2.6rem;
}
}
// 修复滚动条样式
*::-webkit-scrollbar {
width: 0.04rem;
height: 0.04rem;
}
*::-webkit-scrollbar-track {
background: rgba(0, 40, 80, 0.3);
border-radius: 0.02rem;
}
*::-webkit-scrollbar-thumb {
background: #0070b0;
border-radius: 0.02rem;
}
*::-webkit-scrollbar-thumb:hover {
background: #0090d0;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment