cnhis-design-vue 2.2.3 → 2.2.6

package/packages/scale-view/formitem/sign-com.vue

@@ -1,316 +0,0 @@
-<template>
-  <div class="sign-com-wrap">
-    <span>提示：请在以下区域内签名，PC电脑设备使用鼠标签字。</span>
-    <canvas
-      class="sign-canvas"
-      ref="canvasRef"
-      @mousedown="mouseDown"
-      @mousemove="mouseMove"
-      @mouseup="mouseUp"
-      @touchstart="touchStart"
-      @touchmove="touchMove"
-      @touchend="touchEnd"
-    ></canvas>
-  </div>
-</template>
-<script>
-export default {
-  name: "sign-com",
-  components: {},
-  props: {
-    width: { type: Number, default: 620 },
-		height: { type: Number, default: 300 },
-		lineWidth: { type: Number, default: 4 },
-		lineColor: { type: String, default: '#000000' },
-		bgColor: { type: String, default: '' },
-		isCrop: { type: Boolean, default: false }
-  },
-  data() {
-    return {
-      canvasRef: null,
-      canvasTxt: undefined,
-      resultImg: undefined,
-      hasDrew: false,
-      drawObj: {
-        points: [],
-        startX: 0,
-        startY: 0,
-        isDrawing: false,
-        sratio: 1
-      }
-    };
-  },
-
-  computed: {
-    ratio() {
-      return this.height/this.width;
-    },
-    myBg() {
-      return this.bgColor ? this.bgColor : 'rgba(255, 255, 255, 0)';
-    }
-  },
-  watch: {},
-  // 生命周期
-  created() {
-    window.addEventListener('resize', this.resizeHandler);
-  },
-  mounted() {
-    this.canvasRef = this.$refs.canvasRef
-    if (this.canvasRef) {
-      this.canvasRef.height = this.height;
-      this.canvasRef.width = this.width;
-    }
-    this.resizeHandler();
-    this.drawGrid(this.canvasTxt, 'rgb(240, 240, 240)', 16, 16);
-    // 在画板以外松开鼠标后冻结画笔
-    document.onmouseup = () => {
-      this.drawObj.isDrawing = false;
-    };
-  },
-  beforeDestroy() {
-    window.removeEventListener('resize', this.resizeHandler);
-  },
-
-  // 方法
-  methods: {
-     drawGrid(context, color, stepx, stepy) {
-			context.save();
-			context.fillStyle = 'white';
-			console.log(context);
-			context.fillRect(0, 0, context.canvas.width, context.canvas.height);
-			context.lineWidth = 0.5;
-			context.strokeStyle = color;
-			for (let i = stepx; i < context.canvas.width; i += stepx) {
-				context.beginPath();
-				context.moveTo(i, 0);
-				context.lineTo(i, context.canvas.height);
-				context.closePath();
-				context.stroke();
-			}
-			for (let j = stepy; j < context.canvas.height; j += stepy) {
-				context.beginPath();
-				context.moveTo(0, j);
-				context.lineTo(context.canvas.width, j);
-				context.closePath();
-				context.stroke();
-			}
-			context.restore();
-		},
-    // 绘制
-		drawStart(obj) {
-			this.drawObj.startX = obj.x;
-			this.drawObj.startY = obj.y;
-			this.canvasTxt.beginPath();
-			this.canvasTxt.moveTo(this.drawObj.startX, this.drawObj.startY);
-			this.canvasTxt.lineTo(obj.x, obj.y);
-			this.canvasTxt.lineCap = 'round';
-			this.canvasTxt.lineJoin = 'round';
-			this.canvasTxt.lineWidth = this.lineWidth * this.drawObj.sratio;
-			this.canvasTxt.stroke();
-			this.canvasTxt.closePath();
-			this.drawObj.points.push(obj);
-		},
-		drawMove(obj) {
-			this.canvasTxt.beginPath();
-			this.canvasTxt.moveTo(this.drawObj.startX, this.drawObj.startY);
-			this.canvasTxt.lineTo(obj.x, obj.y);
-			this.canvasTxt.strokeStyle = this.lineColor;
-			this.canvasTxt.lineWidth = this.lineWidth * this.drawObj.sratio;
-			this.canvasTxt.lineCap = 'round';
-			this.canvasTxt.lineJoin = 'round';
-			this.canvasTxt.stroke();
-			this.canvasTxt.closePath();
-			this.drawObj.startY = obj.y;
-			this.drawObj.startX = obj.x;
-			this.drawObj.points.push(obj);
-		},
-		drawEnd(obj) {
-			this.canvasTxt.beginPath();
-			this.canvasTxt.moveTo(this.drawObj.startX, this.drawObj.startY);
-			this.canvasTxt.lineCap = 'round';
-			this.canvasTxt.lineJoin = 'round';
-			this.canvasTxt.stroke();
-			this.canvasTxt.closePath();
-			this.drawObj.points.push(obj);
-			this.drawObj.points.push({ x: -1, y: -1 });
-		},
-
-		mouseDown(e) {
-			e.preventDefault();
-			this.drawObj.isDrawing = true;
-			this.hasDrew = true;
-			const obj = {
-				x: e.offsetX,
-				y: e.offsetY
-			};
-			this.drawStart(obj);
-		},
-
-		// pc
-		mouseMove(e) {
-			e.preventDefault();
-			if (!this.drawObj.isDrawing) return;
-			const obj = {
-				x: e.offsetX,
-				y: e.offsetY
-			};
-			this.drawMove(obj);
-		},
-
-		mouseUp(e) {
-			e.preventDefault();
-			const obj = {
-				x: e.offsetX,
-				y: e.offsetY
-			};
-			this.drawEnd(obj);
-			this.drawObj.isDrawing = false;
-		},
-
-		// mobile
-		touchStart(e) {
-			e.preventDefault();
-			this.hasDrew = true;
-			if (e.touches.length === 1) {
-				const obj = {
-					x: e.targetTouches[0].clientX - this.canvasRef.getBoundingClientRect().left,
-					y: e.targetTouches[0].clientY - this.canvasRef.getBoundingClientRect().top
-				};
-				this.drawStart(obj);
-			}
-		},
-
-		touchMove(e) {
-			e.preventDefault();
-			if (e.touches.length !== 1) return;
-			const obj = {
-				x: e.targetTouches[0].clientX - this.canvasRef.getBoundingClientRect().left,
-				y: e.targetTouches[0].clientY - this.canvasRef.getBoundingClientRect().top
-			};
-			this.drawMove(obj);
-		},
-
-		touchEnd(e) {
-			e.preventDefault();
-			if (e.touches.length !== 1) return;
-			const obj = {
-				x: e.targetTouches[0].clientX - this.canvasRef.getBoundingClientRect().left,
-				y: e.targetTouches[0].clientY - this.canvasRef.getBoundingClientRect().top
-			};
-			this.drawEnd(obj);
-		},
-
-		getCropArea(imgData) {
-			let topX = this.canvasRef.width;
-			let btmX = 0;
-			let topY = this.canvasRef.height;
-			let btnY = 0;
-			for (let i = 0; i < this.canvasRef.width; i++) {
-				for (let j = 0; j < this.canvasRef.height; j++) {
-					const pos = (i + this.canvasRef.width * j) * 4;
-					if (imgData[pos] > 0 || imgData[pos + 1] > 0 || imgData[pos + 2] || imgData[pos + 3] > 0) {
-						btnY = Math.max(j, btnY);
-						btmX = Math.max(i, btmX);
-						topY = Math.min(j, topY);
-						topX = Math.min(i, topX);
-					}
-				}
-			}
-			topX++;
-			btmX++;
-			topY++;
-			btnY++;
-			const data = [topX, topY, btmX, btnY];
-			return data;
-		},
-
-		// 获取大小
-		getImgSize (url) {
-			const strLength = url.length;
-			const strNum = strLength - (strLength / 8) * 2;
-			return Math.floor(strNum);
-		},
-
-		randomId() {
-			const str = Math.random() * 1e10 + '';
-			return parseInt(str).toString(36);
-		},
-
-		// 操作
-		generate() {
-			const pm = new Promise((resolve, reject) => {
-				if (!this.hasDrew) {
-					reject('Warning: Not Signned!');
-					return;
-				}
-				const resImgData = this.canvasTxt.getImageData(0, 0, this.canvasRef.width, this.canvasRef.height);
-				this.canvasTxt.globalCompositeOperation = 'destination-over';
-				this.canvasTxt.fillStyle = this.myBg;
-				this.canvasTxt.fillRect(0, 0, this.canvasRef.width, this.canvasRef.height);
-				let resultImg = this.canvasRef.toDataURL();
-				this.canvasTxt.clearRect(0, 0, this.canvasRef.width, this.canvasRef.height);
-				this.canvasTxt.putImageData(resImgData, 0, 0);
-				this.canvasTxt.globalCompositeOperation = 'source-over';
-				if (this.isCrop) {
-					const crop_area = this.getCropArea(resImgData.data);
-					let crop_canvas = document.createElement('canvas');
-					const crop_ctx = crop_canvas.getContext('2d');
-					crop_canvas.width = crop_area[2] - crop_area[0];
-					crop_canvas.height = crop_area[3] - crop_area[1];
-					const crop_imgData = this.canvasTxt.getImageData(...crop_area);
-
-					// 去色 背景grid变为白色
-					for (let i = 0; i < crop_imgData.data.length; i += 4) {
-						if (crop_imgData.data[i] > 200) {
-							crop_imgData.data[i] = 255;
-							crop_imgData.data[i + 1] = 255;
-							crop_imgData.data[i + 2] = 255;
-							crop_imgData.data[i + 3] = 255;
-						}
-					}
-
-					crop_ctx.globalCompositeOperation = 'destination-over';
-					crop_ctx.putImageData(crop_imgData, 0, 0);
-					crop_ctx.fillStyle = this.myBg;
-					crop_ctx.fillRect(0, 0, crop_canvas.width, crop_canvas.height);
-					resultImg = crop_canvas.toDataURL();
-					crop_canvas = null;
-				}
-				const obj = { name: this.randomId(), url: resultImg, size: this.getImgSize(resultImg) };
-				resolve(obj);
-			});
-			return pm;
-		},
-
-		// 清空
-		reset() {
-			this.canvasTxt.clearRect(0, 0, this.canvasRef.width, this.canvasRef.height);
-			this.drawGrid(this.canvasTxt, 'rgb(240, 240, 240)', 16, 16);
-			this.drawObj.points = [];
-			this.hasDrew = false;
-			this.resultImg = '';
-		},
-
-		resizeHandler() {
-			this.canvasRef.style.width = this.width + 'px';
-			const realw = parseFloat(window.getComputedStyle(this.canvasRef).width);
-			this.canvasRef.style.height = this.ratio * realw + 'px';
-			this.canvasTxt = this.canvasRef.getContext('2d');
-			this.canvasTxt.globalAlpha = 1;
-		},
-  }
-};
-</script>
-<style lang="less" scoped>
-.sign-com-wrap {
-	> span {
-		color: #585858;
-	}
-
-	.sign-canvas {
-		margin-top: 16px;
-		border: 1px solid rgba(213, 213, 213, 0.6);
-		border-radius: 4px;
-	}
-}
-</style>

package/packages/scale-view/formitem/text-over-tooltip/TextOverTooltip.vue

@@ -1,98 +0,0 @@
-<template>
-  <div class="text-over-tooltip-components">
-    <template  v-if="isDisabledTooltip">
-      <div class="ellipsis">
-        <i ref="strContent">{{curContent}}</i>
-      </div>
-    </template>
-    <template v-else>
-    <a-tooltip v-bind="$attrs" :title="curContent" >
-      {{curContent}}
-    </a-tooltip>
-    </template>
-  </div>
-</template>
-
-<script>
-import { Tooltip } from "ant-design-vue";
-export default {
-  name: "TextOverTooltip",
-  components: {
-    [Tooltip.name]: Tooltip
-  },
-  watch:{
-    curContent:{
-      immediate: true,
-      handler(val){
-        if(val){
-          this.$nextTick(()=>{
-            this.onMouseOver()
-          })
-        }
-      }
-    }
-  },
-  props: {
-    // 显示的文字内容
-    content: { type: [Number, String] },
-  },
-  data() {
-    return {
-      isDisabledTooltip: true // 是否需要禁止提示
-    };
-  },
-  computed: {
-    curContent() {
-      let res = this.tooltipTitle || this.content || "";
-      res = String(res)
-      return res;
-    }
-  },
-  methods: {
-    onMouseOver(str) {
-      if (this.isAlias) {
-        this.isDisabledTooltip = false;
-        return;
-      }
-      let node = this.$refs['strContent'];
-      let parentWidth = node.parentNode.offsetWidth;
-      let contentWidth = node.offsetWidth;
-      // 判断是否禁用tooltip功能
-      this.isDisabledTooltip = contentWidth <= parentWidth;
-    }
-  }
-};
-</script>
-
-<style lang="less" scoped>
-.text-over-tooltip-components {
-  display: inline-block;
-  max-width: 100%;
-  /* 文字超出宽度显示省略号 单行 */
-  .ellipsis {
-    font-size: 14px;
-    color: #35393c;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    i {
-      font-style: normal;
-      word-break: keep-all;
-      white-space: nowrap;
-    }
-  }
-  /* 自定义样式 */
-  .fs20 {
-    font-size: 20px;
-    font-weight: 600;
-    color: green;
-    line-height: 22px;
-  }
-  .fs12 {
-    font-size: 12px;
-    font-weight: 400;
-    color: orange;
-    line-height: 14px;
-  }
-}
-</style>

package/packages/scale-view/index.js

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

package/packages/scale-view/mixin/NoData.js

@@ -1,38 +0,0 @@
-/** 无数据 */
-export default {
-  data() {
-    return {
-      noData: false,
-      noDataTip: "1.1.6.11",
-      noDataImg: "nodata"
-    };
-  },
-  methods: {
-    // 跳转坐标云平台
-    setNoData(noData, noDataTip = "1.1.6.11", noDataImg = "nodata") {
-      this.noData = noData;
-      this.noDataTip = noDataTip || "1.1.6.11";
-      this.noDataImg = this.errResult(noDataImg) || "nodata";
-    },
-    resetNodata() {
-      this.noData = false;
-      this.noDataTip = "1.1.6.11";
-      this.noDataImg = "nodata";
-    },
-    errResult(result) {
-      let res = "nodata";
-      switch (result) {
-        case "10000":
-          res = "no-permission";
-          break;
-        case "Failure":
-          res = "failure";
-          break;
-        default:
-          res = "nodata";
-          break;
-      }
-      return res;
-    }
-  }
-};

package/packages/scale-view/mixin/addressVal.js

@@ -1,156 +0,0 @@
-import utils from '@/utils/utils-map';
-import addressData from '../formitem/data';
-const addressMap = new Map([
-  ['province', ['city', 'area', 'address']],
-  ['province-city', ['area', 'address']],
-  ['province-city-district', ['address']],
-  ['province-city-district-address', []]
-]);
-export default {
-  data() {
-    return {
-      allData: [],
-      province: []
-    };
-  },
-  props: {},
-  computed: {},
-  created() {
-    this.allData = addressData;
-  },
-  beforeDestroy() {},
-  methods: {
-    parseVal(defValue, item) {
-      let val = defValue || item.setting.defaultValue;
-      if (utils.isJSON(val)) {
-        val = JSON.parse(val);
-      }
-      return val;
-    },
-    isMultiple(item) {
-      return (item.type === 'SELECT' && item?.setting?.isMultiple) || item.type === 'CHECKBOX_BLOCK';
-    },
-    handleQueryVal(val, item, isMulti) {
-      val = decodeURIComponent(val);
-      if (item.type === 'ADDRESS') {
-        let addressDef = this.compileAddressUrlDef(item, val);
-        return addressDef;
-      }
-      if (typeof val === 'string' && val.includes(',') && isMulti) {
-        return val.split(',');
-      }
-      if (isMulti) {
-        return val.split();
-      }
-      return val;
-    },
-    handleUrlDefaultValue(item) {
-      let urlKey = item.setting?.outDefaultValue?.urlKey;
-      if (!urlKey) return;
-      let isMulti = this.isMultiple(item);
-      // 兼容之前多个key
-      if (typeof urlKey === 'string' && urlKey.includes(',')) {
-        let list = urlKey.split(',');
-        if (list.length > 1) {
-          let val = list
-            .map(l => {
-              let tempV = this.getQueryVariable(l);
-              if (!tempV) return null;
-              tempV = this.handleQueryVal(tempV, isMulti);
-              return tempV;
-            })
-            .filter(Boolean)
-            .flat(3);
-          if (val.length) {
-            return val;
-          }
-          return;
-        }
-      }
-      let val = this.getQueryVariable(urlKey);
-      if (!val) return;
-      return this.handleQueryVal(val, item, isMulti);
-    },
-    /**
-     * 解析url中的地址
-     * @param {*} item
-     * @param {*} val url中的value
-     * @returns
-     */
-    compileAddressUrlDef(item, val) {
-      if (!val) return;
-      if (utils.isJSON(val)) {
-        val = JSON.parse(val);
-      }
-      if (!Object.keys(val).length) return;
-      let { province, city, area, address } = val;
-      let addressObj = { city: [], area: [] };
-      let provinceObj = this.handleKeyInValue(province, 'province', addressObj);
-      if (!provinceObj) return { address };
-
-      let cityObj = this.handleKeyInValue(city, 'city', addressObj);
-      if (!cityObj) return { province: provinceObj, address };
-
-      let areaObj = this.handleKeyInValue(area, 'area', addressObj);
-      if (!areaObj) return { province: provinceObj, city: cityObj, address };
-
-      return { province: provinceObj, city: cityObj, area: areaObj, address };
-    },
-    /**
-     * 根据名字 获取相关的key 并返回一个标准格式
-     * @param {*} label
-     * @param {*} dataKey
-     * @param {*} addressObj
-     * @returns { "label": "xxx", "key": "xxx" }
-     */
-    handleKeyInValue(label, dataKey = 'province', addressObj) {
-      if (!label) return;
-      let data = dataKey === 'province' ? this[dataKey] : addressObj[dataKey];
-      let key = this.findKey(data, label);
-      if (!key) return;
-      if (dataKey === 'province') {
-        addressObj.city = [...this.objToArray(this.allData[key])];
-      }
-      if (dataKey === 'city') {
-        addressObj.area = [...this.objToArray(this.allData[key])];
-      }
-      return { label, key };
-    },
-    // 获取省
-    getProvinceData() {
-      if (!this.province.length) {
-        this.province = [...this.objToArray(this.allData['86'])];
-      }
-    },
-    // 对象转数组
-    objToArray(obj) {
-      if (!obj) return [];
-      return Object.keys(obj).map(item => {
-        return {
-          code: item,
-          name: obj[item]
-        };
-      });
-    },
-    // 通过name 找到code
-    findKey(data, name) {
-      if (!data || !data.length || !name) return;
-      return data.find(v => v.name === name)?.code;
-    },
-    handleSubmitAddress(val, item) {
-      if (!val) return;
-      if (utils.isJSON(val)) {
-        val = JSON.parse(val);
-      }
-      if (!Object.keys(val).length) return;
-      let { addressType } = item.setting || {};
-      if (!addressType) return val;
-      let delList = addressMap.get(addressType);
-      if (!delList.length) return val;
-      delList.forEach(v => {
-        delete val[v];
-      });
-      return val;
-    }
-  }
-};