3h1-ui 1.0.16 → 1.0.18

package/es/index.d.ts

@@ -1,7 +1,9 @@
+import ShySearch from './src/search/IndexView.vue';
+import ShyForm from './src/ShyForm/IndexView.vue';
 import ShyTable from './src/ShyTable/IndexView.vue';
 import ShyPage from './src/ShyPage/IndexView.vue';
 import { App } from 'vue';
-export { ShyPage, ShyTable };
+export { ShySearch, ShyForm, ShyPage, ShyTable };
 declare const _default: {
     install(app: App): void;
 };

package/es/index.js

@@ -1,10 +1,86 @@
-import { h, nextTick, createVNode, defineComponent, ref, watchEffect, resolveComponent, openBlock, createElementBlock, createElementVNode, Fragment, renderList, withCtx, normalizeStyle, toDisplayString, createBlock, unref, createCommentVNode, withModifiers, createTextVNode, pushScopeId, popScopeId, createSlots, renderSlot, normalizeProps, guardReactiveProps, watch } from "vue";
+import { defineComponent, reactive, watch, resolveComponent, openBlock, createElementBlock, createVNode, withCtx, unref, Fragment, renderList, createBlock, h, nextTick, ref, computed, watchEffect, createElementVNode, createTextVNode, createCommentVNode, normalizeStyle, toDisplayString, withModifiers, pushScopeId, popScopeId, createSlots, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import { Form, Row, Col, Select, Input, ConfigProvider, Pagination } from "ant-design-vue";
 import "xe-utils";
 import { VxeTable, VxeColumn } from "vxe-table";
 import zhCN from "ant-design-vue/es/locale/zh_CN";
-import { ConfigProvider, Pagination } from "ant-design-vue";
 import "ant-design-vue/dist/antd.css";
-const style = "";
+const _hoisted_1$2 = { class: "shy-form" };
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "IndexView",
+  props: {
+    column: { default: () => [] },
+    form: { default: {} }
+  },
+  emits: ["update:form"],
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const form = reactive({});
+    watch(
+      () => props.form,
+      (value) => {
+        Object.keys(value).forEach((key) => {
+          form[key] = value[key];
+        });
+      },
+      { immediate: true }
+    );
+    const changeEvent = () => {
+      emit("update:form", { ...form });
+    };
+    const rules = reactive({});
+    const { resetFields, validate, validateInfos } = Form.useForm(form, rules, {});
+    expose({ resetFields });
+    return (_ctx, _cache) => {
+      const _component_a_form_item = resolveComponent("a-form-item");
+      const _component_a_form = resolveComponent("a-form");
+      return openBlock(), createElementBlock("div", _hoisted_1$2, [
+        createVNode(_component_a_form, {
+          "label-col": { span: 6 },
+          "wrapper-col": { span: 18 }
+        }, {
+          default: withCtx(() => [
+            createVNode(unref(Row), null, {
+              default: withCtx(() => [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(props.column || [], (item, index2) => {
+                  return openBlock(), createBlock(unref(Col), {
+                    key: index2,
+                    span: (item == null ? void 0 : item.span) || 12
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(_component_a_form_item, {
+                        label: item.label
+                      }, {
+                        default: withCtx(() => [
+                          (item == null ? void 0 : item.type) === "select" ? (openBlock(), createBlock(unref(Select), {
+                            key: 0,
+                            onChange: changeEvent,
+                            value: form[item.prop],
+                            "onUpdate:value": ($event) => form[item.prop] = $event,
+                            options: item.dicData
+                          }, null, 8, ["value", "onUpdate:value", "options"])) : (openBlock(), createBlock(unref(Input), {
+                            key: 1,
+                            onChange: changeEvent,
+                            value: form[item.prop],
+                            "onUpdate:value": ($event) => form[item.prop] = $event,
+                            size: "middle"
+                          }, null, 8, ["value", "onUpdate:value"]))
+                        ]),
+                        _: 2
+                      }, 1032, ["label"])
+                    ]),
+                    _: 2
+                  }, 1032, ["span"]);
+                }), 128))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        })
+      ]);
+    };
+  }
+});
 function bound01(n, max) {
   if (isOnePointZero(n)) {
     n = "100%";
@@ -649,7 +725,7 @@ function insertCss(css, options) {
   }
   return styleElement;
 }
-function _objectSpread$4(target) {
+function _objectSpread$7(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i] != null ? Object(arguments[i]) : {};
     var ownKeys = Object.keys(source);
@@ -659,12 +735,12 @@ function _objectSpread$4(target) {
       }));
     }
     ownKeys.forEach(function(key) {
-      _defineProperty$4(target, key, source[key]);
+      _defineProperty$7(target, key, source[key]);
     });
   }
   return target;
 }
-function _defineProperty$4(obj, key, value) {
+function _defineProperty$7(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
   } else {
@@ -685,13 +761,13 @@ function isIconDefinition(target) {
 }
 function generate(node, key, rootProps) {
   if (!rootProps) {
-    return h(node.tag, _objectSpread$4({
+    return h(node.tag, _objectSpread$7({
       key
     }, node.attrs), (node.children || []).map(function(child, index2) {
       return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index2));
     }));
   }
-  return h(node.tag, _objectSpread$4({
+  return h(node.tag, _objectSpread$7({
     key
   }, rootProps, node.attrs), (node.children || []).map(function(child, index2) {
     return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index2));
@@ -754,7 +830,7 @@ function _objectWithoutPropertiesLoose$1(source, excluded) {
   }
   return target;
 }
-function _objectSpread$3(target) {
+function _objectSpread$6(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i] != null ? Object(arguments[i]) : {};
     var ownKeys = Object.keys(source);
@@ -764,12 +840,12 @@ function _objectSpread$3(target) {
       }));
     }
     ownKeys.forEach(function(key) {
-      _defineProperty$3(target, key, source[key]);
+      _defineProperty$6(target, key, source[key]);
     });
   }
   return target;
 }
-function _defineProperty$3(obj, key, value) {
+function _defineProperty$6(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
   } else {
@@ -789,10 +865,10 @@ function setTwoToneColors(_ref) {
   twoToneColorPalette.calculated = !!secondaryColor;
 }
 function getTwoToneColors() {
-  return _objectSpread$3({}, twoToneColorPalette);
+  return _objectSpread$6({}, twoToneColorPalette);
 }
 var IconBase = function IconBase2(props, context) {
-  var _props$context$attrs = _objectSpread$3({}, props, context.attrs), icon = _props$context$attrs.icon, primaryColor = _props$context$attrs.primaryColor, secondaryColor = _props$context$attrs.secondaryColor, restProps = _objectWithoutProperties$1(_props$context$attrs, _excluded$1);
+  var _props$context$attrs = _objectSpread$6({}, props, context.attrs), icon = _props$context$attrs.icon, primaryColor = _props$context$attrs.primaryColor, secondaryColor = _props$context$attrs.secondaryColor, restProps = _objectWithoutProperties$1(_props$context$attrs, _excluded$1);
   var colors = twoToneColorPalette;
   if (primaryColor) {
     colors = {
@@ -807,11 +883,11 @@ var IconBase = function IconBase2(props, context) {
   }
   var target = icon;
   if (target && typeof target.icon === "function") {
-    target = _objectSpread$3({}, target, {
+    target = _objectSpread$6({}, target, {
       icon: target.icon(colors.primaryColor, colors.secondaryColor)
     });
   }
-  return generate(target.icon, "svg-".concat(target.name), _objectSpread$3({}, restProps, {
+  return generate(target.icon, "svg-".concat(target.name), _objectSpread$6({}, restProps, {
     "data-icon": target.name,
     width: "1em",
     height: "1em",
@@ -963,7 +1039,7 @@ function _arrayWithHoles(arr) {
   if (Array.isArray(arr))
     return arr;
 }
-function _objectSpread$2(target) {
+function _objectSpread$5(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i] != null ? Object(arguments[i]) : {};
     var ownKeys = Object.keys(source);
@@ -973,12 +1049,12 @@ function _objectSpread$2(target) {
       }));
     }
     ownKeys.forEach(function(key) {
-      _defineProperty$2(target, key, source[key]);
+      _defineProperty$5(target, key, source[key]);
     });
   }
   return target;
 }
-function _defineProperty$2(obj, key, value) {
+function _defineProperty$5(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
   } else {
@@ -1021,10 +1097,10 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 setTwoToneColor("#1890ff");
 var Icon = function Icon2(props, context) {
   var _classObj;
-  var _props$context$attrs = _objectSpread$2({}, props, context.attrs), cls = _props$context$attrs["class"], icon = _props$context$attrs.icon, spin = _props$context$attrs.spin, rotate = _props$context$attrs.rotate, tabindex = _props$context$attrs.tabindex, twoToneColor = _props$context$attrs.twoToneColor, onClick = _props$context$attrs.onClick, restProps = _objectWithoutProperties(_props$context$attrs, _excluded);
+  var _props$context$attrs = _objectSpread$5({}, props, context.attrs), cls = _props$context$attrs["class"], icon = _props$context$attrs.icon, spin = _props$context$attrs.spin, rotate = _props$context$attrs.rotate, tabindex = _props$context$attrs.tabindex, twoToneColor = _props$context$attrs.twoToneColor, onClick = _props$context$attrs.onClick, restProps = _objectWithoutProperties(_props$context$attrs, _excluded);
   var classObj = (_classObj = {
     anticon: true
-  }, _defineProperty$2(_classObj, "anticon-".concat(icon.name), Boolean(icon.name)), _defineProperty$2(_classObj, cls, cls), _classObj);
+  }, _defineProperty$5(_classObj, "anticon-".concat(icon.name), Boolean(icon.name)), _defineProperty$5(_classObj, cls, cls), _classObj);
   var svgClassString = spin === "" || !!spin || icon.name === "loading" ? "anticon-spin" : "";
   var iconTabIndex = tabindex;
   if (iconTabIndex === void 0 && onClick) {
@@ -1036,7 +1112,7 @@ var Icon = function Icon2(props, context) {
     transform: "rotate(".concat(rotate, "deg)")
   } : void 0;
   var _normalizeTwoToneColo = normalizeTwoToneColors(twoToneColor), _normalizeTwoToneColo2 = _slicedToArray(_normalizeTwoToneColo, 2), primaryColor = _normalizeTwoToneColo2[0], secondaryColor = _normalizeTwoToneColo2[1];
-  return createVNode("span", _objectSpread$2({
+  return createVNode("span", _objectSpread$5({
     "role": "img",
     "aria-label": icon.name
   }, restProps, {
@@ -1061,9 +1137,43 @@ Icon.inheritAttrs = false;
 Icon.getTwoToneColor = getTwoToneColor;
 Icon.setTwoToneColor = setTwoToneColor;
 const AntdIcon = Icon;
+var ClearOutlined$2 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "defs", "attrs": {}, "children": [{ "tag": "style", "attrs": {} }] }, { "tag": "path", "attrs": { "d": "M899.1 869.6l-53-305.6H864c14.4 0 26-11.6 26-26V346c0-14.4-11.6-26-26-26H618V138c0-14.4-11.6-26-26-26H432c-14.4 0-26 11.6-26 26v182H160c-14.4 0-26 11.6-26 26v192c0 14.4 11.6 26 26 26h17.9l-53 305.6a25.95 25.95 0 0025.6 30.4h723c1.5 0 3-.1 4.4-.4a25.88 25.88 0 0021.2-30zM204 390h272V182h72v208h272v104H204V390zm468 440V674c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v156H416V674c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v156H202.8l45.1-260H776l45.1 260H672z" } }] }, "name": "clear", "theme": "outlined" };
+const ClearOutlinedSvg = ClearOutlined$2;
+function _objectSpread$4(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? Object(arguments[i]) : {};
+    var ownKeys = Object.keys(source);
+    if (typeof Object.getOwnPropertySymbols === "function") {
+      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+        return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+      }));
+    }
+    ownKeys.forEach(function(key) {
+      _defineProperty$4(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function _defineProperty$4(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+var ClearOutlined = function ClearOutlined2(props, context) {
+  var p = _objectSpread$4({}, props, context.attrs);
+  return createVNode(AntdIcon, _objectSpread$4({}, p, {
+    "icon": ClearOutlinedSvg
+  }), null);
+};
+ClearOutlined.displayName = "ClearOutlined";
+ClearOutlined.inheritAttrs = false;
+const ClearOutlined$1 = ClearOutlined;
 var DownOutlined$2 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" } }] }, "name": "down", "theme": "outlined" };
 const DownOutlinedSvg = DownOutlined$2;
-function _objectSpread$1(target) {
+function _objectSpread$3(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i] != null ? Object(arguments[i]) : {};
     var ownKeys = Object.keys(source);
@@ -1073,12 +1183,12 @@ function _objectSpread$1(target) {
       }));
     }
     ownKeys.forEach(function(key) {
-      _defineProperty$1(target, key, source[key]);
+      _defineProperty$3(target, key, source[key]);
     });
   }
   return target;
 }
-function _defineProperty$1(obj, key, value) {
+function _defineProperty$3(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
   } else {
@@ -1087,8 +1197,8 @@ function _defineProperty$1(obj, key, value) {
   return obj;
 }
 var DownOutlined = function DownOutlined2(props, context) {
-  var p = _objectSpread$1({}, props, context.attrs);
-  return createVNode(AntdIcon, _objectSpread$1({}, p, {
+  var p = _objectSpread$3({}, props, context.attrs);
+  return createVNode(AntdIcon, _objectSpread$3({}, p, {
     "icon": DownOutlinedSvg
   }), null);
 };
@@ -1097,7 +1207,7 @@ DownOutlined.inheritAttrs = false;
 const DownOutlined$1 = DownOutlined;
 var MinusOutlined$2 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z" } }] }, "name": "minus", "theme": "outlined" };
 const MinusOutlinedSvg = MinusOutlined$2;
-function _objectSpread(target) {
+function _objectSpread$2(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i] != null ? Object(arguments[i]) : {};
     var ownKeys = Object.keys(source);
@@ -1107,12 +1217,12 @@ function _objectSpread(target) {
       }));
     }
     ownKeys.forEach(function(key) {
-      _defineProperty(target, key, source[key]);
+      _defineProperty$2(target, key, source[key]);
     });
   }
   return target;
 }
-function _defineProperty(obj, key, value) {
+function _defineProperty$2(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
   } else {
@@ -1121,14 +1231,211 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 var MinusOutlined = function MinusOutlined2(props, context) {
-  var p = _objectSpread({}, props, context.attrs);
-  return createVNode(AntdIcon, _objectSpread({}, p, {
+  var p = _objectSpread$2({}, props, context.attrs);
+  return createVNode(AntdIcon, _objectSpread$2({}, p, {
     "icon": MinusOutlinedSvg
   }), null);
 };
 MinusOutlined.displayName = "MinusOutlined";
 MinusOutlined.inheritAttrs = false;
 const MinusOutlined$1 = MinusOutlined;
+var SearchOutlined$2 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z" } }] }, "name": "search", "theme": "outlined" };
+const SearchOutlinedSvg = SearchOutlined$2;
+function _objectSpread$1(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? Object(arguments[i]) : {};
+    var ownKeys = Object.keys(source);
+    if (typeof Object.getOwnPropertySymbols === "function") {
+      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+        return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+      }));
+    }
+    ownKeys.forEach(function(key) {
+      _defineProperty$1(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function _defineProperty$1(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+var SearchOutlined = function SearchOutlined2(props, context) {
+  var p = _objectSpread$1({}, props, context.attrs);
+  return createVNode(AntdIcon, _objectSpread$1({}, p, {
+    "icon": SearchOutlinedSvg
+  }), null);
+};
+SearchOutlined.displayName = "SearchOutlined";
+SearchOutlined.inheritAttrs = false;
+const SearchOutlined$1 = SearchOutlined;
+var UpOutlined$2 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z" } }] }, "name": "up", "theme": "outlined" };
+const UpOutlinedSvg = UpOutlined$2;
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? Object(arguments[i]) : {};
+    var ownKeys = Object.keys(source);
+    if (typeof Object.getOwnPropertySymbols === "function") {
+      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+        return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+      }));
+    }
+    ownKeys.forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+var UpOutlined = function UpOutlined2(props, context) {
+  var p = _objectSpread({}, props, context.attrs);
+  return createVNode(AntdIcon, _objectSpread({}, p, {
+    "icon": UpOutlinedSvg
+  }), null);
+};
+UpOutlined.displayName = "UpOutlined";
+UpOutlined.inheritAttrs = false;
+const UpOutlined$1 = UpOutlined;
+const _hoisted_1$1 = { class: "shy-search" };
+const _hoisted_2$1 = { class: "button-wrapper" };
+const _hoisted_3$1 = { class: "expand-line" };
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  __name: "IndexView",
+  props: {
+    column: { default: () => [] }
+  },
+  emits: ["search-change"],
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const form = ref({});
+    const searchColumn = computed(() => {
+      return props.column.map((item) => {
+        item.span = 8;
+        return item;
+      });
+    });
+    const baseColumn = computed(() => {
+      return searchColumn.value.length >= 3 ? searchColumn.value.slice(0, 3) : searchColumn.value;
+    });
+    const currentColumn = ref();
+    const isExpanded = ref(false);
+    const expandEvent = () => {
+      isExpanded.value = !isExpanded.value;
+    };
+    watchEffect(() => {
+      if (isExpanded.value) {
+        currentColumn.value = searchColumn.value;
+      } else {
+        currentColumn.value = baseColumn.value;
+      }
+    });
+    const isExpandFlag = computed(() => {
+      return searchColumn.value.length >= 3 ? true : false;
+    });
+    const iconStyle = {
+      fontSize: "7px",
+      color: "#919191"
+    };
+    const getForm = () => {
+      return form.value;
+    };
+    const searchChangeEvent = () => {
+      emit("search-change", form.value);
+    };
+    const searchResetEvent = () => {
+      form.value = {};
+      emit("search-change", {});
+    };
+    expose({ getForm });
+    return (_ctx, _cache) => {
+      const _component_a_col = resolveComponent("a-col");
+      const _component_a_button = resolveComponent("a-button");
+      const _component_a_row = resolveComponent("a-row");
+      return openBlock(), createElementBlock("div", _hoisted_1$1, [
+        createVNode(_component_a_row, null, {
+          default: withCtx(() => [
+            createVNode(_component_a_col, { span: 18 }, {
+              default: withCtx(() => [
+                createVNode(_sfc_main$4, {
+                  form: form.value,
+                  "onUpdate:form": _cache[0] || (_cache[0] = ($event) => form.value = $event),
+                  column: currentColumn.value
+                }, null, 8, ["form", "column"])
+              ]),
+              _: 1
+            }),
+            createVNode(_component_a_col, { span: 6 }, {
+              default: withCtx(() => [
+                createElementVNode("div", _hoisted_2$1, [
+                  createVNode(_component_a_button, {
+                    class: "button-search",
+                    type: "primary",
+                    onClick: searchChangeEvent
+                  }, {
+                    icon: withCtx(() => [
+                      createVNode(unref(SearchOutlined$1))
+                    ]),
+                    default: withCtx(() => [
+                      createTextVNode(" \u67E5\u8BE2 ")
+                    ]),
+                    _: 1
+                  }),
+                  createVNode(_component_a_button, { onClick: searchResetEvent }, {
+                    icon: withCtx(() => [
+                      createVNode(unref(ClearOutlined$1))
+                    ]),
+                    default: withCtx(() => [
+                      createTextVNode(" \u91CD\u7F6E ")
+                    ]),
+                    _: 1
+                  })
+                ])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }),
+        createElementVNode("div", _hoisted_3$1, [
+          unref(isExpandFlag) ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "expand-flag",
+            onClick: expandEvent
+          }, [
+            isExpanded.value ? (openBlock(), createBlock(unref(UpOutlined$1), {
+              key: 0,
+              style: iconStyle
+            })) : (openBlock(), createBlock(unref(DownOutlined$1), {
+              key: 1,
+              style: iconStyle
+            }))
+          ])) : createCommentVNode("", true)
+        ])
+      ]);
+    };
+  }
+});
+const IndexView_vue_vue_type_style_index_0_scoped_4bb16c80_lang = "";
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const ShySearch = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-4bb16c80"]]);
+const style = "";
 const _withScopeId = (n) => (pushScopeId("data-v-68169e62"), n = n(), popScopeId(), n);
 const _hoisted_1 = { class: "button-group" };
 const _hoisted_2 = { class: "flex-button" };
@@ -1236,13 +1543,6 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   }
 });
 const ButtonGroup_vue_vue_type_style_index_0_scoped_68169e62_lang = "";
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
 const ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-68169e62"]]);
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "IndexView",
@@ -1368,7 +1668,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return {
         current: 1,
         pageSize: 10,
-        total: 50
+        total: 100
       };
     } }
   },
@@ -1398,6 +1698,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createBlock(unref(ConfigProvider), { locale: unref(zhCN) }, {
         default: withCtx(() => [
           createVNode(unref(Pagination), {
+            class: "shy-page",
             current: current.value,
             "onUpdate:current": _cache[0] || (_cache[0] = ($event) => current.value = $event),
             pageSize: pageSize.value,
@@ -1414,14 +1715,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const IndexView_vue_vue_type_style_index_0_scoped_c1bd6b49_lang = "";
+const ShyPage = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c1bd6b49"]]);
 const index = {
   install(app) {
+    app.component("s-search", ShySearch);
+    app.component("s-form", _sfc_main$4);
     app.component("s-table", ShyTable);
-    app.component("s-page", _sfc_main);
+    app.component("s-page", ShyPage);
   }
 };
 export {
-  _sfc_main as ShyPage,
+  _sfc_main$4 as ShyForm,
+  ShyPage,
+  ShySearch,
   ShyTable,
   index as default
 };