Browse Source

[Feature][UI Next] Delete Conditions Component (#7999)

* delete condition component
* rename file manage route
3.0.0/version-upgrade
Devosend 3 years ago committed by GitHub
parent
commit
713d0e7550
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 31
      dolphinscheduler-ui-next/src/components/conditions/index.module.scss
  2. 67
      dolphinscheduler-ui-next/src/components/conditions/index.tsx
  3. 6
      dolphinscheduler-ui-next/src/router/modules/resources.ts
  4. 17
      dolphinscheduler-ui-next/src/views/resource/file/index.module.scss
  5. 68
      dolphinscheduler-ui-next/src/views/resource/file/index.tsx

31
dolphinscheduler-ui-next/src/components/conditions/index.module.scss

@ -1,31 +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.
*/
.conditions-model {
display: flex;
justify-content: space-between;
align-items: center;
margin: 10px 0;
.right {
> .form-box {
.list {
float: right;
margin: 3px 0 3px 4px;
}
}
}
}

67
dolphinscheduler-ui-next/src/components/conditions/index.tsx

@ -1,67 +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 _ from 'lodash'
import { useI18n } from 'vue-i18n'
import { defineComponent, ref } from 'vue'
import { SearchOutlined } from '@vicons/antd'
import { NButton, NIcon, NInput, NSpace } from 'naive-ui'
import Card from '@/components/card'
import styles from './index.module.scss'
const Conditions = defineComponent({
name: 'Conditions',
emits: ['conditions'],
setup(props, ctx) {
const searchVal = ref()
const handleConditions = () => {
ctx.emit('conditions', _.trim(searchVal.value))
}
return { searchVal, handleConditions }
},
render() {
const { t } = useI18n()
const { $slots, handleConditions } = this
return (
<Card style={{ marginBottom: '5px' }}>
<div class={styles['conditions-model']}>
<NSpace>{$slots}</NSpace>
<div class={styles.right}>
<div class={styles['form-box']}>
<div class={styles.list}>
<NButton onClick={handleConditions}>
<NIcon>
<SearchOutlined />
</NIcon>
</NButton>
</div>
<div class={styles.list}>
<NInput
placeholder={t('resource.file.enter_keyword_tips')}
v-model={[this.searchVal, 'value']}
/>
</div>
</div>
</div>
</div>
</Card>
)
},
})
export default Conditions

6
dolphinscheduler-ui-next/src/router/modules/resources.ts

@ -25,13 +25,13 @@ const components: { [key: string]: Component } = utils.mapping(modules)
export default { export default {
path: '/resource', path: '/resource',
name: 'resource', name: 'resource',
redirect: { name: 'file' }, redirect: { name: 'file-manage' },
meta: { title: '资源中心' }, meta: { title: '资源中心' },
component: () => import('@/layouts/content'), component: () => import('@/layouts/content'),
children: [ children: [
{ {
path: '/resource/file', path: '/resource/file-manage',
name: 'file', name: 'file-manage',
component: components['file'], component: components['file'],
meta: { meta: {
title: '文件管理', title: '文件管理',

17
dolphinscheduler-ui-next/src/views/resource/file/index.module.scss

@ -68,4 +68,19 @@
} }
} }
} }
} }
.conditions-model {
display: flex;
justify-content: space-between;
align-items: center;
margin: 10px 0;
.right {
> .form-box {
.list {
float: right;
margin: 3px 0 3px 4px;
}
}
}
}

68
dolphinscheduler-ui-next/src/views/resource/file/index.tsx

@ -25,10 +25,18 @@ import {
watch, watch,
inject, inject,
} from 'vue' } from 'vue'
import { NDataTable, NButtonGroup, NButton, NPagination } from 'naive-ui' import {
NIcon,
NSpace,
NDataTable,
NButtonGroup,
NButton,
NPagination,
NInput,
} from 'naive-ui'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { SearchOutlined } from '@vicons/antd'
import Card from '@/components/card' import Card from '@/components/card'
import Conditions from '@/components/conditions'
import { useTable } from './table/use-table' import { useTable } from './table/use-table'
import { useFileState } from './use-file' import { useFileState } from './use-file'
import ResourceFolderModal from './folder' import ResourceFolderModal from './folder'
@ -96,9 +104,11 @@ export default defineComponent({
const { getResourceListState } = useFileState(setPagination) const { getResourceListState } = useFileState(setPagination)
const handleConditions = (val: string) => { const handleConditions = () => {
serachRef.value = val resourceListRef.value = getResourceListState(
resourceListRef.value = getResourceListState(fileId.value, val) fileId.value,
serachRef.value,
)
} }
const handleCreateFolder = () => { const handleCreateFolder = () => {
@ -144,6 +154,7 @@ export default defineComponent({
return { return {
fileId, fileId,
serachRef,
folderShowRef, folderShowRef,
uploadShowRef, uploadShowRef,
renameShowRef, renameShowRef,
@ -172,19 +183,40 @@ export default defineComponent({
} = this } = this
return ( return (
<div> <div>
<Conditions onConditions={handleConditions}> <Card style={{ marginBottom: '8px' }}>
<NButtonGroup> <div class={styles['conditions-model']}>
<NButton onClick={handleCreateFolder}> <NSpace>
{t('resource.file.create_folder')} <NButtonGroup>
</NButton> <NButton onClick={handleCreateFolder}>
<NButton onClick={handleCreateFile}> {t('resource.file.create_folder')}
{t('resource.file.create_file')} </NButton>
</NButton> <NButton onClick={handleCreateFile}>
<NButton onClick={handleUploadFile}> {t('resource.file.create_file')}
{t('resource.file.upload_files')} </NButton>
</NButton> <NButton onClick={handleUploadFile}>
</NButtonGroup> {t('resource.file.upload_files')}
</Conditions> </NButton>
</NButtonGroup>
</NSpace>
<div class={styles.right}>
<div class={styles['form-box']}>
<div class={styles.list}>
<NButton onClick={handleConditions}>
<NIcon>
<SearchOutlined />
</NIcon>
</NButton>
</div>
<div class={styles.list}>
<NInput
placeholder={t('resource.file.enter_keyword_tips')}
v-model={[this.serachRef, 'value']}
/>
</div>
</div>
</div>
</div>
</Card>
<Card title={t('resource.file.file_manage')}> <Card title={t('resource.file.file_manage')}>
<NDataTable <NDataTable
remote remote

Loading…
Cancel
Save