Skip to content

H
huamu
Commit f628e96a authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

top-menu in navbar

parent f1dd58a0
Show whitespace changes
Inline Side-by-side
Showing with 201 additions and 13 deletions
src/util/menus.ts
View file @ f628e96a
......@@ -73,6 +73,81 @@ export default [
{
key: 'application',
name: '应用',
children: [],
children: [
{
list: [
{ name: '养老管理', id: 'page_a6073dc0-a70c-11ea-bbf4-6fdd8b50636a' },
{ name: '垃圾监管', id: 'page_9bf6bcb0-bd0b-11ea-aa4f-9d7cec320c12' },
{ name: '预案推荐' },
{ name: '志愿者管理' },
{ name: '稳商监管' },
],
},
{
list: [
{ name: '联勤联动', id: 'page_af847490-3937-11eb-8bd2-af9cb9e97668' },
{ name: '电子门铃', id: 'page_7dd43000-28bd-11eb-a455-67d7a1e16cfb' },
{ name: '党建管理' },
{ name: '规划管理' },
{ name: '物业管理' },
],
},
{
list: [
{ name: '疫情管控', id: 'page_b6134040-8869-11ea-8650-bb21e10eb77e' },
{ name: '春节帮困', id: 'page_e4ec9b30-4968-11eb-a659-8bbd9242be6e' },
{ name: '城运提效' },
{ name: '停车管理' },
{ name: '更多应用' },
],
},
{
list: [
{ name: '营商优化', id: 'page_b9efffb0-8aa2-11ea-8956-4db27eca528f' },
{ name: '电梯加装', id: 'page_87f75700-41d7-11eb-84c4-f9d93e21eaf4' },
{ name: '政企通讯' },
{ name: '人才公寓管理' },
],
},
],
},
{
key: 'ability',
name: '能力',
children: [
{
list: [
{
name: '填表机器人',
id: 'page_99c095b0-c1ec-11eb-b455-8573e34978b3',
},
{ name: '建言献策' },
],
},
{
list: [
{
name: '知识库推荐',
id: 'page_af847490-3937-11eb-8bd2-af9cb9e97668',
},
{ name: '问题上报' },
],
},
{
list: [
{
name: '15分钟服务圈模型',
id: 'page_90fa7af0-9f40-11eb-8841-4d34f1d622ba',
},
{ name: '服务获取', id: 'page_213eed40-a0bc-11eb-95d1-691952c8451e' },
],
},
{
list: [
{ name: '短信互动', id: 'page_e0fb11b0-f1b0-11ea-8dfd-198fd4af74bf' },
{ name: '活动参与' },
],
},
],
},
]
src/view/components/nav-bar.vue
View file @ f628e96a
......@@ -48,7 +48,7 @@
</n-icon>
</div>
<b>|</b>
<n-popover trigger="hover">
<n-popover trigger="hover" class="top-menu">
<template #trigger>
<div class="align-center menu-btn">
<n-icon
......@@ -61,8 +61,29 @@
</div>
</template>
<div class="menu">
<div class="parent"></div>
<div class="children"></div>
<div class="parent">
<div
v-for="menu in menus"
:key="menu.key"
:class="{ on: curMenu.key === menu.key }"
@click="curMenu = menu"
>
{{ menu.name }}
</div>
</div>
<div class="children">
<div v-for="(child, i) in curMenu.children" :key="i">
<h3 v-if="child.name">{{ child.name }}</h3>
<p
v-for="p in child.list"
:key="p.name"
:class="{ link: !!p.id }"
@click.prevent="toPage(p.id)"
>
{{ p.name }}
</p>
</div>
</div>
</div>
</n-popover>
</div>
......@@ -88,6 +109,9 @@ import nav1 from '@images/nav1.svg'
import nav2 from '@images/nav2.svg'
import nav3 from '@images/nav3.svg'
import nav5 from '@images/nav5.svg'
import menus from '@/util/menus'
const curMenu = ref(menus[0])
const showFilterDrawer = computed(() => store.state.showFilterDrawer)
const showBuildingDrawer = computed(() => store.state.showBuildingDrawer)
......@@ -177,6 +201,11 @@ watch(
},
)
const toPage = (id: string) => {
if (!id) return
window.parent._global_datamap_emit &&
window.parent._global_datamap_emit.emit('CHANGE_PAGE_BY_ID_EVENT', id)
}
</script>
<style lang="stylus" scoped>
......@@ -256,4 +285,45 @@ watch(
.n-input--focus
.n-input__border
border .01rem solid $red
.top-menu
width 12rem
height 2.5rem
.menu
border-radius .06rem
background $white-bg
display flex
color $font
.parent
margin .15rem 0
width 1rem
font-size .12rem
font-family $font-ping-medium
>div
border-radius .06rem
box-sizing border-box
padding .08rem .12rem
cursor pointer
&:hover
&.on
background $light-red
color $red
.children
display flex
justify-content space-around
>div
margin 0 .1rem
h3
font-size .13rem
margin-bottom .1rem
p
width 1.2rem
margin .1rem 0
font-size .1rem
&.link
color #000
font-weight bold
cursor pointer
&:hover
color $red
</style>
src/view/components/struct-modal.vue
View file @ f628e96a
......@@ -81,16 +81,49 @@
<div v-else-if="curKey === '1'" class="card">
<div class="row">
<span>书记</span>
<p>李嘉宁</p>
</div>
<div class="row">
<span>成员（按姓氏笔画排序）</span>
<p>
马建勇、王波、朱凤洲、孙建华、李卫鑫、吴惠萍、张佳锋、张晓山、陈斐轶、尚清、钱英、蒋国兴
</p>
</div>
<div class="row">
<span>党组织地址</span>
<p>内容</p>
</div>
</div>
<div v-else-if="curKey === '2'" class="card">
<div class="flex">
<div class="col">
<div class="row">
<span>党总支书记</span>
<p>内容</p>
</div>
<div class="row">
<span>党组织地址</span>
<p>内容</p>
</div>
<div class="row">
<span>党组织内党员数量</span>
<p>内容</p>
</div>
</div>
<div class="col">
<div class="row">
<span>党总支委员</span>
<p>内容</p>
</div>
<div class="row">
<span>党组织联系方式</span>
<p>内容</p>
</div>
</div>
</div>
</div>
<div
v-else-if="
curKey === '2' ||
curKey === '3' ||
(curKey.split('-').length === 3 && curMenu._hasSub)
"
......@@ -99,25 +132,35 @@
<div class="flex">
<div class="col">
<div class="row">
<span>党总支书记</span>
<p>内容</p>
<span>党委书记</span>
<p>陈倩倩</p>
</div>
<div class="row">
<span>党组织地址</span>
<span>党委副书记</span>
<p>杨燕华</p>
</div>
<div class="row">
<span>党组织联系方式</span>
<p>内容</p>
</div>
<div class="row">
<span>党组织内党员数量</span>
<span>党组织成员数量</span>
<p>内容</p>
</div>
</div>
<div class="col">
<div class="row">
<span>党总支委员</span>
<p>内容</p>
<span>党委成员</span>
<p>
徐学红、李华、蒋冬梅、戴萍、唐晔君、杨培君、曹静、袁若稼
</p>
</div>
<div class="row">
<span>党组织联系方式</span>
<span>党委副书记（兼职）</span>
<p>吴惠萍、张晓山</p>
</div>
<div class="row">
<span>党组织地址</span>
<p>内容</p>
</div>
</div>
......
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