<template>
  <div>
    <el-card>
      <el-button-group style="display: flex">
        <el-button type="primary" @click.native="submitUpload()" style="margin: 0 60px 10px auto; height: 35px"
                   :loading="loading">提交
        </el-button>
      </el-button-group>
      <el-form :model="filterQuery" class="query-form" size="mini" label-width="120px" v-show="showSearch">
        <el-row>
          <el-col :span="8">
            <el-form-item label="唯一编码:">
              <el-input v-model="filterQuery.destinyNo" :disabled="true" placeholder="请输入唯一编码"
                        clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="单据号:">
              <el-input v-model="filterQuery.billNo" :disabled="true" placeholder="请输入单据号" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="单据时间:">
              <el-input v-model="filterQuery.billDate" :disabled="true" placeholder="请输入单据时间"
                        clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="当前仓库:">
              <el-select v-model="filterQuery.invCode" placeholder="当前仓库" filterable style="width: 100%" clearable>
                <el-option
                    v-for="item in invList"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code">
                  <span style="float: left">{{ item.name }}</span>
                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.warehouseName }}</span>
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="备注:">
              <el-input v-model="filterQuery.remark" placeholder="请输入当前仓库" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="18">
            <el-form-item class="query-form-item" label="扫码录入:">
              <el-input
                  id="inputer"
                  @focus="getInputFocus($event)"
                  @keypress.enter.native="addCode($event)"
                  ref='inputRef'
                  style="ime-mode:disabled"
                  type="tel"
                  v-model="filterQuery.code"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="2">
            <el-button
                type="primary"
                size="mini"
                @click.native.stop="addCode()"
                style="margin-left: 15px"
            >添加
            </el-button>
          </el-col>
        </el-row>
      </el-form>

      <div class="top-right-btn">
        <el-button-group style="display:flex;">
          <el-button type="primary" icon="el-icon-plus" @click="addDestiny">选入定数包</el-button>
        </el-button-group>
      </div>
      <el-divider style="margin: 15px"></el-divider>


      <el-tabs type="border-card" style="margin-top: 50px">
        <el-tab-pane label="定数包详情">
          <destiny-process-delect
              :billNo="this.filterQuery.billNo"
              :destinyProcessCodeShow="destinyProcessDelectShow"
              v-if="destinyProcessDelectShow"
          ></destiny-process-delect>
        </el-tab-pane>
        <el-tab-pane label="扫码详情">
          <destiny-process-code
              :billNo="this.filterQuery.billNo"
              :destinyProcessCodeShow="destinyProcessCodeShow"
              v-if="destinyProcessCodeShow"
          ></destiny-process-code>
        </el-tab-pane>
      </el-tabs>
    </el-card>
    <el-dialog
        title="选入定数包"
        :visible.sync="orderMutiVisible"
        :before-close="close"
        width="60%"
        append-to-body
        v-if="orderMutiVisible"
        @close='closeDialog'
        :close-on-click-modal="false"
        :close-on-press-escape="false"
    >
      <destinyModel
          :closeDialog="closeDialog"
      ></destinyModel>
    </el-dialog>

  </div>
</template>


<script>
import destinyModel from "@/views/basic/destiny/destinyModel";
import {delectMuti, detailMuti, filterList, selectMutiDetailList, selectMutiList} from "@/api/inout/orderMuti";
import {parseTime} from "@/utils/coTools";
import destinyProcessCode from "@/views/basic/destiny/destinyProcessCode";
import destinyProcessDelect from "@/views/basic/destiny/destinyProcessDelect";
import {findInvByUser} from "@/api/system/invSubWarehouse";
import {addDestinyDelect, checkDestinyProcess} from "@/api/inout/ioDestinyProcess";
import {addDestinyProcess} from "@/api/basic/basicDestinyRel";
import {delCorps} from "@/api/thrsys/thrCorps";


export default {
  name: "ioOrderMuti",
  props: {
    editQuery: {
      type: Object,
      required: true
    },
    closeDialogpr: {
      type: Function,
      required: true,
    }
  },
  data() {
    return {
      showSearch: true,
      filterQuery: {
        destinyNo: '',
        billNo: null,
        billDate: null,
        invCode: null,
        remark: null,
        code: null,
        status: 0,
        page: 1,
        limit: 10,
      },
      inputQuery: {
        curInv: null,
        fromCorp: "",
        targetAction: null,
        remark: null,
        updateTime: null,
      },
      total: 0,
      loading: false,
      list: [],
      formName: 1,
      destinyProcessCodeShow: false,
      destinyProcessDelectShow: false,
      formMap: {
        1: "新增使用出库",
        2: "编辑使用出库",
      },
      statusMap: {
        0: "草稿",
        1: "未审核",
      },
      invList: [],
      orderMutiVisible: false,
      destinyId: null,
      actDateRange: [],
      detailList: [],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
    };
  },
  methods: {
    statusFilterType(status) {
      const statusMap = {
        0: "warning",
        1: "warning",
        2: "danger",
        3: "success",
      };
      return statusMap[status];
    },
    onReset() {
      this.filterQuery = {
        udiCode: null,
        orderIdFk: null,
        relIdFk: null,
        mark: null,
        status: 0,
        cpmctymc: null,
        page: 1,
        limit: 10,
      }
      this.actDateRange = []
      this.getList();
      this.detailList = []
    },
    onSubmit() {
      this.filterQuery.page = 1;
      this.getList();
    },
    handleCurrentChange(val) {
      this.filterQuery.page = val.page;
      this.getList();
    },
    closeDialog(row) {
      this.destinyId = row;
      var query = {
        destinyNo: this.filterQuery.destinyNo,
        billNo: this.filterQuery.billNo,
        billDate: this.filterQuery.billDate,
        invCode: this.filterQuery.invCode,
        remark: this.filterQuery.remark,
        destinyId: this.destinyId,
      }
      addDestinyDelect(query).then((response) => {
        if (response.code == 20000) {
          this.orderMutiVisible = false;
          this.destinyProcessDelectShow = false;
          this.destinyProcessCodeShow = false;
          this.$nextTick(() => {
            this.destinyProcessCodeShow = true;
            this.destinyProcessDelectShow = true;
          });
        } else {
          this.$message.error(response.message);
        }
      }).catch(() => {
        this.$message.error(response.message);
      });

    },
    hideSearch() {
      this.showSearch = !this.showSearch;
    },
    getInputFocus(event) {
      event.currentTarget.select();
    },
    addDestiny() {
      if (this.filterQuery.invCode == null) {
        this.$message.error("请先选择当前仓库！");
        return
      }
      if (this.destinyProcessCodeShow == true) {
        this.$confirm("此操作将永久删除扫码信息, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          this.orderMutiVisible = true;
        })
      }else{
        this.orderMutiVisible = true;
      }
    },
    editDialog(row) {
      this.formName = 2;
      this.inputQuery = row;
      this.orderMutiVisible = true;
    }
    ,
    getList() {
      if (this.actDateRange != null) {
        this.filterQuery.startDate = this.actDateRange[0];
        this.filterQuery.endDate = this.actDateRange[1];
      } else {
        this.filterQuery.startDate = null;
        this.filterQuery.endDate = null;
      }
      this.loading = true;
      selectMutiList(this.filterQuery)
          .then((response) => {
            this.loading = false;
            this.list = response.data.list || [];
            this.total = response.data.total || 0;
            this.detailList = []
          })
          .catch(() => {
            this.loading = false;
            this.list = [];
            this.total = 0;
          });
    }
    ,
    deleteDialog(row) {
      delectMuti(row)
          .then((response) => {
            if (response.code == 20000) {
              this.getList()
            } else {
              this.$message.error(response.message);
            }
          })
          .catch(() => {
            this.$message.error(response.message);
          });
    }
    ,
    handleDetail(row) {
      selectMutiDetailList({mutiIdFk: row.id}).then((response) => {
        if (response.code == 20000) {
          this.detailList = response.data || [];
          this.inputQuery.useCount = this.detailList.length
        }
      })
    }
    ,
    addCode() {
      if (this.filterQuery.invCode == null) {
        this.$message.error("请先选择当前仓库！");
        return
      }
      if (this.filterQuery.code == null) {
        this.$message.error("请先扫码！");
        return
      }
      var query = {
        code: this.filterQuery.code,
        billNo: this.filterQuery.billNo
      }
      checkDestinyProcess(query).then((response) => {
        if (response.code == 20000) {
          this.destinyProcessDelectShow = false;
          this.destinyProcessCodeShow = false;
          this.$nextTick(() => {
            this.destinyProcessCodeShow = true;
            this.destinyProcessDelectShow = true;
          });
        } else {
          this.$message.error(response.message);
        }
      }).catch(() => {
        this.$message.error(response.message);
      });
    }
    ,
    submitUpload() {
      var query = {
        billNo: this.filterQuery.billNo
      }
      addDestinyProcess(query).then((response) => {
        if (response.code == 20000) {
          this.closeDialogpr()
        } else {
          this.$message.error(response.message);
        }
      })
          .catch(() => {
            this.$message.error(response.message);
          });
    }
    ,
    generateUUID() {
      // 获取时间戳
      let date = (new Date()).valueOf();
      // 生成的随机机器码
      let txt = '1234567890';
      // 机器码有多少位
      let len = 13;
      // 定义空变量用来接收机器码
      let pwd = '';
      for (let i = 0; i < len; i++) {
        // 循环机器码位数随机填充
        pwd += txt.charAt(Math.floor(Math.random() * txt.length));
      }
      // 相加生成唯一ID
      return date + pwd;
    }
    ,
    //获取当前仓库
    findCurInvs() {
      this.invList = [];
      findInvByUser()
          .then((response) => {
            this.invList = response.data || [];
          })
          .catch(() => {
          });
    }
    ,
  },
  components: {destinyModel, destinyProcessCode, destinyProcessDelect},
  created() {
    if (this.$isBlank(this.editQuery.billNo)) {
      let date = new Date();
      this.filterQuery.billNo =
          parseTime(date, "{y}{m}{d}{h}{i}{s}") +
          Math.ceil(Math.random() * 89 + 10);
      this.filterQuery.billDate = parseTime(
          date,
          "{y}-{m}-{d} {h}:{i}:{s}"
      );
      this.filterQuery.destinyNo = this.generateUUID();
    } else {
      this.filterQuery = this.editQuery
      this.destinyProcessDelectShow = true
      this.destinyProcessCodeShow = true
    }

    this.getList();
    this.findCurInvs();
  },
}
</script>

<style scoped>

</style>
