diff --git a/src/stores/Reservation.js b/src/stores/Reservation.js
index 52765a7..33f790c 100644
--- a/src/stores/Reservation.js
+++ b/src/stores/Reservation.js
@@ -53,23 +53,51 @@ class Reservation {
   }
 
   fetchReservation(reservationId) {
-    const fetchUrl = prepareUrl(HT_HOST + '/service-cusservice/GetPlanInfo')
+    const fetchDetailUrl = prepareUrl(HT_HOST + '/service-cusservice/GetPlanInfo')
       .append('VEI_SN', this.root.authStore.login.travelAgencyId)
       .append('GRI_SN', reservationId)
       .append("token", this.root.authStore.login.token)
       .build();
+    // https://p9axztuwd7x8a7.mycht.cn/service-fileServer/PlanChangeFileList
+    const fetchAttachmentUrl = prepareUrl(HT_HOST + '/service-fileServer/PlanChangeFileList')
+      .append('GRI_SN', reservationId)
+      .append("token", this.root.authStore.login.token)
+      .build();
 
-    return fetchJSON(fetchUrl)
+    const attachmentPromise = fetchJSON(fetchAttachmentUrl)
+      .then(json => {
+        if (json.errcode == 0) {
+          return json;
+        } else {
+          throw new Error(json.errmsg + ': ' + json.errcode);
+        }
+      });
+
+    const detailPromise = fetchJSON(fetchDetailUrl)
       .then(json => {
         if (json.errcode == 0) {
+          return json;
+        } else {
+          throw new Error(json.errmsg + ': ' + json.errcode);
+        }
+      });
+
+      return Promise.all([attachmentPromise, detailPromise])
+        .then(results => {
+          const attachList = results[0].result;
+          const planDetail = results[1].PlanDetail[0];
+          const planChange = results[1]?.PlanChange??[];
           runInAction(() => {
             this.reservationDetail = {
-              referenceNumber: json.PlanDetail[0].GRI_Name, 
-              tourGuide: json.PlanDetail[0].Guide, 
-              arrivalDate: json.PlanDetail[0].eoi_getdate,
+              referenceNumber: planDetail.GRI_Name, 
+              tourGuide: planDetail.Guide, 
+              arrivalDate: planDetail.eoi_getdate,
               reservationId: reservationId
             };
-            this.confirmationList = (json?.PlanChange??[]).map((data, index) => {
+            this.confirmationList = planChange.map((data, index) => {
+              const filterAttchList = attachList.filter(attch => {
+                return attch.PCI_SN === data.PCI_SN;
+              });
               return {
                 key: data.PCI_SN,
                 PCI_Changetext: data.PCI_Changetext,
@@ -77,15 +105,12 @@ class Reservation {
                 ConfirmPerson: data.ConfirmPerson,
                 PCI_ConfirmText: data.PCI_ConfirmText,
                 PCI_ConfirmDate: data.PCI_ConfirmDate,
-                VAS_SN: data.PCI_VAS_SN
+                VAS_SN: data.PCI_VAS_SN,
+                attachmentList: filterAttchList
               }
             });
           });
-          return json;
-        } else {
-          throw new Error(json.errmsg + ': ' + json.errcode);
-        }
-      });
+        });
   }
 
   fetchCityList(reservationId) {
diff --git a/src/views/reservation/Detail.jsx b/src/views/reservation/Detail.jsx
index 5f8c346..febb8ba 100644
--- a/src/views/reservation/Detail.jsx
+++ b/src/views/reservation/Detail.jsx
@@ -2,7 +2,10 @@ import { useParams, useNavigate } from "react-router-dom";
 import { useEffect, useState } from 'react';
 import { observer } from "mobx-react";
 import { toJS } from "mobx";
-import { Row, Col, Space, Button, Table, Input, Typography, Modal, App } from 'antd';
+import { Row, Col, Space, Button, Table, Input, Typography, Modal, Tag, App } from 'antd';
+import {
+  FileOutlined
+} from '@ant-design/icons';
 import { useStore } from '@/stores/StoreContext.js';
 
 const { Title, Paragraph } = Typography;
@@ -23,6 +26,10 @@ function Detail() {
       title: 'Confirmation Details',
       dataIndex: 'PCI_ConfirmText',
     },
+    {
+      title: 'Attachments',
+      render: attachmentRender
+    },
     {
       title: 'Confirmation Date',
       dataIndex: 'PCI_ConfirmDate',
@@ -33,6 +40,18 @@ function Detail() {
     },
   ];
     
+  function attachmentRender(text, confirm) {
+    return (
+      <>
+      {confirm.attachmentList.map(attch => {
+        return (
+          <Tag bordered={false} icon={<FileOutlined />}><a href={attch.file_url} target="_blank">{attch.file_name}</a></Tag>
+        )}
+      )}
+      </>
+    );
+  }
+    
   function confirmRender(text, confirm) {
     return (
       <Button type="link" onClick={() => showConfirmModal(confirm)}>Confirm</Button>