feat: 添加拖拽

l-x-f · Aug 31, 2021 · 3f77871 · 3f77871
1 parent 00f209c
commit 3f77871
Show file tree

Hide file tree

Showing 23 changed files with 2,746 additions and 58 deletions.
diff --git a/.cz-config.js b/.cz-config.js
@@ -0,0 +1,45 @@
+module.exports = {
+  // 修改主题选择
+  types: [
+    { value: 'feat', name: 'feat:添加新功能' },
+    { value: 'fix', name: 'fix:Bug修复' },
+    { value: 'delete', name: 'delete:删除代码，接口' },
+    {
+      value: 'docs',
+      name: 'docs:  变更的只有文档，比如README.md等'
+    },
+    { value: 'test', name: 'test:添加一个测试，包括单元测试、集成测试等' },
+    {
+      value: 'style',
+      name: 'style:  空格, 分号等格式修复（注意不是 css 修改）'
+    },
+    { value: 'ci', name: 'ci:ci配置，脚本文件等更新' },
+    {
+      value: 'refactor',
+      name: 'refactor:代码重构（即不是新增功能，也不是修改bug的代码变动）'
+    },
+    { value: 'perf', name: 'perf:优化相关，比如提升性能、体验' },
+    { value: 'chore', name: 'chore:改变构建流程、或者增加依赖库、工具等' },
+    { value: 'revert', name: 'revert:代码回退' }
+  ],
+  // 构建对话
+  messages: {
+    type: '选择一种你的提交类型(必选):',
+    scope: '选择一个更改范围(可选):',
+    // used if allowCustomScopes is true
+    customScope: '自定义更改范围(可选):',
+    subject: '提交说明(必填):\n',
+    body: '长说明，使用"|"换行(可选)：\n',
+    breaking: '非兼容性说明 (可选):\n',
+    footer: '关联关闭的issue，例如：#31, #34(可选):\n',
+    confirmCommit: '确定提交说明?'
+  },
+  // 是否允许自定义更改范围
+  allowCustomScopes: true,
+  // 允许中断的改变
+  allowBreakingChanges: ['feat', 'fix'],
+  // 修改主题描述字数限制
+  subjectLimit: 100,
+  // 选择跳过的步骤
+  skipQuestions: ['scope', 'customScope', 'body', 'breaking', 'footer']
+}
diff --git a/commitlint.config.js b/commitlint.config.js
@@ -0,0 +1,14 @@
+module.exports = {
+  extends: ['@commitlint/config-conventional'],
+  rules: {
+    // 提交主题类型
+    'type-enum': [
+      2,
+      'always',
+      ['feat', 'perf', 'fix', 'docs', 'style', 'refactor', 'test', 'chore', 'revert', 'build', 'ci'] // 主题含义见 /.cz-config.js
+    ],
+    'subject-full-stop':
+     [0, 'never'], // 主题句号
+    'subject-case': [0, 'never'] // 主题案例
+  }
+}
diff --git a/dist/index.esm.js b/dist/index.esm.js
diff --git a/dist/index.js b/dist/index.js
@@ -16297,10 +16297,13 @@
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
           _a$percent = _a.percent,
           percent = _a$percent === void 0 ? 1 : _a$percent,
-          rest = __rest(_a, ["x1", "y1", "x2", "y2", "zlevel", "percent"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["x1", "y1", "x2", "y2", "zlevel", "percent", "draggable"]);
 
       var shape = new Line({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           x1: x1,
           y1: y1,
@@ -16335,9 +16338,12 @@
           height = _a$height === void 0 ? 0 : _a$height,
           _a$zlevel = _a.zlevel,
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
-          rest = __rest(_a, ["x", "y", "width", "height", "zlevel"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["x", "y", "width", "height", "zlevel", "draggable"]);
 
       var shape = new Rect({
+        draggable: draggable,
         zlevel: zlevel,
         shape: {
           x: x,
@@ -16369,10 +16375,13 @@
           cy = _a$cy === void 0 ? 0 : _a$cy,
           _a$zlevel = _a.zlevel,
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
-          rest = __rest(_a, ["r", "cx", "cy", "zlevel"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["r", "cx", "cy", "zlevel", "draggable"]);
 
       var shape = new Circle({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           cx: cx,
           cy: cy,
@@ -16406,12 +16415,15 @@
           endAngle = _a$endAngle === void 0 ? 360 : _a$endAngle,
           _a$zlevel = _a.zlevel,
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
           _a$clockwise = _a.clockwise,
           clockwise = _a$clockwise === void 0 ? true : _a$clockwise,
-          rest = __rest(_a, ["r", "cx", "cy", "startAngle", "endAngle", "zlevel", "clockwise"]);
+          rest = __rest(_a, ["r", "cx", "cy", "startAngle", "endAngle", "zlevel", "draggable", "clockwise"]);
 
       var shape = new Arc({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           cx: cx,
           cy: cy,
@@ -16443,11 +16455,14 @@
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
           _a$isClose = _a.isClose,
           isClose = _a$isClose === void 0 ? true : _a$isClose,
-          rest = __rest(_a, ["paths", "zlevel", "isClose"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["paths", "zlevel", "isClose", "draggable"]);
 
       var PathShape = isClose ? Polygon : Polyline;
       var shape = new CompoundPath({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           paths: [new PathShape({
             shape: {
@@ -16474,10 +16489,13 @@
           _ref$points = _ref.points,
           points = _ref$points === void 0 ? [] : _ref$points,
           _ref$zlevel = _ref.zlevel,
-          zlevel = _ref$zlevel === void 0 ? 0 : _ref$zlevel;
+          zlevel = _ref$zlevel === void 0 ? 0 : _ref$zlevel,
+          _ref$draggable = _ref.draggable,
+          draggable = _ref$draggable === void 0 ? false : _ref$draggable;
 
       var shape = new Polygon({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           points: points
         },
@@ -16500,10 +16518,13 @@
           _ref$points = _ref.points,
           points = _ref$points === void 0 ? [] : _ref$points,
           _ref$zlevel = _ref.zlevel,
-          zlevel = _ref$zlevel === void 0 ? 0 : _ref$zlevel;
+          zlevel = _ref$zlevel === void 0 ? 0 : _ref$zlevel,
+          _ref$draggable = _ref.draggable,
+          draggable = _ref$draggable === void 0 ? false : _ref$draggable;
 
       var shape = new Polyline({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           points: points
         },
@@ -16530,10 +16551,13 @@
           y = _a$y === void 0 ? 0 : _a$y,
           _a$zlevel = _a.zlevel,
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
-          rest = __rest(_a, ["text", "x", "y", "zlevel"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["text", "x", "y", "zlevel", "draggable"]);
 
       var shape = new ZRText({
         zlevel: zlevel,
+        draggable: draggable,
         style: Object.assign({
           x: x,
           y: y,
@@ -16567,10 +16591,13 @@
           percent = _a$percent === void 0 ? 1 : _a$percent,
           _a$zlevel = _a.zlevel,
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
-          rest = __rest(_a, ["x1", "y1", "x2", "y2", "cpx1", "cpy1", "cpx2", "cpy2", "percent", "zlevel"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["x1", "y1", "x2", "y2", "cpx1", "cpy1", "cpx2", "cpy2", "percent", "zlevel", "draggable"]);
 
       var shape = new BezierCurve({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           // 必选参数
           x1: x1,
@@ -16616,10 +16643,13 @@
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
           _a$clockwise = _a.clockwise,
           clockwise = _a$clockwise === void 0 ? true : _a$clockwise,
-          rest = __rest(_a, ["r", "cx", "cy", "r0", "startAngle", "endAngle", "zlevel", "clockwise"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["r", "cx", "cy", "r0", "startAngle", "endAngle", "zlevel", "clockwise", "draggable"]);
 
       var shape = new Sector({
         zlevel: zlevel,
+        draggable: draggable,
         shape: {
           cx: cx,
           cy: cy,
@@ -16658,10 +16688,13 @@
           zlevel = _a$zlevel === void 0 ? 0 : _a$zlevel,
           _a$image = _a.image,
           image = _a$image === void 0 ? '' : _a$image,
-          rest = __rest(_a, ["x", "y", "width", "height", "zlevel", "image"]);
+          _a$draggable = _a.draggable,
+          draggable = _a$draggable === void 0 ? false : _a$draggable,
+          rest = __rest(_a, ["x", "y", "width", "height", "zlevel", "image", "draggable"]);
 
       var shape = new ZRImage({
         zlevel: zlevel,
+        draggable: draggable,
         style: Object.assign({
           x: x,
           y: y,

diff --git a/dist/index.min.js b/dist/index.min.js
diff --git a/dist/types/index.d.ts b/dist/types/index.d.ts
@@ -10,6 +10,7 @@ export interface ZRenderInitOptions extends ZRenderInitOpt {
  */
 export declare type BaseShape<T> = Partial<T & {
     zlevel: number;
+    draggable: boolean;
 }> & PathStyleProps;
 /**
  * 自定义ZRenderType

diff --git a/package.json b/package.json
@@ -11,7 +11,9 @@
   },
   "scripts": {
     "dev": "rollup -c -w",
-    "build": "rollup -c"
+    "build": "rollup -c",
+    "commit": "git-cz",
+    "lint": "eslint ./src --ext .js,.jsx,.ts,.tsx --fix"
   },
   "keywords": [
     "auto-drawing",
@@ -28,10 +30,17 @@
   "devDependencies": {
     "@babel/core": "^7.14.8",
     "@babel/preset-env": "^7.14.8",
+    "@commitlint/cli": "^8.1.0",
+    "@commitlint/config-conventional": "^8.1.0",
     "@types/lodash-es": "^4.17.4",
     "@typescript-eslint/eslint-plugin": "^4.28.5",
     "@typescript-eslint/parser": "^4.28.5",
+    "commitizen": "^4.0.3",
+    "cz-conventional-changelog": "^3.0.2",
+    "cz-customizable": "^6.2.0",
     "eslint": "^7.31.0",
+    "husky": "^3.0.2",
+    "lint-staged": "^8.1.5",
     "rollup": "^2.54.0",
     "rollup-plugin-babel": "^4.4.0",
     "rollup-plugin-commonjs": "^10.1.0",
@@ -41,5 +50,22 @@
     "rollup-plugin-typescript2": "^0.30.0",
     "string": "^3.3.3",
     "typescript": "^4.3.5"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
+  "config": {
+    "commitizen": {
+      "path": "node_modules/cz-customizable"
+    }
+  },
+  "lint-staged": {
+    "src/**/*.{js,vue}": [
+      "npm run lint",
+      "git add"
+    ]
   }
 }
diff --git a/publish.sh b/publish.sh
@@ -12,7 +12,7 @@ echo '登录'
 npm login
 
 echo "发布中..."
-npm publish
+npm publish ./dist
 
 # 改回npm源地址
 npm config set registry=https://registry.npm.taobao.org

diff --git a/src/core/arc.ts b/src/core/arc.ts
@@ -16,11 +16,13 @@ function createArc(options?: IArcOptions): Arc {
     startAngle = 0,
     endAngle = 360,
     zlevel = 0,
+    draggable = false,
     clockwise = true,
     ...rest
   } = options || {}
   const shape = new Arc({
     zlevel,
+    draggable,
     shape: {
       cx,
       cy,

diff --git a/src/core/bezierCurve.ts b/src/core/bezierCurve.ts
@@ -9,9 +9,23 @@ export type IBezierCurveOptions = BaseShape<BezierCurveShape>
  * @returns
  */
 function createBezierCurve(options?: IBezierCurveOptions): BezierCurve {
-  const { x1, y1, x2, y2, cpx1, cpy1, cpx2, cpy2, percent = 1, zlevel = 0, ...rest } = options || {}
+  const {
+    x1,
+    y1,
+    x2,
+    y2,
+    cpx1,
+    cpy1,
+    cpx2,
+    cpy2,
+    percent = 1,
+    zlevel = 0,
+    draggable = false,
+    ...rest
+  } = options || {}
   const shape = new BezierCurve({
     zlevel,
+    draggable,
     shape: {
       // 必选参数
       x1,

diff --git a/src/core/circle.ts b/src/core/circle.ts
@@ -9,9 +9,10 @@ export type ICircleOptions = BaseShape<CircleShape & { radius: number; x: number
  * @returns
  */
 function createCircle(options?: ICircleOptions): Circle {
-  const { r = 0, cx = 0, cy = 0, zlevel = 0, ...rest } = options || {}
+  const { r = 0, cx = 0, cy = 0, zlevel = 0, draggable = false, ...rest } = options || {}
   const shape = new Circle({
     zlevel,
+    draggable,
     shape: {
       cx,
       cy,

diff --git a/src/core/compoundPath.ts b/src/core/compoundPath.ts
@@ -18,10 +18,11 @@ export type ICompoundPathOptions = BaseShape<CompoundPathShape> & {
  * @returns
  */
 function createCompoundPath(options?: ICompoundPathOptions): CompoundPath {
-  const { paths = [], zlevel = 0, isClose = true, ...rest } = options || {}
+  const { paths = [], zlevel = 0, isClose = true, draggable = false, ...rest } = options || {}
   const PathShape = isClose ? Polygon : Polyline
   const shape = new CompoundPath({
     zlevel,
+    draggable,
     shape: {
       paths: [
         new PathShape({

diff --git a/src/core/image.ts b/src/core/image.ts
@@ -9,9 +9,19 @@ export type IImageOptions = BaseShape<ImageStyleProps>
  * @returns
  */
 function createImage(options?: IImageOptions): ZRImage {
-  const { x = 0, y = 0, width = 0, height = 0, zlevel = 0, image = '', ...rest } = options || {}
+  const {
+    x = 0,
+    y = 0,
+    width = 0,
+    height = 0,
+    zlevel = 0,
+    image = '',
+    draggable = false,
+    ...rest
+  } = options || {}
   const shape = new ZRImage({
     zlevel,
+    draggable,
     style: {
       x,
       y,