From ccee429d379e0108b7445f72ade8d97c110a6fb3 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期二, 09 十一月 2021 18:01:59 +0800
Subject: [PATCH] 问题修复
---
src/pages/datapush/index/RightEvent.vue | 504 +++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 411 insertions(+), 93 deletions(-)
diff --git a/src/pages/datapush/index/RightEvent.vue b/src/pages/datapush/index/RightEvent.vue
index 8448884..f4dce22 100644
--- a/src/pages/datapush/index/RightEvent.vue
+++ b/src/pages/datapush/index/RightEvent.vue
@@ -3,12 +3,17 @@
<div class="s-right-config">
<el-form>
<el-form-item label="鍚嶇О">
- <el-input v-model="eventData.name" placeholder="璇疯緭鍏ュ悕绉�" size="small" style="width:400px"></el-input>
+ <el-input
+ v-model="taskEditData.name"
+ placeholder="璇疯緭鍏ュ悕绉�"
+ size="small"
+ style="width:400px"
+ ></el-input>
</el-form-item>
<el-form-item label="鏃堕棿">
<el-date-picker
- v-model="eventData.time"
+ v-model="taskEditData.time"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange"
@@ -41,9 +46,9 @@
</div>
<el-form-item label="鑱斿姩鏂瑰紡" style="margin-top: 20px;width:100">
- <el-select v-model="eventData.lineWay" placeholder="璇烽�夋嫨" size="small">
+ <el-select v-model="taskEditData.lineWay" placeholder="璇烽�夋嫨" size="small">
<el-option
- v-for="item in eventData.lineOptions"
+ v-for="item in taskEditData.lineOptions"
:key="item.value"
:label="item.label"
:value="item.value"
@@ -52,8 +57,8 @@
</el-form-item>
<el-form-item label="鏍囩">
- <el-radio v-model="eventData.radioValue" label="1">婊¤冻鍏ㄩ儴</el-radio>
- <el-radio v-model="eventData.radioValue" label="2">婊¤冻浠绘剰涓�涓�</el-radio>
+ <el-radio v-model="taskEditData.radioValue" label="1">婊¤冻鍏ㄩ儴</el-radio>
+ <el-radio v-model="taskEditData.radioValue" label="2">婊¤冻浠绘剰涓�涓�</el-radio>
</el-form-item>
</el-form>
</div>
@@ -177,18 +182,66 @@
<div class="rule-title2">
<b>瑙勫垯</b>
- <div class="div-border" v-html="eventData.eventTxt"></div>
+ <div class="div-border" v-html="taskEditData.eventTxt"></div>
+ </div>
+ <div class="config-item">
+ <b>鎺ㄩ�佸瓧娈�</b>
+ <el-button type="primary" size="mini" @click="openPushSetDialog">璁剧疆</el-button>
</div>
<div class="save-btn">
<el-button type="info" size="small" @click="onCancle" style="color:#222">鍙栨秷</el-button>
<el-button type="primary" @click="eventPushsSave" size="small">淇濆瓨</el-button>
</div>
</div>
+ <el-dialog
+ :visible="pushFieldDialog"
+ :append-to-body="false"
+ :close-on-click-modal="false"
+ class="dialog-push-field"
+ @close="pushFieldDialog=false"
+ >
+ <div slot="title" class="slot-title">
+ <p>璇烽�夋嫨鎯宠鎺ㄩ�佺殑瀛楁</p>
+ <div class="right">
+ <el-checkbox v-model="allFieldChecked" @change="allCheckChange"></el-checkbox>
+ </div>
+ </div>
+ <div class="check-area" v-for="configObj in tempPushSet" :key="configObj.id">
+ <div class="header">
+ <div class="title">{{configObj.name}}</div>
+ <div class="right">
+ <el-checkbox v-model="configObj.checked" @change="toggleConfigCheck(configObj)">鍏ㄩ��</el-checkbox>
+ </div>
+ </div>
+ <div class="flex-box flex-wrap">
+ <div class="param flex-box" v-for="param in configObj.children" :key="param.id">
+ <el-checkbox v-model="param.checked" @change="checkChildren"></el-checkbox>
+ <span class="param-name">{{param.name}}</span>
+ <el-input
+ v-model="param.alias"
+ size="mini"
+ :ref="`input_${param.id}`"
+ @input="varifyField(param)"
+ :style="{color:param.error?'red':'',borderColor:param.error?'red':''}"
+ ></el-input>
+ </div>
+ </div>
+ </div>
+ <div slot="footer" class="text-center">
+ <el-button size="small" @click="canclePushFieldSet">鍙栨秷</el-button>
+ <el-button
+ size="small"
+ type="primary"
+ :disabled="disabledPushFieldSet"
+ @click="submitPushFieldSet"
+ >淇濆瓨</el-button>
+ </div>
+ </el-dialog>
</div>
</template>
<script>
-import { eventPushsSave, findByEventTopic } from "@/api/event";
+import { eventPushsSave, findByEventTopic, getPushSet } from "@/api/event";
import { findDictionaryByType, findDictionaryByID } from "@/api/dictionary";
import { getTaskList } from "@/api/search";
@@ -204,59 +257,12 @@
},
computed: {
urls() {
- return this.eventData.urls
- },
- ips() {
- return this.eventData.urls.filter(item => {
- return item.type === 'ip';
- })
- },
- domains() {
- return this.eventData.urls.filter(item => {
- return item.type === 'domain';
- })
- }
- },
- watch: {
- eventObject: {
- handler(newVal, oldVal) {
- this.eventData.enable = this.eventObject.enable;
- if (newVal !== oldVal) {
- if (this.eventData.id !== newVal.id) {
- this.dataList = [];
-
- this.eventData.id = newVal.id;
- this.eventData.name = newVal.name;
- this.eventData.time = [
- this.eventObject.time_start,
- this.eventObject.time_end
- ];
- this.eventData.serverIp = newVal.ip_ports;
- this.eventData.urls = newVal.urls;
- this.eventData.lineWay = newVal.link_type;
- this.eventData.eventTxt = newVal.rule_text;
- this.eventData.radioValue = newVal.is_satisfy_all ? "1" : "2";
-
- if (!this.eventData.urls) {
- this.$set(this.eventData, "urls", [])
- }
- if (newVal.rules) {
- newVal.rules.forEach(element => {
- let newRule = Object.assign(JSON.parse(JSON.stringify(this.baseRule)), element)
- this.dataList.push(newRule)
- this.selectTopic(newRule);
- this.selectOperator(newRule);
- })
- }
- }
- }
- },
- deep: true
+ return this.taskEditData.urls
}
},
data() {
return {
- eventData: {},
+ taskEditData: {},
dataList: [],
dictionary: [],
cameras: [],
@@ -271,48 +277,221 @@
rule_values: [],
topic_arg: "",
topic_type: "",
-
topicTypeOptions: {},
topicArgOptions: {},
operatorOptions: {},
operatorTypeOpionts: {},
ruleValueOptions: []
},
+ pushFieldDialog: false,
+ tempPushSet: [],
+ pushFields: [],
+ allFieldChecked: false,
+ disabledPushFieldSet: true,
};
+ },
+ watch: {
+ eventObject: {
+ handler(newVal, oldVal) {
+ this.taskEditData.enable = this.eventObject.enable;
+ if (newVal !== oldVal) {
+ if (this.taskEditData.id !== newVal.id) {
+ this.dataList = [];
+
+ this.taskEditData.id = newVal.id;
+ this.taskEditData.name = newVal.name;
+ this.taskEditData.time = [
+ this.eventObject.time_start,
+ this.eventObject.time_end
+ ];
+ this.taskEditData.serverIp = newVal.ip_ports;
+ this.taskEditData.urls = newVal.urls;
+ this.taskEditData.lineWay = newVal.link_type;
+ this.taskEditData.eventTxt = newVal.rule_text;
+ this.taskEditData.radioValue = newVal.is_satisfy_all ? "1" : "2";
+
+ if (!this.taskEditData.urls) {
+ this.$set(this.taskEditData, "urls", [])
+ }
+ //this.taskEditData.push_set = this.eventObject.push_set;
+ if (!this.eventObject.push_set.length) {
+ this.$set(this.taskEditData, "push_set", this.pushFields)
+ } else {
+ this.$set(this.taskEditData, "push_set", this.eventObject.push_set)
+ }
+ if (newVal.rules) {
+ newVal.rules.forEach(element => {
+ let newRule = Object.assign(JSON.parse(JSON.stringify(this.baseRule)), element)
+ this.dataList.push(newRule)
+ this.selectTopic(newRule);
+ this.selectOperator(newRule);
+ })
+ }
+ }
+ }
+ },
+ deep: true
+ },
+ tempPushSet: {
+ handler(n, o) {
+ let _this = this;
+ let flag = false;
+ n.forEach(configObj => {
+ let notChecked = configObj.children.find(param => !param.checked);
+ if (!notChecked) {
+ configObj.checked = true;
+ } else {
+ configObj.checked = false;
+ }
+ let someoneChecked = configObj.children.find(param => param.checked);
+ if (someoneChecked) {
+ flag = true
+ }
+
+ });
+ if (flag) {
+ this.disabledPushFieldSet = false;
+ } else {
+ this.disabledPushFieldSet = true;
+ }
+ },
+ deep: true
+ }
},
created() {
this.reAdd();
},
mounted() {
- // 鍔犺浇瀛楀吀瀛楀吀
+ // 鍔犺浇瀛楀吀
this.findByType();
this.getCameras();
this.getTasks();
+ this.getPushFields();
},
methods: {
+ openPushSetDialog() {
+ this.pushFieldDialog = true;
+ this.tempPushSet = JSON.parse(JSON.stringify(this.taskEditData.push_set));
+ this.checkFlag()
+ },
+ checkFlag() {
+ // debugger
+ let flag = true
+ this.tempPushSet.forEach(item => {
+ if (item.checked == false) {
+ flag = false
+ }
+ });
+ this.allFieldChecked = flag
+ },
+ checkChildren(val) {
+ console.log(val, 12121);
+ if (val == false) {
+ this.allFieldChecked = false
+ } else if (val == true && this.allFieldChecked == false) {
+ this.$nextTick(() => {
+ this.checkFlag()
+ })
+ }
+
+ },
+ varifyField(param) {
+ var reg = /^[A-Za-z]+[0-9-_]?$/;
+ if (!reg.test(param.alias)) {
+ this.$message('璇疯緭鍏ュ悎娉曞瓧娈靛悕');
+ param.error = true;
+ } else {
+ param.error = false;
+ }
+ // this.pushFields.forEach(configObj => {
+ // configObj.children.find(param => param.error)
+ // })
+
+ },
+ canclePushFieldSet() {
+ this.pushFieldDialog = false;
+ },
+ allCheckChange(val) {
+
+ this.tempPushSet.forEach(function (item) {
+ item.checked = val
+ item.children.forEach(function (child) {
+ child.checked = val
+ })
+ })
+ },
+ submitPushFieldSet() {
+ let flag = false;
+ //this.pushFields.forEach(configObj => {
+ this.tempPushSet.forEach(configObj => {
+ let errorOne = configObj.children.find(param => param.checked && param.error);
+ if (errorOne) {
+ this.$notify({
+ type: 'error',
+ message: '璇峰皢閫変腑瀛楁杈撳叆鍚堟硶瀛楁鍚�'
+ })
+ flag = true
+ }
+ });
+ if (flag) {
+ //NO SUBMIT
+ return
+ }
+
+ this.taskEditData.push_set = this.tempPushSet;
+ this.pushFieldDialog = false;
+
+ // 淇濆瓨瑙勫垯
+ this.eventPushsSave()
+ },
+ toggleConfigCheck(configObj) {
+
+ configObj.children.forEach(child => {
+ child.checked = configObj.checked
+ })
+ this.checkFlag()
+ },
+ getPushFields() {
+ let _this = this;
+ getPushSet().then(res => {
+ _this.pushFields = res.data;
+ })
+ // this.pushFields = [
+ // { id: 'sxjxx', name: '鎽勫儚鏈轰俊鎭�', checked: false, alias: '',
+ // children: [
+ // { name: '鎽勫儚鏈篒D', checked: false, alias: 'cameraID', id: 'cameraID', children: null },
+ // { name: '鎽勫儚鏈哄悕绉�', checked: false, alias: 'cameraName', id: 'cameraName', children: null },
+ // { name: '鎽勫儚鏈哄湴鍧�', checked: false, alias: 'cameraAddr', id: 'cameraAddr', children: null },
+ // { name: '鎽勫儚鏈哄潃', checked: false, alias: 'cameraAdr', id: 'cameraAdr', children: null }
+ // ] },
+ // { id: 'cjxx', name: '鍦烘櫙淇℃伅', checked: false, alias: '',
+ // children: [{ name: '鍦烘櫙ID', checked: false, alias: 'taskId', id: 'tskId', children: null }] },
+ // ];
+
+ },
addUrl() {
- this.eventData.urls.push({
+ this.taskEditData.urls.push({
checked: true,
hash: Math.random().toString(36).substr(2),
url: "",
});
},
delUrl(index) {
- this.$set(this.eventData.urls, index, this.baseRule)
- this.eventData.urls.splice(index, 1)
+ this.$set(this.taskEditData.urls, index, this.baseRule);
+ this.taskEditData.urls.splice(index, 1);
},
// 淇濆瓨
async eventPushsSave() {
// 鍒ゆ柇淇濆瓨鐨刬p鏄惁绗﹀悎鏍煎紡瑕佹眰
- if (this.eventData.urls.length < 1) {
+ if (this.taskEditData.urls.length < 1) {
this.$notify({
type: "warning",
message: "璇烽厤缃嚦灏戜竴鍙版帹閫佹湇鍔″櫒"
});
return;
}
- for (let i = 0; i < this.eventData.urls.length; i++) {
- if (this.eventData.urls[i].url.length < 1) {
+ for (let i = 0; i < this.taskEditData.urls.length; i++) {
+ if (this.taskEditData.urls[i].url.length < 1) {
this.$notify({
type: "warning",
message: "鎺ュ彛URL鍦板潃涓嶅厑璁镐负绌�"
@@ -335,10 +514,16 @@
str += ' = ';
}
- str += i.rule_value;
+ if (i.rule_value === "all*all") {
+ str += "鍏ㄩ儴";
+ } else if (i.rule_value === "null*null") {
+ str += "绌�";
+ } else {
+ str += i.rule_value;
+ }
if (str.length > 0) {
- ruleDesc.push(str)
+ ruleDesc.push(str);
}
});
// 澶勭悊瑙勫垯鍒楄〃鏁版嵁缁撴瀯
@@ -353,22 +538,23 @@
});
let json = {
- enable: this.eventData.enable,
- id: this.eventData.id,
- ip_ports: this.eventData.serverIp,
- name: this.eventData.name,
+ enable: this.taskEditData.enable,
+ id: this.taskEditData.id,
+ ip_ports: this.taskEditData.serverIp,
+ name: this.taskEditData.name,
rule_text: ruleDesc.join("<br/>"),
rules: ruleList,
- time_start: this.eventData.time[0],
- time_end: this.eventData.time[1],
- urls: this.eventData.urls,
- is_satisfy_all: this.eventData.radioValue === "1",
- link_type: this.eventData.lineWay
+ time_start: this.taskEditData.time[0],
+ time_end: this.taskEditData.time[1],
+ urls: this.taskEditData.urls,
+ is_satisfy_all: this.taskEditData.radioValue === "1",
+ link_type: this.taskEditData.lineWay,
+ push_set: this.taskEditData.push_set
};
let res = await eventPushsSave(json);
if (res && res.success) {
- this.eventData.eventTxt = ruleDesc.join("<br/>");
+ this.taskEditData.eventTxt = ruleDesc.join("<br/>");
this.$emit("updateList", res.data.id);
this.$notify({
type: "success",
@@ -383,13 +569,18 @@
this.dictionary = Object.assign(this.dictionary, res.data)
this.baseRule.topicTypeOptions = this.dictionary.EVENTRULETOPIC
this.baseRule.operatorTypeOpionts = this.dictionary.EVENTTYPECOMPUTE
- this.dictionary['alarmLevel'] = this.dictionary.ALARMLEVEL
+ this.dictionary['alarmLevel'] = this.dictionary.ALARMLEVEL.map(el => {
+ return {
+ name: el.name,
+ value: el.name
+ }
+ })
}
},
async getCameras() {
let rsp = await findByEventTopic({ topic: 'camera', type: 'name' });
if (rsp && rsp.success) {
- this.dictionary['camera'] = rsp.data
+ this.dictionary['camera'] = rsp.data;
}
rsp = await findByEventTopic({ topic: 'dbtable' });
@@ -413,7 +604,7 @@
value: task.name,
name: task.name
})
- hash[task.name] = true
+ hash[task.name] = true;
}
})
}
@@ -439,35 +630,52 @@
if (element.value === rule.topic_type) {
rule.topicArgOptions = element.children;
if (resetNext) {
- rule.topic_arg = rule.topicArgOptions[0].value
- this.selectArg(rule, resetNext)
+ rule.topic_arg = rule.topicArgOptions[0].value;
+ this.selectArg(rule, resetNext);
}
}
});
},
selectArg(rule, resetNext = false) {
+ debugger
let argInfo = rule.topicArgOptions.filter(arg => {
- return arg.value === rule.topic_arg
+ return arg.value === rule.topic_arg;
})
if (argInfo.length > 0) {
- let desc = argInfo[0].description.split(",")
+ let desc = argInfo[0].description.split(",");
if (desc.length > 0) {
rule.operatorTypeOpionts = this.dictionary.EVENTTYPECOMPUTE.filter(el => {
- return desc.indexOf(el.value) >= 0
+ return desc.indexOf(el.value) >= 0;
})
}
}
if (resetNext) {
- rule.operator_type = rule.operatorTypeOpionts[rule.operatorTypeOpionts.length - 1].value
- this.selectOperator(rule, resetNext)
+ rule.operator_type = rule.operatorTypeOpionts[rule.operatorTypeOpionts.length - 1].value;
+ this.selectOperator(rule, resetNext);
}
},
selectOperator(rule, resetNext = false) {
if (rule.operator_type === "option") {
- rule.ruleValueOptions = this.dictionary[rule.topic_type] ? this.dictionary[rule.topic_type] : []
- rule.rule_values = rule.rule_value.split(",")
+ rule.ruleValueOptions = this.dictionary[rule.topic_type] ? this.dictionary[rule.topic_type] : [];
+
+ if (rule.rule_value != "") {
+ rule.rule_values = rule.rule_value.split(",");
+ }
+
+ // 澶勭悊 鍏ㄩ儴/绌�
+ for (let i = 0; i < rule.rule_values.length; i++) {
+ if (rule.rule_values[i] === "all*all") {
+ rule.rule_values[i] = "鍏ㄩ儴";
+ }
+
+ if (rule.rule_values[i] === "null*null") {
+ rule.rule_values[i] = "绌�";
+ }
+ }
+
+ this.setOptionsDisable(rule);
}
if (resetNext) {
@@ -476,7 +684,44 @@
}
},
selectValue(rule, val) {
- rule.rule_value = val.join(",")
+ if (rule.operator_type === "option") {
+ this.setOptionsDisable(rule);
+
+ if (val.indexOf("鍏ㄩ儴") >= 0) {
+ rule.rule_value = "all*all";
+ return;
+ }
+
+ if (val.indexOf("绌�") >= 0) {
+ rule.rule_value = "null*null";
+ return;
+ }
+ }
+
+ rule.rule_value = val.join(",");
+ },
+ setOptionsDisable(rule) {
+ let isAllSelect = (rule.rule_values.indexOf("鍏ㄩ儴") >= 0);
+ let isNullSelect = (rule.rule_values.indexOf("绌�") >= 0);
+
+ rule.ruleValueOptions.forEach(opt => {
+ if (!rule.rule_values.length) {
+ opt.disabled = false;
+ return
+ }
+
+ if (opt.name === "鍏ㄩ儴") {
+ opt.disabled = !isAllSelect;
+ return
+ }
+
+ if (opt.name === "绌�") {
+ opt.disabled = !isNullSelect;
+ return
+ }
+
+ opt.disabled = (isAllSelect || isNullSelect);
+ })
},
// 鏍规嵁value杩斿洖瀵瑰簲鐨刵ame
getNameByValue(arr, value) {
@@ -488,7 +733,7 @@
},
// 娓呯┖閲嶆柊鏂板
reAdd() {
- this.eventData = {
+ this.taskEditData = {
id: "",
name: "",
time: [
@@ -512,7 +757,8 @@
}
],
radioValue: "1",
- eventTxt: ""
+ eventTxt: "",
+ push_set: this.pushFields
};
this.dataList = [];
},
@@ -574,7 +820,12 @@
margin-left: 895px;
}
}
-
+ .config-item {
+ margin: 20px 0;
+ b {
+ margin-right: 10px;
+ }
+ }
.el-button--text {
text-decoration: unset;
}
@@ -604,5 +855,72 @@
color: #3d68e1;
line-height: 39px;
}
+ .dialog-push-field {
+ .el-button--primary.is-disabled,
+ .el-button--primary.is-disabled:hover {
+ background-color: #9eb4f0 !important;
+ border-color: #9eb4f0 !important;
+ }
+ .el-dialog {
+ width: 910px;
+ height: 700px;
+ .el-dialog__body {
+ padding-top: 14px;
+ height: 540px;
+ overflow-y: auto;
+ }
+ }
+ .text-center {
+ text-align: center;
+ }
+ .slot-title {
+ position: relative;
+ .right {
+ position: absolute;
+ top: 0;
+ right: 30px;
+ }
+ }
+ .check-area {
+ padding-bottom: 10px;
+ .header {
+ position: relative;
+ background: #efefef;
+ line-height: 30px;
+ margin-bottom: 14px;
+ font-weight: bold;
+ .title {
+ border-left: 3px solid #2481fa;
+ padding-left: 10px;
+ }
+ .right {
+ position: absolute;
+ top: 0;
+ right: 30px;
+ }
+ }
+ .flex-box.flex-wrap {
+ flex-wrap: wrap;
+ }
+ .param.flex-box {
+ word-break: keep-all;
+ align-items: center;
+ margin: 0 10px;
+ min-width: 260px;
+ margin-bottom: 10px;
+ .param-name {
+ margin: 0 5px;
+ }
+ .el-input {
+ border-color: #dcdfe6;
+ color: #606266;
+ .el-input__inner {
+ color: inherit;
+ border-color: inherit;
+ }
+ }
+ }
+ }
+ }
}
</style>
--
Gitblit v1.8.0