alicorn-dev/KintoneAppBuilder
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:TASK617-681修正

Browse Source 
617:属性更新時Toast表示
618:フィールドの表示件数、初期ソード順変更
その他：フローエディタの不具合修正
This commit is contained in:
xiaozhe.ma
2024-09-06 09:08:56 +09:00
parent a7783987a8
commit ad827c1dc8
10 changed files with 127 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/components/FieldList.vue
View File

@@ -1,13 +1,18 @@
<template>
<div class="q-pa-md">
<q-table flat bordered :loading="!isLoaded" row-key="name" :selection="type" :selected="modelValue"
@update:selected="$emit('update:modelValue', $event)" :filter="filter" :columns="columns" :rows="rows" />
@update:selected="$emit('update:modelValue', $event)"
:filter="filter"
:columns="columns"
:rows="rows"
:pagination="pagination"
style="max-height: 55vh;"/>
</div>
</template>
<script lang="ts">
import { useAsyncState } from '@vueuse/core';
import { api } from 'boot/axios';
import { computed ,Prop,PropType} from 'vue';
import { computed ,Prop,PropType,ref} from 'vue';
import {IField} from 'src/types/ComponentTypes';
export default {
@@ -50,7 +55,13 @@ export default {
columns,
rows,
// selected: ref([]),
isLoaded
isLoaded,
pagination: ref({
rowsPerPage: 25,
sortBy: 'name',
descending: false,
page: 1,
})
}
},

4
frontend/src/components/FieldSelect.vue
View File

@@ -46,10 +46,10 @@ export default {
{ name: 'type', label: 'フィールドタイプ', align: 'left', field: 'type', sortable: true }
];
const pageSetting = ref({
sortBy: 'desc',
sortBy: 'name',
descending: false,
page: 1,
rowsPerPage: props.not_page ? 0 : 5
rowsPerPage: props.not_page ? 0 : 25
// rowsNumber: xx if getting data from a server
});
const rows = reactive([]);

14
frontend/src/components/left/EventTree.vue
View File

@@ -43,7 +43,7 @@ import { QTree, useQuasar } from 'quasar';
import { ActionFlow, RootAction } from 'src/types/ActionTypes';
import { useFlowEditorStore } from 'stores/flowEditor';
import { defineComponent, ref,watchEffect } from 'vue';
import { IKintoneEvent, IKintoneEventGroup, IKintoneEventNode } from '../../types/KintoneEvents';
import { IKintoneEvent, IKintoneEventGroup, IKintoneEventNode, kintoneEvent } from '../../types/KintoneEvents';
import FieldSelect from '../FieldSelect.vue';
import ShowDialog from '../ShowDialog.vue';
export default defineComponent({
@@ -89,12 +89,12 @@ export default defineComponent({
if (store.eventTree.findEventById(eventid)) {
return;
}
selectedChangeEvent.value?.events.push({
eventId: eventid,
label: field.name,
parentId: selectedChangeEvent.value.eventId,
header: 'DELETABLE'
});
selectedChangeEvent.value?.events.push(new kintoneEvent(
field.name,
eventid,
selectedChangeEvent.value.eventId,
'DELETABLE'
));
tree.value?.expanded?.push(selectedChangeEvent.value.eventId);
tree.value?.expandAll();
}

12
frontend/src/components/right/EventSetter.vue
View File

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

8
frontend/src/components/right/PropertyPanel.vue
View File

@@ -30,8 +30,8 @@
</div>
</template>
<script lang="ts">
import { ref,defineComponent, PropType ,watchEffect} from 'vue'
import PropertyList from 'components/right/PropertyList.vue';
import { ref,defineComponent, PropType ,watchEffect} from 'vue'
import PropertyList from 'components/right/PropertyList.vue';
import { IActionNode, IActionProperty } from 'src/types/ActionTypes';
export default defineComponent({
name: 'PropertyPanel',
@@ -53,7 +53,7 @@ import { IActionNode, IActionProperty } from 'src/types/ActionTypes';
'saveActionProps'
],
setup(props,{emit}) {
const showPanel =ref(props.drawerRight);
const showPanel =ref(props.drawerRight);
const cloneProps = (actionProps:IActionProperty[]):IActionProperty[]|null=>{
if(!actionProps){
@@ -81,7 +81,7 @@ import { IActionNode, IActionProperty } from 'src/types/ActionTypes';
const save = async () =>{
showPanel.value=false;
emit('saveActionProps', actionProps.value);
emit('update:drawerRight',false )
emit('update:drawerRight',false );
}
return {

15
frontend/src/pages/FlowChart.vue
View File

@@ -213,6 +213,11 @@ const onDeploy = async () => {
const onSaveActionProps=(props:IActionProperty[])=>{
if(store.activeNode){
store.activeNode.actionProps=props;
$q.notify({
type: 'positive',
caption: "通知",
message: `${store.activeNode?.subTitle}の属性設定を更新しました。`
});
}
};
@@ -261,13 +266,17 @@ const onSaveAllFlow= async ()=>{
}
saveLoading.value = true;
for(const flow of targetFlows ){
const isNew = flow.id === '';
if(isNew && flow.actionNodes.length===1){
continue;
}
await store.saveFlow(flow);
$q.notify({
}
$q.notify({
type: 'positive',
caption: "通知",
message: `${flow.getRoot()?.subTitle}のフロー設定を保存しました。`
message: `すべてのフロー設定を保存しました。`
});
}
saveLoading.value = false;
}catch (error) {
console.error(error);

19
frontend/src/stores/flowEditor.ts
View File

@@ -1,6 +1,6 @@
import { defineStore } from 'pinia';
import { AppInfo, IActionFlow, IActionNode } from 'src/types/ActionTypes';
import { IKintoneEvent, KintoneEventManager } from 'src/types/KintoneEvents';
import { IKintoneEvent, KintoneEventManager, kintoneEvent } from 'src/types/KintoneEvents';
import { FlowCtrl } from '../control/flowctrl';
export interface FlowEditorState {
@@ -101,6 +101,12 @@ export const useFlowEditorStore = defineStore('flowEditor', {
const eventNode=this.eventTree.findEventById(eventid||'');
if(eventNode){
expandScreens.push(eventNode.parentId);
if(eventNode.header==='DELETABLE'){
const groupEvent = this.eventTree.findEventById(eventNode.parentId);
if(groupEvent){
expandScreens.push(groupEvent.parentId);
}
}
}
});
// const expandName =actionFlows[0].getRoot()?.title;
@@ -109,7 +115,7 @@ export const useFlowEditorStore = defineStore('flowEditor', {
/**
* フローをDBに保存及び更新する
*/
async saveFlow(flow: IActionFlow) {
async saveFlow(flow: IActionFlow):Promise<boolean> {
const root = flow.getRoot();
const isNew = flow.id === '';
const jsonData = {
@@ -123,7 +129,14 @@ export const useFlowEditorStore = defineStore('flowEditor', {
if (isNew) {
return await flowCtrl.SaveFlow(jsonData);
} else {
return await flowCtrl.UpdateFlow(jsonData);
if(flow.actionNodes.length>1){
return await flowCtrl.UpdateFlow(jsonData);
}else{
const eventId = flow.getRoot()?.name||'';
const eventNode = eventTree.findEventById(eventId) as kintoneEvent;
eventNode.flowData=undefined;
return await flowCtrl.DeleteFlow(flow.id);
}
}
},

13
frontend/src/types/ActionTypes.ts
View File

@@ -292,6 +292,11 @@ export class ActionFlow implements IActionFlow {
if (!targetNode) {
return false;
}
if(targetNode.isRoot){
this.actionNodes=[targetNode];
targetNode.nextNodeIds.clear();
return;
}
if (targetNode.nextNodeIds.size == 0) {
return false;
}
@@ -312,9 +317,9 @@ export class ActionFlow implements IActionFlow {
if (!targetNode) {
return
}
if (targetNode.nextNodeIds.size == 0) {
return
}
// if (targetNode.nextNodeIds.size == 0) {
// return
// }
for (const [, id] of targetNode.nextNodeIds) {
this.removeAll(id);
}
@@ -460,7 +465,7 @@ export class ActionFlow implements IActionFlow {
if(prevNode.varName.modelValue ==='object'){
console.log(prevNode);
}
varNames.unshift({

22
frontend/src/types/KintoneEvents.ts
View File

@@ -24,11 +24,12 @@ export class kintoneEvent implements IKintoneEvent {
}
flowData?: IActionFlow | undefined;
label: string;
header = 'EVENT';
constructor(label: string, eventId: string, parentId: string) {
header :string;
constructor(label: string, eventId: string, parentId: string,header?:string) {
this.eventId = eventId;
this.label = label;
this.parentId = parentId;
this.header=header?header:'EVENT';
}
}
@@ -97,16 +98,9 @@ export class KintoneEventManager {
const eventNode = this.findEventById(groupId);
if (eventNode && (eventNode.header === 'EVENTGROUP' || eventNode.header === 'CHANGE')) {
const groupEvent = eventNode as kintoneEventGroup;
const newEvent = {
label: flow.getRoot()?.subTitle || '',
eventId: eventId,
parentId: groupId,
header: 'DELETABLE',
hasFlow: true,
flowData: flow,
};
const label=flow.getRoot()?.subTitle || '';
const newEvent = new kintoneEvent(label,eventId,groupId,'DELETABLE');
newEvent.flowData=flow;
groupEvent.events.push(newEvent);
}
}
@@ -149,8 +143,8 @@ export class KintoneEventManager {
}
}else if (event.header === 'EVENTGROUP' || event.header === 'CHANGE') {
const eventGroup = event as IKintoneEventGroup;
const targetEvent = eventGroup.events.find((ev) => {
if (ev.header === "EVENT") {
eventGroup.events.forEach((ev) => {
if (ev.header === "EVENT" || ev.header === "DELETABLE") {
const eventNode = ev as IKintoneEvent;
if(eventNode.flowData!==undefined){
flows.push(eventNode.flowData);