liyongli 7 mesi fa
parent
commit
5ed834a150
3 ha cambiato i file con 33 aggiunte e 26 eliminazioni
  1. 4 0
      src/assets/css/base.css
  2. BIN
      src/assets/css/zqpxingkai.ttf
  3. 29 26
      src/view/finance2024/index.vue

+ 4 - 0
src/assets/css/base.css

@@ -17,3 +17,7 @@ body {
   font-family: PingFangRegular;
   src: url(./PingFangRegular.ttf);
 }
+@font-face {
+  font-family: ZhangqingpingXingkai;
+  src: url(./zqpxingkai.ttf);
+}

BIN
src/assets/css/zqpxingkai.ttf


+ 29 - 26
src/view/finance2024/index.vue

@@ -9,7 +9,7 @@
       class="imgbtn"
       @click="play"
       :style="{
-        'animation-play-state': play_stats ? 'running' : 'paused',
+        'animation-play-state': play_stats ? 'running' : 'paused'
       }"
       viewBox="0 0 1024 1024"
       version="1.1"
@@ -39,19 +39,19 @@
     <div
       class="main"
       :style="{
-        height: look_more ? 'auto' : '400px',
+        height: look_more ? 'auto' : '400px'
       }"
     >
-    <p class="users">
-      已有<span class="user_num" v-text="totalUser"></span>人参与
-    </p>
+      <p class="users">
+        已有<span class="user_num" v-text="totalUser"></span>人参与
+      </p>
       <img src="./img/mainbg2024.png" style="width: 100%" />
       <div
         class="inset"
         :style="{
           background: !look_more
             ? 'linear-gradient(#489aff00, #489aff 45%)'
-            : '#489aff00',
+            : '#489aff00'
         }"
       >
         <div class="bottom_set">
@@ -75,7 +75,12 @@
               ></path>
             </svg>
           </p>
-          <p v-if="look_more" style="margin-top: -4em;" @click="look_more = false" class="line_title">
+          <p
+            v-if="look_more"
+            style="margin-top: -4em"
+            @click="look_more = false"
+            class="line_title"
+          >
             <span style="vertical-align: middle">收起</span>
             <svg
               viewBox="0 0 1024 1024"
@@ -100,9 +105,7 @@
             </svg>
           </p>
           <div @click="createhb" class="btn">
-            <div class="inset_btn">
-                立即签署
-            </div>
+            <div class="inset_btn">立即签署</div>
           </div>
         </div>
       </div>
@@ -199,26 +202,26 @@ const canvas_init = (uname, num) => {
     const img = new Image();
     img.crossOrigin = '';
     // 增加随机数选择图片
-    img.src = 'https://cxzx.smcic.net/topic/tool/img/hb.jpg';
+    img.src = 'https://cxzx.smcic.net/topic/tool/img/hb2024.png';
     if (!d2) d2 = canvas.getContext('2d');
     img.onload = () => {
       d2.drawImage(img, 0, 0, 750, 1334);
-      let line1 = [140, 300];
+      let line1 = [40, 1280];
       let fontsize = '30px';
-      d2.font = fontsize + ' 微软雅黑';
-      d2.fillStyle = '#ffffff';
-      d2.fillText('您是第', line1[0], line1[1]);
-      d2.font = '50px 微软雅黑';
-      d2.fillStyle = '#ffffff';
-    //   d2.fillText(uname, line1[0], 190);
-    //   d2.font = 'blod 50px 微软雅黑';
+      d2.font = fontsize + ' ZhangqingpingXingkai';
+      d2.fillStyle = '#000000';
+      d2.fillText('第', line1[0], line1[1]);
+      d2.font = '50px ZhangqingpingXingkai';
+      d2.fillStyle = '#000000';
+      d2.fillText(uname, line1[0], 1240);
+      d2.font = 'blod 50px ZhangqingpingXingkai';
       d2.fillStyle = '#fb0301';
-      d2.fillText(num, 230, line1[1] + 5);
-      d2.font = fontsize + ' 微软雅黑';
-      d2.fillStyle = '#ffffff';
+      d2.fillText(num, 60, line1[1] + 5);
+      d2.font = fontsize + ' ZhangqingpingXingkai';
+      d2.fillStyle = '#000000';
       d2.fillText(
         '个参与本次活动的人',
-        line1[0] + 94 + num.toString().length * 30,
+        line1[0] + num.toString().length * 30,
         line1[1]
       );
       resolve();
@@ -234,7 +237,7 @@ const onSubmit = e => {
     return false;
   }
   saveUser({
-    userName: username.value,
+    userName: username.value
   }).then(r => {
     show.value = false;
     canvas_init(r.userName, r.userOrder + r.userOrderUnreal).then(() => {
@@ -377,12 +380,12 @@ setInterval(() => {
   color: #ffffff;
 }
 .finance2023 .users {
+  font-family: ZhangqingpingXingkai;
   text-align: right;
   color: #103a6e;
   position: absolute;
   width: 90%;
-  top: 5.5vh;
-
+  top: 5.2vh;
 }
 .finance2023 .users .user_num {
   color: #fb0301;