diff --git a/src/pages/storage/containers/Volume/Detail/BaseDetail.jsx b/src/pages/storage/containers/Volume/Detail/BaseDetail.jsx
index 7e214aec..ecafe08e 100644
--- a/src/pages/storage/containers/Volume/Detail/BaseDetail.jsx
+++ b/src/pages/storage/containers/Volume/Detail/BaseDetail.jsx
@@ -19,10 +19,14 @@ import Base from 'containers/BaseDetail';
 export class BaseDetail extends Base {
   get leftCards() {
     const cards = [this.attachmentsCard];
-    if (this.detailData.volume_image_metadata) {
+    const { snapshot_id, volume_image_metadata, transfer } = this.detailData;
+    if (snapshot_id) {
+      cards.push(this.snapshotCard);
+    }
+    if (volume_image_metadata) {
       cards.push(this.imageCard);
     }
-    if (this.detailData.transfer) {
+    if (transfer) {
       cards.push(this.transferCard);
     }
     return cards;
@@ -42,7 +46,7 @@ export class BaseDetail extends Base {
               {it.device} on{' '}
               {this.getLinkRender(
                 'instanceDetail',
-                it.server_name,
+                it.server_name || it.server_id,
                 { id: it.server_id },
                 { tab: 'volumes' }
               )}
@@ -60,6 +64,7 @@ export class BaseDetail extends Base {
   get imageCard() {
     const {
       volume_image_metadata: { image_id, image_name },
+      snapshot_id,
     } = this.detailData;
     const options = [
       {
@@ -69,6 +74,29 @@ export class BaseDetail extends Base {
           this.getLinkRender('imageDetail', image_name, { id: image_id }, null),
       },
     ];
+    const title = snapshot_id ? t('Image Info') : t('Volume Source');
+
+    return {
+      title,
+      options,
+    };
+  }
+
+  get snapshotCard() {
+    const { snapshot_id } = this.detailData;
+    const options = [
+      {
+        label: t('Volume Snapshot'),
+        dataIndex: 'snapshot.name',
+        render: (value) =>
+          this.getLinkRender(
+            'snapshotDetail',
+            value || snapshot_id,
+            { id: snapshot_id },
+            null
+          ),
+      },
+    ];
 
     return {
       title: t('Volume Source'),
diff --git a/src/stores/cinder/volume.js b/src/stores/cinder/volume.js
index c248f558..42121fc0 100644
--- a/src/stores/cinder/volume.js
+++ b/src/stores/cinder/volume.js
@@ -111,6 +111,11 @@ export class VolumeStore extends Base {
       item.itemInList = result[0];
       item.attachmentsContrib = result[0].attachments;
     } catch (e) {}
+    const { snapshot_id } = item;
+    if (snapshot_id) {
+      const snapshot = await client.cinder.snapshots.show(snapshot_id);
+      item.snapshot = snapshot.snapshot;
+    }
     return item;
   }