<template>
  <el-input v-model="input" style="width: 240px" placeholder="Please input" />
</template>

<script lang="ts" setup>
import { ref } from 'vue'
const input = ref('')
</script>

<script setup>
import { reactive } from 'vue'

const typeMap = {
  mail: '郵件',
  notify: '端外',
  sms: '簡訊'
}

const form = reactive({
  msgType: 'notify'  // 或從後端拿到的值
})
</script>

<template>
  <el-form-item label="發送類型">
    <el-input
      :model-value="typeMap[form.msgType] || form.msgType"
      disabled
      style="width: 50%;"
    />
  </el-form-item>
</template>