<template>
  <a-modal
    :visible="visible"
    :title="`${formData.name} - 扣除`"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    width="500px"
    @cancel="handleCancel"
  >
    <a-form
      layout="inline"
      class="form"
      :form="form"
    >
      <a-form-item
        label="金额"
      >
        <a-input-number
          style="width:140px"
          :min="0"
          :step="0.01"
          :precision="2"
          v-decorator="[
            'amount',
            {
              rules: [{ required: true, message: '请输入金额' }]
            }
          ]"
        ></a-input-number>
      </a-form-item>
      <a-form-item
        label="备注"
      >
        <a-input
          v-decorator="[
            'remark'
          ]"
        ></a-input>
      </a-form-item>

    </a-form>
  </a-modal>
</template>

<script>
import { deductTravelAgencyUser } from '@/api/saleChannel/travelAgency'

import modalMixin from './modalMixin'

export default {
  data () {
    return {
      formData: {}
    }
  },
  mixins: [modalMixin],
  methods: {
    showCallback (data) {
      this.formData = data
    },
    handleOk () {
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log('values', values)
          this.confirmLoading = true
          deductTravelAgencyUser({ id: this.formData.id, ...values }).then(res => {
            this.$emit('ok')
            this.$message.success('扣除成功！')
            this.handleCancel()
          }).finally(() => {
            this.confirmLoading = false
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.ant-form-inline .ant-form-item-with-help{
  margin-bottom: 0;
}
</style>
