<template>
  <div>
    <el-form :model="inputQuery" :rules="formRules" ref="dataForm" label-width="120px" border>
      <el-row type="flex">
        <el-col :span="11">
          <el-form-item label="原单据类型" prop="originAction">
            <el-select v-model="inputQuery.originAction" placeholder="原单据类型" clearable size="small"
                       style="width: 90%">
              <el-option
                v-for="item in originBusTypes"
                :key="item.action"
                :label="item.name"
                :value="item.action">
                <span style="float: left"> {{ item.name }}</span>
                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.action }}</span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="11">
          <el-form-item label="目标单据类型" prop="action">
            <el-select v-model="inputQuery.action" placeholder="目标单据类型" clearable size="small" style="width: 90%">
              <el-option
                v-for="item in targetBusTypes"
                :key="item.action"
                :label="item.name"
                :value="item.action">
                <span style="float: left"> {{ item.name }}</span>
                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.action }}</span>
              </el-option>

            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="11">
          <el-form-item label="目标所在仓库" prop="invCode">
            <el-select v-model="inputQuery.invCode" placeholder="目标所在仓库" clearable size="small"
                       @change="invChange"
                       style="width: 90%">
              <el-option
                v-for="item in locInvs"
                :key="item.name"
                :label="item.name"
                :value="item.code">
                <span style="float: left"> {{ item.name }}</span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="11">
          <el-form-item label="目标往来仓库" prop="defaultInvCode">
            <el-select v-model="inputQuery.defaultInvCode" placeholder="目标往来仓库" clearable size="small"
                       @change="invChange"
                       style="width: 90%">
              <el-option
                v-for="item in fromInvs"
                :key="item.name"
                :label="item.name"
                :value="item.code">
                <span style="float: left"> {{ item.name }}</span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="11">
          <el-form-item label="推移时间（小时）" prop="beforeTime">
            <el-input style="width: 90%"
                      size="small"
                      type="number"
                      placeholder="请输入内容"
                      v-model="inputQuery.beforeTime"
                      onkeyup="this.value=this.value.replace(/\D/g,'')"
                      onafterpaste="this.value=this.value.replace(/\D/g,'')"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="11">
          <el-form-item label="流转方式" prop="supplementAll">
            <el-select v-model="inputQuery.supplementAll" placeholder="流转方式" clearable size="small"
                       style="width: 90%">
              <el-option label="全量补单" :value="true"></el-option>
              <el-option label="自动补单" :value="false"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col :span="23" type="flex">
          <el-form-item prop="intro">
            <label slot="label">说&emsp;&emsp;明</label>
            <el-input v-model="inputQuery.intro" size="small" style="width: 90%" type="textarea"
                      row="3"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
  </div>
</template>

<script>

import {getBusTypeList, getBusTypeListByUser} from "@/api/basic/busType";
import {filterSubAll, findByFrom} from "@/api/system/invSubWarehouse";
import {isBlank} from "@/utils/strUtil";

export default {
  name: "BusTypePreModify",
  props: {
    inputQuery: {
      type: Object,
      required: true,
    },
  },

  data() {
    return {
      filterQuery: {
        enabled: true,
        isBuType: true,
      },
      originBusTypes: [],
      targetBusTypes: [],
      locInvs: [],
      fromInvs: [],
      isAdd: false,
      formRules: {
        originAction: [
          {
            required: true,
            message: "原单据类型不能为空",
            trigger: "blur"
          }
        ],
        action: [
          {
            required: true,
            message: "目标单据类型不能为空",
            trigger: "blur"
          }
        ],
        invCode: [
          {
            required: true,
            message: "目标所在仓库不能为空",
            trigger: "blur"
          }
        ],
        // defaultInvCode: [
        //   {
        //     required: true,
        //     message: "目标往来仓库不能为空",
        //     trigger: "blur"
        //   }
        // ],
      },
    }
  },
  methods: {
    getBusType() {
      let params = {
        enable: true
      };
      getBusTypeList(params).then((res) => {
        if (res.code === 20000) {
          this.busTypes = res.data.list || [];
        }
      })
    },

    getOriginBusType() {
      let query = {
        enable: true
      };
      getBusTypeList(query).then((res) => {
        if (res.code === 20000) {
          this.originBusTypes = res.data.list || [];
        }
      })
    },

    getTargetBusType() {
      let query = {
        enable: true
      };
      getBusTypeListByUser(query).then((res) => {
        if (res.code === 20000) {
          this.targetBusTypes = res.data.list || [];
        }
      })
    },

    getLocInv() {
      let params = {};
      filterSubAll(params).then((res) => {
        if (res.code === 20000) {
          this.locInvs = res.data || [];
        }
      });
    },

    getFromInv() {
      let params = {
        locInvCode: this.inputQuery.invCode,
        filter: 2
      };
      findByFrom(params).then((res) => {
        if (res.code === 20000) {
          this.fromInvs = res.data;
        }
      })
    },

    invChange() {
      if (!isBlank(this.inputQuery.invCode)) {
        this.getFromInv();
        this.getTargetBusType();
      } else {
        this.inputQuery.action = null;
        this.targetBusTypes = [];
      }
    },
  },

  created() {
    if (this.inputQuery.originAction == null) {
      this.isAdd = true;
    } else {
      this.getTargetBusType();
    }
    this.getOriginBusType();
    this.getLocInv();
    this.getFromInv();

  }
}
</script>

<style scoped>

</style>
