Commit f54df34a by fengfan

center

parent 90b95a88
...@@ -16,6 +16,7 @@ export default { ...@@ -16,6 +16,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
.box { .box {
margin: 3rem 0 0 5rem;
width: 6rem; width: 6rem;
height: 1.5rem; height: 1.5rem;
font-size: 0.4rem; font-size: 0.4rem;
...@@ -34,6 +35,7 @@ export default { ...@@ -34,6 +35,7 @@ export default {
.up { .up {
background: url(../assets/img/up.png) no-repeat left top; background: url(../assets/img/up.png) no-repeat left top;
background-size: auto 100%; background-size: auto 100%;
margin-right: 1rem;
} }
.down { .down {
background: url(../assets/img/down.png) no-repeat left top; background: url(../assets/img/down.png) no-repeat left top;
......
<template> <template>
<div class="page"> <div class="page">
<content-box :btnbackshow="btnbackshow" @btnbackclick="backfn">
<div class="content"> <div class="content">
<page-title
<div class="subtitle">{{subtitle.name||'全国'}} :</div> :titledata="titledata"
<div id="scrollbox"> :titleactive="titleactive"
@titleclick="titleclickfn"
/>
</div>
<div id="scrollbox" v-if="titleactive==0">
<vuescroll :ops="ops"> <vuescroll :ops="ops">
<div <div
class="btn" class="btn"
:class="{activearea:activearea.code == item.code}" :class="{activearea:activearea== index}"
v-for="(item,index) in btnlist" v-for="(item,index) in btnlist"
:key="index" :key="index"
@click="showC(item)" @click="go(index)"
>{{item.name}}</div> >{{item.name}}</div>
</vuescroll> </vuescroll>
</div> </div>
<page-title v-if="activearea.code === subtitle.code || activearea.name=='全国'" <updown v-if="titleactive==1" @up=up @down=down class='btns' />
class="titlePosition"
:titledata="titledata"
:titleactive="titleactive"
@titleclick="titleclickfn"
/>
</div>
</content-box>
</div> </div>
</template> </template>
<script> <script>
import { send } from "@/service/ctrapi"; import { send } from "@/service/ctrapi";
import contentBox from "../components/contentBox"; import updown from "../components/updown";
import pageTitle from "../components/pageTitle"; import pageTitle from "../components/pageTitle";
import vuescroll from "vuescroll"; import vuescroll from "vuescroll";
export default { export default {
components: { contentBox, pageTitle, vuescroll }, components: { updown, pageTitle,vuescroll },
data() { data() {
return { return {
btnlist: [], titledata: ["中心介绍", "发展历程"],
titledata: ["24小时", "近一周", "近一月", "近一年"],
msgPathCfg:{
root:'/预警监控',
list1:'/省级',
subtitle:'/时间范围',
},
titleactive: 0, titleactive: 0,
activearea: {}, activearea:0,
subtitle: {}, btnlist:[],
btnbackshow: false,
ops: { ops: {
bar: { bar: {
background: "#41c9ff", background: "#41c9ff",
...@@ -59,62 +48,32 @@ export default { ...@@ -59,62 +48,32 @@ export default {
}; };
}, },
mounted() { mounted() {
this.showP();
},
methods: {
backfn() {
send(`${this.msgPathCfg.root}`, []);
this.showP();
},
showP() {
this.$axios this.$axios
.get("http://123.56.149.208:8091/external/get/city/all") .get("http://123.56.149.208:8091/external/get/city/all")
.then(val => { .then(val => {
this.btnlist = val.data.data; this.btnlist = val.data.data;
this.btnbackshow = false;
this.titleactive = 0
this.activearea = this.btnlist[0];
this.subtitle = {};
}); });
}, },
showC(item) { methods: {
if (this.btnbackshow) { go(i){
this.activearea = item; this.activearea = i
send( send(`/中心建设/中心介绍/${this.btnlist[i].name}`,[])
`${this.msgPathCfg.root}${this.msgPathCfg.list1}/${this.subtitle.name}/H5/${this.activearea.name}`,
[]
);
} else if (item.name === "全国") {
this.activearea = item;
send(`${this.msgPathCfg.root}${this.msgPathCfg.subtitle}/${this.titleactive}`, []);
} else {
this.$axios
.get(`http://123.56.149.208:8091/external/get/city/id/${item.code}`)
.then(val => {
this.btnlist = val.data.data;
this.btnbackshow = true;
this.subtitle = item;
this.activearea = item;
send(
`${this.msgPathCfg.root}${this.msgPathCfg.list1}/${this.subtitle.name}${this.msgPathCfg.subtitle}/${this.titleactive}`,
[]
);
});
}
}, },
titleclickfn(i) { titleclickfn(i) {
this.titleactive = i; this.titleactive = i
if (this.btnbackshow && this.activearea == this.subtitle) { if(i==0){
send( send(`/中心建设/中心介绍`,[])
`${this.msgPathCfg.root}${this.msgPathCfg.list1}/${this.subtitle.name}${this.msgPathCfg.subtitle}/${this.titleactive}`, this.go(0)
[] }else{
); send(`/中心建设/大事记`,[])
} else if (this.activearea.name === "全国") {
send(`${this.msgPathCfg.root}${this.msgPathCfg.subtitle}/${this.titleactive}`, []);
} else {
// send( `${this.msgPathCfg.root}${this.msgPathCfg.list1}/${this.subtitle.name}${this.msgPathCfg.subtitle}/${this.titleactive}`, []);
}
} }
},
up() {
send(`/中心建设/大事记/Up`,[])
},
down() {
send(`/中心建设/大事记/Down`,[])
},
} }
}; };
</script> </script>
...@@ -133,10 +92,14 @@ export default { ...@@ -133,10 +92,14 @@ export default {
padding-left: 1rem; padding-left: 1rem;
text-align: left; text-align: left;
} }
.btns {
margin: 3rem 0 0 3rem;
}
#scrollbox { #scrollbox {
width: 15.5rem; width: 15.5rem;
height: 9rem; height: 9rem;
margin-left: 1rem; margin-left: 2rem;
margin-top: 0.5rem; margin-top: 0.5rem;
} }
.btn { .btn {
...@@ -154,15 +117,6 @@ export default { ...@@ -154,15 +117,6 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
position: relative; position: relative;
} }
.subtitle {
margin: 0.5rem 0 0.5rem 1rem;
color: #fff;
font-size: 0.4rem;
text-shadow: 0.1rem 0rem 0.5rem rgba(255, 255, 255, 0.3),
-0.1rem 0rem 0.5rem rgba(255, 255, 255, 0.3),
0rem 0.1rem 0.5rem rgba(255, 255, 255, 0.3),
0rem -0.1rem 0.5rem rgba(255, 255, 255, 0.3);
}
.activearea { .activearea {
font-size: 0.35rem; font-size: 0.35rem;
} }
...@@ -176,8 +130,5 @@ export default { ...@@ -176,8 +130,5 @@ export default {
background: url(../assets/img/btn-light.png) no-repeat; background: url(../assets/img/btn-light.png) no-repeat;
background-size: 100% 94%; background-size: 100% 94%;
} }
>>> div.title{
background:none;
transform: translateY(-0.2rem);
}
</style> </style>
...@@ -70,8 +70,6 @@ export default { ...@@ -70,8 +70,6 @@ export default {
text-align: left; text-align: left;
} }
.btns {
margin: 3rem 0 0 3rem;
}
</style> </style>
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 sign in to comment