
<template>
  <div v-show="myConfig.visible">
    <Input
      ref="myControl"
      v-model="value"
      :size="myConfig.size"
      :type="myConfig.vtype"
      :password="passwordFlag"
      :rows="myConfig.rows"
      :placeholder="myConfig.placeholder"
      :maxlength="myConfig.maxLength"
      :disabled="myConfig.readOnly"
      :clearable="myConfig.clearable"
      :readonly="!myConfig.allowInput"
      @keydown.enter.stop="_enterSetFatherValue"
       @keyup="keyUp"
      @on-blur="setFatherValue"
      :search="myConfig.search"
      @on-search="search"
    >
    <template v-if="myConfig.showAppend"  #append>
    <Button :size="myConfig.size" type="primary"  :disabled="myConfig.readOnly" @click="appendClick">{{myConfig.appendText}}</Button>
    </template>
    </Input>
  </div>
</template>
<script>
import Base from '@/components/base/controlbase.vue';
export default {
  name: 'textbox',
  extends: Base,
  components: {},
  data() {
    return {
      myConfig: {
        maxLength: null,
        vtype: 'text',
        defaultValue: '',
        rows: 3,
        clearable: false,
        appendWidth:80,
        search: false,
        allowInput: true,
        showAppend:false,
        notSpecial:false
      },
      passwordFlag: false,
    };
  },
  methods: {
     keyUp(e)  {
        if (this.myConfig.notSpecial) {
            e.target.value = e.target.value.replace(/[`~!@$%^&*()_\-+=<>?:"{}|,\/;'\\[\]·~！@￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '')
        }
    },
    customInit() {
      if (this.myConfig.vtype === 'password') {
        this.passwordFlag = true;
        if (this.myConfig.passwordFlag !== undefined) {
          this.passwordFlag = this.myConfig.passwordFlag;
        }
      } else {
        this.passwordFlag = false;
      }
    },
    _enterSetFatherValue() {
        if (this.myConfig.vtype !== 'textarea') {
            this.isEnter = true;
        }  
        this.setFatherValue();
    },
    search() {
      if (this.myConfig.onSearch) {
        if (this.myConfig.readOnly !== true) {
          let that = this;
          let temp = {};
          temp.control = that;
          temp.name = this.myConfig.name;
          this.myConfig.onSearch(temp);
        }
      }
    },
    appendClick() {
      if (this.myConfig.onAppend) {
        this.myConfig.onAppend();
      }
    },
    setFocus(value) {
      if (value) {
        this.$refs.myControl.focus();
      } else {
         this.$refs.myControl.blur();
      }
    }
  },
};
</script>