From 483e34c6fc0d10c1be19f0117ee63fa9cedec643 Mon Sep 17 00:00:00 2001
From: loganhz <logan@rancher.com>
Date: Mon, 10 Sep 2018 11:23:29 +0800
Subject: [PATCH] Improve pv list and pv detail page

https://github.com/rancher/rancher/issues/15450
---
 .../persistent-volumes/index/controller.js    |  6 ++
 .../persistent-volumes/index/template.hbs     |  7 ++
 .../cru-persistent-volume/template.hbs        | 84 +++++++++++++------
 .../form-node-affinity/template.hbs           |  2 +-
 app/models/persistentvolume.js                |  6 ++
 translations/en-us.yaml                       |  2 +
 6 files changed, 79 insertions(+), 28 deletions(-)

diff --git a/app/authenticated/cluster/storage/persistent-volumes/index/controller.js b/app/authenticated/cluster/storage/persistent-volumes/index/controller.js
index 053546e1d..2b959dd79 100644
--- a/app/authenticated/cluster/storage/persistent-volumes/index/controller.js
+++ b/app/authenticated/cluster/storage/persistent-volumes/index/controller.js
@@ -15,6 +15,12 @@ export const headers = [
     searchField:    'displayName',
     translationKey: 'generic.name',
   },
+  {
+    name:           'displayPvc',
+    sort:           ['displayPvc', 'sortName', 'id'],
+    searchField:    'displayPvc',
+    translationKey: 'cruPersistentVolume.pvc',
+  },
   {
     name:           'source',
     sort:           ['displaySource', 'name', 'id'],
diff --git a/app/authenticated/cluster/storage/persistent-volumes/index/template.hbs b/app/authenticated/cluster/storage/persistent-volumes/index/template.hbs
index 2f18a9b4e..e3716d509 100644
--- a/app/authenticated/cluster/storage/persistent-volumes/index/template.hbs
+++ b/app/authenticated/cluster/storage/persistent-volumes/index/template.hbs
@@ -30,6 +30,13 @@
       <td data-title="{{dt.name}}">
         <a href="{{href-to "authenticated.cluster.storage.persistent-volumes.detail" obj.id}}">{{obj.displayName}}</a>
       </td>
+      <td data-title="{{dt.displayPvc}}">
+        {{#if obj.displayPvc}}
+          {{obj.displayPvc}}
+        {{else}}
+          <div class="text-muted">{{t 'generic.na'}}</div>
+        {{/if}}
+      </td>
       <td data-title="{{dt.source}}">
         {{obj.displaySource}}
       </td>
diff --git a/app/components/cru-persistent-volume/template.hbs b/app/components/cru-persistent-volume/template.hbs
index e2c817c22..c5ea3b1bc 100644
--- a/app/components/cru-persistent-volume/template.hbs
+++ b/app/components/cru-persistent-volume/template.hbs
@@ -13,6 +13,9 @@
   {{#if model.description}}
     {{banner-message color='bg-secondary mb-0 mt-10' message=(linkify model.description)}}
   {{/if}}
+  {{#if model.showTransitioningMessage}}
+    <div class="{{model.stateColor}}"><p>{{uc-first model.transitioningMessage}}</p></div>
+  {{/if}}
 {{else}}
   {{form-name-description
     model=primaryResource
@@ -24,10 +27,39 @@
   }}
 {{/if}}
 
-<div class="row">
-  <div class="col span-6">
-    <label class="acc-label">{{t 'cruPersistentVolume.source.label'}}{{field-required editing=editing}}</label>
-    {{#if editing}}
+{{#if isView}}
+  <div class="row banner bg-info basics">
+    <div class="vertical-middle">
+      <label class="acc-label vertical-middle p-0">{{t 'cruPersistentVolume.source.label'}}</label>
+      {{t (concat 'volumeSource.' sourceName '.title')}}
+    </div>
+    <div class="vertical-middle">
+      <label class="acc-label vertical-middle p-0">{{t 'cruPersistentVolume.capacity.label'}}</label>
+      {{capacity}} {{t 'cruPersistentVolume.capacity.unit'}}
+    </div>
+    <div class="vertical-middle">
+      <label class="acc-label vertical-middle p-0">{{t 'cruPersistentVolume.reclaimPolicy'}}</label>
+      {{model.persistentVolumeReclaimPolicy}}
+    </div>
+  </div>
+  <div class="row banner bg-info basics">
+    <div class="vertical-middle">
+      <label class="acc-label vertical-middle p-0">{{t 'cruPersistentVolume.pvc'}}</label>
+      {{#if model.displayPvc}}
+        {{model.displayPvc}}
+      {{else}}
+        <span class="text-muted">{{t 'generic.na'}}</span>
+      {{/if}}
+    </div>
+    <div class="vertical-middle">
+      <label class="acc-label vertical-middle p-0">{{t 'generic.created'}}</label>
+      {{date-calendar model.created}}
+    </div>
+  </div>
+{{else}}
+  <div class="row">
+    <div class="col span-6">
+      <label class="acc-label">{{t 'cruPersistentVolume.source.label'}}{{field-required editing=editing}}</label>
       {{new-select
         content=sourceChoices
         prompt="cruPersistentVolume.source.prompt"
@@ -36,26 +68,18 @@
         value=sourceName
         readOnly=isView
       }}
-    {{else}}
-      <div>
-        {{t (concat 'volumeSource.' sourceName '.title')}}
-      </div>
-    {{/if}}
-  </div>
-  <div class="col span-6">
-    <label class="acc-label">{{t 'cruPersistentVolume.capacity.label'}}{{field-required editing=editing}}</label>
-    {{#if editing}}
+    </div>
+    <div class="col span-6">
+      <label class="acc-label">{{t 'cruPersistentVolume.capacity.label'}}{{field-required editing=editing}}</label>
       <div class="input-group">
         {{input-number classNames="form-control" value=capacity}}
         <span class="input-group-addon bg-default">{{t 'cruPersistentVolume.capacity.unit'}}</span>
       </div>
-    {{else}}
-      <div>
-        {{capacity}} {{t 'cruPersistentVolume.capacity.unit'}}
-      </div>
-    {{/if}}
+    </div>
   </div>
-</div>
+{{/if}}
+
+
 
 <hr class="mb-20" />
 
@@ -139,14 +163,20 @@
   {{/accordion-list-item}}
 
   {{#if isView}}
-      {{resource-event-list
-        resourceType=(t 'generic.persistentVolume')
-        expandAll=al.expandAll
-        expandFn=expandFn
-        name=model.name
-        kind="PersistentVolume"
-      }}
-    {{/if}}
+    {{resource-event-list
+      resourceType=(t 'generic.persistentVolume')
+      expandAll=al.expandAll
+      expandFn=expandFn
+      name=model.name
+      kind="PersistentVolume"
+    }}
+
+    {{annotations-section
+      model=model
+      expandAll=al.expandAll
+      expandFn=expandFn
+    }}
+  {{/if}}
 {{/accordion-list}}
 
 {{#unless isView}}
diff --git a/app/components/form-node-affinity/template.hbs b/app/components/form-node-affinity/template.hbs
index be9b64715..8effaa3d6 100644
--- a/app/components/form-node-affinity/template.hbs
+++ b/app/components/form-node-affinity/template.hbs
@@ -4,7 +4,7 @@
     rule=rule
     editing=editing}}
 {{else if (not editing)}}
-  <div class="p-20">{{t 'formNodeAffinity.noRules'}}</div>
+  <div class="text-center text-muted lacsso pt-20 pb-20">{{t 'formNodeAffinity.noRules'}}</div>
 {{/each}}
 
 {{#if editing}}
diff --git a/app/models/persistentvolume.js b/app/models/persistentvolume.js
index 0a37e171d..2bf59653f 100644
--- a/app/models/persistentvolume.js
+++ b/app/models/persistentvolume.js
@@ -14,6 +14,12 @@ export default Volume.extend({
     return !!get(this, 'links.remove') && get(this, 'state') !== 'bound';
   }),
 
+  displayPvc: computed('claimRef.namespace', 'claimRef.name', function() {
+    if ( get(this, 'claimRef.name') ) {
+      return `${ get(this, 'claimRef.namespace') }/${ get(this, 'claimRef.name') }`;
+    }
+  }),
+
   actions: {
     edit() {
       get(this, 'router').transitionTo('authenticated.cluster.storage.persistent-volumes.detail.edit', get(this, 'id'));
diff --git a/translations/en-us.yaml b/translations/en-us.yaml
index dd615886f..e7edbc993 100644
--- a/translations/en-us.yaml
+++ b/translations/en-us.yaml
@@ -2261,6 +2261,8 @@ cruPersistentVolume:
   storageClass:
     label: Assign to Storage Class
     prompt: None
+  pvc: Persistent Volume Claim
+  reclaimPolicy: Reclaim Policy
   capacity:
     label: Capacity
     unit: GiB