DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-mpui/learun-ui-ali/textarea.vue

<template>
  <view v-if="!simpleMode" :class="className" :style="style">
    <view class="cu-form-group" style="border-bottom: none; padding-bottom: 0;">
      <view class="title">
        <text v-if="required" style="color: red; font-size: 1.2em;">*</text>
        {{ title || '' }}
      </view>
    </view>

    <view class="cu-form-group" style="position: relative;border-top: none">
      <textarea
        @input="textareaInput"
        :maxlength="maxlength"
        :placeholder="displayPlaceHolder"
        :value="value"
        :auto-height="autoHeight"
        :disabled="readonly"
        :enableNative="false"
        style="margin-top: 0; border-top: none"
        controlled
      ></textarea>
    </view>
  </view>

  <view v-else :class="className" :style="style" class="cu-form-group" style="position: relative;">
    <textarea
      @input="textareaInput"
      :maxlength="maxlength"
      :placeholder="displayPlaceHolder"
      :fixed="fixed"
      :value="value"
      :style="textareaStyle"
      :auto-height="autoHeight"
      :disabled="readonly"
      :enableNative="false"
      controlled
    ></textarea>
  </view>
</template>

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

  props: {
    maxlength: { default: -1 },
    readonly: {},
    placeholder: {},
    fixed: {},
    value: {},
    textareaStyle: {},
    autoHeight: {},
    simpleMode: {},
    required: {},
    title: {},
    disabled: {}
  },

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

  computed: {
    displayPlaceHolder() {
      if (this.readonly) {
        return ''
      }

      if (this.placeholder) {
        return this.placeholder
      }

      return !this.simpleMode && this.title ? `请输入${this.title}` : '请输入…'
    }
  }
}
</script>