@5minds/node-red-dashboard-2-processcube-dynamic-table 1.1.3 → 1.1.5

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.
Files changed (4) hide show
  1. package/nodes/dynamic-table.js +36 -32
  2. package/package.json +77 -77
  3. package/resources/ui-dynamic-table.umd.js +2 -2
  4. package/ui/components/DynamicTable.vue +118 -108
package/nodes/dynamic-table.js CHANGED
@@ -1,41 +1,45 @@
1
1
  module.exports = function (RED) {
2
- function DynamicTableNode(config) {
3
- RED.nodes.createNode(this, config);
2
+ function DynamicTableNode(config) {
3
+ RED.nodes.createNode(this, config);
4
4
 
5
- const node = this;
5
+ const node = this;
6
6
 
7
- const group = RED.nodes.getNode(config.group);
7
+ const group = RED.nodes.getNode(config.group);
8
8
 
9
- const base = group.getBase();
9
+ const base = group.getBase();
10
10
 
11
- //server-side event handlers
12
- const evts = {
13
- onAction: true,
14
- onInput: function (msg, send, done) {
15
- console.log(config.data_type);
16
- columns = RED.util.evaluateNodeProperty(
17
- config.data,
18
- config.data_type,
19
- node,
20
- msg
21
- );
22
- base.stores.data.save(base, node, columns);
23
- },
24
- };
11
+ //server-side event handlers
12
+ const evts = {
13
+ onAction: true,
14
+ beforeSend: function (msg) {
15
+ if (Array.isArray(msg)) return msg;
16
+ data = RED.util.evaluateNodeProperty(
17
+ config.data,
18
+ config.data_type,
19
+ node,
20
+ msg
21
+ );
25
22
 
26
- if (group) {
27
- group.register(node, config, evts);
28
- } else {
29
- node.error("No group configured");
23
+ return data;
24
+ },
25
+ onInput: function (msg, send, done) {
26
+ base.stores.data.save(base, node, msg);
27
+ },
28
+ };
29
+
30
+ if (group) {
31
+ group.register(node, config, evts);
32
+ } else {
33
+ node.error("No group configured");
34
+ }
30
35
  }
31
- }
32
36
 
33
- RED.nodes.registerType("ui-dynamic-table", DynamicTableNode, {
34
- defaults: {
35
- outputs: { value: 1 },
36
- },
37
- outputs: function (config) {
38
- return config.outputs || 1;
39
- },
40
- });
37
+ RED.nodes.registerType("ui-dynamic-table", DynamicTableNode, {
38
+ defaults: {
39
+ outputs: { value: 1 },
40
+ },
41
+ outputs: function (config) {
42
+ return config.outputs || 1;
43
+ },
44
+ });
41
45
  };
package/package.json CHANGED
@@ -1,80 +1,80 @@
1
1
  {
2
- "name": "@5minds/node-red-dashboard-2-processcube-dynamic-table",
3
- "version": "1.1.3",
4
- "description": "A ui component for showing dynamic Data with actions in a table",
5
- "keywords": [
6
- "processcube",
7
- "usertask",
8
- "node-red",
9
- "node-red-dashboard-2"
10
- ],
11
- "repository": {
12
- "type": "git",
13
- "url": "https://github.com/5minds/node-red-dashboard-2-processcube-usertask-table.git"
14
- },
15
- "license": "Apache-2.0",
16
- "author": {
17
- "name": "Martin Moellenbeck",
18
- "url": "https://github.com/moellenbeck"
19
- },
20
- "contributors": [
21
- {
22
- "name": "Luis Thieme",
23
- "url": "https://github.com/luisthieme"
2
+ "name": "@5minds/node-red-dashboard-2-processcube-dynamic-table",
3
+ "version": "1.1.5",
4
+ "description": "A ui component for showing dynamic Data with actions in a table",
5
+ "keywords": [
6
+ "processcube",
7
+ "usertask",
8
+ "node-red",
9
+ "node-red-dashboard-2"
10
+ ],
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "https://github.com/5minds/node-red-dashboard-2-processcube-dynamic-table.git"
14
+ },
15
+ "license": "Apache-2.0",
16
+ "author": {
17
+ "name": "Martin Moellenbeck",
18
+ "url": "https://github.com/moellenbeck"
19
+ },
20
+ "contributors": [
21
+ {
22
+ "name": "Luis Thieme",
23
+ "url": "https://github.com/luisthieme"
24
+ }
25
+ ],
26
+ "exports": {
27
+ "import": "./resources/dynamic-table.esm.js",
28
+ "require": "./resources/dynamic-table.umd.js"
29
+ },
30
+ "files": [
31
+ "dist/*",
32
+ "nodes/*",
33
+ "ui/*",
34
+ "resources/*"
35
+ ],
36
+ "scripts": {
37
+ "build": "vite build",
38
+ "build:dev": "NODE_ENV=development vite build",
39
+ "dev": "NODE_ENV=development vite build --watch",
40
+ "dev:prod": "vite build --watch",
41
+ "lint": "npm run lint:js && npm run lint:package",
42
+ "lint:fix": "npm run lint:js:fix && npm run lint:package:fix",
43
+ "lint:js": "eslint --ext .js,.vue,.cjs,.mjs .",
44
+ "lint:js:fix": "yarn lint:js --fix",
45
+ "lint:package": "sort-package-json --check 'package.json'",
46
+ "lint:package:fix": "sort-package-json 'package.json'"
47
+ },
48
+ "dependencies": {
49
+ "vue": "^3.3.8",
50
+ "vuex": "^4.1.0"
51
+ },
52
+ "devDependencies": {
53
+ "@vitejs/plugin-vue": "^4.5.0",
54
+ "eslint": "^8.53.0",
55
+ "eslint-config-standard": "^17.1.0",
56
+ "eslint-plugin-import": "^2.29.0",
57
+ "eslint-plugin-n": "^16.3.1",
58
+ "eslint-plugin-vue": "^9.18.1",
59
+ "vite": "^5.3.2",
60
+ "vite-plugin-css-injected-by-js": "^3.3.0"
61
+ },
62
+ "engines": {
63
+ "node": ">=14"
64
+ },
65
+ "node-red": {
66
+ "version": ">=3.0.0",
67
+ "nodes": {
68
+ "ui-dynamic-table": "nodes/dynamic-table.js"
69
+ }
70
+ },
71
+ "node-red-dashboard-2": {
72
+ "version": "1.0.0",
73
+ "widgets": {
74
+ "ui-dynamic-table": {
75
+ "output": "ui-dynamic-table.umd.js",
76
+ "component": "DynamicTable"
77
+ }
78
+ }
24
79
  }
25
- ],
26
- "exports": {
27
- "import": "./resources/dynamic-table.esm.js",
28
- "require": "./resources/dynamic-table.umd.js"
29
- },
30
- "files": [
31
- "dist/*",
32
- "nodes/*",
33
- "ui/*",
34
- "resources/*"
35
- ],
36
- "scripts": {
37
- "build": "vite build",
38
- "build:dev": "NODE_ENV=development vite build",
39
- "dev": "NODE_ENV=development vite build --watch",
40
- "dev:prod": "vite build --watch",
41
- "lint": "npm run lint:js && npm run lint:package",
42
- "lint:fix": "npm run lint:js:fix && npm run lint:package:fix",
43
- "lint:js": "eslint --ext .js,.vue,.cjs,.mjs .",
44
- "lint:js:fix": "yarn lint:js --fix",
45
- "lint:package": "sort-package-json --check 'package.json'",
46
- "lint:package:fix": "sort-package-json 'package.json'"
47
- },
48
- "dependencies": {
49
- "vue": "^3.3.8",
50
- "vuex": "^4.1.0"
51
- },
52
- "devDependencies": {
53
- "@vitejs/plugin-vue": "^4.5.0",
54
- "eslint": "^8.53.0",
55
- "eslint-config-standard": "^17.1.0",
56
- "eslint-plugin-import": "^2.29.0",
57
- "eslint-plugin-n": "^16.3.1",
58
- "eslint-plugin-vue": "^9.18.1",
59
- "vite": "^5.3.2",
60
- "vite-plugin-css-injected-by-js": "^3.3.0"
61
- },
62
- "engines": {
63
- "node": ">=14"
64
- },
65
- "node-red": {
66
- "version": ">=3.0.0",
67
- "nodes": {
68
- "ui-dynamic-table": "nodes/dynamic-table.js"
69
- }
70
- },
71
- "node-red-dashboard-2": {
72
- "version": "1.0.0",
73
- "widgets": {
74
- "ui-dynamic-table": {
75
- "output": "ui-dynamic-table.umd.js",
76
- "component": "DynamicTable"
77
- }
78
- }
79
- }
80
80
  }
package/resources/ui-dynamic-table.umd.js CHANGED
@@ -1,2 +1,2 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var d=document.createElement("style");d.appendChild(document.createTextNode("h1[data-v-3b78dd72]{margin-bottom:10px}h2[data-v-3b78dd72]{margin-top:1.5rem;margin-bottom:.75rem}h3[data-v-3b78dd72]{margin-top:1rem}p[data-v-3b78dd72]{margin-bottom:5px}ul li[data-v-3b78dd72]{list-style-type:circle;list-style-position:inside;margin-left:15px}pre[data-v-3b78dd72]{padding:12px;margin:12px;background-color:#eee}code[data-v-3b78dd72]{font-size:.825rem;color:#ae0000}input[data-v-3b78dd72]{padding:12px;margin:12px;background-color:#eee}.task-div[data-v-3b78dd72]{padding:8px;margin:16px;border:solid;border-radius:4px;border-color:#303030}.action-button-container[data-v-3b78dd72]{width:100%;display:flex;justify-content:center}")),document.head.appendChild(d)}}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 h=(e,n)=>{const i=e.__vccOpts||e;for(const[l,s]of n)i[l]=s;return i},m={name:"DynamicTable",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!0,visible:!0})}},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,columns:e})}),this.$socket.on("msg-input:"+this.id,e=>{this.initialize(e),this.$store.commit("data/bind",{widgetId:this.id,columns:e})}),this.$socket.emit("widget-load",this.id)},unmounted(){var e,n;(e=this.$socket)==null||e.off("widget-load"+this.id),(n=this.$socket)==null||n.off("msg-input:"+this.id)},methods:{send(e,n){const i=[];i[n]=e,this.$socket.emit("widget-action",this.id,i)},actionFn(e,n){this.send({payload:n},this.actions.findIndex(i=>i.label===e.label))},initialize(e){this.tasks=e,this.actions=this.props.options,this.headers=this.props.columns.map(n=>({title:n.label,key:n.value})),this.headers.push({title:"Action",align:"center",key:"actions"})},conditionCheck(e,n){if(e=="")return!0;try{return new Function("row",`return ${e}`)(n)}catch(i){return console.error("Error evaluating condition:",i),!1}}}};function f(e,n,i,l,s,d){const u=t.resolveComponent("v-text-field"),k=t.resolveComponent("v-toolbar"),b=t.resolveComponent("v-btn"),p=t.resolveComponent("v-container"),x=t.resolveComponent("v-alert"),y=t.resolveComponent("v-data-table");return t.openBlock(),t.createBlock(y,{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",modelValue:s.search,"onUpdate:modelValue":n[0]||(n[0]=r=>s.search=r),label:"Search","prepend-inner-icon":"mdi-magnify",variant:"outlined","hide-details":"","single-line":""},null,8,["modelValue"])]),_:1})]),"item.actions":t.withCtx(({item:r})=>[t.createVNode(p,{class:"action-button-container"},{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(s.actions,(c,g)=>(t.openBlock(),t.createBlock(p,{style:{padding:"0px",display:"inline",width:"fit-content",margin:"0px"}},{default:t.withCtx(()=>[d.conditionCheck(c.condition,r)?(t.openBlock(),t.createBlock(b,{style:{margin:"0px 2px"},key:g,size:"small",onClick:C=>d.actionFn(c,r)},{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(x,{text:"No data"})]),_:1},8,["headers","items","search"])}const _=h(m,[["render",f],["__scopeId","data-v-3b78dd72"]]);o.DynamicTable=_,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
1
+ (function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");a.appendChild(document.createTextNode("h1[data-v-936bcac1]{margin-bottom:10px}h2[data-v-936bcac1]{margin-top:1.5rem;margin-bottom:.75rem}h3[data-v-936bcac1]{margin-top:1rem}p[data-v-936bcac1]{margin-bottom:5px}ul li[data-v-936bcac1]{list-style-type:circle;list-style-position:inside;margin-left:15px}pre[data-v-936bcac1]{padding:12px;margin:12px;background-color:#eee}code[data-v-936bcac1]{font-size:.825rem;color:#ae0000}input[data-v-936bcac1]{padding:12px;margin:12px;background-color:#eee}.task-div[data-v-936bcac1]{padding:8px;margin:16px;border:solid;border-radius:4px;border-color:#303030}.action-button-container[data-v-936bcac1]{width:100%;display:flex;justify-content:center}")),document.head.appendChild(a)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
2
+ (function(o,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("vuex"),require("vue")):typeof define=="function"&&define.amd?define(["exports","vuex","vue"],r):(o=typeof globalThis<"u"?globalThis:o||self,r(o["ui-dynamic-table"]={},o.vuex,o.Vue))})(this,function(o,r,t){"use strict";const m=(e,i)=>{const n=e.__vccOpts||e;for(const[d,s]of i)n[d]=s;return n},f={name:"DynamicTable",inject:["$socket"],props:{id:{type:String,required:!0},props:{type:Object,default:()=>({})},state:{type:Object,default:()=>({enabled:!0,visible:!0})}},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,data:e})}),this.$socket.on("msg-input:"+this.id,e=>{this.initialize(e),this.$store.commit("data/bind",{widgetId:this.id,data: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){this.send({payload:i},this.actions.findIndex(n=>n.label===e.label))},initialize(e){this.tasks=e,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 u(e,i,n,d,s,c){const k=t.resolveComponent("v-text-field"),x=t.resolveComponent("v-toolbar"),h=t.resolveComponent("v-btn"),p=t.resolveComponent("v-container"),b=t.resolveComponent("v-data-table");return t.openBlock(),t.createBlock(b,{headers:s.headers,items:s.tasks,search:s.search,class:"full-width-table"},{top:t.withCtx(()=>[t.createVNode(x,{flat:"",class:"py-2"},{default:t.withCtx(()=>[t.createVNode(k,{class:"mx-3",modelValue:s.search,"onUpdate:modelValue":i[0]||(i[0]=a=>s.search=a),label:"Search","prepend-inner-icon":"mdi-magnify",variant:"outlined","hide-details":"","single-line":""},null,8,["modelValue"])]),_:1})]),"item.actions":t.withCtx(({item:a})=>[t.createVNode(p,{class:"action-button-container"},{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(s.actions,(l,y)=>(t.openBlock(),t.createBlock(p,{style:{padding:"0px",display:"inline",width:"fit-content",margin:"0px"}},{default:t.withCtx(()=>[c.conditionCheck(l.condition,a)?(t.openBlock(),t.createBlock(h,{style:{margin:"0px 2px"},key:y,size:"small",onClick:g=>c.actionFn(l,a)},{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(h,{color:"primary",onClick:c.initialize},{default:t.withCtx(()=>[t.createTextVNode(" Reload ")]),_:1},8,["onClick"])]),_:1},8,["headers","items","search"])}const _=m(f,[["render",u],["__scopeId","data-v-936bcac1"]]);o.DynamicTable=_,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
package/ui/components/DynamicTable.vue CHANGED
@@ -1,123 +1,133 @@
1
1
  <template>
2
- <v-data-table
3
- :headers="headers"
4
- :items="tasks"
5
- :search="search"
6
- class="full-width-table"
7
- >
8
- <template v-slot:top>
9
- <v-toolbar flat class="py-2">
10
- <v-text-field
11
- class="mx-3"
12
- v-model="search"
13
- label="Search"
14
- prepend-inner-icon="mdi-magnify"
15
- variant="outlined"
16
- hide-details
17
- single-line
18
- ></v-text-field>
19
- </v-toolbar>
20
- </template>
21
- <template v-slot:item.actions="{ item }">
22
- <v-container class="action-button-container">
23
- <v-container
24
- v-for="(action, index) in actions"
25
- style="padding: 0px; display: inline; width: fit-content; margin: 0px"
26
- >
27
- <v-btn
28
- style="margin: 0px 2px"
29
- v-if="conditionCheck(action.condition, item)"
30
- :key="index"
31
- size="small"
32
- @click="actionFn(action, item)"
33
- >
34
- {{ action.label }}
35
- </v-btn>
36
- </v-container>
37
- </v-container>
38
- </template>
39
- <template v-slot:no-data>
40
- <v-alert text="No data"></v-alert>
41
- </template>
42
- </v-data-table>
2
+ <v-data-table
3
+ :headers="headers"
4
+ :items="tasks"
5
+ :search="search"
6
+ class="full-width-table">
7
+ <template v-slot:top>
8
+ <v-toolbar flat class="py-2">
9
+ <v-text-field
10
+ class="mx-3"
11
+ v-model="search"
12
+ label="Search"
13
+ prepend-inner-icon="mdi-magnify"
14
+ variant="outlined"
15
+ hide-details
16
+ single-line></v-text-field>
17
+ </v-toolbar>
18
+ </template>
19
+ <template v-slot:item.actions="{ item }">
20
+ <v-container class="action-button-container">
21
+ <v-container
22
+ v-for="(action, index) in actions"
23
+ style="
24
+ padding: 0px;
25
+ display: inline;
26
+ width: fit-content;
27
+ margin: 0px;
28
+ ">
29
+ <v-btn
30
+ style="margin: 0px 2px"
31
+ v-if="conditionCheck(action.condition, item)"
32
+ :key="index"
33
+ size="small"
34
+ @click="actionFn(action, item)">
35
+ {{ action.label }}
36
+ </v-btn>
37
+ </v-container>
38
+ </v-container>
39
+ </template>
40
+ <template v-slot:no-data>
41
+ <v-btn color="primary" @click="initialize"> Reload </v-btn>
42
+ </template>
43
+ </v-data-table>
43
44
  </template>
44
45
 
45
46
  <script>
46
47
  import { mapState } from "vuex";
47
48
 
48
49
  export default {
49
- name: "DynamicTable",
50
- inject: ["$socket"],
51
- props: {
52
- /* do not remove entries from this - Dashboard's Layout Manager's will pass this data to your component */
53
- id: { type: String, required: true },
54
- props: { type: Object, default: () => ({}) },
55
- /* state: { type: Object, default: () => ({ enabled: false, visible: false }) } // DEFAULT */
56
- state: { type: Object, default: () => ({ enabled: true, visible: true }) },
57
- },
58
- data() {
59
- return {
60
- search: "",
61
- actions: [],
62
- tasks: [],
63
- headers: [],
64
- };
65
- },
66
- mounted() {
67
- this.$socket.on("widget-load:" + this.id, (columns) => {
68
- this.initialize(columns);
69
- this.$store.commit("data/bind", {
70
- widgetId: this.id,
71
- columns,
72
- });
73
- });
74
- this.$socket.on("msg-input:" + this.id, (columns) => {
75
- this.initialize(columns);
76
- this.$store.commit("data/bind", {
77
- widgetId: this.id,
78
- columns,
79
- });
80
- });
81
- this.$socket.emit("widget-load", this.id);
82
- },
83
- unmounted() {
84
- this.$socket?.off("widget-load" + this.id);
85
- this.$socket?.off("msg-input:" + this.id);
86
- },
87
- methods: {
88
- send(msg, index) {
89
- const msgArr = [];
90
- msgArr[index] = msg;
91
- this.$socket.emit("widget-action", this.id, msgArr);
50
+ name: "DynamicTable",
51
+ inject: ["$socket"],
52
+ props: {
53
+ /* do not remove entries from this - Dashboard's Layout Manager's will pass this data to your component */
54
+ id: { type: String, required: true },
55
+ props: { type: Object, default: () => ({}) },
56
+ /* state: { type: Object, default: () => ({ enabled: false, visible: false }) } // DEFAULT */
57
+ state: {
58
+ type: Object,
59
+ default: () => ({ enabled: true, visible: true }),
60
+ },
92
61
  },
93
- actionFn(action, item) {
94
- this.send(
95
- { payload: item },
96
- this.actions.findIndex((element) => element.label === action.label)
97
- );
62
+ data() {
63
+ return {
64
+ search: "",
65
+ actions: [],
66
+ tasks: [],
67
+ headers: [],
68
+ };
98
69
  },
99
- initialize(tasks) {
100
- this.tasks = tasks;
101
- this.actions = this.props.options;
70
+ mounted() {
71
+ this.$socket.on("widget-load:" + this.id, (data) => {
72
+ this.initialize(data);
73
+ this.$store.commit("data/bind", {
74
+ widgetId: this.id,
75
+ data,
76
+ });
77
+ });
78
+ this.$socket.on("msg-input:" + this.id, (data) => {
79
+ this.initialize(data);
80
+ this.$store.commit("data/bind", {
81
+ widgetId: this.id,
82
+ data,
83
+ });
84
+ });
85
+ this.$socket.emit("widget-load", this.id);
86
+ },
87
+ unmounted() {
88
+ this.$socket?.off("widget-load" + this.id);
89
+ this.$socket?.off("msg-input:" + this.id);
90
+ },
91
+ methods: {
92
+ send(msg, index) {
93
+ const msgArr = [];
94
+ msgArr[index] = msg;
95
+ this.$socket.emit("widget-action", this.id, msgArr);
96
+ },
97
+ actionFn(action, item) {
98
+ this.send(
99
+ { payload: item },
100
+ this.actions.findIndex(
101
+ (element) => element.label === action.label
102
+ )
103
+ );
104
+ },
105
+ initialize(tasks) {
106
+ this.tasks = tasks;
107
+ this.actions = this.props.options;
102
108
 
103
- this.headers = this.props.columns.map((item) => ({
104
- title: item.label,
105
- key: item.value,
106
- }));
109
+ this.headers = this.props.columns.map((item) => ({
110
+ title: item.label,
111
+ key: item.value,
112
+ }));
107
113
 
108
- this.headers.push({ title: "Action", align: "center", key: "actions" });
109
- },
110
- conditionCheck(condition, row) {
111
- if (condition == "") return true;
112
- try {
113
- const func = new Function("row", `return ${condition}`);
114
- return func(row);
115
- } catch (error) {
116
- console.error("Error evaluating condition:", error);
117
- return false;
118
- }
114
+ this.headers.push({
115
+ title: "Actions",
116
+ align: "center",
117
+ key: "actions",
118
+ });
119
+ },
120
+ conditionCheck(condition, row) {
121
+ if (condition == "") return true;
122
+ try {
123
+ const func = new Function("row", `return ${condition}`);
124
+ return func(row);
125
+ } catch (error) {
126
+ console.error("Error evaluating condition:", error);
127
+ return false;
128
+ }
129
+ },
119
130
  },
120
- },
121
131
  };
122
132
  </script>
123
133