zhuyijun/nacos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Service Detail page API docking

Browse Source
This commit is contained in:
王彦民 2018-10-14 17:41:16 +08:00
parent 71cf53361f
commit a95ac5179e
5 changed files with 95 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
console/src/main/resources/static/src/pages/ServiceDetail/EditClusterDialog.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import {Dialog, Form, Input, Switch, Select} from '@alifd/next';
import {Dialog, Form, Input, Switch, Select, Message} from '@alifd/next';
import {I18N, DIALOG_FORM_LAYOUT} from './constant'
const FormItem = Form.Item;
@ -22,7 +22,7 @@ class EditClusterDialog extends React.Component {
this.setState({
editCluster,
editClusterDialogVisible: true
}, () => console.log(this.state.editCluster))
})
}
hide() {
@ -30,7 +30,29 @@ class EditClusterDialog extends React.Component {
}
onConfirm() {
console.log('confirm', this.props, this.state)
const {openLoading, closeLoading, getServiceDetail} = this.props
const {name, serviceName, metadataText, healthChecker} = this.state.editCluster
window.request({
method: 'POST',
url: '/nacos/v1/ns/cluster/update',
data: {
serviceName,
clusterName: name,
metadata: metadataText,
healthChecker: JSON.stringify(healthChecker)
},
dataType: 'text',
beforeSend: () => openLoading(),
success: res => {
if (res !== 'ok') {
Message.error(res)
return
}
this.hide()
getServiceDetail()
},
complete: () => closeLoading()
})
}
onChangeCluster(changeVal) {

21
console/src/main/resources/static/src/pages/ServiceDetail/EditInstanceDialog.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import {Dialog, Form, Input, Switch} from '@alifd/next';
import {Dialog, Form, Input, Switch, Message} from '@alifd/next';
import {I18N, DIALOG_FORM_LAYOUT} from './constant'
const FormItem = Form.Item;
@ -28,7 +28,24 @@ class EditInstanceDialog extends React.Component {
}
onConfirm() {
console.log('confirm', this.props, this.state)
const {serviceName, clusterName, getInstanceList, openLoading, closeLoading} = this.props
const {ip, port, weight, enabled, metadataText} = this.state.editInstance
window.request({
method: 'POST',
url: '/nacos/v1/ns/instance/update',
data: {serviceName, clusterName, ip, port, weight, enable: enabled, metadata: metadataText},
dataType: 'text',
beforeSend: () => openLoading(),
success: res => {
if (res !== 'ok') {
Message.error(res)
return
}
this.hide()
getInstanceList()
},
complete: () => closeLoading()
})
}
onChangeCluster(changeVal) {

21
console/src/main/resources/static/src/pages/ServiceDetail/EditServiceDialog.js
View File

@ -1,5 +1,5 @@
import React from 'react';
import {Dialog, Form, Input, Select} from '@alifd/next';
import {Dialog, Form, Input, Select, Message} from '@alifd/next';
import {I18N, DIALOG_FORM_LAYOUT} from './constant'
const FormItem = Form.Item;
@ -29,8 +29,23 @@ class EditServiceDialog extends React.Component {
}
onConfirm() {
const editService = Object.assign({}, this.state)
console.log('confirm', editService)
const editService = Object.assign({}, this.state.editService)
const {name, protectThreshold, healthCheckMode, metadataText} = editService
window.request({
method: 'POST',
url: '/nacos/v1/ns/service/update',
data: {serviceName: name, protectThreshold, healthCheckMode, metadata: metadataText},
dataType: 'text',
beforeSend: () => this.setState({loading: true}),
success: res => {
if (res !== 'ok') {
Message.error(res)
return
}
this.props.getServiceDetail()
},
complete: () => this.setState({loading: false})
})
this.hide()
}

26
console/src/main/resources/static/src/pages/ServiceDetail/InstanceTable.js
View File

@ -20,6 +20,14 @@ class InstanceTable extends React.Component {
this.getInstanceList()
}
openLoading() {
this.setState({loading: true})
}
closeLoading() {
this.setState({loading: false})
}
getInstanceList() {
const {clusterName, serviceName} = this.props
if (!clusterName) return
@ -32,9 +40,9 @@ class InstanceTable extends React.Component {
pgSize: pageSize,
startPg: pageNum
},
beforeSend: () => this.setState({loading: true}),
beforeSend: () => this.openLoading(),
success: instance => this.setState({instance}),
complete: () => this.setState({loading: false})
complete: () => this.closeLoading()
})
}
@ -53,9 +61,9 @@ class InstanceTable extends React.Component {
url: '/nacos/v1/ns/instance/update',
data: {serviceName, clusterName, ip, port, weight, enable: !enabled},
dataType: 'text',
beforeSend: () => this.setState({loading: true}),
beforeSend: () => this.openLoading(),
success: () => this.setState({instance: newVal}),
complete: () => this.setState({loading: false})
complete: () => this.closeLoading()
})
}
@ -64,6 +72,7 @@ class InstanceTable extends React.Component {
}
render() {
const {clusterName, serviceName} = this.props
const {instance, pageSize, loading} = this.state
return instance.count ? (
<div>
@ -106,7 +115,14 @@ class InstanceTable extends React.Component {
)
: null
}
<EditInstanceDialog ref="editInstanceDialog"/>
<EditInstanceDialog
ref="editInstanceDialog"
serviceName={serviceName}
clusterName={clusterName}
openLoading={()=>this.openLoading()}
closeLoading={()=>this.closeLoading()}
getInstanceList={() => this.getInstanceList()}
/>
</div>
) : null
}

14
console/src/main/resources/static/src/pages/ServiceDetail/ServiceDetail.js
View File

@ -125,8 +125,18 @@ class ServiceDetail extends React.Component {
))
}
</Loading>
<EditServiceDialog ref="editServiceDialog"/>
<EditClusterDialog ref="editClusterDialog"/>
<EditServiceDialog
ref="editServiceDialog"
openLoading={() => this.openLoading()}
closeLoading={() => this.closeLoading()}
getServiceDetail={() => this.getServiceDetail()}
/>
<EditClusterDialog
ref="editClusterDialog"
openLoading={() => this.openLoading()}
closeLoading={() => this.closeLoading()}
getServiceDetail={() => this.getServiceDetail()}
/>
</div>
);
}