<template>
  <ele-modal
    custom-class="ele-dialog-form long-dialog-form"
    :centered="true"
    :visible.sync="addOrEditDialogFlag"
    :title="title"
    :append-to-body="false"
    :close-on-click-modal="false"
    width="25%"
    :before-close="cancel"
  >
    <el-form ref="form" :rules="rules" class="el-form-box" :model="form" label-width="90px">
      <headerTitle title="基本信息"></headerTitle>
      <el-row >
        <el-col :span="24">
          <el-form-item
            label="类型"
            prop="type"
           >

            <el-select v-model="form.type" clearable style="width: 100%">
              <el-option label="现金" :value="1"></el-option>
              <el-option label="银行卡" :value="2"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="开户行名称"
            prop="branchName"
           >
            <el-input v-model="form.branchName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="24">
          <el-form-item
            label="银行账户"
            prop="account"
           >
            <el-input v-model="form.account"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="银行名称"
            prop="bankName"
           >
            <el-input v-model="form.bankName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row >
        <el-col :span="24">
          <el-form-item
            label="是否启用"
            prop="enabled"
           >
            <el-radio-group v-model="form.enabled">
              <el-radio :label="1">启用</el-radio>
              <el-radio :label="0">禁用</el-radio>

            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="备注"
           >
            <el-input v-model="form.remark" type="textarea" clearable></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button type="primary" @click="handleSave(0)">保存</el-button>
      <el-button @click="cancel">返回</el-button>
    </div>

  </ele-modal>
</template>
<script>

import {mapGetters} from "vuex";
import {
  getSettlementAccountInfoAPI,
  settlementAccountSaveAPI, settlementAccountSubmit,
  settlementAccountUpdateAPI
} from "@/api/financialManage/settlementAccount";


export default {
  name: "add-or-edit-dialog",
  components: {},
  props: {
    addOrEditDialogFlag: {
      type: Boolean,
      default: false
    },
  },
  computed: {
    ...mapGetters(['user'])
  },
  data() {
    return {
      dialogType: '',
      title: '',
      form: {
        account: "",
        bankName: "",
        branchName: "",
        createTime: "",
        enabled: 1,
        id: '',
        remark: "",
        type: undefined
      },
      feeTypeList: [],
      accountingSubjectList: [],
      deptList: [],
      deptTreeList: [],
      rules: {
        type: {required: true, message: '请选择', trigger: 'change'},
        enabled: {required: true, message: '请选择', trigger: 'change'},
      }
    }
  },
  created() {

  },
  methods: {
    //初始化
    async init(row = {}, type) {
      this.title = type == 'add' ? '新增' : '修改'
      this.dialogType = type
      if (type !== 'add') {
        await this.getFeeApplyInfoInfo(row.id)
      }
    },
    //获取详情
    async getFeeApplyInfoInfo(id) {
      this.form = await getSettlementAccountInfoAPI(id)
    },
    handleSave(flag) {
      this.$refs.form.validate(async valid => {
        if (!valid) return this.$message.warning('有必填项未填，请检查')
        const API = this.dialogType == 'add' ? settlementAccountSaveAPI : settlementAccountUpdateAPI
        const id = await API(this.form)
        if (flag) {
          await this.handleSub(id)
        }
        this.$message.success('操作成功')
        this.done()
        this.cancel()
      })
    },
    //提交-开启流程
    async handleSub(id) {
      try {
        await settlementAccountSubmit({businessId: id})
      } catch (e) {
        this.$message.error(e.message);
      }
    },
    //刷新主列表数据
    done() {
      this.$emit('reload')
    },
    //关闭弹窗
    cancel() {
      this.$emit('update:addOrEditDialogFlag', false)
    }
  }
}
</script>
<style scoped lang="scss">

</style>
