mfish-nocode-view/packages/nocode/core/EchartsBaseConfig.js

import{Cn as e,K as t,Q as n,_n as r,mr as i,xt as a}from"./common.js";import{t as o}from"./TextStyle.js";import{Fragment as s,createBlock as c,createElementBlock as l,createElementVNode as u,createTextVNode as d,createVNode as f,defineComponent as p,normalizeClass as m,normalizeStyle as h,openBlock as g,ref as _,renderList as v,renderSlot as y,resolveComponent as b,toDisplayString as x,unref as S,watch as C,withCtx as w}from"vue";import{RadioButton as T,RadioGroup as E,Select as D,SelectOption as O,Tooltip as k}from"ant-design-vue";import{useDesign as A}from"@mfish/core/hooks";import{Icon as j}from"@mfish/core/components/Icon";var M={class:`title`},N={style:{display:`flex`,gap:`6px`}},P=i(p({__name:`EchartsTitleConfig`,setup(t){let i=a(),c=_({}),p=_({}),{prefixCls:h}=A(`echarts-title-config`),y=[{title:`左`,value:`left`,icon:`iconfont:icon-mfish-left-align`},{title:`中`,value:`center`,icon:`iconfont:icon-mfish-horizontal-center`},{title:`右`,value:`right`,icon:`iconfont:icon-mfish-right-align`}],x=[{title:`上`,value:`top`,icon:`iconfont:icon-mfish-top-align`},{title:`中`,value:`middle`,icon:`iconfont:icon-mfish-vertical-center`},{title:`下`,value:`bottom`,icon:`iconfont:icon-mfish-bottom-align`}];C(()=>i.getCurConfigComponent,e=>{e&&D()},{immediate:!0});function D(){c.value={};let e=i.getCurConfigComponent?.chart?.options?.title;if(!e)return;c.value.font=e?.textStyle?.fontFamily,c.value.fontSize=e?.textStyle?.fontSize?.replace(`px`,``),c.value.textColor=e?.textStyle?.color,c.value.fontStyle=e?.textStyle?.fontStyle?{italic:!0}:{},c.value.hAlignType=e?.left,p.value={},p.value.font=e?.subtextStyle?.fontFamily,p.value.fontSize=e?.subtextStyle?.fontSize?.replace(`px`,``),p.value.textColor=e?.subtextStyle?.color;let t=e?.subtextStyle?.fontStyle?{italic:!0}:{},n=e?.subtextStyle?.fontWeight?{bold:!0}:{};p.value.fontStyle={...t,...n},p.value.hAlignType=e?.left}function O(e){i.getCurConfigComponent.chart.options.title.left=e.value,c.value.hAlignType=e.value,p.value.hAlignType=e.value}function P(e){delete i.getCurConfigComponent.chart.options.title.textStyle?.fontStyle,delete i.getCurConfigComponent.chart.options.title.textStyle?.fontWeight,F(e)}function F(e){i.getCurConfigComponent.chart.options.title.textStyle={...i.getCurConfigComponent.chart.options.title.textStyle,...e.style}}function I(e){delete i.getCurConfigComponent.chart.options.title.subtextStyle?.fontStyle,delete i.getCurConfigComponent.chart.options.title.subtextStyle?.fontWeight,L(e)}function L(e){i.getCurConfigComponent.chart.options.title.subtextStyle={...i.getCurConfigComponent.chart.options.title.subtextStyle,...e.style}}function R(e){i.getCurConfigComponent.chart.options.title={...i.getCurConfigComponent.chart.options.title,show:e}}return(t,a)=>{let _=b(`AInput`);return g(),l(`div`,{class:m(S(h))},[f(n,{title:`标题`,"default-expand":!1,"allow-check":!0,"title-check":S(i).getCurConfigComponent.chart.options.title?.show,onChecked:R},{default:w(()=>[a[7]||=u(`div`,{class:`title`},` 主标题`,-1),f(_,{value:S(i).getCurConfigComponent.chart.options.title.text,"onUpdate:value":a[0]||=e=>S(i).getCurConfigComponent.chart.options.title.text=e,"show-count":``,maxlength:50},null,8,[`value`]),f(o,{"hide-font-style":[S(r).Underline,S(r).Strikethrough,S(r).Bold],"hide-align":!0,"color-type":1,"text-style":c.value,onFontChange:F,onSizeChange:F,onHAlignChange:O,onFontStyleChange:P,onColorChange:F},null,8,[`hide-font-style`,`text-style`]),a[8]||=u(`div`,{class:`title`},` 副标题`,-1),f(_,{value:S(i).getCurConfigComponent.chart.options.title.subtext,"onUpdate:value":a[1]||=e=>S(i).getCurConfigComponent.chart.options.title.subtext=e,"show-count":``,maxlength:50},null,8,[`value`]),f(o,{"hide-font-style":[S(r).Underline,S(r).Strikethrough],"hide-align":!0,"color-type":1,"text-style":p.value,onFontChange:L,onSizeChange:L,onHAlignChange:O,onFontStyleChange:I,onColorChange:L},null,8,[`hide-font-style`,`text-style`]),u(`div`,M,[a[6]||=d(` 标题位置 `,-1),f(S(E),{size:`small`,value:S(i).getCurConfigComponent.chart.options.title.left,"onUpdate:value":a[2]||=e=>S(i).getCurConfigComponent.chart.options.title.left=e},{default:w(()=>[(g(),l(s,null,v(y,e=>f(S(k),{key:e.value,placement:`top`,title:e.title},{default:w(()=>[f(S(T),{class:`radio-button`,value:e.value},{default:w(()=>[f(S(j),{size:12,icon:e.icon},null,8,[`icon`])]),_:2},1032,[`value`])]),_:2},1032,[`title`])),64))]),_:1},8,[`value`]),f(S(E),{size:`small`,value:S(i).getCurConfigComponent.chart.options.title.top,"onUpdate:value":a[3]||=e=>S(i).getCurConfigComponent.chart.options.title.top=e},{default:w(()=>[(g(),l(s,null,v(x,e=>f(S(k),{key:e.value,placement:`top`,title:e.title},{default:w(()=>[f(S(T),{class:`radio-button`,value:e.value},{default:w(()=>[f(S(j),{size:12,icon:e.icon},null,8,[`icon`])]),_:2},1032,[`value`])]),_:2},1032,[`title`])),64))]),_:1},8,[`value`])]),u(`div`,N,[f(S(e),{prefix:`左`,"is-number":!1,placeholder:`数字或百分比`,value:S(i).getCurConfigComponent.chart.options.title.left,"onUpdate:value":a[4]||=e=>S(i).getCurConfigComponent.chart.options.title.left=e},null,8,[`value`]),f(S(e),{prefix:`上`,"is-number":!1,placeholder:`数字或百分比`,value:S(i).getCurConfigComponent.chart.options.title.top,"onUpdate:value":a[5]||=e=>S(i).getCurConfigComponent.chart.options.title.top=e},null,8,[`value`])])]),_:1},8,[`title-check`])],2)}}}),[[`__scopeId`,`data-v-3038142d`]]),F={class:`color-contain`},I=i(p({__name:`EchartsThemeConfig`,props:{color:{type:String,default:`默认`}},emits:[`themeChange`],setup(e,{emit:n}){let r=e,i=n,a=_(r.color),{prefixCls:o}=A(`echarts-theme-config`);function f(){let e=t.find(e=>e.name===a.value);e&&i(`themeChange`,e)}return(e,n)=>(g(),c(S(D),{value:a.value,"onUpdate:value":n[0]||=e=>a.value=e,placeholder:`选择一个主题`,onChange:f},{default:w(()=>[(g(!0),l(s,null,v(S(t),(e,t)=>(g(),c(S(O),{label:e.name,value:e.name,key:t},{default:w(()=>[u(`div`,{class:m(S(o))},[d(x(e.name)+` `,1),u(`div`,F,[(g(!0),l(s,null,v(e.color,e=>(g(),l(`div`,{class:`color-box`,style:h({backgroundColor:e}),key:e},null,4))),128))])],2)]),_:2},1032,[`label`,`value`]))),128))]),_:1},8,[`value`]))}}),[[`__scopeId`,`data-v-2778f8a0`]]),L={class:`title`},R=i(p({__name:`EchartsBaseConfig`,props:{title:{type:String,default:`主题`}},emits:[`themeChange`],setup(e,{emit:t}){let r=t,i=a(),{prefixCls:o}=A(`echarts-base-config`);function s(e){i.getCurConfigComponent.chart.options.themeColor=e.name,i.getCurConfigComponent.chart.options.color=e.color,r(`themeChange`,e)}return(t,r)=>(g(),l(`div`,{class:m(S(o))},[f(n,{title:`基础配置`},{default:w(()=>[u(`div`,L,x(e.title),1),f(I,{color:S(i).getCurConfigComponent.chart.options.themeColor,onThemeChange:s},null,8,[`color`]),y(t.$slots,`default`,{},void 0,!0)]),_:3})],2))}}),[[`__scopeId`,`data-v-444121b4`]]);export{P as n,R as t};