优化计算速度及界面

frontend/src/components/calc/input/index.vue

@@ -21,9 +21,9 @@ export default defineComponent({
   setup(props) {
     const modelValue = useVModel(props, 'modelValue')
     return () => (
-      <div class="flex min-w-80px h-20px border-1 border-solid border-[#5b472a] rounded-[2px] bg-[#000000]">
+      <div class="flex min-w-80px h-15px border-1 border-solid border-[#5b472a] rounded-[2px] bg-[#000000] px-2px">
         <input
-          class="flex-1 border-none w-full outline-none h-auto line-height-100% text-[#937639] m-0 bg-[#000000]"
+          class="flex-1 border-none w-full outline-none h-auto line-height-100% text-[#ffe2ac] m-0 bg-[#000000]"
           type={props.type}
           v-model={modelValue.value}
         />
@@ -56,14 +56,14 @@ input::-webkit-inner-spin-button {
 .input-number-upper {
   background-image: url('@/assets/img/icon/input_upper.png');
   background-size: 8px auto;
-  background-position: bottom 1px right 2px;
+  background-position: bottom 1px center;
   background-repeat: no-repeat;
 }
 
 .input-number-lower {
   background-image: url('@/assets/img/icon/input_lower.png');
   background-size: 8px auto;
-  background-position: top 1px right 2px;
+  background-position: top 1px center;
   background-repeat: no-repeat;
 }
 </style>

frontend/src/pages/Character/Equipment/Index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="flex flex-col mx-10px">
+    <div class="mx-10px">
       <calc-collapse title="武器/称号/宠物/秘宝">
         <calc-tabs  v-model="anotherTab" class="!mb-2">
           <calc-tab :value="0">武器</calc-tab>

frontend/src/pages/Character/Index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="w-100% h-100% main" :class="infoStore.infos?.alter">
+  <div class="w-100% h-100% main flex" :class="infoStore.infos?.alter">
     <div class="header">
       <calc-tabs route>
         <calc-tab :value="`/character/equipment/${props.alter}`">装备设置</calc-tab>
@@ -8,10 +8,10 @@
       </calc-tabs>
     </div>
     <div class="content flex">
-      <div class="flex flex-1 m-1" v-if="!!infoStore.infos?.alter">
+      <div class="flex h-auto p-1 overflow-y-auto" v-if="!!infoStore.infos?.alter">
         <RouterView></RouterView>
       </div>
-      <div class="flex-1 m-1">
+      <div class="p-1 ml-auto h-auto overflow-y-auto z-2">
         <Result></Result>
       </div>
     </div>
@@ -82,7 +82,7 @@ onUnmounted(() => {
 
   .content {
     flex: 1;
-    overflow-y: auto;
+    overflow-y: hidden;
     overflow-x: hidden;
     z-index: 2;
     width: 100%;

frontend/src/pages/Character/Result/components/Skill.vue

@@ -44,7 +44,14 @@
           <component :is="formatDamage(skill)"></component>
         </div>
       </div>
-      <div>{{showTotal}}</div>
+      <div v-if="!totalStandard" class="h-40px flex items-center justify-center text-18px border-t-1px border-t-solid border-t-#FFFF/15">{{showTotal.toFixed(0)}}</div>
+      <div
+        v-else
+        class="h-40px flex items-center justify-center text-18px border-t-1px border-t-solid border-t-#FFFF/15"
+        :style="{color:showTotal >= 0 ? '#37fa38' : '#ff0000'}"
+        >
+        {{showTotal.toFixed(2)}}%
+      </div>
     </div>
   </div>
 </template>