Merge branch 'master' into content-linking

config/seo-pro.php

@@ -49,6 +49,7 @@
     ],
 
     'reports' => [
+        'keep_recent' => 'all',
         'queue_chunk_size' => 1000,
     ],
 

resources/dist/build/manifest.json

@@ -0,0 +1,19 @@
+{
+  "resources/css/cp.css": {
+    "file": "assets/cp-7025c2cd.css",
+    "isEntry": true,
+    "src": "resources/css/cp.css"
+  },
+  "resources/js/cp.css": {
+    "file": "assets/cp-56146771.css",
+    "src": "resources/js/cp.css"
+  },
+  "resources/js/cp.js": {
+    "css": [
+      "assets/cp-56146771.css"
+    ],
+    "file": "assets/cp-e1852156.js",
+    "isEntry": true,
+    "src": "resources/js/cp.js"
+  }
+}

resources/js/components/reporting/IndexScore.vue

@@ -2,7 +2,7 @@
 
     <div>
         <div v-if="score">
-            <seo-pro-status-icon :status="status" class="inline-block ml-1 mr-3"></seo-pro-status-icon>
+            <seo-pro-status-icon :status="statusByScore" class="inline-block ml-1 mr-3" />
             {{ score }}%
         </div>
         <loading-graphic v-else :text="null" :inline="true" />
@@ -27,6 +27,23 @@ export default {
         }
     },
 
+    computed: {
+        statusByScore() {
+            if (! this.score) {
+                return this.status;
+            }
+
+            // Ensure we color status icon on index view to match site score color on report show view
+            if (this.score < 70) {
+                return 'fail';
+            } else if (this.score < 90) {
+                return 'warning';
+            } else if (this.score >= 90) {
+                return 'pass';
+            }
+        },
+    },
+
     created() {
         if (! this.score) this.updateScore();
     },

resources/js/components/reporting/PageDetails.vue

@@ -0,0 +1,45 @@
+
+<template>
+
+    <modal
+        name="report-details"
+        @closed="$emit('closed')"
+        :click-to-close="true"
+    >
+        <div class="p-0">
+            <h1 class="p-4 bg-gray-200 dark:bg-dark-650 border-b dark:border-dark-900 text-lg">
+                {{ __('seo-pro::messages.page_details') }}
+            </h1>
+
+            <div class="modal-body">
+                <div v-for="item in item.results" class="flex px-4 leading-normal pb-2" :class="{ 'bg-red-100 dark:bg-dark-400': item.status !== 'pass' }">
+                    <status-icon :status="item.status" class="mr-3 mt-2" />
+                    <div class="flex-1 mt-2 prose text-gray-700 dark:text-dark-150">
+                        <div class="text-gray-900 dark:text-dark-100" v-html="item.description"></div>
+                        <div class="text-xs" :class="{ 'text-red-800 dark:text-dark-150': item.status !== 'pass' }" v-if="item.comment" v-html="item.comment"></div>
+                    </div>
+                </div>
+            </div>
+
+            <footer class="px-4 py-3 dark:bg-dark-700 dark:border-dark-900 rounded-b-lg border-t flex items-center text-sm flex">
+                <a v-if="item.url" :href="item.url" target="_blank" class="font-normal font-mono text-xs text-gray-700 hover:text-blue grow truncate" v-text="item.url" />
+                <a v-if="item.url" :href="item.url" target="_blank" class="font-normal text-gray-700 hover:text-blue ml-8" v-text="__('Visit')" />
+                <a v-if="item.edit_url" :href="item.edit_url" target="_blank" class="font-normal text-gray-700 hover:text-blue ml-4" v-text="__('Edit')" />
+            </footer>
+        </div>
+    </modal>
+
+</template>
+
+
+<script>
+import StatusIcon from './StatusIcon.vue';
+
+export default {
+    props: ['item'],
+
+    components: {
+        StatusIcon
+    }
+}
+</script>