Pārlūkot izejas kodu

修改扫码枪按钮样式

achao 3 gadi atpakaļ
vecāks
revīzija
0df5a3aa97
1 mainītis faili ar 23 papildinājumiem un 4 dzēšanām
  1. 23 4
      src/layout/index/top/index.vue

+ 23 - 4
src/layout/index/top/index.vue

@@ -23,8 +23,8 @@
       <div class="hidden-content">
         <el-input ref="hiddenFocus" type="password" class="input-Style" v-model="barCode" size="small" @focus="focus" @blur="blur"
           @keyup.enter.native="payCode" placeholder="扫码枪内容"></el-input>
-        <div v-show="isOpenCodeGun">扫码枪已连接</div>
-        <div v-show="!isOpenCodeGun" @click="setCodeGun">点我扫码</div>
+        <div v-show="isOpenCodeGun" class="code-scan-text">扫码枪已连接</div>
+        <div v-show="!isOpenCodeGun" @click="setCodeGun" class="code-scan-text">点我扫码</div>
         <!--  -->
         <el-dialog title="扫描二维码" :visible.sync="smAlert" width="200px374a8a02ecfe40dc9abdcd902dd564f5
         ">
@@ -50,8 +50,8 @@
           </div>
         </el-dialog>
       </div>
-      <div >
-        <span style="padding: 0 4px;font-size:15px;position:relative;top:-5px;">{{compName}}</span>
+      <div class="compName-row">
+        <span class="compName">{{compName}}</span>
       </div>
       <div v-if="getDay" class="right-menu-item hover-effect dayClass">
         {{ $t('common.trialDays') }}
@@ -734,6 +734,8 @@
   .hidden-content {
     display: flex;
     font-size: 16px;
+    margin-right: 20px;
+    align-items: center;
   }
 
   .input-Style {
@@ -759,4 +761,21 @@
     padding: 20px!important;
     font-size: 40px;
   }
+  .compName{
+    font-size: 16px;
+  }
+  .compName-row{
+    // background: red;
+    display: flex;
+    height: 100%;
+  }
+  .code-scan-text{
+    height: 30px;
+    line-height: 30px;
+    background: #EFF7FD;
+    border-radius: 20px;
+    color:#5473E8 ;
+    border: 1px solid #5473E8;
+    padding: 0 15px;
+  }
 </style>