Skip to content

huarun-binjiang-ipad / ipad

Go to a project
Commit 894d3b8e by liuwange1
Options

测试通信

parent 43bbc9bc
Showing with 578 additions and 39 deletions
src/App.vue
<template> <template>
<div class="home"> <div class="home">
<header> <header>
<img src="./assets/image/logo.png" alt="" /> <img @click="kc0" src="./assets/image/logo.png" alt="" />
<p>上海滨江中心IOC大屏控制台</p> <p>上海滨江中心IOC大屏控制台</p>
</header> </header>
<main> <main>
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right" v-if="showRight"> <div class="right">
<router-view /> <router-view />
</div> </div>
</main> </main>
...@@ -126,36 +126,22 @@ export default { ...@@ -126,36 +126,22 @@ export default {
activeIndex: 0, activeIndex: 0,
pageY: 0, pageY: 0,
top: "90vh", top: "90vh",
showRight: false,
}; };
}, },
created() { created() {
this.getBuildListData(); // this.getBuildListData();
// this.$axios.get("/building/getBuildingList").then((e) => {
// console.log(e);
// });
// this.$axios.get("/building/getTreeInfoByType", { type: 1 }).then((e) => {
// console.log(e);
// });
// this.$axios.get("/deviceInfo/getDeviceInfoList").then((e) => {
// console.log(e);
// });
// this.$axios
// .post("/osc/sendString", {
// address: "127.0.0.1",
// arg: "{ket: 'key1', value: 'value1'}",
// name: "/test",
// port: 7000,
// })
// .then((e) => {
// console.log(e);
// });
}, },
methods: { methods: {
// 点击logo触发开场动画
kc0() {
this.$axios.post("/osc/sendInt", {
arg: 0,
name: "/KC",
});
},
getBuildListData() { getBuildListData() {
this.$axios.get("/building/getBuildingList").then((e) => { this.$axios.get("/building/getBuildingList").then((e) => {
this.$store.commit("setBuildList", e.data); this.$store.commit("setBuildList", e.data);
this.showRight = true;
}); });
}, },
getLeftDistance(index) { getLeftDistance(index) {
...@@ -169,6 +155,18 @@ export default { ...@@ -169,6 +155,18 @@ export default {
}, },
navClickHandle(index) { navClickHandle(index) {
this.activeIndex = index; this.activeIndex = index;
// if (index == 0) {
// // 开场动画 1
// this.$axios.post("/osc/sendInt", {
// arg: 1,
// name: "/KC",
// });
// }
// 一级动画
this.$axios.post("/osc/sendInt", {
arg: index,
name: "/YJ",
});
let routerName = this.navList[index].routerName; let routerName = this.navList[index].routerName;
if (routerName && routerName != this.$route.name) { if (routerName && routerName != this.$route.name) {
this.$router.push({ name: routerName }); this.$router.push({ name: routerName });
......
src/store/index.js
...@@ -5,7 +5,501 @@ Vue.use(Vuex) ...@@ -5,7 +5,501 @@ Vue.use(Vuex)
export default new Vuex.Store({ export default new Vuex.Store({
state: { state: {
buildList: [] buildList: [
{
title: '全部楼栋',
id: '0',
child: [
{
title: '全部楼层'
}
]
},
{
title: 'MT',
id: '1',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: 'UG',
id: '3'
},
{
title: '2',
id: '4'
},
{
title: '3',
id: '5'
},
{
title: '5',
id: '6'
},
{
title: '6',
id: '7'
},
{
title: '7',
id: '8'
},
{
title: '8',
id: '9'
},
{
title: '9',
id: '10'
},
{
title: '10',
id: '11'
},
{
title: '11',
id: '12'
},
{
title: '12',
id: '13'
},
{
title: '15',
id: '14'
},
{
title: '16',
id: '15'
},
{
title: '17',
id: '16'
},
{
title: '18',
id: '17'
},
{
title: '19',
id: '18'
},
{
title: '20',
id: '19'
},
{
title: '21',
id: '20'
},
{
title: '22',
id: '21'
},
{
title: '23',
id: '22'
},
{
title: 'RF',
id: '23'
},
]
},
{
title: 'N1',
id: '2',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: 'RF',
id: '10'
},
]
},
{
title: 'N2',
id: '3',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: 'RF',
id: '10'
},
]
},
{
title: 'N3',
id: '4',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: 'RF',
id: '10'
},
]
},
{
title: 'N5',
id: '5',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: 'RF',
id: '10'
},
]
},
{
title: 'S1',
id: '6',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: '10',
id: '10'
},
{
title: '11',
id: '11'
},
{
title: 'RF',
id: '12'
},
]
},
{
title: 'S2',
id: '7',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: 'RF',
id: '9'
},
]
},
{
title: 'S3',
id: '8',
child: [
{
title: 'B2',
id: '0'
},
{
title: 'LG',
id: '1'
},
{
title: 'G',
id: '2'
},
{
title: '2',
id: '3'
},
{
title: '3',
id: '4'
},
{
title: '5',
id: '5'
},
{
title: '6',
id: '6'
},
{
title: '7',
id: '7'
},
{
title: '8',
id: '8'
},
{
title: '9',
id: '9'
},
{
title: '10',
id: '10'
},
{
title: '11',
id: '11'
},
{
title: '12',
id: '12'
},
{
title: '15',
id: '13'
},
{
title: '16',
id: '14'
},
{
title: '17',
id: '15'
},
{
title: '18',
id: '16'
},
{
title: '19',
id: '17'
},
]
},
]
}, },
mutations: { mutations: {
setBuildList(state, data) { setBuildList(state, data) {
......
src/views/welcome.vue
...@@ -6,12 +6,33 @@ ...@@ -6,12 +6,33 @@
</div> </div>
<!-- <input type="text" class="input-word" placeholder="请输入文案" /> --> <!-- <input type="text" class="input-word" placeholder="请输入文案" /> -->
<div class="submit-box"> <div class="submit-box">
<div class="btn1">陆家嘴滨江中心</div> <div class="btn1" :class="{ active: active }" @click="clickHandler">
陆家嘴滨江中心
</div>
<!-- <div class="btn1 active">开场</div> --> <!-- <div class="btn1 active">开场</div> -->
</div> </div>
</div> </div>
</template> </template>
<script>
export default {
data() {
return {
active: false,
};
},
methods: {
clickHandler() {
this.active = true;
// 开场动画 2
this.$axios.post("/osc/sendInt", {
arg: 2,
name: "/KC",
});
},
},
};
</script>
<style lang="less" scoped> <style lang="less" scoped>
.welcome { .welcome {
......
src/views/xiaofang.vue
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
:class="{ active: activeIndex == index }" :class="{ active: activeIndex == index }"
@click="buildClickHandle(index)" @click="buildClickHandle(index)"
> >
{{ item.buildingName }} {{ item.title }}
</div> </div>
</gaojing> </gaojing>
</div> </div>
...@@ -27,10 +27,12 @@ ...@@ -27,10 +27,12 @@
<div class="select-options"> <div class="select-options">
<div <div
class="btn2" class="btn2"
:class="{ active: activeIndex2 == index }"
v-for="(item, index) in listR" v-for="(item, index) in listR"
:key="index + 'a'" :key="index + 'a'"
@click="buildClickHandle2(index)"
> >
{{ item.name }} {{ item.title }}
</div> </div>
</div> </div>
</div> </div>
...@@ -42,11 +44,15 @@ ...@@ -42,11 +44,15 @@
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="option-box"> <div class="option-box">
<div class="btn3 active">防火门</div> <div
<div class="btn3">防火卷帘</div> class="btn3"
<div class="btn3">消防水泵</div> :class="{ active: optionActiveIndex == index }"
<div class="btn3">感烟探测器</div> v-for="(item, index) in options"
<div class="btn3">感温探测器</div> :key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -73,6 +79,9 @@ export default { ...@@ -73,6 +79,9 @@ export default {
listL: [], listL: [],
listR: [], listR: [],
activeIndex: 0, activeIndex: 0,
activeIndex2: 0,
options: ["防火门", "防火卷帘", "消防水泵", "感烟探测器", "感温探测器"],
optionActiveIndex: 0,
}; };
}, },
created() { created() {
...@@ -81,23 +90,38 @@ export default { ...@@ -81,23 +90,38 @@ export default {
methods: { methods: {
init() { init() {
let buildList = this.$store.state.buildList; let buildList = this.$store.state.buildList;
buildList.unshift({
buildingName: "全部楼栋",
});
this.listL = buildList; this.listL = buildList;
this.listR = this.listL[0].child || [];
}, },
buildClickHandle(index) { buildClickHandle(index) {
this.activeIndex = index; this.activeIndex = index;
this.$axios.post("/osc/sendInt", { this.$axios.post("/osc/sendInt", {
arg: 1, arg: this.listL[index].id,
name: "/LY",
});
},
buildClickHandle2(index) {
if (this.activeIndex == 0 && this.activeIndex2 == 0) {
return;
}
this.activeIndex2 = index;
this.$axios.post("/osc/sendInt", {
arg: this.listR[index].id,
name: "/LC",
});
},
changeOption(index) {
this.optionActiveIndex = index;
this.$axios.post("/osc/sendInt", {
arg: index,
name: "/EZ_XF", name: "/EZ_XF",
}); });
}, },
}, },
watch: { watch: {
activeIndex(n) { activeIndex(n) {
console.log(n); this.listR = this.listL[n].child || [];
this.listR = this.listL[n].subList || []; this.activeIndex2 = 0;
}, },
}, },
}; };
...@@ -153,8 +177,10 @@ export default { ...@@ -153,8 +177,10 @@ export default {
} }
.option-box { .option-box {
display: flex; display: flex;
flex-wrap: wrap;
> div { > div {
margin-right: 12px; margin-right: 12px;
margin-bottom: 10px;
} }
} }
.bottom { .bottom {
......
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