From 0aaf3cf893d80b571d87c996316b6ec82d0a02d3 Mon Sep 17 00:00:00 2001
From: chenghx <chenghx@nfex.com>
Date: 星期四, 02 八月 2018 15:27:22 +0800
Subject: [PATCH] 优化PageLayout布局、PageHeader增加logo
---
src/components/layout/PageLayout.vue | 42 +++++++++++++++++++++++++++---------------
1 files changed, 27 insertions(+), 15 deletions(-)
diff --git a/src/components/layout/PageLayout.vue b/src/components/layout/PageLayout.vue
index cc68ad2..1e9d9a8 100644
--- a/src/components/layout/PageLayout.vue
+++ b/src/components/layout/PageLayout.vue
@@ -1,17 +1,16 @@
<template>
<div style="margin: -24px -24px 0px">
- <page-header :breadcrumb="breadcrumb" :title="title">
- <div slot="content">
- <template v-if="this.$slots.desc">
- <slot name="desc"></slot>
- </template>
- <template v-else>
- {{desc}}
- </template>
+ <page-header :breadcrumb="breadcrumb" :title="title" :logo="avatar">
+ <slot slot="content" name="headerContent"></slot>
+ <div slot="content" v-if="!this.$slots.headerContent">
+ <p style="font-size: 14px;line-height: 1.5;color: rgba(0,0,0,.65)">{{desc}}</p>
+ <div class="link">
+ <template v-for="(link, index) in linkList">
+ <a :key="index" :href="link.href"><a-icon :type="link.icon" />{{link.title}}</a>
+ </template>
+ </div>
</div>
- <div slot="extra">
- <slot name="extra"></slot>
- </div>
+ <slot slot="extra" name="extra"></slot>
</page-header>
<div ref="page" style="margin: 24px 24px 0px">
<slot ></slot>
@@ -21,10 +20,11 @@
<script>
import PageHeader from '../page/PageHeader'
+import AIcon from 'vue-antd-ui/es/icon/icon'
export default {
name: 'PageLayout',
- components: {PageHeader},
- props: ['desc', 'title'],
+ components: {AIcon, PageHeader},
+ props: ['desc', 'title', 'avatar', 'linkList', 'extraImage'],
data () {
return {
breadcrumb: []
@@ -33,7 +33,7 @@
mounted () {
this.getBreadcrumb()
},
- beforeUpdate () {
+ updated () {
this.getBreadcrumb()
},
methods: {
@@ -44,6 +44,18 @@
}
</script>
-<style scoped>
+<style lang="less" scoped>
+ .link{
+ margin-top: 16px;
+ line-height: 24px;
+ a{
+ font-size: 14px;
+ margin-right: 32px;
+ i{
+ font-size: 22px;
+ margin-right: 8px;
+ }
+ }
+ }
</style>
--
Gitblit v1.9.1