<template>
  <div v-if="data.length > 0">
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               @row-update="infoSubmit"
               @row-del="removeItem"
               @selection-change="selectionChange"
               v-model="form"
               ref="crud2">
      <template slot="menuLeft">
        <el-button type="success"
                   size="small"
                   icon="el-icon-circle-check"
                   plain
                   @click="handleSubmit">批量提交
        </el-button>
      </template>
    </avue-crud>
  </div>
</template>

<script>
  import {returnsSubmit} from "@/api/bank/returns";

  export default {
    name: "returns-comfire",
    data(){
      return {
        loading: false,
        data: [],

        form: {},
        option: {
          height:'auto',
          calcHeight: 30,
          tip: false,
          searchShow: false,
          searchShowBtn: false,
          columnBtn: false,
          refreshBtn: false,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: false,
          editBtn: true,
          addBtn: false,
          selection: true,
          dialogClickModal: false,
          column: [
            {
              label: "業務類型",
              prop: "isPublic",
              type: "select",
              dataType: "string",
              dicUrl: `/api/blade-system/dict/dictionary?code=business_type`,
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              dicFormatter: (res) => {
                res.data.forEach(item => {item.disabled = item.isSealed == 1;})
                return res.data;
              },
              rules: [{
                required: true,
                message: "請輸入業務類型",
                trigger: "blur"
              }]
            },
            {
              label: "銀行號",
              prop: "bankNo",
              span: 24,
              hide: true,
              rules: [{
                required: true,
                message: "請輸入銀行號",
                trigger: "blur"
              }]
            },
            {
              label: "機構號",
              prop: "orgNo",
              hide: true,
              display: false,
              rules: [{
                required: true,
                message: "請輸入機構號",
                trigger: "blur"
              }]
            },
            {
              label: "機構名稱",
              prop: "orgName",
              disabled: true,
              display: false,
              rules: [{
                required: true,
                message: "請輸入機構號",
                trigger: "blur"
              }]
            },
            /* {
               label: "序號",
               prop: "serialNo",
               rules: [{
                 required: true,
                 message: "請輸入序號",
                 trigger: "blur"
               }]
             },*/
            {
              label: "支行",
              prop: "subBank",
              rules: [{
                required: true,
                message: "請輸入支行",
                trigger: "blur"
              }]
            },
            {
              label: "支行機構號",
              prop: "subOrgNo",
              rules: [{
                required: true,
                message: "請輸入支行機構號",
                trigger: "blur"
              }]
            },
            {
              label: "客戶名稱",
              prop: "customerName",
              rules: [{
                required: true,
                message: "請輸入客戶名稱",
                trigger: "blur"
              }]
            },
            {
              label: "狀態",
              prop: "status",
              type: "select",
              dataType: "string",
              dicUrl: `/api/blade-system/dict/dictionary?code=returns_status`,
              props: {
                label: "dictValue",
                value: "dictKey"
              },dicFormatter: (res) => {
                res.data.forEach(item => {item.disabled = item.isSealed == 1;})
                return res.data;
              },
              rules: [{
                required: true,
                message: "請輸入狀態",
                trigger: "blur"
              }]
            },
            {
              label: "退件原因",
              prop: "reason",
              rules: [{
                required: true,
                message: "請輸入退件原因",
                trigger: "blur"
              }]
            },
            {
              label: "備註",
              prop: "remark",
              rules: [{
                required: false,
                message: "請輸入備註",
                trigger: "blur"
              }]
            },
            {
              label: "條碼",
              prop: "barCode",
              rules: [{
                required: false,
                message: "請輸入條碼",
                trigger: "blur"
              }]
            },
            {
              label: "接辦行經辦",
              prop: "handlingBank",
              rules: [{
                required: true,
                message: "請輸入接辦行經辦",
                trigger: "blur"
              }]
            },
            {
              label: "接辦行覆核",
              prop: "handlingBankReview",
              rules: [{
                required: false,
                message: "請輸入接辦行覆核",
                trigger: "blur"
              }]
            },
            {
              label: "處理日期",
              prop: "handlingDate",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              rules: [{
                required: true,
                message: "請輸入處理日期",
                trigger: "blur"
              }]
            },
            {
              label: "經辦",
              prop: "handler",
              rules: [{
                required: true,
                message: "請輸入經辦",
                trigger: "blur"
              }]
            },
            {
              label: "跟進情況",
              prop: "handlingStatus",
              type: "select",
              dataType: "string",
              dicUrl: `/api/blade-system/dict/dictionary?code=processing_status`,
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              dicFormatter: (res) => {
                res.data.forEach(item => {item.disabled = item.isSealed == 1;})
                return res.data;
              },
              rules: [{
                required: false,
                message: "請輸入跟進情況",
                trigger: "blur"
              }]
            },
          ]
        }
      }
    },
    props: {
      data: {
        type: Array
      },

    },
    created() {


    },
    methods: {
      handleSubmit(){
        if (this.selectionList.length === 0) {
          this.$message.warning("請選擇至少一條數據");
          return;
        }
        for (let i = 0; i < this.selectionList.length; i++) {
          let item = this.selectionList[i];
          returnsSubmit(item).then(() => {
            this.data.splice(item.$index, 1);
          });
        }
        this.$message({
          type: "success",
          message: "操作成功!"
        });
      },
      infoSubmit(row, index, done, loading){
        returnsSubmit(row).then(() => {
          this.data.splice(index, 1);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          loading = false;
          done();
        });
      },
      removeItem(row, index){
        this.data.splice(index, 1)
      },
      selectionChange(list) {
        this.selectionList = list;
      },

    }
  }
</script>

<style scoped>

</style>
