初步构建起页面布局
This commit is contained in:
61
layouts/admin/header.uvue
Normal file
61
layouts/admin/header.uvue
Normal file
@@ -0,0 +1,61 @@
|
||||
<!-- CRMEB Admin Header组件 - uni-app版本 -->
|
||||
<template>
|
||||
<view class="admin-header">
|
||||
<!-- 导航栏容器 -->
|
||||
<view class="navbars-container">
|
||||
<!-- 面包屑导航 -->
|
||||
<AdminBreadcrumb
|
||||
:current-page-title="currentPageTitle"
|
||||
:is-collapsed="isCollapsed"
|
||||
@toggle-collapse="$emit('toggle-collapse')"
|
||||
/>
|
||||
|
||||
<!-- 标签页导航(如果启用) -->
|
||||
<AdminTagsView v-if="showTagsView" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AdminBreadcrumb from './breadcrumb.uvue'
|
||||
import AdminTagsView from './tags-view.uvue'
|
||||
|
||||
export default {
|
||||
name: 'AdminHeader',
|
||||
components: {
|
||||
AdminBreadcrumb,
|
||||
AdminTagsView
|
||||
},
|
||||
props: {
|
||||
isCollapsed: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
currentPageTitle: {
|
||||
type: String,
|
||||
default: '管理后台'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showTagsView: false // 是否显示标签页,暂时关闭
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.admin-header {
|
||||
height: 88rpx;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.navbars-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user