Browse Source

[Refactor][UI] Refactor tenant manage using NSpace component. (#10879)

3.1.0-release
songjianet 2 years ago committed by GitHub
parent
commit
553159f780
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 38
      dolphinscheduler-ui/src/views/security/tenant-manage/index.module.scss
  2. 25
      dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx

38
dolphinscheduler-ui/src/views/security/tenant-manage/index.module.scss

@ -1,38 +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.
*/
.container {
width: 100%;
.header {
display: flex;
justify-content: space-between;
}
.table-card {
margin-top: 8px;
.pagination {
margin-top: 20px;
}
}
.pagination {
display: flex;
justify-content: center;
}
}

25
dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx

@ -25,12 +25,10 @@ import {
NCard,
NSpace
} from 'naive-ui'
import styles from './index.module.scss'
import { useTable } from './use-table'
import { SearchOutlined } from '@vicons/antd'
import TenantModal from './components/tenant-modal'
import { useI18n } from 'vue-i18n'
import Card from '@/components/card'
const tenementManage = defineComponent({
name: 'tenement-manage',
@ -93,9 +91,9 @@ const tenementManage = defineComponent({
render() {
const { t, loadingRef } = this
return (
<div class={styles.container}>
<NCard>
<div class={styles.header}>
<NSpace vertical>
<NCard size='small'>
<NSpace justify='space-between'>
<NButton
size='small'
onClick={this.handleModalChange}
@ -117,12 +115,10 @@ const tenementManage = defineComponent({
</NIcon>
</NButton>
</NSpace>
</div>
</NSpace>
</NCard>
<Card
title={t('security.tenant.tenant_manage')}
class={styles['table-card']}
>
<NCard size='small'>
<NSpace vertical>
<NDataTable
loading={loadingRef}
columns={this.columns}
@ -130,7 +126,7 @@ const tenementManage = defineComponent({
row-class-name='items'
scrollX={this.tableWidth}
/>
<div class={styles.pagination}>
<NSpace justify='center'>
<NPagination
v-model:page={this.page}
v-model:page-size={this.pageSize}
@ -141,8 +137,9 @@ const tenementManage = defineComponent({
onUpdatePage={this.requestData}
onUpdatePageSize={this.handleChangePageSize}
/>
</div>
</Card>
</NSpace>
</NSpace>
</NCard>
<TenantModal
showModalRef={this.showModalRef}
statusRef={this.statusRef}
@ -150,7 +147,7 @@ const tenementManage = defineComponent({
onCancelModal={this.onCancelModal}
onConfirmModal={this.onConfirmModal}
/>
</div>
</NSpace>
)
}
})

Loading…
Cancel
Save