47 changed files with 175 additions and 102 deletions
@ -0,0 +1 @@ |
|||||
|
export { default as Menu } from './src/index.vue'; |
||||
@ -0,0 +1,64 @@ |
|||||
|
<template> |
||||
|
<ul :class="getClass" :style="getStyle"> |
||||
|
<slot></slot> |
||||
|
</ul> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts"> |
||||
|
import { defineComponent, ref, computed, CSSProperties, unref } from 'vue'; |
||||
|
import { useDesign } from '/@/hooks/web/useDesign'; |
||||
|
import { propTypes } from '/@/utils/propTypes'; |
||||
|
export default defineComponent({ |
||||
|
props: { |
||||
|
mode: propTypes.oneOf(['horizontal', 'vertical']).def('vertical'), |
||||
|
theme: propTypes.oneOf(['light', 'dark', 'primary']).def('light'), |
||||
|
activeName: propTypes.oneOfType([propTypes.string, propTypes.number]), |
||||
|
openNames: propTypes.array.def([]), |
||||
|
accordion: propTypes.bool, |
||||
|
width: propTypes.string.def('210px'), |
||||
|
}, |
||||
|
setup(props) { |
||||
|
const currentActiveName = ref(props.activeName); |
||||
|
const openedNames = ref<string[]>(); |
||||
|
|
||||
|
const { prefixCls } = useDesign('menu'); |
||||
|
|
||||
|
const getClass = computed(() => { |
||||
|
const { theme, mode } = props; |
||||
|
let curTheme = theme; |
||||
|
if (mode === 'vertical' && theme === 'primary') { |
||||
|
curTheme = 'light'; |
||||
|
} |
||||
|
return [ |
||||
|
prefixCls, |
||||
|
`${prefixCls}-${curTheme}`, |
||||
|
{ |
||||
|
[`${prefixCls}-${mode}`]: mode, |
||||
|
}, |
||||
|
]; |
||||
|
}); |
||||
|
|
||||
|
const getStyle = computed( |
||||
|
(): CSSProperties => { |
||||
|
const { mode, width } = props; |
||||
|
if (mode === 'vertical') { |
||||
|
return { |
||||
|
width: width, |
||||
|
}; |
||||
|
} |
||||
|
return {}; |
||||
|
} |
||||
|
); |
||||
|
|
||||
|
function updateActiveName() { |
||||
|
if (unref(currentActiveName) === undefined) { |
||||
|
currentActiveName.value = -1; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function updateOpened() {} |
||||
|
|
||||
|
return { getClass, getStyle }; |
||||
|
}, |
||||
|
}); |
||||
|
</script> |
||||
@ -0,0 +1,17 @@ |
|||||
|
export default { |
||||
|
okText: 'OK', |
||||
|
closeText: 'Close', |
||||
|
cancelText: 'Cancel', |
||||
|
loadingText: 'Loading...', |
||||
|
saveText: 'Save', |
||||
|
delText: 'Delete', |
||||
|
resetText: 'Reset', |
||||
|
searchText: 'Search', |
||||
|
queryText: 'Search', |
||||
|
|
||||
|
inputText: 'Please enter', |
||||
|
chooseText: 'Please choose', |
||||
|
|
||||
|
redo: 'Refresh', |
||||
|
back: 'Back', |
||||
|
}; |
||||
@ -1,11 +1,5 @@ |
|||||
export default { |
export default { |
||||
search: 'Search', |
|
||||
cancel: 'Cancel', |
|
||||
searchNotData: 'No search results yet', |
searchNotData: 'No search results yet', |
||||
toSearch: 'to search', |
toSearch: 'to search', |
||||
toNavigate: 'to navigate', |
toNavigate: 'to navigate', |
||||
toClose: 'to close', |
|
||||
|
|
||||
okText: 'Confirm', |
|
||||
cancelText: 'Cancel', |
|
||||
}; |
}; |
||||
|
|||||
@ -1,5 +0,0 @@ |
|||||
export default { |
|
||||
loadingText: 'Loading...', |
|
||||
cancelText: 'Close', |
|
||||
okText: 'Confirm', |
|
||||
}; |
|
||||
@ -1,3 +0,0 @@ |
|||||
export default { |
|
||||
search: 'Menu search', |
|
||||
}; |
|
||||
@ -1,4 +0,0 @@ |
|||||
export default { |
|
||||
cancelText: 'Close', |
|
||||
okText: 'Confirm', |
|
||||
}; |
|
||||
@ -0,0 +1,17 @@ |
|||||
|
export default { |
||||
|
okText: '确认', |
||||
|
closeText: '关闭', |
||||
|
cancelText: '取消', |
||||
|
loadingText: '加载中...', |
||||
|
saveText: '保存', |
||||
|
delText: '删除', |
||||
|
resetText: '重置', |
||||
|
searchText: '搜索', |
||||
|
queryText: '查询', |
||||
|
|
||||
|
inputText: '请输入', |
||||
|
chooseText: '请选择', |
||||
|
|
||||
|
redo: '刷新', |
||||
|
back: '返回', |
||||
|
}; |
||||
@ -1,10 +1,5 @@ |
|||||
export default { |
export default { |
||||
search: '搜索', |
|
||||
cancel: '取消', |
|
||||
searchNotData: '暂无搜索结果', |
searchNotData: '暂无搜索结果', |
||||
toSearch: '确认', |
toSearch: '确认', |
||||
toNavigate: '切换', |
toNavigate: '切换', |
||||
toClose: '关闭', |
|
||||
okText: '确认', |
|
||||
cancelText: '取消', |
|
||||
}; |
}; |
||||
|
|||||
@ -1,5 +0,0 @@ |
|||||
export default { |
|
||||
loadingText: '加载中...', |
|
||||
cancelText: '关闭', |
|
||||
okText: '确认', |
|
||||
}; |
|
||||
@ -1,3 +0,0 @@ |
|||||
export default { |
|
||||
search: '菜单搜索', |
|
||||
}; |
|
||||
@ -1,4 +0,0 @@ |
|||||
export default { |
|
||||
cancelText: '关闭', |
|
||||
okText: '确认', |
|
||||
}; |
|
||||
@ -1,9 +1,8 @@ |
|||||
export default { |
export default { |
||||
redo: '重新加载', |
reload: '重新加载', |
||||
close: '关闭标签页', |
close: '关闭标签页', |
||||
closeLeft: '关闭左侧标签页', |
closeLeft: '关闭左侧标签页', |
||||
closeRight: '关闭右侧标签页', |
closeRight: '关闭右侧标签页', |
||||
closeOther: '关闭其它标签页', |
closeOther: '关闭其它标签页', |
||||
closeAll: '关闭全部标签页', |
closeAll: '关闭全部标签页', |
||||
tooltipRedo: '刷新', |
|
||||
}; |
}; |
||||
|
|||||
Loading…
Reference in new issue