⬆️ Upgrading dependencies. nacos 1.3.0 ui

pig-register/src/main/resources/static/console-fe/.gitignore

@@ -6,6 +6,9 @@
 # production
 /dist
 
+# log
+yarn-error.log
+
 # misc
 .DS_Store
 npm-debug.log*

pig-register/src/main/resources/static/console-fe/package.json

@@ -69,6 +69,7 @@
     "axios": "^0.18.0",
     "jquery": "^3.3.1",
     "moment": "^2.23.0",
+    "qs": "^6.8.2",
     "prop-types": "^15.6.2",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",

pig-register/src/main/resources/static/console-fe/src/layouts/menu.js

@@ -57,6 +57,11 @@ export default function(model) {
         },
       ],
     },
+    globalAdmin ? authorityControlMenu : undefined,
+    {
+      key: 'namespace',
+      url: '/namespace',
+    },
     {
       key: 'clusterManagementVirtual',
       children: [
@@ -66,10 +71,5 @@ export default function(model) {
         },
       ],
     },
-    globalAdmin ? authorityControlMenu : undefined,
-    {
-      key: 'namespace',
-      url: '/namespace',
-    },
   ].filter(item => item);
 }

pig-register/src/main/resources/static/console-fe/src/locales/en-US.js

@@ -134,10 +134,7 @@ const I18N_CONF = {
     query: 'Search',
     pubNoData: 'No results found.',
     nodeState: 'NodeState',
-    clusterTerm: 'ClusterTerm',
-    leaderDueMs: 'LeaderDue(ms)',
-    heartbeatDueMs: 'HeartbeatDue(ms)',
-    voteFor: 'VoteFor',
+    extendInfo: 'NodeMetaData',
   },
   EditClusterDialog: {
     updateCluster: 'Update Cluster',

pig-register/src/main/resources/static/console-fe/src/locales/zh-CN.js

@@ -134,10 +134,7 @@ const I18N_CONF = {
     query: '查询',
     pubNoData: '没有数据',
     nodeState: '节点状态',
-    clusterTerm: '集群任期',
-    leaderDueMs: 'Leader止时(ms)',
-    heartbeatDueMs: '心跳止时(ms)',
-    voteFor: '投票对象',
+    extendInfo: '节点元数据',
   },
   EditClusterDialog: {
     updateCluster: '更新集群',

pig-register/src/main/resources/static/console-fe/src/pages/ClusterManagement/ClusterNodeList/ClusterNodeList.js

@@ -16,6 +16,9 @@ import PropTypes from 'prop-types';
 import {
   Button,
   Field,
+  Tag,
+  Icon,
+  Collapse,
   Form,
   Grid,
   Input,
@@ -32,6 +35,7 @@ import './ClusterNodeList.scss';
 const FormItem = Form.Item;
 const { Row, Col } = Grid;
 const { Column } = Table;
+const { Panel } = Collapse;
 
 @ConfigProvider.config
 class ClusterNodeList extends React.Component {
@@ -77,11 +81,11 @@ class ClusterNodeList extends React.Component {
       `keyword=${keyword}`,
     ];
     request({
-      url: `v1/ns/operator/cluster/states?${parameter.join('&')}`,
+      url: `v1/core/cluster/nodes?${parameter.join('&')}`,
       beforeSend: () => this.openLoading(),
-      success: ({ count = 0, clusterStateList = [] } = {}) => {
+      success: ({ count = 0, data = [] } = {}) => {
         this.setState({
-          dataSource: clusterStateList,
+          dataSource: data,
           total: count,
         });
       },
@@ -171,11 +175,51 @@ class ClusterNodeList extends React.Component {
                 locale={{ empty: pubNoData }}
                 getRowProps={row => this.rowColor(row)}
               >
-                <Column title={locale.nodeIp} dataIndex="nodeIp" />
-                <Column title={locale.nodeState} dataIndex="nodeState" />
-                <Column title={locale.clusterTerm} dataIndex="clusterTerm" />
-                <Column title={locale.leaderDueMs} dataIndex="leaderDueMs" />
-                <Column title={locale.heartbeatDueMs} dataIndex="heartbeatDueMs" />
+                <Column title={locale.nodeIp} dataIndex="address" width="30%" />
+                <Column
+                  title={locale.nodeState}
+                  dataIndex="state"
+                  width="20%"
+                  cell={function(value, index, record) {
+                    if (value === 'UP') {
+                      return (<Tag key={`p_p_${value}`} type="primary" color="green">
+                        {value}
+                              </Tag>);
+                    }
+                    if (value === 'DOWN') {
+                      return (<Tag key={`p_p_${value}`} type="primary" color="red">
+                        {value}
+                              </Tag>);
+                    }
+                    if (value === 'SUSPICIOUS') {
+                      return (<Tag key={`p_p_${value}`} type="primary" color="orange">
+                        {value}
+                              </Tag>);
+                    }
+                    return (<Tag key={`p_p_${value}`} type="primary" color="turquoise">
+                      {value}
+                            </Tag>);
+                  }}
+                />
+                <Column
+                  title={locale.extendInfo}
+                  dataIndex="extendInfo"
+                  width="50%"
+                  cell={function(value, index, record) {
+                    function showCollapse() {
+                      const collapse = (<Collapse>
+                        <Panel title="节点元数据">
+                          <ul>
+                            <li><pre>{JSON.stringify(value, null, 4)}</pre></li>
+                          </ul>
+                        </Panel>
+                                        </Collapse>);
+                      return collapse;
+                    }
+
+                    return showCollapse();
+                  }}
+                />
               </Table>
             </Col>
           </Row>

pig-register/src/main/resources/static/console-fe/src/pages/ConfigurationManagement/ConfigEditor/NewConfigEditor.js

@@ -39,6 +39,7 @@ import {
   ConfigProvider,
 } from '@alifd/next';
 import { resolve } from 'url';
+import qs from 'qs';
 
 const { Row, Col } = Grid;
 
@@ -222,14 +223,15 @@ class ConfigEditor extends React.Component {
       headers.betaIps = betaIps;
     }
     const form = { ...this.state.form, content: this.getCodeVal() };
-    const data = new FormData();
+    const payload = {};
     Object.keys(form).forEach(key => {
-      data.append(key, form[key]);
+      payload[key] = form[key];
     });
+    const stringify = require('qs/lib/stringify');
     return request({
       url: 'v1/cs/configs',
       method: 'post',
-      data,
+      data: stringify(payload),
       headers,
     }).then(res => {
       if (res) {

pig-register/src/main/resources/static/console-fe/src/pages/ConfigurationManagement/ConfigurationManagement/ConfigurationManagement.js

@@ -1200,6 +1200,7 @@ class ConfigurationManagement extends React.Component {
               <Form inline>
                 <Form.Item label="Data ID:">
                   <Input
+                    defaultValue={this.dataId}
                     htmlType="text"
                     placeholder={locale.fuzzyd}
                     style={{ width: 200 }}

pig-register/src/main/resources/static/console-fe/src/pages/ServiceManagement/ServiceDetail/EditInstanceDialog.js

@@ -25,6 +25,7 @@ class EditInstanceDialog extends React.Component {
   static propTypes = {
     serviceName: PropTypes.string,
     clusterName: PropTypes.string,
+    groupName: PropTypes.string,
     openLoading: PropTypes.string,
     closeLoading: PropTypes.string,
     getInstanceList: PropTypes.func,
@@ -54,7 +55,14 @@ class EditInstanceDialog extends React.Component {
   }
 
   onConfirm() {
-    const { serviceName, clusterName, getInstanceList, openLoading, closeLoading } = this.props;
+    const {
+      serviceName,
+      clusterName,
+      groupName,
+      getInstanceList,
+      openLoading,
+      closeLoading,
+    } = this.props;
     const { ip, port, ephemeral, weight, enabled, metadataText } = this.state.editInstance;
     request({
       method: 'PUT',
@@ -62,6 +70,7 @@ class EditInstanceDialog extends React.Component {
       data: {
         serviceName,
         clusterName,
+        groupName,
         ip,
         port,
         ephemeral,

pig-register/src/main/resources/static/console-fe/src/pages/ServiceManagement/ServiceDetail/InstanceTable.js

@@ -78,13 +78,14 @@ class InstanceTable extends React.Component {
   switchState(index, record) {
     const { instance } = this.state;
     const { ip, port, ephemeral, weight, enabled, metadata } = record;
-    const { clusterName, serviceName } = this.props;
+    const { clusterName, serviceName, groupName } = this.props;
     request({
       method: 'PUT',
       url: 'v1/ns/instance',
       data: {
         serviceName,
         clusterName,
+        groupName,
         ip,
         port,
         ephemeral,
@@ -112,7 +113,7 @@ class InstanceTable extends React.Component {
 
   render() {
     const { locale = {} } = this.props;
-    const { clusterName, serviceName } = this.props;
+    const { clusterName, serviceName, groupName } = this.props;
     const { instance, pageSize, loading } = this.state;
     return instance.count ? (
       <div>
@@ -178,6 +179,7 @@ class InstanceTable extends React.Component {
           ref={this.editInstanceDialog}
           serviceName={serviceName}
           clusterName={clusterName}
+          groupName={groupName}
           openLoading={() => this.openLoading()}
           closeLoading={() => this.closeLoading()}
           getInstanceList={() => this.getInstanceList()}

pig-register/src/main/resources/static/console-fe/src/utils/validateContent.js

@@ -53,6 +53,7 @@ export default {
     return str
       .replace('\n\r', '\n')
       .split('\n')
+      .filter(_str => _str)
       .every(_str => reg.test(_str.trim()));
   },