From 1fbade862552c9387809f7e50dd75d6b019086f1 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期二, 13 十月 2020 15:04:45 +0800
Subject: [PATCH] 数据栈底图修复,场景配置算法关系改为读取字典
---
src/pages/cameraAccess/components/scene/Editor.vue | 89 ++++++++++-------
src/pages/settings/components/ClusterManagement.vue | 91 +++++++++--------
src/pages/index/App.vue | 10 +
src/pages/settings/components/BasicSetting.vue | 4
src/components/LeftNav.vue | 6 +
src/pages/cameraAccess/components/DataStackInfo.vue | 9 +
src/components/serfDiagram/vue-d3-network/components/svgRenderer.vue | 6 +
src/pages/cameraAccess/components/SceneRule.vue | 1
src/pages/cameraAccess/components/SeparateRules.vue | 70 ++++++++-----
9 files changed, 169 insertions(+), 117 deletions(-)
diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index 8a1411e..86e0a7c 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -151,6 +151,9 @@
</el-submenu>
</el-menu>
</el-tab-pane>
+ <el-tab-pane label="闆嗙兢" name="cluster" :style="`height:${height - 56}px;`" v-if="showCluster">
+
+ </el-tab-pane>
<el-tab-pane
label="鏁版嵁鏍�"
name="dataStack"
@@ -289,6 +292,9 @@
showCam() {
return this.appName === "Camera" || this.appName === "Search";
},
+ showCluster() {
+ return this.appName === "Cluster"
+ },
showDataStack() {
return this.appName === "DataStack" || this.appName === "Search";
},
diff --git a/src/components/serfDiagram/vue-d3-network/components/svgRenderer.vue b/src/components/serfDiagram/vue-d3-network/components/svgRenderer.vue
index ce5f8f3..943753b 100644
--- a/src/components/serfDiagram/vue-d3-network/components/svgRenderer.vue
+++ b/src/components/serfDiagram/vue-d3-network/components/svgRenderer.vue
@@ -205,3 +205,9 @@
}
};
</script>
+<style>
+ /* .net-svg{
+ background-color: aquamarine;
+ border-radius: 50%;
+ } */
+</style>
diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue
index a2ce20f..8a29a18 100644
--- a/src/pages/cameraAccess/components/DataStackInfo.vue
+++ b/src/pages/cameraAccess/components/DataStackInfo.vue
@@ -140,9 +140,9 @@
<el-image
v-if="row.type==2"
style="width: 30x; height: 30px"
- :src="`/files/${row.identifier}.jpg`"
+ :src="`/files/${row.path.substr(row.path.lastIndexOf('/')+1)}`"
fit="fill"
- :preview-src-list="[`/files/${row.identifier}.jpg`]"
+ :preview-src-list="[`/files/${row.path.substr(row.path.lastIndexOf('/')+1)}`]"
>
<div slot="error" :class="snapshotClass"></div>
</el-image>
@@ -421,7 +421,7 @@
this.videoUrl = "/files/" + row.identifier + ".mp4"
}else if(row.type===2){
- this.imgUrl = "/files/" + row.identifier + ".jpg"
+ this.imgUrl = "/files/" + row.path.substr(row.path.lastIndexOf('/')+1)
}
},
// 娓呯┖杈撳叆妗�
@@ -445,7 +445,7 @@
this.fileList = [];
},
selectDir(node) {
- debugger
+
if (node.id === "") {
return
}
@@ -492,6 +492,7 @@
findAllFileByStackId({ name: this.searchInput, stackId: this.form.id, page: this.page, size: this.size, type: 0 }).then(rsp => {
if (rsp && rsp.success && rsp.data.total > 0) {
this.fileList = rsp.data.dataList;
+
this.total = rsp.data.total;
// 瀹氭椂鍒锋柊浼氭竻绌洪�変腑鐘舵�侊紝鍦ㄨ繖閲屾仮澶�
diff --git a/src/pages/cameraAccess/components/SceneRule.vue b/src/pages/cameraAccess/components/SceneRule.vue
index 82e709d..5cdea2c 100644
--- a/src/pages/cameraAccess/components/SceneRule.vue
+++ b/src/pages/cameraAccess/components/SceneRule.vue
@@ -235,6 +235,7 @@
time_rule_id: "",
};
this.$refs.sceneEditor.cleanRule();
+ this.$refs.sceneEditor.getSdkConnection();
},
handleCreate() {
diff --git a/src/pages/cameraAccess/components/SeparateRules.vue b/src/pages/cameraAccess/components/SeparateRules.vue
index b176fa1..6bce67a 100644
--- a/src/pages/cameraAccess/components/SeparateRules.vue
+++ b/src/pages/cameraAccess/components/SeparateRules.vue
@@ -144,7 +144,7 @@
></polygon-canvas>
</template>
<template v-else>
- <div style="width:100%" v-loading='getStackFileLoading'>
+ <div style="width:100%" v-loading="getStackFileLoading">
<swiper
ref="swiper"
:auto-update="true"
@@ -182,12 +182,20 @@
</div>
</swiper-slide>
</swiper>
- <div class="swiper-local-prev" v-show="swipercanvasData.length>1" @click="prevClick">
+ <div
+ class="swiper-local-prev"
+ v-show="swipercanvasData.length>1"
+ @click="prevClick"
+ >
<div class="icon-btn" slot="button-prev">
<i class="iconfont iconzuo"></i>
</div>
</div>
- <div class="swiper-local-next" v-show="swipercanvasData.length>1" @click="nextClick">
+ <div
+ class="swiper-local-next"
+ v-show="swipercanvasData.length>1"
+ @click="nextClick"
+ >
<div class="icon-btn" slot="button-next">
<i class="iconfont iconyou1"></i>
</div>
@@ -319,14 +327,15 @@
},
watch: {
- 'Camera.cameraId':{
- handler(n,o){
+ 'Camera.cameraId': {
+ handler (n, o) {
if (n) {
if (this.TreeDataPool.treeActiveName == "dataStack") {
this.stackFilesPage = 1;
this.stackFilesSize = 5;
this.stackId = n;
- if(this.stackId){
+ if (this.stackId) {
+ console.log('getStackFiles')
this.swipercanvasData = [];
this.getStackFiles()
}
@@ -336,28 +345,28 @@
}
},
methods: {
- prevClick(){
+ prevClick () {
console.log(this.swiperIndex)
console.log(this.$refs.swiper.swiper.activeIndex)
- if(this.swiperIndex == 0){
+ if (this.swiperIndex == 0) {
console.log('鏈鍒嗛〉鐨勭涓�鏉�')
//璇锋眰涓婁竴椤�
- if(this.stackFilesPage > 1){
+ if (this.stackFilesPage > 1) {
this.stackFilesPage--;
this.getStackFiles();
- }else{
+ } else {
this.$message({
- type:'info',
- message:'褰撳墠宸叉槸绗竴椤�'
+ type: 'info',
+ message: '褰撳墠宸叉槸绗竴椤�'
});
}
-
+
}
},
- nextClick(){
+ nextClick () {
console.log(this.swiperIndex)
console.log(this.$refs.swiper.swiper.activeIndex)
- if(this.swiperIndex == this.swipercanvasData.length-1){
+ if (this.swiperIndex == this.swipercanvasData.length - 1) {
console.log('鏈�鍚庝竴寮�,鍔犺浇鏇村')
//璇锋眰涓嬩竴椤�
this.stackFilesPage++;
@@ -366,38 +375,41 @@
},
getStackFiles () {
this.getStackFileLoading = true;
+ let _this = this;
findAllFileByStackId({ name: '', stackId: this.stackId, page: this.stackFilesPage, size: this.stackFilesSize, type: 0 }).then(res => {
- if (res && res.success ) {
- if(res.data.dataList.length > 0){
+ if (res && res.success) {
+ if (res.data.dataList.length > 0) {
this.swipercanvasData = [];
this.swipercanvasData = res.data.dataList.map(item => {
return {
name: item.name,
stackId: item.stack_id,
- baseImg: item.type == 2 ? `/files/${item.identifier}.jpg` : item.snapshot_url,
+ baseImg: item.type == 2 ? `/files/${item.path.substr(item.path.lastIndexOf('/') + 1)}` : item.snapshot_url,
type: item.type,
id: item.id,
loading: false
}
});
+ console.log(_this.swipercanvasData)
+ console.log(this.swipercanvasData)
this.swiperIndex = 0;
this.$refs.swiper.swiper.activeIndex = 0;
-
- }else{
+
+ } else {
console.log(this.swipercanvasData)
this.$message({
- type:'info',
- message:'宸叉棤鏇村鏁版嵁!'
+ type: 'info',
+ message: '宸叉棤鏇村鏁版嵁!'
});
}
- }else{
+ } else {
console.log(this.swipercanvasData)
this.$message({
- type:'error',
- message:'鏁版嵁璇锋眰澶辫触,璇风◢鍚庨噸璇�!'
+ type: 'error',
+ message: '鏁版嵁璇锋眰澶辫触,璇风◢鍚庨噸璇�!'
});
}
- this.getStackFileLoading = false;
+ this.getStackFileLoading = false;
}).catch(e => {
console.log(e);
this.getStackFileLoading = false;
@@ -454,7 +466,7 @@
this.loading = false;
this.Camera.cameraId = id;
await this.Camera.update();
- debugger
+
}
this.$refs.timeSlider.activeTab = this.VideoManageData.TimeRules[0].id;
@@ -480,7 +492,7 @@
message: "绛栫暐淇濆瓨鎴愬姛锛�"
});
//鍒锋柊宸︿晶鏍�
- debugger
+
_this.$root.$children[0].$children[0].querySearchAsync('camera')
}
@@ -624,7 +636,7 @@
};
</script>
<style lang="scss">
-.el-message--info .el-message__content{
+.el-message--info .el-message__content {
color: #999;
}
.swiper-container {
diff --git a/src/pages/cameraAccess/components/scene/Editor.vue b/src/pages/cameraAccess/components/scene/Editor.vue
index 4f540a6..6363c74 100644
--- a/src/pages/cameraAccess/components/scene/Editor.vue
+++ b/src/pages/cameraAccess/components/scene/Editor.vue
@@ -32,12 +32,13 @@
placeholder="閫夊叧绯�"
@change="selConnection(sdkItem)"
>
- <el-option value="&&" title="and/涓�" label="and/涓�"></el-option>
+ <el-option :value="item.value" :title="item.name" :label="item.name" v-for="item in sdkConnects" :key="item.id"></el-option>
+ <!-- <el-option value="&&" title="and/涓�" label="and/涓�"></el-option>
<el-option value="||" title="or/鎴�" label="or/鎴�"></el-option>
- <el-option value="=>" title="鈥�>/瑙﹀彂" label="鈥�>/瑙﹀彂"></el-option>
+ <el-option value="=>" title="鈥�>/瑙﹀彂" label="鈥�>/瑙﹀彂"></el-option> -->
</el-select>
<el-checkbox
- v-show="sdkItem.rule_with_pre == '=>'"
+ v-show="sdkItem.rule_with_pre == '=>' || sdkItem.rule_with_pre == '!=>'"
v-model="sdkItem.is_save_anyhow"
style="margin-left:30px"
>淇濆瓨杩囩▼鏁版嵁</el-checkbox>
@@ -386,13 +387,13 @@
sdkGroup: {
handler(newV, oldV) {
if (newV) {
- debugger
+
newV.forEach(sdk => {
let rangeOne = sdk.defaultArg.find(
arg => arg.operators[0].operator == 'range'
)
if (rangeOne) {
- debugger
+
if (rangeOne.min.trim() && rangeOne.max.trim()) {
rangeOne.sdk_arg_value = rangeOne.min + '|' + rangeOne.max
} else {
@@ -421,13 +422,14 @@
}
// ruleList: {
// handler(newVal, oldVal) {
- // debugger
+ //
// this.editHandle(newVal)
// }
// }
},
mounted() {
+
this.TaskMange.findAllSdk({ installed: true })
//this.TaskMange.list1 = sdkJson.data;
@@ -523,8 +525,18 @@
}
},
methods: {
+ getSdkConnection(){
+ console.log(this.VideoManageData.Dictionary)
+ this.sdkConnects = this.VideoManageData.Dictionary['RULECOMPUTEBETWEEN'].map(r => {
+
+ return {
+ name: r.name,
+ value: r.value
+ }
+ });
+ },
selConnection(sdkItem) {
- debugger
+
},
addSdkItem() {
@@ -533,9 +545,9 @@
itemTemp.polygonObj = JSON.parse(JSON.stringify(this.allPolygonData[0]))
this.selectPolygonOption(itemTemp)
this.sdkGroup.push(itemTemp)
+
},
delConfigItem(index) {
- debugger
// if(index != 0){
// this.sdkGroup.splice(index,1);
// }else{
@@ -626,7 +638,7 @@
}
},
selOptionalArg(sdkItem, optArgItem) {
- debugger
+
let newSort = 0
sdkItem.optNames.forEach(name => {
if (name.name == optArgItem.name) {
@@ -657,7 +669,7 @@
console.log(argObj.valueOptions)
},
setOptArgValueOptions(optArg) {
- debugger
+
let alias = optArg.alias;
console.log(this.VideoManageData.Dictionary[alias])
optArg.valueOptions = this.VideoManageData.Dictionary[alias].map(r => {
@@ -668,7 +680,7 @@
});
},
validateArgVal(sdkArgItem, e) {
- debugger
+
if (typeof (sdkArgItem.sdk_arg_value) == 'string' && sdkArgItem.sdk_arg_value == '') {
this.$notify({
type: 'warning',
@@ -688,7 +700,7 @@
let res = sdkArgItem.range.match(reg)
let min = Number(res[1]),
max = Number(res[2])
- debugger
+
//鍒ゆ柇闈炲尯闂寸被
if (sdkArgItem.sdk_arg_value && sdkArgItem.operator != 'range') {
@@ -822,7 +834,7 @@
this.valideArgValue(rule)
},
selectPolygonOption(rule) {
- debugger
+
rule.polygon_id = rule.polygonObj.polygonId
? rule.polygonObj.polygonId
: rule.polygon_id
@@ -833,7 +845,7 @@
},
//閫夋嫨绠楁硶 resetArgs涓簍rue鏄坊鍔犱负false鏄垵濮嬪寲缂栬緫
selectSDKOption(sdkItem, resetArgs) {
- debugger
+
//sdkItem.sdk_id = sdkItem.sdkObj.id;
if (resetArgs) {
sdkItem.argDef = JSON.parse(sdkItem.sdkObj.argDef)
@@ -849,12 +861,12 @@
if (arg.operators[0].operator == 'range') {
//鍖洪棿鍊肩殑澶勭悊
- debugger
+
//this.$set(arg, 'sdk_arg_value', arg.min+','+arg.max)
//this.$set(arg, 'sdk_arg_value', arg.range.substring(1,arg.range.length-1));
}
}
- debugger
+
if(arg.type == 'option'){
this.setOptArgValueOptions(arg)
}
@@ -873,14 +885,14 @@
sort: arg.sort,
isSelected: false
}))
- debugger
+
sdkItem.initAddOptional = sdkItem.optionalArg.length > 0 ? true : false
sdkItem.optArg = []
}
//娣诲姞鍦烘櫙鏃�,濡傛灉鍦烘櫙鍚嶇О涓虹┖,灏卞皢閫夋嫨鐨勭涓�涓畻娉曞悕鍚屾鍒板満鏅悕绉�
if (this.sdkGroup[0] && resetArgs) {
- debugger
+
this.$emit('sdkNameChange', this.sdkGroup[0].sdkObj.sdk_name)
}
@@ -912,7 +924,7 @@
},
//閫夋嫨绠楁硶閰嶇疆
selOperator(rule) {
- debugger
+
},
selectArgsOption(rule, resetArgValue) {
// rule.operator_type = "";
@@ -1102,7 +1114,7 @@
this.groupRules.splice(index + 1, 0, newRule)
},
editHandle(ruleTxt) {
- debugger
+
// if (ruleTxt.length < 1) {
// return
// }
@@ -1127,12 +1139,12 @@
// }
},
editRule(ruleGroup) {
- debugger
+
this.sdkGroup = []
this.group_id = ''
ruleGroup.forEach(rule => {
- debugger
+
let tempObj = {}
if (rule.group_id && rule.group_id != '') {
@@ -1170,7 +1182,7 @@
sdkObj = this.TaskMange.list1.find(sdk => sdk.id == rule.sdk_id)
argDef = JSON.parse(sdkObj.argDef)
- debugger
+
defaultArg = argDef.filter(arg => !arg.config.isOptional)
optionalArg = argDef.filter(arg => arg.config.isOptional)
@@ -1202,7 +1214,7 @@
}
//鍦╬ush涔嬪墠,闇�瑕佸垽鏂槸鍚﹂厤缃簡杩欎釜鍙�夐」 鍦╯dk_set閰嶇疆鏁扮粍閲�,
- debugger
+
optArg.push(optItem)
} else {
@@ -1210,14 +1222,14 @@
if (d.sort == arg.sort) {
if (arg.sdk_arg_value.indexOf('|') > 0) {
- debugger
+
//鍖洪棿鍊�
d.min = arg.sdk_arg_value.split(',')[0];
d.max = arg.sdk_arg_value.split(',')[1];
d.operator = 'range'
//} else if(arg.sdk_arg_value.indexOf(',') > 0){
} else if(arg.operator_type == 'option'){
- debugger
+
//澶氶�夌被鍨嬬殑鍊�
d.sdk_arg_value = arg.sdk_arg_value.split(',');
this.setOptArgValueOptions(d)
@@ -1263,7 +1275,7 @@
tempObj.isAddable = false;
}
//this.selectSDKOption(tempObj, false)
- debugger
+
this.sdkGroup.push(tempObj)
//璁剧疆绠楁硶
})
@@ -1294,7 +1306,7 @@
.catch(() => { })
},
submitRule() {
- debugger
+
let groupRule = { rules: [] }
let group_text = ''
@@ -1315,7 +1327,7 @@
} else {
//鏍¢獙蹇呭~椤�
let undefinished = this.sdkGroup.some((sdk, index) => {
- debugger
+
//娌℃湁閰嶇疆绠楁硶
if (Object.keys(sdk.sdkObj).length == 0) {
return sdk
@@ -1324,7 +1336,7 @@
if (sdk.rule_with_pre === '' && index != 0) {
return sdk
}
- debugger
+
//澶勭悊鏈睍绀虹殑鍙傛暟鐨勫��
sdk.defaultArg.forEach(arg => {
if(!arg.config.isShow){
@@ -1354,7 +1366,7 @@
} else {
//鍖洪棿绫诲弬鏁板�兼渶灏�,鏈�澶у�兼槸鍚﹂兘璁剧疆
if (arg.operator == 'range') {
- debugger
+
if (!arg.min.trim() && arg.max.trim()) {
return arg
}
@@ -1395,9 +1407,9 @@
}
//鏍¢獙鑻ョ畻娉曞叧绯讳负瑙﹀彂,鍒欑畻娉曞悕涓嶈兘閲�
let sameSdk = this.sdkGroup.some((sdk, index) => {
- debugger
+
if (sdk.index != 0 && sdk.rule_with_pre == '=>') {
- debugger
+
if (sdk.sdkObj.id == this.sdkGroup[index - 1].sdkObj.id) {
return sdk
}
@@ -1462,7 +1474,7 @@
}
if (arg.operator == 'range') {
let valRange = '';
- debugger
+
valRange = arg.sdk_arg_value.replace(',', '-');
defaultArgDesc += `${arg.name}${arg.operators[0].name}${valRange}${arg.unit || ''}, `
} else {
@@ -1472,7 +1484,7 @@
}
});
- debugger;
+ ;
defaultArgDesc = defaultArgDesc.substring(0, defaultArgDesc.length - 2);
//defaultArgDesc = defaultArgDesc.substring(0,defaultArgDesc.length-3)+defaultArgDesc.substring(defaultArgDesc.length-1,defaultArgDesc.length);
@@ -1548,11 +1560,14 @@
case '=>':
rule_with_pre = ' -> '
break
+ case '!=>':
+ rule_with_pre = ' !-> '
+ break
default:
rule_with_pre = ''
}
}
- debugger;
+ ;
group_text += `${rule_with_pre ? "<br/>" + rule_with_pre + "<br/>" : ""} <span style="background-color:RGB(183,183,183);">${
sdk.sdkObj.sdk_name
}</span> ${
@@ -1568,7 +1583,7 @@
group_text.substring(0, group_text.length - 3) +
group_text.substring(group_text.length - 2, group_text.length)
}
- debugger
+
})
console.log(group_text)
}
diff --git a/src/pages/index/App.vue b/src/pages/index/App.vue
index 22a9f70..a3b5f16 100644
--- a/src/pages/index/App.vue
+++ b/src/pages/index/App.vue
@@ -1,7 +1,7 @@
<template>
<div class v-loading="vLoading" :style="`width: ${currentWidth}px;height:${currentHeight}px`">
<div class="web-site">
- <a href="http://www.aiotlink.com" target="_blank">www.aiotlink.com</a>
+ <a href="http://www.smartai.com" target="_blank">www.smartai.com</a>
</div>
<licence />
<div class="right-bg" style>
@@ -45,7 +45,7 @@
</el-form-item>
</el-form>
</div>
- <p class="gradient-text gradient-text-one">鈥斺�斺�� {{serverTitle || '鏅� 鑳� 璁� 绠� 鑺� 鐐� 鈥� ReID'}} 鈥斺�斺��</p>
+ <p class="gradient-text gradient-text-one">鈥斺�斺�� {{serverTitle || 'SmartAI 鈥� ReID'}} 鈥斺�斺��</p>
</div>
</div>
</template>
@@ -166,10 +166,11 @@
async getServerName() {
let res = await getServerName()
if (res && res.success) {
+ console.log(res.data.serverName)
this.serverTitle = res.data.serverName
window.document.title = res.data.serverName
? res.data.serverName
- : '鏅� 鑳� 璁� 绠� 鑺� 鐐�'
+ : 'SmartAI'
sessionStorage.setItem('title', res.data.serverName)
}
},
@@ -178,6 +179,9 @@
this.getServerName()
this.getScreenHeight()
},
+ mounted(){
+ console.log(this.serverTitle)
+ },
watch: {},
beforeDestroy() {
window.onresize = null
diff --git a/src/pages/settings/components/BasicSetting.vue b/src/pages/settings/components/BasicSetting.vue
index b3368c8..b6dfad5 100644
--- a/src/pages/settings/components/BasicSetting.vue
+++ b/src/pages/settings/components/BasicSetting.vue
@@ -257,7 +257,7 @@
<el-tab-pane label="闆嗙兢绠$悊" name="third">
<cluster-management></cluster-management>
</el-tab-pane>
- <el-tab-pane label="澶栭儴璁块棶" name="fourth">
+ <!-- <el-tab-pane label="澶栭儴璁块棶" name="fourth">
<el-menu
:default-openeds="openeds"
background-color="#fff"
@@ -297,7 +297,7 @@
</el-submenu>
</el-menu>
- </el-tab-pane>
+ </el-tab-pane> -->
<el-tab-pane label="鏉冮檺绠$悊" name="user">
<authority-management v-if="activeName === 'user'"></authority-management>
</el-tab-pane>
diff --git a/src/pages/settings/components/ClusterManagement.vue b/src/pages/settings/components/ClusterManagement.vue
index 76ab639..9a04946 100644
--- a/src/pages/settings/components/ClusterManagement.vue
+++ b/src/pages/settings/components/ClusterManagement.vue
@@ -7,7 +7,7 @@
<el-col :span="12">
<el-tabs v-model="activeName" id="e-alaycluster" v-if="!isHasColony">
<el-tab-pane label="鍒涘缓闆嗙兢" name="1" :disabled="isHasColony">
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">
+ <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px">
<el-form-item label="闆嗙兢鍚嶇О" prop="clustername">
<el-input v-model="ruleForm.clustername" placeholder="鎵嬪姩杈撳叆, 濡傗�滈泦缇鈥�" size="small"></el-input>
</el-form-item>
@@ -19,10 +19,9 @@
<el-button type="text" slot="suffix" @click="generatePassword">鐢熸垚瀵嗙爜</el-button>
</el-input>
</el-form-item>
-
- <!-- <el-form-item label="铏氭嫙IP" prop="virtualip">
- <ip-input :ip="ruleForm.virtualip" :on-blur="onIpBlur"></ip-input>
- </el-form-item>-->
+ <el-form-item label="铏氭嫙/澶栭儴IP" prop="virtualIp">
+ <ip-input :ip="ruleForm.virtualIp" :on-blur="onIpBlur"></ip-input>
+ </el-form-item>
<el-form-item style="width:500px">
<el-button type="primary" size="small" @click="submitForm('ruleForm')">淇濆瓨</el-button>
</el-form-item>
@@ -70,7 +69,7 @@
</el-tabs>
<!-- 鏈夐泦缇ょ殑鎯呭喌 -->
<div v-if="isHasColony" id="h-alaycluster">
- <el-form :model="ruleForm" ref="ruleForm" label-width="80px">
+ <el-form :model="ruleForm" ref="ruleForm" label-width="100px">
<el-form-item label="闆嗙兢鍚嶇О" prop="clustername">
<el-input v-model="ruleForm.clustername" placeholder="鎵嬪姩杈撳叆, 濡傗�滈泦缇鈥�" size="small"></el-input>
</el-form-item>
@@ -86,9 +85,9 @@
></el-input>
</el-form-item>
- <!-- <el-form-item label="铏氭嫙IP" prop="virtualip">
- <ip-input :ip="ruleForm.virtualip" :on-blur="onIpBlur"></ip-input>
- </el-form-item>-->
+ <el-form-item label="铏氭嫙IP" prop="virtualIp">
+ <ip-input :ip="ruleForm.virtualIp" :on-blur="onIpBlur"></ip-input>
+ </el-form-item>
<el-form-item style="width:440px;text-align: right;">
<el-button size="small" type="danger" @click="leave">閫�鍑洪泦缇�</el-button>
<el-button
@@ -101,32 +100,18 @@
</el-form>
</div>
</el-col>
- <el-col :span="10" style="height: 100%;" v-if="members.length !== 0">
+ <el-col :span="12" style="height: 100%;" v-if="members.length !== 0">
<serfDiagram
ref="diagram"
:members="members"
:agent="agentName"
v-loading="loading"
@selected-node="joinNode"
+ class="nodes-svg"
></serfDiagram>
</el-col>
</el-row>
- <div class="ui-top-view">
- <div class="ui-top-title">婕傜ЩIP</div>
- </div>
- <el-row>
- <el-col :span="12">
- <el-form :model="vrIpForm" ref="vrIpForm" :rules="vrIpRules" style="padding:20px 40px;">
- <el-form-item label="铏氭嫙IP" prop="virtual_ip">
- <ip-input :ip="vrIpForm.virtual_ip" :on-blur="onIpBlur"></ip-input>
- <el-switch v-model="vrIpForm.enable" style="margin-left:30px;"></el-switch>
- </el-form-item>
- <el-form-item style="width:500px">
- <el-button type="primary" size="small" @click="saveForm('vrIpForm')">淇濆瓨</el-button>
- </el-form-item>
- </el-form>
- </el-col>
- </el-row>
+
<div class="ui-top-view">
<div class="ui-top-title">瀛樺偍闆嗙兢绠$悊</div>
</div>
@@ -178,6 +163,7 @@
</el-tabs>
</el-col>
</el-row>
+
</div>
</template>
@@ -205,7 +191,7 @@
import serfDiagram from "@/components/serfDiagram";
import ipInput from "@/components/subComponents/IPInput";
-
+import {isIPv4} from "@/scripts/validate";
export default {
components: {
serfDiagram,
@@ -229,6 +215,7 @@
}
}, 1000);
};
+
return {
activeName: "1",
sActiveName: "s-first",
@@ -240,7 +227,7 @@
ruleForm: {
clustername: "",
clusterpwd: "",
- //virtualip: ""
+ virtualIp: ""
},
vrIpForm: {
enable: true,
@@ -262,15 +249,15 @@
{ required: true, message: "璇疯緭鍏ラ泦缇ゅ悕绉�", trigger: "change" }
],
clusterpwd: [{ validator: checkPwd, trigger: "change" }],
- // virtualip: [
- // { required: true, message: "璇疯緭鍏ヨ櫄鎷烮P", trigger: "change" }
- // ]
- },
- vrIpRules: {
- virtualip: [
- { required: true, message: "璇疯緭鍏ヨ櫄鎷烮P", trigger: "change" }
+ virtualIp: [
+ { required: true, validator: isIPv4, trigger: "change" }
]
},
+ // vrIpRules: {
+ // virtualIp: [
+ // { required: true, message: "璇疯緭鍏ヨ櫄鎷烮P", trigger: "change" }
+ // ]
+ // },
joinRules: {
clusterpwd: [
{ required: true, message: "璇疯緭鍏ラ泦缇ゅ瘑鐮�", trigger: "change" },
@@ -303,12 +290,13 @@
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
+ debugger
//alert("submit!");
let json = {
clusterId: this.clusterid,
clusterName: this.ruleForm.clustername,
password: this.ruleForm.clusterpwd,
- //virtualip: this.ruleForm.virtualip
+ virtualIp: this.ruleForm.virtualIp
};
this.createCluster(json).then(() => {
this.findCluster();
@@ -319,6 +307,7 @@
}
});
},
+
saveForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
@@ -338,7 +327,8 @@
}
});
},
- join(formName) {
+
+ join (formName) {
this.$refs[formName].validate(valid => {
if (valid) {
if (Object.keys(this.currentCluster).length === 0) {
@@ -482,9 +472,11 @@
this.clusterid = res.data.clusterId;
this.ruleForm.clustername = res.data.clusterName;
this.ruleForm.clusterpwd = res.data.clusterpwd
- //this.ruleForm.virtualip = res.data.virtualip
+ this.ruleForm.virtualIp = res.data.virtualIp
let list = res.data.nodes.map(i => {
+ debugger
let obj = {};
+ obj.device_type = i.device_type;
obj.cluster_id = i.cluster_id;
obj.clusterName = res.data.clusterName;
obj.create_time = i.create_time;
@@ -612,9 +604,7 @@
this.ruleForm.clusterpwd = uuid.join("");
},
- onIpBlur(ip) {
- this.vrIpForm.virtual_ip = ip;
- },
+
async getEsClusterNodes() {
let rsp = await getDevInfo();
let hostIpAddr = "";
@@ -699,8 +689,22 @@
message: rsp.msg
});
})
+ },
+ onIpBlur (ip) {
+ //this.vrIpForm.virtual_ip = ip;
+ this.ruleForm.virtualIp = ip;
+ console.log(this.ruleForm.virtualIp)
}
- }
+
+
+
+ },
+ mounted () {
+ this.findCluster();
+
+ },
+ created () { }
+
};
</script>
<style lang="scss">
@@ -772,4 +776,7 @@
height: 30px;
line-height: 30px;
}
+.nodes-svg{
+ background-color: aquamarine;
+}
</style>
--
Gitblit v1.8.0