From 1401a091ebc54dffbb0ca60c36d364f3aeca5ba1 Mon Sep 17 00:00:00 2001
From: QuietlyChan <1013893148@qq.com>
Date: Fri, 28 Jul 2023 10:11:34 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=85=A8?=
=?UTF-8?q?=E5=B1=8F=E6=8C=89=E9=92=AE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../images/chart/decorates/fullScreen.png | Bin 0 -> 6161 bytes
.../Decorates/Mores/FullScreen/config.ts | 17 +++
.../Decorates/Mores/FullScreen/config.vue | 28 +++++
.../Decorates/Mores/FullScreen/index.ts | 14 +++
.../Decorates/Mores/FullScreen/index.vue | 111 ++++++++++++++++++
.../components/Decorates/Mores/index.ts | 12 +-
6 files changed, 181 insertions(+), 1 deletion(-)
create mode 100644 src/assets/images/chart/decorates/fullScreen.png
create mode 100644 src/packages/components/Decorates/Mores/FullScreen/config.ts
create mode 100644 src/packages/components/Decorates/Mores/FullScreen/config.vue
create mode 100644 src/packages/components/Decorates/Mores/FullScreen/index.ts
create mode 100644 src/packages/components/Decorates/Mores/FullScreen/index.vue
diff --git a/src/assets/images/chart/decorates/fullScreen.png b/src/assets/images/chart/decorates/fullScreen.png
new file mode 100644
index 0000000000000000000000000000000000000000..04167ed69e0f1fdb4bcaa774cf4af1f2c9a9a2a7
GIT binary patch
literal 6161
zcmaiYRa_H}_x2dw-8GcX5nn-abazimbaYQZN>UJ{6d2tgDGgG>KoHsJZloLOj+fuf
z|MtCj&UsE=oX_XnJkfeOs>B2g1ONblSY1uY;K|26;VmA{lQo*28GUjXa068ZK-Cb_
z&Ql-(GgG(I)&}rCaXbJ<lp_G^e=Sd7cme<b%me;kCN>ZA|M=Vg6`vCbVFCcOQR+(a
zM(;5WvYl(*ni}`{`VKFogVWhX{fO1sNpWoP@Ey3pHh5-KWaZo%1RT+<MH&M4cCxRa
z_<<vJtC*T{W==aL4k^kMN&=OuDK<pB%3Tp(Q`3sXdZf7${D!j+FD`HY!4DTAq*}zk
zwch%`FR~BeLmw)CUO*pzPR+FqzZ{pk{4X`QZkf-W*K(Kr=qtsHfy%G7+a^53adZ0~
z$DYr}Y%KpZpovCjk`h;F>hn-T%x~h{um%f6Zg3q@0&}_8ps1&qdvWEUbv1unTeTko
zITu1srkXq4?9+aD0Nbnj%<J&`7Xb|lXMUKQ4>m<DrrjnW<x?^snP1PKcgp`g{<03H
zO;417=o)j}82Axbl;zX^$^iBl6l@$XeKl#&<RSpHoo?*ZLk!KoQi;mt(OtZyg<Yqs
z8t8gt!|#PsA1ZuO)^r0qrB73&P|=FFXq)-?|Jrs%wlsmx(6p5=iZI9F4Gc}fh;i#+
zOQeXTPuiU`>VmMENUbTWrDVT-b+I>4uH@g(rZju0J+tXML4ioDDXdtN^`6iYTbTyB
z`|tCp=q(oXr&~;P4tx7c8dKP&2yAofE?pJgknLSLk0{Q&&2Yvi(vjQCN)QgyG)XAv
zgq3AUT)m@b`G7Ek*}uH`BaRMr55fR2@q~{Lara$5>e92mBm*(uEy<<+T5d}{EpE=H
z9F|pRhc}<y+<P6#$y$@holQ2FYj;ZJD&n8r6pORSEJ!`BqC3wNZ^1ZaSj~JDg_LMd
zRh(M&%ACk3{CBlVAM3gtd$__68e^|iQ=1Gfc<0W_?2!w_*C~Ls?Ks3gbE$3D<V=XS
zH19_MU6QB4P8O+8R_}i>SMWR#=#f?D@}YOqb4ks{6<JA>0C{PA^N7ffu}baS;W(mj
zm^o|rB^rVNnQiPqXMTrum;=(z?l|qfA?cwbTP<i3@M+~w`lBTbI~;}FEkP;dK>dXs
zG5|M?9xuqPZG9_;1PrhENe`A~@P3+@*=j`(bq_S&d>anLP1`{SRt4+>M5lK%Wlx!H
zz6qVS9M)nESX8**3_R`c7}#p<dm8`Vu_L;SVRs{vyT>x!sSF>A{Bb&PiZVHrXMx+_
z`j<`br96+y<x?e*X|tM4cDJ0f^2zagz;Qe+I(9J2nSb1l+;#sHs;%ev8c=w$d?U)r
zC+BxR*bamIY7s^<$#~V=jV~{lu=pMA36;fX+h<$LUVZK~^vU(bzwCgY-r^V}NFA`=
zT?B2wb8imn0{8#mKwTbq2{F@{?XzB0`E3ot<}a9GJ>x{-n_aEvMjpQp2~oY(!Sk&l
zFB$XhW|n?bR$Pr9VbK(08&$WjWRNDi2OZRJto&Q(WZ{GBcYs4iiLZ~cY&>7cJ*@jq
z{U_o#b2!U|!hH0<Y(?F4{klbU1|15aD}-8Zl4<P3ECkzzJF!M`mYVa0?}*SB<33fI
z!B)KdL^dO2BCLIN(hohpsO5*9>Vlc`1%m`h#sH+-_0_1?u)QokchDdAp3l5E?Oz<#
zg4=giduq=7=7(VJ%~kD}g`K^k7C*b&d`)aq&6toDrOWPfqu^<l+vesePFJ75{3JG3
z>^q}m)GnZ-AbC+L?IM(6mT@`;_Oyj^zRb4r^*TrCrhi(yXUlqwFXD3XJs-y9MKbf2
z=gRl__kcw9K>w!D2elhu`AdJ9uaTD-?~6Ll_nk$*4gRPcnpm%pQ*j8w>aVD~LVH@A
zwy3rA$!_pX$3<{_F&)b)w>p`hb~n$wiK}}?mZF){^<9H0Un@ldM-8aVmmh|0lzTUA
zd0urAnklP~0H8zqqAnL7%T97{Wv!dsz9*1IA!s5eE*-4L)}Ua5kx*p*zynrN<M$*J
zCUNDjo!VV^T4#V?>i4{2*pYu#1~kIe68^Xjm@X?knB&iGrghtadAs*mHe?u!tz`U(
ziyIR9cHu+iPSSejBa}qkYNmx8deOWdBfMkM)F@SmrGKyY#=ZEGNfW;-Ul8&HX?n<O
z{V>3q0$Z|JK@G0^@)Pu#rQy)!aZUBgOT;#F&X4%s6c3Y6Ur;hkq&tQs%wpoGJ4lq{
zP=mU$U(TfndxjPmq=%a^(S56ONr>jqgT?W<bU3lI^?5tI$B>yXlaznS;<2LnphuUn
zVg%SBDJ}6bGJ?lulCe+36_ZH}UN2Qt35hS<9fuS{5p5{if9*0e2aJ1S{hmD=e?o&a
zmPM#X0EW(!Q|hv?sZ&vh8{N#v%}SE`xYtH=X?b7duxSiqvqZxub@<ql>0O>XvwwnS
zFKP?J=3-f!z_z8H0%l({Vw$p)j(Il1zP;g(%^O|BBci6!D+PZA#Gom-ldoq3Hl)zE
za{i3MpAj&8w3mI$*5PvDzS3OflEnT?LI+BgA^~mrzfpVN<ViNM_0Cdczbn=-&3d>E
z6w&e8H|~ga+T+oEl<UC;K^Bzwn#o0TV#_5$l(1dBBTAAZ`qbe0e;Gm<mn&)V3FOy|
z<@ud!b*b4W41LKkOPfj|qZ^a&L%pcz_%?-&D!j?qc`Ylb#NUmpi#PmxkV2;(w*Dl-
zCfsOpUL-F`d2y|NwAh*++ZDJ?VB|dUu#+ThuFY(jd~oI98kyXP;1w&m`cD*j7AS)k
zR;sCCNhpX>bJmEn&3TL!^TO&_@-#-$lib1bH7|01*J~oDfyXoq0yV247gI`@>J{r2
z(x<TDe4oM~_G(WAr6X((K;Lz6E9PJLJ}8@#)i3yu5tG+1-0mz#g+VG}nlfq4=;j(J
zyC2@vmS)oRcX?J}*Jj&XI#6T*xj-7ES~L#C9;1b9hPV$|kZ~<h3@sWdZi#M>1`>;6
zQ27^mr%F6qLo;qu@Qz5b>!!>M8H=DNB^jJ0X{A<uD(S<%7SJgoyN*+r;EabjARbl|
zuCk+#d4Q!q_tAuh*7AaKBi3?@_7Y}6yclqK083xA^rOMdUo#ezVB>fZs*_p7<qjnk
zP(~`;n`xoiUs&fwBy3s$c5+-$Jcsz=OR?p}GCONpfI=zAq{i17<(dXWv5aJeesdMx
z4mZe)jDpx0JbkBFw`ol7NaP;}^Pm(!ly`Hu#y(%||H`G52YE$X1x*Z@hER*s!^(IU
z%|o=j7lE;Xm!U$*pM`>7`Q6mwqEjD_b@dqdxYI&_8z+680IqTpkGJ~h5l+ojgMp}T
zCeMV4w;VaZOz-I4)ueOw?@`tyM26AH)@B(a1UC9vOGwf>4nvw@S}r1gOO-tlJ#_%G
z)Ik&vkkG-a%%R^91kK8z<xnO4>2){L<+Z;Z>h=53G!=9BNW_UV2#bNfRg0R+$Ss12
zz(RrAM&)COB3T#lc|-_v7qCCZ?QdNE{rl^Q+<Sk$(SNn$nq@94+;v|mC7|(JxgW$j
zGgvn)Lx$yU-|zNnJ9fD|54qxM#*PglWtL=AQ-l!4wv@h!hkX&hCLf8FufT?mbArM*
z#l|KuM42R<UnPPtRq!LfmK0!x$HYC_T}*+yp%GOMTzvFzOKj^rBma8yMUm_a<=*cl
zq-qA=mDJHv5Qg^;4e|5#CKj{q^z11Q(vdu@vTU>ct#P-n9ov#V@Y2XZY5NH<7A}O4
z<=`Gc$osou(c+Ky|LD<qOe?NMkLZ7T`Zb_YW6yVm@pvziKvl+o#D7Zt6pVW&0`7y9
zkl(gJoO7iKM3$t;1W?ue+~xZCoRD&sP3P>JuDViYOC6n$#D6~Nk+s(gBKp#?GH{?Q
z_I8+5_H0-t_~qnTU<0o7VS*edI|zNPm*7!>!OHKx9$yRQ;}8uE%TOw{O{tJ3FSY(C
zjVKmL9gXx-PYZ8~D`vFvBM{h@w(0ekE7ZHSDb(h*bZi@xfs?BJ!uEBRg~?kYv(zi&
zx2Yl)l+K)BGe=W9&a*gh5Ra|YI{x{|ueaocH_;J{*T5uhEfa>7m$0<CnCBJji)ji9
zpD>51tBf6{#Yt;MMe5(%Fooq|=ZU^sfTm-8GAf93?aL69E3d`~0eNk(1=n)s6lw_+
zAOwQbhX6BfV-{(O${%3BVnRH5n$xbXk%{u}HE&juLqj~gu5e}6_?dIh7dD38)|w)1
z`MHYE<iGEmtx-_=6syLRB+dzI<?~^UX$dK51`|Ak4~}O%bJP)tH{vlk$*_%B|L|GU
z@<16{u2xmZ<%L7Q1dhYdH-64xp$HNSGn6md5dN~F^)Z4r5X<ZrZ3C9e_H3@8VmT8`
zs+Mj#ER1DGMYa@IR}ohukS(u)&QrC4@#I+AEWZim8!cejHY{S!r~I`<)_R6YQ}j1r
zfUnJ4E6kM}>BKm%E!mHrFnC*NGghcjRj+?)v1M+_NkD3UO%`grS19cWdnJ3fMmVMT
zr*)Okf3q<0$~zg+Rcrr6DJaIFAVs9_H<ZLF0A)0&i`7t1I*vj`?)C6)VgPC&QY}5q
zSN7H;9#qgs4b>cmqo?PEA$qF1wZc#!+PiM?1{+&E@(g>XhXycK1U>eF{C<pgG%Q@D
zaRS&x|At%l!r5QuzcsLj_texfR7Cd~o41NOb1TpQliRM8I#e^<EUA;vd`flikF*AQ
zhzB^_BuP*v)p_?fZ<A4T#fqe;fGJcD)4i=h=uH0SJ2y%vd_jyVO$xo21{5KG@HQ^C
zcF{2sQD&HaI?Skp!Qu`lE-9qbJeNu+*h-lnKqC)hlo~%^$OKUE$Ir(6dV{#52)F&M
zIWO<(u-P*{VXBT(FMR71ZX`nzZi+<kKpTsnk>_Ak-;xLqW;olGRV2N}LdA654E0ct
zhld$`fMW7fl`DU`t}c(LGy!@PcuYD5QmrL4mc`^}RY~j0O_W!pq5>S8S-$>Fi>U==
z2s-qL^vgOXLNb!Lvu3-S&p(}INav+{{+QAx>{Xzs!KAr<yC2{6P+_)PL{Td9z9ti(
z`cjKcn;A@$upz9V42W4kiWw5tY=7R<kO#1FPpW-zGprHurcS(N{qn+8|5f0pPtWlq
zwv`(vEJt(PxKLPDyJE;Zp<NACy<LkNGp<`g4oDu%!6+<~E!7SCotHAGA0$0POV;3B
zuZu33%;ODlz7BIou?t?l9KBJG@}GT21wxj!u1f0H$v{$4e$wF)m2sJ6VehC=N)(HE
zBe~P^G1vmgpkb{93hL>~N*LVwEz{KDVH9Az^mNV|X<bn49M#V=rxr*Nksdv-QDZ}Z
z_}e3)dUFwg;IX0Brv~iMTB0*R`IO31IY;SoA$2d1O`d1u06V9fV2daeK2ONf0Wl!F
zSnqcrRLdugzMJ9Y*+IT>DZ8%a|DzzeF4^Vv8)pEorpK$U;p>Cg_yk6wRLt!sgIY2A
z8cy2UJSuFuBhX4KYat}L)aICOR8<97LSTS#fxck2PlXH3ykZHu+S}+kUUM|;Qk1Gp
z{2Lo>Q1<l;?q_I*4>nx`$fuZ3Gm*``)~#`17b9`75!CdYBgawj&e(6b*PXYIl$BRk
z_QINnR-?7RM&K9O{)kop5-SAG@Y;s>dnvUi#cSnfq(K}5^lRMJvCk(;P8&CagGG0$
zjN9RJA%cgYWjh8lU2VxO3S={S<?B1u)D&S2@sQe%3@3pR8?@ubug){vjRWyJ20^<r
z>7F;tQ{(?|^ConpGRm3=K-&s6#1LaTZ2XKyNR_`q<O%ktE$>I19ITl3E3U^@<#*<%
zEv~1#m&v4$C@%Dp_|LYxOW%J&QKW~u?JBrsZ*;Sa7@+^n^{t{3PV)bFhEw}{FvT^J
zU)fTD9c#WJ{^IXFf-QCBCi6@&By87+iWJKc#dYjt(2smsJ<>+v)+^W1A64_3<n9OH
z=qj1ilTZCCUR}MWUhV=IE)kXI<p517tV5xp>EI(o9sKem0Ar3D$BkVncXDyUn7T#l
zaS9thmWCUs#xWfy^B<o3-Q=Bq%ipnz?O;8hed&_@rPJ1sVq8|i-0w-QfZw^d9^0vv
zfRDU8LiYhHJt&Ff6y)pcxHeRdHg#q}CN!f}(@7Qa^D|Kna`aY;42qp-Q#w5)Q1={c
zp9QQCEDhs@3n2|=@Fq~~?qCX~jCV!~^%+7QR_H>I_(GubvHEZLg@wuC!|5wf;i|)S
zln<}iu@Zm&0f%<ZBR3pA1gDgl^cnO+Nw5+j#&86I3XAbIT5?&q7H^&2da=f1PB43o
zG~rvMlYzX=!XomdYl($T@bqD*vXr~zw(pC^=x5vwG){!_I7$TNbtYZm{Kn<=xi0q~
z8o`aO{3a<*988j9<t8AMLVrMYpek~;5VSO0_jnwokMIoFForj_9LL-_SQdCdia5yi
zT=|nM?HPKy|K_|ih2~D+V*7n4TlxJ>FOh9dQ)v!M&u12}D8T{2mjf1@fCo;pr(%2Y
zVdv(dy({3D*>6scP;@9jUnhAIkO!rbH;^OHehu9pO}0rpne6uxhyi)vbY8?QEC!Er
zoh&5!UIzcl%zao%h<4l)p*v@%5&j#;h}y5#NUCz<LH1yoskYWqtOw}U9XfL38O%N=
zx<!kUt@!Su)Y{T#%y=*+0LAy(WlO<@jOBUc+|L>p6C52QkBB<#Na*?&pmg7(HOyTt
z`KNc&gz#eFRL_htG-Q4Unl74IdUGnzSnLP=(oJP_tMt8`W^DS$YkhNe@Gh`m$Rk9R
zz41x&p@I@EYV(tdHLwGVf0C5C7G8rIYvVv;H$*3felh%59urCS@h3UCihx9)-VY67
zP`Z`Zy-CN}=h;dpWAT;wQsIis2Sk!q6=)iX1JAVCfBO`4Lq1)`-#>qY3K?iOP3RER
z+u|yN?x+2IALGs=4={W$|Fw0>5{Ou+Xp?zFz3{z|m#!sDZU6%nE-4^0q$p~lhj9<Q
zEVDwhPbxcnDAn^<KO*H`hJ*IIwBWJM7z`&n9l9Sv28v3BHG$kKiaA}b*t*<<cg}_w
zc8y{MWGRuhSek@6o)@fGQ6Nb_rAofRB(#8UfTyDP0=wBRWwb28Nv~8et@7)`>mD!t
z*=BZ4s444MAUTMA0h(;QSb6qiO1-o5%Q@B><zzg(ml{_kv69AHV6J{({!gi0zx9n3
zaSp?>LqQ{`BEEuuAn^zH)z$8;EHu|Uo^e$_QRsyG6QdQ-wm8U{x`>NGXZ4UeuI<5k
z@%xE2d71X)dqKdd7yIU|xlgvQr{BNfdrs0{?!$_9Lhs$SH^>68z2_zNsS{_CwP{Jf
zILP_y;h8rc9`@F4m+@Z1%l9i2A3JaKXUlwLyGUs9z$$|O;WJ<wShon%x$sN}ZzC%G
z=T0t44RV7oY8S-Z7E?7e=dFyFuBJ#+M29=_elrW{&q6LL>xG^juF8dSjl57Xe>!{!
zeLRA(w=}DjeCyVH=`KE3x7~~PqwDdY@x<e<jBi%C#z}R@g*`ez_Jr}Sw58T}vPIYd
zlDUio3>6e<w`usd0A+hB`dDr*I@dX557+Hr4c?g}{ogVf-Gv_Lv{<)V^22d+tbVj9
z4$B$G>rcNB`c^;H$mk0#E@8QsO-Prn5xn;+1E2S4aq`f~pD<WiG&i`aQnguGS0$4i
zCC-wv-2C=8HvF(s>@Fzfdtg4zVQwz8{)R0<x}h4csYQ424JYB+SEE1p3&`;0R(IQ0
z{2G=Fy6YBDJ6O<Bu;?d1%O}Jfz@Y=jds5tZ4zRZ?Fb9C#o*9bU08wp6A&51z4GkoE
zoJj#U%~2x&<7O97575ZkB$GsH8O{-onBt~k>#d4KjbPYij9G<raN^Q^U_KmMRk!g9
zab)Q<lm2q=kl^4Iay^RJ>yGch9Oy3h5y9L8h|;$R@=ub02`lFMi7GJ%-mbUS7)c@d
zE1kGRYe>LJU-r5U4gmEv<=IH&dq_3r0M=6jyC3+8bvya~e>dE?obQUu>U_(M-wji<
zK|3_JS6kmDv}X1YzCQ`RYMRd6k<eaxF*mKU=gRrAst?WcyC*>I@}BjQ$;gI1QV{=t
P(!9E|j#8C^P1yefNS3H7
literal 0
HcmV?d00001
diff --git a/src/packages/components/Decorates/Mores/FullScreen/config.ts b/src/packages/components/Decorates/Mores/FullScreen/config.ts
new file mode 100644
index 00000000..f6a1a938
--- /dev/null
+++ b/src/packages/components/Decorates/Mores/FullScreen/config.ts
@@ -0,0 +1,17 @@
+import { PublicConfigClass } from '@/packages/public'
+import { CreateComponentType } from '@/packages/index.d'
+import { FullScreenConfig } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+
+export const option = {
+ border: 6,
+ bgColor: '#84a5e9',
+ borderColor: '#84a5e9'
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType {
+ public key = FullScreenConfig.key
+ public attr = { w: 150, h: 150 }
+ public chartConfig = cloneDeep(FullScreenConfig)
+ public option = cloneDeep(option)
+}
diff --git a/src/packages/components/Decorates/Mores/FullScreen/config.vue b/src/packages/components/Decorates/Mores/FullScreen/config.vue
new file mode 100644
index 00000000..450752d7
--- /dev/null
+++ b/src/packages/components/Decorates/Mores/FullScreen/config.vue
@@ -0,0 +1,28 @@
+<template>
+ <CollapseItem name="全屏按钮" expanded>
+ <SettingItemBox name="按钮">
+ <SettingItem name="背景色">
+ <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.bgColor"></n-color-picker>
+ </SettingItem>
+ <SettingItem name="边框色">
+ <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.borderColor"></n-color-picker>
+ </SettingItem>
+ <SettingItem name="边框大小">
+ <n-input-number v-model:value="optionData.border" size="small" :step="0.5" :min="0"></n-input-number>
+ </SettingItem>
+ </SettingItemBox>
+ </CollapseItem>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import { CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting'
+import { option } from './config'
+
+const props = defineProps({
+ optionData: {
+ type: Object as PropType<typeof option>,
+ required: true
+ }
+})
+</script>
diff --git a/src/packages/components/Decorates/Mores/FullScreen/index.ts b/src/packages/components/Decorates/Mores/FullScreen/index.ts
new file mode 100644
index 00000000..19e37683
--- /dev/null
+++ b/src/packages/components/Decorates/Mores/FullScreen/index.ts
@@ -0,0 +1,14 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
+import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
+
+export const FullScreenConfig: ConfigType = {
+ key: 'FullScreen',
+ chartKey: 'VFullScreen',
+ conKey: 'VCFullScreen',
+ title: '全屏按钮',
+ category: ChatCategoryEnum.MORE,
+ categoryName: ChatCategoryEnumName.MORE,
+ package: PackagesCategoryEnum.DECORATES,
+ chartFrame: ChartFrameEnum.STATIC,
+ image: 'fullScreen.png'
+}
diff --git a/src/packages/components/Decorates/Mores/FullScreen/index.vue b/src/packages/components/Decorates/Mores/FullScreen/index.vue
new file mode 100644
index 00000000..805c8294
--- /dev/null
+++ b/src/packages/components/Decorates/Mores/FullScreen/index.vue
@@ -0,0 +1,111 @@
+<template>
+ <svg @click="toggleFullscreen" v-if="!isFullscreen" viewBox="0 0 1024 1024">
+ <path
+ d="M665.6 1017.6c-19.2 0-38.4-19.2-38.4-38.4s19.2-38.4 38.4-38.4h268.8l6.4-268.8c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4v294.4c0 32-25.6 51.2-51.2 51.2h-300.8zM51.2 396.8c-19.2 0-38.4-19.2-38.4-38.4V64C12.8 32 38.4 12.8 64 12.8h294.4c19.2 0 38.4 19.2 38.4 38.4s-19.2 38.4-38.4 38.4H89.6v268.8c0 19.2-19.2 38.4-38.4 38.4zM64 1017.6c-32 0-51.2-25.6-51.2-51.2v-294.4c0-19.2 19.2-38.4 38.4-38.4s38.4 19.2 38.4 38.4v217.6l198.4-198.4c6.4-6.4 19.2-12.8 25.6-12.8s19.2 6.4 25.6 12.8c6.4 6.4 12.8 19.2 12.8 25.6 0 12.8-6.4 19.2-12.8 25.6l-198.4 198.4h217.6c19.2 0 38.4 19.2 38.4 38.4s-19.2 38.4-38.4 38.4H64z m915.2-620.8c-19.2 0-38.4-19.2-38.4-38.4V140.8l-198.4 198.4c-6.4 6.4-19.2 12.8-25.6 12.8-12.8 0-19.2-6.4-25.6-12.8-12.8-12.8-12.8-38.4 0-51.2l198.4-198.4h-217.6c-19.2 0-38.4-19.2-38.4-38.4s19.2-38.4 38.4-38.4h294.4c32 0 51.2 25.6 51.2 51.2v294.4c0 19.2-19.2 38.4-38.4 38.4z"
+ class="fullScreen-border"
+ ></path>
+ </svg>
+ <svg @click="toggleFullscreen" v-else viewBox="0 0 1024 1024">
+ <path
+ d="M379.336 697.237L153.362 921.55c-14.11 14.007-36.905 13.922-50.912-0.188-14.007-14.11-13.922-36.905 0.188-50.912l227.6-225.927H138.645c-18.99 0-34.385-15.446-34.385-34.5 0-19.053 15.395-34.5 34.385-34.5H413.72c18.99 0 34.384 15.447 34.384 34.5v276c0 9.15-3.622 17.926-10.07 24.396a34.326 34.326 0 0 1-24.314 10.104 34.326 34.326 0 0 1-24.314-10.104 34.559 34.559 0 0 1-10.071-24.396V697.237z m263.395-366.88l227.813-227.813c14.059-14.059 36.853-14.059 50.912 0 14.059 14.059 14.059 36.853 0 50.912l-225.18 225.18h187.147c18.99 0 34.385 15.445 34.385 34.5 0 19.053-15.395 34.5-34.385 34.5H608.346c-18.99 0-34.384-15.447-34.384-34.5v-276c0-9.15 3.622-17.926 10.07-24.396a34.326 34.326 0 0 1 24.314-10.105c9.12 0 17.865 3.635 24.314 10.105a34.559 34.559 0 0 1 10.07 24.395v193.223zM99.385 410a34.326 34.326 0 0 1-24.314-10.105A34.559 34.559 0 0 1 65 375.5v-276C65 80.446 80.395 65 99.385 65h275.077c18.99 0 34.384 15.446 34.384 34.5 0 19.054-15.394 34.5-34.384 34.5H133.769v241.5c0 9.15-3.622 17.925-10.07 24.395A34.326 34.326 0 0 1 99.384 410z m825.23 552H649.538c-18.99 0-34.384-15.446-34.384-34.5 0-19.054 15.394-34.5 34.384-34.5h240.693V651.5c0-19.054 15.394-34.5 34.384-34.5 18.99 0 34.385 15.446 34.385 34.5v276c0 19.054-15.395 34.5-34.385 34.5z"
+ class="fullScreen-border"
+ ></path>
+ </svg>
+</template>
+
+<script setup lang="ts">
+import { PropType, toRefs, ref, onMounted, onUnmounted } from 'vue'
+import { CreateComponentType } from '@/packages/index.d'
+import { option } from './config'
+
+const props = defineProps({
+ chartConfig: {
+ type: Object as PropType<CreateComponentType & typeof option>,
+ required: true
+ }
+})
+
+let { border, bgColor, borderColor } = toRefs(props.chartConfig.option)
+const isFullscreen = ref(false)
+const checkFullscreen = () => {
+ isFullscreen.value = !!(
+ document.fullscreenElement ||
+ document.webkitFullscreenElement ||
+ document.mozFullScreenElement ||
+ document.msFullscreenElement
+ )
+}
+checkFullscreen()
+
+const requestFullscreen = element => {
+ if (element.requestFullscreen) {
+ element.requestFullscreen()
+ } else if (element.mozRequestFullScreen) {
+ /* Firefox */
+ element.mozRequestFullScreen()
+ } else if (element.webkitRequestFullscreen) {
+ /* Chrome, Safari and Opera */
+ element.webkitRequestFullscreen()
+ } else if (element.msRequestFullscreen) {
+ /* IE/Edge */
+ element.msRequestFullscreen()
+ }
+}
+
+const exitFullscreen = () => {
+ if (document.fullscreenElement && document.exitFullscreen) {
+ document.exitFullscreen()
+ } else if (document.mozFullScreenElement && document.mozCancelFullScreen) {
+ /* Firefox */
+ document.mozCancelFullScreen()
+ } else if (document.webkitFullscreenElement && document.webkitExitFullscreen) {
+ /* Chrome, Safari and Opera */
+ document.webkitExitFullscreen()
+ } else if (document.msFullscreenElement && document.msExitFullscreen) {
+ /* IE/Edge */
+ document.msExitFullscreen()
+ }
+}
+
+const toggleFullscreen = () => {
+ if (!isFullscreen.value) {
+ requestFullscreen(document.documentElement)
+ } else {
+ exitFullscreen()
+ }
+ isFullscreen.value = !isFullscreen.value
+ // 由于全屏状态的改变不会立即生效，所以需要延迟一段时间再去获取全屏状态
+ setTimeout(() => {
+ checkFullscreen()
+ }, 1000)
+}
+
+// 监听全屏状态的改变，保证多个全屏组件的状态一致
+onMounted(() => {
+ document.addEventListener('fullscreenchange', checkFullscreen)
+ document.addEventListener('webkitfullscreenchange', checkFullscreen)
+ document.addEventListener('mozfullscreenchange', checkFullscreen)
+ document.addEventListener('MSFullscreenChange', checkFullscreen)
+})
+
+onUnmounted(() => {
+ document.removeEventListener('fullscreenchange', checkFullscreen)
+ document.removeEventListener('webkitfullscreenchange', checkFullscreen)
+ document.removeEventListener('mozfullscreenchange', checkFullscreen)
+ document.removeEventListener('MSFullscreenChange', checkFullscreen)
+})
+</script>
+
+<style lang="scss" scoped>
+svg {
+ display: block;
+ width: 100%;
+ height: 100%;
+ cursor: pointer;
+}
+.fullScreen-border {
+ stroke: v-bind('borderColor');
+ stroke-width: v-bind('border+"px"');
+ fill: v-bind('bgColor');
+}
+</style>
diff --git a/src/packages/components/Decorates/Mores/index.ts b/src/packages/components/Decorates/Mores/index.ts
index 7223832b..489b9c5c 100644
--- a/src/packages/components/Decorates/Mores/index.ts
+++ b/src/packages/components/Decorates/Mores/index.ts
@@ -1,9 +1,19 @@
import { NumberConfig } from './Number/index'
import { TimeCommonConfig } from './TimeCommon/index'
import { ClockConfig } from './Clock/index'
+import { FullScreenConfig } from './FullScreen/index'
import { CountDownConfig } from './CountDown/index'
import { FlipperNumberConfig } from './FlipperNumber'
import { PipelineHConfig } from './PipelineH/index'
import { PipelineVConfig } from './PipelineV/index'
-export default [NumberConfig, FlipperNumberConfig, TimeCommonConfig, CountDownConfig, ClockConfig, PipelineHConfig, PipelineVConfig]
+export default [
+ NumberConfig,
+ FlipperNumberConfig,
+ TimeCommonConfig,
+ CountDownConfig,
+ ClockConfig,
+ FullScreenConfig,
+ PipelineHConfig,
+ PipelineVConfig
+]
From dbc44bf4199806eaf26ef9a30bc0049f8d8f2c65 Mon Sep 17 00:00:00 2001
From: QuietlyChan <1013893148@qq.com>
Date: Fri, 28 Jul 2023 14:34:40 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=88=9D=E5=A7=8B?=
=?UTF-8?q?=E5=8C=96=E4=B8=8D=E8=83=BD=E6=8B=96=E6=8B=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/packages/components/Decorates/Mores/FullScreen/config.ts | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/src/packages/components/Decorates/Mores/FullScreen/config.ts b/src/packages/components/Decorates/Mores/FullScreen/config.ts
index f6a1a938..bed59c06 100644
--- a/src/packages/components/Decorates/Mores/FullScreen/config.ts
+++ b/src/packages/components/Decorates/Mores/FullScreen/config.ts
@@ -1,5 +1,6 @@
import { PublicConfigClass } from '@/packages/public'
import { CreateComponentType } from '@/packages/index.d'
+import { chartInitConfig } from '@/settings/designSetting'
import { FullScreenConfig } from './index'
import cloneDeep from 'lodash/cloneDeep'
@@ -11,7 +12,7 @@ export const option = {
export default class Config extends PublicConfigClass implements CreateComponentType {
public key = FullScreenConfig.key
- public attr = { w: 150, h: 150 }
+ public attr = { ...chartInitConfig, w: 150, h: 150 }
public chartConfig = cloneDeep(FullScreenConfig)
public option = cloneDeep(option)
}