dm-vue3-ui/lib/multiple-filter/index.vue.js

This Components Library will help get you started developing in Vue 3.

"use strict";const e=require("ant-design-vue/es"),l=require("vue"),t=require("@ant-design/icons-vue"),a=require("../i18n/index"),n=require("./component/date-range.vue"),i=require("./component/input.vue"),o=require("./component/select.vue"),c=require("./component/multiple-select.vue"),r=require("../utils/index"),s={class:"dm-multiple-filter"},u={class:"search-header"},d={key:0,style:{display:"flex"}},p={class:"search-container"},m={class:"search-value"},v={class:"dm-menu"},f=["onClick","title"],g={class:"extra-tools-wrap"},y={key:0,class:"search-board-wrap"},k={class:"tag-title"},h=["title"],N={class:"search-operation-btns"},b={class:"condition-temp-container"},V={class:"template-content"},x={class:"tips"},B={class:"save-condition"},E=l.defineComponent({name:"dm-multiple-filter",__name:"index",props:{config:{default:()=>[]},moduleKey:{default:"moduleKey"}},emits:["search"],setup(E,{emit:C}){var w;const T=E,F=C,S=(null==(w=JSON.parse(JSON.stringify(T.config)))?void 0:w.filter((e=>e.value)))||[],D=l.ref(!1),K=l.ref(""),q=l.ref(S),$=l.ref(""),_=l.ref([]),M=l.computed((()=>T.config.map((e=>({label:e.label,value:e.field,type:e.type,disabled:e.disabled}))))),O=l.computed((()=>T.config.find((e=>e.field===K.value)))),I=l.computed((()=>{var e;return{input:i,select:o,"multiple-select":c,"date-range":n}[null==(e=O.value)?void 0:e.type]})),A=e=>{[e].forEach((e=>{let l=T.config.find((l=>l.field===e.field));if(l){let t,{field:a,label:n,type:i}=l;switch(l.type){case"input":"string"==typeof e.value&&0!==e.value.trim().length&&(t={field:a,label:n,type:i,value:e.value,tagText:e.value});break;case"select":let o=l.options.find((l=>l.value===e.value));o&&(t={field:a,label:n,type:i,value:o.value,tagText:o.label});break;case"multiple-select":if(Array.isArray(e.value)){let o=l.options.filter((l=>e.value.includes(l.value)));o.length>0&&(t={field:a,label:n,type:i,value:o.map((e=>e.value)),tagText:o.map((e=>e.label)).toString()})}break;case"date-range":r.validateRangeDateValue(e.value)&&(t={field:a,label:n,type:i,value:e.value,tagText:e.value.join(" - "),combinedFields:l.combinedFields})}if(t){let l=q.value.findIndex((l=>l.field===e.field));l>-1?q.value.splice(l,1,t):q.value.push(t)}}})),j()},U=()=>{q.value.splice(0,q.value.length),j()},J=()=>{r.addTemplate(T.moduleKey,{name:$.value,params:q.value}),$.value="",_.value=r.getTemplatesByModuleKey(T.moduleKey),D.value=!1},L=l.ref(),j=()=>{if(I.value===i){let e=L.value;if(""!==e){e.pressEnter();let t=z();l.nextTick((()=>{F("search",t)}))}else{let e=z();l.nextTick((()=>{F("search",e)}))}}else{let e=z();l.nextTick((()=>{F("search",e)}))}},z=()=>{let e={};return q.value.forEach((l=>{let{field:t,type:a,value:n}=l;switch(a){case"input":case"select":case"multiple-select":e[t]=n;break;case"date-range":l.combinedFields&&2===l.combinedFields.length?(e[l.combinedFields[0]]=n[0],e[l.combinedFields[1]]=n[1]):e[t]=n}})),e};return l.watch((()=>T.config),(()=>{_.value=r.getTemplatesByModuleKey(T.moduleKey),K.value=T.config.length>0?T.config[0].field:""}),{deep:!0,immediate:!0}),l.onMounted((()=>{})),(n,i)=>{const o=e.Select,c=e.Button,E=e.Dropdown,C=e.Input,w=e.Popover;return l.openBlock(),l.createElementBlock("div",s,[l.createElementVNode("div",u,[n.config.length>0?(l.openBlock(),l.createElementBlock("div",d,[l.createElementVNode("div",p,[n.config.length>1?(l.openBlock(),l.createBlock(o,{key:0,class:"selection-menu",value:K.value,"onUpdate:value":i[0]||(i[0]=e=>K.value=e),"dropdown-match-select-width":!1,options:M.value,"get-popup-container":e=>e.parentNode,"dropdown-class-name":"dropdown-selection-menu",size:"small"},null,8,["value","options","get-popup-container"])):l.createCommentVNode("",!0),l.createElementVNode("div",m,[(l.openBlock(),l.createBlock(l.resolveDynamicComponent(I.value),{ref_key:"component1",ref:L,data:O.value,onApply:A},null,40,["data"]))]),l.createVNode(l.unref(t.SearchOutlined),{onClick:j})]),_.value.length?(l.openBlock(),l.createBlock(E,{key:0,"get-popup-container":e=>e.parentNode},{overlay:l.withCtx((()=>[l.createElementVNode("div",v,[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(_.value,((e,a)=>(l.openBlock(),l.createElementBlock("div",{key:a,onClick:l=>(e=>{q.value=[...e.params],j()})(e),class:"dm-menu-item",title:e.name},[l.createElementVNode("span",null,l.toDisplayString(e.name),1),l.createVNode(l.unref(t.DeleteOutlined),{class:"delIcon",onClick:l.withModifiers((l=>(e=>{r.deleteTemplate1(T.moduleKey,e.name),_.value=r.getTemplatesByModuleKey(T.moduleKey)})(e)),["stop"])},null,8,["onClick"])],8,f)))),128))])])),default:l.withCtx((()=>[l.createVNode(c,{class:"select-search-temp"},{default:l.withCtx((()=>[l.createTextVNode(l.toDisplayString(l.unref(a.$t)("multipleFilter.filterTemplate")),1)])),_:1})])),_:1},8,["get-popup-container"])):l.createCommentVNode("",!0)])):l.createCommentVNode("",!0),l.createElementVNode("div",g,[l.renderSlot(n.$slots,"extra-tools")])]),q.value.length?(l.openBlock(),l.createElementBlock("div",y,[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(q.value,(e=>(l.openBlock(),l.createElementBlock("span",{key:e.field,class:"search-tags"},[l.createVNode(l.unref(t.CloseCircleOutlined),{style:{"margin-right":"5px"},onClick:l=>(e=>{let l=q.value.findIndex((l=>l.field===e));-1!=l&&q.value.splice(l,1),j()})(e.field)},null,8,["onClick"]),l.createElementVNode("span",k,l.toDisplayString(e.label)+":",1),l.createElementVNode("span",{class:"tag-value",title:e.tagText},l.toDisplayString(e.tagText),9,h)])))),128)),l.createElementVNode("div",N,[l.createElementVNode("span",{class:"clean-condition",onClick:U},l.toDisplayString(l.unref(a.$t)("multipleFilter.clear")),1),l.createVNode(w,{visible:D.value,"onUpdate:visible":i[2]||(i[2]=e=>D.value=e),trigger:"click","get-popup-container":e=>e.parentNode,placement:"bottom"},{content:l.withCtx((()=>[l.createElementVNode("div",b,[l.createElementVNode("div",V,[l.createVNode(C,{value:$.value,"onUpdate:value":i[1]||(i[1]=e=>$.value=e),placeholder:l.unref(a.$t)("multipleFilter.placeholder")},null,8,["value","placeholder"]),l.createVNode(c,{class:"save-template-btn",disabled:""===$.value,onClick:J},{default:l.withCtx((()=>[l.createTextVNode(l.toDisplayString(l.unref(a.$t)("multipleFilter.save")),1)])),_:1},8,["disabled"])]),l.createElementVNode("p",x,l.toDisplayString(l.unref(a.$t)("multipleFilter.tips")),1)])])),default:l.withCtx((()=>[l.createElementVNode("span",B,l.toDisplayString(l.unref(a.$t)("multipleFilter.save")),1)])),_:1},8,["visible","get-popup-container"])])])):l.createCommentVNode("",!0)])}}});module.exports=E;