feat(evaluation): add evaluation resource display (#1211)

* feat(evaluation): add evaluation resource display

* feat(evaluation): add evaluation resource display

---------

Co-authored-by: 申永范-UX <[email protected]>

Author: youngbeom-shin

frontend/src/components/__tests__/evaluations/EvaluationDetail.spec.js

@@ -39,9 +39,12 @@ describe('EvaluationDetail', () => {
   })
 
   it('renders evaluation details correctly', async () => {
-    const dateElement = wrapper.find('.text-gray-700.text-base')
+    const allGrayTextElements = wrapper.findAll('.text-gray-700.text-base')
+    const dateElement = allGrayTextElements.find(el =>
+      el.text() === '2021-10-01'
+    )
     expect(wrapper.find('.text-2xl').text()).toBe('task1')
-    expect(dateElement.text()).toBe('2021-10-01')
+    expect(dateElement?.text()).toBe('2021-10-01')
     expect(wrapper.text()).includes('desc1')
   })
 

frontend/src/components/evaluations/EvaluationDetail.vue

@@ -25,16 +25,7 @@
           >
         </div>
 
-        <div class="flex items-center gap-5 mb-4">
-          <div class="flex items-center">
-            <div class="text-gray-500 text-base mr-1">
-              {{ $t('evaluation.detail.creationTime') }}:
-            </div>
-            <div class="text-gray-700 text-base">
-              {{ formatDate(evaluation.submit_time) }}
-            </div>
-          </div>
-          <SvgIcon name="vertical_divider" />
+        <div class="flex flex-wrap items-center gap-5 mb-4">
           <div class="flex items-center">
             <div class="text-gray-500 text-base mr-1">
               {{ $t('evaluation.detail.evaluationModel') }}:
@@ -45,12 +36,30 @@
             >
               <a
                 :href="`/models/${evaluation.repo_ids[0]}`"
-                class="text-brand-700 underline"
+                class="text-brand-700 hover:underline"
               >
                 {{ evaluation.repo_ids[0].split('/')[1] }}
               </a>
             </div>
           </div>
+          <SvgIcon name="vertical_divider" />
+          <div class="flex items-center">
+            <div class="text-gray-500 text-base mr-1">
+              {{ $t('evaluation.detail.evaluationResource') }}:
+            </div>
+            <div class="text-gray-700 text-base">
+              {{ evaluation.resource_name }}
+            </div>
+          </div>
+          <SvgIcon name="vertical_divider" />
+          <div class="flex items-center">
+            <div class="text-gray-500 text-base mr-1">
+              {{ $t('evaluation.detail.creationTime') }}:
+            </div>
+            <div class="text-gray-700 text-base">
+              {{ formatDate(evaluation.submit_time) }}
+            </div>
+          </div>
         </div>
 
         <div

frontend/src/locales/en_js/evaluation.js

@@ -35,6 +35,7 @@ export const evaluation = {
     model: "Model",
     creationTime: "Creation Time",
     evaluationModel: "Evaluation Model",
+    evaluationResource: "Evaluation Resource",
     desc: "Description",
     dataset: "Dataset",
     metrics: "Metrics",

frontend/src/locales/zh_hant_js/evaluation.js

@@ -35,6 +35,7 @@ export const evaluation = {
     model: "模型",
     creationTime: "建立時間",
     evaluationModel: "評測模型",
+    evaluationResource: "評測資源",
     desc: "評測描述",
     dataset: "資料集",
     metrics: "指標",

frontend/src/locales/zh_js/evaluation.js

@@ -35,6 +35,7 @@ export const evaluation = {
     model: "模型",
     creationTime: "创建时间",
     evaluationModel: "评测模型",
+    evaluationResource: "评测资源",
     desc: "评测描述",
     dataset: "数据集",
     metrics: "指标",