index.vue
3.25 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<script>
// import PreView from '@/pages/preview';
// import Sidebar from './components/sidebar.vue'
import '@/components/core/styles/index.scss'
const sidebarMenus = [
{
label: '我的作品',
value: 'workManager',
antIcon: 'bars',
key: '1'
},
{
label: '数据中心',
value: 'dataCenter',
antIcon: 'snippets',
key: '2',
children: [
{
label: '基础数据',
value: 'basicData',
antIcon: 'snippets',
key: '2-1'
},
{
label: '表单统计',
value: 'formData',
antIcon: 'snippets',
key: '2-2'
}
]
},
{
label: '模板中心',
value: 'templateCenter',
antIcon: 'snippets',
key: '3',
children: [
{
label: '免费模板',
value: 'freeTemplates',
antIcon: 'snippets',
key: '3-1'
}
]
},
{
label: '账号中心',
value: 'freeTemplate',
antIcon: 'appstore',
key: '4'
}
]
export default {
components: {
// PreView,
// Sidebar
},
render (h) {
return (
<a-layout id="luban-work-manager-layout" style={{ height: '100vh' }}>
<a-layout-header class="header">
<div class="logo">鲁班 H5</div>
{/* TODO we can show the plugins shortcuts here */}
<a-dropdown style={{ float: 'right', background: 'transparent', margin: '16px 28px 16px 0' }}>
<a-menu slot="overlay" onClick={() => {}}>
<a-menu-item key="1">
<span>someone@luban</span>
</a-menu-item>
<a-menu-divider />
<a-menu-item key="2"><a-icon type="setting" />账号设置</a-menu-item>
<a-menu-item key="3"><a-icon type="logout" />退出登录</a-menu-item>
</a-menu>
<a-avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
</a-dropdown>
</a-layout-header>
<a-layout>
<a-layout-sider width="160" style="background: #fff">
<a-menu
mode="inline"
// defaultSelectedKeys={['1']}
defaultOpenKeys={['1', '2', '3']}
style="height: 100%"
>
{
sidebarMenus.map(menu => (
menu.children
? <a-sub-menu key={menu.key}>
<span slot="title"><a-icon type={menu.antIcon} />{menu.label}</span>
{
(menu.children).map(submenu => (<a-menu-item key={submenu.key}>{submenu.label}</a-menu-item>))
}
</a-sub-menu>
: <a-menu-item key={menu.key}>
<a-icon type={menu.antIcon} />
<span>{menu.label}</span>
</a-menu-item>
))
}
</a-menu>
</a-layout-sider>
<a-layout style="padding: 0 24px 24px">
<a-layout-content style={{ padding: '24px', margin: 0, minHeight: '280px' }}>
<router-view />
</a-layout-content>
</a-layout>
</a-layout>
{/** <PreviewDialog visible={this.previewVisible} handleClose={() => { this.previewVisible = false }} /> */}
</a-layout>)
}
}
</script>