@devix-tecnologia/directus-extension-inframe/dist/index.js

Extensão para módulo de visualização de conteúdo em iframes

import{useApi as e,defineModule as n}from"@directus/extensions-sdk";import{ref as a,defineComponent as t,resolveComponent as r,openBlock as i,createElementBlock as o,createElementVNode as d,Fragment as s,renderList as l,createVNode as c,withCtx as m,toDisplayString as p,onMounted as u,createBlock as f,createCommentVNode as v,createSlots as g}from"vue";import{useRouter as h}from"vue-router";const b=e=>e&&0!==e.length&&e[0]&&e[0].title?e[0].title:"Item inFrame",x=()=>{const n=a([]),t=a(!1),r=e();return{items:n,loading:t,fetchItems:async()=>{t.value=!0;try{const e=await(async e=>(await e.get("/users/me")).data.data.language||"en-US")(r),a=await r.get("/items/inframe",{params:{fields:["id","sort","status","icon","url","thumbnail","translations.languages_code","translations.title"],deep:{translations:{_filter:{languages_code:{_eq:e}}}},filter:{status:{_eq:"published"}},sort:["sort"]}});n.value=a.data}finally{t.value=!1}},getTitle:b}};var y=t({name:"NavMenu",props:{items:{type:Array,required:!0}},setup(){const{getTitle:e}=x();return{getTitle:e}}}),w=[],k=[];function _(e,n){if(e&&"undefined"!=typeof document){var a,t=!0===n.prepend?"prepend":"append",r=!0===n.singleTag,i="string"==typeof n.container?document.querySelector(n.container):document.getElementsByTagName("head")[0];if(r){var o=w.indexOf(i);-1===o&&(o=w.push(i)-1,k[o]={}),a=k[o]&&k[o][t]?k[o][t]:k[o][t]=d()}else a=d();65279===e.charCodeAt(0)&&(e=e.substring(1)),a.styleSheet?a.styleSheet.cssText+=e:a.appendChild(document.createTextNode(e))}function d(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),n.attributes)for(var a=Object.keys(n.attributes),r=0;r<a.length;r++)e.setAttribute(a[r],n.attributes[a[r]]);var o="prepend"===t?"afterbegin":"beforeend";return i.insertAdjacentElement(o,e),e}}_("\n.nav-menu[data-v-33faf0a5] {\n  margin-top: 20px;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n}\n.menu-list[data-v-33faf0a5] {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n.menu-item[data-v-33faf0a5] {\n  margin-bottom: 8px;\n}\n.menu-link[data-v-33faf0a5] {\n  display: flex;\n  align-items: center;\n  text-decoration: none;\n  color: var(--theme--foreground-accent);\n  font-size: 16px;\n  padding: 12px 20px;\n  transition:\n    background-color 0.3s ease,\n    color 0.3s ease;\n}\n.menu-link[data-v-33faf0a5]:hover {\n  background-color: var(--theme--primary-light);\n  color: var(--theme--primary);\n}\n.menu-link.active-link[data-v-33faf0a5] {\n  background-color: var(--theme--primary);\n  color: var(--white);\n  font-weight: bold;\n}\n.menu-icon[data-v-33faf0a5] {\n  margin-right: 10px;\n  font-size: 20px;\n}\n.menu-link span[data-v-33faf0a5] {\n  font-weight: 500;\n}\n",{});var T=(e,n)=>{const a=e.__vccOpts||e;for(const[e,t]of n)a[e]=t;return a};const I={class:"nav-menu"},z={class:"menu-list"},N={class:"menu-link-text"};var q=T(y,[["render",function(e,n,a,t,u,f){const v=r("v-icon"),g=r("router-link");return i(),o("nav",I,[d("ul",z,[(i(!0),o(s,null,l(e.items,(n=>(i(),o("li",{key:n.id,class:"menu-item"},[c(g,{to:`/inframe/${n.id}`,class:"menu-link","active-class":"active-link"},{default:m((()=>[c(v,{class:"menu-icon",name:n.icon},null,8,["name"]),d("span",N,p(e.getTitle(n.translations)),1)])),_:2},1032,["to"])])))),128))])])}],["__scopeId","data-v-33faf0a5"],["__file","NavMenu.vue"]]),A=t({name:"InframeList",components:{NavMenu:q},setup(){const{items:e,fetchItems:n,getTitle:a}=x(),t=h();return u((async()=>{if(await n(),e.value&&e.value.length>0&&!e.value[0]){const n=e.value[0];n&&t.push(`/inframe/${n.id}`)}})),{items:e,page_title:"Organograma",getTitle:a}}});_("\n.container[data-v-0361dc2b] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 20px;\n  padding: 20px 50px;\n}\n.card-container[data-v-0361dc2b] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 20px;\n  width: 100%;\n}\n.card[data-v-0361dc2b] {\n  background-color: #ffffff;\n  border-radius: 8px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  flex: 1 1 25%;\n  height: 200px;\n  display: flex;\n  flex-direction: column; /* Para garantir que o conteúdo não sobreponha a imagem */\n  justify-content: flex-end; /* Ajusta o conteúdo para o fundo */\n  align-items: center;\n  text-align: center;\n  overflow: hidden;\n  transition:\n    transform 0.3s ease,\n    box-shadow 0.3s ease;\n}\n.card[data-v-0361dc2b]:hover {\n  transform: translateY(-10px);\n  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);\n}\n.card-link[data-v-0361dc2b] {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end; /* Coloca o conteúdo no fundo do link */\n  align-items: center;\n  height: 100%;\n  text-decoration: none; /* Remove o estilo de link */\n  background-size: cover;\n  background-position: center;\n  background-repeat: no-repeat;\n  padding: 0;\n  width: 100%;\n}\n.card-header h3[data-v-0361dc2b] {\n  margin: 0; /* Remove a margem para melhor controle de espaçamento */\n  padding: 10px;\n  background: var(--theme--primary);\n  width: 100%;\n}\n.card-header[data-v-0361dc2b] {\n  background-color: var(--theme--primary-light);\n  padding: 0;\n  font-size: 18px;\n  font-weight: bold;\n  color: var(--white);\n  width: 100%;\n}\n.card-body[data-v-0361dc2b] {\n  padding: 16px;\n  font-size: 14px;\n  color: var(--theme--foreground);\n}\n.card-body p[data-v-0361dc2b] {\n  margin: 0;\n}\n",{});const j={class:"container"};var M=T(A,[["render",function(e,n,a,t,o,s){const l=r("NavMenu"),p=r("router-view"),u=r("private-view");return i(),f(u,{title:e.page_title},{navigation:m((()=>[c(l,{items:e.items},null,8,["items"])])),default:m((()=>[d("div",j,[v(" O router-view vai renderizar o conteúdo do primeiro item automaticamente "),c(p)])])),_:1},8,["title"])}],["__scopeId","data-v-0361dc2b"],["__file","List.vue"]]),O=t({name:"ItemDetail",components:{NavMenu:q},props:{item:{type:Object,required:!0},items:{type:Array,required:!0},loading:{type:Boolean,default:!1},title:{type:String,default:""}},setup:e=>({...e,breadcrumb:[{name:"Home",to:"/inframe"}]})});_("\n.header-bar[data-v-978ef17c] {\n  display: none !important;\n}\n[data-v-978ef17c] .header-bar {\n  display: none !important;\n}\n.container[data-v-978ef17c] {\n  margin: 20px 50px;\n}\nh2[data-v-978ef17c] {\n  color: var(--theme--foreground-accent);\n  margin-bottom: 10px;\n}\np[data-v-978ef17c] {\n  font-size: 16px;\n  line-height: 1.5;\n  color: var(--theme--foreground-accent);\n}\n.main[data-v-978ef17c] {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n}\n.iframe-area[data-v-978ef17c] {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  overflow: hidden !important;\n}\niframe[data-v-978ef17c] {\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n",{});const S={class:"main"},C={key:0},E={key:1},R={class:"iframe-area"},B=["src"],D={key:2};var L=n({id:"inframe",name:"Relatórios",icon:"document_scanner",routes:[{path:"",props:!0,component:M},{path:":id",component:T(O,[["render",function(e,n,a,t,s,l){const p=r("v-breadcrumb"),u=r("NavMenu"),h=r("private-view");return e.item?(i(),f(h,{key:0,title:e.title},g({navigation:m((()=>[c(u,{items:e.items},null,8,["items"])])),default:m((()=>[d("div",S,[e.loading?(i(),o("div",C,n[0]||(n[0]=[d("p",null,"Carregando...",-1)]))):e.item?(i(),o("div",E,[d("div",R,[d("iframe",{src:e.item.url,frameborder:"0",sandbox:"allow-scripts allow-same-origin"},null,8,B)])])):(i(),o("div",D,n[1]||(n[1]=[d("p",null,"Erro ao carregar dados. Tente novamente mais tarde.",-1)])))])])),_:2},[e.breadcrumb.length>0?{name:"headline",fn:m((()=>[c(p,{items:e.breadcrumb},null,8,["items"])])),key:"0"}:void 0]),1032,["title"])):v("v-if",!0)}],["__scopeId","data-v-978ef17c"],["__file","ItemDetail.vue"]]),props:!0}]});export{L as default};