feat: 新功能、bug修复

新功能:
1.顶部菜单的Create按钮:Project、Module;
2.Project页:除Endpoint新增、Metrics列表外的功能;
BUG修复:
1.Config、Project、Alert各个后台交互操作都加上了成功、失败提示;
2.Config-Account:列表、弹框增加了删除功能
3.Config-PromServer:弹框中DC下拉框删除功能可以用了
4.Project:Endpoint列表--编辑--Host子弹框,优化了一下asset列表交互
This commit is contained in:
chenjinsong
2019-12-19 17:22:18 +08:00
parent 53639fb3e2
commit c5fda756c6
11 changed files with 723 additions and 207 deletions

View File

@@ -1,109 +1,107 @@
<template>
<transition name="right-box">
<div class="right-box right-box-endpoint" v-if="rightBox.show" @click.stop>
<el-scrollbar style="height: 100%">
<!-- begin--顶部按钮-->
<div class="right-box-top-btns">
<div class="right-box-top-btn right-box-top-btn-full" @click="esc">
<div class="right-box-btn-icon">
<i class="el-icon-close"></i>
</div>
<span>{{$t('overall.esc')}}</span>
<!-- begin--顶部按钮-->
<div class="right-box-top-btns">
<div class="right-box-top-btn right-box-top-btn-full" @click="esc">
<div class="right-box-btn-icon">
<i class="el-icon-close"></i>
</div>
<div class="right-box-top-btn right-box-top-btn-full" @click="save">
<div class="right-box-btn-icon">
<i class="el-icon-edit-outline"></i>
</div>
<span>{{$t('overall.save')}}</span>
<span>{{$t('overall.esc')}}</span>
</div>
<div class="right-box-top-btn right-box-top-btn-full" @click="save">
<div class="right-box-btn-icon">
<i class="el-icon-edit-outline"></i>
</div>
<div class="right-box-top-btn" v-if="module.id != ''" @click="del">
<div class="right-box-btn-icon">
<i class="el-icon-delete"></i>
</div>
<span>{{$t('overall.delete')}}</span>
<span>{{$t('overall.save')}}</span>
</div>
<div class="right-box-top-btn" v-if="module.id != ''" @click="del">
<div class="right-box-btn-icon">
<i class="el-icon-delete"></i>
</div>
<span>{{$t('overall.delete')}}</span>
</div>
</div>
<!-- end--顶部按钮-->
<!-- begin--标题-->
<div class="right-box-title">{{rightBox.title}}</div>
<!-- end--标题-->
<!-- begin--表单-->
<div class="right-box-form">
<!--project-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.project.project")}}</div>
<div class="right-box-form-content">
<el-select value-key="id" popper-class="config-dropdown" v-model="module.project" placeholder="" size="small">
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select>
</div>
</div>
<!-- end--顶部按钮-->
<!-- begin--标题-->
<div class="right-box-title">{{rightBox.title}}</div>
<!-- end--标题-->
<!-- begin--表单-->
<div class="right-box-form">
<!--project-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.project.project")}}</div>
<div class="right-box-form-content">
<el-select value-key="id" popper-class="config-dropdown" v-model="module.project" placeholder="" size="small">
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select>
<!--name-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.module.moduleName")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" maxlength="64" show-word-limit v-model="module.name" size="small"></el-input>
</div>
</div>
<!--description-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.module.description")}}</div>
<div class="right-box-form-content">
<el-input type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="module.remark" size="small"></el-input>
</div>
</div>
<!--tip-->
<div class="right-box-form-row">
<div class="right-box-form-content">
<div class="right-box-form-tip">
{{$t('project.module.tip.defaultEndpointSet')}}
<div class="line-100"></div>
{{$t('project.module.tip.relation')}}
</div>
</div>
<!--name-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.module.moduleName")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" maxlength="64" show-word-limit v-model="module.name" size="small"></el-input>
</div>
</div>
<!--port-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.endpoint.port")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" v-model="module.port" size="small"></el-input>
</div>
<!--description-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.module.description")}}</div>
<div class="right-box-form-content">
<el-input type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="module.remark" size="small"></el-input>
</div>
</div>
<!--path-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.endpoint.path")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" v-model="module.path" size="small"></el-input>
</div>
<!--tip-->
<div class="right-box-form-row">
<div class="right-box-form-content">
<div class="right-box-form-tip">
{{$t('project.module.tip.defaultEndpointSet')}}
<div class="line-100"></div>
{{$t('project.module.tip.relation')}}
</div>
</div>
</div>
<!--param-->
<div class="right-box-form-row">
<div class="right-box-form-label">
{{$t("project.endpoint.param")}}
<el-button class="param-btn param-btn-active margin-l-10" size="mini" @click="addParam"><i class="el-icon-plus"></i>{{$t('overall.add')}}</el-button>
<el-button class="param-btn param-btn-clear" size="mini" @click="clearAllParam">{{$t('overall.clearAll')}}</el-button>
</div>
<!--port-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.endpoint.port")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" v-model="module.port" size="small"></el-input>
</div>
</div>
<!--path-->
<div class="right-box-form-row">
<div class="right-box-form-label">{{$t("project.endpoint.path")}}</div>
<div class="right-box-form-content">
<el-input placeholder="" v-model="module.path" size="small"></el-input>
</div>
</div>
<!--param-->
<div class="right-box-form-row">
<div class="right-box-form-label">
{{$t("project.endpoint.param")}}
<el-button class="param-btn param-btn-active margin-l-10" size="mini" @click="addParam"><i class="el-icon-plus"></i>{{$t('overall.add')}}</el-button>
<el-button class="param-btn param-btn-clear" size="mini" @click="clearAllParam">{{$t('overall.clearAll')}}</el-button>
</div>
<div class="right-box-form-content">
<div class="param-box param-box-module">
<div class="param-box-row" v-for="(item, index) in module.paramObj">
<el-input placeholder="key" class="param-box-row-key" size="mini" v-model="item.key"></el-input>
<span class="param-box-row-eq">=</span>
<el-input placeholder="value" class="param-box-row-value" size="mini" v-model="item.value"></el-input>
<span class="param-box-row-symbol" @click="removeParam(index)"><i class="el-icon-minus"></i></span>
</div>
<div class="right-box-form-content">
<div class="param-box param-box-module">
<div class="param-box-row" v-for="(item, index) in module.paramObj">
<el-input placeholder="key" class="param-box-row-key" size="mini" v-model="item.key"></el-input>
<span class="param-box-row-eq">=</span>
<el-input placeholder="value" class="param-box-row-value" size="mini" v-model="item.value"></el-input>
<span class="param-box-row-symbol" @click="removeParam(index)"><i class="el-icon-minus"></i></span>
</div>
</div>
</div>
</div>
</div>
<!-- begin--底部按钮-->
<div class="right-box-bottom-btns">
<div @click="esc" class="right-box-bottom-btn right-box-bottom-btn-cancel right-box-bottom-btn-50">{{$t('overall.cancel')}}</div><div @click="save" class="right-box-bottom-btn right-box-bottom-btn-50">{{module.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
</div>
<!-- end--底部按钮-->
</el-scrollbar>
<!-- begin--底部按钮-->
<div class="right-box-bottom-btns">
<div @click="esc" class="right-box-bottom-btn right-box-bottom-btn-cancel right-box-bottom-btn-50">{{$t('overall.cancel')}}</div><div @click="save" class="right-box-bottom-btn right-box-bottom-btn-50">{{module.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
</div>
<!-- end--底部按钮-->
</div>
</transition>
</template>
@@ -140,7 +138,7 @@
if (this.module.id) {
this.$put('module', this.module).then(response => {
if (response.code === 200) {
this.$message({duration: 3000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
} else {
@@ -151,7 +149,7 @@
this.module.projectId = this.module.project.id;
this.$post('module', this.module).then(response => {
if (response.code === 200) {
this.$message({duration: 3000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
this.$emit("reload");
this.rightBox.show = false;
} else {
@@ -168,15 +166,15 @@
cancelButtonText: this.$t("tip.no"),
type: 'warning'
}).then(() => {
this.$delete("project?ids=" + this.project.id).then(response => {
this.$delete("module?ids=" + this.module.id).then(response => {
if (response.code === 200) {
this.$message({duration: 3000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.$message({duration: 1000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.rightBox.show = false;
this.$emit("reload");
} else {
this.$message.error(response.msg);
}
})
});
});
},
@@ -186,12 +184,14 @@
if (response.code === 200) {
this.projectList = response.data.list;
if (this.currentProject && this.currentProject.id) {
for (let i = 0; i < this.projectList.length; i++) {
/*for (let i = 0; i < this.projectList.length; i++) {
if (this.projectList[i].id == this.currentProject.id) {
this.currentProject = this.projectList[i];
break;
}
}
}*/
} else {
}
}
});