From b14805d8899b73ba17ea6b5e8ee2d9eac7ce5204 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Thu, 23 May 2019 00:17:42 +0200
Subject: [PATCH] Show message when there is no data to display

---
 src/views/reports/index.vue | 14 +++++++++++---
 src/views/users/index.vue   |  3 +++
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/views/reports/index.vue b/src/views/reports/index.vue
index 10dcade8..85aff0d2 100644
--- a/src/views/reports/index.vue
+++ b/src/views/reports/index.vue
@@ -8,6 +8,9 @@
       <el-timeline class="timeline">
         <timeline-item v-loading="loading" v-for="report in reports" :report="report" :key="report.id"/>
       </el-timeline>
+      <div v-if="reports.length === 0" class="no-reports-message">
+        <p>There are no reports to display</p>
+      </div>
     </div>
   </div>
 </template>
@@ -46,6 +49,10 @@ export default {
 
 <style rel='stylesheet/scss' lang='scss' scoped>
 .reports-container {
+  .el-timeline {
+    margin: 45px 45px 45px 19px;
+    padding: 0px;
+  }
   .filter-container {
     margin: 22px 15px 22px 15px;
     padding-bottom: 0
@@ -53,9 +60,10 @@ export default {
   h1 {
     margin: 22px 0 0 15px;
   }
-  .el-timeline {
-    margin: 45px 45px 45px 19px;
-    padding: 0px;
+  .no-reports-message {
+    color: gray;
+    margin-left: 19px
+
   }
 }
 @media
diff --git a/src/views/users/index.vue b/src/views/users/index.vue
index 4a186ae3..c8e83a13 100644
--- a/src/views/users/index.vue
+++ b/src/views/users/index.vue
@@ -102,6 +102,9 @@
         </template>
       </el-table-column>
     </el-table>
+    <div v-if="users.length === 0" class="no-users-message">
+      <p>There are no users to display</p>
+    </div>
     <div v-if="!loading" class="pagination">
       <el-pagination
         :total="usersCount"