feat: ai修复页面更新 & 依赖关系页面

src/views/Jyh/AIRepair/index.vue

@@ -1,4 +1,17 @@
 <template>
+  <div class="info-outside w-full">
+    <div class="info">
+      <div class="flex items-center justify-start w-full gap-1">
+        <img src="@/assets/imgs/jyh/aiIcon.png">
+        <span class="text-base font-medium">AI修复建议:</span>
+      </div>
+      <div>
+        <ul>
+          <li v-for="info in infoList">{{ info }}</li>
+        </ul>
+      </div>
+    </div>
+  </div>
   <div class="ai-container">
     <div class="ai-container-card" style="width: 100%;" v-for="(rowItem, index) in list" :key="index">
       <Panel :expand="rowItem.expand">
@@ -43,6 +56,7 @@
         <template #body>
           <div style="padding: 8px 20px 20px 20px; width: 100%;">
             <Table :tableConfig="tableConfig" :dataSource="rowItem.data.listData"/>
+            <div class="w-full flex items-center justify-end"><span>共{{ rowItem.data.listData.length }}条</span></div>
           </div>
         </template>
       </Panel>
@@ -55,6 +69,11 @@ import { ref } from 'vue';
 import Panel from '@/components/AIRepair/Panel.vue';
 import Table from '@/components/AIRepair/Table.vue';
 
+const infoList = ref([
+  '当前代码主要风险为易受常见的注入攻击，包括命令注入、SQL注入、表达式注入，针对每种攻击，应提供相应的防范措施，如数据校验、使用安全函数和限制程序权限。',
+  '相对上一次检查，【提升点】在于代码基础编码问题少了47.8%，问题总数降低29.3%；'
+])
+
 const tableConfig = ref([
   {
     field: 'securityProblemCode',
@@ -122,6 +141,44 @@ const list = ref([
       ]
     }
   },
+  {
+    expand: true,
+    data: {
+      listData: [
+      {
+          securityProblemCode: '1',
+          type: '安全问题',
+          CWEcode: 'CWE-123',
+          score: 100
+        },
+        {
+          securityProblemCode: '2',
+          type: '安全问题',
+          CWEcode: 'CWE-123',
+          score: 100
+        }
+      ]
+    }
+  },
+  {
+    expand: true,
+    data: {
+      listData: [
+      {
+          securityProblemCode: '1',
+          type: '安全问题',
+          CWEcode: 'CWE-123',
+          score: 100
+        },
+        {
+          securityProblemCode: '2',
+          type: '安全问题',
+          CWEcode: 'CWE-123',
+          score: 100
+        }
+      ]
+    }
+  },
   {
     expand: true,
     data: {
@@ -204,4 +261,26 @@ const list = ref([
   width: 14px;
   height: 14px;
 }
+
+.info-outside {
+  margin: 20px 0;
+  padding: 1px;
+  border-radius: 8px;
+  background-image: linear-gradient(134.79deg, #A4F7DF 0%, #A0CEFB 21%, #5F9AFE 43%, #D9B9FC 62%, #01EFBB 73%, #FBAE46 100%);
+}
+
+.info {
+  padding: 10px 20px;
+  border-radius: 8px;
+  background-color: #ffffff;
+  img {
+    width: 24px;
+    height: 24px;
+  }
+  ul {
+    list-style: disc;
+    padding-left: 18px;
+    line-height: 22px;
+  }
+}
 </style>