{Setting.getLabel(i18next.t("application:SAML metadata"), i18next.t("application:SAML metadata - Tooltip"))} :
diff --git a/web/src/table/SamlAttributeTable.js b/web/src/table/SamlAttributeTable.js
new file mode 100644
index 00000000..32161c7d
--- /dev/null
+++ b/web/src/table/SamlAttributeTable.js
@@ -0,0 +1,162 @@
+// Copyright 2023 The Casdoor Authors. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import React from "react";
+import {DeleteOutlined, DownOutlined, UpOutlined} from "@ant-design/icons";
+import {Button, Col, Input, Row, Select, Table, Tooltip} from "antd";
+import * as Setting from "../Setting";
+import i18next from "i18next";
+
+const {Option} = Select;
+
+class SamlAttributeTable extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ classes: props,
+ };
+ }
+
+ updateTable(table) {
+ this.props.onUpdateTable(table);
+ }
+
+ updateField(table, index, key, value) {
+ table[index][key] = value;
+ this.updateTable(table);
+ }
+
+ addRow(table) {
+ const row = {Name: "", nameformat: "", value: ""};
+ if (table === undefined || table === null) {
+ table = [];
+ }
+ table = Setting.addRow(table, row);
+ this.updateTable(table);
+ }
+
+ deleteRow(table, i) {
+ table = Setting.deleteRow(table, i);
+ this.updateTable(table);
+ }
+
+ upRow(table, i) {
+ table = Setting.swapRow(table, i - 1, i);
+ this.updateTable(table);
+ }
+
+ downRow(table, i) {
+ table = Setting.swapRow(table, i, i + 1);
+ this.updateTable(table);
+ }
+
+ renderTable(table) {
+ const columns = [
+ {
+ title: i18next.t("user:Name"),
+ dataIndex: "name",
+ key: "name",
+ width: "200px",
+ render: (text, record, index) => {
+ return (
+ {
+ this.updateField(table, index, "name", e.target.value);
+ }} />
+ );
+ },
+ },
+ {
+ title: i18next.t("user:Name format"),
+ dataIndex: "nameformat",
+ key: "nameformat",
+ width: "200px",
+ render: (text, record, index) => {
+ return (
+
+ );
+ },
+ },
+ {
+ title: i18next.t("user:Value"),
+ dataIndex: "value",
+ key: "value",
+ width: "200px",
+ render: (text, record, index) => {
+ return (
+ {
+ this.updateField(table, index, "value", e.target.value);
+ }} />
+ );
+ },
+ },
+ {
+ title: i18next.t("general:Action"),
+ dataIndex: "action",
+ key: "action",
+ width: "20px",
+ render: (text, record, index) => {
+ return (
+
+
+ } size="small" onClick={() => this.upRow(table, index)} />
+
+
+ } size="small" onClick={() => this.downRow(table, index)} />
+
+
+ } size="small" onClick={() => this.deleteRow(table, index)} />
+
+
+ );
+ },
+ },
+ ];
+
+ return (
+ (
+
+
+
+ )}
+ columns={columns} dataSource={table} rowKey="key" size="middle" bordered
+ />
+ );
+ }
+
+ render() {
+ return (
+
+
+
+ {
+ this.renderTable(this.props.table)
+ }
+
+
+
+ );
+ }
+}
+
+export default SamlAttributeTable;