diff --git a/vue-project/my-kintone-plugin/src/components/Config.vue b/vue-project/my-kintone-plugin/src/components/Config.vue index 29d5d37..166f8fc 100644 --- a/vue-project/my-kintone-plugin/src/components/Config.vue +++ b/vue-project/my-kintone-plugin/src/components/Config.vue @@ -28,7 +28,7 @@ const props = defineProps<{ pluginId: string }>(); const loading = ref(false); const data: SavedData = reactive({ buttonName: '', - joinTables: [] as JoinTable[], + joinTables: [createEmptyJoinTable()], }); const cachedData: CachedData = reactive({ @@ -43,15 +43,16 @@ const mainArea = shallowRef(null); const spinner = shallowRef(null); onMounted(async () => { - spinner.value?.close(); // 修复不自动挂载到节点的 bug - const savedData = kintone.plugin.app.getConfig(props.pluginId); - // TODO - data.buttonName = savedData?.buttonName || '集約'; - data.joinTables = savedData?.joinTables ? JSON.parse(savedData.joinTables) : [createEmptyJoinTable()]; nextTick(async () => { + spinner.value?.close(); // fix bug: kuc-spinner will not auto amount to target HTML element when init loading + const savedData = kintone.plugin.app.getConfig(props.pluginId); loading.value = true; cachedData.apps = await loadApps(); cachedData.currentAppFields = await loadAppFieldsAndLayout(); + if (savedData?.joinTables) { + data.joinTables = JSON.parse(savedData.joinTables); //TODO JSON; + } + data.buttonName = savedData?.buttonName || '集約'; loading.value = false; }); }); diff --git a/vue-project/my-kintone-plugin/src/components/basic/PluginTableArea.vue b/vue-project/my-kintone-plugin/src/components/basic/PluginTableArea.vue index fc2fbd2..ee9a072 100644 --- a/vue-project/my-kintone-plugin/src/components/basic/PluginTableArea.vue +++ b/vue-project/my-kintone-plugin/src/components/basic/PluginTableArea.vue @@ -2,7 +2,7 @@
- + @@ -48,10 +49,12 @@ import { computed, inject, provide, reactive, ref, watch } from 'vue'; const savedData = inject('savedData') as SavedData; const cachedData = inject('cachedData') as CachedData; -const props = defineProps<{ table: JoinTable }>(); +const props = defineProps<{ + table: JoinTable; +}>(); const apps = computed(() => cachedData.apps); const tableOptions = ref([EMPTY_OPTION]); -const loading = ref(true); +const loading = ref(false); const selectedAppData: CachedSelectedAppData = reactive({ appFields: { fields: {}, layout: [] } as FieldsInfo, @@ -60,14 +63,35 @@ const selectedAppData: CachedSelectedAppData = reactive({ }); provide('selectedAppData', selectedAppData); -const selectApp = async (e: KucEvent) => { - loading.value = true; - const fields = await loadAppFieldsAndLayout(e.detail.value); - tableOptions.value = getTableFieldsDropdownItems(fields, types.SUBTABLE); - resetTable(props.table); - selectedAppData.appFields = fields; - loading.value = false; -}; +const componentKey = ref(0); +// fix-bug: force select saved data when load config +watch( + () => tableOptions.value, + () => { + if (!props.table.table) return; + debugger + componentKey.value += 1; + }, + { + once: true, + }, +); + +watch( + () => props.table.app, + async (newVal, oldVal) => { + if (!newVal) { + return; + } + loading.value = true; + const fields = await loadAppFieldsAndLayout(newVal); + tableOptions.value = getTableFieldsDropdownItems(fields, types.SUBTABLE); + selectedAppData.appFields = fields; + !!oldVal && resetTable(props.table); + loading.value = false; + }, + { immediate: true }, +); const selectTable = (e: KucEvent) => { resetConditions(props.table); diff --git a/vue-project/my-kintone-plugin/src/components/basic/PluginTableConditionRow.vue b/vue-project/my-kintone-plugin/src/components/basic/PluginTableConditionRow.vue index b9e625c..ba53863 100644 --- a/vue-project/my-kintone-plugin/src/components/basic/PluginTableConditionRow.vue +++ b/vue-project/my-kintone-plugin/src/components/basic/PluginTableConditionRow.vue @@ -4,7 +4,7 @@