<template>
|
<div>
|
<div class="map-campus-serarch">
|
<el-input class="search-input"
|
placeholder="校园搜索…"
|
v-model="input3">
|
</el-input>
|
<el-button-group>
|
<el-button @click="navigationShow"
|
class="deblurring"
|
icon="el-icon-my-path"></el-button>
|
<el-button class="deblurring"
|
type="primary"
|
icon="el-icon-my-search"></el-button>
|
</el-button-group>
|
</div>
|
<div class="map-campus-shortcut">
|
<div class="shortcut-box">
|
<ul>
|
<li><img src="" alt=""><span>党群机构</span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
<li><img src="" alt=""><span></span></li>
|
</ul>
|
</div>
|
|
</div>
|
</div>
|
</template>
|
|
<script>
|
|
import { mapGetters } from 'vuex'
|
|
export default {
|
name: 'campusBuildingSearch',
|
data () {
|
return {
|
shortcutList: [
|
{
|
bgimg: '/img/search/',
|
span: '党群机构'
|
}
|
]
|
}
|
},
|
computed: {
|
...mapGetters([
|
// 校内导航的显示关闭
|
'campusNavFlag'
|
])
|
},
|
methods: {
|
navigationShow () {
|
if (this.campusNavFlag == false) {
|
this.$store.commit('SET_CAMPUSNAVFLAG', true)
|
}
|
}
|
}
|
|
}
|
</script>
|
|
<style lang='scss' scope>
|
.map-campus-serarch {
|
position: fixed;
|
top: 100px;
|
left: 0;
|
right: 0;
|
bottom: auto;
|
margin: auto;
|
width: 320px;
|
height: 40px;
|
z-index: 11;
|
border-radius: 5px;
|
box-shadow: 0 0 10px 2px #666;
|
|
.search-input {
|
float: left;
|
width: 240px;
|
border-radius: 5px 0 0 5px;
|
|
input {
|
border: none;
|
border-right: 1px solid #dcdfe6;
|
border-radius: 5px 0 0 5px;
|
}
|
}
|
|
.el-button-group {
|
float: left;
|
width: 80px;
|
|
.el-button {
|
margin: 0;
|
position: relative;
|
width: 40px;
|
height: 40px;
|
border-radius: 0;
|
border: none;
|
|
i {
|
margin: auto;
|
position: absolute;
|
top: 0;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
}
|
}
|
|
.el-button:nth-child(2) {
|
border-radius: 0 5px 5px 0;
|
}
|
}
|
}
|
</style>
|
