db-avatar-init/api/public/js/bundle.js

<div align="center"> <a href="https://github.com/Alex2018-avatar/db-viewer"> <img width="200" height="200" src="https://cdn2.vectorstock.com/i/1000x1000/78/46/blue-database-icon-circle-frame-white-background-v-vector-20757846.jpg"> </a> <br>

!function(e){function n(n){for(var r,a,i=n[0],c=n[1],l=n[2],d=0,v=[];d<i.length;d++)a=i[d],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&v.push(o[a][0]),o[a]=0;for(r in c)Object.prototype.hasOwnProperty.call(c,r)&&(e[r]=c[r]);for(u&&u(n);v.length;)v.shift()();return s.push.apply(s,l||[]),t()}function t(){for(var e,n=0;n<s.length;n++){for(var t=s[n],r=!0,i=1;i<t.length;i++){var c=t[i];0!==o[c]&&(r=!1)}r&&(s.splice(n--,1),e=a(a.s=t[0]))}return e}var r={},o={0:0},s=[];function a(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.m=e,a.c=r,a.d=function(e,n,t){a.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,n){if(1&n&&(e=a(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var r in e)a.d(t,r,function(n){return e[n]}.bind(null,r));return t},a.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(n,"a",n),n},a.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},a.p="";var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=n,i=i.slice();for(var l=0;l<i.length;l++)n(i[l]);var u=c;s.push([132,1]),t()}({132:function(e,n,t){t(133),t(337),e.exports=t(336)},336:function(e,n,t){e.exports=t.p+"css/style.css"},337:function(e,n,t){"use strict";t.r(n);var r=t(45),o=t.n(r),s="".concat(WCParamJS.urlPrefixForHTTP,":").concat(WCParamJS.portDefault);function a(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var i=function(){function e(n){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.isAuth=this.isLogged()}var n,t,r;return n=e,(t=[{key:"isLogged",value:function(){return!!localStorage.getItem("WSC12019_TOKEN")}},{key:"checkSession",value:function(){this.isLogged()||window.location.reload()}},{key:"login",value:function(e){var n,t,r;return regeneratorRuntime.async((function(a){for(;;)switch(a.prev=a.next){case 0:return a.prev=0,n="".concat(s,"/dbs/v1/loginidentity"),a.next=4,regeneratorRuntime.awrap(o.a.post(n,e));case 4:t=a.sent,r=t.data,localStorage.setItem("WSC12019_TOKEN",r.token),window.location.reload(),a.next=13;break;case 10:a.prev=10,a.t0=a.catch(0),console.log(a.t0.message);case 13:case"end":return a.stop()}}),null,null,[[0,10]])}},{key:"logOut",value:function(){localStorage.removeItem("WSC12019_TOKEN"),window.location.reload()}}])&&a(n.prototype,t),r&&a(n,r),e}();function c(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var l=function(){function e(n){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.query=n}var n,t,r;return n=e,(t=[{key:"getResults",value:function(){var e,n;return regeneratorRuntime.async((function(t){for(;;)switch(t.prev=t.next){case 0:return t.prev=0,e={headers:{Authorization:"Bearer "+localStorage.getItem("WSC12019_TOKEN")}},t.next=4,regeneratorRuntime.awrap(o.a.get("".concat(s,"/dbs/v1/@all?q=").concat(this.query),e));case 4:n=t.sent,this.result=n.data,t.next=11;break;case 8:t.prev=8,t.t0=t.catch(0),console.log(t.t0);case 11:case"end":return t.stop()}}),null,this,[[0,8]])}}])&&c(n.prototype,t),r&&c(n,r),e}();function u(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var d=function(){function e(n){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.id=Date.now(),this.type=n.dbtype||"",this.connection={id:Date.now(),database:n.dbname||"",hostname:n.dbhost||"",port:n.dbport||"",user:n.dbuser||"",password:""},this.views=n.views||[]}var n,t,r;return n=e,(t=[{key:"saveDatabase",value:function(e){var n,t,r,a;return regeneratorRuntime.async((function(i){for(;;)switch(i.prev=i.next){case 0:return i.prev=0,n={headers:{Authorization:"bearer "+localStorage.getItem("WSC12019_TOKEN")}},t="".concat(s,"/dbs/v1/registerDB"),i.next=5,regeneratorRuntime.awrap(o.a.post(t,e,n));case 5:r=i.sent,a=r.data,console.log(a),i.next=13;break;case 10:i.prev=10,i.t0=i.catch(0),console.log(i.t0);case 13:case"end":return i.stop()}}),null,null,[[0,10]])}}])&&u(n.prototype,t),r&&u(n,r),e}();function v(e,n){for(var t=0;t<n.length;t++){var r=n[t];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var m=function(){function e(){!function(e,n){if(!(e instanceof n))throw new TypeError("Cannot call a class as a function")}(this,e),this.viewslist=[]}var n,t,r;return n=e,(t=[{key:"addView",value:function(e){var n={name:e.nameview,path:e.path||"",query:e.query||""};return this.viewslist.push(n),this.persistData(),n}},{key:"deleteView",value:function(e){var n=this.viewslist.findIndex((function(n){return n.name===e}));this.viewslist.splice(n,1),this.persistData()}},{key:"isviewInserted",value:function(e){return-1!==this.viewslist.findIndex((function(n){return n.name===e}))}},{key:"persistData",value:function(){localStorage.setItem("views",JSON.stringify(this.viewslist))}},{key:"getNumViews",value:function(){return this.viewslist.length}},{key:"readStorage",value:function(){var e=JSON.parse(localStorage.getItem("views"));e&&(this.viewslist=e)}}])&&v(n.prototype,t),r&&v(n,r),e}(),p=t(131),f=t.n(p),g={app:document.getElementById("app"),btnLogin:document.querySelector(".login_btn"),btnMenuRegister:document.querySelector(".btn-menu-register"),btnMenuUpdate:document.querySelector(".btn-menu-update"),searchForm:document.querySelector(".search"),searchBtnForm:document.querySelector(".search__btn"),searchRestList:document.querySelector(".results__list"),searchTable:document.querySelector(".table-content"),searchCbo:document.querySelector(".search__field"),registerForm:document.querySelector(".register"),registerFormInputs:document.querySelector(".register"),registerContainer:document.querySelector(".register-db"),viewsBtnForm:document.querySelector(".open-views-form"),viewsBtnAddItem:document.querySelector(".add-item-view"),viewResultForm:document.querySelector(".inserted-items"),inputsItemView:document.querySelectorAll(".input-item-view"),btnSaveDatabase:document.querySelector(".save_database_btn"),formViewjs:document.querySelector(".form-vw"),headerViewBtn:document.querySelector(".header-views-form"),logOutBtn:document.querySelector(".btn-log-out")},b={loader:"loader",loginForm:"login-form",btnMenuRegister:".btn-menu-register",searchBtnForm:".search__btn",searchTable:".table-content",searchCbo:".search__field",searchRestList:".results__list",viewsListContent:".viewss-list",registerContainer:".register-db",registerForm:".register",logOutBtn:".btn-log-out",registerFormInputs:".register",viewsBtnForm:".open-views-form",formViewjs:".form-vw",viewsBtnAddItem:".add-item-view",inputsItemView:".input-item-view",viewResultForm:".inserted-items"},h=function(e){return e.startsWith(".")||e.startsWith("#")?document.querySelector(e):document.getElementById(e)},w=function(e){var n='\n    <div class="'.concat(b.loader,'">\n      <svg>\n        <use href="img/icons.svg#icon-cw"></use>\n      </svg>\n    <div>\n  ');e.insertAdjacentHTML("afterbegin",n)},y=function(){var e=document.querySelector(".".concat(b.loader));e&&e.parentElement.removeChild(e)},S=function(){document.body.insertAdjacentHTML("beforeend",'\n    <div class="login-container">\n      <div class="login">\n        <form class="login-form" name="loginform">\n          <h1 class="title">Iniciar Sesion</h1>\n          <div class="form-group">\n            <label for="">Usuario: </label>\n            <input type="text" name="logonId" id="logonId" class="form-input"\n              placeholder="Ingrese Usuario">\n          </div>\n          <div class="form-group">\n            <label for="">password: </label>\n            <input type="password" name="logonPassword" id="logonPassword" class="form-input"\n              placeholder="Ingrese Password">\n          </div>\n          <div class="error error-login">Complete todos los campos, para continuar.</div>\n          <button class="btn login_btn">\n            <span>Ingresar</span>\n          </button>\n        </form>\n      </div>\n    </div>\n  ')},L=function(e){document.querySelector(".error-login").style.display=e},I=function(e){var n=Array.from(e);return[].reduce.call(n,(function(e,n){return function(e){return e.name&&e.value}(n)&&function(e){return!["checkbox","radio"].includes(e.type)||e.checked}(n)&&(e[n.name]=n.value),e}),{})},x=function(){h(b.searchRestList).innerHTML=""},k=function(e,n){var t='\n    <tr>\n      <th scope="row">'.concat(n,"</th>\n      <th>").concat(e.id,"</th>\n      <td>").concat(e.type,"</td>\n      <td>").concat(e.connection.database,"</td>\n      <td>").concat(e.connection.port,"</td>\n      <td>").concat(e.connection.hostname,'</td>\n      <td><a class="btn-show-views show-views-btn"><div style="display: none">').concat(JSON.stringify(e.views),"</div>Ver Vistas</a></td>\n    </tr>\n  ");h(b.searchRestList).insertAdjacentHTML("beforeend",t)},_=function(e){if(e){e.forEach(k);var n=document.querySelectorAll(".show-views-btn");Array.from(n).forEach((function(e,n){e.addEventListener("click",A,!1)}))}},q=function(){h(b.viewsListContent).innerHTML=""},B=function(e,n){var t='\n    <tr>\n      <th scope="row">'.concat(e.name,'</th>\n      <th scope="row">').concat(e.path,'</th>\n      <th scope="row">').concat(e.query,"</th>\n    </tr>\n  ");h(b.viewsListContent).insertAdjacentHTML("beforeend",t)};function A(e){var n=document.getElementById("view-modal"),t=document.querySelector(".md-overlay-js");t.classList.add("md-overlay"),n.classList.remove("md-show"),n.classList.add("md-show");var r=e.target.firstChild.textContent,o=JSON.parse(r);o&&(q(),o.forEach(B)),document.querySelector(".close-view-modal").addEventListener("click",(function(e){n.classList.remove("md-show"),t.classList.remove("md-overlay")}),!1),t.addEventListener("click",(function(){n.classList.remove("md-show"),t.classList.remove("md-overlay")}))}var E=b,T=function(e){return!["checkbox","radio"].includes(e.type)||e.checked},R=function(e){return e.name&&e.value},F=function(){var e,n=document.getElementById("dbtype"),t=Array.from((e=E.inputsItemView,document.querySelectorAll(e)));return[].reduce.call(t,(function(e,t){return R(t)&&T(t)&&(e[t.name]=t.value,e.path=function(e,n){switch(e){case"MYSQL":return"views/mysql/".concat(n);case"MARIADB":return"views/mariadb/".concat(n);case"DB2":return"views/db2/".concat(n)}}(n.value,e.nameview)),e}),{})};var D=function(){h(E.viewResultForm).innerHTML=""},M=function(e){var n='\n    <ul class="view-result-tbody">\n      <li>'.concat(e.name,"</li>\n      <li>").concat(e.path,'</li>\n      <li>\n        <button class="btn-tiny btn-delete-item" data-id=').concat(e.name,'>\n          <svg>\n            <use href="img/icons.svg#icon-circle-with-minus"></use>\n          </svg>\n        </button>\n      </li>\n    </ul>\n  ');h(E.viewResultForm).insertAdjacentHTML("beforeend",n)},C=function(e){h(E.viewResultForm).insertAdjacentHTML("beforeend",'\n    <ul class="view-result-thead">\n      <li>Nombre</li>\n      <li>Ruta</li>\n      <li>Eliminar</li>\n    </ul>\n  '),e&&e.forEach(M)},O=b,j={},N=function(){var e;return regeneratorRuntime.async((function(n){for(;;)switch(n.prev=n.next){case 0:return e=h(b.searchCbo).value,j.search=new l(e),x(),w(h(O.searchTable)),n.next=6,regeneratorRuntime.awrap(j.search.getResults());case 6:y(),_(j.search.result);case 8:case"end":return n.stop()}}))},P=function(){j.vwmodel=new m,j.vwmodel.readStorage();var e,n=F();j.vwmodel.isviewInserted(n.nameview)?(e="Vista ya existe este nombre, ingrese vista con un nombre diferente!",f.a.fire({position:"top-end",icon:"success",title:"".concat(e),showConfirmButton:!1,timer:1e3})):(D(),j.vwmodel.addView(n),C(j.vwmodel.viewslist),h(E.registerFormInputs).nameview.value="",h(E.registerFormInputs).query.value="")},H=function(){h(O.btnMenuRegister).addEventListener("click",(function(e){x(),h(O.searchTable).style.display="none",h(O.registerContainer).style.display="block"})),h(O.searchBtnForm).addEventListener("click",(function(e){e.preventDefault();var n=new i;n.isAuth?(N(),h(O.searchTable).style.display="block",h(O.registerContainer).style.display="none"):n.checkSession()})),h(O.logOutBtn).addEventListener("click",(function(e){j.vmlogin=new i,j.vmlogin.logOut()})),h(O.viewsBtnForm).addEventListener("click",(function(e){e.preventDefault(),h(O.formViewjs).classList.toggle("hidden"),e.target.classList.toggle("closed"),e.target.classList.toggle("btn-tiny"),e.target.classList.toggle("btn"),"Agregar +"===e.target.textContent?e.target.textContent="X":e.target.textContent="Agregar +"})),h(O.registerForm).addEventListener("submit",(function(e){var n,t,r,o,s,a;e.preventDefault(),t=h(E.registerFormInputs).elements.dbtype,r=h(E.registerFormInputs).elements.dbname,o=h(E.registerFormInputs).elements.dbhost,s=h(E.registerFormInputs).elements.dbport,a=h(E.registerFormInputs).elements.dbuser,(0===t.selectedIndex?(t.classList.add("input-error"),t.focus(),0):""===r.value?(r.classList.add("input-error"),r.focus(),0):""===o.value?(o.classList.add("input-error"),o.focus(),0):""===s.value?(s.classList.add("input-error"),s.focus(),0):""!==a.value||(a.classList.add("input-error"),a.focus(),0))&&regeneratorRuntime.async((function(e){for(;;)switch(e.prev=e.next){case 0:return t=void 0,t=Array.from(h(E.registerFormInputs).elements),n=[].reduce.call(t,(function(e,n){return R(n)&&T(n)&&(e[n.name]=n.value),e}),{}),j.vwmodel=new m,j.vwmodel.readStorage(),n.views=j.vwmodel.viewslist,j.register=new d(n),w(h(O.registerForm)),e.prev=6,e.next=9,regeneratorRuntime.awrap(j.register.saveDatabase(j.register));case 9:y(),Array.from(h(E.registerFormInputs)).forEach((function(e,n){"SELECT"===e.nodeName&&(e.selectedIndex=0),"INPUT"===e.nodeName&&"text"===e.type&&(e.value="")})),localStorage.removeItem("views"),h(E.viewResultForm).innerHTML="",h(O.searchTable).style.display="block",h(O.registerContainer).style.display="none",N(),e.next=19;break;case 16:e.prev=16,e.t0=e.catch(6),console.log(e.t0.message);case 19:case"end":return e.stop()}var t}),null,null,[[6,16]])})),h(O.viewsBtnAddItem).addEventListener("click",(function(e){var n,t,r;e.preventDefault(),(""!==(r=h(E.registerFormInputs).nameview).value||(r.classList.add("input-error"),r.focus(),n=r,t='\n    <div class="error">'.concat("Nombre"," es un campo requerido (*)</div>\n  "),n.insertAdjacentHTML("afterend",t),0))&&P()})),h(O.viewResultForm).addEventListener("click",(function(e){e.preventDefault();var n=e.target.closest(".btn-delete-item");n&&(j.vwmodel=new m,j.vwmodel.readStorage(),j.vwmodel.deleteView(n.dataset.id),D(),C(j.vwmodel.viewslist))}))};window.addEventListener("load",(function(){j.vmlogin=new i,j.vmlogin.isLogged(),console.log("[ initialized store! ]"),j.vmlogin.isLogged()?(g.app.insertAdjacentHTML("beforeend",'\n    <div class="search-content">\n      <div class="header__logo"></div>\n      \x3c!-- BEGIN: Search ontainer --\x3e\n      <form class="search">\n        <select name="" id="" class="search__field">\n          <option value="">Todos</option>\n          <option value="MARIADB">Maria DB</option>\n          <option value="MYSQL">MySQL</option>\n          <option value="DB2">DB2</option>\n        </select>\n\n        <button class="btn search__btn">\n          <svg class="search__icon">\n            <use href="img/icons.svg#icon-magnifying-glass"></use>\n          </svg>\n          <span>Search</span>\n        </button>\n      </form>\n      \x3c!-- END: Search ontainer --\x3e\n      <div class="likes">\n        <div class="likes__field">\n          <a class="btn-tiny btn-log-out"><span>Cerrar Sesion</span></a>\n        </div>\n      </div>\n    </div>\n  '),g.app.insertAdjacentHTML("beforeend",'\n    <div class="menu-container-aside">\n      <ul class="options-view">\n        <li>\n          <div class="results__link">\n            <button class="btn search__btn btn-menu-register">\n              <span>Agregar</span>\n            </button>\n          </div>\n        </li>\n      </ul>\n    </div>\n  '),g.app.insertAdjacentHTML("beforeend",'\n    <div class="content-body">\n      <div class="table-content">\n        <table class="table">\n          <thead class="thead-dark">\n            <tr>\n              <th scope="col">#</th>\n              <th scope="col">UniqueId</th>\n              <th scope="col">Tipo</th>\n              <th scope="col">Base de Datos</th>\n              <th scope="col">Puerto</th>\n              <th scope="col">Host</th>\n              <th scope="col">SQL Views</th>\n            </tr>\n          </thead>\n          <tbody class="results__list"></tbody>\n        </table>\n        <div id="view-modal" class="container-fluid-modal md-modal">\n          <div class="container">\n            <div class="header-modal">\n              <h1>Lista de Archivos SQL</h1>\n              <span class="close-modal close-view-modal">&times;<span>\n            </div>\n            <div class="content-modal">\n              <table class="table">\n                <thead class="thead-dark">\n                  <tr>\n                    <th scope="col">Nombre</th>\n                    <th scope="col">Ruta</th>\n                    <th scope="col">SQL Query</th>\n                  </tr>\n                </thead>\n                <tbody class="viewss-list"></tbody>\n              </table>\n            </div>\n          </div>\n        </div>\n\n        <div class="md-overlay-js"></div>\n      </div>\n      \n\n      \x3c!-- BEGIN: Register FORM --\x3e\n      <div class="register-db" style="display: none;">\n        <form class="register" name="register">\n          <h1 class="title">Registrar Base de Datos</h1>\n          <div class="form-group">\n            <select name="dbtype" id="dbtype" class="form-input">\n              <option value="">Seleccione</option>\n              <option value="MARIADB">Maria DB</option>\n              <option value="MYSQL">MySQL</option>\n              <option value="DB2">DB2</option>\n            </select>\n\n          </div>\n          <div class="form-group">\n            <label for="">Nombre de la BD: </label>\n            <input type="text" name="dbname" id="dbname" class="form-input"\n              placeholder="Ingrese Nombre de la Base de datos">\n          </div>\n          <div class="form-group">\n            <label for="">Hostname de la BD: </label>\n            <input type="text" name="dbhost" id="dbhost" class="form-input"\n              placeholder="Ingrese Hostname de la Base de datos">\n          </div>\n          <div class="form-group">\n            <label for="">Port de la BD: </label>\n            <input type="text" name="dbport" id="dbport" class="form-input"\n              placeholder="Ingrese puerto de conexion de la base de datos">\n          </div>\n          <div class="form-group">\n            <label for="">User de la BD: </label>\n            <input type="text" name="dbuser" id="dbuser" class="form-input"\n              placeholder="Ingrese Usuario de connecion de la Base de datos">\n          </div>\n\n          <div class="form-group">\n            <label for="">Agregar vistas: </label>\n            <div class="form-group form-buttons-view">\n              <div class="open-views-form-cont">\n                <button class="btn open-views-form rigth">Agregar +</button>\n              </div>\n              <div class="clearfix"></div>\n              <div class="views-form">\n\n                <div class="form-vw hidden">\n                  <button class="btn-tiny add-item-view">\n                    <svg>\n                      <use href="img/icons.svg#icon-circle-with-plus"></use>\n                    </svg>\n                  </button>\n                  <div class="form-group form-group-view">\n                    <label for="">Nombre de la vista: </label>\n                    <input type="text" name="nameview" id="nameview" class="input-item-view"\n                      placeholder="Ingrese Nombre de la vista">\n                  </div>\n                  <div class="form-group form-group-view">\n                    <label for="">Query SQL: </label>\n                    <textarea rows="10" cols="50" name="query" id="query" placeholder="Ingrese query sql" class="input-item-view"></textarea>\n                  </div>\n                  \n                </div>\n                <div class="clearfix"></div>\n                <div class="inserted-items"></div>\n              </div>\n            </div>\n          </div>\n          <button class="btn save_database_btn">\n            <span>Guardar</span>\n          </button>\n        </form>\n      </div>\n    </div>\n  '),H(),N()):(S(),regeneratorRuntime.async((function(e){for(;;)switch(e.prev=e.next){case 0:document.querySelector(".".concat(b.loginForm)).addEventListener("submit",(function(e){e.preventDefault();var n=e.target.closest(".login-form"),t=I(n.elements);if(!t.logonId)return L("block"),!1;L("none"),t.logonPassword?(L("none"),(new i).login(t)):L("block")}));case 1:case"end":return e.stop()}})))}))}});