From 8ecc38befdedd899a7c5204485657261c6924d21 Mon Sep 17 00:00:00 2001
From: Cxx0822 <1556464090@qq.com>
Date: Mon, 3 Aug 2026 19:12:21 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=9B=B4=E6=96=B0=E8=B4=A6=E5=8D=95?=
 =?UTF-8?q?=E7=B1=BB=E5=88=AB=E9=80=89=E9=A1=B9=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Bill/BillDrawer.vue | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/Bill/BillDrawer.vue b/src/components/Bill/BillDrawer.vue
index 0386c8d..57a1bc8 100644
--- a/src/components/Bill/BillDrawer.vue
+++ b/src/components/Bill/BillDrawer.vue
@@ -32,13 +32,13 @@
         </div>
 
         <el-radio-group v-model="billStore.currentBillRecord.category" class="bill-category-group">
-          <el-radio v-for="(item, index) in billInfo.billCategoryList"
+          <el-radio-button v-for="(item, index) in billInfo.billCategoryList"
                     :value="item.name" :key="index">
             <template #default>
-              <i :class="item.icon" :style="{color: item.color}"/>
+              <i :class="item.icon"/>
               <span style="margin-left: 5px;">{{ item.name }}</span>
             </template>
-          </el-radio>
+          </el-radio-button>
         </el-radio-group>
 
         <div class="bill-gap"></div>
@@ -91,7 +91,7 @@ import { useBillStore } from '@/store/bill.ts'
 import { Location, Document } from '@element-plus/icons-vue'
 import { ElMessage, FormRules, UploadUserFile } from 'element-plus'
 import { billRecordRules } from '@/utils/element/elRules.ts'
-import { nextTick, onMounted, reactive, ref, watch } from 'vue'
+import { nextTick, reactive, ref, watch } from 'vue'
 import { IBillCategory } from '@/types/bill.ts'
 import { commonElMessageBox } from 'vue3-common/utils/elUtil'
 import NumberInput from '@/components/NumberInput.vue'
@@ -244,9 +244,14 @@ const deleteClick = () => {
     }
 
     .bill-category-group {
-      display: grid;
-      grid-template-columns: repeat(3, 1fr);
-      column-gap: 10px;
+      display: flex;
+      gap: 2px;
+
+      .el-radio-button {
+        .el-radio-button__inner {
+          border: none;
+        }
+      }
     }
 
     .bill-gap {