排产方案对比

assets/css/base.less

@@ -12,6 +12,9 @@ html body {
 #__layout {
     height: 100%
 }
+ul,li{
+    list-style: none;
+}
 /*flex*/
 .flex{
     display: flex;

pages/aps/results/compare.vue

@@ -5,11 +5,52 @@
           <!-- <Button type="primary">导出</Button>000 -->
         <Button type="primary" icon="ios-redo" @click="comeBlck">返回</Button>
     </div>
-    <div class="compare_box">
+    <div class="compare_box" :style="{height:treeHeight+'px'}">
         <div class="left_list">
-
+          <ul class="left_ul">
+            <li class="left_ul_title">
+              隐藏相同
+              <i-switch size="small" v-model="switch1" @on-change="change" />
+            </li>
+            <li>延期交付批次数</li>
+            <li>延期交付天数</li>
+            <li>提前交付批次数</li>
+            <li>提前交付天数</li>
+            <li>周日加班设备数</li>
+            <li>周日设备工作小时数</li>
+            <li>周六加班设备数</li>
+            <li>周六设备工作小时数</li>
+            <li>重叠法工序数</li>
+            <li>离散法工序数</li>
+            <li>离散值平均值</li>
+            <li>任务平衡工序数</li>
+            <li>效率系数</li>
+          </ul>
+        </div>
+        <div class="right_add">
+          <ul class="right_ul">
+            <li class="right_ul_title">
+              <a class="del_case">
+                <Icon type="md-close" size="16" @click="delitedCase" title="删除" />
+              </a>
+              <span class="case">方案一</span>
+              <span class="case_time">2020-03-22   13:26:35</span>
+            </li>
+            <li>延期交付批次数</li>
+            <li>延期交付天数</li>
+            <li>提前交付批次数</li>
+            <li>提前交付天数</li>
+            <li>周日加班设备数</li>
+            <li>周日设备工作小时数</li>
+            <li>周六加班设备数</li>
+            <li>周六设备工作小时数</li>
+            <li>重叠法工序数</li>
+            <li>离散法工序数</li>
+            <li>离散值平均值</li>
+            <li>任务平衡工序数</li>
+            <li>效率系数</li>
+          </ul>
         </div>
-        <div class="right_add"></div>
     </div>
 </div>
 </template>
@@ -20,15 +61,27 @@ export default {
     return {
       code: '2',
       name: '添加',
-      tree: []
+      tree: [],
+      switch1: true,
+      treeHeight: "",
     }
   },
   async fetch({ store, params }) {
     await store.dispatch('loadDictionary') // 加载数据字典
   },
   components: {},
-  created() {},
-  mounted() {},
+  created() {
+    this.treeHeight = window.innerHeight - 170
+  },
+  mounted() {
+    window.onresize = () => {
+      ///浏览器窗口大小变化
+      return (() => {
+        window.screenHeight = window.innerHeight
+        this.treeHeight = window.screenHeight - 170
+      })();
+    }
+  },
   methods: {
     // 下发
     parameter() {
@@ -47,6 +100,13 @@ export default {
     comeBlck() {
       this.$router.push({ path: "/aps/aps" });
     },
+    change(status){
+      this.$Message.info('开关状态：' + status);
+    },
+    // 删除方案
+    delitedCase(){
+      this.$Message.info('删除方案');
+    },
     tabChange(name) {
      
      if(name=='technicalcoordination')
@@ -63,5 +123,3 @@ if(name=='unqualifiedorder')
   }
 }
 </script>
-<style lang="less">
-</style>

pages/aps/results/results.less

@@ -60,6 +60,51 @@
 .compare{
     .compare_box{
         border: 1px solid #ccc;
-        height: 200px;
+        .left_list{
+          float: left;
+          width: 200px;
+          height: 100%;
+          border-right: 1px solid #ccc;
+          .left_ul{
+            .left_ul_title{
+              height: 80px;
+            }
+            li{
+              line-height: 50px;
+              text-align: center;
+              border-bottom: 1px solid #ccc;
+            }
+          }
+        }
+        .right_add{
+          float: left;
+          width: 200px;
+          height: 100%;
+          border-right: 1px solid #ccc;
+          .right_ul{
+            .right_ul_title{
+              position: relative;
+              height: 80px;
+              .del_case{
+                position: absolute;
+                top: -8px;
+                right: 8px;
+              }
+              .case{
+                color: #2680EB;
+              }
+              span{
+                display: block;
+                height: 38px;
+                line-height: 37px;
+              }
+            }
+            li{
+              line-height: 50px;
+              text-align: center;
+              border-bottom: 1px solid #ccc;
+            }
+          }
+        }
     }
 }
\ No newline at end of file