@ibiz-template/mob-vue3-components 0.7.41-alpha.19-lts.1 → 0.7.41-alpha.21

package/es/control/list/list/list.mjs

@@ -1,13 +1,11 @@
-import { isVNode, defineComponent, createVNode, resolveComponent, ref } from 'vue';
+import { defineComponent, createVNode, resolveComponent } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import { ListController } from '@ibiz-template/runtime';
-import { useListRender } from '../list-render-util.mjs';
 import './list.css';
+import '../../../util/index.mjs';
+import { useListRender } from '../../../util/list-util/list-render-util.mjs';
 
 "use strict";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
 const ListControl = /* @__PURE__ */ defineComponent({
   name: "IBizListControl",
   props: {
@@ -90,138 +88,40 @@ const ListControl = /* @__PURE__ */ defineComponent({
   },
   setup(props) {
     const c = useControlController((...args) => new ListController(...args));
-    const ns = useNamespace(`control-${c.model.controlType.toLowerCase()}`);
-    const ns2 = useNamespace(`control-mobmdctrl`);
+    const ns = useNamespace(`control-mobmdctrl`);
     const {
       renderItem,
       renderNoData,
-      renderLoadMore
-    } = useListRender(props, c, ns2);
-    const showPicker = ref(false);
-    const openReviewList = () => {
-      showPicker.value = true;
-    };
-    const renderDefaultItem = (item) => {
-      const findIndex = c.state.selectedData.findIndex((data) => {
-        return data.srfkey === item.srfkey;
-      });
-      const itemClass = [ns.b("item"), ns.is("active", findIndex !== -1)];
-      const itemStyle = {
-        flexBasis: `${100 / props.columnsCount}%`
-      };
-      return createVNode("div", {
-        "class": itemClass,
-        "key": item.srfkey,
-        "style": itemStyle
-      }, [createVNode(resolveComponent("van-tag"), {
-        "onClick": () => c.onRowClick(item),
-        "class": ns.e("tag"),
-        "onDblclick": () => c.onDbRowClick(item),
-        "closeable": true,
-        "plain": true,
-        "size": "large",
-        "type": "primary",
-        "onClose": () => c.setActive(item)
-      }, {
-        default: () => [createVNode("span", {
-          "class": ns.e("item-text")
-        }, [item.srfmajortext || ""])]
-      })]);
-    };
-    const renderReViewDefaultItem = (item) => {
-      const findIndex = c.state.selectedData.findIndex((data) => {
-        return data.srfkey === item.srfkey;
-      });
-      const itemClass = [ns.b("item"), ns.is("active", findIndex !== -1)];
-      return createVNode("div", {
-        "class": itemClass,
-        "key": item.srfkey
-      }, [createVNode(resolveComponent("van-cell"), {
-        "class": itemClass,
-        "is-link": true,
-        "title": item.srfmajortext || ""
-      }, {
-        "right-icon": () => {
-          return createVNode(resolveComponent("van-icon"), {
-            "class": ns.e("item-icon"),
-            "onClick": () => c.setActive(item),
-            "name": "delete-o"
-          }, null);
-        }
-      })]);
-    };
-    const renderExpand = () => {
-      const itemClass = [ns.b("item"), ns.b("item-expand")];
-      return createVNode("div", {
-        "class": itemClass,
-        "onClick": openReviewList
-      }, [ibiz.i18n.t("control.list.expand")]);
-    };
-    const renderListContent = () => {
-      return c.state.items.map((item, index) => {
-        if (index === props.rowsCount * props.columnsCount - 1) {
-          return renderExpand();
-        }
-        if (index > props.rowsCount * props.columnsCount - 1) {
-          return null;
-        }
-        return renderDefaultItem(item);
-      });
-    };
-    const renderReViewListContent = () => {
-      if (c.state.items.length === 0) {
-        return renderNoData();
-      }
-      return c.state.items.map((item) => {
-        return renderReViewDefaultItem(item);
-      });
-    };
-    const renderReviewList = () => {
-      return createVNode(resolveComponent("van-popup"), {
-        "round": true,
-        "close-on-popstate": true,
-        "position": "bottom",
-        "teleport": "body",
-        "show": showPicker.value,
-        "onUpdate:show": ($event) => showPicker.value = $event,
-        "class": ns.b("popup")
-      }, {
-        default: () => [createVNode("div", {
-          "class": ns.b("popup-container")
-        }, [createVNode("div", {
-          "class": ns.b("popup-header")
-        }, [createVNode("div", null, [ibiz.i18n.t("control.list.selectedData")])]), createVNode("div", {
-          "class": ns.b("popup-content")
-        }, [renderReViewListContent()])])]
-      });
-    };
-    const renderDefaultList = () => {
-      let _slot;
-      return createVNode(resolveComponent("van-list"), {
-        "finished": c.state.total <= c.state.items.length
-      }, _isSlot(_slot = c.state.items.map((item) => {
+      renderAddItem,
+      renderScrollList
+    } = useListRender(props, c, ns);
+    const renderDefault = () => {
+      const result = [];
+      result.push(...c.state.items.map((item) => {
         return renderItem(item);
-      })) ? _slot : {
-        default: () => [_slot]
-      });
+      }));
+      if (c.enableNew) {
+        result.push(renderAddItem());
+      }
+      return result;
     };
-    const renderSelectList = () => {
-      return [renderListContent(), renderReviewList(), renderLoadMore()];
+    const renderMDContent = () => {
+      const slots = renderDefault();
+      return renderScrollList(slots);
     };
     return {
       c,
       ns,
-      ns2,
-      renderSelectList,
-      renderDefaultList
+      renderMDContent,
+      renderNoData
     };
   },
   render() {
     return createVNode(resolveComponent("iBizControlBase"), {
       "controller": this.c,
-      "class": (this.ns.b(this.c.model.name), this.ns2.b())
+      "class": this.ns.b()
     }, {
-      default: () => [this.c.state.isCreated && this.mode === "LIST" ? this.renderDefaultList() : this.renderSelectList()]
+      default: () => [this.c.state.isCreated && (this.c.state.items.length > 0 ? this.renderMDContent() : this.renderNoData())]
     });
   }
 });

package/es/control/list/md-ctrl/md-ctrl.css

@@ -1 +1 @@
-.ibiz-control-mobmdctrl{--ibiz-control-mobmdctrl-text-color:var(--ibiz-color-text-0);--ibiz-control-mobmdctrl-hover-bg-color:var(--ibiz-color-primary);--ibiz-control-mobmdctrl-active-bg-color:#d1d1d5;--ibiz-control-mobmdctrl-active-color:var(--ibiz-color-bg-1);--ibiz-control-mobmdctrl-img-width:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-img-radius:var(--ibiz-border-radius-extra-small);--ibiz-control-mobmdctrl-padding:var(--ibiz-spacing-base) 0 var(--ibiz-spacing-base) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-font:var(--ibiz-font-size-regular);--ibiz-control-mobmdctrl-icon-color:#a0a5aa;--ibiz-control-mobmdctrl-group-caption-color:#9a9b9f;--ibiz-control-mobmdctrl-load-more-font-size:var(--ibiz-font-size-small);--ibiz-control-mobmdctrl-font-size:var(--ibiz-font-size-header-5);--ibiz-control-mobmdctrl-right-icon-margin-right:1.3125rem;--ibiz-control-mobmdctrl-simplelist-height:250px;--ibiz-control-mobmdctrl-select-item-padding-bottom:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-margin:var(--ibiz-spacing-tight) 0 0 var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-check-padding:var(--ibiz-spacing-extra-tight);--ibiz-control-mobmdctrl-select-item-gap:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-pagination-height:var(--van-pagination-height)}.ibiz-control-mobmdctrl .ibiz-panel-container{--ibiz-panel-scroll:hidden}.ibiz-control-mobmdctrl{--van-cell-font-size:var(--ibiz-control-mobmdctrl-font-size);height:100%;overflow:var(--ibiz-control-overflow)}.ibiz-control-mobmdctrl__content{width:100%;height:99%}.ibiz-control-mobmdctrl__content .van-cell{padding:var(--ibiz-control-mobmdctrl-padding)}.ibiz-control-mobmdctrl__content.is-show-underLine .ibiz-control-mobmdctrl-item+.ibiz-control-mobmdctrl-item::before{position:relative;top:-.875rem;left:1rem;display:block;width:calc(100% - 2rem);height:.0625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-control-mobmdctrl__content.is-show-underLine .ibiz-control-mobmdctrl-item.van-cell::before{display:none}.ibiz-control-mobmdctrl__content.is-show-underLine .van-swipe-cell+.van-swipe-cell .van-swipe-cell__wrapper::before{position:relative;top:.0625rem;left:1rem;display:block;width:calc(100% - 2rem);height:.0625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-control-mobmdctrl__setting{position:absolute;right:var(--ibiz-spacing-tight);z-index:1}.ibiz-control-mobmdctrl.is-enable-page .ibiz-control-mobmdctrl__content{height:calc(100% - var(--ibiz-control-mobmdctrl-pagination-height))}.ibiz-control-mobmdctrl .van-cell__right-icon{margin-right:var(--ibiz-control-mobmdctrl-right-icon-margin-right);color:var(--ibiz-control-mobmdctrl-icon-color)}.ibiz-control-mobmdctrl .van-cell--clickable:active{color:inherit}.ibiz-control-mobmdctrl .van-cell::after{width:100%}.ibiz-control-mobmdctrl-item{--ibiz-control-mobmdctrl-text-color:var(--ibiz-color-text-0);--ibiz-control-mobmdctrl-hover-bg-color:var(--ibiz-color-primary);--ibiz-control-mobmdctrl-active-bg-color:#d1d1d5;--ibiz-control-mobmdctrl-active-color:var(--ibiz-color-bg-1);--ibiz-control-mobmdctrl-img-width:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-img-radius:var(--ibiz-border-radius-extra-small);--ibiz-control-mobmdctrl-padding:var(--ibiz-spacing-base) 0 var(--ibiz-spacing-base) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-font:var(--ibiz-font-size-regular);--ibiz-control-mobmdctrl-icon-color:#a0a5aa;--ibiz-control-mobmdctrl-group-caption-color:#9a9b9f;--ibiz-control-mobmdctrl-load-more-font-size:var(--ibiz-font-size-small);--ibiz-control-mobmdctrl-font-size:var(--ibiz-font-size-header-5);--ibiz-control-mobmdctrl-right-icon-margin-right:1.3125rem;--ibiz-control-mobmdctrl-simplelist-height:250px;--ibiz-control-mobmdctrl-select-item-padding-bottom:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-margin:var(--ibiz-spacing-tight) 0 0 var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-check-padding:var(--ibiz-spacing-extra-tight);--ibiz-control-mobmdctrl-select-item-gap:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-pagination-height:var(--van-pagination-height);background-color:var(--ibiz-control-mobmdctrl-item-bg-color);color:var(--ibiz-control-mobmdctrl-item-font-color)}.ibiz-control-mobmdctrl-item:hover{background-color:var(--ibiz-control-mobmdctrl-item-hover-color)}.ibiz-control-mobmdctrl-item.is-active{background-color:var(--ibiz-control-mobmdctrl-item-active-color)}.ibiz-control-mobmdctrl-item--right{margin-right:var(--ibiz-control-mobmdctrl-right-icon-margin-right)}.ibiz-control-mobmdctrl-item{padding:.875rem 0}.ibiz-control-mobmdctrl-item.ibiz-control-panel{height:auto}.ibiz-control-mobmdctrl-image{--ibiz-control-mobmdctrl-text-color:var(--ibiz-color-text-0);--ibiz-control-mobmdctrl-hover-bg-color:var(--ibiz-color-primary);--ibiz-control-mobmdctrl-active-bg-color:#d1d1d5;--ibiz-control-mobmdctrl-active-color:var(--ibiz-color-bg-1);--ibiz-control-mobmdctrl-img-width:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-img-radius:var(--ibiz-border-radius-extra-small);--ibiz-control-mobmdctrl-padding:var(--ibiz-spacing-base) 0 var(--ibiz-spacing-base) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-font:var(--ibiz-font-size-regular);--ibiz-control-mobmdctrl-icon-color:#a0a5aa;--ibiz-control-mobmdctrl-group-caption-color:#9a9b9f;--ibiz-control-mobmdctrl-load-more-font-size:var(--ibiz-font-size-small);--ibiz-control-mobmdctrl-font-size:var(--ibiz-font-size-header-5);--ibiz-control-mobmdctrl-right-icon-margin-right:1.3125rem;--ibiz-control-mobmdctrl-simplelist-height:250px;--ibiz-control-mobmdctrl-select-item-padding-bottom:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-margin:var(--ibiz-spacing-tight) 0 0 var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-check-padding:var(--ibiz-spacing-extra-tight);--ibiz-control-mobmdctrl-select-item-gap:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-pagination-height:var(--van-pagination-height);width:var(--ibiz-control-mobmdctrl-img-width);margin-right:var(--ibiz-control-mobmdctrl-padding);border-radius:var(--ibiz-control-mobmdctrl-img-radius)}.ibiz-control-mobmdctrl-group-caption{--ibiz-control-mobmdctrl-text-color:var(--ibiz-color-text-0);--ibiz-control-mobmdctrl-hover-bg-color:var(--ibiz-color-primary);--ibiz-control-mobmdctrl-active-bg-color:#d1d1d5;--ibiz-control-mobmdctrl-active-color:var(--ibiz-color-bg-1);--ibiz-control-mobmdctrl-img-width:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-img-radius:var(--ibiz-border-radius-extra-small);--ibiz-control-mobmdctrl-padding:var(--ibiz-spacing-base) 0 var(--ibiz-spacing-base) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-group-font:var(--ibiz-font-size-regular);--ibiz-control-mobmdctrl-icon-color:#a0a5aa;--ibiz-control-mobmdctrl-group-caption-color:#9a9b9f;--ibiz-control-mobmdctrl-load-more-font-size:var(--ibiz-font-size-small);--ibiz-control-mobmdctrl-font-size:var(--ibiz-font-size-header-5);--ibiz-control-mobmdctrl-right-icon-margin-right:1.3125rem;--ibiz-control-mobmdctrl-simplelist-height:250px;--ibiz-control-mobmdctrl-select-item-padding-bottom:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-margin:var(--ibiz-spacing-tight) 0 0 var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-select-item-check-padding:var(--ibiz-spacing-extra-tight);--ibiz-control-mobmdctrl-select-item-gap:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-pagination-height:var(--van-pagination-height);padding:var(--ibiz-control-mobmdctrl-group-padding);font-size:var(--ibiz-control-mobmdctrl-group-font);color:var(--ibiz-control-mobmdctrl-group-caption-color)}.ibiz-control-mobmdctrl-load-more{display:flex;justify-content:center;padding:var(--ibiz-spacing-tight);font-size:var(--ibiz-control-mobmdctrl-load-more-font-size);color:var(--ibiz-color-text-2)}.ibiz-control-mobmdctrl-load-more span{padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-base);cursor:pointer;border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-full)}.ibiz-control-mobmdctrl-select-item{display:flex;gap:var(--ibiz-control-mobmdctrl-select-item-gap);padding-bottom:var(--ibiz-control-mobmdctrl-select-item-padding-bottom);margin:var(--ibiz-control-mobmdctrl-select-item-margin);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-mobmdctrl-select-item>.van-checkbox{padding:var(--ibiz-control-mobmdctrl-select-item-check-padding)}.ibiz-control-mobmdctrl-slider-item .van-swipe-cell__right>.van-button{height:100%}.ibiz-control-mobmdctrl-slider-item .van-swipe-cell__left>.van-button{height:100%}
+.ibiz-control-mobmdctrl{--ibiz-control-mobmdctrl-color-text:var(--ibiz-color-text-0);--ibiz-control-mobmdctrl-color-active-bg:var(--ibiz-color-primary-light-default);--ibiz-control-mobmdctrl-color-group-bg:var(--ibiz-color-bg-0);--ibiz-control-mobmdctrl-color-group-text:var(--ibiz-color-text-1);--ibiz-control-mobmdctrl-width-img:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-height-img:var(--ibiz-width-icon-extra-large);--ibiz-control-mobmdctrl-spacing-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-spacing-group-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-spacing-img-padding:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-spacing-checkbox-gap:var(--ibiz-spacing-tight);--ibiz-control-mobmdctrl-spacing-border-padding:var(--ibiz-spacing-base);--ibiz-control-mobmdctrl-radius-img:var(--ibiz-border-radius-extra-small);--ibiz-control-mobmdctrl-font-fontSize:var(--ibiz-font-size-regular);--ibiz-control-mobmdctrl-font-group-fontSize:var(--ibiz-font-size-header-6);--ibiz-control-mobmdctrl-font-group-lineHeight:var(--ibiz-height-control-default);height:100%;position:relative}.ibiz-control-mobmdctrl__content{width:100%;height:100%;overflow-y:auto}.ibiz-control-mobmdctrl__content.is-show-under-line .van-hairline--bottom:after{left:calc(-50% + var(--ibiz-control-mobmdctrl-spacing-border-padding) * 2);right:calc(-50% + var(--ibiz-control-mobmdctrl-spacing-border-padding) * 2)}.ibiz-control-mobmdctrl__content .ibiz-add-more{padding:var(--ibiz-control-mobmdctrl-spacing-item-padding)}.ibiz-control-mobmdctrl.is-enable-page{display:flex;flex-direction:column}.ibiz-control-mobmdctrl.is-enable-page .ibiz-control-mobmdctrl__content{flex:auto;height:0}.ibiz-control-mobmdctrl.is-enable-page .ibiz-control-mobmdctrl__pagination{flex:none}.ibiz-control-mobmdctrl.is-hidden-finished .van-list__finished-text{display:none}.ibiz-control-mobmdctrl__anchor .van-index-anchor{padding:0}.ibiz-control-mobmdctrl-item__right{margin-right:var(--ibiz-control-mobmdctrl-spacing-checkbox-gap)}.ibiz-control-mobmdctrl-item.ibiz-control-mobmdctrl-item{color:var(--ibiz-control-mobmdctrl-color-text);height:auto;font-size:var(--ibiz-control-mobmdctrl-font-fontSize);padding:var(--ibiz-control-mobmdctrl-spacing-item-padding)}.ibiz-control-mobmdctrl-item.is-active.ibiz-control-mobmdctrl-item{background-color:var(--ibiz-control-mobmdctrl-color-active-bg)}.ibiz-control-mobmdctrl-image{width:var(--ibiz-control-mobmdctrl-width-img);height:var(--ibiz-control-mobmdctrl-height-img);margin-right:var(--ibiz-control-mobmdctrl-spacing-img-padding);border-radius:var(--ibiz-control-mobmdctrl-radius-img)}.ibiz-control-mobmdctrl-group__container{width:100%;height:auto}.ibiz-control-mobmdctrl-group__caption{padding:var(--ibiz-control-mobmdctrl-spacing-group-padding);font-size:var(--ibiz-control-mobmdctrl-font-group-fontSize);line-height:var(--ibiz-control-mobmdctrl-font-group-lineHeight);color:var(--ibiz-control-mobmdctrl-color-group-text);background-color:var(--ibiz-control-mobmdctrl-color-group-bg)}.ibiz-control-mobmdctrl-select-item{display:flex;align-items:center;justify-content:space-between;padding:var(--ibiz-control-mobmdctrl-spacing-item-padding)}.ibiz-control-mobmdctrl-select-item__left{margin-right:var(--ibiz-control-mobmdctrl-spacing-checkbox-gap)}.ibiz-control-mobmdctrl-select-item.is-active{background-color:var(--ibiz-control-mobmdctrl-color-active-bg)}.ibiz-control-mobmdctrl-select-item .ibiz-control-mobmdctrl-item{flex:1;padding:0;width:auto}.ibiz-control-mobmdctrl-slider-item .van-swipe-cell__right>.van-button{height:100%}.ibiz-control-mobmdctrl-slider-item .van-swipe-cell__left>.van-button{height:100%}.ibiz-control-mobmdctrl-quicktoolbar{width:100%;display:flex;align-items:center;justify-content:center}

package/es/control/list/md-ctrl/md-ctrl.mjs

@@ -1,18 +1,18 @@
-import { defineComponent, createVNode, resolveComponent, ref, computed, createTextVNode } from 'vue';
+import { defineComponent, createVNode, resolveComponent } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
-import { debounce } from 'lodash-es';
 import { MDCtrlController, getAllUIActionItems } from '@ibiz-template/runtime';
-import { useListRender } from '../list-render-util.mjs';
 import '../../../util/index.mjs';
 import './md-ctrl.css';
+import { useListRender } from '../../../util/list-util/list-render-util.mjs';
 import { usePagination } from '../../../util/pagination/use-pagination.mjs';
+import { convertBtnType } from '../../../util/button-util/button-util.mjs';
 
 "use strict";
 const MDCtrlControl = /* @__PURE__ */ defineComponent({
   name: "IBizMDCtrlControl",
   props: {
     /**
-     * @description 移动端多数据模型数据
+     * @description 移动端多数据部件模型数据
      */
     modelData: {
       type: Object,
@@ -63,7 +63,8 @@ const MDCtrlControl = /* @__PURE__ */ defineComponent({
       required: false
     },
     /**
-     * @description 模式，值为LIST：列表模式呈现加载数据，值为SELECT：呈现数据时显示勾选图标
+     * @description 选择模式，值为SELECT时，列表项显示勾选图标
+     * @default 'LIST'
      */
     mode: {
       type: String,
@@ -76,76 +77,42 @@ const MDCtrlControl = /* @__PURE__ */ defineComponent({
     loadDefault: {
       type: Boolean,
       default: true
+    },
+    /**
+     * @description 是否是简单模式，即直接传入数据，不加载数据
+     */
+    isSimple: {
+      type: Boolean,
+      required: false
+    },
+    /**
+     * @description 简单模式下传入的数据
+     */
+    data: {
+      type: Array,
+      required: false
     }
   },
   setup(props) {
     const c = useControlController((...args) => new MDCtrlController(...args));
     const ns = useNamespace(`control-${c.model.controlType.toLowerCase()}`);
     const {
+      enableLoadMore,
       renderItem,
       renderNoData,
-      renderLoadMore
+      renderAddItem,
+      renderScrollList,
+      renderGroup
     } = useListRender(props, c, ns);
-    const isUpdating = ref(false);
-    const isLodeMoreDisabled = computed(() => {
-      if (c.model.enablePagingBar === true) {
-        return true;
-      }
-      if (c.model.pagingMode !== 2) {
-        return true;
-      }
-      return c.state.items.length >= c.state.total || c.state.isLoading || c.state.total <= c.state.size;
-    });
     const {
       onPageChange
     } = usePagination(c);
-    const delistItems = computed(() => {
-      var _a;
-      const data = [];
-      (_a = c.model.delistItems) == null ? void 0 : _a.forEach((item) => {
-        var _a2, _b;
-        if (item.enableSort) {
-          data.push({
-            value: item.id,
-            label: ibiz.i18n.t(((_a2 = item == null ? void 0 : item.capLanguageRes) == null ? void 0 : _a2.lanResTag) || "", item.caption || ((_b = item == null ? void 0 : item.capLanguageRes) == null ? void 0 : _b.defaultContent))
-          });
-        }
-      });
-      return data;
-    });
-    const sortVal = computed(() => {
-      if (c.state.sortQuery) {
-        const [key, order] = c.state.sortQuery.split(",");
-        return {
-          key,
-          order
-        };
-      }
-      return null;
-    });
-    const onSortChange = (sort) => {
-      c.setSort(sort.key, sort.order);
-      c.load({
-        isInitialLoad: true
-      });
-    };
-    const debounceLoadMore = debounce(async () => {
-      c.loadMore();
-    }, 500);
-    const onLoadMore = () => {
-      debounceLoadMore();
-    };
-    c.evt.on("onLoadSuccess", () => {
-      isUpdating.value = true;
-      window.requestAnimationFrame(() => {
-        isUpdating.value = false;
-      });
-    });
-    const showCollapseOrExpandIcon = computed(() => {
-      return !c.model.enableGroup && c.model.pagingMode === 3;
-    });
     const leftSlidingActionGroup = c.model.deuiactionGroup;
     const rightSlidingActionGroup = c.model.deuiactionGroup2;
+    const btnType = (item) => {
+      const _type = convertBtnType(item);
+      return _type === "default" ? "primary" : _type;
+    };
     const renderSlidingActionGroup = (group, data) => {
       const groupDetails = getAllUIActionItems(group.uiactionGroupDetails);
       if (!groupDetails || groupDetails.length === 0)
@@ -154,10 +121,11 @@ const MDCtrlControl = /* @__PURE__ */ defineComponent({
       const btnContainer = row.uaColStates[group.id];
       return groupDetails.map((detail) => {
         const btn = btnContainer == null ? void 0 : btnContainer[detail.id];
+        const _type = btnType(detail);
         if (btn == null ? void 0 : btn.visible)
           return createVNode(resolveComponent("van-button"), {
             "square": true,
-            "type": "primary",
+            "type": _type,
             "text": detail.caption,
             "disabled": btn.disabled || btn.loading,
             "onClick": (e) => c.onActionClick(detail, row, e)
@@ -182,57 +150,42 @@ const MDCtrlControl = /* @__PURE__ */ defineComponent({
       return renderItem(data);
     };
     const renderDefault = () => {
-      return c.state.items.map((item) => {
+      const result = [];
+      result.push(...c.state.items.map((item) => {
         return renderDefaultItem(item);
-      });
+      }));
+      if (c.enableNew) {
+        result.push(renderAddItem());
+      }
+      return result;
     };
-    const renderGroup = () => {
-      return c.state.groups.map((group) => {
-        return createVNode("div", {
-          "title": group.caption
-        }, [createVNode("div", {
-          "class": ns.b("group-caption")
-        }, [createTextVNode(" "), group.caption]), group.children.map((item) => {
-          return renderDefaultItem(item.data);
-        })]);
+    const renderGroupChildren = (children) => {
+      return children.map((item) => {
+        return renderDefaultItem(item.data);
       });
     };
     const renderMDContent = () => {
-      return createVNode(resolveComponent("van-list"), {
-        "class": [ns.e("content"), ns.is("show-underLine", c.model.controlStyle !== "EXTVIEW1")],
-        "loading": c.state.isLoading,
-        "finished": isLodeMoreDisabled.value || c.state.isLoading || isUpdating.value,
-        "immediate-check": false,
-        "onLoad": () => onLoadMore()
-      }, {
-        default: () => [c.model.groupMode !== "NONE" ? renderGroup() : renderDefault()]
-      });
+      const slots = c.enableGroup ? renderGroup({
+        children: renderGroupChildren
+      }) : renderDefault();
+      return renderScrollList(slots);
     };
     return {
       c,
       ns,
+      enableLoadMore,
       renderMDContent,
       renderNoData,
-      showCollapseOrExpandIcon,
-      onPageChange,
-      renderLoadMore,
-      sortVal,
-      delistItems,
-      onSortChange
+      onPageChange
     };
   },
   render() {
-    const enablePagingBar = this.c.model.enablePagingBar && this.c.model.pagingMode === 1;
+    const enablePagingBar = this.c.model.enablePagingBar;
     return createVNode(resolveComponent("iBizControlBase"), {
       "controller": this.c,
-      "class": [this.ns.is("enable-page", enablePagingBar || this.showCollapseOrExpandIcon)]
+      "class": [this.ns.is("enable-page", enablePagingBar || this.c.model.pagingMode === 3), this.ns.is("hidden-finished", enablePagingBar || this.c.enableGroup || this.enableLoadMore)]
     }, {
-      default: () => [this.delistItems.length > 0 && createVNode(resolveComponent("iBizMdCtrlSetting"), {
-        "class": this.ns.e("setting"),
-        "listItems": this.delistItems,
-        "sort": this.sortVal,
-        "onSortChange": this.onSortChange
-      }, null), this.c.state.isCreated && (this.c.state.rows.length > 0 ? this.renderMDContent() : this.renderNoData()), enablePagingBar ? createVNode(resolveComponent("van-pagination"), {
+      default: () => [this.c.state.isCreated && (this.c.state.rows.length > 0 ? this.renderMDContent() : this.renderNoData()), enablePagingBar ? createVNode(resolveComponent("van-pagination"), {
         "class": this.ns.e("pagination"),
         "total-items": this.c.state.total,
         "model-value": this.c.state.curPage,
@@ -240,7 +193,7 @@ const MDCtrlControl = /* @__PURE__ */ defineComponent({
         "page-count": this.c.state.totalPages,
         "force-ellipses": true,
         "onChange": this.onPageChange
-      }, null) : null, this.showCollapseOrExpandIcon && this.renderLoadMore()]
+      }, null) : null]
     });
   }
 });

package/es/control/search-bar/filter-tree/filter-tree.mjs

@@ -1,8 +1,9 @@
-import { isVNode, defineComponent, createVNode, resolveComponent, ref, computed, watch, onMounted, h } from 'vue';
+import { isVNode, defineComponent, createVNode, resolveComponent, ref, computed, watch, h } from 'vue';
 import { ValueOP } from '@ibiz-template/runtime';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import './filter-tree.css';
 import { clearAll } from 'qx-util';
+import { isNil } from 'ramda';
+import './filter-tree.css';
 
 "use strict";
 function _isSlot(s) {
@@ -259,7 +260,7 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       showPopup.value = false;
     };
     const onEditItem = () => {
-      if (copyNode.value && copyNode.value.value) {
+      if (copyNode.value && !isNil(copyNode.value.value)) {
         Object.assign(editNode.value, copyNode.value);
       }
       closePopup();
@@ -276,7 +277,7 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       closePopup();
     };
     const onAddItem = () => {
-      if (!UiFilterNodes.value.length || !addNode.value || !addNode.value.value) {
+      if (!UiFilterNodes.value.length || !addNode.value || isNil(addNode.value.value)) {
         return;
       }
       const children = UiFilterNodes.value[0].children;
@@ -292,12 +293,6 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       });
       closePopup();
     };
-    onMounted(() => {
-      const bol = hasFilter();
-      if (!bol) {
-        addItem();
-      }
-    });
     const onFilterItemClick = (event, item, index, root) => {
       event.stopPropagation();
       editNode.value = item;

package/es/control/search-bar/search-bar.css

@@ -1 +1 @@
-.ibiz-control-searchbar-quick-search{width:100%}.ibiz-control-searchbar{--ibiz-control-searchbar-margin:var(--ibiz-spacing-tight);--ibiz-control-searchbar-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-height:2.25rem;display:flex;align-items:center}.ibiz-control-searchbar__filter{flex:none;border:none;font-size:var(--ibiz-width-icon-large)}.ibiz-control-searchbar .van-search{--van-search-background:var(--ibiz-color-bg-1);--van-search-padding:var(--ibiz-control-searchbar-padding);--van-search-input-height:var(--ibiz-control-searchbar-height)}.ibiz-control-searchbar .van-search .van-field__left-icon{margin-right:var(--ibiz-spacing-tight)}.ibiz-control-searchbar .van-search__content{border-radius:var(--ibiz-border-radius-small)}
+.ibiz-control-searchbar-quick-search{--ibiz-control-searchbar-quick-search-height:var(--ibiz-height-control-default);--ibiz-control-searchbar-quick-search-border-radius:var(--ibiz-border-radius-small);--ibiz-control-searchbar-quick-search-left-icon:0 var(--ibiz-spacing-tight) 0 0;width:100%;background-color:transparent;height:var(--ibiz-control-searchbar-quick-search-height);padding:0}.ibiz-control-searchbar-quick-search .van-search__content{border-radius:var(--ibiz-control-searchbar-quick-search-border-radius)}.ibiz-control-searchbar-quick-search .van-field__left-icon{margin:var(--ibiz-control-searchbar-quick-search-left-icon)}.ibiz-control-searchbar{--ibiz-control-searchbar-bg-color:var(--ibiz-color-bg-1);--ibiz-control-searchbar-margin:var(--ibiz-spacing-tight);--ibiz-control-searchbar-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-filter-btn-margin:0 0 0 var(--ibiz-spacing-tight);--ibiz-control-searchbar-filter-btn-font-size:var(--ibiz-font-size-header-4);--ibiz-control-searchbar-filter-btn-height:var(--ibiz-height-control-default);--ibiz-control-searchbar-enable-filter-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-color-group-item-text:var(--ibiz-color-text-1);--ibiz-control-searchbar-color-group-item-bg:var(--ibiz-color-fill-1);--ibiz-control-searchbar-color-group-item-selected-bg:var(--ibiz-color-primary);--ibiz-control-searchbar-color-group-item-selected-text:var(--ibiz-color-white);--ibiz-control-searchbar-spacing-group-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-spacing-group-item-gap:var(--ibiz-spacing-tight);--ibiz-control-searchbar-spacing-group-more-gap:var(--ibiz-spacing-extra-tight);--ibiz-control-searchbar-spacing-group-item-margin:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) 0 0;--ibiz-control-searchbar-spacing-group-container-padding:var(--ibiz-spacing-base);--ibiz-control-searchbar-radius-group-item:var(--ibiz-border-radius-full);--ibiz-control-searchbar-footer-item-padding:var(--ibiz-spacing-base);--ibiz-control-searchbar-footer-item-gap:var(--ibiz-spacing-base-tight);--ibiz-control-searchbar-footer-group-padding:0 var(--ibiz-spacing-base);--ibiz-control-searchbar-footer-more-color:var(--ibiz-color-link);--ibiz-control-searchbar-footer-item-shadow:var(--ibiz-shadow-elevated);--ibiz-control-searchbar-footer-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-searchbar-footer-reset-color:var(--ibiz-color-text);--ibiz-control-searchbar-footer-reset-bg-color:transparent;--ibiz-control-searchbar-footer-confirm-color:var(--ibiz-color-default);--ibiz-control-searchbar-footer-confirm-bg-color:var(--ibiz-color-primary);display:flex;align-items:center;background-color:var(--ibiz-control-searchbar-bg-color);padding:var(--ibiz-control-searchbar-padding)}.ibiz-control-searchbar__filter{flex:none;border:none;font-size:var(--ibiz-control-searchbar-filter-btn-font-size);height:var(--ibiz-control-searchbar-filter-btn-height);margin:var(--ibiz-control-searchbar-filter-btn-margin)}.ibiz-control-searchbar__filter .van-button__text{display:flex;align-items:center}.ibiz-control-searchbar__action-sheet{--van-action-sheet-cancel-padding-color:var(--ibiz-color-fill-0);--van-action-sheet-cancel-text-color:var(--ibiz-color-text-0);--van-active-color:var(--ibiz-color-fill-0)}.ibiz-control-searchbar__action-sheet--item.is-selected{color:var(--ibiz-color-primary)}.ibiz-control-searchbar.is-enable-filter{padding:var(--ibiz-control-searchbar-enable-filter-padding)}.ibiz-control-searchbar-container{width:100%;height:100%;display:block;padding:0}.ibiz-control-searchbar-dropdown{--ibiz-dropdown-popover-color-popover-bg:var(--ibiz-color-bg-1);--ibiz-dropdown-popover-color-history-item-bg:var(--ibiz-color-fill-1);--ibiz-dropdown-popover-spacing-dropdown-popover-padding:var(--ibiz-spacing-base);--ibiz-dropdown-popover-spacing-history-header-padding:var(--ibiz-spacing-tight);--ibiz-dropdown-popover-spacing-history-header-clear-gap:var(--ibiz-spacing-extra-tight);--ibiz-dropdown-popover-spacing-history-footer-padding:var(--ibiz-spacing-tight);--ibiz-dropdown-popover-spacing-history-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-base);--ibiz-dropdown-popover-spacing-history-item-margin:var(--ibiz-spacing-extra-tight);--ibiz-dropdown-popover-spacing-history-item-gap:var(--ibiz-spacing-tight);--ibiz-dropdown-popover-font-history-item-line-height:var(--ibiz-spacing-loose);--ibiz-dropdown-popover-radius-history-item:var(--ibiz-border-radius-full);background-color:var(--ibiz-dropdown-popover-color-popover-bg);flex-direction:column;position:fixed;left:0;gap:8px;width:100vw;z-index:999;padding:var(--ibiz-dropdown-popover-spacing-dropdown-popover-padding);border-top:1px solid var(--ibiz-color-border);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-control-searchbar-history{flex:1;display:flex;flex-direction:column;width:100%;overflow:hidden}.ibiz-control-searchbar-history__header{flex-shrink:0;display:flex;justify-content:space-between;padding:var(--ibiz-dropdown-popover-spacing-history-header-padding) 0}.ibiz-control-searchbar-history__header--title{font-weight:700}.ibiz-control-searchbar-history__header--clear{display:flex;align-items:center;gap:var(--ibiz-dropdown-popover-spacing-history-header-clear-gap)}.ibiz-control-searchbar-history__content{flex:1;display:flex;flex-flow:wrap;overflow:auto;gap:var(--ibiz-dropdown-popover-spacing-history-item-gap)}.ibiz-control-searchbar-history__content--item{flex-shrink:0;display:inline-flex;max-width:100%;position:relative}.ibiz-control-searchbar-history__content--item-text{max-width:100%;background-color:var(--ibiz-dropdown-popover-color-history-item-bg);border-radius:var(--ibiz-dropdown-popover-radius-history-item);padding:var(--ibiz-dropdown-popover-spacing-history-item-padding);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:var(--ibiz-dropdown-popover-spacing-history-item-margin);line-height:var(--ibiz-dropdown-popover-font-history-item-line-height)}.ibiz-control-searchbar-history__content--item-remove{position:absolute;top:0;right:0}.ibiz-control-searchbar-history__footer{--van-divider-margin:0;flex-shrink:0;text-align:center;padding:var(--ibiz-dropdown-popover-spacing-history-footer-padding) var(--ibiz-dropdown-popover-spacing-history-footer-padding) 0 var(--ibiz-dropdown-popover-spacing-history-footer-padding)}.ibiz-control-searchbar-quick-group{padding:var(--ibiz-control-searchbar-padding);display:flex;gap:var(--ibiz-control-searchbar-spacing-group-item-gap);flex-flow:wrap}.ibiz-control-searchbar-quick-group__item{-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inline-block;height:-moz-max-content;height:max-content;margin-top:var(--ibiz-control-searchbar-margin);color:var(--ibiz-control-searchbar-color-group-item-text);background-color:var(--ibiz-control-searchbar-color-group-item-bg);padding:var(--ibiz-control-searchbar-spacing-group-item-padding);border-radius:var(--ibiz-control-searchbar-radius-group-item)}.ibiz-control-searchbar-quick-group__item ion-icon{vertical-align:text-top;margin-right:var(--ibiz-control-searchbar-spacing-group-more-gap)}.ibiz-control-searchbar-quick-group__item.is-selected{color:var(--ibiz-control-searchbar-color-group-item-selected-text);background-color:var(--ibiz-control-searchbar-color-group-item-selected-bg)}.ibiz-control-searchbar-quick-group-popup{width:100%;height:100%;max-width:100%;padding:var(--ibiz-control-searchbar-spacing-group-container-padding)}.ibiz-control-searchbar-quick-group-container{--ibiz-control-searchbar-bg-color:var(--ibiz-color-bg-1);--ibiz-control-searchbar-margin:var(--ibiz-spacing-tight);--ibiz-control-searchbar-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-filter-btn-margin:0 0 0 var(--ibiz-spacing-tight);--ibiz-control-searchbar-filter-btn-font-size:var(--ibiz-font-size-header-4);--ibiz-control-searchbar-filter-btn-height:var(--ibiz-height-control-default);--ibiz-control-searchbar-enable-filter-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-color-group-item-text:var(--ibiz-color-text-1);--ibiz-control-searchbar-color-group-item-bg:var(--ibiz-color-fill-1);--ibiz-control-searchbar-color-group-item-selected-bg:var(--ibiz-color-primary);--ibiz-control-searchbar-color-group-item-selected-text:var(--ibiz-color-white);--ibiz-control-searchbar-spacing-group-item-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-control-searchbar-spacing-group-item-gap:var(--ibiz-spacing-tight);--ibiz-control-searchbar-spacing-group-more-gap:var(--ibiz-spacing-extra-tight);--ibiz-control-searchbar-spacing-group-item-margin:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) 0 0;--ibiz-control-searchbar-spacing-group-container-padding:var(--ibiz-spacing-base);--ibiz-control-searchbar-radius-group-item:var(--ibiz-border-radius-full);--ibiz-control-searchbar-footer-item-padding:var(--ibiz-spacing-base);--ibiz-control-searchbar-footer-item-gap:var(--ibiz-spacing-base-tight);--ibiz-control-searchbar-footer-group-padding:0 var(--ibiz-spacing-base);--ibiz-control-searchbar-footer-more-color:var(--ibiz-color-link);--ibiz-control-searchbar-footer-item-shadow:var(--ibiz-shadow-elevated);--ibiz-control-searchbar-footer-item-border-radius:var(--ibiz-border-radius-small);--ibiz-control-searchbar-footer-reset-color:var(--ibiz-color-text);--ibiz-control-searchbar-footer-reset-bg-color:transparent;--ibiz-control-searchbar-footer-confirm-color:var(--ibiz-color-default);--ibiz-control-searchbar-footer-confirm-bg-color:var(--ibiz-color-primary);display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-searchbar-quick-group-container__content{flex:1;overflow:auto}.ibiz-control-searchbar-quick-group-container__content--item{margin:var(--ibiz-control-searchbar-spacing-group-item-margin)}.ibiz-control-searchbar-quick-group-container__footer{display:flex;align-items:center;justify-content:flex-start;display:flex;flex-shrink:0;gap:var(--ibiz-control-searchbar-footer-item-gap);padding:var(--ibiz-control-searchbar-footer-padding)}.ibiz-control-searchbar-quick-group-container__footer--reset{flex:1;padding:var(--ibiz-control-searchbar-footer-item-padding);box-shadow:var(--ibiz-control-searchbar-footer-item-shadow);background-color:var(--ibiz-control-searchbar-footer-reset-bg-color);color:var(--ibiz-control-searchbar-text-color);width:100%;text-align:center;border-radius:var(--ibiz-control-searchbar-footer-item-border-radius)}.ibiz-control-searchbar-quick-group-container__footer--search{flex:1;padding:var(--ibiz-control-searchbar-footer-item-padding);box-shadow:var(--ibiz-control-searchbar-footer-item-shadow);background-color:var(--ibiz-control-searchbar-footer-confirm-bg-color);color:var(--ibiz-control-searchbar-footer-confirm-color);width:100%;text-align:center;opacity:.9;border-radius:var(--ibiz-control-searchbar-footer-item-border-radius)}