<template>
    <a-form-model-item :label="attr.name" :prop="attr.alias">
        <a-input-password v-if="setting.type === 'password'"
                          :value="modelVal"
                          :disabled="disabled"
                          :maxLength="maxLength"
                          :placeholder="placeholder"
                          @change="change">

        </a-input-password>
        <a-input
            v-else
            type="textType"
            :value="modelVal"
            :disabled="disabled"
            :maxLength="maxLength"
            :placeholder="placeholder"
            @change="change">
        </a-input>
    </a-form-model-item>
</template>

<script>
export default {
    name: "mix-text",
    model: {
        prop: "modelVal",
        event: 'change'
    },
    props: {
        modelVal: "",
        attr: {
            type: Object,
            default: () => {
            }
        }
    },
    data() {
        return {
            textType: 'text',
            setting: {
                is_allow_null: true,
                type: 'text',
                max_length: 255,
                tip: "请输入"
            },
            disabled: false,
            maxLength: 255,
            placeholder: ""
        }
    },
    created() {
        this.setting = this.attr.setting
        this.setDisable(this.attr.display)
        this.setPlaceholder(this.attr.tip);
        this.setMaxLength(this.setting.max_length)
        if (this.setting.type === 'password') {
            this.textType = 'password'
        }
    },
    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;
            }
        },
        setPlaceholder(tip){
            this.placeholder = tip ? tip : "请输入"
        },
        setMaxLength(maxLength) {
            this.maxLength = maxLength ? maxLength : 255
        },
        change(e) {
            let myValue = e.target.value;
            this.$emit('change', myValue);
        }
    }
}
</script>

<style scoped>

</style>
