exploria-ui-mcp-server 2.1.4 → 2.2.6

package/public/components/data/e_image/Document.vue

@@ -1,71 +0,0 @@
-<script setup lang="ts">
-import DemoBox from '@/components/DemoBox/DemoBox.vue';
-import src from './Using.vue?raw';
-import Using from './Using.vue';
-import PageLayout from '@/components/PageLayout.vue';
-import APITable from '@/components/APITable.vue';
-
-// API表格数据
-const apiData = [
-    {
-        subTitle: 'EImage Props',
-        list: [
-            {
-                name: 'src',
-                description: '图片地址',
-                type: 'string',
-                required: true,
-                defaultValue: '-',
-            },
-            {
-                name: 'previewable',
-                description: '是否可预览',
-                type: 'boolean',
-                required: false,
-                defaultValue: 'true',
-            },
-            {
-                name: 'tip',
-                description: '预览提示文字',
-                type: 'string',
-                required: false,
-                defaultValue: '预览',
-            },
-        ],
-    },
-];
-</script>
-
-<template>
-    <PageLayout>
-        <DemoBox title="介绍">
-            <h2>EImage 图片</h2>
-            <p>图片组件用于展示图片。</p>
-        </DemoBox>
-        <DemoBox :code="src" title="基本用法">
-            <Using />
-            <template #description>
-                图片组件用于展示图片，支持点击预览功能。
-            </template>
-        </DemoBox>
-        <APITable :data="apiData" />
-    </PageLayout>
-</template>
-
-<style scoped lang="scss">
-.e-image-demo {
-    display: flex;
-    flex-direction: row;
-    overflow: auto;
-
-    .left {
-        flex: 1;
-        overflow: auto;
-        padding: 30px;
-    }
-
-    .right {
-        width: 260px;
-    }
-}
-</style>

package/public/components/data/e_image/Using.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import { EImage } from 'exploria-ui';
-
-const src = new URL('./img.png', import.meta.url).pathname;
-</script>
-
-<template>
-    <div class="using">
-        <EImage :src="src" previewable />
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.using {
-    .e-image {
-        display: block;
-        height: 100px;
-        width: 100px;
-    }
-}
-</style>

package/public/components/data/e_list/BasicUsage.vue

@@ -1,18 +0,0 @@
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        v-slot="{ row }"
-    >
-        {{ row.name }}
-    </EList>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>

package/public/components/data/e_list/CustomCheckboxUsage.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { EList, EMessage } from 'exploria-ui';
-</script>
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        selectable
-        @update:selectedList="
-            (selectedList) =>
-                EMessage.success(`选中了 ${selectedList.join(', ')}`)
-        "
-        v-slot="{ row }"
-    >
-        {{ row.name }}
-    </EList>
-</template>

package/public/components/data/e_list/CustomEmptyDataUsage.vue

@@ -1,38 +0,0 @@
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>
-<template>
-    <EList :data="[]" border>
-        <template #empty>
-            <div
-                style="
-                    display: flex;
-                    flex-direction: column;
-                    align-items: center;
-                    color: #999;
-                "
-            >
-                <svg
-                    width="60"
-                    height="60"
-                    viewBox="0 0 1024 1024"
-                    style="margin-bottom: 10px"
-                >
-                    <path
-                        d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                        fill="currentColor"
-                    />
-                    <path
-                        d="M464 416h112c4.4 0 8-3.6 8-8V352c0-4.4-3.6-8-8-8H464c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm0 160h112c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H464c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8z"
-                        fill="currentColor"
-                    />
-                    <path
-                        d="M512 536c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"
-                        fill="currentColor"
-                    />
-                </svg>
-                <div>暂无数据</div>
-            </div>
-        </template>
-    </EList>
-</template>

package/public/components/data/e_list/CustomRowUsage.vue

@@ -1,64 +0,0 @@
-<template>
-    <EList
-        :data="[
-            {
-                id: 1,
-                name: '张三',
-                email: 'zhangsan@example.com',
-                role: '管理员',
-                avatar: 'https://via.placeholder.com/40',
-            },
-            {
-                id: 2,
-                name: '李四',
-                email: 'lisi@example.com',
-                role: '编辑',
-                avatar: 'https://via.placeholder.com/40',
-            },
-            {
-                id: 3,
-                name: '王五',
-                email: 'wangwu@example.com',
-                role: '访客',
-                avatar: 'https://via.placeholder.com/40',
-            },
-        ]"
-        border
-        show-divider
-    >
-        <template #default="{ row }">
-            <div style="display: flex; align-items: center; width: 100%">
-                <img
-                    :src="row.avatar"
-                    alt="avatar"
-                    style="
-                        width: 40px;
-                        height: 40px;
-                        border-radius: 50%;
-                        margin-right: 15px;
-                    "
-                />
-                <div style="flex: 1">
-                    <div style="font-weight: bold">{{ row.name }}</div>
-                    <div style="font-size: 12px; color: #666">
-                        {{ row.email }}
-                    </div>
-                </div>
-                <span style="color: #1890ff">{{ row.role }}</span>
-            </div>
-        </template>
-    </EList>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>
-
-<style scoped lang="scss">
-h3 {
-    margin: 0 0 15px 0;
-    font-size: 16px;
-    font-weight: bold;
-    color: var(--e-text-color-primary);
-}
-</style>

package/public/components/data/e_list/DividerUsage.vue

@@ -1,20 +0,0 @@
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        show-divider
-    >
-        <template #default="{ row }">
-            {{ row.name }}
-        </template>
-    </EList>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>

package/public/components/data/e_list/Document.vue

@@ -1,261 +0,0 @@
-<script setup lang="ts">
-import DemoBox from '@/components/DemoBox/DemoBox.vue';
-import PageLayout from '@/components/PageLayout.vue';
-import APITable from '@/components/APITable.vue';
-
-// 导入独立示例组件和源代码
-import basicUsageSrc from './BasicUsage.vue?raw';
-import BasicUsage from './BasicUsage.vue';
-import dividerUsageSrc from './DividerUsage.vue?raw';
-import DividerUsage from './DividerUsage.vue';
-import sizeUsageSrc from './SizeUsage.vue?raw';
-import SizeUsage from './SizeUsage.vue';
-import singleSelectUsageSrc from './SingleSelectUsage.vue?raw';
-import SingleSelectUsage from './SingleSelectUsage.vue';
-import multipleSelectUsageSrc from './MultipleSelectUsage.vue?raw';
-import MultipleSelectUsage from './MultipleSelectUsage.vue';
-import customCheckboxUsageSrc from './CustomCheckboxUsage.vue?raw';
-import CustomCheckboxUsage from './CustomCheckboxUsage.vue';
-import customRowUsageSrc from './CustomRowUsage.vue?raw';
-import CustomRowUsage from './CustomRowUsage.vue';
-import emptyDataUsageSrc from './EmptyDataUsage.vue?raw';
-import EmptyDataUsage from './EmptyDataUsage.vue';
-import customEmptyDataUsageSrc from './CustomEmptyDataUsage.vue?raw';
-import CustomEmptyDataUsage from './CustomEmptyDataUsage.vue';
-import eventUsageSrc from './EventUsage.vue?raw';
-import EventUsage from './EventUsage.vue';
-</script>
-
-<template>
-    <PageLayout>
-        <DemoBox title="介绍">
-            <h2>EList 列表</h2>
-            <p>列表组件用于展示数据列表，支持多种功能和样式定制。</p>
-        </DemoBox>
-        <DemoBox :code="basicUsageSrc" title="基本用法">
-            <BasicUsage />
-            <template #description>
-                最基础的列表展示，仅显示数据内容。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="dividerUsageSrc" title="显示分割线">
-            <DividerUsage />
-            <template #description>
-                列表项之间显示分割线，便于区分不同项。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="sizeUsageSrc" title="不同尺寸">
-            <SizeUsage />
-            <template #description>
-                支持大、中、小三种尺寸，适应不同场景需求。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="singleSelectUsageSrc" title="单选模式">
-            <SingleSelectUsage />
-            <template #description>
-                支持单选功能，可通过点击选择列表项。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="multipleSelectUsageSrc" title="多选模式">
-            <MultipleSelectUsage />
-            <template #description>
-                支持多选功能，可通过点击选择多个列表项。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="customCheckboxUsageSrc" title="自定义复选框">
-            <CustomCheckboxUsage />
-            <template #description>
-                支持自定义复选框样式，满足个性化需求。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="customRowUsageSrc" title="自定义行内容">
-            <CustomRowUsage />
-            <template #description>
-                支持自定义行内容，可展示复杂的数据结构。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="emptyDataUsageSrc" title="空数据状态">
-            <EmptyDataUsage />
-            <template #description>
-                当列表数据为空时，显示默认的空状态提示。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="customEmptyDataUsageSrc" title="自定义空数据状态">
-            <CustomEmptyDataUsage />
-            <template #description>
-                支持自定义空数据状态，可展示个性化的空状态提示。
-            </template>
-        </DemoBox>
-
-        <DemoBox :code="eventUsageSrc" title="事件监听">
-            <EventUsage />
-            <template #description>
-                支持行点击事件，可响应用户的交互操作。
-            </template>
-        </DemoBox>
-
-        <APITable
-            :data="[
-                {
-                    subTitle: 'EList Props',
-                    list: [
-                        {
-                            name: 'data',
-                            description: '列表数据',
-                            type: 'T[]',
-                            defaultValue: '[]',
-                            required: true,
-                        },
-                        {
-                            name: 'size',
-                            description: '列表尺寸',
-                            type: 'large | medium | small',
-                            defaultValue: 'medium',
-                            required: false,
-                        },
-                        {
-                            name: 'border',
-                            description: '是否显示边框',
-                            type: 'boolean',
-                            defaultValue: 'false',
-                            required: false,
-                        },
-                        {
-                            name: 'showDivider',
-                            description: '是否显示分割线',
-                            type: 'boolean',
-                            defaultValue: 'false',
-                            required: false,
-                        },
-                        {
-                            name: 'selectable',
-                            description: '是否可选择',
-                            type: 'boolean',
-                            defaultValue: 'false',
-                            required: false,
-                        },
-                        {
-                            name: 'multiple',
-                            description: '是否支持多选',
-                            type: 'boolean',
-                            defaultValue: 'false',
-                            required: false,
-                        },
-                        {
-                            name: 'modelValue',
-                            description: '已选中的项',
-                            type: 'T | T[]',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'rowHeight',
-                            description: '每行高度',
-                            type: 'number',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                    ],
-                },
-                {
-                    subTitle: 'EList Events',
-                    list: [
-                        {
-                            name: 'update:modelValue',
-                            description: '选中项变化事件，参数：value: T | T[]',
-                            type: 'Function',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'row-click',
-                            description:
-                                '点击行事件，参数：row: T, index: number',
-                            type: 'Function',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'row-dblclick',
-                            description:
-                                '双击行事件，参数：row: T, index: number',
-                            type: 'Function',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'row-mouseenter',
-                            description:
-                                '鼠标悬停行事件，参数：row: T, index: number',
-                            type: 'Function',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'row-mouseleave',
-                            description:
-                                '鼠标离开行事件，参数：row: T, index: number',
-                            type: 'Function',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                    ],
-                },
-                {
-                    subTitle: 'EList Slots',
-                    list: [
-                        {
-                            name: 'default',
-                            description:
-                                '自定义行内容，参数：row: T, index: number',
-                            type: 'Slot',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'checkbox',
-                            description:
-                                '自定义复选框，参数：row: T, checked: boolean',
-                            type: 'Slot',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                        {
-                            name: 'empty',
-                            description: '自定义空数据状态',
-                            type: 'Slot',
-                            defaultValue: 'undefined',
-                            required: false,
-                        },
-                    ],
-                },
-            ]"
-        />
-    </PageLayout>
-</template>
-
-<style scoped lang="scss">
-@use '@/style/global' as global;
-
-h1 {
-    font-size: 24px;
-    font-weight: bold;
-    margin-bottom: 20px;
-    color: var(--e-text-color-primary);
-}
-
-p {
-    font-size: 14px;
-    color: var(--e-text-color-regular);
-    margin-bottom: 30px;
-    line-height: 1.5;
-}
-</style>

package/public/components/data/e_list/EmptyDataUsage.vue

@@ -1,3 +0,0 @@
-<template>
-    <EList :data="[]" border> </EList>
-</template>

package/public/components/data/e_list/EventUsage.vue

@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { EList, EMessage } from 'exploria-ui';
-</script>
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        border
-        @row-click="
-            (row, index) =>
-                EMessage.success('点击了第 ' + (index + 1) + ' 行: ' + row.name)
-        "
-    >
-        <template #default="{ row }">
-            {{ row.name }}
-        </template>
-    </EList>
-</template>

package/public/components/data/e_list/MultipleSelectUsage.vue

@@ -1,22 +0,0 @@
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        selectable
-        multiple
-        border
-    >
-        <template #default="{ row }">
-            {{ row.name }}
-        </template>
-    </EList>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>

package/public/components/data/e_list/SingleSelectUsage.vue

@@ -1,21 +0,0 @@
-<template>
-    <EList
-        :data="[
-            { id: 1, name: '列表项1' },
-            { id: 2, name: '列表项2' },
-            { id: 3, name: '列表项3' },
-            { id: 4, name: '列表项4' },
-            { id: 5, name: '列表项5' },
-        ]"
-        :selectable="true"
-        border
-    >
-        <template #default="{ row }">
-            {{ row.name }}
-        </template>
-    </EList>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-</script>

package/public/components/data/e_list/SizeUsage.vue

@@ -1,35 +0,0 @@
-<template>
-    <div class="example-container">
-        <h4>大尺寸</h4>
-        <EList :data="basicData" size="large" border>
-            <template #default="{ row }">
-                {{ row.name }}
-            </template>
-        </EList>
-
-        <h4>中尺寸</h4>
-        <EList :data="basicData" size="medium" border>
-            <template #default="{ row }">
-                {{ row.name }}
-            </template>
-        </EList>
-
-        <h4>小尺寸</h4>
-        <EList :data="basicData" size="small" border>
-            <template #default="{ row }">
-                {{ row.name }}
-            </template>
-        </EList>
-    </div>
-</template>
-
-<script setup lang="ts">
-import { EList } from 'exploria-ui';
-
-// 基础数据
-const basicData = [
-    { id: 1, name: '列表项1' },
-    { id: 2, name: '列表项2' },
-    { id: 3, name: '列表项3' },
-];
-</script>

package/public/components/data/e_media_viewer/Document.vue

@@ -1,39 +0,0 @@
-<script setup lang="ts">
-import DemoBox from '@/components/DemoBox/DemoBox.vue';
-import src from './Using.vue?raw';
-import Using from './Using.vue';
-import PageLayout from '@/components/PageLayout.vue';
-</script>
-
-<template>
-    <PageLayout>
-        <DemoBox title="介绍">
-            <h2>EMediaViewer 媒体查看器</h2>
-            <p>媒体查看器组件用于展示图片、视频等媒体内容。</p>
-        </DemoBox>
-        <DemoBox :code="src" title="基本用法">
-            <Using />
-            <template #description>
-                按钮有五种类型：主按钮、次按钮、虚线按钮、文本按钮和链接按钮。主按钮在同一个操作区域最多出现一次。
-            </template>
-        </DemoBox>
-    </PageLayout>
-</template>
-
-<style scoped lang="scss">
-.time-picker-demo {
-    display: flex;
-    flex-direction: row;
-    overflow: auto;
-
-    .left {
-        flex: 1;
-        overflow: auto;
-        padding: 30px;
-    }
-
-    .right {
-        width: 260px;
-    }
-}
-</style>