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

「kintone lookup」と組み合わせるとロックされたフィールドを除外します

Browse Source
This commit is contained in:
Mouriya
2024-07-11 20:23:48 +09:00
parent 24a70aed2e
commit 4ac4c9e9f4
3 changed files with 97 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/components/ConditionEditor/ConditionObject.vue
View File

@@ -1,6 +1,6 @@
<template>
<q-field labelColor="primary" class="condition-object" :clearable="isSelected" stack-label :dense="true"
:outlined="true">
<q-field labelColor="primary" class="condition-object" dense outlined :label="label" :disable="disabled"
:clearable="isSelected">
<template v-slot:control>
<!-- <q-chip color="primary" text-color="white" v-if="isSelected && selectedObject.objectType==='field'" :dense="true" class="selected-obj">
{{ selectedObject.name }}
@@ -44,6 +44,14 @@ export default defineComponent({
// ConditionObjects
},
props: {
disabled: {
type: Boolean,
default: false
},
label: {
type: String,
default: undefined
},
config: {
type: Object,
default: () => {

75
frontend/src/components/right/DataMapping.vue
View File

@@ -16,7 +16,7 @@
</q-card>
</template>
</q-field>
<show-dialog v-model:visible="dgIsShow" name="データマッピング" @close="closeDg" min-width="50vw" min-height="60vh">
<show-dialog v-model:visible="dgIsShow" name="データマッピング" @close="closeDg" min-width="55vw" min-height="60vh">
<div class="q-mx-none">
<div class="row q-col-gutter-x-xs flex-center">
@@ -26,9 +26,13 @@
<!-- <div class="col-1">
</div> -->
<div class="col-5">
<div class="q-mx-xs">目標</div>
<div class="row justify-between q-mx-sm">
<div class="">目標</div>
<q-btn outline color="primary" size="xs" label="最新のフィールドを取得する"
@click="() => updateFields(sourceAppId!, undefined)" />
</div>
</div>
<div class="col-1">
<div class="col-1 q-pl-md">
キー
</div>
</div>
@@ -36,12 +40,13 @@
<!-- <div class="q-my-sm" v-for="(item, index) in mappingProps" :key="item.id"> -->
<div class="row q-my-md q-col-gutter-x-md flex-center">
<div class="col-5">
<ConditionObject :config="config" v-model="item.from" />
<ConditionObject :config="config" v-model="item.from" :disabled="item.disabled" :label="item.disabled ? '「Lookup」によってロックされる': ''"/>
</div>
<!-- <div class="col-1">
</div> -->
<div class="col-5">
<q-field v-model="item.vName" type="text" outlined dense>
<q-field v-model="item.vName" type="text" outlined dense
:disable="item.disabled" >
<!-- <template v-slot:append>
<q-icon name="search" class="cursor-pointer"
@click="() => { mappingProps[index].to.isDialogVisible = true }" />
@@ -62,7 +67,7 @@
</q-field>
</div>
<div class="col-1">
<q-checkbox size="sm" v-model="item.isKey" />
<q-checkbox size="sm" v-model="item.isKey" :disable="item.disabled"/>
<!-- <q-btn flat round dense icon="delete" size="sm" @click="() => deleteMappingObject(index)" /> -->
</div>
</div>
@@ -120,9 +125,10 @@ type MappingValueType = {
isDialogVisible: boolean;
};
isKey: boolean;
disabled: boolean;
}
const blackListLabelName = ['レコード番号','作業者','更新者','更新日時','作成日時','作成者']
const blackListLabelName = ['レコード番号', '作業者', '更新者', '更新日時', '作成日時', '作成者']
export default defineComponent({
name: 'DataMapping',
@@ -163,7 +169,7 @@ export default defineComponent({
const source = props.context.find(element => element?.props?.name === 'sources')
const sourceApp = computed(() => source?.props?.modelValue?.app);
const sourceAppId = computed(() => sourceApp.value?.id);
const closeDg = () => {
@@ -180,6 +186,14 @@ export default defineComponent({
watch(() => sourceAppId.value, async (newId, oldId) => {
if (!newId) return;
updateFields(newId, oldId)
})
const updateFields = async (newId: string, oldId: string | undefined) => {
const modelValueData = props.modelValue?.data ?? [];
const ktAppFields = await api.get('api/v1/appfields', {
params: {
app: newId
@@ -191,31 +205,47 @@ export default defineComponent({
.map(f => {
return {
id: uuidv4(),
from: {},
from: modelValueData.find(m => m.to.fields[0].code === f.code),
to: {
app: sourceApp.value,
fields: [f],
isDialogVisible: false
},
isKey: false
isKey: false,
disabled: false
}
})
})
const modelValueData = props.modelValue?.data ?? [];
const createWithNull = props.modelValue?.createWithNull ?? false
// const createWithNull = props.modelValue?.createWithNull ?? false
if (modelValueData.length === 0 || newId !== oldId) {
emit('update:modelValue', { data: ktAppFields, createWithNull: createWithNull });
return;
// if (modelValueData.length === 0 || newId !== oldId) {
// emit('update:modelValue', { data: ktAppFields, createWithNull: createWithNull });
// return;
// }
// const modelValueFieldNames = modelValueData.map(item => item.to.fields[0].name);
// const newFields = ktAppFields.filter(field => !modelValueFieldNames.includes(field.to.fields[0].name));
// const updatedModelValueData = [...modelValueData, ...newFields];
const lookupFixedField = ktAppFields
.filter(field => field.to.fields[0].lookup !== undefined)
.flatMap(field => field.to.fields[0].lookup.fieldMappings.map((m) => m.field))
console.log(lookupFixedField);
if (lookupFixedField.length > 0) {
ktAppFields.filter(f => lookupFixedField.includes( f.to.fields[0].code)).forEach(f => f.disabled = true)
// for (const field of ktAppFields) {
// field.disabled = true
// }
}
const modelValueFieldNames = modelValueData.map(item => item.to.fields[0].name);
const newFields = ktAppFields.filter(field => !modelValueFieldNames.includes(field.to.fields[0].name));
const updatedModelValueData = [...modelValueData, ...newFields];
emit('update:modelValue', { data: updatedModelValueData, createWithNull: createWithNull });
})
emit('update:modelValue', { data: ktAppFields, createWithNull: createWithNull });
}
console.log(createWithNull.value);
@@ -250,6 +280,7 @@ export default defineComponent({
closeToDg,
mappingProps,
createWithNull,
updateFields,
// addMappingObject: () => mappingProps.push(defaultMappingProp()),
// deleteMappingObject,
mappingObjectsInputDisplay,
@@ -265,5 +296,7 @@ export default defineComponent({
};
},
});
</script>
<style lang="scss"></style>