merge

react-ui/config/defaultSettings.ts

@@ -19,7 +19,7 @@ const Settings: ProLayoutProps & {
   title: '复杂智能软件',
   pwa: true,
   logo: '/assets/images/left-top-logo.png',
-  iconfontUrl: '//at.alicdn.com/t/c/font_4509211_dfghcwme8ki.js',
+  iconfontUrl: '//at.alicdn.com/t/c/font_4511326_ndnvm4elll.js',
   token: {
     // 参见ts声明，demo 见文档，通过token 修改样式
     //https://procomponents.ant.design/components/layout#%E9%80%9A%E8%BF%87-token-%E4%BF%AE%E6%94%B9%E6%A0%B7%E5%BC%8F

react-ui/src/components/KFModal/index.less

@@ -1,7 +1,11 @@
 .kf-modal {
   .ant-modal-content {
     padding: 20px 67px;
-    background: linear-gradient(180deg, #cfdfff 0%, #d4e2ff 9.77%, #ffffff 40%, #ffffff 100%);
+    background-image: url(/assets/images/modal-back.png);
+background-repeat:no-repeat;
+background-size:100%;
+background-position: top center;
+    // background: linear-gradient(180deg, #cfdfff 0%, #d4e2ff 9.77%, #ffffff 40%, #ffffff 100%);
     border-radius: 21px;
   }
   .ant-modal-header {

react-ui/src/global.less

@@ -55,6 +55,26 @@ a {
 .ant-pro-layout .ant-pro-sider .ant-layout-sider-children {
   background: #f2f5f7;
 }
+.ant-pro-base-menu-inline-item-title .ant-pro-base-menu-inline-item-text{
+  color:#1d1d20;
+font-size:16px;
+}
+.ant-pro-layout .ant-pro-sider-menu{
+  padding-top: 40px;
+}
+.ant-pro-global-header-logo-mix{
+  height: 75px;
+  border-bottom: 1px solid rgba(233, 237, 240, 1);
+  margin-left: -16px;
+  width: 257px;
+  background:#f2f5f7;
+  border-top-right-radius: 20px;
+  padding-left: 28px;
+}
+.ant-pro-layout .ant-pro-sider .ant-layout-sider-children{
+  border-right: unset;
+  border-bottom-right-radius: 20px;
+}
 .ant-pro-base-menu-inline {
   // height: 87vh;
   background: #f2f5f7;
@@ -63,19 +83,28 @@ a {
 .ant-pro-layout .ant-pro-layout-content {
   background-color: transparent;
 }
+.ant-drawer .ant-drawer-body{
+  padding: 0;
+}
+.ant-drawer .ant-drawer-body .ant-row{
+  padding: 0 24px;
+}
+.ant-drawer .ant-drawer-body .ant-form-item{
+  margin-bottom: 20px;
+}
 .ant-table-wrapper .ant-table-pagination.ant-pagination {
   margin: 0;
   padding: 21px 16px;
   background-color: #fff;
 }
 .ant-table-wrapper .ant-table {
-  height: 75vh;
+  height: 81vh;
 }
 .ant-pro-global-header-logo img {
   height: 21px;
 }
 .ant-pro-layout .ant-layout-sider.ant-pro-sider {
-  height: 87vh;
+  height: 94vh;
 }
 .ant-pro-layout .ant-pro-layout-container {
   height: 98vh;

react-ui/src/pages/Dataset/index.less

@@ -104,7 +104,7 @@
   display: flex;
   justify-content: space-between;
   width: 100%;
-  height: 85vh;
+  height: 87.5vh;
   :global {
     .ant-btn {
       color: #1d1d20;

react-ui/src/pages/Experiment/experimentText/addExperimentModal.less

@@ -1,12 +1,12 @@
 .modal {
   :global {
-    .ant-input {
-      height: 30px;
-      border-color: #e6e6e6;
-    }
-    .ant-select-single {
-      height: 40px;
-    }
+    // .ant-input {
+    //   height: 30px;
+    //   border-color: #e6e6e6;
+    // }
+    // .ant-select-single {
+    //   height: 40px;
+    // }
     .ant-form-item .ant-form-item-label > label {
       color: rgba(29, 29, 32, 0.8);
     }

react-ui/src/pages/Experiment/experimentText/index.less

@@ -8,8 +8,8 @@
   align-items: center;
   width: 100%;
   height: 43px;
-  margin-bottom: 10px;
-  padding: 0 20px;
+  margin-bottom: 20px;
+  padding: 0 24px;
   color: #1d1d20;
   font-size: 15px;
   font-family: 'Alibaba';

react-ui/src/pages/Experiment/experimentText/props.jsx

@@ -67,7 +67,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
             span: 16,
           }}
           wrapperCol={{
-            span: 16,
+            span: 24,
           }}
           style={{
             maxWidth: 600,
@@ -81,7 +81,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
         >
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/static-message.png'}
               alt=""
             />
@@ -113,7 +113,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           </Form.Item>
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/duty-message.png'}
               alt=""
             />
@@ -136,7 +136,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           </Form.Item>
 
           <Form.Item label="启动命令" name="command">
-            <Input disabled />
+            <TextArea disabled />
           </Form.Item>
           <Form.Item
             label="资源规格"
@@ -195,7 +195,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
             : ''}
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/duty-message.png'}
               alt=""
             />
@@ -390,12 +390,13 @@ const Props = forwardRef(({ onParentChange }, ref) => {
       <Drawer
         title="任务执行详情"
         placement="right"
-        rootStyle={{ marginTop: '45px' }}
+        rootStyle={{ marginTop: '68px' }}
+        getContainer={false}
         closeIcon={false}
         onClose={onClose}
         afterOpenChange={afterOpenChange}
         open={open}
-        width={600}
+        width={420}
         destroyOnClose={true}
       >
         <div className={Styles.detailBox}>任务名称：{stagingItem.label}</div>

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

@@ -105,7 +105,7 @@
   display: flex;
   justify-content: space-between;
   width: 100%;
-  height: 85vh;
+  height: 87.5vh;
 
   .datasetCneterLeftBox {
     width: 340px;

react-ui/src/pages/Pipeline/editPipeline/editPipeline.less

@@ -8,8 +8,8 @@
   align-items: center;
   width: 100%;
   height: 43px;
-  margin-bottom: 10px;
-  padding: 0 20px;
+  margin-bottom: 20px;
+  padding: 0 24px;
   color: #1d1d20;
   font-size: 15px;
   font-family: 'Alibaba';

react-ui/src/pages/Pipeline/editPipeline/props.jsx

@@ -152,16 +152,22 @@ const Props = forwardRef(({ onParentChange }, ref) => {
         onClose={onClose}
         afterOpenChange={afterOpenChange}
         open={open}
-        width={540}
+        width={420}
       >
         <Form
           name="form"
           form={form}
           // layout="vertical"
-          labelCol={{ span: 10 }}
-          wrapperCol={{ span: 20 }}
-          // initialValues={{ global_param: globalParam }}
-          labelAlign="left"
+          layout="vertical"
+          labelCol={{
+            span: 16,
+          }}
+          wrapperCol={{
+            span: 24,
+          }}
+          style={{
+            maxWidth: 600,
+          }}
           initialValues={{
             remember: true,
           }}
@@ -203,7 +209,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           </Form.Item>
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/duty-message.png'}
               alt=""
             />
@@ -226,7 +232,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           </Form.Item>
 
           <Form.Item label="启动命令" name="command">
-            <Input />
+            <TextArea />
           </Form.Item>
           <Form.Item
             label="资源规格"
@@ -255,7 +261,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
             : ''}
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/duty-message.png'}
               alt=""
             />
@@ -294,7 +300,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
             : ''}
           <div className={Styles.editPipelinePropsContent}>
             <img
-              style={{ width: '13px', marginRight: '10px' }}
+              style={{ width: '15px', marginRight: '10px' }}
               src={'/assets/images/duty-message.png'}
               alt=""
             />

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

@@ -297,7 +297,7 @@ const Pipeline = () => {
               },
             ]}
           >
-            <Input showCount maxLength={64} />
+            <Input placeholder="请输入流水线名称" showCount maxLength={64} />
           </Form.Item>
           <Form.Item
             label="流水线描述"
@@ -309,7 +309,7 @@ const Pipeline = () => {
               },
             ]}
           >
-            <Input showCount maxLength={128} />
+            <Input placeholder="请输入流水线描述" showCount maxLength={128} />
           </Form.Item>
         </Form>
       </Modal>