m8-framework-mcp 1.0.0 → 1.0.3

package/docs/m8mpdoc-develop/018-EPUI/347/273/204/344/273/266/066-link/351/223/276/346/216/245.md

@@ -1,177 +0,0 @@
-# Link 链接
-
-文字超链接
-
-## 基础用法
-
-基础的文字链接用法。
-
-```html
-<template>
-  <div>
-    <e-link-m href="https://element-plus.org" target="_blank">default</e-link-m>
-    <e-link-m type="primary">primary</e-link-m>
-    <e-link-m type="success">success</e-link-m>
-    <e-link-m type="warning">warning</e-link-m>
-    <e-link-m type="danger">danger</e-link-m>
-    <e-link-m type="info">info</e-link-m>
-  </div>
-</template>
-<style scoped>
-.ep-link {
-  margin-right: 8px;
-}
-.ep-link .ep-icon--right.ep-icon {
-  vertical-align: text-bottom;
-}
-</style>
-```
-
-## 禁用状态
-
-文字链接不可用状态。
-
-```html
-<template>
-  <div>
-    <e-link-m disabled>default</e-link-m>
-    <e-link-m type="primary" disabled>primary</e-link-m>
-    <e-link-m type="success" disabled>success</e-link-m>
-    <e-link-m type="warning" disabled>warning</e-link-m>
-    <e-link-m type="danger" disabled>danger</e-link-m>
-    <e-link-m type="info" disabled>info</e-link-m>
-  </div>
-</template>
-<style scoped>
-.ep-link {
-  margin-right: 8px;
-}
-.ep-link .ep-icon--right.ep-icon {
-  vertical-align: text-bottom;
-}
-</style>
-```
-
-## 下划线
-
-文字链接下划线。
-
-```html
-<template>
-  <div>
-    <e-link-m :underline="false">Without Underline</e-link-m>
-    <e-link-m>With Underline</e-link-m>
-  </div>
-</template>
-<style scoped>
-.ep-link {
-  margin-right: 8px;
-}
-.ep-link .ep-icon--right.ep-icon {
-  vertical-align: text-bottom;
-}
-</style>
-```
-
-## 图标
-
-带图标的链接
-
-TIP
-
-使用 `icon` 属性来为按钮添加图标。 您可以传递组件名称的字符串（提前注册）或组件本身是一个  Vue 组件。   eui4提供了一组图标，您可以在 ep-icon文档里选择
-
-```html
-<template>
-  <div>
-    <e-link-m :icon="Edit">Edit</e-link-m>
-    <e-link-m>
-      Check<e-icon-m class="e-icon--right"><icon-view /></e-icon-m>
-    </e-link-m>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { Edit, View as IconView } from '@epoint-mfe/eui-icons';
-</script>
-
-<style scoped>
-.ep-link {
-  margin-right: 8px;
-}
-</style>
-```
-
-## 按钮链接
-
-当需要按钮样式的链接时，可以使用按钮组件的 `link` 状态。
-
-```html
-<template>
-  <p>Basic link button</p>
-  <div class="flex justify-space-between mb-4 flex-wrap gap-4">
-    <e-button-m v-for="button in buttons" :key="button.text" :type="button.type" link>{{ button.text }}</e-button>
-  </div>
-
-  <p>Disabled link button</p>
-  <div class="flex justify-space-between flex-wrap gap-4">
-    <e-button-m v-for="button in buttons" :key="button.text" :type="button.type" link disabled>{{
-      button.text
-    }}</e-button-m>
-  </div>
-</template>
-
-<script setup lang="ts">
-const buttons = [
-  { type: '', text: 'plain' },
-  { type: 'primary', text: 'primary' },
-  { type: 'success', text: 'success' },
-  { type: 'info', text: 'info' },
-  { type: 'warning', text: 'warning' },
-  { type: 'danger', text: 'danger' },
-] as const;
-</script>
-```
-
-## API
-
-### Attributes
-
-| Name      | Description      | Type                   | Default |
-| :-------- | :--------------- | :--------------------- | :------ |
-| type      | 类型             | `enum`-`'primary' \| 'success' \| 'warning' \| 'danger' \| 'info' \| 'default'`                 | default |
-| underline | 是否下划线       | `boolean`              | true    |
-| disabled  | 是否禁用状态     | `boolean`              | false   |
-| href      | 原生 `href` 属性 | `string`               | —       |
-| icon      | 图标组件         | `string` / `Component` | —       |
-
-### Slots
-
-| Name    | Description    |
-| :------ | :------------- |
-| default | 自定义默认内容 |
-| icon    | 自定义图标组件 |
-
-::: ifdef M84
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/epshowcase/examples/e-link-m"
- frameborder=0
- allowfullscreen class="ui-showcase-iframe">
-</iframe>
-::: endif
-
-<style>
- .ui-showcase-iframe {
-    position: fixed;
-    right: 3.5vw;
-    top: 17%;
-    width: 375px;
-    height: 75vh;
-    box-shadow: 0 0 12px 6px #eee;
-    border-radius: 15px;
- }
- .main .markdown-body {
-    padding: 45px;
-    width: calc(97vw - 661px);
-}
- </style>

package/docs/m8mpdoc-develop/018-EPUI/347/273/204/344/273/266/067-file-upload/346/226/207/344/273/266/344/270/212/344/274/240.md

@@ -1,389 +0,0 @@
-# FileUpload 文件上传
-
-参照 F9 框架的文件上传控件，对 Upload 控件的进一步封装，添加了分片上传的功能。
-
-## 基础用法
-
-使用 `action` 指定上传接口地址，`fileList` 指定已上传的文件列表，`data` 指定上传请求提交的个性化数据。
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-    />
-</template>
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([
-        {
-            name: "图片1.jpg",
-            attachGuid: "c8ecece4-0a99-46dc-b419-fb7050aab4c8",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:17:31",
-            size: 1392528,
-        },
-        {
-            name: "图片2.png",
-            attachGuid: "19314fdd-be3b-42f4-ab7e-78c90b797b2b",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:18:55",
-            size: 79358,
-        },
-    ]);
-</script>
-```
-
-## 单文件上传
-
-通过 `numLimit` 可以控制最大上传文件数。
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        :num-limit="1"
-    />
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([]);
-</script>
-```
-
-## 限制文件大小
-
-通过 `sizeLimit` 可以限制最大可上传的文件大小，单位为 KB 。
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        multiple
-        :size-limit="1024"
-    />
-    <text>最大可上传文件大小为 1024KB</text>
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([]);
-</script>
-```
-
-## 分片上传
-
-通过 `chunk` 可以开启分片上传模式，`chunkSize` 属性可以指定分片的大小
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        chunk
-        :chunk-size="1024"
-    />
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([]);
-</script>
-```
-
-## 非分片模式下计算 MD5
-
-通过 `needMd5` 可以在未开启分片上传模式时，上传请求中也带上文件 MD5
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        need-md5
-    />
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([]);
-</script>
-```
-
-## 拖拽排序
-
-通过 `enableSort` 可以开启文件列表的拖拽排序功能。
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        enable-sort
-        :on-sort-change="handleSortChange"
-    />
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([
-        {
-            name: "图片1.jpg",
-            attachGuid: "c8ecece4-0a99-46dc-b419-fb7050aab4c8",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:17:31",
-            size: 1392528,
-        },
-        {
-            name: "图片2.png",
-            attachGuid: "19314fdd-be3b-42f4-ab7e-78c90b797b2b",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:18:55",
-            size: 79358,
-        },
-    ]);
-
-    const handleSortChange = (files) => {
-        console.log(files);
-    };
-</script>
-```
-
-## 权限控制
-
-通过 `enable-add`、`enable-delete`、`enable-download`、`enable-preview` 可以控制组件上传、删除、下载、预览功能的开启情况。
-
-```html
-<template>
-    <e-file-upload-m
-        v-model:file-list="fileList"
-        action="https://fe.epoint.com.cn/mock/752/eui-vue/uploadFile"
-        :enable-add="false"
-        :enable-delete="true"
-        :enable-download="false"
-        :enable-preview="true"
-        :resolve-preview-url="resolvePreviewUrl"
-    />
-</template>
-
-<script lang="ts" setup>
-    import { ref } from "vue";
-
-    const fileList = ref([
-        {
-            name: "图片1.jpg",
-            attachGuid: "c8ecece4-0a99-46dc-b419-fb7050aab4c8",
-            previewUrl: "https://picsum.photos/800/800/",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:17:31",
-            size: 1392528,
-        },
-        {
-            name: "图片2.png",
-            attachGuid: "19314fdd-be3b-42f4-ab7e-78c90b797b2b",
-            previewUrl: "https://picsum.photos/800/800/",
-            downloadUrl: "https://picsum.photos/800/800/",
-            uploadDate: "2023-10-27 18:18:55",
-            size: 79358,
-        },
-    ]);
-    const resolvePreviewUrl = (file) => {
-        return file.downloadUrl;
-    };
-</script>
-```
-
-## FileUpload API
-
-### Attributes
-
-| Name                              | Description                                                                                           | Type                                                                                    | Default |
-|-----------------------------------|-------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------|---------|
-| `action`                          | 请求的 URL 地址                                                                                       | `string`                                                                                | —       |
-| `data`                            | 请求的附加参数                                                                                        | `Record<string, any>`                                                                   | —       |
-| `multiple`                        | 是否多选                                                                                              | `boolean`                                                                               | `false` |
-| `file-list` / `v-model:file-list` | 默认的已上传文件列表                                                                                  | `UploadFile[]`                                                                          | `[]`    |
-| `auto`                            | 是否自动上传                                                                                          | `boolean`                                                                               | `true`  |
-| `num-limit`                       | 最大可上传文件数                                                                                      | `number`                                                                                | —       |
-| `num-limit-alert`                 | 上传超过最大可上传文件数的文本提示                                                                    | `string`                                                                                | —       |
-| `size-limit`                      | 最大可上传文件大小，单位为`KB`                                                                         | `number`                                                                                | —       |
-| `type-limit`                      | 可上传文件后缀                                                                                        | `string`                                                                                | —       |
-| `accept`                          | 可接受文件类型                                                                                        | `string`                                                                                | —       |
-| `file-name-length-limit`          | 可上传的最大文件名称长度                                                                              | `number`                                                                                | —       |
-| `duplicate`                       | 是否不允许上传重复文件                                                                                | `boolean`                                                                               | `false` |
-| `enable-add`                      | 是否允许新增文件                                                                                      | `boolean`                                                                               | `true`  |
-| `enable-delete`                   | 是否允许删除文件                                                                                      | `boolean`                                                                               | `true`  |
-| `enable-download`                 | 是否允许下载文件                                                                                      | `boolean`                                                                               | `true`  |
-| `enable-preview`                  | 是否允许预览文件                                                                                      | `boolean`                                                                               | `false` |
-| `enable-sort`                     | 是否允许拖拽文件进行排序                                                                              | `boolean`                                                                               | `false` |
-| `need-md5`                        | 是否需要计算 MD5，该属性只有在非分片模式下其效果                                                       | `boolean`                                                                               | `false` |
-| `chunk`                           | 是否开启分片模式果                                                                                    | `boolean`                                                                               | `false` |
-| `chunk-size`                      | 分片大小，单位为 `KB`                                                                                  | `number`                                                                                | `5120`  |
-| `need-chunk-md5`                  | 分片是否计算 MD5，该属性只有在分片模式下起效果                                                         | `boolean`                                                                               | `false` |
-| `need-chunk-local`                | 控制服务端是否将分片存储到本地磁盘上，该属性只有在分片模式下起效果                                     | `boolean`                                                                               | `false` |
-| `show-file-list`                  | 是否显示已上传文件列表                                                                                | `boolean`                                                                               | `true`  |
-| `pick-text`                       | 选择文件按钮文本                                                                                      | `string`                                                                                | —       |
-| `is-data-import`                  | 是否导入模式，为 true 时可直接当导入使用，始终不会显示文件列表                                          | `boolean`                                                                               | `false` |
-| `resolve-download-url`            | 个性化处理下载地址的方法                                                                              | `(url: string) => string`                                                               | —       |
-| `resolve-preview-url`             | 个性化处理预览地址的方法                                                                              | `(data: Record<string, unknown>) => string`                                             | —       |
-| `before-upload`                   | 上传前的钩子函数，接受待上传的文件作为参数。如果返回 `false` 或返回一个被拒绝的 `Promise`，则会中止上传。 | `(rawFile: UploadRawFile) => Awaitable<void \| undefined \| null \| boolean>`           | —       |
-| `before-remove`                   | 删除前的钩子函数，接受待删除的文件作为参数。如果返回 `false` 或返回一个被拒绝的 `Promise`，则会中止删除。 | `(file: UploadFile) => Awaitable<boolean>`                                              | —       |
-| `on-remove`                       | 删除文件时的钩子函数                                                                                  | `(uploadFile: UploadFile, uploadFiles: UploadFile[]) => void`                           | —       |
-| `on-change`                       | 选择文件、上传成功或上传失败时的钩子函数                                                               | `(uploadFile: UploadFile, uploadFiles: UploadFile[]) => void`                           | —       |
-| `on-success`                      | 上传成功时的钩子函数                                                                                  | `(response: any, uploadFile: UploadFile, uploadFiles: UploadFile[]) => void`            | —       |
-| `on-error`                        | 发生错误时的钩子函数                                                                                  | `(error: Error, uploadFile: UploadFile, uploadFiles: UploadFile[]) => void`             | —       |
-| `on-progress`                     | 上传过程中的钩子函数                                                                                  | `(evt: UploadProgressEvent, uploadFile: UploadFile, uploadFiles: UploadFile[]) => void` | —       |
-| `on-sort-change`                  | 排序修改后的钩子函数                                                                                  | `(uploadFiles: UploadFile[]) => void`                                                   | —       |
-| `on-validate`                     | 验证文件时的钩子函数。如果返回 `false` 或返回一个被拒绝的 `Promise`，则会中止上传。                      | `(rawFile: UploadRawFile) => Awaitable<boolean>`                                        | —       |
-
-### Slots
-
-| Name            | Description                      | Type                                                                                           |
-|-----------------|----------------------------------|------------------------------------------------------------------------------------------------|
-| `default`       | 触发文件上传的内容               | -                                                                                              |
-| `file`          | 文件展示内容(含功能图标按钮区域) | `{file: UploadedFile, enableDelete: Boolean, enableDownload: Boolean, enablePreview: Boolean}` |
-| `actions`       | 文件功能按钮内容                 | `{file: UploadedFile, enableDelete: Boolean, enableDownload: Boolean, enablePreview: Boolean}` |
-| `extra-actions` | 额外文件功能按钮内容             | `{file: UploadedFile}`                                                                         |
-
-### Exposes
-
-| Name           | Description                                             | Type                                                                                                                                 |
-|----------------|---------------------------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------|
-| `abort`        | 取消上传请求                                            | `(file: UploadFile) => void`                                                                                                         |
-| `submit`       | 手动上传文件列表                                        | `() => void`                                                                                                                         |
-| `retry`        | 重新上传文件                                            | `(file: UploadFile) => void`                                                                                                         |
-| `clearFiles`   | 清空文件列表（此方法不支持在 `before-upload` 钩子中使用） | ^[Function]`(clearFile = true) => void \| (status?: Array<'ready' \| 'uploading' \| 'success' \| 'fail'>, clearFile = true) => void` |
-| `handleRemove` | 手动移除文件                                            | `(file: UploadFile \| UploadRawFile, removeServer = true) => void`                                                                   |
-| `selectFile`   | 手动触发选择文件                                        | `() => void`                                                                                                                         |
-
-## 请求说明
-
-内置的所有请求统一都是走控件 `action` 属性配置的后端接口，后端接口可通过请求参数中的 `action` 字段来区分是那种请求。
-
-### 文件上传请求
-
-文件上传分为分片模式和非分片模式。非分片模式请求参数如下：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'upload',
-  name: string, // 文件名
-  size: number, // 文件大小
-  type: string, // 文件类型
-  lastModifiedDate: string, // 文件修改时间
-  file: binary // 文件二进制流
-}
-```
-
-分片模式请求参数：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'chunk',
-  name: string, // 文件名
-  size: number, // 文件大小
-  type: string, // 文件类型
-  lastModifiedDate: string, // 文件修改时间
-  chunk: number, // 当前分片序号
-  chunks: number, // 总分片数
-  chunkSize: number, // 分片大小
-  file: binary // 文件二进制流
-}
-```
-
-### 查询文件状态请求
-
-分片模式下，请求前需要发送一个查询分片上传状态的请求，来确认哪些分片已上传。请求参数如下：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'queryFileStatus',
-  fileMD5: string, // 文件 MD5
-  fileName: string, // 文件名
-  fileSize: number, // 文件大小
-  uploadGuid: string, // 文件的 uid
-  lastModifiedDate: string // 文件最后修改时间
-}
-```
-
-### 分片上传结束请求
-
-分片模式下，所有分片上传完成后，需要发送一个结束请求告知服务端所有分片已上传完成。请求参数如下：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'finishUpload',
-  fileMD5: string, // 文件 MD5
-  fileName: string, // 文件名
-  fileSize: number, // 文件大小
-  uploadGuid: string, // 文件的 uid
-  lastModifiedDate: string // 文件最后修改时间
-}
-```
-
-### 删除文件请求
-
-删除文件时的请求。请求参数如下：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'delete',
-  attachGuid: string // 被删除文件的 guid
-}
-```
-
-### 排序请求
-
-排序时的请求。请求参数如下：
-
-<!-- eslint-skip -->
-
-```js
-{
-  action: 'saveSort'
-  sort: string[] // 排序后的文件 guid 数组
-}
-```
-
-::: ifdef M84
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/epshowcase/examples/e-file-upload-m"
- frameborder=0
- allowfullscreen class="ui-showcase-iframe">
-</iframe>
-::: endif
-
-<style>
- .ui-showcase-iframe {
-    position: fixed;
-    right: 3.5vw;
-    top: 17%;
-    width: 375px;
-    height: 75vh;
-    box-shadow: 0 0 12px 6px #eee;
-    border-radius: 15px;
- }
- .main .markdown-body {
-    padding: 45px;
-    width: calc(97vw - 661px);
-}
- </style>