<template>
<div v-if="mty == 'fmt191'">
  <el-row :gutter="20">
    <el-col :span="8">
      <el-form-item label="G51" v-bind:error="tagValue[2].s1" :required="true" label-position="left" label-width="80px">
        <c-select size="small" v-model="tagValue[0].s1" placeholder="币种" @change="handleChange" style="width: 100%" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s1') !== -1">
          <el-option v-for="item in code" :label="item" :value="item" :key="item"></el-option>
        </c-select>
      </el-form-item>
    </el-col>
    <el-col :span="16">
      <el-form-item label="A16" 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" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s2') !== -1">
          <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s2')"></el-button>
        </el-input>
      </el-form-item>
    </el-col>
  </el-row>
  <el-form-item label="F85" v-bind:error="tagValue[2].s3"  label-position="left" label-width="80px">
    <c-input-format size="small" v-model="tagValue[0].s3" :maxRows="3" :maxCols="35"
    placeholder="附言"
    @blur="handleChange" :maxlength="1750" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s3') !== -1">
    </c-input-format>
  </el-form-item>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else-if="mty == 'fmt193'">
  <el-row :gutter="20">
    <el-col :span="8">
      <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-col>
    <el-col :span="8">
      <el-form-item label="G51" v-bind:error="tagValue[2].s2" :required="true" label-position="left" label-width="80px">
        <c-select size="small" v-model="tagValue[0].s2" placeholder="币种" @change="handleChange" style="width: 100%">
          <el-option v-for="item in code" :label="item" :value="item" :key="item"></el-option>
        </c-select>
      </el-form-item>
    </el-col>
    <el-col :span="8">
      <el-form-item label="F31" v-bind:error="tagValue[2].s3" :required="true" label-position="left" label-width="80px">
        <el-input size="small" v-model="tagValue[0].s3" placeholder="原FMT号" :maxlength="3" @blur="handleChange">
        </el-input>
      </el-form-item>
    </el-col>
  </el-row>
  <el-form-item label="A17" 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="A34" 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="A18" v-bind:error="tagValue[2].s6" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s6" placeholder="退汇应答清算行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s6')"></el-button>
    </el-input>
  </el-form-item>
   <el-form-item label="A35" v-bind:error="tagValue[2].s7" :required="true"  label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s7" placeholder="退汇应答行" :maxlength="11" @blur="handleChange">
      <el-button slot="append" icon="el-icon-search" size="mini" @click="handleOpenDialog('s7')"></el-button>
    </el-input>
  </el-form-item>
  <el-form-item label="F85" v-bind:error="tagValue[2].s8"  label-position="left" label-width="80px">
    <c-input-format size="small" v-model="tagValue[0].s8" :maxRows="3" :maxCols="35"
    placeholder="附言"
    @blur="handleChange" :maxlength="1750" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s3') !== -1">
    </c-input-format>
  </el-form-item>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else-if="mty == 'fmt194'">
  <el-row :gutter="20">
    <el-col :span="12">
      <el-form-item label="G51" v-bind:error="tagValue[2].s1" :required="true"  label-position="left" label-width="80px">
        <c-select size="small" v-model="tagValue[0].s1" placeholder="币种" @change="handleChange" style="width: 100%">
          <el-option v-for="item in code" :label="item" :value="item" :key="item"></el-option>
        </c-select>
      </el-form-item>
    </el-col>
    <el-col :span="12">
      <el-form-item label="B93" v-bind:error="tagValue[2].s2" :required="true"  label-position="left" label-width="80px">
        <c-date-picker size="small" v-model="tagValue[0].s2" placeholder="原退汇申请委托日期" format="yyyyMMdd" value-format="yyyyMMdd" style="width: 100%" @change="handleChange"></c-date-picker>
      </el-form-item>
    </el-col>
  </el-row>
</div>
<div v-else-if="mty == 'fmt195'">
  <el-form-item label="B90" 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="A91" 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="A92" 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="F31" v-bind:error="tagValue[2].s4" :required="true" label-position="left" label-width="80px">
    <el-input size="small" v-model="tagValue[0].s4" placeholder="原FMT号" :maxlength="3" @blur="handleChange">
    </el-input>
  </el-form-item>
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item  label="C90" v-bind:error="tagValue[2].s5"  :required="true" label-position="left" label-width="80px" >
          <c-select size="small" v-model="tagValue[0].s5" placeholder="原货币符号" style="width: 100%" @change="handleChange">
            <el-option v-for="item in code" :label="item" :value="item" :key="item"></el-option>
          </c-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item v-bind:error="tagValue[2].s6" :required="true">
          <c-input-currency size="small" v-model="tagValue[0].s6" placeholder="金额" :max="9999999999999999" style="width: 100%" @blur="handleChange" :precision="2" :currency="tagValue[0].s5"></c-input-currency>
        </el-form-item>
      </el-col>
    </el-row>
  <m-ybic :visible.sync="dialogVisible" @close="handleClose" @rowselect="handleRowSelect"></m-ybic>
</div>
<div v-else-if="mty == 'fmt196'">
  <el-row :gutter="20">
    <el-col :span="12">
      <el-form-item label="G51" v-bind:error="tagValue[2].s1" :required="true" label-position="left" label-width="80px">
        <c-select size="small" v-model="tagValue[0].s1" placeholder="币种" @change="handleChange" style="width: 100%">
          <el-option v-for="item in code" :label="item" :value="item" :key="item"></el-option>
        </c-select>
      </el-form-item>
    </el-col>
    <el-col :span="12">
      <el-form-item label="B91" v-bind:error="tagValue[2].s2" :required="true" label-position="left" label-width="80px">
        <c-date-picker size="small" v-model="tagValue[0].s2" placeholder="原查询日期" format="yyyyMMdd" value-format="yyyyMMdd" style="width: 100%" @change="handleChange"></c-date-picker>
      </el-form-item>
    </el-col>
  </el-row>
</div>
<div v-else-if="mty == 'fmt199'">
  <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="A41" 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" 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="A42" 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" 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="F89" v-bind:error="tagValue[2].s6" :required="true" label-position="left" label-width="80px">
    <c-input-format size="small" v-model="tagValue[0].s6" :maxRows="20" :maxCols="35"
    placeholder="内容"
    @blur="handleChange" :maxlength="1750" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s3') !== -1">
    </c-input-format>
  </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="35" :maxCols="50"
    placeholder="Narrative Description of the Original Message to Which the Answer Relates"
    @blur="handleChange" :maxlength="1750" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s1') !== -1">
    </c-input-format>
  </el-form-item>
</div>
</template>
<script>
import YBIC from './YBIC'

import {Currency} from "./Utils"
export default {
  components: {
    'm-ybic': YBIC
  },
  props: {
    tag: {
      type: String,
      default: ''
    },
    mty: {
      type: String,
      default: ''
    },
    pattern: {
      type: Object,
      default: () => {}
    }
  },
  data: function () {
    if (this.mty == 'fmt191') {
      return {
        dialogVisible: false,
        tagValue: [{
          s1: '',
          s2: '',
          s3: ''
        },
        '',
        {
          s1: '',
          s2: '',
          s3: ''
        }],
        code: Currency
      }
    }
    if (this.mty == 'fmt193') {
      return {
        dialogVisible: false,
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: '',
          s7: '',
          s8: ''
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: '',
          s7: '',
          s8: ''
        }],
        code: Currency
      }
    }
    if (this.mty== 'fmt194') {
      return {
         tagValue: [{
          s1: '',
          s2: ''
        },
        '',
        {
          s1: '',
          s2: ''
        }],
        code: Currency
      }
    }
    if (this.mty== 'fmt195') {
      return {
        dialogVisible: false,
         tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: ''
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: ''
        }],
        code: Currency,
        currentField: ''
      }
    }
    if (this.mty== 'fmt196') {
      return {
         tagValue: [{
          s1: '',
          s2: ''
        },
        '',
        {
          s1: '',
          s2: ''
        }],
        code: Currency
      }
    }
    if (this.mty== 'fmt199') {
      return {
      dialogVisible: false,
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: ''
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
          s5: '',
          s6: ''
        }],
        currentField: ''
      }
    }
    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 == 'fmt191') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/G51/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/A16/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/F85/' + obj.s3
        }
        this.pattern.tagValue[1] = mval
      } else if (this.mty == 'fmt193') {
        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) + '/G51/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/F31/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/A17/' + obj.s4
        }
        if (obj.s5) {
          mval = (mval?mval+'\r\n': mval) + '/A34/' + obj.s5
        }
        if (obj.s6) {
          mval = (mval?mval+'\r\n': mval) + '/A18/' + obj.s6
        }
        if (obj.s7) {
          mval = (mval?mval+'\r\n': mval) + '/A35/' + obj.s7
        }
        if (obj.s8) {
          mval = (mval?mval+'\r\n': mval) + '/F85/' + obj.s8
        }
        this.pattern.tagValue[1] = mval
      } else if (this.mty == 'fmt194') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/G51/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/B93/' + obj.s2
        }
        this.pattern.tagValue[1] = mval
      } else if (this.mty == 'fmt195') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/B90/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/A91/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/A92/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/F31/' + obj.s4
        }
        if (obj.s5 || obj.s6) {
          mval = (mval?mval+'\r\n': mval) + '/C90/' + obj.s5 + obj.s6
        }
        this.pattern.tagValue[1] = mval
      } else if (this.mty == 'fmt196') {
        let obj = this.pattern.tagValue[0]
        let mval = ''
        if (obj.s1) {
          mval = mval + '/G51/' + obj.s1
        }
        if (obj.s2) {
          mval = (mval?mval+'\r\n': mval) + '/B91/' + obj.s2
        }
        this.pattern.tagValue[1] = mval
      } else if (this.mty == 'fmt199') {
        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) + '/A41/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/A32/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/A42/' + obj.s4
        }
        if (obj.s5) {
          mval = (mval?mval+'\r\n': mval) + '/A33/' + obj.s5
        }
        if (obj.s6) {
          mval = (mval?mval+'\r\n': mval) + '/F89/' + obj.s6
        }
        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>
