Browse Source
* refactor: Refactoring layout * chore: Delete unnecessary packages3.0.0/version-upgrade
23 changed files with 580 additions and 16 deletions
@ -0,0 +1,20 @@ |
|||||||
|
/* |
||||||
|
* 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. |
||||||
|
*/ |
||||||
|
|
||||||
|
.icon { |
||||||
|
margin: 0 12px; |
||||||
|
} |
@ -0,0 +1,51 @@ |
|||||||
|
/* |
||||||
|
* 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, toRefs } from 'vue' |
||||||
|
import { NDropdown, NIcon, NButton } from 'naive-ui' |
||||||
|
import styles from './index.module.scss' |
||||||
|
import { DownOutlined } from '@vicons/antd' |
||||||
|
import { useDataList } from './use-dataList' |
||||||
|
import { useDropDown } from './use-dropdown' |
||||||
|
|
||||||
|
const language = defineComponent({ |
||||||
|
name: 'language', |
||||||
|
setup() { |
||||||
|
const { state } = useDataList() |
||||||
|
const { handleSelect } = useDropDown(state) |
||||||
|
return { ...toRefs(state), handleSelect } |
||||||
|
}, |
||||||
|
render() { |
||||||
|
return ( |
||||||
|
<NDropdown |
||||||
|
trigger='hover' |
||||||
|
show-arrow |
||||||
|
options={this.languageOptions} |
||||||
|
on-select={this.handleSelect} |
||||||
|
> |
||||||
|
<NButton text> |
||||||
|
{this.chooseVal} |
||||||
|
<NIcon class={styles.icon}> |
||||||
|
<DownOutlined /> |
||||||
|
</NIcon> |
||||||
|
</NButton> |
||||||
|
</NDropdown> |
||||||
|
) |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
|
export default language |
@ -0,0 +1,40 @@ |
|||||||
|
/* |
||||||
|
* 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 { reactive, ref } from 'vue' |
||||||
|
|
||||||
|
export function useDataList() { |
||||||
|
const languageOptions = [ |
||||||
|
{ |
||||||
|
label: 'English', |
||||||
|
key: 'en', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '中文', |
||||||
|
key: 'zh', |
||||||
|
}, |
||||||
|
] |
||||||
|
|
||||||
|
const state = reactive({ |
||||||
|
chooseVal: ref('中文'), |
||||||
|
languageOptions: languageOptions |
||||||
|
}) |
||||||
|
|
||||||
|
return { |
||||||
|
state |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,28 @@ |
|||||||
|
/* |
||||||
|
* 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 { DropdownOption } from 'naive-ui' |
||||||
|
|
||||||
|
export function useDropDown(state: any) { |
||||||
|
const handleSelect = (key: string | number, option: DropdownOption) => { |
||||||
|
console.log(key, option) |
||||||
|
state.chooseVal = option.label |
||||||
|
} |
||||||
|
return { |
||||||
|
handleSelect |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,23 @@ |
|||||||
|
/* |
||||||
|
* 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. |
||||||
|
*/ |
||||||
|
|
||||||
|
.logo { |
||||||
|
width: 180px; |
||||||
|
height: 100%; |
||||||
|
margin-left: 12px; |
||||||
|
background: url('../../../../assets/images/logo.svg') 100% no-repeat; |
||||||
|
} |
@ -0,0 +1,29 @@ |
|||||||
|
/* |
||||||
|
* 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 styles from './index.module.scss' |
||||||
|
|
||||||
|
const logo = defineComponent({ |
||||||
|
name: 'logo', |
||||||
|
setup() {}, |
||||||
|
render() { |
||||||
|
return <div class={styles.logo}></div> |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
|
export default logo |
@ -0,0 +1,33 @@ |
|||||||
|
/* |
||||||
|
* 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 { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
width: 100%; |
||||||
|
height: 64px; |
||||||
|
|
||||||
|
.nav { |
||||||
|
margin-left: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.settings { |
||||||
|
display: flex; |
||||||
|
flex: 1; |
||||||
|
justify-content: flex-end; |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,55 @@ |
|||||||
|
/* |
||||||
|
* 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, toRefs } from 'vue' |
||||||
|
import styles from './index.module.scss' |
||||||
|
import { NMenu } from 'naive-ui' |
||||||
|
import Logo from '../logo' |
||||||
|
import Language from '../language' |
||||||
|
import User from '../user' |
||||||
|
import { useDataList } from './use-dataList' |
||||||
|
import { useMenuClick } from './use-menuClick' |
||||||
|
|
||||||
|
const navbar = defineComponent({ |
||||||
|
name: 'navbar', |
||||||
|
setup() { |
||||||
|
const { state } = useDataList() |
||||||
|
const { handleMenuClick } = useMenuClick() |
||||||
|
return { ...toRefs(state), handleMenuClick } |
||||||
|
}, |
||||||
|
render() { |
||||||
|
return ( |
||||||
|
<div class={styles.container}> |
||||||
|
<Logo /> |
||||||
|
<div class={styles.nav}> |
||||||
|
<NMenu |
||||||
|
v-model={[this.activeKey, 'value']} |
||||||
|
mode='horizontal' |
||||||
|
options={this.menuOptions} |
||||||
|
onUpdateValue={this.handleMenuClick} |
||||||
|
/> |
||||||
|
</div> |
||||||
|
<div class={styles.settings}> |
||||||
|
<Language /> |
||||||
|
<User /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
) |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
|
export default navbar |
@ -0,0 +1,70 @@ |
|||||||
|
/* |
||||||
|
* 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 { reactive, ref, h } from 'vue' |
||||||
|
import { NIcon } from 'naive-ui' |
||||||
|
import { |
||||||
|
HomeOutlined, ProfileOutlined, FolderOutlined, DatabaseOutlined, DesktopOutlined, SafetyCertificateOutlined |
||||||
|
} from '@vicons/antd' |
||||||
|
|
||||||
|
export function useDataList() { |
||||||
|
const renderIcon = (icon:any) => { |
||||||
|
return () => h(NIcon, null, { default: () => h(icon) }) |
||||||
|
} |
||||||
|
|
||||||
|
const menuOptions = [ |
||||||
|
{ |
||||||
|
label: '首页', |
||||||
|
key: 'home', |
||||||
|
icon: renderIcon(HomeOutlined), |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '项目管理', |
||||||
|
key: 'project', |
||||||
|
icon: renderIcon(ProfileOutlined) |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '资源中心', |
||||||
|
key: 'resources', |
||||||
|
icon: renderIcon(FolderOutlined), |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '数据源中心', |
||||||
|
key: 'datasource', |
||||||
|
icon: renderIcon(DatabaseOutlined), |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '监控中心', |
||||||
|
key: 'monitor', |
||||||
|
icon: renderIcon(DesktopOutlined), |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '安全中心', |
||||||
|
key: 'security', |
||||||
|
icon: renderIcon(SafetyCertificateOutlined), |
||||||
|
} |
||||||
|
] |
||||||
|
|
||||||
|
const state = reactive({ |
||||||
|
activeKey: ref('home'), |
||||||
|
menuOptions: menuOptions |
||||||
|
}) |
||||||
|
|
||||||
|
return { |
||||||
|
state |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,33 @@ |
|||||||
|
/* |
||||||
|
* 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 { useRouter } from 'vue-router' |
||||||
|
import type { Router } from 'vue-router' |
||||||
|
import { MenuOption } from 'naive-ui'
|
||||||
|
|
||||||
|
export function useMenuClick() { |
||||||
|
const router: Router = useRouter() |
||||||
|
|
||||||
|
const handleMenuClick = (key: string, item: MenuOption) => { |
||||||
|
console.log(key, item) |
||||||
|
router.push({ path: 'home' }) |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
handleMenuClick |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,20 @@ |
|||||||
|
/* |
||||||
|
* 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. |
||||||
|
*/ |
||||||
|
|
||||||
|
.icon { |
||||||
|
margin: 0 12px; |
||||||
|
} |
@ -0,0 +1,54 @@ |
|||||||
|
/* |
||||||
|
* 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, toRefs } from 'vue' |
||||||
|
import { NDropdown, NIcon, NButton } from 'naive-ui' |
||||||
|
import styles from './index.module.scss' |
||||||
|
import { DownOutlined, UserOutlined } from '@vicons/antd' |
||||||
|
import { useDataList } from './use-dataList' |
||||||
|
import { useDropDown } from './use-dropdown' |
||||||
|
|
||||||
|
const user = defineComponent({ |
||||||
|
name: 'user', |
||||||
|
setup() { |
||||||
|
const { state } = useDataList() |
||||||
|
const { handleSelect } = useDropDown() |
||||||
|
return { ...toRefs(state), handleSelect } |
||||||
|
}, |
||||||
|
render() { |
||||||
|
return ( |
||||||
|
<NDropdown |
||||||
|
trigger='hover' |
||||||
|
show-arrow |
||||||
|
options={this.profileOptions} |
||||||
|
on-select={this.handleSelect} |
||||||
|
> |
||||||
|
<NButton text> |
||||||
|
<NIcon class={styles.icon}> |
||||||
|
<UserOutlined /> |
||||||
|
</NIcon> |
||||||
|
admin |
||||||
|
<NIcon class={styles.icon}> |
||||||
|
<DownOutlined /> |
||||||
|
</NIcon> |
||||||
|
</NButton> |
||||||
|
</NDropdown> |
||||||
|
) |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
|
export default user |
@ -0,0 +1,49 @@ |
|||||||
|
/* |
||||||
|
* 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 { reactive, ref, h } from 'vue' |
||||||
|
import { NIcon } from 'naive-ui' |
||||||
|
import { |
||||||
|
UserOutlined, LogoutOutlined |
||||||
|
} from '@vicons/antd' |
||||||
|
|
||||||
|
export function useDataList() { |
||||||
|
const renderIcon = (icon:any) => { |
||||||
|
return () => h(NIcon, null, { default: () => h(icon) }) |
||||||
|
} |
||||||
|
|
||||||
|
const profileOptions = [ |
||||||
|
{ |
||||||
|
label: '用户信息', |
||||||
|
key: 'profile', |
||||||
|
icon: renderIcon(UserOutlined), |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '退出登录', |
||||||
|
key: 'logout', |
||||||
|
icon: renderIcon(LogoutOutlined), |
||||||
|
}, |
||||||
|
] |
||||||
|
|
||||||
|
const state = reactive({ |
||||||
|
profileOptions: profileOptions |
||||||
|
}) |
||||||
|
|
||||||
|
return { |
||||||
|
state |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,27 @@ |
|||||||
|
/* |
||||||
|
* 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 { DropdownOption } from 'naive-ui' |
||||||
|
|
||||||
|
export function useDropDown() { |
||||||
|
const handleSelect = (key: string | number, option: DropdownOption) => { |
||||||
|
console.log(key, option) |
||||||
|
} |
||||||
|
return { |
||||||
|
handleSelect |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,38 @@ |
|||||||
|
/* |
||||||
|
* 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 { NLayout, NLayoutContent, NLayoutHeader } from 'naive-ui' |
||||||
|
import NavBar from './components/navbar' |
||||||
|
|
||||||
|
const Content = defineComponent({ |
||||||
|
name: 'Content', |
||||||
|
render() { |
||||||
|
return ( |
||||||
|
<NLayout> |
||||||
|
<NLayoutHeader> |
||||||
|
<NavBar></NavBar> |
||||||
|
</NLayoutHeader> |
||||||
|
<NLayoutContent> |
||||||
|
<router-view /> |
||||||
|
</NLayoutContent> |
||||||
|
</NLayout> |
||||||
|
) |
||||||
|
}, |
||||||
|
}) |
||||||
|
|
||||||
|
export default Content |
Loading…
Reference in new issue