@persagy2/meri-design/dist/ViewTable/index.js

fork from meri-design and extend it.

/*!
 * @@persagy2/meri-design v1.4.9-extend.2
 * (c) 2019-2020 xiongshuang
 * Released under the MIT License.
 * 2022-12-07 10:31:52
 */
var e,t;e=this,t=function(){return function(){"use strict";var e={d:function(t,a){for(var n in a)e.o(a,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:a[n]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function a(e,t,a,n,i,r,l,o){var d,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=a,c._compiled=!0),n&&(c.functional=!0),r&&(c._scopeId="data-v-"+r),l?(d=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(l)},c._ssrRegister=d):i&&(d=o?function(){i.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:i),d)if(c.functional){c._injectStyles=d;var s=c.render;c.render=function(e,t){return d.call(t),s(e,t)}}else{var f=c.beforeCreate;c.beforeCreate=f?[].concat(f,d):[d]}return{exports:e,options:c}}e.r(t),e.d(t,{default:function(){return d}});var n=a({name:"TableHeader",props:{radius:{type:String,default:""},data:{type:Array,default:function(){return[]}},fixedData:{type:Array,default:function(){return[]}}},watch:{fixedData:function(e){var t=this;this.$nextTick((function(){t.fixedHandle(e)}))}},mounted:function(){var e=this;setTimeout((function(){e.fixedHandle(e.fixedData)}))},methods:{fixedHandle:function(e){var t=this,a=0;e.forEach((function(e,n){var i=t.$refs["headerFixed".concat(n)];a+=i[0].clientWidth})),this.$emit("setWidth",a)}}},(function(){var e=this,t=e._self._c;return t("div",{staticClass:"p-view-table-header"},e._l(e.data,(function(a,n){return t("div",{key:"header-".concat(a.key,"-").concat(n),ref:"header".concat(a.fixed&&"Fixed").concat(n),refInFor:!0,class:["p-table-header-item",a.children&&a.children.length&&"p-table-header-item-hc","p-table-header-item-".concat(a.align||e.radius)],style:a.width&&{width:"".concat(a.width,"px")}},[t("section",{class:["p-table-header-text",a.children&&a.children.length&&"p-table-header-text-lh"]},[t("span",{staticClass:"p-table-header-child"},[e._v(e._s(a.text))])]),e._v(" "),a.children&&a.children.length?t("section",{staticClass:"p-table-header-item-children"},e._l(a.children,(function(a,n){return t("article",{key:"hChild-".concat(a.key,"-").concat(n),staticClass:"p-table-header-text p-table-header-text-lh p-table-header-children-text",style:a.width&&{width:"".concat(a.width,"px")}},[t("span",{staticClass:"p-table-header-child"},[e._v(e._s(a.text))])])})),0):e._e()])})),0)}),[],!1,null,null,null).exports,i=a({name:"TableMain",props:{tableHeader:{type:Array,default:function(){return[]}},data:{type:Array,default:function(){return[]}},radius:{type:String,default:""},hoverIndex:{type:[Number,Object],default:null}},watch:{hoverIndex:function(e,t){var a=this.radius;if(a.replace(a[0],a[0].toUpperCase()),"number"==typeof e){var n=this.$refs["table".concat(e)];if(n){(n[0]||n).style.backgroundColor="#e4e5e7";var i=this.$refs["table".concat(e+1)];i&&i.length&&(i[0].style.borderTopColor="#fff")}}else{var r=this.$refs["table".concat(t)];if(r){(r[0]||r).style.backgroundColor="";var l=this.$refs["table".concat(t+1)];l&&l.length&&(l[0].style.borderTopColor="")}}}},methods:{tableItemEnter:function(e){this.$emit("setIndex",e)},tableItemLeave:function(e){this.$emit("clearIndex",e)}}},(function(){var e=this,t=e._self._c;return t("div",{staticClass:"p-table-main"},e._l(e.data,(function(a,n){return t("div",{key:"table-".concat(a.id,"-").concat(n),ref:"table".concat(n),refInFor:!0,class:["p-table-box-item","p-table-box-item-radius-".concat(e.radius)],on:{mouseenter:function(t){return e.tableItemEnter(n)},mouseleave:function(t){return e.tableItemLeave(n)}}},e._l(e.tableHeader,(function(n,i){return t("div",{key:"".concat(a.id,"-header-").concat(n.key,"-").concat(i),class:["p-table-box-item-list","p-table-box-item-list-".concat(n.align)]},["[object Object]"===String(a[n.key])?t("section",{staticClass:"p-table-box-text",style:{width:"".concat(a[n.key].width||"auto","px"),color:a[n.key].color||""}},[e._v(e._s(a[n.key].text))]):t("div",{class:["建议,实际"===String(a[n.key])?"p-table-box-children-str":"p-table-box-children"]},e._l(a[n.key],(function(a,r){return t("div",{key:"".concat(i,"-tChild-").concat(r),class:["p-table-box-text-item"]},["string"==typeof a?t("section",{staticClass:"p-table-box-text p-table-box-text-str"},[e._v(e._s(a))]):t("section",{staticClass:"p-table-box-item-words"},e._l(n.children,(function(n,i){return t("article",{key:"".concat(r,"-tHeaderC-").concat(n.key,"-").concat(i)},e._l(a[n.key],(function(n,i){return t("p",{key:"".concat(r,"-tcTh-").concat(i),staticClass:"p-table-box-text p-table-box-text-str p-table-box-item-words-p",style:a.width&&{width:"".concat(a.width,"px")}},[e._v(e._s(n))])})),0)})),0)])})),0)])})),0)})),0)}),[],!1,null,null,null).exports,r=function(){return!!window.ActiveXObject||"ActiveXObject"in window},l=function(){var e=document.createElement("div");e.style.cssText="position:absolute;top:-1000px;width:100px;height:100px;overflow:hidden;opacity:0;";var t=document.body.appendChild(e).clientWidth;e.style.overflowY="scroll";var a=e.clientWidth;r()?e.removeNode(!0):e.remove();var n=t-a;return n<6?6:n},o=a({name:"ViewTable",mixins:[{computed:{persagyImgServer:function(){return"string"==typeof this.meriDesignCustomImageServer?this.meriDesignCustomImageServer:"http://47.95.122.141:8200"}}}],props:{tableHeader:{type:Array,default:function(){return[]}},data:{type:Array,default:function(){return[]}},width:{type:[String,Number],default:"100%"},height:{type:[String,Number],default:""}},components:{TableHeader:n,TableMain:i},data:function(){return{fixedHeaderData:[],fixedTableData:[],fixedWidth:0,scrollLeft:0,scrollTop:60,tableIndex:null,fixedIndex:null,scrollBar:4}},watch:{tableHeader:{handler:function(e){this.setFixedData(e,this.data)},deep:!0,immediate:!0},data:function(e){this.setFixedData(this.tableHeader,e)}},mounted:function(){this.scrollBar=l()},methods:{setFixedData:function(e,t){var a=e.filter((function(e){return e.fixed}));this.fixedHeaderData=a,this.fixedTableData=t.filter((function(e){var t={};return a.forEach((function(a){t[a.key]=e[a.key]})),t}))},setWidth:function(e){this.fixedWidth=e},tableScrollX:function(e){var t=e.target.scrollLeft;this.scrollLeft=t},setFixedIndex:function(e){this.fixedIndex=e},clearFixedIndex:function(){this.fixedIndex=null},setTableIndex:function(e){this.tableIndex=e},clearTableIndex:function(){this.tableIndex=null}}},(function(){var e=this,t=e._self._c;return t("div",{staticClass:"p-view-table"},[t("div",{staticClass:"p-view-table-main"},[t("div",{staticClass:"p-view-table-header"},[t("div",{staticClass:"p-view-table-header-content",style:{width:"".concat(Number(e.width)+e.scrollBar,"px"),transform:"translateX(".concat(-e.scrollLeft,"px)")}},[t("TableHeader",{attrs:{radius:"right",data:e.tableHeader,fixedData:e.fixedHeaderData},on:{setWidth:e.setWidth}})],1),e._v(" "),e.data&&e.data.length?t("div",{staticClass:"p-view-table-header-fixed p-view-table-content-fixed-shadow",style:{width:"".concat(e.fixedWidth,"px")}},[t("TableHeader",{attrs:{radius:"left",data:e.fixedHeaderData}})],1):e._e()]),e._v(" "),t("div",{staticClass:"p-view-table-content-wrapper",style:{height:"".concat(e.height,"px")},on:{scroll:e.tableScrollX}},[t("div",{staticClass:"p-view-table-content",style:{width:"".concat(e.width,"px")}},[[e.data&&e.data.length?t("TableMain",{attrs:{radius:"right",tableHeader:e.tableHeader,data:e.data,hoverIndex:e.tableIndex,height:e.height},on:{setIndex:e.setFixedIndex,clearIndex:e.clearFixedIndex}}):t("div",{staticClass:"p-table-no-data"},[t("img",{attrs:{src:"".concat(e.persagyImgServer,"/persagy_ui_kit/empty/data.png"),alt:"暂无数据"}}),e._v(" "),t("section",{staticClass:"p-table-no-data-text"},[e._v("暂无数据")])])],e._v(" "),t("div",{staticClass:"p-view-table-header-fixed p-view-table-content-fixed-shadow",style:{width:"".concat(e.fixedWidth,"px"),left:"".concat(e.scrollLeft,"px")}},[t("TableMain",{attrs:{radius:"left",tableHeader:e.fixedHeaderData,data:e.fixedTableData,hoverIndex:e.fixedIndex,height:e.height,hideBar:!0},on:{setIndex:e.setTableIndex,clearIndex:e.clearTableIndex}})],1)],2)])])])}),[],!1,null,null,null).exports;o.install=function(e){return e.component(o.name,o)};var d=o;return t}()},"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("ViewTable",[],t):"object"==typeof exports?exports.ViewTable=t():e.ViewTable=t();