cnhis-design-vue 0.2.64-beta → 0.3.2-beta

package/packages/fabric-chart/src/mixins/eventCommon.js

@@ -1,74 +0,0 @@
-
-export default {
-  name: 'eventCommon',
-  data() {
-    return {
-    };
-  },
-  mounted() {
-    if (this.eventStyle.evented) {
-      document.addEventListener('click', this.addEventListenerClick, true);
-      document.addEventListener('scroll', this.addEventListenerScroll, true);
-    }
-  },
-  methods: {
-    // 折线点移动限制 目前仅限制不能移动出画布
-    pointMoveLimit(point) {
-      point.setCoords(); // 需调用setCoords()才能重新计算控制位置(改变Object状态)
-      // const objBoundingBox = point.getBoundingRect(); // 此方式会导致结果不精准，应该用point的top值判断
-      const leftLimit = point.prevPoint ? point.prevPoint.get('left') : this.propItems.originX;
-      const rightLimit = point.nextPoint ? point.nextPoint.get('left') : this.propItems.endX;
-      if (point.top < this.propItems.originY) {
-        point.set('top', this.propItems.originY);
-      }
-      if (point.top > this.propItems.endY) {
-        point.set('top', this.propItems.endY);
-      }
-      if (point.left < leftLimit) {
-        point.set('left', leftLimit);
-      }
-      if (point.left > rightLimit) {
-        point.set('left', rightLimit);
-      }
-    },
-    getContainer() {
-      return this.$el;
-    },
-    /**
-     * 右键监听事件
-     */
-    addEventListenerContextmenu(event) {
-      event.preventDefault();
-      const x = event.offsetX;
-      const y = event.offsetY;
-      const { originX, originY, endX, endY } = this.$propItems();
-      if (!(x < originX || x > endX || y < originY || y > endY)) {
-        this._active = {
-          left: x,
-          top: y
-        };
-        this.openRightModal(this.activeEvent);
-      }
-      return false;
-    },
-    addEventListenerClick(e) {
-      const rightModalNode = document.querySelector('.c-mouse-right-menu-popup');
-      if (rightModalNode) {
-        if (!rightModalNode.contains(e.srcElement)) {
-          this.isRightVisible = false;
-        }
-      }
-    },
-    addEventListenerScroll() {
-      this.isRightVisible = false;
-    }
-  },
-  beforeDestroy() {
-    if (this.eventStyle.evented) {
-      const upperCanvas = document.querySelector('.upper-canvas');
-      upperCanvas && upperCanvas.removeEventListener('contextmenu', this.addEventListenerContextmenu, true);
-      document.removeEventListener('click', this.addEventListenerClick, true);
-      document.removeEventListener('scroll', this.addEventListenerScroll, true);
-    }
-  }
-};

package/packages/fabric-chart/src/mixins/fabricCommon.js

@@ -1,85 +0,0 @@
-import { v } from 'vxe-table';
-
-export default {
-  name: 'fabric-common',
-  inject: ['$canvas', '$group', '$propItems', '$fabric'],
-  computed: {
-    canvas() {
-      return this.$canvas();
-    },
-    group() {
-      return this.$group();
-    },
-    fabric() {
-      const fabric = this.$fabric();
-      fabric.boundsOfCurveCache = false;
-      fabric.Object.objectCaching = false;
-      return fabric;
-    },
-    propItems() {
-      return this.$propItems();
-    }
-  },
-  methods: {
-    // 根据x轴坐标获取对应的时间点
-    // getXValue(left) {
-    //   const { xScaleList, xScaleCell, originX } = this.propItems;
-    //   const minScale = Math.min(...xScaleList);
-    //   const time = minScale + (left - originX) / xScaleCell;
-    //   let d = new Date(time);
-    //   const month = `00${d.getMonth() + 1}`.slice(-2);
-    //   const day = `00${d.getDate()}`.slice(-2);
-    //   const hours = `00${d.getHours()}`.slice(-2);
-    //   const minute = `00${d.getMinutes()}`.slice(-2);
-    //   return `${d.getFullYear()}-${month}-${day} ${hours}:${minute}`;
-    // },
-    getXValue(left) {
-      const { xScaleCellList, originX, endX, xScaleList } = this.propItems;
-      let time;
-      if (left === endX) {
-        time = xScaleList[xScaleList.length - 1];
-      } else if (left === originX) {
-        time = xScaleList[0];
-      } else {
-        let index = xScaleCellList.findIndex(v => v.x >= left);
-        !~index && (index = xScaleCellList.length);
-        const obj = xScaleCellList[index - 1];
-        time = obj.time + (left - obj.x) * obj.xScaleTime;
-      }
-      let d = new Date(time);
-      const month = `00${d.getMonth() + 1}`.slice(-2);
-      const day = `00${d.getDate()}`.slice(-2);
-      const hours = `00${d.getHours()}`.slice(-2);
-      const minute = `00${d.getMinutes()}`.slice(-2);
-      return `${d.getFullYear()}-${month}-${day} ${hours}:${minute}`;
-    },
-    // 根据时间戳计算x轴坐标
-    cumputedX(value) {
-      if (!value) {
-        return '';
-      }
-      const { xScaleList, xScaleCellList, originX, endX, canvasWidth } = this.propItems;
-      const time = new Date(value).getTime();
-      const minScale = Math.min(...xScaleList);
-      const maxScale = Math.max(...xScaleList);
-      if (time < minScale) return 0;
-      if (time > maxScale) return canvasWidth;
-      if (time === minScale) return originX;
-      if (time === maxScale) return endX;
-      let index = xScaleCellList.findIndex(v => v.time >= time);
-      !~index && (index = xScaleCellList.length);
-      const obj = xScaleCellList[index - 1];
-      return obj.x + (time - obj.time) / obj.xScaleTime;
-    },
-    // // 根据时间戳计算x轴坐标
-    // cumputedX(value) {
-    //   if (!value) {
-    //     return '';
-    //   }
-    //   const { xScaleList, xScaleCell, originX } = this.propItems;
-    //   const time = new Date(value).getTime();
-    //   const minScale = Math.min(...xScaleList);
-    //   return originX + (time - minScale) * xScaleCell;
-    // },
-  }
-};

package/packages/fabric-chart/src/mixins/fabricObject.js

@@ -1,193 +0,0 @@
-import fabricCommon from "./fabricCommon.js"
-// 设置需要监听的事件，面前只监听mouseup事件
-const OBJECT_EVENTS = [
-  'mouseup',
-];
-
-// 通过交互更改的Props，需要通过prop.sync使用
-const EMIT_PROPS = ['angle', 'height', 'left', 'originX', 'originY', 'scaleX', 'scaleY', 'skewX', 'skewY', 'top', 'width'];
-
-// 更改后需要渲染的Props
-const REQUIRE_RENDER = ['angle', 'height', 'left', 'originX', 'originY', 'scaleX', 'scaleY', 'skewX', 'skewY', 'top', 'width', 'visible'];
-
-// 监视结构对象（项目），使用.sync发出更新
-const watchEmitProp = (key, deep) => ({
-  handler(newValue) {
-    // 如果Props已经引起了更新，则不必再提醒更新
-    if (this.$props[key] === newValue) {
-      return;
-    }
-    this.$emit('update:' + key, newValue);
-  },
-  deep
-});
-// 监视Props并使用更改后的值更新项目
-const watchProp = (key, deep) => ({
-  handler(newValue) {
-    // 如果Props没有引起更新，则不会更新画布
-    if (typeof this.item == 'undefined') {
-      return;
-    }
-    if (key === 'id') {
-      this.item.id = newValue;
-      return;
-    }
-    if (this.item.get(key) === newValue) {
-      return;
-    }
-    this.item.set(key, newValue);
-    if (REQUIRE_RENDER.includes(key)) {
-      this.canvas.renderAll();
-    }
-  },
-  deep
-});
-
-export default {
-  name: 'fabric-object',
-  inheritAttrs: false,
-  mixins: [fabricCommon],
-  props: {
-    id: { type: [Number, String], required: true },
-    width: Number,
-    height: Number,
-    padding: { type: Number, default: 0 }, // 对象及其控制边界之间的填充（以像素为单位）
-    left: Number,
-    top: Number,
-    opacity: Number,
-    visible: { type: Boolean, default: true },
-
-    paintFirst: { type: String, default: 'fill' }, // 确定是先绘制还是先填充
-    fill: { type: String, default: '#000000' },
-    stroke:  { type: String, default: '#000000' },
-    strokeWidth: Number,
-    strokeDashArray: Array,
-    strokeDashOffset: Number,
-    strokeLineCap: String,
-    strokeLineJoin: String,
-    strokeMiterLimit: Number,
-    strokeUniform: { type: Boolean, default: false },
-
-    selectable: { type: Boolean, default: true },
-    selectionBackgroundColor: { type: String, default: '' },
-    evented: { type: Boolean, default: true },
-
-    hasBorders: { type: Boolean, default: false }, // 选中后
-    hasControls: { type: Boolean, default: false }, // 设置为false时，不显示对象的控件，并且不能用于操作对象，但不影响调用 event
-
-    backgroundColor: String,
-    borderColor: String,
-    excludeFromExport: { type: Boolean, default: false },
-    hoverCursor: String,
-    includeDefaultValues: { type: Boolean, default: true }, // 当为 false 时，默认对象的值不包括在其序列化中
-    lockMovementX: { type: Boolean, default: false }, // true 锁定 x 方向移动
-    lockMovementY: { type: Boolean, default: false }, // true 锁定 y 方向移动
-    lockRotation: { type: Boolean, default: false }, // true 锁定旋转
-    lockScalingFlip: { type: Boolean, default: false }, // true 负值无法反转
-    lockScalingX: { type: Boolean, default: false }, // true 锁定 x 方向缩放
-    lockScalingY: { type: Boolean, default: false }, // true 锁定 y 方向缩放
-    lockSkewingX: { type: Boolean, default: false }, // true 锁定 x 方向倾斜
-    lockSkewingY: { type: Boolean, default: false }, // true 锁定 y 方向倾斜
-    objectCaching: { type: Boolean, default: false },
-    originX: { type: String, default: 'center' },
-    originY: { type: String, default: 'center' },
-    perPixelTargetFind: { type: Boolean, default: false },
-    rotatingPointOffset: Number
-  },
-  provide() {
-    return {
-      $item: () => this.item
-    };
-  },
-  computed: {
-    definedProps() {
-      const obj = { ...this.$props };
-      Object.keys(obj).forEach(key => {
-        if (obj[key] === undefined) {
-          delete obj[key];
-        }
-      });
-      return obj;
-    },
-    parentType() {
-      if (this.group) {
-        return 'group';
-      }
-      return 'canvas';
-    },
-    parentItem() {
-      if (this.parentType == 'canvas') {
-        return this.canvas;
-      }
-      if (this.parentType == 'group') {
-        return this.group;
-      }
-    },
-    item() {
-      if (this.parentItem) {
-        let canvasObj = this.canvas.getObjects();
-        let res = [];
-        this.transverseCanvasObjects(canvasObj, 'id', this.id, res);
-        return res[0];
-      }
-    }
-  },
-  methods: {
-    transverseCanvasObjects(objects, attr, val, objectList) {
-      for (let i in objects) {
-        // 在组内查看，除非它是您要搜索的组对象
-        if (objects[i]['type'] == 'group' && objects[i][attr] !== val) {
-          this.transverseCanvasObjects(objects[i].getObjects(), attr, val, objectList);
-        } else if (objects[i][attr] == val) {
-          objectList.push(objects[i]);
-        }
-      }
-    },
-    /**
-     * 创建事件
-     */
-    createEvents() {
-      OBJECT_EVENTS.forEach(event => {
-        this.item.on(event, e => {
-          this.$emit(event, { id: this.id, ...e });
-        });
-      });
-    },
-    createWatchers() {
-      this.createFabricItemWatchers();
-      this.createPropWatchers();
-    },
-    createFabricItemWatchers() {
-      EMIT_PROPS.forEach(prop => {
-        this.$watch('item.' + prop, watchEmitProp(prop, true));
-      });
-    },
-    createPropWatchers() {
-      Object.keys(this.$props).forEach(key => {
-        // 自定义监听校验 确保mixin不会重复生成
-        if (typeof this.customWatch !== typeof undefined) {
-          if (this.customWatch.includes(key)) {
-            return;
-          }
-        }
-        this.$watch(key, watchProp(key, true));
-      });
-    }
-  },
-  beforeDestroy() {
-    OBJECT_EVENTS.forEach(event => {
-      if (this.item) {
-        this.item.off(event);
-      }
-    });
-    if (this.parentType == 'group') {
-      if (this.group) {
-        this.group.removeWithUpdate(this.item);
-      }
-    } else {
-      if (this.canvas) {
-        this.canvas.remove(this.item);
-      }
-    }
-  }
-};

package/packages/fabric-chart/src/mixins/type.js

@@ -1,6 +0,0 @@
-export const isNumber = num => {
-  return typeof num === 'number' && Number.isFinite(num);
-};
-export const isObject = obj => {
-  return Object.prototype.toString.call(obj) === '[object Object]';
-};

package/packages/form/index.js

@@ -1,16 +0,0 @@
-// 导入组件
-import Base from '../base';
-import Form from './src/Form';
-import Item from './src/Item';
-
-// 为组件提供 install 安装方法，供按需引入
-Form.install = function(Vue) {
-  Vue.use(Base);
-  Vue.component(Form.name, Form);
-  Vue.component(Item.name, Item);
-  // 这里与antd源码冲突了
-  // Vue.prototype.$form = Form;
-};
-
-// 默认导出组件
-export default Form;

package/packages/form/src/Form.jsx

@@ -1,11 +0,0 @@
-/**
- * @author pengpeng
- * @desc 全继承antd组件，后期再扩展
- * @time 2021-05-13
- */
-import { Form } from 'ant-design-vue';
-import create from '@/core/create';
-export default create({
-  name: 'form',
-  extends: Form
-});

package/packages/form/src/Item.jsx

@@ -1,11 +0,0 @@
-/**
- * @author pengpeng
- * @desc 全继承antd组件，后期再扩展
- * @time 2021-05-13
- */
-import { Form } from 'ant-design-vue';
-import create from '@/core/create';
-export default create({
-  name: 'form-item',
-  extends: Form.Item
-});

package/packages/form-model/index.js

@@ -1,14 +0,0 @@
-// 导入组件
-import Base from '../base';
-import FormModel from './src/FormModel';
-import Item from './src/Item';
-
-// 为组件提供 install 安装方法，供按需引入
-FormModel.install = function(Vue) {
-  Vue.use(Base);
-  Vue.component(FormModel.name, FormModel);
-  Vue.component(Item.name, Item);
-};
-
-// 默认导出组件
-export default FormModel;

package/packages/form-model/src/FormModel.jsx

@@ -1,11 +0,0 @@
-/**
- * @author pengpeng
- * @desc 全继承antd组件，后期再扩展
- * @time 2021-05-13
- */
-import { FormModel } from 'ant-design-vue';
-import create from '@/core/create';
-export default create({
-  name: 'form-model',
-  extends: FormModel
-});

package/packages/form-model/src/Item.jsx

@@ -1,11 +0,0 @@
-/**
- * @author pengpeng
- * @desc 全继承antd组件，后期再扩展
- * @time 2021-05-13
- */
-import { FormModel } from 'ant-design-vue';
-import create from '@/core/create';
-export default create({
-  name: 'form-model-item',
-  extends: FormModel.Item
-});

package/packages/form-table/index.js

@@ -1,10 +0,0 @@
-// 导入组件
-import FormTable from './src/FormTable.vue';
-
-// 为组件提供 install 安装方法，供按需引入
-FormTable.install = function(Vue) {
-  Vue.component(FormTable.name, FormTable);
-};
-
-// 默认导出组件
-export default FormTable;