@para-ui/core 4.0.32 → 4.0.37

package/Table/index.js

@@ -1,9 +1,7 @@
-import { _ as __rest, a as __awaiter } from '../_verture/tslib.es6-55ed4bd2.js';
+import { a as __rest, _ as __awaiter } from '../_verture/tslib.es6-f43aa41d.js';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useRef, useState, useEffect, useMemo, useCallback, Fragment as Fragment$1 } from 'react';
 import { Get, Post, DeepClone, GetBrowserClass, Cancel, ArrayToObject } from '@paraview/lib';
-import { _ as _typeof, a as _defineProperty } from '../_verture/defineProperty-f0e15205.js';
-import { _ as _slicedToArray } from '../_verture/slicedToArray-75fa4188.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
 import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import { Popover } from '../Popover/index.js';
@@ -16,9 +14,11 @@ import SolidArrowDown from '@para-ui/icons/DownTriangleF';
 import Panel from '@para-ui/icons/Panel';
 import { u as useFormatMessage } from '../_verture/useFormatMessage-1fc7c957.js';
 import Empty from '../Empty/index.js';
+import { d as dist } from '../_verture/index-0f5ee6f7.js';
 import { Radio } from '../Radio/index.js';
 import OperateBtn from '../OperateBtn/index.js';
 import Down from '@para-ui/icons/Down';
+import Drag from '@para-ui/icons/Drag';
 import Refresh from '@para-ui/icons/Refresh';
 import { Pagination } from '../Pagination/index.js';
 import { Loading } from '../Loading/index.js';
@@ -37,6 +37,7 @@ import '../_verture/index-bde7aabe.js';
 import 'rc-dropdown';
 import 'dayjs';
 import '../_verture/index-ca413216.js';
+import '../_verture/sortable.esm-76fe46a4.js';
 import '@para-ui/icons/More';
 import '../PopConfirm/index.js';
 import '@para-ui/icons/CheckCircleF';
@@ -61,23 +62,25 @@ import '@para-ui/icons/DoubleRight';
  * 发送请求
  * @param obj {ReqProps} 请求信息
  */
-var requestFunc = function requestFunc(obj) {
-  var method = obj.method,
-    url = obj.url,
-    ctx = obj.ctx,
-    data = obj.data,
+const requestFunc = obj => {
+  const {
+      method,
+      url,
+      ctx,
+      data
+    } = obj,
     otherProps = __rest(obj, ["method", "url", "ctx", "data"]);
   if (method === 'Get') {
     return Get(Object.assign({
       url: url,
-      ctx: ctx
+      ctx
     }, otherProps));
   }
   if (method === 'Post') {
     return Post(Object.assign({
       url: url,
-      ctx: ctx,
-      data: data
+      ctx,
+      data
     }, otherProps));
   }
 };
@@ -86,23 +89,23 @@ var requestFunc = function requestFunc(obj) {
  * @param obj {ReqProps} 请求信息
  * @return string get请求地址参数
  */
-var handGetReqParams = function handGetReqParams(obj) {
-  var str = obj.url;
-  var params = obj.data || {};
-  var arrKey = Object.keys(params);
-  var paramsArr = [];
-  for (var i = 0, l = arrKey.length; i < l; i++) {
-    var key = arrKey[i];
-    var val = params[key];
-    if (_typeof(val) === 'object') {
+const handGetReqParams = obj => {
+  let str = obj.url;
+  const params = obj.data || {};
+  const arrKey = Object.keys(params);
+  const paramsArr = [];
+  for (let i = 0, l = arrKey.length; i < l; i++) {
+    const key = arrKey[i];
+    let val = params[key];
+    if (typeof val === 'object') {
       val = encodeURIComponent(JSON.stringify(val));
     } else {
       val = encodeURIComponent(val);
     }
     paramsArr.push("".concat(key, "=").concat(val));
   }
-  var paramsStr = paramsArr.join('&');
-  var pos = str.indexOf('?');
+  const paramsStr = paramsArr.join('&');
+  const pos = str.indexOf('?');
   if (pos !== -1) {
     str += (pos === str.length - 1 ? '' : '&') + paramsStr;
   } else {
@@ -113,9 +116,9 @@ var handGetReqParams = function handGetReqParams(obj) {
 /**
  * 提取字符串里面的数字
  * */
-var getStringInNumber = function getStringInNumber(str) {
+const getStringInNumber = str => {
   if (typeof str === 'number') return str;
-  var strHand = str.replace(/[^0-9$]/gi, '');
+  const strHand = str.replace(/[^0-9$]/gi, '');
   return Number(strHand);
 };
 /**
@@ -123,23 +126,23 @@ var getStringInNumber = function getStringInNumber(str) {
  * @param key {string} 键值
  * @param num {number} 过期天数
  * */
-var getLocalStorageSelectHead = function getLocalStorageSelectHead(key, num) {
+const getLocalStorageSelectHead = (key, num) => {
   //debugger
-  var headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
-  var headJson = JSON.parse(headJsonStr);
-  var headJsonArr = Object.keys(headJson);
-  for (var i = 0, l = headJsonArr.length; i < l; i++) {
-    var keyStr = headJsonArr[i];
-    var item = headJson[i];
+  const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
+  const headJson = JSON.parse(headJsonStr);
+  const headJsonArr = Object.keys(headJson);
+  for (let i = 0, l = headJsonArr.length; i < l; i++) {
+    const keyStr = headJsonArr[i];
+    const item = headJson[i];
     if (!item) continue;
-    var newDate = new Date().getTime(); // 当前时间
-    var endTime = item.storageTime + item.validity; // 过期时间
+    const newDate = new Date().getTime(); // 当前时间
+    const endTime = item.storageTime + item.validity; // 过期时间
     // 过期时间 小于 当前时间, 说明已经过期了, 删除当前表格列数据
     if (endTime < newDate) {
       delete headJson[keyStr];
     }
   }
-  var headJsonItem = headJson[key];
+  const headJsonItem = headJson[key];
   // 重置过期时间
   if (headJsonItem) {
     headJsonItem.storageTime = new Date().getTime();
@@ -152,9 +155,9 @@ var getLocalStorageSelectHead = function getLocalStorageSelectHead(key, num) {
  * @param key {string} 键值
  * @param val {HeadLocalStorageItem} 保存值
  * */
-var setLocalStorageSelectHead = function setLocalStorageSelectHead(key, val) {
-  var headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
-  var headJson = JSON.parse(headJsonStr);
+const setLocalStorageSelectHead = (key, val) => {
+  const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
+  const headJson = JSON.parse(headJsonStr);
   headJson[key] = val;
   window.localStorage.setItem('_paraui_table_head', JSON.stringify(headJson));
 };
@@ -163,8 +166,8 @@ var setLocalStorageSelectHead = function setLocalStorageSelectHead(key, val) {
  * @param el 当前元素
  * @param selector 查找元素class
  */
-var closest = function closest(el, selector) {
-  var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
+const closest = (el, selector) => {
+  const matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
   while (el) {
     if (matchesSelector.call(el, selector)) {
       break;
@@ -216,7 +219,7 @@ var TrElement = function TrElement(props) {
   }));
 };
 
-var css_248z$5 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.th-element {\n  letter-spacing: 0.01071em;\n  line-height: 1.43;\n  padding: 0;\n  font-weight: 700;\n  font-size: 14px;\n  background-color: rgb(247, 248, 250);\n  border-bottom: 1px solid rgb(234, 236, 241);\n  height: 100%;\n}\n.th-element.th-element-draggable {\n  position: relative;\n}\n.th-element:first-child {\n  border-top-left-radius: 4px;\n}\n.th-element:last-child {\n  border-top-right-radius: 4px;\n}\n.th-element:hover {\n  background-color: rgb(240, 245, 255);\n}\n.th-element.table-operate.table-operate-small {\n  width: 105px;\n}\n.th-element.table-operate.table-operate-small > .table-header-box {\n  width: 105px;\n}\n.th-element > .th-element-draggable-box {\n  width: 4px;\n  height: 100%;\n  position: absolute;\n  right: 0;\n  top: 0;\n}\n.th-element:hover > .th-element-draggable-box {\n  background-color: rgb(213, 224, 250);\n  cursor: ew-resize;\n}";
+var css_248z$5 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.th-element {\n  letter-spacing: 0.01071em;\n  line-height: 1.43;\n  padding: 0;\n  font-weight: 700;\n  font-size: 14px;\n  background-color: rgb(247, 248, 250);\n  border-bottom: 1px solid rgb(234, 236, 241);\n  height: 100%;\n}\n.th-element.th-element-draggable {\n  position: relative;\n}\n.th-element:first-child {\n  border-top-left-radius: 4px;\n}\n.th-element:last-child {\n  border-top-right-radius: 4px;\n}\n.th-element:hover {\n  background-color: rgb(240, 245, 255);\n}\n.th-element.table-operate.table-operate-small {\n  width: 105px;\n}\n.th-element.table-operate.table-operate-small > .table-header-box {\n  width: 100%;\n}\n.th-element.table-operate.table-operate-not-columns.table-operate-small {\n  width: 158px;\n}\n.th-element.table-operate.table-operate-drag-row.table-operate-small {\n  width: 145px;\n}\n.th-element.table-operate.table-operate-drag-row.table-operate-not-columns.table-operate-small {\n  width: 198px;\n}\n.th-element > .th-element-draggable-box {\n  width: 4px;\n  height: 100%;\n  position: absolute;\n  right: 0;\n  top: 0;\n}\n.th-element:hover > .th-element-draggable-box {\n  background-color: rgb(213, 224, 250);\n  cursor: ew-resize;\n}";
 styleInject(css_248z$5);
 
 var ThElement = function ThElement(props) {
@@ -339,7 +342,8 @@ var en = {
   loadMore: 'Load more',
   refresh: 'Refresh',
   selectNum: 'Selected {num} items',
-  selectAll: 'Select All'
+  selectAll: 'Select All',
+  dragSort: 'Drag Sort'
 };
 
 var zh = {
@@ -350,73 +354,55 @@ var zh = {
   loadMore: '加载更多',
   refresh: '刷新',
   selectNum: '已选{num}项',
-  selectAll: '全选'
+  selectAll: '全选',
+  dragSort: '拖动排序'
 };
 
 var localeJson = {
-  zh: zh,
-  en: en
+  zh,
+  en
 };
 
-var TableHead$1 = function TableHead(props) {
-  var _props$headData = props.headData,
-    headData = _props$headData === void 0 ? [] : _props$headData,
-    sortTable = props.sortTable,
-    filter = props.filter,
-    expandable = props.expandable,
-    check = props.check,
-    radio = props.radio,
-    onRequestSort = props.onRequestSort,
-    _props$orderFieldArr = props.orderFieldArr,
-    orderFieldArr = _props$orderFieldArr === void 0 ? [] : _props$orderFieldArr,
-    _props$orderTypeArr = props.orderTypeArr,
-    orderTypeArr = _props$orderTypeArr === void 0 ? [] : _props$orderTypeArr,
-    selectAll = props.selectAll,
-    selectStatus = props.selectStatus,
-    align = props.align,
-    _props$showList = props.showList,
-    showList = _props$showList === void 0 ? [] : _props$showList,
-    changeShowList = props.changeShowList,
-    selectFilter = props.selectFilter,
-    changeFilter = props.changeFilter,
-    operate = props.operate,
-    showColumns = props.showColumns,
-    fixedTable = props.fixedTable,
-    fixedColumn = props.fixedColumn,
-    posFixed = props.posFixed,
-    beyondText = props.beyondText,
-    lineWidth = props.lineWidth,
-    dragColumn = props.dragColumn,
-    changeColumnWidth = props.changeColumnWidth,
-    headDataConfig = props.headDataConfig,
-    getPopupContainer = props.getPopupContainer,
-    tipMaxWidth = props.tipMaxWidth;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    indeterminate = _useState2[0],
-    setIndeterminate = _useState2[1]; // 半选中
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    checked = _useState4[0],
-    setChecked = _useState4[1]; // 选中
-  var _useState5 = useState(null),
-    _useState6 = _slicedToArray(_useState5, 2),
-    anchorElColums = _useState6[0],
-    setAnchorElColums = _useState6[1]; // 显示列定位元素
-  var _useState7 = useState({}),
-    _useState8 = _slicedToArray(_useState7, 2),
-    headDataJson = _useState8[0],
-    setHeadDataJson = _useState8[1]; // 显示列json
-  var _useState9 = useState({}),
-    _useState10 = _slicedToArray(_useState9, 2),
-    filterHead = _useState10[0],
-    setFilterHead = _useState10[1]; // 过滤项当前表头数据
-  var _useState11 = useState({}),
-    _useState12 = _slicedToArray(_useState11, 2),
-    selectFilterCom = _useState12[0],
-    setSelectFilterCom = _useState12[1]; // 过滤项当前选中值
-  var intl = useFormatMessage('Table', localeJson);
-  useEffect(function () {
+const TableHead$1 = props => {
+  const {
+    headData = [],
+    sortTable,
+    filter,
+    expandable,
+    check,
+    radio,
+    onRequestSort,
+    orderFieldArr = [],
+    orderTypeArr = [],
+    selectAll,
+    selectStatus,
+    align,
+    showList = [],
+    changeShowList,
+    selectFilter,
+    changeFilter,
+    operate,
+    showColumns,
+    fixedTable,
+    fixedColumn,
+    posFixed,
+    beyondText,
+    lineWidth,
+    dragColumn,
+    dragRow,
+    changeColumnWidth,
+    headDataConfig,
+    getPopupContainer,
+    tipMaxWidth
+  } = props;
+  const [indeterminate, setIndeterminate] = useState(false); // 半选中
+  const [checked, setChecked] = useState(false); // 选中
+  const [anchorElColums, setAnchorElColums] = useState(null); // 显示列定位元素
+  const [headDataJson, setHeadDataJson] = useState({}); // 显示列json
+  const [filterHead, setFilterHead] = useState({}); // 过滤项当前表头数据
+  const [selectFilterCom, setSelectFilterCom] = useState({}); // 过滤项当前选中值
+  const intl = useFormatMessage('Table', localeJson);
+  useEffect(() => {
     // 全选
     if (selectStatus === 'all') {
       setChecked(true);
@@ -433,17 +419,17 @@ var TableHead$1 = function TableHead(props) {
       setIndeterminate(false);
     }
   }, [selectStatus]);
-  useEffect(function () {
+  useEffect(() => {
     if (headData) {
-      var json = [];
-      for (var i = 0, l = headData.length; i < l; i++) {
-        var item = headData[i];
+      const json = [];
+      for (let i = 0, l = headData.length; i < l; i++) {
+        const item = headData[i];
         json[item.name] = item;
       }
       setHeadDataJson(json);
     }
   }, [headData]);
-  useEffect(function () {
+  useEffect(() => {
     if (selectFilter) setSelectFilterCom(DeepClone(selectFilter));
   }, [selectFilter]);
   /**
@@ -451,30 +437,28 @@ var TableHead$1 = function TableHead(props) {
    * @param name 排序列
    * @param event 当前排序元素
    */
-  var createSortHandler = function createSortHandler(name, item) {
-    return function (event) {
-      // 不存在排序,不触发事件
-      if (!(sortTable && item.name && item.sort !== false)) return;
-      if (onRequestSort) onRequestSort(event, name);
-    };
+  const createSortHandler = (name, item) => event => {
+    // 不存在排序,不触发事件
+    if (!(sortTable && item.name && item.sort !== false)) return;
+    if (onRequestSort) onRequestSort(event, name);
   };
   /**
    * 全选 / 全不选
    * @param event 操作元素
    * @param bol 选中 / 不选中
    */
-  var onSelectAll = function onSelectAll(event, bol) {
+  const onSelectAll = (event, bol) => {
     if (selectAll) selectAll(event, bol);
   };
   /**
    * 点击显示选择列
    * @param event 点击元素
    */
-  var clickShowColums = function clickShowColums(event) {
+  const clickShowColums = event => {
     setAnchorElColums(event.currentTarget);
   };
   // 点击隐藏选择列
-  var clickHideColums = function clickHideColums(bol) {
+  const clickHideColums = bol => {
     if (bol) return;
     setAnchorElColums(null);
   };
@@ -482,29 +466,27 @@ var TableHead$1 = function TableHead(props) {
    * 点击显示列 列表
    * @param item 详细
    */
-  var clickColumsList = function clickColumsList(item) {
-    return function () {
-      if (item.disabledSelection) return;
-      var name = item.name;
-      var itemHead = headDataJson[name];
-      if (itemHead) {
-        // 取消勾选
-        delete headDataJson[name];
-        var arr = Object.keys(headDataJson);
-        var arr1 = [];
-        for (var i = 0, l = arr.length; i < l; i++) {
-          var _name = arr[i];
-          arr1.push(headDataJson[_name]);
-        }
-        changeShowList && changeShowList(arr1, false, item);
-      } else {
-        headData.push(item);
-        changeShowList && changeShowList(headData, false, item);
+  const clickColumsList = item => () => {
+    if (item.disabledSelection) return;
+    const name = item.name;
+    const itemHead = headDataJson[name];
+    if (itemHead) {
+      // 取消勾选
+      delete headDataJson[name];
+      const arr = Object.keys(headDataJson);
+      const arr1 = [];
+      for (let i = 0, l = arr.length; i < l; i++) {
+        const name = arr[i];
+        arr1.push(headDataJson[name]);
       }
-    };
+      changeShowList && changeShowList(arr1, false, item);
+    } else {
+      headData.push(item);
+      changeShowList && changeShowList(headData, false, item);
+    }
   };
   // 重置显示列
-  var resetShowList = function resetShowList() {
+  const resetShowList = () => {
     changeShowList && changeShowList(headData, true);
   };
   /**
@@ -512,69 +494,63 @@ var TableHead$1 = function TableHead(props) {
    * @param headCell 当前列信息
    * @param event 元素
    */
-  var clickShowFilter = function clickShowFilter(headCell) {
-    return function (event) {
-      setFilterHead(headCell);
-      setSelectFilterCom(Object.assign({}, selectFilter));
-    };
+  const clickShowFilter = headCell => event => {
+    setFilterHead(headCell);
+    setSelectFilterCom(Object.assign({}, selectFilter));
   };
   // 点击隐藏过滤
-  var clickHideFilter = function clickHideFilter(bol) {
+  const clickHideFilter = bol => {
     if (bol) return;
     setFilterHead({});
     setSelectFilterCom(Object.assign({}, selectFilter));
   };
   // 点击过滤
-  var clickFilter = function clickFilter(item) {
-    return function () {
-      var name = filterHead.name;
-      var filterValue = DeepClone(selectFilterCom[name] || []);
-      var index = filterValue.indexOf(item.value);
-      if (index !== -1) {
-        // 勾选 -> 不勾选
-        filterValue.splice(index, 1);
-      } else {
-        // 不勾选 -> 勾选
-        filterValue.push(item.value);
-      }
-      var filterRadio = filterHead.filterRadio;
-      if (filterRadio) {
-        // 过滤单个
-        var num = filterValue.indexOf(item.value);
-        if (num !== -1) {
-          filterValue = [filterValue[num]];
-        }
+  const clickFilter = item => () => {
+    const name = filterHead.name;
+    let filterValue = DeepClone(selectFilterCom[name] || []);
+    const index = filterValue.indexOf(item.value);
+    if (index !== -1) {
+      // 勾选 -> 不勾选
+      filterValue.splice(index, 1);
+    } else {
+      // 不勾选 -> 勾选
+      filterValue.push(item.value);
+    }
+    const filterRadio = filterHead.filterRadio;
+    if (filterRadio) {
+      // 过滤单个
+      const num = filterValue.indexOf(item.value);
+      if (num !== -1) {
+        filterValue = [filterValue[num]];
       }
-      selectFilterCom[name] = filterValue;
-      setSelectFilterCom(Object.assign({}, selectFilterCom));
-    };
+    }
+    selectFilterCom[name] = filterValue;
+    setSelectFilterCom(Object.assign({}, selectFilterCom));
   };
   /**
    * 重置 / 确定过滤
    * @param type {'reset' | 'confirm'}  重置 / 确定过滤
    */
-  var filterFunc = function filterFunc(type) {
-    return function () {
-      if (type === 'confirm') {
-        // 确定
-        changeFilter && changeFilter(Object.assign({}, selectFilterCom));
-        setFilterHead({});
-      } else {
-        // 重置
-        var json = DeepClone(selectFilterCom);
-        delete json[filterHead.name];
-        setSelectFilterCom(json);
-        changeFilter && changeFilter(Object.assign({}, json));
-        setFilterHead({});
-      }
-    };
+  const filterFunc = type => () => {
+    if (type === 'confirm') {
+      // 确定
+      changeFilter && changeFilter(Object.assign({}, selectFilterCom));
+      setFilterHead({});
+    } else {
+      // 重置
+      const json = DeepClone(selectFilterCom);
+      delete json[filterHead.name];
+      setSelectFilterCom(json);
+      changeFilter && changeFilter(Object.assign({}, json));
+      setFilterHead({});
+    }
   };
   /**
    * 自定义过滤确定
    * @param val {[name: string]: any[]}
    * */
-  var filterCustomConfirm = function filterCustomConfirm() {
-    var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  const filterCustomConfirm = function () {
+    let val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     changeFilter && changeFilter(Object.assign({}, val));
     setFilterHead({});
   };
@@ -582,12 +558,12 @@ var TableHead$1 = function TableHead(props) {
    * 处理TableCell
    * @param item 当前列信息
    */
-  var handCellClass = function handCellClass(item) {
-    var str = 'table-header-box';
+  const handCellClass = item => {
+    let str = 'table-header-box';
     // 排序
     if (sortTable && item.name && item.sort !== false) {
       str += ' table-header-box-sort';
-      var index = orderFieldArr.indexOf(item.name);
+      const index = orderFieldArr.indexOf(item.name);
       if (index !== -1) {
         // 升序
         if (orderTypeArr[index] === 'asc') {
@@ -606,10 +582,10 @@ var TableHead$1 = function TableHead(props) {
     return str;
   };
   // 复选框memo
-  var TableCheckMemo = useMemo(function () {
+  const TableCheckMemo = useMemo(() => {
     if (check) {
-      var handCls = function handCls() {
-        var str = 'table-checkbox table-head-btn';
+      const handCls = () => {
+        let str = 'table-checkbox table-head-btn';
         if (fixedColumn) {
           str += ' table-fixed-dom-left';
           // 左边没有定位,且没有单选,没有嵌套表格
@@ -637,10 +613,10 @@ var TableHead$1 = function TableHead(props) {
     }
   }, [check, indeterminate, checked, selectAll, posFixed, radio, expandable, fixedColumn]);
   // 单选框memo
-  var TableRadioMemo = useMemo(function () {
+  const TableRadioMemo = useMemo(() => {
     if (radio) {
-      var handCls = function handCls() {
-        var str = 'table-radio table-head-btn';
+      const handCls = () => {
+        let str = 'table-radio table-head-btn';
         if (fixedColumn) {
           str += ' table-fixed-dom-left';
           // 左边没有定位,没有嵌套表格
@@ -662,10 +638,10 @@ var TableHead$1 = function TableHead(props) {
     }
   }, [radio, posFixed, expandable, fixedColumn]);
   // 嵌套表格memo
-  var TableExpandableMemo = useMemo(function () {
+  const TableExpandableMemo = useMemo(() => {
     if (expandable) {
-      var handCls = function handCls() {
-        var str = 'table-expandable table-head-btn';
+      const handCls = () => {
+        let str = 'table-expandable table-head-btn';
         if (fixedColumn) {
           str += ' table-fixed-dom-left';
           // 左边没有定位,没有嵌套表格
@@ -687,21 +663,21 @@ var TableHead$1 = function TableHead(props) {
     }
   }, [expandable, posFixed, fixedColumn]);
   // 过滤弹窗内容
-  var filterPopoverContent = function filterPopoverContent() {
-    var name = filterHead.name;
+  const filterPopoverContent = () => {
+    const name = filterHead.name;
     if (!name) return;
-    var filterValue = selectFilterCom[name] || [];
+    const filterValue = selectFilterCom[name] || [];
     if (filterHead.filterRender) {
       // 自定义渲染过滤
       return filterHead.filterRender({
-        filterValue: filterValue,
+        filterValue,
         selectFilter: selectFilterCom,
-        filterHead: filterHead,
+        filterHead,
         setFilter: filterCustomConfirm
       });
     }
-    var arr = filterHead.enums || [];
-    var str = 'filter-select';
+    const arr = filterHead.enums || [];
+    let str = 'filter-select';
     if (arr.length === 0) str += ' filter-select-none';
     return jsx("div", Object.assign({
       className: str
@@ -716,8 +692,8 @@ var TableHead$1 = function TableHead(props) {
         children: [jsx("div", Object.assign({
           className: "filter-select-box"
         }, {
-          children: arr.map(function (item, index) {
-            var checked = filterValue.indexOf(item.value) !== -1;
+          children: arr.map((item, index) => {
+            const checked = filterValue.indexOf(item.value) !== -1;
             return jsxs("div", Object.assign({
               onClick: clickFilter(item),
               className: checked ? 'filter-select-item filter-select-item-select' : 'filter-select-item'
@@ -756,30 +732,28 @@ var TableHead$1 = function TableHead(props) {
     }));
   };
   // 表格列拖拽放下
-  var onDragDown = function onDragDown(headCell) {
-    return function (result) {
-      changeColumnWidth && changeColumnWidth(headCell, result);
-    };
+  const onDragDown = headCell => result => {
+    changeColumnWidth && changeColumnWidth(headCell, result);
   };
   // 获取宽度
-  var getWidth = function getWidth(item) {
-    var w = item.width || '';
-    var name = item.name || '';
-    var wDrag = headDataConfig[name] && headDataConfig[name].width;
+  const getWidth = item => {
+    let w = item.width || '';
+    const name = item.name || '';
+    const wDrag = headDataConfig[name] && headDataConfig[name].width;
     if (wDrag) w = "".concat(wDrag, "px");
     return w;
   };
   // 内容列memo
-  var TableContentMemo = useMemo(function () {
+  const TableContentMemo = useMemo(() => {
     // 处理过滤的class
-    var handFilterClass = function handFilterClass(item) {
-      var str = 'table-header-filter';
+    const handFilterClass = item => {
+      let str = 'table-header-filter';
       if (filterHead.name === item.name) str += ' table-header-filter-show';
       if (item.name && selectFilterCom[item.name] && selectFilterCom[item.name].length > 0) str += ' table-header-filter-select';
       return str;
     };
-    var handCls = function handCls(item) {
-      var str = '';
+    const handCls = item => {
+      let str = '';
       if (item.className) str += item.className;
       if (fixedColumn && item.fixed) {
         str += " table-fixed-dom-".concat(item.fixed);
@@ -794,8 +768,8 @@ var TableHead$1 = function TableHead(props) {
       }
       return str;
     };
-    var handStyle = function handStyle(item) {
-      var json = {
+    const handStyle = item => {
+      const json = {
         width: getWidth(item)
       };
       if (fixedColumn && item.fixed && item.width) {
@@ -809,13 +783,13 @@ var TableHead$1 = function TableHead(props) {
       return Object.assign(Object.assign({}, json), item.style);
     };
     // 处理拖拽
-    var handDrag = function handDrag(item) {
+    const handDrag = item => {
       if (item.name === 'table-serial-number') return false; // 序号不拖拽
       if (dragColumn && item.drag !== false) return true;
       return false;
     };
-    return headData.map(function (headCell, index) {
-      var str = "".concat($prefixCls, "-filter-popover ").concat($prefixCls, "-scrollbar-small");
+    return headData.map((headCell, index) => {
+      let str = "".concat($prefixCls, "-filter-popover ").concat($prefixCls, "-scrollbar-small");
       if (!headCell.filterRender) str += " ".concat($prefixCls, "-filter-popover-default");
       return jsx(ThElement, Object.assign({
         className: handCls(headCell),
@@ -832,9 +806,7 @@ var TableHead$1 = function TableHead(props) {
           content: filterPopoverContent(),
           onVisibleChange: clickHideFilter,
           overlayClassName: str,
-          getPopupContainer: getPopupContainer ? getPopupContainer : function () {
-            return document.body;
-          },
+          getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body,
           maxWidth: headCell.filterMaxWidth
         }, {
           children: jsxs("div", Object.assign({
@@ -879,11 +851,13 @@ var TableHead$1 = function TableHead(props) {
     });
   }, [headData, sortTable, filter, orderFieldArr, orderTypeArr, align, filterHead, selectFilterCom, beyondText, selectFilter, fixedColumn, lineWidth, dragColumn, changeColumnWidth, headDataConfig, getPopupContainer, tipMaxWidth]);
   // 操作栏memo
-  var TableOperateMemo = useMemo(function () {
+  const TableOperateMemo = useMemo(() => {
     if (operate) {
-      var handCls = function handCls() {
-        var str = 'table-operate';
+      const handCls = () => {
+        let str = 'table-operate';
         if (operate.operateBtnRender) str += ' table-operate-small';
+        if (showColumns === false) str += ' table-operate-not-columns';
+        if (dragRow) str += ' table-operate-drag-row';
         if (fixedColumn) {
           str += ' table-fixed-dom-right';
           // 存在显示列,且没有右侧固定列
@@ -893,8 +867,8 @@ var TableHead$1 = function TableHead(props) {
         }
         return str;
       };
-      var handStyle = function handStyle() {
-        var json = {
+      const handStyle = () => {
+        const json = {
           width: operate.width
         };
         if (fixedColumn) {
@@ -928,18 +902,18 @@ var TableHead$1 = function TableHead(props) {
         }))
       }));
     }
-  }, [operate, align, posFixed, showColumns, posFixed, beyondText, fixedColumn, tipMaxWidth]);
+  }, [operate, align, posFixed, showColumns, posFixed, beyondText, fixedColumn, tipMaxWidth, dragRow]);
   // 显示列弹窗内容
-  var showListContent = function showListContent() {
+  const showListContent = () => {
     return jsxs("div", Object.assign({
       className: "show-colums-select"
     }, {
       children: [jsx("div", Object.assign({
         className: "show-colums-select-box"
       }, {
-        children: showList.map(function (item, index) {
-          var checked = Boolean(headDataJson[item.name]);
-          var str = 'show-colums-select-item';
+        children: showList.map((item, index) => {
+          const checked = Boolean(headDataJson[item.name]);
+          let str = 'show-colums-select-item';
           if (checked) str += ' show-colums-select-item-select';
           if (item.disabledSelection) str += ' show-colums-select-item-disabled';
           return jsxs("div", Object.assign({
@@ -973,9 +947,9 @@ var TableHead$1 = function TableHead(props) {
     }));
   };
   // 显示列memo
-  var TableShowList = useMemo(function () {
-    var handCls = function handCls() {
-      var str = 'show-colums table-fixed-dom-right';
+  const TableShowList = useMemo(() => {
+    const handCls = () => {
+      let str = 'show-colums table-fixed-dom-right';
       // 没有固定列参数 或者 没有操作栏且没有右侧固定列
       if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
         str += ' table-fixed-dom-right-first';
@@ -988,9 +962,7 @@ var TableHead$1 = function TableHead(props) {
       content: showListContent(),
       onVisibleChange: clickHideColums,
       overlayClassName: "".concat($prefixCls, "-table-show-colums-popover ").concat($prefixCls, "-scrollbar-small"),
-      getPopupContainer: getPopupContainer ? getPopupContainer : function () {
-        return document.body;
-      }
+      getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body
     }, {
       children: jsx(ThElement, Object.assign({
         align: "center",
@@ -1006,9 +978,26 @@ var TableHead$1 = function TableHead(props) {
       }))
     }));
   }, [showColumns, posFixed, operate, anchorElColums, showList, headDataJson, getPopupContainer, tipMaxWidth]);
+  // 拖动行
+  const TbaleDragRow = useMemo(() => {
+    if (!dragRow || operate || showColumns === 'inside') return null;
+    const handCls = () => {
+      let str = 'drag-row table-fixed-dom-right';
+      // 没有固定列参数 或者 没有操作栏且没有右侧固定列
+      if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
+        str += ' table-fixed-dom-right-first';
+      }
+      return str;
+    };
+    return jsx(ThElement, {
+      align: "center",
+      className: handCls(),
+      draggable: false
+    });
+  }, [operate, showColumns, fixedColumn, posFixed, dragRow]);
   // 处理class
-  var handClass = function handClass() {
-    var str = 'table-head';
+  const handClass = () => {
+    let str = 'table-head';
     if (showColumns === 'inside') str += ' table-head-inside';
     if (!fixedTable) str += ' table-head-scroll'; // 防止长度过长
     // 没有 复选框,单选框,展开 按钮
@@ -1019,7 +1008,7 @@ var TableHead$1 = function TableHead(props) {
     className: handClass()
   }, {
     children: jsxs(TrElement, {
-      children: [TableCheckMemo, TableRadioMemo, TableExpandableMemo, TableContentMemo, TableOperateMemo, TableShowList]
+      children: [TableCheckMemo, TableRadioMemo, TableExpandableMemo, TableContentMemo, TableOperateMemo, TableShowList, TbaleDragRow]
     })
   }));
 };
@@ -1031,12 +1020,32 @@ var TableBodyElement = function TableBodyElement(props) {
   var className = props.className,
     style = props.style,
     children = props.children,
-    otherProps = __rest(props, ["className", "style", "children"]);
+    drag = props.drag,
+    handle = props.handle,
+    onDrag = props.onDrag,
+    onChoose = props.onChoose,
+    list = props.list,
+    otherProps = __rest(props, ["className", "style", "children", "drag", "handle", "onDrag", "onChoose", "list"]);
   var handClass = function handClass() {
     var str = 'table-body-element';
     if (className) str += " ".concat(className);
     return str;
   };
+  if (drag) {
+    return jsx(dist.exports.ReactSortable, Object.assign({}, otherProps, {
+      className: handClass(),
+      style: style,
+      list: list || [],
+      handle: handle,
+      animation: 300,
+      setList: function setList() {},
+      onEnd: onDrag,
+      onChoose: onChoose,
+      tag: 'tbody'
+    }, {
+      children: children
+    }));
+  }
   return jsx("tbody", Object.assign({
     className: handClass(),
     style: style
@@ -1066,92 +1075,74 @@ var TdElement = function TdElement(props) {
   }));
 };
 
-var TableBody = function TableBody(props) {
-  var url = props.url,
-    emptyProps = props.emptyProps,
-    _props$rowData = props.rowData,
-    rowData = _props$rowData === void 0 ? [] : _props$rowData,
-    _props$rowKey = props.rowKey,
-    rowKey = _props$rowKey === void 0 ? 'key' : _props$rowKey,
-    check = props.check,
-    radio = props.radio,
-    tableCell = props.tableCell,
-    expandable = props.expandable,
-    _props$headData = props.headData,
-    headData = _props$headData === void 0 ? [] : _props$headData,
-    _props$disabledJson = props.disabledJson,
-    disabledJson = _props$disabledJson === void 0 ? {} : _props$disabledJson,
-    disabledArrStatus = props.disabledArrStatus,
-    _props$checkJson = props.checkJson,
-    checkJson = _props$checkJson === void 0 ? {} : _props$checkJson,
-    radioValue = props.radioValue,
-    selectCheck = props.selectCheck,
-    selectRadio = props.selectRadio,
-    align = props.align,
-    operate = props.operate,
-    showColumns = props.showColumns,
-    fixedTable = props.fixedTable,
-    fixedColumn = props.fixedColumn,
-    formatter = props.formatter,
-    _props$orderFieldArr = props.orderFieldArr,
-    orderFieldArr = _props$orderFieldArr === void 0 ? [] : _props$orderFieldArr,
-    _props$orderTypeArr = props.orderTypeArr,
-    orderTypeArr = _props$orderTypeArr === void 0 ? [] : _props$orderTypeArr,
-    sortTable = props.sortTable,
-    loadState = props.loadState,
-    loadMore = props.loadMore,
-    loadMoreRender = props.loadMoreRender,
-    onClickMore = props.onClickMore,
-    total = props.total,
-    page = props.page,
-    currentRowsPerPage = props.currentRowsPerPage,
-    changePage = props.changePage,
-    loadMoreUrl = props.loadMoreUrl,
-    _props$expandMultiple = props.expandMultiple,
-    expandMultiple = _props$expandMultiple === void 0 ? false : _props$expandMultiple,
-    _props$expandValue = props.expandValue,
-    expandValue = _props$expandValue === void 0 ? [] : _props$expandValue,
-    _props$disabledExpand = props.disabledExpand,
-    disabledExpand = _props$disabledExpand === void 0 ? [] : _props$disabledExpand,
-    _props$defaultExpandA = props.defaultExpandAllRows,
-    defaultExpandAllRows = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
-    onExpand = props.onExpand,
-    _onRefresh = props.onRefresh,
-    posFixed = props.posFixed,
-    beyondText = props.beyondText,
-    onClickRow = props.onClickRow,
-    rowClassMapping = props.rowClassMapping,
-    tipMaxWidth = props.tipMaxWidth,
-    lineHeight = props.lineHeight;
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    expandableColSpan = _useState2[0],
-    setExpandableColSpan = _useState2[1]; // 嵌套表格合并列数
-  var _useState3 = useState({}),
-    _useState4 = _slicedToArray(_useState3, 2),
-    expandableRow = _useState4[0],
-    setExpandableRow = _useState4[1]; // 当前哪行展开表格嵌套
-  var _useState5 = useState(true),
-    _useState6 = _slicedToArray(_useState5, 2),
-    showMoreBtn = _useState6[0],
-    setShowMoreBtn = _useState6[1]; // 加载更多
-  var _useState7 = useState({}),
-    _useState8 = _slicedToArray(_useState7, 2),
-    disabledExpandJson = _useState8[0],
-    setDisabledExpand = _useState8[1]; // 禁用加减部分嵌套
-  var intl = useFormatMessage('Table', localeJson);
+const TableBody = props => {
+  const {
+    url,
+    emptyProps,
+    rowData = [],
+    rowKey = 'key',
+    check,
+    radio,
+    tableCell,
+    expandable,
+    headData = [],
+    disabledJson = {},
+    disabledArrStatus,
+    checkJson = {},
+    radioValue,
+    selectCheck,
+    selectRadio,
+    align,
+    operate,
+    showColumns,
+    fixedTable,
+    fixedColumn,
+    formatter,
+    orderFieldArr = [],
+    orderTypeArr = [],
+    sortTable,
+    loadState,
+    loadMore,
+    loadMoreRender,
+    onClickMore,
+    total,
+    page,
+    currentRowsPerPage,
+    changePage,
+    loadMoreUrl,
+    expandMultiple = false,
+    expandValue = [],
+    disabledExpand = [],
+    defaultExpandAllRows = false,
+    onExpand,
+    onRefresh,
+    posFixed,
+    beyondText,
+    onClickRow,
+    rowClassMapping,
+    tipMaxWidth,
+    lineHeight,
+    dragRow,
+    onDragRow
+  } = props;
+  const [expandableColSpan, setExpandableColSpan] = useState(0); // 嵌套表格合并列数
+  const [expandableRow, setExpandableRow] = useState({}); // 当前哪行展开表格嵌套
+  const [showMoreBtn, setShowMoreBtn] = useState(true); // 加载更多
+  const [disabledExpandJson, setDisabledExpand] = useState({}); // 禁用加减部分嵌套
+  const [dragBol, setDragBol] = useState(false);
+  const intl = useFormatMessage('Table', localeJson);
   // 默认是否展开所有
-  useEffect(function () {
+  useEffect(() => {
     if (!defaultExpandAllRows) {
       setExpandableRow({});
       return;
     }
-    var json = {};
-    for (var i = 0, l = rowData.length; i < l; i++) {
-      var item = rowData[i] || {};
-      var id = item[rowKey];
+    const json = {};
+    for (let i = 0, l = rowData.length; i < l; i++) {
+      const item = rowData[i] || {};
+      const id = item[rowKey];
       json[id] = {
-        id: id,
+        id,
         status: 'develop'
       };
     }
@@ -1159,41 +1150,41 @@ var TableBody = function TableBody(props) {
   }, [defaultExpandAllRows, rowData, rowKey]);
   // 监听展开表格
   // 如果直接写expandMultiple, expandValue会死循环
-  useEffect(function () {
+  useEffect(() => {
     if (props.expandValue === undefined) return;
-    var json = {};
-    var expandValueHand = expandValue;
+    const json = {};
+    let expandValueHand = expandValue;
     // 只展开一个,去第一个值
     if (!expandMultiple && expandValue.length > 0) {
       expandValueHand = [expandValue[0]];
     }
-    for (var i = 0, l = expandValueHand.length; i < l; i++) {
-      var id = expandValueHand[i];
+    for (let i = 0, l = expandValueHand.length; i < l; i++) {
+      const id = expandValueHand[i];
       json[id] = {
-        id: id,
+        id,
         status: 'develop'
       };
     }
     setExpandableRow(json);
   }, [props.expandMultiple, props.expandValue, rowData]);
   // 监听禁用嵌套 props.disabledExpand 防止死循环
-  useEffect(function () {
-    var json = {};
-    for (var i = 0, l = disabledExpand.length; i < l; i++) {
-      var id = disabledExpand[i];
+  useEffect(() => {
+    const json = {};
+    for (let i = 0, l = disabledExpand.length; i < l; i++) {
+      const id = disabledExpand[i];
       json[id] = true;
     }
     setDisabledExpand(json);
   }, [props.disabledExpand]);
-  useEffect(function () {
+  useEffect(() => {
     if (loadMoreUrl) {
-      var bol = Number(total) > Number(page) * Number(currentRowsPerPage);
+      const bol = Number(total) > Number(page) * Number(currentRowsPerPage);
       setShowMoreBtn(bol);
     }
   }, [loadMoreUrl, total, page, currentRowsPerPage]);
   // 处理嵌套表格合并列数
-  useEffect(function () {
-    var num = headData.length;
+  useEffect(() => {
+    let num = headData.length;
     if (expandable) num += 1;
     if (check) num += 1;
     if (radio) num += 1;
@@ -1202,55 +1193,55 @@ var TableBody = function TableBody(props) {
     setExpandableColSpan(num);
   }, [headData, expandable, check, radio]);
   // 展开/收起嵌套表格
-  var handClickNestTable = function handClickNestTable(row) {
-    return function (event) {
-      var id = row[rowKey];
-      var expandItem = expandableRow[id] || {};
-      var status = 'develop';
-      if (expandItem.status === 'develop') status = 'retract';
-      expandItem = {
-        id: id,
-        status: status
-      };
-      if (expandMultiple) {
-        // 展开多个
-        expandableRow[id] = expandItem;
-        setExpandableRow(Object.assign({}, expandableRow));
-      } else {
-        // 展开一个
-        setExpandableRow(_defineProperty({}, id, expandItem));
-      }
-      onExpand && onExpand(row, status);
-      event.stopPropagation();
+  const handClickNestTable = row => event => {
+    const id = row[rowKey];
+    let expandItem = expandableRow[id] || {};
+    let status = 'develop';
+    if (expandItem.status === 'develop') status = 'retract';
+    expandItem = {
+      id,
+      status
     };
+    if (expandMultiple) {
+      // 展开多个
+      expandableRow[id] = expandItem;
+      setExpandableRow(Object.assign({}, expandableRow));
+    } else {
+      // 展开一个
+      setExpandableRow({
+        [id]: expandItem
+      });
+    }
+    onExpand && onExpand(row, status);
+    event.stopPropagation();
   };
   // 处理class
-  var handClass = function handClass() {
-    var str = 'table-body';
+  const handClass = () => {
+    let str = 'table-body';
     if (!fixedTable) str += ' table-body-scroll';
     // 没有 复选框,单选框,展开 按钮
     if (!check && !radio && !expandable) str += ' table-body-no-btn';
     return str;
   };
   // 处理嵌套表格class
-  var handExpandClass = function handExpandClass(row) {
-    var id = row[rowKey];
-    var expandItem = expandableRow[id] || {};
-    var str = 'retract';
+  const handExpandClass = row => {
+    const id = row[rowKey];
+    const expandItem = expandableRow[id] || {};
+    let str = 'retract';
     if (expandItem.status === 'develop') {
       str = 'expand';
     }
     return str;
   };
   // 点击加载更多
-  var clickMore = function clickMore() {
+  const clickMore = () => {
     if (loadMoreUrl) changePage && changePage();
     onClickMore && onClickMore();
   };
   // 暂无数据memo
-  var NodataMemo = useMemo(function () {
+  const NodataMemo = useMemo(() => {
     // 处理刷新按钮
-    var handRefreshBtn = function handRefreshBtn() {
+    const handRefreshBtn = () => {
       if ((emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh) !== undefined) {
         return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh;
       }
@@ -1260,8 +1251,8 @@ var TableBody = function TableBody(props) {
       return false;
     };
     // 处理className
-    var handClassNoData = function handClassNoData() {
-      var str = 'table-no-data';
+    const handClassNoData = () => {
+      let str = 'table-no-data';
       if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) str += " table-no-data-".concat(emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size);
       return str;
     };
@@ -1274,24 +1265,24 @@ var TableBody = function TableBody(props) {
       }, {
         children: jsx(Empty, Object.assign({}, emptyProps, {
           showRefresh: handRefreshBtn(),
-          onRefresh: function onRefresh(event) {
+          onRefresh: event => {
             if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh) {
               emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh(event);
               return;
             }
-            _onRefresh && _onRefresh();
+            onRefresh && onRefresh();
           }
         }))
       }))
     }));
-  }, [expandableColSpan, emptyProps, url, _onRefresh]);
+  }, [expandableColSpan, emptyProps, url, onRefresh]);
   // 复选框useCallback
-  var TableCheckCallback = useCallback(function (row) {
+  const TableCheckCallback = useCallback(row => {
     if (check) {
-      var handId = row[rowKey];
-      var disabledHand = Boolean(disabledJson[handId]);
-      var checkHand = checkJson[handId] || false;
-      var showCheck = true;
+      const handId = row[rowKey];
+      const disabledHand = Boolean(disabledJson[handId]);
+      let checkHand = checkJson[handId] || false;
+      let showCheck = true;
       if (disabledHand && disabledArrStatus) {
         // 选中
         if (disabledArrStatus[handId] === true) {
@@ -1306,8 +1297,8 @@ var TableBody = function TableBody(props) {
           showCheck = false;
         }
       }
-      var handCls = function handCls() {
-        var str = 'table-checkbox table-body-btn';
+      const handCls = () => {
+        let str = 'table-checkbox table-body-btn';
         if (fixedColumn) {
           str += ' table-fixed-dom-left';
           // 左边没有定位,且没有单选,没有嵌套表格
@@ -1324,7 +1315,7 @@ var TableBody = function TableBody(props) {
         children: showCheck && jsx(Checkbox, {
           disabled: disabledHand,
           checked: checkHand,
-          onChange: function onChange(event, bol) {
+          onChange: (event, bol) => {
             event.stopPropagation();
             selectCheck && selectCheck(event, bol, row[rowKey]);
           }
@@ -1333,12 +1324,12 @@ var TableBody = function TableBody(props) {
     }
   }, [check, disabledJson, rowKey, checkJson, selectCheck, disabledArrStatus, posFixed, expandable, radio, fixedColumn]);
   // 单选框useCallback
-  var TableRadioCallback = useCallback(function (row) {
+  const TableRadioCallback = useCallback(row => {
     if (radio) {
-      var handId = row[rowKey];
-      var disabledHand = Boolean(disabledJson[handId]);
-      var checkHand = radioValue === row[rowKey];
-      var showRadio = true;
+      const handId = row[rowKey];
+      const disabledHand = Boolean(disabledJson[handId]);
+      let checkHand = radioValue === row[rowKey];
+      let showRadio = true;
       if (disabledHand && disabledArrStatus) {
         // 选中
         if (disabledArrStatus[handId] === true) {
@@ -1353,8 +1344,8 @@ var TableBody = function TableBody(props) {
           showRadio = false;
         }
       }
-      var handCls = function handCls() {
-        var str = 'table-radio table-body-btn';
+      const handCls = () => {
+        let str = 'table-radio table-body-btn';
         if (fixedColumn) {
           str += ' table-fixed-dom-left';
           // 左边没有定位,没有嵌套表格
@@ -1371,7 +1362,7 @@ var TableBody = function TableBody(props) {
         children: showRadio && jsx(Radio, {
           disabled: disabledHand,
           checked: checkHand,
-          onChange: function onChange(event) {
+          onChange: event => {
             event.stopPropagation();
             selectRadio && selectRadio(event, row[rowKey]);
           }
@@ -1380,13 +1371,13 @@ var TableBody = function TableBody(props) {
     }
   }, [radio, disabledJson, radioValue, rowKey, selectRadio, disabledArrStatus, expandable, posFixed, fixedColumn]);
   // 嵌套加减useCallback
-  var TableExpandableMemo = useCallback(function (row) {
+  const TableExpandableMemo = useCallback(row => {
     if (!expandable) return null;
-    var expandableDemo = expandable(row);
+    const expandableDemo = expandable(row);
     // 禁用一行表格展开 或者 展开表格返回值为false,返回空列
     if (disabledExpandJson[row[rowKey]] || expandableDemo === false) return jsx(TdElement, {});
-    var handCls = function handCls() {
-      var str = 'table-expandable table-body-btn';
+    const handCls = () => {
+      let str = 'table-expandable table-body-btn';
       if (fixedColumn) {
         str += ' table-fixed-dom-left';
         // 左边没有定位,没有嵌套表格
@@ -1407,17 +1398,17 @@ var TableBody = function TableBody(props) {
     }));
   }, [expandable, expandableRow, rowKey, disabledExpandJson, onExpand, fixedColumn]);
   // 表格一行内容useCallback
-  var TableContentUseCallback = useCallback(function (row, rowIndex) {
-    var params = {
-      orderFieldArr: orderFieldArr,
-      orderTypeArr: orderTypeArr
+  const TableContentUseCallback = useCallback((row, rowIndex) => {
+    const params = {
+      orderFieldArr,
+      orderTypeArr
     };
-    var handContentClass = function handContentClass(item) {
-      var str = 'table-content-columms';
+    const handContentClass = item => {
+      let str = 'table-content-columms';
       if (item.className) str += " ".concat(item.className);
       // 排序
       if (sortTable && item.name && item.sort !== false) {
-        var index = orderFieldArr.indexOf(item.name);
+        const index = orderFieldArr.indexOf(item.name);
         if (index !== -1) {
           // 升序
           if (orderTypeArr[index] === 'asc') {
@@ -1442,8 +1433,8 @@ var TableBody = function TableBody(props) {
       }
       return str;
     };
-    var handStyle = function handStyle(item) {
-      var json = {};
+    const handStyle = item => {
+      const json = {};
       if (fixedColumn && item.fixed && item.width) {
         if (item.fixed === 'left') {
           json.left = "".concat(item.paraui_left_width, "px");
@@ -1454,14 +1445,14 @@ var TableBody = function TableBody(props) {
       }
       return json;
     };
-    return tableCell ? tableCell(row, params) : headData.map(function (item, index) {
-      var text = row[item.name];
-      var colSpan = 1;
+    return tableCell ? tableCell(row, params) : headData.map((item, index) => {
+      let text = row[item.name];
+      let colSpan = 1;
       if (item.render) text = item.render(row, item, row[item.name], index, rowIndex);
       if (formatter) text = formatter(row, item, row[item.name], index, rowIndex);
-      var itemStyle = handStyle(item);
+      const itemStyle = handStyle(item);
       // 存在显示列,最后一列占两格
-      if (showColumns === 'inside' && !operate && index === headData.length - 1) {
+      if (showColumns === 'inside' && !operate && index === headData.length - 1 && !dragRow) {
         colSpan = 2;
         if (itemStyle.right) {
           itemStyle.right = '0px';
@@ -1481,27 +1472,28 @@ var TableBody = function TableBody(props) {
         })) : text
       }), item.name || index);
     });
-  }, [tableCell, headData, align, formatter, orderFieldArr, orderTypeArr, sortTable, showColumns, operate, beyondText, fixedColumn, tipMaxWidth]);
+  }, [tableCell, headData, align, formatter, orderFieldArr, orderTypeArr, sortTable, showColumns, operate, beyondText, fixedColumn, tipMaxWidth, dragRow]);
   // 操作栏useCallback
-  var TableOperateUseCallback = useCallback(function (row, rowIndex) {
-    if (operate) {
-      var colSpan = 1;
-      if (showColumns === 'inside') colSpan = 2;
-      var handOperate = function handOperate() {
-        if (operate.render) return operate.render(row);
-        if (operate.operateBtnRender) {
-          var operateConfig = operate.operateBtnRender(row, rowIndex);
+  const TableOperateUseCallback = useCallback((row, rowIndex) => {
+    if (operate || dragRow) {
+      let colSpan = 1;
+      if (showColumns === 'inside' && operate) colSpan = 2;
+      const handOperate = () => {
+        if (operate === null || operate === void 0 ? void 0 : operate.render) return operate.render(row);
+        if (operate === null || operate === void 0 ? void 0 : operate.operateBtnRender) {
+          const operateConfig = operate.operateBtnRender(row, rowIndex);
           return jsx(OperateBtn, Object.assign({}, operateConfig));
         }
       };
-      var handStyle = function handStyle() {
-        var json = {
+      const handStyle = () => {
+        const json = {
           right: '0'
         };
         return json;
       };
-      var handCls = function handCls() {
-        var str = 'table-operate';
+      const handCls = () => {
+        let str = 'table-operate';
+        if (!operate) str += ' table-operate-center';
         if (fixedColumn) {
           str += ' table-fixed-dom-right';
           if (!(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
@@ -1511,21 +1503,41 @@ var TableBody = function TableBody(props) {
         return str;
       };
       return jsx(TdElement, Object.assign({
-        align: operate.align || align,
+        align: (operate === null || operate === void 0 ? void 0 : operate.align) || align,
         className: handCls(),
         colSpan: colSpan,
         style: handStyle()
       }, {
-        children: handOperate()
+        children: jsxs("div", Object.assign({
+          className: 'table-operate-box'
+        }, {
+          children: [handOperate(), dragRow && jsxs(Fragment, {
+            children: [operate && jsx("span", {
+              className: 'drag-btn-line'
+            }), jsx(Button.IconButton, Object.assign({
+              className: 'drag-row-btn',
+              variant: 'text',
+              toolTipTitle: !dragBol && intl({
+                id: 'dragSort'
+              }),
+              TooltipProps: {
+                placement: 'bottom-end',
+                arrow: false
+              }
+            }, {
+              children: jsx(Drag, {})
+            }))]
+          })]
+        }))
       }));
     }
-  }, [operate, align, showColumns, posFixed, fixedColumn]);
+  }, [operate, align, showColumns, posFixed, fixedColumn, dragRow, onDragRow, dragBol]);
   // 嵌套表格useCallback
-  var TableExpandableContentUseCallback = useCallback(function (row) {
-    var id = row[rowKey];
-    var expandItem = expandableRow[id] || {};
+  const TableExpandableContentUseCallback = useCallback(row => {
+    const id = row[rowKey];
+    const expandItem = expandableRow[id] || {};
     if (expandable && expandItem.status === 'develop') {
-      var expandableDemo = expandable(row);
+      const expandableDemo = expandable(row);
       if (expandableDemo === false) return null; // 展开表格返回值为false,不展示这一行
       return jsx(TrElement, Object.assign({
         className: "table-body-expand-row"
@@ -1540,7 +1552,7 @@ var TableBody = function TableBody(props) {
     }
   }, [expandable, expandableRow, expandableColSpan, rowKey]);
   // 加载更多
-  var MoreMemo = useMemo(function () {
+  const MoreMemo = useMemo(() => {
     if (!loadMore || !showMoreBtn) return null;
     return jsx(TrElement, Object.assign({
       className: "more-table-row",
@@ -1563,10 +1575,10 @@ var TableBody = function TableBody(props) {
       }))
     }));
   }, [expandableColSpan, loadMore, loadMoreRender, onClickMore, showMoreBtn, changePage, loadMoreUrl, lineHeight]);
-  var TableBodySubjectContentMemo = useMemo(function () {
+  const TableBodySubjectContentMemo = useMemo(() => {
     return jsx(Fragment, {
-      children: rowData.map(function (row, index) {
-        var str = 'table-body-row';
+      children: rowData.map((row, index) => {
+        let str = 'table-body-row';
         if (rowClassMapping && rowClassMapping[row[rowKey]]) {
           str += " ".concat(rowClassMapping[row[rowKey]]);
         }
@@ -1576,7 +1588,7 @@ var TableBody = function TableBody(props) {
             style: {
               height: "".concat(lineHeight, "px")
             },
-            onClick: function onClick(e) {
+            onClick: e => {
               onClickRow && onClickRow(row, e);
             }
           }, {
@@ -1585,55 +1597,72 @@ var TableBody = function TableBody(props) {
         }, index);
       })
     });
-  }, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, disabledExpandJson, onExpand, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight]);
+  }, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, disabledExpandJson, onExpand, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight, dragRow, onDragRow, dragBol]);
   // 内容memo
-  var TableBodyContentMemo = useMemo(function () {
+  const TableBodyContentMemo = useMemo(() => {
     return jsxs(Fragment$1, {
       children: [TableBodySubjectContentMemo, MoreMemo]
     });
-  }, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, loadMore, loadMoreRender, onClickMore, changePage, loadMoreUrl, disabledExpandJson, onExpand, showMoreBtn, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight]);
+  }, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, loadMore, loadMoreRender, onClickMore, changePage, loadMoreUrl, disabledExpandJson, onExpand, showMoreBtn, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight, dragRow, onDragRow, dragBol]);
   // 处理内容
-  var handContent = function handContent() {
+  const handContent = () => {
     // 无数据,且不再请求,显示暂无数据
     if (rowData.length === 0 && !loadState) return NodataMemo;
     return TableBodyContentMemo;
   };
+  const handleRowData = () => {
+    const arr = [];
+    if (dragRow) {
+      rowData.forEach(item => {
+        const obj = {};
+        obj[rowKey] = item[rowKey];
+        arr.push(obj);
+      });
+    }
+    return arr;
+  };
+  const onChoose = () => {
+    setDragBol(true);
+  };
+  const onDragRowCom = evt => {
+    setDragBol(false);
+    onDragRow && onDragRow(evt);
+  };
   return jsx(TableBodyElement, Object.assign({
-    className: handClass()
+    className: handClass(),
+    drag: dragRow,
+    handle: '.drag-row-btn',
+    list: handleRowData(),
+    onDrag: onDragRowCom,
+    onChoose: onChoose
   }, {
     children: handContent()
   }));
 };
 
-var TableHead = function TableHead(props) {
-  var paginationType = props.paginationType,
-    flippingArrow = props.flippingArrow,
-    autoPagination = props.autoPagination,
-    total = props.total,
-    page = props.page,
-    rowsPerPage = props.rowsPerPage,
-    currentRowsPerPage = props.currentRowsPerPage,
-    changePage = props.changePage,
-    changeRowsPerPage = props.changeRowsPerPage,
-    refreshInside = props.refreshInside,
-    checkCount = props.checkCount,
-    onRefresh = props.onRefresh,
-    selectAll = props.selectAll,
-    selectStatus = props.selectStatus,
-    _props$checkNumber = props.checkNumber,
-    checkNumber = _props$checkNumber === void 0 ? 0 : _props$checkNumber,
-    _props$currentPageTot = props.currentPageTotal,
-    currentPageTotal = _props$currentPageTot === void 0 ? 0 : _props$currentPageTot;
-  var intl = useFormatMessage('Table', localeJson);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    indeterminate = _useState2[0],
-    setIndeterminate = _useState2[1]; // 半选中
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    checked = _useState4[0],
-    setChecked = _useState4[1]; // 选中
-  useEffect(function () {
+const TableHead = props => {
+  const {
+    paginationType,
+    flippingArrow,
+    autoPagination,
+    total,
+    page,
+    rowsPerPage,
+    currentRowsPerPage,
+    changePage,
+    changeRowsPerPage,
+    refreshInside,
+    checkCount,
+    onRefresh,
+    selectAll,
+    selectStatus,
+    checkNumber = 0,
+    currentPageTotal = 0
+  } = props;
+  const intl = useFormatMessage('Table', localeJson);
+  const [indeterminate, setIndeterminate] = useState(false); // 半选中
+  const [checked, setChecked] = useState(false); // 选中
+  useEffect(() => {
     // 全选
     if (selectStatus === 'all') {
       setChecked(true);
@@ -1655,23 +1684,23 @@ var TableHead = function TableHead(props) {
    * @param event 操作元素
    * @param bol 选中 / 不选中
    */
-  var onSelectAll = function onSelectAll(event, bol) {
+  const onSelectAll = (event, bol) => {
     if (selectAll) selectAll(event, bol);
   };
   // 改变页面
-  var changePageCom = function changePageCom(num) {
+  const changePageCom = num => {
     changePage && changePage(num);
   };
   // 改变每页显示条数
-  var changeRowsPerPageCom = function changeRowsPerPageCom(num) {
+  const changeRowsPerPageCom = num => {
     changeRowsPerPage && changeRowsPerPage(num);
   };
   // 刷新
-  var clickRefresh = function clickRefresh() {
+  const clickRefresh = () => {
     onRefresh && onRefresh();
   };
   // 处理分页右侧
-  var handlePaginationRight = function handlePaginationRight() {
+  const handlePaginationRight = () => {
     if (!checkCount) return null;
     return jsxs("div", Object.assign({
       className: 'table-pagination-right'
@@ -1694,8 +1723,8 @@ var TableHead = function TableHead(props) {
     }));
   };
   // 处理样式
-  var handleClass = function handleClass() {
-    var str = 'table-pagination';
+  const handleClass = () => {
+    const str = 'table-pagination';
     return str;
   };
   return jsxs("div", Object.assign({
@@ -1712,9 +1741,7 @@ var TableHead = function TableHead(props) {
       currentRowsPerPage: currentRowsPerPage,
       changePage: changePageCom,
       changeRowsPerPage: changeRowsPerPageCom,
-      getPopupContainer: function getPopupContainer() {
-        return document.body;
-      }
+      getPopupContainer: () => document.body
     }), refreshInside && jsx(Button.IconButton, Object.assign({
       className: 'refresh-btn',
       variant: "outlined",
@@ -1728,14 +1755,16 @@ var TableHead = function TableHead(props) {
 var css_248z$2 = ".table-container {\n  overflow-x: auto;\n}";
 styleInject(css_248z$2);
 
-var TableContainer = function TableContainer(props) {
-  var cRef = props.cRef,
-    className = props.className,
-    style = props.style,
-    children = props.children,
+const TableContainer = props => {
+  const {
+      cRef,
+      className,
+      style,
+      children
+    } = props,
     otherProps = __rest(props, ["cRef", "className", "style", "children"]);
-  var handClass = function handClass() {
-    var str = 'table-container';
+  const handClass = () => {
+    let str = 'table-container';
     if (className) str += " ".concat(className);
     return str;
   };
@@ -1751,14 +1780,16 @@ var TableContainer = function TableContainer(props) {
 var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.table-element {\n  width: 100%;\n  display: table;\n  border-collapse: separate;\n  border-spacing: 0;\n}\n.table-element.table-element-fixed-column > .table-body-element > .tr-element > .td-element {\n  position: sticky;\n}\n.table-element > .table-head-element > .tr-element > .th-element {\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  height: 100%;\n  width: 30px;\n  position: absolute;\n  top: 0;\n  right: 0;\n  transform: translate(100%);\n  content: \"\";\n  transition: box-shadow 0.3s;\n  pointer-events: none;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  height: 100%;\n  width: 30px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  transform: translate(-100%);\n  content: \"\";\n  transition: box-shadow 0.3s;\n  pointer-events: none;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left {\n  z-index: 11;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right {\n  z-index: 11;\n}\n.table-element > .table-body-element > .tr-element > .td-element {\n  z-index: 1;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  height: 100%;\n  width: 30px;\n  position: absolute;\n  top: 0;\n  right: 0;\n  transform: translate(100%);\n  content: \"\";\n  transition: box-shadow 0.3s;\n  pointer-events: none;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  height: 100%;\n  width: 30px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  transform: translate(-100%);\n  content: \"\";\n  transition: box-shadow 0.3s;\n  pointer-events: none;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left {\n  z-index: 2;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right {\n  z-index: 2;\n}\n\n.table-scroll-left .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-left .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n\n.table-scroll-right .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-right .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n\n.table-scroll-middle .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n  box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n  box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}";
 styleInject(css_248z$1);
 
-var TableElement = function TableElement(props) {
-  var className = props.className,
-    style = props.style,
-    fixedColumn = props.fixedColumn,
-    children = props.children,
+const TableElement = props => {
+  const {
+      className,
+      style,
+      fixedColumn,
+      children
+    } = props,
     otherProps = __rest(props, ["className", "style", "fixedColumn", "children"]);
-  var handClass = function handClass() {
-    var str = 'table-element';
+  const handClass = () => {
+    let str = 'table-element';
     if (fixedColumn) str += ' table-element-fixed-column';
     if (className) str += " ".concat(className);
     return str;
@@ -1771,7 +1802,7 @@ var TableElement = function TableElement(props) {
   }));
 };
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-table {\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  background-color: white;\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  position: relative;\n}\n.paraui-v4-table.paraui-v4-table-draggable * {\n  user-select: none !important;\n}\n.paraui-v4-table.paraui-v4-table-fixed-table > .table-contain > table {\n  table-layout: fixed;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-checkbox {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-radio {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-expandable {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-radio.paraui-v4-table-check .table-radio {\n  left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check .table-expandable {\n  left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check.paraui-v4-table-radio .table-expandable {\n  left: 80px;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table {\n  height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table .paraui-v4-empty {\n  overflow: hidden;\n}\n.paraui-v4-table.paraui-v4-table-load.paraui-v4-table-no-data > .table-container > table {\n  height: auto;\n}\n.paraui-v4-table.paraui-v4-table-pagination > .table-contain {\n  height: calc(100% - 36px);\n}\n.paraui-v4-table.paraui-v4-table-pagination.table-load-more > .table-contain {\n  height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-load-more.paraui-v4-table-pagination > .table-contain {\n  height: 100%;\n}\n.paraui-v4-table > .table-contain {\n  height: 100%;\n  position: relative;\n}\n.paraui-v4-table > .table-contain > table {\n  height: auto;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox .table-header-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio .table-header-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-expandable > svg {\n  vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table > .table-head {\n  width: 100%;\n  white-space: nowrap;\n}\n.paraui-v4-table > .table-contain > table > .table-head > tr th {\n  height: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-scroll tr th {\n  max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-serial-number .table-header-box .table-header-title {\n  padding-right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box {\n  height: 47px;\n  line-height: 47px;\n  position: relative;\n  padding: 0 8px;\n  display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title {\n  max-width: 100%;\n  display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title > .table-header-title-label {\n  width: 100%;\n  color: rgb(92, 101, 115);\n  font-weight: 700;\n  font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover {\n  background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > svg {\n  font-size: 12px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .up-svg {\n  position: relative;\n  top: 3px;\n  transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .down-svg {\n  position: relative;\n  top: -3px;\n  transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  cursor: pointer;\n  border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover {\n  background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span > svg {\n  font-size: 14px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-show > span > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span:after {\n  position: absolute;\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: rgb(244, 66, 66);\n  content: \"\";\n  right: 3px;\n  top: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort > .table-header-title {\n  padding-right: 8px;\n  max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-filter > .table-header-title {\n  padding-right: 8px;\n  max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort.table-header-box-filter > .table-header-title {\n  max-width: calc(100% - 40px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-asc > .table-sort-svg > span > .up-svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-desc > .table-sort-svg > span > .down-svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums {\n  width: 53px;\n  cursor: pointer;\n  border-left: 1px solid rgb(234, 236, 241);\n  right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box > svg {\n  font-size: 20px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-no-btn tr th:first-child .table-header-box {\n  padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn {\n  width: 32px;\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn > .table-header-box {\n  width: 32px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child > .table-header-box {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body {\n  width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-scroll tr td {\n  max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td {\n  background-color: white;\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate {\n  padding-right: 16px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:nth-of-type(2n) td {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:hover td {\n  background-color: rgb(233, 239, 255);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg {\n  transition: all 0.3s;\n  cursor: pointer;\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n  transform: rotate(270deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > .expand {\n  transform: rotate(360deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row {\n  cursor: pointer;\n  position: sticky;\n  bottom: 0;\n  z-index: 10;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row .more-btn {\n  color: rgb(46, 101, 230);\n  font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row > .td-element {\n  position: relative;\n  background: white;\n  box-shadow: 4px -4px 8px 0px rgb(234, 236, 241);\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr td:first-child {\n  padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr.more-table-row td:first-child {\n  padding-left: 8px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn > .table-no-data > td:first-child {\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn {\n  width: 32px;\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn:first-child {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data {\n  height: calc(100% - 50px);\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data:hover td {\n  background-color: white;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data > td {\n  padding: 56px 0 0 0;\n}\n.paraui-v4-table > .table-contain > .table-pos-line {\n  position: absolute;\n  top: 0;\n  width: 1px;\n  background-color: rgb(46, 101, 230);\n  z-index: 1000;\n}\n.paraui-v4-table > .table-pagination {\n  width: 100%;\n  height: 36px;\n  display: flex;\n  align-items: flex-end;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right {\n  display: flex;\n  height: 32px;\n  align-items: center;\n  color: rgb(29, 33, 38);\n  line-height: 32px;\n  padding-left: 16px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .all-select {\n  margin-left: 12px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .line {\n  width: 1px;\n  height: 12px;\n  background-color: rgb(212, 218, 227);\n  margin: 0 10px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .check-number {\n  width: 65px;\n  display: inline-block;\n}\n.paraui-v4-table > .table-pagination .table-pagination-com {\n  flex: 1;\n  justify-content: flex-end;\n}\n.paraui-v4-table > .table-pagination .refresh-btn {\n  margin-left: 20px;\n}\n\n.paraui-v4-table-show-colums-popover > .component-popover-content {\n  min-width: 200px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box {\n  padding-top: 4px;\n  max-height: 320px;\n  overflow-y: auto;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item {\n  height: 30px;\n  line-height: 30px;\n  cursor: pointer;\n  display: flex;\n  padding: 0 10px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > span {\n  padding-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  display: inline-block;\n  width: calc(100% - 14px);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item:hover {\n  background: rgb(247, 248, 250);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled {\n  cursor: inherit;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled > span {\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled:hover {\n  background: transparent;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer {\n  height: 36px;\n  border-top: 1px solid rgb(247, 248, 250);\n  text-align: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer > button {\n  width: 100%;\n  height: 100%;\n  margin: 0;\n}\n\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box {\n  padding-top: 4px;\n  max-height: 320px;\n  overflow-y: auto;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item {\n  height: 30px;\n  line-height: 30px;\n  cursor: pointer;\n  display: flex;\n  padding: 0 10px;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > span {\n  padding-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  display: inline-block;\n  width: calc(100% - 14px);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item:hover {\n  background: rgb(247, 248, 250);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer {\n  height: 36px;\n  border-top: 1px solid rgb(247, 248, 250);\n  text-align: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer > button {\n  width: 50%;\n  height: 100%;\n  margin: 0;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select.filter-select-none {\n  text-align: center;\n  padding: 20px 0;\n}\n.paraui-v4-filter-popover.paraui-v4-filter-popover-default > .component-popover-content {\n  min-width: 200px;\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-table {\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  background-color: white;\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  position: relative;\n}\n.paraui-v4-table.paraui-v4-table-draggable * {\n  user-select: none !important;\n}\n.paraui-v4-table.paraui-v4-table-fixed-table > .table-contain > table {\n  table-layout: fixed;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-checkbox {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-radio {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-expandable {\n  left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-radio.paraui-v4-table-check .table-radio {\n  left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check .table-expandable {\n  left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check.paraui-v4-table-radio .table-expandable {\n  left: 80px;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table {\n  height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table .paraui-v4-empty {\n  overflow: hidden;\n}\n.paraui-v4-table.paraui-v4-table-load.paraui-v4-table-no-data > .table-container > table {\n  height: auto;\n}\n.paraui-v4-table.paraui-v4-table-pagination > .table-contain {\n  height: calc(100% - 36px);\n}\n.paraui-v4-table.paraui-v4-table-pagination.table-load-more > .table-contain {\n  height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-load-more.paraui-v4-table-pagination > .table-contain {\n  height: 100%;\n}\n.paraui-v4-table > .table-contain {\n  height: 100%;\n  position: relative;\n}\n.paraui-v4-table > .table-contain > table {\n  height: auto;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox .table-header-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio .table-header-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-expandable > svg {\n  vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table > .table-head {\n  width: 100%;\n  white-space: nowrap;\n}\n.paraui-v4-table > .table-contain > table > .table-head > tr th {\n  height: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-scroll tr th {\n  max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-serial-number .table-header-box .table-header-title {\n  padding-right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box {\n  height: 47px;\n  line-height: 47px;\n  position: relative;\n  padding: 0 8px;\n  display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title {\n  max-width: 100%;\n  display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title > .table-header-title-label {\n  width: 100%;\n  color: rgb(92, 101, 115);\n  font-weight: 700;\n  font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover {\n  background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > svg {\n  font-size: 12px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .up-svg {\n  position: relative;\n  top: 3px;\n  transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .down-svg {\n  position: relative;\n  top: -3px;\n  transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  cursor: pointer;\n  border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover {\n  background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span > svg {\n  font-size: 14px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-show > span > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span:after {\n  position: absolute;\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: rgb(244, 66, 66);\n  content: \"\";\n  right: 3px;\n  top: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort > .table-header-title {\n  padding-right: 8px;\n  max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-filter > .table-header-title {\n  padding-right: 8px;\n  max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort.table-header-box-filter > .table-header-title {\n  max-width: calc(100% - 40px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-asc > .table-sort-svg > span > .up-svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-desc > .table-sort-svg > span > .down-svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums {\n  width: 53px;\n  cursor: pointer;\n  border-left: 1px solid rgb(234, 236, 241);\n  right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box > svg {\n  font-size: 20px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .drag-row {\n  width: 53px;\n  cursor: pointer;\n  border-left: 1px solid rgb(234, 236, 241);\n  right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-no-btn tr th:first-child .table-header-box {\n  padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn {\n  width: 32px;\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn > .table-header-box {\n  width: 32px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child > .table-header-box {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body {\n  width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-scroll tr td {\n  max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td {\n  background-color: white;\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate {\n  padding-right: 16px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate > .table-operate-box {\n  display: flex;\n  align-items: center;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate > .table-operate-box .drag-btn-line {\n  display: inline-block;\n  width: 1px;\n  height: 12px;\n  background-color: rgb(213, 224, 250);\n  margin: 0 10px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate > .table-operate-box .drag-row-btn {\n  cursor: all-scroll;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate > .table-operate-box .drag-row-btn svg {\n  font-size: 18px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate.table-operate-center {\n  padding-right: 8px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate.table-operate-center > .table-operate-box {\n  justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:nth-of-type(2n) td {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:hover td {\n  background-color: rgb(233, 239, 255);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg {\n  transition: all 0.3s;\n  cursor: pointer;\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n  transform: rotate(270deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > .expand {\n  transform: rotate(360deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row {\n  cursor: pointer;\n  position: sticky;\n  bottom: 0;\n  z-index: 10;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row .more-btn {\n  color: rgb(46, 101, 230);\n  font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row > .td-element {\n  position: relative;\n  background: white;\n  box-shadow: 4px -4px 8px 0px rgb(234, 236, 241);\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr td:first-child {\n  padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr.more-table-row td:first-child {\n  padding-left: 8px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn > .table-no-data > td:first-child {\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn {\n  width: 32px;\n  padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn:first-child {\n  width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data {\n  height: calc(100% - 50px);\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data:hover td {\n  background-color: white;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data > td {\n  padding: 56px 0 0 0;\n}\n.paraui-v4-table > .table-contain > .table-pos-line {\n  position: absolute;\n  top: 0;\n  width: 1px;\n  background-color: rgb(46, 101, 230);\n  z-index: 1000;\n}\n.paraui-v4-table > .table-pagination {\n  width: 100%;\n  height: 36px;\n  display: flex;\n  align-items: flex-end;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right {\n  display: flex;\n  height: 32px;\n  align-items: center;\n  color: rgb(29, 33, 38);\n  line-height: 32px;\n  padding-left: 16px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .all-select {\n  margin-left: 12px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .line {\n  width: 1px;\n  height: 12px;\n  background-color: rgb(212, 218, 227);\n  margin: 0 10px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .check-number {\n  width: 65px;\n  display: inline-block;\n}\n.paraui-v4-table > .table-pagination .table-pagination-com {\n  flex: 1;\n  justify-content: flex-end;\n}\n.paraui-v4-table > .table-pagination .refresh-btn {\n  margin-left: 20px;\n}\n\n.paraui-v4-table-show-colums-popover > .component-popover-content {\n  min-width: 200px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box {\n  padding-top: 4px;\n  max-height: 320px;\n  overflow-y: auto;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item {\n  height: 30px;\n  line-height: 30px;\n  cursor: pointer;\n  display: flex;\n  padding: 0 10px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > span {\n  padding-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  display: inline-block;\n  width: calc(100% - 14px);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item:hover {\n  background: rgb(247, 248, 250);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled {\n  cursor: inherit;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled > span {\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled:hover {\n  background: transparent;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer {\n  height: 36px;\n  border-top: 1px solid rgb(247, 248, 250);\n  text-align: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer > button {\n  width: 100%;\n  height: 100%;\n  margin: 0;\n}\n\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box {\n  padding-top: 4px;\n  max-height: 320px;\n  overflow-y: auto;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item {\n  height: 30px;\n  line-height: 30px;\n  cursor: pointer;\n  display: flex;\n  padding: 0 10px;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > label {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > span {\n  padding-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  display: inline-block;\n  width: calc(100% - 14px);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item:hover {\n  background: rgb(247, 248, 250);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer {\n  height: 36px;\n  border-top: 1px solid rgb(247, 248, 250);\n  text-align: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer > button {\n  width: 50%;\n  height: 100%;\n  margin: 0;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select.filter-select-none {\n  text-align: center;\n  padding: 20px 0;\n}\n.paraui-v4-filter-popover.paraui-v4-filter-popover-default > .component-popover-content {\n  min-width: 200px;\n}";
 styleInject(css_248z);
 
 const Table = propsInit => {
@@ -1823,6 +1854,7 @@ const Table = propsInit => {
     fixedTable = true,
     fixedColumn = true,
     dragColumn = true,
+    dragRow,
     formatter,
     lineHeight = 48,
     lineWidth = 80,
@@ -1849,7 +1881,8 @@ const Table = propsInit => {
     onSort,
     onError,
     refreshInside = props.url ? true : false,
-    checkCount = props.check ? true : false
+    checkCount = props.check ? true : false,
+    onDragRow
   } = props;
   const intl = useFormatMessage('Table', localeJson);
   const dayNum = props.expirationTime ? props.expirationTime === 0 ? 100000000 : props.expirationTime : 7; // 过期天数
@@ -2378,8 +2411,8 @@ const Table = propsInit => {
   // 计算右边的差量
   const handRightWidth = () => {
     let rightNum = 0;
-    // 显示列宽度
-    if (props.showColumns === 'inside' || props.showColumns === undefined) {
+    // 显示列宽度 拖拽
+    if (props.showColumns === 'inside' || props.showColumns === undefined || props.dragRow) {
       rightNum += 53;
     }
     // 操作列
@@ -2388,10 +2421,13 @@ const Table = propsInit => {
         rightNum += getStringInNumber(props.operate.width);
       } else {
         if (props.operate.operateBtnRender) {
-          // 操作按钮组
-          rightNum += 105;
+          if (props.dragRow) {
+            rightNum += 145;
+          } else {
+            rightNum += rightNum === 0 ? 158 : 105;
+          }
         } else {
-          rightNum += lineWidth; // 自定义操作
+          rightNum += lineWidth; // 自定义操作, 补偿一个最小的宽度
         }
       }
     }
@@ -2828,6 +2864,22 @@ const Table = propsInit => {
       setDrag: true
     });
   };
+  /** 数组交换位置 */
+  const moveElementToNthPosition = (arr, indexA, indexB) => {
+    // 使用splice方法移除索引a处的元素，并将其存储在变量element中
+    const element = arr.splice(indexA, 1)[0];
+    // 在索引n处插入被移除的元素
+    arr.splice(indexB, 0, element);
+    return arr;
+  };
+  /** 拖动行 */
+  const onDragRowCom = evt => __awaiter(void 0, void 0, void 0, function* () {
+    if (evt.oldIndex === evt.newIndex) return;
+    const newList = [...(rowData || [])];
+    moveElementToNthPosition(newList, evt.oldIndex, evt.newIndex);
+    const bol = yield onDragRow === null || onDragRow === void 0 ? void 0 : onDragRow(newList, evt);
+    if (!bol) setRowData(newList);
+  });
   // 表格头部memo
   const TableHeadMemo = useMemo(() => {
     return jsx(TableHead$1, {
@@ -2856,12 +2908,13 @@ const Table = propsInit => {
       beyondText: beyondText,
       lineWidth: lineWidth,
       dragColumn: dragColumn,
+      dragRow: dragRow,
       headDataConfig: headDataConfig,
       tipMaxWidth: tipMaxWidth,
       changeColumnWidth: changeColumnWidth,
       getPopupContainer: getPopupContainer
     });
-  }, [totalDataJson, showColumns, rowKey, rowData, checkJson, disabledJson, orderTypeArr, orderFieldArr, sortTable, filter, expandable, check, headSelectStatus, radio, align, showHeadList, headDataCom, selectFilterCom, operate, onClickColumns, sortTableRadio, fixedTable, posFixed, beyondText, fixedColumn, lineWidth, dragColumn, headDataConfig, getPopupContainer, onSort, tipMaxWidth]);
+  }, [totalDataJson, showColumns, rowKey, rowData, checkJson, disabledJson, orderTypeArr, orderFieldArr, sortTable, filter, expandable, check, headSelectStatus, radio, align, showHeadList, headDataCom, selectFilterCom, operate, onClickColumns, sortTableRadio, fixedTable, posFixed, beyondText, fixedColumn, lineWidth, dragColumn, dragRow, headDataConfig, getPopupContainer, onSort, tipMaxWidth]);
   // 表格内容memo
   const TableBodyMemo = useMemo(() => {
     return jsx(TableBody, {
@@ -2912,9 +2965,11 @@ const Table = propsInit => {
       onClickRow: onClickRow,
       rowClassMapping: rowClassMapping,
       tipMaxWidth: tipMaxWidth,
-      lineHeight: lineHeight
+      lineHeight: lineHeight,
+      dragRow: dragRow,
+      onDragRow: onDragRowCom
     });
-  }, [showColumns, formatter, rowKey, rowData, headDataCom, expandable, check, radio, checkJson, sortTable, orderTypeArr, orderFieldArr, radioValue, disabledJson, align, tableCell, operate, setRadio, setCheck, totalDataJson, loadMore, loadMoreRender, onClickMore, total, pageCom, sizeCom, loadMoreUrl, expandValue, expandMultiple, disabledExpand, onExpand, defaultExpandAllRows, loadState, emptyProps, url, disabledArrStatus, posFixed, beyondText, fixedTable, fixedColumn, onClickRow, rowClassMapping, tipMaxWidth, lineHeight]);
+  }, [showColumns, formatter, rowKey, rowData, headDataCom, expandable, check, radio, checkJson, sortTable, orderTypeArr, orderFieldArr, radioValue, disabledJson, align, tableCell, operate, setRadio, setCheck, totalDataJson, loadMore, loadMoreRender, onClickMore, total, pageCom, sizeCom, loadMoreUrl, expandValue, expandMultiple, disabledExpand, onExpand, defaultExpandAllRows, loadState, emptyProps, url, disabledArrStatus, posFixed, beyondText, fixedTable, fixedColumn, onClickRow, rowClassMapping, tipMaxWidth, lineHeight, dragRow, onDragRow]);
   // 表格分页memo
   const TablePaginationMemo = useMemo(() => {
     if (constData.current.page === null || constData.current.size === null || loadMore) return;
@@ -2968,6 +3023,7 @@ const Table = propsInit => {
     if (fixedTable) str += " ".concat($prefixCls, "-table-fixed-table");
     if (fixedColumn) str += " ".concat($prefixCls, "-table-fixed-cloumn");
     if (dragColumn) str += " ".concat($prefixCls, "-table-drag-column");
+    if (dragRow) str += " ".concat($prefixCls, "-table-drag-row");
     if (check) str += " ".concat($prefixCls, "-table-check");
     if (radio) str += " ".concat($prefixCls, "-table-radio");
     if (expandable) str += " ".concat($prefixCls, "-table-expandable");