dm-vue3-ui
Version:
This Components Library will help get you started developing in Vue 3.
2 lines (1 loc) • 2.98 kB
JavaScript
"use strict";const e=require("ant-design-vue/es"),t=require("vue"),l=require("@ant-design/icons-vue"),a=require("../../i18n/index"),n={class:"multiple-select-filter"},r={class:"filter-panel"},o={key:0,class:"search"},i={class:"list"},c={class:"content"},d={class:"label"},s={key:1,class:"no-data"},u={class:"footer"},p={class:"trigger-container"},v={class:"content"},m=t.defineComponent({__name:"multiple-select",props:{data:{default:()=>({})}},emits:["apply"],setup(m,{emit:f}){const h=m,g=f,k=t.ref(!1),b=t.ref([]),N=t.ref(h.data.options),V=t.ref(!0),y=t.computed((()=>h.data.placeholder?h.data.placeholder:`输入${h.data.label}`)),C=e=>{e||(b.value=[]),k.value=e},x=()=>{b.value=[]},B=e=>{let t=h.data.options.filter((t=>t.label.includes(e.target.value)));N.value=t},E=()=>{k.value=!1;let e={field:h.data.field,value:b.value};g("apply",e),x()};return t.watch((()=>h.data.options),(e=>{N.value=e}),{deep:!0}),(m,f)=>{const h=e.Input,g=e.Checkbox,w=e.Button,S=e.Popover;return t.openBlock(),t.createElementBlock("div",n,[t.createVNode(S,{placement:"bottomLeft","overlay-class-name":"multiple-select-popover","get-popup-container":e=>e.parentNode,align:{offset:[0,-5]},trigger:"click",onVisibleChange:C,visible:k.value,"onUpdate:visible":f[0]||(f[0]=e=>k.value=e)},{content:t.withCtx((()=>[t.createElementVNode("div",r,[V.value?(t.openBlock(),t.createElementBlock("div",o,[t.createVNode(t.unref(l.SearchOutlined)),t.createVNode(h,{bordered:!1,placeholder:t.unref(a.$t)("multipleFilter.search"),allowClear:"",onChange:B},null,8,["placeholder"])])):t.createCommentVNode("",!0),t.createElementVNode("div",i,[N.value.length>0?(t.openBlock(!0),t.createElementBlock(t.Fragment,{key:0},t.renderList(N.value,((e,l)=>{return t.openBlock(),t.createBlock(g,{key:l,value:e.value,class:"item",checked:(a=e.value,b.value.findIndex((e=>e===a))>-1),onChange:t=>((e,t)=>{let{checked:l,value:a}=e.target;if(l)b.value.push(t.value);else{let e=b.value.findIndex((e=>e===a));-1!=e&&b.value.splice(e,1)}})(t,e)},{default:t.withCtx((()=>[t.createElementVNode("div",c,[t.renderSlot(m.$slots,"label",{record:e,index:l},(()=>[t.createElementVNode("div",d,t.toDisplayString(e.label),1)]))])])),_:2},1032,["value","checked","onChange"]);var a})),128)):(t.openBlock(),t.createElementBlock("div",s,t.toDisplayString(t.unref(a.$t)("multipleFilter.noMatch")),1))]),t.createElementVNode("div",u,[t.createVNode(w,{type:"link",class:"clear-btn",onClick:x},{default:t.withCtx((()=>[t.createTextVNode(t.toDisplayString(t.unref(a.$t)("multipleFilter.clear1")),1)])),_:1}),t.createVNode(w,{type:"primary",class:"submit-btn",onClick:E,disabled:b.value.length<=0},{default:t.withCtx((()=>[t.createTextVNode(t.toDisplayString(t.unref(a.$t)("multipleFilter.apply")),1)])),_:1},8,["disabled"])])])])),default:t.withCtx((()=>[t.createElementVNode("div",p,[t.createElementVNode("div",v,t.toDisplayString(y.value),1),t.createVNode(t.unref(l.DownOutlined))])])),_:3},8,["get-popup-container","visible"])])}}});module.exports=m;