From 58231abdd60004202562824f9c31b31e35cd6908 Mon Sep 17 00:00:00 2001
From: kerwincui <164770707@qq.com>
Date: Wed, 13 Jul 2022 01:05:47 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E5=A2=9E=E5=8A=A0H5=E7=AB=AF?=
 =?UTF-8?q?=E6=BC=94=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 vue/src/assets/images/phone.png | Bin 0 -> 7461 bytes
 vue/src/views/index.vue         | 133 ++++++++++++++++++++------------
 2 files changed, 84 insertions(+), 49 deletions(-)
 create mode 100644 vue/src/assets/images/phone.png

diff --git a/vue/src/assets/images/phone.png b/vue/src/assets/images/phone.png
new file mode 100644
index 0000000000000000000000000000000000000000..5b4b889b4ac3f1dc782a5883c6ab2ad2aef1cca8
GIT binary patch
literal 7461
zcmeHMc|6qpzW>F8PV~sBB(jE(F)K5Mp=^;XNp>=0e#2O1#uz)1CoK=Dkc3F2g=|x#
zMV83Ev{)irNp@MY-yf={bMAA`Ij`5buY3QvcV4{a_x&vI&-VU)W?q~(H9oX;i|`fz
z0Ja+F>zDz+rZ@oLl-SG(Nw5kJ`XNE6=@D~X1qFp?&z`+~`*w76^x?yY_4V~}ad8U^
z3#Fx{r%s(xQc@}^Dw>&@A(2Rqj*k8P{Q?34@87?7b#<jsC=(MCOG``9(b0Bxc0)r$
zHa0fG!op-Sxwp4hLqp@$t5<jK+;MPl`1<whxpU_ZA3mI(o^EPtYG!7pudi=mVUd-U
zWn^T8#bTS9nuLUeZr;4<=jUf`ZZ0V)xpU`EQBl#Ts3;nZcJScA#Kc5nW8-`G?)mum
z1P2G_<m3bd1WZj$Wn^TitE>O|>#r|gzPx_@dTMH_tgNi3rzeBKkd~I-w{M@0jt&BW
zaB*>wlar&<>1}Oo7!2mcix=+h?y9P)9v&VtGBRv7`^=d$+S=M%w{A^NPDY_nI2>;O
z{{4D-dh+t}Dk>`8-ri_5x~8Va+S;0rk55riQCV4;$z<a3cq9_3rltmi!E|+X4;?zx
z*Vjj-Qnj?SczJpG`T4D^th~IuIyyR5R#vL2s&3r4k&=><pPwHQ5y4`ya&vQ6S64NT
z*DOLK31yiXAA^qnn=b&zW#|m$@)w4_wHE;JZeRP|1SBL00RT5A)!d3@Wpo7ZME6i4
zlIbK+$<KoUSp$H&rXPdo<OZ@NNT4&7MvxkR@?1)SN+w8IDjOk;7}}r<RX>0U9t$uw
zcM5QGQYA}iYDlR2;UNGIkVTa6^Khqm;r$3w>$rI6c})zLl2|ukxe=ret_75^GBTCW
zrZYhatP&FD1PxXKtEvQ&i6|19q9}nvppbAR^n-yRQFt^0k3mU%dr3jzm}CmxOh@lq
zFz7^(a$&I;csShG*H_6Gtwd)!!;ugx;0P2Pg@QpAFfV@^i|7ZVdF}m<paXh2F{um|
zl}?jbLnM;u-YkL?l<Gze9t<O+AHX!PZ=HgA2KOT};7BC|+{0t7uyt!MmKpd*8h>i-
zW$w=a;bx#0-J9tILgst_aMtyKB7dvlUvSp-0cors?ojXlvGeyhWTzi?3~#3UdYi~j
zaL^s}fbhJanvg#VVz|&*bT1eBe*yhNz21nm08qE^CQK^C8lt-n-N}0m(m;nG1!<JX
zR5Bim!4N4p6(o$Tj3dH85(Wb!l0YO(1*byBVUZ{mRSe=g&Y$_Ck$NZ<EDD1_>SB>d
zT^+51Sd6Z!9zquaP*KL}efKq>d9jEzC-8f0Dij-m!lB6&hy`dB1PO-0VN_v6q7xQ|
zCE~CkiilDrQjqKZcx@&~WYL-Cbh`U@s+xZ9gais2x`do1l}4ufdddIf0O}A~AVCVE
zEeeLfLYy^6A@OK59);MCz~K=ab>WTZWGcn~KbxZQ7*)Ko%HNnmmxfGa5&x+%*$Gdf
zGd+k9eW)HpXAsVyIZH|Wm=0c>?oMYyf!DJ8S#F@MZOWumsP2%$%j}Srgn_QM3Q|=?
z1%^^WuHBH0f$D%vst-ukW70h&)+vss{z-d5Bs3Njr~*@^fJ7Kh6+?unlF4Y8vJ(bN
zRwfdOWC~8|n?Ly{YHaKXNCJ)MkCc_s(AGw%Vqj<_RvD&3#*kpDNCXIT!l@7uXq>9D
zDhVeA|B<3T)e9P!|F^Yp4D|f=<W7YmLiY+!bXvROP?<!ilC?C}gnw4Xzs8ace_t06
zg8X^le>cSqGcP)Y<x6CO2c4nY@F#>qD<OX-)P|Fj3z6mwLOU0}UM75PIc?Mh-<ZlD
zC9ms#T4Ye|>mq17u08(P%h2J+W(R2yG!xp}D%D}q0I(z1K<A*jU()D%H-;@ps{C>&
z-+f-J!;@5-sN<<5%}QnTo!<7>5=FN-%vMAF(bU|oW1m@rr>`}z3a+DGqZUEugp2PR
zE*Zy<hPgWWkObS}Vqv)@H2Kqi(Yqwme%fx2OldwlYWzIR_VU8P{Jqta(s>PE{AEv`
zJQ0=t;c37%&73HfqG7hUWa5C5x=7W_$*jc}90PEp9o-8<Z1kv)QDgo<UP>49j=cMD
z)-Ql?Nd92ipg5%?rZwKPe60V1c-Dy?(Yz2dW`L7{cTjip%<DP7S2<&1IpTYCTxb*-
zNynL?)LnZ`z%l)hZHuin-sfeD^$DTJyf9BhqK1bw|9aw-F}+W}cYHx{<wzwUZ|&1v
zBqwm|Uh#gPChW=iQ<_#P&Hmt>1y{{425&?}#pWBfZ7BzGr|XKQxnd?I3b4g;zm!<E
z&i6Z(^VZv!G)JDr70EWQx{VgqT<nazcMj`=S7-QYJBu@X=I_JRFF#(bah;zF&(sEl
zAO9Lq;Bzxq!SQ9}04IC-a?iu%k8uLA&!2c??dQAU+BX(UI5tdl>>b+HlNne<TDJNq
z>b4L6{DsZU)~_+*9JUEv)r~nLJPS*UHrXTB>|mVYJAgYQ<7(~cvZ~0b${f!;0EmqC
zI!n4343u;SufDlo-3kkQd37tt*71|KgUa138a!8!9rVY^3ZFI5jK+Gdw?d^o(J97+
zD4F~bG35qeE1WLkx?0vpZ9r%EK3WV|t#7SWdTwi>8dmDzKVO~L353@2U*{5bD88NZ
zzDB;maNxr5DpuUV6;I&4G53~GZQBV<gb8pcbR;^_t+CJMt4CnZvd`wG|8`X+i3(^9
zFT`L!DswzZtl{aMavxj06}~;`Y8|T8{T^U%Xjz;e!1tT4;0_M`thg_=k~hXCECYV2
zJ>JvlzS>`!{JTjeut(o+26$p?yy;3#P^(9C=O;Lu?BWx_Rq`c+(^KN~sVxA5Gp{x@
zhhbmn&@xcvzFMD^3FN71WdE{sf&=JmWA8Zdejn)FQs*HS@vx!Kx-IrMPLoHWrqvfW
zm0b8@t98J+G+xj!s;;eKk0382=yTfP8$IKY%4L)3{L!>E&8)QsZz3vJ=)mWFfq)-k
zlVe2@tp!cI-@@NcS-u23h4FapN$oooJiORs&R@dzb=q8<y@(4DX#c(7lp8@baI`L7
z6uhZwGTk$z>v^MRW*=bEXeKc^=)&HKX4|;U^?I+ml|QObzHf0B*^x8+)YC`#gBTzK
zs3-0{&{=ME>)~is^{30qDv@^h$@ypt!zb}w3!Rw~ecgq{{M!M$m5Kx9fhQ}q4c`}B
z9@Y>EykPN=ey`v`Z8;miD~>wzvT$Z`?q%{RHE}@67LoqeMx@|+Zsrza%-kbb5Q;dK
zpT5QP*V8N62!HPRH!6me56s<s)2`Dc)$=|X4s)Yxng0GMHCuZkh$YYV0DUcdu6N6|
z3-0d(K5J0ltCp1LD8a{%y;(AN&fhy4^PF3aT7SpFHS^*8a)I8(;}=PvvO68RZu==)
zhs`|j9QJu~!r<-f4r}zKc8$fU%GW`fdBl3uF1`D^Wm}jtDMfk$5*&{2Y|H)4RSBou
z1S4z<tz`4E;|khdnFWrgX17EW>-y{(O*5uABphH9ZGlxe!Hd3ek=twM`M@pXAGuoI
zh81XPQ0iA3(4SY%D4V>Pyid5YAbx(Uhu{lA+i66Mk;iBgYQJ%De1%|AYF!xCu;b=j
zmks#3?cw_q-s<#HTt;D6*wOqRLcxtup0_+=pYw@5ueQJJD`Z(A&3cICaTR4rT#bb-
zVnff~iBHsp(VOoh4UNScCke5wp{l&^nrxnwp7A_%-(T&#_3R+kkUJp?A7TI8r%=B~
zK2fafGaFIcPl!dk9#QYMh-*i6cmxP?BQy_Eu66{<<!D(`<Xh)VDFcSIE1(ZEgdg-7
zdvL+-wpE0^Nf{tl>uw!%1{ITEcgEgX?lyF^niQ+aicZ-bx9nXz`<KMAnM%{yS7`!<
z+>iZ&&WKvG-8Cm?qSX|Ox<z6_-tIQ6oS(V*1ohZ`1(8>u0FESfvp>@4R%%(hDO2#n
zl(v}VwwuRLUQQp5sIjUBqJysGD8|Ny9~L@qvh%p$;hHj;`2hXKqWI~^eQ=kDre=^x
z3j~>&Yev!e&{^TP>icW&vdTNFd26%`tnVzDY^ZBKCURVXj1borw2y+R>1!^AlV01_
zWNVIHAFrD4=au=Ufn@R~v@78e4#ud*mpT=GR+tImi@OzgQyHU+HDwiCUnd;Da)G^G
zBN-7jT6ZXy^AYcEe#=MR7=qY<ciPAc%GbbJPW}g6O^R&cdYXLF&^s6c<!Waktx{9g
zZ%#^6G$(!cD$_k1bQu2;eQd4bb%dCNjRH5o%wpGbB$}rxo|d8ysa=?#er#t0J0cYf
zY@5HKn;CA@Rya!(ot!^?aqyau{2x`WwXp1?<0QNDN_fm#Bcwz!l>W%?JktN*TE4q>
z0l_ny_I7`zeZE@h9@IO!ZxsS<Z0c3J65f<12@+8WokN-YIC<U}so>klv}ztC*qg3s
zKD~SKO>B5|-_N<Ow|>1V-)oTpiG5ud|I%h^72mf({-N3!)w;cG%n7x-ib?;-M5?Rm
zqYT(f{J0u4c{9HWQKLO)<X|Bvs8^c2-!eA*^wCLntXqv%nOF6Zq6|gp*&<H)*4Xf{
z=Jq5TU28d^FVhMOCHCBUrHv?Bv#X>jib(0aso2o5&6fv7GZP#bjUZbz=T&&>tu9cH
z$5v4FN>>yM6(ZP?m$CWpvz#K*o+jtl?IQxQ6~xQ0sB0G{qTE5O0m9z%cHVJTp{DN+
z7kbq6#}t3!+d7&5h8%y_qn{e_r``D{!VPY4)|B1$Esa>%d{pDP+Vn*mn0r}qSxA#)
zipf_o!uGwle%z#gg7$AF^Z)Muy~F)?`x#59?Ndz-Cs)N)WNBgsrY>Qu^W(cdClsZe
zORtHRVQ7Sm4M<YeU(=9*hJgyA@#oXyi*0I*c|_ySre8}2%NUNr(MnSX>lAmtB6&LK
z39_GcUGvvZh~&w$ia@`<#2U=3h^!P%IGb)@3!^+S<PqFLwSEe_S0<?(vHJpEh2J11
zy24$&l_cpY6ES$-a;KntX8%)%uGjH3q}e#vyr%eo_kD!mccoPQ$9LcMz0wxCOpg2A
ze%H)4J?YE0p4tywxGSBn_^y8fBYm9*u*=T=U~HmeCSy?>%8t2oB*0SUfAF6DyQBEC
z_4t1k6Kw3e{=r)RjJtK@`6(|Ah$b=-z31zf)uoN%6idTi6{Va_ua3TjMj-|ulD*Cs
zs!ilHKB5Et%?sK0_FkX5$-?n8at<1z^X|-w?bz$rAoD6S;bv{2-ySIH4dmW4)vqVT
z4jTxakJT<dn)|W{;_Uv+3b|_xhFJ8c!-6Ju`{t>326-kXWqwD*Y$I1@?v?E=vT<cK
zgdZk7G}k%d<0lp^n`hIvOEmdR`V??rDLq-lt2u`Bzp*`I35KjFXXJ_F^$*HpMk~v@
zcNNc`3y!&*-s<xh`evnE8*=Tc&kK*FDCv<$(=B{~`IJ){g|CSCkH`N0qbL74EtS~1
zt19m~!l{A8eRATjW9*Zib6=#7j3Kh={2W)3&-*4NS79hOzBZfiC33@6E&D(5vI(CO
zK64Jy2JB%ObJZr50uS8$_R>@AwQWx+M+}NylzJqHb6sw$l>0rba_{ns6V}=Z71L4T
zr;!US3CZCt{42>hAK)$A#OX;fM}77$VoDY7F0(}}+tEvpqn<D@=jcs7y>-w!;BHm=
z`V{F`mZ9c?TUu#ItDMKW3u`zh!S`_*hNeAteJ~n&aeJmhWn|A6QVYB#!wyDiU$k0`
zc%GlLh0#~ty`${W)tTBtoTcIIQ#bK}<5EHSO$T-j=Y^vUxgvXR3D}O`49pC~ST(y2
z2iJ)?3&L~XjV;QF<}Qjc4_pIjVm9&Je21>-{-bXpe>;9TcD%ri$}zRwsX?zz{t5~z
z0#f@Ak3PFNc7oF(aGW%YV?RCTc=Tyq%ac2z?l6=rZgt9l{Y&vcDdT!(OT(g^eW!@d
z#p`pIc;~1<?x1KJd-iF^X2Iky?QIn}MnTnPi@ayS<9h)OY0KK*mm7>J!fYX&uv*x0
zm2m5aLj(ISNQ{AjS$F2+b_v;X`pE(kIc2@`<jwK@dbyiH`brV3+}Bs}q$AEHb|ep+
zZjT5!`)p$FL5O%ZOyEZEjN0e8sSnu_ErM703)>Mso`%hgrimRoRV!(UlWEHns{`GF
zWnSYQ2b|w%j!eg*ik!H^5PH7vkbcvJh{JvE$3s8N`2t(RL-*z80$n>fcO@ks%~07<
zC|s~KDD7CXIc_|4@fZSadUDHwiA^O_S67!z<vJ%Cw%i`T*iUu!iQW<!5o+(4nr(;(
z62I0om#elV(vow+Q6}_QNSoH&>aQFwl@7KmuZZx0+cJ^YU57$LLij>?PQW;~h#XQ<
zCEQiy2o*gP#5nor+-^BFF2^YfK=X@Q6v$Q^nNCl48_dvheDn*@>Gw$kurEw%ADYPe
zq{dd_Cw_%@{tD1~o{34=y{`>Q4%GOp5RxliA_O&0pzs1rNXM^ecy@0?gWJiD$0!zY
z#|oQ&lYY|n;jVEWJDz*fh);W7Pc1}iNKAY8-Qy_<7U%qIyIRwKA02$|VcY%T;c*{e
zC2?}Q<$J)?vxR?J(_uEQB?4XdDe)?66K*AFk{b(*ET}i~vqtV%-&Hbh>zZlLD?{{X
zPO>KBp6UT@ee;U^n?r_gU3lvo(%U)x>F)i-sbYdK_tM$bfXR%H@GymiWdJX>UtB$h
z3td<zd!l~Xp6EE(8+TV^dnOlRRwWYXjnFOhyZ3zl3VM6e#e(kH!z<1qEl3W<QNN{{
z`eSgZlnc`>;Y|Y~{%H#r3-ovgPr`imq8bk^YlAEOqCnirN^>m1(xD@;@zIjx>2i^w
zIReuKnV_%vX6TGS`0cFe(Z&Sq3}>ijzW`t8@F7bj%|a%1GZ5t6W|{naX6EeU0cOHf
zZ6B6S2yPut9L6sKCE^;3I`78bD7K-WQoJ_<raMoZYS36ss%Nh3&MB9_isb`Vdee5L
z7<VVearuqi&F*dbxU+jt9c^XHzQU88)AW#-BJ^I~i4WI%g-@eGj*Rpk3cfMdK3Hg?
zmbJQl<;l>O#E|~8@7n74&F5D0rw82^^VK^RBq!{;hkUQjl*Y|rHv@ZKI5qMgQQUJ<
dc5!T#CyAqMwX4`YbL}5i2D-*N*;<Za{{bZnAj<#%

literal 0
HcmV?d00001

diff --git a/vue/src/views/index.vue b/vue/src/views/index.vue
index c401bd09..81875d29 100644
--- a/vue/src/views/index.vue
+++ b/vue/src/views/index.vue
@@ -1,51 +1,5 @@
 <template>
 <div class="app-container home">
-    <el-row :gutter="40" style="margin-bottom:10px;">
-        <el-col :xs="24" :sm="24" :md="24" :lg="14" :xl="14">
-            <el-card shadow="hover" style="margin:-10px;margin-bottom:20px;font-size:14px;min-height:170px;background-color:#fafafa;">
-                <div style="font-size:16px;font-weight:bold;margin-bottom:18px;">物美智能生活物联网平台</div>
-                <div style="display:table;margin-bottom:10px;">
-                    <div style="width:70px;font-weight: bold;display:table-cell;">个人用户：</div>
-                    <div style="display:table-cell;line-height:22px;"><b style="color:#F56C6C">可用于个人学习和使用，非商业用途。</b>不提供移动端源码，后期可以通过两种方式使用移动端：1.免费托管设备到平台；2.使用移动端开放的接口连接自己搭建的系统。</div>
-                </div>
-                <div style="display:table;">
-                    <div style="width:70px;font-weight: bold;display:table-cell;">企业用户：</div>
-                    <div style="display:table-cell;line-height:22px;"><b style="color:#F56C6C">可用于商业用途，并提供移动端源码，通过赞助方式获取企业授权。</b>但是不能低价或批量转售源码，不能随意分发源码。目前赞助费为2500元，项目不断完善后会对应增加费用。</div>
-                </div>
-            </el-card>
-        </el-col>
-        <el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10">
-            <el-card shadow="hover" style="margin:-10px;margin-bottom:20px;font-size:14px;min-height:170px;background-color:#fafafa;">
-                <div style="float:left;width:170px;">
-                    <el-image style="width:154px;" :src="require('@/assets/images/code.jpg')"></el-image>
-                </div>
-                <div style="float:left;">
-                    <div style="font-size:16px;font-weight:bold;margin:16px 0;">微信扫一扫，查看小程序端</div>
-                    <div style="display:table;margin-bottom:10px;">
-                        <div style="width:70px;font-weight: bold;display:table-cell;">官方网站</div>
-                        <div style="display:table-cell;">
-                            <el-link target="_blank" href="https://wumei.live/">www.wumei.live</el-link>
-                        </div>
-                    </div>
-                    <div style="display:table;margin-bottom:10px;">
-                        <div style="width:70px;font-weight: bold;display:table-cell;">联系作者</div>
-                        <div style="display:table-cell;">
-                            <span>QQ 164770707</span>
-                        </div>
-                    </div>
-                    <div style="display:table;margin-bottom:15px;">
-                        <div style="width:70px;font-weight: bold;display:table-cell;">系统源码</div>
-                        <div style="display:table-cell;">
-                            <el-link target="_blank" href="https://gitee.com/kerwincui/wumei-smart" type="danger">Gitee源码</el-link>
-                            <el-link target="_blank" href="https://github.com/kerwincui/wumei-smart" style="margin-left:20px;">Github源码</el-link>
-                        </div>
-                    </div>
-                </div>
-
-            </el-card>
-        </el-col>
-    </el-row>
-
     <el-row :gutter="40" style="margin-bottom:100px;">
         <el-col :xs="24" :sm="24" :md="24" :lg="14" :xl="14">
             <el-card style="margin:-10px;" shadow="hover" body-style="background-color:#eee;">
@@ -324,6 +278,65 @@
         </el-col>
     </el-row>
 
+    <el-row :gutter="40" style="background-color:#fafafa;padding:60px 0;margin:-10px;margin-top:50px;">
+        <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10">
+            <el-card shadow="hover" style="padding:20px 0;margin-bottom:20px;font-size:14px;">
+            <div style="font-size:28px;font-weight:bold;margin-bottom:20px;">物美智能生活物联网平台</div>
+                <div style="display:table;font-size:14px;margin-bottom:10px;">
+                    <div style="display:table-cell;line-height:22px;"><b style="color:#67C23A">项目采用AGPL-3.0许可协议，获得作者许可才能用于商业用途</b></div>
+                </div>
+                <div style="display:table;margin-bottom:10px;">
+                    <div style="width:70px;font-weight: bold;display:table-cell;">普通用户：</div>
+                    <div style="display:table-cell;line-height:22px;"><b style="color:#F56C6C">可用于个人学习和使用，非商业用途。</b>不提供移动端源码，后期可以通过两种方式使用移动端：1.免费托管设备到平台；2.使用移动端开放的接口连接自己搭建的系统。</div>
+                </div>
+                <div style="display:table;">
+                    <div style="width:70px;font-weight: bold;display:table-cell;">赞助用户：</div>
+                    <div style="display:table-cell;line-height:22px;"><b style="color:#F56C6C">可用于商业用途，并提供移动端源码，包含一年的更新。</b>但是不能低价或批量转售源码，不能随意分发源码。目前赞助费为2500元，项目不断完善后会对应增加费用。</div>
+                </div>
+            </el-card>
+            <el-card shadow="hover" style="padding:20px 0;margin-bottom:40px;font-size:14px;">
+                <div style="float:left;width:230px;">
+                    <el-image style="width:210px;" :src="require('@/assets/images/code.jpg')"></el-image>
+                </div>
+                <div style="float:left;">
+                    <div style="font-size:18px;font-weight:bold;margin:16px 0;">微信扫一扫，查看小程序端</div>
+                    <div style="font-size:14px;font-weight:bold;margin:16px 0;color:#F56C6C">右侧查看H5端演示 >>> </div>
+                    <div style="display:table;margin-bottom:10px;">
+                        <div style="width:70px;font-weight: bold;display:table-cell;">官方网站</div>
+                        <div style="display:table-cell;">
+                            <el-link target="_blank" href="https://wumei.live/">www.wumei.live</el-link>
+                        </div>
+                    </div>
+                    <div style="display:table;margin-bottom:10px;">
+                        <div style="width:70px;font-weight: bold;display:table-cell;">在线文档</div>
+                        <div style="display:table-cell;">
+                            <el-link target="_blank" href="https://wumei.live/doc">www.wumei.live/doc</el-link>
+                        </div>
+                    </div>
+                    <div style="display:table;margin-bottom:10px;">
+                        <div style="width:70px;font-weight: bold;display:table-cell;">联系作者</div>
+                        <div style="display:table-cell;">
+                            <span>QQ 164770707</span>
+                        </div>
+                    </div>
+                    <div style="display:table;margin-bottom:15px;">
+                        <div style="width:70px;font-weight: bold;display:table-cell;">系统源码</div>
+                        <div style="display:table-cell;">
+                            <el-link target="_blank" href="https://gitee.com/kerwincui/wumei-smart" type="danger">Gitee源码</el-link>
+                            <el-link target="_blank" href="https://github.com/kerwincui/wumei-smart" style="margin-left:20px;">Github源码</el-link>
+                        </div>
+                    </div>
+                </div>
+
+            </el-card>
+        </el-col>
+        <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+            <div class="phone">
+                <iframe src="https://wumei.live/h5" id="iframe" frameborder="0" scrolling="auto" height="100%" width="100%" class="phone-container"></iframe>
+            </div>
+        </el-col>
+    </el-row>
+
     <!--通知公告详情 -->
     <el-dialog :title="notice.noticeTitle" :visible.sync="open" width="800px" append-to-body>
         <div style="margin-top:-20px;margin-bottom:10px;">
@@ -444,6 +457,11 @@ export default {
                 this.statisticMqtt();
             }
         },
+        //刷新iframe
+        flushIframe() {
+            var iframe = window.parent.document.getElementById('iframe');
+            iframe.contentWindow.location.reload(true);
+        },
         /** 查询设备统计信息 */
         getDeviceStatistic() {
             getDeviceStatistic().then(response => {
@@ -552,7 +570,7 @@ export default {
                             activeTime: data[i].activeTime == null ? '' : data[i].activeTime,
                             deviceId: data[i].deviceId,
                             serialNumber: data[i].serialNumber,
-                            locationWay:data[i].locationWay,
+                            locationWay: data[i].locationWay,
                         });
                     }
                 }
@@ -560,7 +578,7 @@ export default {
             };
             option = {
                 title: {
-                    text: '设备分布（在线数 '+this.deviceList.filter(x=>x.status==3).length + '）',
+                    text: '设备分布（在线数 ' + this.deviceList.filter(x => x.status == 3).length + '）',
                     subtext: 'wumei-smart open source living iot platform',
                     sublink: 'https://iot.wumei.live',
                     target: "_blank",
@@ -603,7 +621,7 @@ export default {
                             htmlStr += "设备定位" + "<br />";
                         } else if (params.data.locationWay == 3) {
                             htmlStr += "自定义位置" + "<br />";
-                        } else{
+                        } else {
                             htmlStr += "未知" + "<br />";
                         }
                         htmlStr += "所在地址： " + params.data.networkAddress + "<br />";
@@ -978,6 +996,23 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.phone {
+    height: 729px;
+    width: 370px;
+    background-image: url("../assets/images/phone.png");
+    background-size: cover;
+    margin: 0 auto;
+}
+
+.phone-container {
+    height: 618px;
+    width: 343px;
+    position: relative;
+    top: 46px;
+    left: 12px;
+    background-color:#fff;
+}
+
 .content {
     line-height: 24px;
     padding: 10px;