「DataMapping」コンポーネントとプラグイン 新機能「更新対象」

frontend/src/components/right/DataMapping.vue

@@ -96,7 +96,7 @@ import FieldSelect from '../FieldSelect.vue';
 import IAppFields from './AppFieldSelect.vue';
 import { api } from 'boot/axios';
 
-type Props = {
+type ContextProps = {
     props?: {
         name: string;
         modelValue?: {
@@ -108,12 +108,12 @@ type Props = {
     }
 };
 
-type Value = {
-    data: ValueType[];
+type CurrentModelValueType = {
+    data: MappingValueType[];
     createWithNull: boolean;
 }
 
-type ValueType = {
+type MappingValueType = {
     id: string;
     from: object;
     to: typeof IAppFields & {
@@ -122,6 +122,7 @@ type ValueType = {
     isKey: boolean;
 }
 
+const blackListLabelName = ['レコード番号','作業者','更新者','更新日時','作成日時','作成者']
 
 export default defineComponent({
     name: 'DataMapping',
@@ -134,7 +135,7 @@ export default defineComponent({
     },
     props: {
         context: {
-            type: Array<Props>,
+            type: Array<ContextProps>,
             default: '',
         },
         displayName: {
@@ -146,7 +147,7 @@ export default defineComponent({
             default: '',
         },
         modelValue: {
-            type: Object as () => Value,
+            type: Object as () => CurrentModelValueType,
         },
         placeholder: {
             type: String,
@@ -162,31 +163,30 @@ 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 = () => {
-            emit('update:modelValue', mappingProps.value
-            );
+            emit('update:modelValue', { data: mappingProps.value, createWithNull: createWithNull.value });
         }
 
         const closeToDg = () => {
-            emit('update:modelValue', mappingProps.value
-            );
+            emit('update:modelValue', { data: mappingProps.value, createWithNull: createWithNull.value });
         }
 
         const mappingProps = computed(() => props.modelValue?.data ?? []);
 
-        const createWithNull = computed(() => props.modelValue?.createWithNull)
+        const createWithNull = ref(props.modelValue?.createWithNull ?? false)
 
         watch(() => sourceAppId.value, async (newId, oldId) => {
             if (!newId) return;
-            const a = await api.get('api/v1/appfields', {
+            const ktAppFields = await api.get('api/v1/appfields', {
                 params: {
                     app: newId
                 }
             }).then(res => {
                 return Object.values(res.data.properties)
+                    .filter(f => !blackListLabelName.find(label => f.label === label))
                     .map(f => ({ name: f.label, objectType: 'field', ...f }))
                     .map(f => {
                         return {
@@ -197,7 +197,7 @@ export default defineComponent({
                                 fields: [f],
                                 isDialogVisible: false
                             },
-                            isKey: true
+                            isKey: false
                         }
                     })
             })
@@ -206,21 +206,18 @@ export default defineComponent({
             const createWithNull = props.modelValue?.createWithNull ?? false
 
             if (modelValueData.length === 0 || newId !== oldId) {
-                // emit('update:modelValue', a);
-                emit('update:modelValue', { data: a, createWithNull: createWithNull });
+                emit('update:modelValue', { data: ktAppFields, createWithNull: createWithNull });
                 return;
             }
             const modelValueFieldNames = modelValueData.map(item => item.to.fields[0].name);
 
-            const newFields = a.filter(field => !modelValueFieldNames.includes(field.to.fields[0].name));
+            const newFields = ktAppFields.filter(field => !modelValueFieldNames.includes(field.to.fields[0].name));
 
-            const updatedModelValue = [...modelValueData, ...newFields];
-
-            emit('update:modelValue', { data: updatedModelValue, createWithNull: createWithNull });
-            // emit('update:modelValue', updatedModelValue);
+            const updatedModelValueData = [...modelValueData, ...newFields];
+            emit('update:modelValue', { data: updatedModelValueData, createWithNull: createWithNull });
         })
 
-        console.log(mappingProps.value);
+        console.log(createWithNull.value);
 
         // const deleteMappingObject = (index: number) => mappingProps.length === 1
         //     ? mappingProps.splice(0, mappingProps.length, defaultMappingProp())
@@ -243,7 +240,7 @@ export default defineComponent({
         //集計処理方法
 
         watchEffect(() => {
-            emit('update:modelValue', mappingProps.value);
+            emit('update:modelValue', { data: mappingProps.value, createWithNull: createWithNull.value });
         });
         return {
             uuidv4,