Skip to content

Commit

Permalink
样式优化, 调整底部栏位置
Browse files Browse the repository at this point in the history
  • Loading branch information
slowlyo committed Oct 7, 2023
1 parent 3bd28bb commit 79c73b4
Show file tree
Hide file tree
Showing 12 changed files with 163 additions and 84 deletions.
8 changes: 4 additions & 4 deletions admin-views/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,10 @@
"@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-react": "^1.0.6",
"ahooks": "^3.7.6",
"amis": "^3.4.0",
"amis-editor": "^5.5.0",
"amis-editor-core": "^5.5.0",
"amis-ui": "^3.4.0",
"amis": "^3.4.2",
"amis-editor": "^5.6.1",
"amis-editor-core": "^5.6.1",
"amis-ui": "^3.4.2",
"antd": "^5.9.0",
"axios": "^0.24.0",
"lodash": "^4.17.21",
Expand Down
204 changes: 142 additions & 62 deletions admin-views/pnpm-lock.yaml

Large diffs are not rendered by default.

5 changes: 2 additions & 3 deletions admin-views/src/layouts/DefaultLayout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import {useState} from 'react'
import CollapseTrigger from '@/layouts/components/CollapseTrigger'
import LayoutContent from '@/layouts/components/LayoutContent'
import useSetting from '@/hooks/useSetting'
import LayoutTabs from '@/layouts/components/LayoutTabs'

const {Header, Sider, Content} = Layout

Expand All @@ -23,12 +22,12 @@ const DefaultLayout = () => {
collapsed={collapsed}
collapsible
trigger={null}
collapsedWidth={64}>
collapsedWidth={65}>
<LayoutLogo onlyLogo={collapsed}/>
<LayoutMenu collapsed={collapsed} theme={getSetting('system_theme_setting.siderTheme', 'light')}/>
</Sider>
<Layout>
<Header className="h-[64px] leading-none flex justify-between items-center border-b p-0">
<Header className="h-[65px] leading-none flex justify-between items-center border-b p-0">
<div className="flex h-full items-center">
<CollapseTrigger collapsed={collapsed} toggle={setCollapsed}/>
<LayoutBreadcrumb/>
Expand Down
2 changes: 1 addition & 1 deletion admin-views/src/layouts/SmLayout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const SmLayout = () => {
placement="left"
onClose={() => setClosed(true)}
closeIcon={false}
headerStyle={{padding: 0, height: '64px'}}
headerStyle={{padding: 0, height: '65px'}}
title={<LayoutLogo/>}>
<LayoutMenu collapsed={!open} theme={getSetting('system_theme_setting.siderTheme')}/>
</Drawer>
Expand Down
7 changes: 4 additions & 3 deletions admin-views/src/layouts/TopLayout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,14 @@ const {Header, Content} = Layout

const TopLayout = () => {
const {getSetting} = useSetting()
const border = getSetting('system_theme_setting.topTheme') == 'dark' ? '' : 'border-b'

return (
<Layout className="h-screen overflow-hidden">
<Header className="h-[65px] border-b flex p-0 justify-between items-center leading-none">
<div className="flex">
<Header className={'h-[65px] flex p-0 justify-between items-center leading-none ' + border}>
<div className="flex h-full">
<LayoutLogo/>
<div className="leading-[65px]">
<div className="leading-[65px] h-full">
<LayoutMenu mode="horizontal" theme={getSetting('system_theme_setting.topTheme')}/>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion admin-views/src/layouts/TopMixLayout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const TopMixLayout = () => {

return (
<Layout className="h-screen overflow-hidden">
<Header className={"h-[64px] leading-none flex justify-between items-center p-0 " + (getSetting('system_theme_setting.siderTheme', 'light') == 'dark' ? '' : 'border-b')}>
<Header className={"h-[65px] leading-none flex justify-between items-center p-0 " + (getSetting('system_theme_setting.siderTheme', 'light') == 'dark' ? '' : 'border-b')}>
<div className="flex h-full items-center">
<LayoutLogo/>
<CollapseTrigger collapsed={collapsed} toggle={setCollapsed}/>
Expand Down
8 changes: 4 additions & 4 deletions admin-views/src/layouts/components/LayoutContent/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import QueueAnim from 'rc-queue-anim'
import {getFlattenRoutes} from '@/routes/helpers'
import {KeepAlive} from 'react-activation'
import useSetting from '@/hooks/useSetting'
import LayoutFooter from '@/layouts/components/LayoutFooter'
import LayoutTabs from '@/layouts/components/LayoutTabs'
import LayoutFooter from '@/layouts/components/LayoutFooter'


const LayoutContent = () => {
Expand Down Expand Up @@ -36,9 +36,9 @@ const LayoutContent = () => {
}, [pathname, routes])

return (
<div className="h-full overflow-hidden">
<div className="h-full overflow-hidden flex flex-col">
{getSetting('system_theme_setting.enableTab') && <LayoutTabs/>}
<div className="h-full p-5 overflow-auto">
<div className="flex-1 p-5 overflow-auto">
<QueueAnim className="relative"
type={[getSetting('system_theme_setting.animateInType'), getSetting('system_theme_setting.animateOutType')]}
duration={[getSetting('system_theme_setting.animateInDuration'), getSetting('system_theme_setting.animateInDuration')]}>
Expand All @@ -60,10 +60,10 @@ const LayoutContent = () => {
<Route path="*" component={lazyLoad(() => import('@/pages/404'))}/>
)}
</Switch>
<LayoutFooter/>
</div>
</QueueAnim>
</div>
<LayoutFooter/>
</div>
)
}
Expand Down
2 changes: 1 addition & 1 deletion admin-views/src/layouts/components/LayoutFooter/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ const LayoutFooter = () => {
}

return (
<div className="h-[65px] flex items-center justify-center">
<div className="h-[65px] flex items-center justify-center bg-white border-t">
<div dangerouslySetInnerHTML={{__html: getSetting('layout.footer')}}></div>
</div>
)
Expand Down
4 changes: 2 additions & 2 deletions admin-views/src/layouts/components/LayoutLogo/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ import useSettings from '@/hooks/useSetting'
const LayoutLogo = ({onlyLogo = false}) => {
const {settings, getSetting} = useSettings()
const width = onlyLogo ? ' w-full' : ' w-[220px]'
const textColor = getSetting("system_theme_setting.siderTheme") === 'dark' ? 'text-white' : 'text-black'
const textColor = getSetting("system_theme_setting.topTheme") === 'dark' || getSetting("system_theme_setting.siderTheme") === 'dark' ? 'text-white' : 'text-black'

return (
<div className={'h-[64px] flex justify-center items-center' + width}>
<div className={'h-[65px] flex justify-center items-center' + width}>
<div className="w-[35px]">
<Image width={35} preview={false} src={settings.logo}/>
</div>
Expand Down
1 change: 0 additions & 1 deletion admin-views/src/layouts/components/SettingPanel/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,6 @@ const SettingPanel = () => {
if (key === 'themeColor') setThemeColor(value)

const system_theme_setting = Object.assign({}, settings.system_theme_setting, {[key]: value})
console.log(system_theme_setting)
dispatch({
type: 'update-settings',
payload: {settings: {...settings, system_theme_setting}}
Expand Down
2 changes: 1 addition & 1 deletion admin-views/src/pages/amis/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ function AmisPage() {
style={{minHeight: initPage.loading ? "500px" : ""}}>
<AmisRender schema={schema}/>
</Spin>
<div className="h-20px"></div>
<div className="h-5"></div>
</>
)
}
Expand Down
2 changes: 1 addition & 1 deletion admin-views/src/pages/editor/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ const Editor = () => {
<AmisEditor onChange={setSchema} preview={preview}/>
</div>
</Card>
<div className="h-20px"></div>
<div className="h-5"></div>
</div>
)
}
Expand Down

0 comments on commit 79c73b4

Please sign in to comment.