Skip to content

G
gateway-ui
Commit 75958a61 authored by derong.zhang's avatar derong.zhang
Browse files
Options

优化部分列表

parent af503111
Hide whitespace changes
Inline Side-by-side
Showing with 238 additions and 42 deletions
src/components/login.vue
View file @ 75958a61
......@@ -9,7 +9,7 @@
</Input>
</FormItem>
<FormItem prop="password">
<Input type="password" v-model="loginForm.password" placeholder="Password">
<Input type="password" v-model="loginForm.password" placeholder="Password" @keyup.enter.native='login'>
<Icon type="ios-lock-outline" slot="prepend"></Icon>
</Input>
</FormItem>
......@@ -27,14 +27,13 @@ import {login} from '../api/user.api'
import localStorage from '../services/localStorage.service.js'
export default {
data () {
var that=this
    const validateMenuClassifyId = (rule, value, callback) => {
    if (this.status) {  
      callback(new Error('用户名或密码错误'))
const validateMenuClassifyId = (rule, value, callback) => {
if (this.status) {
callback(new Error('用户名或密码错误'))
this.status = false
      } else {
        callback()
      }
} else {
callback()
}
}
return {
loginForm: {
......@@ -49,7 +48,7 @@ export default {
],
password: [
{required: true, message: '请输入密码', trigger: 'blur'},
{ required: true,validator: validateMenuClassifyId , trigger: 'blur'}
{ required: true, validator: validateMenuClassifyId, trigger: 'blur' }
]
}
}
......@@ -60,11 +59,11 @@ export default {
if (valid) {
let data = btoa(`${this.loginForm.loginName}:${this.loginForm.password}`)
login(data).then((data) => {
if(data.code === 400) {
if (data.code === 400) {
this.error = data.body
this.status = true
this.$refs['loginForm'].validate()
return
return false
} else {
this.status = false
localStorage.set('heimdallr-token', data.body['heimdallr-token'])
......
src/pages/mainconfiguration/mainconfiguration.vue
View file @ 75958a61
<template>
<div class="mainconfiguration">
<div class="mainconfiguration_header">
<Select v-model="server" style="width:95%;margin-left:2%" @on-change="selectserver">
<Option v-for="item in serviceList" :value="item" :key="item">{{ item }}</Option>
</Select>
<span><span class="selectsertitle">请选择要配置的服务：</span>
<Select v-model="server" style="width:82%" @on-change="selectserver" @on-open-change="selectserverchange">
<Option v-for="item in serviceList" :value="item" :key="item">{{ item }}</Option>
</Select>
</span>
</div>
<div class="mainconfiguration_content">
<div class="mainconfiguration_content_header">
......@@ -12,12 +14,12 @@
</div>
<div class="content_header_list">
<div class="header_list_left">
<p class="list_content" @click="authenticationlist('url_auth_list')">鉴权URL列表</p>
<p class="list_content" @click="foreignlist('url_white_list')">对外URL列表</p>
<p class="list_content" @click="internallylist('url_black_list')">对内URL列表</p>
<p class="list_content" @click="domainnameprefixlist('domain_prefix')">域名前缀列表</p>
<p class="list_content" @click="serviceAdministrator('service_owner')">服务管理员列表</p>
<p class="list_content" @click="testmo('test_mode')">测试模式</p>
<p class="list_content" @click="authenticationlist('url_auth_list')" :class="{'colorlistone':listonecolorauth}">鉴权URL列表</p>
<p class="list_content" @click="foreignlist('url_white_list')" :class="{'colorlistone':listonecolorfor}">对外URL列表</p>
<p class="list_content" @click="internallylist('url_black_list')" :class="{'colorlistone':listonecolorint}">对内URL列表</p>
<p class="list_content" @click="domainnameprefixlist('domain_prefix')" :class="{'colorlistone':listonecolordoma}">域名前缀列表</p>
<p class="list_content" @click="serviceAdministrator('service_owner')" :class="{'colorlistone':listonecolorserv}">服务管理员列表</p>
<p class="list_content" @click="testmo('test_mode')" :class="{'colorlistone':listonecolortest}">测试模式</p>
</div>
<div class="header_list_right">
<div class="list_right_header">
......@@ -26,7 +28,7 @@
</div>
<div class="list_right_content">
<p class="right_content_btn">
<Button type="primary" size = 'small' @click="configlist">发布</Button>
<Button type="primary" size = 'small' @click="configlist" :class="{'colorlistcolor':colorupdata}">发布</Button>
</p>
<p>
<Button type="primary" size = 'small' @click="rollback">回滚</Button>
......@@ -36,7 +38,7 @@
<div class="list_right_configure">
<div class="configure_content" v-show="isShowList">
<p class="configure_content_configure">
<span><Input v-model="singlebaraddition" placeholder="请输入配置项" style="width: 65%;margin-top:1%;float:left;margin-left:2%" /></span>
<span><Input v-model="singlebaraddition" placeholder="请输入配置项" style="width: 65%;margin-top:1%;float:left;margin-left:2%" @keyup.enter.native='oneadd'/></span>
<Button type="primary" size = 'small' style="margin:1.2% 0 0 1%;float:left" @click="oneadd">单条添加</Button>
<span style="float:right;margin:1.2% 2% 0% 1%">
<Button type="primary" size = 'small' @click="clear">清空</Button>
......@@ -50,8 +52,8 @@
<div class="configure_content_test" v-show="isShowList == false">
<p class="test_content">
<span style="margin-left:20px">状态：
<span class="test_conten_status" v-if="testmostatus == true">开启</span>
<span class="test_conten_status" v-if="testmostatus == false">关闭</span>
<span class="test_conten_status" v-if="testmostatus === true">开启</span>
<span class="test_conten_status" v-if="testmostatus === false">关闭</span>
</span>
<span class="test_content_btn">
<Button type="primary" size = 'small' @click="updatetestclick">修改</Button>
......@@ -86,7 +88,7 @@
<Modal v-model="rollbackModal" :mask-closable = 'false' :footer-hide='true' width='695'>
<div class="rollbackdiv">
<span v-for="(item,index) in rollbacklist" :key="index">
<span class="rollbackspan" @click="selectlist(item.value,item.key)">{{item.key}}</span>
<span class="rollbackspan" @click="selectlist(item.value,item.key,index)" :class="{'colorlistback':index==clickIndex1}">{{item.key}}</span>
</span>
<div class="rollbackcontentlist">
{{content}}
......@@ -104,6 +106,13 @@
<Button type="primary" size='small' @click="confiredelate">确认</Button>
</div>
</Modal>
<Modal v-model="changeserverModal" :mask-closable = 'false' :footer-hide='true' width='300'>
<h3 class="delatediv">是否确认切换服务?</h3>
<div class="rollbackdivbtn">
<Button type="primary" size='small' style="margin:0 20px" @click="changeserverModal = false">取消</Button>
<Button type="primary" size='small' @click="confiechangeserver">确认</Button>
</div>
</Modal>
<Modal v-model="updateconfigModal" :mask-closable = 'false' :footer-hide='true' width='400'>
<h3 class="updatediv">修改</h3>
<div class="updatedivclass">
......@@ -138,6 +147,51 @@
<Button type="primary" size='small' @click="confireupdatenode">保存</Button>
</div>
</Modal>
<Modal v-model="ContrastModal" :mask-closable = 'false' :footer-hide='true' width='500'>
<h3 class="updatediv">是否确认发布？</h3>
<div class="updatetestclass">
<p>
<span>原配置：{{contrastlist}}</span>
</p>
<p>
<span>新配置：{{logDataorigen}}</span>
</p>
</div>
<div class="rollbackdivbtn">
<Button type="primary" size='small' style="margin:0 20px" @click="ContrastModal = false">取消</Button>
<Button type="primary" size='small' @click="confirfabu">保存</Button>
</div>
</Modal>
<Modal v-model="ContrasttestModal" :mask-closable = 'false' :footer-hide='true' width='500'>
<h3 class="updatediv">是否确认发布？</h3>
<div class="updatetestclass">
<p>
<span v-if="aftertestmostatuorigen">原配置：开启</span>
<span v-else>原配置：开启</span>
</p>
<p>
<span v-if="aftertestmostatus">新配置：开启</span>
<span v-else>新配置：开启</span>
</p>
</div>
<div class="rollbackdivbtn">
<Button type="primary" size='small' style="margin:0 20px" @click="ContrasttestModal = false">取消</Button>
<Button type="primary" size='small' @click="confirfabu">保存</Button>
</div>
</Modal>
<Modal v-model="ContrastnodeModal" :mask-closable = 'false' :footer-hide='true' width='500'>
<h3 class="updatediv">是否确认发布？</h3>
<div class="updatetestclass">
<p>
<span>原配置：{{afterupdataweight}}</span>
<span>新配置：{{newupdateweight}}</span>
</p>
</div>
<div class="rollbackdivbtn">
<Button type="primary" size='small' style="margin:0 20px" @click="ContrastnodeModal = false">取消</Button>
<Button type="primary" size='small' @click="confirnode">保存</Button>
</div>
</Modal>
</div>
</template>
<script>
......@@ -148,15 +202,31 @@ export default {
server: '',
isShowList: true,
alladdModal: false,
listonecolorauth: true,
listonecolorfor: false,
listonecolorint: false,
listonecolorserv: false,
listonecolordoma: false,
listonecolortest: false,
colorupdata: false,
ContrastModal: false,
testdiv: false,
contrastlist: [],
logDataorigen: [],
clickIndex1: 0,
rollbackModal: false,
delateModal: false,
updateconfigModal: false,
updatetestModal: false,
updatenodeModal: false,
changeserverModal: false,
ContrasttestModal: false,
ContrastnodeModal: false,
aftertestmostatuorigen: false,
opentest: false,
closetest: false,
testmostatus: false,
aftertestmostatus: false,
testmostatus: 'false',
aftertestmostatus: 'false',
nodeId: '',
updateconfig: '',
alladdcontent: '',
......@@ -169,6 +239,7 @@ export default {
currentweight: '',
afterupdataweight: '',
updateweight: '',
newupdateweight: '',
key: 'url_auth_list',
service_name: '',
version: '',
......@@ -179,6 +250,8 @@ export default {
ruleInline: {},
serviceList: [],
singlebaraddition: '',
nodeupdataid: '',
nodeupdataweight: '',
logData: [
],
logCol: [
......@@ -246,7 +319,7 @@ export default {
key: 'weight',
align: 'center',
render: (h, params) => {
return h('div', params.row.Meta.weight || 100)
return h('div', (params.row.Meta && params.row.Meta.weight) || 100)
}
},
{
......@@ -275,7 +348,10 @@ export default {
size: 'small'
},
style: {
marginRight: '10px'
marginRight: '10px',
background: params.row.updatacolorclass === true ? 'yellow' : '',
color: params.row.updatacolorclass === true ? 'black' : '',
border: params.row.updatacolorclass === true ? '1px solid yellow' : ''
},
on: {
click: () => {
......@@ -292,16 +368,23 @@ export default {
},
methods: {
testmo (key) {
this.listonecolorauth = false
this.listonecolorfor = false
this.listonecolorint = false
this.listonecolorserv = false
this.listonecolordoma = false
this.listonecolortest = true
this.isShowList = false
this.key = key
this.testdiv = true
this.getkeytext(key)
let data = {
key: key,
service_name: this.server
}
getconfigurelist(data).then(data => {
// this.testmostatus = data.body
this.testmostatus = data.body == 'false' ? '关闭' : '开启'
this.testmostatus = data.body
this.aftertestmostatuorigen = data.body
data.body == false ? this.closetest = true : this.opentest = false
})
},
......@@ -316,9 +399,17 @@ export default {
confireupdaterido () {
this.updatetestModal = false
this.testmostatus = this.aftertestmostatus
this.testmostatus = this.aftertestmostatus == 'true' ? '开启' : '关闭'
this.colorupdata = true
this.colorupdatacolor = true
// this.testmostatus = this.aftertestmostatus === 'true' ? '开启' : '关闭'
},
serviceAdministrator (key) {
this.listonecolorauth = false
this.listonecolorfor = false
this.listonecolorint = false
this.listonecolorserv = true
this.listonecolordoma = false
this.listonecolortest = false
this.isShowList = true
this.key = key
this.logData = []
......@@ -326,6 +417,12 @@ export default {
this.getconfigurlist(key, this.server)
},
domainnameprefixlist (key) {
this.listonecolorauth = false
this.listonecolorfor = false
this.listonecolorint = false
this.listonecolorserv = false
this.listonecolordoma = true
this.listonecolortest = false
this.isShowList = true
this.key = key
this.logData = []
......@@ -333,6 +430,12 @@ export default {
this.getconfigurlist(key, this.server)
},
internallylist (key) {
this.listonecolorauth = false
this.listonecolorfor = false
this.listonecolorint = true
this.listonecolorserv = false
this.listonecolordoma = false
this.listonecolortest = false
this.isShowList = true
this.key = key
this.logData = []
......@@ -340,6 +443,12 @@ export default {
this.getconfigurlist(key, this.server)
},
foreignlist (key) {
this.listonecolorauth = false
this.listonecolorfor = true
this.listonecolorint = false
this.listonecolorserv = false
this.listonecolordoma = false
this.listonecolortest = false
this.isShowList = true
this.key = key
this.logData = []
......@@ -347,6 +456,12 @@ export default {
this.getconfigurlist(key, this.server)
},
authenticationlist (key) {
this.listonecolorauth = true
this.listonecolorfor = false
this.listonecolorint = false
this.listonecolorserv = false
this.listonecolordoma = false
this.listonecolortest = false
this.isShowList = true
this.key = key
this.logData = []
......@@ -358,9 +473,12 @@ export default {
this.$Message.error('请先输入要添加的内容')
return
}
this.contrastlist.push(this.singlebaraddition)
this.logData.push({sort: this.singlebaraddition})
this.logparamsarr.push(this.singlebaraddition)
this.singlebaraddition = ''
this.colorupdata = true
this.colorupdatacolor = true
},
alladd () {
this.alladdModal = true
......@@ -378,8 +496,11 @@ export default {
this.logparamsarr = arr
arr.map(item => {
this.logData.push({sort: item})
this.contrastlist.push(item)
})
this.alladdModal = false
this.colorupdata = true
this.colorupdatacolor = true
},
colsealladdmodal () {
this.alladdModal = false
......@@ -391,20 +512,33 @@ export default {
this.logparamsarr = []
},
rollback () {
this.rollbackModal = true
let data = {
service_name: this.versionNumber,
key: this.key
}
getVersionnumber(data).then(data => {
this.rollbacklist = data.body
this.rollbacklist.map((item, index) => {
if (index === 0) {
item.listonecolorback = true
} else {
item.listonecolorback = false
}
})
this.content = data.body.length == 0 ? '' : data.body[0].value
this.version = data.body.length == 0 ? '' : data.body[0].key
if (this.rollbacklist.length === 0) {
this.$Message.error('暂无要回滚的内容')
return false
} else {
this.rollbackModal = true
}
})
},
selectlist (value, key) {
selectlist (value, key, index) {
this.content = value
this.version = key
this.clickIndex1 = index
},
confirerollback () {
if (this.version == '') {
......@@ -431,6 +565,9 @@ export default {
this.logData = this.logData.filter(item => {
return item.sort != this.delateconfigurecontent
})
this.contrastlist.filter(item => {
return item != this.delateconfigurecontent
})
this.delateModal = false
},
updateconfigclick (data) {
......@@ -441,12 +578,14 @@ export default {
confireupdate () {
this.logData[this.updateconfigindex].sort = this.updateconfig
this.updateconfigModal = false
this.colorupdata = true
this.colorupdatacolor = true
},
updatetestclick () {
this.updatetestModal = true
},
updatenode (data) {
this.afterupdataweight = data.Meta.weight ? data.Meta.weight : 100
this.afterupdataweight = (data.Meta && data.Meta.weight) ? data.Meta.weight : 100
this.updatenodeIndex = data._index
this.updatenodeModal = true
},
......@@ -472,6 +611,7 @@ export default {
}
getconfigurelist(data).then(data => {
data.body.map(item => {
this.contrastlist.push(item)
this.logData.push({
sort: item
})
......@@ -479,10 +619,17 @@ export default {
})
},
configlist () {
if (this.logData.length == 0) {
this.$Message.error('请先添加要发布的内容')
return
this.logDataorigen = []
this.logData.map(item => {
this.logDataorigen.push(item.sort)
})
if (this.testdiv === true) {
this.ContrasttestModal = true
} else {
this.ContrastModal = true
}
},
confirfabu () {
let data = {
key: this.key,
service_name: this.server
......@@ -491,6 +638,9 @@ export default {
postconfigurelist(data, params).then(data => {
if (data.code === 200) {
this.$Message.success('发布成功')
this.colorupdata = false
this.colorupdatacolor = false
this.ContrastModal = false
}
})
},
......@@ -500,23 +650,44 @@ export default {
this.getkeytext('url_auth_list')
this.getconfigurlist('url_auth_list', this.server)
},
selectserverchange () {
if (this.colorupdatacolor === true) {
this.changeserverModal = true
}
},
confiechangeserver () {
this.colorupdatacolor = false
this.changeserverModal = false
},
getnodeList () {
let data = {
service_name: this.server
}
getnodelist(data).then(data => {
this.nodeData = data.body
this.nodeData.map(item => {
item.updatacolorclass = false
})
})
},
nodeconfigconfire (data) {
this.nodeupdataid = data.Id
this.nodeupdataweight = {weight: data.Meta.weight ? data.Meta.weight : 100}
this.ContrastnodeModal = true
},
confirnode () {
let params = {
node_id: data.Id,
node_id: this.nodeupdataid,
service_name: this.server
}
let weight = {weight: data.Meta.weight ? data.Meta.weight : 100}
let weight = this.nodeupdataweight
nodeconfig(params, weight).then(data => {
if (data.code === 200) {
this.$Message.success('发布成功')
this.colorupdatacolor = false
this.ContrastnodeModal = false
this.nodeData[this.updatenodeIndex].updatacolorclass = false
this.nodeData = this.nodeData.slice()
} else {
this.$Message.error(data.body)
}
......@@ -524,16 +695,24 @@ export default {
},
confireupdatenode () {
this.nodeData[this.updatenodeIndex].Meta.weight = this.updateweight
this.nodeData[this.updatenodeIndex].updatacolorclass = true
this.newupdateweight = this.updateweight
this.updatenodeModal = false
this.nodeData = this.nodeData.slice()
this.updateweight = ''
// this.colorupdata = true
this.colorupdatacolor = true
}
},
created () {
},
async mounted () {
await this.getserlist()
this.getkeytext('url_auth_list')
this.getconfigurlist('url_auth_list', this.server)
this.getnodeList()
},
destroyed () {
}
}
</script>
......@@ -690,7 +869,8 @@ export default {
margin-left: 50px
}
.test_conten_status{
margin-left: 10px
margin-left: 10px;
color: black
}
.alladdtitle{
text-align: center
......@@ -745,7 +925,24 @@ export default {
.textExplain{
margin-left: 10px;
display: inline-block;
margin-top:5px
padding: 10px 0
}
.selectsertitle{
margin-left:1%
}
.colorlistone{
background: #515a6e;
color: white
}
.colorlistcolor{
background: yellow;
border: 1px solid yellow;
color: black
}
.colorlistback{
background: #515a6e;
color: white;
font-weight: 800
}
</style>
<style >
......
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 to comment