<template>
<div v-if="mty == 'fmt985'">
  <c-row :gutter="20">
    <c-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>
    </c-col>
    <c-col :span="8">
      <el-form-item label="B00" 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>
    </c-col>
    <c-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>
    </c-col>
  </c-row>
  <el-form-item label="D90" v-bind:error="tagValue[2].s4" :required="true" label-position="left" label-width="80px">
    <c-input size="small" v-model="tagValue[0].s4" placeholder="原支付交易序号" :maxlength="16" @blur="handleChange"></c-input>
  </el-form-item>
</div>
<div v-else-if="mty == 'fmt195'">
  <el-form-item :label="pattern.label" v-bind:error="tagValue[2].s1" label-position="left" label-width="150px">
    <c-input-format size="small" v-model="tagValue[0].s1" :maxRows="6" :maxCols="35" :placeholder="pattern.label"
    @blur="handleChange" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s1') !== -1">
    </c-input-format>
  </el-form-item>
</div>
<div v-else>
  <el-form-item v-bind:error="tagValue[2].s1">
    <c-input-format size="small" v-model="tagValue[0].s1" :maxRows="6" :maxCols="35" placeholder="Narrative"
    @blur="handleChange" :disabled="pattern.tagFlag && pattern.tagFlag.indexOf('s1') !== -1">
    </c-input-format>
  </el-form-item>
</div>
</template>
<script>
import {Currency} from "./Utils"
export default {
  props: {
    tag: {
      type: String,
      default: ''
    },
    mty: {
      type: String,
      default: ''
    },
    pattern: {
      type: Object,
      default: () => {}
    }
  },
  data: function () {
    if (this.mty == 'fmt985') {
      return {
        tagValue: [{
          s1: '',
          s2: '',
          s3: '',
          s4: '',
        },
        '',
        {
          s1: '',
          s2: '',
          s3: '',
          s4: '',
        }],
        code: Currency
      }
    }
    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 == 'fmt985')  {
        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) + '/B00/' + obj.s2
        }
        if (obj.s3) {
          mval = (mval?mval+'\r\n': mval) + '/F31/' + obj.s3
        }
        if (obj.s4) {
          mval = (mval?mval+'\r\n': mval) + '/D90/' + obj.s4
        }
        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')
    }
  }
}
</script>