Skip to content

huarun-binjiang-ipad / ipad

Go to a project
Commit e1b7a753 by liuwange1
Options

增加所有楼栋楼层设备的指令

parent 5dd5b489
Showing with 474 additions and 197 deletions
src/App.vue
...@@ -88,7 +88,7 @@ export default { ...@@ -88,7 +88,7 @@ export default {
}, },
{ {
url: require("./assets/image/icon5.png"), url: require("./assets/image/icon5.png"),
label: "智慧能源", label: "智慧能耗",
routerName: "nengyuan", routerName: "nengyuan",
}, },
{ {
......
src/components/buildList.vue 0 → 100644
<template>
<div class="select-box">
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<gaojing v-for="(item, index) in listL" :key="index">
<div
class="btn1"
:class="{ active: activeIndex == index }"
@click="buildClickHandle(index)"
>
{{ item.title }}
</div>
</gaojing>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div
class="btn2"
:class="{ active: activeIndex2 == index }"
v-for="(item, index) in listR"
:key="index + 'a'"
@click="buildClickHandle2(index)"
>
{{ item.title }}
</div>
</div>
</div>
</div>
</template>
<script>
import gaojing from "../components/gaojing.vue";
export default {
components: { gaojing },
props: {
osc: {
type: String || Number,
default: "10",
},
},
data() {
return {
listL: [],
listR: [],
activeIndex: 0,
activeIndex2: 0,
};
},
created() {
this.init();
},
methods: {
init() {
let buildList = this.$store.state.buildList;
this.listL = buildList;
this.listR = this.listL[0].child || [];
},
buildClickHandle(index) {
this.activeIndex = index;
this.$axios.post("/osc/sendInt", {
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.osc,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: this.listR[index].id,
name: "/LC",
});
});
},
},
watch: {
activeIndex(n) {
this.listR = this.listL[n].child || [];
this.activeIndex2 = 0;
},
},
};
</script>
<style lang="less" scoped>
.select-box {
display: flex;
.dir {
position: relative;
top: 45px;
height: 19px;
flex-shrink: 0;
margin-left: 23px;
margin-right: 8px;
}
.select-item {
flex-shrink: 0;
.select-title {
font-size: 12px;
font-weight: 500;
color: #adbad0;
margin-bottom: 8px;
}
.select-options {
width: 130px;
height: 220px;
overflow-y: scroll;
.btn1,
.btn2 {
margin-bottom: 5px;
}
}
}
}
</style>
\ No newline at end of file
src/utils/request.js
...@@ -3,7 +3,8 @@ import axios from 'axios'; ...@@ -3,7 +3,8 @@ import axios from 'axios';
// 进行一些全局配置 // 进行一些全局配置
// 公共路由(网络请求地址) // 公共路由(网络请求地址)
axios.defaults.baseURL = 'http://192.168.0.103:8088'; // axios.defaults.baseURL = 'http://192.168.0.103:8088';
axios.defaults.baseURL = 'http://123.56.242.140:8088';
// 请求响应超时时间 // 请求响应超时时间
axios.defaults.timeout = 5000; axios.defaults.timeout = 5000;
......
src/views/anfang.vue
...@@ -6,21 +6,7 @@ ...@@ -6,21 +6,7 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<div class="btn1" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div class="btn2" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="title-box"> <div class="title-box">
...@@ -40,8 +26,15 @@ ...@@ -40,8 +26,15 @@
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="option-box"> <div class="option-box">
<div class="btn3 active2">监控摄像头</div> <div
<div class="btn3">AI智能摄像头</div> class="btn3"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">
...@@ -58,10 +51,35 @@ ...@@ -58,10 +51,35 @@
</template> </template>
<script> <script>
import buildList from "../components/buildList.vue";
export default { export default {
name: "anfang", name: "anfang",
components: {
buildList,
},
data() { data() {
return {}; return {
options: ["监控摄像头", "AI智能摄像头"],
optionActiveIndex: 0,
osc: 11,
oscName: "/EZ_AF",
};
},
methods: {
changeOption(index) {
this.optionActiveIndex = index;
this.$axios
.post("/osc/sendInt", {
arg: 11,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: index + 1,
name: this.oscName,
});
});
},
}, },
}; };
</script> </script>
......
src/views/huanjing.vue
...@@ -6,21 +6,7 @@ ...@@ -6,21 +6,7 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<div class="btn1" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div class="btn2" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="title-box"> <div class="title-box">
...@@ -28,9 +14,15 @@ ...@@ -28,9 +14,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 }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -48,10 +40,32 @@ ...@@ -48,10 +40,32 @@
</template> </template>
<script> <script>
import buildList from "../components/buildList.vue";
export default { export default {
name: "xiaofang", name: "huanjing",
components: { buildList },
data() { data() {
return {}; return {
osc: 16,
options: ["温湿度传感器", "一氧化碳传感器", "二氧化碳传感器"],
optionActiveIndex: 0,
};
},
methods: {
changeOption(index) {
this.optionActiveIndex = index;
this.$axios
.post("/osc/sendInt", {
arg: 10,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: index + 1,
name: "/EZ_HJ",
});
});
},
}, },
}; };
</script> </script>
...@@ -106,8 +120,12 @@ export default { ...@@ -106,8 +120,12 @@ export default {
} }
.option-box { .option-box {
display: flex; display: flex;
flex-wrap: wrap;
> div { > div {
margin-right: 12px; margin-right: 28px;
margin-bottom: 10px;
width: 150px;
padding-left: 8px;
} }
} }
.bottom { .bottom {
......
src/views/nengyuan.vue
...@@ -6,21 +6,7 @@ ...@@ -6,21 +6,7 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<div class="btn1" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div class="btn2" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="title-box"> <div class="title-box">
...@@ -28,10 +14,15 @@ ...@@ -28,10 +14,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">BA冷机设备</div> class="btn3"
<div class="btn3">远程抄表-水表</div> :class="{ active: optionActiveIndex == index }"
<div class="btn3">远程抄表-电表</div> v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -39,10 +30,32 @@ ...@@ -39,10 +30,32 @@
</template> </template>
<script> <script>
import buildList from "../components/buildList.vue";
export default { export default {
name: "nengyuan", name: "nengyuan",
components: { buildList },
data() { data() {
return {}; return {
options: ["电力监控", "BA冷机设备", "远程抄表-水表", "远程抄表-电表"],
optionActiveIndex: 0,
osc: 12,
};
},
methods: {
changeOption(index) {
this.optionActiveIndex = index;
this.$axios
.post("/osc/sendInt", {
arg: this.osc,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: index + 1,
name: "/EZ_NH",
});
});
},
}, },
}; };
</script> </script>
...@@ -97,8 +110,11 @@ export default { ...@@ -97,8 +110,11 @@ export default {
} }
.option-box { .option-box {
display: flex; display: flex;
flex-wrap: wrap;
> div { > div {
margin-right: 12px; margin-right: 28px;
margin-bottom: 10px;
width: 150px;
} }
} }
.bottom { .bottom {
......
src/views/tongxing.vue
...@@ -6,35 +6,7 @@ ...@@ -6,35 +6,7 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<gaojing v-for="(item, index) in listL" :key="index">
<div
class="btn1"
:class="{ active: activeIndex == index }"
@click="buildClickHandle(index)"
>
{{ item.buildingName }}
</div>
</gaojing>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div
class="btn2"
v-for="(item, index) in listR"
:key="index + 'a'"
>
{{ item.name }}
</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="title-box"> <div class="title-box">
...@@ -42,8 +14,15 @@ ...@@ -42,8 +14,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"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -61,40 +40,34 @@ ...@@ -61,40 +40,34 @@
</template> </template>
<script> <script>
import gaojing from "../components/gaojing.vue"; import buildList from "../components/buildList.vue";
export default { export default {
name: "tongxing", name: "tongxing",
components: { gaojing }, components: { buildList },
data() { data() {
return { return {
listL: [], osc: 15,
listR: [], options: ["门禁", "访客闸机"],
activeIndex: 0, optionActiveIndex: 0,
}; };
}, },
created() { created() {
this.init(); this.init();
}, },
methods: { methods: {
init() { changeOption(index) {
let buildList = this.$store.state.buildList; this.optionActiveIndex = index;
buildList.unshift({ this.$axios
buildingName: "全部楼栋", .post("/osc/sendInt", {
}); arg: 10,
this.listL = buildList; name: "/YJ",
}, })
buildClickHandle(index) { .then(() => {
this.activeIndex = index;
this.$axios.post("/osc/sendInt", { this.$axios.post("/osc/sendInt", {
arg: 1, arg: index + 1,
name: "/EZ_XF", name: "/EZ_TX",
});
}); });
},
},
watch: {
activeIndex(n) {
console.log(n);
this.listR = this.listL[n].subList || [];
}, },
}, },
}; };
......
src/views/xiaofang.vue
...@@ -6,37 +6,7 @@ ...@@ -6,37 +6,7 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<gaojing v-for="(item, index) in listL" :key="index">
<div
class="btn1"
:class="{ active: activeIndex == index }"
@click="buildClickHandle(index)"
>
{{ item.title }}
</div>
</gaojing>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div
class="btn2"
:class="{ active: activeIndex2 == index }"
v-for="(item, index) in listR"
:key="index + 'a'"
@click="buildClickHandle2(index)"
>
{{ item.title }}
</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="title-box"> <div class="title-box">
...@@ -70,16 +40,14 @@ ...@@ -70,16 +40,14 @@
</template> </template>
<script> <script>
import gaojing from "../components/gaojing.vue"; import buildList from "../components/buildList.vue";
// import gaojing from "../components/gaojing.vue";
export default { export default {
name: "xiaofang", name: "xiaofang",
components: { gaojing }, components: { buildList },
data() { data() {
return { return {
listL: [], osc: 11,
listR: [],
activeIndex: 0,
activeIndex2: 0,
options: ["防火门", "防火卷帘", "消防水泵", "感烟探测器", "感温探测器"], options: ["防火门", "防火卷帘", "消防水泵", "感烟探测器", "感温探测器"],
optionActiveIndex: 0, optionActiveIndex: 0,
}; };
...@@ -105,10 +73,12 @@ export default { ...@@ -105,10 +73,12 @@ export default {
return; return;
} }
this.activeIndex2 = index; this.activeIndex2 = index;
this.$axios.post("/osc/sendInt", { this.$axios
arg: 10, .post("/osc/sendInt", {
arg: this.osc,
name: "/YJ", name: "/YJ",
}).then(() => { })
.then(() => {
this.$axios.post("/osc/sendInt", { this.$axios.post("/osc/sendInt", {
arg: this.listR[index].id, arg: this.listR[index].id,
name: "/LC", name: "/LC",
...@@ -117,15 +87,17 @@ export default { ...@@ -117,15 +87,17 @@ export default {
}, },
changeOption(index) { changeOption(index) {
this.optionActiveIndex = index; this.optionActiveIndex = index;
this.$axios.post("/osc/sendInt", { this.$axios
.post("/osc/sendInt", {
arg: 10, arg: 10,
name: "/YJ", name: "/YJ",
}).then(() => { })
.then(() => {
this.$axios.post("/osc/sendInt", { this.$axios.post("/osc/sendInt", {
arg: index + 1, arg: index + 1,
name: "/EZ_XF", name: "/EZ_XF",
}); });
}) });
}, },
}, },
watch: { watch: {
......
src/views/yunying.vue
...@@ -17,42 +17,128 @@ ...@@ -17,42 +17,128 @@
</div> </div>
</div> </div>
</section> </section>
<!-- <section> <section v-if="activeIndex == 0">
<div class="title-box"> <div class="title-box">
<div class="title">设备类型</div> <div class="title">设备列表</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="submit-box"> <div class="submit-box">
<div class="btn3 active2">监控</div> <div class="btn3 active2">JK-021</div>
<div class="btn3">烟感</div> <div class="btn3">JK-022</div>
<div class="btn3">温感</div> <div class="btn3">JK-023</div>
</div> </div>
</section> --> </section>
<section> <section v-if="activeIndex == 1">
<div class="title-box"> <div class="title-box">
<div class="title">工单列表</div> <div class="title">工单列表</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<!-- table --> <div class="table-box">
<div class="submit-box"> <div class="th">
<div class="btn3 active2">JK-021</div> <div class="cell">类型</div>
<div class="btn3">JK-022</div> <div class="cell">描述</div>
<div class="btn3">JK-023</div> <div class="cell">时间</div>
<div class="cell">状态</div>
</div>
<div class="tbody">
<div class="tb" v-for="item in 10" :key="item">
<div class="cell">巡检</div>
<div class="cell">B3空调不冷B3空调</div>
<div class="cell">17:00</div>
<div class="cell">待定</div>
</div>
</div>
</div>
</section>
<section v-if="activeIndex == 2">
<div class="title-box">
<div class="title">结构对比</div>
<div class="style-line"></div>
</div>
<div class="select-box">
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<gaojing v-for="(item, index) in listL" :key="index">
<div
class="btn1"
:class="{ active: buildActiveIndex == index }"
@click="buildClickHandle(index)"
>
{{ item.title }}
</div>
</gaojing>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div
class="btn2"
:class="{ active: buildActiveIndex2 == index }"
v-for="(item, index) in listR"
:key="index + 'a'"
@click="buildClickHandle2(index)"
>
{{ item.title }}
</div>
</div>
</div>
</div> </div>
</section> </section>
</div> </div>
</template> </template>
<script> <script>
import gaojing from "../components/gaojing.vue";
export default { export default {
name: "homepage", name: "yunying",
components: { gaojing },
data() { data() {
return { return {
activeIndex: 0, activeIndex: 0,
btnList: ["设备房", "工单详情", "结构对比"], btnList: ["设备房", "工单详情", "结构对比"],
// 设备房，工单详情，暂缺。结构对比就展示楼栋/楼层列表 // 设备房，工单详情，暂缺。结构对比就展示楼栋/楼层列表
listL: [],
listR: [],
buildActiveIndex: 0,
buildActiveIndex2: 0,
}; };
}, },
created() {
this.init();
},
methods: {
init() {
let buildList = this.$store.state.buildList;
this.listL = buildList;
this.listR = this.listL[0].child || [];
},
buildClickHandle(index) {
this.buildActiveIndex = index;
// this.$axios.post("/osc/sendInt", {
// arg: this.listL[index].id,
// name: "/LY",
// });
},
buildClickHandle2(index) {
if (this.buildActiveIndex == 0 && this.buildActiveIndex2 == 0) {
return;
}
this.buildActiveIndex2 = index;
// this.$axios.post("/osc/sendInt", {
// arg: this.listR[index].id,
// name: "/LC",
// });
},
},
watch: {
buildActiveIndex(n) {
this.listR = this.listL[n].child || [];
this.activeIndex2 = 0;
},
},
}; };
</script> </script>
...@@ -69,5 +155,73 @@ export default { ...@@ -69,5 +155,73 @@ export default {
margin-right: 20px; margin-right: 20px;
} }
} }
.table-box {
margin-left: 50px;
width: 610px;
.tbody {
max-height: 300px;
overflow-y: auto;
}
.th,
.tb {
width: 100%;
display: flex;
height: 40px;
.cell {
width: 25%;
display: flex;
align-items: center;
justify-content: center;
}
}
.th {
border-bottom: 1px solid #dbe2ee;
.cell {
font-size: 12px;
font-weight: 600;
color: #626666;
}
}
.tb {
&:nth-child(2n) {
background: rgba(219, 226, 238, 0.3);
}
.cell {
font-size: 12px;
font-weight: 400;
color: #e06337;
color: #626666;
}
}
}
.select-box {
display: flex;
.dir {
position: relative;
top: 45px;
height: 19px;
flex-shrink: 0;
margin-left: 23px;
margin-right: 8px;
}
.select-item {
flex-shrink: 0;
.select-title {
font-size: 12px;
font-weight: 500;
color: #adbad0;
margin-bottom: 8px;
}
.select-options {
width: 130px;
height: 220px;
overflow-y: scroll;
.btn1,
.btn2 {
margin-bottom: 5px;
}
}
}
}
} }
</style> </style>
\ No newline at end of file
src/views/zhaoming.vue
...@@ -6,39 +6,16 @@ ...@@ -6,39 +6,16 @@
<div class="title">模型楼栋楼层控制</div> <div class="title">模型楼栋楼层控制</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="select-box"> <buildList :osc="osc"></buildList>
<div class="select-item select-left">
<div class="select-title">楼栋</div>
<div class="select-options">
<div class="btn1" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
<img class="dir" src="../assets/image/dirright.png" alt="" />
<div class="select-item select-right">
<div class="select-title">楼层</div>
<div class="select-options">
<div class="btn2" v-for="item in 10" :key="item">{{ item }}</div>
</div>
</div>
</div>
</div> </div>
<div class="right"> <div class="right">
<!-- <section>
<div class="title-box">
<div class="title">光照效果</div>
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active">泛光效果</div>
</div>
</section> -->
<section> <section>
<div class="title-box"> <div class="title-box">
<div class="title">设备分类</div> <div class="title">设备分类</div>
<div class="style-line"></div> <div class="style-line"></div>
</div> </div>
<div class="option-box"> <div class="option-box">
<div class="btn3 active2">照明回路</div> <div class="btn3 active2" @click="changeOption(0)">照明回路</div>
</div> </div>
</section> </section>
</div> </div>
...@@ -57,10 +34,30 @@ ...@@ -57,10 +34,30 @@
</template> </template>
<script> <script>
import buildList from "../components/buildList.vue";
export default { export default {
name: "zhaoming", name: "zhaoming",
components: { buildList },
data() { data() {
return {}; return {
osc: 14,
};
},
methods: {
changeOption(index) {
this.optionActiveIndex = index;
this.$axios
.post("/osc/sendInt", {
arg: this.osc,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: index + 1,
name: "/EZ_ZM",
});
});
},
}, },
}; };
</script> </script>
......
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