This is an automated email from the ASF dual-hosted git repository.
dengliming pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/shenyu-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new f5fda70f [type:feature] dict-index optimization (#236)
f5fda70f is described below
commit f5fda70f66303ba695056f89bc715ccff680e33d
Author: likeguo <[email protected]>
AuthorDate: Fri Sep 2 16:22:30 2022 +0800
[type:feature] dict-index optimization (#236)
---
src/routes/System/Dict/index.js | 98 ++++++++++++++++++++++++++-------
src/routes/System/PluginHandle/index.js | 10 ++--
2 files changed, 83 insertions(+), 25 deletions(-)
diff --git a/src/routes/System/Dict/index.js b/src/routes/System/Dict/index.js
index 93c70581..b18fd617 100644
--- a/src/routes/System/Dict/index.js
+++ b/src/routes/System/Dict/index.js
@@ -16,7 +16,7 @@
*/
import React, { Component } from "react";
-import {Table, Input, Button, message, Popconfirm} from "antd";
+import {Table, Input, Button, message, Popconfirm, Popover, Tag} from "antd";
import { connect } from "dva";
import { resizableComponents } from '../../../utils/resizable';
import AddModal from "./AddModal";
@@ -281,24 +281,55 @@ export default class ShenYuDict extends Component {
dataIndex: "type",
key: "type",
ellipsis:true,
- width: 180,
+ // width: 180,
sorter: (a,b) => a.type > b.type ? 1 : -1,
+ render: text => {
+ if (text.length < 5) {
+ return <Tag color="cyan">{text}</Tag>;
+ } else if (text.length < 15) {
+ return <Tag color="purple">{text}</Tag>;
+ } else if (text.length < 25) {
+ return <Tag color="blue">{text}</Tag>;
+ }
+ return <Tag color="red">{text}</Tag>;
+ }
},
- {
- align: "center",
- title: getIntlContent("SHENYU.DIC.CODE"),
- dataIndex: "dictCode",
- key: "dictCode",
- ellipsis:true,
- width: 350,
- },
+
{
align: "center",
title: getIntlContent("SHENYU.DIC.NAME"),
dataIndex: "dictName",
key: "dictName",
ellipsis:true,
- width: 200,
+ // width: 200,
+ render: (text,record) => {
+ let content =(
+ <div>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.DIC.DESCRIBE")}</span> :
+ <span style={{color:"#1f640a"}}>{record.desc}</span>
+ </p>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.DIC.CODE")}</span>:
+ <span style={{color:"#1f640a"}}>{record.dictCode}</span>
+ </p>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.DIC.TYPE")}</span> :
+ <span style={{color:"#1f640a"}}>{record.type}</span>
+ </p>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.SYSTEM.CREATETIME")}</span> :
+ <span style={{color:"#1f640a"}}>{record.dateCreated}</span>
+ </p>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.SYSTEM.UPDATETIME")}</span> :
+ <span style={{color:"#1f640a"}}>{record.dateUpdated}</span>
+ </p>
+ </div>
+ );
+ return <Popover placement="topLeft" content={content}
title={getIntlContent("SHENYU.DIC.DESCRIBE")}><div style={{color:
"#1f640a"}}>{text || "----"}</div></Popover>
+
+ }
},
{
align: "center",
@@ -306,15 +337,42 @@ export default class ShenYuDict extends Component {
dataIndex: "dictValue",
key: "dictValue",
ellipsis:true,
- width: 140,
- },
- {
- align: "center",
- title: getIntlContent("SHENYU.DIC.DESCRIBE"),
- dataIndex: "desc",
- key: "desc",
- ellipsis:true,
+ // width: 140,
+ render: (text,record) => {
+ let content =(
+ <div>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.DIC.DESCRIBE")}</span> :
+ <span style={{color:"#1f640a"}}>{record.desc}</span>
+ </p>
+ <p>
+ <span
style={{color:"#204969"}}>{getIntlContent("SHENYU.DIC.TYPE")}</span> :
+ <span style={{color:"#1f640a"}}>{record.type}</span>
+ </p>
+ <hr />
+ <p>
+ <span style={{color:"#204969"}}>code</span>:
+ <span style={{color:"#1f640a"}}>{record.dictCode}</span>
+ </p>
+ <p>
+ <span style={{color:"#204969"}}>name</span>:
+ <span style={{color:"#1f640a"}}>{record.dictName}</span>
+ </p>
+ <p>
+ <span style={{color:"#204969"}}>value</span>:
+ <span style={{color:"#1f640a"}}>{record.dictValue}</span>
+ </p>
+ </div>
+ );
+ return (
+ <Popover placement="topLeft" content={content}
title={getIntlContent("SHENYU.DIC.DESCRIBE")}>
+ <div style={{color: "#260033","fontWeight":"bold"}}>{text ||
"----"}</div>
+ </Popover>
+ )
+
+ }
},
+
{
align: "center",
title: getIntlContent("SHENYU.PLUGIN.SORT"),
@@ -458,7 +516,7 @@ export default class ShenYuDict extends Component {
rowKey={record => record.id}
loading={loading}
columns={columns}
- scroll={{ x: 1350 }}
+ // scroll={{ x: 1350 }}
dataSource={shenyuDictList}
rowSelection={rowSelection}
pagination={{
diff --git a/src/routes/System/PluginHandle/index.js
b/src/routes/System/PluginHandle/index.js
index eef2054f..05889076 100644
--- a/src/routes/System/PluginHandle/index.js
+++ b/src/routes/System/PluginHandle/index.js
@@ -48,18 +48,18 @@ export default class PluginHandle extends Component {
}
componentWillMount = async () => {
- this.loadPluginDict();
+ await this.loadPluginDict();
this.initPluginColumns();
this.query()
}
- componentDidUpdate() {
+ componentDidUpdate = async () => {
const { language } = this.props;
const { localeName } = this.state;
if (language !== localeName) {
- this.loadPluginDict();
+ await this.loadPluginDict();
this.initPluginColumns();
this.changeLocale(language);
}
@@ -85,9 +85,9 @@ export default class PluginHandle extends Component {
/**
* load plugin drop dict
*/
- loadPluginDict = () => {
+ loadPluginDict = async () => {
const {dispatch} = this.props;
- dispatch({
+ await dispatch({
type: "pluginHandle/fetchPluginList",
});
this.setState({pluginDict: this.props.pluginHandle.pluginDropDownList})
