底部默认不展开

master
许宏杰 10 months ago
parent 54e216e387
commit e9bc411828

@ -28,5 +28,6 @@ const getters = {
queryParamsXiaoqu: (state) => state.xiaoqu.queryParmas, queryParamsXiaoqu: (state) => state.xiaoqu.queryParmas,
mapParmas: (state) => state.xiaoqu.mapParmas, mapParmas: (state) => state.xiaoqu.mapParmas,
netWorkintroduce: (state) => state.xiaoqu.netWorkintroduce, netWorkintroduce: (state) => state.xiaoqu.netWorkintroduce,
bottomPanel: (state) => state.xiaoqu.bottomPanel,
}; };
export default getters; export default getters;

@ -7,13 +7,18 @@ const xiaoqu = {
networkName: undefined, networkName: undefined,
}, },
netWorkintroduce: {}, netWorkintroduce: {},
bottomPanel: false,
}, },
mutations: { mutations: {
SET_PANEL: (state, boolean) => {
state.bottomPanel = !boolean;
},
//参数变化 //参数变化
CHANGE_QUERY: (state, query) => { CHANGE_QUERY: (state, query) => {
for (let key in query) { for (let key in query) {
state.queryParmas[key] = query[key]; state.queryParmas[key] = query[key];
} }
if (!query.xiaoquId) state.bottomPanel = false;
}, },
CHANGE_QUERY_MAP: (state, query) => { CHANGE_QUERY_MAP: (state, query) => {
for (let key in query) { for (let key in query) {
@ -25,6 +30,7 @@ const xiaoqu = {
}, },
//重置参数 //重置参数
RESET_QUERY: (state, query) => { RESET_QUERY: (state, query) => {
state.bottomPanel = true;
state.netWorkintroduce = { state.netWorkintroduce = {
intro: "", intro: "",
list: [], list: [],

@ -4,14 +4,14 @@
<div class="fold-btn" @click="togglePanel()"> <div class="fold-btn" @click="togglePanel()">
<img <img
:src=" :src="
isCollapsed bottomPanel
? require('@/assets/images/ui/arrow_left.jpg') ? require('@/assets/images/ui/arrow_left.jpg')
: require('@/assets/images/ui/arrow_right.jpg') : require('@/assets/images/ui/arrow_right.jpg')
" "
alt="" alt=""
/> />
</div> </div>
<div :class="['panel-main', { collapsed: isCollapsed }]"> <div :class="['panel-main', { collapsed: bottomPanel }]">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
@ -19,15 +19,18 @@
</template> </template>
<script> <script>
import { mapGetters } from "vuex";
export default { export default {
data() { data() {
return { return {};
isCollapsed: false,
};
}, },
computed: {
...mapGetters(["bottomPanel"]),
},
methods: { methods: {
togglePanel() { togglePanel() {
this.isCollapsed = !this.isCollapsed; this.$store.commit("SET_PANEL", this.bottomPanel);
}, },
}, },
}; };

@ -81,7 +81,6 @@ export default {
}, },
methods: { methods: {
changeColor(e) { changeColor(e) {
console.log(e);
this.$store.commit("CHANGE_QUERY", { this.$store.commit("CHANGE_QUERY", {
color: e.length > 0 ? e.toString() : undefined, color: e.length > 0 ? e.toString() : undefined,
}); });

Loading…
Cancel
Save