// 不用枚舉：直接寫值，別人看不懂 200 啥意思
const successCode = 200;

// 用枚舉：語義清晰，一看就懂
enum HttpStatus {
  Success = 200,
  Error = 500
}

// 顯式賦值：每個(gè)成員指定數(shù)字
enum Weekday {
  Monday = 1,
  Tuesday = 2,
  Wednesday = 3
}

// 使用：直接通過 枚舉名.成員名 取值
const today = Weekday.Monday;
console.log(today); // 輸出 1

// 隱式遞增：Left=0, Right=1, Top=2, Bottom=3
enum Direction {
  Left,
  Right,
  Top,
  Bottom
}

console.log(Direction.Right); // 輸出 1

enum Weekday {
  Monday = 1
}

// 正向：名字 → 值
console.log(Weekday.Monday); // 1
// 反向：值 → 名字
console.log(Weekday[1]); // "Monday"

// 每個(gè)成員都要寫字符串值
enum UserRole {
  Admin = "ADMIN",
  Editor = "EDITOR",
  Viewer = "VIEWER"
}

// 使用
const role = UserRole.Admin;
console.log(role); // 輸出 "ADMIN"

// 字符串枚舉沒有反向映射，下面代碼會(huì)報(bào)錯(cuò)
console.log(UserRole["ADMIN"]); // undefined

// 常量枚舉
const enum Color {
  Red = "RED",
  Green = "GREEN"
}

// 使用
const myColor = Color.Green;

// 定義狀態(tài)碼枚舉
enum ApiStatus {
  Success = 200,
  NoAuth = 401,
  ServerError = 500
}

// 接口請(qǐng)求后判斷狀態(tài)
function handleResult(code: ApiStatus) {
  switch(code) {
    case ApiStatus.Success:
      console.log("請(qǐng)求成功");
      break;
    case ApiStatus.NoAuth:
      console.log("請(qǐng)先登錄");
      break;
    case ApiStatus.ServerError:
      console.log("服務(wù)器出錯(cuò)了");
      break;
  }
}

// 調(diào)用函數(shù)
handleResult(ApiStatus.NoAuth); // 輸出 "請(qǐng)先登錄"

// 性別枚舉
enum Gender {
  Male = "MALE",
  Female = "FEMALE"
}

// 轉(zhuǎn)成前端框架需要的選項(xiàng)格式
const genderOptions = [
  { label: "男", value: Gender.Male },
  { label: "女", value: Gender.Female }
];

// Vue 里用
// <el-select v-model="gender">
//   <el-option v-for="item in genderOptions" :key="item.value" :label="item.label" :value="item.value" />
// </el-select>