BST_bigScreen/src/views/ProductionOrderList/Deliverylist/DeliveryDetail.vue

<template>
  <div>
    <FullPage
      :title=" '发货单详情'"
      :list="list"
      @init="init"
      :logList="logList"
      :loading="loading"
      @searchData="init"
      @changePage="changePage"
      @changeSize="changeSize"
      @selectTable="selectTable"
      :tableColums="tableColums"
      :tableData="tableData"
      :pageIndex="pageIndex"
      :total="total"
    >
      <div slot="titleButton">
         <Button
          @click="exportContent"
          type="primary"
        
         
          style="margin-right: 10px"
          >导出</Button
        > 
        <Button
          v-if="$route.query.type == 2"
          @click="handleOrderReturn(selects)"
          type="primary"
          style="margin-right:10px;"
          >批量退回</Button
        >
        <Button @click="back" type="primary" ghost style="margin-right:10px;"
          >返回</Button
        >
        <Button
          v-if="$route.query.type == 2"
          @click="exportData"
          type="warning"
          ghost
          style="margin-right:10px;"
          >待出库清单打印</Button
        >
         <Button
          @click="outShip(selects, 1)"
          type="warning"
          ghost
          style="margin-right:10px;"
          >批量发货完成</Button
        >
        <Button
          @click="outShip(selects, 2)"
          type="success"
          ghost
          style="margin-right:10px;"
          >批量收货完成</Button
        >
      </div>
      <template slot-scope="{ row }" slot="set">
        <!-- <a
          v-if="$route.query.type == 4"
          class="map-margin"
          :disabled="row.order_in_no"
          @click="confirmSuccess(row)"
          >确认入库</a
        >
        <a
          v-if="$route.query.type == 4"
          class="map-margin"
          :disabled="row.in_out_value == 1"
          @click="outStock(row)"
          >出库</a
        >
        <a
          v-if="$route.query.type == 2 && !row.in_out_value"
          class="map-margin"
          @click="outShip(row, 1)"
          >确认出库</a
        >
        <a
          v-if="$route.query.type == 2 && row.transport_no"
          class="map-margin"
          @click="row.sub_state != 3 ? outShip(row, 2) : ''"
          >{{ row.sub_state != 3 ? "运输" : "" }}</a
        > -->
        <a
          class="map-margin"
          @click="outShip([row.orders_procedure_id], 1)"
          v-show="row.in_out_value==0"
          > 发货完成 </a
        ><a
          class="map-margin"
          v-show='row.transportation_value==0&&row.in_out_value==1'
          @click="row.in_out_value == 1?outShip([row.orders_procedure_id], 2):$Message.warning('请先确认发货')"
          >收货完成</a
        >
      </template>
      <Modal
        class-name="vertical-center-modal"
        width="400"
        title="发货指令"
        v-model="showStock"
        @on-ok="confirmOutStock"
      >
        <Form :label-width="100">
          <FormItem label="选择人员">
            <Select clearable v-model="info.user_id">
              <Option
                v-for="item of users"
                :key="item.id"
                :value="item.id"
                :label="item.nickname"
              ></Option>
            </Select>
          </FormItem>
          <FormItem label="出库日期">
            <DatePicker
              :options="options"
              v-model="time"
              clearable
              type="date"
              placeholder="请选择日期"
            ></DatePicker>
          </FormItem>
          <FormItem label="点工单形式">
            <RadioGroup v-model="info.work_type">
              <Radio :label="1">是</Radio>
              <Radio :label="2">否</Radio>
            </RadioGroup>
          </FormItem>
          <FormItem label="日薪" v-if="info.work_type == 1">
            <Input v-model="info.user_salary">
              <span slot="append">元</span>
            </Input>
          </FormItem>
        </Form>
      </Modal>
    </FullPage>
  </div>
</template>

<script>
import { mapActions } from "vuex";
export default {
  data() {
    return {
      list: [
        {
          title: "楼幢",
          name: "Select",
          multiple: true,
          filterable: true,
          serverName: "house",
          placeholder: "请选择楼幢",
          value: "",
          option: [],
        },
        {
          title: "单元",
          name: "Select",
          multiple: true,
          filterable: true,
          serverName: "unit",
          placeholder: "请选择单元",
          value: "",
          option: [{ label: 1, value: 1 }],
        },
        {
          title: "楼层",
          name: "Select",
          multiple: true,
          filterable: true,
          serverName: "layer",
          placeholder: "请选择楼层",
          value: "",
          option: [{ label: 1, value: 1 }],
        },
        {
          title: "房号",
          name: "Select",
          multiple: true,
          filterable: true,
          serverName: "number_detail",
          placeholder: "请选择房号",
          value: "",
          option: [{ label: 1, value: 1 }],
        },
        {
          title: "产品",
          name: "Select",
          filterable: true,
          serverName: "product",
          placeholder: "请选择产品",
          value: "",
          option: [],
        },
        {
          title: "图号",
          name: "Select",
          serverName: "url_number",
          placeholder: "请选择图号",
          value: "",
          multiple:true,
          filterable:true,
          option: [],
        },
        {
          title: "部件",
          name: "Select",
          serverName: "part",
           filterable: true,
          placeholder: "请选择部件",
          value: "",
          option: [],
        },
         {
            title: "发货状态",
            name: "Select",
            serverName: "in_out_value",
            value: "",
            option: [
              { label: "已发货", value: 1 },
              { label: "未发货", value: 0 },
            ],
          },
           {
            title: "收货状态",
            name: "Select",
            serverName: "transportation_value",
            value: "",
            option: [
              { label: "已收货", value: 1 },
              { label: "未收货", value: 0 },
            ],
          }
      ],
      logList: [],
      tableColums: [
        { type: "selection", align: "center", width: "100", fixed: "left" },
        {
          title: "房间号",
          align: "center",
          minWidth: 100,
          key: "number_detail",
          render: (h, params) => {
            const { row } = params;
            return h(
              "span",
              `${row.house}-${row.unit}-${row.layer}-${row.number_detail}`
            );
          },
        },
        {
          title: "产品名称",
          align: "center",
          minWidth: 200,
          key: "product_title",
        },
        { title: "图号", align: "center", minWidth: 200, key: "url_number" },
        { title: "组合名称", align: "center", minWidth: 200, key: "compose_name" },
        { title: "部件", align: "center", minWidth: 200, key: "part_title" },
        {
          title: "零部件",
          align: "center",
          minWidth: 200,
          key: "sub_part_title",
        },
        { title: "单位", align: "center", minWidth: 100, key: "company" },
        {
          title: "发货状态",
          align: "center",
          minWidth: 200,
          key: "",
          render: (h, params) =>
            h(
              "span",
              {},
              params.row.in_out_value == 0
                ? "未发货"
                : '已发货'
            ),
        },
         {
          title: "收货状态",
          align: "center",
          minWidth: 200,
          key: "",
          render: (h, params) =>
            h(
              "span",
              {},
              params.row.transportation_value == 0
                ? "未收货"
                : '已收货'
            ),
        },
        { title: "芯片编号", align: "center", minWidth: 200, key: "tag" },
        {
          title: "操作",
          align: "center",
          width: "150",
          fixed: "right",
          slot: "set",
        },
      ],
      tableData: [],
      pageIndex: 1,
      total: 0,
      pageSize: 10,
      loading: false,
      selectedReturnArr: [],
      selects: [],
      selects_out: [],
      showStock: false,
      info: {
        user_id: "",
        work_type: 2,
        order_in_no: "",
        start_time: "",
        end_time: "",
        user_salary: "",
      },
      users: [],
      time: "",
      shipArray: [],
      options: {
        disabledDate(date) {
          return date && date.valueOf() < Date.now() - 86400000;
        },
      },
    };
  },
  created() {
    this.getOptions();
  },

  methods: {
    async exportContent() {
      const res = await this.axios("/api/transport_export", {
        params: { transport_no:this.$route.query.transport_no },
      });
      if (res.code == 200) {
      
        let url = `${this.$store.state.ip}/api/storage/${res.data.file}`;
        location.href = url;
      }
    },
      outDelivery(row){
         this.info.order_in_no = Array.isArray(row)
        ? row.join(",")
        : row.order_in_no;
      this.showStock = true;
      },
    init(row) {
      this.axios("/api/user").then((res) => (this.users = res.data.data));
      this.pageIndex = 1;
      row.page_index = this.pageIndex;
      row.page_size = this.pageSize;
      if (this.func.isType(row.house) == "Array") {
        row.house = row.house.join(",");
      }
      if (this.func.isType(row.unit) == "Array") {
        row.unit = row.unit.join(",");
      }
      if (this.func.isType(row.layer) == "Array") {
        row.layer = row.layer.join(",");
      }
      if (this.func.isType(row.number_detail) == "Array") {
        row.number_detail = row.number_detail.join(",");
      }
      if (this.func.isType(row.product) == "Array") {
        row.product = row.product.join(",");
      }
      if (this.func.isType(row.part) == "Array") {
        row.part = row.part.join(",");
      }
      Object.assign(row, this.$route.query);
      this.proxyObj = row;
      this.getData(row);
    },
    getOptions() {
      this.axios("/api/orders_list_detail", {
        params: {
          order_no: this.$route.query.order_no,
          type: this.$route.query.type,
          transport_no:this.$route.query.transport_no
        },
      }).then((res) => {
        res.data.house.map((v) => {
          v.value = v.house;
          v.label = v.house;
        });
        res.data.unit.map((v) => {
          v.value = v.unit;
          v.label = v.unit;
        });
        res.data.layer.map((v) => {
          v.value = v.layer;
          v.label = v.layer;
        });
        res.data.number_detail.map((v) => {
          v.value = v.number;
          v.label = v.number;
        });
        res.data.product_title.map((v) => {
          (v.value = v.product_title), (v.label = v.product_title);
        });
        res.data.part_title.map((v) => {
          (v.value = v.part_title), (v.label = v.part_title);
        });
        res.data.url_number.map((v) => {
          (v.value = v.url_number), (v.label = v.url_number);
        });
        this.list[0].option = res.data.house;
        this.list[1].option = res.data.unit;
        this.list[2].option = res.data.layer;
        this.list[3].option = res.data.number_detail;
        this.list[4].option = res.data.product_title;
        this.list[5].option = res.data.url_number;
        this.list[6].option = res.data.part_title;
      });
    },
    getData(row) {
      this.loading = true;
      this.axios("/api/orders_list_detail", { params: row }).then((res) => {
        this.loading = false;
        this.tableData = res.data.data;
        this.logList = res.data.detail;
        this.total = res.data.total || 0;
      });
    },
    changePage(e) {
      this.pageIndex = e;
      this.proxyObj.page_index = e;
      this.getData(this.proxyObj);
    },
    changeSize(e) {
      this.pageSize = e;
      this.proxyObj.page_size = this.pageSize;
      this.getData(this.proxyObj);
    },
    back() {
      this.$router.go(-1);
    },
    handleOrderReturn(row) {
      let params = [];
      if (!this.selectedReturnArr || this.selectedReturnArr.length < 1) {
        return this.$Message.error("请至少选择一项");
      }
      // params = this.selectedReturnArr.map((v) => {
      //   return v.chip;
      // });
      // console.log(this.selectedReturnArr)
      // console.log(row)
      this.$Modal.confirm({
        title: "确认退回？",
        content: "此操作无法恢复，请确认！",
        onOk: () => {
          this.axios({
            method: "post",
            url: "/api/transport_callback",
            data: {
              tag: row,//params
            },
          }).then((res) => {
            if (res.code == 200) {
              this.$Message.success(res.msg);
              this.getData(this.proxyObj);
            }
          });
        },
        onCancel: () => {},
      });
    },
    selectTable(row) {
      this.selectedReturnArr = row;
        this.selects = [];
      row.forEach(v => {
        this.selects.push(v.orders_procedure_id)
      });
      console.log(this.selects)
    },
    confirmSuccess(row) {
      let params = "";
      if (!row || row.length < 1) {
        return this.$Message.error("请至少选择一项");
      }
      params = Array.isArray(row) ? row.join(",") : row.orders_procedure_id;
      this.confirmDelete({
        title: "包装完成",
        content: "是否确认包装完成",
        type: "primary",
        then: () => {
          this.axios
            .post("/api/orders_in", { orders_procedure_id: params })
            .then((res) => {
              if (res.code == 200) {
                this.$Message.success(res.msg);
                this.getData(this.proxyObj);
              }
            });
        },
        cancel: () => {
          this.$Message.warning("您取消了包装完成操作");
        },
      });
    },
    outStock(row) {
      console.log("row :>> ", row);
      if (!row || row.length < 1) {
        return this.$Message.error("您未选择或者未确认包装完成");
      }
      this.info.order_in_no = Array.isArray(row)
        ? row.join(",")
        : row.order_in_no;
      this.showStock = true;
    },
    confirmOutStock() {
      if (this.time) {
        this.info.start_time = new Date(this.time)
          .toLocaleDateString()
          .replace(/\//g, "-");
        this.info.end_time = new Date(this.time)
          .toLocaleDateString()
          .replace(/\//g, "-");
      }

      this.axios.post("/api/orders_out", this.info).then((res) => {
        if (res.code == 200) {
          this.$Message.success(res.msg);
          this.getData(this.proxyObj);
          // setTimeout(()=>this.back(),500)
        }
      });
    },

    outShip(row, type) {
      //type 1出库  2运输
      if (type == 3) {
        this.confirmDelete({
          title: "包装完成",
          content: "是否确认包装完成",
          type: "primary",
          then: () => {
            console.log(row)
            this.axios
              .post("/api/orders_in", { orders_procedure_id: row.orders_procedure_id })
              .then((res) => {
                if (res.code == 200) {
                  this.$Message.success(res.msg);
                  this.getData(this.proxyObj);
                }
              });
          },
          cancel: (e) => {},
        });
      } else {
        if (!row || row.length < 1) {
          return this.$Message.error("请至少选择一项");
        }
        let id = Array.isArray(row) ? row.join(",") : row.id;
        let post_url =
          type == 1 ? "/api/orders_transport" : '/api/orders_transport_confirm';
        let params = {};
        params.id = id;
        this.confirmDelete({
          title: type == 1 ? "发货完成" : "收获完成",
          content: type == 1 ? "是否确认发货完成" : "是否确认收获完成",
          type: "primary",
          then: (e) => {
            this.axios.post(post_url, params).then((res) => {
              if (res.code == 200) {
                this.$Message.success(res.msg);
                this.getData(this.proxyObj);
              }
            });
          },
          cancel: (e) => {},
        });
      }
    },
    async exportData() {
      const res = await this.axios("/api/orders_list_detail", {
        params: { ...this.proxyObj, sub_type: "excel" },
      });
      if (res.code == 200) {
        let url = `${this.$store.state.ip}/api/storage/${res.data.file}`;
        location.href = url;
      }
    },
  },
};
</script>

<style lang="scss" scoped></style>