Prechádzať zdrojové kódy

fix: 标段管理-树结构禁用选择优化

lanjianrong 4 rokov pred
rodič
commit
6b4f7f2a42

+ 1 - 1
src/App.tsx

@@ -1,4 +1,4 @@
-import Guards from '@/router/Guard'
+import Guards from '@/components/Navigation'
 import history from '@/utils/history'
 import 'nprogress/nprogress.css'
 import React from 'react'

src/router/Guard.tsx → src/components/Navigation/index.tsx


+ 1 - 1
src/layout/NavSide/index.tsx

@@ -1,5 +1,5 @@
 import Menu from "@/components/Menu"
-import Guards, { combinationPath } from "@/router/Guard"
+import Guards, { combinationPath } from "@/components/Navigation"
 import { iMenuItem, RouteModol } from "@/types/router"
 import React from 'react'
 import { Switch } from 'react-router-dom'

+ 1 - 1
src/pages/Management/Tender/api.ts

@@ -14,7 +14,7 @@ export async function apiTree() {
  * @param {iModalTypeProps} type - 类型
  * @param {object} payload - 载荷
  */
-export async function apiResfulTree(type: iModalTypeProps, payload: object) {
+export async function apiResfulTree(type: string, payload: object) {
   let url:string = '', method: string = ''
 
   switch (type) {

+ 15 - 22
src/pages/Management/Tender/components/ModalForm.tsx

@@ -1,4 +1,4 @@
-import { iModalProps, TenderTree } from '@/types/tender'
+import { iModalProps, iTenderFormValue, TenderTree } from '@/types/tender'
 import { Form, Input, message, Modal, TreeSelect } from 'antd'
 import React, { useEffect, useState } from 'react'
 
@@ -9,10 +9,11 @@ interface Option {
   children?: Option[];
 }
 
+
 interface iModalFormProps {
   treeObj: TenderTree
   modalObj: iModalProps
-  onCreate: (values, type ) => void
+  onCreate: (values: iTenderFormValue, type: string ) => void
   onCancel: () => void
 }
 
@@ -50,10 +51,12 @@ const ModalForm: React.FC<iModalFormProps> = ({
     },
     delFolder: {
       title: '删除文件夹',
+      nameTitle: '',
       okText: '确认删除'
     },
     delTender: {
       title: '删除标段',
+      nameTitle: '',
       okText: '确认删除'
     },
     move: {
@@ -70,9 +73,8 @@ const ModalForm: React.FC<iModalFormProps> = ({
   useEffect(() => {
     form.setFieldsValue({ [type === 'tender' ? 'folderId' : 'id']: id })
     if (type === 'move') {
-      console.log('iiiid', id)
 
-      setCascader(mapTree([ treeObj ], id, isFolder))
+      setCascader(mapTree([ treeObj ], id, isFolder) as Option[])
     }
     if (type === 'move' || type.indexOf('del') !== -1) {
       setShowNameInput(false)
@@ -94,7 +96,7 @@ const ModalForm: React.FC<iModalFormProps> = ({
       onCancel={onCancel}
       closable={false}
       onOk={() => {
-        form.validateFields().then((values) => {
+        form.validateFields().then(values => {
           form.resetFields()
           onCreate(values, type)
         }).catch(info => {
@@ -129,32 +131,23 @@ const ModalForm: React.FC<iModalFormProps> = ({
 }
 
 function mapTree(treeArr:TenderTree[], id: string, isFolder: boolean) {
-  console.log(treeArr)
-  console.log('id', id)
-  console.log('isFolder', isFolder)
+  const arr =  treeArr?.map((tree:TenderTree) => {
+    console.log(tree.id === id, tree.id)
 
-  const arr =  treeArr.map((tree:TenderTree) => {
-    const newTree = { value: tree.id, title: tree.name, disabled: tree.id === id }
+    const newTree: Option = { value: tree.id, title: tree.name, disabled: tree.id === id }
     // 要移动的是文件夹
     if (isFolder && tree.isBid) {
       // 该目录下已有标段不可移动文件夹至此目录
       newTree.disabled = true
-      console.log(newTree)
-
-      return newTree
     }
-    if (tree.isfolder || tree.hasFolder) {
-      if (tree.childsTotal > 0) {
-        if (tree.children.findIndex(item => item.id === id) !== -1) {
-          newTree.disabled = true
-        }
-        newTree.children = mapTree(tree.children, tree.id, Boolean(tree.isfolder))
+    if (tree.children?.length) {
+      if (tree.children.findIndex(item => item.id === id) !== -1) {
+        newTree.disabled = true
       }
-      return newTree
+      newTree.children = mapTree(tree.children, id, Boolean(tree.isfolder)) as Option[]
     }
+    return newTree
   }).filter(item => item) // filter过滤滤掉map可能产生的underfined item
-  console.log('arr', arr)
-
   return arr
 }
 

+ 26 - 5
src/pages/Management/Tender/index.tsx

@@ -13,22 +13,41 @@ import ModalForm from './components/ModalForm'
 import styles from './index.module.scss'
 import './index.scss'
 const Tender: React.FC<{}> = () =>{
-  const [ tree, setTree ] = useState<TenderTree>({})
+  const [ tree, setTree ] = useState<TenderTree>({ ancounts: 0,
+    attribution: '',
+    bidsectionId: '',
+    childsTotal: 0,
+    createTime: '',
+    csrf: '',
+    depth: 0,
+    children: [],
+    hasFolder: false,
+    id: '',
+    isBid: false,
+    leaf: false,
+    isEnd: false,
+    isfolder: 0,
+    moveId: '',
+    name: '',
+    parentId: '',
+    projectId: '',
+    serial: '',
+    updateTime: '' })
   const [ modal, setModal ] = useState<iModalProps>({
     type: 'folder',
     visible: false,
     confirmLoading: false,
-    pid: ''
+    isFolder: false,
+    id: ''
   })
-  const treeBtnClick = (payload) => {
-    console.log(payload)
-
+  const treeBtnClick = (payload: any) => {
     setModal({
       ...modal,
       visible: true,
       ...payload
     })
   }
+
   const columns: ColumnsType<TenderTree>  = [
     {
       title: '名称',
@@ -115,6 +134,7 @@ const Tender: React.FC<{}> = () =>{
       }
     }
   ]
+
   const onCreate = async (values: iTenderFormValue, type: string) => {
     console.log('Received values of form: ', values, type)
     setModal({
@@ -129,6 +149,7 @@ const Tender: React.FC<{}> = () =>{
       ...modal,
       confirmLoading: false,
       visible: false,
+      isFolder: false,
       id: ''
     })
 

+ 1 - 1
src/pages/Management/index.tsx

@@ -1,4 +1,4 @@
-import Guards from '@/router/Guard'
+import Guards from '@/components/Navigation'
 import { NavigationGuardsProps } from '@/types/router'
 import React from 'react'
 import { Switch } from 'react-router-dom'

+ 3 - 0
src/store/modules/navigation/index.ts

@@ -0,0 +1,3 @@
+export const initState = {
+
+}

+ 5 - 2
src/types/tender.d.ts

@@ -9,6 +9,7 @@ export type TenderTree = {
   depth: number;
   hasFolder: boolean;
   id: string;
+  leaf: boolean;
   isBid: boolean;
   isEnd: boolean;
   isfolder: number;
@@ -22,8 +23,9 @@ export type TenderTree = {
 }
 export interface iTenderFormValue {
   [propName: 'folderId' | 'id'] : string
-  name: string
-  depth: number
+  name?: string
+  depth?: number
+  targetFolderId?: string
 }
 export interface iModalTypeProps {
   type: 'root' | 'folder' | 'tender' | 'rename' | 'move' | 'delTender' | 'delFolder'
@@ -32,6 +34,7 @@ export interface iModalProps extends iModalTypeProps {
   visible: boolean
   confirmLoading: boolean
   id: string
+  isFolder: boolean
   name?: string
   isFolder?: boolean
 }

+ 1 - 0
tsconfig.json

@@ -18,6 +18,7 @@
     "jsx": "react",
     "baseUrl": "./src",
     "typeRoots": ["./types/*"],
+    "suppressImplicitAnyIndexErrors": true,
     "paths": {
       "@/*": ["./*"]
     }