vite-plugin-css-injected-by-jsはメンテナンスされていないため、通常のソースマップ生成に影響を与えるので、vite-plugin-lib-injected-cssを使用してください

# Conflicts:
#	plugin/kintone-addins/package.json
#	plugin/kintone-addins/vite.config.js

backend/app/api/api_v1/routers/kintone.py

@@ -218,8 +218,6 @@ def deoployappfromkintone(app:str,revision:str,c:config.KINTONE_ENV):
     r = httpx.post(url,headers=headers,data=json.dumps(data))
     return r.json
     
-# 既定項目に含めるアプリのフィールドのみ取得する
-# スペース、枠線、ラベルを含まない    
 def getfieldsfromkintone(app:str,c:config.KINTONE_ENV):
     headers={config.API_V1_AUTH_KEY:c.API_V1_AUTH_VALUE}
     params = {"app":app}
@@ -227,44 +225,6 @@ def getfieldsfromkintone(app:str,c:config.KINTONE_ENV):
     r = httpx.get(url,headers=headers,params=params)
     return r.json()
 
-# フォームに配置するフィールドのみ取得する
-# スペース、枠線、ラベルも含める
-def getformfromkintone(app:str,c:config.KINTONE_ENV):
-    headers={config.API_V1_AUTH_KEY:c.API_V1_AUTH_VALUE}
-    params = {"app":app}
-    url = f"{c.BASE_URL}{config.API_V1_STR}/form.json"
-    r = httpx.get(url,headers=headers,params=params)
-    return r.json()
-
-
-def merge_kintone_fields(fields_response: dict, form_response: dict) -> dict:
-    fields_properties = fields_response.get('properties', {})
-    form_properties = form_response.get('properties', [])
-
-    merged_properties = {k: v for k, v in fields_properties.items()}
-
-    for index, form_field in enumerate(form_properties):
-        code = form_field.get('code')
-        if code:
-            if code and code not in merged_properties:
-                merged_properties[code] = form_field
-        else:
-            element_id = form_field.get('elementId')
-            if element_id:
-                key = element_id
-                form_field['code']=element_id
-                form_field['label']=form_field.get('type')
-            # else:
-            #     key = f"{form_field.get('type')}_{index}"
-                merged_properties[key] = form_field 
-
-    merged_response = {
-        'revision': fields_response.get('revision', ''),
-        'properties': merged_properties
-    }
-    
-    return merged_response
-
 def analysefields(excel,kintone):
     updatefields={}
     addfields={}
@@ -522,15 +482,6 @@ async def appfields(request:Request,app:str,env = Depends(getkintoneenv)):
     except Exception as e:
        raise APIException('kintone:appfields',request.url._url, f"Error occurred while get app fileds({env.DOMAIN_NAM}->{app}):",e) 
 
-@r.get("/allfields")
-async def allfields(request:Request,app:str,env = Depends(getkintoneenv)):
-    try:
-        field_resp = getfieldsfromkintone(app,env)
-        form_resp = getformfromkintone(app,env)
-        return merge_kintone_fields(field_resp,form_resp)
-    except Exception as e:
-       raise APIException('kintone:allfields',request.url._url, f"Error occurred while get form fileds({env.DOMAIN_NAM}->{app}):",e) 
-
 @r.get("/appprocess")
 async def appprocess(request:Request,app:str,env = Depends(getkintoneenv)):
     try:

backend/readme.md

@@ -25,7 +25,3 @@ python -m venv env
    pip install -r requirements.txt
 
    ```
-4. backend 起動
-   ```bash
-   uvicorn app.main:app --reload
-   ```

frontend/.env

@@ -1,2 +1,3 @@
 KAB_BACKEND_URL="https://kab-backend.azurewebsites.net/"
 #KAB_BACKEND_URL="http://127.0.0.1:8000/"
+

frontend/src/components/AppFieldSelectBox.vue

@@ -0,0 +1,152 @@
+<template>
+
+    <div class="q-mx-md q-mb-lg">
+        <div class="q-mb-xs q-ml-md text-primary">アプリ選択</div>
+
+        <div class="q-pa-md row" style="border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 4px;">
+            <div v-if="selField?.app && !showSelectApp">{{ selField.app?.name }}</div>
+            <q-space />
+            <div>
+                <q-btn outline dense label="選 択" padding="none sm" color="primary" @click="() => {
+                    showSelectApp = true;
+                }"></q-btn>
+            </div>
+        </div>
+    </div>
+
+    <div v-if="!showSelectApp && selField.app?.name">
+        <div>
+            <div class="row q-mb-md">
+                <!-- <div class="col"> -->
+                <div class="q-mb-xs q-ml-md text-primary">フィールド選択</div>
+                <!-- </div> -->
+                <q-space />
+                <!-- <div class="col"> -->
+                <div class="q-mr-md">
+                    <q-input dense debounce="300" v-model="fieldFilter" placeholder="フィールド検索" clearable>
+                        <template v-slot:before>
+                            <q-icon name="search" />
+                        </template>
+                    </q-input>
+                </div>
+            </div>
+            <div class="row">
+                <field-select ref="fieldDlg" name="フィールド" :type="selectType" :updateSelects="updateItems"
+                    :appId="selField.app?.id" not_page :filter="fieldFilter"
+                    :selFields="selField.fields"></field-select>
+            </div>
+        </div>
+    </div>
+    <div style="min-width: 45vw;" v-else>
+    </div>
+
+
+    <show-dialog v-model:visible="showSelectApp" name="アプリ選択" @close="closeAppDlg">
+        <template v-slot:toolbar>
+            <q-input dense debounce="300" v-model="filter" placeholder="検索" clearable>
+                <template v-slot:before>
+                    <q-icon name="search" />
+                </template>
+            </q-input>
+        </template>
+
+        <AppSelectBox ref="appDlg" name="アプリ" type="single" :filter="filter"
+            :updateExternalSelectAppInfo="updateExternalSelectAppInfo"></AppSelectBox>
+    </show-dialog>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref, watchEffect, computed ,reactive} from 'vue';
+import ShowDialog from './ShowDialog.vue';
+import FieldSelect from './FieldSelect.vue';
+import { useFlowEditorStore } from 'stores/flowEditor';
+import AppSelectBox from './AppSelectBox.vue';
+interface IApp {
+    id: string,
+    name: string
+}
+interface IField {
+    name: string,
+    code: string,
+    type: string
+}
+
+interface IAppFields {
+    app?: IApp,
+    fields: IField[]
+}
+
+export default defineComponent({
+    inheritAttrs: false,
+    name: 'AppFieldSelectBox',
+    components: {
+        ShowDialog,
+        FieldSelect,
+        AppSelectBox,
+    },
+    props: {
+      selectedField: {
+            type: Object,
+            required: true
+        },
+        selectType: {
+            type: String,
+            default: 'single'
+        },
+
+    },
+    setup(props, { emit }) {
+        const appDlg = ref();
+        const fieldDlg = ref();
+        const showSelectApp = ref(false);
+        const selField = reactive(props.selectedField);
+        console.log(props.selectedField);
+
+        const store = useFlowEditorStore();
+
+        const isSelected = computed(() => {
+            return selField !== null && typeof selField === 'object' && ('app' in selField)
+        });
+
+
+        const closeAppDlg = (val: string) => {
+            if (val == 'OK') {
+                selField.app = appDlg.value.selected[0];
+                selField.fields = [];
+                showSelectApp.value = false;
+            }
+        };
+
+        const closeFieldDialog = (val: string) => {
+            if (val == 'OK') {
+                selField.fields = fieldDlg.value.selected;
+            }
+        };
+        const updateExternalSelectAppInfo = (newAppinfo: IApp) => {
+            selField.app = newAppinfo
+        }
+
+        const updateItems = (newFields: IField[]) => {
+            selField.fields = newFields
+        }
+
+        watchEffect(() => {
+            emit('update:modelValue', selField);
+        });
+
+        return {
+            appDlg,
+            fieldDlg,
+            closeAppDlg,
+            closeFieldDialog,
+            showSelectApp,
+            isSelected,
+            updateExternalSelectAppInfo,
+            filter: ref(),
+            updateItems,
+            fieldFilter: ref(),
+            selField
+        };
+    }
+});
+</script>

frontend/src/components/AppSelectBox.vue

@@ -21,7 +21,7 @@ import { ref, onMounted, reactive, watchEffect } from 'vue'
 import { api } from 'boot/axios';
 
 export default {
-  name: 'AppSelect',
+  name: 'AppSelectBox',
   props: {
     name: String,
     type: String,

frontend/src/components/ConditionEditor/NodeCondition.vue

@@ -113,7 +113,7 @@ import { finished } from 'stream';
   </div>
 </template>
 <script lang="ts">
-import { defineComponent,ref,reactive, computed } from 'vue';
+import { defineComponent,ref,reactive, computed, inject } from 'vue';
 import { INode,ConditionTree,GroupNode,ConditionNode, LogicalOperator,Operator,NodeType } from '../../types/Conditions';
 import ConditionObject from './ConditionObject.vue';
 export default defineComponent( {
@@ -143,12 +143,9 @@ export default defineComponent( {
       return opts;
     });
 
+    const operator = inject('Operator')
     const operators =computed(()=>{
-      const opts=[];
+      return operator ? operator : Object.values(Operator);
-      for(const op in Operator){
-        opts.push(Operator[op as keyof typeof Operator]);
-      }
-      return opts;
     });
     const tree = reactive(props.conditionTree);
 

frontend/src/components/FieldSelect.vue

@@ -11,7 +11,6 @@
 import { ref, onMounted, reactive, watchEffect } from 'vue'
 import { api } from 'boot/axios';
 
-
 export default {
   name: 'fieldSelect',
   props: {
@@ -29,9 +28,8 @@ export default {
       type:Array,
       default:()=>[]
     },
-    fieldTypes:{
+    updateSelects: {
-      type:Array,
+      type: Function
-      default:()=>[]
     },
     filter: String,
   },
@@ -45,26 +43,29 @@ export default {
     const pageSetting = ref({
       sortBy: 'desc',
       descending: false,
-      page: 1,
+      page: 2,
       rowsPerPage: props.not_page ? 0 : 5
       // rowsNumber: xx if getting data from a server
     });
     const rows = reactive([]);
     const selected = ref(props.selectedFields && props.selectedFields.length>0?props.selectedFields:[]);
 
+    watchEffect(() => {
+        props.updateSelects(selected);
+    });
+
     onMounted(async () => {
-      const url = props.fieldTypes.includes('SPACER')?'api/v1/allfields':'api/v1/appfields';
+      const res = await api.get('api/v1/appfields', {
-      const res = await api.get(url, {
         params: {
           app: props.appId
         }
       });
       let fields = res.data.properties;
+      console.log(fields);
       Object.keys(fields).forEach((key) => {
         const fld = fields[key];
-        if(props.fieldTypes.length===0 || props.fieldTypes.includes(fld.type)){
+        // rows.push({name:fields[key].label,code:fields[key].code,type:fields[key].type});
-          rows.push({ name: fld.code, ...fld });
+        rows.push({ name: fld.label, ...fld });
-        }
       });
       isLoaded.value = true;
     });

frontend/src/components/left/AppSelector.vue

@@ -30,7 +30,7 @@
           </template>
         </q-input>
       </template>
-      <AppSelect ref="appDg" name="アプリ" type="single" :filter="filter"></AppSelect>
+      <AppSelectBox ref="appDg" name="アプリ" type="single" :filter="filter"></AppSelectBox>
   </ShowDialog>
 </template>
 
@@ -38,7 +38,7 @@
 import { defineComponent,ref } from 'vue';
 import {AppInfo} from '../../types/ActionTypes'
 import ShowDialog from '../../components/ShowDialog.vue';
-import AppSelect from '../../components/AppSelect.vue';
+import AppSelectBox from '../../components/AppSelectBox.vue';
 import { useFlowEditorStore } from 'stores/flowEditor';
 import { useAuthStore } from 'src/stores/useAuthStore';
 export default defineComponent({
@@ -47,7 +47,7 @@ export default defineComponent({
     "appSelected"
   ],
   components:{
-    AppSelect,
+    AppSelectBox,
     ShowDialog
   },
   setup(props, context) {

frontend/src/components/left/EventTree.vue

@@ -3,11 +3,11 @@
   <q-tree :nodes="store.eventTree.screens" node-key="eventId" children-key="events" no-connectors
     v-model:expanded="store.expandedScreen" :dense="true" :ref="tree">
     <template v-slot:header-EVENT="prop">
-      <div :ref="prop.node.eventId" class="row col items-center no-wrap event-node" @click="onSelected(prop.node)">
+      <div :ref="prop.node.eventId" class="row col items-center no-wrap event-node">
         <q-icon v-if="prop.node.eventId" name="play_circle" :color="prop.node.hasFlow ? 'green' : 'grey'" size="16px"
           class="q-mr-sm">
         </q-icon>
-        <div class="no-wrap"
+        <div class="no-wrap" @click="onSelected(prop.node)"
           :class="selectedEvent && prop.node.eventId === selectedEvent.eventId ? 'selected-node' : ''">{{
             prop.node.label }}</div>
         <q-space></q-space>
@@ -15,21 +15,25 @@
       </div>
     </template>
     <template v-slot:header-CHANGE="prop">
-      <div class="row col items-start no-wrap event-node">
+      <div class="row col items-center no-wrap event-node">
-        <div class="no-wrap"
+        <div class="no-wrap">{{ prop.node.label }}</div>
-        :class="selectedEvent && prop.node.eventId === selectedEvent.eventId ? 'selected-node' : ''"
-        >{{ prop.node.label }}</div>
         <q-space></q-space>
         <q-icon name="add_circle" color="primary" size="16px" class="q-mr-sm"
           @click="addChangeEvent(prop.node)"></q-icon>
       </div>
     </template>
     <template v-slot:header-DELETABLE="prop">
-      <div class="row col items-start event-node" @click="onSelected(prop.node)">
+      <div class="row col items-center event-node">
-          <q-icon v-if="prop.node.eventId" name="play_circle" :color="prop.node.hasFlow ? 'green' : 'grey'" size="16px" class="q-mr-sm" />
+        <div class="row col items-center" @click="onSelected(prop.node)">
-          <div class="no-wrap" :class="selectedEvent && prop.node.eventId === selectedEvent.eventId ? 'selected-node' : ''" >{{ prop.node.label }}</div>
+          <q-icon v-if="prop.node.eventId" name="play_circle" :color="prop.node.hasFlow ? 'green' : 'grey'" size="16px"
-          <q-space></q-space>
+            class="q-mr-sm">
-          <q-icon  name="delete_forever"  color="negative" size="16px" @click="deleteEvent(prop.node)"></q-icon>
+          </q-icon>
+          <div>{{ prop.node.label }}</div>
+        </div>
+        <div>
+          <q-btn class="q-mr-sm delete-btn" flat fab-mini icon="delete_forever" padding="none" color="negative"
+            @click="deleteEvent(prop.node)"></q-btn>
+        </div>
       </div>
     </template>
   </q-tree>

frontend/src/components/right/AppFieldSelect.vue

@@ -18,10 +18,11 @@
             <q-separator />
             <q-card-section class="q-pa-none q-ma-none">
                 <div style="">
-                    <div v-if="selectedField.fields && selectedField.fields.length > 0 ">
+                    <div v-if="selectedField.fields && selectedField.fields.length > 0">
                         <q-list bordered>
-                        <q-virtual-scroll style="max-height: 160px;" :items="selectedField.fields" separator v-slot="{ item, index }">
+                            <q-virtual-scroll style="max-height: 160px;" :items="selectedField.fields" separator
-                            <q-item :key="index" dense clickable >
+                                v-slot="{ item, index }">
+                                <q-item :key="index" dense clickable>
                                     <q-item-section>
                                         <q-item-label>
                                             {{ item.label }}
@@ -39,7 +40,7 @@
                 </div>
                 <!-- <q-separator /> -->
             </q-card-section>
-            <q-card-section class="q-px-none q-py-xs" v-if="selectedField.fields && selectedField.fields.length===0">
+            <q-card-section class="q-px-none q-py-xs" v-if="selectedField.fields && selectedField.fields.length === 0">
                 <div class="row">
                     <div class="text-grey text-caption"> {{ $props.placeholder }}</div>
                     <!-- <q-btn flat color="grey" label="clear" @click="clear" /> -->
@@ -47,90 +48,38 @@
             </q-card-section>
         </q-card>
     </div>
-
     <show-dialog v-model:visible="show" name="フィールド一覧" @close="closeFieldDialog" ref="fieldDlg">
-
+        <AppFieldSelectBox v-model:selectedField="selectedField" :selectType="selectType" />
-        <div class="q-mx-md q-mb-lg">
-            <div class="q-mb-xs q-ml-md text-primary">アプリ選択</div>
-
-            <div class="q-pa-md row" style="border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 4px;">
-                <div v-if="!showSelectApp && selectedField.app">{{ selectedField.app?.name }}</div>
-                <q-space />
-                <div>
-                    <q-btn outline dense label="選 択" padding="none sm" color="primary" @click="() => {
-                        showSelectApp = true;
-                    }"></q-btn>
-                </div>
-            </div>
-        </div>
-
-        <div v-if="!showSelectApp && selectedField.app?.name">
-            <div>
-                <div class="row q-mb-md">
-                    <!-- <div class="col"> -->
-                    <div class="q-mb-xs q-ml-md text-primary">フィールド選択</div>
-                    <!-- </div> -->
-                    <q-space />
-                    <!-- <div class="col"> -->
-                    <div class="q-mr-md">
-                      <q-input dense debounce="300" v-model="fieldFilter" placeholder="フィールド検索" clearable>
-                          <template v-slot:before>
-                              <q-icon name="search" />
-                          </template>
-                      </q-input>
-                    </div>
-                </div>
-                <div class="row">
-                    <field-select ref="fieldDlg" name="フィールド" :type="selectType"
-                        :appId="selectedField.app?.id" not_page :filter="fieldFilter" :selectedFields="selectedField.fields" :fieldTypes="fieldTypes"></field-select>
-                </div>
-            </div>
-        </div>
-        <div style="min-width: 45vw;" v-else>
-        </div>
-
-    </show-dialog>
-
-    <show-dialog v-model:visible="showSelectApp" name="アプリ選択" @close="closeAppDlg">
-        <template v-slot:toolbar>
-            <q-input dense debounce="300" v-model="filter" placeholder="検索" clearable>
-                <template v-slot:before>
-                    <q-icon name="search" />
-                </template>
-            </q-input>
-        </template>
-        <AppSelect ref="appDlg" name="アプリ" type="single" :filter="filter" ></AppSelect>
     </show-dialog>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, watchEffect, computed } from 'vue';
+import { defineComponent, ref, watchEffect } from 'vue';
+import AppFieldSelectBox from '../AppFieldSelectBox.vue';
 import ShowDialog from '../ShowDialog.vue';
-import FieldSelect from '../FieldSelect.vue';
 import { useFlowEditorStore } from 'stores/flowEditor';
-import AppSelect from '../AppSelect.vue';
+
-interface IApp{
+export interface IApp {
-  id:string,
+    id: string,
-  name:string
+    name: string
 }
-interface IField {
+export interface IField {
     name: string,
     code: string,
     type: string
 }
 
-interface IAppFields{
+export interface IAppFields {
-   app?:IApp,
+    app?: IApp,
-   fields:IField[]
+    fields: IField[]
 }
 
 export default defineComponent({
-    inheritAttrs:false,
+    inheritAttrs: false,
     name: 'AppFieldSelect',
     components: {
         ShowDialog,
-        FieldSelect,
+        AppFieldSelectBox
-        AppSelect,
     },
     props: {
         displayName: {
@@ -149,59 +98,30 @@ export default defineComponent({
             type: Object,
             default: null
         },
-        selectType:{
+        selectType: {
-            type:String,
+            type: String,
-            default:'single'
+            default: 'single'
-        },
-        fieldTypes:{
-            type:Array,
-            default:()=>[]
         }
     },
     setup(props, { emit }) {
-        const appDlg = ref();
-        const fieldDlg = ref();
         const show = ref(false);
-        const showSelectApp = ref(false);
         const selectedField = ref<IAppFields>({
-          app:undefined,
+            app: undefined,
-          fields:[]
+            fields: []
         });
-       if(props.modelValue && "app" in props.modelValue && "fields" in props.modelValue){
+        if (props.modelValue && "app" in props.modelValue && "fields" in props.modelValue) {
-         selectedField.value=props.modelValue as IAppFields;
+            selectedField.value = props.modelValue as IAppFields;
         }
         const store = useFlowEditorStore();
 
-        const isSelected = computed(() => {
-            return selectedField.value !== null && typeof selectedField.value === 'object' && ('app' in selectedField.value)
-        });
-
-        const showDg = () => {
-            show.value = true;
-        };
-
         const clear = () => {
-            selectedField.value ={
+            selectedField.value = {
-              fields:[]
+                fields: []
-            } ;
-        }
-
-        const closeAppDlg = (val: string) => {
-            if (val == 'OK') {
-                selectedField.value.app = appDlg.value.selected[0];
-                selectedField.value.fields=[];
-                showSelectApp.value=false;
-            }
             };
-
-        const closeFieldDialog=(val:string)=>{
-          if (val == 'OK') {
-                selectedField.value.fields = fieldDlg.value.selected;
         }
-        };
 
-        const removeField=(index:number)=>{
+        const removeField = (index: number) => {
-          selectedField.value.fields.splice(index,1);
+            selectedField.value.fields.splice(index, 1);
         }
         watchEffect(() => {
             emit('update:modelValue', selectedField.value);
@@ -209,19 +129,11 @@ export default defineComponent({
 
         return {
             store,
-            appDlg,
-            fieldDlg,
             show,
-            showDg,
+            showDg: () => { show.value = true },
-            closeAppDlg,
-            closeFieldDialog,
             selectedField,
-            showSelectApp,
-            isSelected,
-            filter: ref(),
             clear,
-            fieldFilter: ref(),
+            removeField,
-            removeField
         };
     }
 });

frontend/src/components/right/AppSelect.vue

@@ -0,0 +1,93 @@
+<template>
+    <div>
+        <q-field :label="displayName" labelColor="primary" stack-label>
+            <template v-slot:control>
+                <q-card flat class="full-width">
+                    <q-card-actions vertical>
+                        <q-btn color="grey-3" text-color="black" @click="() => { dgIsShow = true }">アプリ選択</q-btn>
+                    </q-card-actions>
+                    <q-card-section class="text-caption">
+                        <div v-if="selectedField.app.name">
+                            {{ selectedField.app.name }}
+                        </div>
+                        <div v-else>{{ placeholder }}</div>
+                    </q-card-section>
+                </q-card>
+            </template>
+        </q-field>
+    </div>
+
+    <ShowDialog v-model:visible="dgIsShow" name="アプリ選択" @close="closeDg" min-width="50vw" min-height="50vh">
+        <template v-slot:toolbar>
+            <q-input dense debounce="300" v-model="filter" placeholder="検索" clearable>
+                <template v-slot:before>
+                    <q-icon name="search" />
+                </template>
+            </q-input>
+        </template>
+        <AppSelectBox ref="appDg" name="アプリ" type="single" :filter="filter"></AppSelectBox>
+    </ShowDialog>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, reactive, ref, watchEffect } from 'vue';
+import ShowDialog from '../ShowDialog.vue';
+import AppSelectBox from '../AppSelectBox.vue';
+
+
+export default defineComponent({
+    inheritAttrs: false,
+    name: 'AppSelect',
+    components: {
+        ShowDialog,
+        AppSelectBox
+    },
+    props: {
+        context: {
+            type: Array<Props>,
+            default: '',
+        },
+        displayName: {
+            type: String,
+            default: '',
+        },
+        name: {
+            type: String,
+            default: '',
+        },
+        placeholder: {
+            type: String,
+            default: '',
+        },
+        modelValue: {
+            type: Object,
+            default: null
+        }
+    },
+    setup(props, { emit }) {
+        const appDg = ref()
+        const dgIsShow = ref(false)
+        const selectedField = props.modelValue && props.modelValue.app ? props.modelValue : reactive({app:{}});
+        const closeDg = (state: string) => {
+            dgIsShow.value = false;
+            if (state == 'OK') {
+                selectedField.app = appDg.value.selected[0];
+            }
+        };
+
+        console.log(selectedField);
+
+        watchEffect(() => {
+            emit('update:modelValue', selectedField);
+        });
+
+        return {
+            filter: ref(''),
+            dgIsShow,
+            appDg,
+            closeDg,
+            selectedField
+        };
+    }
+});
+</script>

frontend/src/components/right/ConditionInput.vue

@@ -4,7 +4,8 @@
       <template v-slot:control>
         <q-card flat class="full-width">
           <q-card-actions vertical>
-            <q-btn color="grey-3" text-color="black" @click="showDg()">クリックで設定：{{ isSetted ? '設定済み' : '未設定' }}</q-btn>
+            <q-btn color="grey-3" text-color="black" :disable="btnDisable" @click="showDg()">クリックで設定：{{ isSetted ?
+              '設定済み' : '未設定' }}</q-btn>
           </q-card-actions>
           <q-card-section class="text-caption">
             <div v-if="!isSetted">{{ placeholder }}</div>
@@ -20,7 +21,7 @@
 
 
 <script lang="ts">
-import { ConditionNode, ConditionTree, Operator } from 'app/src/types/Conditions';
+import { ConditionNode, ConditionTree, Operator, OperatorListItem } from 'app/src/types/Conditions';
 import { computed, defineComponent, provide, reactive, ref, watchEffect } from 'vue';
 import ConditionEditor from '../ConditionEditor/ConditionEditor.vue';
 
@@ -28,6 +29,10 @@ type Props = {
   props?: {
     name: string;
     modelValue?: {
+      app: {
+        id: string;
+        name: string;
+      },
       fields: {
         type: string;
         label: string;
@@ -72,6 +77,13 @@ export default defineComponent({
     sourceType: {
       type: String,
       default: 'field'
+    },
+    onlySourceSelect: {
+      type: Boolean,
+      default: false
+    },
+    operatorList: {
+      type: Array,
     }
   },
 
@@ -79,21 +91,37 @@ export default defineComponent({
     const source = props.context.find(element => element?.props?.name === 'sources')
 
     if (source) {
-      if(props.sourceType === 'field'){
+      if (props.sourceType === 'field') {
-        provide('sourceFields', computed( () => source.props?.modelValue?.fields ?? []));
+        provide('sourceFields', computed(() => source.props?.modelValue?.fields ?? []));
-      } else if(props.sourceType === 'app'){
+      } else if (props.sourceType === 'app') {
-        console.log('sourceApp', source.props?.modelValue);
+        provide('sourceApp', computed(() => source.props?.modelValue?.app?.id));
-        provide('sourceApp', computed( () => source.props?.modelValue?.app?.id));
       }
     }
 
+    provide('Operator', props.operatorList);
+
+    const btnDisable = computed(() => {
+      const onlySourceSelect = props.onlySourceSelect;
+
+      if (!onlySourceSelect) {
+        return false;
+      }
+
+      if (props.sourceType === 'field') {
+        return source?.props?.modelValue?.fields?.length ?? 0 > 0;
+      } else if (props.sourceType === 'app') {
+        return source?.props?.modelValue?.app?.id ? false : true
+      }
+      return true;
+    })
+
     const appDg = ref();
     const show = ref(false);
     const tree = reactive(new ConditionTree());
     if (props.modelValue && props.modelValue !== '') {
       tree.fromJson(props.modelValue);
     } else {
-      const newNode = new ConditionNode({}, Operator.Equal, '', tree.root);
+      const newNode = new ConditionNode({}, (props.operatorList && props.operatorList.length > 0) ? props.operatorList[0] as OperatorListItem : Operator.Equal, '', tree.root);
       tree.addNode(tree.root, newNode);
     }
 
@@ -109,13 +137,15 @@ export default defineComponent({
 
     const onClosed = (val: string) => {
       if (val == 'OK') {
-        const conditionJson = tree.toJson();
         isSetted.value = true;
+        tree.setQuery(tree.buildConditionQueryString(tree.root));
+        const conditionJson = tree.toJson();
         emit('update:modelValue', conditionJson);
       }
     };
 
     watchEffect(() => {
+      tree.setQuery(tree.buildConditionQueryString(tree.root));
       const conditionJson = tree.toJson();
       emit('update:modelValue', conditionJson);
     });
@@ -127,7 +157,8 @@ export default defineComponent({
       showDg,
       onClosed,
       tree,
-      conditionString
+      conditionString,
+      btnDisable
     };
   }
 });

frontend/src/components/right/DataMapping.vue

@@ -0,0 +1,202 @@
+<template>
+    <div>
+        <q-field :label="displayName" labelColor="primary" stack-label>
+            <template v-slot:control>
+                <q-card flat class="full-width">
+                    <q-card-actions vertical>
+                        <q-btn color="grey-3" text-color="black" :disable="btnDisable"
+                            @click="() => { dgIsShow = true }">クリックで設定</q-btn>
+                    </q-card-actions>
+                    <q-card-section class="text-caption">
+                        <div v-if="mappingObjectsInputDisplay && mappingObjectsInputDisplay.length > 0">
+                            <div v-for="(item) in mappingObjectsInputDisplay" :key="item">{{ item }}</div>
+                        </div>
+                        <div v-else>{{ placeholder }}</div>
+                    </q-card-section>
+                </q-card>
+            </template>
+        </q-field>
+        <show-dialog v-model:visible="dgIsShow" name="データマッピング" @close="closeDg" min-width="50vw" min-height="60vh">
+
+            <div class="q-mx-md">
+                <div class="row q-col-gutter-x-xs flex-center">
+                    <div class="col-5">
+                        <div class="q-mx-xs">From</div>
+                    </div>
+                    <div class="col-1">
+                    </div>
+                    <div class="col-5">
+                        <div class="q-mx-xs">To</div>
+                    </div>
+                    <div class="col-1"><q-btn flat round dense icon="add" size="sm" @click="addMappingObject" />
+                    </div>
+                </div>
+                <div class="q-my-sm" v-for="(item, index) in mappingProps" :key="item.id">
+                    <div class="row q-col-gutter-x-xs flex-center">
+                        <div class="col-5">
+                            <ConditionObject v-model="item.from" />
+                        </div>
+                        <div class="col-1">
+                        </div>
+                        <div class="col-5">
+                            <q-field v-model="item.vName" type="text" outlined dense>
+                                <template v-slot:append>
+                                    <q-icon name="search" class="cursor-pointer"
+                                        @click="() => { mappingProps[index].to.isDialogVisible = true }" />
+                                </template>
+                                <template v-slot:control>
+                                    <div class="self-center full-width no-outline" tabindex="0"
+                                        v-if="item.to.app?.name && item.to.fields?.length > 0 && item.to.fields[0].label">
+                                        {{ `${item.to.app?.name} : ${item.to.fields[0].label}` }}
+                                    </div>
+                                </template>
+                            </q-field>
+                        </div>
+                        <div class="col-1">
+                            <q-btn flat round dense icon="delete" size="sm" @click="() => deleteMappingObject(index)" />
+                        </div>
+                    </div>
+
+                    <show-dialog v-model:visible="mappingProps[index].to.isDialogVisible" name="フィールド一覧"
+                        @close="closeToDg" ref="fieldDlg">
+                        <FieldSelect v-if="onlySourceSelect" ref="fieldDlg" name="フィールド" :appId="sourceAppId" not_page
+                            :selectedFields="mappingProps[index].to.fields"
+                            :updateSelects="(fields) => { mappingProps[index].to.fields = fields; mappingProps[index].to.app = sourceApp }">
+                        </FieldSelect>
+                        <AppFieldSelectBox v-else v-model:selectedField="mappingProps[index].to" />
+                    </show-dialog>
+                </div>
+            </div>
+        </show-dialog>
+    </div>
+</template>
+
+<script lang="ts">
+import { v4 as uuidv4 } from 'uuid';
+import { computed, defineComponent, reactive, ref, watchEffect } from 'vue';
+import ConditionObject from '../ConditionEditor/ConditionObject.vue';
+import ShowDialog from '../ShowDialog.vue';
+import AppFieldSelectBox from '../AppFieldSelectBox.vue';
+import FieldSelect from '../FieldSelect.vue';
+import IAppFields from './AppFieldSelect.vue';
+
+type Props = {
+    props?: {
+        name: string;
+        modelValue?: {
+            app: {
+                id: string;
+                name: string;
+            }
+        }
+    }
+};
+type ValueType = {
+    id: string;
+    from: object;
+    to: typeof IAppFields & {
+        isDialogVisible: boolean;
+    };
+}
+
+const defaultMappingProp = () => ({ id: uuidv4(), to: { app: {}, fields: [], isDialogVisible: false } });
+
+export default defineComponent({
+    name: 'DataMapping',
+    inheritAttrs: false,
+    components: {
+        ShowDialog,
+        ConditionObject,
+        AppFieldSelectBox,
+        FieldSelect
+    },
+    props: {
+        context: {
+            type: Array<Props>,
+            default: '',
+        },
+        displayName: {
+            type: String,
+            default: '',
+        },
+        name: {
+            type: String,
+            default: '',
+        },
+        modelValue: {
+            type: Object as () => ValueType[],
+        },
+        placeholder: {
+            type: String,
+            default: '',
+        },
+        onlySourceSelect: {
+            type: Boolean,
+            default: false
+        }
+    },
+
+    setup(props, { emit }) {
+        const closeDg = () => {
+            emit('update:modelValue', mappingProps
+            );
+        }
+
+        const closeToDg = () => {
+            emit('update:modelValue', mappingProps
+            );
+        }
+
+        const mappingProps: ValueType[] = props.modelValue
+            ? props.modelValue
+            : reactive([defaultMappingProp()]);
+
+
+        const deleteMappingObject = (index: number) => mappingProps.length === 1
+            ? mappingProps.splice(0, mappingProps.length, defaultMappingProp())
+            : mappingProps.splice(index, 1);
+
+        const mappingObjectsInputDisplay = computed(() =>
+            mappingProps ?
+                mappingProps
+                    .filter(item => item.from?.name && item.to.fields?.length > 0)
+                    .map(item => {
+                        const name = typeof item.from?.name === 'string'
+                            ? item.from.name
+                            : item.from?.name.name;
+                        return `[${name}] - (${item.to.app?.name} : ${item.to.fields[0].label})`;
+                    })
+                : []
+        );
+
+        const source = props.context.find(element => element?.props?.name === 'sources')
+
+        const sourceApp = computed(() => source?.props?.modelValue?.app);
+
+        const sourceAppId = computed(() => sourceApp.value?.id);
+
+        const btnDisable = computed(() => props.onlySourceSelect ? !(source?.props?.modelValue?.app?.id) : false);
+
+        //集計処理方法
+
+        watchEffect(() => {
+            emit('update:modelValue', mappingProps);
+        });
+        return {
+            uuidv4,
+            dgIsShow: ref(false),
+            closeDg,
+            toDgIsShow: ref(false),
+            closeToDg,
+            mappingProps,
+            addMappingObject: () => mappingProps.push(defaultMappingProp()),
+            deleteMappingObject,
+            mappingObjectsInputDisplay,
+            sourceApp,
+            sourceAppId,
+            btnDisable
+        };
+    },
+});
+</script>
+<style lang="scss"></style>

frontend/src/components/right/EventSetter.vue

@@ -61,12 +61,12 @@ export default defineComponent({
         if(store.eventTree.findEventById(addEventId)){
           return;
         }
-        customEvents.events.push({
+        customEvents.events.push(
-          eventId: addEventId,
+          new kintoneEvent(
-          label: displayName,
+            displayName,
-          parentId: customButtonId,
+            addEventId,
-          header: 'DELETABLE'
+            customButtonId)
-        });
+        );
       }
     }
 

frontend/src/components/right/FieldInput.vue

@@ -7,6 +7,9 @@
           {{ selectedField.name }}
         </q-chip>
       </template>
+      <!-- <template v-slot:hint v-if="isSelected">
+        <div> 項目コード：<q-chip  size="sm" outline color="secondary" text-color="white">{{selectedField.code}}</q-chip></div>
+      </template> -->
       <template v-slot:hint v-if="!isSelected">
         {{ placeholder }}
       </template>
@@ -16,7 +19,7 @@
       </template>
     </q-field>
     <show-dialog v-model:visible="show" name="フィールド一覧" @close="closeDg" widht="400px">
-      <field-select ref="appDg" name="フィールド" :type="selectType" :appId="store.appInfo?.appId" :fieldTypes="fieldTypes"></field-select>
+      <field-select ref="appDg" name="フィールド" type="single" :appId="store.appInfo?.appId"></field-select>
     </show-dialog>
   </div>
 </template>
@@ -51,14 +54,6 @@ export default defineComponent({
       type: String,
       default: '',
     },
-    selectType:{
-        type:String,
-        default:'single'
-    },
-    fieldTypes:{
-      type:Array,
-      default:()=>[]
-    },
     hint: {
       type: String,
       default: '',

frontend/src/components/right/InputText.vue

@@ -33,10 +33,6 @@ export default defineComponent({
       type: String,
       default: '',
     },
-    fieldTypes:{
-      type:Array,
-      default:()=>[]
-    },
     hint: {
       type: String,
       default: '',

frontend/src/components/right/PropertyList.vue

@@ -22,6 +22,8 @@ import EventSetter from '../right/EventSetter.vue';
 import ColorPicker from './ColorPicker.vue';
 import NumInput from './NumInput.vue';
 import DataProcessing from './DataProcessing.vue';
+import DataMapping from './DataMapping.vue';
+import AppSelect from './AppSelect.vue';
 import { IActionNode,IActionProperty,IProp } from 'src/types/ActionTypes';
 
 export default defineComponent({
@@ -37,7 +39,9 @@ export default defineComponent({
     EventSetter,
     ColorPicker,
     NumInput,
-    DataProcessing
+    DataProcessing,
+    DataMapping,
+    AppSelect
   },
   props: {
     nodeProps: {

frontend/src/components/right/SelectBox.vue

@@ -29,7 +29,7 @@ export default defineComponent({
       default:'',
     },
     modelValue: {
-      type: [Array,String],
+      type: Object,
       default: null,
     },
   },

frontend/src/pages/RuleEditor.vue

@@ -24,7 +24,7 @@
           <q-btn :label="model+'選択'" color="primary" @click="showDg()" />
           <show-dialog v-model:visible="show" :name="model" @close="closeDg" width="400px">
             <template v-if="model=='アプリ'">
-              <app-select ref="appDg" :name="model" type="single"></app-select>
+              <app-select-box ref="appDg" :name="model" type="single"></app-select-box>
             </template>
             <template v-if="model=='フィールド'">
               <field-select ref="appDg" :name="model" type="multiple" :appId="1"></field-select>
@@ -42,7 +42,7 @@
 
 <script setup lang="ts">
 import ShowDialog from 'components/ShowDialog.vue';
-import AppSelect from 'components/AppSelect.vue';
+import AppSelectBox from 'components/AppSelectBox.vue';
 import FieldSelect from 'components/FieldSelect.vue';
 import ActionSelect from 'components/ActionSelect.vue';
 import { ref } from 'vue'

frontend/src/stores/flowEditor.ts

@@ -113,19 +113,19 @@ export const useFlowEditorStore = defineStore('flowEditor', {
     },
 
 
-    async deleteEvent(event: IKintoneEvent) {
+    deleteEvent(event: IKintoneEvent) {
       const store = useFlowEditorStore();
       if (event.flowData) {
         const flow = event.flowData;
-        if (flow.id !== '') {
+        if (flow.id === '') {
-          await flowCtrl.DeleteFlow(flow.id)
+          return;
-          if (this.flows) {
+        }
+        flowCtrl.DeleteFlow(flow.id)
+        eventTree.deleteEvent(event, store);
+        if(this.flows){
           this.flows = this.flows.filter((f) => f.id !== flow.id);
         }
-        }
+      } else {
-        eventTree.deleteEvent(event, store);
-      }
-      else {
         eventTree.deleteEvent(event, store);
       }
     },

frontend/src/types/Conditions.ts

@@ -74,6 +74,11 @@ export class GroupNode implements INode {
 
 }
 
+export type OperatorListItem = {
+  label: string;
+  value: string;
+}
+
 // 条件式ノード
 export class ConditionNode implements INode {
   index: number;
@@ -83,13 +88,13 @@ export class ConditionNode implements INode {
     return this.parent.logicalOperator;
   };
   object: any; // 比較元
-  operator: Operator; // 比較子
+  operator: Operator | OperatorListItem; // 比較子
   value: any;
   get header():string{
     return 'generic';
   }
 
-  constructor(object: any, operator: Operator, value: any, parent: GroupNode) {
+  constructor(object: any, operator: Operator | OperatorListItem, value: any, parent: GroupNode) {
     this.index=0;
     this.type = NodeType.Condition;
     this.object = object;
@@ -113,10 +118,12 @@ export class ConditionNode implements INode {
 export class ConditionTree {
   root: GroupNode;
   maxIndex:number;
+  queryString:string;
 
   constructor() {
     this.maxIndex=0;
     this.root = new GroupNode(LogicalOperator.AND, null);
+    this.queryString='';
   }
 
   // ノード追加
@@ -198,12 +205,49 @@ export class ConditionTree {
         if(value && typeof value ==='object' && ('label' in value)){
             value =condNode.value.label;
         }
-        return `${typeof condNode.object.name === 'object' ? condNode.object.name.name : condNode.object.name} ${condNode.operator} '${value}'`;
+        return `${typeof condNode.object.name === 'object' ? condNode.object.name.name : condNode.object.name} ${typeof condNode.operator === 'object' ? condNode.operator.label : condNode.operator} '${value}'`;
       } else {
         return '';
       }
     }
   }
+
+  buildConditionQueryString(node:INode){
+    if (node.type !== NodeType.Condition) {
+      let conditionString = '';
+      if(node.type !== NodeType.Root){
+        conditionString = '(';
+      }
+      
+      const groupNode = node as GroupNode;
+      for (let i = 0; i < groupNode.children.length; i++) {
+        const childConditionString = this.buildConditionQueryString(groupNode.children[i]);
+        if (childConditionString !== '') {
+          conditionString += childConditionString;
+          if (i < groupNode.children.length - 1) {
+            conditionString += ` ${groupNode.logicalOperator.toLowerCase()} `;
+          }
+        }
+      }
+
+      if(node.type !== NodeType.Root){
+        conditionString += ')';
+      }
+      return conditionString;
+    } else {
+      const condNode=node as ConditionNode;
+      if (condNode.object && condNode.operator ) {
+        let value=condNode.value;
+        if(value && typeof value ==='object' && ('label' in value)){
+            value =condNode.value.label;
+        }      
+        return `${condNode.object.code} ${typeof condNode.operator === 'object' ? condNode.operator.value : condNode.operator} "${value}"`;
+      } else {
+        return '';
+      }
+    }
+  }
+
   /**
    *
    * @param node ノード移動
@@ -325,7 +369,7 @@ export class ConditionTree {
   }
 
   toJson():string{
-    return JSON.stringify(this.root, (key, value) => {
+    return JSON.stringify({queryString :this.queryString, ...this.root}, (key, value) => {
       if (key === 'parent') {
         return value ? value.type : null;
       }
@@ -333,4 +377,7 @@ export class ConditionTree {
     });
   }
 
+  setQuery(queryString:string){
+    this.queryString=queryString;
+  }
 }

frontend/src/types/KintoneEvents.ts

@@ -95,7 +95,10 @@ export class KintoneEventManager {
           const lastIndex = eventId.lastIndexOf('.');
           const groupId = eventId.substring(0, lastIndex);
           const eventNode = this.findEventById(groupId);
-          if (eventNode && (eventNode.header === 'EVENTGROUP' || eventNode.header === 'CHANGE')) {
+          if (
+            eventNode &&
+            (eventNode.header === 'EVENTGROUP' || eventNode.header === 'CHANGE')
+          ) {
             const groupEvent = eventNode as kintoneEventGroup;
 
             const newEvent = {

node_modules/.package-lock.json

@@ -1,6 +0,0 @@
-{
-  "name": "App Builder for kintone",
-  "lockfileVersion": 3,
-  "requires": true,
-  "packages": {}
-}

node_modules/.yarn-integrity

@@ -1,10 +0,0 @@
-{
-  "systemParams": "win32-x64-115",
-  "modulesFolders": [],
-  "flags": [],
-  "linkedModules": [],
-  "topLevelPatterns": [],
-  "lockfileEntries": {},
-  "files": [],
-  "artifacts": {}
-}

plugin/kintone-addins/.env.dev

@@ -0,0 +1,2 @@
+VITE_SOURCE_MAP = inline
+VITE_PORT = 4173

plugin/kintone-addins/.env.production

@@ -0,0 +1,2 @@
+VITE_SOURCE_MAP = false
+VITE_PORT = 4173

plugin/kintone-addins/package-lock.json

@@ -8,8 +8,7 @@
       "name": "kintone-addins",
       "version": "0.0.0",
       "dependencies": {
-        "jquery": "^3.7.1",
+        "jquery": "^3.7.1"
-        "yarn": "^1.22.22"
       },
       "devDependencies": {
         "@types/jquery": "^3.5.24",
@@ -796,19 +795,6 @@
           "optional": true
         }
       }
-    },
-    "node_modules/yarn": {
-      "version": "1.22.22",
-      "resolved": "https://registry.npmjs.org/yarn/-/yarn-1.22.22.tgz",
-      "integrity": "sha512-prL3kGtyG7o9Z9Sv8IPfBNrWTDmXB4Qbes8A9rEzt6wkJV8mUvoirjU0Mp3GGAU06Y0XQyA3/2/RQFVuK7MTfg==",
-      "hasInstallScript": true,
-      "bin": {
-        "yarn": "bin/yarn.js",
-        "yarnpkg": "bin/yarn.js"
-      },
-      "engines": {
-        "node": ">=4.0.0"
-      }
     }
   }
 }

plugin/kintone-addins/package.json

@@ -4,25 +4,30 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "tsc && set \"SOURCE_MAP=true\" && vite build && vite preview",
+    "dev": "run-p watch server ngrok",
-    "build": "tsc && vite build && xcopy dist\\*.js ..\\..\\backend\\Temp\\ /E /I /Y",
+    "watch": "vite build --watch --mode dev",
-    "build:linux": "tsc && vite build && cp -ur dist/*.js ../../backend/Temp",
+    "server": "vite dev --mode dev",
-    "build:dev": "tsc && set \"SOURCE_MAP=true\" && vite build && xcopy dist\\*.js ..\\..\\backend\\Temp\\ /E /I /Y",
+    "ngrok": "ngrok http 4173",
-    "preview": "vite preview",
+    "build": "run-s b:production copy:windows",
-    "ngrok": "ngrok http http://localhost:4173/",
+    "build:dev": "run-s b:dev copy:windows",
-    "vite": "vite dev"
+    "build:linux": "run-s b:production copy:linux",
+    "build:linux-dev": "run-s b:dev copy:linux",
+    "b:production": "vite build --mode production",
+    "b:dev": "vite build --mode dev",
+    "copy:windows": "xcopy dist\\*.js ..\\..\\backend\\Temp\\ /E /I /Y",
+    "copy:linux": "cp -ur dist/*.js ../../backend/Temp"
   },
   "devDependencies": {
     "@types/jquery": "^3.5.24",
     "@types/node": "^20.8.9",
+    "npm-run-all2": "^6.2.0",
     "sass": "^1.69.5",
     "typescript": "^5.0.2",
     "vite": "^4.4.5",
-    "vite-plugin-checker": "^0.6.4"
+    "vite-plugin-checker": "^0.6.4",
+    "vite-plugin-lib-inject-css": "^2.1.1"
   },
   "dependencies": {
-    "jquery": "^3.7.1",
+    "jquery": "^3.7.1"
-    "vite-plugin-css-injected-by-js": "^3.5.1",
-    "yarn": "^1.22.22"
   }
 }

plugin/kintone-addins/src/actions/auto-numbering.css

@@ -0,0 +1,24 @@
+.alc-button-normal {
+    display: inline-block;
+    box-sizing: border-box;
+    padding: 0 16px;
+    margin-left: 16px;
+    margin-top: 8px;
+    min-width: 100px;
+    outline: none;
+    border: 1px solid #e3e7e8;
+    background-color: #f7f9fa;
+    box-shadow: 1px 1px 1px #fff inset;
+    color: #3498db;
+    text-align: center;
+    line-height: 32px;
+}
+.alc-button-normal:hover {
+    background-color: #c8d6dd;
+    box-shadow: none;
+    cursor: pointer;
+  }
+.alc-button-normal:active {
+    color: #f7f9fa;
+    background-color: #54b8eb;
+}

plugin/kintone-addins/src/actions/auto-numbering.ts

@@ -2,6 +2,7 @@
 import { actionAddins } from ".";
 import { IField, IAction,IActionResult, IActionNode, IActionProperty, IContext } from "../types/ActionTypes";
 import { Formatter } from "../util/format";
+import "./auto-numbering.css";
 
 declare global {
     interface Window { $format: any; }  

plugin/kintone-addins/src/actions/button-add.css

@@ -1,24 +0,0 @@
-.alc-button-normal {
-    display: inline-block;
-    box-sizing: border-box;
-    padding: 0 16px;
-    margin-left: 16px;
-    margin-top: 8px;
-    min-width: 100px;
-    outline: none;
-    border: 1px solid #e3e7e8;
-    background-color: #f7f9fa;
-    box-shadow: 1px 1px 1px #fff inset;
-    color: #3498db;
-    text-align: center;
-    line-height: 32px;
-}
-.alc-button-normal:hover {
-    background-color: #c8d6dd;
-    box-shadow: none;
-    cursor: pointer;
-  }
-.alc-button-normal:active {
-    color: #f7f9fa;
-    background-color: #54b8eb;
-}

plugin/kintone-addins/src/actions/button-add.ts

@@ -10,18 +10,12 @@ import "./button-add.css";
 interface IButtonAddProps {
     //ボタン表示名
     buttonName: string;
-    space?:ISpace;
     //配置位置
     position: string;
     //イベント名
     eventName:string
 }   
 
-interface ISpace{
-    type:string,
-    elementId:string
-}
-
 export class ButtonAddAction implements IAction {
     name: string; 
     actionProps: IActionProperty[]; 
@@ -55,19 +49,20 @@ export class ButtonAddAction implements IAction {
             }
             this.props = actionNode.ActionValue as IButtonAddProps; 
             //ボタンを配置する
-            let buttonSpace;
+            const menuSpace = kintone.app.record.getHeaderMenuSpaceElement();
-            if(this.props.space && this.props.space.elementId){
+            if(!menuSpace) return result;
-                buttonSpace = kintone.app.record.getSpaceElement(this.props.space.elementId);
+            if($("style#alc-button-add").length===0){
-            }else{
+                const css=`
-                buttonSpace = kintone.app.record.getHeaderMenuSpaceElement();
+                `;
+                const style = $("<style id='alc-button-add'>/<style>");
+                style.text(css);
+                $("head").append(style);
             }
-            if(!buttonSpace) return result;
-  
             const button =$(`<button id='${this.props.eventName}' class='alc-button-normal' >${this.props.buttonName}</button>`);
             if(this.props.position==="一番左に追加する"){
-                $(buttonSpace).prepend(button);
+                $(menuSpace).prepend(button);
             }else{
-                $(buttonSpace).append(button);
+                $(menuSpace).append(button);
             }
             const clickEventName = `${event.type}.customButtonClick.${this.props.eventName}`;
             button.on("click",()=>{

plugin/kintone-addins/src/actions/counter-check.ts

@@ -1,75 +0,0 @@
-import { actionAddins } from ".";
-import {  IAction,IActionResult, IActionNode, IActionProperty, IField} from "../types/ActionTypes";
-/**
- * アクションの属性定義
- */
-interface IStrCountCheckProps{
-    field:IField;//チェックするフィールドの対象
-    message:string;//エラーメッセージ
-    maxLength:number;//
-}
-/**
- * 正規表現チェックアクション
- */
-export class StrCountCheckAciton implements IAction{
-    name: string;
-    actionProps: IActionProperty[];
-    props:IStrCountCheckProps;
-    constructor(){
-        this.name="文字数チェック";
-        this.actionProps=[];
-        this.props={
-            field:{code:''},
-            message:'',
-            maxLength:0
-        }
-        //アクションを登録する
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode 
-     * @param event 
-     * @returns 
-     */
-    async process(actionNode:IActionNode,event:any):Promise<IActionResult> {
-        let result={
-            canNext:true,
-            result:false
-        };
-        try{
-            //属性設定を取得する
-            this.actionProps=actionNode.actionProps;
-            if (!('field' in actionNode.ActionValue) && !('message' in actionNode.ActionValue) && !('strExpression'in actionNode.ActionValue)) {
-                return result
-            }
-            
-            this.props = actionNode.ActionValue as IStrCountCheckProps;
-            //条件式の計算結果を取得
-            const record = event.record;
-            const value = record[this.props.field.code].value;
-            const maxLength = this.props.maxLength;
-            if(value === undefined || value === '' ){
-                return result;
-            }else if(maxLength < value.length){
-                record[this.props.field.code].error = this.props.message;
-            }else{
-                result= {
-                    canNext:true,
-                    result:true
-                  }
-            }
-            return result;
-        }catch(error){
-            event.error=error;
-            console.error(error);
-            result.canNext=false;
-            return result;
-        }
-    };
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-    
-}
-new StrCountCheckAciton();

plugin/kintone-addins/src/actions/data-mapping.ts

@@ -0,0 +1,182 @@
+import {
+  IAction,
+  IActionResult,
+  IActionNode,
+  IActionProperty,
+  IContext,
+} from "../types/ActionTypes";
+import { actionAddins } from ".";
+
+export type IApp = {
+  id: string;
+  name: string;
+};
+export type IField = {
+  name: string;
+  code: string;
+  type: string;
+};
+
+export type IAppFields = {
+  app?: IApp;
+  fields: IField[];
+};
+
+type ValueType = {
+  id: string;
+  from: {
+    objectType: "variable" | "field";
+    name: { name: string };
+    code: string;
+  };
+  to: IAppFields & {
+    isDialogVisible: boolean;
+  };
+};
+
+type Props = { app: IApp; field: ValueType[] };
+
+export class DataMappingAction implements IAction {
+  name: string;
+  actionProps: IActionProperty[];
+  dataMappingProps: Props;
+  constructor() {
+    this.name = "DataMapping";
+    this.actionProps = [];
+    this.dataMappingProps = {} as Props;
+    this.register();
+  }
+
+  async process(
+    prop: IActionNode,
+    event: any,
+    context: IContext
+  ): Promise<IActionResult> {
+    this.initActionProps(prop);
+    this.initTypedActionProps();
+    let result = {
+      canNext: true,
+      result: "",
+    } as IActionResult;
+    try {
+      for (const item of this.dataMappingProps.field) {
+        if (item.from.objectType === "variable") {
+          if (
+            item.from.name.name &&
+            item.to.app &&
+            item.to.fields &&
+            item.to.fields.length > 0
+          ) {
+            const value = getValueByPath(
+              context.variables,
+              item.from.name.name
+            );
+            if (value) {
+              await kintone.api(
+                kintone.api.url("/k/v1/record.json", true),
+                "POST",
+                {
+                  app: item.to.app.id,
+                  record: {
+                    [item.to.fields[0].code]: {
+                      value: value,
+                    },
+                  },
+                }
+              );
+            }
+          }
+        } else if (item.from.objectType === "field") {
+          if (
+            item.from.code &&
+            item.to.app &&
+            item.to.fields &&
+            item.to.fields.length > 0
+          ) {
+            const value = await selectData(
+              item.to.app.id,
+              item.to.fields[0].code
+            );
+            if (value && value.type === context.record[item.from.code].type) {
+              await kintone.api(
+                kintone.api.url("/k/v1/records.json", true),
+                "POST",
+                {
+                  app: item.to.app.id,
+                  records: value.value.map((v) => ({
+                    [item.to.fields[0].code]: {
+                      value: v,
+                    },
+                  })),
+                }
+              );
+            }
+          }
+        }
+      }
+    } catch (error) {
+      console.error("DataMappingAction error", error);
+      result.canNext = false;
+    }
+    console.log("dataMappingProps", this.dataMappingProps);
+
+    return result;
+  }
+
+  private initActionProps(nodes: IActionNode) {
+    this.actionProps = nodes.actionProps;
+  }
+  private initTypedActionProps() {
+    for (const action of this.actionProps) {
+      if (action.component === "DataMapping") {
+        this.dataMappingProps.field = action.props.modelValue as ValueType[];
+      } else if (action.component === "AppSelect") {
+        this.dataMappingProps.app = action.props.modelValue.app as IApp;
+      }
+    }
+  }
+
+  register(): void {
+    actionAddins[this.name] = this;
+  }
+}
+
+new DataMappingAction();
+
+const getValueByPath = (obj: any, path: string) => {
+  return path.split(".").reduce((o, k) => (o || {})[k], obj);
+};
+
+type Resp = { records: RespRecordType[] };
+
+type RespRecordType = {
+  [key: string]: {
+    type: string;
+    value: any;
+  };
+};
+
+type Result = {
+  type: string;
+  value: any[];
+};
+
+const selectData = async (appid: string, field: string): Promise<Result> => {
+  return kintone
+    .api(kintone.api.url("/k/v1/records", true), "GET", {
+      app: appid ?? kintone.app.getId(),
+      fields: [field],
+    })
+    .then((resp: Resp) => {
+      const result: Result = { type: "", value: [] };
+      resp.records.forEach((element) => {
+        for (const [key, value] of Object.entries(element)) {
+          if (result.type === "") {
+            result.type = value.type;
+          }
+          result.value.push(value.value);
+        }
+      });
+      return result;
+    });
+};

plugin/kintone-addins/src/actions/data-processing.ts

@@ -0,0 +1,280 @@
+import {
+  IAction,
+  IActionResult,
+  IActionNode,
+  IActionProperty,
+  IContext,
+} from "../types/ActionTypes";
+import { actionAddins } from ".";
+
+
+type DataProcessingProps = {
+  app: {
+    id: string;
+    name: string;
+  };
+  conditionsQuery: string;
+  propcessing: {
+    varRootName: string;
+    fields: Field[];
+  };
+};
+
+type Field = {
+  name: string;
+  code: string;
+  type: string;
+  varName: string;
+  operator: string;
+};
+
+export class DataProcessingAction implements IAction {
+  name: string;
+  actionProps: IActionProperty[];
+  dataProcessingProps: DataProcessingProps | null;
+  constructor() {
+    this.name = "データ処理";
+    this.actionProps = [];
+    this.dataProcessingProps = null;
+    this.register();
+  }
+
+  async process(
+    nodes: IActionNode,event: any,context: IContext
+  ): Promise<IActionResult> {
+    this.initActionProps(nodes);
+    this.initTypedActionProps();
+    let result = {
+      canNext: true,
+      result: "",
+    } as IActionResult;
+    try {
+      if (!this.dataProcessingProps) {
+        return result;
+      }
+    
+      const data = await selectData(this.dataProcessingProps.conditionsQuery);
+      console.log("data ", data);
+
+      context.variables[this.dataProcessingProps.propcessing.varRootName] =
+        this.dataProcessingProps.propcessing.fields.reduce((acc, f) => {
+          const v = calc(f, data);
+          if (v) {
+            acc[f.varName] = calc(f, data);
+          }
+          return acc;
+        }, {} as Var);
+
+      console.log("context ", context);
+      return result;
+    } catch (error) {
+      console.error(error);
+      event.error=error;
+      return result;
+    }
+  }
+
+  register(): void {
+    actionAddins[this.name] = this;
+  }
+
+  private initActionProps(nodes: IActionNode) {
+    this.actionProps = nodes.actionProps;
+  }
+
+  private initTypedActionProps() {
+    this.dataProcessingProps = {
+      app: {
+        id: "",
+        name: "",
+      },
+      conditionsQuery: "",
+      propcessing: {
+        varRootName: "",
+        fields: [],
+      },
+    };
+    for (const action of this.actionProps) {
+      if (action.component === "AppFieldSelect") {
+        this.dataProcessingProps.app.id = action.props.modelValue.app.id;
+        this.dataProcessingProps.app.name = action.props.modelValue.app.name;
+      } else if (action.component === "DataProcessing") {
+        this.dataProcessingProps.propcessing.varRootName =
+          action.props.modelValue.name;
+        for (const f of action.props.modelValue.vars) {
+          this.dataProcessingProps.propcessing.fields.push({
+            name: f.field.name,
+            code: f.field.code,
+            type: f.field.type,
+            varName: f.vName,
+            operator: f.logicalOperator.operator,
+          });
+        }
+      } else if (action.component === "ConditionInput") {
+        this.dataProcessingProps.conditionsQuery = JSON.parse(
+          action.props.modelValue
+        ).queryString;
+      }
+    }
+  }
+}
+
+new DataProcessingAction();
+
+const selectData = async (query?: string) => {
+  return kintone
+    .api(kintone.api.url("/k/v1/records", true), "GET", {
+      app: kintone.app.getId(),
+      query: query,
+    })
+    .then((resp: Resp) => {
+      const result: Result = {};
+      resp.records.forEach((element) => {
+        for (const [key, value] of Object.entries(element)) {
+          if (!result[key]) {
+            result[key] = { type: value.type, value: [] };
+          }
+          result[key].value.push(value.value);
+        }
+      });
+      return result;
+    });
+};
+
+type Resp = { records: RespRecordType[] };
+
+type RespRecordType = {
+  [key: string]: {
+    type: string;
+    value: any;
+  };
+};
+
+type Result = {
+  [key: string]: {
+    type: string;
+    value: any[];
+  };
+};
+
+type Var = {
+  [key: string]: any;
+};
+
+const ERROR_TYPE = "ERROR_TYPE";
+
+const calc = (field: Field, result: Result) => {
+  const type = typeCheck(field.type);
+  if (!type) {
+    return ERROR_TYPE;
+  }
+
+  const fun =
+    calcFunc[`${type}_${Operator[field.operator as keyof typeof Operator]}`];
+  if (!fun) {
+    return ERROR_TYPE;
+  }
+  const values = result[field.code].value;
+  if (!values) {
+    return null;
+  }
+  return fun(values);
+};
+
+const typeCheck = (type: string) => {
+  switch (type) {
+    case "RECORD_NUMBER":
+    case "NUMBER":
+      return CalcType.NUMBER;
+    case "SINGLE_LINE_TEXT":
+    case "MULTI_LINE_TEXT":
+    case "RICH_TEXT":
+      return CalcType.STRING;
+    case "DATE":
+      return CalcType.DATE;
+    case "TIME":
+      return CalcType.TIME;
+    case "DATETIME":
+    case "UPDATED_TIME":
+      return CalcType.DATETIME;
+    default:
+      return null;
+  }
+};
+
+enum Operator {
+  SUM = "SUM",
+  AVG = "AVG",
+  MAX = "MAX",
+  MIN = "MIN",
+  COUNT = "COUNT",
+  FIRST = "FIRST"
+}
+
+enum CalcType {
+  NUMBER = "number",
+  STRING = "string",
+  DATE = "date",
+  TIME = "time",
+  DATETIME = "datetime",
+}
+
+const calcFunc: Record<string, (value: string[]) => string | null> = {
+  [`${CalcType.NUMBER}_${Operator.COUNT}`]: (value: string[]) =>
+    value.length.toString(),
+  [`${CalcType.STRING}_${Operator.COUNT}`]: (value: string[]) =>
+    value.length.toString(),
+  [`${CalcType.DATE}_${Operator.COUNT}`]: (value: string[]) =>
+    value.length.toString(),
+  [`${CalcType.TIME}_${Operator.COUNT}`]: (value: string[]) =>
+    value.length.toString(),
+  [`${CalcType.DATETIME}_${Operator.COUNT}`]: (value: string[]) =>
+    value.length.toString(),
+
+  [`${CalcType.NUMBER}_${Operator.SUM}`]: (value: string[]) =>
+    value.reduce((acc, v) => acc + Number(v), 0).toString(),
+  [`${CalcType.NUMBER}_${Operator.AVG}`]: (value: string[]) =>
+    (value.reduce((acc, v) => acc + Number(v), 0) / value.length).toString(),
+  [`${CalcType.NUMBER}_${Operator.MAX}`]: (value: string[]) =>
+    Math.max(...value.map(Number)).toString(),
+  [`${CalcType.NUMBER}_${Operator.MIN}`]: (value: string[]) =>
+    Math.min(...value.map(Number)).toString(),
+
+  [`${CalcType.STRING}_${Operator.SUM}`]: (value: string[]) => value.join(" "),
+
+  [`${CalcType.DATE}_${Operator.MAX}`]: (value: string[]) =>
+    value.reduce((maxDate, currentDate) =>
+      maxDate > currentDate ? maxDate : currentDate
+    ),
+
+  [`${CalcType.DATE}_${Operator.MIN}`]: (value: string[]) =>
+    value.reduce((minDate, currentDate) =>
+      minDate < currentDate ? minDate : currentDate
+    ),
+
+  [`${CalcType.TIME}_${Operator.MAX}`]: (value: string[]) =>
+    value.reduce((maxTime, currentTime) =>
+      maxTime > currentTime ? maxTime : currentTime
+    ),
+  [`${CalcType.TIME}_${Operator.MIN}`]: (value: string[]) =>
+    value.reduce((minTime, currentTime) =>
+      minTime < currentTime ? minTime : currentTime
+    ),
+
+  [`${CalcType.DATETIME}_${Operator.MAX}`]: (value: string[]) =>
+    value.reduce((maxDateTime, currentDateTime) =>
+      new Date(maxDateTime) > new Date(currentDateTime)
+        ? maxDateTime
+        : currentDateTime
+    ),
+
+  [`${CalcType.DATETIME}_${Operator.MIN}`]: (value: string[]) =>
+    value.reduce((minDateTime, currentDateTime) =>
+      new Date(minDateTime) < new Date(currentDateTime)
+        ? minDateTime
+        : currentDateTime
+    ),
+  [`${CalcType.STRING}_${Operator.FIRST}`]:(value: string[])=>{
+    return value[0];
+  }
+};

plugin/kintone-addins/src/actions/datetime-getter.ts

@@ -1,66 +0,0 @@
-import { actionAddins } from ".";
-import { IAction, IActionResult, IActionNode, IActionProperty, IField ,IContext} from "../types/ActionTypes";
-/**
- * アクションの属性定義
- */
-interface IDatetimeGetterProps {
-    /**変数の名前 */
-    verName:string;
-}
-/**
- * 現在日時を取得するアクション
- */
-export class DatetimeGetterAction implements IAction {
-    name: string;
-    actionProps: IActionProperty[];
-    props: IDatetimeGetterProps;
-    constructor() {
-        this.name = "現在日時";
-        this.actionProps = [];
-        this.props = {
-            verName:''
-        }
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode 
-     * @param event 
-     * @returns 
-     */
-    async process(actionNode: IActionNode, event: any,context:IContext): Promise<IActionResult> {
-        let result = {
-            canNext: true,
-            result: false
-        };
-
-        try {
-            //属性設定を取得する
-            this.actionProps = actionNode.actionProps;
-
-            if (!('verName' in actionNode.ActionValue) ) {
-                return result
-            }
-            this.props = actionNode.ActionValue as IDatetimeGetterProps;
-            
-            let today = new Date();
-          
-            if(this.props.verName){
-                context.variables[this.props.verName]=today.toISOString();
-            }
-
-            return result;
-
-        } catch (error) {
-            event.error = error;
-            console.error(error);
-            result.canNext = false;
-            return result;
-        }
-    };
-    register(): void {
-        actionAddins[this.name] = this;
-    }
-
-}
-new DatetimeGetterAction();

plugin/kintone-addins/src/actions/field-shown.ts

@@ -103,5 +103,6 @@ export class FieldShownAction implements IAction{
     register(): void {
         actionAddins[this.name]=this;
     }
+    
 }
 new FieldShownAction();

plugin/kintone-addins/src/actions/insert-value.ts

@@ -1,507 +0,0 @@
-
-
-import { actionAddins } from ".";
-import {  IAction,IActionResult, IActionNode, IActionProperty, IField, IContext } from "../types/ActionTypes";
-import { ConditionTree } from '../types/Conditions';
-
-
-
-/**
- * アクションの属性定義
- */
-interface IInsertValueProps{
-    field:IField;
-    condition:string;
-    value:string;
-    show:string;
-}
-/**
- *
- */
-export class InsertValueAction implements IAction{
-    name: string;
-    actionProps: IActionProperty[];
-    props:IInsertValueProps;
-    constructor(){
-        this.name="値を挿入する";// DBに登録したアクション名
-        this.actionProps=[];
-        //プロパティ属性の初期化
-        this.props={
-            field:{code:''},
-            condition:'',
-            value:'',
-            show:''
-        }
-        //アクションを登録する
-        this.register();
-    }
-
-    /**
-     * 空白文字を空白文字が非対応のフィールドに挿入しようとしていないか、必須項目フィールドに挿入しようとしていないかチェックする
-     * @param {string} inputValue - 挿入する値
-     * @return {boolean} -入力値が有効な日付形式の場合はtrueを返し、そうでない場合は例外を発生させる
-     */
-    checkInputBlank(fieldType :string | undefined,inputValue :string,fieldCode :string,fieldRequired :boolean | undefined,event :any): boolean{
-        //正規表現チェック
-        let blankCheck= inputValue.match(/^(\s|　)+?$/);//半角スペース・タブ文字・改行・改ページ・全角スペース
-
-        if(blankCheck !== null){
-            //空白文字を空白文字が非対応のフィールドに挿入しようとしている場合、例外を発生させる
-            if(fieldType === "NUMBER" || fieldType === "DATE" || fieldType === "DATETIME" || fieldType === "TIME" || fieldType === "USER_SELECT"
-                        || fieldType === "ORGANIZATION_SELECT" || fieldType === "GROUP_SELECT" || fieldType === "RADIO_BUTTON" || fieldType === "DROP_DOWN" || fieldType === "CHECK_BOX" || fieldType === "MULTI_SELECT"){
-                event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドには、空白文字は挿入できません。"; //レコードにエラーを表示
-                throw new Error("「"+fieldCode+"」"+"フィールドには、空白文字は挿入できません。「値を挿入する」コンポーネントの処理を中断しました。");
-
-            //空白文字を必須項目フィールドに挿入しようとしている場合、例外を発生させる
-            }else if(fieldRequired){
-                event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドは必須項目のため、空白文字は挿入できません。"; //レコードにエラーを表示
-                throw new Error("「"+fieldCode+"」"+"フィールドは必須項目のため、空白文字は挿入できません。「値を挿入する」コンポーネントの処理を中断しました。");
-            }
-        }
-
-        return true;
-    }
-
-    /**
-     * 入力値が半角数字かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {boolean} -入力値が有効な数値の場合はtrueを返し、そうでない場合は例外を発生させる
-     */
-    checkInputNumber(inputValue :string,fieldCode :string,event :any): boolean{
-        let inputNumberValue = Number(inputValue);//数値型に変換
-
-        //有限数かどうか判定s
-        if(!isFinite(inputNumberValue)){
-            event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な日付形式です。"; //レコードにエラーを表示
-            throw new Error("「"+fieldCode+"」"+"フィールドに入れようとした値は、有効な数値ではありません。「値を挿入する」コンポーネントの処理を中断しました。");
-        }
-        return true;
-    }
-
-    /** 入力値が有効な日付形式かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {boolean} -入力値が有効な日付形式の場合はtrueを返し、そうでない場合は例外を発生させる
-     */
-    checkInputDate(inputValue :string,fieldCode :string,event :any): boolean{
-        //正規表現チェック
-        let twoDigitMonthDay = inputValue.match(/(\d{4})-(\d{2})-(\d{2})$/);//4桁の数字-2桁の数字-2桁の数字
-        let singleDigitMonthDay = inputValue.match(/(\d{4})-(\d{1})-(\d{1})$/);//4桁の数字-1桁の数字-2桁の数字
-        let singleDigitMonth = inputValue.match(/(\d{4})-(\d{1})-(\d{2})$/);//4桁の数字-1桁の数字-2桁の数字
-        let singleDigitDay = inputValue.match(/(\d{4})-(\d{2})-(\d{1})$/);//4桁の数字-2桁の数字-1桁の数字
-        let dateTime = inputValue.match(/(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}).000Z/);//時刻入りのUTCの日付形式
-        let date;
-        //date型に変換
-        date = new Date(inputValue);
-
-        //date型変換できたか確認
-        if(date !== undefined && !isNaN(date.getDate())){
-            //正規表現チェック確認
-            if(twoDigitMonthDay === null && singleDigitMonth === null && singleDigitDay === null && singleDigitMonthDay === null && dateTime === null){
-                    event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な日付形式です。"; //レコードにエラーを表示
-                    throw new Error("「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な日付形式です。「値を挿入する」コンポーネントの処理を中断しました。");
-            }
-        }
-        return true;
-    }
-
-    /** 入力値が有効な時刻形式かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {boolean} -入力値が有効な日付形式の場合はtrueを返し、そうでない場合は例外を発生させる
-     */
-    checkInputTime(inputValue :string,fieldCode :string,event :any): boolean{
-        //正規表現チェック
-        let timeFormat =inputValue.match(/^([0-9]|1[0-9]|2[0-3]):[0-5][0-9]$/);
-
-            //正規表現チェック確認
-            if(timeFormat === null){
-                    event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な時刻形式です。"; //レコードにエラーを表示
-                    throw new Error("「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な時刻形式です。「値を挿入する」コンポーネントの処理を中断しました。");
-            }
-        return true;
-    }
-
-    /**
-     * 入力値のフィールドタイプがDATETIMEであれば、時刻ありの日付形式変換し、DATEであれば時刻なしの日付形式変換する関数
-     * @param {string} inputValue -挿入する値
-     * @param {string} fieldType  -フィールドタイプ
-     * @return {string} -入力値が日付形式に変換できた場合は文字列を返し、そうでない場合は例外を発生させる
-     */
-    changeDateFormat(inputValue :string, fieldType :string,fieldCode :string,event :any): string{
-        let dateTime;
-        let date;
-
-        //挿入する値をdate型に変換
-        date = new Date(inputValue);
-        //date型変換できたか確認
-        if(date !== undefined && !isNaN(date.getDate())){
-
-            //日時フィールドの場合、時刻ありの日付形式変換
-            if(fieldType === "DATETIME"){
-                dateTime =date.toISOString();
-                return dateTime;
-            }
-
-            //日付フィールドの場合、時刻なしの日付形式変換
-            let dateArray=inputValue.match(/(\d{4})-(\d{1,2})-(\d{1,2})$/);//4桁の数字-1～2桁の数字-1～2桁の数字
-            if(dateArray !== null){
-                let yearIndex = 1;
-                let monthIndex = 2;
-                let dayIndex = 3;
-                let dateFormatted=`${dateArray[yearIndex]}-${dateArray[monthIndex]}-${dateArray[dayIndex]}`
-                return dateFormatted;
-            }
-
-        }
-
-        event.record[fieldCode]['error'] = "「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な日付形式です。"; //レコードにエラーを表示
-        throw new Error("「"+fieldCode+"」"+"フィールドに入れようとした値は、無効な日付形式です。「値を挿入する」コンポーネントの処理を中断しました。");
-    }
-
-    /**
-     * 入力値がフィールドタイプ(ラジオボタン・ドロップダウン・複数選択・ドロップダウン)の選択肢に存在する値かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {boolean} -入力値が有効な値の場合はtrueを返し、そうでない場合は例外を発生させる
-     */
-    checkInputOption(inputValue :string,fieldOptions :string | undefined,fieldCode :string,event :any): boolean {
-
-        //入力値が選択肢に存在する値かチェックし、存在したらtrueを返す
-        if(fieldOptions !== undefined){
-            let options = Object.keys(fieldOptions);
-            for(var optionsIndex in options){
-                if(options[optionsIndex] === inputValue){
-                    return true;
-                }
-            }
-        }
-
-        event.record[fieldCode]['error']="「"+fieldCode+"」"+"には、存在しない値を挿入しようとしたため、処理を中断しました。";
-        throw new Error("「"+fieldCode+"」"+"には、存在しない値を挿入しようとしたため、処理を中断しました。「値を挿入する」コンポーネントの処理を中断しました。");
-    }
-
-    /**
-     * 入力値がフィールドタイプ(ユーザー選択)で、ユーザー情報に存在する値かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {string | boolean} 入力値が登録されているユーザー情報から見つかった場合、trueを返し、見つからなかった場合、falseを返す
-     */
-    async setInputUser(inputValue :string): Promise<string | boolean>{
-
-        //ユーザー名を格納する変数
-        let usersName;
-        const usersInfoColumnIndex=0;
-
-        try{
-            //APIでユーザー情報を取得する
-            const resp =await kintone.api(kintone.api.url('/v1/users', true), 'GET', {codes:[inputValue ]})
-
-            //入力されたログイン名(メールアドレス)がユーザー情報に登録されている場合、そのユーザー名を取得する
-            if (resp.users[usersInfoColumnIndex].code === inputValue) {
-                usersName=resp.users[usersInfoColumnIndex].name;
-            }
-
-            //ユーザー名が取得できた場合、ログイン名とユーザー名をフィールドにセットする
-            if(usersName === undefined){
-                throw new Error();
-            }
-        }catch{
-            return false;
-        }
-
-        return usersName;
-    }
-
-    /**
-     * 入力値がフィールドタイプ(組織選択)で、組織情報に存在する値かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {string | boolean} 入力値が登録されている組織情報から見つかった場合、trueを返し、見つからなかった場合、falseを返す
-     */
-    async setInputOrganization(inputValue :string): Promise<string | boolean>{
-
-        //組織名を格納する変数
-        let organizationName;
-        const organizationsInfoColumnIndex=0;
-
-        try{
-            //APIで組織情報を取得する
-            const resp =await kintone.api(kintone.api.url('/v1/organizations.json', true), 'GET', {codes:[inputValue ]})
-
-            //入力された組織コードが組織情報に登録されている場合、その組織名を取得する
-                if (resp.organizations[organizationsInfoColumnIndex].code === inputValue) {
-                    organizationName=resp.organizations[organizationsInfoColumnIndex].name;
-                }
-
-            //組織名が取得できた場合、組織コードと組織名をフィールドにセットする
-            if(organizationName === undefined){
-                throw new Error();
-            }
-        }catch{
-            return false;
-        }
-
-        return organizationName;
-    }
-
-    /**
-     * 入力値がフィールドタイプ(グループ選択)で、グループ情報に存在する値かチェックする関数
-     * @param {string} inputValue - 挿入する値
-     * @return {string | boolean} 入力値が登録されているグループ情報から見つかった場合、trueを返し、見つからなかった場合、falseを返す
-     */
-    async setInputGroup(inputValue :string): Promise<string | boolean>{
-
-        //グループ名を格納する変数
-        let groupsName;
-        const groupsInfoColumnIndex=0;
-
-        try{
-            //APIでグループ情報を取得する
-            const resp =await kintone.api(kintone.api.url('/v1/groups.json', true), 'GET', {codes:[inputValue ]})
-
-            //入力されたグループコードがグループ情報に登録されている場合、そのグループ名を取得する
-            if (resp.groups[groupsInfoColumnIndex].code === inputValue) {
-                groupsName=resp.groups[groupsInfoColumnIndex].name;
-            }
-
-            //グループ名が取得できた場合、グループコードとグループ名をフィールドにセットする
-            if(groupsName === undefined){
-                throw new Error();
-            }
-        }catch{
-            return false;
-        }
-
-        return groupsName;
-    }
-
-
-
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode
-     * @param event
-     * @returns
-     */
-    async process(actionNode:IActionNode,event:any,context:IContext):Promise<IActionResult> {
-
-        let result={
-            canNext:true,
-            result:false
-        };
-        try{
-            //属性設定を取得する
-            this.actionProps = actionNode.actionProps;
-            if (!('field' in actionNode.ActionValue) && !('value' in actionNode.ActionValue)) {
-                return result
-            }
-
-            const fieldColumnIndex=1;
-            const valueColumnIndex=3;
-
-            //プロパティで選択されたフィールド
-            const field=this.actionProps[fieldColumnIndex].props.modelValue.type;
-            //プロパティの挿入する値
-            const value=this.actionProps[valueColumnIndex].props.modelValue;
-
-            //条件式の結果を取得
-            const conditionResult = this.getConditionResult(context);
-            if(!conditionResult){
-                return result;
-            }
-
-            //プロパティの値を挿入するフィールドが未選択の場合、例外を発生させる
-            if(field === null){
-                throw new Error("「値を挿入する」コンポーネントで、値を挿入するフィールドが指定されていなかったため、処理が中断されました。");
-            }
-
-            //プロパティの値を挿入するフィールドが非対応フィールドの場合、例外を発生させる
-            //添付ファイル・テーブル・カテゴリー・ステータス・作成者・更新者・作業者・リビジョン番号・レコード番号・レコードID・計算・作成日時・更新日時フィールドが選択されている場合、例外を発生させる
-            if(field === "FILE" || field === "SUBTABLE" || field === "CATEGORY" || field === "STATUS"
-                    || field === "STATUS_ASSIGNEE" || field === "CREATOR" || field === "MODIFIER" || field === "__REVISION__"
-                        || field === "RECORD_NUMBER"|| field === "__ID__" || field ==="CALC" || field === "CREATED_TIME" || field === "UPDATED_TIME" ){
-                throw new Error("「値を挿入する」コンポーネントで、選択されたフィールドは、値を挿入するコンポーネントでは非対応のフィールドのため、処理を中断しました。");
-            }
-
-            //プロパティの挿入する値が未入力の場合、例外を発生させる
-            if(value === ""){
-                throw new Error("「値を挿入する」コンポーネントで、フィールドに挿入する値が指定されていなかったため、処理が中断されました。");
-            }
-
-            //既定のプロパティのインターフェースへ変換する
-            this.props = actionNode.ActionValue as IInsertValueProps;
-
-            //挿入する値を取得
-            let fieldValue = this.props.value;
-            //フィールドの種類を取得
-            const fieldType = this.props.field.type;
-            //フィールドが必須項目なのか取得
-            const fieldRequired=this.props.field.required;
-            //挿入するフィールドのコードを取得
-            const fieldCode=this.props.field.code;
-            //挿入する値の形式（手入力か変数）を取得
-            const insertValueType=this.props.show;
-            //ラジオボタン・チェックボックス・複数選択・ドロップダウンの選択肢を取得
-            let fieldOptions =this.props.field.options;
-            //変数の値を格納する
-            let variableValue;
-
-            //変数の場合、値が取得できるかチェック
-            if(insertValueType === "変数" && conditionResult){
-                variableValue = context.variables[fieldValue];
-
-                if(variableValue === undefined){
-                    throw new Error("「"+fieldCode+"」"+"フィールドに入れようとした変数は、無効な入力形式です。");
-                }
-                fieldValue = variableValue;
-            }
-
-            //入力値チェック後、形式変換、型変換した値を格納する変数
-            let correctFormattedValue;
-            //入力値チェック後、形式変換、型変換した値を格納する配列
-            let correctValues :string[] = [];
-            //入力エラー（空白文字の混入）がないことをチェック
-            let notInputError=this.checkInputBlank(fieldType,fieldValue,fieldCode,fieldRequired,event);
-
-            //条件式の結果がtrue、入力エラー（空白文字の混入）がない場合、挿入する値をフィールドタイプ別にチェックする
-            if(conditionResult && notInputError){
-
-                //文字列型のフィールドに挿入しようとしている値が適切の場合、correctFormattedValueに代入する
-                if(fieldType === "SINGLE_LINE_TEXT" || fieldType === "MULTI_LINE_TEXT" || fieldType === "RICH_TEXT" || fieldType === "LINK" ){
-                    correctFormattedValue = fieldValue;
-
-                //数値型のフィールドに挿入しようとしている値が適切の場合、数値型に型変換してcorrectFormattedValueに代入する
-                }else if(fieldType === "NUMBER" ){
-                    if(this.checkInputNumber(fieldValue,fieldCode,event)){//入力値チェック
-                        correctFormattedValue = Number(fieldValue);//型変換
-                    }
-
-                //日付・日時型のフィールドに挿入しようとしている値が適切の場合、指定の日付・日時に形式変換してcorrectFormattedValueに代入する
-                }else if(fieldType === "DATE" || fieldType === "DATETIME" ){
-                    if(this.checkInputDate(fieldValue,fieldCode,event)){//入力値チェック
-                        let formattedDate = this.changeDateFormat(fieldValue,fieldType,fieldCode,event)
-                        if(formattedDate){
-                            correctFormattedValue = formattedDate
-                        }
-                    }
-
-                //時刻フィールドに挿入しようとしている値が適切の場合、correctFormattedValueに代入する
-                }else if(fieldType === "TIME"){
-                    if(this.checkInputTime(fieldValue,fieldCode,event)){//入力値チェック
-                        correctFormattedValue = fieldValue;
-                    }
-
-                //ラジオボタン・ドロップダウンのフィールドの選択肢と入力値が一致した場合、correctFormattedValueに代入する
-                }else if(fieldType === "RADIO_BUTTON" || fieldType === "DROP_DOWN"){
-                    if(this.checkInputOption(fieldValue,fieldOptions,fieldCode,event)){//入力値チェック
-                        correctFormattedValue = fieldValue;
-                    }
-
-                //チェックボックス・複数選択のフィールドの選択肢と入力値が一致した場合、correctValuesの配列に代入する
-                }else if(fieldType === "CHECK_BOX" || fieldType === "MULTI_SELECT" ){
-                    if(this.checkInputOption(fieldValue,fieldOptions,fieldCode,event)){//入力値チェック
-                        correctValues[0] = fieldValue;
-                    }
-
-                //ユーザー情報フィードに挿入しようとした値が適切な場合、correctFormattedValueに代入する
-                }else if(fieldType === "USER_SELECT"){
-                    //挿入する値がユーザー情報から見つかれば、ユーザー名を格納
-                    let users=await this.setInputUser(fieldValue);
-
-                    //ユーザー名が格納できている場合、ログイン名とユーザー名をcorrectFormattedValueに代入する
-                    if(!users){
-                        event.record[fieldCode]['error']="ユーザー選択に、挿入しようとしたユーザー情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。";
-                        throw new Error("ユーザー選択に、挿入しようとしたユーザー情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。");
-                    }else{
-                        correctFormattedValue=[{ code: fieldValue, name: users }];
-                    }
-
-                //組織情報フィードに挿入しようとした値が適切な場合、correctFormattedValueに代入する
-                }else if(fieldType === "ORGANIZATION_SELECT"){
-                    //挿入する値が組織情報から見つかれば、組織名を格納
-                    let organizations=await this.setInputOrganization(fieldValue);
-
-                    //組織名が格納できている場合、組織コードと組織名をcorrectFormattedValueに代入する
-                    if(!organizations){
-                        event.record[fieldCode]['error']="組織選択フィールドに、挿入しようとした組織情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。";
-                        throw new Error("組織選択フィールドに、挿入しようとした組織情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。");
-                    }else{
-                        correctFormattedValue=[{ code: fieldValue, name: organizations}];
-                    }
-
-                //グループ情報フィードに挿入しようとした値が適切な場合、correctFormattedValueに代入する
-                }else if(fieldType === "GROUP_SELECT"){
-                    //挿入する値がグループ情報から見つかれば、グループ名を格納
-                    let groups=await this.setInputGroup(fieldValue);
-
-                    //グループ名が格納できている場合、グループコードとグループ名をcorrectFormattedValueに代入する
-                    if(!groups){
-                        event.record[fieldCode]['error']="グループ選択フィールドに、挿入しようとしたグループ情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。";
-                        throw new Error("グループ選択フィールドに、挿入しようとしたグループ情報は見つかりませんでした。「値を挿入する」コンポーネントの処理を中断しました。");
-                    }else{
-                        correctFormattedValue=[{ code: fieldValue, name: groups}];
-                    }
-                }
-            }
-
-            //条件式の結果がtrueかつ挿入する値が変換できた場合、フィールド（ラジオボタン・ドロップダウン・チェックボックス・複数選択・文字列一行・文字列複数行・リッチエディタ・数値・日付・日時・時刻）にセット
-            if(conditionResult && (correctFormattedValue || correctValues)){
-                //条件式の結果がtureかつ、値を正しい形式に変換できた場合、フィールドに値をセットする
-                if(correctFormattedValue){
-                    event.record[fieldCode].value = correctFormattedValue;
-                //条件式の結果がtureかつ、値を正しい形式（配列）に変換できた場合、フィールドに値（配列）をセットする
-                }else if(correctValues.length > 0){
-                    event.record[fieldCode].value = correctValues;
-                }
-            }
-
-            result= {
-                canNext:true,
-                result:true
-            }
-            return result;
-        }catch(error:any){
-            event.record;
-            event.error=error.message;
-            console.error(error);
-            result.canNext=true;//次のノードは処理を続ける
-            return result;
-        }
-
-    }
-
-    /**
-     *
-     * @param context 条件式を実行する
-     * @returns
-     */
-    getConditionResult(context:any):boolean{
-        //プロパティ`condition`から条件ツリーを取得する
-        const tree =this.getCondition(this.props.condition);
-        if(!tree){
-            //条件を設定されていません
-            return true;
-        }
-        return tree.evaluate(tree.root,context);
-    }
-
-    /**
-     * @param condition 条件式ツリーを取得する
-     * @returns
-     */
-    getCondition(condition:string):ConditionTree|null{
-        try{
-            const tree = new ConditionTree();
-            tree.fromJson(condition);
-            if(tree.getConditions(tree.root).length>0){
-                return tree;
-            }else{
-                return null;
-            }
-        }catch(error){
-            return null;
-        }
-    }
-
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-
-}
-new InsertValueAction();

plugin/kintone-addins/src/actions/mail-check.ts

@@ -1,80 +0,0 @@
-import { actionAddins } from ".";
-import { IAction, IActionResult, IActionNode, IActionProperty, IField } from "../types/ActionTypes";
-/**
- * アクションの属性定義
- */
-interface IMailCheckProps {
-    field: IField;//チェックするフィールドの対象
-    message: string;//エラーメッセージ
-    emailCheck:string;
-}
-/**
- * メールアドレスチェックアクション
- */
-export class MailCheckAction implements IAction {
-    name: string;
-    actionProps: IActionProperty[];
-    props: IMailCheckProps;
-    constructor() {
-        this.name = "メールアドレスチェック";
-        this.actionProps = [];
-        this.props = {
-            field: { code: '' },
-            message: '',
-            emailCheck:''
-        }
-        //アクションを登録する
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode 
-     * @param event 
-     * @returns 
-     */
-    async process(actionNode: IActionNode, event: any): Promise<IActionResult> {
-        let result = {
-            canNext: true,
-            result: false
-        };
-
-        try {
-            //属性設定を取得する
-            this.actionProps = actionNode.actionProps;
-
-            if (!('field' in actionNode.ActionValue) && !('message' in actionNode.ActionValue) && !('emailCheck' in actionNode.ActionValue)) {
-                return result
-            }
-            this.props = actionNode.ActionValue as IMailCheckProps;
-            //条件式の計算結果を取得
-            const record = event.record;
-            const value = record[this.props.field.code].value;
-
-            if (this.props.emailCheck === '厳格') {
-                if (!/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(value)) {
-                    record[this.props.field.code].error = this.props.message;
-                }
-            } else if (this.props.emailCheck === 'ゆるめ') {
-                if (!/^[^@]+@[^@]+$/.test(value)) {
-                    record[this.props.field.code].error = this.props.message;
-                }
-            } else {
-                result = {
-                    canNext: true,
-                    result: true
-                }
-            }
-            return result;
-        } catch (error) {
-            event.error = error;
-            console.error(error);
-            result.canNext = false;
-            return result;
-        }
-    };
-    register(): void {
-        actionAddins[this.name] = this;
-    }
-
-}
-new MailCheckAction();

plugin/kintone-addins/src/actions/regular-check.ts

@@ -1,72 +0,0 @@
-import { actionAddins } from ".";
-import {  IAction,IActionResult, IActionNode, IActionProperty, IField} from "../types/ActionTypes";
-/**
- * アクションの属性定義
- */
-interface IRegularCheckProps{
-    field:IField;//チェックするフィールドの対象
-    message:string;//エラーメッセージ
-    regExpression:string;//正規表現式
-}
-/**
- * 正規表現チェックアクション
- */
-export class RegularCheckAction implements IAction{
-    name: string;
-    actionProps: IActionProperty[];
-    props:IRegularCheckProps;
-    constructor(){
-        this.name="正規表現チェック";
-        this.actionProps=[];
-        this.props={
-            field:{code:''},
-            message:'',
-            regExpression:''
-        }
-        //アクションを登録する
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode 
-     * @param event 
-     * @returns 
-     */
-    async process(actionNode:IActionNode,event:any):Promise<IActionResult> {
-        let result={
-            canNext:true,
-            result:false
-        };
-        try{
-            //属性設定を取得する
-            this.actionProps=actionNode.actionProps;
-            if (!('field' in actionNode.ActionValue) && !('message' in actionNode.ActionValue) && !('regExpression'in actionNode.ActionValue)) {
-                return result
-            }
-            this.props = actionNode.ActionValue as IRegularCheckProps;
-            //条件式の計算結果を取得
-            const record = event.record;
-            const value = record[this.props.field.code].value;
-            const regex = new RegExp(this.props.regExpression);
-            if(!regex.test(value)){
-                record[this.props.field.code].error=this.props.message;
-            }else{
-                result= {
-                    canNext:true,
-                    result:true
-                  }
-            }
-            return result;
-        }catch(error){
-            event.error=error;
-            console.error(error);
-            result.canNext=false;
-            return result;
-        }
-    };
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-    
-}
-new RegularCheckAction();

plugin/kintone-addins/src/actions/string-join.ts

@@ -1,211 +0,0 @@
-import { actionAddins } from ".";
-import { IField, IAction,IActionResult, IActionNode, IActionProperty } from "../types/ActionTypes";
-import { Formatter } from "../util/format";
-
-//右UI画面propertyのname:型：
-interface IStringJoinProps{
-    //保存先フィールド
-    saveField:IField;
-    //結合元フィールド1
-    joinField1:IField;
-    //結合元フィールド2
-    joinField2:IField;
-    //区切り文字
-    delimiter:string;
-}
-
-//IActionインタフェースを実装する新しいクラスActionを作成：
-export class StringJoinAction implements IAction{
-    name: string;
-    //importから導入顕示定義
-    actionProps: IActionProperty[];
-    //上方のinterface Propsから、props受ける属性を定義：
-    props:IStringJoinProps;
-    //関数定義に必要な類名を構築：
-    constructor(){
-        //pgAdminDBに登録したアクション名(name/subtitle)一致する必要がある：
-        this.name="文字結合";
-        this.actionProps=[];
-        this.register();
-        //プロパティ属性初期化：
-        this.props={
-            saveField:{code:''},
-            joinField1:{code:''},
-            joinField2:{code:''},
-            delimiter:''
-        }
-        //リセット上記登録表：
-        this.register();
-    }
-/**
- * アクションの処理を実装する
- * @param actionNode アクションノード
- * @param event Kintoneのイベント
- * @param context コンテキスト（レコード、変数情報を持っている）
- * @returns 
- */
-　　//非同期処理ある関数下のある属性：
-    async process(actionNode:IActionNode,event:any):Promise<IActionResult> {
-        let result={
-            //後継処理不可：
-            canNext:false,
-            result:false
-        };
-        try{
-            //属性設定を取得する：
-            this.actionProps=actionNode.actionProps;
-            //プロパティ設定のデータ型は必要な情報含めますか？全部不存在時return:
-            if (!('saveField' in actionNode.ActionValue) && !('joinField1' in actionNode.ActionValue) && !('joinField2' in actionNode.ActionValue)) {
-                return result
-            }
-
-            //既定のプロパティのインタフェースへ変換：
-            this.props = actionNode.ActionValue as IStringJoinProps;
-            const record = event.record;
-
-            //kintoneフィールドタイプ取得：
-            const joinField1type=this.props.joinField1.type;
-            const joinField2type=this.props.joinField2.type;
-            const saveFieldtype=this.props.saveField.type;
-
-//////////////////////////////////////////////////////////////////////////////////////////////////////
-            // //保存先フィールドは文字列フィールドではない場合、エラー発生：
-            if(!(saveFieldtype==='SINGLE_LINE_TEXT'||saveFieldtype==='MULTI_LINE_TEXT'||saveFieldtype==='RICH_TEXT')){
-                event.error='[エラーメッセージ]：結合保存先対応不可。結合しません';
-                if (event.type.includes('success')){
-                    window.alert("[windows alert]："+event.error);
-                }
-                result = {
-                    canNext: false,
-                    result: false
-                }
-                return result;
-            }
-//////////////////////////////////////////////////////////////////////////////////////////
-    //値取得方法定義：
-    function getValue(value:string,type:string|undefined,fieldCode:string,event:any){
-        if(event.record[fieldCode]?.value===undefined||event.record[fieldCode]?.value===null){
-            event.record[fieldCode].value='';
-        }
-        //作成者、更新者：
-        if(type==='CREATOR'||type==='MODIFIER'){
-            value = event.record[fieldCode]?.value.name;
-        //日時、作成日時、更新日時：
-        }else if(type==='DATETIME'||type==='CREATED_TIME'||type==='UPDATED_TIME'){
-            if(event.record[fieldCode]?.value!==undefined && event.record[fieldCode]?.value!==''){
-                value = Formatter.dateFormat(new Date(event.record[fieldCode]?.value),'yyyy-MM-dd HH:mm');
-                }else{
-                    value=event.record[fieldCode]?.value;
-                }
-        //ユーザ選択、組織選択、グループ選択、添付ファイル名、作業者、カテゴリー：
-        }else if(type==='USER_SELECT'||type==='ORGANIZATION_SELECT'||type==='GROUP_SELECT'||type==='FILE'||type==='STATUS_ASSIGNEE'){
-            if(event.record[fieldCode]?.value===undefined || event.record[fieldCode]?.value===''){
-                value = event.record[fieldCode]?.value;
-            }else{
-                const mototext=event.record[fieldCode]?.value;
-                let arr=[];
-                for(let i=0;i<mototext.length;i++){
-                    arr.push(mototext[i].name);
-                }
-          　　　//配列要素を,で連結して文字列を作成：
-                value=arr.join();
-            }
-        //カテゴリー、チェックボックス、複数選択：
-        }else if(type==='CATEGORY'||type==='CHECK_BOX'||type==='MULTI_SELECT'){
-            if(event.record[fieldCode]?.value===undefined || event.record[fieldCode]?.value===''){
-                value = event.record[fieldCode]?.value;
-            }else{
-                const mototext=event.record[fieldCode]?.value;
-                let arr=[];
-                for(let i=0;i<mototext.length;i++){
-                    arr.push(mototext[i]);
-                }
-          　　　//配列要素を,で連結して文字列を作成：
-                value=arr.join();
-            }
-        //詳細画面プロセス実行後のステータス：
-        }else if(type==='STATUS'&&event.type.includes('process')){
-            value = event.nextStatus.value;
-        }else{
-            value = event.record[fieldCode]?.value;
-        }
-        if (value===undefined || value===null){
-            value='';
-        }        
-        return value;     
-    }
-//////////////////////////////////////////////////////////////////////
-            //値取得方法呼出：
-            let joinValue1:string='';
-            joinValue1=getValue(joinValue1,joinField1type,this.props.joinField1.code,event);
-/////////////////////////////////////////////////////////////////////////////////////
-            let joinValue2:string='';
-            joinValue2=getValue(joinValue2,joinField2type,this.props.joinField2.code,event);
-//////////////////////////////////////////////////////////////////////////////////////////////////////////
-            const conString = this.props.delimiter;
-            let saveValue:string='';
-            //前後結合元が空白なら区切り文字も空白にする(例:1-8の8無いなら1。1-8の1無いなら8。1空白8の8無いなら1。結合元全部空白なら全部空白):
-            if(joinValue1===''&&joinValue2===''){
-                saveValue='';
-            }else if(joinValue1===''&&joinValue2!==''){
-                saveValue=joinValue2;
-            }else if(joinValue2===''&&joinValue1!==''){
-                saveValue=joinValue1;
-            }else if(joinValue1!==''&&joinValue2!==''){
-                saveValue=`${joinValue1}${conString}${joinValue2}`
-            }
-////////////////////////////////////////////////////////////////////////////////////////////////////////////
-            //新規/更新/一覧保存成功後の以外のeventでPUT使用しない：
-            if (!event.type.includes('success')){
-                 //保存先フィールドに値セット：
-                 record[this.props.saveField.code].value=saveValue;
-                 window.alert("文字結合行いました。"+this.props.joinField1.name+":"+joinValue1+","+this.props.joinField2.name+":"+joinValue2+"。");
-            }else{
-                const params={
-                    "app":event.appId,
-                    "id":event.recordId,
-                    "record":{[this.props.saveField.code]:{"value":saveValue}}
-                };
-                return await kintone.api(kintone.api.url('/k/v1/record',true),'PUT',params).then((resp) => {
-                    //kintone保存先フィールド存在確認：
-                    record[this.props.saveField.code].value=saveValue;
-                    if (event.type.includes('index')){
-                        window.alert("文字結合行いました。"+this.props.joinField1.name+":"+joinValue1+","+this.props.joinField2.name+":"+joinValue2+"。一覧画面更新成功後自動リロードしません。必要に応じて手動リロードください。");
-                    }else{
-                        window.alert("文字結合行いました。"+this.props.joinField1.name+":"+joinValue1+","+this.props.joinField2.name+":"+joinValue2+"。");
-                    }
-                        //一覧画面更新成功後リロード：
-                    // if (event.type.includes('index')){
-                    //     event.url = location.href.endsWith('/') || location.href.endsWith('&') ?
-                    //     location.href.slice(0, -1) :
-                    //     location.href + (location.href.includes('?') ? '&' : '/');
-                    // }
-                }).catch((error) => {
-                    event.error = 'エラーが発生しました。結合しません。システム管理者へお問合せください';
-                    window.alert(event.error+"error message："+error);
-                    return event;
-                });
-            }
-//////////////////////////////////////////////////////////////////////////////////////////////////////
-            result= {
-                canNext:true,
-                result:true
-            }
-            return result;
-        }catch(error){;
-            if (event.type.includes('success')){
-                window.alert("[windows alert]：処理中異常が発生しました。結合しません。システム担当者へお問合せください。errorメッセージ："+error)
-            }
-            event.error="[エラーメッセージ]：処理中異常が発生しました。結合しません。システム担当者へお問合せください。errorメッセージ："+error;
-            return {
-                canNext:false,
-                result:false
-            }
-        }
-    }
-///////////////////////////////////////////////////////////////////////////////////////////////
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-}
-new StringJoinAction();

plugin/kintone-addins/src/actions/validation fullwidth.ts

@@ -1,102 +0,0 @@
-import { actionAddins } from ".";
-import {  IAction,IActionResult, IActionNode, IActionProperty, IField, IContext } from "../types/ActionTypes";
-
-//クラス名を設計書に揃える
-/**
- * アクションの属性定義
- */
-    interface FullWidthProps{
-        //checkOption:Array<string>,
-        field:IField
-    }
-/**
- * 全角チェックアクション
- */
-export class FullWidthAction implements IAction{
-    name: string;
-    actionProps: IActionProperty[];
-    props:FullWidthProps;
-    constructor(){
-        this.name="全角チェック"; /* pgadminのnameと同様  */
-        this.actionProps=[];
-        this.props={
-            //checkOption:[],
-            field:{code:''}
-        }
-        //アクションを登録する
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode
-     * @param event
-     * @returns
-     */
-    async process(actionNode:IActionNode,event:any,context:IContext):Promise<IActionResult> {
-        let result={
-            canNext:true,
-            result:false
-        };
-        try{
-            //属性設定を取得する
-            this.actionProps=actionNode.actionProps;
-            if (!('field' in actionNode.ActionValue) ) {
-                return result
-            }
-            this.props = actionNode.ActionValue as FullWidthProps;
-            //条件式の計算結果を取得
-            const record = event.record;
-            const value = record[this.props.field.code]?.value;
-            //条件分岐
-            //未入力時は何も処理をせず終了
-            if(value===undefined || value===''){
-                return result;
-            }
-            //半角が含まれていた場合resultがfalse
-            if(!this.containsFullWidthChars(value)){
-                //エラー時に出力される文字設定
-                record[this.props.field.code].error="半角が含まれています";
-                //次の処理を中止する値設定
-                result.canNext=false;
-                return result;
-            }
-            //resultプロパティ指定
-            result= {
-            canNext:true,
-            result:true
-            }
-            return result;
-        //例外処理
-        }catch(error){
-            event.error=error;
-            console.error(error);
-            result.canNext=false;
-            return result;
-        }
-    }
-    //全て全角の文字列の場合はtrue、そうでない場合はfalse
-    containsFullWidthChars(text: string): boolean {
-        //半角英数字カナを除外
-        const checkRegex="^[^\x01-\x7E\uFF61-\uFF9F]+$";
-        //正規表現オブジェクト生成
-        const fullWidthRegex = new RegExp(checkRegex);
-        
-        //正規表現チェック
-        return fullWidthRegex.test(text);
-        
-        //全角を表すUnicodeの全角正規表現(参照先URL)
-        // \u3000-\u303F：句読点・記号
-        // \u3040-\u309F：すべてのひらがな
-        // \u30A0-\u30FF:すべてのカタカナ
-        // \u4E00-\u9FAF:すべての漢字
-        // \uFF00-\uFFEF:全角英数字と半角カタカナ
-        // \u3400-\u4DBF:CJK統合漢字拡張
-        //const fullWidthRegex = /[/^[\u3000-\u303F\u3040-\u309F\u30A0-\u30FF\uFF00-\uFFEF\u4E00-\u9FAF\u3400-\u4DBF]+$/g;
-        
-    }
-    //戻り値を持たないためvoid型
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-}
-new FullWidthAction();

plugin/kintone-addins/src/actions/value-getter.ts

@@ -1,68 +0,0 @@
-import { actionAddins } from ".";
-import {  IAction,IActionResult, IActionNode, IActionProperty, IField, IContext} from "../types/ActionTypes";
-/**
- * アクションの属性定義
- */
-interface IGetValueProps{
-    field:IField;//チェックするフィールドの対象
-    verName:string;
-}
-/**
- * 正規表現チェックアクション
- */
-export class GetValueAciton implements IAction{
-    name: string;
-    actionProps: IActionProperty[];
-    props:IGetValueProps;
-    constructor(){
-        this.name="値を取得する";
-        this.actionProps=[];
-        this.props={
-            field:{code:''},
-            verName:''
-        }
-        //アクションを登録する
-        this.register();
-    }
-    /**
-     * アクションの実行を呼び出す
-     * @param actionNode 
-     * @param event 
-     * @returns 
-     */
-    async process(actionNode:IActionNode,event:any,context:IContext):Promise<IActionResult> {
-        let result={
-            canNext:true,
-            result:false
-        };
-        try{
-            //属性設定を取得する
-            this.actionProps=actionNode.actionProps;
-            if (!('field' in actionNode.ActionValue) && !('verName' in actionNode.ActionValue)) {
-                return result
-            }
-            
-            this.props = actionNode.ActionValue as IGetValueProps;
-            //条件式の計算結果を取得
-            const record = event.record;
-            const value = record[this.props.field.code].value;
-            context.variables[this.props.verName] = value;
-            result = {
-                canNext:true,
-                result:true
-                }
-            
-            return result;
-        }catch(error){
-            event.error=error;
-            console.error(error);
-            result.canNext=false;
-            return result;
-        }
-    };
-    register(): void {
-        actionAddins[this.name]=this;
-    }
-    
-}
-new GetValueAciton();

plugin/kintone-addins/src/index.ts

@@ -1,3 +1,9 @@
+// export const sum = (a: number, b: number) => {
+//   if ('development' === process.env.NODE_ENV) {
+//     console.log('boop');
+//   }
+//   return a + b;
+// };
 import $ from 'jquery';
 import { ActionProcess } from './types/action-process';
 import { ActionFlow } from './types/ActionTypes';

plugin/kintone-addins/src/types/ActionTypes.ts

@@ -89,8 +89,6 @@ export interface IField{
   name?:string;
   code:string;
   type?:string;
-  required?:boolean;
-  options?:string;
 }
 
 /**

plugin/kintone-addins/src/types/action-process.ts

@@ -6,14 +6,8 @@ import '../actions/field-shown';
 import '../actions/error-show';
 import '../actions/button-add';
 import '../actions/condition-action';
-import '../actions/regular-check';
+import '../actions/data-processing';
-import '../actions/mail-check';
+import '../actions/data-mapping';
-import '../actions/counter-check';
-import '../actions/datetime-getter';
-import '../actions/insert-value';
-import '../actions/value-getter';
-import '../actions/string-join';
-import '../actions/validation fullwidth';
 import { ActionFlow,IActionFlow, IActionResult,IContext } from "./ActionTypes";
 
 export class ActionProcess{
@@ -47,7 +41,7 @@ export class ActionProcess{
             result = await action.process(nextAction,this.event,this.context);
            }
            let nextInput = '';
-           //outputPoints一㝤以上㝮場坈〝次㝮InputPoint㝯戻り値を設定㝙る
+           //outputPoints一つ以上の場合、次のInputPointは戻り値を設定する
            if(nextAction.outputPoints && nextAction.outputPoints.length>1){
              nextInput = result.result||'';
            }

plugin/kintone-addins/vite.config.js

@@ -1,16 +1,17 @@
 // vite.config.js
-import { defineConfig } from "vite";
+import { defineConfig, loadEnv } from "vite";
-import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js";
 import checker from "vite-plugin-checker";
+import { libInjectCss } from 'vite-plugin-lib-inject-css';
 
-const sourcemap = process.env.SOURCE_MAP === "true";
+export default ({ mode }) => {
+  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };
 
-export default defineConfig({
+  return defineConfig({
     plugins: [
       checker({
         typescript: true,
       }),
-    cssInjectedByJsPlugin(),
+      libInjectCss(),
     ],
     build: {
       cssCodeSplit: false,
@@ -21,6 +22,11 @@ export default defineConfig({
           // assetFileNames:'alc_kintone_style.css'
         },
       },
-    sourcemap: sourcemap,
+      sourcemap: process.env.VITE_SOURCE_MAP,
     },
-});
+    server: {
+      port: process.env.VITE_PORT,
+      // open: "/dist/alc_runtime.js",
+    },
+  });
+};

sample2.json

@@ -1,22 +1,55 @@
 [
     {
-    "component": "FieldInput",
+        "component": "InputText",
         "props": {
-      "displayName": "フィールド",
+            "displayName": "文字入力",
-      "modelValue": {},
+            "modelValue": "",
-      "name": "field",
+            "name": "str",
-      "placeholder": "対象項目を選択してください"
+            "placeholder": "文字を入力してください",
+            "maxLength":"20",
+            "hint":"文字列入力<br>入力ルール指定可能。ルールの設定例：[val=>!!val||'必須入力です']",
+            "rules":"[val=>!!val||'必須入力です']"
         }
     },
     {
-    "component": "SelectBox",
+        "component": "AppFieldSelect",
         "props": {
-        "displayName": "チェックする全角文字",
+            "displayName": "フィールド選択(複数)",
-        "modelValue": null,
+            "modelValue": {},
-        "name": "options",
+            "name": "selectFields",
-        "placeholder": "チェックしたい全角文字を選択する",
+            "placeholder": "アプリ選択後、フィールドを選んでください",
-        "selectType":"multiple",
+            "selectType":"multiple"
-        "options":["全角記号および句読点","ひらがな","カタカナ","全角英数字","常用漢字","拡張漢字"]
+        }
+    },
+    {
+        "component": "AppFieldSelect",
+        "props": {
+            "displayName": "フィールド選択(単一)",
+            "modelValue": {},
+            "name": "selectField",
+            "placeholder": "アプリ選択後、フィールドを選んでください",
+            "selectType":"single"
+        }
+    },
+    {
+        "component": "ColorPicker",
+        "props": {
+            "displayName": "色選択",
+            "modelValue": "",
+            "name": "color",
+            "placeholder": "カラーを選択してください"
+        }
+    },
+    {
+        "component": "NumInput",
+        "props": {
+            "displayName": "数値入力フィールド",
+            "modelValue": "",
+            "name": "num",
+            "max":100,
+            "min":0,
+            "placeholder": "数値を入力してください",
+            "rules":"[val=>!!val ||'数値を入力してください',val=>val<=100 && val>=1 || '1-100の範囲内の数値を入力してください']"
         }
     }
 ]

yarn.lock

@@ -1,4 +0,0 @@
-# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
-# yarn lockfile v1
-
-