vxe-table-select-area
Version:
一个基于 vxe-table 的可区域选中复制、粘贴的组件
1 lines • 6.87 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _methods,_common=require("../../select-area/common"),_index=require("../../select-area/utils/index"),_autoResize=require("../../select-area/utils/auto-resize"),_constant=require("../../select-area/common/constant"),_focus=require("../../select-area/directives/focus"),_lodash=require("lodash");function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function ownKeys(t,e){var i,o=Object.keys(t);return Object.getOwnPropertySymbols&&(i=Object.getOwnPropertySymbols(t),e&&(i=i.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),o.push.apply(o,i)),o}function _objectSpread(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?ownKeys(Object(i),!0).forEach(function(e){_defineProperty(t,e,i[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):ownKeys(Object(i)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))})}return t}function _defineProperty(e,t,i){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function _toPropertyKey(e){e=_toPrimitive(e,"string");return"symbol"===_typeof(e)?e:String(e)}function _toPrimitive(e,t){if("object"!==_typeof(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0===i)return("string"===t?String:Number)(e);i=i.call(e,t||"default");if("object"!==_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}var _default={name:"VxeSelectAreaEditor",directives:{focus:_focus.focus},props:{parentRendered:{type:Boolean,required:!0},hooks:{type:Object,required:!0},rowKeyFieldName:{type:String,default:null},tableData:{type:Array,required:!0},colgroups:{type:Array,required:!0},cellSelectionData:{type:Object,required:!0},scrollBarWidth:{type:Number,required:!0}},data:function(){return{textareaInputRef:"textareaInputRef",rawCellValue:"",displayTextarea:!1,overflowViewport:!1,textareaRect:{left:0,top:0},tableEl:null,cellEl:null,autoResize:null,isEditCellFocus:!1}},computed:{currentColumn:function(){var e=null,t=this.colgroups,i=this.cellSelectionData.currentCell;return e=(0,_index.isEmptyValue)(i.rowKey)||(0,_index.isEmptyValue)(i.colKey)?e:t.find(function(e){return e.key===i.colKey})},containerClass:function(){var e=this.displayTextarea,t=this.overflowViewport,i={};return _defineProperty(i,(0,_common.clsName)("edit-input-container"),!0),_defineProperty(i,(0,_common.clsName)("edit-input-container-show"),e&&!t),i},containerStyle:function(){var e=this.displayTextarea,t=this.overflowViewport,i=this.textareaRect,o=this.currentColumn,r=i.top,i=i.left;return e&&!t?{top:r+"px",left:i+"px",height:null,"z-index":o.fixed?10:0,opacity:1}:{top:r+"px",left:i+"px",height:"1px","z-index":-1,opacity:0}},textareaClass:function(){return _defineProperty({},(0,_common.clsName)("edit-input"),!0)}},watch:{parentRendered:{handler:function(e){var t=this;e&&(this.setTableEl(),this.hooks.addHook(_constant.HOOKS_NAME.TABLE_CONTAINER_SCROLL,function(){t.displayTextarea&&!t.cellEl&&t.setCellEl(),t.debounceSetCellEl(),t.setTextareaPosition(),t.debounceSetTextareaPosition()}),this.hooks.addHook(_constant.HOOKS_NAME.TABLE_SIZE_CHANGE,function(){t.setTextareaPosition()}))},immediate:!0},"cellSelectionData.currentCell":{handler:function(e){var t=this,i=(this.isEditCellFocus=!1,e.rowKey),e=e.colKey;(0,_index.isEmptyValue)(i)||(0,_index.isEmptyValue)(e)||(this.setCellEl(),this.$nextTick(function(){t.setTextareaPosition(),setTimeout(function(){t.isEditCellFocus=!0})}))},deep:!0,immediate:!0},"cellSelectionData.normalEndCell":{handler:function(e){(0,_index.isEmptyValue)(e.colKey)||this[_constant.INSTANCE_METHODS.TEXTAREA_SELECT]()},deep:!0,immediate:!0}},mounted:function(){this.autoResize=(0,_autoResize.autoResize)()},methods:(_defineProperty(_methods={setTableEl:function(){var t=this;this.$nextTick(function(){var e=t.$parent.$el;t.tableEl=e})},setCellEl:function(){var e=this.cellSelectionData,t=this.tableEl,e=e.currentCell,i=e.rowKey,e=e.colKey;t&&(t=t.querySelector('tbody tr[rowid="'.concat(i,'"] td[colid="').concat(e,'"]')))&&(this.cellEl=t,this.overflowViewport=!1)},setTextareaPosition:function(){var e,t,i,o,r,n,a,l,s=this.hasXScrollBar,c=this.hasYScrollBar,u=this.scrollBarWidth,d=this.colgroups,h=this.hasRightFixedColumn,f=this.currentColumn,p=this.cellEl,y=this.tableEl;p&&y&&(e=(y=y.getBoundingClientRect()).left,t=y.top,l=y.right,y=y.bottom,i=(p=p.getBoundingClientRect()).left,o=p.top,r=p.height,n=p.width,a=p.right,p=p.bottom,r&&n?(y=r+y-p,p=n+l-a,s&&(y-=u),c&&(p-=u),h&&f&&!f.fixed&&(l=(0,_common.getFixedTotalWidthByColumnKey)({colgroups:d,colKey:f.key,fixed:"right"}))&&(p-=l),this.autoResize.init(this.$refs[this.textareaInputRef],{minHeight:Math.min(r,y),maxHeight:y,minWidth:Math.min(n,p),maxWidth:p},!0),this.textareaRect={left:i-e,top:o-t}):(this.textareaRect={left:0,top:0},this.cellEl=null,this.overflowViewport=!0))},showTextarea:function(){this.setRawCellValue(),this.displayTextarea=!0},hideTextarea:function(){this.displayTextarea=!1,this.textareaUnObserve()},textareaUnObserve:function(){this.autoResize&&this.autoResize.unObserve()},setRawCellValue:function(){this.rawCellValue=this.inputStartValue},textareaValueChange:function(e){this.$emit(_constant.EMIT_EVENTS.EDIT_INPUT_VALUE_CHANGE,e)}},_constant.INSTANCE_METHODS.TEXTAREA_SELECT,function(){var e=this.$refs[this.textareaInputRef];e&&e.select()}),_defineProperty(_methods,_constant.INSTANCE_METHODS.TEXTAREA_ADD_NEW_LINE,function(){var e,t=this.isCellEditing,i=this.editingCell;t&&(t=this.$refs[this.textareaInputRef],e=(0,_common.getCaretPosition)(t),i=i.row[i.colKey],i="".concat((i+="").slice(0,e),"\n").concat(i.slice(e)),t.value=i,this.textareaValueChange(i),(0,_common.setCaretPosition)(t,e+1))}),_methods),created:function(){var e=this;this.debounceSetTextareaPosition=(0,_lodash.debounce)(this.setTextareaPosition,210),this.debounceSetCellEl=(0,_lodash.debounce)(function(){!e.displayTextarea||e.cellEl||e.setCellEl()},200)},render:function(e){var t=this,i=(this._e,this.containerClass),o=this.containerStyle,r=this.textareaClass,n=this.rawCellValue,a=(this.isCellEditing,this.isEditCellFocus);return e("div",{style:o,class:i},[e("textarea",_objectSpread({},{ref:this.textareaInputRef,class:r,directives:[{name:"focus",value:{focus:a}}],domProps:{value:n},attrs:{tabindex:-1},on:{copy:function(e){t.$emit(_constant.EMIT_EVENTS.EDIT_INPUT_COPY,e)},paste:function(e){t.$emit(_constant.EMIT_EVENTS.EDIT_INPUT_PASTE,e)},cut:function(e){t.$emit(_constant.EMIT_EVENTS.EDIT_INPUT_CUT,e)}}}))])}};exports.default=_default;