@gingkoo/pandora-explorer 0.0.1-alpha.33 → 0.0.1-alpha.34

package/lib/es/index.js

@@ -1,10 +1,10 @@
 /**
- * @gingkoo/pandora-explorer v0.0.1-alpha.33
+ * @gingkoo/pandora-explorer v0.0.1-alpha.34
  */
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import cx$1 from 'classnames';
 import * as React from 'react';
-import React__default, { createContext, useRef, useState, useImperativeHandle, useEffect, useMemo, useLayoutEffect, useContext, createElement } from 'react';
+import React__default, { createContext, useRef, useState, useImperativeHandle, useEffect, useMemo, useLayoutEffect, useContext, createElement, forwardRef } from 'react';
 import createEmotion from '@emotion/css/create-instance';
 import { cx as cx$2 } from '@emotion/css';
 import { createRoot } from 'react-dom/client';
@@ -1834,6 +1834,14 @@ function Slider(props) {
   const ref = useRef(null);
   const [isdarg, setDarg] = useState(false);
   const [size, setSize] = useState(null);
+  useEffect(() => {
+    document.addEventListener('mousemove', handleBodyMousemove);
+    document.addEventListener('mouseup', handleBodyMouseup);
+    return () => {
+      document.removeEventListener('mousemove', handleBodyMousemove);
+      document.removeEventListener('mouseup', handleBodyMouseup);
+    };
+  }, [isdarg, ref.current]);
   useEffect(() => {
     if (!size) return;
     let d_value = max - min;
@@ -1845,22 +1853,25 @@ function Slider(props) {
     let data = value - min;
     setSize(data / d_value * 100);
   }, [value]);
+  function handleBodyMousemove(e) {
+    if (!isdarg) return;
+    if (!ref.current) return;
+    e.preventDefault();
+    let dom = ref.current.getBoundingClientRect();
+    let cur = dom.top + 15;
+    let num = e.clientY - cur;
+    num > 100 ? num = 100 : null;
+    num < 0 ? num = 0 : null;
+    setSize(num);
+  }
+  function handleBodyMouseup(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    setDarg(false);
+  }
   return jsx("div", {
     className: '_slider',
     ref: ref,
-    onMouseOut: () => {
-      setDarg(false);
-    },
-    onMouseMove: e => {
-      if (!isdarg) return;
-      if (!ref.current) return;
-      let dom = ref.current.getBoundingClientRect();
-      let cur = dom.top + 15;
-      let num = e.clientY - cur;
-      num > 100 ? num = 100 : null;
-      num < 0 ? num = 0 : null;
-      setSize(num);
-    },
     children: jsx("div", {
       className: '_slider-link',
       onClick: e => {
@@ -1876,11 +1887,8 @@ function Slider(props) {
           top: size + 'px'
         },
         className: '_slider-drop',
-        onMouseDown: () => {
+        onMouseDown: e => {
           setDarg(true);
-        },
-        onMouseUp: () => {
-          setDarg(false);
         }
       })
     })
@@ -5258,7 +5266,16 @@ function TableItem(props) {
                 autoFocus: true,
                 defaultValue: param[v?.key],
                 placeholder: '\u8BF7\u8F93\u5165',
+                onFocus: e => {
+                  let i = param[v?.key]?.lastIndexOf('.');
+                  if (props?.suffix == 'folder') {
+                    e.target.setSelectionRange(0, param[v?.key]?.length);
+                  } else if (i !== -1) {
+                    e.target.setSelectionRange(0, i);
+                  }
+                },
                 onBlur: e => {
+                  if (e.target.value === param[v?.key]) return;
                   onRename?.(e.target.value);
                 }
               })
@@ -5336,6 +5353,14 @@ var TreeItem = (props => {
         autoFocus: true,
         value: title,
         placeholder: '\u8BF7\u8F93\u5165',
+        onFocus: e => {
+          let i = title.lastIndexOf('.');
+          if (props?.suffix == 'folder') {
+            e.target.setSelectionRange(0, title.length);
+          } else if (i !== -1) {
+            e.target.setSelectionRange(0, i);
+          }
+        },
         onChange: v => {
           setTitle?.(v.target.value);
         },
@@ -5867,7 +5892,8 @@ const ExplorerMenu = props => {
     loadData,
     loadNode,
     onMenuClick,
-    onChange
+    onChange,
+    onRename
   } = props;
   const store = useContext(ExampleContext);
   const [eventKey, setEventKey] = useState([]);
@@ -5887,6 +5913,7 @@ const ExplorerMenu = props => {
       onMenuClick: onMenuClick,
       loadData: loadNode,
       onChange: onChange,
+      onRename: onRename,
       onSelect: v => {
         store.setPathDisplay(v?.pathDisplay);
         loadData(v.key);
@@ -5953,6 +5980,7 @@ const VirtualScroll = ({
     ref: containerRef,
     children: jsx("div", {
       style: {
+        position: 'relative',
         height: `${data.length * itemHeight}px`,
         paddingTop: `${startIdx * itemHeight}px`
       },
@@ -6013,7 +6041,7 @@ function Tile(props) {
       [className || '']: className
     }),
     style: {
-      height: '100%'
+      height: height + 'px'
     },
     onContextMenu: e => {
       e.preventDefault();
@@ -6085,17 +6113,14 @@ function Tile(props) {
                     width: w + 'px',
                     height: w + 'px',
                     lineHeight: w + 'px'
-                  }) : jsx("div", {
-                    className: 'picture',
-                    children: jsx("img", {
-                      className: 'picture-show',
-                      draggable: 'false',
-                      src: v.pic,
-                      style: {
-                        width: w + 'px',
-                        height: w + 'px'
-                      }
-                    })
+                  }) : jsx("img", {
+                    className: 'picture-show',
+                    draggable: 'false',
+                    src: v.pic,
+                    style: {
+                      width: w + 'px',
+                      height: w + 'px'
+                    }
                   })
                 }), jsx("div", {
                   className: 'title-type-name',
@@ -7150,8 +7175,9 @@ const Layout$1 = props => {
         },
         onSelect: v => {
           if (v?.type == 'folder' && v.expanded) {
-            store.setCurSelect(v.key);
+            store.setCurSelectFile(v.key);
           }
+          store.setCurSelect(v.key);
         },
         onRename: onRename,
         onMenuClick: onMenuClick,
@@ -7192,9 +7218,12 @@ function ExplorerInfo(props) {
   const {
     infoshow,
     getIcons,
-    curInfo
+    curInfo,
+    dataMap,
+    curSelect
   } = useContext(ExampleContext);
   const [isEdit, setIsEdit] = useState(false);
+  const [info, setInfo] = useState({});
   useEffect(() => {
     if (infoshow) {
       props?.setSize(285);
@@ -7202,6 +7231,13 @@ function ExplorerInfo(props) {
       props?.onMinimize();
     }
   }, [infoshow]);
+  useEffect(() => {
+    if (curSelect) {
+      setInfo(dataMap?.[curSelect]);
+    } else {
+      setInfo(curInfo);
+    }
+  }, [curInfo, dataMap]);
   function rednerInfo() {
     return jsxs("div", {
       className: 'panel-info',
@@ -7212,7 +7248,7 @@ function ExplorerInfo(props) {
           children: "\u8DEF\u5F84:"
         }), jsx("div", {
           className: 'content',
-          children: curInfo?.pathDisplay || '-'
+          children: info?.pathDisplay || '-'
         })]
       }), jsxs("div", {
         className: 'panel-col',
@@ -7221,7 +7257,7 @@ function ExplorerInfo(props) {
           children: "\u5927\u5C0F:"
         }), jsx("div", {
           className: 'content',
-          children: typeof curInfo?.size == 'number' ? convertBytesToSize(curInfo?.size) : curInfo?.size || '-'
+          children: typeof info?.size == 'number' ? convertBytesToSize(info?.size) : info?.size || '-'
         })]
       }), jsxs("div", {
         className: 'panel-col',
@@ -7230,7 +7266,7 @@ function ExplorerInfo(props) {
           children: "\u521B\u5EFA\u65F6\u95F4 :"
         }), jsx("div", {
           className: 'content',
-          children: DateFormat(curInfo?.createTime)
+          children: DateFormat(info?.createTime)
         })]
       }), jsxs("div", {
         className: 'panel-col',
@@ -7239,7 +7275,7 @@ function ExplorerInfo(props) {
           children: "\u4FEE\u6539\u65F6\u95F4 :"
         }), jsx("div", {
           className: 'content',
-          children: DateFormat(curInfo?.createTime)
+          children: DateFormat(info?.createTime)
         })]
       }), jsxs("div", {
         className: 'panel-col',
@@ -7283,18 +7319,18 @@ function ExplorerInfo(props) {
       className: 'info-header',
       children: [jsx("div", {
         className: 'file-icon',
-        children: getIcons(curInfo, '')
+        children: getIcons(info, '')
       }), jsxs("div", {
         className: 'file-name',
         children: [jsx("div", {
           className: 'title',
-          children: curInfo?.title
+          children: info?.title
         }), jsxs("div", {
           className: 'desc',
           children: [jsx("span", {
-            children: typeof curInfo?.size == 'number' ? convertBytesToSize(curInfo?.size) : curInfo?.size || '-'
+            children: typeof info?.size == 'number' ? convertBytesToSize(info?.size) : info?.size || '-'
           }), jsx("span", {
-            children: curInfo?.fixTime || '-'
+            children: info?.fixTime || '-'
           })]
         })]
       })]
@@ -7398,7 +7434,7 @@ const defaultColumns = [{
     });
   }
 }];
-const Explorer = props => {
+const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     data,
     columns,
@@ -7413,7 +7449,8 @@ const Explorer = props => {
   const [curlist, setCurList] = useState([]);
   const [curInfo, setCurInfo] = useState(null);
   const [dataMap, setDataMap] = useState({});
-  const [curSelect, setCurSelect] = useState('');
+  const [curSelect, setCurSelect] = useState(null); //当前选中信息
+  const [curSelectFile, setCurSelectFile] = useState(''); //当前选中的文件
   const [menuSize, setMenuSize] = useState(80);
   const [reamekey, setReName] = useState(null);
   const [logindex, setLogIndex] = useState(0); //前进
@@ -7422,6 +7459,17 @@ const Explorer = props => {
   const [menutype, setMenutype] = useState('tile');
   const [infoshow, setInfoShow] = useState(false);
   const [loading, setLoading] = useState(ApiStatusEnum.READY);
+  useImperativeHandle(ref, () => ({
+    removeLog: () => {
+      //清空日志
+      setLog([]);
+    },
+    updateData: () => {
+      if (curInfo?.key) {
+        loadData(curInfo.key, curInfo);
+      }
+    }
+  }));
   const Icons = (v, className, style) => {
     const IconMap = new Map([['favorite', jsx(FavoriteSvg, {})], ['space', jsx(SpaceSvg, {})], ['netdisk', jsx(NetdiskSvg, {})], ['album', jsx(AlbumSvg, {})], ['recycle', jsx(RecycleSvg, {})], ['recently', jsx(RecentlySvg, {})], ['coordination', jsx(LinkSvg, {})], ['text', jsx(TextSvg, {})], ['share', jsx(ShareLinkSvg, {})]]);
     if (v?.label) {
@@ -7537,13 +7585,20 @@ const Explorer = props => {
   function createFolder() {
     const addData = (data, key, child) => {
       let arr = data;
+      let file = [];
+      let folder = [];
       if (key) {
         let i = 0;
         while (i < arr.length) {
           let item = arr[i];
           if (item.key == key) {
             if (Array.isArray(item.children)) {
-              item.children.unshift(child);
+              item.children.forEach(v => {
+                if (v.type == 'folder') folder.push(v);
+                if (v.type == 'file') file.push(v);
+              });
+              folder.push(child);
+              item.children = [...folder, ...file];
             } else {
               item.children = [child];
             }
@@ -7556,7 +7611,16 @@ const Explorer = props => {
           i++;
         }
       } else {
-        arr.unshift(child);
+        if (arr.length) {
+          arr.forEach(v => {
+            if (v.type == 'folder') folder.push(v);
+            if (v.type == 'file') file.push(v);
+          });
+          folder.push(child);
+          arr = [...folder, ...file];
+        } else {
+          arr.push(child);
+        }
       }
       return arr || [];
     };
@@ -7567,6 +7631,7 @@ const Explorer = props => {
       title: '新建文件夹',
       create_file: true
     });
+    console.log(list, 123);
     setCurList(list);
   }
   return jsx(ExampleContext.Provider, {
@@ -7588,6 +7653,7 @@ const Explorer = props => {
       checkMode,
       reamekey,
       curSelect,
+      curSelectFile,
       loadkey,
       //icon
       getIcons: Icons,
@@ -7606,6 +7672,7 @@ const Explorer = props => {
       setLoading,
       setReName,
       setCurSelect,
+      setCurSelectFile,
       setLoadKey
     },
     children: jsx("div", {
@@ -7618,7 +7685,7 @@ const Explorer = props => {
       })
     })
   });
-};
+});
 
 export { ApiStatusEnum, Explorer as default, registerMenu };
 //# sourceMappingURL=index.js.map