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 {
},
{
url: require("./assets/image/icon5.png"),
label: "智慧能源",
label: "智慧能耗",
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';
// 进行一些全局配置
// 公共路由(网络请求地址)
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;
......
src/views/anfang.vue
......@@ -6,21 +6,7 @@
<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">
<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>
<buildList :osc="osc"></buildList>
</div>
<div class="right">
<div class="title-box">
......@@ -40,8 +26,15 @@
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active2">监控摄像头</div>
<div class="btn3">AI智能摄像头</div>
<div
class="btn3"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div>
</div>
<div class="bottom">
......@@ -58,10 +51,35 @@
</template>
<script>
import buildList from "../components/buildList.vue";
export default {
name: "anfang",
components: {
buildList,
},
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>
......
src/views/huanjing.vue
......@@ -6,21 +6,7 @@
<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">
<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>
<buildList :osc="osc"></buildList>
</div>
<div class="right">
<div class="title-box">
......@@ -28,9 +14,15 @@
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active">温湿度传感器</div>
<div class="btn3">一氧化碳传感器</div>
<div class="btn3">二氧化碳传感器</div>
<div
class="btn3"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div>
</div>
</div>
......@@ -48,10 +40,32 @@
</template>
<script>
import buildList from "../components/buildList.vue";
export default {
name: "xiaofang",
name: "huanjing",
components: { buildList },
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>
......@@ -106,8 +120,12 @@ export default {
}
.option-box {
display: flex;
flex-wrap: wrap;
> div {
margin-right: 12px;
margin-right: 28px;
margin-bottom: 10px;
width: 150px;
padding-left: 8px;
}
}
.bottom {
......
src/views/nengyuan.vue
......@@ -6,21 +6,7 @@
<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">
<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>
<buildList :osc="osc"></buildList>
</div>
<div class="right">
<div class="title-box">
......@@ -28,10 +14,15 @@
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active">电力监控</div>
<div class="btn3">BA冷机设备</div>
<div class="btn3">远程抄表-水表</div>
<div class="btn3">远程抄表-电表</div>
<div
class="btn3"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div>
</div>
</div>
......@@ -39,10 +30,32 @@
</template>
<script>
import buildList from "../components/buildList.vue";
export default {
name: "nengyuan",
components: { buildList },
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>
......@@ -97,8 +110,11 @@ export default {
}
.option-box {
display: flex;
flex-wrap: wrap;
> div {
margin-right: 12px;
margin-right: 28px;
margin-bottom: 10px;
width: 150px;
}
}
.bottom {
......
src/views/tongxing.vue
......@@ -6,35 +6,7 @@
<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: 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>
<buildList :osc="osc"></buildList>
</div>
<div class="right">
<div class="title-box">
......@@ -42,8 +14,15 @@
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active">门禁</div>
<div class="btn3">访客闸机</div>
<div
class="btn3"
:class="{ active: optionActiveIndex == index }"
v-for="(item, index) in options"
:key="index + 'b'"
@click="changeOption(index)"
>
{{ item }}
</div>
</div>
</div>
</div>
......@@ -61,40 +40,34 @@
</template>
<script>
import gaojing from "../components/gaojing.vue";
import buildList from "../components/buildList.vue";
export default {
name: "tongxing",
components: { gaojing },
components: { buildList },
data() {
return {
listL: [],
listR: [],
activeIndex: 0,
osc: 15,
options: ["门禁", "访客闸机"],
optionActiveIndex: 0,
};
},
created() {
this.init();
},
methods: {
init() {
let buildList = this.$store.state.buildList;
buildList.unshift({
buildingName: "全部楼栋",
});
this.listL = buildList;
},
buildClickHandle(index) {
this.activeIndex = index;
changeOption(index) {
this.optionActiveIndex = index;
this.$axios
.post("/osc/sendInt", {
arg: 10,
name: "/YJ",
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: 1,
name: "/EZ_XF",
arg: index + 1,
name: "/EZ_TX",
});
});
},
},
watch: {
activeIndex(n) {
console.log(n);
this.listR = this.listL[n].subList || [];
},
},
};
......
src/views/xiaofang.vue
......@@ -6,37 +6,7 @@
<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: 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>
<buildList :osc="osc"></buildList>
</div>
<div class="right">
<div class="title-box">
......@@ -70,16 +40,14 @@
</template>
<script>
import gaojing from "../components/gaojing.vue";
import buildList from "../components/buildList.vue";
// import gaojing from "../components/gaojing.vue";
export default {
name: "xiaofang",
components: { gaojing },
components: { buildList },
data() {
return {
listL: [],
listR: [],
activeIndex: 0,
activeIndex2: 0,
osc: 11,
options: ["防火门", "防火卷帘", "消防水泵", "感烟探测器", "感温探测器"],
optionActiveIndex: 0,
};
......@@ -105,10 +73,12 @@ export default {
return;
}
this.activeIndex2 = index;
this.$axios.post("/osc/sendInt", {
arg: 10,
this.$axios
.post("/osc/sendInt", {
arg: this.osc,
name: "/YJ",
}).then(() => {
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: this.listR[index].id,
name: "/LC",
......@@ -117,15 +87,17 @@ export default {
},
changeOption(index) {
this.optionActiveIndex = index;
this.$axios.post("/osc/sendInt", {
this.$axios
.post("/osc/sendInt", {
arg: 10,
name: "/YJ",
}).then(() => {
})
.then(() => {
this.$axios.post("/osc/sendInt", {
arg: index + 1,
name: "/EZ_XF",
});
})
});
},
},
watch: {
......
src/views/yunying.vue
......@@ -17,42 +17,128 @@
</div>
</div>
</section>
<!-- <section>
<section v-if="activeIndex == 0">
<div class="title-box">
<div class="title">设备类型</div>
<div class="title">设备列表</div>
<div class="style-line"></div>
</div>
<div class="submit-box">
<div class="btn3 active2">监控</div>
<div class="btn3">烟感</div>
<div class="btn3">温感</div>
<div class="btn3 active2">JK-021</div>
<div class="btn3">JK-022</div>
<div class="btn3">JK-023</div>
</div>
</section> -->
<section>
</section>
<section v-if="activeIndex == 1">
<div class="title-box">
<div class="title">工单列表</div>
<div class="style-line"></div>
</div>
<!-- table -->
<div class="submit-box">
<div class="btn3 active2">JK-021</div>
<div class="btn3">JK-022</div>
<div class="btn3">JK-023</div>
<div class="table-box">
<div class="th">
<div class="cell">类型</div>
<div class="cell">描述</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>
</section>
</div>
</template>
<script>
import gaojing from "../components/gaojing.vue";
export default {
name: "homepage",
name: "yunying",
components: { gaojing },
data() {
return {
activeIndex: 0,
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>
......@@ -69,5 +155,73 @@ export default {
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>
\ No newline at end of file
src/views/zhaoming.vue
......@@ -6,39 +6,16 @@
<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">
<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>
<buildList :osc="osc"></buildList>
</div>
<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>
<div class="title-box">
<div class="title">设备分类</div>
<div class="style-line"></div>
</div>
<div class="option-box">
<div class="btn3 active2">照明回路</div>
<div class="btn3 active2" @click="changeOption(0)">照明回路</div>
</div>
</section>
</div>
......@@ -57,10 +34,30 @@
</template>
<script>
import buildList from "../components/buildList.vue";
export default {
name: "zhaoming",
components: { buildList },
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>
......
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