m8-framework-mcp 1.0.0

package/docs/m8mpdoc-develop/017-/345/206/205/347/275/256/347/273/204/344/273/266/021-movable-area.md

@@ -0,0 +1,25 @@
+### movable-area
+
+可拖动区域
+
+由于平台小程序的架构是逻辑层与视图层分离，使用 js 监听拖动时会引发逻辑层和视图层的频繁通讯，影响性能。为了方便高性能的实现拖动，平台特封装了`movable-area`组件。
+
+`movable-area`指代可拖动的范围，在其中内嵌`movable-view`组件用于指示可拖动的区域。
+
+即手指/鼠标按住`movable-view`拖动或双指缩放，但拖不出`movable-area`规定的范围。
+
+当然也可以不拖动，而使用代码来触发`movable-view`在`movable-area`里的移动缩放。
+
+**平台差异说明**
+
+| H5  | 微信小程序 | 支付宝小程序 |
+| :-: | :--------: | :----------: |
+|  √  |     √      |      √       |
+
+**属性说明**
+
+| 属性名     | 类型    | 默认值 | 说明                                                                                            |
+| :--------- | :------ | :----- | :---------------------------------------------------------------------------------------------- |
+| scale-area | Boolean | false  | 当里面的 movable-view 设置为支持双指缩放时，设置此值可将缩放手势生效区域修改为整个 movable-area |
+
+**注意：movable-area 必须设置 width 和 height 属性，不设置默认为 10px**

package/docs/m8mpdoc-develop/017-/345/206/205/347/275/256/347/273/204/344/273/266/022-page-meta.md

@@ -0,0 +1,80 @@
+#### page-meta
+
+页面属性配置节点，用于指定页面的一些属性、监听页面事件。可部分替代 pages.json 的功能。
+
+从微信基础库 2.9.0 开始，新增了`page-meta`组件，它是一个特殊的标签，有点类似 html 里的 header 标签。页面的背景色、原生导航栏的参数，都可以写在`page-meta`里。
+
+从某种意义讲，`page-meta`对 pages.json 有一定替代作用，可以让页面的配置和页面内容代码写在一个 vue 文件中。它还可以实现通过变量绑定来控制页面配置。但它的性能不如 pages.json 的配置，在新页面加载时，渲染速度还是 pages.json 方式的写法更快。
+
+`page-meta`只能是页面内的第一个节点。可以配合 `navigation-bar`组件一同使用。
+
+**平台差异说明**
+
+| H5  | 微信小程序 | 支付宝小程序 |
+| :-: | :--------: | :----------: |
+|  √  |     √      |      √       |
+
+**属性说明**
+
+| 属性                    | 类型        | 默认值 | 必填 | 说明                                                                                            | 版本要求/平台差异说明     |
+| :---------------------- | :---------- | :----- | :--- | :---------------------------------------------------------------------------------------------- | :------------------------ |
+| background-text-style   | string      |        | 否   | 下拉背景字体、loading 图的样式，仅支持 dark 和 light                                            | 微信基础库 2.9.0 支持     |
+| background-color        | string      |        | 否   | 窗口的背景色，必须为十六进制颜色值                                                              | 微信基础库 2.9.0 支持     |
+| background-color-top    | string      |        | 否   | 顶部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持                                             | 微信基础库 2.9.0 支持     |
+| background-color-bottom | string      |        | 否   | 底部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持                                             | 微信基础库 2.9.0 支持     |
+| scroll-top              | string      | ""     | 否   | 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置                         | 微信基础库 2.9.0 支持     |
+| scroll-duration         | number      | 300    | 否   | 滚动动画时长                                                                                    | 微信基础库 2.9.0 支持     |
+| page-style              | string      | ""     | 否   | 页面根节点样式，页面根节点是所有页面节点的祖先节点，相当于 HTML 中的 body 节点                  | 微信基础库 2.9.0、H5 支持 |
+| root-font-size          | string      | ""     | 否   | 页面的根字体大小，页面中的所有 rem 单位，将使用这个字体大小作为参考值，即 1rem 等于这个字体大小 | 微信基础库 2.9.0、H5 支持 |
+| @resize                 | eventhandle |        | 否   | 页面尺寸变化时会触发 resize 事件， event.detail = { size: { windowWidth, windowHeight } }       | 微信基础库 2.9.0 支持     |
+| @scroll                 | eventhandle |        | 否   | 页面滚动时会触发 scroll 事件， event.detail = { scrollTop }                                     | 微信基础库 2.9.0 支持     |
+| @scrolldone             | eventhandle |        | 否   | 如果通过改变 scroll-top 属性来使页面滚动，页面滚动结束后会触发 scrolldone 事件                  | 微信基础库 2.9.0 支持     |
+
+**注意**
+
+-   `<page-meta>` 目前支持的配置仅为上表所列，并不支持所有 page.json 的配置
+-   `<page-meta>` 与 pages.json 的设置相冲突时，会覆盖 page.json 的配置
+
+#### 示例代码
+
+```html
+<template>
+    <page-meta
+        :background-text-style="bgTextStyle"
+        :background-color="bgColor"
+        :background-color-top="bgColorTop"
+        :background-color-bottom="bgColorBottom"
+        :scroll-top="scrollTop"
+        page-style="color: green"
+        root-font-size="16px"
+    >
+        <navigation-bar
+            :title="nbTitle"
+            :loading="nbLoading"
+            :front-color="nbFrontColor"
+            :background-color="nbBackgroundColor"
+        />
+    </page-meta>
+    <view class="content"></view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                bgTextStyle: 'dark',
+                scrollTop: '200rpx',
+                bgColor: '#ff0000',
+                bgColorTop: '#00ff00',
+                bgColorBottom: '#0000ff',
+                nbTitle: '标题',
+                nbLoading: false,
+                nbFrontColor: '#000000',
+                nbBackgroundColor: '#ffffff'
+            };
+        },
+        onLoad() {},
+        methods: {}
+    };
+</script>
+```

package/docs/m8mpdoc-develop/017-/345/206/205/347/275/256/347/273/204/344/273/266/023-navigation-bar.md

@@ -0,0 +1,58 @@
+#### navigation-bar
+
+页面导航条配置节点，用于指定导航栏的一些属性。只能是 `page-meta` 组件内的第一个节点，需要配合它一同使用。
+
+**平台差异说明**
+
+| H5  | 微信小程序 | 支付宝小程序 |
+| :-: | :--------: | :----------: |
+|  √  |  √ 2.9.0+  |      √       |
+
+**属性说明**
+
+| 属性                        | 类型   | 默认值   | 必填 | 说明                                                                      | 最低版本              |
+| :-------------------------- | :----- | :------- | :--- | :------------------------------------------------------------------------ | :-------------------- |
+| title                       | string |          | 否   | 导航条标题                                                                | 微信基础库 2.9.0 支持 |
+| loading                     | string | false    | 否   | 是否在导航条显示 loading 加载提示                                         | 微信基础库 2.9.0 支持 |
+| front-color                 | string |          | 否   | 导航条前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 | 微信基础库 2.9.0 支持 |
+| background-color            | string |          | 否   | 导航条背景颜色值，有效值为十六进制颜色                                    | 微信基础库 2.9.0 支持 |
+| color-animation-duration    | number | 0        | 否   | 改变导航栏颜色时的动画时长，默认为 0 （即没有动画效果）                   | 微信基础库 2.9.0 支持 |
+| color-animation-timing-func | string | "linear" | 否   | 改变导航栏颜色时的动画方式，支持 linear 、 easeIn 、 easeOut 和 easeInOut | 微信基础库 2.9.0 支持 |
+
+**注意**
+
+-   `navigation-bar` 目前支持的配置仅为上表所列，并不支持 page.json 中关于导航栏的所有配置
+-   `navigation-bar` 与 pages.json 的设置相冲突时，会覆盖 page.json 的配置
+
+#### 示例代码
+
+```html
+<template>
+    <page-meta>
+        <navigation-bar
+            :title="nbTitle"
+            :loading="nbLoading"
+            :front-color="nbFrontColor"
+            :background-color="nbBackgroundColor"
+            :color-animation-duration="2000"
+            color-animation-timing-func="easeIn"
+        />
+    </page-meta>
+    <view class="content"></view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                nbTitle: '标题',
+                nbLoading: false,
+                nbFrontColor: '#000000',
+                nbBackgroundColor: '#ffffff'
+            };
+        },
+        onLoad() {},
+        methods: {}
+    };
+</script>
+```

package/docs/m8mpdoc-develop/018-EPUI/347/273/204/344/273/266/0-/344/273/213/347/273/215.md

@@ -0,0 +1,92 @@
+# EUI4.0 移动端组件库 介绍
+
+## 介绍
+
+**EUI4.0 移动端组件库** 是基于 **M8.4 移动前端框架** 跨端 UI 组件库。`M8.4.4`版本之后支持.
+
+设计规范使用 [EUI4.0 设计规范](https://www.figma.com/design/B6xrs3nOclNE3SGumxeoxF/2025EUI4.0%E6%8D%A2%E8%82%A4)；
+
+组件参数、事件、插槽等均与 [PC Vue3 框架 EUI4.0 组件库](http://192.168.219.170/docs/vue/latest/component/guide/introduction.html)规范趋同；
+
+---
+
+## 目标
+
+EUI4.0 移动端组件库 旨在为公司后台开发者提供一套与 PC Vue3 框架 EUI4.0 趋同的，高效、灵活的组件解决方案，帮助快速构建移动应用。
+
+同时，由于我们组件库的参数、事件、插槽等均与 PC Vue3 框架 EUI4.0 组件库规范趋同，因此开发者可以更轻松地在移动端和 PC 端之间进行代码复用和迁移。
+
+### 移动端组件与 PC 使用差异：
+
+- 将 PC 端组件 `<e-xx>` 替换为移动端组件 `<e-xx-m>`
+
+- 将 PC 端组件 `<ep-xx>` 替换为移动端组件 `<ep-xx-m>`
+
+- 将 PC 端 import 的路径中的 `@epoint-fe/eui-components` 替换为 `@epoint-mfe/eui-components`
+
+- `@epoint-mfe/eui-components` 导出的相关 API 使用移动端版本
+
+- 移动端组件的样式和交互方式可能与 PC 端有所不同，开发者需要根据实际移动端组件文档进行调整。
+
+### PC 端代码示例：
+
+```html
+<template>
+    <e-form label-width="120px">
+        <e-form-item label="手机号">
+            <ep-input v-model="input" placeholder="Please input" :desensitization-type="DESENDATATYPE_MOBILE_PHONE" />
+        </e-form-item>
+
+        <e-form-item label="身份证号">
+            <ep-input v-model="input2" placeholder="Please input" desensitization-type="ID_CARD" />
+        </e-form-item>
+
+        <e-button type="primary" @click="getInputValue">获取输入值</e-button>
+    </e-form>
+</template>
+
+<script lang="ts" setup>
+    import { ref } from 'vue';
+    import { DESENDATATYPE_MOBILE_PHONE, EMessage } from '@epoint-fe/eui-components';
+
+    const input = ref('17215683972');
+    const input2 = ref('612300190001010000');
+
+    const getInputValue = () => {
+        EMessage.success(`手机号:${input.value}`);
+        EMessage.success(`身份证号:${input2.value}`);
+    };
+</script>
+```
+
+### 移动端代码示例：
+
+```html
+<template>
+    <e-form-m>
+        <e-form-item-m label="手机号">
+            <ep-input-m v-model="input" placeholder="Please input" :desensitization-type="DESENDATATYPE_MOBILE_PHONE" />
+        </e-form-item-m>
+
+        <e-form-item-m label="身份证号">
+            <ep-input-m v-model="input2" placeholder="Please input" desensitization-type="ID_CARD" />
+        </e-form-item-m>
+
+        <e-button-m type="primary" @click="getInputValue">获取输入值</e-button-m>
+    </e-form-m>
+</template>
+
+<script lang="ts" setup>
+    import { ref } from 'vue';
+    import { DESENDATATYPE_MOBILE_PHONE, EMessageM } from '@epoint-mfe/eui-components';
+
+    const input = ref('17215683972');
+    const input2 = ref('612300190001010000');
+
+    const getInputValue = () => {
+        EMessageM.success(`手机号:${input.value}`);
+        EMessageM.success(`身份证号:${input2.value}`);
+    };
+</script>
+```
+

package/docs/m8mpdoc-develop/018-EPUI/347/273/204/344/273/266/000-/351/200/232/347/224/250/346/240/267/345/274/217.md

@@ -0,0 +1,9 @@
+## EPUI 全局样式引入
+
+以`ejs.m8.mobileframe`为例，在项目入口app.vue中全局引入样式。
+
+```html
+<style>
+@import '@epoint-mfe/eui-components/src/styles/common.root.scss';
+</style>
+```