@5minds/node-red-dashboard-2-processcube-usertask-table
Version:
A ui component for showing UserTasks in a table
3 lines (2 loc) • 3.91 kB
JavaScript
(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode("h1[data-v-7d0fb092]{margin-bottom:10px}h2[data-v-7d0fb092]{margin-top:1.5rem;margin-bottom:.75rem}h3[data-v-7d0fb092]{margin-top:1rem}p[data-v-7d0fb092]{margin-bottom:5px}ul li[data-v-7d0fb092]{list-style-type:circle;list-style-position:inside;margin-left:15px}pre[data-v-7d0fb092]{padding:12px;margin:12px;background-color:#eee}code[data-v-7d0fb092]{font-size:.825rem;color:#ae0000}input[data-v-7d0fb092]{padding:12px;margin:12px;background-color:#eee}.task-div[data-v-7d0fb092]{padding:8px;margin:16px;border:solid;border-radius:4px;border-color:#303030}.action-button-container[data-v-7d0fb092]{width:100%;display:flex;justify-content:center}")),document.head.appendChild(t)}}catch(d){console.error("vite-plugin-css-injected-by-js",d)}})();
(function(n,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vuex"),require("vue")):typeof define=="function"&&define.amd?define(["exports","vuex","vue"],s):(n=typeof globalThis<"u"?globalThis:n||self,s(n["usertask-table"]={},n.vuex,n.Vue))})(this,function(n,s,t){"use strict";const m=(e,o)=>{const i=e.__vccOpts||e;for(const[l,a]of o)i[l]=a;return i},f={name:"UserTaskTable",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!1,visible:!1})}},data(){return{actions:[],tasks:[],headers:[]}},computed:{...s.mapState("data",["messages"])},mounted(){this.$socket.on("widget-load:"+this.id,e=>{this.initialize(e),this.$store.commit("data/bind",{widgetId:this.id,msg:e})}),this.$socket.on("msg-input:"+this.id,e=>{this.initialize(e),this.$store.commit("data/bind",{widgetId:this.id,msg:e})}),this.$socket.emit("widget-load",this.id)},unmounted(){var e,o;(e=this.$socket)==null||e.off("widget-load"+this.id),(o=this.$socket)==null||o.off("msg-input:"+this.id)},methods:{send(e,o){let i=[];i[o]=e,this.$socket.emit("widget-action",this.id,i)},actionFn(e,o){this.send({payload:o},this.actions.findIndex(i=>i.label===e.label))},initialize(e){this.tasks=e.payload.userTasks,this.actions=this.props.options,this.headers=this.props.columns.map(o=>({title:o.label,key:o.value})),this.headers.push({title:"Action",align:"center",key:"actions"})},conditionCheck(e,o){if(e=="")return!0;try{return new Function("row",`return ${e}`)(o)}catch(i){return console.error("Error evaluating condition:",i),!1}}}};function _(e,o,i,l,a,r){const b=t.resolveComponent("v-toolbar-title"),u=t.resolveComponent("v-toolbar"),d=t.resolveComponent("v-btn"),p=t.resolveComponent("v-container"),x=t.resolveComponent("v-data-table");return t.openBlock(),t.createBlock(x,{headers:a.headers,items:a.tasks,class:"full-width-table"},{top:t.withCtx(()=>[t.createVNode(u,null,{default:t.withCtx(()=>[t.createVNode(b,null,{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(i.props.name||"Table"),1)]),_:1})]),_:1})]),"item.actions":t.withCtx(({item:h})=>[t.createVNode(p,{class:"action-button-container"},{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(a.actions,(c,C)=>(t.openBlock(),t.createBlock(p,{style:{padding:"0px",display:"inline",width:"fit-content",margin:"0px"}},{default:t.withCtx(()=>[r.conditionCheck(c.condition,h)?(t.openBlock(),t.createBlock(d,{style:{margin:"0px 2px"},key:C,size:"small",onClick:y=>r.actionFn(c,h)},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(c.label),1)]),_:2},1032,["onClick"])):t.createCommentVNode("",!0)]),_:2},1024))),256))]),_:2},1024)]),"no-data":t.withCtx(()=>[t.createVNode(d,{color:"primary",onClick:r.initialize},{default:t.withCtx(()=>[t.createTextVNode(" Reload ")]),_:1},8,["onClick"])]),_:1},8,["headers","items"])}const k=m(f,[["render",_],["__scopeId","data-v-7d0fb092"]]);n.UserTaskTable=k,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});