Commit 00a14ff4 by Sendya

fixed: style

parent e1c3f305
<template> <template>
<a-layout class="layout"> <a-layout class="layout">
<sider-menu :menus="menus" :theme="menuTheme" v-if="menuMode === 'inline'" :mode="menuMode" :collapsed="!siderOpen || collapsed" :collapsible="true"></sider-menu> <sider-menu
:menus="menus"
:theme="menuTheme"
v-if="menuMode === 'inline'"
:mode="menuMode"
:collapsed="!siderOpen || collapsed"
:collapsible="true"></sider-menu>
<a-layout> <a-layout>
<!-- layout header --> <!-- layout header -->
...@@ -25,7 +31,7 @@ ...@@ -25,7 +31,7 @@
import SiderMenu from '@/components/menu/SiderMenu' import SiderMenu from '@/components/menu/SiderMenu'
import LayoutHeader from './LayoutHeader' import LayoutHeader from './LayoutHeader'
import LayoutFooter from './LayoutFooter' import LayoutFooter from './LayoutFooter'
import {asyncRouterMap} from '@/router/index' import { asyncRouterMap } from '@/router/index'
import { mapState } from 'vuex' import { mapState } from 'vuex'
export default { export default {
...@@ -35,7 +41,7 @@ ...@@ -35,7 +41,7 @@
LayoutHeader, LayoutHeader,
LayoutFooter LayoutFooter
}, },
data() { data () {
return { return {
// light, dark // light, dark
menuTheme: 'light', menuTheme: 'light',
...@@ -45,7 +51,7 @@ ...@@ -45,7 +51,7 @@
menus: [] menus: []
} }
}, },
created() { created () {
this.menus = asyncRouterMap this.menus = asyncRouterMap
}, },
computed: { computed: {
...@@ -54,7 +60,7 @@ ...@@ -54,7 +60,7 @@
}) })
}, },
methods: { methods: {
toggle() { toggle () {
this.collapsed = !this.collapsed; this.collapsed = !this.collapsed;
}, },
} }
...@@ -93,7 +99,6 @@ ...@@ -93,7 +99,6 @@
position: relative; position: relative;
z-index: 10; z-index: 10;
.logo { .logo {
height: 64px; height: 64px;
position: relative; position: relative;
...@@ -124,14 +129,14 @@ ...@@ -124,14 +129,14 @@
&.light { &.light {
background-color: #fff; background-color: #fff;
box-shadow: 2px 0px 8px 0px rgba(29,35,41,0.05); box-shadow: 2px 0px 8px 0px rgba(29, 35, 41, 0.05);
.logo { .logo {
background: #fff; background: #fff;
box-shadow: 1px 1px 0px 0px #e8e8e8; box-shadow: 1px 1px 0px 0px #e8e8e8;
h1 { h1 {
color: #1890ff; color: unset;
} }
} }
...@@ -140,7 +145,6 @@ ...@@ -140,7 +145,6 @@
} }
} }
} }
.header { .header {
......
<template> <template>
<a-layout-sider :class="['sider', isMobile ? null : 'shadow', theme ]" width="256px" :collapsible="collapsible" v-model="collapsed" :trigger="null"> <a-layout-sider :class="['sider', isMobile ? null : 'shadow', theme ]" width="256px" :collapsible="collapsible"
v-model="collapsed" :trigger="null">
<div class="logo"> <div class="logo">
<router-link :to="{name:'dashboard'}"> <router-link :to="{name:'dashboard'}">
<img src="~@/assets/logo.svg" alt="logo"> <img src="~@/assets/logo.svg" alt="logo">
<h1>Ant Design Pro</h1> <h1>Ant Design Pro</h1>
</router-link> </router-link>
</div> </div>
<s-menu :collapsed="collapsed" :menu="menus" :theme="theme" @select="onSelect" :mode="mode" style="padding: 16px 0px;"></s-menu> <s-menu
:collapsed="collapsed"
:menu="menus"
:theme="theme"
@select="onSelect"
:mode="mode"
style="padding: 16px 0px;"></s-menu>
</a-layout-sider> </a-layout-sider>
</template> </template>
<script> <script>
import ALayoutSider from "ant-design-vue/es/layout/Sider" import ALayoutSider from "ant-design-vue/es/layout/Sider"
import SMenu from './index' import SMenu from './index'
export default { export default {
name: "SiderMenu", name: "SiderMenu",
components: { ALayoutSider, SMenu }, components: { ALayoutSider, SMenu },
...@@ -42,7 +50,7 @@ ...@@ -42,7 +50,7 @@
required: true required: true
} }
}, },
created() { created () {
}, },
computed: { computed: {
...@@ -51,7 +59,7 @@ ...@@ -51,7 +59,7 @@
} }
}, },
methods: { methods: {
onSelect(obj) { onSelect (obj) {
this.$emit('menuSelect', obj) this.$emit('menuSelect', obj)
} }
} }
......
...@@ -21,7 +21,12 @@ ...@@ -21,7 +21,12 @@
<div> <div>
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24"> <a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24">
<a-card class="project-list" :loading="loading" style="margin-bottom: 24px;" :bordered="false" title="进行中的项目" <a-card
class="project-list"
:loading="loading"
style="margin-bottom: 24px;"
:bordered="false"
title="进行中的项目"
:body-style="{ padding: 0 }"> :body-style="{ padding: 0 }">
<a slot="extra">全部项目</a> <a slot="extra">全部项目</a>
<div> <div>
...@@ -62,7 +67,13 @@ ...@@ -62,7 +67,13 @@
</a-list> </a-list>
</a-card> </a-card>
</a-col> </a-col>
<a-col style="padding: 0 12px" :xl="8" :lg="24" :md="24" :sm="24" :xs="24"> <a-col
style="padding: 0 12px"
:xl="8"
:lg="24"
:md="24"
:sm="24"
:xs="24">
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}"> <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
<div class="item-group"> <div class="item-group">
<a>操作一</a> <a>操作一</a>
......
...@@ -86,8 +86,8 @@ ...@@ -86,8 +86,8 @@
:data="loadData" :data="loadData"
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onChange }" :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onChange }"
> >
<template v-for="col in columns" v-if="col.scopedSlots" :slot="col.dataIndex" slot-scope="text, record, index"> <template v-for="(col, index) in columns" v-if="col.scopedSlots" :slot="col.dataIndex" slot-scope="text, record, index">
<div> <div :key="index">
<a-input <a-input
v-if="record.editable" v-if="record.editable"
style="margin: -5px 0" style="margin: -5px 0"
......
...@@ -25,7 +25,6 @@ ...@@ -25,7 +25,6 @@
.result { .result {
text-align: center; text-align: center;
width: 72%; width: 72%;
max-width: 560px;
margin: 0 auto; margin: 0 auto;
padding: 24px 0 8px; padding: 24px 0 8px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment