@5minds/node-red-dashboard-2-processcube-dynamic-table 1.2.1-develop-38df50-m73530ms → 1.2.1-develop-7a5354-madmmil5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@5minds/node-red-dashboard-2-processcube-dynamic-table",
|
|
3
|
-
"version": "1.2.1-develop-
|
|
3
|
+
"version": "1.2.1-develop-7a5354-madmmil5",
|
|
4
4
|
"description": "A ui component for showing dynamic Data with actions in a table",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"processcube",
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("h1[data-v-
|
|
2
|
-
(function(o,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vuex"),require("vue")):typeof define=="function"&&define.amd?define(["exports","vuex","vue"],a):(o=typeof globalThis<"u"?globalThis:o||self,a(o["ui-dynamic-table"]={},o.vuex,o.Vue))})(this,function(o,a,t){"use strict";const p=(e,i)=>{const n=e.__vccOpts||e;for(const[r,s]of i)n[r]=s;return n},m={name:"UIDynamicTable",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!0,visible:!0})}},computed:{...a.mapState("data",["messages"])},data(){return{search:"",actions:[],tasks:[],headers:[]}},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=>{Array.isArray(e)&&(e=e.filter(i=>i._client.socketId==this.$socket.id)[0]),this.initialize(e),this.messages[this.id]=e,this.$store.commit("data/bind",{widgetId:this.id,msg:e})}),this.$socket.emit("widget-load",this.id)},unmounted(){var e,i;(e=this.$socket)==null||e.off("widget-load"+this.id),(i=this.$socket)==null||i.off("msg-input:"+this.id)},methods:{send(e,i){const n=[];n[i]=e,this.$socket.emit("widget-action",this.id,n)},actionFn(e,i){const n=this.messages[this.id]||{};n.payload=i,this.send(n,this.actions.findIndex(r=>r.label===e.label))},initialize(e){this.tasks=e.payload,this.actions=this.props.options,this.headers=this.props.columns.map(i=>({title:i.label,key:i.value})),this.headers.push({title:"Actions",align:"center",key:"actions"})},conditionCheck(e,i){if(e=="")return!0;try{return new Function("row",`return ${e}`)(i)}catch(n){return console.error("Error evaluating condition:",n),!1}}}};function f(e,i,n,r,s,d){const u=t.resolveComponent("v-text-field"),k=t.resolveComponent("v-toolbar"),y=t.resolveComponent("v-btn"),h=t.resolveComponent("v-container"),
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("h1[data-v-ee404d1b]{margin-bottom:10px}h2[data-v-ee404d1b]{margin-top:1.5rem;margin-bottom:.75rem}h3[data-v-ee404d1b]{margin-top:1rem}p[data-v-ee404d1b]{margin-bottom:5px}ul li[data-v-ee404d1b]{list-style-type:circle;list-style-position:inside;margin-left:15px}pre[data-v-ee404d1b]{padding:12px;margin:12px;background-color:#eee}code[data-v-ee404d1b]{font-size:.825rem;color:#ae0000}input[data-v-ee404d1b]{padding:12px;margin:12px;background-color:#eee}.task-div[data-v-ee404d1b]{padding:8px;margin:16px;border:solid;border-radius:4px;border-color:#303030}.action-button-container[data-v-ee404d1b]{width:100%;display:flex;justify-content:center}.full-width-table[data-v-ee404d1b]{--v-table-header-height: 40px !important}.full-width-table .v-toolbar[data-v-ee404d1b],.full-width-table .v-table__wrapper .v-alert--variant-flat[data-v-ee404d1b]{background:unset!important;color:unset!important}.full-width-table[data-v-ee404d1b] thead th{border-bottom:4px solid rgb(var(--v-theme-primary))!important;font-weight:700!important;font-size:16px!important}.full-width-table[data-v-ee404d1b] tbody{background-color:#f6f5fa!important;--widget-row-height: 40px !important;font-size:16px}.search-input[data-v-ee404d1b] .v-field__outline__end{border-right:none;border-top:none;border-radius:0}.search-input[data-v-ee404d1b] .v-label{font-size:14px!important}.search-input[data-v-ee404d1b] .v-field__outline__start{border-radius:0 0 0 8px;border-top:none}.action-button[data-v-ee404d1b]{border-radius:8px;background-color:transparent!important;border-color:rgb(var(--v-theme-primary));border:2px solid;color:rgb(var(--v-theme-primary));padding:8px}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
+
(function(o,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vuex"),require("vue")):typeof define=="function"&&define.amd?define(["exports","vuex","vue"],a):(o=typeof globalThis<"u"?globalThis:o||self,a(o["ui-dynamic-table"]={},o.vuex,o.Vue))})(this,function(o,a,t){"use strict";const p=(e,i)=>{const n=e.__vccOpts||e;for(const[r,s]of i)n[r]=s;return n},m={name:"UIDynamicTable",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!0,visible:!0})}},computed:{...a.mapState("data",["messages"])},data(){return{search:"",actions:[],tasks:[],headers:[]}},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=>{Array.isArray(e)&&(e=e.filter(i=>i._client.socketId==this.$socket.id)[0]),this.initialize(e),this.messages[this.id]=e,this.$store.commit("data/bind",{widgetId:this.id,msg:e})}),this.$socket.emit("widget-load",this.id)},unmounted(){var e,i;(e=this.$socket)==null||e.off("widget-load"+this.id),(i=this.$socket)==null||i.off("msg-input:"+this.id)},methods:{send(e,i){const n=[];n[i]=e,this.$socket.emit("widget-action",this.id,n)},actionFn(e,i){const n=this.messages[this.id]||{};n.payload=i,this.send(n,this.actions.findIndex(r=>r.label===e.label))},initialize(e){this.tasks=e.payload,this.actions=this.props.options,this.headers=this.props.columns.map(i=>({title:i.label,key:i.value})),this.headers.push({title:"Actions",align:"center",key:"actions"})},conditionCheck(e,i){if(e=="")return!0;try{return new Function("row",`return ${e}`)(i)}catch(n){return console.error("Error evaluating condition:",n),!1}}}};function f(e,i,n,r,s,d){const u=t.resolveComponent("v-text-field"),k=t.resolveComponent("v-toolbar"),y=t.resolveComponent("v-btn"),h=t.resolveComponent("v-container"),b=t.resolveComponent("v-alert"),x=t.resolveComponent("v-data-table");return t.openBlock(),t.createBlock(x,{headers:s.headers,items:s.tasks,search:s.search,class:"full-width-table"},{top:t.withCtx(()=>[t.createVNode(k,{flat:"",class:"py-2"},{default:t.withCtx(()=>[t.createVNode(u,{class:"mx-3 search-input",modelValue:s.search,"onUpdate:modelValue":i[0]||(i[0]=c=>s.search=c),label:"Search","prepend-inner-icon":"mdi-magnify",variant:"outlined","hide-details":"","single-line":""},null,8,["modelValue"])]),_:1})]),"item.actions":t.withCtx(({item:c})=>[t.createVNode(h,{class:"action-button-container"},{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(s.actions,(l,g)=>(t.openBlock(),t.createBlock(h,{style:{padding:"0px",display:"inline",width:"fit-content",margin:"0px"}},{default:t.withCtx(()=>[d.conditionCheck(l.condition,c)?(t.openBlock(),t.createBlock(y,{style:{margin:"0px 2px"},class:"action-button",key:g,size:"small",onClick:C=>d.actionFn(l,c)},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(l.label),1)]),_:2},1032,["onClick"])):t.createCommentVNode("",!0)]),_:2},1024))),256))]),_:2},1024)]),"no-data":t.withCtx(()=>[t.createVNode(b,{text:"No Data",style:{margin:"12px"}})]),_:1},8,["headers","items","search"])}const _=p(m,[["render",f],["__scopeId","data-v-ee404d1b"]]);o.UIDynamicTable=_,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<template v-slot:top>
|
|
4
4
|
<v-toolbar flat class="py-2">
|
|
5
5
|
<v-text-field
|
|
6
|
-
class="mx-3"
|
|
6
|
+
class="mx-3 search-input"
|
|
7
7
|
v-model="search"
|
|
8
8
|
label="Search"
|
|
9
9
|
prepend-inner-icon="mdi-magnify"
|
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
>
|
|
22
22
|
<v-btn
|
|
23
23
|
style="margin: 0px 2px"
|
|
24
|
+
class="action-button"
|
|
24
25
|
v-if="conditionCheck(action.condition, item)"
|
|
25
26
|
:key="index"
|
|
26
27
|
size="small"
|
|
@@ -52,6 +52,10 @@ input {
|
|
|
52
52
|
justify-content: center;
|
|
53
53
|
}
|
|
54
54
|
|
|
55
|
+
.full-width-table {
|
|
56
|
+
--v-table-header-height: 40px !important;
|
|
57
|
+
}
|
|
58
|
+
|
|
55
59
|
.full-width-table .v-toolbar {
|
|
56
60
|
background: unset !important;
|
|
57
61
|
color: unset !important;
|
|
@@ -61,3 +65,39 @@ input {
|
|
|
61
65
|
background: unset !important;
|
|
62
66
|
color: unset !important;
|
|
63
67
|
}
|
|
68
|
+
|
|
69
|
+
.full-width-table >>> thead th {
|
|
70
|
+
border-bottom: 4px solid rgb(var(--v-theme-primary)) !important;
|
|
71
|
+
font-weight: 700 !important;
|
|
72
|
+
font-size: 16px !important;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.full-width-table >>> tbody {
|
|
76
|
+
background-color: #F6F5FA !important;
|
|
77
|
+
--widget-row-height: 40px !important;
|
|
78
|
+
font-size: 16px;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.search-input >>> .v-field__outline__end {
|
|
82
|
+
border-right: none;
|
|
83
|
+
border-top: none;
|
|
84
|
+
border-radius: 0px;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.search-input >>> .v-label {
|
|
88
|
+
font-size: 14px !important;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.search-input >>> .v-field__outline__start {
|
|
92
|
+
border-radius: 0px 0px 0px 8px;
|
|
93
|
+
border-top: none;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.action-button {
|
|
97
|
+
border-radius: 8px;
|
|
98
|
+
background-color: transparent !important;
|
|
99
|
+
border-color: rgb(var(--v-theme-primary));
|
|
100
|
+
border: 2px solid;
|
|
101
|
+
color: rgb(var(--v-theme-primary));
|
|
102
|
+
padding: 8px;
|
|
103
|
+
}
|