车辆备案管理界面优化

@@ -6,48 +6,50 @@
                 <el-form-item>
                     <el-input v-model="filters.trailerFrameNo" placeholder="车牌号查询"></el-input>
                 </el-form-item>
-                <el-form-item>
-                    <el-button type="primary" v-on:click="getReCord(1)">查询</el-button>
+                <el-form-item style="margin-left: 50px">
+                    <el-button type="warning" style="width:150px" size="medium" icon="el-icon-plus" v-on:click="getReCord(1)">查询</el-button>
                 </el-form-item>
                 <el-form-item>
-                    <el-button type="primary" @click="companyAdd">新增</el-button>
+                    <el-button type="primary" style="width:150px" size="medium" icon="el-icon-plus" @click="companyAdd">新增</el-button>
                 </el-form-item>
             </el-form>
         </el-col>
         <!--列表-->
-        <el-table :data="recordList" highlight-current-row v-loading="listLoading" style="width: 100%;">
-            <el-table-column type="selection" width="55">
+        <el-table :data="recordList" highlight-current-row v-loading="listLoading"
+                  :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}"
+                  style="border-radius: 10px 10px 0px 0px;line-height: 25px;" size="small">
+            <el-table-column type="selection" width="55"  fixed="left" align="center">
             </el-table-column>
-            <el-table-column prop="coCode" label="运输公司名称"  width="120px" >
+            <el-table-column prop="coCode" label="运输公司名称"  width="120px" align="center" >
             </el-table-column>
-            <el-table-column prop="proposer" label="挂靠单位" width="120px" >
+            <el-table-column prop="proposer" label="挂靠单位" width="120px"  align="center">
             </el-table-column>
-            <el-table-column prop="veTargetNo" label="备案单位" width="130px"  >
+            <el-table-column prop="veTargetNo" label="备案单位" width="130px"  align="center" >
             </el-table-column>
-            <el-table-column prop="domesticLisenceNo" label="国内车牌"  width="100px">
+            <el-table-column prop="domesticLisenceNo" label="国内车牌"  width="100px" align="center">
             </el-table-column>
-            <el-table-column prop="veOwnerName" label="车主姓名" width="100px" >
+            <el-table-column prop="veOwnerName" label="车主姓名" width="100px"  align="center">
             </el-table-column>
-            <el-table-column prop="ownerInsideTel" label="车主联系方式" width="110px" >
+            <el-table-column prop="ownerInsideTel" label="车主联系方式" width="110px"  align="center">
             </el-table-column>
-            <el-table-column prop="mainPort" label="本地关代码" width="100px" >
+            <el-table-column prop="mainPort" label="本地关代码" width="100px"  align="center">
             </el-table-column>
-            <el-table-column prop="selfWt" label="自重"  width="90px">
+            <el-table-column prop="selfWt" label="自重"  width="90px" align="center">
             </el-table-column>
-            <el-table-column prop="veTon" label="载重"  width="90px">
+            <el-table-column prop="veTon" label="载重"  width="90px" align="center">
             </el-table-column>
-            <el-table-column prop="returnmessage" label="备案结果"  width="100px">
+            <el-table-column prop="returnmessage" label="备案结果"  width="100px" align="center">
             </el-table-column>
-            <el-table-column prop="apprNo" label="备案编号"  width="140px">
+            <el-table-column prop="apprNo" label="备案编号"  width="140px" align="center">
             </el-table-column>
-            <el-table-column prop="operationType" :formatter="operationType" label="申报状态"  width="110px">
+            <el-table-column prop="operationType" :formatter="operationType" label="申报状态"  width="110px" align="center">
             </el-table-column>
-            <el-table-column prop="updateDate" label="更新时间"  width="160px">
+            <el-table-column prop="updateDate" label="更新时间"  width="160px" align="center">
             </el-table-column>
-            <el-table-column label="操作" min-width="150">
+            <el-table-column label="操作" min-width="200" fixed="right" align="center">
                 <template slot-scope="scope">
-                    <el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
-                    <el-button type="small" size="small" @click="handlEdit(scope.$index, scope.row)">修改</el-button>
+                    <el-button type="primary" icon="el-icon-edit" size="mini" @click="handlEdit(scope.$index, scope.row)">修改</el-button>
+                    <el-button type="danger" icon="el-icon-minus" size="mini" @click="handleDel(scope.$index, scope.row)">删除</el-button>
                 </template>
             </el-table-column>
         </el-table>
@@ -63,8 +65,8 @@
                     :total="this.total">
             </el-pagination>
         </div>
-        <el-dialog title="新增" :visible.sync="addFormVisible" :close-on-click-modal="false">
-            <el-form :model="addForm" label-width="100px" :rules="addFormRules" ref="addForm">
+        <el-dialog title="新增" :visible.sync="addFormVisible" :close-on-click-modal="false" width="50%">
+            <el-form :model="addForm" style="margin-top: -10px;" label-width="150px" align="center" :rules="addFormRules" ref="addForm">
                 <el-row>
                     <el-col :span="10">
                         <el-row>
@@ -78,7 +80,7 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="运输公司名称" label-width="130px" prop="coCode">
+                            <el-form-item label="运输公司名称"  prop="coCode">
                                 <el-input v-model="addForm.coCode" auto-complete="on" placeholder="运输公司名称"></el-input>
                             </el-form-item>
                         </el-row>
@@ -93,12 +95,12 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车主联系电话" label-width="130px" prop="ownerInsideTel">
+                            <el-form-item label="车主联系电话" prop="ownerInsideTel">
                                 <el-input v-model="addForm.ownerInsideTel"  auto-complete="on" placeholder="车主联系电话"></el-input>
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="行驶证有效期" label-width="130px" prop="veFactoryDate">
+                            <el-form-item label="行驶证有效期"  prop="veFactoryDate">
                                 <el-date-picker
                                         v-model="addForm.veFactoryDate"
                                         type="date"
@@ -109,7 +111,7 @@
                     </el-col>
                     <el-col :span="10">
                         <el-row>
-                            <el-form-item label="自重（空车重量）" label-width="140px" prop="selfWt">
+                            <el-form-item label="自重（空车重量）" prop="selfWt">
                                 <el-input v-model="addForm.selfWt" auto-complete="on" placeholder="自重(空车重量）"></el-input>
                             </el-form-item>
                         </el-row>
@@ -129,12 +131,12 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车辆备案编号" label-width="110px" prop="apprNo">
+                            <el-form-item label="车辆备案编号"  prop="apprNo">
                                 <el-input v-model="addForm.apprNo" auto-complete="on" placeholder="车辆备案编号"></el-input>
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车辆属性" label-width="100px" prop="veClassFlag">
+                            <el-form-item label="车辆属性" prop="veClassFlag">
                                 <el-select v-model="addForm.veClassFlag"  placeholder="请选择">
                                     <el-option
                                             v-for="item in options"
@@ -144,20 +146,20 @@
                                     </el-option>
                                 </el-select>
                             </el-form-item>
-                            <el-form-item label="备注" label-width="100px" prop="memo">
+                            <el-form-item label="备注"  prop="memo">
                                 <el-input v-model="addForm.memo" auto-complete="on" placeholder="备注"></el-input>
                             </el-form-item>
                         </el-row>
                     </el-col>
                 </el-row>
             </el-form>
-            <div slot="footer" class="dialog-footer">
-                <el-button type="primary" @click.native="addSubmit()">保存</el-button>
+            <div slot="footer" class="dialog-footer" style="text-align: center">
+                <el-button type="primary" size="medium" style="width: 100px" @click.native="addSubmit()">保存</el-button>
             </div>
         </el-dialog>
 
-        <el-dialog title="修改" :visible.sync="editFormVisible" :close-on-click-modal="false">
-            <el-form :model="editForm" label-width="100px" :rules="editFormRules" ref="editForm">
+        <el-dialog title="修改" :visible.sync="editFormVisible" :close-on-click-modal="false"  width="50%">
+            <el-form :model="editForm" style="margin-top: -10px;" label-width="150px" align="center" :rules="editFormRules" ref="editForm">
                 <el-row>
                     <el-col :span="10">
                         <el-row>
@@ -171,7 +173,7 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="运输公司名称" label-width="130px" prop="coCode">
+                            <el-form-item label="运输公司名称"  prop="coCode">
                                 <el-input v-model="editForm.coCode" auto-complete="on" placeholder="运输公司名称"></el-input>
                             </el-form-item>
                         </el-row>
@@ -186,12 +188,12 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车主联系电话" label-width="130px" prop="ownerInsideTel">
+                            <el-form-item label="车主联系电话" prop="ownerInsideTel">
                                 <el-input v-model="editForm.ownerInsideTel"  auto-complete="on" placeholder="车主联系电话"></el-input>
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="行驶证有效期" label-width="130px" prop="veFactoryDate">
+                            <el-form-item label="行驶证有效期" prop="veFactoryDate">
                                 <el-date-picker
                                         v-model="editForm.veFactoryDate"
                                         type="date"
@@ -202,7 +204,7 @@
                     </el-col>
                     <el-col :span="10">
                         <el-row>
-                            <el-form-item label="自重（空车重量）" label-width="140px" prop="selfWt">
+                            <el-form-item label="自重（空车重量）" prop="selfWt">
                                 <el-input v-model="editForm.selfWt" auto-complete="on" placeholder="自重(空车重量）"></el-input>
                             </el-form-item>
                         </el-row>
@@ -222,12 +224,12 @@
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车辆备案编号" label-width="110px" prop="apprNo">
+                            <el-form-item label="车辆备案编号" prop="apprNo">
                                 <el-input v-model="editForm.apprNo" auto-complete="on" placeholder="车辆备案编号"></el-input>
                             </el-form-item>
                         </el-row>
                         <el-row>
-                            <el-form-item label="车辆属性" label-width="100px" prop="veClassFlag">
+                            <el-form-item label="车辆属性" prop="veClassFlag">
                                 <el-select v-model="editForm.veClassFlag"  placeholder="请选择">
                                     <el-option
                                             v-for="item in options"
@@ -237,15 +239,15 @@
                                     </el-option>
                                 </el-select>
                             </el-form-item>
-                            <el-form-item label="备注" label-width="100px" prop="memo">
+                            <el-form-item label="备注" prop="memo">
                                 <el-input v-model="editForm.memo" auto-complete="on" placeholder="备注"></el-input>
                             </el-form-item>
                         </el-row>
                     </el-col>
                 </el-row>
             </el-form>
-            <div slot="footer" class="dialog-footer">
-                <el-button type="primary" @click.native="editSubmit()">保存</el-button>
+            <div slot="footer" class="dialog-footer" style="text-align: center">
+                <el-button type="primary" size="medium" style="width: 100px"@click.native="editSubmit()">保存</el-button>
             </div>
         </el-dialog>
     </section>