m8-mcp-server 1.0.0 → 1.0.2

package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/053-collapse/346/212/230/345/217/240/351/235/242/346/235/277.md

@@ -1,199 +0,0 @@
-# 组件使用
-
-## collapse 折叠面板
-
-### 介绍
-
--   折叠面板。
-
-### 代码演示
-
-#### 基础用法
-
-通过`v-model`控制展开的面板列表，`activeNames`为数组格式
-
-```html
-<em-collapse v-model="activeNames">
-    <em-collapse-item title="标题1" name="1" is-link>内容</em-collapse-item>
-    <em-collapse-item title="标题2" name="2" is-link>内容</em-collapse-item>
-    <em-collapse-item title="标题3" name="3" disabled is-link>内容</em-collapse-item>
-</em-collapse>
-```
-
-::: ifdef M83
-
-```js
-export default {
-    data() {
-        return {
-            activeNames: ['1']
-        };
-    }
-};
-```
-
-::: endif
-::: ifdef M84
-
-```js
-import { ref } from 'vue';
-const activeNames = ref(['1']);
-```
-
-::: endif
-
-#### 手风琴
-
-通过`accordion`可以设置为手风琴模式，最多展开一个面板，此时`activeName`为字符串格式
-
-```html
-<em-collapse v-model="activeName" accordion>
-    <em-collapse-item title="标题1" name="1" is-link>内容</em-collapse-item>
-    <em-collapse-item title="标题2" name="2" is-link>内容</em-collapse-item>
-    <em-collapse-item title="标题3" name="3" is-link>内容</em-collapse-item>
-</em-collapse>
-```
-
-::: ifdef M83
-
-```js
-export default {
-    data() {
-        return {
-            activeName: '1'
-        };
-    }
-};
-```
-
-::: endif
-::: ifdef M84
-
-```js
-import { ref } from 'vue';
-const activeName = ref('1');
-```
-
-::: endif
-
-#### 自定义标题内容
-
-```html
-<em-collapse v-model="activeNames">
-    <em-collapse-item name="1" is-link>
-        <template #title>
-            <div>
-                标题1
-                <em-icon name="question-o" />
-            </div>
-        </template>
-        内容
-    </em-collapse-item>
-    <em-collapse-item title="标题2" name="2" icon="shop-o" is-link value="内容">内容</em-collapse-item>
-</em-collapse>
-```
-
-::: ifdef M83
-
-```js
-export default {
-    data() {
-        return {
-            activeNames: ['1']
-        };
-    }
-};
-```
-
-::: endif
-::: ifdef M84
-
-```js
-import { ref } from 'vue';
-const activeNames = ref(['1']);
-```
-
-::: endif
-
-### API
-
-#### Collapse Props
-
-| 参数                                                                         |         说明          | 类型                                                           | 默认值  |
-| :--------------------------------------------------------------------------- | :-------------------: | :------------------------------------------------------------- | :------ |
-| v-model ::: ifdef M83 (value) ::: endif ::: ifdef M84 (modelValue) ::: endif | 当前展开面板的 `name` | 手风琴模式：number / string；非手风琴模式：(number / string)[] | -       |
-| accordion                                                                    |  是否开启手风琴模式   | boolean                                                        | `false` |
-| border                                                                       |    是否显示外边框     | boolean                                                        | `true`  |
-
-#### Collapse Events
-
-| 事件名 |      说明      | 回调参数                                 |
-| :----- | :------------: | :--------------------------------------- |
-| change | 切换面板时触发 | activeNames: 类型与 v-model 绑定的值一致 |
-
-#### CollapseItem Props
-
-| 参数          |                 说明                 | 类型            | 默认值  |
-| :------------ | :----------------------------------: | :-------------- | :------ |
-| name          |       唯一标识符，默认为索引值       | number / string | `index` |
-| icon          |     标题栏左侧图标名称或图片链接     | string          | -       |
-| size          |     标题栏大小，可选值为 `large`     | string          | -       |
-| title         |            标题栏左侧内容            | number / string | -       |
-| value         |            标题栏右侧内容            | number / string | -       |
-| label         |            标题栏描述信息            | number / string | -       |
-| border        |            是否显示内边框            | boolean         | `true`  |
-| is-link       | 是否展示标题栏右侧箭头并开启点击反馈 | boolean         | `true`  |
-| disabled      |             是否禁用面板             | boolean         | `false` |
-| content-class |           内容区域额外类名           | string          | -       |
-| title-class   |           左侧标题额外类名           | string          | -       |
-| value-class   |           右侧内容额外类名           | string          | -       |
-| label-class   |           描述信息额外类名           | string          | -       |
-
-#### CollapseItem Slots
-
-| 名称      |             说明              |
-| :-------- | :---------------------------: |
-| default   |           面板内容            |
-| value     |        自定义显示内容         |
-| icon      |         自定义`icon`          |
-| title     |         自定义`title`         |
-| rightIcon | 自定义右侧按钮，默认是`arrow` |
-
-#### CollapseItem 方法
-
-通过 `ref` 可以获取到 `CollapseItem` 实例并调用实例方法，详见组件实例方法。
-
-| 方法名 |                               说明                               | 参数             | 返回值 |
-| :----- | :--------------------------------------------------------------: | :--------------- | :----- |
-| toggle | 切换面试展开状态，传 `true` 为展开，`false` 为收起，不传参为切换 | expand?: boolean | -      |
-
-::: ifdef M83
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/index.html#/modules/m8showcase/examples/em-collapse"
- frameborder=0
- allowfullscreen class="ui-showcase-iframe">
-  </iframe>
-::: endif
-::: ifdef M84
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/m8showcase/examples/em-collapse"
- 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/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/054-grid/345/256/253/346/240/274.md

@@ -1,183 +0,0 @@
-# 组件使用
-
-## grid 宫格
-
-### 介绍
-
--   宫格可以在水平方向上把页面分隔成等宽度的区块，用于展示内容或进行页面导航。
-
-::: ifdef M83
-
--   `v8.3.11`开始支持 weex 端使用
-
-::: endif
-
-### 代码演示
-
-#### 基础用法
-
-通过`icon`属性设置格子内的图标，`text`属性设置文字内容。
-
-```html
-<em-grid>
-    <em-grid-item icon="photo-o" text="文字" />
-    <em-grid-item icon="photo-o" text="文字" />
-    <em-grid-item icon="photo-o" text="文字" />
-    <em-grid-item icon="photo-o" text="文字" />
-</em-grid>
-```
-
-#### 自定义列数
-
-默认一行展示四个格子，可以通过`column-num`自定义列数
-
-```html
-<em-grid :column-num="3">
-    <em-grid-item v-for="value in 6" :key="value" icon="photo-o" text="文字" />
-</em-grid>
-```
-
-#### 自定义内容
-
-通过插槽可以自定义格子展示的内容
-
-```html
-<em-grid :border="false" :column-num="3">
-    <em-grid-item>
-        <em-image src="https://img.yzcdn.cn/vant/apple-1.jpg" />
-    </em-grid-item>
-    <em-grid-item>
-        <em-image src="https://img.yzcdn.cn/vant/apple-2.jpg" />
-    </em-grid-item>
-    <em-grid-item>
-        <em-image src="https://img.yzcdn.cn/vant/apple-3.jpg" />
-    </em-grid-item>
-</em-grid>
-```
-
-#### 正方形格子
-
-设置`square`属性后，格子的高度会和宽度保持一致
-
-```html
-<em-grid square>
-    <em-grid-item v-for="value in 8" :key="value" icon="photo-o" text="文字" />
-</em-grid>
-```
-
-#### 格子间距
-
-通过`gutter`属性设置格子之间的距离
-
-```html
-<em-grid :gutter="10">
-    <em-grid-item v-for="value in 8" :key="value" icon="photo-o" text="文字" />
-</em-grid>
-```
-
-#### 内容横排
-
-将`direction`属性设置为`horizontal`，可以让宫格的内容呈横向排列
-
-```html
-<em-grid direction="horizontal" :column-num="3">
-    <em-grid-item icon="photo-o" text="文字" />
-    <em-grid-item icon="photo-o" text="文字" />
-    <em-grid-item icon="photo-o" text="文字" />
-</em-grid>
-```
-
-#### 页面导航
-
-通过`to`属性设置`vue-router`跳转链接，通过`url`属性设置 `URL` 跳转链接
-
-```html
-<em-grid clickable :column-num="2">
-    <em-grid-item icon="home-o" text="路由跳转" to="./em-cell" />
-    <em-grid-item icon="search" text="URL 跳转" url="./em-loading" />
-</em-grid>
-```
-
-#### 徽标提示
-
-设置`dot`属性后，会在图标右上角展示一个小红点。设置`badge`属性后，会在图标右上角展示相应的徽标
-
-```html
-<em-grid :column-num="2">
-    <em-grid-item icon="home-o" text="文字" dot />
-    <em-grid-item icon="search" text="文字" badge="99+" />
-</em-grid>
-```
-
-### API
-
-#### Grid Props
-
-| 参数       |                   说明                    | 类型            | 默认值     | ::: ifdef M83 weex 端支持 ::: endif |
-| :--------- | :---------------------------------------: | :-------------- | :--------- | :---------------------------------- |
-| column-num |                   列数                    | number / string | `4`        | 是                                  |
-| icon-size  |         图标大小，默认单位为`px`          | number / string | `28px`     | 是                                  |
-| gutter     |      格子之间的间距，默认单位为`px`       | number / string | `0`        | 是                                  |
-| border     |               是否显示边框                | boolean         | `true`     | 是                                  |
-| center     |          是否将格子内容居中显示           | boolean         | `true`     | 是                                  |
-| square     |          是否将格子固定为正方形           | boolean         | `false`    | 是                                  |
-| clickable  |           是否开启格子点击反馈            | boolean         | `false`    | 是                                  |
-| direction  | 格子内容排列的方向，可选值为 `horizontal` | string          | `vertical` | 是                                  |
-
-#### GridItem Props
-
-| 参数        |                                             说明                                              | 类型            | 默认值     | ::: ifdef M83 weex 端支持 ::: endif |
-| :---------- | :-------------------------------------------------------------------------------------------: | :-------------- | :--------- | :---------------------------------- |
-| text        |                                             文字                                              | string          | -          | 是                                  |
-| icon        |                                      图标名称或图片链接                                       | string          | -          | 是                                  |
-| icon-prefix |                      图标类名前缀，同 `Icon` 组件的 `class-prefix` 属性                       | string          | `van-icon` | 否                                  |
-| dot         |                                   是否显示图标右上角小红点                                    | boolean         | `false`    | 是                                  |
-| badge       |                                     图标右上角徽标的内容                                      | number / string | -          | 是                                  |
-| url         |                                     点击后跳转的链接地址                                      | string          | -          | 是                                  |
-| to          | 点击后跳转的目标路由对象，同 `vue-router` 的 `to` 属性，仅支持`path` `query` `replace` `hash` | string / object | -          | 是                                  |
-| replace     |                                 是否在跳转时替换当前页面历史                                  | boolean         | `false`    | 是                                  |
-
-#### GridItem Events
-
-| 事件名 |      说明      | 回调参数     |
-| :----- | :------------: | :----------- |
-| click  | 点击格子时触发 | event: Event |
-
-#### GridItem Slots
-
-| 名称    |         说明         |
-| :------ | :------------------: |
-| default | 自定义宫格的所有内容 |
-| icon    |      自定义图标      |
-| text    |      自定义文字      |
-
-::: ifdef M83
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/index.html#/modules/m8showcase/examples/em-grid"
- frameborder=0
- allowfullscreen class="ui-showcase-iframe">
-  </iframe>
-::: endif
-::: ifdef M84
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/m8showcase/examples/em-grid"
- 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/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/055-countdown/345/200/222/350/256/241/346/227/266.md

@@ -1,289 +0,0 @@
-# 组件使用
-
-## countdown 倒计时
-
-### 介绍
-
--   倒计时。
-
-### 代码演示
-
-#### 基础用法
-
-`time`属性表示倒计时总时长，单位为毫秒
-
-```html
-<em-count-down :time="time" />
-```
-
-::: ifdef M83
-
-```js
-export default {
-    data() {
-        return {
-            time: 30 * 60 * 60 * 1000
-        };
-    }
-};
-```
-
-::: endif
-::: ifdef M84
-
-```js
-import { ref } from 'vue';
-const time = ref(30 * 60 * 60 * 1000);
-```
-
-::: endif
-
-#### 自定义格式
-
-通过`format`属性设置倒计时文本的内容
-
-```html
-<em-count-down :time="time" format="DD 天 HH 时 mm 分 ss 秒" />
-```
-
-#### 毫秒级渲染
-
-倒计时默认每秒渲染一次，设置`millisecond`属性可以开启毫秒级渲染
-
-```html
-<em-count-down millisecond :time="time" format="HH:mm:ss:SS" />
-```
-
-#### 自定义样式
-
-通过插槽自定义倒计时的样式，`timeData`对象格式见下方表格
-
-::: ifdef M83
-
-```html
-<em-count-down :time="time">
-    <template v-slot="{ timeData }">
-        <span class="block">{{ timeData.hours }}</span>
-        <span class="colon">:</span>
-        <span class="block">{{ timeData.minutes }}</span>
-        <span class="colon">:</span>
-        <span class="block">{{ timeData.seconds }}</span>
-    </template>
-</em-count-down>
-
-<style>
-    .colon {
-        display: inline-block;
-        margin: 0 4px;
-        color: #ee0a24;
-    }
-    .block {
-        display: inline-block;
-        width: 22px;
-        color: #fff;
-        font-size: 12px;
-        text-align: center;
-        background-color: #ee0a24;
-    }
-</style>
-```
-
-::: endif
-
-::: ifdef M84
-
-```html
-<em-count-down :time="time">
-    <template #default="{ timeData }">
-        <span class="block">{{ timeData.hours }}</span>
-        <span class="colon">:</span>
-        <span class="block">{{ timeData.minutes }}</span>
-        <span class="colon">:</span>
-        <span class="block">{{ timeData.seconds }}</span>
-    </template>
-</em-count-down>
-
-<script setup>
-    import { ref } from 'vue';
-    const time = ref(30 * 60 * 60 * 1000);
-</script>
-
-<style>
-    .colon {
-        display: inline-block;
-        margin: 0 4px;
-        color: #ee0a24;
-    }
-    .block {
-        display: inline-block;
-        width: 22px;
-        color: #fff;
-        font-size: 12px;
-        text-align: center;
-        background-color: #ee0a24;
-    }
-</style>
-```
-
-::: endif
-
-#### 手动控制
-
-通过 `ref` 获取到组件实例后，可以调用`start`、`pause`、`reset`方法
-
-::: ifdef M83
-
-```html
-<em-count-down ref="countDown" millisecond :time="3000" :auto-start="false" format="ss:SSS" @finish="finish" />
-<em-grid clickable>
-    <em-grid-item text="开始" icon="play-circle-o" @click="start" />
-    <em-grid-item text="暂停" icon="pause-circle-o" @click="pause" />
-    <em-grid-item text="重置" icon="replay" @click="reset" />
-</em-grid>
-<em-toast ref="emToast"></em-toast>
-```
-
-```js
-export default {
-    methods: {
-        start() {
-            this.$refs.countDown.start();
-        },
-        pause() {
-            this.$refs.countDown.pause();
-        },
-        reset() {
-            this.$refs.countDown.reset();
-        },
-        finish() {
-            Toast('倒计时结束');
-        }
-    }
-};
-```
-
-::: endif
-::: ifdef M84
-
-```html
-<em-count-down ref="countDown" millisecond :time="3000" :auto-start="false" format="ss:SSS" @finish="finish" />
-<em-grid clickable>
-    <em-grid-item text="开始" icon="play-circle-o" @click="start" />
-    <em-grid-item text="暂停" icon="pause-circle-o" @click="pause" />
-    <em-grid-item text="重置" icon="replay" @click="reset" />
-</em-grid>
-<em-toast ref="emToastRef"></em-toast>
-```
-
-```js
-import { ref } from 'vue';
-const countDown = ref(null);
-const emToastRef = ref(null);
-
-const start = () => {
-    countDown.value.start();
-};
-const pause = () => {
-    countDown.value.pause();
-};
-const reset = () => {
-    countDown.value.reset();
-};
-const finish = () => {
-    Toast('倒计时结束');
-};
-
-defineExpose({
-    emToastRef
-});
-```
-
-::: endif
-
-### API
-
-#### Props
-
-| 参数        |         说明         | 类型            | 默认值     |
-| :---------- | :------------------: | :-------------- | :--------- |
-| time        | 倒计时时长，单位毫秒 | number / string | `0`        |
-| format      |       时间格式       | string          | `HH:mm:ss` |
-| auto-start  |  是否自动开始倒计时  | boolean         | `true`     |
-| millisecond |  是否开启毫秒级渲染  | boolean         | `false`    |
-
-#### format 格式
-
-| 格式 |     说明     |
-| :--- | :----------: |
-| DD   |     天数     |
-| HH   |     小时     |
-| mm   |     分钟     |
-| ss   |     秒数     |
-| S    | 毫秒（1 位） |
-| SS   | 毫秒（2 位） |
-| SSS  | 毫秒（3 位） |
-
-#### Events
-
-| 事件名                                         |          说明          | 回调参数           |
-| :--------------------------------------------- | :--------------------: | :----------------- |
-| finish                                         |    倒计时结束时触发    | -                  |
-| change                                         |    倒计时变化时触发    | timeData: TimeData |
-| ::: ifdef M84 update:timeData `v8.4` ::: endif | 用于同步 timeData 事件 | timeData: TimeData |
-
-#### Slots
-
-| 名称    |    说明    | SlotProps                                  |
-| :------ | :--------: | :----------------------------------------- |
-| default | 自定义内容 | timeData: TimeData |
-
-#### TimeData 格式
-
-| 名称         |   说明   | 类型   |
-| :----------- | :------: | :----- |
-| days         | 剩余天数 | number |
-| hours        | 剩余小时 | number |
-| minutes      | 剩余分钟 | number |
-| seconds      | 剩余秒数 | number |
-| milliseconds | 剩余毫秒 | number |
-
-#### 方法
-
-通过 `ref` 可以获取到 `CountDown` 实例并调用实例方法，详见组件实例方法
-
-| 方法名 |                            说明                            | 参数 | 返回值 |
-| :----- | :--------------------------------------------------------: | :--- | :----- |
-| start  |                         开始倒计时                         | -    | -      |
-| pause  |                         暂停倒计时                         | -    | -      |
-| reset  | 重设倒计时，若`auto-start`为`true`，重设后会自动开始倒计时 | -    | -      |
-
-::: ifdef M83
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/index.html#/modules/m8showcase/examples/em-count-down"
- frameborder=0
- allowfullscreen class="ui-showcase-iframe">
-  </iframe>
-::: endif
-::: ifdef M84
-<iframe
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/m8showcase/examples/em-count-down"
- 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>