friendly rejection text

src/layout.tsx

@@ -2,7 +2,7 @@ import React, {useEffect, useMemo, useRef, useState} from 'react';
 import {Redirect, Route, Switch, useHistory} from 'react-router-dom';
 import {Breadcrumb, Layout, Menu, Spin} from '@arco-design/web-react';
 import cs from 'classnames';
-import {IconCloud, IconDashboard, IconMenuFold, IconMenuUnfold, IconUser,} from '@arco-design/web-react/icon';
+import {IconCloud, IconDashboard, IconEdit, IconMenuFold, IconMenuUnfold, IconUser,} from '@arco-design/web-react/icon';
 import {useSelector} from 'react-redux';
 import qs from 'query-string';
 import NProgress from 'nprogress';
@@ -29,6 +29,8 @@ function getIconFromKey(key) {
     return <IconCloud className={styles.icon}/>;
   case 'personal':
     return <IconUser className={styles.icon}/>;
+  case'messages-edit':
+    return <IconEdit className={styles.icon}/>
   default:
     return <div className={styles['icon-empty']}/>;
   }

src/locale/zh-CN.json

@@ -14,6 +14,7 @@
   "menu.yggdrasil.services": "远程树",
   "menu.yggdrasil.players": "玩家信息",
   "menu.yggdrasil.settings": "鉴权设置",
+  "menu.messages-edit": "消息段编辑",
   "navbar.logout": "退出登录",
   "settings.title": "页面配置",
   "settings.themeColor": "主题色",
@@ -69,6 +70,12 @@
   "reset-password.new": "新密码",
   "reset-password.confirm": "确认密码",
   "reset-password.old-password-incorrect": "原始密码错误",
+  "message-edit.key": "关键字",
+  "message-edit.val": "最终值",
+  "message-edit.def": "默认值",
+  "message-edit.reset": "重置为默认值",
+  "message-edit.resetted": "已重置为默认值",
+  "message-edit.submitted": "已修改",
   "message.tab.title.message": "消息",
   "message.tab.title.notice": "通知",
   "message.tab.title.todo": "待办",

src/pages/messages-edit/index.tsx

@@ -0,0 +1,143 @@
+import React, {useEffect, useState} from 'react';
+import {Button, Card, Form, Input, Message, Modal, Table, TableColumnProps, Typography} from '@arco-design/web-react';
+import axios from "axios";
+import {useTranslation} from "react-i18next";
+
+function EntryEditor({record, refetch}) {
+  const {t} = useTranslation()
+  const [visible, setVisible] = useState(false)
+  const [form] = Form.useForm();
+  const [processing, setProcessing] = useState(false)
+
+  form.setFieldsValue(record)
+
+  async function doReset() {
+    setProcessing(true);
+    try {
+      await axios.post('/api/messages/update', {key: record.key})
+      Message.info(t('message-edit.resetted'))
+      setVisible(false)
+      refetch()
+    } catch (e) {
+      Message.warning(String(e))
+    } finally {
+      setProcessing(false)
+    }
+  }
+
+  async function doSubmit() {
+    const data = await form.validate()
+    setProcessing(true);
+    try {
+      await axios.post('/api/messages/update', {key: record.key, value: data.val})
+      Message.info(t('message-edit.submitted'))
+      setVisible(false)
+      refetch()
+    } catch (e) {
+      Message.warning(String(e))
+    } finally {
+      setProcessing(false)
+    }
+  }
+
+  return <>
+    <Button onClick={() => setVisible(true)}>{t('message.edit')}</Button>
+    <Modal
+      visible={visible}
+      onCancel={() => setVisible(false)}
+      title={record.key}
+      style={{width: 800}}
+      footer={(a, b) => <>
+        {a}
+        <Button onClick={doReset}>{t('message-edit.reset')}</Button>
+        {b}
+      </>}
+      confirmLoading={processing}
+      onConfirm={doSubmit}
+    >
+      <Form form={form}>
+        <Form.Item label={t('message-edit.def')} field='def' disabled>
+          <Input.TextArea style={{minHeight: 120}}/>
+        </Form.Item>
+        <Form.Item label={t('message-edit.val')} field='val'>
+          <Input.TextArea style={{minHeight: 120}} placeholder={record.def}/>
+        </Form.Item>
+      </Form>
+    </Modal>
+  </>
+}
+
+function MessagesEdit() {
+  const {t} = useTranslation();
+  const [loading, setLoading] = useState(true);
+  const [data, setData] = useState([{}]);
+
+
+  const columns: TableColumnProps[] = [
+    {
+      title: t('message-edit.key'),
+      dataIndex: 'key',
+      sorter: (a, b) => a.key.localeCompare(b.key),
+    },
+    {
+      title: t('message-edit.val'),
+      dataIndex: 'val',
+      render: (_, record) => {
+        return record.val || record.def
+      }
+    },
+    {
+      title: '',
+      dataIndex: '',
+      render: (_, record) => <EntryEditor record={record} refetch={reloadData}/>,
+      width: 150
+    },
+  ];
+
+
+  async function reloadData() {
+    setLoading(true)
+    try {
+      const serverDefaults = await axios.get('/api/messages/default')
+      if (serverDefaults.status != 200) {
+        Message.error(serverDefaults.data.message)
+        return
+      }
+      const serverDefined = await axios.get('/api/messages/defined')
+      if (serverDefined.status != 200) {
+        Message.error(serverDefined.data.message)
+        return
+      }
+      const data0 = {};
+      for (const key in serverDefaults.data.data) {
+        data0[key] = {
+          key,
+          def: serverDefaults.data.data[key],
+          val: serverDefined.data.data[key],
+        };
+      }
+
+      setData(Object.keys(data0).map(it => data0[it]));
+
+    } catch (e) {
+      Message.warning(String(e))
+      console.warn(e)
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  useEffect(() => {
+    reloadData()
+  }, []);
+
+  return (
+    <Card style={{height: '100%'}}>
+      <Typography.Title heading={6}>
+      </Typography.Title>
+      <Table loading={loading} data={data} columns={columns} virtualized pagination/>
+    </Card>
+  );
+}
+
+export default MessagesEdit;

src/routes.ts

@@ -32,6 +32,10 @@ export const routes: IRoute[] = [
       },
     ],
   },
+  {
+    name: 'menu.messages-edit',
+    key: 'messages-edit',
+  },
   {
     name: 'menu.yggdrasil',
     key: 'yggdrasil',