diff --git a/apps/daas/src/components.d.ts b/apps/daas/src/components.d.ts index 2c60e90774..3a802bb466 100644 --- a/apps/daas/src/components.d.ts +++ b/apps/daas/src/components.d.ts @@ -38,7 +38,6 @@ declare module 'vue' { ElFormItem: typeof import('element-plus/es')['ElFormItem'] ElHeader: typeof import('element-plus/es')['ElHeader'] ElIcon: typeof import('element-plus/es')['ElIcon'] - ElIconArrowLeft: typeof import('@element-plus/icons-vue')['ArrowLeft'] ElIconArrowRight: typeof import('@element-plus/icons-vue')['ArrowRight'] ElIconCircleCloseFilled: typeof import('@element-plus/icons-vue')['CircleCloseFilled'] ElIconCirclePlus: typeof import('@element-plus/icons-vue')['CirclePlus'] diff --git a/apps/daas/src/components/VDivider.vue b/apps/daas/src/components/VDivider.vue index adb1654bb6..979cf32e2d 100644 --- a/apps/daas/src/components/VDivider.vue +++ b/apps/daas/src/components/VDivider.vue @@ -1,8 +1,8 @@ diff --git a/apps/daas/src/views/License.vue b/apps/daas/src/views/License.vue index 49593a9e53..8362cbdc25 100644 --- a/apps/daas/src/views/License.vue +++ b/apps/daas/src/views/License.vue @@ -186,100 +186,98 @@ export default { $t('public_event_update') }} -
- - - - - - - - - - - - - - - - - - - - + + + + + + + + + + - - - -
+ + + + + + + + + + + { this.editAgentDialog = false this.$message.success(this.$t('public_message_save_ok')) - - this.$set(this.editAgentItem, 'agentName', this.agentName) + this.editAgentItem.agentName = this.agentName }) // .catch(() => { // }) diff --git a/apps/daas/src/views/setting/Setting.vue b/apps/daas/src/views/setting/Setting.vue index 58959fd02b..b5d97f128f 100644 --- a/apps/daas/src/views/setting/Setting.vue +++ b/apps/daas/src/views/setting/Setting.vue @@ -287,11 +287,11 @@ export default { }, handleChangeCert(target, value) { - this.$set(target, 'value', value) + target.value = value }, handleChangeName(target, name) { - this.$set(target, 'fileName', name) + target.fileName = name }, }, } diff --git a/apps/daas/src/views/setting/WebhookAlerts.vue b/apps/daas/src/views/setting/WebhookAlerts.vue index adf2d5dd4a..e5308761cc 100644 --- a/apps/daas/src/views/setting/WebhookAlerts.vue +++ b/apps/daas/src/views/setting/WebhookAlerts.vue @@ -310,7 +310,7 @@ export default { }) }, handleSwitch(row) { - this.$set(this.switchStateMap, row.id, true) + this.switchStateMap[row.id] = true webhookApi[row.open ? 'close' : 'open'](row.id) .then(() => { row.open = !row.open @@ -320,15 +320,16 @@ export default { row.open = !row.open }) .finally(() => { - this.$delete(this.switchStateMap, row.id) + delete this.switchStateMap[row.id] }) }, async reSend(request) { - this.$set(this.resendStateMap, request.id, true) + this.resendStateMap[request.id] = true const result = await webhookApi.resend(request) Object.assign(request, this.mapHistory(result)) this.$message.success(this.$t('public_message_send_success')) - this.$delete(this.resendStateMap, request.id) + + delete this.resendStateMap[request.id] }, afterCloseHistory() { this.historyState.collapse = [] @@ -474,7 +475,7 @@ export default { {{ progress }} - diff --git a/packages/business/src/components/TablePage.vue b/packages/business/src/components/TablePage.vue index 892c8b031d..ba338bef6f 100644 --- a/packages/business/src/components/TablePage.vue +++ b/packages/business/src/components/TablePage.vue @@ -107,7 +107,7 @@ export default { this.handleKeyDown = (ev) => { this.shiftKeyPressed = ev.shiftKey } - this.handleKeyUp = (ev) => { + this.handleKeyUp = () => { setTimeout(() => { this.shiftKeyPressed = false }, 0) @@ -193,7 +193,7 @@ export default { this.dragState.isDragging = true const selection = this.multipleSelection - if (selection.find((it) => it.id === row.id)) { + if (selection.some((it) => it.id === row.id)) { this.dragState.draggingObjects = selection } else { this.dragState.draggingObjects = [row] @@ -318,11 +318,10 @@ export default { :default-sort="defaultSort" :draggable="draggable || classificationVisible" @selection-change="handleSelectionChange" - @sort-change="$emit('sort-change', $event)" + @sort-change="$emit('sortChange', $event)" @row-dragstart="handleDragStart" @row-dragend="handleDragEnd" @select="onSelectRow" - v-on="$listeners" > @@ -397,6 +396,13 @@ export default { .table-page-nav:empty { display: none; } + + .table-page-topbar:has(.table-page-search-bar:empty):has( + .table-page-operation-bar:empty + ) { + display: none; + } + .table-page-header { padding: 20px; background: #eff1f4; diff --git a/packages/business/src/components/create-connection/SceneDialog.vue b/packages/business/src/components/create-connection/SceneDialog.vue index 6d2d1448c3..dd255ff3ba 100644 --- a/packages/business/src/components/create-connection/SceneDialog.vue +++ b/packages/business/src/components/create-connection/SceneDialog.vue @@ -631,7 +631,7 @@ export default { } if (this.selectorType === 'source_and_target' && !this.dialogMode) { - $emit(this, 'selected', item) + this.$emit('selected', item) return } diff --git a/packages/business/src/views/connections/DatabaseForm.vue b/packages/business/src/views/connections/DatabaseForm.vue index d37b6cecf7..dc9acfbdb6 100644 --- a/packages/business/src/views/connections/DatabaseForm.vue +++ b/packages/business/src/views/connections/DatabaseForm.vue @@ -348,14 +348,17 @@ export default { handleDatabaseType(item) { this.dialogDatabaseTypeVisible = false const { pdkHash, pdkId } = item - this.$router.push({ - name: 'connectionCreate', - query: { - pdkHash, - pdkId, - }, - }) - location.reload() + this.$router + .push({ + name: 'connectionCreate', + query: { + pdkHash, + pdkId, + }, + }) + .then(() => { + location.reload() + }) }, async getPdkForm() { const pdkHash = this.$route.query?.pdkHash @@ -1599,7 +1602,7 @@ export default { diff --git a/packages/business/src/views/verification/List.vue b/packages/business/src/views/verification/List.vue index f63e949e8d..697583ef30 100644 --- a/packages/business/src/views/verification/List.vue +++ b/packages/business/src/views/verification/List.vue @@ -263,6 +263,7 @@ export default { type: 'select-inner', items: this.verifyTypeList, selectedWidth: '200px', + id: 'type-filter-select', }, { label: this.$t('packages_business_verification_check_frequency'), @@ -279,6 +280,7 @@ export default { value: 'cron', }, ], + id: 'mode-filter-select', }, { label: this.$t('packages_business_verification_is_enabled'), @@ -295,17 +297,20 @@ export default { value: 2, }, ], + id: 'enabled-filter-select', }, { label: this.$t('packages_business_verification_result_title'), key: 'result', type: 'select-inner', items: this.validList, + id: 'result-filter-select', }, { placeholder: this.$t('packages_business_verification_task_name'), key: 'keyword', type: 'input', + id: 'name-filter-input', }, ] }, @@ -358,7 +363,6 @@ export default { v-readonlybtn="'datasource_creation'" class="btn btn-create" type="primary" - @click="handleCreate('pipeline')" > {{ @@ -369,7 +373,6 @@ export default { v-readonlybtn="'datasource_creation'" class="btn btn-create" type="primary" - @click="handleCreate('random')" > {{ @@ -401,7 +404,6 @@ export default { }} diff --git a/packages/business/src/views/verification/components/CollateMap.vue b/packages/business/src/views/verification/components/CollateMap.vue index d1d91fac7b..aa58029a2c 100644 --- a/packages/business/src/views/verification/components/CollateMap.vue +++ b/packages/business/src/views/verification/components/CollateMap.vue @@ -24,7 +24,7 @@ export default defineComponent({ required: true, }, }, - + emits: ['update:value'], setup(props, { emit }) { const setCharset = (value) => { selectedFields.value.forEach((key) => { @@ -42,7 +42,7 @@ export default defineComponent({ return acc }, {}) - emit('input', result) + emit('update:value', result) }, }) diff --git a/packages/business/src/views/verification/components/ConditionBox.vue b/packages/business/src/views/verification/components/ConditionBox.vue index 989b8a54a3..6c1120370e 100644 --- a/packages/business/src/views/verification/components/ConditionBox.vue +++ b/packages/business/src/views/verification/components/ConditionBox.vue @@ -8,8 +8,14 @@ import SwitchNumber from '@tap/component/src/SwitchNumber.vue' import { AsyncSelect, SchemaToForm } from '@tap/form' import i18n from '@tap/i18n' import { uuid } from '@tap/shared' -import { cloneDeep, debounce, isEmpty, isString, merge, uniqBy } from 'lodash-es' -import { DynamicScroller, DynamicScrollerItem } from 'vue-virtual-scroller' +import { + cloneDeep, + debounce, + isEmpty, + isString, + merge, + uniqBy, +} from 'lodash-es' import { $emit } from '../../../../utils/gogocodeTransfer' import { CONNECTION_STATUS_MAP } from '../../../shared' @@ -24,8 +30,6 @@ export default { components: { DocsDrawer, AsyncSelect, - DynamicScroller, - DynamicScrollerItem, VCodeEditor, GitBook, FieldDialog, @@ -71,6 +75,9 @@ export default { jsEngineName: 'graal.js', doc: '', schemaData: null, + // Add pagination properties + currentPage: 1, + pageSize: 10, schemaScope: { $supportFilterFunction: this.inspectMethod === 'row_count' @@ -788,6 +795,16 @@ export default { ) }) }, + // Add paginated list computed property + paginatedList() { + const startIndex = (this.currentPage - 1) * this.pageSize + const endIndex = startIndex + this.pageSize + return this.filteredList.slice(startIndex, endIndex) + }, + // Add total pages computed property + totalPages() { + return Math.ceil(this.filteredList.length / this.pageSize) + }, nullsLastState() { return Object.keys(this.capabilitiesMap || {}).reduce((cur, pre) => { const tags = this.capabilitiesMap[pre]?.tags || [] @@ -816,8 +833,17 @@ export default { deep: true, handler() { this.debounceValidate() + // Reset to page 1 if list is empty + if (this.list.length === 0) { + this.currentPage = 1 + } }, }, + + searchValue() { + // Reset to page 1 when search filter changes + this.currentPage = 1 + }, }, created() { this.loadDoc() @@ -951,8 +977,12 @@ export default { async getConnectionsInTask(filter = {}) { const keyword = filter.where?.name?.like - let arr - if (keyword) { + const id = filter.where?.id + let arr = [] + if (id) { + const item = this.flowStages.find((item) => item.connectionId === id) + item && arr.push(item) + } else if (keyword) { arr = this.flowStages.filter((t) => t.attrs?.connectionName.includes(filter.where?.name?.like), ) @@ -990,6 +1020,8 @@ export default { 'value', ) + // Add await to ensure this is truly async + await Promise.resolve() return { items: result, total: result.length } }, @@ -1165,6 +1197,7 @@ export default { clearList() { this.list = [] + this.currentPage = 1 this.validate() }, @@ -1183,6 +1216,16 @@ export default { addItem() { this.list.push(this.getItemOptions()) + // Navigate to the last page when adding a new item + this.currentPage = this.totalPages + }, + + removeItem(id) { + this.list = this.list.filter((t) => t.id !== id) + // If current page is now empty and it's not the first page, go to previous page + if (this.paginatedList.length === 0 && this.currentPage > 1) { + this.currentPage-- + } }, async autoAddTable() { @@ -1392,12 +1435,6 @@ export default { }) }, - removeItem(id) { - const index = this.list.findIndex(item => item.id === id) - - if (~index) this.list.splice(index, 1) - }, - loadList() { const data = cloneDeep(this.data) data.forEach((el) => { @@ -1579,12 +1616,12 @@ export default { }) }, - handleChangeAdvanced(item, val) { + handleChangeAdvanced(item) { Object.assign(item.target, { targeFilterFalg: false, where: '', }) - item.showAdvancedVerification = val + // item.showAdvancedVerification = val }, addScript(index) { @@ -1614,7 +1651,7 @@ export default { editScript(index) { this.formIndex = index - const task = this.list + const task = this.paginatedList const script = JSON.parse(JSON.stringify(task[this.formIndex].webScript)) this.jsEngineName = JSON.parse( JSON.stringify(task[this.formIndex].jsEngineName || 'nashorn'), @@ -1623,7 +1660,7 @@ export default { this.dialogAddScriptVisible = true }, - removeScript(index) { + removeScript(item, index) { this.$confirm( this.$t('packages_business_verification_message_confirm_delete_script'), this.$t('public_button_delete'), @@ -1634,7 +1671,7 @@ export default { if (!resFlag) { return } - this.list[index].webScript = '' + item.webScript = '' }) }, @@ -1681,7 +1718,7 @@ export default { let index = 0 let message = '' // const formDom = document.getElementById('data-verification-form') - + const SHOW_COUNT = 20 // 检查是否选择表 const haveTableArr = tasks.filter((c) => c.source.table && c.target.table) const noTableArr = tasks.filter((c) => !c.source.table || !c.target.table) @@ -1711,8 +1748,6 @@ export default { return } - // 检查 - const SHOW_COUNT = 20 if (['field', 'jointField'].includes(this.inspectMethod)) { // 检查数据源的能力 message = this.validateCapabilities( @@ -1786,10 +1821,12 @@ export default { // 判断过滤设置是否填写完整 let schemaToFormFlag = false for (const [i, task] of tasks.entries()) { - await this.$refs[`schemaToForm_${task.id}`]?.validate().catch(() => { - index = i + 1 - schemaToFormFlag = true - }) + await this.$refs[`schemaToForm_${task.id}`]?.[0] + ?.validate?.() + .catch(() => { + index = i + 1 + schemaToFormFlag = true + }) } if (schemaToFormFlag) { message = this.$t( @@ -1946,6 +1983,18 @@ return {result: 'failed',message: "记录不一致",data: targetRow} ) }, + handlePageChange(page) { + this.currentPage = page + }, + + handleSizeChange(size) { + this.pageSize = size + // If changing page size would put us on a non-existent page, reset to page 1 + if (this.currentPage > this.totalPages) { + this.currentPage = 1 + } + }, + handleCustomFields(item, index) { this.$refs.fieldDialog.open(item, index, { source: this.dynamicSchemaMap[item.source.connectionId], @@ -2071,18 +2120,15 @@ return {result: 'failed',message: "记录不一致",data: targetRow} toggleCollate(item, value) { if (value) { const fields = Object.keys(item.collate || {}) + if (fields.length || !item.sortColumn) return const sortColumn = item.sortColumn.split(',') - this.$set( - item, - 'collate', - sortColumn.reduce((acc, key) => { - acc[key] = '' - return acc - }, {}), - ) + item.collate = sortColumn.reduce((acc, key) => { + acc[key] = '' + return acc + }, {}) } }, }, @@ -2141,352 +2187,337 @@ return {result: 'failed',message: "记录不一致",data: targetRow} >{{ $t('packages_business_verification_clear') }} - +
- - - +
+ + + + + + +
+ +
{ ElSelectV2.props.suffixIcon.default = DownBoldOutlined ElDropdown.props.popperOptions.default = getDefault ElLink.props.underline.default = false + ElCollapseItem.props.icon.default = RightBoldOutlined } diff --git a/packages/component/src/RightBoldOutlined.tsx b/packages/component/src/RightBoldOutlined.tsx new file mode 100644 index 0000000000..f77f22ff6d --- /dev/null +++ b/packages/component/src/RightBoldOutlined.tsx @@ -0,0 +1,15 @@ +export const RightBoldOutlined = () => ( + + + +) diff --git a/packages/component/src/SwitchNumber.vue b/packages/component/src/SwitchNumber.vue index 0ce48c8b42..238fcd09ab 100644 --- a/packages/component/src/SwitchNumber.vue +++ b/packages/component/src/SwitchNumber.vue @@ -1,32 +1,32 @@ - - + + diff --git a/packages/component/src/TimeSelect.vue b/packages/component/src/TimeSelect.vue index e5db4091fd..57e259fce9 100644 --- a/packages/component/src/TimeSelect.vue +++ b/packages/component/src/TimeSelect.vue @@ -313,8 +313,8 @@ export default { :range-separator="$t('packages_dag_components_timeselect_zhi')" :start-placeholder="$t('packages_dag_components_timeselect_kaishiriqi')" :end-placeholder="$t('packages_dag_components_timeselect_jieshuriqi')" - format="yyyy-MM-dd HH:mm" - value-format="timestamp" + format="YYYY-MM-DD HH:mm:ss" + value-format="x" class="el-date-picker position-absolute overflow-hidden p-0 m-0" @change="changeTime" @blur="blur" diff --git a/packages/component/src/directives/resize/index.js b/packages/component/src/directives/resize/index.js index 5e0d0346b1..4ba65cbca0 100644 --- a/packages/component/src/directives/resize/index.js +++ b/packages/component/src/directives/resize/index.js @@ -1,4 +1,4 @@ -import { on, off, appendHtml } from '@tap/shared' +import { appendHtml, off, on } from '@tap/shared' const EVENT = { mouse: { @@ -14,7 +14,10 @@ const EVENT = { } function initEvent($el, position, options) { - let $trigger = appendHtml($el, `
`) + const $trigger = appendHtml( + $el, + `
`, + ) const isHorizontal = position === 'left' || position === 'right' const num = position === 'left' || position === 'top' ? 1 : -1 let initOffset, oldVal, xOry, attr, cls @@ -43,7 +46,7 @@ function initEvent($el, position, options) { eventsFor = EVENT.mouse } - let page = event.touches ? event.touches[0] : event + const page = event.touches ? event.touches[0] : event initOffset = page[xOry] oldVal = $el[`offset${attr}`] @@ -60,8 +63,8 @@ function initEvent($el, position, options) { event.preventDefault() $trigger.classList.add('active') - let page = event.touches ? event.touches[0] : event - let offset = initOffset - page[xOry] + const page = event.touches ? event.touches[0] : event + const offset = initOffset - page[xOry] let newVal = oldVal + offset * num // 正向或者负向移动 newVal = Math.min(max, Math.max(min, newVal)) @@ -71,7 +74,7 @@ function initEvent($el, position, options) { newVal, }) - $el.style[_attr] = newVal + 'px' + $el.style[_attr] = `${newVal}px` } const handleStop = () => { @@ -86,8 +89,9 @@ function initEvent($el, position, options) { on($trigger, 'touchstart', handleStart) } +// Vue 3 directive format export default { - inserted: function (el, binding) { + mounted(el, binding) { // 事件名 const options = binding.value const { left, right, top, bottom } = binding.modifiers diff --git a/packages/component/src/index.js b/packages/component/src/index.js index 64f686e3f3..6785971d18 100644 --- a/packages/component/src/index.js +++ b/packages/component/src/index.js @@ -76,4 +76,6 @@ export * from './icon-button' export * from './CloseIcon' +export * from './RightBoldOutlined' + export * from './InstallElement' diff --git a/packages/dag/src/MigrationMonitorSimple.vue b/packages/dag/src/MigrationMonitorSimple.vue index 0a3c333b8c..ba05d99cef 100644 --- a/packages/dag/src/MigrationMonitorSimple.vue +++ b/packages/dag/src/MigrationMonitorSimple.vue @@ -1,531 +1,78 @@ - - - getTime() { - return Time.now() - }, + diff --git a/packages/dag/src/components/form/table-selector/TableSelector.vue b/packages/dag/src/components/form/table-selector/TableSelector.vue index 56bc151228..53fa139b58 100644 --- a/packages/dag/src/components/form/table-selector/TableSelector.vue +++ b/packages/dag/src/components/form/table-selector/TableSelector.vue @@ -5,7 +5,7 @@ import { taskApi, workerApi, } from '@tap/api' -import { VEmpty } from '@tap/component' +import { RightBoldOutlined, VEmpty } from '@tap/component' import VIcon from '@tap/component/src/base/VIcon' import OverflowTooltip from '@tap/component/src/overflow-tooltip' import { computed, ref, watch } from 'vue' @@ -250,405 +250,6 @@ watch( // Initialize getTables() - -/* export default { - components: { RecycleScroller, OverflowTooltip, ConnectionTest, VIcon, VEmpty }, - props: { - connectionId: { - type: String, - required: true, - }, - value: Array, - disabled: Boolean, - hideReload: Boolean, - alwaysShowReload: Boolean, - reloadTime: [String, Number], - filterType: String, - syncPartitionTableEnable: Boolean, - hasPartition: Boolean, - nodeId: String, - taskId: String - }, - data() { - return { - stateIsReadonly: this.$store.state.dataflow.stateIsReadonly, - loading: false, - table: { - isCheckAll: false, - searchKeyword: '', - checked: [], - tables: [], - }, - selected: { - isCheckAll: false, - searchKeyword: '', - checked: [], - tables: this.value, - }, - showProgress: false, - progress: '', - loadFieldsStatus: 'finished', - errorTables: {}, - isOpenClipMode: false, - clipboardValue: '', - isFocus: false, - tableMap: {}, - schemaLoading: false, - } - }, - computed: { - ...mapGetters('dataflow', ['schemaRefreshing']), - - filteredData() { - let { searchKeyword, tables } = this.table - try { - let reg = new RegExp(searchKeyword, 'i') - return getPrimaryKeyTablesByType( - tables.filter((item) => reg.test(item)), - this.filterType, - this.tableMap, - ) - } catch (error) { - return [] - } - }, - filterSelectedData() { - let { searchKeyword, tables } = this.selected - let errorTables = this.getErrorTables(tables) - let reg = new RegExp(searchKeyword, 'i') - let filterTables = tables.filter((item) => reg.test(item)) - filterTables = filterTables.sort((t1, t2) => { - if (errorTables[t1]) { - return -1 - } - if (errorTables[t2]) { - return 1 - } - return 0 - }) - return getPrimaryKeyTablesByType(filterTables, this.filterType, this.tableMap) - }, - - - rightData() { - return this.filterSelectedData.map(name => ({name})) - }, - - clipboardTables() { - //支持换行符 /n - let value = this.clipboardValue?.replace(/(\n)/g, ',') - value = value?.replace(/\s+/g, '') - let tables = value ? value.split(',') : [] - return Array.from(new Set(tables.filter((it) => !!it && it.trim()))) - }, - isIndeterminate() { - const checkedLength = this.table.checked.length - const tablesLength = this.filteredData.length - return checkedLength > 0 && checkedLength < tablesLength - }, - selectedIsIndeterminate() { - const checkedLength = this.selected.checked.length - const tablesLength = this.filterSelectedData.length - return checkedLength > 0 && checkedLength < tablesLength - }, - }, - watch: { - isFocus(v) { - if (v) { - this.$nextTick(() => { - this.$refs?.textarea?.focus() - }) - } - }, - value(v = []) { - this.selected.tables = v.concat() - }, - 'table.checked'() { - this.updateAllChecked() - }, - 'filteredData.length'() { - this.updateAllChecked() - }, - 'selected.checked'() { - this.updateSelectedAllChecked() - }, - 'filterSelectedData.length'() { - this.updateSelectedAllChecked() - }, - reloadTime() { - this.getProgress(true) - }, - filterType() { - this.handleFilterType() - }, - schemaRefreshing(v) { - if (!v) { - this.getTables() - } - }, - syncPartitionTableEnable() { - this.getTables() - } - }, - created() { - let id = this.connectionId - if (id) { - this.getTables() - } - }, - methods: { - submitClipboard() { - let tables = this.clipboardTables - let errorTables = this.getErrorTables(tables) - if (!Object.keys(errorTables).length) { - this.changeSeletedMode() - //保留当前选中 以及当前所手动输入 - this.selected.tables = Array.from(new Set([...this.selected.tables, ...this.clipboardTables.concat()])) - $emit(this, 'update:value', this.selected.tables) - // $emit(this, 'change', this.selected.tables) - } - }, - add() { - if (this.isOpenClipMode || this.disabled) { - return - } - let tables = this.selected.tables.concat(this.table.checked) - if (tables.length) { - tables = Array.from(new Set(tables)) - this.selected.tables = Object.freeze(tables) - $emit(this, 'update:value', this.selected.tables) - // $emit(this, 'change', this.selected.tables) - } else { - this.$message.warning(this.$t('packages_form_component_table_selector_not_checked')) - } - }, - remove() { - if (this.isOpenClipMode || this.disabled) { - return - } - let tables = this.selected.checked - if (tables.length) { - this.selected.tables = Object.freeze(this.selected.tables.filter((it) => !tables.includes(it))) - this.selected.checked = [] - this.selected.isCheckAll = false - $emit(this, 'update:value', this.selected.tables) - // $emit(this, 'change', this.selected.tables) - } else { - this.$message.warning(this.$t('packages_form_component_table_selector_not_checked')) - } - }, - autofix() { - if (this.isOpenClipMode) { - this.clipboardValue = this.clipboardTables.filter((t) => !this.errorTables[t]).join(', ') - this.errorTables = {} - } else { - this.selected.tables = Object.freeze(this.selected.tables.filter((t) => !this.errorTables[t])) - $emit(this, 'update:value', this.selected.tables) - // $emit(this, 'change', this.selected.tables) - } - }, - getErrorTables(tables) { - let allTables = this.table.tables - let errorTables = {} - - if (!this.loading) { - tables.forEach((t) => { - if (!allTables.includes(t)) { - errorTables[t] = this.$t('packages_form_component_table_selector_error_not_exit') - } - }) - } - - this.errorTables = errorTables - return errorTables - }, - checkAll(flag, name) { - if (flag) { - this[name].checked = name === 'table' ? this.filteredData : this.filterSelectedData - } else { - this[name].checked = [] - } - }, - checkedChange(name) { - let { checked, tables } = this[name] - if (checked.length === tables.length) { - this[name].isCheckAll = true - } else { - this[name].isCheckAll = false - } - }, - changeSeletedMode() { - this.isOpenClipMode = !this.isOpenClipMode - this.errorTables = {} - if (this.isOpenClipMode) { - this.clipboardValue = this.selected.tables?.join(',') || '' - this.isFocus = true - } else { - this.getErrorTables(this.selected.tables) - } - }, - // 获取所有表 - getTables() { - this.loading = true - const { connectionId } = this - - const fn = this.hasPartition - ? metadataInstancesApi.pagePartitionTables({ - connectionId, - limit: 0, - syncPartitionTableEnable: this.syncPartitionTableEnable - }) - : metadataInstancesApi.pageTables({ connectionId, limit: 0 }) - - fn.then((res = {}) => { - let data = res.items || [] - let tables = data.map((it) => it.tableName) - let map = {} - data.forEach((el = {}) => { - const { tableName, tableComment, primaryKeyCounts = 0, uniqueIndexCounts = 0 } = el - if (tableComment || primaryKeyCounts || uniqueIndexCounts) { - map[tableName] = { tableComment, primaryKeyCounts, uniqueIndexCounts } - } - }) - this.tableMap = map - tables.sort((t1, t2) => (t1 > t2 ? 1 : t1 === t2 ? 0 : -1)) - this.table.tables = Object.freeze(tables) - }).finally(() => { - this.loading = false - }) - }, - //重新加载模型 - async reload() { - const data = await workerApi.getAvailableAgent() - if (!data?.result?.length) { - this.$message.error(this.$t('packages_form_agent_check_error')) - } else { - let config = { - title: this.$t('packages_form_connection_reload_schema_confirm_title'), - Message: this.$t('packages_form_connection_reload_schema_confirm_msg'), - } - this.$confirm(config.Message + '?', config.title, { - type: 'warning', - closeOnClickModal: false, - }).then((resFlag) => { - if (resFlag) { - this.showProgress = true - this.progress = 0 - this.testSchema() - } - }) - } - }, - //请求测试连接并获取进度 - testSchema() { - let parms = { - loadCount: 0, - loadFieldsStatus: 'loading', - } - this.loadFieldsStatus = 'loading' - connectionsApi.updateById(this.connectionId, parms).then((res) => { - if (this?.$refs?.test) { - let data = res - this.loadFieldsStatus = data.loadFieldsStatus //同步reload状态 - this.$refs.test.startByConnection(data, true) - this.getProgress() - } - }) - }, - // 获取加载进度 - getProgress(check = false) { - connectionsApi - .getNoSchema(this.connectionId) - .then((res) => { - let data = res - this.loadFieldsStatus = data.loadFieldsStatus //同步reload状态 - if (data.loadFieldsStatus === 'finished') { - this.progress = 100 - setTimeout(() => { - this.showProgress = false - this.progress = 0 //加载完成 - const nodeId = this.nodeId || this.$store.state?.dataflow.activeNodeId - const taskId = this.taskId || this.$store.state?.dataflow.taskId - - if (!check && taskId && nodeId) { - metadataInstancesApi - .deleteLogicSchema(taskId, { - nodeId, - }) - .then(() => { - this.getTables() //更新schema - }) - } else { - this.getTables() //更新schema - } - }, 1000) - } else { - let progress = Math.round((data.loadCount / data.tableCount) * 10000) / 100 - this.progress = progress ? progress : 0 - setTimeout(() => { - if (this?.$refs?.test) { - this.getProgress(true) - } - }, 1000) - } - }) - .catch(() => { - // this.$message.error(this.$t('packages_form_connection_reload_schema_fail')) - this.showProgress = false - this.progress = 0 //加载完成 - }) - }, - - updateAllChecked() { - this.table.isCheckAll = - this.filteredData.length > 0 && this.filteredData.every((item) => this.table.checked.indexOf(item) > -1) - }, - - updateSelectedAllChecked() { - this.selected.isCheckAll = - this.filterSelectedData.length > 0 && - this.filterSelectedData.every((item) => this.selected.checked.indexOf(item) > -1) - }, - - getTableInfo(table) { - return this.tableMap[table] || {} - }, - - handleFilterType() { - this.table.checked = [] - this.selected.checked = [] - if (this.filterType === 'All') return - - // 待复制表 - this.table.isCheckAll = false - - // 已选择表 - this.selected.tables = Object.freeze( - getPrimaryKeyTablesByType(this.selected.tables, this.filterType, this.tableMap), - ) - this.selected.isCheckAll = false - this.$emit('input', this.selected.tables) - // this.$emit('change', this.selected.tables) - }, - - async loadSchema() { - this.schemaLoading = true - const nodeId = this.nodeId || this.$store.state?.dataflow.activeNodeId - const taskId = this.taskId || this.$store.state?.dataflow.taskId - - await taskApi - .refreshSchema(taskId, { - nodeIds: nodeId, - keys: this.table.searchKeyword, - }) - .finally(() => { - this.schemaLoading = false - }) - - this.getTables() - }, - }, -} */