DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-mpui/learun-ui-mp/chat-input.vue

<template>
  <view :style="[{ bottom: inputBottom + 'px' }]" class="cu-bar foot input">
    <input
      @focus="inputFocus"
      @blur="inputBlur"
      @input="input"
      @confirm="sendClick"
      :value="value"
      :adjust-position="false"
      :enableNative="false"
      :focus="false"
      :placeholder="placeholder"
      :disabled="inputDisabled"
      :confirm-hold="confirmHold"
      cursor-spacing="10"
      class="solid-bottom"
      confirm-type="send"
      type="text"
    />
    <slot name="action">
      <button @click="sendClick" :disabled="buttonDisabled" class="cu-btn bg-green shadow">发送</button>
    </slot>
  </view>
</template>

<script>
export default {
  name: 'l-chat-input',

  props: {
    value: {},
    placeholder: {},
    inputDisabled: {},
    buttonDisabled: {},
    confirmHold: {}
  },

  data() {
    return { inputBottom: 0 }
  },

  methods: {
    input(e) {
      this.$emit('input', e.detail.value)
      this.$emit('change', e.detail.value)
    },

    inputFocus(e) {
      this.inputBottom = e.detail.height
      this.$emit('focus')
    },

    inputBlur(e) {
      this.inputBottom = 0
      this.$emit('blur')
    },

    sendClick(e) {
      this.$emit('sendMsg', this.value)
    }
  }
}
</script>