exploria-ui-mcp-server 2.1.4 → 2.2.6

package/dist/components/advanced/e_rolling_follow/Document.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import DemoBox from '@/components/DemoBox/DemoBox.vue';
-import Using from './Using.vue';
-import UsingRaw from './Using.vue?raw';
-import PageLayout from '@/components/PageLayout.vue';
-</script>
-
-<template>
-    <PageLayout>
-        <DemoBox title="介绍">
-            <h2>ERollingFollow 滚动跟随</h2>
-            <p>滚动跟随组件用于在滚动页面时，某个元素跟随滚动而滚动。</p>
-        </DemoBox>
-        <DemoBox :code="UsingRaw" title="基本用法">
-            <Using />
-            <template #description>
-                按钮有五种类型：主按钮、次按钮、虚线按钮、文本按钮和链接按钮。主按钮在同一个操作区域最多出现一次。
-            </template>
-        </DemoBox>
-    </PageLayout>
-</template>

package/dist/components/advanced/e_rolling_follow/Using.vue

@@ -1,54 +0,0 @@
-<script setup lang="ts">
-import { ERollingFollow } from 'exploria-ui';
-import { ref } from 'vue';
-
-const currentIndex = ref(25);
-const itemHeight = 30;
-const count = 50;
-</script>
-
-<template>
-    <div>
-        {{ currentIndex }}
-        <ERollingFollow
-            :style="{ height: `${itemHeight * 10}px` }"
-            :item-height="itemHeight"
-            v-model="currentIndex"
-        >
-            <template #bg>
-                <div
-                    style="background-color: rgb(64, 244, 115)"
-                    :style="{
-                        height: `${itemHeight}px`,
-                    }"
-                >
-                    {{ currentIndex }}
-                </div>
-            </template>
-
-            <template #default>
-                <div
-                    v-for="(item, index) of count"
-                    :key="item"
-                    :style="{
-                        height: `${itemHeight}px`,
-                    }"
-                    style="
-                        background-color: rgba(215, 152, 103, 0.18);
-                        display: grid;
-                        place-items: center;
-                        overflow: hidden;
-                    "
-                >
-                    {{ index }}
-                </div>
-            </template>
-        </ERollingFollow>
-    </div>
-</template>
-
-<style scoped lang="scss">
-.parallax-scrolling {
-    height: 300px;
-}
-</style>

package/dist/components/advanced/e_virtual_list/ComprehensiveCase.vue

@@ -1,209 +0,0 @@
-<script setup lang="ts">
-import { ECheckbox, EInput, EVirtualList } from 'exploria-ui';
-import { computed, reactive, ref } from 'vue';
-
-const eventMap = {
-    GET: Array.from({ length: 20 }, (_, index) => {
-        return {
-            label: '获取' + index,
-            code: 'api_get' + index,
-        };
-    }),
-    POST: Array.from({ length: 34 }, (_, index) => {
-        return {
-            label: '提交' + index,
-            code: 'api_post' + index,
-        };
-    }),
-    DELETE: Array.from({ length: 14 }, (_, index) => {
-        return {
-            label: '删除' + index,
-            code: 'api_delete' + index,
-        };
-    }),
-} as {
-    [category: string]: {
-        label: string;
-        code: string;
-    }[];
-};
-
-const searchText = ref('');
-
-const colCount = ref(3);
-
-interface Row {
-    rowKey: string;
-    type: 'category' | 'eventNameList';
-    items: { label: string; value?: string }[];
-}
-
-const computedData = computed<Row[]>(() => {
-    const list: Row[] = [];
-
-    for (const category in eventMap) {
-        const matchedList = eventMap[category]!.filter((item) =>
-            item.label.includes(searchText.value)
-        );
-
-        if (matchedList.length) {
-            // 添加标题
-            list.push({
-                rowKey: category,
-                type: 'category',
-                items: [{ label: category }],
-            });
-            // 根据 colCount 来构建每一行数据
-            for (
-                let rowIndex = 0;
-                rowIndex < Math.ceil(matchedList.length / colCount.value);
-                rowIndex++
-            ) {
-                // 一行数据，其中包含 colCount 个元素
-                const eventListInRow = matchedList.slice(
-                    rowIndex * colCount.value,
-                    (rowIndex + 1) * colCount.value
-                );
-
-                // 构建 rowKey
-                const rowKey = eventListInRow.reduce((a, b) => a + b.code, '');
-                list.push({
-                    rowKey,
-                    type: 'eventNameList',
-                    items: eventListInRow.map((item) => {
-                        return { label: item.label, value: item.code };
-                    }),
-                });
-            }
-        }
-    }
-    return list;
-});
-
-const handleSizeChange = (width: number) => {
-    if (width <= 370) {
-        colCount.value = 1;
-    } else if (width < 800) {
-        colCount.value = 2;
-    } else {
-        colCount.value = 3;
-    }
-};
-
-const selectedMap = reactive<{
-    [value: string]: boolean;
-}>({});
-
-const selectedAll = computed({
-    get() {
-        const selectedCount = Object.entries(selectedMap).filter(
-            (item) => item[1]
-        ).length;
-        const allCount = Object.values(eventMap).flat().length;
-        return selectedCount === allCount && allCount !== 0;
-    },
-    set(checked) {
-        // 全选的是所有原始数据，而不是搜索过滤过的数据
-        const eventList = Object.values(eventMap).flat();
-
-        eventList.forEach((item) => {
-            selectedMap[item.code] = checked;
-        });
-    },
-});
-</script>
-
-<template>
-    <div class="comprehensive-case">
-        <div class="top">
-            <ECheckbox v-model="selectedAll"> 全选</ECheckbox>
-            <EInput
-                type="text"
-                v-model="searchText"
-                placeholder="请输入"
-                clearable
-            >
-                <template #prefix>
-                    <i class="iconfont icon-seacrh" style="font-size: 15px" />
-                </template>
-            </EInput>
-        </div>
-        <EVirtualList
-            v-size-ob="(width: number) => handleSizeChange(width)"
-            :data="computedData"
-            :container-height="270"
-            :item-height="30"
-        >
-            <template #row="{ row }: { row: Row }">
-                <div
-                    v-if="row.type === 'category'"
-                    class="category"
-                    :key="row.rowKey"
-                >
-                    {{ row.items[0]!.label }}
-                </div>
-                <div v-else class="row">
-                    <div
-                        class="col"
-                        v-for="item of row.items"
-                        :key="row.rowKey + item.value"
-                    >
-                        <ECheckbox
-                            :model-value="selectedMap[item.value!] ?? false"
-                            @update:model-value="
-                                (checked) =>
-                                    (selectedMap[item.value!] = checked)
-                            "
-                        >
-                            {{ item.label }}
-                        </ECheckbox>
-                    </div>
-                    <!-- 占位 -->
-
-                    <!-- @ts-ignore -->
-                    <div
-                        class="col"
-                        v-for="i in colCount - row.items.length"
-                        :key="i"
-                    />
-                </div>
-            </template>
-            <template #empty></template>
-        </EVirtualList>
-    </div>
-</template>
-
-<style scoped lang="scss">
-@import 'iconfont/iconfont.css';
-
-.comprehensive-case {
-    .top {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        margin-bottom: 10px;
-
-        .one-input {
-            width: 230px;
-            height: 30px;
-        }
-    }
-
-    .e-virtual-list {
-        .category {
-            font-size: 13px;
-            color: #606060;
-        }
-
-        .row {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-
-            .col {
-                flex: 1 0 0;
-            }
-        }
-    }
-}
-</style>

package/dist/components/advanced/e_virtual_list/Document.vue

@@ -1,68 +0,0 @@
-<script setup lang="ts">
-import DemoBox from '@/components/DemoBox/DemoBox.vue';
-import Using from './Using.vue';
-import UsingRaw from './Using.vue?raw';
-import PageLayout from '@/components/PageLayout.vue';
-import DynamicData from './DynamicData.vue';
-import DynamicDataCode from './DynamicData.vue?raw';
-import ComprehensiveCase from './ComprehensiveCase.vue';
-import ComprehensiveCaseCode from './ComprehensiveCase.vue?raw';
-import APITable from '@/components/APITable.vue';
-</script>
-
-<template>
-    <PageLayout>
-        <DemoBox title="介绍">
-            <h2>EVirtualList 虚拟滚动</h2>
-            <p>
-                虚拟滚动组件，用于高效渲染大量数据，只渲染可视区域内的数据，提高性能。
-            </p>
-        </DemoBox>
-        <DemoBox :code="UsingRaw" title="基本用法">
-            <Using />
-            <template #description>
-                基本的虚拟滚动用法，展示静态数据列表。
-            </template>
-        </DemoBox>
-        <DemoBox :code="DynamicDataCode" title="当数据动态时">
-            <DynamicData />
-            <template #description>
-                当数据动态变化时，虚拟滚动会自动更新。</template
-            >
-        </DemoBox>
-        <DemoBox :code="ComprehensiveCaseCode" title="综合案例">
-            <ComprehensiveCase />
-            <template #description> 虚拟滚动的综合使用案例。</template>
-        </DemoBox>
-        <APITable
-            :data="[
-                {
-                    subTitle: 'EVirtualList Props',
-                    list: [
-                        {
-                            name: 'data',
-                            description: '数据数组，每个项必须包含rowKey属性',
-                            type: 'T[]',
-                            defaultValue: '[]',
-                            required: true,
-                        },
-                        {
-                            name: 'containerHeight',
-                            description: '容器高度，必须是itemHeight的整数倍',
-                            type: 'number',
-                            defaultValue: 'undefined',
-                            required: true,
-                        },
-                        {
-                            name: 'itemHeight',
-                            description: '每个项的高度',
-                            type: 'number',
-                            defaultValue: 'undefined',
-                            required: true,
-                        },
-                    ],
-                },
-            ]"
-        />
-    </PageLayout>
-</template>

package/dist/components/advanced/e_virtual_list/DynamicData.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import { EVirtualList } from 'exploria-ui';
-import { computed, ref } from 'vue';
-
-const length = ref(100);
-
-const data = computed(() =>
-    Array.from({ length: length.value }, (_, index) => {
-        return {
-            rowKey: index,
-            name: 'name' + index,
-        };
-    })
-);
-</script>
-
-<template>
-    <div class="dynamic-data">
-        <button @click="length++">添加数据</button>
-        数据长度: {{ data.length }}
-        <EVirtualList
-            :data="data"
-            :container-height="150"
-            :item-height="30"
-            #row="{ row }"
-        >
-            <!-- @ts-ignore -->
-            <div class="list-item">{{ row.name }}</div>
-        </EVirtualList>
-    </div>
-</template>
-
-<style scoped lang="scss">
-.dynamic-data {
-    .e-virtual-list {
-        .list-item {
-            height: 100%;
-            background-color: #99bef6;
-        }
-    }
-}
-</style>

package/dist/components/advanced/e_virtual_list/Using.vue

@@ -1,32 +0,0 @@
-<script setup lang="ts">
-import { EVirtualList } from 'exploria-ui';
-
-const data = Array.from({ length: 6 }, (_, index) => {
-    return {
-        rowKey: index.toString(),
-        name: 'name' + index,
-    };
-});
-</script>
-
-<template>
-    <EVirtualList
-        :data="data"
-        :container-height="150"
-        :item-height="30"
-        #row="{ row }"
-    >
-        <!-- TODO row 的类型丢失了 -->
-        <!-- @ts-ignore -->
-        <div class="list-item">{{ row?.name }}</div>
-    </EVirtualList>
-</template>
-
-<style scoped lang="scss">
-.e-virtual-list {
-    .list-item {
-        height: 100%;
-        background-color: #99bef6;
-    }
-}
-</style>

package/dist/components/advanced/e_virtual_list/iconfont/iconfont.css

@@ -1,19 +0,0 @@
-@font-face {
-    font-family: 'iconfont'; /* Project id 5031666 */
-    src:
-        url('iconfont.woff2?t=1758898037535') format('woff2'),
-        url('iconfont.woff?t=1758898037535') format('woff'),
-        url('iconfont.ttf?t=1758898037535') format('truetype');
-}
-
-.iconfont {
-    font-family: 'iconfont' !important;
-    font-size: 16px;
-    font-style: normal;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-seacrh:before {
-    content: '\e68d';
-}

package/dist/components/advanced/e_watermark/AutoSize.vue

@@ -1,89 +0,0 @@
-<script setup lang="ts">
-import { EWatermark } from 'exploria-ui';
-</script>
-
-<template>
-    <div class="demo-container">
-        <!-- 短文本自动尺寸 -->
-        <EWatermark
-            text="短文本"
-            font-color="rgba(0, 0, 255, 0.2)"
-            :font-size="16"
-            :gap="15"
-        >
-            <div class="demo-box blue">
-                <span>短文本自动尺寸</span>
-            </div>
-        </EWatermark>
-
-        <!-- 长文本自动尺寸 -->
-        <EWatermark
-            text="这是一段很长的水印文本"
-            font-color="rgba(255, 0, 0, 0.2)"
-            :font-size="18"
-            :gap="15"
-        >
-            <div class="demo-box red">
-                <span>长文本自动尺寸</span>
-            </div>
-        </EWatermark>
-
-        <!-- 多行文本自动尺寸 -->
-        <EWatermark
-            :text="['多行水印', '第二行很长的文本内容', '第三行']"
-            font-color="rgba(0, 128, 0, 0.2)"
-            :font-size="16"
-            :gap="15"
-        >
-            <div class="demo-box green">
-                <span>多行文本自动尺寸</span>
-            </div>
-        </EWatermark>
-
-        <!-- 指定高度，自动宽度 -->
-        <EWatermark
-            text="指定高度，自动宽度的水印文本"
-            font-color="rgba(128, 0, 128, 0.2)"
-            :font-size="16"
-            :height="150"
-            :gap="15"
-        >
-            <div class="demo-box purple">
-                <span>指定高度，自动宽度</span>
-            </div>
-        </EWatermark>
-    </div>
-</template>
-
-<style scoped lang="scss">
-.demo-container {
-    display: flex;
-    gap: 20px;
-    flex-wrap: wrap;
-}
-
-.demo-box {
-    width: 300px;
-    height: 200px;
-    border-radius: 8px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    &.blue {
-        background-color: #e6f7ff;
-    }
-
-    &.red {
-        background-color: #fff2f0;
-    }
-
-    &.green {
-        background-color: #f6ffed;
-    }
-
-    &.purple {
-        background-color: #f9f0ff;
-    }
-}
-</style>

package/dist/components/advanced/e_watermark/BasicUsing.vue

@@ -1,9 +0,0 @@
-<script setup lang="ts">
-import { EWatermark } from 'exploria-ui';
-</script>
-
-<template>
-    <EWatermark text="朵朵朵朵" font-color="rgba(255, 255, 255, 1)">
-        <img src="@/assets/author_avatar.png" alt="" />
-    </EWatermark>
-</template>

package/dist/components/advanced/e_watermark/CustomFont.vue

@@ -1,73 +0,0 @@
-<script setup lang="ts">
-import { EWatermark } from 'exploria-ui';
-</script>
-
-<template>
-    <div class="demo-container">
-        <!-- 衬线字体 -->
-        <EWatermark
-            text="Serif字体水印"
-            font-family="Times New Roman, serif"
-            :font-size="20"
-            :gap="15"
-        >
-            <div class="demo-box">
-                <span>Serif字体</span>
-            </div>
-        </EWatermark>
-
-        <!-- 无衬线字体 -->
-        <EWatermark
-            text="Sans-serif字体水印"
-            font-family="Arial, sans-serif"
-            :font-size="20"
-            :gap="15"
-        >
-            <div class="demo-box">
-                <span>Sans-serif字体</span>
-            </div>
-        </EWatermark>
-
-        <!-- 等宽字体 -->
-        <EWatermark
-            text="Monospace字体水印"
-            font-family="Courier New, monospace"
-            :font-size="20"
-            :gap="15"
-        >
-            <div class="demo-box">
-                <span>Monospace字体</span>
-            </div>
-        </EWatermark>
-
-        <!-- 手写体 -->
-        <EWatermark
-            text="Cursive字体水印"
-            font-family="Brush Script MT, cursive"
-            :font-size="20"
-            :gap="15"
-        >
-            <div class="demo-box">
-                <span>Cursive字体</span>
-            </div>
-        </EWatermark>
-    </div>
-</template>
-
-<style scoped lang="scss">
-.demo-container {
-    display: flex;
-    gap: 20px;
-    flex-wrap: wrap;
-}
-
-.demo-box {
-    width: 300px;
-    height: 200px;
-    background-color: #f5f7fa;
-    border-radius: 8px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-</style>