Merge pull request #18 from vipshop/develop

feat: v0.21.1
vipshop · Nov 24, 2019 · 6fff0bf · 6fff0bf
2 parents 11cd6d8 + 858e450
commit 6fff0bf
Show file tree

Hide file tree

Showing 75 changed files with 860 additions and 111 deletions.
diff --git a/.gitignore b/.gitignore
@@ -18,5 +18,4 @@ package-lock.json
 /packages/*/lib
 /material-list.json
 /test/_coverage
-.scannerwork/
 /plugins/vscode/*.vsix
diff --git a/docs/.gitignore b/docs/.gitignore
@@ -0,0 +1,5 @@
+node_modules
+/backup
+package-lock.json
+dist
+
diff --git a/docs/zh-CN/.vuepress/components/block/grid/block.js b/docs/zh-CN/.vuepress/components/block/grid/block.js
@@ -56,6 +56,46 @@ export default {
             }
         }
     },
+    unsupportGrid: {
+        type: 'grid',
+        style: {
+            height: '200px'
+        },
+        blocks: {
+            unsupportGridheaderTitle1: { // 第一列
+                type: 'card',
+                options: {
+                    headerTitle: '卡片类型自带的标题'
+                },
+                style: {
+                    width: 'calc(50% - 10px)',
+                    height: '100%',
+                    'margin-right': '10px'
+                },
+                blocks: {
+                    emptyCardText: {
+                        type: 'component',
+                        options: {
+                            is: 'div',
+                            text: '自定义内容'
+                        }
+                    }
+                }
+            },
+            unsupportGridheaderTitle2: { // 第二列
+                type: 'card',
+                options: {
+                    headerTitle: '卡片类型自带的标题'
+                },
+                style: {
+                    width: 'calc(50% - 10px)',
+                    height: '100%',
+                    'margin-left': '10px'
+                },
+                blocks: ['emptyCardText']
+            }
+        }
+    },
     grid3: {
         type: 'grid',
         style: {

diff --git a/docs/zh-CN/.vuepress/components/changelog/logs.js b/docs/zh-CN/.vuepress/components/changelog/logs.js
@@ -1,14 +1,29 @@
 // 更新日志
 export default [
     {
-        version: '0.20.2',
-        date: '2019.11.7',
+        version: '0.21.1',
+        date: '2019.11.20',
         log: [
+            'feat: 添加nav-left插槽',
+            'feat: 新增drawer抽屉block',
+            'feat: array-simple数据更换',
+            'fix: 解决表格loading弹层 层级问题'
+        ]
+    },
+    {
+        version: '0.20.10',
+        date: '2019.11.18',
+        log: [
+            'feat：增加事件销毁机制，tabs增加监听resize事件',
             'feat: operations支持配置换行展示',
             'feat: 增加block默认data机制',
             'feat: 把field-headimage整合到field-image，并删除field-headimage',
             'feat: block-card、block-component、block-dialog、block-imagelist、block-tabs增加loading效果，可以在该区块的action通过this.showLoading和this.hideLoading来控制',
             'feat：增加图标ams-icon-user',
+            'fix: block-imagelist标题块高度不一致、删除title逻辑判断',
+            'fix: block-grid兼容低级浏览器',
+            'fix：block-chart的图例icon设置为默认图标',
+            'fix: 修复field-select在view状态下，无法匹配值为空的选项',
             'fix: 路由菜单样式',
             'fix: fieldChange无法获取不在资源声明的field的name',
             'fix: 修复列表在有操作按钮的时候，行距过高的问题'

diff --git a/docs/zh-CN/.vuepress/public/index/banner-bg.png b/docs/zh-CN/.vuepress/public/index/banner-bg.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-left.png b/docs/zh-CN/.vuepress/public/index/banner-left.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right01.png b/docs/zh-CN/.vuepress/public/index/banner-right01.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right02.png b/docs/zh-CN/.vuepress/public/index/banner-right02.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right03-03.png b/docs/zh-CN/.vuepress/public/index/banner-right03-03.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right03-04.png b/docs/zh-CN/.vuepress/public/index/banner-right03-04.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right03-05.png b/docs/zh-CN/.vuepress/public/index/banner-right03-05.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right03-06.png b/docs/zh-CN/.vuepress/public/index/banner-right03-06.png
diff --git a/docs/zh-CN/.vuepress/public/index/banner-right03.png b/docs/zh-CN/.vuepress/public/index/banner-right03.png
diff --git a/docs/zh-CN/.vuepress/public/index/footer-01.png b/docs/zh-CN/.vuepress/public/index/footer-01.png
diff --git a/docs/zh-CN/.vuepress/public/index/footer-02.png b/docs/zh-CN/.vuepress/public/index/footer-02.png
diff --git a/docs/zh-CN/.vuepress/public/index/git.png b/docs/zh-CN/.vuepress/public/index/git.png
diff --git a/docs/zh-CN/.vuepress/public/index/start.png b/docs/zh-CN/.vuepress/public/index/start.png
diff --git a/docs/zh-CN/api/default-config.md b/docs/zh-CN/api/default-config.md
@@ -5,7 +5,7 @@ DefaultConfig: DefaultConfig 简化配置
 
 通过简化配置可以将一些常用的配置用`常量`标识，减少重复代码的编写。可以使用ams内部继承的配置，也可以在项目自行配置，在文末自定义有使用说明。
 
-在ams内部目前集成了以下几种简化配置，通过在`Console控制台`打印`ams.configs`也可以查看
+在ams内部目前集成了以下几种简化配置，通过在浏览器控制台`console面板`打印`ams.configs`也可以查看
 
 ## FORM_SUBMIT
 

diff --git a/docs/zh-CN/block/grid.md b/docs/zh-CN/block/grid.md
@@ -21,6 +21,14 @@ Grid: Grid 网格布局
 <block-grid-demo blockName="cardCloumnGrid" onlineDemo="https://codepen.io/w3cmark/pen/JjPBmJd"/>
 </ClientOnly>
 
+### 如何兼容不支持grid布局的浏览器？<Badge text="0.20.7+"/>
+
+不支持grid布局时，ams会把子项按照`inline-block`展示，所以通过给子项配置单独的样式：`width` 和 `height`。
+
+<ClientOnly>
+<block-grid-demo blockName="unsupportGrid" onlineDemo="https://codepen.io/w3cmark/pen/qBBQbJW"/>
+</ClientOnly>
+
 ### 一行三列
 
 > 这个三列默认是由它的子区块blocks个数

diff --git a/docs/zh-CN/field/select.md b/docs/zh-CN/field/select.md
@@ -40,6 +40,7 @@ String，如`"a,b,c"`
 - remoteConfig.isMiniBackfill：最小化options回填，推荐select使用，回填时只会提供当前值对应的options（默认为true）
 - remoteConfig.transform：transform函数，可以定制options数据的组装过程，参数为 $field（当前field的vue实例）、 data（接口数据），返回值为组装好的options
 - remoteConfig.request：request函数（promise或者async函数），可以定制请求、用于一些需要动态请求参数的场景，参数为 $field（当前field的vue实例）、 query（关键字或者值）、isBackfill（是否是回填），返回值通过ams.request请求的完整res
+- remoteConfig.isInitRemoteOptions：是否初始化的时候触发远程搜索
 
 #### 场景一：远程select、关键字搜索、最小化回填、options缓存
 选项值：

diff --git a/examples/README.md b/examples/README.md
@@ -1,11 +1,35 @@
 # 示例列表
 
-## router
+## PC端示例本地开发调试
 ```
-cd ./examples/router
+cd ./router
 npm i
 npm run dev
 ```
 - npm 集成
     - router
-        - 完整示例
+        - 完整示例
+    - dev
+        - 本地开发dev环境
+
+## 移动端示例本地开发调试
+```
+cd ./mobile
+npm i
+npm run dev
+```
+
+## unpkg本地开发调试
+```
+cd ./router
+npm i
+npm run dev
+```
+打开 [http://localhost:9526/examples/unpkg/script.html]()
+
+- 通过脚本集成示例
+    - script.html
+        - 通过脚本集成
+    - all.html
+        - resources、render集中配置在一个block示例
+
diff --git a/examples/router/src/ams-config/cases-block/dragimage-updown.js b/examples/router/src/ams-config/cases-block/dragimage-updown.js
@@ -0,0 +1,20 @@
+import ams from '@ams-team/ams';
+
+ams.block('dragimage-updown', {
+    blocks: {
+        dragImagePicUpDownBlock: {
+            type: 'drag-image-up-down',
+            ctx: 'view',
+            options: {
+                url: 'http://d.vpimg1.com/upcb/2019/11/14/158/ias_234c5f37ab34a15253340464c9ca0d7b.png',
+                width: 768, // 底图宽度
+                height: 368, // 底图高度
+                cutHeight: 200, // 需要裁剪的尺寸高度
+                imgHeight: '368px', // 图片展示宽度
+                top: 10, // 需要裁剪的区域离上面距离
+                ratio: 0.04, // 移动速度
+                showFrame: true // 是否展示裁剪框
+            }
+        }
+    }
+});
diff --git a/examples/router/src/ams-config/cases-block/drawer.js b/examples/router/src/ams-config/cases-block/drawer.js
@@ -0,0 +1,24 @@
+import ams from '@ams-team/ams';
+
+ams.block('drawer', {
+    blocks: {
+        'drawer1': {
+            type: 'component',
+            operations: {
+                drawer1: {
+                    type: 'button',
+                    label: '示例1',
+                    event: 'drawerPop.show'
+                }
+            }
+        },
+        'drawerPop': {
+            type: 'drawer',
+            data: {
+                title: '普通示例1',
+                visible: false
+            }
+        }
+
+    }
+});
diff --git a/examples/router/src/ams-config/cases-block/grid.js b/examples/router/src/ams-config/cases-block/grid.js
@@ -19,7 +19,9 @@ ams.block('grid', {
                 item1: {
                     type: 'component',
                     style: {
-                        background: '#f60'
+                        background: '#f60',
+                        width: '50%',
+                        height: '100%'
                     },
                     options: {
                         'text': 'item1'
@@ -28,7 +30,9 @@ ams.block('grid', {
                 item2: {
                     type: 'component',
                     style: {
-                        background: '#f50'
+                        background: '#f50',
+                        width: '50%',
+                        height: '100%'
                     },
                     options: {
                         'text': 'item2'
@@ -54,6 +58,11 @@ ams.block('grid', {
                     options: {
                         headerTitle: '卡片类型自带的标题'
                     },
+                    style: {
+                        width: 'calc(50% - 10px)',
+                        height: '100%',
+                        'margin-right': '10px'
+                    },
                     blocks: {
                         emptyCardTextGrid21: {
                             type: 'component',
@@ -69,6 +78,11 @@ ams.block('grid', {
                     options: {
                         headerTitle: '卡片类型自带的标题'
                     },
+                    style: {
+                        width: 'calc(50% - 10px)',
+                        height: '100%',
+                        'margin-left': '10px'
+                    },
                     blocks: {
                         emptyCardTextGrid22: {
                             type: 'component',

diff --git a/examples/router/src/ams-config/cases-field/checkbox.js b/examples/router/src/ams-config/cases-field/checkbox.js
@@ -6,7 +6,8 @@ const datas = {
     checkboxDisable: 'c',
     checkboxBorder: 'b,c',
     checkboxButton: 'a,c',
-    radioButton: 'a'
+    radioButton: 'a',
+    remoteCheckbox: 2003
 };
 
 ams.block('checkbox', {
@@ -127,6 +128,18 @@ ams.block('checkbox', {
                             }
                         ]
                     }
+                },
+                remoteCheckbox: {
+                    BASE: 'SELECT_REMOTE',
+                    label: '远程选项',
+                    type: 'checkbox',
+                    remoteConfig: {
+                        action: `${prefix}tag`,
+                        queryKey: 'requiredName',
+                        labelKey: 'name',
+                        isInitEmpty: true,
+                        isMiniBackfill: false,
+                    }
                 }
             }
         }

diff --git a/...c/ams-config/cases-sence/remote-select.js → ...uter/src/ams-config/cases-field/select.js b/...c/ams-config/cases-sence/remote-select.js → ...uter/src/ams-config/cases-field/select.js
@@ -1,7 +1,7 @@
 import ams from '@ams-team/ams';
 import { prefix } from '@/utils';
 
-ams.block('remote-select', {
+ams.block('select', {
     resources: {
         select: {
             api: {
@@ -27,6 +27,17 @@ ams.block('remote-select', {
                         }
                     }
                 },
+                normalSelectView: {
+                    type: 'select',
+                    ctx: 'view',
+                    label: '本地selectView',
+                    props: {
+                        options: {
+                            e: '北京烤鸭',
+                            0: '哈哈哈'
+                        }
+                    }
+                },
                 normalSingleSelectEdit: {
                     type: 'select',
                     label: '本地select单选',
@@ -35,9 +46,37 @@ ams.block('remote-select', {
                         multiple: false,
                         clearable: true,
                         options: [{
-                            label: '黄金糕',
-                            value: 'a',
-                            disabled: true
+                            label: '全部',
+                            value: ''
+                        }, {
+                            label: '双皮奶',
+                            value: 'b'
+                        }, {
+                            label: '蚵仔煎',
+                            value: 'c'
+                        }, {
+                            label: '龙须面',
+                            value: 'd',
+                            border: true
+                        }, {
+                            label: '北京烤鸭',
+                            value: 'e'
+                        }, {
+                            label: '哈哈哈1',
+                            value: 1
+                        }]
+                    },
+                    get(val) { return val },
+                    set(val) { return val },
+                },
+                normalSingleSelectView: {
+                    type: 'select',
+                    ctx: 'view',
+                    label: '本地selectView',
+                    props: {
+                        options: [{
+                            label: '全部',
+                            value: ''
                         }, {
                             label: '双皮奶',
                             value: 'b'
@@ -128,19 +167,6 @@ ams.block('remote-select', {
                         queryKey: 'requiredName',
                         labelKey: 'name'
                     }
-                },
-                remoteCheckbox: {
-                    ctx: 'edit',
-                    BASE: 'SELECT_REMOTE',
-                    label: 'checkbox',
-                    type: 'checkbox',
-                    remoteConfig: {
-                        action: `${prefix}tag`,
-                        queryKey: 'requiredName',
-                        labelKey: 'name',
-                        isInitEmpty: true,
-                        isMiniBackfill: false,
-                    }
                 }
             }
         }
@@ -158,12 +184,14 @@ ams.block('remote-select', {
         }
     },
     data: {
-        selectView: 2003,
-        selectEdit: 2003,
-        singleSelectEdit: 2003,
+        selectView: 2002,
+        selectEdit: 1,
+        singleSelectEdit: 2,
         singleSelectView: 2003,
         normalSelectEdit: 0,
-        remoteCheckbox: 2003
+        normalSelectView: 0,
+        normalSingleSelectEdit: '',
+        normalSingleSelectView: ''
     },
     events: {
         submit: '@create'