Merge pull request '合并dev-zw' (#117) from dev-zw into dev

react-ui/src/global.less

@@ -149,6 +149,11 @@ ol {
   z-index: 999;
 }
 
+.kf-table-row-link:hover {
+  text-decoration: underline @underline-color;
+  text-underline-offset: 3px;
+}
+
 input:-webkit-autofill {
   transition: background-color 5000s ease-in-out 0s;
 }

react-ui/src/pages/Dataset/components/ResourceVersion/index.tsx

@@ -128,7 +128,7 @@ function ResourceVersion({
       dataIndex: 'index',
       key: 'index',
       width: 80,
-      render(text: string, record: ResourceFileData, index: number) {
+      render(_text: string, _record: ResourceFileData, index: number) {
         return <span>{index + 1}</span>;
       },
     },
@@ -137,7 +137,9 @@ function ResourceVersion({
       dataIndex: 'file_name',
       key: 'file_name',
       render: (text: string, record: ResourceFileData) => (
-        <a onClick={() => downloadAlone(record)}>{text}</a>
+        <a className="kf-table-row-link" onClick={() => downloadAlone(record)}>
+          {text}
+        </a>
       ),
     },
     {

react-ui/src/pages/DevelopmentEnvironment/List/index.tsx

@@ -154,7 +154,9 @@ function EditorList() {
       width: '30%',
       render: (text, record) =>
         record.url ? (
-          <a onClick={(e) => gotoEditorPage(e, record)}>{text}</a>
+          <a className="kf-table-row-link" onClick={(e) => gotoEditorPage(e, record)}>
+            {text}
+          </a>
         ) : (
           <span>{text ?? '--'}</span>
         ),

react-ui/src/pages/Experiment/components/ExperimentInstance/index.less

@@ -33,7 +33,7 @@
   }
 
   .operation {
-    width: 334px;
+    width: 344px;
   }
 }
 

react-ui/src/pages/Experiment/index.jsx

@@ -355,7 +355,11 @@ function Experiment() {
       title: '关联流水线名称',
       dataIndex: 'workflow_name',
       key: 'workflow_name',
-      render: (text, record) => <a onClick={(e) => gotoPipeline(e, record)}>{text}</a>,
+      render: (text, record) => (
+        <a className="kf-table-row-link" onClick={(e) => gotoPipeline(e, record)}>
+          {text}
+        </a>
+      ),
       width: '16%',
     },
     {
@@ -393,7 +397,7 @@ function Experiment() {
     {
       title: '操作',
       key: 'action',
-      width: 350,
+      width: 360,
       render: (_, record) => (
         <Space size="small">
           <Button

react-ui/src/pages/Model/components/NodeTooltips/index.less

@@ -50,6 +50,10 @@
       flex: 1;
       min-width: 0;
       font-weight: 500;
+
+      &:hover {
+        text-decoration: underline @underline-color;
+      }
     }
   }
 }

react-ui/src/pages/ModelDeployment/Create/index.tsx

@@ -278,8 +278,8 @@ function ModelDeploymentCreate() {
                       message: '请输入副本数量',
                     },
                     {
-                      pattern: /^-?\d+(\.\d+)?$/,
-                      message: '副本数量必须是数字',
+                      pattern: /^[1-9]\d*$/,
+                      message: '副本数量必须是正整数',
                     },
                   ]}
                 >

react-ui/src/pages/ModelDeployment/List/index.tsx

@@ -189,7 +189,11 @@ function ModelDeployment() {
       key: 'service_name',
       width: '20%',
       render: (text, record) => {
-        return <a onClick={() => toDetail(record)}>{text}</a>;
+        return (
+          <a className="kf-table-row-link" onClick={() => toDetail(record)}>
+            {text}
+          </a>
+        );
       },
     },
     {

react-ui/src/pages/Monitor/Job/edit.tsx

@@ -33,6 +33,10 @@ export type JobFormProps = {
 const JobForm: React.FC<JobFormProps> = (props) => {
   const [form] = Form.useForm();
   const { jobGroupOptions, statusOptions } = props;
+  const formLayout = {
+    labelCol: { span: 5 },
+    wrapperCol: { span: 19 },
+  };
 
   useEffect(() => {
     form.resetFields();
@@ -44,7 +48,7 @@ const JobForm: React.FC<JobFormProps> = (props) => {
       cronExpression: props.values.cronExpression,
       misfirePolicy: props.values.misfirePolicy,
       concurrent: props.values.concurrent,
-      status: props.values.status,
+      status: props.values.status ?? Object.keys(statusOptions)[0],
       createBy: props.values.createBy,
       createTime: props.values.createTime,
       updateBy: props.values.updateBy,
@@ -67,7 +71,7 @@ const JobForm: React.FC<JobFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'monitor.job.title',
         defaultMessage: '编辑定时任务调度',
@@ -84,6 +88,8 @@ const JobForm: React.FC<JobFormProps> = (props) => {
         submitter={false}
         layout="horizontal"
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
       >
         <ProFormDigit
           name="jobId"

react-ui/src/pages/Pipeline/Info/utils.tsx

@@ -55,17 +55,21 @@ export function createMenuItems(
     };
   });
 
-  return [
-    {
-      key: 'global',
-      label: '全局参数',
-      children: params.map((item) => ({
-        key: item.param_name,
-        label: item.param_name,
-      })),
-    },
-    ...nodes,
-  ];
+  if (params.length > 0) {
+    return [
+      {
+        key: 'global',
+        label: '全局参数',
+        children: params.map((item) => ({
+          key: item.param_name,
+          label: item.param_name,
+        })),
+      },
+      ...nodes,
+    ];
+  } else {
+    return [...nodes];
+  }
 }
 
 export function getInParameterComponent(

react-ui/src/pages/Pipeline/components/PropsLabel/index.tsx

@@ -23,18 +23,20 @@ function PropsLabel({ title, menuItems, onClick }: PropsLabelProps) {
   return (
     <div className={styles['props-label']}>
       <div>{title}</div>
-      <Dropdown
-        menu={{
-          items: menuItems,
-          onClick: handleItemClick,
-          triggerSubMenuAction: 'hover',
-        }}
-        trigger={['click']}
-        placement="topRight"
-        arrow
-      >
-        <a onClick={(e) => e.preventDefault()}>参数</a>
-      </Dropdown>
+      {menuItems && menuItems.length > 0 && (
+        <Dropdown
+          menu={{
+            items: menuItems,
+            onClick: handleItemClick,
+            triggerSubMenuAction: 'hover',
+          }}
+          trigger={['click']}
+          placement="topRight"
+          arrow
+        >
+          <a onClick={(e) => e.preventDefault()}>参数</a>
+        </Dropdown>
+      )}
     </div>
   );
 }

react-ui/src/pages/Pipeline/index.jsx

@@ -122,7 +122,11 @@ const Pipeline = () => {
       title: '流水线名称',
       dataIndex: 'name',
       key: 'name',
-      render: (text, record) => <a onClick={(e) => routeToEdit(e, record)}>{text}</a>,
+      render: (text, record) => (
+        <a className="kf-table-row-link" onClick={(e) => routeToEdit(e, record)}>
+          {text}
+        </a>
+      ),
     },
     {
       title: '流水线描述',

react-ui/src/pages/System/Dept/edit.tsx

@@ -24,8 +24,16 @@ export type DeptFormProps = {
 
 const DeptForm: React.FC<DeptFormProps> = (props) => {
   const [form] = Form.useForm();
-
   const { statusOptions, deptTree } = props;
+  const formLayout = {
+    labelCol: { span: 8 },
+    wrapperCol: { span: 16 },
+  };
+
+  const formItemLayout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 20 },
+  };
 
   useEffect(() => {
     form.resetFields();
@@ -34,11 +42,11 @@ const DeptForm: React.FC<DeptFormProps> = (props) => {
       parentId: props.values.parentId,
       ancestors: props.values.ancestors,
       deptName: props.values.deptName,
-      orderNum: props.values.orderNum,
+      orderNum: props.values.orderNum ?? 1,
       leader: props.values.leader,
       phone: props.values.phone,
       email: props.values.email,
-      status: props.values.status,
+      status: props.values.status ?? Object.keys(statusOptions)[0],
       delFlag: props.values.delFlag,
       createBy: props.values.createBy,
       createTime: props.values.createTime,
@@ -60,7 +68,7 @@ const DeptForm: React.FC<DeptFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'system.dept.title',
         defaultMessage: '编辑部门',
@@ -77,6 +85,8 @@ const DeptForm: React.FC<DeptFormProps> = (props) => {
         submitter={false}
         layout="horizontal"
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
       >
         <ProFormDigit
           name="deptId"
@@ -104,6 +114,7 @@ const DeptForm: React.FC<DeptFormProps> = (props) => {
           request={async () => {
             return deptTree;
           }}
+          {...formItemLayout}
           placeholder="请选择上级部门"
           rules={[
             {
@@ -185,6 +196,15 @@ const DeptForm: React.FC<DeptFormProps> = (props) => {
               required: false,
               message: <FormattedMessage id="请输入邮箱！" defaultMessage="请输入邮箱！" />,
             },
+            {
+              type: 'email',
+              message: (
+                <FormattedMessage
+                  id="请输入正确的邮箱格式！"
+                  defaultMessage="请输入正确的邮箱格式！"
+                />
+              ),
+            },
           ]}
         />
         <ProFormRadio.Group

react-ui/src/pages/System/Dict/edit.tsx

@@ -22,8 +22,11 @@ export type DictTypeFormProps = {
 
 const DictTypeForm: React.FC<DictTypeFormProps> = (props) => {
   const [form] = Form.useForm();
-
   const { statusOptions } = props;
+  const formLayout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 20 },
+  };
 
   useEffect(() => {
     form.resetFields();
@@ -31,7 +34,7 @@ const DictTypeForm: React.FC<DictTypeFormProps> = (props) => {
       dictId: props.values.dictId,
       dictName: props.values.dictName,
       dictType: props.values.dictType,
-      status: props.values.status,
+      status: props.values.status ?? Object.keys(statusOptions)[0],
       createBy: props.values.createBy,
       createTime: props.values.createTime,
       updateBy: props.values.updateBy,
@@ -53,7 +56,7 @@ const DictTypeForm: React.FC<DictTypeFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'system.dict.title',
         defaultMessage: '编辑字典类型',
@@ -70,6 +73,8 @@ const DictTypeForm: React.FC<DictTypeFormProps> = (props) => {
         submitter={false}
         layout="horizontal"
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
       >
         <ProFormDigit
           name="dictId"

react-ui/src/pages/System/Dict/index.tsx

@@ -171,6 +171,7 @@ const DictTableList: React.FC = () => {
       render: (dom, record) => {
         return (
           <a
+            className="kf-table-row-link"
             onClick={() => {
               history.push(`/system/dict-data/index/${record.dictId}`);
             }}

react-ui/src/pages/System/Post/edit.tsx

@@ -22,8 +22,11 @@ export type PostFormProps = {
 
 const PostForm: React.FC<PostFormProps> = (props) => {
   const [form] = Form.useForm();
-
   const { statusOptions } = props;
+  const formLayout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 20 },
+  };
 
   useEffect(() => {
     form.resetFields();
@@ -31,8 +34,8 @@ const PostForm: React.FC<PostFormProps> = (props) => {
       postId: props.values.postId,
       postCode: props.values.postCode,
       postName: props.values.postName,
-      postSort: props.values.postSort,
-      status: props.values.status,
+      postSort: props.values.postSort ?? 1,
+      status: props.values.status ?? Object.keys(statusOptions)[0],
       createBy: props.values.createBy,
       createTime: props.values.createTime,
       updateBy: props.values.updateBy,
@@ -54,7 +57,7 @@ const PostForm: React.FC<PostFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'system.post.title',
         defaultMessage: '编辑岗位信息',
@@ -71,6 +74,8 @@ const PostForm: React.FC<PostFormProps> = (props) => {
         submitter={false}
         layout="horizontal"
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
       >
         <ProFormDigit
           name="postId"

react-ui/src/pages/System/Role/edit.tsx

@@ -29,17 +29,22 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
   const [menuIds, setMenuIds] = useState<string[]>([]);
   const { statusOptions } = props;
 
+  const formLayout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 20 },
+  };
+
   useEffect(() => {
     form.resetFields();
     form.setFieldsValue({
       roleId: props.values.roleId,
       roleName: props.values.roleName,
       roleKey: props.values.roleKey,
-      roleSort: props.values.roleSort,
+      roleSort: props.values.roleSort ?? 1,
       dataScope: props.values.dataScope,
       menuCheckStrictly: props.values.menuCheckStrictly,
       deptCheckStrictly: props.values.deptCheckStrictly,
-      status: props.values.status,
+      status: props.values.status ?? Object.keys(statusOptions)[0],
       delFlag: props.values.delFlag,
       createBy: props.values.createBy,
       createTime: props.values.createTime,
@@ -62,7 +67,7 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'system.role.title',
         defaultMessage: '编辑角色信息',
@@ -79,6 +84,8 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
         layout="horizontal"
         submitter={false}
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
       >
         <ProFormDigit
           name="roleId"
@@ -142,9 +149,6 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
               message: <FormattedMessage id="请输入显示顺序！" defaultMessage="请输入显示顺序！" />,
             },
           ]}
-          fieldProps={{
-            defaultValue: 1,
-          }}
         />
         <ProFormRadio.Group
           valueEnum={statusOptions}
@@ -160,9 +164,6 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
               message: <FormattedMessage id="请输入角色状态！" defaultMessage="请输入角色状态！" />,
             },
           ]}
-          fieldProps={{
-            defaultValue: '0',
-          }}
         />
         <ProForm.Item
           name="menuIds"
@@ -170,6 +171,7 @@ const RoleForm: React.FC<RoleFormProps> = (props) => {
             id: 'system.role.auth',
             defaultMessage: '菜单权限',
           })}
+          style={{ width: '100%' }}
         >
           <Tree
             checkable={true}

react-ui/src/pages/System/User/components/DeptTree.tsx

@@ -18,19 +18,17 @@ export type TreeProps = {
 const DeptTree: React.FC<TreeProps> = (props) => {
   const [treeData, setTreeData] = useState<any>([]);
   const [expandedKeys, setExpandedKeys] = useState<React.Key[]>([]);
-  const [autoExpandParent, setAutoExpandParent] = useState<boolean>(true);
+  const [selectedKeys, setSelectedKeys] = useState<React.Key[]>([]);
 
   const fetchDeptList = async () => {
     const hide = message.loading('正在查询');
     try {
-      await getDeptTree({}).then((res: any) => {
-        const exKeys = [];
-        exKeys.push('1');
-        setTreeData(res);
-        exKeys.push(res[0].children[0].id);
-        setExpandedKeys(exKeys);
-        props.onSelect(res[0].children[0]);
-      });
+      const res = await getDeptTree({});
+      const treeData = res.map((item: any) => ({ ...item, key: item.id }));
+      setTreeData(treeData);
+      props.onSelect(treeData[0]);
+      setExpandedKeys([treeData[0].key]);
+      setSelectedKeys([treeData[0].key]);
       hide();
       return true;
     } catch (error) {
@@ -44,12 +42,12 @@ const DeptTree: React.FC<TreeProps> = (props) => {
   }, []);
 
   const onSelect = (keys: React.Key[], info: any) => {
+    setSelectedKeys(keys);
     props.onSelect(info.node);
   };
 
-  const onExpand = (expandedKeysValue: React.Key[]) => {
-    setExpandedKeys(expandedKeysValue);
-    setAutoExpandParent(false);
+  const onExpand = (keys: React.Key[]) => {
+    setExpandedKeys(keys);
   };
 
   return (
@@ -58,7 +56,7 @@ const DeptTree: React.FC<TreeProps> = (props) => {
       defaultExpandAll
       onExpand={onExpand}
       expandedKeys={expandedKeys}
-      autoExpandParent={autoExpandParent}
+      selectedKeys={selectedKeys}
       onSelect={onSelect}
       treeData={treeData}
     />

react-ui/src/pages/System/User/edit.tsx

@@ -34,6 +34,15 @@ const UserForm: React.FC<UserFormProps> = (props) => {
   const userId = Form.useWatch('userId', form);
   const { sexOptions, statusOptions } = props;
   const { roles, posts, depts } = props;
+  const formLayout = {
+    labelCol: { span: 8 },
+    wrapperCol: { span: 16 },
+  };
+
+  const formItemLayout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 20 },
+  };
 
   useEffect(() => {
     form.resetFields();
@@ -42,13 +51,13 @@ const UserForm: React.FC<UserFormProps> = (props) => {
       deptId: props.values.deptId,
       postIds: props.postIds,
       roleIds: props.roleIds,
-      userName: props.values.userName,
+      userName: props.values.userName ?? '',
       nickName: props.values.nickName,
       email: props.values.email,
       phonenumber: props.values.phonenumber,
-      sex: props.values.sex,
+      sex: props.values.sex || '0',
       avatar: props.values.avatar,
-      status: props.values.status,
+      status: props.values.status || Object.keys(statusOptions)[0],
       delFlag: props.values.delFlag,
       loginIp: props.values.loginIp,
       loginDate: props.values.loginDate,
@@ -69,7 +78,7 @@ const UserForm: React.FC<UserFormProps> = (props) => {
 
   return (
     <KFModal
-      width={640}
+      width={680}
       title={intl.formatMessage({
         id: 'system.user.title',
         defaultMessage: '编辑用户信息',
@@ -85,6 +94,10 @@ const UserForm: React.FC<UserFormProps> = (props) => {
         layout="horizontal"
         submitter={false}
         onFinish={handleFinish}
+        {...formLayout}
+        size="large"
+        labelAlign="right"
+        autoComplete="off"
       >
         <ProFormText
           name="nickName"
@@ -132,6 +145,15 @@ const UserForm: React.FC<UserFormProps> = (props) => {
               required: false,
               message: <FormattedMessage id="请输入手机号码！" defaultMessage="请输入手机号码！" />,
             },
+            {
+              pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+              message: (
+                <FormattedMessage
+                  id="请输入正确的手机号码！"
+                  defaultMessage="请输入正确的手机号码！"
+                />
+              ),
+            },
           ]}
         />
         <ProFormText
@@ -147,6 +169,15 @@ const UserForm: React.FC<UserFormProps> = (props) => {
               required: false,
               message: <FormattedMessage id="请输入用户邮箱！" defaultMessage="请输入用户邮箱！" />,
             },
+            {
+              type: 'email',
+              message: (
+                <FormattedMessage
+                  id="请输入正确的邮箱地址！"
+                  defaultMessage="请输入正确的邮箱地址！"
+                />
+              ),
+            },
           ]}
         />
         <ProFormText
@@ -158,6 +189,9 @@ const UserForm: React.FC<UserFormProps> = (props) => {
           hidden={userId}
           placeholder="请输入用户账号"
           colProps={{ md: 12, xl: 12 }}
+          fieldProps={{
+            autoComplete: 'off',
+          }}
           rules={[
             {
               required: true,
@@ -173,6 +207,10 @@ const UserForm: React.FC<UserFormProps> = (props) => {
           hidden={userId}
           placeholder="请输入密码"
           colProps={{ md: 12, xl: 12 }}
+          fieldProps={{
+            autoComplete: 'new-password',
+          }}
+          allowClear
           rules={[
             {
               required: false,
@@ -187,7 +225,6 @@ const UserForm: React.FC<UserFormProps> = (props) => {
             id: 'system.user.sex',
             defaultMessage: '用户性别',
           })}
-          initialValue={'0'}
           placeholder="请输入用户性别"
           colProps={{ md: 12, xl: 12 }}
           rules={[
@@ -204,7 +241,6 @@ const UserForm: React.FC<UserFormProps> = (props) => {
             id: 'system.user.status',
             defaultMessage: '帐号状态',
           })}
-          initialValue={'0'}
           placeholder="请输入帐号状态"
           colProps={{ md: 12, xl: 12 }}
           rules={[
@@ -246,6 +282,7 @@ const UserForm: React.FC<UserFormProps> = (props) => {
           })}
           placeholder="请输入备注"
           colProps={{ md: 24, xl: 24 }}
+          {...formItemLayout}
           rules={[
             {
               required: false,

react-ui/src/pages/System/User/index.tsx

@@ -429,6 +429,8 @@ const UserTableList: React.FC = () => {
                     );
                   }
                   setCurrentRow(undefined);
+                  setPostIds([]);
+                  setRoleIds([]);
                   setModalVisible(true);
                 }}
               >

react-ui/src/pages/Tool/Gen/index.tsx

@@ -81,7 +81,6 @@ const GenCodeView: React.FC = () => {
     {
       title: '编号',
       dataIndex: 'tableId',
-      tip: '编号',
       render: (dom, entity) => {
         return (
           <a

react-ui/src/styles/theme.less

@@ -16,6 +16,7 @@
 @warning-color: #f98e1b;
 @abort-color: #8a8a8a;
 @pending-color: #ecb934;
+@underline-color: #5d93ff;
 
 @border-color: rgba(22, 100, 255, 0.3);
 @border-color-secondary: rgba(22, 100, 255, 0.1);