This is an automated email from the ASF dual-hosted git repository.
zhongjiajie pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-seatunnel.git
The following commit(s) were added to refs/heads/dev by this push:
new 5abeb45e3 [Feat][UI] Add the edit in the data pipes. (#2352)
5abeb45e3 is described below
commit 5abeb45e32c44739384c20cecb02a9c55feb50be
Author: songjianet <[email protected]>
AuthorDate: Wed Aug 3 15:29:54 2022 +0800
[Feat][UI] Add the edit in the data pipes. (#2352)
---
seatunnel-ui/src/locales/en_US/user-manage.ts | 2 +-
seatunnel-ui/src/router/data-pipes.ts | 8 ++
seatunnel-ui/src/views/data-pipes/edit/index.tsx | 100 +++++++++++++++++++++
seatunnel-ui/src/views/data-pipes/edite/index.tsx | 27 ------
.../src/views/user-manage/list/use-table.ts | 6 +-
5 files changed, 112 insertions(+), 31 deletions(-)
diff --git a/seatunnel-ui/src/locales/en_US/user-manage.ts
b/seatunnel-ui/src/locales/en_US/user-manage.ts
index fd8d93fd4..fe8da88bd 100644
--- a/seatunnel-ui/src/locales/en_US/user-manage.ts
+++ b/seatunnel-ui/src/locales/en_US/user-manage.ts
@@ -26,7 +26,7 @@ export default {
operation: 'Operation',
enable: 'Enable',
disable: 'Disable',
- edite: 'Edite',
+ edit: 'Edit',
delete: 'Delete',
active: 'Active',
inactive: 'Inactive',
diff --git a/seatunnel-ui/src/router/data-pipes.ts
b/seatunnel-ui/src/router/data-pipes.ts
index 6a7726cc7..684d0ea87 100644
--- a/seatunnel-ui/src/router/data-pipes.ts
+++ b/seatunnel-ui/src/router/data-pipes.ts
@@ -45,6 +45,14 @@ export default {
meta: {
title: 'data-pipes-detail'
}
+ },
+ {
+ path: '/data-pipes/:dataPipeCode/edit',
+ name: 'data-pipes-edit',
+ component: components['data-pipes-edit'],
+ meta: {
+ title: 'data-pipes-edit'
+ }
}
]
}
diff --git a/seatunnel-ui/src/views/data-pipes/edit/index.tsx
b/seatunnel-ui/src/views/data-pipes/edit/index.tsx
new file mode 100644
index 000000000..28f33bb01
--- /dev/null
+++ b/seatunnel-ui/src/views/data-pipes/edit/index.tsx
@@ -0,0 +1,100 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { defineComponent } from 'vue'
+import {
+ NBreadcrumb,
+ NBreadcrumbItem,
+ NButton,
+ NCard,
+ NSpace,
+ NInput,
+ NIcon,
+ NTooltip
+} from 'naive-ui'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import { BulbOutlined } from '@vicons/antd'
+import MonacoEditor from '@/components/monaco-editor'
+import type { Router } from 'vue-router'
+
+const DataPipesEdit = defineComponent({
+ setup() {
+ const { t } = useI18n()
+ const router: Router = useRouter()
+
+ const handleClickDataPipes = () => {
+ router.push({ path: '/data-pipes/list' })
+ }
+
+ return { t, handleClickDataPipes }
+ },
+ render() {
+ return (
+ <NSpace vertical>
+ <NCard>
+ {{
+ header: () => (
+ <NSpace align='center'>
+ <NBreadcrumb>
+ <NBreadcrumbItem onClick={this.handleClickDataPipes}>
+ {this.t('data_pipes.data_pipes')}
+ </NBreadcrumbItem>
+
<NBreadcrumbItem>{this.t('data_pipes.edit')}</NBreadcrumbItem>
+ </NBreadcrumb>
+ </NSpace>
+ ),
+ 'header-extra': () => (
+ <NSpace>
+ <NButton secondary>{this.t('data_pipes.cancel')}</NButton>
+ <NButton secondary>{this.t('data_pipes.save')}</NButton>
+ </NSpace>
+ )
+ }}
+ </NCard>
+ <NCard>
+ <NSpace align='center'>
+ <span>{this.t('data_pipes.name')}</span>
+ <NSpace align='center'>
+ <NInput
+ clearable
+ maxlength='100'
+ showCount
+ style={{ width: '600px' }}
+ />
+ <NTooltip placement='right' trigger='hover'>
+ {{
+ default: () => <span>{this.t('data_pipes.name_tips')}</span>,
+ trigger: () => (
+ <NIcon size='20' style={{ cursor: 'pointer' }}>
+ <BulbOutlined />
+ </NIcon>
+ )
+ }}
+ </NTooltip>
+ </NSpace>
+ </NSpace>
+ </NCard>
+ <NCard>
+ <MonacoEditor />
+ </NCard>
+ </NSpace>
+ )
+ }
+})
+
+export default DataPipesEdit
diff --git a/seatunnel-ui/src/views/data-pipes/edite/index.tsx
b/seatunnel-ui/src/views/data-pipes/edite/index.tsx
deleted file mode 100644
index 3d8c7d93c..000000000
--- a/seatunnel-ui/src/views/data-pipes/edite/index.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { defineComponent } from 'vue'
-
-const DataPipesEdit = defineComponent({
- setup() {},
- render() {
- return <div></div>
- }
-})
-
-export default DataPipesEdit
diff --git a/seatunnel-ui/src/views/user-manage/list/use-table.ts
b/seatunnel-ui/src/views/user-manage/list/use-table.ts
index d57d0cab2..45c67ade2 100644
--- a/seatunnel-ui/src/views/user-manage/list/use-table.ts
+++ b/seatunnel-ui/src/views/user-manage/list/use-table.ts
@@ -65,8 +65,8 @@ export function useTable() {
h(NButton, { text: true }, t('user_manage.enable')),
h(
NButton,
- { text: true, onClick: () => handleEdite(row) },
- t('user_manage.edite')
+ { text: true, onClick: () => handleEdit(row) },
+ t('user_manage.edit')
),
h(
NButton,
@@ -79,7 +79,7 @@ export function useTable() {
]
}
- const handleEdite = (row: any) => {
+ const handleEdit = (row: any) => {
state.showFormModal = true
state.status = 1
state.row = row
