DeviceProfileStep3.vue
3.76 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<template>
<div>
<div>
<div v-if="alarmsData.length === 0" style="text-align: center">
<p style="font-size: large">未配置报警规则</p>
</div>
<div>
<template
v-for="(item, index) in !getIsEchoEditStatus ? alarmsData : echoEditData"
:key="index"
>
<span style="display: none">{{ item }}</span>
<span style="display: none">{{ index }}</span>
<div class="cursor-pointer" style="position: relative; top: 3.5vh; right: -41.6vw">
<img
style="cursor: pointer"
@click="removeAlarmRule(index, item)"
alt="移除"
src="../../../../assets/images/delete.png"
/>
</div>
<div
style="
margin-left: 0.21vw;
border-radius: 4px;
width: 44vw;
height: 47vh;
border: 1px solid grey;
overflow-y: scroll;
"
>
<CommonCpns
ref="commonCpnsRef"
:step3FatherEmitCpnData="!getIsEchoEditStatus ? 1 : item"
:step3FatherEmitCpnStatus="
!getIsEchoEditStatus ? !getIsEchoEditStatus : getIsEchoEditStatus
"
/>
</div>
</template>
</div>
</div>
<!-- 按钮 -->
<div style="margin-left: 14.5vw; margin-top: 2vh">
<a-button class="mr-5" @click="prevStepFunc">上一步</a-button>
<a-button @click="nextStepFunc">下一步</a-button>
<a-button style="margin-left: 20px" type="primary" @click="clickAddAlaramRuleFunc"
>添加报警规则</a-button
>
</div>
<!-- 按钮 -->
</div>
</template>
<script lang="ts">
import { defineComponent, ref, getCurrentInstance, reactive } from 'vue';
import CommonCpns from './common/index.vue';
export default defineComponent({
components: {
CommonCpns,
},
emits: ['next', 'prev'],
setup(_, { emit }) {
const { proxy } = getCurrentInstance() as any;
const commonCpnsRef = ref(null);
const alarmsData: any = ref([]);
let profileData: any = reactive({});
const echoEditData: any = ref([]);
const getIsEchoEditStatus = ref(false);
const prevStepFunc = () => {
emit('prev');
};
const nextStepFunc = async () => {
profileData = await proxy.$refs.commonCpnsRef?.getStep3AllDataFunc();
alarmsData.value.push(profileData);
alarmsData.value.shift();
emit('next', {
alarms: alarmsData.value,
});
};
const clickAddAlaramRuleFunc = async () => {
profileData = await proxy.$refs.commonCpnsRef?.getStep3AllDataFunc();
alarmsData.value.push(profileData);
};
const removeAlarmRule = (i, e) => {
console.log(e);
let delI = i;
alarmsData.value.splice(delI, 1);
};
/**
* 清空数据
*/
const clearStep3DataFunc = () => {
try {
alarmsData.value.length = 0;
profileData = {};
proxy.$refs.commonCpnsRef?.clearStep3CpnDataFunc();
} catch {}
};
/**
* 回显数据
*/
const echoStep3DataFunc = (e, s) => {
try {
getIsEchoEditStatus.value = s;
if (getIsEchoEditStatus.value === true) {
echoEditData.value = e;
}
} catch {}
};
return {
clickAddAlaramRuleFunc,
prevStepFunc,
nextStepFunc,
alarmsData,
removeAlarmRule,
commonCpnsRef,
clearStep3DataFunc,
echoStep3DataFunc,
echoEditData,
getIsEchoEditStatus,
};
},
});
</script>
<style lang="less" scoped>
::-webkit-scrollbar {
display: none;
}
</style>