站位计划维护列表开发

applications/dee-mes/src/views/assemblyPlanManagement/stationPlanMaintenance/index.vue

@@ -2,7 +2,27 @@
   <div class="show-page-com stationPlan-maintenance-page">
     <dee-tab :tabs="tabItems" :show-swipe="false" :is-detail="false">
       <div slot="0" style="height:100%;box-sizing:border-box">
-        列表
+        <split-pane
+          :min-percent="18"
+          :default-percent="80"
+          split="vertical"
+          class="detail-pane"
+        >
+          <template slot="paneL">
+            <div class="three-member-wrap">
+              <dee-as-com
+                :key="layConfig.typeName"
+                :lay-config="layConfig"
+                @row-click="rowClick"
+              />
+            </div>
+          </template>
+          <template slot="paneR">
+            <div class="resourceTable-wrap">
+              <missingParts />
+            </div>
+          </template>
+        </split-pane>
       </div>
       <div slot="1" style="height:100%;box-sizing:border-box">
         <searchBar :state-options="stateOptions" @showStation="showStation" @search="search" />
@@ -17,16 +37,18 @@
 import searchBar from './searchBar.vue'
 import station from './station.vue'
 import gantt from './gantt.vue'
+import missingParts from './missingParts'
 export default {
   name: 'StationPlanMaintenance',
-  components: { searchBar, station, gantt },
+  components: { searchBar, station, gantt, missingParts },
   data() {
     return {
       sortiesId: '',
       positionNumber: '',
       form: {},
       stateOptions: [],
-      headerShow: true
+      headerShow: true,
+      basicData: {}
     }
   },
   computed: {
@@ -41,6 +63,12 @@ export default {
           id: '1'
         }
       ]
+    },
+    layConfig() {
+      return {
+        typeName: 'JoExecutePlan',
+        layKey: 'stationPlanList'
+      }
     }
   },
   mounted() {
@@ -48,6 +76,9 @@ export default {
   },
 
   methods: {
+    rowClick(data) {
+      this.$emit('rowClick', data.row)
+    },
     getStateOptions() {
       this.$utils.getDicListByCode('PlanState').then(res => {
         this.stateOptions = res
@@ -77,6 +108,36 @@ export default {
     height: calc(100% - 20px);
     width: calc(100% - 24px);
     background-color: #fff;
+    .detail-pane {
+      width: 100%;
+      height: calc(100% - 6px);
+    }
+    // .splitter-pane{
+    //   height: calc(100% - 6px);
+    // }
+    .splitter-pane-resizer.vertical {
+      opacity: 1;
+      background-color: #F1F4F5;
+      width: 6px;
+      border-left: 0;
+      border-right: 0;
+    }
+    .three-member-wrap{
+      height: 100%;
+      overflow: auto;
+      .dee-form2{
+        margin-top:6px;
+        .el-form-item{
+          margin-bottom: 0!important;
+        }
+      }
+    }
+    .resourceTable-wrap {
+      height: 100%;
+      overflow: auto;
+      padding: 0 10px;
+      box-sizing: border-box;
+    }
     .dee-panel{
       height: 100%;
     }

applications/dee-mes/src/views/assemblyPlanManagement/stationPlanMaintenance/missingParts.vue

+
+<template>
+  <div class="missing-parts">
+    <div class="search-box">
+      <div class="title">生产准备符合项</div>
+      <div class="num">127/72</div>
+    </div>
+    <div class="">
+      <h4>缺件信息列表</h4>
+      <el-table
+        :data="standData"
+        border
+        size="mini"
+        align="center"
+      >
+        <el-table-column
+          prop="serialNumber"
+          label="物料名称"
+          width="60"
+          align="center"
+        />
+        <el-table-column
+          prop="serialNumber"
+          label="需求数"
+          min-width="50"
+          align="center"
+        />
+        <el-table-column
+          prop="serialNumber"
+          label="库存可用数"
+          min-width="50"
+          align="center"
+        />
+        <el-table-column
+          prop="serialNumber"
+          label="库存占用数量"
+          width="60"
+          align="center"
+        />
+        <el-table-column
+          prop="serialNumber"
+          label="缺件数"
+          min-width="50"
+          align="center"
+        />
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { post } from '@/utils/http'
+export default {
+  name: 'MissingParts',
+  data() {
+    return {
+      standData: [{
+        serialNumber: 1
+      }]
+    }
+  },
+  created() {
+  },
+  mounted() {
+
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="scss" scope>
+.missing-parts{
+ height: 100%;
+ padding: 4px;
+ box-sizing: border-box;
+//  display: flex;
+//  flex-flow: column;
+//  justify-content: space-around;
+ .search-box{
+  border: 1px solid #d8d8d8;
+  border-radius:8px ;
+  padding: 8px;
+  font-size:14px;
+  // .title{
+  //   margin: 4px;
+  // }
+  .num {
+    text-align: center;
+    font-size:20px;
+    margin: 10px 0;
+  }
+ }
+}
+</style>