vxe-pc-ui 4.14.26 → 4.14.27

package/lib/index.umd.js

@@ -4646,7 +4646,7 @@ function checkDynamic() {
 }
 ;// ./packages/ui/src/log.ts
 
-const log_version = `ui v${"4.14.26"}`;
+const log_version = `ui v${"4.14.27"}`;
 const warnLog = log.create('warn', log_version);
 const errLog = log.create('error', log_version);
 ;// ./packages/ui/index.ts
@@ -4654,7 +4654,7 @@ const errLog = log.create('error', log_version);
 
 
 
-const ui_version = "4.14.26";
+const ui_version = "4.14.27";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -25980,6 +25980,181 @@ function renderItemContent($xeForm, item) {
     class: 'vxe-form--item-inner'
   }, contentVNs);
 }
+;// ./packages/form/src/form-item.ts
+
+
+
+
+
+
+
+const formItemProps = {
+  title: String,
+  field: String,
+  span: {
+    type: [String, Number],
+    default: null
+  },
+  align: {
+    type: String,
+    default: null
+  },
+  verticalAlign: {
+    type: String,
+    default: null
+  },
+  titleBackground: {
+    type: Boolean,
+    default: null
+  },
+  titleBold: {
+    type: Boolean,
+    default: null
+  },
+  titleAlign: {
+    type: String,
+    default: null
+  },
+  titleWidth: {
+    type: [String, Number],
+    default: null
+  },
+  titleColon: {
+    type: Boolean,
+    default: null
+  },
+  titleAsterisk: {
+    type: Boolean,
+    default: null
+  },
+  showTitle: {
+    type: Boolean,
+    default: true
+  },
+  vertical: {
+    type: Boolean,
+    default: null
+  },
+  padding: {
+    type: Boolean,
+    default: null
+  },
+  formatter: [String, Function],
+  className: [String, Function],
+  contentClassName: [String, Function],
+  contentStyle: [Object, Function],
+  titleClassName: [String, Function],
+  titleStyle: [Object, Function],
+  titleOverflow: {
+    type: [Boolean, String],
+    default: null
+  },
+  titlePrefix: Object,
+  titleSuffix: Object,
+  resetValue: {
+    default: null
+  },
+  visibleMethod: Function,
+  visible: {
+    type: Boolean,
+    default: null
+  },
+  showContent: {
+    type: Boolean,
+    default: null
+  },
+  folding: Boolean,
+  collapseNode: Boolean,
+  itemRender: Object,
+  rules: Array,
+  params: Object
+};
+/* harmony default export */ var form_item = (defineVxeComponent({
+  name: 'VxeFormItem',
+  props: formItemProps,
+  setup(props, {
+    slots
+  }) {
+    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
+    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const $xeForm = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeForm', {});
+    const $xeFormGroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeFormGroup', null);
+    const formItem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(createItem($xeForm, props));
+    formItem.slots = slots;
+    const formItemInfo = {
+      itemConfig: formItem
+    };
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeFormItemInfo', formItemInfo);
+    const renderItem = ($xeForm, item) => {
+      const formProps = $xeForm.props;
+      const $xeGrid = $xeForm.xeGrid;
+      const {
+        data,
+        readonly,
+        disabled
+      } = formProps;
+      const {
+        visible,
+        field,
+        itemRender,
+        contentStyle,
+        showContent
+      } = item;
+      const compConf = isEnableConf(itemRender) ? renderer.get(itemRender.name) : null;
+      const itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
+      const itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
+      const params = {
+        data,
+        disabled,
+        readonly,
+        field,
+        property: field,
+        item,
+        $form: $xeForm,
+        $grid: $xeGrid
+      };
+      if (visible === false) {
+        return renderEmptyElement($xeFormItem);
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refElem,
+        key: item.id,
+        itemid: item.id,
+        class: getItemClass($xeForm, item),
+        style: external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(itemStyle) ? itemStyle(params) : itemStyle
+      }, [renderTitle($xeForm, item), showContent === false ? renderEmptyElement($xeFormItem) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: getItemContentClass($xeForm, item),
+        style: Object.assign({}, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(contentStyle) ? contentStyle(params) : contentStyle)
+      }, [renderItemContent($xeForm, item), renderItemErrorIcon($xeForm, item)])]);
+    };
+    const renderVN = () => {
+      const customLayout = $xeForm ? $xeForm.props.customLayout : false;
+      const item = formItem;
+      return customLayout ? renderItem($xeForm, item) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refElem
+      });
+    };
+    const $xeFormItem = {
+      xID,
+      formItem,
+      renderVN
+    };
+    watchItem(props, formItem);
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
+      const elem = refElem.value;
+      assembleItem($xeForm, elem, formItem, $xeFormGroup);
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
+      destroyItem($xeForm, formItem);
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeFormItem', $xeFormItem);
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeFormGroup', null);
+    return $xeFormItem;
+  },
+  render() {
+    return this.renderVN();
+  }
+}));
 ;// ./packages/form/src/form-config-item.ts
 
 
@@ -25989,10 +26164,12 @@ function renderItemContent($xeForm, item) {
 
 
 
+
 const VxeFormConfigItem = defineVxeComponent({
   name: 'VxeFormConfigItem',
   props: {
-    itemConfig: Object
+    itemConfig: Object,
+    ...formItemProps
   },
   setup(props) {
     const $xeForm = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeForm', {});
@@ -26000,6 +26177,12 @@ const VxeFormConfigItem = defineVxeComponent({
       itemConfig: props.itemConfig
     };
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeFormItemInfo', xeformiteminfo);
+    const computeItemVisible = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        visible
+      } = props.itemConfig;
+      return visible;
+    });
     const renderItem = ($xeForm, item) => {
       const formProps = $xeForm.props;
       const $xeGrid = $xeForm.xeGrid;
@@ -26009,13 +26192,13 @@ const VxeFormConfigItem = defineVxeComponent({
         disabled
       } = formProps;
       const {
-        visible,
         field,
         itemRender,
         contentStyle,
         children,
         showContent
       } = item;
+      const itemVisible = computeItemVisible.value;
       const compConf = isEnableConf(itemRender) ? renderer.get(itemRender.name) : null;
       const itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
       const itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
@@ -26030,7 +26213,7 @@ const VxeFormConfigItem = defineVxeComponent({
         $grid: $xeGrid
       };
       const hasGroup = children && children.length > 0;
-      if (visible === false) {
+      if (itemVisible === false) {
         return renderEmptyElement($xeForm);
       }
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
@@ -26882,6 +27065,14 @@ function checkRuleStatus(rule, data, val) {
   }
   return true;
 }
+function form_createReactData() {
+  return {
+    collapseAll: false,
+    staticItems: [],
+    formItems: [],
+    itemWidth: 0
+  };
+}
 function form_createInternalData() {
   return {
     meTimeout: undefined,
@@ -26890,7 +27081,9 @@ function form_createInternalData() {
       item: null,
       visible: false
     },
-    itemFormatCache: {}
+    itemFormatCache: {},
+    fullItemIdData: {},
+    fullItemFieldData: {}
   };
 }
 /* harmony default export */ var src_form = (defineVxeComponent({
@@ -26987,12 +27180,7 @@ function form_createInternalData() {
     const {
       computeSize
     } = useSize(props);
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({
-      collapseAll: props.collapseStatus,
-      staticItems: [],
-      formItems: [],
-      itemWidth: 0
-    });
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(form_createReactData());
     const internalData = form_createInternalData();
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTooltip = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -27065,7 +27253,7 @@ function form_createInternalData() {
       }
       return [];
     };
-    const loadItem = list => {
+    const loadItems = list => {
       if (list.length) {
         list.forEach(item => {
           if (item.slots) {
@@ -27097,10 +27285,11 @@ function form_createInternalData() {
       return itemList;
     };
     const getItemByField = field => {
-      const rest = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(reactData.formItems, item => item.field === field, {
-        children: 'children'
-      });
-      return rest ? rest.item : null;
+      const {
+        fullItemFieldData
+      } = internalData;
+      const itemRest = fullItemFieldData[field];
+      return itemRest ? itemRest.item : null;
     };
     const getCollapseStatus = () => {
       return reactData.collapseAll;
@@ -27179,6 +27368,34 @@ function form_createInternalData() {
       }
       return resetValue;
     };
+    const cacheItem = () => {
+      const {
+        formItems
+      } = reactData;
+      const itemIdData = {};
+      const itemFieldData = {};
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(formItems, (item, index, items) => {
+        const {
+          id,
+          field
+        } = item;
+        const itemRest = {
+          item,
+          items,
+          index
+        };
+        if (id) {
+          itemIdData[id] = itemRest;
+        }
+        if (field) {
+          itemFieldData[field] = itemRest;
+        }
+      }, {
+        children: 'children'
+      });
+      internalData.fullItemFieldData = itemFieldData;
+      internalData.fullItemIdData = itemIdData;
+    };
     const reset = () => {
       const {
         data
@@ -27613,6 +27830,18 @@ function form_createInternalData() {
     const handleGlobalResizeEvent = () => {
       recalculate();
     };
+    const handleItemVisible = visible => {
+      return function (fieldOrItems) {
+        const objs = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(fieldOrItems) ? fieldOrItems : [fieldOrItems];
+        objs.forEach(obj => {
+          const item = handleFieldOrItem($xeForm, obj);
+          if (item) {
+            item.visible = visible;
+          }
+        });
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+      };
+    };
     formMethods = {
       dispatchEvent(type, params, evnt) {
         emit(type, createEvent(evnt, {
@@ -27620,6 +27849,9 @@ function form_createInternalData() {
           $grid: $xeGrid
         }, params));
       },
+      loadItems,
+      showItem: handleItemVisible(true),
+      hideItem: handleItemVisible(false),
       reset,
       validate,
       validateField,
@@ -27679,11 +27911,11 @@ function form_createInternalData() {
       }, customLayout ? defaultSlot ? defaultSlot({}) : [] : formItems.map((item, index) => {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(form_config_item, {
           key: index,
-          itemConfig: item
+          itemConfig: item,
+          visible: item.visible
         });
       })), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-form-slots',
-        ref: 'hideItem'
+        class: 'vxe-form-slots'
       }, customLayout ? [] : defaultSlot ? defaultSlot({}) : []),
       /**
        * 加载中
@@ -27722,6 +27954,7 @@ function form_createInternalData() {
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(staticItemFlag, () => {
       reactData.formItems = reactData.staticItems;
       recalcFlag.value++;
+      cacheItem();
     });
     const itemFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.items ? props.items.length : -1, () => {
@@ -27731,7 +27964,7 @@ function form_createInternalData() {
       itemFlag.value++;
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(itemFlag, () => {
-      loadItem(props.items || []);
+      loadItems(props.items || []);
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.collapseStatus, value => {
       reactData.collapseAll = !!value;
@@ -27754,8 +27987,9 @@ function form_createInternalData() {
       globalEvents.off($xeForm, 'resize');
       external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, form_createInternalData());
     });
+    reactData.collapseAll = !!props.collapseStatus;
     if (props.items) {
-      loadItem(props.items);
+      loadItems(props.items);
     }
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeFormItemInfo', null);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeForm', $xeForm);
@@ -27781,181 +28015,6 @@ dynamicApp.use(VxeForm);
 VxeUI.component(src_form);
 const Form = VxeForm;
 /* harmony default export */ var packages_form = (VxeForm);
-;// ./packages/form/src/form-item.ts
-
-
-
-
-
-
-
-const formItemProps = {
-  title: String,
-  field: String,
-  span: {
-    type: [String, Number],
-    default: null
-  },
-  align: {
-    type: String,
-    default: null
-  },
-  verticalAlign: {
-    type: String,
-    default: null
-  },
-  titleBackground: {
-    type: Boolean,
-    default: null
-  },
-  titleBold: {
-    type: Boolean,
-    default: null
-  },
-  titleAlign: {
-    type: String,
-    default: null
-  },
-  titleWidth: {
-    type: [String, Number],
-    default: null
-  },
-  titleColon: {
-    type: Boolean,
-    default: null
-  },
-  titleAsterisk: {
-    type: Boolean,
-    default: null
-  },
-  showTitle: {
-    type: Boolean,
-    default: true
-  },
-  vertical: {
-    type: Boolean,
-    default: null
-  },
-  padding: {
-    type: Boolean,
-    default: null
-  },
-  formatter: [String, Function],
-  className: [String, Function],
-  contentClassName: [String, Function],
-  contentStyle: [Object, Function],
-  titleClassName: [String, Function],
-  titleStyle: [Object, Function],
-  titleOverflow: {
-    type: [Boolean, String],
-    default: null
-  },
-  titlePrefix: Object,
-  titleSuffix: Object,
-  resetValue: {
-    default: null
-  },
-  visibleMethod: Function,
-  visible: {
-    type: Boolean,
-    default: null
-  },
-  showContent: {
-    type: Boolean,
-    default: null
-  },
-  folding: Boolean,
-  collapseNode: Boolean,
-  itemRender: Object,
-  rules: Array,
-  params: Object
-};
-/* harmony default export */ var form_item = (defineVxeComponent({
-  name: 'VxeFormItem',
-  props: formItemProps,
-  setup(props, {
-    slots
-  }) {
-    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
-    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const $xeForm = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeForm', {});
-    const $xeFormGroup = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.inject)('$xeFormGroup', null);
-    const formItem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(createItem($xeForm, props));
-    formItem.slots = slots;
-    const formItemInfo = {
-      itemConfig: formItem
-    };
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('xeFormItemInfo', formItemInfo);
-    const renderItem = ($xeForm, item) => {
-      const formProps = $xeForm.props;
-      const $xeGrid = $xeForm.xeGrid;
-      const {
-        data,
-        readonly,
-        disabled
-      } = formProps;
-      const {
-        visible,
-        field,
-        itemRender,
-        contentStyle,
-        showContent
-      } = item;
-      const compConf = isEnableConf(itemRender) ? renderer.get(itemRender.name) : null;
-      const itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
-      const itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
-      const params = {
-        data,
-        disabled,
-        readonly,
-        field,
-        property: field,
-        item,
-        $form: $xeForm,
-        $grid: $xeGrid
-      };
-      if (visible === false) {
-        return renderEmptyElement($xeFormItem);
-      }
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        ref: refElem,
-        key: item.id,
-        itemid: item.id,
-        class: getItemClass($xeForm, item),
-        style: external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(itemStyle) ? itemStyle(params) : itemStyle
-      }, [renderTitle($xeForm, item), showContent === false ? renderEmptyElement($xeFormItem) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: getItemContentClass($xeForm, item),
-        style: Object.assign({}, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(contentStyle) ? contentStyle(params) : contentStyle)
-      }, [renderItemContent($xeForm, item), renderItemErrorIcon($xeForm, item)])]);
-    };
-    const renderVN = () => {
-      const customLayout = $xeForm ? $xeForm.props.customLayout : false;
-      const item = formItem;
-      return customLayout ? renderItem($xeForm, item) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        ref: refElem
-      });
-    };
-    const $xeFormItem = {
-      xID,
-      formItem,
-      renderVN
-    };
-    watchItem(props, formItem);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
-      const elem = refElem.value;
-      assembleItem($xeForm, elem, formItem, $xeFormGroup);
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
-      destroyItem($xeForm, formItem);
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeFormItem', $xeFormItem);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeFormGroup', null);
-    return $xeFormItem;
-  },
-  render() {
-    return this.renderVN();
-  }
-}));
 ;// ./packages/form/src/form-group.ts