<template>
<div v-if="mty == 'fmt194'">
  <el-form-item label="B00" v-bind:error="tagValue[2].s1" :required="true"  label-position="left" label-width="80px">
    <c-date-picker size="small" v-model="tagValue[0].s1" placeholder="委托日期" format="yyyyMMdd" value-format="yyyyMMdd" style="width: 100%" @change="handleChange"></c-date-picker>
  </el-form-item>
  <el-form-item label="A17" v-bind:error="tagValue[2].s2" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s2" placeholder="退汇申请清算行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s2')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A34" v-bind:error="tagValue[2].s3" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s3" placeholder="退汇申请行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s3')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A18" v-bind:error="tagValue[2].s4" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s4" placeholder="退汇应答清算行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s4')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A35" v-bind:error="tagValue[2].s5" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s5" placeholder="退汇应答行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s5')"></el-button>
    </el-input>
  </el-form-item>
  <el-form-item label="F85" v-bind:error="tagValue[2].s6"  label-position="left" label-width="80px">
    <c-input-format size="small" v-model="tagValue[0].s6" :maxRows="3" :maxCols="35"
    placeholder="附言"
    @blur="handleChange" :maxlength="1750">
    </c-input-format>
  </el-form-item>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else-if="mty == 'fmt195'">
  <el-form-item label="B05" v-bind:error="tagValue[2].s1" :required="true" label-position="left" label-width="80px">
    <c-date-picker size="small" v-model="tagValue[0].s1" placeholder="查询日期" format="yyyyMMdd" value-format="yyyyMMdd" style="width: 100%" @change="handleChange"></c-date-picker>
  </el-form-item>
  <el-form-item label="A11" v-bind:error="tagValue[2].s2" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s2" placeholder="发起清算行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s2')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A32" v-bind:error="tagValue[2].s3" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s3" placeholder="查询行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s3')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A12" v-bind:error="tagValue[2].s4" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s4" placeholder="接收清算行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s4')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A33" v-bind:error="tagValue[2].s5" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s5" placeholder="查复行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s5')"></el-button>
    </el-input>
  </el-form-item>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else-if="mty == 'fmt196'">
  <el-form-item label="B06" v-bind:error="tagValue[2].s1" :required="true" label-position="left" label-width="80px">
    <c-date-picker size="small" v-model="tagValue[0].s1" placeholder="查复日期" format="yyyyMMdd" value-format="yyyyMMdd" style="width: 100%" @change="handleChange"></c-date-picker>
  </el-form-item>
  <el-form-item label="A11" v-bind:error="tagValue[2].s2" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s2" placeholder="发起清算行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s2')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A33" v-bind:error="tagValue[2].s3" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s3" placeholder="查复行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s3')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A12" v-bind:error="tagValue[2].s4" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s4" placeholder="接收清算行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s4')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A32" v-bind:error="tagValue[2].s5" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s5" placeholder="查询行行号" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s5')"></el-button>
    </el-input>
  </el-form-item>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else>
  <el-form-item v-bind:error="tagValue[2].s1">
    <c-input-format size="small" v-model="tagValue[0].s1" :maxRows="10" :maxCols="35" placeholder="Narrative"
    @blur="handleChange" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s1') !== -1">
    </c-input-format>
  </el-form-item>
</div>
</template>
<script>
import YBIC from './YBIC'
export default {
  components: {
    'm-ybic': YBIC
  },
  props: {
    tag: {
      type: String,
      default: ''
    },
    mty: {
      type: String,
      default: ''
    },
    pattern: {
      type: Object,
      default: () => {}
    }
  },
  data: function () {
    if (this.mty == 'fmt194') {
      return {
        dialogVisible: false,
        currentField: '',
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: '',
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: '',
        }],
      }
    }
    if (this.mty == 'fmt195') {
      return {
        dialogVisible: false,
        currentField: '',
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
        }],
      }
    }

    if (this.mty == 'fmt196') {
      return {
        dialogVisible: false,
        currentField: '',
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
        }],
      }
    }

    return {
      tagValue: [{
        s1: '',
      },
      '',
      {
        s1: '',
      }]
    }
  },
 created: function () {
    if (this.pattern.tagValue == undefined || JSON.stringify(this.pattern.tagValue) == '[{},null]') {
      this.pattern.tagValue = this.tagValue
    } else {
      this.tagValue = this.pattern.tagValue
    }
  },
  methods: {
    handleChange: function () {
      // 触发校验
      if (this.mty == 'fmt194')  {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/B00/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/A17/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/A34/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/A18/' + obj.s4
        }
        if (obj.s5) {
          mval = (mval?mval+'\r\n': mval) + '/A35/' + obj.s5
        }
        if (obj.s6) {
          mval = (mval?mval+'\r\n': mval) + '/F85/' + obj.s6
        }
        this.pattern.tagValue[1] = mval 
      } else if (this.mty =='fmt195') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/B05/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/A11/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/A32/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/A12/' + obj.s4
        }
        if (obj.s5) {
          mval = (mval?mval+'\r\n': mval) + '/A33/' + obj.s5
        }
        this.pattern.tagValue[1] = mval 
      } else if (this.mty == 'fmt196') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/B06/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/A11/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/A33/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/A12/' + obj.s4
        }
        if (obj.s5) {
          mval = (mval?mval+'\r\n': mval) + '/A32/' + obj.s5
        }
        this.pattern.tagValue[1] = mval 
      } else {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        mval = obj.s1
        this.pattern.tagValue[1] = mval 
      }
     
      this.$emit('validate')
    },
    handleOpenDialog: function (field) {
      if (field) {
        this.currentField = field
      }
      this.dialogVisible = true
    },
    handleClose: function () {
      this.dialogVisible = false
    },
    handleRowSelect: function (row) {
      if (this.currentField) {
        this.pattern.tagValue[0][this.currentField] = row.BIC
      }
      this.handleChange()
    }
  }
}
</script>