企业信息详情样式调整

src/views/base/company-detail.vue

@@ -7,7 +7,7 @@
     :modal-append-to-body="false"
     style="text-align:left;"
     @close="closeDialog"
-    width="80%"
+    width="75%"
   >
     <div class="application-panel" v-loading="loading">
       <!-- 投保信息 -->
@@ -16,33 +16,33 @@
       </div>
       <table border="1" style="border-collapse:collapse;width: 100%;">
         <tr>
-          <td class="table-bak" width="10%">企业名称</td>
+          <td width="10%">企业名称</td>
           <td width="20%">{{companyData.name}}</td>
-          <td class="table-bak" width="10%">统一社会信用代码</td>
-          <td width="20%">
+          <td width="15%">统一社会信用代码</td>
+          <td width="35%">
             {{companyData.usccCode}}
             <a :href="companyData.usccFiles" target="_blank">查看附件</a>
           </td>
           <td width="10%"></td>
-          <td width="20%"></td>
+          <td ></td>
         </tr>
         <tr>
-          <td class="table-bak">联系人</td>
+          <td>联系人</td>
           <td>{{companyData.person}}</td>
-          <td class="table-bak">联系人手机号</td>
+          <td>联系人手机号</td>
           <td>{{companyData.tel}}</td>
           <td></td>
           <td></td>
         </tr>
         <tr>
-          <td class="table-bak">法人代表</td>
+          <td>法人代表</td>
           <td>{{companyData.legalName}}</td>
-          <td class="table-bak">法人代表身份证</td>
+          <td>法人代表身份证</td>
           <td>
             {{companyData.legalCard}}
             <a :href="companyData.legalCardFile" target="_blank">查看附件</a>
           </td>
-          <td class="table-bak">企业公章</td>
+          <td>企业公章</td>
           <td>已加密</td>
         </tr>
       </table>
@@ -54,19 +54,20 @@
       </div>
       <table border="1" style="border-collapse:collapse;width: 100%;">
         <tr>
-          <td class="table-bak" colspan="4">
-            <el-avatar :size="100" :src="'http://vod.wzgh.org/picc/company/2020/2/123.jpg'"></el-avatar>绑定微信:Auxzzz
+          <td colspan="4">
+            <el-avatar :size="50" :src="'http://vod.wzgh.org/picc/company/2020/2/123.jpg'"></el-avatar>
+            <span class="bind-von">绑定微信<p>Auxzzz</p></span>
           </td>
         </tr>
         <tr>
-          <td width="10%" class="table-bak">用户名</td>
+          <td width="5%">用户名</td>
           <td width="20%">Jpsoft</td>
-          <td width="10%" class="table-bak">职业</td>
+          <td width="5%">职业</td>
           <td width="20%">办公室</td>
         </tr>
         <tr>
-          <td class="table-bak">简介</td>
-          <td colspan="3">很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介</td>
+          <td>简介</td>
+          <td colspan="3">很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介很长很长很长的简介</td>
         </tr>
       </table>
     </div>
@@ -159,7 +160,12 @@ export default {
 .accept-panel td {
   padding: 10px 0;
   font-size: 14px;
-  border: 1px solid #efefef;
+  border: 0;
+  vertical-align: initial;
+}
+
+.application-panel table{
+  border:0
 }
 
 .el-tabs.el-tabs--card.el-tabs--top {
@@ -177,8 +183,7 @@ export default {
   margin-bottom: 10px;
 }
 
-.el-tab-pane h4 {
-  margin: 0;
+.title-von h4 {
   border-left: 2px solid red;
   padding-left: 10px;
 }
@@ -186,7 +191,7 @@ export default {
 .user-panel,
 .application-panel,
 .accept-panel {
-  margin-bottom: 20px;
+  margin-bottom: 30px;
 }
 
 .el-pagination {
@@ -209,4 +214,20 @@ export default {
 .el-form td {
   font-size: 14px;
 }
+
+.application-panel td{
+  position:relative
+}
+
+.bind-von{
+    display: block;
+    position: absolute;
+    left: 70px;
+    top: 50%;
+    margin-top: -19px;
+}
+
+.bind-von p{
+  margin:0
+}
 </style>