前端

src/views/tranManagement/tranManagementTransportAdd.vue

@@ -122,9 +122,9 @@
       >
         <div class="flex">
           <ws-info-table class="el-table">
+            <div class="start-address">
             <el-radio v-model="item.radio" label="1">只有库发货</el-radio>
-              <el-radio v-model="item.radio" label="2">临时库发货</el-radio>
-            <!-- <ws-form-item label="" span="1"> -->
+            <el-radio v-model="item.radio" label="2">临时库发货</el-radio>
             <ws-select
               v-model="deptBudgetList.inOutType"
               placeholder=""
@@ -138,14 +138,14 @@
                 :value="item.constValue"
               />
             </ws-select>
-            
+            </div>
           <!-- </ws-form-item> -->
             <!--始发地-->
-            <ws-form-item label="始发地" span="1">
+            <ws-form-item label="始发地" span="1" class="start-address">
             <ws-select
               v-model="deptBudgetList.inOutType"
               placeholder=""
-              class="typeselect"
+              class="start-address"
               @change="selectstorageType"
             >
               <ws-option
@@ -161,7 +161,7 @@
             label="始发地详细地址"
             span="1"
             prop="startDetailedAddress"
-            class="readonly bg-right"
+            class=" bg-right start-address"
           >
             <ws-input
               v-model="deptBudgetList.driverName"
@@ -170,14 +170,13 @@
               size="small"
             />
           </ws-form-item>
-        
-          <ws-form-item prop="receiveWarehouse" label="" span="10"></ws-form-item>
+
           <!-- 收获库点 -->
             <ws-form-item
             label="收获库点"
             span="1"
             prop="contractNo"
-            class="readonly bg-right"
+            class="start-address"
           >
            <ws-select
               v-model="deptBudgetList.inOutType"
@@ -199,7 +198,7 @@
             label="终到地"
             span="1"
             prop="contractNo"
-            class="readonly bg-right"
+            class="start-address"
           >
             <ws-select
               v-model="deptBudgetList.inOutType"
@@ -220,7 +219,7 @@
             label="终到地详细地址"
             span="1"
             prop="endDetailedAddress"
-            class="readonly bg-right"
+            class="start-address"
           >
             <ws-input
               v-model="deptBudgetList.endDetailedAddress"
@@ -234,22 +233,28 @@
          
       </div>
     </ws-form>
-    <span class="zi">运输方式</span>
-  <el-checkbox-group v-model="checkList" prop="tranType">
-    <el-checkbox label="汽运" ></el-checkbox>
-    <el-checkbox label="火运"></el-checkbox>
-    <el-checkbox label="船运"></el-checkbox>
-  </el-checkbox-group>
+    <div>
+    <span class="check-box">运输方式</span>
+    <el-checkbox-group v-model="checkList" prop="tranType">
+      <el-checkbox label="汽运" ></el-checkbox>
+      <el-checkbox label="火运"></el-checkbox>
+      <el-checkbox label="船运"></el-checkbox>
+    </el-checkbox-group>
+    </div>
   
-    <ws-form
+
+  <ws-form
       ref="deptBudgetList"
       :rules="mainReportAdd"
       :model="deptBudgetList"
     >
-    <div class="small-title">运输阶段1（123456789）</div>
-    <!--运输方式-->
-    <div class="neifor">
-        <ws-info-table>
+      <div
+        style="width: 100%"
+        class="flex position"
+        v-for="(item, index) in freightspace"
+      >
+          <div class="driver">运输阶段-{{ index + 1 }}</div>
+         <ws-info-table>
           <!--运输方式-->
           <ws-form-item label="运输方式" span="1" prop="waterContent">
             <ws-input
@@ -278,8 +283,6 @@
             />
           </ws-form-item>
         </ws-info-table>
-      </div>
-       <div class="nei">
          <ws-info-table>
           <!--发货地区-->
           <ws-form-item label="发货地区" span="1" prop="waterContent">
@@ -325,8 +328,6 @@
             />
           </ws-form-item>
         </ws-info-table>
-      </div>
-      <div class="nei">
          <ws-info-table>
           <!--收货日期-->
           <ws-form-item label="收货地区" span="1" prop="waterContent">
@@ -372,7 +373,23 @@
             />
           </ws-form-item>
         </ws-info-table>
-      </div>
+          <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>
     </ws-form>
     <!-- 提交 -->
     <div style="text-align: right; padding: 10px" class="center">
@@ -607,19 +624,22 @@ export default {
 .position {
   position: relative;
 }
-.add,
 .del {
   position: absolute;
   right: -38px;
   top: 9px;
   cursor: pointer;
 }
-.del {
-  right: -70px;
+.el-checkbox-group {
+    font-size: 0;
+    float: right;
+    margin-top: 20px;
+    margin-right: 1200px;
 }
-.amap-page-container {
-  width: 300px;
-  height: 300px;
+.check-box[data-v-5c5ac25d] {
+    margin-left: 170px;
+    margin-top: 20px;
+    float: left;
 }
 .el-form {
   padding: 0 10%;
@@ -634,9 +654,6 @@ export default {
 .title {
   position: relative;
 }
-.el-car {
-  width: 413px;
-}
 .title::before {
   content: '';
   display: inline-block;
@@ -646,74 +663,85 @@ export default {
   position: absolute;
   left: 0;
 }
-.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;
+//去边框
+/deep/.el-form-item {
+  border-right: 0px;
+  border-bottom: 0px;
 }
-.button-container {
-  display: flex;
-  flex-wrap: nowrap;
-  justify-content: space-between;
-  align-items: center;
-  background-color: #fff;
-  width: 100%;
-  height: 50px;
-  padding: 0 10px;
-  & > div {
-    margin-left: 10px;
-    display: flex;
-    flex-wrap: nowrap;
-    flex-direction: row;
-    & > span {
-      line-height: 50px;
-    }
-  }
-
-  /deep/.auditFlow-box {
-    position: unset;
-    margin-left: 10px;
-    &/deep/.auditFlow-icon {
-      width: auto;
-      padding-right: 30px;
-    }
-    &/deep/.auditFlow-main {
-      position: absolute;
-    }
-  }
-}
-.box-app {
-  display: inline-block;
-  float: left;
-  margin-left: 30px;
-  line-height: 50px;
-}
-/deep/.el-dialog {
-  .el-form-item {
-    margin-bottom: 0 !important;
-    .el-input--medium {
-      textarea {
-        min-height: 100px !important;
-      }
-    }
-  }
+.el-form {
+  margin-top: 50px;
 }
-.collapse-bottom {
-  margin-bottom: 20px;
+.el-form-item.start-address.el-form-item--small {
+    width: 33.3%;
 }
-.input-main .textarea .el-textarea__inner {
-  width: 100%;
-  z-index: 1;
+.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;
+//   justify-content: space-between;
+//   align-items: center;
+//   background-color: #fff;
+//   width: 100%;
+//   height: 50px;
+//   padding: 0 10px;
+//   & > div {
+//     margin-left: 10px;
+//     display: flex;
+//     flex-wrap: nowrap;
+//     flex-direction: row;
+//     & > span {
+//       line-height: 50px;
+//     }
+//   }
+
+//   /deep/.auditFlow-box {
+//     position: unset;
+//     margin-left: 10px;
+//     &/deep/.auditFlow-icon {
+//       width: auto;
+//       padding-right: 30px;
+//     }
+//     &/deep/.auditFlow-main {
+//       position: absolute;
+//     }
+//   }
+// }
+// .box-app {
+//   display: inline-block;
+//   float: left;
+//   margin-left: 30px;
+//   line-height: 50px;
+// }
+// /deep/.el-dialog {
+//   .el-form-item {
+//     margin-bottom: 0 !important;
+//     .el-input--medium {
+//       textarea {
+//         min-height: 100px !important;
+//       }
+//     }
+//   }
+// }
+// .collapse-bottom {
+//   margin-bottom: 20px;
+// }
+// .input-main .textarea .el-textarea__inner {
+//   width: 100%;
+//   z-index: 1;
+// }
 .bg-left {
   padding-left: 30px;
 }
@@ -724,114 +752,119 @@ 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;
-}
-.driver {
-  width: 120px;
-  margin-top: 10px;
-  font-weight: bold;
-}
+.el-radio, .el-radio__input {
+    margin-top: 11px;
+    margin-left: 11px;
+    width: 93px;
+}
+// .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 {
-  height: auto;
-  padding: 0px 2px;
-  /deep/.el-input__inner {
-    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;
-}
+// // 控制select为只读的时候显示样式
+// /deep/.ws-class-table-col {
+//   height: auto;
+//   padding: 0px 2px;
+//   /deep/.el-input__inner {
+//     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%;
-}
-.el-textarea__inner {
-  display: none;
-}
-.el-form {
-  margin-top: 50px;
-}
-.readonly {
-  width: 16%;
-}
-.el-cascader {
-  width: 145px;
-}
-.forlist {
-  width: 20%;
-}
-.el-form-item.forlist.is-success.el-form-item--small {
-  width: 20%;
-}
-.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%;
-}
-.zi{
+// .el-textarea__inner {
+//   display: none;
+// }
+// .el-form {
+//   margin-top: 50px;
+// }
+// .readonly {
+//   width: 16%;
+// }
+// .el-cascader {
+//   width: 145px;
+// }
+// .forlist {
+//   width: 20%;
+// }
+// .el-form-item.forlist.is-success.el-form-item--small {
+//   width: 20%;
+// }
+// .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%;
+// }
+.check-box{
    margin-left: 170px;
 }
-.el-checkbox-group{
-  margin-left: 240px;
-    margin-top: -17px;
-}
-/deep/.neifor {
-  .ws-info-table {
-    border: none;
-  }
-  .el-form-item {
-    // width: 33.3333%;
-    border: none;
-    .el-form-item__label {
-      background: transparent;
-      border: none;
-    }
-    .el-form-item__content {
-      border: none;
-    }
-  }
-}
+// .el-checkbox-group{
+//   margin-left: 240px;
+//     margin-top: -17px;
+// }
+// /deep/.neifor {
+//   .ws-info-table {
+//     border: none;
+//   }
+//   .el-form-item {
+//     // width: 33.3333%;
+//     border: none;
+//     .el-form-item__label {
+//       background: transparent;
+//       border: none;
+//     }
+//     .el-form-item__content {
+//       border: none;
+//     }
+//   }
+// }
 /deep/.nei {
   .ws-info-table {
     border: none;
   }
   .el-form-item {
-    // width: 33.3333%;
+    width: 33.3333%;
     border: none;
     .el-form-item__label {
       background: transparent;
@@ -842,17 +875,17 @@ export default {
     }
   }
 }
-.ws-info-table .el-form-item .el-form-item__label {
-    width: min-content;
-}
-.el-select>.el-input {
-    display: block;
-    width: 190px;
-}
-.ws-info-table .el-form-item {
-    width: 20%;
-    border: none;
-    background: transparent;
-}
+// .ws-info-table .el-form-item .el-form-item__label {
+//     width: min-content;
+// }
+// .el-select>.el-input {
+//     display: block;
+//     width: 190px;
+// }
+// .ws-info-table .el-form-item {
+//     width: 20%;
+//     border: none;
+//     background: transparent;
+// }
 
 </style>

src/views/warehouse/warehouseManagementLook.vue

@@ -101,7 +101,7 @@
               {{ item.maxStorage }}
             </ws-form-item>
             <!--现有储量-->
-            <ws-form-item :label="wwss" span="1" prop="detailStorage" >
+            <ws-form-item :label='"现有储量("+item.nowStorage+"吨)"' span="1" prop="detailStorage" >
               {{ item.detailStorage }}
             </ws-form-item>
             <!--备注（选填）-->