开单页面初始化

ghs/src/components/module/item-list-layer.vue

@@ -104,7 +104,7 @@ export default {
   },
   data () {
     return {
-      selDialog: this.show,
+      selDialog: false,
       ruleForm: {},
       checkList: [],
       list: [],
@@ -115,6 +115,7 @@ export default {
   },
   watch: {
     show () {
+      console.log(this.show)
       this.selDialog = this.show;
     }
   },

ghs/src/views/order/add.vue

@@ -1,5 +1,89 @@
 <template>
   <div class="app-list-content">
+    <div class="left_box">
+      <p class="tor">全屏：F11 结账：F9 改价：F8 整单折扣：F7 数量加：+ 数量减：- 删除：Delete 删除所有：Page Down 聚焦至商品输入框：Ctrl + q </p>
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        border
+        :header-cell-style="{background:'#fdfdfd', color: '#666', fontWeight: 400}"
+        class="tableBox"
+      >
+        <el-table-column
+          label="编号"
+          width="120"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="名称"
+          width="180"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="等级"
+          width="180"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="单位"
+          width="120"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="数量"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="单价"
+          align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="address"
+          label="金额"
+          align="center"
+        >
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="right_box">
+      111
+    </div>
+    <div class="bottom_input">
+      <el-form
+        ref="form"
+        label-width="80px"
+        style="display: inline-block"
+      >
+        <el-form-item label="活动名称">
+          <el-input style="width: 200px"></el-input>
+        </el-form-item>
+      </el-form>
+      <div
+        style="display: inline-block;"
+        class="allPrice"
+      >总金额: 123</div>
+      <div
+        style="display: inline-block;"
+        class="allPrice"
+      >总数量: 123</div>
+      <div
+        style="display: inline-block;"
+        class="allPrice"
+      >
+        <el-checkbox v-model="checked"></el-checkbox>结账后自动打印2份
+      </div>
+    </div>
   </div>
 </template>
 
@@ -8,6 +92,7 @@ export default {
   name: 'order-add',
   data () {
     return {
+      tableData: []
     };
   },
   created () {
@@ -16,6 +101,63 @@ export default {
   }
 };
 </script>
-
+<style lang="scss">
+.tableBox {
+  th {
+    padding: 0 !important;
+    height: 40px;
+    line-height: 40px;
+  }
+  td {
+    padding: 0 !important;
+    height: 45px;
+    line-height: 45px;
+  }
+}
+.bottom_input {
+  .el-form-item {
+    margin-bottom: 0;
+  }
+}
+</style>
 <style lang="scss" scoped>
+.app-list-content {
+  position: relative;
+  .right_box {
+    float: right;
+    width: 20%;
+    // margin-top: 40px;
+    // background: #ffffff;
+    // border: 1px solid #ebeef5;
+    box-sizing: border-box;
+    vertical-align: top;
+    margin-left: -1px;
+  }
+  .left_box {
+    float: left;
+    width: 80%;
+    vertical-align: top;
+    .tor {
+      line-height: 40px;
+      color: #999;
+      padding-left: 10px;
+      font-size: 16px;
+    }
+  }
+  .bottom_input {
+    // height: 100px;
+    // width: 600px;
+    background: pink;
+    position: absolute;
+    bottom: 10px;
+    right: 20%;
+    // transform: translateX(-50%);
+    .allPrice {
+      margin-left: 20px;
+      // color: #606266;
+      font-size: 16px;
+      font-weight: 700;
+    }
+  }
+}
 </style>