@hexinfo/ares-ui/README.md

## 安装依赖 ``` npm -g install yarn

# Ares
goframe admin ui library

## 安装依赖
```
npm -g install yarn

yarn install
```

### 本地运行
```
npm run serve
```

### 编译打包
```
npm run build
```
### 生成API
> 1. 需启动后台服务
> 2. 确认API文档路径（package.json -> scripts -> api）配置正确
```
npm run api
```

### 开发使用debugger、console
> package.json配置
```
"rules": {
  "no-debugger": 0,
  "no-console": 0
}
```

### IE兼容性
> vue.config.js配置
```
# 打包的时候vue.js、vue-router.js排除在外，然后再index.html里面单独引用
configureWebpack:{
    externals: {
        'vue': 'Vue',
        'vue-router': 'VueRouter'
    }
},

# babel配置,node_module模块非es5语法转成es5语法
transpileDependencies:[
    "@hex/gf-ui",
    "sm-crypto"
]
```


### vue-grid-layout 存在拉取无法拖拽到尾部情况处理
注意:只能在组中项目使用,否则容易报错
参考:[手动修复npm中bug](https://juejin.cn/post/7020302035207602183)
安装patch-package
```
yarn add patch-package -D
```
package.json 下修改

```
//添加postinstall
"scripts": {
    "postinstall": "patch-package"
  }
```

常见目录patches/vue-grid-layout+2.4.0.patch,代码如下

```
diff --git a/node_modules/vue-grid-layout/dist/vue-grid-layout.common.js b/node_modules/vue-grid-layout/dist/vue-grid-layout.common.js
index c25562f..d9f203a 100644
--- a/node_modules/vue-grid-layout/dist/vue-grid-layout.common.js
+++ b/node_modules/vue-grid-layout/dist/vue-grid-layout.common.js
@@ -12243,7 +12243,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
      * @return {Object} x and y in grid units.
      */
     // TODO check if this function needs change in order to support rtl.
-    calcXY: function calcXY(top, left) {
+    calcXY: function calcXY(top, left,width,height) {
       var colWidth = this.calcColWidth(); // left = colWidth * x + margin * (x + 1)
       // l = cx + m(x+1)
       // l = cx + mx + m
@@ -12255,8 +12255,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
       var x = Math.round((left - this.margin[0]) / (colWidth + this.margin[0]));
       var y = Math.round((top - this.margin[1]) / (this.rowHeight + this.margin[1])); // Capping
 
-      x = Math.max(Math.min(x, this.cols - this.innerW), 0);
-      y = Math.max(Math.min(y, this.maxRows - this.innerH), 0);
+      const _width  = width||this.innerW
+                const _height  = height|| this.innerH
+                x = Math.max(Math.min(x, this.cols - _width), 0);
+                y = Math.max(Math.min(y, this.maxRows - _height), 0);
       return {
         x: x,
         y: y
```