<template>
  <vxe-modal v-model="value" id="autoSplitModal" width="400" v-loading="load" @show="show" @hide="hide" height="260" show-footer title="自动拆分">
    <div class="split-num">
      <div class="max-label">可拆分数量：</div>
      <vxe-input v-model="val" size="small" placeholder="请输入" type="integer"></vxe-input>
    </div>
    <template #footer>
      <div class="btn">
        <el-button plain size="small" @click="value = false">取消</el-button>
        <el-button type="primary" size="small" @click="btn">确定</el-button>
      </div>
    </template>
  </vxe-modal>
</template>

<script lang="ts">
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import { split } from '@/api/omsOrder'
@Component({components:{}})
export default class UpdateRmkModal extends Vue {
  value=false;
  load=false;
  val:number=0;
  data:Array<any>=[];
  setShow(v:boolean){
    this.value = v;
  }
  setData(data:Array<any>){
    this.data = data;
    console.log('值', this.data)
  }
  show(){}
  hide(){
    this.val = 0
  }
  btn(){
    let n = Number(this.val)
    let paramArr:Array<any>=[]
    if(n) {
      this.data.forEach(ele => {
        if(ele.items && ele.items.length > 0) {
          let obj:any={}
          obj.id = ele.id
          obj.splitInfos=[]
          for(const item of ele.items){
            if(item.qty > n){
              obj.splitInfos.push({
                qty:n,
                orderItemId:item.id
              })
            }
          }
          if(obj.splitInfos.length > 0) {
            paramArr.push(obj)
          }
        }
      })
      if(paramArr.length == 0){
        this.$message('未找到可拆分数量大于'+n+'的订单')
        return
      }
      this.load = true
      let i = 0;
      for(const item of paramArr){
        split(item).then((res:any) => {
          i++
          if(i >= paramArr.length){
            this.load = false;
            this.$message({
              message:'拆分成功！',
              type:'success'
            })
            this.$emit('handleSuccess');
            this.value = false;
          }
        }).catch(() => {
          i++
          if(i >= paramArr.length){
            this.load = false;
            this.$emit('handleSuccess');
            this.value = false;
          }
        })
      }
    }else{
      this.$message('请输入可拆分数量')
    }
    // (this.$refs.form as any).validate().then(()=>{
    //   let data = (this.$refs.form as any).getValue();
    //   data.idList = this.billValue;
    //   this.load = true
    //   split(data).then(()=>{
    //     this.load = false;
    //     (this.$message({
    //       message:'操作成功！',
    //       type:'success'
    //     }));
    //     this.$emit('handleSuccess');
    //     this.value = false;
    //   }).catch(()=>{
    //     this.load = false;
    //   })
    // })
  }
}
</script>

<style lang="scss" scoped>
.split-num{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 32px;
  .max-label{
    font-size: 14px;
    padding-right: 8px;
  }
}
</style>