clone/nocodb
1
0
Fork 0
mirror of https://github.com/nocodb/nocodb.git synced 2026-05-03 21:57:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: sync edit + improvements

Browse Source
This commit is contained in:
mertmit
2025-05-23 07:01:57 +00:00
parent 11f8953243
commit ef7a6a5a94
12 changed files with 634 additions and 643 deletions
Download Patch File Download Diff File Expand all files Collapse all files

151
packages/nc-gui/components/dashboard/settings/sync/Settings.vue
View File

@@ -1,7 +1,8 @@
<script lang="ts" setup>
import { OnDeleteActionMeta, SyncTriggerMeta, SyncTypeMeta, TARGET_TABLES_META } from 'nocodb-sdk'
const { syncConfigForm, validateInfosSyncConfig } = useSyncStoreOrThrow()
const { syncConfigForm, validateInfosSyncConfig, updateSync, syncConfigEditForm, syncConfigEditFormChanged, editMode } =
useSyncStoreOrThrow()
const syncTypeOptions = Object.values(SyncTypeMeta)
const syncTriggerOptions = Object.values(SyncTriggerMeta)
@@ -24,77 +25,97 @@ const onCheckboxChange = (model: string) => {
syncConfigForm.value.exclude_models.push(model)
}
}
const formModel = computed(() => {
return editMode.value ? syncConfigEditForm.value : syncConfigForm.value
})
</script>
<template>
<a-row :gutter="24">
<a-col :span="24">
<a-form-item label="Sync Title" v-bind="validateInfosSyncConfig.title" hide-required-mark>
<a-input v-model:value="syncConfigForm.title" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="Sync Type" v-bind="validateInfosSyncConfig.sync_type" hide-required-mark>
<a-select v-model:value="syncConfigForm.sync_type" :options="syncTypeOptions" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="Sync Trigger" v-bind="validateInfosSyncConfig.sync_trigger" hide-required-mark>
<a-select v-model:value="syncConfigForm.sync_trigger" :options="syncTriggerOptions" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="On Delete Action" v-bind="validateInfosSyncConfig.on_delete_action" hide-required-mark>
<a-select v-model:value="syncConfigForm.on_delete_action" :options="onDeleteActionOptions" />
</a-form-item>
</a-col>
</a-row>
<template v-if="formModel">
<a-row :gutter="24">
<a-col :span="24">
<a-form-item label="Sync Title" v-bind="validateInfosSyncConfig.title" hide-required-mark>
<a-input v-model:value="formModel.title" @change="syncConfigEditFormChanged = true" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="Sync Type" v-bind="validateInfosSyncConfig.sync_type" hide-required-mark>
<a-select v-model:value="formModel.sync_type" :options="syncTypeOptions" @change="syncConfigEditFormChanged = true" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="Sync Trigger" v-bind="validateInfosSyncConfig.sync_trigger" hide-required-mark>
<a-select
v-model:value="formModel.sync_trigger"
:options="syncTriggerOptions"
@change="syncConfigEditFormChanged = true"
/>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<a-form-item label="On Delete Action" v-bind="validateInfosSyncConfig.on_delete_action" hide-required-mark>
<a-select
v-model:value="formModel.on_delete_action"
:options="onDeleteActionOptions"
@change="syncConfigEditFormChanged = true"
/>
</a-form-item>
</a-col>
</a-row>
<div class="mt-4">
<a-radio-group v-model:value="syncAllModels" class="w-full">
<div class="flex items-start mb-4">
<a-radio :value="true" class="!mt-0.5">
<div class="ml-2">
<div class="text-base">Sync all available models</div>
<div class="text-gray-500 text-xs mt-1">
All GitHub data models will be synced. This may take longer and use more resources.
</div>
</div>
</a-radio>
</div>
<div v-if="editMode" class="flex justify-end">
<NcButton class="!px-4" type="primary" size="small" :disabled="!syncConfigEditFormChanged" @click="updateSync">
Update Sync Settings
</NcButton>
</div>
<div class="flex items-start">
<a-radio :value="false" class="!mt-0.5">
<div class="ml-2">
<div class="text-base">Select specific models</div>
</div>
</a-radio>
</div>
</a-radio-group>
<div v-if="!syncAllModels" class="border rounded-lg px-1 py-2">
<div v-for="model in availableModels" :key="model.value" class="flex items-start px-3">
<a-checkbox
:value="model.value"
:checked="!syncConfigForm.exclude_models.includes(model.value)"
:disabled="model.required"
@change="onCheckboxChange(model.value)"
>
<div class="flex justify-center flex-col ml-2">
<div class="flex items-center">
<div class="flex-none mr-2">
<GeneralIcon :icon="model.icon" class="text-primary" />
<div v-if="!editMode" class="mt-4">
<a-radio-group v-model:value="syncAllModels" class="w-full" @change="syncConfigEditFormChanged = true">
<div class="flex items-start mb-4">
<a-radio :value="true" class="!mt-0.5">
<div class="ml-2">
<div class="text-base">Sync all available models</div>
<div class="text-gray-500 text-xs mt-1">
All models for the category will be synced. This may take longer and use more resources.
</div>
<div class="!text-black">{{ model.label }}</div>
</div>
<div class="text-gray-500 text-xs">{{ model.description }}</div>
</div>
</a-checkbox>
</a-radio>
</div>
<div class="flex items-start">
<a-radio :value="false" class="!mt-0.5">
<div class="ml-2">
<div class="text-base">Select specific models</div>
</div>
</a-radio>
</div>
</a-radio-group>
<div v-if="!syncAllModels" class="border rounded-lg px-1 py-2">
<div v-for="model in availableModels" :key="model.value" class="flex items-start px-3">
<a-checkbox
:value="model.value"
:checked="!formModel.exclude_models?.includes(model.value)"
:disabled="model.required"
@change="onCheckboxChange(model.value)"
>
<div class="flex justify-center flex-col ml-2">
<div class="flex items-center">
<div class="flex-none mr-2">
<GeneralIcon :icon="model.icon" class="text-primary" />
</div>
<div class="!text-black">{{ model.label }}</div>
</div>
<div class="text-gray-500 text-xs">{{ model.description }}</div>
</div>
</a-checkbox>
</div>
</div>
</div>
</div>
</template>
</template>