update

src/components/ThreeWorldEventQingXiCheAndQv/QingXiCheAndQvMain.vue

@@ -23,6 +23,9 @@ import { WindowVideoRemoveColorStore } from "@/components/WindowQingXiCheAndQv/s
 import WindowMenu from "../WindowQingXiCheAndQv/WindowMenu.vue";
 import { WindowMenuStore } from "@/components/WindowQingXiCheAndQv/store/WindowMenuStore.js";
 
+import WindowFraction from "../WindowQingXiCheAndQv/WindowFraction.vue";
+import { WindowFractionStore } from "@/components/WindowQingXiCheAndQv/store/WindowFractionStore.js";
+
 import { WindowEvent } from "../WindowQingXiCheAndQv/js/WindowEvent.js";
 
 // 接收参数
@@ -290,6 +293,10 @@ const QvStepUpdate = (name) => {
             v-if="WindowMenuStore().obj.viewOpen == true"
         ></WindowMenu>
 
+        <WindowFraction
+        
+        ></WindowFraction>
+
         
         <!-- 我们会通过一个全局的变量，来控制什么组件是否显示 CommonVal().loadSuccess 是一种方式，3d场景加载完成后会变成 true -->
         <div

src/components/WindowQingXiCheAndQv/WindowFraction.vue

@@ -10,7 +10,12 @@ import { ComVal } from "../ThreeWorldEventQingXiCheAndQv/common/ComVal.js";
     <div class="WindowFraction">
         
         <div class="main">
-            
+            <div class="left" >
+                得分
+            </div>
+            <div class="right" >
+                {{ WindowFractionStore().obj.val }}
+            </div>
         </div>
         
     </div>
@@ -49,13 +54,37 @@ import { ComVal } from "../ThreeWorldEventQingXiCheAndQv/common/ComVal.js";
     .main {
 
         position: fixed;
-        
-        top: 12rem;
-        right: 3rem;
-
-        background-image: url("./img/menu/bg.webp");
+        width: 10.71rem;
+        height: 2.97rem;
+        line-height: 2.97rem;
+        top: 6rem;
+        right: 22rem;
+        background-image: url("./img/menu/fraction.webp");
         background-position: center;
         background-size: 100% 100%;
+
+        .left, .right {
+            position: relative;
+            height: 2.97rem;
+            line-height: 2.97rem;
+            float: left;
+            text-align: center;
+        }
+
+        .left {
+            font-weight: 400;
+            font-size: 1.2rem;
+            color: #CBEEE8;
+            width: 40%;
+            left: 10%;
+        }
+
+        .right {
+            font-weight: 500;
+            font-size: 2.2rem;
+            color: #41FFE0;
+             width: 50%;
+        }
         
     }