From 9b589e13b707765bb1bd1ecf17e18bd0c3c757ce Mon Sep 17 00:00:00 2001
From: lll <you@example.com>
Date: Thu, 7 Dec 2023 14:01:11 +0800
Subject: [PATCH] 1

---
 src/components/ChiClone.vue   |   1 -
 src/components/SerialPort.vue | 435 +++++++++++++++++++++++++++-------
 src/components/TreeView.vue   |   4 +-
 3 files changed, 349 insertions(+), 91 deletions(-)

diff --git a/src/components/ChiClone.vue b/src/components/ChiClone.vue
index 413d705..51c7764 100644
--- a/src/components/ChiClone.vue
+++ b/src/components/ChiClone.vue
@@ -847,7 +847,6 @@ export default {
           message: "修改成功",
           type: "success",
         });
-        alert(JSON.stringify.res.data.state);
         this.trees[0].label = this.formData.wgpz_wgid;
         this.sendTree();
         // sessionStorage.setItem("CHGYWG_yx", JSON.stringify(this.formData));
diff --git a/src/components/SerialPort.vue b/src/components/SerialPort.vue
index afe60af..98ece29 100644
--- a/src/components/SerialPort.vue
+++ b/src/components/SerialPort.vue
@@ -5,18 +5,33 @@
     <!-- 串口通道的页面 -->
     <!-- <el-button type="info" plain @click="dialogVisible = true">串口通道</el-button> -->
     <div class="tree_menu" v-show="dialogVisible">
-      <el-tree :data="trees" node-key="id" :props="defaultProps" default-expand-all @node-contextmenu="rightClick"
-        @node-click="treeNodeClick" ref="tree">
+      <el-tree
+        :data="trees"
+        node-key="id"
+        :props="defaultProps"
+        default-expand-all
+        @node-contextmenu="rightClick"
+        @node-click="treeNodeClick"
+        ref="tree"
+      >
         <span class="custom-tree-node" slot-scope="{ node, data }">
           <template v-if="data.editing == 1 && flag">
-            <el-input style="width: 260px" v-model="gateway" @change="changeInput"></el-input>
+            <el-input
+              style="width: 260px"
+              v-model="gateway"
+              @change="changeInput"
+            ></el-input>
           </template>
           <template v-else>{{ data.label }}</template>
         </span>
       </el-tree>
       <!-- 树形控件右键组件 -->
       <div v-show="menuShow" class="tree_rightmenu" :style="{ ...rightMenu }">
-        <el-menu class="el-menu-vertical-demo" @select="selectMenuNode" default-active="#0078FE">
+        <el-menu
+          class="el-menu-vertical-demo"
+          @select="selectMenuNode"
+          default-active="#0078FE"
+        >
           <el-menu-item id="menuitem" index="1" style="font-size: 12px">
             <span slot="title">新建通道</span>
           </el-menu-item>
@@ -27,13 +42,36 @@
       </div>
     </div>
     <div class="pas_params">
-      <el-dialog title="通道参数设置" :visible.sync="add_passage" width="765px" v-loading="loading">
-        <el-form :model="formData" :label-position="labelPosition" :rules="rules" ref="formData">
+      <el-dialog
+        title="通道参数设置"
+        :visible.sync="add_passage"
+        width="765px"
+        v-loading="loading"
+      >
+        <el-form
+          :model="formData"
+          :label-position="labelPosition"
+          :rules="rules"
+          ref="formData"
+        >
           <el-row>
             <el-col :span="12">
-              <el-form-item label="通道名称:" :label-width="formLabelWidth" prop="tdpz_tdmc">
-                <el-select v-model="formData.tdpz_tdmc" placeholder="" style="width: 200px; height: 30px">
-                  <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
+              <el-form-item
+                label="通道名称:"
+                :label-width="formLabelWidth"
+                prop="tdpz_tdmc"
+              >
+                <el-select
+                  v-model="formData.tdpz_tdmc"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                >
+                  <el-option
+                    v-for="item in options1"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
                   </el-option>
                 </el-select>
               </el-form-item>
@@ -41,22 +79,47 @@
           </el-row>
           <el-row>
             <el-col :span="12">
-              <el-form-item label="通道:" :label-width="formLabelWidth" prop="tdpz_td">
-                <el-select v-model="formData.tdpz_td" placeholder="" style="width: 200px; height: 30px">
-                  <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
+              <el-form-item
+                label="通道:"
+                :label-width="formLabelWidth"
+                prop="tdpz_td"
+              >
+                <el-select
+                  v-model="formData.tdpz_td"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                >
+                  <el-option
+                    v-for="item in options2"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
                   </el-option>
                 </el-select>
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="驱动名称:" :label-width="formLabelWidth" prop="tdpz_qdmc">
+              <el-form-item
+                label="驱动名称:"
+                :label-width="formLabelWidth"
+                prop="tdpz_qdmc"
+              >
                 <el-row>
                   <el-col :span="18">
-                    <el-input v-model="formData.tdpz_qdmc" placeholder="" style="width: 200px; height: 30px"
-                      disabled></el-input>
+                    <el-input
+                      v-model="formData.tdpz_qdmc"
+                      placeholder=""
+                      style="width: 200px; height: 30px"
+                      disabled
+                    ></el-input>
                   </el-col>
                   <el-col :span="6">
-                    <el-button style="width: 50px; height: 30px" @click="getDriveName">...</el-button>
+                    <el-button
+                      style="width: 50px; height: 30px"
+                      @click="getDriveName"
+                      >...</el-button
+                    >
                   </el-col>
                 </el-row>
               </el-form-item>
@@ -66,22 +129,34 @@
           <div v-if="formData.tdpz_td == '网口'">
             <el-row>
               <el-col :span="12">
-                <el-form-item label="IP地址:" :label-width="formLabelWidth" >
+                <el-form-item label="IP地址:" :label-width="formLabelWidth">
                   <el-row>
                     <el-col :span="5">
-                      <el-input v-model="tdpz_ip1" style="width: 43px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_ip1"
+                        style="width: 43px; height: 30px"
+                      ></el-input>
                     </el-col>
                     <el-col :span="1" style="color: #fff">. </el-col>
                     <el-col :span="5">
-                      <el-input v-model="tdpz_ip2" style="width: 43px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_ip2"
+                        style="width: 43px; height: 30px"
+                      ></el-input>
                     </el-col>
                     <el-col :span="1" style="color: #fff">.</el-col>
                     <el-col :span="5">
-                      <el-input v-model="tdpz_ip3" style="width: 43px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_ip3"
+                        style="width: 43px; height: 30px"
+                      ></el-input>
                     </el-col>
                     <el-col :span="1" style="color: #fff">.</el-col>
                     <el-col :span="5">
-                      <el-input v-model="tdpz_ip4" style="width: 43px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_ip4"
+                        style="width: 43px; height: 30px"
+                      ></el-input>
                     </el-col>
                   </el-row>
                 </el-form-item>
@@ -89,8 +164,12 @@
             </el-row>
             <el-row>
               <el-col :span="12">
-                <el-form-item label="端口号:" :label-width="formLabelWidth" >
-                  <el-input v-model="tdpz_port" placeholder="" style="width: 200px; height: 30px"></el-input>
+                <el-form-item label="端口号:" :label-width="formLabelWidth">
+                  <el-input
+                    v-model="tdpz_port"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  ></el-input>
                 </el-form-item>
               </el-col>
             </el-row>
@@ -98,9 +177,22 @@
           <div v-else>
             <el-row>
               <el-col :span="12">
-                <el-form-item label="串口号:" :label-width="formLabelWidth" prop="tdpz_chuankou">
-                  <el-select v-model="formData.tdpz_chuankou" placeholder="" style="width: 200px; height: 30px">
-                    <el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value">
+                <el-form-item
+                  label="串口号:"
+                  :label-width="formLabelWidth"
+                  prop="tdpz_chuankou"
+                >
+                  <el-select
+                    v-model="formData.tdpz_chuankou"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  >
+                    <el-option
+                      v-for="item in options3"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
                     </el-option>
                   </el-select>
                 </el-form-item>
@@ -108,17 +200,43 @@
             </el-row>
             <el-row>
               <el-col :span="12">
-                <el-form-item label="波特率:" :label-width="formLabelWidth" prop="tdpz_btl">
-                  <el-select v-model="formData.tdpz_btl" placeholder="" style="width: 200px; height: 30px">
-                    <el-option v-for="item in options4" :key="item.value" :label="item.label" :value="item.value">
+                <el-form-item
+                  label="波特率:"
+                  :label-width="formLabelWidth"
+                  prop="tdpz_btl"
+                >
+                  <el-select
+                    v-model="formData.tdpz_btl"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  >
+                    <el-option
+                      v-for="item in options4"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
                     </el-option>
                   </el-select>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="数据位:" :label-width="formLabelWidth" prop="tdpz_sjw">
-                  <el-select v-model="formData.tdpz_sjw" placeholder="" style="width: 200px; height: 30px">
-                    <el-option v-for="item in options5" :key="item.value" :label="item.label" :value="item.value">
+                <el-form-item
+                  label="数据位:"
+                  :label-width="formLabelWidth"
+                  prop="tdpz_sjw"
+                >
+                  <el-select
+                    v-model="formData.tdpz_sjw"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  >
+                    <el-option
+                      v-for="item in options5"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
                     </el-option>
                   </el-select>
                 </el-form-item>
@@ -126,17 +244,43 @@
             </el-row>
             <el-row>
               <el-col :span="12">
-                <el-form-item label="停止位:" :label-width="formLabelWidth" prop="tdpz_tzw">
-                  <el-select v-model="formData.tdpz_tzw" placeholder="" style="width: 200px; height: 30px">
-                    <el-option v-for="item in options6" :key="item.value" :label="item.label" :value="item.value">
+                <el-form-item
+                  label="停止位:"
+                  :label-width="formLabelWidth"
+                  prop="tdpz_tzw"
+                >
+                  <el-select
+                    v-model="formData.tdpz_tzw"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  >
+                    <el-option
+                      v-for="item in options6"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
                     </el-option>
                   </el-select>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
-                <el-form-item label="奇偶校验:" :label-width="formLabelWidth" prop="tdpz_jojy">
-                  <el-select v-model="formData.tdpz_jojy" placeholder="" style="width: 200px; height: 30px">
-                    <el-option v-for="item in options7" :key="item.value" :label="item.label" :value="item.value">
+                <el-form-item
+                  label="奇偶校验:"
+                  :label-width="formLabelWidth"
+                  prop="tdpz_jojy"
+                >
+                  <el-select
+                    v-model="formData.tdpz_jojy"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                  >
+                    <el-option
+                      v-for="item in options7"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
                     </el-option>
                   </el-select>
                 </el-form-item>
@@ -145,25 +289,57 @@
           </div>
           <el-row>
             <el-col :span="12">
-              <el-form-item label="超过时间(ms):" :label-width="formLabelWidth" prop="tdpz_cgsj">
-                <el-input v-model="formData.tdpz_cgsj" placeholder="" style="width: 200px; height: 30px"></el-input>
+              <el-form-item
+                label="超过时间(ms):"
+                :label-width="formLabelWidth"
+                prop="tdpz_cgsj"
+              >
+                <el-input
+                  v-model="formData.tdpz_cgsj"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                ></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="间隔时间(ms):" :label-width="formLabelWidth" prop="tdpz_jgsj">
-                <el-input v-model="formData.tdpz_jgsj" placeholder="" style="width: 200px; height: 30px"></el-input>
+              <el-form-item
+                label="间隔时间(ms):"
+                :label-width="formLabelWidth"
+                prop="tdpz_jgsj"
+              >
+                <el-input
+                  v-model="formData.tdpz_jgsj"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                ></el-input>
               </el-form-item>
             </el-col>
           </el-row>
           <el-row>
             <el-col :span="12">
-              <el-form-item label="轮询时间(ms):" :label-width="formLabelWidth" prop="tdpz_lxsj">
-                <el-input v-model="formData.tdpz_lxsj" placeholder="" style="width: 200px; height: 30px"></el-input>
+              <el-form-item
+                label="轮询时间(ms):"
+                :label-width="formLabelWidth"
+                prop="tdpz_lxsj"
+              >
+                <el-input
+                  v-model="formData.tdpz_lxsj"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                ></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item label="重复次数:" :label-width="formLabelWidth" prop="tdpz_cfcs">
-                <el-input v-model="formData.tdpz_cfcs" placeholder="" style="width: 200px; height: 30px"></el-input>
+              <el-form-item
+                label="重复次数:"
+                :label-width="formLabelWidth"
+                prop="tdpz_cfcs"
+              >
+                <el-input
+                  v-model="formData.tdpz_cfcs"
+                  placeholder=""
+                  style="width: 200px; height: 30px"
+                ></el-input>
               </el-form-item>
             </el-col>
           </el-row>
@@ -173,29 +349,47 @@
           <div>
             <i class="el-icon-caret-bottom" v-if="is_retract"></i>
             <i class="el-icon-caret-top" v-else="is_retract"></i>
-            <el-button type="text" plain @click="getRetract" style="
+            <el-button
+              type="text"
+              plain
+              @click="getRetract"
+              style="
                 width: 28px;
                 border: none;
                 color: rgba(16, 16, 16, 1);
                 font-size: 14px;
                 text-align: left;
-              ">
-              收起</el-button>
+              "
+            >
+              收起</el-button
+            >
           </div>
         </div>
         <div class="super_con" v-show="is_retract">
-          <el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
+          <el-form
+            :label-position="labelPosition"
+            :rules="rules"
+            ref="ruleForm"
+          >
             <el-row>
               <el-col :span="12">
                 <el-form-item>
-                  <el-checkbox v-model="formData.tdpz_watchtime">watch time(s)</el-checkbox>
-                  <el-input v-model="input1" placeholder="" style="width: 200px; height: 30px"
-                    :disabled="isdisabled"></el-input>
+                  <el-checkbox v-model="formData.tdpz_watchtime"
+                    >watch time(s)</el-checkbox
+                  >
+                  <el-input
+                    v-model="input1"
+                    placeholder=""
+                    style="width: 200px; height: 30px"
+                    :disabled="isdisabled"
+                  ></el-input>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
                 <el-form-item>
-                  <el-checkbox v-model="formData.tdpz_cjsylxdz">采集使用连续地址</el-checkbox>
+                  <el-checkbox v-model="formData.tdpz_cjsylxdz"
+                    >采集使用连续地址</el-checkbox
+                  >
                 </el-form-item>
               </el-col>
             </el-row>
@@ -204,11 +398,17 @@
                 <el-form-item label="读写占空比:" :label-width="formLabelWidth">
                   <el-row>
                     <el-col :span="10">
-                      <el-input v-model="tdpz_dxzkb1" style="width: 91px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_dxzkb1"
+                        style="width: 91px; height: 30px"
+                      ></el-input>
                     </el-col>
                     <el-col :span="4">: </el-col>
                     <el-col :span="10">
-                      <el-input v-model="tdpz_dxzkb2" style="width: 91px; height: 30px"></el-input>
+                      <el-input
+                        v-model="tdpz_dxzkb2"
+                        style="width: 91px; height: 30px"
+                      ></el-input>
                     </el-col>
                   </el-row>
                 </el-form-item>
@@ -218,18 +418,42 @@
               <el-col :span="12">
                 <el-form-item label="05/0F:" :label-width="formLabelWidth">
                   <el-row>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_050F" label="auto">auto</el-radio></el-col>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_050F" label="05">05</el-radio></el-col>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_050F" label="0F">0F</el-radio></el-col>
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_050F" label="auto"
+                        >auto</el-radio
+                      ></el-col
+                    >
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_050F" label="05"
+                        >05</el-radio
+                      ></el-col
+                    >
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_050F" label="0F"
+                        >0F</el-radio
+                      ></el-col
+                    >
                   </el-row>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
                 <el-form-item label="06/10:" :label-width="formLabelWidth">
                   <el-row>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_0610" label="auto">auto</el-radio></el-col>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_0610" label="06">06</el-radio></el-col>
-                    <el-col :span="8"><el-radio v-model="formData.tdpz_0610" label="10">10</el-radio></el-col>
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_0610" label="auto"
+                        >auto</el-radio
+                      ></el-col
+                    >
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_0610" label="06"
+                        >06</el-radio
+                      ></el-col
+                    >
+                    <el-col :span="8"
+                      ><el-radio v-model="formData.tdpz_0610" label="10"
+                        >10</el-radio
+                      ></el-col
+                    >
                   </el-row>
                 </el-form-item>
               </el-col>
@@ -248,28 +472,66 @@
         <i class="el-icon-close title_r" @click="diag_drive = false"></i>
       </div>
       <el-divider></el-divider>
-      <el-tree :data="datas2" :props="defaultProps" default-expand-all @node-click="handleDetailClick"></el-tree>
+      <el-tree
+        :data="datas2"
+        :props="defaultProps"
+        default-expand-all
+        @node-click="handleDetailClick"
+      ></el-tree>
     </div>
 
     <!-- 网关 -->
     <div class="gateway">
       <el-dialog title="新建网关" :visible.sync="outerVisible" width="382px">
-        <el-form :model="formData" :rules="rulesGate" ref="gateWay" label-width="85px" class="demo-ruleForm">
+        <el-form
+          :model="formData"
+          :rules="rulesGate"
+          ref="gateWay"
+          label-width="85px"
+          class="demo-ruleForm"
+        >
           <el-form-item label="网关名称:" prop="wgpz_wgmc">
-            <el-select v-model="formData.wgpz_wgmc" placeholder="请选择" style="width: 200px">
-              <el-option v-for="item in opts1" :key="item.value" :label="item.label" :value="item.value">
+            <el-select
+              v-model="formData.wgpz_wgmc"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option
+                v-for="item in opts1"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="网关ID:" prop="wgpz_wgid">
-            <el-select v-model="formData.wgpz_wgid" placeholder="请选择" style="width: 200px">
-              <el-option v-for="item in opts2" :key="item.value" :label="item.label" :value="item.value">
+            <el-select
+              v-model="formData.wgpz_wgid"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option
+                v-for="item in opts2"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="网关类型:" prop="wgpz_wglx">
-            <el-select v-model="formData.wgpz_wglx" placeholder="请选择" style="width: 200px">
-              <el-option v-for="item in opts3" :key="item.value" :label="item.label" :value="item.value">
+            <el-select
+              v-model="formData.wgpz_wglx"
+              placeholder="请选择"
+              style="width: 200px"
+            >
+              <el-option
+                v-for="item in opts3"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
               </el-option>
             </el-select>
           </el-form-item>
@@ -284,7 +546,7 @@
 </template>
 
 <script>
-import _ from 'lodash';
+import _ from "lodash";
 import { SaveUserAnswer, GetUserAnswer, GetTree, SendTree } from "@/api/user";
 export default {
   name: "TestTreeView",
@@ -302,7 +564,7 @@ export default {
       nodekey: "",
       trees: [],
       formData: {
-        ippz_wangkou:"",
+        ippz_wangkou: "",
         ippz_lwfs: "",
         ippz_zwym: "",
         ippz_mrwg: "",
@@ -786,9 +1048,7 @@ export default {
         tdpz_cfcs: [
           { required: true, message: "请输入重复次数", trigger: "blur" },
         ],
-        tdpz_ip: [
-          { required: true, message: "请输入IP地址", trigger: "blur" },
-        ],
+        tdpz_ip: [{ required: true, message: "请输入IP地址", trigger: "blur" }],
         tdpz_port: [
           { required: true, message: "请输入端口号", trigger: "blur" },
         ],
@@ -1121,7 +1381,6 @@ export default {
         });
         this.trees[0].label = this.formData.wgpz_wgid;
         this.sendTree();
-
       } else {
         this.$message({
           message: `保存失败,原因是${res.data.message}`,
@@ -1133,16 +1392,16 @@ export default {
   },
   mounted() {
     this.user_id = this.$route.query.user_id;
-    if(this.user_id!="undefined"){
-    GetTree({
-      user_id: this.user_id,
-      type: "2",
-    }).then((res) => {
-      console.log(res);
-      console.log(JSON.parse(res.data.data.data));
-      this.trees = JSON.parse(res.data.data.data);
-    });
-  }
+    if (this.user_id != "undefined") {
+      GetTree({
+        user_id: this.user_id,
+        type: "2",
+      }).then((res) => {
+        console.log(res);
+        console.log(JSON.parse(res.data.data.data));
+        this.trees = JSON.parse(res.data.data.data);
+      });
+    }
     this.GetUserAnswer();
   },
 };
@@ -1211,8 +1470,8 @@ export default {
 
     .el-col-6 {
       height: 40px;
-      top: 6px;
-      left: 77px;
+      top: 4px;
+      left: 78px;
       position: relative;
       width: 50px;
     }
diff --git a/src/components/TreeView.vue b/src/components/TreeView.vue
index 998a9e1..728c695 100644
--- a/src/components/TreeView.vue
+++ b/src/components/TreeView.vue
@@ -1527,8 +1527,8 @@ export default {
 
     .el-col-6 {
       height: 40px;
-      top: 6px;
-      left: 77px;
+      top: 4px;
+      left: 78px;
       position: relative;
       width: 50px;
     }