From c523be9f34f697b1281835df81083968dda26bc3 Mon Sep 17 00:00:00 2001 From: RuoYi Date: Tue, 15 Sep 2020 14:09:29 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E8=A1=A8=E6=A0=BC=E5=88=97?= =?UTF-8?q?=E5=AE=BD=E6=8B=96=E5=8A=A8=E6=8F=92=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../demo/controller/DemoTableController.java | 9 +++ .../bootstrap-table-resizable.min.js | 9 +++ .../resizable/jquery.resizableColumns.min.js | 9 +++ .../main/resources/static/ruoyi/css/ry-ui.css | 20 +++++ .../templates/demo/table/resizable.html | 78 +++++++++++++++++++ .../src/main/resources/templates/include.html | 6 ++ .../resources/templates/index-topnav.html | 1 + .../src/main/resources/templates/index.html | 1 + 8 files changed, 133 insertions(+) create mode 100644 ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/resizable/bootstrap-table-resizable.min.js create mode 100644 ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/resizable/jquery.resizableColumns.min.js create mode 100644 ruoyi-admin/src/main/resources/templates/demo/table/resizable.html diff --git a/ruoyi-admin/src/main/java/com/ruoyi/web/controller/demo/controller/DemoTableController.java b/ruoyi-admin/src/main/java/com/ruoyi/web/controller/demo/controller/DemoTableController.java index df62a22c..0af6a8d4 100644 --- a/ruoyi-admin/src/main/java/com/ruoyi/web/controller/demo/controller/DemoTableController.java +++ b/ruoyi-admin/src/main/java/com/ruoyi/web/controller/demo/controller/DemoTableController.java @@ -214,6 +214,15 @@ public class DemoTableController extends BaseController return prefix + "/reorder"; } + /** + * 表格列宽拖动 + */ + @GetMapping("/resizable") + public String resizable() + { + return prefix + "/resizable"; + } + /** * 表格行内编辑操作 */ diff --git a/ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/resizable/bootstrap-table-resizable.min.js b/ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/resizable/bootstrap-table-resizable.min.js new file mode 100644 index 00000000..486633ea --- /dev/null +++ b/ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/resizable/bootstrap-table-resizable.min.js @@ -0,0 +1,9 @@ +/** + * bootstrap-table - An extended table to integration with some of the most widely used CSS frameworks. (Supports Bootstrap, Semantic UI, Bulma, Material Design, Foundation) + * + * @version v1.17.1 + * @homepage https://bootstrap-table.com + * @author wenzhixin (http://wenzhixin.net.cn/) + * @license MIT + */ +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("jquery")):"function"==typeof define&&define.amd?define(["jquery"],e):e((t=t||self).jQuery)}(this,(function(t){"use strict";t=t&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t;var e="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function n(t,e){return t(e={exports:{}},e.exports),e.exports}var r=function(t){return t&&t.Math==Math&&t},o=r("object"==typeof globalThis&&globalThis)||r("object"==typeof window&&window)||r("object"==typeof self&&self)||r("object"==typeof e&&e)||Function("return this")(),i=function(t){try{return!!t()}catch(t){return!0}},u=!i((function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a})),c={}.propertyIsEnumerable,f=Object.getOwnPropertyDescriptor,a={f:f&&!c.call({1:2},1)?function(t){var e=f(this,t);return!!e&&e.enumerable}:c},l=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}},s={}.toString,p=function(t){return s.call(t).slice(8,-1)},y="".split,h=i((function(){return!Object("z").propertyIsEnumerable(0)}))?function(t){return"String"==p(t)?y.call(t,""):Object(t)}:Object,b=function(t){return h(function(t){if(null==t)throw TypeError("Can't call method on "+t);return t}(t))},g=function(t){return"object"==typeof t?null!==t:"function"==typeof t},d=function(t,e){if(!g(t))return t;var n,r;if(e&&"function"==typeof(n=t.toString)&&!g(r=n.call(t)))return r;if("function"==typeof(n=t.valueOf)&&!g(r=n.call(t)))return r;if(!e&&"function"==typeof(n=t.toString)&&!g(r=n.call(t)))return r;throw TypeError("Can't convert object to primitive value")},v={}.hasOwnProperty,m=function(t,e){return v.call(t,e)},w=o.document,S=g(w)&&g(w.createElement),j=!u&&!i((function(){return 7!=Object.defineProperty((t="div",S?w.createElement(t):{}),"a",{get:function(){return 7}}).a;var t})),O=Object.getOwnPropertyDescriptor,A={f:u?O:function(t,e){if(t=b(t),e=d(e,!0),j)try{return O(t,e)}catch(t){}if(m(t,e))return l(!a.f.call(t,e),t[e])}},P=function(t){if(!g(t))throw TypeError(String(t)+" is not an object");return t},T=Object.defineProperty,E={f:u?T:function(t,e,n){if(P(t),e=d(e,!0),P(n),j)try{return T(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported");return"value"in n&&(t[e]=n.value),t}},x=u?function(t,e,n){return E.f(t,e,l(1,n))}:function(t,e,n){return t[e]=n,t},M=function(t,e){try{x(o,t,e)}catch(n){o[t]=e}return e},_=o["__core-js_shared__"]||M("__core-js_shared__",{}),z=Function.toString;"function"!=typeof _.inspectSource&&(_.inspectSource=function(t){return z.call(t)});var C,V,k,I,F=_.inspectSource,L=o.WeakMap,N="function"==typeof L&&/native code/.test(F(L)),q=n((function(t){(t.exports=function(t,e){return _[t]||(_[t]=void 0!==e?e:{})})("versions",[]).push({version:"3.6.0",mode:"global",copyright:"© 2019 Denis Pushkarev (zloirock.ru)"})})),$=0,B=Math.random(),D=function(t){return"Symbol("+String(void 0===t?"":t)+")_"+(++$+B).toString(36)},G=q("keys"),W={},K=o.WeakMap;if(N){var Q=new K,R=Q.get,Y=Q.has,H=Q.set;C=function(t,e){return H.call(Q,t,e),e},V=function(t){return R.call(Q,t)||{}},k=function(t){return Y.call(Q,t)}}else{var J=G[I="state"]||(G[I]=D(I));W[J]=!0,C=function(t,e){return x(t,J,e),e},V=function(t){return m(t,J)?t[J]:{}},k=function(t){return m(t,J)}}var U,X,Z={set:C,get:V,has:k,enforce:function(t){return k(t)?V(t):C(t,{})},getterFor:function(t){return function(e){var n;if(!g(e)||(n=V(e)).type!==t)throw TypeError("Incompatible receiver, "+t+" required");return n}}},tt=n((function(t){var e=Z.get,n=Z.enforce,r=String(String).split("String");(t.exports=function(t,e,i,u){var c=!!u&&!!u.unsafe,f=!!u&&!!u.enumerable,a=!!u&&!!u.noTargetGet;"function"==typeof i&&("string"!=typeof e||m(i,"name")||x(i,"name",e),n(i).source=r.join("string"==typeof e?e:"")),t!==o?(c?!a&&t[e]&&(f=!0):delete t[e],f?t[e]=i:x(t,e,i)):f?t[e]=i:M(e,i)})(Function.prototype,"toString",(function(){return"function"==typeof this&&e(this).source||F(this)}))})),et=o,nt=function(t){return"function"==typeof t?t:void 0},rt=function(t,e){return arguments.length<2?nt(et[t])||nt(o[t]):et[t]&&et[t][e]||o[t]&&o[t][e]},ot=Math.ceil,it=Math.floor,ut=function(t){return isNaN(t=+t)?0:(t>0?it:ot)(t)},ct=Math.min,ft=function(t){return t>0?ct(ut(t),9007199254740991):0},at=Math.max,lt=Math.min,st=function(t,e){var n=ut(t);return n<0?at(n+e,0):lt(n,e)},pt=function(t){return function(e,n,r){var o,i=b(e),u=ft(i.length),c=st(r,u);if(t&&n!=n){for(;u>c;)if((o=i[c++])!=o)return!0}else for(;u>c;c++)if((t||c in i)&&i[c]===n)return t||c||0;return!t&&-1}},yt={includes:pt(!0),indexOf:pt(!1)}.indexOf,ht=["constructor","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","toLocaleString","toString","valueOf"].concat("length","prototype"),bt={f:Object.getOwnPropertyNames||function(t){return function(t,e){var n,r=b(t),o=0,i=[];for(n in r)!m(W,n)&&m(r,n)&&i.push(n);for(;e.length>o;)m(r,n=e[o++])&&(~yt(i,n)||i.push(n));return i}(t,ht)}},gt={f:Object.getOwnPropertySymbols},dt=rt("Reflect","ownKeys")||function(t){var e=bt.f(P(t)),n=gt.f;return n?e.concat(n(t)):e},vt=function(t,e){for(var n=dt(e),r=E.f,o=A.f,i=0;i=74)&&(U=It.match(/Chrome\/(\d+)/))&&(X=U[1]);var qt,$t=X&&+X,Bt=kt("species"),Dt=kt("species"),Gt=[].slice,Wt=Math.max;!function(t,e){var n,r,i,u,c,f=t.target,a=t.global,l=t.stat;if(n=a?o:l?o[f]||M(f,{}):(o[f]||{}).prototype)for(r in e){if(u=e[r],i=t.noTargetGet?(c=Tt(n,r))&&c.value:n[r],!Pt(a?r:f+(l?".":"#")+r,t.forced)&&void 0!==i){if(typeof u==typeof i)continue;vt(u,i)}(t.sham||i&&i.sham)&&x(u,"sham",!0),tt(n,r,u,t)}}({target:"Array",proto:!0,forced:(qt="slice",!($t>=51||!i((function(){var t=[];return(t.constructor={})[Bt]=function(){return{foo:1}},1!==t[qt](Boolean).foo}))))},{slice:function(t,e){var n,r,o,i=b(this),u=ft(i.length),c=st(t,u),f=st(void 0===e?u:e,u);if(Et(i)&&("function"!=typeof(n=i.constructor)||n!==Array&&!Et(n.prototype)?g(n)&&null===(n=n[Dt])&&(n=void 0):n=void 0,n===Array||void 0===n))return Gt.call(i,c,f);for(r=new(void 0===n?Array:n)(Wt(f-c,0)),o=0;c1?e-1:0),n=1;e>n;n++)i[n-1]=arguments[n];return this.each(function(){var e=$(this),n=e.data(a.DATA_API);if(n){if("string"==typeof t)return n[t].apply(n,i)}else n=new r["default"](e,t),e.data(a.DATA_API,n)})},$.resizableColumns=r["default"]},{"./class":2,"./constants":3}],2:[function(t,e,i){"use strict";function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(i,"__esModule",{value:!0});var s=function(){function t(t,e){for(var i=0;i"),this.$table.before(this.$handleContainer),this.$tableHeaders.each(function(e,i){var n=t.$tableHeaders.eq(e),s=t.$tableHeaders.eq(e+1);if(0!==s.length&&!n.is(r.SELECTOR_UNRESIZABLE)&&!s.is(r.SELECTOR_UNRESIZABLE)){$("
").data(r.DATA_TH,$(i)).appendTo(t.$handleContainer)}}),this.bindEvents(this.$handleContainer,["mousedown","touchstart"],"."+r.CLASS_HANDLE,this.onPointerDown.bind(this))}},{key:"assignPercentageWidths",value:function(){var t=this;this.$tableHeaders.each(function(e,i){var n=$(i);t.setWidth(n[0],n.outerWidth()/t.$table.width()*100)})}},{key:"syncHandleWidths",value:function(){var t=this,e=this.$handleContainer;e.width(this.$table.width()),e.find("."+r.CLASS_HANDLE).each(function(e,i){var n=$(i),s=t.options.resizeFromBody?t.$table.height():t.$table.find("thead").height(),a=n.data(r.DATA_TH).outerWidth()+(n.data(r.DATA_TH).offset().left-t.$handleContainer.offset().left);n.css({left:a,height:s})})}},{key:"saveColumnWidths",value:function(){var t=this;this.$tableHeaders.each(function(e,i){var n=$(i);t.options.store&&!n.is(r.SELECTOR_UNRESIZABLE)&&t.options.store.set(t.generateColumnId(n),t.parseWidth(i))})}},{key:"restoreColumnWidths",value:function(){var t=this;this.$tableHeaders.each(function(e,i){var n=$(i);if(t.options.store&&!n.is(r.SELECTOR_UNRESIZABLE)){var s=t.options.store.get(t.generateColumnId(n));null!=s&&t.setWidth(i,s)}})}},{key:"onPointerDown",value:function(t){if(1===t.which){this.operation&&this.onPointerUp(t);var e=$(t.currentTarget);if(!e.is(r.SELECTOR_UNRESIZABLE)){var i=e.index(),n=this.$tableHeaders.eq(i).not(r.SELECTOR_UNRESIZABLE),s=this.$tableHeaders.eq(i+1).not(r.SELECTOR_UNRESIZABLE),a=this.parseWidth(n[0]),o=this.parseWidth(s[0]);this.operation={$leftColumn:n,$rightColumn:s,$currentGrip:e,startX:this.getPointerX(t),widths:{left:a,right:o},newWidths:{left:a,right:o}},this.bindEvents(this.$ownerDocument,["mousemove","touchmove"],this.onPointerMove.bind(this)),this.bindEvents(this.$ownerDocument,["mouseup","touchend"],this.onPointerUp.bind(this)),this.$handleContainer.add(this.$table).addClass(r.CLASS_TABLE_RESIZING),n.add(s).add(e).addClass(r.CLASS_COLUMN_RESIZING),this.triggerEvent(r.EVENT_RESIZE_START,[n,s,a,o],t),t.preventDefault()}}}},{key:"onPointerMove",value:function(t){var e=this.operation;if(this.operation){var i=(this.getPointerX(t)-e.startX)/this.$table.width()*100;if(0!==i){var n=e.$leftColumn[0],s=e.$rightColumn[0],a=void 0,o=void 0;return i>0?(a=this.constrainWidth(e.widths.left+(e.widths.right-e.newWidths.right)),o=this.constrainWidth(e.widths.right-i)):0>i&&(a=this.constrainWidth(e.widths.left+i),o=this.constrainWidth(e.widths.right+(e.widths.left-e.newWidths.left))),n&&this.setWidth(n,a),s&&this.setWidth(s,o),e.newWidths.left=a,e.newWidths.right=o,this.triggerEvent(r.EVENT_RESIZE,[e.$leftColumn,e.$rightColumn,a,o],t)}}}},{key:"onPointerUp",value:function(t){var e=this.operation;if(this.operation)return this.unbindEvents(this.$ownerDocument,["mouseup","touchend","mousemove","touchmove"]),this.$handleContainer.add(this.$table).removeClass(r.CLASS_TABLE_RESIZING),e.$leftColumn.add(e.$rightColumn).add(e.$currentGrip).removeClass(r.CLASS_COLUMN_RESIZING),this.syncHandleWidths(),this.saveColumnWidths(),this.operation=null,this.triggerEvent(r.EVENT_RESIZE_STOP,[e.$leftColumn,e.$rightColumn,e.newWidths.left,e.newWidths.right],t)}},{key:"destroy",value:function(){var t=this.$table,e=this.$handleContainer.find("."+r.CLASS_HANDLE);return this.unbindEvents(this.$window.add(this.$ownerDocument).add(this.$table).add(e)),e.removeData(r.DATA_TH),t.removeData(r.DATA_API),this.$handleContainer.remove(),this.$handleContainer=null,this.$tableHeaders=null,this.$table=null,t}},{key:"bindEvents",value:function(t,e,i,n){"string"==typeof e?e+=this.ns:e=e.join(this.ns+" ")+this.ns,arguments.length>3?t.on(e,i,n):t.on(e,i)}},{key:"unbindEvents",value:function(t,e){"string"==typeof e?e+=this.ns:e=null!=e?e.join(this.ns+" ")+this.ns:this.ns,t.off(e)}},{key:"triggerEvent",value:function(t,e,i){var n=$.Event(t);return n.originalEvent&&(n.originalEvent=$.extend({},i)),this.$table.trigger(n,[this].concat(e||[]))}},{key:"generateColumnId",value:function(t){return this.$table.data(r.DATA_COLUMNS_ID)+"-"+t.data(r.DATA_COLUMN_ID)}},{key:"parseWidth",value:function(t){return t?parseFloat(t.style.width.replace("%","")):0}},{key:"setWidth",value:function(t,e){e=e.toFixed(2),e=e>0?e:0,t.style.width=e+"%"}},{key:"constrainWidth",value:function(t){return void 0!=this.options.minWidth&&(t=Math.max(this.options.minWidth,t)),void 0!=this.options.maxWidth&&(t=Math.min(this.options.maxWidth,t)),t}},{key:"getPointerX",value:function(t){return 0===t.type.indexOf("touch")?(t.originalEvent.touches[0]||t.originalEvent.changedTouches[0]).pageX:t.pageX}}]),t}();i["default"]=a,a.defaults={selector:function(t){return t.find("thead").length?r.SELECTOR_TH:r.SELECTOR_TD},store:window.store,syncHandlers:!0,resizeFromBody:!0,maxWidth:null,minWidth:.01},a.count=0,e.exports=i["default"]},{"./constants":3}],3:[function(t,e,i){"use strict";Object.defineProperty(i,"__esModule",{value:!0});var n="resizableColumns";i.DATA_API=n;var s="resizable-columns-id";i.DATA_COLUMNS_ID=s;var r="resizable-column-id";i.DATA_COLUMN_ID=r;var a="th";i.DATA_TH=a;var o="rc-table-resizing";i.CLASS_TABLE_RESIZING=o;var h="rc-column-resizing";i.CLASS_COLUMN_RESIZING=h;var l="rc-handle";i.CLASS_HANDLE=l;var d="rc-handle-container";i.CLASS_HANDLE_CONTAINER=d;var u="column:resize:start";i.EVENT_RESIZE_START=u;var c="column:resize";i.EVENT_RESIZE=c;var f="column:resize:stop";i.EVENT_RESIZE_STOP=f;var E="tr:first > th:visible";i.SELECTOR_TH=E;var v="tr:first > td:visible";i.SELECTOR_TD=v;var $="[data-noresize]";i.SELECTOR_UNRESIZABLE=$},{}],4:[function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}Object.defineProperty(i,"__esModule",{value:!0});{var s=t("./class"),r=n(s),a=t("./adapter");n(a)}i["default"]=r["default"],e.exports=i["default"]},{"./adapter":1,"./class":2}]},{},[4]); +//# sourceMappingURL=jquery.resizableColumns.min.js.map \ No newline at end of file diff --git a/ruoyi-admin/src/main/resources/static/ruoyi/css/ry-ui.css b/ruoyi-admin/src/main/resources/static/ruoyi/css/ry-ui.css index cb8d9c08..25f0d9ad 100644 --- a/ruoyi-admin/src/main/resources/static/ruoyi/css/ry-ui.css +++ b/ruoyi-admin/src/main/resources/static/ruoyi/css/ry-ui.css @@ -872,6 +872,26 @@ label { height: 32px!important; } +/** 表格列宽拖动样式 **/ +.rc-handle-container { + position: relative; +} +.rc-handle { + position: absolute; + width: 7px; + cursor: ew-resize; + margin-left: -3px; + z-index: 2; +} +table.rc-table-resizing { + cursor: ew-resize; +} +table.rc-table-resizing thead, +table.rc-table-resizing thead > th, +table.rc-table-resizing thead > th > a { + cursor: ew-resize; +} + /** 表格冻结列样式 **/ .fixed-columns, .fixed-columns-right { position: absolute; diff --git a/ruoyi-admin/src/main/resources/templates/demo/table/resizable.html b/ruoyi-admin/src/main/resources/templates/demo/table/resizable.html new file mode 100644 index 00000000..40f92f51 --- /dev/null +++ b/ruoyi-admin/src/main/resources/templates/demo/table/resizable.html @@ -0,0 +1,78 @@ + + + + + + +
+
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/ruoyi-admin/src/main/resources/templates/include.html b/ruoyi-admin/src/main/resources/templates/include.html index f1a30568..57fbe288 100644 --- a/ruoyi-admin/src/main/resources/templates/include.html +++ b/ruoyi-admin/src/main/resources/templates/include.html @@ -176,6 +176,12 @@
+ +
+ + +
+
diff --git a/ruoyi-admin/src/main/resources/templates/index-topnav.html b/ruoyi-admin/src/main/resources/templates/index-topnav.html index e6d00005..06d59d55 100644 --- a/ruoyi-admin/src/main/resources/templates/index-topnav.html +++ b/ruoyi-admin/src/main/resources/templates/index-topnav.html @@ -135,6 +135,7 @@
  • 表格图片预览
  • 动态增删改查
  • 表格拖拽操作
    • +
  • 表格列宽拖动
  • 表格行内编辑
  • 主子表提交
  • 表格自动刷新
    • diff --git a/ruoyi-admin/src/main/resources/templates/index.html b/ruoyi-admin/src/main/resources/templates/index.html index 12b00f99..d9d1b704 100644 --- a/ruoyi-admin/src/main/resources/templates/index.html +++ b/ruoyi-admin/src/main/resources/templates/index.html @@ -116,6 +116,7 @@
  • 表格图片预览
  • 动态增删改查
  • 表格拖拽操作
    • +
  • 表格列宽拖动
  • 表格行内编辑
  • 主子表提交
  • 表格自动刷新