vxe-design/lib/list-design/src/list-view.min.js

A PC-based visual designer based on Vxe UI, used for building zero-code and low-code platforms

"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_log=require("../../ui/src/log"),_dom=require("../../ui/src/dom"),_vn=require("../../ui/src/vn"),_util=require("../render/util"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeListView",props:{size:{type:String,default:()=>(0,_core.getConfig)().listView.size||(0,_core.getConfig)().size},config:Object,height:{type:[String,Number],default:()=>(0,_core.getConfig)().listView.height},loading:Boolean,formData:Object,actionButtons:Array,gridOptions:Object,gridEvents:Object,viewRender:Object},emits:["cell-action","update:formData","update:actionButtons"],setup(l,e){const s=_core.VxeUI.getComponent("vxe-grid"),a=_core.VxeUI.getComponent("vxe-loading"),{emit:c,slots:u}=e;var t=_xeUtils.default.uniqueId();const d=(0,_vue.ref)(),m=(0,_vue.ref)(),f=(0,_core.useSize)(l)["computeSize"],g=(0,_vue.reactive)({formConfig:{},searchFormData:{},searchFormItems:[],listTableColumns:[],tableColumns:[],footerData:[{}]}),v=(0,_vue.computed)(()=>{var e=l["gridOptions"],{formConfig:t,tableColumns:o,searchFormData:i,searchFormItems:r,footerData:n}=g,t=t["showStatistics"],e=e||{},s=Object.assign({minWidth:120},e.columnConfig);let a;return e.proxyConfig&&(a=Object.assign({autoLoad:!1},e.proxyConfig)),Object.assign({},e,{columns:o,columnConfig:s,showFooter:t,footerData:t?n:null,formConfig:{data:i,items:r},proxyConfig:a})}),p=(0,_vue.computed)(()=>{var e=l["gridEvents"];const o={};return _xeUtils.default.each(e,(e,t)=>{o[_xeUtils.default.camelCase("on-"+t)]=e}),o}),o={refElem:d,refGrid:m},i={computeSize:f},_={xID:t,props:l,context:e,reactData:g,getRefMaps:()=>o,getComputeMaps:()=>i},h=[],r=[],x=(_core.renderer.forEach((e,t)=>{var o,e=e["createListDesignSettingActionButtonConfig"];e&&(o={name:t},("custom"===(t=Object.assign((0,_util.createListDesignActionButton)({code:t}),e(o))).type?r:h).push(t))}),e=>{if(e&&e.length){const o={};var t=e.map(e=>(o[e.field]=null,{field:e.field,title:e.title,folding:e.folding,itemRender:e.itemRender}));return t.push({field:"active",title:"",folding:!1,collapseNode:e.some(e=>e.folding),itemRender:{name:"VxeButtonGroup",options:[{content:"查询",icon:"vxe-icon-search",status:"primary",type:"submit"},{content:"重置",icon:"vxe-icon-repeat",type:"reset"}]}}),{items:t,data:o}}return{items:[],data:{}}}),C=e=>e?e.map(e=>({field:e.field,title:e.title,visible:!!e.visible,width:e.width,cellRender:_xeUtils.default.clone(e.cellRender)})):[];const n=e=>{if(e){var{formConfig:e,searchItems:t,listColumns:o}=e;g.formConfig=e||{};{e=t||[];const{data:i,items:r}=x(e);g.searchFormData=i,g.searchFormItems=r,c("update:formData",i),(0,_vue.nextTick)()}{t=o||[];const n=g["formConfig"],s=t||[],{columns:a,actionButtons:l}=b(s,n);g.listTableColumns=s,g.tableColumns=a,c("update:actionButtons",l),(0,_vue.nextTick)(()=>{const e=v.value;if(e.proxyConfig)y("reload")})}}return(0,_vue.nextTick)()},b=(e,t)=>{const o=Object.assign({},t);var{showSeq:t,actionButtonList:i}=o;const r=[],n={},s=u.cellAction,a=u.footerCell;if(t&&r.push({type:"seq",field:"_seq",fixed:"left",width:70}),C(e||[]).forEach(e=>{e=Object.assign({},e);o.showStatistics&&a&&(e.slots={footer:e=>a(Object.assign({},e))}),e.field&&(n[e.field]=null),r.push(e)}),i&&i.length){t={field:"_active",title:(0,_core.getI18n)("vxe.table.actionTitle"),fixed:"right",width:"auto"};const l=[];i.forEach(t=>{if("custom"===t.type)return{content:t.name,name:t.code,icon:t.icon};var e,o=h.find(e=>e.code===t.code);let i=t.name,r=t.icon,n=t.status,s=t.permissionCode,a=t.classify;o&&(e=o.name,r=o.icon||"",n=o.status||"",s=o.permissionCode||"",a=o.classify||"",i=_xeUtils.default.toValueString(_xeUtils.default.isFunction(e)?e({name:o.code||""}):e)),a&&"cellButton"!==a||l.push({content:i,name:t.code,icon:r,status:n,permissionCode:s})}),s?t.slots={default(e){return s(Object.assign(Object.assign({},e),{buttons:l}))}}:t.cellRender={name:"VxeButtonGroup",props:{mode:"text"},options:l,events:{click(e,t){var o=t["option"];w("cell-action",Object.assign(Object.assign({},e),{button:o}),t.$event)}}},r.push(t)}return{rowRecord:n,columns:r,actionButtons:i}};const y=(e,...t)=>{var o=m.value;return o?o.commitProxy(e,...t):Promise.resolve()},w=(e,t,o)=>{c(e,(0,_core.createEvent)(o,{$listView:_},t))};t={dispatchEvent:w,clearConfig:()=>(c("update:formData",{}),Object.assign(g,{formConfig:{},searchFormData:{},searchFormItems:[],listTableColumns:[],tableColumns:[],footerData:[{}]}),(0,_vue.nextTick)()),loadConfig:n,parseConfig:e=>{var{formConfig:e,searchItems:t,listColumns:o}=e||{},{columns:o,rowRecord:e,actionButtons:i}=b(o||[],e||g.formConfig),{data:t,items:r}=(t=t||[],x(t||[]));return{formData:t,formItems:r,tableColumns:o,tableRecord:e,actionButtons:i}},getTableRecord:e=>{var t;return _xeUtils.default.isArray(e)?(t=b(e,g.formConfig)["rowRecord"],t):e?({formConfig:t,listColumns:e}=e,e=b(e||[],t||g.formConfig)["rowRecord"],e):{}},getQueryFilter:()=>{const{searchFormData:i,searchFormItems:e}=g,r=[];var t={items:r,type:"and"};return m.value&&e.forEach(e=>{var t,e=e["field"],o=i[e];o&&((t=[]).push({field:e,value:o,match:"exact",type:_xeUtils.default.isArray(o)?"array":""}),r.push({condition:t,type:"and"}))}),t},commitProxy:y};Object.assign(_,t,{});return(0,_vue.watch)(()=>l.config,e=>{n(e||{})}),l.config&&n(l.config),(0,_vue.provide)("$xeListView",_),(0,_vue.nextTick)(()=>{a||(0,_log.errLog)("vxe.error.reqComp",["vxe-grid"])}),_.renderVN=()=>{var{height:e,loading:t}=l,o=f.value,i=u.grid,r=v.value,n=p.value;return(0,_vue.h)("div",{ref:d,class:["vxe-list-view",{["size--"+o]:o,"is--loading":t}],style:e?{height:(0,_dom.toCssUnit)(e)}:null},[(0,_vue.h)("div",{class:"vxe-list-view--body"},[i?(0,_vue.h)("div",{class:"vxe-list-view--grid-wrapper"},(0,_vn.getSlotVNs)(i({$listView:_}))):s?(0,_vue.h)(s,Object.assign({},r,n,{ref:m}),Object.assign({},u,{default:void 0})):(0,_core.renderEmptyElement)(_)]),(0,_vue.h)(a,{class:"vxe-list-view--loading",modelValue:t})])},_},render(){return this.renderVN()}});