vxe-pc-ui/lib/image/src/group.min.js

A vue based PC component library

Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_util=require("./util"),_xeUtils=_interopRequireDefault(require("xe-utils")),_image=_interopRequireDefault(require("./image"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeImageGroup",props:{urlList:[Array,String],showPreview:{type:Boolean,default:()=>(0,_core.getConfig)().imageGroup.showPreview},imageStyle:Object,zIndex:Number,size:{type:String,default:()=>(0,_core.getConfig)().imageGroup.size||(0,_core.getConfig)().size},toolbarConfig:Object,showPrintButton:{type:Boolean,default:()=>(0,_core.getConfig)().imageGroup.showPrintButton},showDownloadButton:{type:Boolean,default:()=>(0,_core.getConfig)().imageGroup.showDownloadButton},getThumbnailUrlMethod:Function},emits:["click","change","rotate"],setup(l,e){let o=e.emit;var t=_xeUtils.default.uniqueId();let i=(0,_core.useSize)(l).computeSize,s=(0,_vue.computed)(()=>{var e=l.urlList;return e?(_xeUtils.default.isArray(e)?e:[e]).map(e=>_xeUtils.default.isString(e)?{url:e,alt:""}:{url:e.url,alt:e.alt}):[]}),u=(0,_vue.computed)(()=>Object.assign({},(0,_core.getConfig)().imageGroup.imageStyle,l.imageStyle)),a=(0,_vue.computed)(()=>l.getThumbnailUrlMethod||(0,_core.getConfig)().imageGroup.getThumbnailUrlMethod),r={computeSize:i},g={xID:t,props:l,context:e,getComputeMaps:()=>r};Object.assign(g,{dispatchEvent(e,t,r){o(e,(0,_core.createEvent)(r,{$imageGroup:g},t))}},{handleClickImgEvent(e,t){var{showPreview:r,toolbarConfig:o,showPrintButton:i,showDownloadButton:u,zIndex:a}=l;let n=t.url;t=s.value;r&&n&&(0,_util.openPreviewImage)({activeIndex:Math.max(0,_xeUtils.default.findIndexOf(t,e=>e.url===n)),urlList:t,toolbarConfig:o,showPrintButton:i,showDownloadButton:u,zIndex:a,events:{change(e){g.dispatchEvent("change",e,e.$event)},rotate(e){g.dispatchEvent("rotate",e,e.$event)}}}),g.dispatchEvent("click",{url:n,urlList:t},e)}});return g.renderVN=()=>{var e=s.value,t=i.value;let r=u.value,o=a.value;return(0,_vue.h)("div",{class:["vxe-image-group",{["size--"+t]:t}]},e?e.map((e,t)=>(0,_vue.h)(_image.default,{key:t,src:e.url,alt:e.alt,width:r.width,height:r.height,getThumbnailUrlMethod:o})):[])},(0,_vue.provide)("$xeImageGroup",g),g},render(){return this.renderVN()}});