@@ -10,7 +10,10 @@ window._component = {
1010 <path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/>
1111 <path fill-rule="evenodd" d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z"/>
1212</svg>` ,
13- close : `<svg style="vertical-align: middle;" width="14" height="14" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="white" stroke-width="2.5" d="M16,16 L4,4"></path><path fill="none" stroke="white" stroke-width="2.5" d="M16,4 L4,16"></path></svg>` ,
13+ close : `<svg style="vertical-align: middle;" width="16" height="16" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="white" stroke-width="2.5" d="M16,16 L4,4"></path><path fill="none" stroke="white" stroke-width="2.5" d="M16,4 L4,16"></path></svg>` ,
14+ aspect : `<svg xmlns="http://www.w3.org/2000/svg" style="vertical-align: middle;" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
15+ <path fill="#ffffff" d="M0 12.5v-9A1.5 1.5 0 0 1 1.5 2h13A1.5 1.5 0 0 1 16 3.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 12.5zM2.5 4a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 1 0V5h2.5a.5.5 0 0 0 0-1h-3zm11 8a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-1 0V11h-2.5a.5.5 0 0 0 0 1h3z"/>
16+ </svg>` ,
1417 check : `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
1518 <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
1619</svg>` ,
@@ -143,6 +146,51 @@ window._component = {
143146 if ( typeof callback === 'function' ) callback ( ) ;
144147 } , time * 1000 ) ;
145148 } ,
149+ dialog :function ( info , width , height ) {
150+ let gauze = document . createElement ( 'div' ) ;
151+ gauze . className = 'dlp-plane-gauze' ;
152+ let box = document . createElement ( 'div' ) ;
153+ if ( width ) {
154+ box . style . width = width ;
155+ } else {
156+ box . style . width = '450px' ;
157+ }
158+ let top ;
159+ if ( height ) {
160+ top = ( window . innerHeight - height - 24 ) / 2 ;
161+ } else {
162+ top = ( window . innerHeight - 94 ) / 2 ;
163+ }
164+ box . style . margin = `${ top } px auto` ;
165+ let header = document . createElement ( 'div' ) ;
166+ header . className = 'dlp plane-header' ;
167+ /*X*/
168+ let X = document . createElement ( 'i' ) ;
169+ X . insertAdjacentHTML ( 'afterbegin' , _component . close ) ;
170+ X . addEventListener ( 'click' , ( ) => {
171+ if ( this . DOM instanceof HTMLElement ) {
172+ this . DOM . remove ( ) ;
173+ }
174+ if ( document . getElementById ( 'kvFileinputModal' ) instanceof HTMLElement ) {
175+ document . getElementById ( 'kvFileinputModal' ) . remove ( ) ;
176+ }
177+ } , false ) ;
178+ header . append ( X ) ;
179+ let body = document . createElement ( 'div' ) ;
180+ body . className = 'plane-body' ;
181+ if ( height ) {
182+ body . style . height = height ;
183+ } else {
184+ body . style . height = '70px' ;
185+ }
186+ body . insertAdjacentHTML ( "afterbegin" , `<p>哈哈哈哈哈哈哈哈哈</p>` ) ;
187+
188+ box . append ( header ) ;
189+ box . append ( body ) ;
190+ gauze . append ( box ) ;
191+ this . DOM = gauze ;
192+ document . body . append ( gauze ) ;
193+ } ,
146194 contextmenu : function ( event , list , options = { } ) {
147195 options = Object . assign ( {
148196 W : '70px'
@@ -251,7 +299,7 @@ window.ComponentDot = class {
251299 this . DOM . addEventListener ( "contextmenu" , ( e ) => {
252300 e . preventDefault ( ) ;
253301 } ) ;
254- this . menu = Object . assign ( { mode : false , placeholder : '未选择' , height : '150px' , toward : true } , menu ) ;
302+ this . menu = Object . assign ( { mode : false , placeholder : '未选择' , height : '150px' } , menu ) ;
255303 selected = selected . filter ( d => {
256304 if ( select [ d ] === undefined ) return false ;
257305 return true ;
@@ -377,15 +425,6 @@ window.ComponentDot = class {
377425 } ) ;
378426
379427 this . DOM . append ( menu ) ;
380- if ( this . menu . toward === false ) {
381- menu_list . style . display = 'flex' ;
382- menu_list . style . top = `-${ menu_list . clientHeight } px` ;
383- menu_list . style . height = `${ menu_list . clientHeight } px` ;
384- menu_list . style . flexDirection = 'column-reverse' ;
385- menu_list . style . display = 'none' ;
386- } else {
387- menu_list . style . flexDirection = 'column' ;
388- }
389428 this . DOM . insertAdjacentHTML ( 'beforeend' , `<input name="${ this . name } [select]" value='${ JSON . stringify ( selected ) } ' type="hidden"><input name="${ this . name } [insert]" value="[]" type="hidden"><input name="${ this . name } [delete]" value="[]" type="hidden">` ) ;
390429 this . SELECTED_DOM = document . querySelector ( `#${ this . name } .dlp-dot-menu-select` ) . firstElementChild ;
391430 this . CONTENT_DOM = document . querySelector ( `#${ this . name } .list` ) ;
@@ -526,7 +565,10 @@ window.ComponentCascadeDot = class {
526565 console . error ( 'CascadeDot param selected and select must be array!' ) ;
527566 return ;
528567 }
529-
568+ selected = selected . filter ( d => {
569+ if ( select [ d ] === undefined ) return false ;
570+ return true ;
571+ } ) ;
530572 this . name = name ;
531573 this . limit = limit ;
532574 this . DOM = document . getElementById ( name ) ;
@@ -820,40 +862,42 @@ window.ComponentCascadeDot = class {
820862 this . CONTENT_DOM . parentNode . append ( this . SELECT_COVER_DOM ) ;
821863 }
822864 this . dimensional_data . forEach ( ( data , stack ) => {
823- data . forEach ( ( d , k ) => {
824- if ( d . val . indexOf ( search . value ) === - 1 && search . value . indexOf ( d . val ) === - 1 ) return ;
825- if ( Array . isArray ( this . COVER_STACK_HASH_DOM [ stack ] ) && this . COVER_STACK_HASH_DOM [ stack ] . indexOf ( d . key ) !== - 1 ) return ;
826- this . searchPushTag ( stack , d , k ) ;
827- } ) ;
865+ this . searchPushTag ( search , data , stack ) ;
828866 } ) ;
829867 }
830868
831869 searchCoverClick ( stack , data , dom ) {
832870 if ( data . nodes !== null ) {
833871 let nextStack = stack + 1 ;
834- if ( Array . isArray ( this . dimensional_data [ nextStack ] ) ) {
835- this . SELECT_COVER_DOM . childNodes [ nextStack ] . innerHTML = '' ;
836- this . dimensional_data [ nextStack ] . forEach ( ( d , k ) => {
837- if ( data . nodes . includes ( d . key ) ) this . searchPushTag ( nextStack , d , k ) ;
838- } ) ;
839- }
872+ Array . isArray ( this . dimensional_data [ nextStack ] ) &&
873+ this . searchPushTag ( data . nodes , this . dimensional_data [ nextStack ] , nextStack ) ;
840874 return ;
841875 }
842876 ( dom instanceof HTMLElement ) && dom . click ( ) ;
843877 }
844878
845- searchPushTag ( stack , d , k ) {
846- let div = document . createElement ( 'div' ) ;
847- div . className = 'dlp dlp-text dlp-label' ;
848- div . insertAdjacentHTML ( 'beforeend' , `<i class="left"></i><span>${ d . val } </span><i class="right"></i>` ) ;
849- if ( d . nodes !== null ) div . querySelector ( 'i.left' ) . insertAdjacentHTML ( 'afterbegin' , _component . caret_right ) ;
850- div . addEventListener ( 'click' , ( ) => this . searchCoverClick ( stack , d , this . STACKS [ stack ] . childNodes [ k ] ) ) ;
851- this . SELECT_COVER_DOM . childNodes [ stack ] . prepend ( div ) ;
852- if ( ! Array . isArray ( this . COVER_STACK_HASH_DOM [ stack ] ) ) {
853- this . COVER_STACK_HASH_DOM [ stack ] = [ d . key ] ;
854- return ;
855- }
856- this . COVER_STACK_HASH_DOM [ stack ] . push ( d . key ) ;
879+ searchPushTag ( search , data , stack ) {
880+ data . forEach ( ( d , k ) => {
881+ if ( Array . isArray ( search ) ) {
882+ if ( search . indexOf ( d . key ) === - 1 ) return ;
883+ } else {
884+ if ( d . val . indexOf ( search . value ) === - 1 && search . value . indexOf ( d . val ) === - 1 ) return ;
885+ }
886+ if ( Array . isArray ( this . COVER_STACK_HASH_DOM [ stack ] ) && this . COVER_STACK_HASH_DOM [ stack ] . indexOf ( d . key ) !== - 1 ) return ;
887+ let div = document . createElement ( 'div' ) ;
888+ div . className = 'dlp dlp-text dlp-label' ;
889+ div . insertAdjacentHTML ( 'afterbegin' , '<i class="left"></i>' ) ;
890+ div . textContent = d . val ;
891+ div . insertAdjacentHTML ( 'beforeend' , '<i class="right"></i>' ) ;
892+ if ( d . nodes !== null ) div . querySelector ( 'i.left' ) . insertAdjacentHTML ( 'afterbegin' , _component . caret_right ) ;
893+ div . addEventListener ( 'click' , ( ) => this . searchCoverClick ( stack , d , this . STACKS [ stack ] . childNodes [ k ] ) ) ;
894+ this . SELECT_COVER_DOM . childNodes [ stack ] . prepend ( div ) ;
895+ if ( ! Array . isArray ( this . COVER_STACK_HASH_DOM [ stack ] ) ) {
896+ this . COVER_STACK_HASH_DOM [ stack ] = [ d . key ] ;
897+ return ;
898+ }
899+ this . COVER_STACK_HASH_DOM [ stack ] . push ( d . key ) ;
900+ } ) ;
857901 }
858902
859903 checkAll ( stack , nodes , check ) {
@@ -1320,6 +1364,9 @@ window.ComponentLine = class {
13201364} ;
13211365
13221366window . ComponentPlane = class {
1367+ WIDTH ;
1368+ HEIGHT ;
1369+ FULLSCREEN ;
13231370 constructor ( url , xhr = { } , options = { } ) {
13241371 if ( document . querySelector ( '#dlp-plane' ) instanceof HTMLElement ) return ;
13251372 this . URL = url ;
@@ -1336,6 +1383,7 @@ window.ComponentPlane = class {
13361383 top : '30px' ,
13371384 left : 'auto'
13381385 } , options ) ;
1386+ this . FULLSCREEN = false ;
13391387 this . makeModal ( ) ;
13401388 this . makeContent ( ) ;
13411389 }
@@ -1353,13 +1401,40 @@ window.ComponentPlane = class {
13531401 if ( height >= ( window . innerHeight - 25 ) ) height = window . innerHeight - 25 ;
13541402 height += 'px' ;
13551403 }
1404+ this . WIDTH = width ;
1405+ this . HEIGHT = height ;
13561406 let margin = this . OPTIONS . top + ' ' + this . OPTIONS . left ;
13571407 let html = `<div id="dlp-plane" class="dlp-plane-gauze"><div style="width: ${ width } ;margin: ${ margin } "><div class="dlp plane-header"></div><div class="plane-body dlp-scroll" style="height:${ height } ;"></div></div></div>` ;
13581408 document . body . insertAdjacentHTML ( 'beforeEnd' , html ) ;
13591409 this . DOM = document . getElementById ( 'dlp-plane' ) ;
1410+ /*F*/
1411+ let F = document . createElement ( 'i' ) ;
1412+ F . style . marginRight = '10px' ;
1413+ F . insertAdjacentHTML ( 'afterbegin' , _component . aspect ) ;
1414+ F . addEventListener ( 'click' , ( ) => {
1415+ if ( this . FULLSCREEN === false ) {
1416+ this . FULLSCREEN = true ;
1417+ this . DOM . firstChild . style . width = '100%' ;
1418+ this . DOM . firstChild . style . margin = '0' ;
1419+ this . DOM . querySelector ( '.plane-body' ) . style . height = ( window . innerHeight - 25 ) + 'px' ;
1420+ } else {
1421+ this . FULLSCREEN = false ;
1422+ this . DOM . firstChild . style . width = this . WIDTH ;
1423+ this . DOM . firstChild . style . marginTop = this . OPTIONS . top ;
1424+ if ( this . OPTIONS . left === 'auto' ) {
1425+ this . DOM . firstChild . style . margin = `${ this . OPTIONS . top } auto` ;
1426+ } else {
1427+ this . DOM . firstChild . style . marginTop = this . OPTIONS . top ;
1428+ this . DOM . firstChild . style . marginLeft = this . OPTIONS . left ;
1429+ }
1430+ this . DOM . querySelector ( '.plane-body' ) . style . height = this . HEIGHT ;
1431+ }
1432+ } , false ) ;
1433+ this . DOM . querySelector ( '.plane-header' ) . append ( F ) ;
13601434 /*X*/
13611435 let X = document . createElement ( 'i' ) ;
13621436 X . insertAdjacentHTML ( 'afterbegin' , _component . close ) ;
1437+ X . style . marginRight = '5px' ;
13631438 X . addEventListener ( 'click' , ( ) => {
13641439 if ( this . DOM instanceof HTMLElement ) {
13651440 this . DOM . remove ( ) ;
@@ -2525,4 +2600,4 @@ window.ComponentCascadeLine = class {
25252600 this . dimensional_data [ stack ] . splice ( d , 1 ) ;
25262601 } ) ;
25272602 }
2528- } ;
2603+ } ;
0 commit comments