UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

2 lines (1 loc) 7.97 kB
(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("lodash-es"),require("../button-edit/index.umd.js"),require("../input-group/index.umd.js"),require("../common/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","lodash-es","../button-edit/index.umd.js","../input-group/index.umd.js","../common/index.umd.js"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f["enum-editor"]={},f.Vue,f.LodashES,f.FButtonEdit,f.FInputGroup,f.common))})(this,function(f,e,E,g,F,C){"use strict";const h={items:{type:Array,default:[]},valueField:{type:String,default:"id"},textField:{type:String,default:"name"},beforeOpen:{type:Function,default:()=>!0},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},w={items:{type:Array,default:[]},valueField:{type:String,default:"value"},textField:{type:String,default:"name"}},T=e.defineComponent({name:"FEnumEditorTable",props:w,emits:["selected"],setup(l,m){const s=e.ref(l.items||[]),r=e.ref(),n=e.ref();function o(t){if(!n.value||!s.value||s.value.length===0){n.value=void 0;return}const a=n.value.index;let i=a;a===t?(i=Math.min(a+1,s.value.length-1),i<0?n.value=void 0:(i=i<t?i:t,n.value={item:s.value[i],index:i})):(i=a>t?a-1:a,i>=0&&i<s.value.length&&(n.value={item:s.value[i],index:i}))}function d(t,a){t.stopPropagation();try{s.value.splice(a,1),n.value&&(o(a),m.emit("selected",n.value))}catch(i){console.error("An error occurred during the enumeration data update:",i)}}function u(t,a){n.value=a,m.emit("selected",a)}function b(t){var a;return(a=r.value)==null?void 0:a.querySelector('[data-index="'+t+'"]')}function v(t){var i;if(!t||!t.length){n.value=void 0;return}const a=(i=n.value)==null?void 0:i.item;a&&typeof l.valueField=="string"&&l.valueField in a&&(new Set(t.map(x=>x[l.valueField])).has(a[l.valueField])||(n.value=void 0))}e.watch(()=>l.items,t=>{s.value=t,v(t)}),e.watch(()=>{var t;return(t=n.value)==null?void 0:t.index},t=>{if(t===void 0)return;const a=b(t);a&&a.scrollIntoView({block:"center",inline:"nearest"})});function c(t){return t.map((a,i)=>{var V;return e.createVNode("tr",{onClick:p=>u(p,{item:a,index:i}),key:a.id,"data-index":i,class:((V=n.value)==null?void 0:V.index)===i?"selected":""},[e.createVNode("td",null,[e.createVNode(F,{modelValue:a[l.valueField],"onUpdate:modelValue":p=>a[l.valueField]=p},null)]),e.createVNode("td",null,[e.createVNode(F,{modelValue:a[l.textField],"onUpdate:modelValue":p=>a[l.textField]=p},null)]),e.createVNode("td",{style:"width: 42px"},[e.createVNode("button",{type:"button",class:"btn btn-link",onClick:p=>d(p,i)},[e.createVNode("span",{class:"f-icon f-icon-close"},null)])])])})}return()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"shading-border-top",style:"position: absolute;top: 0;width: 100%;z-index: 2;"},null),e.createVNode("div",{class:"table-body f-utils-fill win11Scroll show nobtn ml-3",style:"overflow-y: scroll;"},[e.createVNode("table",{class:"table table-bordered",ref:r},[e.createVNode("thead",{style:"position: sticky; top: 0; z-index: 1;"},[e.createVNode("tr",null,[e.createVNode("th",null,[e.createVNode("b",null,[e.createTextVNode("编码")])]),e.createVNode("th",null,[e.createVNode("b",null,[e.createTextVNode("名称")])]),e.createVNode("th",{style:"width: 42px"},null)])]),e.createVNode("tbody",null,[c(s.value)])])])])}}),S={activeData:{type:Object,default:null},itemsTotal:{type:Number,default:0}},k=e.defineComponent({name:"EnumEditorButtons",props:S,emits:["add","clear","move"],setup(l,m){const s=e.ref(l.activeData),r=e.ref(l.itemsTotal),n=e.computed(()=>{var c;return((c=s.value)==null?void 0:c.index)??-1}),o=e.computed(()=>r.value&&n.value>0),d=e.computed(()=>r.value&&n.value>-1&&n.value<r.value-1);function u(){m.emit("add")}function b(){m.emit("clear")}function v(c,t){m.emit("move",c,t)}return e.watch(()=>l.activeData,c=>{s.value=c}),e.watch(()=>l.itemsTotal,c=>{r.value=c}),()=>e.createVNode("div",{class:"footer-container mx-3 d-flex align-items-center",style:"height: 36px;"},[e.createVNode("button",{type:"button",onClick:u,class:"btn btn-sm btn-primary mr-2"},[e.createVNode("span",{class:"f-icon f-icon-add"},null),e.createTextVNode("新增")]),e.createVNode("button",{type:"button",onClick:b,class:"btn btn-sm btn-secondary mr-3",disabled:!r.value},[e.createVNode("span",{class:"f-icon f-icon-delete"},null),e.createTextVNode("清空")]),e.createVNode("button",{type:"button",disabled:!o.value,onClick:c=>v(c,"top"),class:"btn btn-sm btn-secondary mr-1"},[e.createVNode("span",{class:"f-icon f-icon-roofing"},null),e.createTextVNode("置顶")]),e.createVNode("button",{type:"button",disabled:!o.value,onClick:c=>v(c,"up"),class:"btn btn-sm btn-secondary mr-1"},[e.createVNode("span",{class:"f-icon f-icon-arrow-chevron-up"},null),e.createTextVNode("上移")]),e.createVNode("button",{type:"button",disabled:!d.value,onClick:c=>v(c,"down"),class:"btn btn-sm btn-secondary mr-1"},[e.createVNode("span",{class:"f-icon f-icon-arrow-chevron-down"},null),e.createTextVNode("下移")]),e.createVNode("button",{type:"button",disabled:!d.value,onClick:c=>v(c,"bottom"),class:"btn btn-sm btn-secondary"},[e.createVNode("span",{class:"f-icon f-icon-page-last",style:"transform: rotate(90deg);"},null),e.createTextVNode("置底")])])}});function D(){function l(n,o){if(o){const{index:d}=o;d>0&&(n.unshift(o.item),n.splice(d+1,1),o.index=0)}}function m(n,o){if(o){const{index:d}=o;if(d>0){const u=n.splice(d,1);n.splice(d-1,0,...u),o.index=d-1}}}function s(n,o){if(o){const{index:d}=o;if(d<n.length-1){const u=n.splice(d,1);n.splice(d+1,0,...u),o.index=d+1}}}function r(n,o){if(o){const{index:d}=o;d<n.length-1&&(n.push(o.item),n.splice(o.index,1),o.index=n.length-1)}}return{moveTop:l,moveUp:m,moveDown:s,moveBottom:r}}const N=e.defineComponent({name:"FEnumEditorContainer",props:h,emits:["dataChanged"],setup(l,m){const{moveTop:s,moveDown:r,moveBottom:n,moveUp:o}=D(),{guid:d}=C.useGuid(),u=e.ref(l.items||[]),b=e.ref(),v=e.ref();function c(){u.value.push({id:d(),[l.valueField]:"",[l.textField]:""}),m.emit("dataChanged",u.value)}function t(){u.value=[],b.value=void 0,m.emit("dataChanged",[])}function a(V,p){switch(p){case"top":s(u.value,b.value);break;case"up":o(u.value,b.value);break;case"down":r(u.value,b.value);break;case"bottom":n(u.value,b.value);break}m.emit("dataChanged",u.value)}function i(V){b.value=V}return()=>{var V;return e.createVNode("div",{class:"h-100 d-flex flex-column"},[e.createVNode(T,{ref:v,valueField:l.valueField,textField:l.textField,items:u.value,onSelected:i},null),e.createVNode(k,{activeData:b.value,itemsTotal:(V=u.value)==null?void 0:V.length,onAdd:c,onClear:t,onMove:(p,x)=>a(p,x)},null)])}}}),y=e.defineComponent({name:"FEnumEditor",props:h,emits:["submitModal"],setup(l,m){const s='<i class="f-icon f-icon-lookup"></i>',r=e.ref(l.valueField),n=e.ref(l.textField),o=e.ref(l.items||[]),d=e.ref(),u=e.computed(()=>{var t;return`共 ${((t=o.value)==null?void 0:t.length)||0} 项`});e.watch(()=>l.items,t=>{o.value=t}),e.watch(()=>l.valueField,t=>{r.value=t}),e.watch(()=>l.textField,t=>{n.value=t});function b(t){d.value=t}function v(){return d.value=E.cloneDeep(o.value),e.createVNode(N,{valueField:r.value,textField:n.value,items:d.value,onDataChanged:b},null)}const c={title:"枚举数据编辑器",fitContent:!1,height:500,width:600,acceptCallback:()=>{o.value=d.value;const t=d.value.map(a=>({[r.value]:a[r.value],[n.value]:a[n.value]}));m.emit("submitModal",t)},rejectCallback:()=>{}};return()=>e.createVNode(g,{modelValue:u.value,"onUpdate:modelValue":t=>u.value=t,editable:!1,disabled:l.disabled,readonly:l.readonly,inputType:"text",enableClear:!1,buttonContent:s,buttonBehavior:"Modal",modalOptions:c},{default:()=>[e.createVNode("div",{class:"h-100 d-flex flex-column"},[v()])]})}}),B={install(l){l.component(y.name,y),l.component(N.name,N)}};f.EnumEditor=y,f.default=B,f.enumEditorProps=h,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});