saturn-ui/lib/IceWrapper/index.js

🪐 一款轻量级、模块化的Web可视化UI组件库（含大屏、GIS、图表、视频、后台等模块） 👍

import { defineComponent, ref, watch, nextTick, openBlock, createElementBlock, createElementVNode, normalizeStyle, createCommentVNode, provide, normalizeClass, createVNode, unref, renderSlot, computed, inject } from 'vue';

const withInstall = (main, extra) => {
    main.install = (app) => {
        for (const comp of [main, ...Object.values(extra ?? {})]) {
            app.component(comp.name, comp);
        }
    };
    if (extra) {
        for (const [key, comp] of Object.entries(extra)) {
            main[key] = comp;
        }
    }
    return main;
};

const _hoisted_1$2 = {
    key: 0,
    class: "ice-icon"
};
const _hoisted_2 = ["data-icon"];
var script$3 = defineComponent({
    props: {
        icon: { type: null, required: true },
        size: { type: null, required: false, default: () => 16 }
    },
    setup(__props) {
        const props = __props;
        const show = ref(true);
        watch(props, () => {
            show.value = false;
            nextTick(() => {
                show.value = true;
            });
        });
        return (_ctx, _cache) => {
            return (show.value)
                ? (openBlock(), createElementBlock("span", _hoisted_1$2, [
                    createElementVNode("span", {
                        class: "iconify",
                        "data-icon": __props.icon,
                        style: normalizeStyle({ fontSize: __props.size + 'px' })
                    }, null, 12, _hoisted_2)
                ]))
                : createCommentVNode("v-if", true);
        };
    }
});

script$3.__file = "packages/IceIcon/index.vue";

const IceIcon = withInstall(script$3, { name: 'IceIcon' });

const _hoisted_1$1 = { class: "ice-wrapper-1" };
var script$2 = defineComponent({
    props: {
        visible: { type: Boolean, required: false, default: false },
        direction: { type: String, required: false, default: 'left' }
    },
    setup(__props) {
        const props = __props;
        const show = ref(props.visible);
        function change() {
            show.value = !show.value;
        }
        const itemnum = ref(0);
        provide('itemnum', itemnum);
        provide('direction', props.direction);
        return (_ctx, _cache) => {
            return (openBlock(), createElementBlock("div", _hoisted_1$1, [
                createElementVNode("div", {
                    class: normalizeClass(["wrap", [__props.direction == 'right' ? 'wrap-right' : 'wrap-left', show.value ? (__props.direction == 'right' ? 'showright' : 'showleft') : __props.direction == 'right' ? 'hideright' : 'hideleft']])
                }, [
                    createVNode(unref(IceIcon), {
                        icon: `icon-park-outline:double-${__props.direction}`,
                        style: normalizeStyle(`transform: ${show.value ? '' : 'rotate(180deg)'}`),
                        size: 30,
                        class: "icon",
                        onClick: change
                    }, null, 8, ["icon", "style"]),
                    renderSlot(_ctx.$slots, "default")
                ], 2)
            ]));
        };
    }
});

script$2.__file = "packages/IceWrapper/wrapper1/index.vue";

const _hoisted_1 = { class: "ice-wrapper-2" };
var script$1 = defineComponent({
    props: {
        visible: { type: Boolean, required: false, default: true },
        direction: { type: String, required: false, default: 'left' }
    },
    setup(__props) {
        const props = __props;
        const show = ref(props.visible);
        function change() {
            show.value = !show.value;
        }
        const iconstyle = computed(() => {
            const style = {
                transform: show.value ? '' : 'rotate(180deg)'
            };
            if (show.value) {
                return style;
            }
            if (props.direction == 'left') {
                style.right = '-30px';
            }
            if (props.direction == 'right') {
                style.right = 'auto';
                style.left = '-30px';
            }
            if (props.direction == 'down') {
                style.top = '-50px';
            }
            return style;
        });
        const itemnum = ref(0);
        provide('itemnum', itemnum);
        provide('direction', props.direction);
        return (_ctx, _cache) => {
            return (openBlock(), createElementBlock("div", _hoisted_1, [
                createElementVNode("div", {
                    class: normalizeClass(["wrap", [`wrap-${__props.direction}`, show.value ? `show${__props.direction}` : `hide${__props.direction}`]])
                }, [
                    createVNode(unref(IceIcon), {
                        icon: `icon-park-outline:double-${__props.direction}`,
                        style: normalizeStyle(unref(iconstyle)),
                        size: 20,
                        class: "icon",
                        onClick: change
                    }, null, 8, ["icon", "style"]),
                    renderSlot(_ctx.$slots, "default")
                ], 2)
            ]));
        };
    }
});

script$1.__file = "packages/IceWrapper/wrapper2/index.vue";

var script = defineComponent({
    setup(__props) {
        const itemnum = inject('itemnum');
        const direction = inject('direction');
        itemnum.value++;
        const style = computed(() => {
            const style = {};
            if (direction == 'down') {
                style.width = `${100 / itemnum.value}%`;
            }
            else {
                style.height = `${100 / itemnum.value}%`;
            }
            return style;
        });
        return (_ctx, _cache) => {
            return (openBlock(), createElementBlock("div", {
                style: normalizeStyle(unref(style))
            }, [
                renderSlot(_ctx.$slots, "default")
            ], 4));
        };
    }
});

script.__file = "packages/IceWrapper/wrapperItem/index.vue";

const IceWrapper = withInstall(script$2, { name: 'IceWrapper' });
const IceWrapper2 = withInstall(script$1, { name: 'IceWrapper2' });
const IceWrapperItem = withInstall(script, { name: 'IceWrapperItem' });

export { IceWrapper, IceWrapper2, IceWrapperItem, IceWrapper as default };