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

Merge branch 'master' of https://dev.azure.com/alicorn-dev/deta-fetch-plugin/_git/deta-fetch-plugin

Browse Source
This commit is contained in:
馬
2025-01-25 17:48:18 +09:00
parent 36b90ed45b 7fb31b5c53
commit f3bb622fd5
17 changed files with 374 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
vue-project/my-kintone-plugin/src/components/Config.vue
View File

@@ -18,7 +18,8 @@
<kuc-spinner :container="mainArea" ref="spinner"></kuc-spinner>
</template>
<script setup lang="ts">
import { createEmptyJoinTable, loadApps, loadAppFieldsAndLayout, EMPTY_OPTION, getEmptyOnCondition } from '@/js/helper';
import { createEmptyJoinTable, loadApps, loadAppFieldsAndLayout, EMPTY_OPTION, getEmptyOnCondition, getMeta } from '@/js/helper';
import { isType, type OneOf, type Properties } from '@/js/kintone-rest-api-client';
import type { CachedData, FieldsInfo, JoinTable, SavedData } from '@/types/model';
import type { Spinner } from 'kintone-ui-component';
@@ -49,8 +50,8 @@ onMounted(async () => {
loading.value = true;
cachedData.apps = await loadApps();
cachedData.currentAppFields = await loadAppFieldsAndLayout();
if (savedData?.joinTables) {
data.joinTables = JSON.parse(savedData.joinTables); //TODO JSON;
if (savedData?.joinTablesForConfig) {
data.joinTables = JSON.parse(savedData.joinTablesForConfig);
}
data.buttonName = savedData?.buttonName || '集約';
loading.value = false;
@@ -71,9 +72,38 @@ watch(
);
function save() {
const currentAppMeta = cachedData.currentAppFields.fields;
const convertJoinTables = JSON.parse(JSON.stringify(data.joinTables)) as JoinTable<OneOf | string>[];
convertJoinTables.forEach((item) => {
const meta = getMeta(item.meta as Properties, item.table);
// Process onConditions
item.onConditions.forEach((condition) => {
condition.leftField = meta[condition.leftField as string] || condition.leftField;
condition.rightField = currentAppMeta[condition.rightField as string] || condition.rightField;
});
// Process fieldsMapping
item.fieldsMapping.forEach((mapping) => {
mapping.leftField = meta[mapping.leftField as string] || mapping.leftField;
mapping.rightField = currentAppMeta[mapping.rightField as string] || mapping.rightField;
});
// Process whereConditions
item.whereConditions.forEach((condition) => {
condition.field = meta[condition.field as string] || condition.field;
});
delete item.meta;
});
data.joinTables.forEach((item) => {
delete item.meta;
});
kintone.plugin.app.setConfig({
buttonName: data.buttonName,
joinTables: JSON.stringify(data.joinTables || []),
joinTables: JSON.stringify(convertJoinTables),
joinTablesForConfig: JSON.stringify(data.joinTables || []),
});
}

6
vue-project/my-kintone-plugin/src/components/basic/PluginDropdown.vue
View File

@@ -7,7 +7,7 @@
<script setup lang="ts">
import type { KucEvent } from '@/types/my-kintone';
import type { DropdownItem } from 'kintone-ui-component';
import type { ComboboxChangeEventDetail, DropdownItem } from 'kintone-ui-component';
import { defineProps, defineEmits } from 'vue';
const props = defineProps<{
@@ -21,7 +21,7 @@ const emit = defineEmits<{
(e: 'update:modelValue', value: string): void;
}>();
const updateValue = (event: KucEvent) => {
emit('update:modelValue', event.detail.value);
const updateValue = ({ detail }: KucEvent<ComboboxChangeEventDetail>) => {
emit('update:modelValue', detail.value || '');
};
</script>

5
vue-project/my-kintone-plugin/src/components/basic/PluginInput.vue
View File

@@ -7,6 +7,7 @@
<script setup lang="ts">
import type { KucEvent } from '@/types/my-kintone';
import type { TextInputEventDetail } from 'kintone-ui-component';
import { defineProps, defineEmits } from 'vue';
const props = defineProps<{
@@ -19,7 +20,7 @@ const emit = defineEmits<{
(e: 'update:modelValue', value: string): void;
}>();
const updateValue = (event: KucEvent) => {
emit('update:modelValue', event.detail.value);
const updateValue = ({ detail }: KucEvent<TextInputEventDetail>) => {
emit('update:modelValue', detail.value || '');
};
</script>

9
vue-project/my-kintone-plugin/src/components/basic/PluginTableActionIconGroup.vue
View File

@@ -14,7 +14,7 @@ const props = withDefaults(
defineProps<{
canAdd?: boolean;
canDelete?: boolean;
tableId: number;
tableId: string;
}>(),
{
canAdd: true,
@@ -25,7 +25,12 @@ const props = withDefaults(
const savedData = inject<SavedData>('savedData') as SavedData;
const onClick = (type: 'add' | 'remove') => {
if (type === 'add') {
savedData.joinTables.push(createEmptyJoinTable());
const currentIndex = savedData.joinTables.findIndex((t) => t.id === props.tableId);
if (currentIndex !== -1) {
savedData.joinTables.splice(currentIndex + 1, 0, createEmptyJoinTable());
} else {
savedData.joinTables.push(createEmptyJoinTable());
}
} else if (savedData.joinTables.length > 1) {
savedData.joinTables = savedData.joinTables.filter((t) => t.id !== props.tableId);
}

11
vue-project/my-kintone-plugin/src/components/basic/PluginTableArea.vue
View File

@@ -16,15 +16,15 @@
</plugin-row>
<plugin-row class="flex-row" v-if="isJoinConditionShown(table)">
<plugin-label label="連結条件" />
<plugin-table-connect-row connector="=" v-model="table.onConditions" />
<plugin-table-connect-row connector="=" type="connect" :modelValue="table.onConditions" />
</plugin-row>
<plugin-row class="flex-row">
<plugin-label label="取得フィールド" />
<plugin-table-connect-row connector="→" v-model="table.fieldsMapping" />
<plugin-table-connect-row connector="→" type="mapping" :modelValue="table.fieldsMapping" />
</plugin-row>
<plugin-row class="flex-row">
<plugin-label label="絞込条件" />
<plugin-table-condition-row v-model="table.whereConditions" />
<plugin-table-condition-row :modelValue="table.whereConditions"/>
</plugin-row>
</div>
<div class="table-action-area">
@@ -43,7 +43,6 @@ import {
} from '@/js/helper';
import { types } from '@/js/kintone-rest-api-client';
import type { CachedData, CachedSelectedAppData, FieldsInfo, JoinTable, SavedData } from '@/types/model';
import type { KucEvent } from '@/types/my-kintone';
import { computed, inject, provide, reactive, ref, watch } from 'vue';
const savedData = inject<SavedData>('savedData') as SavedData;
@@ -69,7 +68,6 @@ watch(
() => tableOptions.value,
() => {
if (!props.table.table) return;
debugger
componentKey.value += 1;
},
{
@@ -87,13 +85,14 @@ watch(
const fields = await loadAppFieldsAndLayout(newVal);
tableOptions.value = getTableFieldsDropdownItems(fields, types.SUBTABLE);
selectedAppData.appFields = fields;
props.table.meta = fields.fields;
!!oldVal && resetTable(props.table);
loading.value = false;
},
{ immediate: true },
);
const selectTable = (e: KucEvent) => {
const selectTable = () => {
resetConditions(props.table);
};

65
vue-project/my-kintone-plugin/src/components/basic/PluginTableConditionRow.vue
View File

@@ -4,10 +4,9 @@
<script setup lang="ts">
import type { CachedData, CachedSelectedAppData, SavedData, WhereCondition } from '@/types/model';
import { defineProps, inject, computed, render, h } from 'vue';
import { defineProps, inject, computed, render, h, reactive } from 'vue';
import TableCombobox from './TableCombobox.vue';
import { getFieldsDropdownItems } from '@/js/helper';
import type { ConditionValue } from '@/js/conditions';
import { generateId, getFieldsDropdownItems, search } from '@/js/helper';
import TableCondition from './conditions/TableCondition.vue';
import TableConditionValue from './conditions/TableConditionValue.vue';
@@ -20,23 +19,34 @@ const cachedData = inject<CachedData>('cachedData') as CachedData;
const selectedAppData = inject<CachedSelectedAppData>('selectedAppData') as CachedSelectedAppData;
const table = computed(() => selectedAppData.table.table);
const columns = [
const columns = reactive([
{
title: '取得元アプリのフィールド',
field: 'field',
render: (cellData: string, rowData: any, rowIndex: number) => {
render: (cellData: string, rowData: WhereCondition) => {
if (!rowData.id) {
rowData.id = generateId();
}
const container = document.createElement('div');
const vnode = h(TableCombobox, {
items: computed(() => getFieldsDropdownItems(selectedAppData.appFields, {
subTableCode: table.value,
defaultLabel: 'すべてのレコード',
})),
modelValue: props.modelValue[rowIndex].field,
items: computed(() =>
getFieldsDropdownItems(selectedAppData.appFields, {
subTableCode: table.value,
baseFilter: undefined,
defaultLabel: 'すべてのレコード',
}),
),
modelValue: computed(() => (search(props.modelValue, rowData.id) as WhereCondition)?.field || ''),
selectedAppData,
'onUpdate:modelValue': (newValue: string) => {
props.modelValue[rowIndex].field = newValue;
props.modelValue[rowIndex].condition = '';
props.modelValue[rowIndex].data = '';
dataList: props.modelValue,
id: rowData.id,
'onUpdate:modelValue': (data) => {
const obj = (data.obj as WhereCondition);
if (obj) {
obj.field = data.value;
obj.condition = '',
obj.data = '';
}
},
});
render(vnode, container);
@@ -46,16 +56,18 @@ const columns = [
{
title: '',
field: 'condition',
render: (cellData: string, rowData: any, rowIndex: number) => {
render: (cellData: string, rowData: WhereCondition) => {
const container = document.createElement('div');
const vnode = h(TableCondition, {
modelValue: props.modelValue[rowIndex].condition,
index: rowIndex,
modelValue: (search(props.modelValue, rowData.id) as WhereCondition)?.condition || '',
selectedAppData,
id: rowData.id,
whereConditions: props.modelValue,
'onUpdate:modelValue': (newValue: string) => {
props.modelValue[rowIndex].condition = newValue as ConditionValue;
props.modelValue[rowIndex].data = '';
'onUpdate:modelValue': ({obj, value}) => {
if (obj) {
obj.condition = value;
obj.data = '';
}
},
});
render(vnode, container);
@@ -65,20 +77,21 @@ const columns = [
{
title: '',
field: 'data',
render: (cellData: string, rowData: any, rowIndex: number) => {
render: (cellData: string, rowData: WhereCondition) => {
const container = document.createElement('div');
const vnode = h(TableConditionValue, {
modelValue: props.modelValue[rowIndex].data,
index: rowIndex,
modelValue: (search(props.modelValue, rowData.id) as WhereCondition)?.data || '',
selectedAppData,
id: rowData.id,
whereConditions: props.modelValue,
'onUpdate:modelValue': (newValue: string) => {
props.modelValue[rowIndex].data = newValue;
'onUpdate:modelValue': ({obj, value}) => {
obj && (obj.data = value);
},
});
render(vnode, container);
return container;
},
},
];
]);
</script>

82
vue-project/my-kintone-plugin/src/components/basic/PluginTableConnectRow.vue
View File

@@ -3,32 +3,66 @@
</template>
<script setup lang="ts">
import type { CachedData, CachedSelectedAppData, FieldsJoinMapping } from '@/types/model';
import { defineProps, inject, computed, reactive, render, h } from 'vue';
import { getFieldsDropdownItems } from '@/js/helper';
import type { CachedData, CachedSelectedAppData, FieldsJoinMapping, WhereCondition } from '@/types/model';
import { defineProps, inject, computed, reactive, render, h, watch } from 'vue';
import { generateId, getFieldObj, getFieldsDropdownItems, isLeftCalcJoinType, search } from '@/js/helper';
import TableCombobox from './TableCombobox.vue';
import { getLeftAvailableJoinType, getRightAvailableJoinType, isForceDisable } from '@/js/join';
import { isType, type FieldType, type OneOf } from '@/js/kintone-rest-api-client';
const props = defineProps<{
connector: string;
modelValue: FieldsJoinMapping[];
type: 'connect' | 'mapping';
}>();
const cachedData = inject<CachedData>('cachedData') as CachedData;
const selectedAppData = inject<CachedSelectedAppData>('selectedAppData') as CachedSelectedAppData;
const table = computed(() => selectedAppData.table.table);
const filterFunc = {
connect: {
left: (right?: OneOf | '') => getLeftAvailableJoinType(right),
right: (left?: OneOf | '') => {
const filterType = getRightAvailableJoinType(left);
if (left && isType.CALC(left) && isLeftCalcJoinType(filterType)) {
return filterType[left.format];
}
return filterType as FieldType[];
},
},
mapping: {
left: () => [] as FieldType[],
right: () => [] as FieldType[],
},
};
const columns = reactive([
{
title: '取得元アプリのフィールド',
field: 'leftField',
render: (cellData: string, rowData: any, rowIndex: number) => {
render: (cellData: string, rowData: WhereCondition) => {
if (!rowData.id) {
rowData.id = generateId();
}
const container = document.createElement('div');
const vnode = h(TableCombobox, {
items: computed(() => getFieldsDropdownItems(selectedAppData.appFields, { subTableCode: table.value, filterType: undefined })),
modelValue: props.modelValue[rowIndex].leftField,
items: computed(() =>
getFieldsDropdownItems(selectedAppData.appFields, {
subTableCode: table.value,
baseFilter: filterFunc[props.type].left() as FieldType[],
filterType: filterFunc[props.type].left(getField('rightField', rowData.id)),
defaultDisableCallback: isForceDisable,
}),
),
modelValue: computed(() => (search(props.modelValue, rowData.id) as FieldsJoinMapping)?.leftField || ''),
selectedAppData,
'onUpdate:modelValue': (newValue: string) => {
props.modelValue[rowIndex].leftField = newValue;
dataList: props.modelValue,
id: rowData.id,
'onUpdate:modelValue': (data) => {
if (data.obj) {
(data.obj as FieldsJoinMapping).leftField = data.value;
}
},
});
render(vnode, container);
@@ -45,14 +79,28 @@ const columns = reactive([
{
title: 'このアプリのフィールド',
field: 'rightField',
render: (cellData: string, rowData: any, rowIndex: number) => {
render: (cellData: string, rowData: WhereCondition) => {
if (!rowData.id) {
rowData.id = generateId();
}
const container = document.createElement('div');
const vnode = h(TableCombobox, {
items: computed(()=>getFieldsDropdownItems(cachedData.currentAppFields, { filterType: undefined })),
modelValue: props.modelValue[rowIndex].rightField,
items: computed(() =>
getFieldsDropdownItems(cachedData.currentAppFields, {
subTableCode: '', // subtable not allowed for current app
baseFilter: filterFunc[props.type].right() as FieldType[],
filterType: filterFunc[props.type].right(getField('leftField', rowData.id)),
defaultDisableCallback: isForceDisable,
}),
),
modelValue: computed(() => (search(props.modelValue, rowData.id) as FieldsJoinMapping)?.rightField || ''),
selectedAppData,
'onUpdate:modelValue': (newValue: string) => {
props.modelValue[rowIndex].rightField = newValue;
dataList: props.modelValue,
id: rowData.id,
'onUpdate:modelValue': (data) => {
if (data.obj) {
(data.obj as FieldsJoinMapping).rightField = data.value;
}
},
});
render(vnode, container);
@@ -60,4 +108,12 @@ const columns = reactive([
},
},
]);
function getField(key: 'leftField'|'rightField', id: string) {
const dataRow = search(props.modelValue, id) as FieldsJoinMapping | undefined;
const fieldCode = (dataRow ? (dataRow[key] || '') : '');
const targetFieldMap = key === 'leftField' ? selectedAppData.appFields : cachedData.currentAppFields;
const targetTable = key === 'leftField' ? table.value : '';
return getFieldObj(fieldCode, targetFieldMap, targetTable);
}
</script>

22
vue-project/my-kintone-plugin/src/components/basic/TableCombobox.vue
View File

@@ -1,7 +1,7 @@
<template>
<kuc-combobox
:items="items.value"
:value="modelValue"
:value="modelValue.value"
@change="updateValue"
:key="componentKey"
:disabled="selectedAppData.loading == undefined ? false : selectedAppData.loading"
@@ -9,14 +9,17 @@
</template>
<script setup lang="ts">
import { search } from '@/js/helper';
import type { CachedSelectedAppData } from '@/types/model';
import type { KucEvent } from '@/types/my-kintone';
import type { DropdownItem } from 'kintone-ui-component';
import type { ComboboxChangeEventDetail, DropdownItem } from 'kintone-ui-component';
import { defineProps, defineEmits, type Ref, watch, ref } from 'vue';
const props = defineProps<{
items: Ref<DropdownItem[]>;
modelValue: string;
modelValue: Ref<string>;
dataList: any[];
id: string;
selectedAppData: CachedSelectedAppData;
}>();
@@ -25,7 +28,7 @@ const componentKey = ref(0);
watch(
() => props.items.value,
() => {
if (!props.modelValue) return;
if (!props.modelValue.value) return;
componentKey.value += 1;
},
{
@@ -33,11 +36,16 @@ watch(
},
);
type EmitData = {
obj?: any;
value: string;
};
const emit = defineEmits<{
(e: 'update:modelValue', value: string): void;
(e: 'update:modelValue', data: EmitData): void;
}>();
const updateValue = (event: KucEvent) => {
emit('update:modelValue', event.detail.value);
const updateValue = ({ detail }: KucEvent<ComboboxChangeEventDetail>) => {
emit('update:modelValue', { obj: search(props.dataList, props.id), value: detail.value || '' });
};
</script>

23
vue-project/my-kintone-plugin/src/components/basic/conditions/TableCondition.vue
View File

@@ -9,27 +9,34 @@
</template>
<script setup lang="ts">
import { getAvailableCondition } from '@/js/conditions';
import { getAvailableCondition, type ConditionValue } from '@/js/conditions';
import { search } from '@/js/helper';
import type { CachedSelectedAppData, WhereCondition } from '@/types/model';
import type { KucEvent } from '@/types/my-kintone';
import type { ComboboxChangeEventDetail } from 'kintone-ui-component';
import { defineProps, defineEmits, computed } from 'vue';
const props = defineProps<{
modelValue: string;
selectedAppData: CachedSelectedAppData;
whereConditions: WhereCondition[];
index: number;
id: string;
}>();
const items = computed(() =>
getAvailableCondition(props.whereConditions[props.index]?.field, props.selectedAppData.appFields),
);
const whereCondition = computed(() => search(props.whereConditions, props.id) as WhereCondition | undefined);
const items = computed(() => getAvailableCondition(whereCondition.value?.field || '', props.selectedAppData.appFields, props.selectedAppData.table.table));
type EmitData = {
obj?: WhereCondition;
value: ConditionValue;
};
const emit = defineEmits<{
(e: 'update:modelValue', value: string): void;
(e: 'update:modelValue', data: EmitData): void;
}>();
const updateValue = (event: KucEvent) => {
emit('update:modelValue', event.detail.value);
const updateValue = ({ detail }: KucEvent<ComboboxChangeEventDetail>) => {
emit('update:modelValue', { obj: whereCondition.value, value: detail.value as ConditionValue });
};
</script>

19
vue-project/my-kintone-plugin/src/components/basic/conditions/TableConditionValue.vue
View File

@@ -15,24 +15,33 @@
<script setup lang="ts">
import { getComponent } from '@/js/conditions';
import { search } from '@/js/helper';
import type { CachedSelectedAppData, WhereCondition } from '@/types/model';
import type { KucEvent } from '@/types/my-kintone';
import type { ComboboxChangeEventDetail, TextInputEventDetail } from 'kintone-ui-component';
import { defineProps, defineEmits, computed } from 'vue';
const props = defineProps<{
modelValue: string;
selectedAppData: CachedSelectedAppData;
whereConditions: WhereCondition[];
index: number;
id: string;
}>();
const type = computed(() => getComponent(props.whereConditions[props.index]?.condition));
const whereCondition = computed(() => search(props.whereConditions, props.id) as WhereCondition | undefined);
const type = computed(() => getComponent(whereCondition.value?.condition || ''));
type EmitData = {
obj?: WhereCondition;
value: string;
};
const emit = defineEmits<{
(e: 'update:modelValue', value: string): void;
(e: 'update:modelValue', data: EmitData): void;
}>();
const updateValue = (event: KucEvent) => {
emit('update:modelValue', event.detail.value);
const updateValue = (event: KucEvent<ComboboxChangeEventDetail | TextInputEventDetail>) => {
emit('update:modelValue', { obj: whereCondition.value, value: event.detail.value || '' });
};
</script>

9
vue-project/my-kintone-plugin/src/js/conditions.ts
View File

@@ -1,5 +1,6 @@
import type { FieldsInfo } from '@/types/model';
import type { FieldType } from './kintone-rest-api-client';
import { getFieldObj } from './helper';
// conditionValue = '' | 'eq' | 'ne'
// conditionItem = { value: 'eq', label: '=（等しい）', type: 'input', func: (a: string, b: string) => a === b }
@@ -39,9 +40,11 @@ const fieldConditions: FieldConditions = {
} as const;
// fieldCode -> conditionList: ConditionItem[]
export const getAvailableCondition = (fieldCode: string, { fields }: FieldsInfo) => {
if (!fieldCode || !fields) return;
const conditions = fieldConditions[fields[fieldCode]?.type] || [];
export const getAvailableCondition = (fieldCode: string, fieldsInfo: FieldsInfo, subTableCode: string | '') => {
if (!fieldCode || !fieldsInfo.fields) return;
const fieldObj = getFieldObj(fieldCode, fieldsInfo, subTableCode);
if (!fieldObj) return;
const conditions = fieldConditions[fieldObj.type] || [];
return conditions.map((condition) => conditionMap[condition]);
};

105
vue-project/my-kintone-plugin/src/js/helper.ts
View File

@@ -1,17 +1,37 @@
import type { FieldsInfo, JoinTable, WhereCondition } from '@/types/model';
import { client, isType, type FieldType, type App, type Layout } from './kintone-rest-api-client';
import type { DropdownItem } from 'kintone-ui-component';
import type { FieldsInfo, FieldsJoinMapping, JoinTable, WhereCondition } from '@/types/model';
import {
client,
isType,
type FieldType,
type App,
type Layout,
type OneOf,
type Properties,
} from './kintone-rest-api-client';
import type { ComboboxItem, DropdownItem } from 'kintone-ui-component';
import { isForceDisable, type LeftCalcJoinType, type RightCalcJoinType } from './join';
export const EMPTY_OPTION = {
value: '',
label: '--------',
} as DropdownItem;
export const getEmptyWhereCondition = () => ({ field: '', condition: '', data: '' }) as WhereCondition;
export const getEmptyOnCondition = () => ({ leftField: '', rightField: '' });
export const getEmptyFieldsMapping = () => ({ leftField: '', rightField: '' });
export function generateId(): string {
const timestamp = new Date().getTime().toString(36);
const randomNum = Math.random().toString(36).substring(2, 11);
return `${timestamp}-${randomNum}`;
}
export function createEmptyJoinTable(id = Number(new Date())) {
export function search(list: Array<WhereCondition | FieldsJoinMapping>, id: string) {
return list.find((item) => item.id === id);
}
export const getEmptyWhereCondition = () =>
({ field: '', condition: '', data: '', id: generateId() }) as WhereCondition;
export const getEmptyOnCondition = () => ({ leftField: '', rightField: '', id: generateId() }) as FieldsJoinMapping;
export const getEmptyFieldsMapping = () => ({ leftField: '', rightField: '', id: generateId() }) as FieldsJoinMapping;
export function createEmptyJoinTable(id = generateId()) {
return resetTable({ id, app: '' } as JoinTable);
}
@@ -49,25 +69,37 @@ export const loadAppFieldsAndLayout = async (appId: string | number = kintone.ap
} as FieldsInfo;
};
type Param = { subTableCode?: string; filterType?: FieldType; defaultLabel?: string };
type FilterType = Array<FieldType | RightCalcJoinType>;
type Param = {
subTableCode: string | undefined;
filterType?: FilterType;
baseFilter: FieldType[] | undefined;
defaultLabel?: string;
defaultDisableCallback?: (field: OneOf) => boolean;
};
export const getFieldsDropdownItems = (
{ fields, layout }: FieldsInfo,
{ subTableCode, filterType, defaultLabel }: Param = {},
{ subTableCode, filterType, baseFilter, defaultLabel, defaultDisableCallback }: Param,
) => {
// get used field codes
let fieldOrder: string[];
let fieldMap = fields;
if (subTableCode) {
const subTableFields = layout.find((each) => each.type === 'SUBTABLE' && each.code === subTableCode) as any;
fieldOrder = subTableFields?.fields.map((field: { code: string }) => field.code) || [];
fieldOrder =
subTableFields?.fields.map((field: OneOf) => {
if (!baseFilter) return field.code;
return baseFilter.find((t) => t === field.type) ? field.code : '';
}) || [];
const subTableFieldMap = fieldMap[subTableCode] as { fields: Record<string, any> } | undefined;
fieldMap = subTableFieldMap?.fields || {};
} else {
fieldOrder = extractNoSubTableFields(layout);
fieldOrder = extractNoSubTableFields(layout, baseFilter);
}
// create labels
const labels = [
const labels: ComboboxItem[] = [
{
value: EMPTY_OPTION.value,
label: defaultLabel || EMPTY_OPTION.label,
@@ -75,15 +107,34 @@ export const getFieldsDropdownItems = (
];
return fieldOrder.reduce((acc, fieldCode) => {
const field = fieldMap[fieldCode];
if (!fieldCode || (filterType && !isType[filterType](field))) return acc;
if (!fieldCode) return acc;
acc.push({
value: fieldCode,
label: field.label + '（FC: ' + fieldCode + '）',
disabled: (defaultDisableCallback && defaultDisableCallback(field)) || (filterType && !checkFilterType(field, filterType)),
});
return acc;
}, labels);
};
const checkFilterType = (field: OneOf, filterType: FilterType) => {
if (!filterType.length) return true; // [] means no filter
return !!filterType.find((type) => {
if (isRightCalcJoinType(type)) {
return isType.CALC(field) && type.format.find((e) => e === field.format);
}
return isType[type](field);
});
};
export function isLeftCalcJoinType(obj: FilterType | LeftCalcJoinType): obj is LeftCalcJoinType {
return !Array.isArray(obj);
}
function isRightCalcJoinType(obj: FieldType | RightCalcJoinType): obj is RightCalcJoinType {
return typeof obj === 'object' && obj.type === 'CALC';
}
export const getTableFieldsDropdownItems = ({ fields }: FieldsInfo, filterType?: FieldType) => {
return Object.keys(fields).reduce(
(acc, fieldCode) => {
@@ -99,19 +150,35 @@ export const getTableFieldsDropdownItems = ({ fields }: FieldsInfo, filterType?:
);
};
const extractNoSubTableFields = (layout: Layout) => {
const extractNoSubTableFields = (layout: Layout, baseFilter: FieldType[] | undefined) => {
return layout.reduce((acc, each) => {
if (each.type === 'SUBTABLE') {
return acc;
} else if (each.type === 'ROW') {
acc.push(...each.fields.map((field: any) => field.code));
acc.push(...each.fields.map((field: any) => {
if (!baseFilter) return field.code;
return baseFilter.find((t) => t === field.type) ? field?.code || '' : ''
}));
} else if (each.type === 'GROUP') {
acc.push(...extractNoSubTableFields(each.layout));
acc.push(...extractNoSubTableFields(each.layout, baseFilter));
}
return acc;
}, [] as string[]);
};
// if (isType.SUBTABLE(field)) {
// console.log(field.fields);
// }
export function getFieldObj(fieldCode: string, { fields }: FieldsInfo, subTableCode?: string) {
const meta = getMeta(fields, subTableCode);
return meta[fieldCode];
}
export function getMeta(fields: Properties, subTableCode?: string) {
if (!fields || !subTableCode) {
return fields;
}
let meta = fields;
const table = meta[subTableCode];
if (isType.SUBTABLE(table)) {
meta = table.fields;
}
return meta;
}

59
vue-project/my-kintone-plugin/src/js/join.ts Normal file
View File

@@ -0,0 +1,59 @@
import type { CalcType } from '@/types/my-kintone';
import { isType, type FieldType, type OneOf } from './kintone-rest-api-client';
export type LeftCalcJoinType = Record<CalcType, FieldType[]>;
export function isForceDisable(field: OneOf) {
if (isType.CALC(field)) {
return field.format === 'DAY_HOUR_MINUTE' || field.format === 'HOUR_MINUTE';
}
return false;
}
const calcJoinType = {
NUMBER: ['SINGLE_LINE_TEXT', 'NUMBER'],
NUMBER_DIGIT: ['SINGLE_LINE_TEXT', 'NUMBER'],
DATE: ['DATE'],
TIME: ['TIME'],
DATETIME: ['DATETIME'],
HOUR_MINUTE: [],
DAY_HOUR_MINUTE: [],
} as LeftCalcJoinType;
const availableLeftJoinType = {
SINGLE_LINE_TEXT: ['SINGLE_LINE_TEXT'],
NUMBER: ['NUMBER'],
CALC: calcJoinType,
DATE: ['DATE'],
TIME: ['TIME'],
DATETIME: ['DATETIME'],
LINK: ['LINK'],
} as Record<FieldType, FieldType[] | LeftCalcJoinType>;
// undefined means all
export function getRightAvailableJoinType(left?: OneOf | '') {
if (left === undefined) {
return Object.keys(availableRightJoinType) as FieldType[];
}
return left ? availableLeftJoinType[left.type] : [];
}
export type RightCalcJoinType = { type: 'CALC'; format: CalcType[] };
const availableRightJoinType = {
SINGLE_LINE_TEXT: ['SINGLE_LINE_TEXT', { type: 'CALC', format: ['NUMBER', 'NUMBER_DIGIT'] }],
NUMBER: ['NUMBER', { type: 'CALC', format: ['NUMBER', 'NUMBER_DIGIT'] }],
DATE: ['DATE', { type: 'CALC', format: ['DATE'] }],
TIME: ['TIME', { type: 'CALC', format: ['TIME'] }],
DATETIME: ['DATETIME', { type: 'CALC', format: ['DATETIME'] }],
LINK: ['LINK'],
} as Record<FieldType, Array<FieldType | RightCalcJoinType>>;
// undefined means all
export function getLeftAvailableJoinType(right?: OneOf | '') {
if (right === undefined) {
return Object.keys(availableLeftJoinType) as FieldType[];
}
return right ? availableRightJoinType[right.type] : [];
}

4
vue-project/my-kintone-plugin/src/js/kintone-rest-api-client.ts
View File

@@ -10,7 +10,7 @@ export type App = {
export type Properties = Awaited<ReturnType<typeof client.app.getFormFields>>['properties'];
export type Layout = Awaited<ReturnType<typeof client.app.getFormLayout>>['layout'];
type OneOf = Properties[string];
export type OneOf = Properties[string];
export type FieldType = OneOf['type'];
const typeNames = [
@@ -54,7 +54,7 @@ export const types = typeNames.reduce(
type ExtractOneOf<T extends FieldType> = Extract<OneOf, { type: T }>;
function createTypeGuard<T extends FieldType>(type: T) {
return (value: OneOf): value is ExtractOneOf<T> => value.type === type;
return (value: OneOf): value is ExtractOneOf<T> => value?.type === type;
}
export const isType = Object.fromEntries(

23
vue-project/my-kintone-plugin/src/types/model.d.ts vendored
View File

@@ -2,24 +2,27 @@ import type { ConditionValue } from '@/js/conditions';
import type { Layout, Properties } from '@/js/kintone-rest-api-client';
import type { DropdownItem } from 'kintone-ui-component';
export interface FieldsJoinMapping {
leftField: string;
rightField: string;
export interface FieldsJoinMapping<FieldType = string> {
id: string;
leftField: FieldType;
rightField: FieldType;
}
export interface WhereCondition {
field: string;
export interface WhereCondition<FieldType = string> {
id: string;
field: FieldType;
condition: ConditionValue;
data: string;
}
export interface JoinTable {
id: number; // 用于唯一区分
export interface JoinTable<FieldType = string> {
id: string;
app: string; // 取得元アプリ
table: string; // テーブル
onConditions: FieldsJoinMapping[]; // 連結条件
fieldsMapping: FieldsJoinMapping[]; // 取得フィールド
whereConditions: WhereCondition[]; // 絞込条件
onConditions: FieldsJoinMapping<FieldType>[]; // 連結条件
fieldsMapping: FieldsJoinMapping<FieldType>[]; // 取得フィールド
whereConditions: WhereCondition<FieldType>[]; // 絞込条件
meta?: Properties;
}
// 存储的数据格式

8
vue-project/my-kintone-plugin/src/types/my-kintone.d.ts vendored
View File

@@ -1,5 +1,5 @@
export interface KucEvent {
detail: {
value: string;
};
export interface KucEvent<T> {
detail: T;
}
export type CalcType = 'NUMBER' | 'NUMBER_DIGIT' | 'DATETIME' | 'DATE' | 'TIME' | 'HOUR_MINUTE' | 'DAY_HOUR_MINUTE';