change user search text.

src/common/model/global/i18n/LangEn.ts

@@ -315,7 +315,8 @@ let LangEn = {
     transfigurationPromptText: "Transfiguration Prompt",
     transfigurationPrompt: "You will login as this user.Please visit this link in other browser, if in current browser, you will logout.",
     allUsers: "All users",
-    partialUsers: "Partial users"
+    partialUsers: "Partial users",
+    searchUser: "Search user"
   },
   model: {
     usernameRule: "only lowercase letter and number and _ is permitted.",

src/common/model/global/i18n/LangZh.ts

@@ -315,7 +315,8 @@ let LangZh = {
     transfigurationPromptText: "变身提示",
     transfigurationPrompt: "您将使用该用户的身份登录。请复制以下链接到其他浏览器访问，在当前浏览器访问会导致当前用户登录信息失效。",
     allUsers: "全部用户",
-    partialUsers: "局部用户"
+    partialUsers: "局部用户",
+    searchUser: "搜索用户"
   },
   model: {
     usernameRule: "用户名只能包含字母，数字和\"_\"",

src/pages/user/List.tsx

@@ -1,40 +1,42 @@
-import React from 'react';
-import {Link, RouteComponentProps} from 'react-router-dom';
-import './List.less';
-import SortDirection from '../../common/model/base/SortDirection';
-import Pager from '../../common/model/base/Pager';
-import StringUtil from '../../common/util/StringUtil';
-import FileUtil from '../../common/util/FileUtil';
-import DateUtil from '../../common/util/DateUtil';
-import FilterPanel from '../widget/filter/FilterPanel';
-import TableEmpty from '../widget/TableEmpty';
+import React from "react";
+import { Link, RouteComponentProps } from "react-router-dom";
+import "./List.less";
+import SortDirection from "../../common/model/base/SortDirection";
+import Pager from "../../common/model/base/Pager";
+import StringUtil from "../../common/util/StringUtil";
+import FileUtil from "../../common/util/FileUtil";
+import DateUtil from "../../common/util/DateUtil";
+import FilterPanel from "../widget/filter/FilterPanel";
+import TableEmpty from "../widget/TableEmpty";
 import User from "../../common/model/user/User";
 import TankComponent from "../../common/component/TankComponent";
 import TankTitle from "../widget/TankTitle";
-import {ColumnProps} from 'antd/lib/table';
-import {Table, Button, Modal, Tag, Tooltip} from "antd";
-import {CheckCircleOutlined, PlusOutlined, StopOutlined, UserSwitchOutlined} from '@ant-design/icons';
-import {UserRoleMap} from "../../common/model/user/UserRole";
-import {UserStatus, UserStatusMap} from "../../common/model/user/UserStatus";
-import {DeleteOutlined, EditOutlined, ExclamationCircleFilled} from "@ant-design/icons/lib";
+import { ColumnProps } from "antd/lib/table";
+import { Table, Button, Modal, Tag, Tooltip } from "antd";
+import {
+  CheckCircleOutlined,
+  PlusOutlined,
+  StopOutlined,
+  UserSwitchOutlined,
+} from "@ant-design/icons";
+import { UserRoleMap } from "../../common/model/user/UserRole";
+import { UserStatus, UserStatusMap } from "../../common/model/user/UserStatus";
+import {
+  DeleteOutlined,
+  EditOutlined,
+  ExclamationCircleFilled,
+} from "@ant-design/icons/lib";
 import MessageBoxUtil from "../../common/util/MessageBoxUtil";
 import Color from "../../common/model/base/option/Color";
 import TransfigurationModal from "./widget/TransfigurationModal";
 import Lang from "../../common/model/global/Lang";
 import Moon from "../../common/model/global/Moon";
 
+interface IProps extends RouteComponentProps {}
 
-interface IProps extends RouteComponentProps {
-
-}
-
-interface IState {
-
-}
-
+interface IState {}
 
 export default class List extends TankComponent<IProps, IState> {
-
   //获取分页的一个帮助器
   pager: Pager<User> = new Pager<User>(this, User, 10);
 
@@ -44,9 +46,7 @@ export default class List extends TankComponent<IProps, IState> {
     this.state = {};
   }
 
-
   componentDidMount() {
-
     //刷新一下列表
     let that = this;
 
@@ -62,52 +62,44 @@ export default class List extends TankComponent<IProps, IState> {
   }
 
   refresh() {
-
     let that = this;
 
     //如果没有任何的排序，默认使用时间倒序
     if (!that.pager.getCurrentSortFilter()) {
-      that.pager.setFilterValue('orderCreateTime', SortDirection.DESC);
+      that.pager.setFilterValue("orderCreateTime", SortDirection.DESC);
     }
 
     that.pager.httpList();
   }
 
   toggleStatus(user: User) {
-    let that = this
+    let that = this;
     user.httpToggleStatus(function () {
-      MessageBoxUtil.success(Lang.t("operationSuccess"))
-      that.updateUI()
-    })
+      MessageBoxUtil.success(Lang.t("operationSuccess"));
+      that.updateUI();
+    });
   }
 
-
   delete(user: User) {
-    let that = this
+    let that = this;
     Modal.confirm({
       title: Lang.t("user.deleteHint", user.username),
-      icon: <ExclamationCircleFilled twoToneColor={Color.WARNING}/>,
+      icon: <ExclamationCircleFilled twoToneColor={Color.WARNING} />,
       onOk: () => {
         user.httpDel(function () {
-          MessageBoxUtil.success(Lang.t("operationSuccess"))
-          that.refresh()
-        })
+          MessageBoxUtil.success(Lang.t("operationSuccess"));
+          that.refresh();
+        });
       },
     });
-
   }
 
-
   transfiguration(user: User) {
-
-    let that = this
-    TransfigurationModal.open(user)
-
+    let that = this;
+    TransfigurationModal.open(user);
   }
 
-
   render() {
-
     let that = this;
 
     //router中传入的路由相关对象
@@ -116,146 +108,175 @@ export default class List extends TankComponent<IProps, IState> {
     //pager对象
     let pager = this.pager;
 
-    let user: User = Moon.getSingleton().user
+    let user: User = Moon.getSingleton().user;
 
-    const columns: ColumnProps<User>[] = [{
-      title: Lang.t("user.avatar"),
-      dataIndex: 'avatarUrl',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <Link to={StringUtil.prePath(match.path) + '/detail/' + record.uuid}>
-          <img alt="avatar" className='avatar-small cursor' src={record.getAvatarUrl()}/>
-        </Link>
-      ),
-    }, {
-      title: Lang.t("user.username"),
-      dataIndex: 'username',
-      render: (text: any, record: User, index: number): React.ReactNode => {
-        return <div>
-          <div>
-            <Link to={StringUtil.prePath(match.path) + '/detail/' + record.uuid}>{record.username}</Link>
-          </div>
-          {
-            user.uuid === record.uuid && (
-              <div className="text-danger">(It's you)</div>
-            )
-          }
-        </div>
-      },
-    }, {
-      title: Lang.t("user.role"),
-      dataIndex: 'role',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <Tag color={UserRoleMap[record.role].color}>{UserRoleMap[record.role].name}</Tag>
-      ),
-    }, {
-      title: Lang.t("user.singleFileSizeLimit"),
-      dataIndex: 'sizeLimit',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <span>{FileUtil.humanFileSize(record.sizeLimit)}</span>
-      ),
-    }, {
-      title: Lang.t("user.totalFileSize"),
-      dataIndex: 'totalSize',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <span>{FileUtil.humanFileSize(record.totalSize)}</span>
-      ),
-    }, {
-      title: Lang.t("user.totalFileSizeLimit"),
-      dataIndex: 'totalSizeLimit',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <span>{FileUtil.humanFileSize(record.totalSizeLimit)}</span>
-      ),
-    }, {
-      title: Lang.t("user.status"),
-      dataIndex: 'status',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <Tag color={UserStatusMap[record.status].color}>{UserStatusMap[record.status].name}</Tag>
-      ),
-    }, {
-      title: Lang.t("user.lastLogin"),
-      dataIndex: 'lastTime',
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        <div>
-          <div>{record.lastIp}</div>
-          <div>{DateUtil.simpleDateTime(record.lastTime)}</div>
-        </div>
-      ),
-    }, {
-      title: Lang.t("createTime"),
-      dataIndex: 'createTime',
-      sorter: true,
-      sortOrder: pager.getDefaultSortOrder('createTime'),
-      sortDirections: [SortDirection.DESCEND, SortDirection.ASCEND],
-      render: (text: any, record: User, index: number): React.ReactNode => (
-        DateUtil.simpleDateTime(text)
-      ),
-    }, {
-      title: Lang.t("operation"),
-      dataIndex: 'action',
-      render: (text: any, record: User) => (
-        <span>
-
-          <Link title={Lang.t("edit")}
-                to={StringUtil.prePath(match.path) + '/edit/' + record.uuid}>
-            <Tooltip title={Lang.t("edit")}>
-              <EditOutlined className="btn-action"/>
-            </Tooltip>
+    const columns: ColumnProps<User>[] = [
+      {
+        title: Lang.t("user.avatar"),
+        dataIndex: "avatarUrl",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <Link to={StringUtil.prePath(match.path) + "/detail/" + record.uuid}>
+            <img
+              alt="avatar"
+              className="avatar-small cursor"
+              src={record.getAvatarUrl()}
+            />
           </Link>
+        ),
+      },
+      {
+        title: Lang.t("user.username"),
+        dataIndex: "username",
+        render: (text: any, record: User, index: number): React.ReactNode => {
+          return (
+            <div>
+              <div>
+                <Link
+                  to={StringUtil.prePath(match.path) + "/detail/" + record.uuid}
+                >
+                  {record.username}
+                </Link>
+              </div>
+              {user.uuid === record.uuid && (
+                <div className="text-danger">(It's you)</div>
+              )}
+            </div>
+          );
+        },
+      },
+      {
+        title: Lang.t("user.role"),
+        dataIndex: "role",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <Tag color={UserRoleMap[record.role].color}>
+            {UserRoleMap[record.role].name}
+          </Tag>
+        ),
+      },
+      {
+        title: Lang.t("user.singleFileSizeLimit"),
+        dataIndex: "sizeLimit",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <span>{FileUtil.humanFileSize(record.sizeLimit)}</span>
+        ),
+      },
+      {
+        title: Lang.t("user.totalFileSize"),
+        dataIndex: "totalSize",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <span>{FileUtil.humanFileSize(record.totalSize)}</span>
+        ),
+      },
+      {
+        title: Lang.t("user.totalFileSizeLimit"),
+        dataIndex: "totalSizeLimit",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <span>{FileUtil.humanFileSize(record.totalSizeLimit)}</span>
+        ),
+      },
+      {
+        title: Lang.t("user.status"),
+        dataIndex: "status",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <Tag color={UserStatusMap[record.status].color}>
+            {UserStatusMap[record.status].name}
+          </Tag>
+        ),
+      },
+      {
+        title: Lang.t("user.lastLogin"),
+        dataIndex: "lastTime",
+        render: (text: any, record: User, index: number): React.ReactNode => (
+          <div>
+            <div>{record.lastIp}</div>
+            <div>{DateUtil.simpleDateTime(record.lastTime)}</div>
+          </div>
+        ),
+      },
+      {
+        title: Lang.t("createTime"),
+        dataIndex: "createTime",
+        sorter: true,
+        sortOrder: pager.getDefaultSortOrder("createTime"),
+        sortDirections: [SortDirection.DESCEND, SortDirection.ASCEND],
+        render: (text: any, record: User, index: number): React.ReactNode =>
+          DateUtil.simpleDateTime(text),
+      },
+      {
+        title: Lang.t("operation"),
+        dataIndex: "action",
+        render: (text: any, record: User) => (
+          <span>
+            <Link
+              title={Lang.t("edit")}
+              to={StringUtil.prePath(match.path) + "/edit/" + record.uuid}
+            >
+              <Tooltip title={Lang.t("edit")}>
+                <EditOutlined className="btn-action" />
+              </Tooltip>
+            </Link>
 
-          {
-            record.status === UserStatus.OK && record.uuid !== user.uuid && (
+            {record.status === UserStatus.OK && record.uuid !== user.uuid && (
               <Tooltip title={Lang.t("user.disableUser")}>
-                <StopOutlined className="btn-action" style={{color: Color.DANGER}}
-                              onClick={this.toggleStatus.bind(this, record)}/>
+                <StopOutlined
+                  className="btn-action"
+                  style={{ color: Color.DANGER }}
+                  onClick={this.toggleStatus.bind(this, record)}
+                />
               </Tooltip>
-            )
-          }
+            )}
 
-          {
-            record.status === UserStatus.DISABLED && record.uuid !== user.uuid && (
-              <Tooltip title={Lang.t("user.activeUser")}>
-                <CheckCircleOutlined className="btn-action" style={{color: Color.SUCCESS}}
-                                     onClick={this.toggleStatus.bind(this, record)}/>
-              </Tooltip>
-            )
-          }
+            {record.status === UserStatus.DISABLED &&
+              record.uuid !== user.uuid && (
+                <Tooltip title={Lang.t("user.activeUser")}>
+                  <CheckCircleOutlined
+                    className="btn-action"
+                    style={{ color: Color.SUCCESS }}
+                    onClick={this.toggleStatus.bind(this, record)}
+                  />
+                </Tooltip>
+              )}
 
-          {
-            record.status === UserStatus.DISABLED && record.uuid !== user.uuid && (
-              <Tooltip title={Lang.t("user.deleteUser")}>
-                <DeleteOutlined className="btn-action" style={{color: Color.DANGER}}
-                                onClick={this.delete.bind(this, record)}/>
-              </Tooltip>
-            )
-          }
+            {record.status === UserStatus.DISABLED &&
+              record.uuid !== user.uuid && (
+                <Tooltip title={Lang.t("user.deleteUser")}>
+                  <DeleteOutlined
+                    className="btn-action"
+                    style={{ color: Color.DANGER }}
+                    onClick={this.delete.bind(this, record)}
+                  />
+                </Tooltip>
+              )}
 
-          {
-            record.uuid !== user.uuid && (
+            {record.uuid !== user.uuid && (
               <Tooltip title={Lang.t("user.transfiguration")}>
-                <UserSwitchOutlined className="btn-action" style={{color: Color.PRIMARY}}
-                                    onClick={this.transfiguration.bind(this, record)}/>
+                <UserSwitchOutlined
+                  className="btn-action"
+                  style={{ color: Color.PRIMARY }}
+                  onClick={this.transfiguration.bind(this, record)}
+                />
               </Tooltip>
-            )
-          }
-
-
-
-
-        </span>
-      ),
-    }];
+            )}
+          </span>
+        ),
+      },
+    ];
 
     return (
       <div className="page-user-list">
-
         <TankTitle name={Lang.t("layout.users")}>
-          <Link to={'/user/create'}>
-            <Button type={"primary"} icon={<PlusOutlined/>}>{Lang.t("user.createUser")}</Button>
+          <Link to={"/user/create"}>
+            <Button type={"primary"} icon={<PlusOutlined />}>
+              {Lang.t("user.createUser")}
+            </Button>
           </Link>
         </TankTitle>
 
         <div>
-          <FilterPanel filters={pager.filters} onChange={this.search.bind(this)}/>
+          <FilterPanel
+            filters={pager.filters}
+            onChange={this.search.bind(this)}
+          />
         </div>
         <Table
           rowKey="uuid"
@@ -264,11 +285,13 @@ export default class List extends TankComponent<IProps, IState> {
           columns={columns}
           pagination={pager.getPagination()}
           onChange={pager.tableOnChange.bind(pager)}
-          locale={{emptyText: (<TableEmpty pager={pager} onRefresh={this.refresh.bind(this)}/>)}}
+          locale={{
+            emptyText: (
+              <TableEmpty pager={pager} onRefresh={this.refresh.bind(this)} />
+            ),
+          }}
         />
       </div>
     );
   }
 }
-
-

src/pages/user/MobileList.tsx

@@ -106,7 +106,7 @@ export default class MobileList extends TankComponent<IProps, IState> {
         <div>
           <Input.Search
             className="mb10"
-            placeholder={Lang.t("matter.searchFile")}
+            placeholder={Lang.t("user.searchUser")}
             onSearch={(value) => this.searchFile(value)}
             onChange={this.changeSearch.bind(this)}
             enterButton