前端gjy

src/views/tranManagement/tranManagementDriver.vue

@@ -36,17 +36,10 @@
           type="input"
           class="findValue"
         ></ws-input>
-        <ws-button
-          type="primary"
-          @click="handleLook()"
-          v-hasPermission="
-            `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-          "
-          >查找</ws-button
-        >
+        <ws-button type="primary" @click="handleLook()">查找</ws-button>
       </template>
     </BaseHeaderLayout>
-    <div class="connert">
+    <div>
       <el-table
         class="wenzi"
         :data="driverList.records"
@@ -63,45 +56,63 @@
               <div v-for="item in props.row.driverPayeeInfoList">
                 <ws-info-table>
                   <ws-form-item
+                    :class="item.accountTypeFlag == 1 ? 'personage' : 'company'"
                     v-if="item.accountTypeFlag == 1"
                     label="收款人"
                     span="1"
                     prop="payeeName"
-                    class="el-car"
+                    class="el-car name"
                   >
-                    {{ item.payeeName }}
+                    <div style="width: 100%">{{ item.payeeName }}</div>
                   </ws-form-item>
                   <ws-form-item
+                    :class="item.accountTypeFlag == 1 ? 'personage' : 'company'"
                     v-if="item.accountTypeFlag == 2"
                     label="企业名称"
                     span="1"
                     prop="compName"
                     class="el-car"
                   >
-                    {{ item.compName }}
+                    <div style="width: 100%">{{ item.compName }}</div>
                   </ws-form-item>
                   <ws-form-item
+                    :class="item.accountTypeFlag == 1 ? 'personage' : 'company'"
                     v-if="item.accountTypeFlag == 1"
                     label="身份证"
                     span="1"
                     prop="payeeNumberCard"
-                    class="el-car"
+                    class="el-car card"
                   >
-                    {{ item.payeeNumberCard }}
+                    <div style="width: 100%">
+                      {{ item.payeeNumberCard }}
+                      <img
+                        width="12"
+                        height="13"
+                        src="../../../public/img/fujian-grey.png"
+                        alt=""
+                        @click="fujian1(item)"
+                      />
+                    </div>
                   </ws-form-item>
                   <ws-form-item
+                    :class="item.accountTypeFlag == 1 ? 'personage' : 'company'"
                     label="开户行"
                     span="1"
                     prop="bankDeposit"
                     class="el-car"
                   >
-                    <span style="margin: 10px; display: inline-block">{{
-                      item.bankDeposit
-                    }}</span
+                    <span
+                      style="
+                        margin: 10px;
+                        display: inline-block;
+                        border-right: 1px solid #e9ecf7;
+                        padding-right: 10px;
+                      "
+                      >{{ item.bankDeposit }}</span
                     ><span
                       style="
                         margin: 10px;
-                        padding: 10px;
+                        padding: 0px;
                         display: inline-block;
                         word-wrap: break-word;
                         line-height: 20px;
@@ -111,12 +122,13 @@
                     >
                   </ws-form-item>
                   <ws-form-item
+                    :class="item.accountTypeFlag == 1 ? 'personage' : 'company'"
                     label="账号"
                     span="1"
                     prop="bankCard"
                     class="el-car"
                   >
-                    {{ item.bankCard }}
+                    <div style="width: 100%">{{ item.bankCard }}</div>
                   </ws-form-item>
                 </ws-info-table>
               </div>
@@ -170,16 +182,26 @@
               type="text"
               class="fs-16"
               @click="expandsHandle(scope.row)"
-              >展开</el-button
-            >
+              >展开<img
+                width="9"
+                height="6"
+                style="vertical-align: middle; margin-left: 3px"
+                src="../../../public/img/zhankai.png"
+                alt=""
+            /></el-button>
             <el-button
               v-if="scope.row.expandsStatus"
               size="medium"
               type="text"
               class="fs-16"
               @click="expandsHandle(scope.row)"
-              >收起</el-button
-            >
+              >收起<img
+                width="9"
+                height="6"
+                style="vertical-align: middle; margin-left: 3px"
+                src="../../../public/img/shouqi.png"
+                alt=""
+            /></el-button>
           </template>
         </el-table-column>
         <el-table-column prop="addressUrl" label="附件">
@@ -197,40 +219,23 @@
             }}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="address" label="操作" width="400">
+        <el-table-column prop="address" label="操作" width="500">
           <template slot-scope="scope">
-            <ws-button
-              type="primary"
-              @click="look(scope.row)"
-              v-hasPermission="
-                `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-              "
-              >查看</ws-button
+            <el-button size="medium" type="text" @click="look(scope.row)"
+              >查看</el-button
             >
-            <ws-button
-              type="primary"
-              @click="edit(scope.row)"
-              v-hasPermission="
-                `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-              "
-              >编辑</ws-button
+            <el-button size="medium" type="text" @click="edit(scope.row)"
+              >编辑</el-button
             >
-            <ws-button
-              type="primary"
-              @click="deletes(scope.row)"
-              v-hasPermission="
-                `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-              "
-              >删除</ws-button
+            <el-button size="medium" type="text" @click="deletes(scope.row)"
+              >删除</el-button
             >
-            <ws-button
+            <el-button
               v-if="scope.row.disableStatusFlag != 1"
-              type="primary"
+              size="medium"
+              type="text"
               @click="stop(scope.row)"
-              v-hasPermission="
-                `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-              "
-              >禁用</ws-button
+              >禁用</el-button
             >
             <el-tooltip
               class="item"
@@ -238,14 +243,12 @@
               :content="scope.row.disableReasons"
               placement="right-start"
             >
-              <ws-button
+              <el-button
                 v-if="scope.row.disableStatusFlag == 1"
-                type="primary"
+                size="medium"
+                type="text"
                 @click="relieve(scope.row)"
-                v-hasPermission="
-                  `${$permission('PERMISSIONS.PURSPAPPLINFO_CREATEINSTORE')}`
-                "
-                >已禁用</ws-button
+                >已禁用</el-button
               >
             </el-tooltip>
           </template>
@@ -307,19 +310,14 @@
       >
         <img width="100" height="100" :src="item" alt="" />
       </div>
-
-      <!-- <ws-upload
-        ref="upload"
-        table-name="maintain_work_order"
-        oss-key="mainPlan"
-        :comp-id="compId"
-        :file-list="fileList"
-        :appendix-ids="appendixIdsAdd"
-        :vesselId="deptBudgetList.addressUrl"
-        :size-limit="size"
-        @uploadSuccess="uploadSuccess"
-        accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
-      /> -->
+    </WinseaContentModal>
+    <WinseaContentModal
+      v-model="accesscard"
+      :title="$t('system.noticeCircular.information')"
+      @on-cancel="handleClose1"
+    >
+      <p>查看附件</p>
+      <img width="100" height="100" :src="accessurl" alt="" />
     </WinseaContentModal>
     <!-- <WinseaContentModal
       v-model="accessoryTFs"
@@ -390,7 +388,7 @@ export default {
       startDate: null,
       endDate: null,
       carNumber: '',
-      searchTypeText: '',
+      searchTypeText: [],
       outerVisible: false,
       //图片
       fileList: [],
@@ -421,6 +419,10 @@ export default {
       },
       appendixIdss: [],
       accessoryTFs: false,
+      accesscard: false,
+      accessurl: '',
+      residentCityProvincial: '',
+      residentCityMunicipal: '',
     }
   },
   activated() {
@@ -536,6 +538,9 @@ export default {
     handleClose() {
       this.accessoryTFs = false
     },
+    handleClose1() {
+      this.accesscard = false
+    },
     handleSizeChange(val) {
       console.log(`每页 ${val} 条`)
       this.pageSize = val
@@ -552,6 +557,8 @@ export default {
         currentPage: this.currentPage,
         pageSize: this.pageSize,
         searchType: this.searchType,
+        residentCityProvincial: this.residentCityProvincial,
+        residentCityMunicipal: this.residentCityMunicipal,
         searchKeyWord: this.searchKeyWord,
       })
         .toPromise()
@@ -577,7 +584,6 @@ export default {
           this.deptCircularPage.pageSize = response.size
           this.deptBudgetTotal = response.total
           this.driverList = response
-          console.log(this.fileList, 1212121212121212)
         })
     },
     editClick(row) {
@@ -612,9 +618,8 @@ export default {
         })
     },
     selecttaskType(e) {
-      this.currentPage = 1
-      this.getList()
-
+      this.residentCityProvincial = CodeToText[e[0]]
+      this.residentCityMunicipal = CodeToText[e[1]]
       // this.selectedOptions = e
     },
     fujian(row) {
@@ -628,6 +633,17 @@ export default {
       }
       this.appendixIdss = row.addressUrlArray
     },
+    fujian1(item) {
+      if (item.cardAddressUrl === null || item.cardAddressUrl === '') {
+        EventBus.$emit(
+          'warning',
+          this.$t('system.noticeCircular.NoInformation')
+        )
+      } else {
+        this.accesscard = true
+      }
+      this.accessurl = item.cardAddressUrl
+    },
     handleExamine(row) {
       this.$router.push({
         name: 'salesContractExamine',
@@ -670,4 +686,41 @@ export default {
 /deep/.el-icon-arrow-right {
   display: none;
 }
+.ws-info-table {
+  border-left: 1px solid #e9ecf7;
+  border-top: 1px solid #e9ecf7;
+}
+/deep/.ws-info-table .el-form-item {
+  border-right: 1px solid #e9ecf7;
+  border-bottom: 1px solid #e9ecf7;
+}
+/deep/.ws-info-table .el-form-item .el-form-item__label {
+  text-align: center;
+  background: #f6f7fc;
+}
+
+/deep/.ws-info-table .el-form-item.company,
+/deep/.ws-info-table .el-form-item.personage {
+  width: 33.333%;
+}
+/deep/.ws-info-table .el-form-item.name {
+  width: 15.665%;
+}
+/deep/.ws-info-table .el-form-item.card {
+  width: 17.665%;
+}
+/deep/.ws-info-table .el-form-item .el-form-item__content {
+  text-align: center;
+  border-left: 1px solid #e9ecf7;
+}
+/deep/.el-table .el-table__header .cell,
+/deep/.el-table .el-table__body .cell {
+  text-align: center;
+}
+.el-button--text {
+  color: #5878e8;
+}
+.el-button--primary {
+  background: #5878e8;
+}
 </style>

src/views/tranManagement/tranManagementDriverAdd.vue

@@ -27,8 +27,8 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
-      <div class="flex">
-        <div class="driver">司机信息</div>
+      <div class="drivermessage">
+        <div class="small-title">司机信息</div>
         <ws-info-table>
           <!--司机姓名-->
           <ws-form-item
@@ -89,7 +89,8 @@
             />
           </ws-form-item>
         </ws-info-table>
-        <span v-if="age">{{ age }}岁</span>
+        <span v-if="age && age < 60" class="small">{{ age }}岁</span>
+        <span v-if="age && age > 60" class="big">{{ age }}岁</span>
       </div>
     </ws-form>
 
@@ -98,12 +99,13 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">货车信息</div>
       <div
         style="width: 100%"
         class="flex position"
         v-for="(item, index) in freightspace"
       >
-        <div class="flex">
+        <div class="trucks">
           <div class="driver">货车信息-{{ index + 1 }}</div>
           <ws-info-table class="el-table">
             <!--车牌号-->
@@ -210,12 +212,13 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">收款人账户信息</div>
       <div
         style="width: 100%"
         class="flex position"
         v-for="(item, index) in freightspace1"
       >
-        <div class="flex">
+        <div class="gathering">
           <div class="driver">收款人账户信息-{{ index + 1 }}</div>
           <ws-info-table class="el-table">
             <!--账户类型-->
@@ -347,7 +350,12 @@
                 />
               </el-upload>
             </ws-form-item>
-            <ws-form-item label="开户支行" span="1" prop="bankDepositBranch">
+            <ws-form-item
+              class="el-car"
+              label="开户支行"
+              span="1"
+              prop="bankDepositBranch"
+            >
               <ws-select
                 v-model="item.bankDepositBranch"
                 placeholder=""
@@ -399,7 +407,7 @@
             :on-success="uploadSuccessHandletravel"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button" size="small" type="primary"
               >行驶证</el-button
             >
           </el-upload>
@@ -418,7 +426,7 @@
             :on-success="uploadSuccessHandledrive"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button" size="small" type="primary"
               >驾驶证</el-button
             >
           </el-upload>
@@ -437,7 +445,7 @@
             :on-success="uploadSuccessHandleway"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-green" size="small" type="primary"
               >道路运营证</el-button
             >
           </el-upload>
@@ -456,7 +464,7 @@
             :on-success="uploadSuccessHandlequalification"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-green" size="small" type="primary"
               >从业资格证</el-button
             >
           </el-upload>
@@ -475,7 +483,7 @@
             :on-success="uploadSuccessHandleidentityjust"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-yellow" size="small" type="primary"
               >身份证正面</el-button
             >
           </el-upload>
@@ -494,7 +502,7 @@
             :on-success="uploadSuccessHandleidentityagainst"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-yellow" size="small" type="primary"
               >身份证反面</el-button
             >
           </el-upload>
@@ -886,9 +894,32 @@ export default {
           return
         }
       }
+      if (!this.addressUrls.travel) {
+        EventBus.$emit('error', '行驶证不能为空')
+        return
+      }
+      if (!this.addressUrls.drive) {
+        EventBus.$emit('error', '驾驶证不能为空')
+        return
+      }
+      if (!this.addressUrls.way) {
+        EventBus.$emit('error', '道路运营证不能为空')
+        return
+      }
+      if (!this.addressUrls.qualification) {
+        EventBus.$emit('error', '从业资格证不能为空')
+        return
+      }
+      if (!this.addressUrls.identityjust) {
+        EventBus.$emit('error', '身份证正面不能为空')
+        return
+      }
+      if (!this.addressUrls.identityagainst) {
+        EventBus.$emit('error', '身份证反面不能为空')
+        return
+      }
       var arr = []
       for (let key in this.addressUrls) {
-        console.log(this.addressUrls[key])
         arr.push(this.addressUrls[key])
       }
 
@@ -990,17 +1021,6 @@ export default {
 .el-col {
   background: #f6f7fc;
 }
-/deep/.ws-info-table .el-form-item .el-form-item__content {
-  padding: 0 25px;
-  border-left: 1px solid #cdd2dc;
-  background: #fafbfc;
-}
-/deep/.ws-info-table .el-form-item .el-form-item__label {
-  width: 140px;
-  text-align: center;
-  background: #f0f2f6;
-  // border: 1px solid #cdd2dc;
-}
 .button-container {
   display: flex;
   flex-wrap: nowrap;
@@ -1058,46 +1078,9 @@ export default {
   width: 100%;
   z-index: 1;
 }
-.bg-left {
-  padding-left: 30px;
-}
-.bg-right {
-  padding-right: 10px;
-  text-align: right;
-}
-.bg-bottom {
-  margin: 15px 0px;
-}
-.wenzi {
-  width: 900px;
-  margin: 0 auto;
-}
-.wenzi h3 {
-  display: inline-block;
-  left: 10px;
-}
-.wenzi p {
-  display: inline-block;
-}
-.center {
-  width: 900px;
-  margin: 0 auto;
-}
 .el-form-item__label {
   text-align: center;
 }
-.el-table {
-  width: 1240px;
-}
-.ce {
-  width: 900px;
-  margin: 0 auto;
-}
-.driver {
-  width: 120px;
-  margin-top: 10px;
-  font-weight: bold;
-}
 
 // 控制select为只读的时候显示样式
 /deep/.ws-class-table-col {
@@ -1120,9 +1103,6 @@ export default {
 /deep/.ws-info-table .el-form-item {
   width: 25%;
 }
-.el-textarea__inner {
-  display: none;
-}
 .el-form {
   margin-top: 50px;
 }
@@ -1147,4 +1127,138 @@ export default {
 .el-form-item.el-car.el-form-item--small {
   width: 33.3%;
 }
+.trucks {
+  color: #69708c;
+  border: 1px solid #d8dce6;
+  width: 90%;
+  padding: 12px;
+  border-radius: 3px;
+  margin: 10px 0;
+}
+/deep/.trucks .ws-info-table,
+/deep/.trucks .ws-info-table .el-form-item,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__content {
+  border: none;
+}
+/deep/.trucks .el-table__expanded-cell,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__label,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__content {
+  background: transparent;
+}
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__label {
+  color: #8890b1;
+}
+/deep/.trucks .el-table:before {
+  height: 0;
+}
+.gathering {
+  background: #f5f7fa;
+  border: 1px solid #d8dce6;
+  border-radius: 3px;
+  width: 90%;
+}
+/deep/.gathering .ws-info-table {
+  border-left: none;
+  border-top: 1px solid #d8dce6;
+}
+/deep/.gathering .driver {
+  padding: 10px;
+}
+/deep/.gathering .el-form-item .el-form-item__label {
+  background: #f5f7fa;
+  text-align: center;
+}
+/deep/.gathering .ws-info-table .el-form-item .el-form-item__content {
+  border-left: 1px solid #d8dce6;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit1 {
+  border-right: 1px solid transparent;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname {
+  width: 100%;
+}
+.button.el-button--primary,
+.button-green.el-button--primary,
+.button-yellow.el-button--primary {
+  height: 28px;
+  background: #edf1ff;
+  border-radius: 4px;
+  color: #5473e8;
+  font-size: 12px;
+  text-align: center;
+  line-height: 28px;
+  margin: 0 10px;
+  padding: 0 10px;
+  border: 1px solid transparent;
+}
+.button-green.el-button--primary {
+  background: #ecf8f9;
+  color: #50cad4;
+}
+.button-yellow.el-button--primary {
+  background: #fff6eb;
+  color: #ff9f24;
+}
+.el-button--primary {
+  background: #5878e8;
+  border-color: #5878e8;
+}
+.drivermessage {
+  position: relative;
+}
+.drivermessage .ws-info-table {
+  border: none;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__label {
+  background: #fff;
+  width: 80px;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__content,
+/deep/.drivermessage .ws-info-table .el-form-item {
+  border: none;
+}
+//蓝标
+.small-title {
+  position: relative;
+  padding: 10px;
+  font-weight: 600;
+}
+.bg-left {
+  padding-left: 30px;
+}
+.bg-right {
+  padding-right: 10px;
+  text-align: right;
+}
+.bg-bottom {
+  margin: 15px 0px;
+}
+.small-title::before {
+  position: absolute;
+  content: '';
+  display: block;
+  background: #5473e8;
+  width: 4px;
+  height: 14px;
+  left: 0px;
+  top: 13px;
+  padding: 4px 2px;
+}
+.small,
+.big {
+  color: #ccc;
+  line-height: 16px;
+  position: absolute;
+  right: -50px;
+  top: 44px;
+  border: 1px solid #ccc;
+  padding: 5px 10px;
+  border-radius: 20px;
+}
+.big {
+  color: #f46060;
+  background: #ffeeee;
+}
 </style>

src/views/tranManagement/tranManagementDriverEdit.vue

@@ -27,8 +27,8 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
-      <div class="flex">
-        <div class="driver">司机信息</div>
+      <div class="small-title">司机信息</div>
+      <div class="drivermessage">
         <ws-info-table>
           <!--司机姓名-->
           <ws-form-item
@@ -88,7 +88,8 @@
             />
           </ws-form-item>
         </ws-info-table>
-        {{ age }}
+        <span v-if="age && age < 60" class="small">{{ age }}岁</span>
+        <span v-if="age && age > 60" class="big">{{ age }}岁</span>
       </div>
     </ws-form>
 
@@ -97,12 +98,13 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">货车信息</div>
       <div
         style="width: 100%"
         class="flex position"
         v-for="(item, index) in deptBudgetList.driverCarInfoList"
       >
-        <div class="flex">
+        <div class="trucks">
           <div class="driver">货车信息-{{ index + 1 }}</div>
           <ws-info-table class="el-table">
             <!--车牌号-->
@@ -214,12 +216,13 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">收款人账户信息</div>
       <div
         style="width: 100%"
         class="flex position"
         v-for="(item, index) in deptBudgetList.driverPayeeInfoList"
       >
-        <div class="flex">
+        <div class="gathering">
           <div class="driver">收款人账户信息-{{ index + 1 }}</div>
           <ws-info-table class="el-table">
             <!--账户类型-->
@@ -351,7 +354,12 @@
                 />
               </el-upload>
             </ws-form-item>
-            <ws-form-item label="开户支行" span="1" prop="bankDepositBranch">
+            <ws-form-item
+              label="开户支行"
+              span="1"
+              prop="bankDepositBranch"
+              class="el-car"
+            >
               <ws-select
                 v-model="item.bankDepositBranch"
                 placeholder=""
@@ -403,7 +411,7 @@
             :on-success="uploadSuccessHandletravel"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button" size="small" type="primary"
               >行驶证</el-button
             >
           </el-upload>
@@ -422,7 +430,7 @@
             :on-success="uploadSuccessHandledrive"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button" size="small" type="primary"
               >驾驶证</el-button
             >
           </el-upload>
@@ -441,7 +449,7 @@
             :on-success="uploadSuccessHandleway"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-green" size="small" type="primary"
               >道路运营证</el-button
             >
           </el-upload>
@@ -460,7 +468,7 @@
             :on-success="uploadSuccessHandlequalification"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-green" size="small" type="primary"
               >从业资格证</el-button
             >
           </el-upload>
@@ -479,7 +487,7 @@
             :on-success="uploadSuccessHandleidentityjust"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-yellow" size="small" type="primary"
               >身份证正面</el-button
             >
           </el-upload>
@@ -498,7 +506,7 @@
             :on-success="uploadSuccessHandleidentityagainst"
             class="avatar-uploader"
             accept=".jpg, .jpeg, .png, .gif"
-            ><el-button class="upload" size="small" type="primary"
+            ><el-button class="upload button-yellow" size="small" type="primary"
               >身份证反面</el-button
             >
           </el-upload>
@@ -593,7 +601,6 @@ export default {
           yearManufacture: '',
         },
       ],
-      addressUrls:{},
       freightspace1: [
         {
           accountTypeFlag: '1',
@@ -608,6 +615,7 @@ export default {
       ],
       name: '',
       age: '',
+      addressUrls: {},
     }
   },
   activated() {
@@ -647,7 +655,8 @@ export default {
               response.driverPayeeInfoList[i].cardAddressUrlArray = []
             }
           }
-
+          this.IdCard(response.numberCard)
+          console.log(this.age)
           this.deptBudgetList = Object.assign({}, response)
           var tmp = []
           tmp[0] = TextToCode[this.deptBudgetList.residentCityProvincial].code
@@ -806,7 +815,6 @@ export default {
     // 上传附件
     uploadSuccess(data, files, url) {
       console.log(data, files, url)
-
       // this.deptBudgetList.
       // this.formData.append('files', files)
       // this.feedbackObj.uploadNameAttachment = data.appendixName
@@ -882,10 +890,6 @@ export default {
 .del {
   right: -70px;
 }
-.amap-page-container {
-  width: 300px;
-  height: 300px;
-}
 .el-form {
   padding: 0 10%;
 }
@@ -899,9 +903,6 @@ export default {
 .title {
   position: relative;
 }
-.el-car {
-  width: 413px;
-}
 .title::before {
   content: '';
   display: inline-block;
@@ -911,6 +912,23 @@ export default {
   position: absolute;
   left: 0;
 }
+//蓝标
+.small-title {
+  position: relative;
+  padding: 10px;
+  font-weight: 600;
+}
+.small-title::before {
+  position: absolute;
+  content: '';
+  display: block;
+  background: #5473e8;
+  width: 4px;
+  height: 14px;
+  left: 0px;
+  top: 13px;
+  padding: 4px 2px;
+}
 .el-col {
   background: #f6f7fc;
 }
@@ -989,21 +1007,6 @@ export default {
 .bg-bottom {
   margin: 15px 0px;
 }
-.wenzi {
-  width: 900px;
-  margin: 0 auto;
-}
-.wenzi h3 {
-  display: inline-block;
-  left: 10px;
-}
-.wenzi p {
-  display: inline-block;
-}
-.center {
-  width: 900px;
-  margin: 0 auto;
-}
 .el-form-item__label {
   text-align: center;
 }
@@ -1015,7 +1018,6 @@ export default {
   margin: 0 auto;
 }
 .driver {
-  width: 120px;
   margin-top: 10px;
   font-weight: bold;
 }
@@ -1047,9 +1049,6 @@ export default {
 .el-form {
   margin-top: 50px;
 }
-.readonly {
-  width: 16%;
-}
 .el-cascader {
   width: 145px;
 }
@@ -1062,10 +1061,114 @@ export default {
 .el-form-item.forlist.el-form-item--small {
   width: 20%;
 }
-.el-form-item.readonly.is-success.el-form-item--small.showLableToopTip {
-  width: 20%;
-}
 .el-form-item.el-car.el-form-item--small {
   width: 33.3%;
 }
+.trucks {
+  color: #69708c;
+  border: 1px solid #d8dce6;
+  width: 90%;
+  padding: 12px;
+  border-radius: 3px;
+  margin: 10px 0;
+}
+/deep/.trucks .ws-info-table,
+/deep/.trucks .ws-info-table .el-form-item,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__content {
+  border: none;
+}
+/deep/.trucks .el-table__expanded-cell,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__label,
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__content {
+  background: transparent;
+}
+/deep/.trucks .ws-info-table .el-form-item .el-form-item__label {
+  color: #8890b1;
+}
+/deep/.trucks .el-table:before {
+  height: 0;
+}
+.gathering {
+  background: #f5f7fa;
+  border: 1px solid #d8dce6;
+  border-radius: 3px;
+  width: 90%;
+}
+/deep/.gathering .ws-info-table {
+  border-left: none;
+  border-top: 1px solid #d8dce6;
+}
+/deep/.gathering .driver {
+  padding: 10px;
+}
+/deep/.gathering .el-form-item .el-form-item__label {
+  background: #f5f7fa;
+  text-align: center;
+}
+/deep/.gathering .ws-info-table .el-form-item .el-form-item__content {
+  border-left: 1px solid #d8dce6;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit1 {
+  border-right: 1px solid transparent;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname {
+  width: 100%;
+}
+.button.el-button--primary,
+.button-green.el-button--primary,
+.button-yellow.el-button--primary {
+  height: 28px;
+  background: #edf1ff;
+  border-radius: 4px;
+  color: #5473e8;
+  font-size: 12px;
+  text-align: center;
+  line-height: 28px;
+  margin: 0 10px;
+  padding: 0 10px;
+  border: 1px solid transparent;
+}
+.button-green.el-button--primary {
+  background: #ecf8f9;
+  color: #50cad4;
+}
+.button-yellow.el-button--primary {
+  background: #fff6eb;
+  color: #ff9f24;
+}
+.el-button--primary {
+  background: #5878e8;
+  border-color: #5878e8;
+}
+.drivermessage {
+  position: relative;
+}
+.drivermessage .ws-info-table {
+  border: none;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__label {
+  background: #fff;
+  width: 80px;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__content,
+/deep/.drivermessage .ws-info-table .el-form-item {
+  border: none;
+}
+.small,
+.big {
+  color: #ccc;
+  line-height: 16px;
+  position: absolute;
+  right: -50px;
+  top: 44px;
+  border: 1px solid #ccc;
+  padding: 5px 10px;
+  border-radius: 20px;
+}
+.big {
+  color: #f46060;
+  background: #ffeeee;
+}
 </style>

src/views/tranManagement/tranManagementDriverLook.vue

@@ -22,13 +22,9 @@
       </el-col>
     </el-row>
 
-    <ws-form
-      ref="deptBudgetList"
-      :rules="mainReportAdd"
-      :model="deptBudgetList"
-    >
-      <div class="flex">
-        <div class="driver">司机信息</div>
+    <ws-form ref="deptBudgetList" :rules="mainReportAdd" :model="deptBudgetList"
+      ><div class="small-title">司机信息</div>
+      <div class="flex drivermessage">
         <ws-info-table>
           <!--司机姓名-->
           <ws-form-item
@@ -38,6 +34,7 @@
             class="readonly bg-right"
           >
             <ws-input
+              disabled
               v-model="deptBudgetList.driverName"
               placeholder="请输入司机姓名"
               maxlength="20"
@@ -52,6 +49,7 @@
             class="readonly"
           >
             <ws-input
+              disabled
               v-model="deptBudgetList.driverPhone"
               placeholder="请输入手机号"
               maxlength="100"
@@ -61,16 +59,8 @@
 
           <!--常驻城市-->
           <ws-form-item label="常驻城市" span="1" prop="acceptanceMethod">
-            <el-cascader
-              :options="options_"
-              v-model="selectedOptions"
-              clearable
-              size="large"
-              placeholder="请选择常驻城市"
-              style="width: 200%"
-              class="el-cascader"
-              @change="handleChange"
-            />
+            {{ deptBudgetList.residentCityProvincial
+            }}{{ deptBudgetList.residentCityMunicipal }}
           </ws-form-item>
 
           <!--身份证号-->
@@ -81,6 +71,7 @@
             class="readonly"
           >
             <ws-input
+              disabled
               v-model="deptBudgetList.numberCard"
               placeholder="请输入身份证号"
               maxlength="100"
@@ -88,7 +79,8 @@
             />
           </ws-form-item>
         </ws-info-table>
-        {{ age }}
+        <span v-if="age && age < 60" class="small">{{ age }}岁</span>
+        <span v-if="age && age > 60" class="big">{{ age }}岁</span>
       </div>
     </ws-form>
 
@@ -97,107 +89,19 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">货车信息</div>
       <div
         style="width: 100%"
         class="flex position"
-        v-for="(item, index) in freightspace"
+        v-for="(item, index) in deptBudgetList.driverCarInfoList"
       >
-        <div class="flex">
+        <div class="trucks">
           <div class="driver">货车信息-{{ index + 1 }}</div>
-          <ws-info-table class="el-table">
-            <!--车牌号-->
-            <ws-form-item
-              label="车牌号"
-              span="1"
-              prop="carNumber"
-              class="forlist"
-              width="400px"
-            >
-              <ws-input
-                v-model="item.carNumber"
-                placeholder="请输入车牌号"
-                maxlength="20"
-                size="small"
-              />
-            </ws-form-item>
-            <!--车型-->
-            <ws-form-item label="车型" span="1" prop="carModel" class="forlist">
-              <ws-select
-                v-model="item.carModel"
-                placeholder=""
-                class="typeselect"
-                @change="selectcarModel"
-              >
-                <ws-option
-                  v-for="item in carModelList"
-                  :key="item.constKey"
-                  :label="item.constValue"
-                  :value="item.constValue"
-                />
-              </ws-select>
-            </ws-form-item>
-            <!--车长-->
-            <ws-form-item
-              label="不含车头车长（米）"
-              span="1"
-              prop="carLength"
-              class="forlist"
-            >
-              <ws-select
-                v-model="item.carLength"
-                placeholder=""
-                class="typeselect"
-                @change="selectcarLength"
-              >
-                <ws-option
-                  v-for="item in carLengthList"
-                  :key="item.constKey"
-                  :label="item.constValue"
-                  :value="item.constValue"
-                />
-              </ws-select>
-            </ws-form-item>
-            <!--载重-->
-            <ws-form-item label="载重" span="1" prop="carLoad" class="forlist">
-              <ws-input
-                v-model="item.carLoad"
-                placeholder="请输入载重"
-                maxlength="100"
-                size="small"
-              />
-            </ws-form-item>
-
-            <!--出厂年份-->
-            <ws-form-item
-              label="出厂年份"
-              span="1"
-              prop="yearManufacture"
-              class="forlist"
-            >
-              <ws-input
-                v-model="item.yearManufacture"
-                placeholder="请输入年份"
-                maxlength="100"
-                size="small"
-              />
-            </ws-form-item>
-          </ws-info-table>
-          <img
-            width="22"
-            height="22"
-            class="add"
-            @click="add"
-            src="../../../public/img/add.png"
-            alt=""
-          />
-          <img
-            width="22"
-            height="22"
-            class="del"
-            @click="del(index)"
-            src="../../../public/img/del.png"
-            alt=""
-          />
+          <div class="truckswrap">车牌号: {{ item.carNumber }}</div>
+          <div class="truckswrap">车型: {{ item.carModel }}</div>
+          <div class="truckswrap">不含车头车长（米）: {{ item.carLength }}</div>
+          <div class="truckswrap">载重: {{ item.carLoad }}</div>
+          <div class="truckswrap">出厂年份: {{ item.yearManufacture }}</div>
         </div>
       </div>
     </ws-form>
@@ -206,12 +110,12 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">收款人账户信息</div>
       <div
-        style="width: 100%"
-        class="flex position"
-        v-for="(item, index) in freightspace1"
+        class="gathering"
+        v-for="(item, index) in deptBudgetList.driverPayeeInfoList"
       >
-        <div class="flex">
+        <div>
           <div class="driver">收款人账户信息-{{ index + 1 }}</div>
           <ws-info-table class="el-table">
             <!--账户类型-->
@@ -221,66 +125,32 @@
               prop="contractNo"
               class="el-car bg-right"
             >
-              <el-radio v-model="item.radio" label="1">私人账号</el-radio>
-              <el-radio v-model="item.radio" label="2">企业账户</el-radio>
+              <span v-if="item.accountTypeFlag == 1">私人账号</span>
+              <span v-if="item.accountTypeFlag == 2">企业账户</span>
             </ws-form-item>
             <!--账号-->
             <ws-form-item label="账号" span="1" prop="bankCard" class="el-car">
-              <ws-input
-                v-model="item.bankCard"
-                placeholder="请输入账号"
-                maxlength="100"
-                size="small"
-              />
-              <el-upload
-                :headers="headers"
-                :action="uploadPath"
-                :show-file-list="false"
-                :on-success="uploadSuccessHandle"
-                class="avatar-uploader"
-                accept=".jpg, .jpeg, .png, .gif"
-                ><img
-                  width="18"
-                  height="20"
-                  style="
-                    vertical-align: text-top;
-                    position: relative;
-                    top: -1px;
-                  "
-                  src="../../../public/img/fujian.png"
-                  alt=""
-                />
-              </el-upload>
+              {{ item.bankCard }}
             </ws-form-item>
             <!--开户行-->
             <ws-form-item
               label="开户行"
               span="1"
               prop="bankDeposit"
-              class="el-car"
+              class="el-car bankDeposit"
             >
-              <ws-input
-                v-model="item.bankDeposit"
-                placeholder="请输入开户行"
-                maxlength="100"
-                size="small"
-              />
+              {{ item.bankDeposit }}
             </ws-form-item>
             <!--姓名-->
             <ws-form-item
               label="姓名"
-              v-if="item.radio == 1"
+              v-if="item.accountTypeFlag == 1"
               span="1"
               prop="payeeName"
               class="el-car"
               width="150px"
             >
-              <ws-input
-                v-model="item.payeeName"
-                placeholder="请输入姓名"
-                maxlength="100"
-                size="small"
-              />
+              {{ item.payeeName }}
             </ws-form-item>
             <!--企业名称-->
             <ws-form-item
@@ -288,88 +158,31 @@
               v-else
               span="1"
               prop="compName"
-              class="el-car"
+              class="el-car compname"
               width="150px"
             >
-              <ws-input
-                v-model="item.compName"
-                placeholder="请输入企业名称"
-                maxlength="100"
-                size="small"
-              />
+              {{ item.compName }}
             </ws-form-item>
 
             <!--身份证号-->
             <ws-form-item
               label="身份证号"
-              v-if="item.radio == 1"
+              v-if="item.accountTypeFlag == 1"
               span="1"
               prop="payeeNumberCard"
               class="el-car"
             >
-              <ws-input
-                v-model="item.payeeNumberCard"
-                placeholder="请输入身份证号"
-                maxlength="100"
-                size="small"
-              />
+              {{ item.payeeNumberCard }}
             </ws-form-item>
-            <!--身份证附件-->
             <ws-form-item
-              label="身份证附件"
-              v-if="item.radio == 1"
+              label="开户支行"
               span="1"
-              prop="cardAddressUrl"
-              class="el-car"
+              prop="bankDepositBranch"
+              class="el-car bankDeposit1"
             >
-              <el-upload
-                :headers="headers"
-                action="https://www.zthymaoyi.com/upload/admin"
-                :show-file-list="false"
-                :on-success="uploadSuccessHandle"
-                class="avatar-uploader"
-                accept=".jpg, .jpeg, .png, .gif"
-                ><img
-                  width="18"
-                  height="20"
-                  style="
-                    vertical-align: text-top;
-                    position: relative;
-                    top: -1px;
-                  "
-                  src="../../../public/img/fujian.png"
-                  alt=""
-                />
-              </el-upload>
-              <span v-if="item.addressUrlArray.length > 0">{{
-                item.addressUrlArray.length
-              }}</span>
-              <span v-if="item.addressUrlArray.length == 0">未上传</span>
-              <!-- <i @click="fujian(scope.row)" class="el-icon-paperclip iconCss"></i> -->
-              <!-- <ws-input
-            v-model="deptBudgetList.driverPayeeInfo.personNo"
-            placeholder="请输入身份证附件"
-            maxlength="100"
-            size="small"
-          /> -->
+              {{ item.bankDepositBranch }}
             </ws-form-item>
           </ws-info-table>
-          <img
-            width="22"
-            height="22"
-            class="add"
-            @click="add1"
-            src="../../../public/img/add.png"
-            alt=""
-          />
-          <img
-            width="22"
-            height="22"
-            class="del"
-            @click="del1(index)"
-            src="../../../public/img/del.png"
-            alt=""
-          />
         </div>
       </div>
     </ws-form>
@@ -378,20 +191,20 @@
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
+      <div class="small-title">相关附件</div>
       <div class="flex">
-        <div class="driver">相关附件</div>
-        <ws-upload
-          ref="upload"
-          table-name="maintain_work_order"
-          oss-key="mainPlan"
-          :comp-id="compId"
-          :appendix-ids="appendixIdsAdd"
-          :vesselId="deptBudgetList.addressUrl"
-          :size-limit="size"
-          @uploadSuccess="uploadSuccess"
-          @onChange="onChange"
-          accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
-        />
+        <div
+          style="margin: 10px"
+          v-for="(item, index) in deptBudgetList.addressUrlArray"
+        >
+          <div class="button" v-if="index == 0">行驶证</div>
+          <div class="button" v-if="index == 1">驾驶证</div>
+          <div class="button-green" v-if="index == 2">道路运营证</div>
+          <div class="button-green" v-if="index == 3">从业资格证</div>
+          <div class="button-yellow" v-if="index == 4">身份证正面</div>
+          <div class="button-yellow" v-if="index == 5">身份证反面</div>
+          <img width="100" height="100" :src="item" alt="" />
+        </div>
       </div>
     </ws-form>
     <!-- 提交 -->
@@ -400,8 +213,8 @@
         class="bg-bottom"
         type="primary"
         size="small"
-        @click="submit(deptBudgetList)"
-        >提交</el-button
+        @click="returnsales()"
+        >关闭</el-button
       >
     </div>
   </div>
@@ -509,6 +322,8 @@ export default {
       lookDriver({ id: this.$route.query.id })
         .toPromise()
         .then((response) => {
+          this.IdCard(response.numberCard)
+          response.addressUrlArray = response.addressUrl.split(',')
           this.deptBudgetList = response
         })
       //   // 车型
@@ -546,39 +361,6 @@ export default {
     handleClose() {
       this.dialogViewSpareMoney = false
     },
-    add() {
-      this.freightspace.push({
-        carNumber: '',
-        carModel: '高栏',
-        carModelKey: '1',
-        carLength: '13',
-        carLengthKey: '1',
-        carLoad: '',
-        yearManufacture: '',
-      })
-    },
-    del(index) {
-      if (this.freightspace.length > 1) {
-        this.freightspace.splice(index, 1)
-      }
-    },
-    add1() {
-      this.freightspace1.push({
-        account_type: '',
-        radio: '1',
-        payeeName: '',
-        payeeNumberCard: '',
-        compName: '',
-        bankDeposit: '',
-        bankCard: '',
-        addressUrlArray: [],
-      })
-    },
-    del1(index) {
-      if (this.freightspace1.length > 1) {
-        this.freightspace1.splice(index, 1)
-      }
-    },
     identitycardfujian(item) {},
     handleChange(value) {
       this.selectedOptions = value
@@ -586,65 +368,6 @@ export default {
     returnsales() {
       this.$router.push({ path: 'tranManagementDriver' })
     },
-    // confirmPosition() {
-    //   this.draggable = false
-    // },
-    // 上传附件
-    uploadSuccess(data, files, url) {
-      console.log(data, files, url)
-
-      // this.deptBudgetList.
-      // this.formData.append('files', files)
-      // this.feedbackObj.uploadNameAttachment = data.appendixName
-      // this.feedbackObj.pathUploadAttachment = data.appendixPath
-      // // this.newAppendixs = files
-      // this.onChangeFlag = true
-    },
-    selectcarModel(e) {
-      for (var i = 0; i < this.carModelList.length; i++) {
-        if (this.carModelList[i].constValue == e) {
-          this.deptBudgetList.carModelKey = this.carModelList[i].constKey
-        }
-      }
-    },
-    selectcarLength(e) {
-      for (var i = 0; i < this.carLengthList.length; i++) {
-        if (this.carLengthList[i].constValue == e) {
-          this.deptBudgetList.carLengthKey = this.carLengthList[i].constKey
-        }
-      }
-    },
-    onChange(files) {
-      this.fileNum = files
-      this.$refs.upload.handleSaveBill().then((res) => {
-        console.log(files)
-      })
-    },
-
-    submit() {
-      console.log(this.freightspace)
-
-      this.$refs.deptBudgetList.validate((valid) => {
-        if (valid) {
-          this.deptBudgetList.compId = sessionStorage.getItem('ws-pf_compId')
-          this.deptBudgetList.residentCityProvincial =
-            CodeToText[this.selectedOptions[0]]
-          this.deptBudgetList.residentCityMunicipal =
-            CodeToText[this.selectedOptions[1]]
-          this.deptBudgetList.driverCarInfoList = this.freightspace
-          this.deptBudgetList.driverPayeeInfoList = this.freightspace1
-          addDriver(this.deptBudgetList)
-            .toPromise()
-            .then((response) => {
-              this.$message.success('添加成功')
-              this.$router.push({ path: 'tranManagementDriver' })
-            })
-        } else {
-          EventBus.$emit('error', this.$t('showMessage.asteriskRequired'))
-          return false
-        }
-      })
-    },
     resetForm(deptBudgetList) {
       this.$refs[deptBudgetList].resetFields()
     },
@@ -677,9 +400,6 @@ export default {
   border-right: 1px solid #cdd2dc;
   border-bottom: 1px solid #cdd2dc;
 }
-.readonly {
-  position: relative;
-}
 .title {
   position: relative;
 }
@@ -698,16 +418,8 @@ export default {
 .el-col {
   background: #f6f7fc;
 }
-/deep/.ws-info-table .el-form-item .el-form-item__content {
-  padding: 0 25px;
-  border-left: 1px solid #cdd2dc;
-  background: #fafbfc;
-}
-/deep/.ws-info-table .el-form-item .el-form-item__label {
-  width: 140px;
-  text-align: center;
-  background: #f0f2f6;
-  // border: 1px solid #cdd2dc;
+.drivermessage {
+  position: relative;
 }
 .button-container {
   display: flex;
@@ -773,37 +485,27 @@ export default {
 .bg-bottom {
   margin: 15px 0px;
 }
-.wenzi {
-  width: 900px;
-  margin: 0 auto;
-}
-.wenzi h3 {
-  display: inline-block;
-  left: 10px;
-}
-.wenzi p {
-  display: inline-block;
-}
-.center {
-  width: 900px;
-  margin: 0 auto;
-}
+
 .el-form-item__label {
   text-align: center;
 }
-.el-table {
-  width: 1240px;
-}
-.ce {
-  width: 900px;
-  margin: 0 auto;
+//蓝标
+.small-title {
+  position: relative;
+  padding: 10px;
+  font-weight: 600;
 }
-.driver {
-  width: 120px;
-  margin-top: 10px;
-  font-weight: bold;
+.small-title::before {
+  position: absolute;
+  content: '';
+  display: block;
+  background: #5473e8;
+  width: 4px;
+  height: 14px;
+  left: 0px;
+  top: 13px;
+  padding: 4px 2px;
 }
-
 // 控制select为只读的时候显示样式
 /deep/.ws-class-table-col {
   height: auto;
@@ -812,16 +514,11 @@ export default {
     padding: 0px 2px;
   }
 }
-.winseaview-view {
-  padding: 0 0 20px;
-}
+
 .container {
   overflow: scroll;
   height: 93vh;
 }
-/deep/.ws-info-table .el-form-item .el-form-item__label {
-  width: 80px;
-}
 /deep/.ws-info-table .el-form-item {
   width: 25%;
 }
@@ -831,9 +528,6 @@ export default {
 .el-form {
   margin-top: 50px;
 }
-.readonly {
-  width: 16%;
-}
 .el-cascader {
   width: 145px;
 }
@@ -852,4 +546,97 @@ export default {
 .el-form-item.el-car.el-form-item--small {
   width: 33.3%;
 }
+.trucks {
+  background: #f5f7fa;
+  color: #69708c;
+  border: 1px solid #d8dce6;
+  width: 90%;
+  padding: 12px;
+  border-radius: 3px;
+}
+.truckswrap {
+  width: 19.7%;
+  display: inline-block;
+  margin: 0;
+  padding: 9px 0;
+}
+.gathering {
+  background: #f5f7fa;
+  border: 1px solid #d8dce6;
+  border-radius: 3px;
+  width: 90%;
+  border-bottom: 1px solid transparent;
+}
+/deep/.gathering .ws-info-table {
+  border-left: none;
+  border-top: 1px solid #d8dce6;
+}
+/deep/.gathering .driver {
+  padding: 10px;
+}
+/deep/.gathering .el-form-item .el-form-item__label {
+  background: #f5f7fa;
+  text-align: center;
+}
+/deep/.gathering .ws-info-table .el-form-item .el-form-item__content {
+  border-left: 1px solid #d8dce6;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit,
+/deep/.gathering .ws-info-table .el-form-item.bankDeposit1 {
+  border-right: 1px solid transparent;
+}
+/deep/.gathering .ws-info-table .el-form-item.compname {
+  width: 100%;
+}
+.button,
+.button-green,
+.button-yellow {
+  height: 28px;
+  background: #edf1ff;
+  border-radius: 4px;
+  color: #5473e8;
+  font-size: 12px;
+  text-align: center;
+  line-height: 28px;
+  margin: 7px auto;
+  padding: 0 10px;
+}
+.button-green {
+  background: #ecf8f9;
+  color: #50cad4;
+}
+.button-yellow {
+  background: #fff6eb;
+  color: #ff9f24;
+}
+.el-button--primary {
+  background: #5878e8;
+}
+.drivermessage .ws-info-table {
+  border: none;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__label {
+  background: #fff;
+  width: 80px;
+}
+/deep/.drivermessage .ws-info-table .el-form-item__content,
+/deep/.drivermessage .ws-info-table .el-form-item {
+  border: none;
+}
+.small,
+.big {
+  color: #ccc;
+  line-height: 16px;
+  position: absolute;
+  right: -50px;
+  top: 5px;
+  border: 1px solid #ccc;
+  padding: 5px 10px;
+  border-radius: 20px;
+}
+.big {
+  color: #f46060;
+  background: #ffeeee;
+}
 </style>