配套单

pages/aps/supprotMain/index.vue

@@ -52,6 +52,7 @@ export default {
           title: this.l("finishDate"),
           align: "center",
           type: "date",
+          width:200,
         },
         {
           key: "orderCode",
@@ -64,10 +65,30 @@ export default {
           title: this.l("creationTime"),
           align: "center",
           type: "date",
+          width:200,
         },
         { key: "creator", title: this.l("creator"), align: "left" },
-        { key: "status", title: this.l("status"), align: "center" },
-        { key: "status1", title: this.l("status1"), align: "center" },
+        {
+          key: "status",
+          title: this.l("status"),
+          align: "center",
+          width:150,
+          render: (h, params) => {
+            return h(
+              "op",
+              {
+                attrs: {
+                  oprate: "detail",
+                },
+                style: {
+                  color: this.setName(this.statuList,params.row.status).color,
+                },
+              },
+              this.setName(this.statuList,params.row.status).name
+            );
+          },
+        },
+        { key: "status1", title: this.l("status1"), align: "center",width:150, },
         {
           title: "操作",
           key: "action",
@@ -123,6 +144,7 @@ export default {
     getOutBound(row) {
       this.curId = row.id;
       this.title = "出库单";
+      this.entity = row;
       this.detail = () => import("./outbound");
       this.modal = true;
     },

pages/aps/supprotMain/outbound.vue

 <template>
-    <div>444444</div>
-</template>
\ No newline at end of file
+  <div class="h100">
+    <p class="mb10">
+      申请单号：{{row.code}}
+      <span class="ml20">齐套日期：{{row.finishDate.substring(0,10)}}</span>
+      <span class="ml50">申请人：{{row.creator}}</span>
+      <span class="ml20">申请时间：{{row.creationTime}}</span>
+      <span class="ml20">
+        状态：
+        <state code="outstore.status" :value="row.status+''" type="text"></state>
+      </span>
+      <Button
+        type="primary"
+        shape="circle"
+        :icon="iconLabel"
+        class="fr"
+        size="small"
+        @click="openMore"
+      >{{butTxt}}</Button>
+    </p>
+    <Table
+      :columns="cols"
+      :data="datas"
+      class="tableCommon"
+      ref="gridTable"
+      border
+      highlight-row
+      @on-current-change="curChange"
+      :height="tableHeight1"
+    ></Table>
+
+    <div class="mt20 mb50">
+      <Table
+        :columns="colsList"
+        :data="dataList"
+        class="tableCommon"
+        ref="gridTable1"
+        border
+        @on-selection-change="selectChange"
+      ></Table>
+    </div>
+    <div>
+      <FooterToolbar v-show="footerToolbar" class="ftball">
+        <!--<div class="tip">已选{{selectItems.length}}项</div>-->
+        <Button type="primary" class="mr10 ml10" @click="application(1,null)">批量撤回</Button>
+        <Button @click="cancelBatch">取消</Button>
+      </FooterToolbar>
+    </div>
+  </div>
+</template>
+<script>
+import Api from "./api";
+export default {
+  name: "Edit",
+  data() {
+    return {
+      disabled: false,
+      entity: {},
+      statuList: this.$store.getters.dictionaryByKey("accessory.status") || [],
+      statuList1: this.$store.getters.dictionaryByKey("outstore.status") || [],
+      cols: [
+        {
+          key: "materialName",
+          title: this.l("materialName"),
+          align: "left",
+        },
+        {
+          key: "materialNumber",
+          title: this.l("materialNumber"),
+          align: "left",
+        },
+        {
+          key: "count",
+          title: this.l("count1"),
+          align: "right",
+          width: 150,
+        },
+        {
+          key: "outCount",
+          title: "出库数",
+          align: "right",
+          width: 150,
+        },
+        {
+          key: "status",
+          title: "状态",
+          align: "center",
+          width: 150,
+          render: (h, params) => {
+            return h(
+              "op",
+              {
+                attrs: {
+                  oprate: "detail",
+                },
+                style: {
+                  color: this.setName(this.statuList1, params.row.status).color,
+                },
+              },
+              this.setName(this.statuList1, params.row.status).name
+            );
+          },
+        },
+        {
+          key: "remark",
+          title: this.l("remark"),
+          align: "left",
+        },
+      ],
+      datas: [],
+      splitHeight: "",
+      tempOut: [],
+      colsList: [
+        {
+          type: "selection",
+          width: 70,
+          align: "center",
+        },
+        {
+          key: "materialName",
+          title: this.l2("materialName"),
+          align: "left",
+        },
+        {
+          key: "materialNumber",
+          title: this.l2("materialNumber"),
+          align: "left",
+        },
+
+        {
+          key: "storeTitle",
+          title: this.l2("storeTitle"),
+          align: "left",
+        },
+        {
+          key: "creationTime",
+          title: this.l2("creationTime"),
+          align: "center",
+          width: 220,
+        },
+        {
+          key: "creatorUserId",
+          title: this.l2("creatorUserId"),
+          render: (h, params) => {
+            if (params.row.creatorUserId) {
+              return h("User", {
+                props: {
+                  value: params.row.creatorUserId,
+                },
+              });
+            }
+          },
+        },
+        {
+          key: "count",
+          title: this.l2("count"),
+          align: "right",
+          width: 150,
+        },
+        {
+          key: "action",
+          title: "操作",
+          align: "center",
+          width: "120",
+          render: (h, params) => {
+            return h(
+              "op",
+              {
+                attrs: {
+                  oprate: "edit",
+                },
+                on: {
+                  click: () => this.application(2, params.row),
+                },
+              },
+              "撤回"
+            );
+          },
+        },
+      ],
+      dataList: [],
+      footerToolbar: false,
+      tableHeight1: "96",
+      butTxt: "更多",
+      iconLabel: "md-arrow-dropdown",
+      tempList: [],
+      tempID: null,
+    };
+  },
+  props: {
+    eid: Number,
+    row: Object,
+  },
+  mounted() {
+    //this.splitHeight = window.innerHeight - 150;
+    //this.tableHeight1 = "120";
+    window.onresize = () => {
+      ///浏览器窗口大小变化
+      return (() => {
+        window.screenHeight = window.innerHeight;
+        //this.splitHeight = window.screenHeight - 150;
+        //this.tableHeight1 = this.splitHeight * this.split;
+      })();
+    };
+    if (this.eid > 0) {
+      this.load(this.eid);
+    }
+  },
+  methods: {
+    load(v) {
+      Api.getitemlist({ id: v }).then((r) => {
+        if (r.success) {
+          //----测试多条数据start----
+          //   let temData = [];
+          //   for (let i = 0; i < 10; i++) {
+          //     temData = temData.concat(r.result.children);
+          //   }
+          //this.datas = temData;
+          //----测试多条数据end----
+          //this.datas = r.result.children;
+          this.tempList = r.result.children;
+          this.datas = this.tempList.slice(0, 1);
+          let parm = { orderId: r.result.orderId };
+          Api.listbysupportitem(parm).then((res) => {
+            if (res.success) {
+              this.dataList = res.result;
+            }
+          });
+        }
+      });
+    },
+    //状态名称过滤
+    setName(list, v) {
+      let outPar = {
+        name: "",
+        color: "",
+      };
+      if ((v + "").indexOf(",") == -1) {
+        var item;
+        list.map((u) => {
+          if (u.code == v) {
+            item = u;
+          }
+        });
+        if (item) {
+          //this.items = item;
+          outPar = {
+            name: item.name,
+            color: item.color,
+          };
+        }
+      }
+      return outPar;
+    },
+    curChange(curRow, oldRow) {
+      //当前物料过滤
+      //点击物料行
+     this.getList(curRow.id)
+    },
+    getList(id) {
+      let parm = { supportItemId: id };
+      Api.listbysupportitem(parm).then((res) => {
+        if (res.success) {
+          this.dataList = res.result;
+        }
+      });
+       this.footerToolbar = false;
+    },
+    openMore() {
+      //展开收起按钮
+      if (this.butTxt == "更多") {
+        //for (var i = 0; i < 3; i++) {
+        // this.datas = this.datas.concat(this.datas);
+        // }
+        this.datas = this.tempList;
+        if (this.datas.length > 4) {
+          this.tableHeight1 = "240";
+        } else {
+          this.tableHeight1 = "";
+        }
+        this.butTxt = "收起";
+        this.iconLabel = "md-arrow-dropup";
+      } else {
+        this.tableHeight1 = "96";
+        this.butTxt = "更多";
+        this.iconLabel = "md-arrow-dropdown";
+        this.datas = this.tempList.slice(0, 1);
+      }
+    },
+    selectChange(selections) {
+      this.tempOut = selections;
+      //复选框选择
+      if (selections.length > 0) {
+        this.footerToolbar = true;
+      } else {
+        this.footerToolbar = false;
+      }
+    },
+    cancelBatch() {
+      this.footerToolbar = false;
+      this.$refs["gridTable1"].selectAll(false);
+    },
+    application(type, row) {
+      //撤销出库(批量type 1 ，单挑type 2)
+      if (type == 1) {
+        alert(JSON.stringify(this.tempOut));
+      } else {
+        alert(JSON.stringify(this.row));
+      }
+      this.load(this.eid);
+    },
+    l(key) {
+      key = "support_main" + "." + key;
+      return this.$t(key);
+    },
+    l1(key) {
+      key = "stock" + "." + key;
+      return this.$t(key);
+    },
+    l2(key) {
+      key = "support_item" + "." + key;
+      return this.$t(key);
+    },
+  },
+  watch: {
+    eid(v) {
+      if (v != 0) {
+        this.load(v);
+      }
+    },
+  },
+};
+</script>
+<style scoped>
+.ftball {
+  background: rgba(0, 0, 0, 0.7);
+  color: #fff;
+}
+</style>
\ No newline at end of file