diff --git a/FRONT/BUILD/index.html b/FRONT/BUILD/index.html new file mode 100644 index 0000000..8f4d4d1 --- /dev/null +++ b/FRONT/BUILD/index.html @@ -0,0 +1,13 @@ + + + + + GoNets + + + + + +
+ + \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/.gitignore b/FRONT/BUILD/resources/app/.gitignore index 30bc162..b2d59d1 100644 --- a/FRONT/BUILD/resources/app/.gitignore +++ b/FRONT/BUILD/resources/app/.gitignore @@ -1 +1,2 @@ -/node_modules \ No newline at end of file +/node_modules +/dist \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/dist/assets/icon-4fEsvohP.png b/FRONT/BUILD/resources/app/dist/assets/icon-4fEsvohP.png deleted file mode 100644 index b39bc87..0000000 Binary files a/FRONT/BUILD/resources/app/dist/assets/icon-4fEsvohP.png and /dev/null differ diff --git a/FRONT/BUILD/resources/app/dist/assets/index-CAnb47c8.js b/FRONT/BUILD/resources/app/dist/assets/index-CAnb47c8.js deleted file mode 100644 index 2ee490f..0000000 --- a/FRONT/BUILD/resources/app/dist/assets/index-CAnb47c8.js +++ /dev/null @@ -1,913 +0,0 @@ -(function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const s of document.querySelectorAll('link[rel="modulepreload"]'))i(s);new MutationObserver(s=>{for(const a of s)if(a.type==="childList")for(const u of a.addedNodes)u.tagName==="LINK"&&u.rel==="modulepreload"&&i(u)}).observe(document,{childList:!0,subtree:!0});function r(s){const a={};return s.integrity&&(a.integrity=s.integrity),s.referrerPolicy&&(a.referrerPolicy=s.referrerPolicy),s.crossOrigin==="use-credentials"?a.credentials="include":s.crossOrigin==="anonymous"?a.credentials="omit":a.credentials="same-origin",a}function i(s){if(s.ep)return;s.ep=!0;const a=r(s);fetch(s.href,a)}})();function rt(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var Wf={exports:{}},ns={},qf={exports:{}},Re={};/** - * @license React - * react.production.min.js - * - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */var mm;function KS(){if(mm)return Re;mm=1;var e=Symbol.for("react.element"),t=Symbol.for("react.portal"),r=Symbol.for("react.fragment"),i=Symbol.for("react.strict_mode"),s=Symbol.for("react.profiler"),a=Symbol.for("react.provider"),u=Symbol.for("react.context"),f=Symbol.for("react.forward_ref"),d=Symbol.for("react.suspense"),h=Symbol.for("react.memo"),g=Symbol.for("react.lazy"),m=Symbol.iterator;function y(T){return T===null||typeof T!="object"?null:(T=m&&T[m]||T["@@iterator"],typeof T=="function"?T:null)}var v={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},S=Object.assign,E={};function k(T,H,Z){this.props=T,this.context=H,this.refs=E,this.updater=Z||v}k.prototype.isReactComponent={},k.prototype.setState=function(T,H){if(typeof T!="object"&&typeof T!="function"&&T!=null)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,T,H,"setState")},k.prototype.forceUpdate=function(T){this.updater.enqueueForceUpdate(this,T,"forceUpdate")};function C(){}C.prototype=k.prototype;function R(T,H,Z){this.props=T,this.context=H,this.refs=E,this.updater=Z||v}var N=R.prototype=new C;N.constructor=R,S(N,k.prototype),N.isPureReactComponent=!0;var b=Array.isArray,M=Object.prototype.hasOwnProperty,L={current:null},j={key:!0,ref:!0,__self:!0,__source:!0};function G(T,H,Z){var te,ie={},le=null,de=null;if(H!=null)for(te in H.ref!==void 0&&(de=H.ref),H.key!==void 0&&(le=""+H.key),H)M.call(H,te)&&!j.hasOwnProperty(te)&&(ie[te]=H[te]);var re=arguments.length-2;if(re===1)ie.children=Z;else if(1>>1,H=A[T];if(0>>1;Ts(ie,z))les(de,ie)?(A[T]=de,A[le]=z,T=le):(A[T]=ie,A[te]=z,T=te);else if(les(de,z))A[T]=de,A[le]=z,T=le;else break e}}return O}function s(A,O){var z=A.sortIndex-O.sortIndex;return z!==0?z:A.id-O.id}if(typeof performance=="object"&&typeof performance.now=="function"){var a=performance;e.unstable_now=function(){return a.now()}}else{var u=Date,f=u.now();e.unstable_now=function(){return u.now()-f}}var d=[],h=[],g=1,m=null,y=3,v=!1,S=!1,E=!1,k=typeof setTimeout=="function"?setTimeout:null,C=typeof clearTimeout=="function"?clearTimeout:null,R=typeof setImmediate<"u"?setImmediate:null;typeof navigator<"u"&&navigator.scheduling!==void 0&&navigator.scheduling.isInputPending!==void 0&&navigator.scheduling.isInputPending.bind(navigator.scheduling);function N(A){for(var O=r(h);O!==null;){if(O.callback===null)i(h);else if(O.startTime<=A)i(h),O.sortIndex=O.expirationTime,t(d,O);else break;O=r(h)}}function b(A){if(E=!1,N(A),!S)if(r(d)!==null)S=!0,F(M);else{var O=r(h);O!==null&&q(b,O.startTime-A)}}function M(A,O){S=!1,E&&(E=!1,C(G),G=-1),v=!0;var z=y;try{for(N(O),m=r(d);m!==null&&(!(m.expirationTime>O)||A&&!ee());){var T=m.callback;if(typeof T=="function"){m.callback=null,y=m.priorityLevel;var H=T(m.expirationTime<=O);O=e.unstable_now(),typeof H=="function"?m.callback=H:m===r(d)&&i(d),N(O)}else i(d);m=r(d)}if(m!==null)var Z=!0;else{var te=r(h);te!==null&&q(b,te.startTime-O),Z=!1}return Z}finally{m=null,y=z,v=!1}}var L=!1,j=null,G=-1,V=5,Y=-1;function ee(){return!(e.unstable_now()-YA||125T?(A.sortIndex=z,t(h,A),r(d)===null&&A===r(h)&&(E?(C(G),G=-1):E=!0,q(b,z-T))):(A.sortIndex=H,t(d,A),S||v||(S=!0,F(M))),A},e.unstable_shouldYield=ee,e.unstable_wrapCallback=function(A){var O=y;return function(){var z=y;y=O;try{return A.apply(this,arguments)}finally{y=z}}}}(Gf)),Gf}var Sm;function eE(){return Sm||(Sm=1,Xf.exports=ZS()),Xf.exports}/** - * @license React - * react-dom.production.min.js - * - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */var Em;function tE(){if(Em)return Nt;Em=1;var e=As(),t=eE();function r(n){for(var o="https://reactjs.org/docs/error-decoder.html?invariant="+n,l=1;l"u"||typeof window.document>"u"||typeof window.document.createElement>"u"),d=Object.prototype.hasOwnProperty,h=/^[:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD][:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,g={},m={};function y(n){return d.call(m,n)?!0:d.call(g,n)?!1:h.test(n)?m[n]=!0:(g[n]=!0,!1)}function v(n,o,l,c){if(l!==null&&l.type===0)return!1;switch(typeof o){case"function":case"symbol":return!0;case"boolean":return c?!1:l!==null?!l.acceptsBooleans:(n=n.toLowerCase().slice(0,5),n!=="data-"&&n!=="aria-");default:return!1}}function S(n,o,l,c){if(o===null||typeof o>"u"||v(n,o,l,c))return!0;if(c)return!1;if(l!==null)switch(l.type){case 3:return!o;case 4:return o===!1;case 5:return isNaN(o);case 6:return isNaN(o)||1>o}return!1}function E(n,o,l,c,p,x,_){this.acceptsBooleans=o===2||o===3||o===4,this.attributeName=c,this.attributeNamespace=p,this.mustUseProperty=l,this.propertyName=n,this.type=o,this.sanitizeURL=x,this.removeEmptyString=_}var k={};"children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(n){k[n]=new E(n,0,!1,n,null,!1,!1)}),[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(n){var o=n[0];k[o]=new E(o,1,!1,n[1],null,!1,!1)}),["contentEditable","draggable","spellCheck","value"].forEach(function(n){k[n]=new E(n,2,!1,n.toLowerCase(),null,!1,!1)}),["autoReverse","externalResourcesRequired","focusable","preserveAlpha"].forEach(function(n){k[n]=new E(n,2,!1,n,null,!1,!1)}),"allowFullScreen async autoFocus autoPlay controls default defer disabled disablePictureInPicture disableRemotePlayback formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope".split(" ").forEach(function(n){k[n]=new E(n,3,!1,n.toLowerCase(),null,!1,!1)}),["checked","multiple","muted","selected"].forEach(function(n){k[n]=new E(n,3,!0,n,null,!1,!1)}),["capture","download"].forEach(function(n){k[n]=new E(n,4,!1,n,null,!1,!1)}),["cols","rows","size","span"].forEach(function(n){k[n]=new E(n,6,!1,n,null,!1,!1)}),["rowSpan","start"].forEach(function(n){k[n]=new E(n,5,!1,n.toLowerCase(),null,!1,!1)});var C=/[\-:]([a-z])/g;function R(n){return n[1].toUpperCase()}"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach(function(n){var o=n.replace(C,R);k[o]=new E(o,1,!1,n,null,!1,!1)}),"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type".split(" ").forEach(function(n){var o=n.replace(C,R);k[o]=new E(o,1,!1,n,"http://www.w3.org/1999/xlink",!1,!1)}),["xml:base","xml:lang","xml:space"].forEach(function(n){var o=n.replace(C,R);k[o]=new E(o,1,!1,n,"http://www.w3.org/XML/1998/namespace",!1,!1)}),["tabIndex","crossOrigin"].forEach(function(n){k[n]=new E(n,1,!1,n.toLowerCase(),null,!1,!1)}),k.xlinkHref=new E("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1),["src","href","action","formAction"].forEach(function(n){k[n]=new E(n,1,!1,n.toLowerCase(),null,!0,!0)});function N(n,o,l,c){var p=k.hasOwnProperty(o)?k[o]:null;(p!==null?p.type!==0:c||!(2$||p[_]!==x[$]){var D=` -`+p[_].replace(" at new "," at ");return n.displayName&&D.includes("")&&(D=D.replace("",n.displayName)),D}while(1<=_&&0<=$);break}}}finally{Z=!1,Error.prepareStackTrace=l}return(n=n?n.displayName||n.name:"")?H(n):""}function ie(n){switch(n.tag){case 5:return H(n.type);case 16:return H("Lazy");case 13:return H("Suspense");case 19:return H("SuspenseList");case 0:case 2:case 15:return n=te(n.type,!1),n;case 11:return n=te(n.type.render,!1),n;case 1:return n=te(n.type,!0),n;default:return""}}function le(n){if(n==null)return null;if(typeof n=="function")return n.displayName||n.name||null;if(typeof n=="string")return n;switch(n){case j:return"Fragment";case L:return"Portal";case V:return"Profiler";case G:return"StrictMode";case J:return"Suspense";case I:return"SuspenseList"}if(typeof n=="object")switch(n.$$typeof){case ee:return(n.displayName||"Context")+".Consumer";case Y:return(n._context.displayName||"Context")+".Provider";case ne:var o=n.render;return n=n.displayName,n||(n=o.displayName||o.name||"",n=n!==""?"ForwardRef("+n+")":"ForwardRef"),n;case U:return o=n.displayName||null,o!==null?o:le(n.type)||"Memo";case F:o=n._payload,n=n._init;try{return le(n(o))}catch{}}return null}function de(n){var o=n.type;switch(n.tag){case 24:return"Cache";case 9:return(o.displayName||"Context")+".Consumer";case 10:return(o._context.displayName||"Context")+".Provider";case 18:return"DehydratedFragment";case 11:return n=o.render,n=n.displayName||n.name||"",o.displayName||(n!==""?"ForwardRef("+n+")":"ForwardRef");case 7:return"Fragment";case 5:return o;case 4:return"Portal";case 3:return"Root";case 6:return"Text";case 16:return le(o);case 8:return o===G?"StrictMode":"Mode";case 22:return"Offscreen";case 12:return"Profiler";case 21:return"Scope";case 13:return"Suspense";case 19:return"SuspenseList";case 25:return"TracingMarker";case 1:case 0:case 17:case 2:case 14:case 15:if(typeof o=="function")return o.displayName||o.name||null;if(typeof o=="string")return o}return null}function re(n){switch(typeof n){case"boolean":case"number":case"string":case"undefined":return n;case"object":return n;default:return""}}function he(n){var o=n.type;return(n=n.nodeName)&&n.toLowerCase()==="input"&&(o==="checkbox"||o==="radio")}function Se(n){var o=he(n)?"checked":"value",l=Object.getOwnPropertyDescriptor(n.constructor.prototype,o),c=""+n[o];if(!n.hasOwnProperty(o)&&typeof l<"u"&&typeof l.get=="function"&&typeof l.set=="function"){var p=l.get,x=l.set;return Object.defineProperty(n,o,{configurable:!0,get:function(){return p.call(this)},set:function(_){c=""+_,x.call(this,_)}}),Object.defineProperty(n,o,{enumerable:l.enumerable}),{getValue:function(){return c},setValue:function(_){c=""+_},stopTracking:function(){n._valueTracker=null,delete n[o]}}}}function we(n){n._valueTracker||(n._valueTracker=Se(n))}function ge(n){if(!n)return!1;var o=n._valueTracker;if(!o)return!0;var l=o.getValue(),c="";return n&&(c=he(n)?n.checked?"true":"false":n.value),n=c,n!==l?(o.setValue(n),!0):!1}function Pe(n){if(n=n||(typeof document<"u"?document:void 0),typeof n>"u")return null;try{return n.activeElement||n.body}catch{return n.body}}function $e(n,o){var l=o.checked;return z({},o,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:l??n._wrapperState.initialChecked})}function Ke(n,o){var l=o.defaultValue==null?"":o.defaultValue,c=o.checked!=null?o.checked:o.defaultChecked;l=re(o.value!=null?o.value:l),n._wrapperState={initialChecked:c,initialValue:l,controlled:o.type==="checkbox"||o.type==="radio"?o.checked!=null:o.value!=null}}function Xt(n,o){o=o.checked,o!=null&&N(n,"checked",o,!1)}function Cr(n,o){Xt(n,o);var l=re(o.value),c=o.type;if(l!=null)c==="number"?(l===0&&n.value===""||n.value!=l)&&(n.value=""+l):n.value!==""+l&&(n.value=""+l);else if(c==="submit"||c==="reset"){n.removeAttribute("value");return}o.hasOwnProperty("value")?_r(n,o.type,l):o.hasOwnProperty("defaultValue")&&_r(n,o.type,re(o.defaultValue)),o.checked==null&&o.defaultChecked!=null&&(n.defaultChecked=!!o.defaultChecked)}function lo(n,o,l){if(o.hasOwnProperty("value")||o.hasOwnProperty("defaultValue")){var c=o.type;if(!(c!=="submit"&&c!=="reset"||o.value!==void 0&&o.value!==null))return;o=""+n._wrapperState.initialValue,l||o===n.value||(n.value=o),n.defaultValue=o}l=n.name,l!==""&&(n.name=""),n.defaultChecked=!!n._wrapperState.initialChecked,l!==""&&(n.name=l)}function _r(n,o,l){(o!=="number"||Pe(n.ownerDocument)!==n)&&(l==null?n.defaultValue=""+n._wrapperState.initialValue:n.defaultValue!==""+l&&(n.defaultValue=""+l))}var Gt=Array.isArray;function fn(n,o,l,c){if(n=n.options,o){o={};for(var p=0;p"+o.valueOf().toString()+"",o=uo.firstChild;n.firstChild;)n.removeChild(n.firstChild);for(;o.firstChild;)n.appendChild(o.firstChild)}});function Nr(n,o){if(o){var l=n.firstChild;if(l&&l===n.lastChild&&l.nodeType===3){l.nodeValue=o;return}}n.textContent=o}var br={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},Ju=["Webkit","ms","Moz","O"];Object.keys(br).forEach(function(n){Ju.forEach(function(o){o=o+n.charAt(0).toUpperCase()+n.substring(1),br[o]=br[n]})});function qs(n,o,l){return o==null||typeof o=="boolean"||o===""?"":l||typeof o!="number"||o===0||br.hasOwnProperty(n)&&br[n]?(""+o).trim():o+"px"}function Ys(n,o){n=n.style;for(var l in o)if(o.hasOwnProperty(l)){var c=l.indexOf("--")===0,p=qs(l,o[l],c);l==="float"&&(l="cssFloat"),c?n.setProperty(l,p):n[l]=p}}var Zu=z({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0});function hi(n,o){if(o){if(Zu[n]&&(o.children!=null||o.dangerouslySetInnerHTML!=null))throw Error(r(137,n));if(o.dangerouslySetInnerHTML!=null){if(o.children!=null)throw Error(r(60));if(typeof o.dangerouslySetInnerHTML!="object"||!("__html"in o.dangerouslySetInnerHTML))throw Error(r(61))}if(o.style!=null&&typeof o.style!="object")throw Error(r(62))}}function pi(n,o){if(n.indexOf("-")===-1)return typeof o.is=="string";switch(n){case"annotation-xml":case"color-profile":case"font-face":case"font-face-src":case"font-face-uri":case"font-face-format":case"font-face-name":case"missing-glyph":return!1;default:return!0}}var gi=null;function mi(n){return n=n.target||n.srcElement||window,n.correspondingUseElement&&(n=n.correspondingUseElement),n.nodeType===3?n.parentNode:n}var yi=null,Gn=null,Kn=null;function Xs(n){if(n=Bi(n)){if(typeof yi!="function")throw Error(r(280));var o=n.stateNode;o&&(o=kl(o),yi(n.stateNode,n.type,o))}}function xi(n){Gn?Kn?Kn.push(n):Kn=[n]:Gn=n}function Gs(){if(Gn){var n=Gn,o=Kn;if(Kn=Gn=null,Xs(n),o)for(n=0;n>>=0,n===0?32:31-(ac(n)/uc|0)|0}var mo=64,yo=4194304;function kn(n){switch(n&-n){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return n&4194240;case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:return n&130023424;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 1073741824;default:return n}}function xo(n,o){var l=n.pendingLanes;if(l===0)return 0;var c=0,p=n.suspendedLanes,x=n.pingedLanes,_=l&268435455;if(_!==0){var $=_&~p;$!==0?c=kn($):(x&=_,x!==0&&(c=kn(x)))}else _=l&~p,_!==0?c=kn(_):x!==0&&(c=kn(x));if(c===0)return 0;if(o!==0&&o!==c&&(o&p)===0&&(p=c&-c,x=o&-o,p>=x||p===16&&(x&4194240)!==0))return o;if((c&4)!==0&&(c|=l&16),o=n.entangledLanes,o!==0)for(n=n.entanglements,o&=c;0l;l++)o.push(n);return o}function Ci(n,o,l){n.pendingLanes|=o,o!==536870912&&(n.suspendedLanes=0,n.pingedLanes=0),n=n.eventTimes,o=31-Tt(o),n[o]=l}function yw(n,o){var l=n.pendingLanes&~o;n.pendingLanes=o,n.suspendedLanes=0,n.pingedLanes=0,n.expiredLanes&=o,n.mutableReadLanes&=o,n.entangledLanes&=o,o=n.entanglements;var c=n.eventTimes;for(n=n.expirationTimes;0=ji),up=" ",cp=!1;function fp(n,o){switch(n){case"keyup":return Ww.indexOf(o.keyCode)!==-1;case"keydown":return o.keyCode!==229;case"keypress":case"mousedown":case"focusout":return!0;default:return!1}}function dp(n){return n=n.detail,typeof n=="object"&&"data"in n?n.data:null}var So=!1;function Yw(n,o){switch(n){case"compositionend":return dp(o);case"keypress":return o.which!==32?null:(cp=!0,up);case"textInput":return n=o.data,n===up&&cp?null:n;default:return null}}function Xw(n,o){if(So)return n==="compositionend"||!Cc&&fp(n,o)?(n=rp(),dl=xc=tr=null,So=!1,n):null;switch(n){case"paste":return null;case"keypress":if(!(o.ctrlKey||o.altKey||o.metaKey)||o.ctrlKey&&o.altKey){if(o.char&&1=o)return{node:l,offset:o-n};n=c}e:{for(;l;){if(l.nextSibling){l=l.nextSibling;break e}l=l.parentNode}l=void 0}l=vp(l)}}function Sp(n,o){return n&&o?n===o?!0:n&&n.nodeType===3?!1:o&&o.nodeType===3?Sp(n,o.parentNode):"contains"in n?n.contains(o):n.compareDocumentPosition?!!(n.compareDocumentPosition(o)&16):!1:!1}function Ep(){for(var n=window,o=Pe();o instanceof n.HTMLIFrameElement;){try{var l=typeof o.contentWindow.location.href=="string"}catch{l=!1}if(l)n=o.contentWindow;else break;o=Pe(n.document)}return o}function bc(n){var o=n&&n.nodeName&&n.nodeName.toLowerCase();return o&&(o==="input"&&(n.type==="text"||n.type==="search"||n.type==="tel"||n.type==="url"||n.type==="password")||o==="textarea"||n.contentEditable==="true")}function rS(n){var o=Ep(),l=n.focusedElem,c=n.selectionRange;if(o!==l&&l&&l.ownerDocument&&Sp(l.ownerDocument.documentElement,l)){if(c!==null&&bc(l)){if(o=c.start,n=c.end,n===void 0&&(n=o),"selectionStart"in l)l.selectionStart=o,l.selectionEnd=Math.min(n,l.value.length);else if(n=(o=l.ownerDocument||document)&&o.defaultView||window,n.getSelection){n=n.getSelection();var p=l.textContent.length,x=Math.min(c.start,p);c=c.end===void 0?x:Math.min(c.end,p),!n.extend&&x>c&&(p=c,c=x,x=p),p=wp(l,x);var _=wp(l,c);p&&_&&(n.rangeCount!==1||n.anchorNode!==p.node||n.anchorOffset!==p.offset||n.focusNode!==_.node||n.focusOffset!==_.offset)&&(o=o.createRange(),o.setStart(p.node,p.offset),n.removeAllRanges(),x>c?(n.addRange(o),n.extend(_.node,_.offset)):(o.setEnd(_.node,_.offset),n.addRange(o)))}}for(o=[],n=l;n=n.parentNode;)n.nodeType===1&&o.push({element:n,left:n.scrollLeft,top:n.scrollTop});for(typeof l.focus=="function"&&l.focus(),l=0;l=document.documentMode,Eo=null,Pc=null,Li=null,Rc=!1;function kp(n,o,l){var c=l.window===l?l.document:l.nodeType===9?l:l.ownerDocument;Rc||Eo==null||Eo!==Pe(c)||(c=Eo,"selectionStart"in c&&bc(c)?c={start:c.selectionStart,end:c.selectionEnd}:(c=(c.ownerDocument&&c.ownerDocument.defaultView||window).getSelection(),c={anchorNode:c.anchorNode,anchorOffset:c.anchorOffset,focusNode:c.focusNode,focusOffset:c.focusOffset}),Li&&Mi(Li,c)||(Li=c,c=wl(Pc,"onSelect"),0bo||(n.current=Bc[bo],Bc[bo]=null,bo--)}function De(n,o){bo++,Bc[bo]=n.current,n.current=o}var ir={},dt=or(ir),St=or(!1),jr=ir;function Po(n,o){var l=n.type.contextTypes;if(!l)return ir;var c=n.stateNode;if(c&&c.__reactInternalMemoizedUnmaskedChildContext===o)return c.__reactInternalMemoizedMaskedChildContext;var p={},x;for(x in l)p[x]=o[x];return c&&(n=n.stateNode,n.__reactInternalMemoizedUnmaskedChildContext=o,n.__reactInternalMemoizedMaskedChildContext=p),p}function Et(n){return n=n.childContextTypes,n!=null}function Cl(){ze(St),ze(dt)}function Op(n,o,l){if(dt.current!==ir)throw Error(r(168));De(dt,o),De(St,l)}function zp(n,o,l){var c=n.stateNode;if(o=o.childContextTypes,typeof c.getChildContext!="function")return l;c=c.getChildContext();for(var p in c)if(!(p in o))throw Error(r(108,de(n)||"Unknown",p));return z({},l,c)}function _l(n){return n=(n=n.stateNode)&&n.__reactInternalMemoizedMergedChildContext||ir,jr=dt.current,De(dt,n),De(St,St.current),!0}function Fp(n,o,l){var c=n.stateNode;if(!c)throw Error(r(169));l?(n=zp(n,o,jr),c.__reactInternalMemoizedMergedChildContext=n,ze(St),ze(dt),De(dt,n)):ze(St),De(St,l)}var _n=null,Nl=!1,Hc=!1;function Bp(n){_n===null?_n=[n]:_n.push(n)}function gS(n){Nl=!0,Bp(n)}function sr(){if(!Hc&&_n!==null){Hc=!0;var n=0,o=Me;try{var l=_n;for(Me=1;n>=_,p-=_,Nn=1<<32-Tt(o)+p|l<Ce?(st=ke,ke=null):st=ke.sibling;var je=se(W,ke,X[Ce],fe);if(je===null){ke===null&&(ke=st);break}n&&ke&&je.alternate===null&&o(W,ke),B=x(je,B,Ce),Ee===null?ve=je:Ee.sibling=je,Ee=je,ke=st}if(Ce===X.length)return l(W,ke),Be&&Ar(W,Ce),ve;if(ke===null){for(;CeCe?(st=ke,ke=null):st=ke.sibling;var gr=se(W,ke,je.value,fe);if(gr===null){ke===null&&(ke=st);break}n&&ke&&gr.alternate===null&&o(W,ke),B=x(gr,B,Ce),Ee===null?ve=gr:Ee.sibling=gr,Ee=gr,ke=st}if(je.done)return l(W,ke),Be&&Ar(W,Ce),ve;if(ke===null){for(;!je.done;Ce++,je=X.next())je=ue(W,je.value,fe),je!==null&&(B=x(je,B,Ce),Ee===null?ve=je:Ee.sibling=je,Ee=je);return Be&&Ar(W,Ce),ve}for(ke=c(W,ke);!je.done;Ce++,je=X.next())je=pe(ke,W,Ce,je.value,fe),je!==null&&(n&&je.alternate!==null&&ke.delete(je.key===null?Ce:je.key),B=x(je,B,Ce),Ee===null?ve=je:Ee.sibling=je,Ee=je);return n&&ke.forEach(function(GS){return o(W,GS)}),Be&&Ar(W,Ce),ve}function Qe(W,B,X,fe){if(typeof X=="object"&&X!==null&&X.type===j&&X.key===null&&(X=X.props.children),typeof X=="object"&&X!==null){switch(X.$$typeof){case M:e:{for(var ve=X.key,Ee=B;Ee!==null;){if(Ee.key===ve){if(ve=X.type,ve===j){if(Ee.tag===7){l(W,Ee.sibling),B=p(Ee,X.props.children),B.return=W,W=B;break e}}else if(Ee.elementType===ve||typeof ve=="object"&&ve!==null&&ve.$$typeof===F&&Yp(ve)===Ee.type){l(W,Ee.sibling),B=p(Ee,X.props),B.ref=Hi(W,Ee,X),B.return=W,W=B;break e}l(W,Ee);break}else o(W,Ee);Ee=Ee.sibling}X.type===j?(B=Hr(X.props.children,W.mode,fe,X.key),B.return=W,W=B):(fe=ea(X.type,X.key,X.props,null,W.mode,fe),fe.ref=Hi(W,B,X),fe.return=W,W=fe)}return _(W);case L:e:{for(Ee=X.key;B!==null;){if(B.key===Ee)if(B.tag===4&&B.stateNode.containerInfo===X.containerInfo&&B.stateNode.implementation===X.implementation){l(W,B.sibling),B=p(B,X.children||[]),B.return=W,W=B;break e}else{l(W,B);break}else o(W,B);B=B.sibling}B=Ff(X,W.mode,fe),B.return=W,W=B}return _(W);case F:return Ee=X._init,Qe(W,B,Ee(X._payload),fe)}if(Gt(X))return ye(W,B,X,fe);if(O(X))return xe(W,B,X,fe);Tl(W,X)}return typeof X=="string"&&X!==""||typeof X=="number"?(X=""+X,B!==null&&B.tag===6?(l(W,B.sibling),B=p(B,X),B.return=W,W=B):(l(W,B),B=zf(X,W.mode,fe),B.return=W,W=B),_(W)):l(W,B)}return Qe}var jo=Xp(!0),Gp=Xp(!1),Il=or(null),jl=null,$o=null,Xc=null;function Gc(){Xc=$o=jl=null}function Kc(n){var o=Il.current;ze(Il),n._currentValue=o}function Qc(n,o,l){for(;n!==null;){var c=n.alternate;if((n.childLanes&o)!==o?(n.childLanes|=o,c!==null&&(c.childLanes|=o)):c!==null&&(c.childLanes&o)!==o&&(c.childLanes|=o),n===l)break;n=n.return}}function Ao(n,o){jl=n,Xc=$o=null,n=n.dependencies,n!==null&&n.firstContext!==null&&((n.lanes&o)!==0&&(kt=!0),n.firstContext=null)}function Vt(n){var o=n._currentValue;if(Xc!==n)if(n={context:n,memoizedValue:o,next:null},$o===null){if(jl===null)throw Error(r(308));$o=n,jl.dependencies={lanes:0,firstContext:n}}else $o=$o.next=n;return o}var Mr=null;function Jc(n){Mr===null?Mr=[n]:Mr.push(n)}function Kp(n,o,l,c){var p=o.interleaved;return p===null?(l.next=l,Jc(o)):(l.next=p.next,p.next=l),o.interleaved=l,Pn(n,c)}function Pn(n,o){n.lanes|=o;var l=n.alternate;for(l!==null&&(l.lanes|=o),l=n,n=n.return;n!==null;)n.childLanes|=o,l=n.alternate,l!==null&&(l.childLanes|=o),l=n,n=n.return;return l.tag===3?l.stateNode:null}var lr=!1;function Zc(n){n.updateQueue={baseState:n.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,interleaved:null,lanes:0},effects:null}}function Qp(n,o){n=n.updateQueue,o.updateQueue===n&&(o.updateQueue={baseState:n.baseState,firstBaseUpdate:n.firstBaseUpdate,lastBaseUpdate:n.lastBaseUpdate,shared:n.shared,effects:n.effects})}function Rn(n,o){return{eventTime:n,lane:o,tag:0,payload:null,callback:null,next:null}}function ar(n,o,l){var c=n.updateQueue;if(c===null)return null;if(c=c.shared,(Te&2)!==0){var p=c.pending;return p===null?o.next=o:(o.next=p.next,p.next=o),c.pending=o,Pn(n,l)}return p=c.interleaved,p===null?(o.next=o,Jc(c)):(o.next=p.next,p.next=o),c.interleaved=o,Pn(n,l)}function $l(n,o,l){if(o=o.updateQueue,o!==null&&(o=o.shared,(l&4194240)!==0)){var c=o.lanes;c&=n.pendingLanes,l|=c,o.lanes=l,hc(n,l)}}function Jp(n,o){var l=n.updateQueue,c=n.alternate;if(c!==null&&(c=c.updateQueue,l===c)){var p=null,x=null;if(l=l.firstBaseUpdate,l!==null){do{var _={eventTime:l.eventTime,lane:l.lane,tag:l.tag,payload:l.payload,callback:l.callback,next:null};x===null?p=x=_:x=x.next=_,l=l.next}while(l!==null);x===null?p=x=o:x=x.next=o}else p=x=o;l={baseState:c.baseState,firstBaseUpdate:p,lastBaseUpdate:x,shared:c.shared,effects:c.effects},n.updateQueue=l;return}n=l.lastBaseUpdate,n===null?l.firstBaseUpdate=o:n.next=o,l.lastBaseUpdate=o}function Al(n,o,l,c){var p=n.updateQueue;lr=!1;var x=p.firstBaseUpdate,_=p.lastBaseUpdate,$=p.shared.pending;if($!==null){p.shared.pending=null;var D=$,K=D.next;D.next=null,_===null?x=K:_.next=K,_=D;var ae=n.alternate;ae!==null&&(ae=ae.updateQueue,$=ae.lastBaseUpdate,$!==_&&($===null?ae.firstBaseUpdate=K:$.next=K,ae.lastBaseUpdate=D))}if(x!==null){var ue=p.baseState;_=0,ae=K=D=null,$=x;do{var se=$.lane,pe=$.eventTime;if((c&se)===se){ae!==null&&(ae=ae.next={eventTime:pe,lane:0,tag:$.tag,payload:$.payload,callback:$.callback,next:null});e:{var ye=n,xe=$;switch(se=o,pe=l,xe.tag){case 1:if(ye=xe.payload,typeof ye=="function"){ue=ye.call(pe,ue,se);break e}ue=ye;break e;case 3:ye.flags=ye.flags&-65537|128;case 0:if(ye=xe.payload,se=typeof ye=="function"?ye.call(pe,ue,se):ye,se==null)break e;ue=z({},ue,se);break e;case 2:lr=!0}}$.callback!==null&&$.lane!==0&&(n.flags|=64,se=p.effects,se===null?p.effects=[$]:se.push($))}else pe={eventTime:pe,lane:se,tag:$.tag,payload:$.payload,callback:$.callback,next:null},ae===null?(K=ae=pe,D=ue):ae=ae.next=pe,_|=se;if($=$.next,$===null){if($=p.shared.pending,$===null)break;se=$,$=se.next,se.next=null,p.lastBaseUpdate=se,p.shared.pending=null}}while(!0);if(ae===null&&(D=ue),p.baseState=D,p.firstBaseUpdate=K,p.lastBaseUpdate=ae,o=p.shared.interleaved,o!==null){p=o;do _|=p.lane,p=p.next;while(p!==o)}else x===null&&(p.shared.lanes=0);Or|=_,n.lanes=_,n.memoizedState=ue}}function Zp(n,o,l){if(n=o.effects,o.effects=null,n!==null)for(o=0;ol?l:4,n(!0);var c=of.transition;of.transition={};try{n(!1),o()}finally{Me=l,of.transition=c}}function xg(){return Ut().memoizedState}function vS(n,o,l){var c=dr(n);if(l={lane:c,action:l,hasEagerState:!1,eagerState:null,next:null},vg(n))wg(o,l);else if(l=Kp(n,o,l,c),l!==null){var p=vt();tn(l,n,c,p),Sg(l,o,c)}}function wS(n,o,l){var c=dr(n),p={lane:c,action:l,hasEagerState:!1,eagerState:null,next:null};if(vg(n))wg(o,p);else{var x=n.alternate;if(n.lanes===0&&(x===null||x.lanes===0)&&(x=o.lastRenderedReducer,x!==null))try{var _=o.lastRenderedState,$=x(_,l);if(p.hasEagerState=!0,p.eagerState=$,Kt($,_)){var D=o.interleaved;D===null?(p.next=p,Jc(o)):(p.next=D.next,D.next=p),o.interleaved=p;return}}catch{}finally{}l=Kp(n,o,p,c),l!==null&&(p=vt(),tn(l,n,c,p),Sg(l,o,c))}}function vg(n){var o=n.alternate;return n===We||o!==null&&o===We}function wg(n,o){qi=Dl=!0;var l=n.pending;l===null?o.next=o:(o.next=l.next,l.next=o),n.pending=o}function Sg(n,o,l){if((l&4194240)!==0){var c=o.lanes;c&=n.pendingLanes,l|=c,o.lanes=l,hc(n,l)}}var Fl={readContext:Vt,useCallback:ht,useContext:ht,useEffect:ht,useImperativeHandle:ht,useInsertionEffect:ht,useLayoutEffect:ht,useMemo:ht,useReducer:ht,useRef:ht,useState:ht,useDebugValue:ht,useDeferredValue:ht,useTransition:ht,useMutableSource:ht,useSyncExternalStore:ht,useId:ht,unstable_isNewReconciler:!1},SS={readContext:Vt,useCallback:function(n,o){return gn().memoizedState=[n,o===void 0?null:o],n},useContext:Vt,useEffect:cg,useImperativeHandle:function(n,o,l){return l=l!=null?l.concat([n]):null,Ol(4194308,4,hg.bind(null,o,n),l)},useLayoutEffect:function(n,o){return Ol(4194308,4,n,o)},useInsertionEffect:function(n,o){return Ol(4,2,n,o)},useMemo:function(n,o){var l=gn();return o=o===void 0?null:o,n=n(),l.memoizedState=[n,o],n},useReducer:function(n,o,l){var c=gn();return o=l!==void 0?l(o):o,c.memoizedState=c.baseState=o,n={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:n,lastRenderedState:o},c.queue=n,n=n.dispatch=vS.bind(null,We,n),[c.memoizedState,n]},useRef:function(n){var o=gn();return n={current:n},o.memoizedState=n},useState:ag,useDebugValue:df,useDeferredValue:function(n){return gn().memoizedState=n},useTransition:function(){var n=ag(!1),o=n[0];return n=xS.bind(null,n[1]),gn().memoizedState=n,[o,n]},useMutableSource:function(){},useSyncExternalStore:function(n,o,l){var c=We,p=gn();if(Be){if(l===void 0)throw Error(r(407));l=l()}else{if(l=o(),it===null)throw Error(r(349));(Dr&30)!==0||rg(c,o,l)}p.memoizedState=l;var x={value:l,getSnapshot:o};return p.queue=x,cg(ig.bind(null,c,x,n),[n]),c.flags|=2048,Gi(9,og.bind(null,c,x,l,o),void 0,null),l},useId:function(){var n=gn(),o=it.identifierPrefix;if(Be){var l=bn,c=Nn;l=(c&~(1<<32-Tt(c)-1)).toString(32)+l,o=":"+o+"R"+l,l=Yi++,0<\/script>",n=n.removeChild(n.firstChild)):typeof c.is=="string"?n=_.createElement(l,{is:c.is}):(n=_.createElement(l),l==="select"&&(_=n,c.multiple?_.multiple=!0:c.size&&(_.size=c.size))):n=_.createElementNS(n,l),n[hn]=o,n[Fi]=c,Bg(n,o,!1,!1),o.stateNode=n;e:{switch(_=pi(l,c),l){case"dialog":Oe("cancel",n),Oe("close",n),p=c;break;case"iframe":case"object":case"embed":Oe("load",n),p=c;break;case"video":case"audio":for(p=0;pzo&&(o.flags|=128,c=!0,Ki(x,!1),o.lanes=4194304)}else{if(!c)if(n=Ml(_),n!==null){if(o.flags|=128,c=!0,l=n.updateQueue,l!==null&&(o.updateQueue=l,o.flags|=4),Ki(x,!0),x.tail===null&&x.tailMode==="hidden"&&!_.alternate&&!Be)return pt(o),null}else 2*Ve()-x.renderingStartTime>zo&&l!==1073741824&&(o.flags|=128,c=!0,Ki(x,!1),o.lanes=4194304);x.isBackwards?(_.sibling=o.child,o.child=_):(l=x.last,l!==null?l.sibling=_:o.child=_,x.last=_)}return x.tail!==null?(o=x.tail,x.rendering=o,x.tail=o.sibling,x.renderingStartTime=Ve(),o.sibling=null,l=Ue.current,De(Ue,c?l&1|2:l&1),o):(pt(o),null);case 22:case 23:return Lf(),c=o.memoizedState!==null,n!==null&&n.memoizedState!==null!==c&&(o.flags|=8192),c&&(o.mode&1)!==0?(At&1073741824)!==0&&(pt(o),o.subtreeFlags&6&&(o.flags|=8192)):pt(o),null;case 24:return null;case 25:return null}throw Error(r(156,o.tag))}function RS(n,o){switch(Uc(o),o.tag){case 1:return Et(o.type)&&Cl(),n=o.flags,n&65536?(o.flags=n&-65537|128,o):null;case 3:return Mo(),ze(St),ze(dt),rf(),n=o.flags,(n&65536)!==0&&(n&128)===0?(o.flags=n&-65537|128,o):null;case 5:return tf(o),null;case 13:if(ze(Ue),n=o.memoizedState,n!==null&&n.dehydrated!==null){if(o.alternate===null)throw Error(r(340));Io()}return n=o.flags,n&65536?(o.flags=n&-65537|128,o):null;case 19:return ze(Ue),null;case 4:return Mo(),null;case 10:return Kc(o.type._context),null;case 22:case 23:return Lf(),null;case 24:return null;default:return null}}var Ul=!1,gt=!1,TS=typeof WeakSet=="function"?WeakSet:Set,me=null;function Do(n,o){var l=n.ref;if(l!==null)if(typeof l=="function")try{l(null)}catch(c){Ye(n,o,c)}else l.current=null}function Cf(n,o,l){try{l()}catch(c){Ye(n,o,c)}}var Ug=!1;function IS(n,o){if(Mc=cl,n=Ep(),bc(n)){if("selectionStart"in n)var l={start:n.selectionStart,end:n.selectionEnd};else e:{l=(l=n.ownerDocument)&&l.defaultView||window;var c=l.getSelection&&l.getSelection();if(c&&c.rangeCount!==0){l=c.anchorNode;var p=c.anchorOffset,x=c.focusNode;c=c.focusOffset;try{l.nodeType,x.nodeType}catch{l=null;break e}var _=0,$=-1,D=-1,K=0,ae=0,ue=n,se=null;t:for(;;){for(var pe;ue!==l||p!==0&&ue.nodeType!==3||($=_+p),ue!==x||c!==0&&ue.nodeType!==3||(D=_+c),ue.nodeType===3&&(_+=ue.nodeValue.length),(pe=ue.firstChild)!==null;)se=ue,ue=pe;for(;;){if(ue===n)break t;if(se===l&&++K===p&&($=_),se===x&&++ae===c&&(D=_),(pe=ue.nextSibling)!==null)break;ue=se,se=ue.parentNode}ue=pe}l=$===-1||D===-1?null:{start:$,end:D}}else l=null}l=l||{start:0,end:0}}else l=null;for(Lc={focusedElem:n,selectionRange:l},cl=!1,me=o;me!==null;)if(o=me,n=o.child,(o.subtreeFlags&1028)!==0&&n!==null)n.return=o,me=n;else for(;me!==null;){o=me;try{var ye=o.alternate;if((o.flags&1024)!==0)switch(o.tag){case 0:case 11:case 15:break;case 1:if(ye!==null){var xe=ye.memoizedProps,Qe=ye.memoizedState,W=o.stateNode,B=W.getSnapshotBeforeUpdate(o.elementType===o.type?xe:Jt(o.type,xe),Qe);W.__reactInternalSnapshotBeforeUpdate=B}break;case 3:var X=o.stateNode.containerInfo;X.nodeType===1?X.textContent="":X.nodeType===9&&X.documentElement&&X.removeChild(X.documentElement);break;case 5:case 6:case 4:case 17:break;default:throw Error(r(163))}}catch(fe){Ye(o,o.return,fe)}if(n=o.sibling,n!==null){n.return=o.return,me=n;break}me=o.return}return ye=Ug,Ug=!1,ye}function Qi(n,o,l){var c=o.updateQueue;if(c=c!==null?c.lastEffect:null,c!==null){var p=c=c.next;do{if((p.tag&n)===n){var x=p.destroy;p.destroy=void 0,x!==void 0&&Cf(o,l,x)}p=p.next}while(p!==c)}}function Wl(n,o){if(o=o.updateQueue,o=o!==null?o.lastEffect:null,o!==null){var l=o=o.next;do{if((l.tag&n)===n){var c=l.create;l.destroy=c()}l=l.next}while(l!==o)}}function _f(n){var o=n.ref;if(o!==null){var l=n.stateNode;switch(n.tag){case 5:n=l;break;default:n=l}typeof o=="function"?o(n):o.current=n}}function Wg(n){var o=n.alternate;o!==null&&(n.alternate=null,Wg(o)),n.child=null,n.deletions=null,n.sibling=null,n.tag===5&&(o=n.stateNode,o!==null&&(delete o[hn],delete o[Fi],delete o[Fc],delete o[hS],delete o[pS])),n.stateNode=null,n.return=null,n.dependencies=null,n.memoizedProps=null,n.memoizedState=null,n.pendingProps=null,n.stateNode=null,n.updateQueue=null}function qg(n){return n.tag===5||n.tag===3||n.tag===4}function Yg(n){e:for(;;){for(;n.sibling===null;){if(n.return===null||qg(n.return))return null;n=n.return}for(n.sibling.return=n.return,n=n.sibling;n.tag!==5&&n.tag!==6&&n.tag!==18;){if(n.flags&2||n.child===null||n.tag===4)continue e;n.child.return=n,n=n.child}if(!(n.flags&2))return n.stateNode}}function Nf(n,o,l){var c=n.tag;if(c===5||c===6)n=n.stateNode,o?l.nodeType===8?l.parentNode.insertBefore(n,o):l.insertBefore(n,o):(l.nodeType===8?(o=l.parentNode,o.insertBefore(n,l)):(o=l,o.appendChild(n)),l=l._reactRootContainer,l!=null||o.onclick!==null||(o.onclick=El));else if(c!==4&&(n=n.child,n!==null))for(Nf(n,o,l),n=n.sibling;n!==null;)Nf(n,o,l),n=n.sibling}function bf(n,o,l){var c=n.tag;if(c===5||c===6)n=n.stateNode,o?l.insertBefore(n,o):l.appendChild(n);else if(c!==4&&(n=n.child,n!==null))for(bf(n,o,l),n=n.sibling;n!==null;)bf(n,o,l),n=n.sibling}var ct=null,Zt=!1;function ur(n,o,l){for(l=l.child;l!==null;)Xg(n,o,l),l=l.sibling}function Xg(n,o,l){if(Ft&&typeof Ft.onCommitFiberUnmount=="function")try{Ft.onCommitFiberUnmount(go,l)}catch{}switch(l.tag){case 5:gt||Do(l,o);case 6:var c=ct,p=Zt;ct=null,ur(n,o,l),ct=c,Zt=p,ct!==null&&(Zt?(n=ct,l=l.stateNode,n.nodeType===8?n.parentNode.removeChild(l):n.removeChild(l)):ct.removeChild(l.stateNode));break;case 18:ct!==null&&(Zt?(n=ct,l=l.stateNode,n.nodeType===8?zc(n.parentNode,l):n.nodeType===1&&zc(n,l),Ri(n)):zc(ct,l.stateNode));break;case 4:c=ct,p=Zt,ct=l.stateNode.containerInfo,Zt=!0,ur(n,o,l),ct=c,Zt=p;break;case 0:case 11:case 14:case 15:if(!gt&&(c=l.updateQueue,c!==null&&(c=c.lastEffect,c!==null))){p=c=c.next;do{var x=p,_=x.destroy;x=x.tag,_!==void 0&&((x&2)!==0||(x&4)!==0)&&Cf(l,o,_),p=p.next}while(p!==c)}ur(n,o,l);break;case 1:if(!gt&&(Do(l,o),c=l.stateNode,typeof c.componentWillUnmount=="function"))try{c.props=l.memoizedProps,c.state=l.memoizedState,c.componentWillUnmount()}catch($){Ye(l,o,$)}ur(n,o,l);break;case 21:ur(n,o,l);break;case 22:l.mode&1?(gt=(c=gt)||l.memoizedState!==null,ur(n,o,l),gt=c):ur(n,o,l);break;default:ur(n,o,l)}}function Gg(n){var o=n.updateQueue;if(o!==null){n.updateQueue=null;var l=n.stateNode;l===null&&(l=n.stateNode=new TS),o.forEach(function(c){var p=FS.bind(null,n,c);l.has(c)||(l.add(c),c.then(p,p))})}}function en(n,o){var l=o.deletions;if(l!==null)for(var c=0;cp&&(p=_),c&=~x}if(c=p,c=Ve()-c,c=(120>c?120:480>c?480:1080>c?1080:1920>c?1920:3e3>c?3e3:4320>c?4320:1960*$S(c/1960))-c,10n?16:n,fr===null)var c=!1;else{if(n=fr,fr=null,Kl=0,(Te&6)!==0)throw Error(r(331));var p=Te;for(Te|=4,me=n.current;me!==null;){var x=me,_=x.child;if((me.flags&16)!==0){var $=x.deletions;if($!==null){for(var D=0;D<$.length;D++){var K=$[D];for(me=K;me!==null;){var ae=me;switch(ae.tag){case 0:case 11:case 15:Qi(8,ae,x)}var ue=ae.child;if(ue!==null)ue.return=ae,me=ue;else for(;me!==null;){ae=me;var se=ae.sibling,pe=ae.return;if(Wg(ae),ae===K){me=null;break}if(se!==null){se.return=pe,me=se;break}me=pe}}}var ye=x.alternate;if(ye!==null){var xe=ye.child;if(xe!==null){ye.child=null;do{var Qe=xe.sibling;xe.sibling=null,xe=Qe}while(xe!==null)}}me=x}}if((x.subtreeFlags&2064)!==0&&_!==null)_.return=x,me=_;else e:for(;me!==null;){if(x=me,(x.flags&2048)!==0)switch(x.tag){case 0:case 11:case 15:Qi(9,x,x.return)}var W=x.sibling;if(W!==null){W.return=x.return,me=W;break e}me=x.return}}var B=n.current;for(me=B;me!==null;){_=me;var X=_.child;if((_.subtreeFlags&2064)!==0&&X!==null)X.return=_,me=X;else e:for(_=B;me!==null;){if($=me,($.flags&2048)!==0)try{switch($.tag){case 0:case 11:case 15:Wl(9,$)}}catch(ve){Ye($,$.return,ve)}if($===_){me=null;break e}var fe=$.sibling;if(fe!==null){fe.return=$.return,me=fe;break e}me=$.return}}if(Te=p,sr(),Ft&&typeof Ft.onPostCommitFiberRoot=="function")try{Ft.onPostCommitFiberRoot(go,n)}catch{}c=!0}return c}finally{Me=l,Wt.transition=o}}return!1}function lm(n,o,l){o=Lo(l,o),o=_g(n,o,1),n=ar(n,o,1),o=vt(),n!==null&&(Ci(n,1,o),_t(n,o))}function Ye(n,o,l){if(n.tag===3)lm(n,n,l);else for(;o!==null;){if(o.tag===3){lm(o,n,l);break}else if(o.tag===1){var c=o.stateNode;if(typeof o.type.getDerivedStateFromError=="function"||typeof c.componentDidCatch=="function"&&(cr===null||!cr.has(c))){n=Lo(l,n),n=Ng(o,n,1),o=ar(o,n,1),n=vt(),o!==null&&(Ci(o,1,n),_t(o,n));break}}o=o.return}}function OS(n,o,l){var c=n.pingCache;c!==null&&c.delete(o),o=vt(),n.pingedLanes|=n.suspendedLanes&l,it===n&&(ft&l)===l&&(nt===4||nt===3&&(ft&130023424)===ft&&500>Ve()-Tf?Fr(n,0):Rf|=l),_t(n,o)}function am(n,o){o===0&&((n.mode&1)===0?o=1:(o=yo,yo<<=1,(yo&130023424)===0&&(yo=4194304)));var l=vt();n=Pn(n,o),n!==null&&(Ci(n,o,l),_t(n,l))}function zS(n){var o=n.memoizedState,l=0;o!==null&&(l=o.retryLane),am(n,l)}function FS(n,o){var l=0;switch(n.tag){case 13:var c=n.stateNode,p=n.memoizedState;p!==null&&(l=p.retryLane);break;case 19:c=n.stateNode;break;default:throw Error(r(314))}c!==null&&c.delete(o),am(n,l)}var um;um=function(n,o,l){if(n!==null)if(n.memoizedProps!==o.pendingProps||St.current)kt=!0;else{if((n.lanes&l)===0&&(o.flags&128)===0)return kt=!1,bS(n,o,l);kt=(n.flags&131072)!==0}else kt=!1,Be&&(o.flags&1048576)!==0&&Hp(o,Pl,o.index);switch(o.lanes=0,o.tag){case 2:var c=o.type;Vl(n,o),n=o.pendingProps;var p=Po(o,dt.current);Ao(o,l),p=lf(null,o,c,n,p,l);var x=af();return o.flags|=1,typeof p=="object"&&p!==null&&typeof p.render=="function"&&p.$$typeof===void 0?(o.tag=1,o.memoizedState=null,o.updateQueue=null,Et(c)?(x=!0,_l(o)):x=!1,o.memoizedState=p.state!==null&&p.state!==void 0?p.state:null,Zc(o),p.updater=Bl,o.stateNode=p,p._reactInternals=o,pf(o,c,n,l),o=xf(null,o,c,!0,x,l)):(o.tag=0,Be&&x&&Vc(o),xt(null,o,p,l),o=o.child),o;case 16:c=o.elementType;e:{switch(Vl(n,o),n=o.pendingProps,p=c._init,c=p(c._payload),o.type=c,p=o.tag=HS(c),n=Jt(c,n),p){case 0:o=yf(null,o,c,n,l);break e;case 1:o=Mg(null,o,c,n,l);break e;case 11:o=Tg(null,o,c,n,l);break e;case 14:o=Ig(null,o,c,Jt(c.type,n),l);break e}throw Error(r(306,c,""))}return o;case 0:return c=o.type,p=o.pendingProps,p=o.elementType===c?p:Jt(c,p),yf(n,o,c,p,l);case 1:return c=o.type,p=o.pendingProps,p=o.elementType===c?p:Jt(c,p),Mg(n,o,c,p,l);case 3:e:{if(Lg(o),n===null)throw Error(r(387));c=o.pendingProps,x=o.memoizedState,p=x.element,Qp(n,o),Al(o,c,null,l);var _=o.memoizedState;if(c=_.element,x.isDehydrated)if(x={element:c,isDehydrated:!1,cache:_.cache,pendingSuspenseBoundaries:_.pendingSuspenseBoundaries,transitions:_.transitions},o.updateQueue.baseState=x,o.memoizedState=x,o.flags&256){p=Lo(Error(r(423)),o),o=Dg(n,o,c,l,p);break e}else if(c!==p){p=Lo(Error(r(424)),o),o=Dg(n,o,c,l,p);break e}else for($t=rr(o.stateNode.containerInfo.firstChild),jt=o,Be=!0,Qt=null,l=Gp(o,null,c,l),o.child=l;l;)l.flags=l.flags&-3|4096,l=l.sibling;else{if(Io(),c===p){o=Tn(n,o,l);break e}xt(n,o,c,l)}o=o.child}return o;case 5:return eg(o),n===null&&qc(o),c=o.type,p=o.pendingProps,x=n!==null?n.memoizedProps:null,_=p.children,Dc(c,p)?_=null:x!==null&&Dc(c,x)&&(o.flags|=32),Ag(n,o),xt(n,o,_,l),o.child;case 6:return n===null&&qc(o),null;case 13:return Og(n,o,l);case 4:return ef(o,o.stateNode.containerInfo),c=o.pendingProps,n===null?o.child=jo(o,null,c,l):xt(n,o,c,l),o.child;case 11:return c=o.type,p=o.pendingProps,p=o.elementType===c?p:Jt(c,p),Tg(n,o,c,p,l);case 7:return xt(n,o,o.pendingProps,l),o.child;case 8:return xt(n,o,o.pendingProps.children,l),o.child;case 12:return xt(n,o,o.pendingProps.children,l),o.child;case 10:e:{if(c=o.type._context,p=o.pendingProps,x=o.memoizedProps,_=p.value,De(Il,c._currentValue),c._currentValue=_,x!==null)if(Kt(x.value,_)){if(x.children===p.children&&!St.current){o=Tn(n,o,l);break e}}else for(x=o.child,x!==null&&(x.return=o);x!==null;){var $=x.dependencies;if($!==null){_=x.child;for(var D=$.firstContext;D!==null;){if(D.context===c){if(x.tag===1){D=Rn(-1,l&-l),D.tag=2;var K=x.updateQueue;if(K!==null){K=K.shared;var ae=K.pending;ae===null?D.next=D:(D.next=ae.next,ae.next=D),K.pending=D}}x.lanes|=l,D=x.alternate,D!==null&&(D.lanes|=l),Qc(x.return,l,o),$.lanes|=l;break}D=D.next}}else if(x.tag===10)_=x.type===o.type?null:x.child;else if(x.tag===18){if(_=x.return,_===null)throw Error(r(341));_.lanes|=l,$=_.alternate,$!==null&&($.lanes|=l),Qc(_,l,o),_=x.sibling}else _=x.child;if(_!==null)_.return=x;else for(_=x;_!==null;){if(_===o){_=null;break}if(x=_.sibling,x!==null){x.return=_.return,_=x;break}_=_.return}x=_}xt(n,o,p.children,l),o=o.child}return o;case 9:return p=o.type,c=o.pendingProps.children,Ao(o,l),p=Vt(p),c=c(p),o.flags|=1,xt(n,o,c,l),o.child;case 14:return c=o.type,p=Jt(c,o.pendingProps),p=Jt(c.type,p),Ig(n,o,c,p,l);case 15:return jg(n,o,o.type,o.pendingProps,l);case 17:return c=o.type,p=o.pendingProps,p=o.elementType===c?p:Jt(c,p),Vl(n,o),o.tag=1,Et(c)?(n=!0,_l(o)):n=!1,Ao(o,l),kg(o,c,p),pf(o,c,p,l),xf(null,o,c,!0,n,l);case 19:return Fg(n,o,l);case 22:return $g(n,o,l)}throw Error(r(156,o.tag))};function cm(n,o){return ol(n,o)}function BS(n,o,l,c){this.tag=n,this.key=l,this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null,this.index=0,this.ref=null,this.pendingProps=o,this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null,this.mode=c,this.subtreeFlags=this.flags=0,this.deletions=null,this.childLanes=this.lanes=0,this.alternate=null}function qt(n,o,l,c){return new BS(n,o,l,c)}function Of(n){return n=n.prototype,!(!n||!n.isReactComponent)}function HS(n){if(typeof n=="function")return Of(n)?1:0;if(n!=null){if(n=n.$$typeof,n===ne)return 11;if(n===U)return 14}return 2}function pr(n,o){var l=n.alternate;return l===null?(l=qt(n.tag,o,n.key,n.mode),l.elementType=n.elementType,l.type=n.type,l.stateNode=n.stateNode,l.alternate=n,n.alternate=l):(l.pendingProps=o,l.type=n.type,l.flags=0,l.subtreeFlags=0,l.deletions=null),l.flags=n.flags&14680064,l.childLanes=n.childLanes,l.lanes=n.lanes,l.child=n.child,l.memoizedProps=n.memoizedProps,l.memoizedState=n.memoizedState,l.updateQueue=n.updateQueue,o=n.dependencies,l.dependencies=o===null?null:{lanes:o.lanes,firstContext:o.firstContext},l.sibling=n.sibling,l.index=n.index,l.ref=n.ref,l}function ea(n,o,l,c,p,x){var _=2;if(c=n,typeof n=="function")Of(n)&&(_=1);else if(typeof n=="string")_=5;else e:switch(n){case j:return Hr(l.children,p,x,o);case G:_=8,p|=8;break;case V:return n=qt(12,l,o,p|2),n.elementType=V,n.lanes=x,n;case J:return n=qt(13,l,o,p),n.elementType=J,n.lanes=x,n;case I:return n=qt(19,l,o,p),n.elementType=I,n.lanes=x,n;case q:return ta(l,p,x,o);default:if(typeof n=="object"&&n!==null)switch(n.$$typeof){case Y:_=10;break e;case ee:_=9;break e;case ne:_=11;break e;case U:_=14;break e;case F:_=16,c=null;break e}throw Error(r(130,n==null?n:typeof n,""))}return o=qt(_,l,o,p),o.elementType=n,o.type=c,o.lanes=x,o}function Hr(n,o,l,c){return n=qt(7,n,c,o),n.lanes=l,n}function ta(n,o,l,c){return n=qt(22,n,c,o),n.elementType=q,n.lanes=l,n.stateNode={isHidden:!1},n}function zf(n,o,l){return n=qt(6,n,null,o),n.lanes=l,n}function Ff(n,o,l){return o=qt(4,n.children!==null?n.children:[],n.key,o),o.lanes=l,o.stateNode={containerInfo:n.containerInfo,pendingChildren:null,implementation:n.implementation},o}function VS(n,o,l,c,p){this.tag=o,this.containerInfo=n,this.finishedWork=this.pingCache=this.current=this.pendingChildren=null,this.timeoutHandle=-1,this.callbackNode=this.pendingContext=this.context=null,this.callbackPriority=0,this.eventTimes=dc(0),this.expirationTimes=dc(-1),this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0,this.entanglements=dc(0),this.identifierPrefix=c,this.onRecoverableError=p,this.mutableSourceEagerHydrationData=null}function Bf(n,o,l,c,p,x,_,$,D){return n=new VS(n,o,l,$,D),o===1?(o=1,x===!0&&(o|=8)):o=0,x=qt(3,null,null,o),n.current=x,x.stateNode=n,x.memoizedState={element:c,isDehydrated:l,cache:null,transitions:null,pendingSuspenseBoundaries:null},Zc(x),n}function US(n,o,l){var c=3"u"||typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE!="function"))try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(e)}catch(t){console.error(t)}}return e(),Yf.exports=tE(),Yf.exports}var Cm;function nE(){if(Cm)return aa;Cm=1;var e=Uy();return aa.createRoot=e.createRoot,aa.hydrateRoot=e.hydrateRoot,aa}var rE=nE(),P=As();const yt=rt(P);var rs={},_m;function oE(){if(_m)return rs;_m=1,Object.defineProperty(rs,"__esModule",{value:!0}),rs.parse=u,rs.serialize=h;const e=/^[\u0021-\u003A\u003C\u003E-\u007E]+$/,t=/^[\u0021-\u003A\u003C-\u007E]*$/,r=/^([.]?[a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?)([.][a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?)*$/i,i=/^[\u0020-\u003A\u003D-\u007E]*$/,s=Object.prototype.toString,a=(()=>{const y=function(){};return y.prototype=Object.create(null),y})();function u(y,v){const S=new a,E=y.length;if(E<2)return S;const k=(v==null?void 0:v.decode)||g;let C=0;do{const R=y.indexOf("=",C);if(R===-1)break;const N=y.indexOf(";",C),b=N===-1?E:N;if(R>b){C=y.lastIndexOf(";",R-1)+1;continue}const M=f(y,C,R),L=d(y,R,M),j=y.slice(M,L);if(S[j]===void 0){let G=f(y,R+1,b),V=d(y,b,G);const Y=k(y.slice(G,V));S[j]=Y}C=b+1}while(CS;){const E=y.charCodeAt(--v);if(E!==32&&E!==9)return v+1}return S}function h(y,v,S){const E=(S==null?void 0:S.encode)||encodeURIComponent;if(!e.test(y))throw new TypeError(`argument name is invalid: ${y}`);const k=E(v);if(!t.test(k))throw new TypeError(`argument val is invalid: ${v}`);let C=y+"="+k;if(!S)return C;if(S.maxAge!==void 0){if(!Number.isInteger(S.maxAge))throw new TypeError(`option maxAge is invalid: ${S.maxAge}`);C+="; Max-Age="+S.maxAge}if(S.domain){if(!r.test(S.domain))throw new TypeError(`option domain is invalid: ${S.domain}`);C+="; Domain="+S.domain}if(S.path){if(!i.test(S.path))throw new TypeError(`option path is invalid: ${S.path}`);C+="; Path="+S.path}if(S.expires){if(!m(S.expires)||!Number.isFinite(S.expires.valueOf()))throw new TypeError(`option expires is invalid: ${S.expires}`);C+="; Expires="+S.expires.toUTCString()}if(S.httpOnly&&(C+="; HttpOnly"),S.secure&&(C+="; Secure"),S.partitioned&&(C+="; Partitioned"),S.priority)switch(typeof S.priority=="string"?S.priority.toLowerCase():void 0){case"low":C+="; Priority=Low";break;case"medium":C+="; Priority=Medium";break;case"high":C+="; Priority=High";break;default:throw new TypeError(`option priority is invalid: ${S.priority}`)}if(S.sameSite)switch(typeof S.sameSite=="string"?S.sameSite.toLowerCase():S.sameSite){case!0:case"strict":C+="; SameSite=Strict";break;case"lax":C+="; SameSite=Lax";break;case"none":C+="; SameSite=None";break;default:throw new TypeError(`option sameSite is invalid: ${S.sameSite}`)}return C}function g(y){if(y.indexOf("%")===-1)return y;try{return decodeURIComponent(y)}catch{return y}}function m(y){return s.call(y)==="[object Date]"}return rs}oE();var Nm="popstate";function iE(e={}){function t(s,a){let{pathname:u="/",search:f="",hash:d=""}=ro(s.location.hash.substring(1));return!u.startsWith("/")&&!u.startsWith(".")&&(u="/"+u),Ed("",{pathname:u,search:f,hash:d},a.state&&a.state.usr||null,a.state&&a.state.key||"default")}function r(s,a){let u=s.document.querySelector("base"),f="";if(u&&u.getAttribute("href")){let d=s.location.href,h=d.indexOf("#");f=h===-1?d:d.slice(0,h)}return f+"#"+(typeof a=="string"?a:xs(a))}function i(s,a){an(s.pathname.charAt(0)==="/",`relative pathnames are not supported in hash history.push(${JSON.stringify(a)})`)}return lE(t,r,i,e)}function qe(e,t){if(e===!1||e===null||typeof e>"u")throw new Error(t)}function an(e,t){if(!e){typeof console<"u"&&console.warn(t);try{throw new Error(t)}catch{}}}function sE(){return Math.random().toString(36).substring(2,10)}function bm(e,t){return{usr:e.state,key:e.key,idx:t}}function Ed(e,t,r=null,i){return{pathname:typeof e=="string"?e:e.pathname,search:"",hash:"",...typeof t=="string"?ro(t):t,state:r,key:t&&t.key||i||sE()}}function xs({pathname:e="/",search:t="",hash:r=""}){return t&&t!=="?"&&(e+=t.charAt(0)==="?"?t:"?"+t),r&&r!=="#"&&(e+=r.charAt(0)==="#"?r:"#"+r),e}function ro(e){let t={};if(e){let r=e.indexOf("#");r>=0&&(t.hash=e.substring(r),e=e.substring(0,r));let i=e.indexOf("?");i>=0&&(t.search=e.substring(i),e=e.substring(0,i)),e&&(t.pathname=e)}return t}function lE(e,t,r,i={}){let{window:s=document.defaultView,v5Compat:a=!1}=i,u=s.history,f="POP",d=null,h=g();h==null&&(h=0,u.replaceState({...u.state,idx:h},""));function g(){return(u.state||{idx:null}).idx}function m(){f="POP";let k=g(),C=k==null?null:k-h;h=k,d&&d({action:f,location:E.location,delta:C})}function y(k,C){f="PUSH";let R=Ed(E.location,k,C);r&&r(R,k),h=g()+1;let N=bm(R,h),b=E.createHref(R);try{u.pushState(N,"",b)}catch(M){if(M instanceof DOMException&&M.name==="DataCloneError")throw M;s.location.assign(b)}a&&d&&d({action:f,location:E.location,delta:1})}function v(k,C){f="REPLACE";let R=Ed(E.location,k,C);r&&r(R,k),h=g();let N=bm(R,h),b=E.createHref(R);u.replaceState(N,"",b),a&&d&&d({action:f,location:E.location,delta:0})}function S(k){let C=s.location.origin!=="null"?s.location.origin:s.location.href,R=typeof k=="string"?k:xs(k);return R=R.replace(/ $/,"%20"),qe(C,`No window.location.(origin|href) available to create URL for href: ${R}`),new URL(R,C)}let E={get action(){return f},get location(){return e(s,u)},listen(k){if(d)throw new Error("A history only accepts one active listener");return s.addEventListener(Nm,m),d=k,()=>{s.removeEventListener(Nm,m),d=null}},createHref(k){return t(s,k)},createURL:S,encodeLocation(k){let C=S(k);return{pathname:C.pathname,search:C.search,hash:C.hash}},push:y,replace:v,go(k){return u.go(k)}};return E}function Wy(e,t,r="/"){return aE(e,t,r,!1)}function aE(e,t,r,i){let s=typeof t=="string"?ro(t):t,a=On(s.pathname||"/",r);if(a==null)return null;let u=qy(e);uE(u);let f=null;for(let d=0;f==null&&d{let d={relativePath:f===void 0?a.path||"":f,caseSensitive:a.caseSensitive===!0,childrenIndex:u,route:a};d.relativePath.startsWith("/")&&(qe(d.relativePath.startsWith(i),`Absolute route path "${d.relativePath}" nested under path "${i}" is not valid. An absolute child route path must start with the combined path of all its parent routes.`),d.relativePath=d.relativePath.slice(i.length));let h=Mn([i,d.relativePath]),g=r.concat(d);a.children&&a.children.length>0&&(qe(a.index!==!0,`Index routes must not have child routes. Please remove all child routes from route path "${h}".`),qy(a.children,t,g,h)),!(a.path==null&&!a.index)&&t.push({path:h,score:mE(h,a.index),routesMeta:g})};return e.forEach((a,u)=>{var f;if(a.path===""||!((f=a.path)!=null&&f.includes("?")))s(a,u);else for(let d of Yy(a.path))s(a,u,d)}),t}function Yy(e){let t=e.split("/");if(t.length===0)return[];let[r,...i]=t,s=r.endsWith("?"),a=r.replace(/\?$/,"");if(i.length===0)return s?[a,""]:[a];let u=Yy(i.join("/")),f=[];return f.push(...u.map(d=>d===""?a:[a,d].join("/"))),s&&f.push(...u),f.map(d=>e.startsWith("/")&&d===""?"/":d)}function uE(e){e.sort((t,r)=>t.score!==r.score?r.score-t.score:yE(t.routesMeta.map(i=>i.childrenIndex),r.routesMeta.map(i=>i.childrenIndex)))}var cE=/^:[\w-]+$/,fE=3,dE=2,hE=1,pE=10,gE=-2,Pm=e=>e==="*";function mE(e,t){let r=e.split("/"),i=r.length;return r.some(Pm)&&(i+=gE),t&&(i+=dE),r.filter(s=>!Pm(s)).reduce((s,a)=>s+(cE.test(a)?fE:a===""?hE:pE),i)}function yE(e,t){return e.length===t.length&&e.slice(0,-1).every((i,s)=>i===t[s])?e[e.length-1]-t[t.length-1]:0}function xE(e,t,r=!1){let{routesMeta:i}=e,s={},a="/",u=[];for(let f=0;f{if(g==="*"){let S=f[y]||"";u=a.slice(0,a.length-S.length).replace(/(.)\/+$/,"$1")}const v=f[y];return m&&!v?h[g]=void 0:h[g]=(v||"").replace(/%2F/g,"/"),h},{}),pathname:a,pathnameBase:u,pattern:e}}function vE(e,t=!1,r=!0){an(e==="*"||!e.endsWith("*")||e.endsWith("/*"),`Route path "${e}" will be treated as if it were "${e.replace(/\*$/,"/*")}" because the \`*\` character must always follow a \`/\` in the pattern. To get rid of this warning, please change the route path to "${e.replace(/\*$/,"/*")}".`);let i=[],s="^"+e.replace(/\/*\*?$/,"").replace(/^\/*/,"/").replace(/[\\.*+^${}|()[\]]/g,"\\$&").replace(/\/:([\w-]+)(\?)?/g,(u,f,d)=>(i.push({paramName:f,isOptional:d!=null}),d?"/?([^\\/]+)?":"/([^\\/]+)"));return e.endsWith("*")?(i.push({paramName:"*"}),s+=e==="*"||e==="/*"?"(.*)$":"(?:\\/(.+)|\\/*)$"):r?s+="\\/*$":e!==""&&e!=="/"&&(s+="(?:(?=\\/|$))"),[new RegExp(s,t?void 0:"i"),i]}function wE(e){try{return e.split("/").map(t=>decodeURIComponent(t).replace(/\//g,"%2F")).join("/")}catch(t){return an(!1,`The URL path "${e}" could not be decoded because it is a malformed URL segment. This is probably due to a bad percent encoding (${t}).`),e}}function On(e,t){if(t==="/")return e;if(!e.toLowerCase().startsWith(t.toLowerCase()))return null;let r=t.endsWith("/")?t.length-1:t.length,i=e.charAt(r);return i&&i!=="/"?null:e.slice(r)||"/"}function SE(e,t="/"){let{pathname:r,search:i="",hash:s=""}=typeof e=="string"?ro(e):e;return{pathname:r?r.startsWith("/")?r:EE(r,t):t,search:_E(i),hash:NE(s)}}function EE(e,t){let r=t.replace(/\/+$/,"").split("/");return e.split("/").forEach(s=>{s===".."?r.length>1&&r.pop():s!=="."&&r.push(s)}),r.length>1?r.join("/"):"/"}function Kf(e,t,r,i){return`Cannot include a '${e}' character in a manually specified \`to.${t}\` field [${JSON.stringify(i)}]. Please separate it out to the \`to.${r}\` field. Alternatively you may provide the full path as a string in and the router will parse it for you.`}function kE(e){return e.filter((t,r)=>r===0||t.route.path&&t.route.path.length>0)}function Xy(e){let t=kE(e);return t.map((r,i)=>i===t.length-1?r.pathname:r.pathnameBase)}function Gy(e,t,r,i=!1){let s;typeof e=="string"?s=ro(e):(s={...e},qe(!s.pathname||!s.pathname.includes("?"),Kf("?","pathname","search",s)),qe(!s.pathname||!s.pathname.includes("#"),Kf("#","pathname","hash",s)),qe(!s.search||!s.search.includes("#"),Kf("#","search","hash",s)));let a=e===""||s.pathname==="",u=a?"/":s.pathname,f;if(u==null)f=r;else{let m=t.length-1;if(!i&&u.startsWith("..")){let y=u.split("/");for(;y[0]==="..";)y.shift(),m-=1;s.pathname=y.join("/")}f=m>=0?t[m]:"/"}let d=SE(s,f),h=u&&u!=="/"&&u.endsWith("/"),g=(a||u===".")&&r.endsWith("/");return!d.pathname.endsWith("/")&&(h||g)&&(d.pathname+="/"),d}var Mn=e=>e.join("/").replace(/\/\/+/g,"/"),CE=e=>e.replace(/\/+$/,"").replace(/^\/*/,"/"),_E=e=>!e||e==="?"?"":e.startsWith("?")?e:"?"+e,NE=e=>!e||e==="#"?"":e.startsWith("#")?e:"#"+e;function bE(e){return e!=null&&typeof e.status=="number"&&typeof e.statusText=="string"&&typeof e.internal=="boolean"&&"data"in e}var Ky=["POST","PUT","PATCH","DELETE"];new Set(Ky);var PE=["GET",...Ky];new Set(PE);var ai=P.createContext(null);ai.displayName="DataRouter";var Eu=P.createContext(null);Eu.displayName="DataRouterState";var Qy=P.createContext({isTransitioning:!1});Qy.displayName="ViewTransition";var RE=P.createContext(new Map);RE.displayName="Fetchers";var TE=P.createContext(null);TE.displayName="Await";var wn=P.createContext(null);wn.displayName="Navigation";var Ms=P.createContext(null);Ms.displayName="Location";var Fn=P.createContext({outlet:null,matches:[],isDataRoute:!1});Fn.displayName="Route";var ah=P.createContext(null);ah.displayName="RouteError";function IE(e,{relative:t}={}){qe(Ls(),"useHref() may be used only in the context of a component.");let{basename:r,navigator:i}=P.useContext(wn),{hash:s,pathname:a,search:u}=Ds(e,{relative:t}),f=a;return r!=="/"&&(f=a==="/"?r:Mn([r,a])),i.createHref({pathname:f,search:u,hash:s})}function Ls(){return P.useContext(Ms)!=null}function oo(){return qe(Ls(),"useLocation() may be used only in the context of a component."),P.useContext(Ms).location}var Jy="You should call navigate() in a React.useEffect(), not when your component is first rendered.";function Zy(e){P.useContext(wn).static||P.useLayoutEffect(e)}function jE(){let{isDataRoute:e}=P.useContext(Fn);return e?WE():$E()}function $E(){qe(Ls(),"useNavigate() may be used only in the context of a component.");let e=P.useContext(ai),{basename:t,navigator:r}=P.useContext(wn),{matches:i}=P.useContext(Fn),{pathname:s}=oo(),a=JSON.stringify(Xy(i)),u=P.useRef(!1);return Zy(()=>{u.current=!0}),P.useCallback((d,h={})=>{if(an(u.current,Jy),!u.current)return;if(typeof d=="number"){r.go(d);return}let g=Gy(d,JSON.parse(a),s,h.relative==="path");e==null&&t!=="/"&&(g.pathname=g.pathname==="/"?t:Mn([t,g.pathname])),(h.replace?r.replace:r.push)(g,h.state,h)},[t,r,a,s,e])}P.createContext(null);function Ds(e,{relative:t}={}){let{matches:r}=P.useContext(Fn),{pathname:i}=oo(),s=JSON.stringify(Xy(r));return P.useMemo(()=>Gy(e,JSON.parse(s),i,t==="path"),[e,s,i,t])}function AE(e,t){return ex(e,t)}function ex(e,t,r,i){var R;qe(Ls(),"useRoutes() may be used only in the context of a component.");let{navigator:s,static:a}=P.useContext(wn),{matches:u}=P.useContext(Fn),f=u[u.length-1],d=f?f.params:{},h=f?f.pathname:"/",g=f?f.pathnameBase:"/",m=f&&f.route;{let N=m&&m.path||"";tx(h,!m||N.endsWith("*")||N.endsWith("*?"),`You rendered descendant (or called \`useRoutes()\`) at "${h}" (under ) but the parent route path has no trailing "*". This means if you navigate deeper, the parent won't match anymore and therefore the child routes will never render. - -Please change the parent to .`)}let y=oo(),v;if(t){let N=typeof t=="string"?ro(t):t;qe(g==="/"||((R=N.pathname)==null?void 0:R.startsWith(g)),`When overriding the location using \`\` or \`useRoutes(routes, location)\`, the location pathname must begin with the portion of the URL pathname that was matched by all parent routes. The current pathname base is "${g}" but pathname "${N.pathname}" was given in the \`location\` prop.`),v=N}else v=y;let S=v.pathname||"/",E=S;if(g!=="/"){let N=g.replace(/^\//,"").split("/");E="/"+S.replace(/^\//,"").split("/").slice(N.length).join("/")}let k=!a&&r&&r.matches&&r.matches.length>0?r.matches:Wy(e,{pathname:E});an(m||k!=null,`No routes matched location "${v.pathname}${v.search}${v.hash}" `),an(k==null||k[k.length-1].route.element!==void 0||k[k.length-1].route.Component!==void 0||k[k.length-1].route.lazy!==void 0,`Matched leaf route at location "${v.pathname}${v.search}${v.hash}" does not have an element or Component. This means it will render an with a null value by default resulting in an "empty" page.`);let C=zE(k&&k.map(N=>Object.assign({},N,{params:Object.assign({},d,N.params),pathname:Mn([g,s.encodeLocation?s.encodeLocation(N.pathname).pathname:N.pathname]),pathnameBase:N.pathnameBase==="/"?g:Mn([g,s.encodeLocation?s.encodeLocation(N.pathnameBase).pathname:N.pathnameBase])})),u,r,i);return t&&C?P.createElement(Ms.Provider,{value:{location:{pathname:"/",search:"",hash:"",state:null,key:"default",...v},navigationType:"POP"}},C):C}function ME(){let e=UE(),t=bE(e)?`${e.status} ${e.statusText}`:e instanceof Error?e.message:JSON.stringify(e),r=e instanceof Error?e.stack:null,i="rgba(200,200,200, 0.5)",s={padding:"0.5rem",backgroundColor:i},a={padding:"2px 4px",backgroundColor:i},u=null;return console.error("Error handled by React Router default ErrorBoundary:",e),u=P.createElement(P.Fragment,null,P.createElement("p",null,"💿 Hey developer 👋"),P.createElement("p",null,"You can provide a way better UX than this when your app throws errors by providing your own ",P.createElement("code",{style:a},"ErrorBoundary")," or"," ",P.createElement("code",{style:a},"errorElement")," prop on your route.")),P.createElement(P.Fragment,null,P.createElement("h2",null,"Unexpected Application Error!"),P.createElement("h3",{style:{fontStyle:"italic"}},t),r?P.createElement("pre",{style:s},r):null,u)}var LE=P.createElement(ME,null),DE=class extends P.Component{constructor(e){super(e),this.state={location:e.location,revalidation:e.revalidation,error:e.error}}static getDerivedStateFromError(e){return{error:e}}static getDerivedStateFromProps(e,t){return t.location!==e.location||t.revalidation!=="idle"&&e.revalidation==="idle"?{error:e.error,location:e.location,revalidation:e.revalidation}:{error:e.error!==void 0?e.error:t.error,location:t.location,revalidation:e.revalidation||t.revalidation}}componentDidCatch(e,t){console.error("React Router caught the following error during render",e,t)}render(){return this.state.error!==void 0?P.createElement(Fn.Provider,{value:this.props.routeContext},P.createElement(ah.Provider,{value:this.state.error,children:this.props.component})):this.props.children}};function OE({routeContext:e,match:t,children:r}){let i=P.useContext(ai);return i&&i.static&&i.staticContext&&(t.route.errorElement||t.route.ErrorBoundary)&&(i.staticContext._deepestRenderedBoundaryId=t.route.id),P.createElement(Fn.Provider,{value:e},r)}function zE(e,t=[],r=null,i=null){if(e==null){if(!r)return null;if(r.errors)e=r.matches;else if(t.length===0&&!r.initialized&&r.matches.length>0)e=r.matches;else return null}let s=e,a=r==null?void 0:r.errors;if(a!=null){let d=s.findIndex(h=>h.route.id&&(a==null?void 0:a[h.route.id])!==void 0);qe(d>=0,`Could not find a matching route for errors on route IDs: ${Object.keys(a).join(",")}`),s=s.slice(0,Math.min(s.length,d+1))}let u=!1,f=-1;if(r)for(let d=0;d=0?s=s.slice(0,f+1):s=[s[0]];break}}}return s.reduceRight((d,h,g)=>{let m,y=!1,v=null,S=null;r&&(m=a&&h.route.id?a[h.route.id]:void 0,v=h.route.errorElement||LE,u&&(f<0&&g===0?(tx("route-fallback",!1,"No `HydrateFallback` element provided to render during initial hydration"),y=!0,S=null):f===g&&(y=!0,S=h.route.hydrateFallbackElement||null)));let E=t.concat(s.slice(0,g+1)),k=()=>{let C;return m?C=v:y?C=S:h.route.Component?C=P.createElement(h.route.Component,null):h.route.element?C=h.route.element:C=d,P.createElement(OE,{match:h,routeContext:{outlet:d,matches:E,isDataRoute:r!=null},children:C})};return r&&(h.route.ErrorBoundary||h.route.errorElement||g===0)?P.createElement(DE,{location:r.location,revalidation:r.revalidation,component:v,error:m,children:k(),routeContext:{outlet:null,matches:E,isDataRoute:!0}}):k()},null)}function uh(e){return`${e} must be used within a data router. See https://reactrouter.com/en/main/routers/picking-a-router.`}function FE(e){let t=P.useContext(ai);return qe(t,uh(e)),t}function BE(e){let t=P.useContext(Eu);return qe(t,uh(e)),t}function HE(e){let t=P.useContext(Fn);return qe(t,uh(e)),t}function ch(e){let t=HE(e),r=t.matches[t.matches.length-1];return qe(r.route.id,`${e} can only be used on routes that contain a unique "id"`),r.route.id}function VE(){return ch("useRouteId")}function UE(){var i;let e=P.useContext(ah),t=BE("useRouteError"),r=ch("useRouteError");return e!==void 0?e:(i=t.errors)==null?void 0:i[r]}function WE(){let{router:e}=FE("useNavigate"),t=ch("useNavigate"),r=P.useRef(!1);return Zy(()=>{r.current=!0}),P.useCallback(async(s,a={})=>{an(r.current,Jy),r.current&&(typeof s=="number"?e.navigate(s):await e.navigate(s,{fromRouteId:t,...a}))},[e,t])}var Rm={};function tx(e,t,r){!t&&!Rm[e]&&(Rm[e]=!0,an(!1,r))}P.memo(qE);function qE({routes:e,future:t,state:r}){return ex(e,void 0,r,t)}function nx(e){qe(!1,"A is only ever to be used as the child of element, never rendered directly. Please wrap your in a .")}function YE({basename:e="/",children:t=null,location:r,navigationType:i="POP",navigator:s,static:a=!1}){qe(!Ls(),"You cannot render a inside another . You should never have more than one in your app.");let u=e.replace(/^\/*/,"/"),f=P.useMemo(()=>({basename:u,navigator:s,static:a,future:{}}),[u,s,a]);typeof r=="string"&&(r=ro(r));let{pathname:d="/",search:h="",hash:g="",state:m=null,key:y="default"}=r,v=P.useMemo(()=>{let S=On(d,u);return S==null?null:{location:{pathname:S,search:h,hash:g,state:m,key:y},navigationType:i}},[u,d,h,g,m,y,i]);return an(v!=null,` is not able to match the URL "${d}${h}${g}" because it does not start with the basename, so the won't render anything.`),v==null?null:P.createElement(wn.Provider,{value:f},P.createElement(Ms.Provider,{children:t,value:v}))}function XE({children:e,location:t}){return AE(kd(e),t)}function kd(e,t=[]){let r=[];return P.Children.forEach(e,(i,s)=>{if(!P.isValidElement(i))return;let a=[...t,s];if(i.type===P.Fragment){r.push.apply(r,kd(i.props.children,a));return}qe(i.type===nx,`[${typeof i.type=="string"?i.type:i.type.name}] is not a component. All component children of must be a or `),qe(!i.props.index||!i.props.children,"An index route cannot have child routes.");let u={id:i.props.id||a.join("-"),caseSensitive:i.props.caseSensitive,element:i.props.element,Component:i.props.Component,index:i.props.index,path:i.props.path,loader:i.props.loader,action:i.props.action,hydrateFallbackElement:i.props.hydrateFallbackElement,HydrateFallback:i.props.HydrateFallback,errorElement:i.props.errorElement,ErrorBoundary:i.props.ErrorBoundary,hasErrorBoundary:i.props.hasErrorBoundary===!0||i.props.ErrorBoundary!=null||i.props.errorElement!=null,shouldRevalidate:i.props.shouldRevalidate,handle:i.props.handle,lazy:i.props.lazy};i.props.children&&(u.children=kd(i.props.children,a)),r.push(u)}),r}var za="get",Fa="application/x-www-form-urlencoded";function ku(e){return e!=null&&typeof e.tagName=="string"}function GE(e){return ku(e)&&e.tagName.toLowerCase()==="button"}function KE(e){return ku(e)&&e.tagName.toLowerCase()==="form"}function QE(e){return ku(e)&&e.tagName.toLowerCase()==="input"}function JE(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}function ZE(e,t){return e.button===0&&(!t||t==="_self")&&!JE(e)}var ua=null;function ek(){if(ua===null)try{new FormData(document.createElement("form"),0),ua=!1}catch{ua=!0}return ua}var tk=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function Qf(e){return e!=null&&!tk.has(e)?(an(!1,`"${e}" is not a valid \`encType\` for \`
\`/\`\` and will default to "${Fa}"`),null):e}function nk(e,t){let r,i,s,a,u;if(KE(e)){let f=e.getAttribute("action");i=f?On(f,t):null,r=e.getAttribute("method")||za,s=Qf(e.getAttribute("enctype"))||Fa,a=new FormData(e)}else if(GE(e)||QE(e)&&(e.type==="submit"||e.type==="image")){let f=e.form;if(f==null)throw new Error('Cannot submit a + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/buttons/quitButton.tsx b/FRONT/BUILD/resources/app/src/components/UI/buttons/quitButton.tsx new file mode 100644 index 0000000..373655f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/buttons/quitButton.tsx @@ -0,0 +1,45 @@ +import { MainButton } from "./mainButton"; +import styled from "styled-components"; +import { buttonNames } from "../../../const/buttons/names"; +import { IconComponent as Icon } from '../../../const/buttons/icons'; +import { useWorkSpaceStore } from "../../../store"; + +type Props = { + size: "small" | "big"; +}; + +const Container = styled.div<{ size: "small" | "big" }>` + ${(props) => props.size === "small" && "width: 100%;"} +`; + +const Button = styled.div` + width: 100%; + cursor: pointer; + color: ${(props) => props.theme.textColor}; +`; + +const IconContainer = styled.div` + padding: 10px; +`; + +export const QuitButton = ({ size }: Props) => { + const handleExit = () => { + window.electron.quitApp(); + }; + + const { setWorkModule } = useWorkSpaceStore() + + return ( + setWorkModule('helloWindow')}> + {size === "big" ? ( + + ) : ( + + )} + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/buttons/toggletheme.tsx b/FRONT/BUILD/resources/app/src/components/UI/buttons/toggletheme.tsx new file mode 100644 index 0000000..f1ca231 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/buttons/toggletheme.tsx @@ -0,0 +1,26 @@ +import styled, { useTheme } from "styled-components"; +import { IconComponent as Icon } from '../../../const/theme/icons'; +import { ThemName } from "../../../const/theme/names"; + +const Button = styled.div` + width: 100%; + cursor: pointer; +` + +const IconContainer = styled.div` + padding: 10px; + color: ${props => props.theme.text}; +` + +export default function ThemeButton() { + const theme = useTheme(); + const name = localStorage.getItem('theme') as ThemName + + return ( + + ); +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/inputs/input.tsx b/FRONT/BUILD/resources/app/src/components/UI/inputs/input.tsx new file mode 100644 index 0000000..dd2b9c9 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/inputs/input.tsx @@ -0,0 +1,65 @@ +import React from 'react'; +import styled from 'styled-components'; + +type Props = { + placeholderText: string; + id: string; + value?: string; + onChange?: (value: string) => void; + onFileChange?: (event: React.ChangeEvent) => void; + type?: string; + multiple?: boolean; + style?: React.CSSProperties; + search?: boolean; + onFocus?: any + onBlur?: any + $size?: string +} + +const InputContainer = styled.div` + width: 100%; + display: flex; + flex: 3; + +`; + +const StyledInput = styled.input` + padding: 8px 10px; + color: black; + border-radius: 8px; + border: 1px solid #A1A1A1; + background-color: transparent; + &:focus{ + border: 1px solid #adadad; + } + width: 100%; + font-size: 18px; + color: ${props=>props.theme.textColor} +`; + +const Input = React.forwardRef(({ placeholderText, id, value, onChange, onFileChange, type = "text", multiple, style, onFocus, onBlur }, ref) => { + const handleInputChange = (e: React.ChangeEvent) => { + const { value } = e.target; + if (onChange) { + onChange(value); + } + }; + + return ( + + + + ); +}); + +export default Input; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/loader.tsx b/FRONT/BUILD/resources/app/src/components/UI/loader.tsx new file mode 100644 index 0000000..c13bd3f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/loader.tsx @@ -0,0 +1,101 @@ +type Props = { + loaderText: string; //Тип передаваемых данных loaderText - string +} + +import styled, { keyframes } from 'styled-components' +import { AnimDot } from './animDot'; + + +//Константа которая устанавливает кейфвреймы для вращения +const spinAnimation = keyframes` + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +` + +//Стиль экрана загрузки +export const LoaderContainer = styled.div` + top: 0px; + z-index:998; + background-color: rgba(0,0,0, 0.7); + position: fixed; + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 100%; + overflow-y: hidden; +` + + +//Стиль блока с элементами загрузки +export const Loaderblock = styled.div` + display: flex; + flex-direction: column; + align-items: center; + gap: 15px; + + p{ + font-size: 24px; + color: white; + } +` +//Стиль для блока с кольцом загрузки +export const LoadingSpinner = styled.div` + position: relative; + width: 65px; + height: 65px; +` + +//Стиль для кольца загрузки +export const LoadingRing = styled.div` + position: absolute; + top: 0; + left: 0; + width: 65px; + height: 65px; + border-radius: 50%; + border: 12px solid white; +` +//Стиль для части кольца загрузки, которая будет вращаться +export const LoadingPart = styled.div` + position: absolute; + top: 0; + left: 0; + width: 65px; + height: 65px; + border-radius: 50%; + border: 12px solid transparent; + border-top: 12px solid ${props => props.theme.accent}; + + // Добавление аниманции и использование кейфремов + animation: ${spinAnimation} 1s linear infinite; +` + +const Text = styled.div` + display: flex; + gap: 3px; + font-size: 24px; + color: white; + margin-top: 30px; + margin-left: 25px; +` + +export default function Loader({ loaderText }: Props) { + return ( + + + + + + + + + {/* Текст экрана загрузки устанавливается с помощью передаваемых данных loaderText */} + {loaderText} + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/routerLoader.tsx b/FRONT/BUILD/resources/app/src/components/UI/routerLoader.tsx new file mode 100644 index 0000000..9a788f4 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/routerLoader.tsx @@ -0,0 +1,103 @@ +type Props = { + loaderText: string; //Тип передаваемых данных loaderText - string +} + +import styled, { keyframes } from 'styled-components' +import { AnimDot } from './animDot'; +import { ModalWindow } from '../modalwindows/style'; + + +//Константа которая устанавливает кейфвреймы для вращения +const spinAnimation = keyframes` + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +` + +//Стиль экрана загрузки +export const LoaderContainer = styled.div` + top: 0px; + z-index:998; + background-color: rgba(0,0,0, 0.7); + position: fixed; + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 100%; + overflow-y: hidden; +` + + +//Стиль блока с элементами загрузки +export const Loaderblock = styled.div` + display: flex; + flex-direction: column; + align-items: center; + gap: 15px; + + p{ + font-size: 24px; + color: white; + } +` +//Стиль для блока с кольцом загрузки +export const LoadingSpinner = styled.div` + position: relative; + width: 65px; + height: 65px; +` + +//Стиль для кольца загрузки +export const LoadingRing = styled.div` + position: absolute; + top: 0; + left: 0; + width: 65px; + height: 65px; + border-radius: 50%; + border: 12px solid white; +` +//Стиль для части кольца загрузки, которая будет вращаться +export const LoadingPart = styled.div` + position: absolute; + top: 0; + left: 0; + width: 65px; + height: 65px; + border-radius: 50%; + border: 12px solid transparent; + border-top: 12px solid ${props => props.theme.accent}; + + // Добавление аниманции и использование кейфремов + animation: ${spinAnimation} 1s linear infinite; +` + +const Text = styled.div` + display: flex; + gap: 3px; + font-size: 24px; + color: white; + margin-top: 30px; + margin-left: 25px; +` + +export default function RouterLoader({ loaderText }: Props) { + return ( + + + + + + + + {/* Текст экрана загрузки устанавливается с помощью передаваемых данных loaderText */} + {loaderText} + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/signalSvg.tsx b/FRONT/BUILD/resources/app/src/components/UI/signalSvg.tsx new file mode 100644 index 0000000..9590433 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/signalSvg.tsx @@ -0,0 +1,63 @@ +import React, { useEffect, useRef } from 'react'; + +interface SignalSVGProps { + signal: number; // Принимаем signal как пропс + color: string; + size: string; +} + +const SignalSVG: React.FC = ({ signal, color, size }) => { + const svgRef = useRef(null); + + useEffect(() => { + // Устанавливаем цвета в зависимости от signal + const colors = { + '--st1-color': signal >= 1 ? color : 'black', + '--st2-color': signal >= 2 ? color : 'black', + '--st3-color': signal >= 3 ? color : 'black', + '--st4-color': signal >= 4 ? color : 'black', + '--st5-color': signal === 5 ? color : 'black', + }; + + // Применяем стили к SVG + if (svgRef.current) { + Object.entries(colors).forEach(([key, value]) => { + svgRef.current?.style.setProperty(key, value); + }); + } + }, [signal]); + + return ( + + + + + + + + + + + ); +}; + +export default SignalSVG; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/UI/tables/TableScanner.tsx b/FRONT/BUILD/resources/app/src/components/UI/tables/TableScanner.tsx new file mode 100644 index 0000000..e1b8c6f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/UI/tables/TableScanner.tsx @@ -0,0 +1,109 @@ +import React from 'react'; +import { DeviceUser } from '../../../store/useDeviceStore'; + +interface TableScannerProps { + devices: DeviceUser[]; +} +import styled from 'styled-components'; +import {IconComponent} from "../../../const/buttons/icons"; +import {buttonNames} from "../../../const/buttons/names"; +import {ModalMap} from "../../modalwindows/windowsType"; +import {useModalContext} from "../../../store"; + +const TableContainer = styled.div` + width: 100%; + box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08); + background: ${({ theme }) => theme.primary}; + margin: 24px 0; +`; + +const StyledTable = styled.table` + width: 100%; + border-collapse: separate; + border-spacing: 0; +`; + +const TableHeaderCell = styled.th<{ sortable?: boolean }>` + padding: 16px 24px; + text-align: left; + font-weight: 600; + font-size: 14px; + color: ${({ theme }) => theme.textSecondary}; + background: ${({ theme }) => theme.primary}; + border-bottom: 1px solid ${({ theme }) => theme.borderColor}; + transition: all 0.2s ease; +`; + +const TableRow = styled.tr<{ clickable?: boolean }>` + transition: all 0.2s ease; + &:hover { + background-color: ${({ theme }) => theme.background}; + } +`; + +const TableCell = styled.td` + padding: 16px 24px; + font-size: 14px; + color: ${({ theme }) => theme.text}; + border-bottom: 1px solid ${({ theme }) => theme.borderColor}; + transition: all 0.2s ease; +`; + +const StatusBadge = styled.span<{ status:string }>` + width: 10px; + height: 30px; + background-color: ${({theme, status}) => (status==='online' ? theme.successColor : theme.offlineColor)}; + display: inline-block; + border-radius:4px; +` + +const TableScanner = ({devices}:TableScannerProps) => { + const { openModal } = useModalContext(); + + const openModalNote = (e: React.MouseEvent, device:DeviceUser ) => { + e.stopPropagation(); + openModal(ModalMap['6'], { + address: device.mac, + currentNote: device.note || '' + }); + }; + + return ( + + + + + + Имя + Производитель + IP адрес + Открытые порты + Последняя активность + Заметка + + + + + {devices.map((item, i) => ( + + + {item.hostname || 'Неизвестен'} + {item.vendor} + {item.ip} + {item.open_ports.join(', ') || '-'} + {item.last_seen} + {item.note || '-'} + + openModalNote(e, item)}> + + + + + ))} + + + + ); +}; + +export default TableScanner; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/circleNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/circleNode.tsx new file mode 100644 index 0000000..94eb76c --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/circleNode.tsx @@ -0,0 +1,38 @@ +import React from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Circle } from './style'; + +interface CustomNodeProps { + data: { + label: string; + style:{ + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const CircleNode = ({ data }: CustomNodeProps) => { + return ( + {/* */} + {/*
*/} + {data.label} + + {/* Узлы для подключения */} + + + + + + {/* Для входящих подключений */} + + + + + {/*
*/} + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/style.ts new file mode 100644 index 0000000..df61ace --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/circle/style.ts @@ -0,0 +1,20 @@ +import styled from "styled-components"; + +type Props={ + width: string, + height: string, + bordertype: string, + bordercolor: string +} + + +export const Circle = styled.div` + background-color: white; + border-radius: 100%; + display: flex; + align-items: center; + justify-content: center; + border: 2px ${(props) => props.bordertype} ${(props) => props.bordercolor}; + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/defaultNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/defaultNode.tsx new file mode 100644 index 0000000..388e9fb --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/defaultNode.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Default } from './style'; + +interface CustomNodeProps { + data: { + label: string; + style:{ + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const DefaultNode = ({ data }: CustomNodeProps) => { + return ( + + {data.label} + + {/* Узлы для подключения */} + {/* + + + */} + + {/* Для входящих подключений */} + {/* */} + + {/* + */} + {/* */} + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/style.ts new file mode 100644 index 0000000..62595bc --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/default/style.ts @@ -0,0 +1,20 @@ +import styled from "styled-components"; + +type Props={ + width: string, + height: string, + bordertype: string, + bordercolor: string +} + +export const Default = styled.div` + background-color: white; + border: 2px ${(props) => props.bordertype} ${(props) => props.bordercolor}; + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; + visibility: visible; +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/diamondNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/diamondNode.tsx new file mode 100644 index 0000000..49ab61c --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/diamondNode.tsx @@ -0,0 +1,45 @@ +import React from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Diamond, InnerDiamond, Border } from './style'; + +interface CustomNodeProps { + data: { + label: string; + style:{ + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const DiamondNode = ({ data }: CustomNodeProps) => { + + const baseSize = Math.max(data.style.width, data.style.height); + + return ( + {/* */} + + + {data.label} + + + +
+ {/* Узлы для подключения */} + + + + + + {/* Для входящих подключений */} + + + + +
+ + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/style.ts new file mode 100644 index 0000000..5eb0ba0 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/diamond/style.ts @@ -0,0 +1,32 @@ +import styled from "styled-components"; + +interface StyledDefaultProps { + width: any; + height: any; +} + +export const Diamond = styled.div` + position: relative; + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; +`; + +export const InnerDiamond = styled.div` + clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); + width: ${(props) => props.width - 6}px; + height: ${(props) => props.height - 4}px; + background-color: white; + display: flex; + align-items: center; + justify-content: center; +` + +export const Border = styled.div<{ width: number; height: number, bordercolor: any }>` + clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; + background-color: ${(props) => props.bordercolor}; + display: flex; + align-items: center; + justify-content: center; +`; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/index.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/index.ts new file mode 100644 index 0000000..9827eef --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/index.ts @@ -0,0 +1,5 @@ +export {DefaultNode} from './default/defaultNode' +export {PillNode} from './pill/pillNode' +export {ParalelorgamNode} from './paralelogram/paralelogramNode' +export {CircleNode} from './circle/circleNode' +export {DiamondNode} from './diamond/diamondNode' \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/paralelogramNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/paralelogramNode.tsx new file mode 100644 index 0000000..699f00c --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/paralelogramNode.tsx @@ -0,0 +1,35 @@ +import React from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Paralelorgam } from './style'; + +interface CustomNodeProps { + data: { + label: string; + style:{ + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const ParalelorgamNode = ({ data }: CustomNodeProps) => { + return ( + + {data.label} + + {/* Узлы для подключения */} + + + + + + {/* Для входящих подключений */} + + + + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/style.ts new file mode 100644 index 0000000..46791e4 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/paralelogram/style.ts @@ -0,0 +1,43 @@ +import styled from "styled-components"; + +type Props={ + width: string, + height: string, + bordertype: string, + bordercolor: string +} + + +export const Paralelorgam = styled.div` + transform: skewX(-20deg); + background-color: white; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; + border: 2px ${(props) => props.bordertype} ${(props) => props.bordercolor}; + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; + + .react-flow__handle-top{ + transform: skewX(20deg); + top: -5px; + } + + .react-flow__handle-bottom{ + transform: skewX(20deg); + bottom: -5px; + } + + .react-flow__handle-right{ + transform: skewX(20deg); + right: -5px; + top: 25px; + } + + .react-flow__handle-left{ + transform: skewX(20deg); + left: -5px; + top: 25px; + } +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/pillNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/pillNode.tsx new file mode 100644 index 0000000..7adf271 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/pillNode.tsx @@ -0,0 +1,40 @@ +import React from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Pill } from './style'; + +interface CustomNodeProps { + data: { + label: string; + style:{ + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const PillNode = ({ data }: CustomNodeProps) => { + return ( + {/* */} + {/*
*/} + {data.label} + + {/* Узлы для подключения */} + + + + + + {/* Для входящих подключений */} + + + + + {/*
*/} + + + ); +}; + +export default PillNode; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/style.ts new file mode 100644 index 0000000..d08fe21 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/baseForm/pill/style.ts @@ -0,0 +1,19 @@ +import styled from "styled-components"; + +type Props={ + width: string, + height: string, + bordertype: string, + bordercolor: string +} + +export const Pill = styled.div` + background-color: white; + border-radius: 50px; + display: flex; + align-items: center; + justify-content: center; + border: 2px ${(props) => props.bordertype} ${(props) => props.bordercolor}; + width: ${(props) => props.width}px; + height: ${(props) => props.height}px; +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/index.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/index.ts new file mode 100644 index 0000000..64b1036 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/index.ts @@ -0,0 +1,5 @@ +export {NodeGroupNode} from './networkGroup/nodeGroup' +export {NetWorkNode} from './networkNode/networkNode' +export {IpGroupeNode} from './ipGroup/ipGroup' +export {IpNode} from './ipNode/ipNode' +export {PortNode} from './portNode/portNode' \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/ipGroup.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/ipGroup.tsx new file mode 100644 index 0000000..750e612 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/ipGroup.tsx @@ -0,0 +1,18 @@ + +import { IpGroup } from "./style"; + +interface CustomNodeProps { + data: { + style: { + width: any, + height: any, + } + }; +} + +export const IpGroupeNode = ({ data }: CustomNodeProps) => { + return ( + + ); +}; + diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/style.ts new file mode 100644 index 0000000..606ce1a --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipGroup/style.ts @@ -0,0 +1,12 @@ +import styled from "styled-components" + +type Props={ + $width: string, + $height?: any +} + + +export const IpGroup = styled.div` + width: ${(props) => props.$width}px; + height: ${(props) => typeof props.$height === 'number' ? `${props.$height}px` : props.$height}; +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/ipNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/ipNode.tsx new file mode 100644 index 0000000..d04af92 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/ipNode.tsx @@ -0,0 +1,245 @@ +import { useState } from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Ip } from './style'; +import { Row, IpTitle, IpContent } from './style'; +import Input from '../../../../UI/inputs/input'; +import { useModalContext, usePannableStore } from '../../../../../store'; +import { ModalMap } from '../../../../modalwindows/windowsType'; +import { validateIPAddress, validateSameSubnet } from '../../../../../utils/nodeController/validator'; +import {changeIp} from '../../../../../const/types/types' +import { IconComponent } from "../../../../../const/buttons/icons"; +import { buttonNames } from "../../../../../const/buttons/names"; + +interface IIp { + ipType: string + ipAdress: string, + ipGate: string, + ipDns: string[] + ipVersion: string +} + +type StateType = Record; +const typeMap: StateType = { + 'auto': "DHCP", + 'manual': "Static" +} + +interface CustomNodeProps { + data: { + ipData: IIp, + interfaceData: { + device: string, + connection: string + }, + style: { + width: any, + height: any, + borderType: string, + borderColor: string, + } + route: boolean + } +} + +export const IpNode = ({ data }: CustomNodeProps) => { + const { toggleEditingMode } = usePannableStore(); + const [isInput, setIsInput] = useState(false) + const { openModal } = useModalContext(); + + const [ipData, setIpData] = useState( + { + currentIp: data.ipData.ipAdress, + newIp: data.ipData.ipAdress, + currentGate: data.ipData.ipGate, + newGate: data.ipData.ipGate, + currentDns: data.ipData.ipDns, + newDns: data.ipData.ipDns, + device: data.interfaceData.device, + connection: data.interfaceData.connection, + version: data.ipData.ipVersion, + prefix: 0 + } + ) + + const handleFocus = () => { + toggleEditingMode(); + }; + + const handleBlur = () => { + toggleEditingMode(); + }; + + const handleClick = () => { + if (isInput) { + setIsInput(false) + setIpData(prevData => ({ + ...prevData, + newIp: data.ipData.ipAdress, + newGate: data.ipData.ipGate, + newDns: data.ipData.ipDns + })); + } + else { + setIsInput(true) + } + } + + const handleChange = (id: string, value: string) => { + if (id === 'newDns') { + const dnsArray = value.split(',').map(dns => dns.trim()); + setIpData(prevData => ({ + ...prevData, + [id]: dnsArray + })); + } else { + setIpData(prevData => ({ + ...prevData, + [id]: value + })); + } + }; + + function getSubnetMask(ipAddress: string, ipVersion: string): number { + if (ipVersion === "6") { + return 64; + } + + const firstOctet = parseInt(ipAddress.split(".")[0], 10); + if (firstOctet >= 0 && firstOctet <= 127) { + return 8; + } else if (firstOctet >= 128 && firstOctet <= 191) { + return 16; + } else if (firstOctet >= 192 && firstOctet <= 223) { + return 24; + } else { + return 24; + } + } + + + const handleConfirm = () => { + if ( + !validateIPAddress(ipData.newIp) || + !validateIPAddress(ipData.newGate) || + !ipData.newDns.every(dns => validateIPAddress(dns)) + ) { + alert('Один или несколько IP-адресов некорректны.'); + return; + } + + if (!validateSameSubnet(ipData.newIp, ipData.newGate, ipData.newDns)) { + alert('Адрес, шлюз и хотя бы один DNS должны находиться в одной подсети.'); + return; + } + + const calculatedPrefix = getSubnetMask(ipData.newIp, data.ipData.ipVersion); + + setIpData(prevData => ({ + ...prevData, + prefix: calculatedPrefix, + })); + + openModal(ModalMap['1'], { + ...ipData, + prefix: calculatedPrefix, + }); + + setIsInput(false) + }; + + + return ( + <> + + + + {/* +

Версия IP:

+

v{data.ipData.ipVersion}

+ */} + + +

Метод:

+

{typeMap[data.ipData.ipType]}

+ + + {isInput ? ( + + + + + + ) : ( + + )} + + + + + +

IPv{data.ipData.ipVersion}-Addr:

+ {isInput ? ( + handleChange('newIp', value)} + onBlur={handleBlur} + onFocus={handleFocus} + style={{fontSize: '12px', padding: '4px 10px'}} + /> + ) : ( +

{data.ipData.ipAdress}

+ )} + + + + +

IPv{data.ipData.ipVersion}-GW:

+ {isInput ? ( + handleChange('newGate', value)} + onBlur={handleBlur} + onFocus={handleFocus} + style={{fontSize: '12px', padding: '4px 10px'}} + /> + ) : ( +

{data.ipData.ipGate}

+ )} + + + +

IPv{data.ipData.ipVersion}-DNS:

+ {isInput ? ( + handleChange('newDns', value)} + onBlur={handleBlur} + onFocus={handleFocus} + style={{fontSize: '12px', padding: '4px 10px'}} + /> + ) : ( +

{data.ipData.ipDns.join(', ')}

+ )} + + + {data.route && + <> + + + + } + + + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/style.ts new file mode 100644 index 0000000..3355417 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/ipNode/style.ts @@ -0,0 +1,74 @@ +import styled from "styled-components"; + +type Props={ + $width: string, + $height?: any + $bordertype: string, + $bordercolor: string +} + +export const Ip = styled.div` + background-color: ${(props)=>props.theme.secondary}; + display: flex; + flex-direction: column; + width: ${(props) => props.$width}px; + height: ${(props) => typeof props.$height === 'number' ? `${props.$height}px` : props.$height}; + // box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.1); + border-radius: 8px; + + p{ + margin: 0; + } + + img{ + width: 15px; + height: 15px; + } +` + +export const IpTitle = styled.div` + background: ${(props)=>props.theme.accent}; + border-top-left-radius: 6px; + border-top-right-radius: 6px; + color: white; + display: flex; + justify-content: space-between; + padding: 10px; + +` + +export const IpContent = styled.div` + display: flex; + flex-direction: column; + justify-content: space-between; + height: 100%; + padding: 10px; + + .row{ + height: 24px; + + .row-label{ + flex: 1; + } + + .row-text{ + flex: 3; + } + + p{ + + text-wrap: nowrap; + text-align: left; + } + } +` + +export const Row = styled.div` + display: flex; + align-items: center; + gap: 5px; + + p{ + margin: 0; + } +` diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/nodeGroup.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/nodeGroup.tsx new file mode 100644 index 0000000..e7b3f66 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/nodeGroup.tsx @@ -0,0 +1,64 @@ +import { useState } from "react"; +import { NodeGroup, Row, CollapseButton } from "./style"; +import { useGroupStore } from "../../../../../store"; +import { MainButton } from "../../../../UI/buttons/mainButton"; +import { IconComponent } from "../../../../../const/buttons/icons"; +import { buttonNames } from "../../../../../const/buttons/names"; + +interface CustomNodeProps { + data: { + id: string; + label: string; + height: any + style: { + width: any; + height: any; + borderType: any; + borderColor: any; + }; + }; +} + +export const NodeGroupNode = ({ data }: CustomNodeProps) => { + const [click, setClick] = useState(false); + const { groups, setGroups } = useGroupStore(); + + const handleClick = () => { + const newClickState = !click; + setClick(newClickState); + + const updatedNodes = groups.map((groups) => + groups.id === data.id ? { ...groups, click: newClickState } : groups + ); + + if (!groups.some((groups) => groups.id === data.id)) { + updatedNodes.push({ id: data.id, click: newClickState }); + } + + setGroups(updatedNodes); + }; + + return ( + + +

{data.label}

+ + {/* */} + + {click ?( + 'Развернуть' + ):( + 'Свернуть' + )} + + {/* */} + + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/style.ts new file mode 100644 index 0000000..9311bd5 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkGroup/style.ts @@ -0,0 +1,47 @@ +import styled from "styled-components" + +type Props={ + $width?: string, + $height?: any + $bordertype?: string, + $bordercolor?: string + $backgroundcolor?: string +} + + +export const NodeGroup = styled.div` + border: 2px ${(props) => props.$bordertype} ${(props) => props.$bordercolor}; + width: ${(props) => props.$width}px; + height: ${(props) => typeof props.$height === 'number' ? `${props.$height}px` : props.$height}; + border-radius: 12px; + display: flex; + align-items: center; + justify-content: center; + visibility: visible; +` + +export const Row = styled.div` + position: absolute; + top: -25px; + left: 10px; + display: flex; + justify-content: space-between; + align-items: center; + width: ${props=>props.$width}px; + gap: 5px; + padding-right: 10px; + + p{ + margin: 0; + } +` + +export const CollapseButton = styled.p` + padding: unset; + background: none; + color: ${(props)=>props.theme.textColor}; + margin-right: 15px !important; + &:hover{ + background: none; + } +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/networkNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/networkNode.tsx new file mode 100644 index 0000000..0c0bfa4 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/networkNode.tsx @@ -0,0 +1,110 @@ +import React, { useEffect, useState } from 'react'; +import { Handle, Position } from '@xyflow/react'; +import { Network, TitleContainer, Device, Status, Content, Row, MAC, LabelColumn } from './style'; +import SignalSVG from '../../../../UI/signalSvg'; + +interface CustomNodeProps { + data: { + networkData: { + device: string + type: string + mac: string + mtu: number + state: string + connection: string + id: string, + strength: string + } + style: { + width: any, + height: any, + borderType: string, + borderColor: string, + backgroundColor: string + } + height: string + visible: true + }; +} + +export const NetWorkNode = ({ data }: CustomNodeProps) => { + const [signal, setSignal] = useState(1); + + useEffect(() => { + const perc = Number(data.networkData.strength); + + switch (true) { + case perc < 20: + setSignal(1); + break; + case perc < 40: + setSignal(2); + break; + case perc < 60: + setSignal(3); + break; + case perc < 80: + setSignal(4); + break; + default: + setSignal(5); + break; + } + + }, [data.networkData.strength]) + + return ( + + + + {data.networkData.type == "WIFI" && + + } + + {data.networkData.type == "ETHERNET" && + + } + + {data.networkData.type == "TUN" && + + } + + {data.networkData.device} + + {data.networkData.type == 'WIFI' && data.networkData.state === "Подключено" ? ( + + + + ) : ( +
+ ) + } + + + + {data.visible && + + +

Конфигурация

+ + +

MAC:

+

{data.networkData.mac}

+ + +

MTU:

+

{data.networkData.mtu}

+ + + + + } + + {data.networkData.connection !== 'unknown' && + + } + + ); +}; + +export default NetWorkNode \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/style.ts new file mode 100644 index 0000000..f73753f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/networkNode/style.ts @@ -0,0 +1,93 @@ +import styled from "styled-components"; + +type Props = { + $width?: string, + $height?: any + $bordertype?: string, + $bordercolor?: string + $backgroundcolor?: string +} + +export const Network = styled.div` + background-color: ${(props) => props.theme.primary}; + border: 2px ${(props) => props.$bordertype} ${(props) => props.$bordercolor}; + min-width: ${(props) => props.$width}px; + height: ${(props) => typeof props.$height === 'number' ? `${props.$height}px` : props.$height}; + border-radius: 8px; + display: flex; + flex-direction: column; + gap: 10px; + visibility: visible; + overflow: hidden; + p{ + margin: 0; + } +` + +export const TitleContainer = styled.div` + display: flex; + justify-content: space-between; + align-items: center; + background: ${(props) => props.$backgroundcolor}; + color: white; + padding: 15px; + height: ${(props) => props.$height ? props.$height : 'unset'}; + + img{ + width: 20px + } +` + +export const Device = styled.p` + font-size: 18px; +` + +export const Status = styled.p` + font-size: 14px; + + + img{ + width: 20px; + height: 20px; + } +` + +export const Content = styled.div` + display: flex; + flex-direction: column; + gap: 15px; + padding: 15px; +` + +export const Row = styled.div` + display: flex; + gap: 5px; +` + +export const MAC = styled.div` + display: flex; + justify-content: space-between; + background: ${(props) => props.theme.secondary}; + border-radius: 8px; + // box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.1); + width: 100%; + + .networkNode-row{ + padding: 10px; + } +` + +export const LabelColumn = styled.div` + display: flex; + flex-direction: column; + align-items: center; + gap: 5px; + width: 100%; + + .networkNode-label{ + font-size: 10px; + width: 100%; + text-align: left; + margin-left: 15px; + } +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/portNode.tsx b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/portNode.tsx new file mode 100644 index 0000000..68939f7 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/portNode.tsx @@ -0,0 +1,48 @@ +import { Handle, Position } from '@xyflow/react'; +import { Port, Column } from './style'; + +interface CustomNodeProps { + data: { + label: string; + port: string + id: string; + style: { + width: any; + height: any; + borderType: any; + borderColor: any; + } + }; +} + +export const PortNode = ({ data }: CustomNodeProps) => { + return ( + + + +

{data.label}

+ + + {data.port && +

{data.port}

+ } + + + + {data.port ? ( + <> + + + + + ) : ( + <> + + + + + )} + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/style.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/style.ts new file mode 100644 index 0000000..17a1b0f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/nodes/networkInterface/portNode/style.ts @@ -0,0 +1,30 @@ +import styled from "styled-components" + +type Props={ + $width: string, + $height?: any + $bordertype: string, + $bordercolor: string +} + +export const Port = styled.div` + background-color: ${(props)=>props.theme.primary}; + border: 2px ${(props) => props.$bordertype} ${(props) => props.$bordercolor}; + width: ${(props) => props.$width}px; + height: ${(props) => typeof props.$height === 'number' ? `${props.$height}px` : props.$height}; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; + visibility: visible; +` + +export const Column = styled.div` + display: flex; + flex-direction: column; + gap: 15px; + + p{ + margin: 0; + } +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/types/colors.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/types/colors.ts new file mode 100644 index 0000000..342c6f7 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/types/colors.ts @@ -0,0 +1,11 @@ +type ColorType = Record; + +export const NodeColors: ColorType = { + '0': '#c0c0c0', + '1': '#ef6e7d', + '2': '#f19e4c', + '3': '#e9c44c', + '4': '#51ce82', + '5': '#4cd2d0', + '6': '#a085f3', +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/customeNodes/types/types.ts b/FRONT/BUILD/resources/app/src/components/customeNodes/types/types.ts new file mode 100644 index 0000000..5b7ce87 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/customeNodes/types/types.ts @@ -0,0 +1,16 @@ + +import { DefaultNode, PillNode, ParalelorgamNode, DiamondNode, CircleNode } from '../nodes/baseForm' +import { NodeGroupNode, NetWorkNode, IpGroupeNode, IpNode, PortNode } from '../nodes/networkInterface'; + +export const nodeTypes = { + custom: DefaultNode, + pill: PillNode, + parallelogram: ParalelorgamNode, + diamond: DiamondNode, + circle: CircleNode, + nodegroup: NodeGroupNode, + portNode: PortNode, + network: NetWorkNode, + ipgroup: IpGroupeNode, + ip: IpNode, +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modal.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modal.tsx new file mode 100644 index 0000000..b030ace --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modal.tsx @@ -0,0 +1,10 @@ +import { ModalWindow, ModalContainer } from "./style" +import { modalNames } from "../../const/modals/names" + +export const WindowComponent = ()=>{ + return( + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ConnectNetwork.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ConnectNetwork.tsx new file mode 100644 index 0000000..ff3532f --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ConnectNetwork.tsx @@ -0,0 +1,84 @@ +// components/modalContainers/NoteDevice.tsx +import { ModalContainer, ModalTitle, ModalContent, ButtonContainer } from "../style"; +import { MainButton } from "../../UI/buttons/mainButton"; +import Input from "../../UI/inputs/input"; +import { useState } from "react"; +import {NetworkService} from "../../../api/request"; +import useNetworkStore from "../../../store/useDeviceStore"; +import RouterLoader from "../../UI/routerLoader"; +import {useTheme} from "styled-components"; +import {useIpStore} from "../../../store"; + +interface Props { + address: string; + onClose: () => void; +} + + + +export const ConnectNetwork = ({address, onClose}: Props) => { + const [password, setPassword] = useState(''); + const theme = useTheme(); + const { ipAddress } = useIpStore(); + const [error, setError] = useState(''); + const [isLoading, setIsLoading] = useState(false); + + const handleSave = async () => { + try { + setIsLoading(true); + setError('') + const res = await NetworkService.connectNetwork(ipAddress, password, address); + if(res.status === 200) { + onClose() + }else{ + setError(res.data.detail) + } + } catch (error) { + console.error('Error connection:', error); + setError('Ошибка подключения к сети') + }finally { + setIsLoading(false); + } + }; + + + return ( + + +

Подключение к сети

+ + + + setPassword(value)} + /> +

+ {error} +

+ + + + + + + + {isLoading && } + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteDevice.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteDevice.tsx new file mode 100644 index 0000000..6d0b666 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteDevice.tsx @@ -0,0 +1,82 @@ +// components/modalContainers/NoteDevice.tsx +import { ModalContainer, ModalTitle, ModalContent, ButtonContainer } from "../style"; +import { MainButton } from "../../UI/buttons/mainButton"; +import Input from "../../UI/inputs/input"; +import { useState } from "react"; +import {useIpStore} from "../../../store"; +import {NetworkService} from "../../../api/request"; +import useNetworkStore from "../../../store/useDeviceStore"; + +interface Props { + address: string; + onClose: () => void; + currentNote?: string; + type: string +} + + + +export const NoteDevice = ({ address, onClose, currentNote, type}: Props) => { + const [note, setNote] = useState(currentNote || ''); + const { ipAddress } = useIpStore(); + const { devices, setDevices } = useNetworkStore(); + + const handleSave = async () => { + try { + if (!currentNote && note.trim() !== '') { + await NetworkService.addNote(ipAddress, address, note, type); + }else if (currentNote && note.trim() !== '' && note !== currentNote) { + await NetworkService.editNote(ipAddress, address, note, type); + }else if (currentNote && note.trim() === '') { + await NetworkService.deleteNote(ipAddress, address, type); + }else { + onClose(); + return; + } + + const updatedDevices = devices.map(device => + device.mac === address + ? { ...device, note: note.trim() } + : device + ); + setDevices(updatedDevices); + onClose(); + + } catch (error) { + console.error('Error saving note:', error); + } + }; + + return ( + + +

{currentNote ? 'Редактирование заметки' : 'Добавление заметки'}

+ + + + setNote(value)} + /> + + + + + + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteWifi.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteWifi.tsx new file mode 100644 index 0000000..c03a48a --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/NoteWifi.tsx @@ -0,0 +1,82 @@ +// components/modalContainers/NoteDevice.tsx +import { ModalContainer, ModalTitle, ModalContent, ButtonContainer } from "../style"; +import { MainButton } from "../../UI/buttons/mainButton"; +import Input from "../../UI/inputs/input"; +import { useState } from "react"; +import {NetworkService} from "../../../api/request"; +import useNetworkStore from "../../../store/useDeviceStore"; +import {useIpStore} from "../../../store"; + +interface Props { + address: string; + onClose: () => void; + currentNote?: string; + type: string +} + + + +export const NoteWifi = ({ address, onClose, currentNote, type}: Props) => { + const [note, setNote] = useState(currentNote || ''); + const { ipAddress } = useIpStore(); + const { wifiNetworks, setWifiNetworks } = useNetworkStore(); + + const handleSave = async () => { + try { + if (!currentNote && note.trim() !== '') { + await NetworkService.addNote(ipAddress, address, note, type); + }else if (currentNote && note.trim() !== '' && note !== currentNote) { + await NetworkService.editNote(ipAddress, address, note, type); + }else if (currentNote && note.trim() === '') { + await NetworkService.deleteNote(ipAddress, address, type); + }else { + onClose(); + return; + } + const updatedNetworks = wifiNetworks.map(network => + network.ssid === address + ? { ...network, note: note.trim() } + : { ...network } + ); + setWifiNetworks(updatedNetworks); + onClose(); + + } catch (error) { + console.error('Error saving note:', error); + } + }; + + + return ( + + +

{currentNote ? 'Редактирование заметки' : 'Добавление заметки'}

+ + + + setNote(value)} + /> + + + + + + + + ); +}; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/addDevice.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/addDevice.tsx new file mode 100644 index 0000000..5611792 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/addDevice.tsx @@ -0,0 +1,58 @@ +import Input from "../../UI/inputs/input" +import { MainButton } from "../../UI/buttons/mainButton"; +import { useState } from "react"; +import { ModalContainer, ModalTitle, ModalContent, ModalText, ButtonContainer } from "../style" +import { validateIPAddress } from "../../../utils/nodeController/validator"; + +interface Props { + onSave?: (data: string) => void; + onClose: () => void; +} + +export const AddDevice = ({ onSave, onClose }: Props) => { + const [ipAddress, setIpAddress] = useState('') + const [error, setError] = useState(false) + + const handleSubmit = () => { + if (!validateIPAddress(ipAddress)) { + setError(true) + return; + } + // e.preventDefault(); // Предотвращаем перезагрузку страницы + if (onSave && ipAddress) { + setError(false) + onSave(ipAddress); + onClose(); + } + }; + + return ( + + {/* */} + +

Добавление узла

+ + + + setIpAddress(value)} + /> + {error && ( +

+ Некорректный адрес узла +

+ )} + + + + + + + {/* */} + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/connectionError.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/connectionError.tsx new file mode 100644 index 0000000..224ba6e --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/connectionError.tsx @@ -0,0 +1,38 @@ +import { ModalContainer, ModalTitle, ModalContent, ModalText, ButtonContainer } from "../style" +import { useModalContext } from "../../../store" +import { useIpStore } from "../../../store" +import { MainButton } from "../../UI/buttons/mainButton" + +type Props={ + message: string +} + +export const ConnectionError = ({message}: Props)=>{ + const {closeModal} = useModalContext() + const { setIpAddress } = useIpStore(); + + const close = ()=>{ + setIpAddress('localhost') + closeModal() + } + + return( + + +

Соединение прервано

+ + + + +

Произошёл разрыв с сервером

+

Пожалуйста, проверьте доступ к адресу и попробуйте снова.

+ + + + + + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/disconnectConfirm.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/disconnectConfirm.tsx new file mode 100644 index 0000000..148d657 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/disconnectConfirm.tsx @@ -0,0 +1,54 @@ +import { ModalContainer, ModalTitle, ModalContent, ModalText, ButtonContainer } from "../style" +import { useModalContext } from "../../../store" +import { useIpStore } from "../../../store" +import { MainButton } from "../../UI/buttons/mainButton" +import {useState} from "react"; +import {NetworkService} from "../../../api/request"; +import RouterLoader from "../../UI/routerLoader"; +import {useTheme} from "styled-components"; + +type Props={ + address: string, + onClose: () => void +} + +export const DisconnectConfirm = ({address, onClose}: Props)=>{ + const { ipAddress } = useIpStore(); + const theme = useTheme() + const [isLoading, setIsLoading] = useState(false); + + const handleDisconnect = async () => { + try { + setIsLoading(true); + const res = await NetworkService.disconnectNetwork(ipAddress, address); + if(res.status === 200) { + onClose() + } + } catch (error) { + console.error('Error connection:', error); + }finally { + setIsLoading(false); + } + }; + + return( + + +

Отключение от Wi-Fi сети

+ + + + +

Подтверждение отключения

+

Вы собираетесь отключиться от сети "{address}". Все активные подключения будут прерваны.

+ + + + + + + + {isLoading && } + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/index.ts b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/index.ts new file mode 100644 index 0000000..ed95168 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/index.ts @@ -0,0 +1,4 @@ +export {IpConfirm} from './ipConfirm' +export {ConnectionError} from './connectionError' +export {AddDevice} from './addDevice' +export {RightsConfirm} from './rightsConfirm' \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ipConfirm.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ipConfirm.tsx new file mode 100644 index 0000000..2e2b998 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/ipConfirm.tsx @@ -0,0 +1,211 @@ +import styled from "styled-components"; +import Loader from "../../UI/loader"; +import { useEffect, useState } from "react"; +import { changeIp } from '../../../const/types/types' +import { NetworkService } from '../../../api/request' +import { ModalContainer, ModalTitle, ModalContent, ModalText, ButtonContainer, ErrorMessage } from "../style" +import { useIpStore } from "../../../store"; +import { MainButton } from "../../UI/buttons/mainButton"; +import { useAdminStore } from "../../../store/adminStore"; +import { useDevicesStore } from "../../../store"; + +type Props = { + ipData: changeIp + onClose: () => void; + smoothClose: () => void; +} + +const Information = styled.div` + display: flex; + flex-direction: column; + gap: 15px; +` + +const Info = styled.div` + display: flex; + gap: 10px; +` + +const DataContainer = styled.div` + display: flex; + gap: 35px; +` + +const CurrentData = styled.div` + display: flex; + flex-direction: column; + gap: 10px; +` + +const NewData = styled.div` + display: flex; + flex-direction: column; + gap: 10px; +` + +export const IpConfirm = ({ ipData, onClose, smoothClose }: Props) => { + const [loader, setLoader] = useState(true) + const [newIP, setNewIp] = useState(null) + const [currentIp, setCurrentIP] = useState({}) + const [checkStatus, setcheckStatus] = useState(false) + const [message, setMessgae] = useState('') + const { ipAddress, setIpAddress } = useIpStore(); + const {isAdmin} = useAdminStore() + const { devices, addDevice, deleteDevice } = useDevicesStore(); + + useEffect(() => { + if (ipData && isAdmin) { + const data = { + "connection_id": ipData.connection, + "ipv4_updates": { + "ipv4.method": "manual", + "ipv4.address-data": [ + { + "address": ipData.newIp, + "prefix": ipData.prefix + } + ], + "ipv4.gateway": ipData.newGate, + "ipv4.dns-data": ipData.newDns + } + }; + + const oldData = { + "connection_id": ipData.connection, + "ipv4_updates": { + "ipv4.method": "manual", + "ipv4.address-data": [ + { + "address": ipData.currentIp, + "prefix": ipData.prefix + } + ], + "ipv4.gateway": ipData.currentGate, + "ipv4.dns-data": ipData.currentDns + } + } + + setCurrentIP(oldData) + + checkIp(data); + } + }, [ipData, isAdmin]); + + const checkIp = async (data: any) => { + try { + const result = await NetworkService.checkIp(ipAddress, data); + setcheckStatus(result.data.available) + setMessgae(result.data.message) + if (result.data.available) { + setNewIp(data) + } + } catch (err) { + console.error('Error:', err); + } finally { + setLoader(false); + } + }; + + const saveIp = async (data: any) => { + try { + const result = await NetworkService.saveIp(ipAddress, data); + if (result.status === 200) { + if(ipAddress!=='localhost'){ + setIpAddress(ipData.newIp) + + const updatedDevices = devices.map(device => + device.address === ipData.currentIp + ? { ...device, address: ipData.newIp } + : device + ); + useDevicesStore.setState({ devices: updatedDevices }); + } + + onClose() + } + } catch (err) { + console.error('Error:', err); + } finally { + setLoader(false); + } + }; + + const cancelIp = async (data: any) => { + try { + const result = await NetworkService.saveIp(ipAddress, data); + if (result.status === 200) { + onClose() + } + } catch (err) { + console.error('Error:', err); + } finally { + setLoader(false); + } + }; + + return ( + <> + {loader && isAdmin ? ( + + ) : ( + + +

Изменение IP-Адреса

+ + {checkStatus ? ( + + +

Общие сведения

+ +

Интерфейс: {ipData.device}

+

--{'>'}

+

{ipData.connection}

+ +

Сведения об IP

+ + +

Текущий ip: {ipData.currentIp}

+

Текущий шлюз: {ipData.currentGate}

+

Текущий DNS: {ipData.currentDns}

+ + + +

Новый ip: {ipData.newIp}

+

Новый шлюз: {ipData.newGate}

+

Новый DNS: {ipData.newDns}

+ + + + + + cancelIp(currentIp)}/> + saveIp(newIP)}/> + + + ) : ( + <> + + + {isAdmin ? ( + <> +

Произошла ошибка проверки корректности

+ {message} + + + ):( +

Для изменения сетевых настроек необходимо авторизироваться под администратором

+ )} + + + + + + + + + )} + + )} + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/rightsConfirm.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/rightsConfirm.tsx new file mode 100644 index 0000000..24351dd --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalContainers/rightsConfirm.tsx @@ -0,0 +1,135 @@ +import { useEffect, useState } from "react" +import { ModalContainer, ModalTitle, ModalContent, ModalText, ButtonContainer } from "../style" +import Input from "../../UI/inputs/input" +import { MainButton } from "../../UI/buttons/mainButton" +import { NetworkService } from "../../../api/request" +import { useIpStore } from "../../../store" +import { useAdminStore } from "../../../store/adminStore" +import { useCheckAdmin } from "../../../utils/checkAdmin" + +import { buttonNames } from "../../../const/buttons/names" +import { IconComponent } from "../../../const/buttons/icons" + +interface Props { + onClose: () => void; +} + +export const RightsConfirm = ({ onClose }: Props) => { + + const { ipAddress } = useIpStore(); + const { isAdmin, setAdmin } = useAdminStore() + const checkAdmin = useCheckAdmin(); + const [error, setError] = useState(false) + const [success, setSuccess] = useState({ + message: '', + status: false + }) + + const [user, setUser] = useState({ + username: 'operator', + password: "" + }) + + const handleChange = (id: string, value: string) => { + setUser(prevData => ({ + ...prevData, + [id]: value + })); + } + + const login = async (user: object) => { + try { + const response = await NetworkService.login(ipAddress, user); + if(response.status === 200){ + await checkAdmin(); + setError(false) + setSuccess(prevData => ({ + ...prevData, + message: 'Успешный вход', + status: true + })); + await new Promise(resolve => setTimeout(resolve, 3000)); + onClose(); + }else{ + setError(true) + } + } catch (err) { + console.error('Error:', err); + } + } + + const logout = async () => { + await NetworkService.logout(ipAddress); + await checkAdmin(); + setSuccess(prevData => ({ + ...prevData, + message: 'Успешный выход', + status: true + })); + await new Promise(resolve => setTimeout(resolve, 3000)); + onClose(); + } + + return ( + + {!success.status ? ( + !isAdmin ? ( + <> + +

Получение прав доступа

+ + + + +

Включить административный доступ

+ handleChange('password', value)} + /> + + {error && ( +

+ Неверный пароль оператора +

+ )} + + + + + + login(user)} /> + + + ) : ( + <> + +

Переключиться на ограниченный доступ

+ + + +

В данном режиме доступа ограничиваются полномочия администратора.

+ + + + + + + + + ) + ):( + + +

{success.message}

+

Это окно можно закрыть, либо оно пропадёт само

+ + + )} + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/modalWindow.tsx b/FRONT/BUILD/resources/app/src/components/modalwindows/modalWindow.tsx new file mode 100644 index 0000000..7edf179 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/modalWindow.tsx @@ -0,0 +1,81 @@ +import { useModalContext } from "../../store"; +import { IpConfirm, ConnectionError, AddDevice, RightsConfirm } from "./modalContainers"; +import { ModalMap } from "./windowsType"; +import Loader from "../UI/loader"; +import { ModalWindow } from "./style"; +import {NoteDevice} from "./modalContainers/NoteDevice"; +import { NoteWifi } from "./modalContainers/NoteWifi"; +import {ConnectNetwork} from "./modalContainers/ConnectNetwork"; +import {DisconnectConfirm} from "./modalContainers/disconnectConfirm"; + +type Props = { + isOpen: boolean, + type: string + data: any; +} + +export default function WindowComponent({ isOpen, type, data }: Props) { + + const { closeModal, closeLoader } = useModalContext() + + return ( + <> + {isOpen && + + {type == ModalMap['1'] && data && + + } + + {type == ModalMap['2'] && + + } + + {type === ModalMap['3'] && + + } + {type === ModalMap['6'] && ( + + )} + {type === ModalMap['7'] && ( + + )} + {type === ModalMap['8'] && ( + + )} + {type === ModalMap['9'] && ( + + )} + {type === ModalMap['4'] && ( + + )} + + {type === ModalMap['5'] && ( + + )} + + } + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/style.ts b/FRONT/BUILD/resources/app/src/components/modalwindows/style.ts new file mode 100644 index 0000000..2b75bd3 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/style.ts @@ -0,0 +1,70 @@ +import styled from "styled-components"; + +export const ModalWindow = styled.div` + width: 100%; + position: fixed; + top: 0; + left: 0; + z-index: 9999; + background-color: rgba(0, 0, 0, 0.8); + display: flex; + align-items: center; + justify-content: center; + height: 100%; +` + +export const ModalContainer = styled.div<{height?: string}>` + border-radius: 12px; + background: ${(props)=>props.theme.secondary}; + color: ${(props=>props.theme.textColor)}; + position: relative; + max-height: 100%; + overflow: auto; + display: flex; + flex-direction: column; + justify-content: space-between; + gap: 15px; + height: ${(props) => props.height ? props.height : '230px'}; + width: 520px; +` + +export const ModalTitle = styled.div` + padding: 20px; + border-bottom: 1px solid #9D9D9D; + display: flex; + justify-content: space-between; + + h3{ + font-size: 18px; + } +` + +export const ModalContent = styled.div` + padding: 0 20px; + + h3{ + font-size: 14px; + } + + p{ + font-size: 12px; + } +` + +export const ModalText = styled.div` + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 10px; +` + +export const ErrorMessage = styled.p` + color: #d95454; +` + +export const ButtonContainer = styled.div` + justify-content: flex-end; + display: flex; + gap: 10px; + padding: 10px 20px 20px; +` \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/modalwindows/windowsType.ts b/FRONT/BUILD/resources/app/src/components/modalwindows/windowsType.ts new file mode 100644 index 0000000..ae6d760 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/modalwindows/windowsType.ts @@ -0,0 +1,13 @@ +export type ModalType = Record; + +export const ModalMap: ModalType = { + '1': 'ipConfirm', + '2': 'loader', + '3': 'connectionError', + '4': 'addDevice', + '5': 'sudo', + '6': 'noteDevice', + '7': 'noteWifi', + '8': 'connectNetwork', + '9': 'disconnectConfirm', +} diff --git a/FRONT/BUILD/resources/app/src/components/register.tsx b/FRONT/BUILD/resources/app/src/components/register.tsx new file mode 100644 index 0000000..a043285 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/register.tsx @@ -0,0 +1,194 @@ +import { ModalContainer, ModalTitle, ModalContent, ModalText } from "./modalwindows/style" +import Input from "./UI/inputs/input" +import { MainButton } from "./UI/buttons/mainButton" +import styled from "styled-components" +import { useEffect, useState } from "react" +import { useIpStore } from "../store" +import { NetworkService } from "../api/request" +import { IconComponent } from "../const/buttons/icons" +import { buttonNames } from "../const/buttons/names" +import ThemeButton from "./UI/buttons/toggletheme" +import About from "./workSpace/modules/appModules/about" + +const Wrapper = styled.div` + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 100%; + background: ${(props) => props.theme.background}; +` + +const Container = styled.form` + display: flex; + flex-direction: column; + gap: 25px; + align-items: center; + background: ${(props) => props.theme.primary}; + padding: 25px; + border-radius: 18px; + width: 350px; +` + +const Title = styled.div` + display: flex; + flex-direction: column; + gap: 15px; + align-items: center; + text-align: center; + font-size: 20px; +` + +const Content = styled.div` + display: flex; + flex-direction: column; + gap: 25px; + text-align: center; +` + +const ButtonContainer = styled.div` + width: 100%; + display: flex; + justify-content: center; +` + +const Menu = styled.div` + display: flex; + align-items: center; +` + +const Button = styled.div` + width: 100%; + cursor: pointer; +` + +const IconContainer = styled.div` + padding: 10px; + color: ${props => props.theme.text}; +` + +export const CreateUser = () => { + + const { ipAddress, setIpAddress } = useIpStore(); + const [repeatPassword, setRepeatPassword] = useState(''); + const [passwordsMatch, setPasswordsMatch] = useState(true); + const [about, setAbout] = useState(false) + + const [user, setUser] = useState({ + username: 'operator', + password: '', + is_admin: true + }) + + const handleChange = (id: string, value: string) => { + if (id === 'repeatPassword') { + setRepeatPassword(value); + setPasswordsMatch(user.password === value); + } else { + setUser(prevData => ({ + ...prevData, + [id]: value + })); + if (id === 'password') { + setPasswordsMatch(value === repeatPassword); + } + } + } + + const handleSave = async (user: object) => { + try { + const result = await NetworkService.createUser(ipAddress, user); + if (result.status === 200) { window.location.reload() } + } catch (err) { + console.error('Error:', err); + } + } + + const handleSubmit = () => { + if (passwordsMatch) { + handleSave(user); + } + }; + + const back = ()=>{ + setIpAddress('localhost') + } + + const toAbout = ()=>{ + setAbout(true) + } + return ( + + <> + {!about ? ( + + + + + <IconComponent name={buttonNames[3]} width="52" height="52"></IconComponent> + <h3>Настройка оператора узла</h3> + {ipAddress != 'localhost' && + <p>{ipAddress}</p> + } + + + + + +
+

Перед началом работы необходимо создать пароль оператора приложения

+
+ +
+ handleChange('password', value)} + /> + + handleChange('repeatPassword', value)} + style={{ marginTop: '10px' }} + /> + {!passwordsMatch && ( +

+ Пароли не совпадают! +

+ )} +
+ + + + + + + + + + + + + {ipAddress != 'localhost' && + + } + + + + + ): ( + setAbout(false)} /> + )} + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/about.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/about.tsx new file mode 100644 index 0000000..57207b9 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/about.tsx @@ -0,0 +1,213 @@ + +import { MainButton } from "../../../UI/buttons/mainButton" +import { workSpaceNames } from "../../../../const/workspace/names" +import { useWorkSpaceStore } from "../../../../store" +import styled from "styled-components" +import ThemeButton from "../../../UI/buttons/toggletheme" + +type Props = { + from: 'reg' | 'helloWindow' | 'workSpace' + onBack?: () => void +} + +const Wrapper = styled.div` + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 100%; + width: 100%; + background: ${(props => props.theme.background)}; + padding: 50px; + box-sizing: border-box; +` + +const Content = styled.div` + max-width: 1200px; + display: flex; + flex-direction: column; + justify-content: space-between; + height: 100%; + box-sizing: border-box; + padding: 25px 50px; + background: ${(props => props.theme.secondary)}; + border-radius: 18px; +` + +const Listing = styled.div` + display: flex; + flex-direction: column; + gap: 15px; + +` + +const List = styled.div` + display: flex; + flex-direction: column; + gap: 15px; + margin-left: 10px; +` + +const Title = styled.div` + font-size: 20px; +` + +const SubTitle = styled.div` + display: flex; + flex-direction: column; + gap: 10px; + + p{ + font-size: 18px; + } + +` + +const Links = styled.div` + display: flex; + flex-direction: column; + gap: 20px; +` + +const LinkColumn = styled.div` + display: flex; + flex-direction: column; + gap: 10px; +` + + +const LinkBlock = styled.div` + display: flex; + gap: 5px; +` + +const Copyright = styled.div` + width: 100%; + text-align: center; + margin-top: 50px; +` + +const ButtonContainer = styled.div` + width: 100%; + display: flex; + justifi-content: flex-start; + align-items: center; +` + +const MainTitle = styled.div` + width: 100%; + display: flex; + gap: 15px; + align-items: center; + justify-content: center; + padding-top: 50px; + box-sizing: border-box; + + img{ + width: 40px; + height: 40px; + } +` +const Text = styled.div` + display: flex; + flex-direction: column; + gap: 30px; +` + +export default function About({ from, onBack }: Props) { + const { setWorkModule } = useWorkSpaceStore() + + const getBackHandler = () => { + switch (from) { + case 'reg': + return onBack + case 'helloWindow': + return () => setWorkModule(workSpaceNames[1]) + case 'workSpace': + return () => setWorkModule(workSpaceNames[3]) + default: + return undefined + } + } + + const backHandler = getBackHandler() + const showBackButton = from !== 'reg' || (from === 'reg' && onBack) + + return ( + + + + + +

О приложении

+ + + + + + + + <p>Приложение ГоNets является минимально работоспособным кроссплатформенным продуктом (MVP) для демонстрации нашего подхода к управлению настройками ПК в корпоративной среде.</p> + + + + +

Данное приложение умеет:

+ +

- Отображать в графическом виде активные сетевые ресурсы

+

- Настраивать сетевые параметры локального и удаленных сетевых ресурсов

+

- Отображать и изменять взаимодействие сетевых ресурсов с установленным Клиентом ГоNets

+ + + + +

Программное обеспечение исключительно для ознакомления и домашнего использования.

+

Для коммерческого использования приобретите версию ГоNets-PRO (Подробная информация на странице продукта)

+ + + + +

Ссылка на домашнюю страницу:

+ https://gossys.dev/pages/projects/gonets + + + +

Инструкции и информация:

+ https://wiki.gossys.dev/ru/gonets + + + +

Распространяется под лицензией GosysPUB текущей версии.

+ +

Полный текст актуальной лицензии:

+ https://wiki.gossys.dev/ru/lic/GosysPUB + + + + + + +

Разработано и поддерживается ООО «Гибридные Офисные Системы» 2024-2025 г. Все права защищены.

+ + + + + + + {showBackButton && backHandler && ( + + )} + + {from == 'reg' && + + } + + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/header.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/header.tsx new file mode 100644 index 0000000..356764b --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/header.tsx @@ -0,0 +1,46 @@ +import styled from "styled-components" +import { IconComponent } from "../../../../const/buttons/icons" +import { buttonNames } from "../../../../const/buttons/names" +import { useWorkSpaceStore } from "../../../../store" +import { useModalContext } from "../../../../store" +import { useAdminStore } from "../../../../store/adminStore" +import { ModalMap } from "../../../modalwindows/windowsType" +import { QuitButton } from "../../../UI/buttons/quitButton" +import { usePosStore } from "../../../../store/posStore" + +const Container = styled.div` + display: flex; + align-items: center; + justify-content: flex-end; + background-color: ${(props) => props.theme.primary}; + padding: 0 5px; +` + +const ButtonContainer = styled.div` + display: flex; + align-items: center; +` + +const IconContainer = styled.div` + padding: 10px; + + svg{ + cursor: pointer; + } +` + +export const Header = () => { + const {setNullPos} = usePosStore() + + return ( + + + + setNullPos(true)}/> + + + + + + ) +} \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/helloWindow.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/helloWindow.tsx new file mode 100644 index 0000000..0a09826 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/helloWindow.tsx @@ -0,0 +1,82 @@ + import styled from "styled-components" + import { MainButton } from "../../../UI/buttons/mainButton" + import { useWorkSpaceStore } from "../../../../store" + import { workSpaceNames } from "../../../../const/workspace/names" + import { buttonNames } from "../../../../const/buttons/names" + + const Wrapper = styled.div` + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + background-color: ${(props => props.theme.background)}; + background-image: url('./assets/images/back1.svg'); + background-size: 100%; + background-repeat: no-repeat; + background-position: bottom; + ` + + const Container = styled.div` + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 52px; + margin-bottom: 100px; + ` + + const ButtonWrapper = styled.div` + display: flex; + gap: 75px; + flex-direction: column; + ` + + const ButtonContainer = styled.div` + display: flex; + gap: 15px; + flex-direction: column; + ` + + const Title = styled.div` + display: flex; + align-items: flex-end; + gap: 10px; + + h1{ + font-size: 52px; + } + ` + + export const HelloWindow = () => { + + const { setWorkModule } = useWorkSpaceStore() + + return ( + + + + <img src="./assets/images/logo.svg" alt="" style={{width: '152px'}}/> + + + + + + setWorkModule(workSpaceNames[3])} + /> + setWorkModule(workSpaceNames[4])} + /> + + + + + ) + } \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx new file mode 100644 index 0000000..1075a09 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx @@ -0,0 +1,73 @@ +import React from 'react'; +import styled from 'styled-components'; +import DeviceCard from "../../../../../UI/Dropdown/DeviceCard"; +import {DeviceUser} from "../../../../../../store/useDeviceStore"; + +const ScanBtn = styled.button` + position: relative; + padding: 14px 22px; + background-color: #4CAF50; + color: white; + border: none; + border-radius: 12px; + font-size: 18px; + transition: .4s ease; + &:hover{ + transform: scale(1.03); + } +` + +interface ListUsersProps { + loading: boolean; + handleScan: ()=>void; + devices: DeviceUser[]; + scanInitiated: boolean; +} + +const ListUsers = ({loading, handleScan, devices, scanInitiated}: ListUsersProps) => { + const activeDevices = devices.filter(device => device.status === 'online'); + const inactiveDevices = devices.filter(device => device.status !== 'online'); + + return ( + <> + + {devices.length > 0 ? 'Обновить список' : 'Сканировать сеть'} + + + {devices.length > 0 ? ( +
+ {/* Колонка активных устройств */} +
+

Активные устройства ({activeDevices.length})

+ {activeDevices.map((device, index) => ( + + ))} +
+ {/* Колонка неактивных устройств */} +
+

Неактивные устройства ({inactiveDevices.length})

+ {inactiveDevices.map((device, index) => ( + + ))} +
+
+ ) : scanInitiated ? ( +

Устройства не найдены

+ ) : null} + + ); +}; + +export default ListUsers; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/TableUsers.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/TableUsers.tsx new file mode 100644 index 0000000..ebe71a9 --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/modules/TableUsers.tsx @@ -0,0 +1,45 @@ +import React from 'react'; +import styled from 'styled-components'; +import DeviceCard from "../../../../../UI/Dropdown/DeviceCard"; +import {DeviceUser} from "../../../../../../store/useDeviceStore"; +import TableScanner from "../../../../../UI/tables/TableScanner"; + +const ScanBtn = styled.button` + position: relative; + padding: 14px 22px; + background-color: #4CAF50; + color: white; + border: none; + border-radius: 12px; + font-size: 18px; + transition: .4s ease; + &:hover{ + transform: scale(1.03); + } +` + +interface ListUsersProps { + loading: boolean; + handleScan: ()=>void; + devices: DeviceUser[]; + scanInitiated: boolean; +} + +const ListUsers = ({loading, handleScan, devices, scanInitiated}: ListUsersProps) => { + + return ( + <> + + {devices.length > 0 ? 'Обновить список' : 'Сканировать сеть'} + + + {devices.length > 0 ? ( + + ) : scanInitiated ? ( +

Устройства не найдены

+ ) : null} + + ); +}; + +export default ListUsers; \ No newline at end of file diff --git a/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/userScanner.tsx b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/userScanner.tsx new file mode 100644 index 0000000..cb816ca --- /dev/null +++ b/FRONT/BUILD/resources/app/src/components/workSpace/modules/appModules/usersScanner/userScanner.tsx @@ -0,0 +1,191 @@ +import { useIpStore } from "../../../../../store"; +import styled, { keyframes } from "styled-components"; +import { useState } from "react"; +import { NetworkService } from "../../../../../api/request"; +import ListUsers from "./modules/ListUsers"; +import TableUsers from "./modules/TableUsers"; +import DropdownType from "../../../../UI/Dropdown/DropdownType"; +import useNetworkStore from "../../../../../store/useDeviceStore"; + +type Option ={ + value: number, + label: string, +} + +// Анимации +const ring1 = keyframes` + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.12; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.2; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.12; } +`; + +const ring2 = keyframes` + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.08; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.15; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.08; } +`; + +const ring3 = keyframes` + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.04; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.1; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.04; } +`; +const dotAnimation = keyframes` + 0% { content: '.'; } + 33% { content: '..'; } + 66% { content: '...'; } + 100% { content: '.'; } +`; +const pulse = keyframes` + 0% { transform: translate(-50%, -50%) scale(1); } + 50% { transform: translate(-50%, -50%) scale(1.1); } + 100% { transform: translate(-50%, -50%) scale(1); } +`; + +// Стили +const Wrapper = styled.div<{ scanInitiated: boolean, loading: boolean}>` + display: flex; + flex-direction: column; + align-items: center; + justify-content:${({scanInitiated, loading})=>(scanInitiated && !loading ? 'start' : 'center')}; + height: 100%; + width: 100%; + background: ${(props) => props.theme.background}; + padding: 50px; + box-sizing: border-box; + gap: 24px; + transition: justify-content .4s ease; + overflow-y: auto; + overflow-x: hidden; + position: relative; +`; +const TitleWrapper = styled.h2` + position: absolute; + top: 20px; + left: 50%; + transform: translateX(-50%); + font-size: 32px; + width: max-content; +` +const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` + width: 60px; + height: 60px; + border-radius: 50%; + position: relative; + transition: .4s ease; + transform: ${({scanInitiated,loading})=>(scanInitiated && !loading ? 'scale(0)' : 'scale(1)')}; + span { + position: absolute; + display: inline-block; + background: ${(props) => props.theme.accent}; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + border-radius: 50%; + &.center { + width: 60px; + height: 60px; + animation: ${({ loading }) => (loading ? pulse : "none")} 2s ease infinite; + } + &.ring1 { + opacity: 0.12; + width: 250px; + height: 250px; + animation: ${({ loading }) => (loading ? ring1 : "none")} 4s linear infinite; + } + + &.ring2 { + opacity: 0.08; + width: 400px; + height: 400px; + animation: ${({ loading }) => (loading ? ring2 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.1s" : "0")}; + } + + &.ring3 { + opacity: 0.04; + width: 550px; + height: 550px; + animation: ${({ loading }) => (loading ? ring3 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.2s" : "0")}; + } + } +`; + +const LoadingText = styled.div` + position: relative; + padding: 14px 22px; + background-color: #4CAF50; + color: white; + border: none; + border-radius: 12px; + font-size: 18px; +`; +const ScanningText = styled.span` + &::after { + content: '.'; + animation: ${dotAnimation} 1.5s infinite; + } +`; + + +export default function UserScanner() { + const { ipAddress } = useIpStore(); + const [loading, setLoading] = useState(false); + const { devices, setDevices } = useNetworkStore(); + const [scanInitiated, setScanInitiated] = useState(devices.length > 0); + + // Сканирование + const handleScan = async () => { + try { + setLoading(true); + setScanInitiated(true); + const res = await NetworkService.scanUser(ipAddress); + console.log(res); + setDevices(res.data.devices || []); + } catch (err) { + console.error("Ошибка сканирования сети:", err); + setDevices([]) + } finally { + setLoading(false); + } + }; + + // Способ отображения + const viewOptions: Option[] = [ + { value: 1, label: 'Таблица' }, + { value: 2, label: 'Список' }, + ]; + const [selectedView, setSelectedView] = useState