[web] 250 bugsfixed14 (#1763)

* fixed styles * update layout styles * fixed modify desc * remove annotations * change label target placeholder
IndustryEssentials · Jun 13, 2023 · 29fb7a2 · 29fb7a2
1 parent 070327e
commit 29fb7a2
Show file tree

Hide file tree

Showing 27 changed files with 135 additions and 207 deletions.
diff --git a/ymir/web/src/components/dataset/List.tsx b/ymir/web/src/components/dataset/List.tsx
@@ -467,20 +467,6 @@ const Datasets: ModuleType = ({ pid, project, iterations, groups }) => {
     }
   }
 
-  const saveDescHandle = (result: Dataset) => {
-    if (result) {
-      setDatasetVersions((versions) => ({
-        ...versions,
-        [result.groupId]: versions[result.groupId].map((dataset) => {
-          if (dataset.id === result.id) {
-            dataset.description = result.description
-          }
-          return dataset
-        }),
-      }))
-    }
-  }
-
   const editDesc = (dataset: Dataset) => {
     editDescBoxRef.current?.show()
     setEditingDataset(dataset)
@@ -636,7 +622,7 @@ const Datasets: ModuleType = ({ pid, project, iterations, groups }) => {
         </div>
         {renderGroups}
       </div>
-      <EditDescBox ref={editDescBoxRef} record={editingDataset} handle={saveDescHandle} />
+      <EditDescBox ref={editDescBoxRef} record={editingDataset} />
       <EditNameBox ref={editNameBoxRef} record={current} max={80} handle={saveNameHandle} />
       <Hide ref={hideRef} ok={hideOk} />
       <Terminate ref={terminateRef} ok={terminateOk} />

diff --git a/ymir/web/src/components/dataset/add.less b/ymir/web/src/components/dataset/add.less
@@ -5,6 +5,7 @@
   background: #fff;
   display: flex;
   flex-direction: column;
+  min-height: calc(100vh - 160px);
   :global(.ant-card-body) {
     flex: 1;
     overflow-y: auto;

diff --git a/ymir/web/src/components/dataset/list.less b/ymir/web/src/components/dataset/list.less
@@ -1,5 +1,5 @@
 .list {
-  min-height: calc(100vh - 530px);
+  min-height: calc(100vh - 360px);
   padding: 20px 0;
   .tab_actions {
     text-align: right;

diff --git a/ymir/web/src/components/form/editDescBox.tsx b/ymir/web/src/components/form/editDescBox.tsx
@@ -17,7 +17,7 @@ const EditDescBox = forwardRef<RefProps, Props>(({ type = 'dataset', record, max
   const [updated, updateResult] = useFetch(`${type}/updateVersion`)
   const description = record?.description || ''
 
-  useEffect(() => handle && handle(updated), [updated])
+  useEffect(() => updated && handle && handle(updated), [updated])
 
   function update(record: Result, values: any) {
     const desc = values.description.trim()

diff --git a/ymir/web/src/components/model/List.tsx b/ymir/web/src/components/model/List.tsx
@@ -69,7 +69,6 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
   const location: Location = useLocation()
   const name = location.query?.name
   const [models, setModels] = useState<ModelGroup[]>([])
-  const [modelVersions, setModelVersions] = useState<Models>({})
   const [total, setTotal] = useState(1)
   const [selectedVersions, setSelectedVersions] = useState<{ selected: number[]; versions: { [gid: number]: number[] } }>({ selected: [], versions: {} })
   const [form] = useForm()
@@ -145,7 +144,7 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
 
   useEffect(() => {
     const selected = selectedVersions.selected
-    const mvs = Object.values(modelVersions)
+    const mvs = Object.values(versions)
       .flat()
       .filter((version) => selected.includes(version.id))
     const hashs = mvs.map((version) => version.task.hash)
@@ -194,7 +193,7 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
     {
       title: <StrongTitle label="model.column.stage" />,
       dataIndex: 'recommendStage',
-      render: (_, record) => (validState(record.state) ? <EditStageCell record={record} saveHandle={updateModelVersion} /> : null),
+      render: (_, record) => (validState(record.state) ? <EditStageCell record={record} /> : null),
       // align: 'center',
       width: 300,
     },
@@ -230,17 +229,6 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
     updateQuery({ ...query, current, limit, offset })
   }
 
-  function updateModelVersion(result: Model) {
-    setModelVersions((mvs) => {
-      return {
-        ...mvs,
-        [result.groupId]: mvs[result.groupId].map((version) => {
-          return version.id === result.id ? result : version
-        }),
-      }
-    })
-  }
-
   function toggleVersions(id: number, force?: boolean) {
     setVisibles((old) => ({ ...old, [id]: force || (typeof old[id] !== 'undefined' && !old[id]) }))
   }
@@ -397,19 +385,6 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
       )
     }
   }
-  const saveDescHandle = (result: ModelType) => {
-    if (result) {
-      setModelVersions((models) => ({
-        ...models,
-        [result.groupId]: models[result.groupId].map((model) => {
-          if (model.id === result.id) {
-            model.description = result.description
-          }
-          return model
-        }),
-      }))
-    }
-  }
 
   const editDesc = (model: ModelType) => {
     editDescBoxRef.current?.show()
@@ -473,7 +448,6 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
             <div className="groupTable" hidden={visibles[group.id] === false}>
               <Table
                 dataSource={typeof visibles[group.id] === 'undefined' ? (versions[group.id] || []).slice(0, DefaultShowVersionCount) : versions[group.id]}
-                // dataSource={modelVersions[group.id]}
                 rowKey={(record) => record.id}
                 rowSelection={{
                   selectedRowKeys: selectedVersions.versions[group.id],
@@ -538,7 +512,7 @@ const ModelList: ModuleType = ({ pid, project, iterations, groups }) => {
         {renderGroups}
       </div>
       <EditNameBox ref={editNameBoxRef} type="model" record={current} max={80} handle={saveNameHandle} />
-      <EditDescBox ref={editDescBoxRef} type="model" record={editingModel} handle={saveDescHandle} />
+      <EditDescBox ref={editDescBoxRef} type="model" record={editingModel} />
       <Hide ref={hideRef} type={'model'} msg="model.action.del.confirm.content" ok={hideOk} />
       <Terminate ref={terminateRef} ok={terminateOk} />
     </div>

diff --git a/ymir/web/src/components/model/list.less b/ymir/web/src/components/model/list.less
@@ -1,5 +1,5 @@
 .list {
-  min-height: calc(100vh - 520px);
+  min-height: calc(100vh - 360px);
   padding: 20px 0;
   .tab_actions {
     text-align: right;
@@ -61,12 +61,13 @@
 .verify_uploader {
   width: 600px;
 }
-.extraTag, .extraIterTag {
+.extraTag,
+.extraIterTag {
   padding: 2px 8px;
   font-size: 12px;
-  color:rgba(0, 0, 0, 0.65);
+  color: rgba(0, 0, 0, 0.65);
   background-color: #f5f5f5;
 }
 .extraIterTag {
   color: @primary-color;
-}
+}
diff --git a/ymir/web/src/components/task/label.js b/ymir/web/src/components/task/label.js
@@ -170,7 +170,7 @@ function Label({ query = {}, hidden, ok = () => {}, bottom }) {
               },
             ]}
           >
-            <UserKeywordsSelector />
+            <UserKeywordsSelector placeholder={t('task.label.form.target.label')} />
           </Item>
           <KeepAnnotations />
           <Item label={t('task.label.form.desc.label')} name="desc">

diff --git a/ymir/web/src/layouts/Index.tsx b/ymir/web/src/layouts/Index.tsx
@@ -44,17 +44,12 @@ const BasicLayout: FC = ({ children }) => {
         <Layout>
           <LeftMenu></LeftMenu>
           <Layout className="layoutContent">
-            <Content
-              className={commonStyles.content}
-              style={{
-                minHeight: document.documentElement.clientHeight - 60 - 50,
-              }}
-            >
-              {children}
+            <Content className={commonStyles.content}>
+              <div>{children}</div>
+              <Footer className={commonStyles.footer}>
+                <Foot></Foot>
+              </Footer>
             </Content>
-            <Footer className={commonStyles.footer}>
-              <Foot></Foot>
-            </Footer>
           </Layout>
         </Layout>
       </Layout>

diff --git a/ymir/web/src/layouts/common.less b/ymir/web/src/layouts/common.less
@@ -3,19 +3,19 @@
 }
 .home {
   .content {
-    margin: 0 20px;
-  }
-  .sider {
-    // background-color: #f4f4f4;
+    padding: 0 20px;
+    overflow-x: hidden;
+    overflow-y: auto;
+    > div {
+      min-height: calc(100% - 50px);
+    }
   }
   .footer {
     height: 50px;
-    // border-top: 1px solid #f4f4f4;
-    // background-color: #fff;
   }
 }
 .normal {
-  font-family: Arial, "Microsoft Yahei", sans-serif;
+  font-family: Arial, 'Microsoft Yahei', sans-serif;
 }
 
 .title {

diff --git a/ymir/web/src/models/__test__/model.test.js b/ymir/web/src/models/__test__/model.test.js
@@ -286,6 +286,7 @@ describe('models: model', () => {
       code: 0,
       result,
     })
+    generator.next()
     const end = generator.next()
 
     expect(end.value).toEqual(expected)
@@ -312,7 +313,7 @@ describe('models: model', () => {
       result: expected,
     })
 
-    expect(end.value).toEqual(boxes.map((box, index) =>({ ...toAnnotation(box, 0, 0, true), id: end.value[index].id})))
+    expect(end.value).toEqual(boxes.map((box, index) => ({ ...toAnnotation(box, 0, 0, true), id: end.value[index].id })))
     expect(end.done).toBe(true)
   })
   // getModelsByMap
@@ -395,7 +396,7 @@ describe('models: model', () => {
       payload: pid,
     }
     const total = 3
-    const result = {items: products(total), total }
+    const result = { items: products(total), total }
     const generator = saga(creator, { put })
     generator.next()
     generator.next(result)

diff --git a/ymir/web/src/models/dataset.ts b/ymir/web/src/models/dataset.ts
@@ -22,7 +22,7 @@ import { createEffect, createReducersByState } from './_utils'
 import { deepClone } from '@/utils/object'
 import { TASKTYPES } from '@/constants/task'
 import { DatasetState, DatasetStore } from '.'
-import { List } from './typings/common.d'
+import { IdMap, List } from './typings/common.d'
 import { Backend, Dataset, ImportingItem, ProgressTask } from '@/constants'
 import { randomNumber } from '@/utils/number'
 import { Types } from '@/components/dataset/add/AddTypes'
@@ -285,11 +285,26 @@ const DatasetModal: DatasetStore = {
         return result.total
       }
     }),
-    updateVersion: createEffect<{ id: number; description: string }>(function* ({ payload }, { call, put }) {
+    updateVersion: createEffect<{ id: number; description: string }>(function* ({ payload }, { call, put, select }) {
       const { id, description } = payload
       const { code, result } = yield call(updateVersion, id, description)
       if (code === 0) {
-        return transferDataset(result)
+        const dataset = transferDataset(result)
+        const versions: IdMap<Dataset[]> = yield select(({ dataset }) => dataset.versions)
+        const groupVersions = versions[dataset.groupId] || []
+        groupVersions.splice(
+          groupVersions.findIndex((v) => v.id === dataset.id),
+          1,
+          dataset,
+        )
+        yield put({
+          type: 'UpdateVersions',
+          payload: {
+            ...versions,
+            [dataset.groupId]: [...groupVersions],
+          },
+        })
+        return dataset
       }
     }),
     getInternalDataset: createEffect(function* ({ payload }, { call, put }) {

diff --git a/ymir/web/src/models/model.js b/ymir/web/src/models/model.js
@@ -249,7 +249,7 @@ export default {
         return result
       }
     },
-    *updateVersion({ payload }, { call, put }) {
+    *updateVersion({ payload }, { call, put, select }) {
       const { id, description } = payload
       const { code, result } = yield call(updateVersion, id, description)
       if (code === 0) {
@@ -258,6 +258,10 @@ export default {
           type: 'UPDATE_MODEL',
           payload: { [model.id]: model },
         })
+        yield put({
+          type: 'updateVersionData',
+          payload: model,
+        })
         return model
       }
     },
@@ -270,9 +274,29 @@ export default {
           type: 'UPDATE_MODEL',
           payload: { [model]: updatedModel },
         })
+        yield put({
+          type: 'updateVersionData',
+          payload: updatedModel,
+        })
         return updatedModel
       }
     },
+    updateVersionData: createEffect(function* ({ payload: model }, { put, select }) {
+      const versions = yield select(({ model }) => model.versions)
+      const groupVersions = versions[model.groupId] || []
+      groupVersions.splice(
+        groupVersions.findIndex((v) => v.id === model.id),
+        1,
+        model,
+      )
+      yield put({
+        type: 'UPDATE_VERSIONS',
+        payload: {
+          ...versions,
+          [model.groupId]: [...groupVersions],
+        },
+      })
+    }),
     *verify({ payload }, { call }) {
       const { code, result } = yield call(verify, payload)
       if (code === 0) {

diff --git a/ymir/web/src/pages/dataset/add.tsx b/ymir/web/src/pages/dataset/add.tsx
@@ -11,7 +11,7 @@ const AddPage: FC = () => {
   return (
     <div className={'datasetImport'} style={{ height: '100%' }}>
       <Breadcrumbs />
-      {stepKey ? <Add id={Number(id)} from={from} stepKey={stepKey} style={{ height: 'calc(100vh - 186px)' }} /> : <BatchAdd />}
+      {stepKey ? <Add id={Number(id)} from={from} stepKey={stepKey} style={{ height: 'calc(100vh - 166px)' }} /> : <BatchAdd />}
     </div>
   )
 }

diff --git a/ymir/web/src/pages/image/add.less b/ymir/web/src/pages/image/add.less
@@ -5,9 +5,9 @@
   background: #fff;
   display: flex;
   flex-direction: column;
-  height: calc(100vh - 180px);
+  height: calc(100vh - 160px);
   :global(.ant-card-body) {
     flex: 1;
     overflow-y: auto;
   }
-}
+}
diff --git a/ymir/web/src/pages/image/components/list.less b/ymir/web/src/pages/image/components/list.less
@@ -1,5 +1,5 @@
 .imageContent {
-  min-height: calc(100vh - 300px);
+  min-height: calc(100vh - 280px);
 }
 .addBtn {
   margin: 10px 0;
@@ -19,7 +19,8 @@
   display: flex;
   justify-content: flex-end;
 }
-.remote, .local {
+.remote,
+.local {
   display: inline-block;
   padding: 0 8px;
   font-size: 14px;

diff --git a/ymir/web/src/pages/iteration/add.less b/ymir/web/src/pages/iteration/add.less
@@ -5,7 +5,7 @@
   background: #fff;
   display: flex;
   flex-direction: column;
-  height: calc(100vh - 180px);
+  height: calc(100vh - 160px);
   :global(.ant-card-body) {
     flex: 1;
     overflow-y: auto;
@@ -14,4 +14,4 @@
 .targetPanel {
   padding: 20px 20px 1px;
   background-color: #fafafa;
-}
+}
diff --git a/ymir/web/src/pages/keyword/index.less b/ymir/web/src/pages/keyword/index.less
@@ -1,7 +1,7 @@
 .list {
   width: 100%;
   padding: 20px;
-  min-height: calc(100vh - 265px);
+  min-height: calc(100vh - 245px);
   .tab_actions {
     text-align: right;
     .l {