2
0
Quellcode durchsuchen

💄 style(exam): 优化考试卡片布局和信息展示

- 移除日期显示,精简信息展示区域
- 将用户信息网格布局从2列改为1列,提升移动端显示效果
- 调整表格布局,减少列数,移除训练日期列
- 优化表格内容网格布局,从8列调整为7列以适应新的表格结构
yourname vor 6 Monaten
Ursprung
Commit
90b112994c
1 geänderte Dateien mit 3 neuen und 7 gelöschten Zeilen
  1. 3 7
      src/client/mobile/components/Exam/ExamCard.tsx

+ 3 - 7
src/client/mobile/components/Exam/ExamCard.tsx

@@ -270,7 +270,6 @@ export default function ExamCard() {
           <div className="flex justify-center space-x-4 text-gray-600">
             {isStarted ? (
               <>
-                <span>日期: {currentDate}</span>
                 <span>价格: {currentPrice}</span>
               </>
             ) : (
@@ -319,15 +318,13 @@ export default function ExamCard() {
 
         {/* 信息显示 */}
         <div className="bg-white p-6 rounded-lg shadow-md">
-          <div className="grid grid-cols-2 gap-4 mb-4">
+          <div className="grid grid-cols-1 gap-4 mb-4">
             <div className="text-gray-600">昵称: {user?.username || '未知用户'}</div>
-            <div className="text-gray-600">代码: {classroomData.code}</div>
           </div>
 
           {/* 表格头部 */}
-          <div className="grid grid-cols-8 gap-4 py-2 border-b border-gray-200 text-sm font-medium text-gray-600">
+          <div className="grid grid-cols-7 gap-4 py-2 border-b border-gray-200 text-sm font-medium text-gray-600">
             <div>序</div>
-            <div>训练日期</div>
             <div>持股</div>
             <div>持币</div>
             <div>价格</div>
@@ -339,9 +336,8 @@ export default function ExamCard() {
           {/* 表格内容 */}
           <div className="max-h-60 overflow-y-auto">
             {[...answerRecords].reverse().map((record: AnswerRecord) => (
-              <div key={record.date} className="grid grid-cols-8 gap-4 py-2 text-sm text-gray-800 hover:bg-gray-50">
+              <div key={record.date} className="grid grid-cols-7 gap-4 py-2 text-sm text-gray-800 hover:bg-gray-50">
                 <div>{record.index}</div>
-                <div>{dayjs(record.date).format('YYYY-MM-DD')}</div>
                 <div className="text-red-500">{record.holdingStock}</div>
                 <div className="text-green-500">{record.holdingCash}</div>
                 <div>{record.price}</div>