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>