@jecloud/ui
Version:
JECloud UI库,基于ant-design-vue封装
1 lines • 2.9 kB
JavaScript
var t=this&&this.__assign||function(){return t=Object.assign||function(t){for(var e,o=1,n=arguments.length;o<n;o++)for(var r in e=arguments[o])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},t.apply(this,arguments)};import{mergeProps as e,createVNode as o}from"vue";import{defineComponent as n,nextTick as r,onMounted as i,onUnmounted as l,ref as s}from"vue";import{isNumber as a,isArray as u,computedDomSize as p,darken as c}from"@jecloud/utils";import f from"../../input";import{useListeners as v,useModelValue as m}from"../../hooks";import h from"@simonwep/pickr";import"@simonwep/pickr/dist/themes/monolith.min.css";var d=h.prototype._rePositioningPicker;h.prototype._rePositioningPicker=function(){var t,e;d.call(this);var o=this.options;if(!o.inline){var n=o.offset,r=this._root.app;if(a(n))r.style.top=p(r.style.top)+n+"px",r.style.left=p(r.style.left)+n+"px";else if(u(n)){var i=null!==(t=n[0])&&void 0!==t?t:0,l=null!==(e=n[1])&&void 0!==e?e:0;r.style.top=p(r.style.top)+l+"px",r.style.left=p(r.style.left)+i+"px"}}};var y=["#F53F3F","#FF7D00","#FFF258","#00B42A","#14C9C9","#4E83FD","#722ED1","#333333","#555555","#7F7F7F","#AAAAAA","#D7D7D7","#E5E6EB","#FFFFFF"];export default n({name:"JeColor",components:{Input:f},inheritAttrs:!1,props:{value:{type:String,default:""},theme:{type:String,default:"input",validator:function(t){return["input","mini"].includes(t)}},colors:{type:Array,default:function(){return y}}},emits:["update:value","select"],setup:function(n,a){var u=a.slots,p=a.attrs,d=v({props:n,context:a}).fireListener,y=m({props:n,context:a,changeValid:!0}),F=s(),g=null,A="input"===n.theme;i((function(){r((function(){var t=A?F.value.$el:F.value;(g=h.create({el:t,theme:"monolith",useAsButton:!0,position:A?"bottom-end":"bottom-start",appClass:"je-color-picker",offset:[0,-4],swatches:n.colors,components:{preview:!0,opacity:!0,hue:!0,interaction:{input:!0,clear:"input"!==n.theme,save:!0}},i18n:{"btn:save":"确定","btn:cancel":"取消","btn:clear":"清空"}})).on("save",(function(t){var e=t?g.getColor().toHEXA().toString():"";!1!==d("select",{value:e,pickr:g})&&(y.value=e,g.hide())})).on("show",(function(){n.value&&g.setColor(n.value,!0)}))}))})),l((function(){g&&g.destroyAndRemove()}));var x=function(){return y.value?o("div",{class:["color-icon"],style:{backgroundColor:y.value,borderColor:c(y.value,15)}},null):"input"!==n.theme?o("i",{class:["color-icon-empty","jeicon jeicon-no-color"]},null):null};return function(){return"input"===n.theme?o(f,e(p,{"allow-clear":!0,value:y.value,"onUpdate:value":function(t){return y.value=t},class:"je-color je-color-input",ref:F}),t(t({},u),{prefix:function(){return x()},suffix:function(){return o("i",{class:"fal fa-palette color-button"},null)}})):o("span",{class:"je-color je-color-mini"},[o("span",{ref:F,class:"color-wrapper"},[x(),"minitext"===n.theme?o("span",{class:"color-text"},[y.value]):""])])}}});