vben
6 years ago
30 changed files with 271 additions and 177 deletions
@ -0,0 +1,47 @@ |
|||||
|
<template> |
||||
|
<span :class="`${prefixCls}__extra-fold`" @click="handleFold"> |
||||
|
<Icon :icon="getIcon" /> |
||||
|
</span> |
||||
|
</template> |
||||
|
<script lang="ts"> |
||||
|
import { defineComponent, unref, computed } from 'vue'; |
||||
|
import { RedoOutlined } from '@ant-design/icons-vue'; |
||||
|
import { useDesign } from '/@/hooks/web/useDesign'; |
||||
|
import { Tooltip } from 'ant-design-vue'; |
||||
|
import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting'; |
||||
|
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'; |
||||
|
|
||||
|
import Icon from '/@/components/Icon'; |
||||
|
|
||||
|
export default defineComponent({ |
||||
|
name: 'FoldButton', |
||||
|
components: { RedoOutlined, Tooltip, Icon }, |
||||
|
|
||||
|
setup() { |
||||
|
const { prefixCls } = useDesign('multiple-tabs-content'); |
||||
|
const { getShowMenu, setMenuSetting } = useMenuSetting(); |
||||
|
const { getShowHeader, setHeaderSetting } = useHeaderSetting(); |
||||
|
|
||||
|
const getIsUnFold = computed(() => { |
||||
|
return !unref(getShowMenu) && !unref(getShowHeader); |
||||
|
}); |
||||
|
|
||||
|
const getIcon = computed(() => { |
||||
|
return unref(getIsUnFold) ? 'codicon:screen-normal' : 'codicon:screen-full'; |
||||
|
}); |
||||
|
|
||||
|
function handleFold() { |
||||
|
const isScale = !unref(getShowMenu) && !unref(getShowHeader); |
||||
|
setMenuSetting({ |
||||
|
show: isScale, |
||||
|
hidden: !isScale, |
||||
|
}); |
||||
|
setHeaderSetting({ |
||||
|
show: isScale, |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
return { prefixCls, getIcon, handleFold }; |
||||
|
}, |
||||
|
}); |
||||
|
</script> |
||||
@ -1,11 +1,9 @@ |
|||||
export default { |
export default { |
||||
redo: '刷新当前', |
redo: '重新加载', |
||||
close: '关闭当前', |
close: '关闭标签页', |
||||
closeLeft: '关闭左侧', |
closeLeft: '关闭左侧标签页', |
||||
closeRight: '关闭右侧', |
closeRight: '关闭右侧标签页', |
||||
closeOther: '关闭其他', |
closeOther: '关闭其它标签页', |
||||
closeAll: '关闭全部', |
closeAll: '关闭全部标签页', |
||||
putAway: '收起', |
|
||||
unfold: '展开', |
|
||||
tooltipRedo: '刷新', |
tooltipRedo: '刷新', |
||||
}; |
}; |
||||
|
|||||
@ -0,0 +1,45 @@ |
|||||
|
// Used to configure the general configuration of some components without modifying the components
|
||||
|
|
||||
|
import type { SorterResult } from '../components/Table'; |
||||
|
|
||||
|
export default { |
||||
|
// basic-table setting
|
||||
|
table: { |
||||
|
// Form interface request general configuration
|
||||
|
// support xxx.xxx.xxx
|
||||
|
fetchSetting: { |
||||
|
// The field name of the current page passed to the background
|
||||
|
pageField: 'page', |
||||
|
// The number field name of each page displayed in the background
|
||||
|
sizeField: 'pageSize', |
||||
|
// Field name of the form data returned by the interface
|
||||
|
listField: 'items', |
||||
|
// Total number of tables returned by the interface field name
|
||||
|
totalField: 'total', |
||||
|
}, |
||||
|
// Number of pages that can be selected
|
||||
|
pageSizeOptions: ['10', '50', '80', '100'], |
||||
|
// Default display quantity on one page
|
||||
|
defaultPageSize: 10, |
||||
|
// Custom general sort function
|
||||
|
defaultSortFn: (sortInfo: SorterResult) => { |
||||
|
const { field, order } = sortInfo; |
||||
|
return { |
||||
|
// The sort field passed to the backend you
|
||||
|
field, |
||||
|
// Sorting method passed to the background asc/desc
|
||||
|
order, |
||||
|
}; |
||||
|
}, |
||||
|
// Custom general filter function
|
||||
|
defaultFilterFn: (data: Partial<Recordable<string[]>>) => { |
||||
|
return data; |
||||
|
}, |
||||
|
}, |
||||
|
// scrollbar setting
|
||||
|
scrollbar: { |
||||
|
// Whether to use native scroll bar
|
||||
|
// After opening, the menu, modal, drawer will change the pop-up scroll bar to native
|
||||
|
native: false, |
||||
|
}, |
||||
|
}; |
||||
Loading…
Reference in new issue