<template>
  <a-modal
    centered
    :footer="null"
    title="选择退货单价"
    v-model="isShow"
    @cancel="isShow=false"
    width="50%">
    <a-spin :spinning="spinning" tip="Loading...">
      <a-table
        class="sTable"
        style="max-height:240px;"
        ref="table"
        size="small"
        :rowKey="(record) => record.productScopeSn"
        :columns="columns"
        :data-source="grabSalesList"
        :scroll="{ y: 200 }"
        :pagination="false"
        bordered
      >
        <template v-for="col in ['code','normalPrice', 'specialPrice', 'salesPrice']" :slot="col" slot-scope="text, record, index" >
          <div :key="col">
            <template v-if="col=='code'">
              <span>{{ text }}</span>
            </template>
            <div v-else>
              <a-radio-group name="radioGroup" v-model="record.resultVal">
                <div v-if="record.NORMAL&&col==='normalPrice'">
                  <a-radio :value="record.NORMAL" >
                    {{ record.NORMAL.price }}
                  </a-radio>
                </div>
                <div v-else-if="record.DISCOUNT&&col==='specialPrice'">
                  <a-radio :value="record.DISCOUNT" >
                    {{ record.DISCOUNT.price }}
                  </a-radio>
                </div>
                <div v-else-if="record.GIFT&&col==='salesPrice'">
                  <a-radio :value="record.GIFT" >
                    {{ record.GIFT.price }}
                  </a-radio>
                </div>
                <div v-else>--</div>
              </a-radio-group>
            </div>
          </div>
        </template>
      </a-table>
      <div class="btn-cont">
        <a-button id="sales-print-back" @click="handleCancel">取消</a-button>
        <a-button type="primary" id="sales-print-save" @click="handleSave" style="margin-left: 15px;">确定</a-button>
      </div>
    </a-spin>
  </a-modal>
</template>

<script>
import { commonMixin } from '@/utils/mixin'
import { VSelect, STable } from '@/components'
// import { grabSalesBill } from '@/api/salesReturn'
export default {
  name: 'GrabOrderModal',
  mixins: [commonMixin],
  components: { VSelect, STable },
  props: {
    openModal: {
      type: Boolean,
      default: false
    },
    infoData: {
      type: Array,
      default: function () {
        return []
      }
    }
  },
  data () {
    return {
      isShow: this.openModal,
      spinning: false,
      columns: [
        { title: '产品编码', dataIndex: 'product.code', width: '26%', scopedSlots: { customRender: 'code' }, align: 'center' },
        { title: '正常产品单价', width: '28%', scopedSlots: { customRender: 'normalPrice' }, align: 'center' },
        { title: '特价产品单价', width: '28%', scopedSlots: { customRender: 'specialPrice' }, align: 'center' },
        { title: '促销产品单价', width: '28%', scopedSlots: { customRender: 'salesPrice' }, align: 'center' }
      ],
      grabSalesList: []
    }
  },
  methods: {
    // // 获取列表数据
    // getDataList () {
    //   grabSalesBill(this.infoData).then(res => {
    //     this.grabSalesList = res.data
    //   })
    // },
    // 重置选择
    reSetSelect () {
      this.grabSalesList.map(item => { item.resultVal = null })
    },
    // 取消
    handleCancel () {
      this.isShow = false
    },
    // 保存
    handleSave () {
      const flag = this.grabSalesList.some(item => !item.resultVal)
      if (flag) {
        this.$message.warning('未选择产品单价')
        return
      }
      const resultVal = this.grabSalesList.map(item => {
        const newobj = {
          salesReturnDetailSn: item.product.salesReturnDetailSn, salesBillDetailSn: item.resultVal.salesBillDetailSn, price: item.resultVal.price
        }
        return newobj
      })
      this.$emit('ok', resultVal)
      this.isShow = false
    }
  },
  watch: {
    openModal (nVal, oVal) {
      this.isShow = nVal
    },
    isShow (nVal, oVal) {
      if (!nVal) {
        this.$emit('close')
      } else {
        if (this.infoData) {
          this.grabSalesList = this.infoData
        }
      }
    }
  }
}
</script>

<style lang="less" scoped>
  .btn-cont {
    text-align: center;
    margin: 35px 0 10px;
  }
</style>
