<template>
    <div class="input-wrap">
        <div class="input-text" @click="showEdit" v-show="!editVisible">
            {{ value }}
        </div>
        <div class="input-edit" v-show="editVisible">
            <el-input
                v-model="value"
                type="text"
                :placeholder="property.placeholder"
                :maxlength="property.maxlength"
                v-bind="$attrs"
                v-on="$listeners"
                @input="filterValue"
                @blur="editSubmit('blur')"
                @keyup.enter.native="editSubmit('enter')"
                ref="editInput"
            />
        </div>
    </div>
</template>

<script>
import mixin from "./mixin"
export default {
    name: "view-edit-input",
    mixins:[mixin],
    data(){
      return {
          property:{
              placeholder:"请输入"
          }
      }
    },
    created() {
    },
    methods:{
        /**
         * 初始化
         */
        init(){

        },
        /**
         * 聚焦edit
         * @returns {Promise<void>}
         */
        async focusEdit(){
           let editInput = await this.getRef("editInput");
            editInput.focus();
        },
        filterValue(){

        },
        editSubmit(){
            this.showView();
            this.change();
        }
    }
}
</script>

<style scoped>

</style>
