<template>
  <div class="formGroup">
    <h4>消息定义</h4>
    <el-row :gutter="20">
      <el-col :span="20">
        <el-form-item label="消息类型：" prop="messageType">
          <el-select v-model="formData.messageType" clearable placeholder="请选择" @change="messageTypeChange" style="width: 100%;">
            <el-option v-for="item in messageList" :key="item.value" :label="item.name" :value="item.name">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="Http Method：" prop="serviceParamsMap.httpMethod" v-if="formData.messageType === 'REST'">
          <el-checkbox-group v-model="httpMethod">
            <el-checkbox v-for="item in httpMethodList" :label="item.value" :key="item.value">{{ item.name }}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="报文格式：" prop="payloadType" v-if="formData.messageType">
          <el-radio-group v-model="formData.payloadType">
            <el-radio v-for="item in payloadTypeList" :label="item.value" :key="item.value" v-show="item.isShow">{{ item.name }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="定义文件类型：" :prop="formData.messageType === 'REST' ? '' : 'defineFileType'">
          <el-select v-model="formData.defineFileType" clearable placeholder="请选择" @change="defineFileTypeChange" style="width: 100%;">
            <el-option v-for="item in defineFileTypeList" :key="item.name" :label="item.name" :value="item.name">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="定义文件：" prop="defineFile" v-if="formData.defineFileType === 'wsdl'">
          <el-input v-model="formData.defineFile" suffix-icon="el-icon-search" @focus="chooseDefineFile">
          </el-input>
        </el-form-item>
        <el-form-item label="端点：" prop="serviceParamsMap.binding" v-if="formData.defineFileType === 'wsdl'">
          <el-select v-model="formData.serviceParamsMap.binding" clearable placeholder="请选择" style="width: 100%;">
            <el-option v-for="item in bindingList" :key="item.name" :label="item.name" :value="item.name">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <choose-resourcefile-dialog v-model="resourcefileVisible" @confirm="handleResourcefile" />
  </div>
</template>

<script>
import ChooseResourcefileDialog from '@/components/resourcefile/ChooseResourcefileDialog'
import EsbServiceInfoMixins from '@/mixins/esb_service_info_mixins'
export default {
  mixins: [EsbServiceInfoMixins],
  name: 'MessageDefinition',
  components: {
    ChooseResourcefileDialog
  },
  data() {
    return {
      httpMethod: []
    }
  },
  props: {
    formData: {
      type: Object,
      default() {
        return {}
      }
    },
    httpMethodArr: {
      type: Array,
      default() {
        return []
      }
    }
  },
  watch: {
    httpMethodArr: {
      handler: function(val) {
        this.httpMethod = JSON.parse(JSON.stringify(val))
      },
      deep: true
    },
    formData: {
      handler: function(val) {
        this.$emit('input', val)
      },
      deep: true
    }
  }
}
</script>
