<template>
    <a-form-model-item :label="attr.name" :prop="attr.alias">
        <a-textarea
            :value="modelVal"
            :style="{height: textHeight}"
            :disabled="disabled"
        >
        </a-textarea>
    </a-form-model-item>
</template>

<script>
export default {
    name: "mix-textarea",
    model: {
        prop: "modelVal",
        event: 'change'
    },
    props: {
        modelVal: "",
        attr: {
            type: Object,
            default: () => {
            }
        }
    },
    data(){
        return {
            setting: {
                is_allow_null: true,
                text_height: "200px"
            },
            textHeight: '200px',
            disabled: false
        }
    },
    created() {
        this.setting = this.attr.setting
        this.setDisable(this.attr.display)
        this.setPlaceholder(this.setting.tip)
        this.setHeight(this.setting.text_height)
    },
    methods: {
        setDisable(display) {
            if (display === 'r' || display === 'v') {
                this.disabled = true;
            } else if (display === 'h') {
                this.textType = 'hidden';
            } else if (display === 'w') {
                this.disabled = false;
            }
        },
        setHeight(textHeight){
            if (textHeight){
                this.textHeight = textHeight + 'px'
            }
        },
        setPlaceholder(tip){
            this.placeholder = tip ? tip : "请输入"
        },
    }
}
</script>

<style scoped>

</style>
