@things-factory/operato-tools 7.0.0-y.0 → 7.0.1-alpha.0

package/client/index.js

@@ -1 +0,0 @@
-export * from './actions/main'

package/client/pages/generator/button-config-tab-mixin.js

@@ -1,5 +1,339 @@
-import{html}from"lit-element";import{MetaApi}from"@things-factory/meta-ui/client/utils/meta-api";import{TermsUtil}from"@things-factory/meta-ui/client/utils/terms-util";import{getRenderer}from"@operato/data-grist";export const ButtonConfigTabMixin=e=>class extends e{setButtonConfigTabValues(e){e?.forEach(((e,t)=>{let i=t+1;if(e.rank=10*i,e.id=i,e.logic&&!e.logic.logic){let t=JSON.stringify(e.logic,null,2);e.logic={},e.logic.logic=t}e.style&&Array.isArray(e.style)&&(e.style=JSON.stringify(e.style,null,2))})),this.viewButtonData=e,this.buttonTabGrist?.fetch()}getButtonConfigTabValues(){let e={button:[],grid:{button:[]}},t=this.getElementValueById("button-tab-grid");return this.sortRecordByRank(t)?.forEach((t=>{var{name:i,label:a,style:l,type:r="basic",logic:n,auth:o}=t;if(!i)return;let s={name:i,type:r.replaceAll("grid-",""),label:a||i,auth:o};n&&("string"==typeof n&&(n=JSON.parse(n)),n.logic&&(s.logic=JSON.parse(n.logic))),r.startsWith("grid")?(l&&((l=l.trim()).startsWith("[")&&(l=JSON.parse(l)),s.icon=l),e.grid.button.push(s)):(l&&(s.style=l),e.button.push(s))})),e}renderButtonConfigTab(){return html`
+import { html } from 'lit-element'
+
+import { MetaApi } from '@things-factory/meta-ui/client/utils/meta-api'
+import { TermsUtil } from '@things-factory/meta-ui/client/utils/terms-util'
+import { getRenderer } from '@operato/data-grist'
+
+export const ButtonConfigTabMixin = (baseElement) => class extends baseElement {
+
+  setButtonConfigTabValues(data) {
+    data?.forEach((column, index) => {
+      let rank = index + 1;
+      column.rank = rank * 10;
+      column.id = rank;
+
+      if (column.logic && !column.logic.logic) {
+        let logicString = JSON.stringify(column.logic, null, 2);
+        column.logic = {};
+        column.logic.logic = logicString;
+      }
+
+      if (column.style && Array.isArray(column.style)) {
+        column.style = JSON.stringify(column.style, null, 2);
+      }
+    })
+
+    this.viewButtonData = data;
+    this.buttonTabGrist?.fetch();
+  }
+
+  getButtonConfigTabValues() {
+    // 기본 return object 
+    let retObject = {
+      button: [],
+      grid: {
+        button: []
+      }
+    };
+
+    // grid 에서 데이터 가져오기 
+    let gridValue = this.getElementValueById('button-tab-grid');
+
+    // rank 로 정렬 
+    this.sortRecordByRank(gridValue)?.forEach(x => {
+      var {
+        name = undefined,
+        label = undefined,
+        style = undefined,
+        type = 'basic',
+        logic = undefined,
+        auth = undefined
+      } = x;
+
+      if (!name) return;
+
+      // 그리드, 일반 버튼 동일 
+      let button = {
+        name: name,
+        type: type.replaceAll('grid-', ''),
+        label: label ? label : name,
+        auth: auth
+      }
+
+      // logic 이 있으면 반영 
+      if (logic) {
+        if (typeof logic === 'string') {
+          logic = JSON.parse(logic);
+        }
+
+        if (logic.logic) {
+          button.logic = JSON.parse(logic.logic);
+        }
+      }
+
+
+      // grid 버튼은 icon / 일반 버튼은 style
+      if (type.startsWith('grid')) {
+        if (style) {
+          style = style.trim();
+          if (style.startsWith('[')) {
+            style = JSON.parse(style);
+          }
+          button.icon = style;
+        }
+        retObject.grid.button.push(button);
+      } else {
+        if (style) button.style = style;
+        retObject.button.push(button);
+      }
+    })
+
+    return retObject;
+  }
+
+  renderButtonConfigTab() {
+    return html`
       <ox-grist auto-fetch id="button-tab-grid" .config=${this.buttonTabGridConfig} .mode='GRID'
         .fetchHandler=${this.fetchButtonConfigTabHandler.bind(this)}>
       </ox-grist>
-      `}get buttonTabGrist(){return this.shadowRoot.querySelector("#button-tab-grid")}async fetchButtonConfigTabHandler(){return{total:0,records:this.viewButtonData||[]}}setButtonConfigTabConfig(){this.buttonTabGridConfig={rows:MetaApi.getGristSelectableConfig(!0),pagination:{infinite:!0},sorters:[{name:"rank",desc:!1}],appendable:!0,columns:[...MetaApi.getGristGuttersConfig(!1,!1),{type:"gutter",gutterName:"button",icon:"delete",handlers:{click:(e,t,i,a,l)=>{a.id&&this.deleteRow(this.buttonTabGrist,a)}}},{type:"string",name:"id",hidden:!0},{type:"integer",name:"rank",header:TermsUtil.tLabel("rank"),sortable:!1,width:55,record:{align:"right",editable:!0,mandatory:!0}},{type:"string",name:"name",header:TermsUtil.tLabel("name"),sortable:!1,width:150,record:{align:"left",editable:!0,mandatory:!0}},{type:"string",name:"label",header:TermsUtil.tLabel("label"),sortable:!1,width:150,record:{align:"left",editable:!0,mandatory:!0}},{type:"string",name:"display",header:TermsUtil.tLabel("display"),sortable:!1,width:150,record:{align:"left",editable:!1,mandatory:!1,renderer:(e,t,i,a,l)=>{let r=i.label?i.label:i.name;return TermsUtil.tButton(r)}}},{type:"select",name:"type",header:TermsUtil.tLabel("type"),sortable:!1,width:100,record:{align:"left",editable:!0,mandatory:!0,options:["","basic","custom","grid-basic","grid-custom"]}},{type:"string",name:"style",header:TermsUtil.tLabel("style"),sortable:!1,width:100,record:{align:"left",editable:!0,mandatory:!1}},{type:"select",name:"auth",header:TermsUtil.tLabel("auth"),sortable:!1,width:80,record:{align:"left",editable:!0,mandatory:!0,options:[{value:"",display:""},{value:"R",display:"SELECT"},{value:"C",display:"CREATE"},{value:"U",display:"UPDATE"},{value:"D",display:"DELETE"}]}},{type:"parameters",name:"logic",header:TermsUtil.tLabel("logic"),sortable:!1,width:390,record:{align:"left",editable:!0,mandatory:!1,renderer:(e,t,i,a,l)=>{if(i.logic)"basic"===i.type&&(i.logic=void 0);else if("basic"===i.type)delete i.logic;else if("custom"===i.type){let e={logic:JSON.stringify({open_popup:{title:"menu.variables",title_detail:"name",type:"popup",menu:"menu-routing",tagname:"meta-grist-element",location:"pages/meta-grist-element.js",size:"large",popup_field:"param_field",parent_field:"id",param:["filter","grist_one","grist_selected","grist_changed"]},call_scenario:{type:"scenario",name:"testScenario",after:"fetch",param:["filter","grist_all","grist_selected"]}},null,2)};i.logic=e}else if("grid-basic"===i.type){let e={logic:'"record-view"'};i.logic=e}else if("grid-custom"===i.type){let e={logic:JSON.stringify({open_popup:{title:"menu.variables",title_detail:"name",type:"popup",menu:"menu-routing",tagname:"meta-grist-element",location:"pages/meta-grist-element.js",size:"large",popup_field:"param_field",parent_field:"id"},open_form_popup:{type:"form",title:"title.detail",title_detail:"name",size:"large",menu:"operation-master"},call_scenario:{type:"scenario",name:"testScenario",after:"fetch"}},null,2)};i.logic=e}else i.logic=void 0;return getRenderer("json5")(e,t,i,a,l)},options:(e,t,i,a,l)=>{var{name:r,help:n}={name:TermsUtil.tLabel("logic"),help:""};return{name:r,spec:[{label:"script",name:"logic",type:"textarea"}],help:n,context:this.buttonTabGrist}}}}]}}};
+      `
+  }
+
+  get buttonTabGrist() {
+    return this.shadowRoot.querySelector('#button-tab-grid')
+  }
+
+  async fetchButtonConfigTabHandler() {
+    return {
+      total: 0,
+      records: this.viewButtonData || []
+    }
+  }
+
+
+
+  setButtonConfigTabConfig() {
+
+    // 그리드 설정
+    this.buttonTabGridConfig = {
+      rows: MetaApi.getGristSelectableConfig(true),
+      pagination: { infinite: true },
+      sorters: [{ name: 'rank', desc: false }],
+      appendable: true,
+      columns: [
+        ...MetaApi.getGristGuttersConfig(false, false),
+        {
+          type: 'gutter', gutterName: 'button', icon: 'delete',
+          handlers: {
+            click: (_columns, _data, _column, record, _rowIndex) => {
+              if (record.id) {
+                this.deleteRow(this.buttonTabGrist, record);
+              }
+            }
+          },
+        },
+        {
+          type: 'string',
+          name: 'id',
+          hidden: true
+        },
+        {
+          type: 'integer',
+          name: 'rank',
+          header: TermsUtil.tLabel('rank'),
+          sortable: false,
+          width: 55,
+          record: {
+            align: 'right',
+            editable: true,
+            mandatory: true
+          }
+        },
+        {
+          type: 'string',
+          name: 'name',
+          header: TermsUtil.tLabel('name'),
+          sortable: false,
+          width: 150,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: true
+          }
+        },
+        {
+          type: 'string',
+          name: 'label',
+          header: TermsUtil.tLabel('label'),
+          sortable: false,
+          width: 150,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: true
+          }
+        },
+        {
+          type: 'string',
+          name: 'display',
+          header: TermsUtil.tLabel('display'),
+          sortable: false,
+          width: 150,
+          record: {
+            align: 'left',
+            editable: false,
+            mandatory: false,
+            renderer: (value, column, record, rowIndex, field) => {
+              let tLabel = record.label ? record.label : record.name;
+              return TermsUtil.tButton(tLabel)
+            }
+          }
+        },
+        {
+          type: 'select',
+          name: 'type',
+          header: TermsUtil.tLabel('type'),
+          sortable: false,
+          width: 100,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: true,
+            options: ['', 'basic', 'custom', 'grid-basic', 'grid-custom']
+          }
+        },
+        {
+          type: 'string',
+          name: 'style',
+          header: TermsUtil.tLabel('style'),
+          sortable: false,
+          width: 100,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: false
+          }
+        },
+        {
+          type: 'select',
+          name: 'auth',
+          header: TermsUtil.tLabel('auth'),
+          sortable: false,
+          width: 80,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: true,
+            options: [
+              {value:'', display:''},
+              {value:'R', display:'SELECT'},
+              {value:'C', display:'CREATE'},
+              {value:'U', display:'UPDATE'},
+              {value:'D', display:'DELETE'}
+            ]
+          }
+        },
+        {
+          type: 'parameters',
+          name: 'logic',
+          header: TermsUtil.tLabel('logic'),
+          sortable: false,
+          width: 390,
+          record: {
+            align: 'left',
+            editable: true,
+            mandatory: false,
+            renderer: (value, column, record, rowIndex, field) => {
+              if (!record.logic) {
+                if (record.type === 'basic') {
+                  delete record.logic;
+                } else if (record.type === 'custom') {
+                  let guide = {
+                    logic: JSON.stringify({
+                      open_popup: {
+                        "title": "menu.variables",
+                        "title_detail": "name",
+                        "type": "popup",
+                        "menu": "menu-routing",
+                        "tagname": "meta-grist-element",
+                        "location": "pages/meta-grist-element.js",
+                        "size": "large",
+                        "popup_field": "param_field",
+                        "parent_field": "id",
+                        "param": [
+                          "filter",
+                          "grist_one",
+                          "grist_selected",
+                          "grist_changed"
+                        ]
+                      },
+                      call_scenario: {
+                        "type": "scenario",
+                        "name": "testScenario",
+                        "after": "fetch",
+                        "param": [
+                          "filter",
+                          "grist_all",
+                          "grist_selected"
+                        ]
+                      }
+                    }, null, 2)
+                  }
+                  record.logic = guide;
+                } else if (record.type === 'grid-basic') {
+                  let guide = {
+                    logic: '"record-view"'
+                  }
+                  record.logic = guide;
+                } else if (record.type === 'grid-custom') {
+                  let guide = {
+                    logic: JSON.stringify({
+                      open_popup: {
+                        "title": "menu.variables",
+                        "title_detail": "name",
+                        "type": "popup",
+                        "menu": "menu-routing",
+                        "tagname": "meta-grist-element",
+                        "location": "pages/meta-grist-element.js",
+                        "size": "large",
+                        "popup_field": "param_field",
+                        "parent_field": "id",
+                      },
+                      open_form_popup: {
+                        "type": "form",
+                        "title": "title.detail",
+                        "title_detail": "name",
+                        "size": "large",
+                        "menu": "operation-master"
+                      },
+                      call_scenario: {
+                        "type": "scenario",
+                        "name": "testScenario",
+                        "after": "fetch"
+                      }
+                    }, null, 2)
+                  }
+                  record.logic = guide;
+                } else {
+                  record.logic = undefined;
+                }
+              } else {
+                if (record.type === 'basic') {
+                  record.logic = undefined;
+                }
+              }
+              return getRenderer('json5')(value, column, record, rowIndex, field)
+            },
+            options: (value, column, record, row, field) => {
+              var { name, help } = { name: TermsUtil.tLabel('logic'), help: '' };
+              let spec = [{ label: 'script', name: 'logic', type: 'textarea' }];
+              const context = this.buttonTabGrist
+              return { name, spec, help, context }
+            }
+          }
+        }
+      ]
+    }
+  }
+}
+