diff --git a/ruoyi-ui/src/api/ccdiCreditInfo.js b/ruoyi-ui/src/api/ccdiCreditInfo.js
index 3fba3963..d3fe2b42 100644
--- a/ruoyi-ui/src/api/ccdiCreditInfo.js
+++ b/ruoyi-ui/src/api/ccdiCreditInfo.js
@@ -4,6 +4,9 @@ export function uploadCreditHtml(data) {
   return request({
     url: '/ccdi/creditInfo/upload',
     method: 'post',
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    },
     data
   })
 }
diff --git a/ruoyi-ui/src/views/ccdiCreditInfo/index.vue b/ruoyi-ui/src/views/ccdiCreditInfo/index.vue
index 6eb94897..faf632fa 100644
--- a/ruoyi-ui/src/views/ccdiCreditInfo/index.vue
+++ b/ruoyi-ui/src/views/ccdiCreditInfo/index.vue
@@ -61,8 +61,8 @@
       <el-table-column label="行政处罚笔数" prop="admCnt" align="center" width="120" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
         <template slot-scope="scope">
-          <el-button size="mini" type="text" icon="el-icon-view">详情</el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete">删除</el-button>
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.row)">详情</el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -126,11 +126,52 @@
         <el-button type="primary" :loading="uploadSubmitting" @click="handleUploadSubmit">上 传</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog title="征信详情" :visible.sync="detailDialogVisible" width="960px" append-to-body>
+      <div class="section-title">征信摘要</div>
+      <el-row :gutter="16" class="detail-summary">
+        <el-col :span="8">征信查询日期：{{ detailForm.queryDate || "-" }}</el-col>
+        <el-col :span="8">负债笔数：{{ detailForm.debtCount || 0 }}</el-col>
+        <el-col :span="8">负债总额：{{ detailForm.debtTotalAmount || 0 }}</el-col>
+      </el-row>
+
+      <div class="section-title">负面信息</div>
+      <el-row :gutter="16" class="detail-summary">
+        <el-col :span="8">民事案件笔数：{{ detailForm.civilCnt || 0 }}</el-col>
+        <el-col :span="8">强制执行笔数：{{ detailForm.enforceCnt || 0 }}</el-col>
+        <el-col :span="8">行政处罚笔数：{{ detailForm.admCnt || 0 }}</el-col>
+      </el-row>
+      <el-row :gutter="16" class="detail-summary">
+        <el-col :span="8">民事案件金额：{{ detailForm.negativeInfo.civilLmt || 0 }}</el-col>
+        <el-col :span="8">强制执行金额：{{ detailForm.negativeInfo.enforceLmt || 0 }}</el-col>
+        <el-col :span="8">行政处罚金额：{{ detailForm.negativeInfo.admLmt || 0 }}</el-col>
+      </el-row>
+
+      <div class="section-title">负债信息</div>
+      <el-table :data="detailForm.debts || []" size="mini">
+        <el-table-column label="负债大类" prop="debtMainType" min-width="120" />
+        <el-table-column label="负债小类" prop="debtSubType" min-width="120" />
+        <el-table-column label="债权人类型" prop="creditorType" min-width="120" />
+        <el-table-column label="负债名称" prop="debtName" min-width="180" />
+        <el-table-column label="负债本金余额" prop="principalBalance" min-width="120" />
+        <el-table-column label="负债总额" prop="debtTotalAmount" min-width="120" />
+        <el-table-column label="负债状态" prop="debtStatus" min-width="120" />
+      </el-table>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="detailDialogVisible = false">关 闭</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listCreditInfo, uploadCreditHtml } from "@/api/ccdiCreditInfo";
+import {
+  deleteCreditInfo,
+  getCreditInfoDetail,
+  listCreditInfo,
+  uploadCreditHtml,
+} from "@/api/ccdiCreditInfo";
 
 export default {
   name: "CcdiCreditInfo",
@@ -149,6 +190,17 @@ export default {
         failureCount: 0,
       },
       failureList: [],
+      detailDialogVisible: false,
+      detailForm: {
+        queryDate: undefined,
+        debtCount: 0,
+        debtTotalAmount: 0,
+        civilCnt: 0,
+        enforceCnt: 0,
+        admCnt: 0,
+        negativeInfo: {},
+        debts: [],
+      },
       queryParams: {
         pageNum: 1,
         pageSize: 10,
@@ -243,6 +295,38 @@ export default {
           this.uploadSubmitting = false;
         });
     },
+    handleDetail(row) {
+      return getCreditInfoDetail(row.idCard).then((response) => {
+        const data = response.data || {};
+        const negativeInfo = data.negativeInfo || {};
+        this.detailForm = {
+          personId: data.personId || row.idCard,
+          personName: data.personName || row.name,
+          queryDate: negativeInfo.queryDate || row.queryDate,
+          debtCount: row.debtCount || (data.debtList || []).length,
+          debtTotalAmount: row.debtTotalAmount || 0,
+          civilCnt: negativeInfo.civilCnt || row.civilCnt || 0,
+          enforceCnt: negativeInfo.enforceCnt || row.enforceCnt || 0,
+          admCnt: negativeInfo.admCnt || row.admCnt || 0,
+          negativeInfo,
+          debts: data.debtList || [],
+        };
+        this.detailDialogVisible = true;
+      });
+    },
+    handleDelete(row) {
+      const personId = row.idCard;
+      this.$modal
+        .confirm("确认删除该员工当前已维护的征信信息吗？")
+        .then(() => {
+          return deleteCreditInfo(personId);
+        })
+        .then(() => {
+          this.$modal.msgSuccess("删除成功");
+          this.detailDialogVisible = false;
+          this.getList();
+        });
+    },
   },
 };
 </script>
@@ -270,6 +354,11 @@ export default {
   margin-bottom: 16px;
 }
 
+.detail-summary {
+  margin-bottom: 16px;
+  line-height: 32px;
+}
+
 .summary-item {
   padding: 12px 16px;
   background: #f5f7fa;
diff --git a/ruoyi-ui/tests/unit/credit-info-detail-ui.test.js b/ruoyi-ui/tests/unit/credit-info-detail-ui.test.js
new file mode 100644
index 00000000..09d9b506
--- /dev/null
+++ b/ruoyi-ui/tests/unit/credit-info-detail-ui.test.js
@@ -0,0 +1,27 @@
+const assert = require("assert");
+const fs = require("fs");
+const path = require("path");
+
+const componentPath = path.resolve(
+  __dirname,
+  "../../src/views/ccdiCreditInfo/index.vue"
+);
+const source = fs.readFileSync(componentPath, "utf8");
+
+[
+  "detailDialogVisible",
+  "detailForm",
+  "负债信息",
+  "负面信息",
+  "civilCnt",
+  "enforceCnt",
+  "admCnt",
+  "handleDetail",
+  "handleDelete",
+  "deleteCreditInfo",
+  "确认删除该员工当前已维护的征信信息吗？",
+].forEach((token) => {
+  assert(source.includes(token), `详情或删除交互缺少关键结构: ${token}`);
+});
+
+console.log("credit-info-detail-ui test passed");