bug fix

src/view/Manage/AssetManage/Component/AssetManageTree.jsx

@@ -443,6 +443,11 @@ const AssetManageTree = (props) => {
     setUpdateDirectoryModalVisible(true);
   }
 
+  const onDetailClick = () => {
+    setUpdateDirectoryAction('detail');
+    setUpdateDirectoryModalVisible(true);
+  }
+
   const editDir = () => {
 
     if ((currentDirType||'') === '') {
@@ -793,7 +798,7 @@ const AssetManageTree = (props) => {
                 getAllDirectoryAsTree(false)
               }, 100)
             }}
-            style={{ width: 65 }}
+            style={{ width: 80 }}
           >
           {
             (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)
@@ -892,6 +897,11 @@ const AssetManageTree = (props) => {
       {
         (reference!==AssetMountReference) && <RcMenu id={MENU_ID}>
           {
+            currentRightClickDir && (currentRightClickDir.type!=='custom') && <RcItem id="detail" onClick={onDetailClick}>
+            { (currentRightClickDir.level===1)?'栏目详情':'目录详情' }
+            </RcItem>
+          }
+          {
             currentRightClickDir && (currentRightClickDir.type!=='custom') && <RcItem id="edit" onClick={editDir}>
             { (currentRightClickDir.level===1)?'修改栏目':'修改目录' }
             </RcItem>

src/view/Manage/AssetManage/Component/AssetTable.jsx

@@ -1056,7 +1056,7 @@ const AssetTable = (props) => {
                 LocalStorage.set(`templateType-${appId}`, val);
                 setPagination({ ...pagination, pageNum: 1 });
               }}
-              style={{ width: 80 }}
+              style={{ width: 85 }}
             >
             {
               (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)

src/view/Manage/AssetManage/Component/AssetTree.jsx

@@ -9,6 +9,7 @@ import CustomDirectoryModal from './CustomDirectoryModal';
 import { showMessage, getQueryParam } from '../../../../util';
 import { AnchorTimestamp, AnchorId, AssetBrowseReference, ResourceBrowseReference, AnchorDirId } from '../../../../util/constant';
 import { highlightSearchContentByTerms } from '../../../../util';
+import UpdateDirectoryModal from './UpdateDirectoryModal';
 
 import './AssetTree.less';
 import 'react-contexify/dist/ReactContexify.css';
@@ -58,6 +59,8 @@ const AssetTree = (props) => {
   const [loadingTemplates, setLoadingTemplates] = useState(false)
   const [templates, setTemplates] = useState()
   const [currentTemplateType, setTemplateType] = useState()
+  const [ updateDirectoryAction, setUpdateDirectoryAction ] = useState('');
+  const [ updateDirectoryModalVisible, setUpdateDirectoryModalVisible ] = useState(false);
 
   const [modal, contextHolder] = Modal.useModal();
   
@@ -482,8 +485,14 @@ const AssetTree = (props) => {
     }
   }
 
+  const onDetailClick = () => {
+    setUpdateDirectoryAction('detail');
+    setUpdateDirectoryModalVisible(true);
+  }
+
   const displayMenu = (e) => {
-    show(e, {
+    show({
+      event: e,
       position: {
         x: e.clientX + 30,
         y: e.clientY - 10
@@ -591,7 +600,7 @@ const AssetTree = (props) => {
                 getAllDirectoryAsTree(false)
               }, 100)
             }}
-            style={{ width: 65 }}
+            style={{ width: 80 }}
           >
           {
             (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)
@@ -647,14 +656,22 @@ const AssetTree = (props) => {
           onSelect={onTreeSelect} 
           checkStrictly
           onRightClick={({event, node}) => {
-            if (node.level>1 && node.type==='custom') {
-              setCurrentRightClickDir(node);
-              displayMenu(event);
-            }
+            setCurrentRightClickDir(node);
+            displayMenu(event);
           }}
           />
       </Spin>
 
+      <UpdateDirectoryModal 
+        visible={ updateDirectoryModalVisible }
+        onCancel={() => {
+          setUpdateDirectoryAction()
+          setUpdateDirectoryModalVisible(false)
+        }}
+        action={ updateDirectoryAction }
+        dirId={ currentRightClickDir?.nodeId }
+      />
+
       <CustomDirectoryModal 
         visible={ customDirectoryModalVisible }
         onCancel={ onCustomDirectoryCancel }
@@ -665,19 +682,9 @@ const AssetTree = (props) => {
       {
         <RcMenu id={MENU_ID}>
         {
-          currentRightClickDir && currentRightClickDir.level>1 && currentRightClickDir.type==='custom' && <RcItem id="up" onClick={() => { moveNode(1); }}>
-          上移目录
-          </RcItem> 
-        }
-        {
-          currentRightClickDir && currentRightClickDir.level>1 && currentRightClickDir.type==='custom' && <RcItem id="up" onClick={() => { moveNode(-1); }}>
-          下移目录
-          </RcItem> 
-        }
-        {
-          currentRightClickDir && currentRightClickDir.level===2 && currentRightClickDir.type==='custom' && !currentRightClickDir.adminCreate && <RcItem id="up" onClick={deleteDir}>
-          删除目录
-          </RcItem> 
+          currentRightClickDir && (currentRightClickDir.type!=='custom') && <RcItem id="detail" onClick={onDetailClick}>
+          { (currentRightClickDir.level===1)?'栏目详情':'目录详情' }
+          </RcItem>
         }
         </RcMenu> 
       } 

src/view/Manage/AssetManage/Component/UpdateDirectoryModal.jsx

 import React, { useEffect, useState, useMemo } from 'react';
-import { Modal, Form, Input, Space, Button, Radio, Select } from 'antd';
+import { Modal, Form, Input, Space, Button, Radio, Select, Spin } from 'antd';
 
 import { dispatch } from '../../../../model';
 import { showMessage } from '../../../../util';
@@ -34,26 +34,16 @@ const UpdateDirectoryModal = (props) => {
 
   const { visible, onCancel, dirId, action } = props;
 
+  const [loading, setLoading] = useState(false);
   const [ form ] = Form.useForm();
   const [ dir, setDir ] = useState(null);
   const [ confirmLoading, setConfirmLoading ] = useState(false);
   const [ isThemeAdd, setIsThemeAdd ] = useState(false);
 
   useEffect(() => {
-
-    if (visible) {
-      setDir(null);
-      form.resetFields();
-
-      if (action === 'add') {
-        form.setFieldsValue({ resourceType: 'dataAsset' });
-      }
-     
-      if ((dirId||'')!=='') {
-        getDirectory();
-      }
+    if (visible && dirId) {
+      getDirectory();
     }
-
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [ visible ])
 
@@ -69,19 +59,27 @@ const UpdateDirectoryModal = (props) => {
     return false;
   }, [action, dir, isThemeAdd])
 
+  const marginBottom = useMemo(() => {
+    return (action === 'detail') ? 5 : 15
+  }, [action])
+
   const getDirectory = () => {
-    setDir(null);
+    setLoading(true);
     dispatch({
       type: 'assetmanage.getDirectoryById',
       payload: { 
         dirId
       },
       callback: data => {
+        setLoading(false);
         setDir(data);
 
         if (action !== 'add') {
           form.setFieldsValue({ code: data?.code, name: data?.name||'', desc: data?.desc||'', remarks: data?.remarks||'' });
         }
+      },
+      error: () => {
+        setLoading(false);
       }
     })
   }
@@ -154,8 +152,9 @@ const UpdateDirectoryModal = (props) => {
 
   const reset = () => {
     setIsThemeAdd(false);
-    setDir(undefined);
-    form.resetFields();
+    setLoading(false);
+    setConfirmLoading(false);
+    setDir();
   }
 
   const onReset = () => {
@@ -198,8 +197,8 @@ const UpdateDirectoryModal = (props) => {
 
   return (
     <Modal
-      forceRender
-      title={'资产目录的目录信息'}
+      destroyOnClose
+      title='资产目录的目录信息'
       visible={visible}
       width={600}
       onCancel={() => { 
@@ -207,7 +206,7 @@ const UpdateDirectoryModal = (props) => {
         onCancel && onCancel(); 
       }}
       footer={
-        <Space>
+        (action==='detail') ? null : <Space>
           <Button type="primary" onClick={onOk} loading={confirmLoading}>提交</Button>
           <Button onClick={onReset} >重置</Button>
           <Button onClick={() => {
@@ -217,58 +216,74 @@ const UpdateDirectoryModal = (props) => {
         </Space>
       }
     >
-      <Form {...formItemLayout} form={form} onValuesChange={onValuesChange}>
-        {
-          action==='add' && <Form.Item 
-            label="类型"
-            name="type"
+      <Spin spinning={loading}>
+        <Form {...formItemLayout} form={form} onValuesChange={onValuesChange}>
+          {
+            action==='add' && <Form.Item 
+              label="类型"
+              name="type"
+              rules={[{ required: true, message: '必填项' }]}
+              style={{ marginBottom }}
+            >
+              <Radio.Group>
+                <Radio value='theme'>栏目</Radio>
+                <Radio value='directory' disabled={ !dirId }>目录</Radio>
+              </Radio.Group>
+            </Form.Item>
+          }
+          {
+            codeRestrict && <Form.Item 
+              label="编号"
+              name="code"
+              rules={[{ required: true, message: '必填项' }]}
+              style={{ marginBottom }}
+            >
+              {
+                (action==='detail') ? <span>{dir?.code}</span> : <CodeInput restrict={codeRestrict} action={action} />
+              }
+            </Form.Item>
+          }
+          <Form.Item 
+            label="名称"
+            name="name"
             rules={[{ required: true, message: '必填项' }]}
+            style={{ marginBottom }}
           >
-            <Radio.Group>
-              <Radio value='theme'>栏目</Radio>
-              <Radio value='directory' disabled={ !dirId }>目录</Radio>
-            </Radio.Group>
+            {
+              (action==='detail') ? <span>{dir?.name}</span> : <Input placeholder="请输入名称" />
+            }
           </Form.Item>
-        }
-        {
-          codeRestrict && <Form.Item 
-            label="编号"
-            name="code"
-            rules={[{ required: true, message: '必填项' }]}
+          {
+            action !== 'add' && (
+              <Form.Item
+                label="路径"
+                name="path"
+                style={{ marginBottom }}
+              >
+                <span>{dir?.path}</span>
+              </Form.Item>
+            )
+          }
+          <Form.Item 
+            label="描述"
+            name="desc"
+            style={{ marginBottom }}
           >
-            <CodeInput restrict={codeRestrict} action={action} />
+            {
+              (action==='detail') ? <span>{dir?.desc}</span> : <Input.TextArea placeholder="请输入描述" autoSize={{ minRows: 4, maxRows: 4 }} />
+            }
           </Form.Item>
-        }
-        <Form.Item 
-          label="名称"
-          name="name"
-          rules={[{ required: true, message: '必填项' }]}
-        >
-          <Input placeholder="请输入名称" />
-        </Form.Item>
-        {
-          action !== 'add' && (
-            <Form.Item
-              label="路径"
-              name="path"
-            >
-              <span>{ dir ? (dir.path||''):'' }</span>
-            </Form.Item>
-          )
-        }
-        <Form.Item 
-          label="描述"
-          name="desc"
-        >
-          <Input.TextArea placeholder="请输入描述" autoSize={{ minRows: 4, maxRows: 4 }} />
-        </Form.Item>
-        <Form.Item 
-          label="备注"
-          name="remarks"
-        >
-          <Input.TextArea placeholder="请输入备注" autoSize={{ minRows: 4, maxRows: 4 }} />
-        </Form.Item>
-      </Form>
+          <Form.Item 
+            label="备注"
+            name="remarks"
+            style={{ marginBottom }}
+          >
+            {
+              (action==='detail') ? <span>{dir?.remarks}</span> : <Input.TextArea placeholder="请输入备注" autoSize={{ minRows: 4, maxRows: 4 }} />
+            }
+          </Form.Item>
+        </Form>
+      </Spin>  
     </Modal>
   );
 }