From 07c26c4ac93e28c96a0485c7927512e907de6b1a Mon Sep 17 00:00:00 2001 From: "453530270@qq.com" Date: Fri, 30 Jun 2023 11:31:17 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E6=80=BB=E8=A7=88=E8=B0=83?= =?UTF-8?q?=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 1 - src/assets/bwg_icon.png | Bin 0 -> 792 bytes src/assets/tsg_icon.png | Bin 0 -> 792 bytes src/assets/tyc_icon.png | Bin 0 -> 790 bytes src/assets/tyg_icon.png | Bin 0 -> 822 bytes src/assets/whg_icon.png | Bin 0 -> 789 bytes src/assets/yyg_icon.png | Bin 0 -> 794 bytes src/views/HomeView.vue | 593 ++++++++++++++++++++++++++++++++-------- 8 files changed, 482 insertions(+), 112 deletions(-) create mode 100644 src/assets/bwg_icon.png create mode 100644 src/assets/tsg_icon.png create mode 100644 src/assets/tyc_icon.png create mode 100644 src/assets/tyg_icon.png create mode 100644 src/assets/whg_icon.png create mode 100644 src/assets/yyg_icon.png diff --git a/src/App.vue b/src/App.vue index c5354fc..9d44690 100644 --- a/src/App.vue +++ b/src/App.vue @@ -17,7 +17,6 @@ left: 0; bottom: 0; - padding: 6rpx 0 0 0.6rem; z-index: 90; } diff --git a/src/assets/bwg_icon.png b/src/assets/bwg_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..2babbd474167036d7f97bc16d52af68144773143 GIT binary patch literal 792 zcmeAS@N?(olHy`uVBq!ia0vp^dLYcf3?viMZ?gia`2jv5u0Z-fS>Vrq6paurkc1OP+QtWl;^v>jim54^B0+E(Td`N zoQHbL1MD>UKfHf<^Wq!>xl=2=?0$#LW?*3a;_2cT;&Hrp>dT}i1A&%efkTS!fh#LQ zvu&&5_x#^{^#PmErjY0DO21vzPUa}ATck6^Q|a&mh486Qd$v8QeDMEpAIpZhGh}!# zDlVSE@~cJTnwZu@)|*jJe!0o)EMZt^X^ z*WbEYRAf2dzBPijP9Nu8zVOXxwc*?~ZL@<`u79pkx8bwrO1_NVtkg#*CHWJ+7uMX& zdsE`FWaFP?k^AMpXPFg>H0)peW8-ag&r_e%S%2^?e(rW+&$7u9cYYrE5GyXVRqfB8 zt&(v+K2Dcyit%Oqu-N*hx^+@-rJuuUyT6OIH^w=#iAUt5Mem5;_EvGl&6;-e!{!zn zf89(E%gz_SpuB#!zP8qu7io^nn_0h~KKd#+cIMn!_o{SUU;Qk6y*_lJ%@i;bSM%}%%5xoiy*q0x4gIfBL8D|tntBj+;2T4FOa z@9zHkdw-N+#}SuB1$sXeekuEz$h1wBTzkstW#Qp-ng%-`tWB}w``7rGaU&mTj!gY)FaF9h=cMq5Yjm^BS>Syrb-_*_P4z-z!EPt(Dz2xCBefJy3^K<>bb9c13l)u-xWZV*V?rh=pdU>5| zGEK}Wb!nV;oeZYhB)UsQdcEg)vgQc$I*AOYNB7T6{&wu>q+g#tCUy5O{B2^#yy;2v z49)d_oEc7BT9S7<@{t{5z1m0D>*`yj+hjhNy81`ypKH6V!WdqsQFE8KcXem<*QYNJ z@!wC#N#x)<|A)!`O>F*=tarJ`_xRT@Vifz(DmD8eZxsLAOWQYp`}O4KJuAoGGP}RH zZoe6PW8(3z(ba}UC&TX@H2fA`U_ATWLhD@jox8q7oN9^ZyS8J#lC9_IIIF`4`IkoR zNa)~yqjaobfknHUQe2B;|2marb9)-h?_M%q`|xXs;gV+`w1jtZt=8%(O86;S`>DN2 zSjZ}2OOmdjjH7<$)z&XJ?kqUt;XBvG%hhx4!yEEnkHkHh#hBD?0BmFfe}eba4#vINm$;Wz}j0fi}U^%NbW!^hVBJdiv$f z*MILvD;n@}T&uC~>Hq9x*Cy$(&n(mR)0~i=#gR*S`}V0wO{+Pqw<0Aranp=N+6}Ua zQh(adDo4D?JacJLmeFU$+doVW&srMR6JB-X(&A)W|A)G^%y*W5p5WbewCat^K?~RK zoyo5D3#`9dxc@%(e2xLr=hUpJ+YkKvQT5{0^U$A{V`a@uubk$&R}@sn{Nk%w!wJn! z&8d4He)zdbN~cu)$G+gxpHDr%o>&m_fAeL*{*TKOm;B06a!n}z&o?h_!4753^6UC{ zA7p1YdGqVHH_Y?-;P_zT_p1Vzj%MyqRr_#{_2cB;;7m>~k%orK0KLMrGW(wC8#Y$# z-0@EDOMvW=eybhR61ug1E@7+ZeDpl}uF#ZI>G>bF3*3DD%TZccgye;%y>d{~? zt8@Rsk$2Botk>?<_wBd&Us>+OTKxJ!LK(N*>7w6>wGrBjO8b}24A%30XY*x8z~tzM zCP6mbm#x<ls?xTeqf5NYS3+|aVer>q+>BP#8WjRGVP8Hlg)+4$_ykKhU zWC8z}DH%?lsx=jj`!22%6uZ5IbC&S^qf;iB`R$bd&Eohmx literal 0 HcmV?d00001 diff --git a/src/assets/tyg_icon.png b/src/assets/tyg_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..6174fcccef6948b98c7d67da7010635666ea6b68 GIT binary patch literal 822 zcmeAS@N?(olHy`uVBq!ia0vp^dLYcf3?viMZ?giar2#%6u0Z-f=^!obKM=tIE;djB zTqT4-9=ZOOvO3VAW+g#>!3@6M9&Vb_a;nPCiY$hD+QPgUUrjjJUfJ7lZ!?z=<^L0{ zt0m5P{fM_6|HE^0dMo8t^pyk|ms~wDje&uQ%hSa%#N&AH)R$F@6-3%(Sqrzn>ou(2 zTsHIEmZ$&p*RJ8^F#B1jVmC+p&$-6tzLituQ!;0}S_GX!}Cmx=b(SCKVsK)Vf_A$Qsd=bH=L8k@#J}S$tymc}}xBVfr zbd})3wp|y?|6WQAmKK~NxaaBzq39BkgX|C3c1_>O8y_FCWaiG9HSad~ri-?#uvR*3 z43!r3=j=Q3?)Jx^2{Wy;Z@fDtw`$D~b$&h08Jiz-u>MOrT7Lc89V@$^vMm477F)k; zy{VC*+&NKS`kxvH{!YI~?!n;5ys}dV zE-n4K<9n3Wi{Fc%obz7Ku=r_B*-|Czy&p16%+`P3V){@;oiXjslf4F#7dbXC%=vMn zV&|ic4Ig8YIRd_CMWS@rl-9aWU%40WVLxNS^igxJ4tGnaUgnHJ4?q_;f4PE(Bk z!~2If&(1NBzPQ3mq5FQ(WCjMtkDe}$As)wjr=}-283?qUOqkN!(X}}&dVAT2|Mk(A z3tl*$d-eO^#OkK}JeSi`ZhxPnQMBj6R=HL4i_4~-aQ-b{reNBAbnY9uw}oz=llDK@ zXCmhH^7~|mXNw{WI4=uK(wJ8HwQpYLk~ZeYnoI>veHzmzbxtWdB>dWP=PbQ7>Pw3! z*&W&N@gK8B0oRugFT^6&_|4z_w$5a)f>j95mF+1$cZ!VWhAepa^6{=$8h0AQIzMIS znl0wa+_cRhd6~%zt3MVYy1e@ft^Vl!iz?kxo8RXZ@_nsQNzSi!&8@5V-3(p!OyG^= zk2OkPxDGlQtbdyt5_l^iT?U*XAh-DPLFxlP_*ir>!G##8jeVe8q9#Gdw)iXYe5pF~?4KD+sB?Zr5s zM7M9J=ZCG{@TQDQ?2%y1*=3)Nqdfk1{J5EY^63Nd+NUpLqYOf%J=A^}nm*%szHXy` z{Ef0R2X>q+-oIN>#7bdppHN(W2X{(T){HGPP3u$l^!zp8c_b9^&FTIhyYvXLKLo+efs0Vg zn3_~k1azWFNswPKgRh61rk=E%nlhiGBCDYehX{|2iO~0F+sq|cGSi~Pxvn4SEf28M z{P6zV9615D6<)@Ae6Lr1+Q`7b_|4PBF~s9|@6?w`s|*BMPr5ZIoltueHhtCI_qnsb z*KbSmP*HLI`sdIYahsWEc;>A>!5=YcL&NiXzCTsn!Y5Ah|Cg{_MA>^r??3kjL6u!C z4_-J%XJnlCJ7b!QzDq-<=pr{A{#~-I&h4@?*7=G8avoNVpBw~Fu2I#S{Gj@~=A@FR zcQt2D&e7qL+W%A~ZR*EQOZap8^LI~wUbU}ki{J8h+Z{W;SVmrT%KUaMKSB3g$V!!` zU-Rsq9SW$u^qTuhR+e?mozBLz|7S~D#QyFSpEmFOuN4R0+HtzC-?bxf^~1IQ_i%(u zi|WYK=rX(w-Jql)Q8km>L%z99Tj26}(~kK*bG|+Or0J0BW0P69E>Hg0_3Pcb%RZHr z@}G71bAxrWm`|!@Q0xAtA3O8?)uML={$N~`z4%1ZP0xt6HI6?V#eJtw_Ff(SxO4tq zY1a#UD}v+}UcPDjX0l-n-fAX`knowdKD&^6ELK z+?H=;Tf-%7_V9bLK0Q|RB#m3{`s%aWH%^G{_;PQf$iv3_e?AGPFWw?^d#ddnOCNm$ zqvGXn4>MQKR7$<`v~b6k48N2HtNEOFay_&Un@lyxFup$D=*|+w=Y_X4#B2{twm-rl zu -
+
+ +
+
    +
  • + 体育场 + 20% + +
    • +
  • + 体育场 + 20% + +
    • +
  • + 体育场 + 20% + +
    • +
+
-
+
+ +
+
    +
  • + + 20% + 体育场 +
    • +
  • + + 20% + 体育场 +
    • +
  • + + 20% + 体育场 +
    • +
+
+
-
今日各馆趋势
-
+
+

今日各馆趋势 +
+
- +
各场馆实时进馆人数
@@ -120,6 +163,7 @@ export default { mounted() { this.showorders() this.cgrs_line() + this.cgchart() }, // 方法 methods: { @@ -127,6 +171,7 @@ export default { selitem(type) { this.klselt = type; }, + // 圆柱图 showorders() { // 基于准备好的dom，初始化echarts实例 var chartDom = document.getElementById('showorders'); @@ -134,31 +179,254 @@ export default { // 指定图表的配置项和数据 var option; + // option = { + // grid: { //整张图的大小，距离left，right，bottom的距离 + // left: '3%', + // right: '4%', + // bottom: '3%', + // containLabel: true + // }, + // xAxis: { + // type: 'category', + // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + // }, + // yAxis: { + // type: 'value' + // }, + + // series: [ + // { + // data: [120, 200, 150, 80, 70, 110, 130], + // type: 'bar', + // showBackground: true, + // color: "#2626ff", + // backgroundStyle: { + // color: 'rgba(180, 180, 180, 0.2)' + // }, + + // } + // ] + // }; + var data = [100, 200, 100, 200, 100, 200, 250, 50, 30, 130, 150, 110, 120] + // var data = [Math.random() * 300] option = { - grid: { //整张图的大小，距离left，right，bottom的距离 - left: '3%', - right: '4%', - bottom: '3%', - containLabel: true + // backgroundColor: '#031245', + color: [ + '#63caff', + '#49beff', + '#03387a', + '#03387a', + '#03387a', + '#6c93ee', + '#a9abff', + '#f7a23f', + '#27bae7', + '#ff6d9d', + '#cb79ff', + '#f95b5a', + '#ccaf27', + '#38b99c', + '#93d0ff', + '#bd74e0', + '#fd77da', + '#dea700', + ], + grid: { + containLabel: true, + left: 20, + right: 20, + bottom: 10, + top: 40, }, xAxis: { + axisLabel: { + color: '#FFFFFF', + fontSize: 12, + interval: 0, + // show: false, + }, + axisTick: { + lineStyle: { + color: '#384267', + }, + show: false, + }, + splitLine: { + show: false, + }, + axisLine: { + lineStyle: { + color: '#0095FF', + width: 1, + type: 'solid', + }, + show: true, + }, + data: ['09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '20:00', '21:00', '22:00'], type: 'category', - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { - type: 'value' + // show:false, + axisLabel: { + color: '#0095FF', + fontSize: 14, + }, + axisTick: { + lineStyle: { + color: '#0095FF', + width: 1, + }, + show: false, + }, + splitLine: { + show: true, + lineStyle: { + color: '#0095FF', + type: 'solid', + }, + }, + axisLine: { + lineStyle: { + color: '#0095FF', + width: 1, + type: 'solid', + }, + show: false, + }, + name: '', }, - series: [ { - data: [120, 200, 150, 80, 70, 110, 130], + data: data, type: 'bar', - showBackground: true, - color: "#2626ff", - backgroundStyle: { - color: 'rgba(180, 180, 180, 0.2)' + barMaxWidth: 'auto', + barWidth: 15, + + itemStyle: { + normal: { + color: function () { + return new echarts.graphic.LinearGradient(0, 0, 0, 0.7, [ + { offset: 0, color: "#00B4FF" }, + { offset: 1, color: "#2F00FF" } + ], false) + }, + label: { + show: false,//柱状上的数据 + } + }, + }, + label: { + show: true, + position: 'top', + distance: 15, + color: '#fff', + }, + }, + { + data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], + type: 'bar', + barMaxWidth: '15', + symbol: 'circle', + symbolOffset: [0, '50%'], + symbolSize: [10, 5], + color: '#fff', + }, + { + data: data, + type: 'pictorialBar', + barMaxWidth: '15', + symbolPosition: 'end', + symbol: 'circle', + symbolOffset: [0, '-50%'], + symbolSize: [15, 7], + zlevel: 2, + }, + { + data: [300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300], + type: 'bar', + barMaxWidth: 'auto', + barWidth: 15, + barGap: '-100%', + zlevel: -1, + + itemStyle: { + normal: { + }, + } + }, + { + data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], + type: 'pictorialBar', + barMaxWidth: '15', + symbol: 'circle', + symbolOffset: [0, '50%'], + symbolSize: [15, 7], + zlevel: -2, + }, + { + data: [300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300, 300], + type: 'pictorialBar', + barMaxWidth: '15', + symbolPosition: 'end', + symbol: 'circle', + symbolOffset: [0, '-50%'], + symbolSize: [15, 7], + zlevel: -1, + itemStyle: { + shadowColor: 'rgba(0, 0, 0, 0.5)', + shadowBlur: 15 + } + }, + ], + + }; + + option && myChart.setOption(option); + }, + + // 圆饼图 + cgchart() { + var chartDom = document.getElementById('cgchart'); + var myChart = echarts.init(chartDom); + var option; + + option = { + + color: ["#0780e2", "#fdff00"], + series: [ + { + name: 'Access From', + type: 'pie', + radius: ['60%', '70%'], //曲线范围 + avoidLabelOverlap: false, + itemStyle: { + borderRadius: 40, + // borderColor: '#fff', + borderWidth: 1 + }, + label: { + show: false, + position: 'center' + }, + emphasis: { + label: { + show: true, + fontSize: 40, + fontWeight: 'bold' + } + }, + labelLine: { + show: false + }, + data: [ + { value: 1048, name: 'Search Engine' }, + { value: 735, name: 'Direct' }, + { value: 580, name: 'Email' }, + { value: 484, name: 'Union Ads' }, + { value: 300, name: 'Video Ads' } + ] } ] }; @@ -173,87 +441,130 @@ export default { var myChart = echarts.init(chartDom); var option; + var xData = ['09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '20:00', '21:00']; + var color = ['#FF99CC', '#6666FF', '#FF6600', '#7049f0', '#fa704d', '#01babc',] + var name = [] + var data = [ + [137, 34, 135, 161, 74, 152, 110, 100, 150, 137, 34, 135, 161], + [174, 137, 135, 34, 152, 135, 140, 160, 100, 174, 137, 135, 34], + [134, 74, 137, 135, 161, 137, 300, 220, 250, 134, 74, 137, 135], + [147, 134, 155, 131, 174, 122, 140, 160, 150, 127, 134, 175, 161], + [124, 147, 175, 134, 122, 175, 180, 110, 130, 154, 187, 125, 134], + [154, 174, 157, 175, 121, 157, 200, 250, 280, 134, 174, 157, 175], + // [3.5, 15.2, 16.1, 17.4, 13.4, 6.1], + // [16.1, 13.5, 3.7, 17.4, 15.2, 18.9], + // [17.4, 6.1, 13.4, 15.2, 13.7, 5.2], + ] + + var series = []; + for (var i = 0; i < 6; i++) { + series.push({ + name: name[i], + type: "line", + symbolSize: 3,//标记的大小，可以设置成诸如 10 这样单一的数字，也可以用数组分开表示宽和高，例如 [20, 10] 表示标记宽为20，高为10[ default: 4 ] + symbol: 'circle',//标记的图形。ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' + smooth: true, //是否平滑曲线显示 + showSymbol: false, //是否显示 symbol, 如果 false 则只有在 tooltip hover 的时候显示 + areaStyle: { + normal: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ + offset: 0, + color: color[i] + }, { + offset: 0.8, + color: 'rgba(255,255,255,0)' + }], false), + // shadowColor: 'rgba(255,255,255, 0.1)', + shadowBlur: 10, + opacity: 0.3, + } + }, + itemStyle: { + normal: { + color: color[i], + lineStyle: { + width: 1, + type: 'solid' //'dotted'虚线 'solid'实线 + }, + borderColor: color[i], //图形的描边颜色。支持的格式同 color + borderWidth: 8,//描边线宽。为 0 时无描边。[ default: 0 ] + barBorderRadius: 0, + label: { + show: false, + }, + opacity: 0.5, + } + }, + data: data[i], + + }) + } option = { - toolbox: { - feature: { - saveAsImage: {} - } - }, + grid: { - left: '3%', - right: '4%', - bottom: '3%', - containLabel: true - }, - xAxis: [ - { - type: 'category', - boundaryGap: false, - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + borderWidth: 0, + top: 160, + bottom: 160, + textStyle: { + color: "#fff" } - ], - yAxis: [ - { - type: 'value' - } - ], - series: [ - { - name: 'Email', - type: 'line', - stack: 'Total', - areaStyle: {}, - emphasis: { - focus: 'series' - }, - data: [120, 132, 101, 134, 90, 230, 210] + }, + xAxis: [{ + type: "category", + axisLine: { + show: false, }, - { - name: 'Union Ads', - type: 'line', - stack: 'Total', - areaStyle: {}, - emphasis: { - focus: 'series' - }, - data: [220, 182, 191, 234, 290, 330, 310] + splitLine: { + show: true, + lineStyle: { + color: '#0B0765', + } }, - { - name: 'Video Ads', - type: 'line', - stack: 'Total', - areaStyle: {}, - emphasis: { - focus: 'series' - }, - data: [150, 232, 201, 154, 190, 330, 410] + boundaryGap: false, //坐标轴两边留白策略，类目轴和非类目轴的设置和表现不一样 + axisTick: { + show: false }, - { - name: 'Direct', - type: 'line', - stack: 'Total', - areaStyle: {}, - emphasis: { - focus: 'series' - }, - data: [320, 332, 301, 334, 390, 330, 320] + splitArea: { + show: false }, - { - name: 'Search Engine', - type: 'line', - stack: 'Total', - label: { - show: true, - position: 'top' + axisLabel: { + inside: false, + textStyle: { + color: '#FFFFFF', + fontWeight: 'normal', + fontSize: '12', }, - areaStyle: {}, - emphasis: { - focus: 'series' + }, + data: xData, + }], + yAxis: { + type: 'value', + axisTick: { + show: false + }, + axisLine: { + show: true, + lineStyle: { + color: '#0B0765 ', + } + }, + splitLine: { + show: true, + lineStyle: { + color: '#0B0765 ', + } + }, + axisLabel: { + textStyle: { + color: '#0095FF', + fontWeight: 'normal', + fontSize: '12', }, - data: [820, 932, 901, 934, 1290, 1330, 1320] - } - ] - }; + formatter: '{value}', + }, + }, + series: series, + } option && myChart.setOption(option); @@ -415,7 +726,8 @@ export default { cursor: pointer; } -.klqs .klbtn span.spactive{ +/* 选择年月日后的样式变化 */ +.klqs .klbtn span.spactive { background-image: url('../assets/sactive_bg.png'); background-repeat: no-repeat; background-size: 100%; @@ -426,11 +738,66 @@ export default { .cgbox { background-image: url("../assets/cgbox_bg.png"); width: 100%; - height: 8.6rem; - background-position: 0 0; - background-size: 100%; + height: 12rem; + background-position: center center; + background-size: 100% 100%; margin-top: 2.4rem; - padding: 0.4rem; +} + +/* 饼图 */ +.cgbox .cgpies { + width: 40%; + height: 12rem; + float: left; +} + +.cgbox .cgleft { + width: 30%; + height: 12rem; + float: left; +} + +.cgbox .cgleft>ul{ + padding-left: 0.66rem; +} +.cgbox .cgright { + width: 30%; + height: 12rem; + float: left; +} +.cgbox .cgright>ul{ + padding-left: 0.66rem; +} +.cgbox .cglist{ + margin-top: 3rem; +} +.cgbox .cglist ul{ + display: block; + width: 100%; +} +.cgbox .cglist ul li{ + width: 100%; + list-style: none; + height: 0.66rem; + line-height: 0.66rem; + font-size: 0.66rem; + margin-top: 1rem; +} +.cgbox .cglist ul li span{ + display: block; + float: left; + margin-left: 0.46rem; +} + +.cgbox .cglist ul li span img{ + width: 0.68rem; + height: 0.68rem; +} + +.cgbox .cgright { + width: 30%; + height: 12rem; + float: left; } /* 今日人數 */ @@ -442,31 +809,33 @@ export default { .today_rs .tdrs_title { background-image: url("../assets/klqs_bg.png"); background-repeat: no-repeat; - background-size: 100%; - height: 3.8rem; + background-size: 100% 100%; + background-position: 0 0; + height: 3.2rem; + line-height: 2.86rem; background-position: -1.04rem 0.2rem; - float: left; - padding-left: 4rem; + padding-left: 4.6rem; font-size: 1.6rem; } /** 各場館實時 */ -.pcgrs{ +.pcgrs { clear: both; margin-top: 2.6rem; width: 100%; } -.pcgrs .pcgrs_title{ + +.pcgrs .pcgrs_title { background-image: url("../assets/klqs_bg.png"); background-repeat: no-repeat; background-size: 100%; height: 3.8rem; background-position: -1.04rem 0.2rem; - float: left; - padding-left: 4rem; + padding-left: 4.6rem; font-size: 1.6rem; } -.pcgrs .pcg_item{ + +.pcgrs .pcg_item { margin-top: 0.4rem; background-image: url("../assets/pcg_bg.png"); background-repeat: no-repeat; @@ -475,15 +844,17 @@ export default { float: left; margin-left: 2%; } -.pcgrs .pcg_item .pcpos{ + +.pcgrs .pcg_item .pcpos { text-align: right; font-size: 0.68rem; display: block; float: right; margin-top: 1.6rem; - padding-right: 0.6rem; + padding-right: 1.18rem; } -.pcgrs .pcg_item .pcval{ + +.pcgrs .pcg_item .pcval { font-size: 1.086rem; margin-top: 6rem; width: 68%; @@ -491,12 +862,12 @@ export default { float: left; text-align: center; } -.pcgrs .pcg_item .pcrate{ - width: 32%; + +.pcgrs .pcg_item .pcrate { + /* width: 32%; */ display: block; float: left; font-size: 0.86rem; margin-top: 4rem; text-align: center; -} - \ No newline at end of file +} \ No newline at end of file