gi-component 0.0.51 → 0.0.53

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import { defineComponent, createElementBlock, openBlock, createElementVNode, getCurrentInstance, ref, onMounted, watch, toValue, toRef, nextTick, onUnmounted, useAttrs, computed, createBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, useSlots, normalizeClass, createCommentVNode, normalizeStyle, createVNode, createSlots, Fragment, renderList, mergeModels, useModel, resolveDynamicComponent, resolveComponent, h, createApp, onUpdated, inject, toRefs, watchEffect, reactive, provide, onBeforeUnmount, resolveDirective, normalizeProps, guardReactiveProps, withDirectives, useTemplateRef } from "vue";
 import * as El from "element-plus";
-import El__default, { ElButton, ElSpace, ElDescriptions, ElDescriptionsItem, ElDialog, ElDrawer, ElInput, ElForm, ElTable, ElTableColumn, ElFormItem, ElText, ElMessage, ElIcon, ElSplitter, ElSplitterPanel, ElRow, ElPagination, ElTabs, ElTabPane, ElCheckbox, ElScrollbar, ElTree, ElCheckboxGroup, ElEmpty } from "element-plus";
+import El__default, { ElButton, ElSpace, ElDescriptions, ElDescriptionsItem, ElDialog, ElIcon, ElDrawer, ElInput, ElForm, ElTable, ElTableColumn, ElFormItem, ElText, ElMessage, ElSplitter, ElSplitterPanel, ElRow, ElPagination, ElTabs, ElTabPane, ElCheckbox, ElScrollbar, ElTree, ElCheckboxGroup, ElEmpty } from "element-plus";
 /*! Element Plus Icons Vue v2.3.2 */
 var _sfc_main6 = /* @__PURE__ */ defineComponent({
   name: "ArrowDown",
@@ -171,6 +171,21 @@ var _sfc_main94 = /* @__PURE__ */ defineComponent({
     ]));
   }
 }), edit_default = _sfc_main94;
+var _sfc_main118 = /* @__PURE__ */ defineComponent({
+  name: "FullScreen",
+  __name: "full-screen",
+  setup(__props) {
+    return (_ctx, _cache) => (openBlock(), createElementBlock("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 1024 1024"
+    }, [
+      createElementVNode("path", {
+        fill: "currentColor",
+        d: "m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64z"
+      })
+    ]));
+  }
+}), full_screen_default = _sfc_main118;
 var _sfc_main143 = /* @__PURE__ */ defineComponent({
   name: "InfoFilled",
   __name: "info-filled",
@@ -910,7 +925,8 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$5 = { key: 0 };
+const _hoisted_1$5 = ["id"];
+const _hoisted_2$2 = { key: 0 };
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "dialog",
   props: /* @__PURE__ */ mergeModels({
@@ -922,6 +938,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     cancelButtonProps: {},
     style: {},
     simple: { type: Boolean },
+    showFullscreen: { type: Boolean, default: false },
     onOk: {},
     onBeforeOk: {},
     onCancel: {},
@@ -968,6 +985,14 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     const visible = useModel(__props, "modelValue");
     const props = __props;
     const { b } = useBemClass();
+    const isFullscreen = ref(false);
+    watch(
+      () => props.fullscreen,
+      (val) => {
+        isFullscreen.value = !!val;
+      },
+      { immediate: true }
+    );
     const getClass = computed(() => {
       const arr = [b("dialog")];
       if (props.simple) {
@@ -987,10 +1012,16 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         onOk: void 0,
         onBeforeOk: void 0,
         onCancel: void 0,
-        simple: void 0
+        simple: void 0,
+        showFullscreen: void 0,
+        fullscreen: void 0,
+        title: void 0
       };
     });
     const okLoading = ref(false);
+    const toggleFullscreen = () => {
+      isFullscreen.value = !isFullscreen.value;
+    };
     const handleCancel = () => {
       var _a;
       (_a = props.onCancel) == null ? void 0 : _a.call(props);
@@ -1020,17 +1051,69 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         modelValue: visible.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
         class: getClass.value,
-        title: props.title,
-        style: { maxWidth: !props.fullscreen ? "480px" : "100%", ...props.style }
+        fullscreen: isFullscreen.value,
+        "show-close": false,
+        style: { maxWidth: !isFullscreen.value ? "480px" : "100%", ...props.style }
       }), createSlots({
+        header: withCtx(({ close, titleId, titleClass }) => [
+          createElementVNode("div", {
+            class: normalizeClass(unref(b)("dialog-header"))
+          }, [
+            renderSlot(_ctx.$slots, "title", {}, () => [
+              createElementVNode("div", {
+                id: titleId,
+                class: normalizeClass(["el-dialog__title", [titleClass, unref(b)("dialog-title")]])
+              }, toDisplayString(props.title), 11, _hoisted_1$5)
+            ], true),
+            createVNode(unref(ElSpace), { size: 8 }, {
+              default: withCtx(() => [
+                props.showFullscreen ? (openBlock(), createBlock(unref(ElButton), {
+                  key: 0,
+                  class: normalizeClass(unref(b)("dialog-button")),
+                  text: "",
+                  circle: "",
+                  onClick: toggleFullscreen
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(ElIcon), { size: 16 }, {
+                      default: withCtx(() => [
+                        createVNode(unref(full_screen_default))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["class"])) : createCommentVNode("", true),
+                props.showClose ? (openBlock(), createBlock(unref(ElButton), {
+                  key: 1,
+                  class: normalizeClass(unref(b)("dialog-button")),
+                  text: "",
+                  circle: "",
+                  onClick: close
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(ElIcon), { size: 16 }, {
+                      default: withCtx(() => [
+                        createVNode(unref(close_default))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["class", "onClick"])) : createCommentVNode("", true)
+              ]),
+              _: 2
+            }, 1024)
+          ], 2)
+        ]),
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default", {}, () => {
             var _a;
             return [
-              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_1$5, toDisplayString(props.content), 1)) : createCommentVNode("", true),
+              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_2$2, toDisplayString(props.content), 1)) : createCommentVNode("", true),
               typeof props.content === "function" ? (openBlock(), createBlock(resolveDynamicComponent((_a = props == null ? void 0 : props.content) == null ? void 0 : _a.call(props)), { key: 1 })) : createCommentVNode("", true)
             ];
-          })
+          }, true)
         ]),
         _: 2
       }, [
@@ -1061,14 +1144,15 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               })) : (openBlock(), createBlock(resolveDynamicComponent(props.footer()), { key: 1 }))
-            ])
+            ], true)
           ]),
           key: "0"
         } : void 0
-      ]), 1040, ["modelValue", "class", "title", "style"]);
+      ]), 1040, ["modelValue", "class", "fullscreen", "style"]);
     };
   }
 });
+const DialogComponent = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-166b4c09"]]);
 const _hoisted_1$4 = { class: "el-message-box__message" };
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "dialog-content",
@@ -1122,7 +1206,7 @@ function createDialog() {
             dialogApp.unmount();
             container.remove();
           };
-          return () => h(_sfc_main$i, {
+          return () => h(DialogComponent, {
             ...dialogOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
@@ -1234,7 +1318,8 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
   }
 });
 const Dot = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-575d79dc"]]);
-const _hoisted_1$3 = { key: 0 };
+const _hoisted_1$3 = ["id"];
+const _hoisted_2$1 = { key: 0 };
 const _sfc_main$f = /* @__PURE__ */ defineComponent({
   __name: "drawer",
   props: /* @__PURE__ */ mergeModels({
@@ -1312,7 +1397,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         onOk: void 0,
         onBeforeOk: void 0,
         onCancel: void 0,
-        simple: void 0
+        title: void 0
       };
     });
     const okLoading = ref(false);
@@ -1345,20 +1430,58 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         modelValue: visible.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
         class: getClass.value,
-        title: props.title,
+        "show-close": false,
         style: { ...props.style }
       }), createSlots({
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default", {}, () => {
             var _a;
             return [
-              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_1$3, toDisplayString(props.content), 1)) : createCommentVNode("", true),
+              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_2$1, toDisplayString(props.content), 1)) : createCommentVNode("", true),
               typeof props.content === "function" ? (openBlock(), createBlock(resolveDynamicComponent((_a = props == null ? void 0 : props.content) == null ? void 0 : _a.call(props)), { key: 1 })) : createCommentVNode("", true)
             ];
-          })
+          }, true)
         ]),
         _: 2
       }, [
+        props.withHeader ? {
+          name: "header",
+          fn: withCtx(({ close, titleId, titleClass }) => [
+            createElementVNode("div", {
+              class: normalizeClass(unref(b)("drawer-header"))
+            }, [
+              renderSlot(_ctx.$slots, "title", {}, () => [
+                createElementVNode("div", {
+                  id: titleId,
+                  class: normalizeClass(["el-drawer__title", [titleClass, unref(b)("drawer-title")]])
+                }, toDisplayString(props.title), 11, _hoisted_1$3)
+              ], true),
+              createVNode(unref(ElSpace), { size: 8 }, {
+                default: withCtx(() => [
+                  props.showClose ? (openBlock(), createBlock(unref(ElButton), {
+                    key: 0,
+                    class: normalizeClass(unref(b)("drawer-button")),
+                    text: "",
+                    circle: "",
+                    onClick: close
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(ElIcon), { size: 16 }, {
+                        default: withCtx(() => [
+                          createVNode(unref(close_default))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }, 8, ["class", "onClick"])) : createCommentVNode("", true)
+                ]),
+                _: 2
+              }, 1024)
+            ], 2)
+          ]),
+          key: "0"
+        } : void 0,
         props.footer ? {
           name: "footer",
           fn: withCtx(() => [
@@ -1386,14 +1509,15 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               })) : (openBlock(), createBlock(resolveDynamicComponent(props.footer()), { key: 1 }))
-            ])
+            ], true)
           ]),
-          key: "0"
+          key: "1"
         } : void 0
-      ]), 1040, ["modelValue", "class", "title", "style"]);
+      ]), 1040, ["modelValue", "class", "style"]);
     };
   }
 });
+const Drawer$1 = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-a9d2ac8f"]]);
 const DEF_OPTIONS = {};
 function createDrawer() {
   const Drawer2 = {
@@ -1411,7 +1535,7 @@ function createDrawer() {
             drawerApp.unmount();
             container.remove();
           };
-          return () => h(_sfc_main$f, {
+          return () => h(Drawer$1, {
             ...dialogOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
@@ -2270,7 +2394,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     hideFoldBtn: { type: Boolean, default: false },
     defaultCollapsed: { type: Boolean, default: void 0 },
     suffix: { type: Boolean, default: true },
-    model: {},
+    size: {},
+    disabled: { type: Boolean },
     rules: {},
     labelPosition: {},
     requireAsteriskPosition: {},
@@ -2283,9 +2408,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     validateOnRuleChange: { type: Boolean },
     hideRequiredAsterisk: { type: Boolean },
     scrollToError: { type: Boolean, default: true },
-    scrollIntoViewOptions: {},
-    size: {},
-    disabled: { type: Boolean }
+    scrollIntoViewOptions: { type: Boolean }
   },
   emits: ["update:modelValue", "search", "reset"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -2658,7 +2781,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Form = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-4c32de90"]]);
+const _Form = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-5ba30556"]]);
 const _hoisted_1$1 = ["data-value", "onClick"];
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "nav-tabs",
@@ -9162,7 +9285,7 @@ const components = {
   Button: _sfc_main$l,
   Card,
   Descriptions: _sfc_main$j,
-  Drawer: _sfc_main$f,
+  Drawer: Drawer$1,
   Dot,
   Tabs,
   InputGroup,
@@ -9171,9 +9294,9 @@ const components = {
   Flex,
   Grid,
   GridItem,
-  Form,
+  Form: _Form,
   PageLayout,
-  Dialog: _sfc_main$i,
+  Dialog: DialogComponent,
   EditTable,
   Table: _Table,
   Tag,
@@ -9182,7 +9305,7 @@ const components = {
 const GiButton = _sfc_main$l;
 const GiCard = Card;
 const GiDescriptions = _sfc_main$j;
-const GiDrawer = _sfc_main$f;
+const GiDrawer = Drawer$1;
 const GiDot = Dot;
 const GiTabs = Tabs;
 const GiInputGroup = InputGroup;
@@ -9191,9 +9314,9 @@ const GiNavTabs = NavTabs;
 const GiFlex = Flex;
 const GiGrid = Grid;
 const GiGridItem = GridItem;
-const GiForm = Form;
+const GiForm = _Form;
 const GiPageLayout = PageLayout;
-const GiDialog = _sfc_main$i;
+const GiDialog = DialogComponent;
 const GiEditTable = EditTable;
 const GiTable = _Table;
 const GiTag = Tag;