@luck-design-biz/luckda 0.0.24-2 → 0.0.25-2

package/es/lowcode/view/lc-components/Tabs/meta.json

@@ -8,9 +8,8 @@
   "order": 1,
   "props": [
     {
-      "key": "fieldId",
+      "key": "id",
       "name": "唯一标识",
-      "desc": "组件的唯一标识符，不能够与其它组件重名，不能够为空，且只能够使用以字母开头的，下划线以及数字的组合",
       "type": "string",
       "disabled": true
     },
@@ -18,123 +17,96 @@
       "key": "items",
       "name": "标签项",
       "desc": "表示标签项或选项卡的集合",
-      "type": "_TabsItems",
-      "default": []
-    },
-    {
-      "key": "shape",
-      "name": "形态",
-      "desc": "表示选项卡的形态或外观样式",
-      "type": "radio",
-      "options": [
-        {
-          "label": "普通型",
-          "value": "pure"
-        },
+      "type": "_TabItems",
+      "default": [
         {
-          "label": "包裹型",
-          "value": "wrapped"
-        },
-        {
-          "label": "文本型",
-          "value": "text"
-        },
-        {
-          "label": "胶囊型",
-          "value": "capsule"
+          "id": "tab_lvwdncx1",
+          "name": "标签项",
+          "active": true,
+          "destory": false,
+          "serial": null,
+          "serialEffect": "hidden"
         }
       ],
-      "default": "pure"
+      "wrapper": "collapse",
+      "wrapperProps": { "suppressIcon": true }
     },
     {
-      "key": "size",
-      "name": "大小",
-      "desc": "表示选项卡的形态或外观样式",
-      "type": "radio",
+      "key": "type",
+      "name": "基本样式",
+      "type": "segmented",
       "options": [
         {
-          "label": "小",
-          "value": "small"
+          "label": "线条式",
+          "value": "line"
         },
         {
-          "label": "中",
-          "value": "default"
+          "label": "卡片式",
+          "value": "card"
         }
       ],
-      "default": "default"
-    },
-    {
-      "key": "contentPadding",
-      "name": "内容间距",
-      "desc": "设定内容区的内间距，请输入合理的CSS padding值",
-      "type": "string",
-      "default": "20px 20px"
+      "default": "line"
     },
     {
-      "key": "excessMode",
-      "name": "选项卡过多时的滑动模式",
-      "desc": "表示选项卡过多时的滑动模式",
-      "type": "radio",
+      "key": "tabPosition",
+      "name": "页签位置",
+      "type": "segmented",
+      "repositioning": true,
       "options": [
         {
-          "label": "滑动",
-          "value": "slide"
+          "label": "上",
+          "value": "top"
+        },
+        {
+          "label": "右",
+          "value": "right"
+        },
+        {
+          "label": "下",
+          "value": "bottom"
         },
         {
-          "label": "下拉",
-          "value": "dropdown"
+          "label": "左",
+          "value": "left"
         }
       ],
-      "default": "slide"
-    },
-    {
-      "key": "unmountInactiveTabs",
-      "name": "切换销毁",
-      "desc": "表示选项卡切换时是否销毁非活动选项卡的内容",
-      "type": "boolean",
-      "default": false
+      "default": "top"
     },
     {
-      "key": "lazyLoad",
-      "name": "延迟加载",
-      "desc": "表示选项卡的延迟加载行为",
-      "type": "boolean",
-      "default": false
+      "key": "tabBarGutter",
+      "name": "Tab间隙",
+      "type": "number"
     },
     {
-      "key": "needBadge",
-      "name": "开启徽标",
-      "desc": "表示选项卡是否开启徽标",
-      "type": "boolean",
-      "default": false
+      "key": "tabBarExtraContent",
+      "name": "tab bar 上额外的元素",
+      "type": "_JSEditor",
+      "defaultCode": "function Component() { \n return <div>extra</div>; \n}",
+      "mustConfirm": true,
+      "wrapper": "collapse",
+      "wrapperProps": { "suppressIcon": true }
     }
   ],
-  "style": {},
+  "css": "width: 100%; height: 100%;",
   "advance": {
     "events": [
       {
         "key": "onMount",
         "name": "组件首次渲染时",
         "desc": "在组件首次渲染时，执行方法",
-        "func": "(params)=>{\n\t\n}"
+        "func": "(instance)=>{\n\t\n}"
       },
       {
         "key": "onUnmount",
         "name": "组件卸载时",
         "desc": "在组件卸载时，执行方法。",
-        "func": "(params)=>{\n\t\n}"
-      },
-      {
-        "key": "renderBadge",
-        "name": "徽标渲染",
-        "desc": "当needBadge为true时可配置。徽标渲染方法",
-        "func": "(tabItem)=>{\n\t\n}"
+        "func": "(instance)=>{\n\t\n}"
       },
       {
-        "key": "onExtraRender",
-        "name": "渲染导航栏附加内容",
-        "desc": "渲染导航栏附加内容方法",
-        "func": "(activeTab)=>{\n\t\n}"
+        "key": "onTabClick",
+        "name": "tab被点击的回调",
+        "desc": "当tab被点击时, 执行方法",
+        "func": "(tabKey, e)=>{\n\t\n}"
       }
     ]
   }

package/es/lowcode/view/lc-components/Text/FunctionPreview.js

@@ -0,0 +1,9 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["children"];
+import Index from "./index";
+var FunctionPreview = function FunctionPreview(_ref) {
+  var children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(Index, props, children);
+};
+export default FunctionPreview;

package/es/lowcode/view/lc-components/Text/index.js

@@ -12,6 +12,7 @@ var LCText = function LCText(_ref) {
   });
   return /*#__PURE__*/React.createElement(Wrapper, {
     id: id,
+    displayName: "Text",
     getTargetDom: getTargetDom
   }, /*#__PURE__*/React.createElement("div", {
     ref: ref,

package/es/lowcode/view/lc-components/Text/meta.json

@@ -17,7 +17,7 @@
       "key": "content",
       "name": "内容",
       "desc": "文本内容设置",
-      "type": "string"
+      "type": "_I18nInput"
     },
     {
       "key": "showTitle",
@@ -30,7 +30,7 @@
       "key": "title",
       "name": "自定义标题",
       "desc": "显示标题时配置。自定义标题内容",
-      "type": "string"
+      "type": "_I18nInput"
     },
     {
       "key": "maxLine",
@@ -40,7 +40,7 @@
       "default": 0
     }
   ],
-  "style": {},
+  "css": {},
   "advance": {
     "events": [
       {

package/es/lowcode/view/lc-components/Tree/FunctionDesign.js

@@ -1,9 +1,69 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["children"];
+var _excluded = ["rowKey", "children", "defaultExpandDeep"];
+import React, { useState, useEffect, useRef, useLayoutEffect } from 'react';
+import { transform } from 'lodash';
+import { useMemoizedFn } from 'ahooks';
 import Index from "./index";
+import { useContext } from "../../../engine/provider/ContextProvider";
+import styles from "./index.less";
 var FunctionDesign = function FunctionDesign(_ref) {
-  var children = _ref.children,
+  var _ref$rowKey = _ref.rowKey,
+    rowKey = _ref$rowKey === void 0 ? window.appConfig.constraintKeys.PRIMARY : _ref$rowKey,
+    children = _ref.children,
+    defaultExpandDeep = _ref.defaultExpandDeep,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Index, props, children);
+  var ctx = useContext();
+  var treeRef = useRef(null);
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    treeData = _useState2[0],
+    setTreeData = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    expandedKeys = _useState4[0],
+    setExpandedKeys = _useState4[1];
+  var handleDataSetChange = useMemoizedFn(function (onLdQuery) {
+    onLdQuery(props.asyncLoad ? _defineProperty({}, props.parentKey || 'iparentid', 0) : {});
+  });
+
+  // 默认展开层级
+  useEffect(function () {
+    if (defaultExpandDeep && treeData && treeData.length > 0) {
+      var defaultExpanded = transform(treeData, function (result, n) {
+        if (defaultExpandDeep === 'all' || n.sidcc.substring(1, n.sidcc.length - 1).split('/').length < Number(defaultExpandDeep) + 1) {
+          result.push("".concat(n[rowKey]));
+        }
+      }, []);
+      setExpandedKeys(defaultExpanded);
+    }
+  }, [defaultExpandDeep, treeData]);
+  useEffect(function () {
+    ctx.$publisher(ctx.topics.COMPONENT_REPOSITIONING, {
+      id: props.id
+    });
+  }, [expandedKeys]);
+  return /*#__PURE__*/React.createElement(Index, _extends({}, props, {
+    ref: treeRef,
+    afterQuery: function afterQuery(_ref3) {
+      var code = _ref3.code,
+        list = _ref3.list,
+        detail = _ref3.detail;
+      if (code === 1) setTreeData(list.map(function (i) {
+        return detail[i];
+      }));
+    },
+    expandedKeys: expandedKeys,
+    rowKey: rowKey,
+    defaultExpandDeep: defaultExpandDeep,
+    motion: null // 关闭动画
+    ,
+    className: styles['runtime-tree'],
+    draggable: false,
+    suppressInit: true,
+    onDataSetChange: handleDataSetChange
+  }), children);
 };
 export default FunctionDesign;

package/es/lowcode/view/lc-components/Tree/FunctionPreview.js

@@ -0,0 +1,26 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["children"];
+import React from 'react';
+import { useMemoizedFn, useCreation } from 'ahooks';
+import Index from "./index";
+var FunctionPreview = function FunctionPreview(_ref) {
+  var children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var onLoadData = useMemoizedFn(function (treeNode) {
+    return new Promise(function (resolve) {
+      if (treeNode.props.children) {
+        setTimeout(function () {
+          resolve();
+        }, 200);
+      }
+    });
+  });
+  var asyncLoadSim = useCreation(function () {
+    return props.asyncLoad ? {
+      loadData: onLoadData
+    } : {};
+  }, props.asyncLoad);
+  return /*#__PURE__*/React.createElement(Index, _extends({}, props, asyncLoadSim), children);
+};
+export default FunctionPreview;

package/es/lowcode/view/lc-components/Tree/index.js

@@ -1,20 +1,335 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["id"];
-import React, { useRef } from 'react';
-import { useMemoizedFn } from 'ahooks';
+var _excluded = ["id", "wrapperRef", "className", "dataset", "width", "height", "showLine", "defaultExpandDeep", "actions", "editable", "showRootAdd", "rootAddSetting", "doubleClickExpand", "onDoubleClick", "treeNodeCheckable", "treeNodeDisableCheckbox", "treeNodeDisable", "onTreeNodeRender", "treeNodeIcon", "advance"];
+import React, { useRef, useImperativeHandle, forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import { useMemoizedFn, useCreation } from 'ahooks';
+import classNames from 'classnames';
+import { isNil } from 'lodash';
+import { IconFont } from '@luck-design-biz/base';
+import { suid } from '@luck-design-biz/base/utils';
+import { useContext } from "../../../engine/provider/ContextProvider";
 import Wrapper from "../Wrapper";
+import { LdTree } from "../../../../index";
+import { omitBadProps, executeCode } from "../../../engine/tools/helper";
+import defaultMeta from "../../../engine/meta/tree.props.default.json";
+import styles from "./index.less";
 var LCTree = function LCTree(_ref) {
   var id = _ref.id,
+    wrapperRef = _ref.wrapperRef,
+    className = _ref.className,
+    dataset = _ref.dataset,
+    width = _ref.width,
+    height = _ref.height,
+    showLine = _ref.showLine,
+    defaultExpandDeep = _ref.defaultExpandDeep,
+    actions = _ref.actions,
+    editable = _ref.editable,
+    showRootAdd = _ref.showRootAdd,
+    rootAddSetting = _ref.rootAddSetting,
+    doubleClickExpand = _ref.doubleClickExpand,
+    onDoubleClick = _ref.onDoubleClick,
+    _treeNodeCheckable = _ref.treeNodeCheckable,
+    _treeNodeDisableCheckbox = _ref.treeNodeDisableCheckbox,
+    _treeNodeDisable = _ref.treeNodeDisable,
+    onTreeNodeRender = _ref.onTreeNodeRender,
+    _treeNodeIcon = _ref.treeNodeIcon,
+    advance = _ref.advance,
     props = _objectWithoutProperties(_ref, _excluded);
-  var ref = useRef();
+  var ctx = useContext();
+  var boxRef = useRef();
+  var treeRef = useRef();
   var getTargetDom = useMemoizedFn(function () {
-    return ref.current;
+    return boxRef.current;
+  });
+  useImperativeHandle(wrapperRef, function () {
+    return treeRef.current;
+  });
+  var handleMount = useMemoizedFn(function (params) {
+    ctx.doAction(advance.events.onMount, {
+      params: params
+    });
+  });
+  var handleUnmount = useMemoizedFn(function () {
+    ctx.doAction(advance.events.onUnmount);
+  });
+  var handleProcessDataSource = useMemoizedFn(function (data) {
+    ctx.doAction(advance.events.processDataSource, {
+      data: data
+    });
+  });
+  var handleNodeDoubleClick = useMemoizedFn(function (e, rowData) {
+    ctx.doAction(advance.events.onDoubleClick, {
+      e: e,
+      rowData: rowData
+    });
+  });
+  var handleCheck = useMemoizedFn(function (checkedKeys, e) {
+    ctx.doAction(advance.events.onCheck, {
+      checkedKeys: checkedKeys,
+      e: e
+    });
+  });
+  var events = useCreation(function () {
+    if (advance !== null && advance !== void 0 && advance.events) {
+      var _events = {};
+      if (advance.events.onMount) _events.onMount = handleMount;
+      if (advance.events.onUnmount) _events.onUnmount = handleUnmount;
+      if (advance.events.processDataSource) _events.dataToTreeFormat = handleProcessDataSource;
+      if (advance.events.onDoubleClick) _events.onNodeDoubleClick = handleNodeDoubleClick;
+      if (advance.events.onCheck) _events.onCheck = handleCheck;
+      return _events;
+    }
+    return {};
+  }, [advance === null || advance === void 0 ? void 0 : advance.events]);
+  var handleDrop = useMemoizedFn(function (info, dragInfo) {
+    if (dragInfo !== false) {
+      // ctx.doAction(advance.events.onDoubleClick, { e, rowData });
+      // doAction('drag', {
+      //   get: { datasetCode: dataSetKey },
+      //   post: {
+      //     fromId: info.dragNode.props.dataRef[PRIMARY],
+      //     toId: info.node.props.dataRef[PRIMARY],
+      //   }
+      // }, {
+      //   showConfirm: false,
+      //   callback: (success) => success && onLdQuery()
+      // });
+    }
   });
   return /*#__PURE__*/React.createElement(Wrapper, {
     id: id,
+    displayName: "Tree",
     getTargetDom: getTargetDom
   }, /*#__PURE__*/React.createElement("div", {
-    ref: ref
-  }, "LCTree"));
+    ref: boxRef,
+    style: {
+      width: width,
+      height: height
+    }
+  }, /*#__PURE__*/React.createElement(LdTree, _extends({
+    width: "100%",
+    height: "100%",
+    id: id,
+    ldId: id,
+    ref: treeRef,
+    className: classNames(styles['lc-component-tree'], _defineProperty({}, className, !!className)),
+    dataSetKey: dataset === null || dataset === void 0 ? void 0 : dataset.code,
+    showLine: showLine,
+    readOnly: !editable,
+    defaultExpandDeep: defaultExpandDeep === 'all' ? defaultExpandDeep : Number(defaultExpandDeep),
+    rootAdd: showRootAdd ? {
+      resource: rootAddSetting.serial,
+      onClick: function onClick() {
+        return ctx.doAction(rootAddSetting.actionPool);
+      }
+    } : null,
+    rightMenus: function rightMenus() {
+      return actions.todoList.map(function (action) {
+        return {
+          key: suid(),
+          name: action.name,
+          onClick: function onClick(_, data) {
+            ctx.doAction(action.actionPool, {
+              data: data
+            });
+          },
+          resource: action.serial,
+          style: action.riskLevel === 'default' ? null : {
+            color: {
+              danger: '#ff7875',
+              destroy: '#ff4d4f'
+            }[action.riskLevel]
+          }
+        };
+      });
+    },
+    doubleClickExpand: doubleClickExpand,
+    treeNodeCheckable: function treeNodeCheckable(i) {
+      if (isNil(_treeNodeCheckable)) return props.checkable;
+      return executeCode(ctx, _treeNodeCheckable, ['item'], i);
+    },
+    treeNodeDisableCheckbox: function treeNodeDisableCheckbox(i) {
+      if (isNil(_treeNodeDisableCheckbox)) return false;
+      return executeCode(ctx, _treeNodeDisableCheckbox, ['item'], i);
+    },
+    treeNodeDisable: function treeNodeDisable(i) {
+      if (isNil(_treeNodeDisable)) return false;
+      return executeCode(ctx, _treeNodeDisable, ['item'], i);
+    },
+    treeNodeIcon: function treeNodeIcon(node) {
+      if (!_treeNodeIcon || _treeNodeIcon.length === 0) return null;
+      var icon = null;
+      _treeNodeIcon.forEach(function (i) {
+        if (i.condition && executeCode(ctx, i.condition, ['item'], node)) {
+          icon = i.icon;
+        }
+      });
+      return icon ? /*#__PURE__*/React.createElement(IconFont, {
+        type: icon
+      }) : false;
+    },
+    onTreeNodeRender: onTreeNodeRender ? function (title, i) {
+      return executeCode(ctx, onTreeNodeRender, ['title', 'item'], title, i);
+    } : null,
+    onDrop: handleDrop
+  }, events, props))));
+};
+LCTree.propTypes = {
+  /**
+   * @name 唯一标识
+   * @type string
+   * @disabled true
+   */
+  id: PropTypes.string.isRequired,
+  /**
+   * @name 数据集
+   * @type _DataSetSelector
+   */
+  dataset: PropTypes.shape({
+    code: PropTypes.string.isRequired,
+    uid: PropTypes.string.isRequired
+  }),
+  /**
+   * @name 标题
+   * @type string
+   * @disabled true
+   */
+  title: PropTypes.string,
+  /**
+   * @name 是否只读
+   * @type boolean
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * @name 支持拖拽
+   * @type boolean
+   */
+  draggable: PropTypes.bool,
+  /**
+   * @name 异步加载
+   * @type boolean
+   */
+  asyncLoad: PropTypes.bool,
+  /**
+   * @name 异步加载Key
+   * @type string
+   */
+  iparentid: PropTypes.string,
+  /**
+   * @name 宽度
+   * @type string
+   */
+  width: PropTypes.string,
+  /**
+   * @name 高度
+   * @type string
+   */
+  height: PropTypes.string,
+  /**
+   * @name 显示线
+   * @type bool
+   */
+  showLine: PropTypes.bool,
+  /**
+   * @name 展示字段
+   * @type string
+   */
+  treeNodeTitle: PropTypes.string,
+  /**
+   * @name 展示字段
+   * @type string
+   */
+  defaultExpandDeep: PropTypes.string,
+  /**
+   * @name 显示图标
+   * @type bool
+   */
+  showIcon: PropTypes.bool,
+  /**
+   * @name 节点图标设置
+   * @type array
+   */
+  treeNodeIcon: PropTypes.array,
+  /**
+   * @name 是否显示根节点
+   * @type bool
+   */
+  showRootAdd: PropTypes.bool,
+  /**
+   * @name 根节点配置
+   * @type object
+   */
+  rootAddSetting: PropTypes.object,
+  /**
+   * @name 节点操作项
+   * @type object
+   */
+  actions: PropTypes.object,
+  /**
+   * @name 双击收缩节点
+   * @type bool
+   */
+  doubleClickExpand: PropTypes.bool,
+  /**
+   * @name 复选框
+   * @type bool
+   */
+  checkable: PropTypes.bool,
+  /**
+   * @name 节点是否有复选框
+   * @type _JSEditor
+   * @default "function treeNodeCheckable(item) { \n return true; \n}"
+   */
+  treeNodeCheckable: PropTypes.string,
+  /**
+   * @name 节点复选框是否禁用
+   * @type _JSEditor
+   * @default "function treeNodeDisableCheckbox(item) { \n return false; \n}"
+   */
+  treeNodeDisableCheckbox: PropTypes.string,
+  /**
+   * @name 节点是否禁用
+   * @type _JSEditor
+   * @default "function treeNodeDisable(item) { \n return false; \n}"
+   */
+  treeNodeDisable: PropTypes.string,
+  /**
+   * @name 节点定制渲染
+   * @type _JSEditor
+   * @default "function onTreeNodeRender(title, item) { \n return title; \n}"
+   */
+  onTreeNodeRender: PropTypes.string,
+  /**
+   * @name 组件首次渲染时
+   * @type _JSEditor
+   */
+  onMount: PropTypes.string,
+  /**
+   * @name 组件卸载时
+   * @type _JSEditor
+   */
+  onUnmount: PropTypes.string,
+  /**
+   * @name 数据预处理
+   * @type _JSEditor
+   */
+  processDataSource: PropTypes.string,
+  /**
+   * @name 双击事件
+   * @type _JSEditor
+   */
+  onDoubleClick: PropTypes.string,
+  /**
+   * @name 复选框选择事件
+   * @type _JSEditor
+   */
+  onCheck: PropTypes.string
 };
-export default LCTree;
+LCTree.defaultProps = omitBadProps(defaultMeta);
+export default /*#__PURE__*/forwardRef(function (props, ref) {
+  return /*#__PURE__*/React.createElement(LCTree, _extends({
+    wrapperRef: ref
+  }, props));
+});

package/es/lowcode/view/lc-components/Tree/index.less

@@ -0,0 +1,5 @@
+.lc-component-tree{
+}
+.lc-component-tree.runtime-tree {
+  
+}