<template>
  <a-modal
    v-model="isShow"
    title="选择发货经销商"
    centered
    :maskClosable="false"
    :confirmLoading="confirmLoading"
    width="500px"
    :footer="null"
    @cancel="cancel">
    <a-spin :spinning="spinning" tip="Loading...">
      <div style="padding: 0 30px;">
        <a-radio-group v-model="chooseVal">
          <!-- SUPERIORS 上级 purchase  省仓 -->
          <a-radio :style="radioStyle" v-for="(item,index) in dealerList" :key="item.dealerSn" :value="item.dealerSn">
            {{ item.dealerName }}{{ item.parentType?item.parentType==='SUPERIORS'?'（上级）':'（省仓）' :'' }}
            <dealerSubareaScopeList
              v-if="index==dealerList.length-1&&chooseVal=='a1'"
              dealertype="tire"
              placeholder="请输入发货经销商名称"
              ref="dealerSubareaScopeList"
              id="dealerStockModal-custList"
              style="margin-left:10px;width:280px;"
              @change="dealerChange" />
          </a-radio>
        </a-radio-group>
      </div>
      <div style="padding: 30px 0 0;text-align: center;">
        <a-button @click="cancel" style="margin-right: 15px" type="default" id="chooseCustom-btn-back">取消</a-button>
        <a-button type="primary" :loading="confirmLoading" @click="handleSubmit" id="chooseCustom-btn-submit">确定</a-button>
      </div>
    </a-spin>
  </a-modal>
</template>

<script>
import { commonMixin } from '@/utils/mixin'
import { querySuperiorDealer, queryTransferDealerStock } from '@/api/sales'
import dealerSubareaScopeList from '@/views/common/dealerSubareaScopeList.vue'
export default {
  name: 'DealerStockModal',
  mixins: [commonMixin],
  props: {
    openModal: { //  弹框显示状态
      type: Boolean,
      default: false
    },
    itemSn: {
      type: String,
      default: ''
    },
    showStock: {
      type: Boolean,
      default: false
    }
  },
  components: { dealerSubareaScopeList },
  data () {
    return {
      isShow: this.openModal,
      spinning: false,
      confirmLoading: false,
      chooseVal: null,
      radioStyle: "display:block;height: '30px';lineHeight: '30px';padding:5px 0;",
      dealerList: [{ dealerName: '其他经销商', dealerSn: 'a1' }],
      salesBillSn: null,
      selectDealerSn: undefined, // 已选发货经销商
      selectDealerName: undefined
    }
  },
  methods: {
    getDealerList () {
      this.spinning = true
      querySuperiorDealer({ salesBillSn: this.itemSn }).then(res => {
        this.dealerList = res.data.concat(this.dealerList)
        // 默认选中第一项
        this.chooseVal = this.dealerList[0].dealerSn
        this.spinning = false
      })
    },
    // 选择经销商
    dealerChange (val) {
      if (val && val.key) {
        this.selectDealerSn = val.key
        this.selectDealerName = val.name
      }
    },
    //  保存
    handleSubmit (e) {
      e.preventDefault()
      const _this = this
      let chooseRow = []
      if (_this.chooseVal) {
        if (_this.chooseVal === 'a1') {
          if (!_this.selectDealerSn || !_this.selectDealerName) {
            _this.$message.warning('请选择发货经销商！')
            return
          }
          chooseRow.push({
            dealerSn: _this.selectDealerSn,
            dealerName: _this.selectDealerName
          })
        } else {
          chooseRow = _this.dealerList.filter(item => item.dealerSn == _this.chooseVal)
        }
        _this.confirmLoading = true
        queryTransferDealerStock({ salesBillSn: _this.itemSn, transferDealerSn: _this.chooseVal === 'a1' ? _this.selectDealerSn : _this.chooseVal, showStock: _this.showStock }).then(res => {
          if (res.status == 200) {
            _this.confirmLoading = false
            _this.cancel()
            _this.$emit('ok', chooseRow[0], res.data)
          }
        })
      } else {
        _this.$message.info('请选择发货经销商类型!')
      }
    },
    cancel () {
      this.dealerList = [{ dealerName: '其他经销商', dealerSn: 'a1' }]
      if (this.$refs && Object.keys(this.$refs).length && this.chooseVal == 'a1') {
        this.$refs.dealerSubareaScopeList[0].resetForm()
      }
      this.chooseVal = null
      this.isShow = false
    }
  },
  watch: {
    //  父页面传过来的弹框状态
    openModal (newValue, oldValue) {
      this.isShow = newValue
    },
    //  重定义的弹框状态
    isShow (newValue, oldValue) {
      if (!newValue) {
        this.$emit('close')
      } else {
        if (this.itemSn && this.itemSn.length > 0) {
          this.getDealerList()
        }
      }
    }
  }
}
</script>
