优化

src/views/produce/components/produceOrder.vue

@@ -1,10 +1,12 @@
 <template>
   <div>
+
+
     <ele-pro-table
       ref="table"
+     :height="internalIsFullscreen ? '400px' : '300px'"
       :columns="columns"
       width="100%"
-      :height="internalIsFullscreen ? '400px' : '300px'"
       :datasource="datasource"
       :selection.sync="selection"
       @selection-change="handleSelectionChange"
@@ -23,20 +25,13 @@
         }}</el-link>
       </template>
 
-
       <template v-slot:formingNum="{ row }">
-          <span >
-            {{ row.formingNum }}  {{ row.unit }}
-          </span>
-        </template>
-
-        <template v-slot:formingWeight="{ row }">
-          <span >
-            {{ row.formingNum }}  {{ row.weightUnit }}
-          </span>
-        </template>
+        <span> {{ row.formingNum }} {{ row.unit }} </span>
+      </template>
 
-        
+      <template v-slot:formingWeight="{ row }">
+        <span> {{ row.formingNum }} {{ row.weightUnit }} </span>
+      </template>
     </ele-pro-table>
 
     <routings
@@ -133,11 +128,9 @@
             prop: 'priority',
             label: '优先级',
             align: 'center',
-            minWidth: 120,
- 
+            minWidth: 120
           },
 
-
           {
             prop: 'formingNum',
             label: '要求生产数量',
@@ -190,14 +183,13 @@
             minWidth: 110
           },
 
-        
           {
             prop: 'createTime',
             label: '创建时间',
             align: 'center',
             showOverflowTooltip: true,
             minWidth: 110
-          },
+          }
         ];
       },
 
@@ -272,6 +264,8 @@
 
 <style lang="scss" scoped>
   .table {
-    height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
+
+    min-height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
+    max-height: 68vh;
   }
 </style>

src/views/produce/index.vue

@@ -18,14 +18,36 @@
         :responsive="false"
         style="height: calc(100vh - 70px - 50px - 80px)"
       >
-        <div class="left_main">
+        <ele-split-layout
+          space="0px"
+          width="50%"
+          :resizable="true"
+          :vertical="true"
+          :min-size="45"
+          :max-size="-45"
+          :left-style="{
+            background: 'rgba(171, 199, 255, .5)',
+            overflow: 'hidden',
+            height: '100%'
+          }"
+          :right-style="{
+            background: 'rgba(125, 226, 252, .4)',
+            overflow: 'hidden',
+            height: '100%'
+          }"
+          :responsive="false"
+          class="left_main"
+        >
           <div class="top">
             <produceOrder @workSelect="workSelect"></produceOrder>
           </div>
-          <div class="bottom">
-            <productionResource></productionResource>
-          </div>
-        </div>
+          <template #content>
+            <div class="bottom">
+              <productionResource></productionResource>
+            </div>
+          </template>
+        </ele-split-layout>
+
         <template v-slot:content>
           <div class="right_main">
             <div v-if="operationType == 'pick'">
@@ -79,7 +101,6 @@
   import jobBooking from './components/jobBooking/index.vue';
   import warehousing from './components/warehousing/index.vue';
 
-
   export default {
     components: {
       Search,
@@ -149,8 +170,6 @@
         }
       },
 
-  
-
       pickingClose(val) {
         if (val) {
           this.$nextTick(() => {
@@ -286,13 +305,13 @@
 
     .top {
       width: 100%;
-      height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
+      min-height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
       overflow: hidden;
     }
 
     .bottom {
       width: 100%;
-      height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
+      min-height: calc((100vh - 70px - 50px - 80px - 20px) / 2);
       overflow: hidden;
     }
   }