<!--
@name: 扩展字段支持
@author: 张泽贤
@time: 2022-03-28
-->
<template>
  <div>
    <a-row>
      <a-col :span="6" v-for="(item, index) in mextendedField_list" :key="index">
        <p-form-model-item :label="item.displayName" :prop="item.fieldName">
          <div v-if="isDisabled">{{ form[item.fieldName] }}</div>
          <p-input v-model="form[item.fieldName]" :disabled="isDisabled" v-else-if="item.fieldType === '1'" />
          <p-input-number v-model="form[item.fieldName]" :disabled="isDisabled" v-else-if="item.fieldType === '2'" />
          <p-date-picker show-time valueFormat="YYYY-MM-DD HH:mm:ss" v-model="form[item.fieldName]" :disabled="isDisabled" v-else-if="item.fieldType === '3'" />
          <p-select
            v-model="form[item.fieldName]"
            :options="
              item.fieldChoiceValue.split(',').map((item) => {
                return {
                  value: item,
                  label: item,
                }
              })
            "
            allowClear
            :disabled="isDisabled"
            v-else-if="item.fieldType === '4'"
          />
        </p-form-model-item>
      </a-col>
    </a-row>
  </div>
</template>

<script>
export default {
  props: {
    type: '',
    mextendedField_list: {
      type: Array,
      default: () => [],
    },
    form: {
      type: Object,
      default: () => ({}),
    },
  },
  computed: {
    isDisabled() {
      if (this.type.includes('view') || this.type.includes('View')) {
        return true
      }
      return false
    },
  },
  methods: {},
}
</script>

<style lang="less" scoped>
::v-deep .ant-input-number {
  width: 100%;
}

::v-deep .ant-calendar-picker {
  width: 100%;
}
</style>
