<template>
  <div>
    <cms-form-input
      v-if="componentType === 1"
      v-model="inputValue"
      :placeholder="placeholder"
    />
    <cms-form-select
      :form-model="formModel"
      :placeholder="placeholder"
      :select-data="selectData"
      :select-key="selectKey"
      v-model="inputValue"
      v-if="componentType === 2">
    </cms-form-select>
    <cms-date-picker
      :placeholder="placeholder"
      v-model="inputValue"
      type="date" auto-complete="off"
      format="yyyy-MM-dd"
      value-format="yyyy-MM-dd"
      v-if="componentType === 3">
    </cms-date-picker>
    <cms-org-info-magnifier
      :placeholder="placeholder"
      :form-model="formModel"
      :match-key="matchKey"
      v-model="inputValue"
      :magnifier-title="$t('common.column.orgTitle')"
      v-if="componentType === 4">
    </cms-org-info-magnifier>
    <cms-branch-magnifier
      :placeholder="placeholder"
      :form-model="formModel"
      :match-key="matchKey"
      :magnifier-title="$t('common.column.branchTitle')"
      :query="{}"
      v-model="inputValue"
      v-if="componentType === 5"
    />
    <cms-account-magnifier
      :placeholder="placeholder"
      :form-model="formModel"
      :match-key="matchKey"
      v-model="inputValue"
      :magnifier-title="$t('common.column.acctTitle')"
      :query="{}"
      v-if="componentType === 6">
    </cms-account-magnifier>
    <cms-form-input
      v-if="componentType === 7"
      v-model="inputValue"
      @input="onVerifyNumberComma($event)"
      :placeholder="placeholder"
    />
    <cms-radio-group
      v-model="inputValue"
      :radio-data="selectData"
      v-if="componentType === 8"
      :radio-key="selectKey">
    </cms-radio-group>
  </div>
</template>

<script>
import HttpService from "@/utils/HttpService";
import CmsAccountMagnifier from "../CmsAccountMagnifier/CmsAccountMagnifier";
import { verifyNumberComma } from "@/utils/toolsValidate";

export default {
  name: "CmsFormMultiple",
  components: { CmsAccountMagnifier },
  data() {
    return {
      requestCall: undefined
    }
  },
  methods: {
    onVerifyNumberComma(val) {
      this.inputValue = verifyNumberComma(val);
    },
  },
  async created() {
    if (this.requestUrl && (this.componentType === 4 || this.componentType === 5 || this.componentType === 6))
      this.requestCall = HttpService.post(this.requestUrl, {}, { loading: true });
  },
  mounted() {
    if (!this.inputValue && this.defaultValue) {
      if (this.defaultValueType === 1) {
        this.inputValue = parseInt(this.defaultValue);
      } else {
        this.inputValue = this.defaultValue;
      }
    }
  },
  computed: {
    inputValue: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit("input", val);
      }
    }
  },
  props: {
    // 组件类型， 默认是文本框
    componentType: {
      type: [ Number ],
      default: () => {
        return 1;
      }
    },
    // 组件值
    value: {
      type: [ Number, String, Array, Boolean ],
      default: () => {
        return "";
      }
    },
    placeholder: String,
    // 数据对象
    formModel: Object,
    // 默认值
    defaultValue: [ String, Boolean, Number, Array ],
    // 默认值类型
    defaultValueType: [ Number ],
    // 放大镜回调事件
    confirm: Function,
    // 如果是放大镜则参数必传, 请求地址
    requestUrl: String,
    /** 下拉选择对象 */
    selectData: {
      type: Object,
      default: () => {
        return {};
      },
    },
    /** 下拉选择对象的KEY值 */
    selectKey: String,
    matchKey: {
      type: Object,
      default: () => {
        return {};
      },
    },
  }
}
</script>

<style scoped>

</style>
