diff --git a/src/views/mes/cal/calendar/CalendarTypeView.vue b/src/views/mes/cal/calendar/CalendarTypeView.vue
index d37f0b4ee..dc044be20 100644
--- a/src/views/mes/cal/calendar/CalendarTypeView.vue
+++ b/src/views/mes/cal/calendar/CalendarTypeView.vue
@@ -1,19 +1,20 @@
 <!-- 排班日历 - 按分类视图 -->
+<!-- todo @ai：是不是去掉开头的 calendar，因为大家都是呀 -->
 <template>
   <div class="flex">
     <!-- 左侧：班组类型选择 -->
-    <div class="w-150px mr-10px">
-      <el-radio-group v-model="selectedType" class="flex flex-col" @change="onTypeSelected">
-        <el-radio-button
-          v-for="dict in getIntDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE)"
-          :key="dict.value"
-          :value="dict.value"
-          class="!rounded-0 !border-b-1px !border-b-solid !border-b-gray-200"
-        >
-          {{ dict.label }}
-        </el-radio-button>
-      </el-radio-group>
+    <div class="w-150px shrink-0 mr-12px border border-solid border-#dcdfe6 rounded-4px overflow-hidden">
+      <div
+        v-for="dict in getIntDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE)"
+        :key="dict.value"
+        class="px-16px py-10px cursor-pointer text-14px text-#606266 border-b border-b-solid border-b-#ebeef5 last:border-b-0 hover:bg-#f5f7fa transition-colors"
+        :class="selectedType === dict.value ? 'bg-#ecf5ff text-#409eff font-500' : ''"
+        @click="selectedType = dict.value; onTypeSelected()"
+      >
+        {{ dict.label }}
+      </div>
     </div>
+
     <!-- 右侧：日历 -->
     <div class="flex-1">
       <el-calendar v-model="currentDate" v-loading="loading">
@@ -104,7 +105,9 @@ const getHolidayList = async () => {
 
 /** 查询排班日历 */
 const fetchCalendar = async () => {
-  if (!selectedType.value) return
+  if (!selectedType.value) {
+    return
+  }
   loading.value = true
   try {
     // 计算当前月份的起止日期
@@ -192,7 +195,7 @@ const hasFestival = (day: string): boolean => {
   return !!(info.solarFestival || info.lunarFestival || info.termName)
 }
 
-// 监听月份变化
+/** 监听月份变化 */
 watch(currentDate, () => {
   if (selectedType.value) {
     fetchCalendar()
diff --git a/src/views/mes/cal/calendar/PersonView.vue b/src/views/mes/cal/calendar/PersonView.vue
index 663729d2e..e6bf424c5 100644
--- a/src/views/mes/cal/calendar/PersonView.vue
+++ b/src/views/mes/cal/calendar/PersonView.vue
@@ -1,9 +1,11 @@
 <!-- 排班日历 - 按个人视图 -->
+<!-- TODO @AI: user > person 文件名 -->
 <template>
   <div>
     <!-- 顶部：用户选择 -->
     <el-form :inline="true" label-width="80px" class="mb-10px">
       <el-form-item label="用户编号">
+        <!-- TODO @AI：下拉选择； -->
         <el-input-number
           v-model="userId"
           placeholder="请输入用户编号"
@@ -19,6 +21,7 @@
       </el-form-item>
     </el-form>
     <!-- 日历 -->
+
     <el-calendar v-model="currentDate" v-loading="loading">
       <template #date-cell="{ data }">
         <div class="h-full p-4px">
diff --git a/src/views/mes/cal/calendar/TeamView.vue b/src/views/mes/cal/calendar/TeamView.vue
index 1abfe00c8..7792b3841 100644
--- a/src/views/mes/cal/calendar/TeamView.vue
+++ b/src/views/mes/cal/calendar/TeamView.vue
@@ -2,18 +2,18 @@
 <template>
   <div class="flex">
     <!-- 左侧：班组列表选择 -->
-    <div class="w-150px mr-10px">
-      <el-radio-group v-model="selectedTeamId" class="flex flex-col" @change="onTeamSelected">
-        <el-radio-button
-          v-for="team in teamList"
-          :key="team.id"
-          :value="team.id"
-          class="!rounded-0 !border-b-1px !border-b-solid !border-b-gray-200"
-        >
-          {{ team.name }}
-        </el-radio-button>
-      </el-radio-group>
+    <div class="w-150px shrink-0 mr-12px border border-solid border-#dcdfe6 rounded-4px overflow-hidden">
+      <div
+        v-for="team in teamList"
+        :key="team.id"
+        class="px-16px py-10px cursor-pointer text-14px text-#606266 border-b border-b-solid border-b-#ebeef5 last:border-b-0 hover:bg-#f5f7fa transition-colors"
+        :class="selectedTeamId === team.id ? 'bg-#ecf5ff text-#409eff font-500' : ''"
+        @click="selectedTeamId = team.id; onTeamSelected()"
+      >
+        {{ team.name }}
+      </div>
     </div>
+
     <!-- 右侧：日历 -->
     <div class="flex-1">
       <el-calendar v-model="currentDate" v-loading="loading">
diff --git a/src/views/mes/cal/calendar/index.vue b/src/views/mes/cal/calendar/index.vue
index dbb3bb370..d1f3e9189 100644
--- a/src/views/mes/cal/calendar/index.vue
+++ b/src/views/mes/cal/calendar/index.vue
@@ -2,6 +2,7 @@
 <template>
   <ContentWrap>
     <el-tabs v-model="activeTab" type="border-card">
+      <!-- TODO @AI：下面三个组件，都有日历，是不是可以复用下； -->
       <el-tab-pane label="按分类" name="type">
         <CalendarTypeView />
       </el-tab-pane>