fix: #225 (halo-dev/console#231)

* 1.3.0-beta.2

* fix: token expire.

* fix: #225

src/views/post/PostList.vue

@@ -33,7 +33,9 @@
                     v-for="status in Object.keys(postStatus)"
                     :key="status"
                     :value="status"
-                  >{{ postStatus[status].text }}</a-select-option>
+                  >{{
+                    postStatus[status].text
+                  }}</a-select-option>
                 </a-select>
               </a-form-item>
             </a-col>
@@ -96,7 +98,9 @@
             </a-menu-item>
             <a-menu-item
               key="2"
-              v-if="queryParam.status === 'PUBLISHED' || queryParam.status ==='DRAFT' || queryParam.status === 'INTIMATE'"
+              v-if="
+                queryParam.status === 'PUBLISHED' || queryParam.status === 'DRAFT' || queryParam.status === 'INTIMATE'
+              "
             >
               <a
                 href="javascript:void(0);"
@@ -107,7 +111,9 @@
             </a-menu-item>
             <a-menu-item
               key="3"
-              v-if="queryParam.status === 'RECYCLE' || queryParam.status === 'PUBLISHED' || queryParam.status === 'INTIMATE'"
+              v-if="
+                queryParam.status === 'RECYCLE' || queryParam.status === 'PUBLISHED' || queryParam.status === 'INTIMATE'
+              "
             >
               <a
                 href="javascript:void(0);"
@@ -266,11 +272,8 @@
                   {{ item.title }}
                 </a>
               </span>
-
             </a-list-item-meta>
-            <span>
-              {{ item.summary }}...
-            </span>
+            <span> {{ item.summary }}... </span>
             <br />
             <br />
             <a-tag
@@ -286,7 +289,6 @@
               color="green"
               style="margin-bottom: 8px"
             >{{ tag.name }}</a-tag>
-
           </a-list-item>
         </a-list>
 
@@ -366,7 +368,9 @@
               :key="index"
               color="blue"
               style="margin-bottom: 8px"
-            >{{ category.name }}</a-tag>
+            >{{
+              category.name
+            }}</a-tag>
           </span>
 
           <span
@@ -378,7 +382,9 @@
               :key="index"
               color="green"
               style="margin-bottom: 8px"
-            >{{ tag.name }}</a-tag>
+            >{{
+              tag.name
+            }}</a-tag>
           </span>
 
           <span
@@ -470,6 +476,7 @@
         </a-table>
         <div class="page-wrapper">
           <a-pagination
+            v-if="posts && posts.length > 0"
             class="pagination"
             :current="pagination.page"
             :total="pagination.total"
@@ -616,14 +623,13 @@ export default {
   },
   computed: {
     formattedPosts() {
-      return this.posts.map(post => {
+      return this.posts.map((post) => {
         post.statusProperty = this.postStatus[post.status]
         return post
       })
     }
   },
-  created() {
-    this.handleListPosts()
+  beforeMount() {
     this.handleListCategories()
   },
   destroyed: function() {
@@ -632,13 +638,20 @@ export default {
     }
   },
   beforeRouteEnter(to, from, next) {
-    next(vm => {
-      vm.queryParam.page = to.query.page
-      vm.queryParam.size = to.query.size
+    next((vm) => {
+      if (to.query.page) {
+        vm.pagination.page = Number(to.query.page) + 1
+      }
+      if (to.query.size) {
+        vm.pagination.size = Number(to.query.size)
+      }
+
       vm.queryParam.sort = to.query.sort
       vm.queryParam.keyword = to.query.keyword
       vm.queryParam.categoryId = to.query.categoryId
       vm.queryParam.status = to.query.status
+
+      vm.handleListPosts()
     })
   },
   beforeRouteLeave(to, from, next) {
@@ -654,7 +667,7 @@ export default {
         if (newVal) {
           const params = JSON.parse(JSON.stringify(this.queryParam))
           const path = this.$router.history.current.path
-          this.$router.push({ path, query: params }).catch(err => err)
+          this.$router.push({ path, query: params }).catch((err) => err)
         }
       }
     }
@@ -670,7 +683,7 @@ export default {
       this.queryParam.sort = this.pagination.sort
       postApi
         .query(this.queryParam)
-        .then(response => {
+        .then((response) => {
           this.posts = response.data.data.content
           this.pagination.total = response.data.data.total
         })
@@ -684,7 +697,7 @@ export default {
       this.categoriesLoading = true
       categoryApi
         .listAll(true)
-        .then(response => {
+        .then((response) => {
           this.categories = response.data.data
         })
         .finally(() => {
@@ -729,7 +742,7 @@ export default {
     handleEditStatusClick(postId, status) {
       postApi
         .updateStatus(postId, status)
-        .then(response => {
+        .then((response) => {
           this.$message.success('操作成功！')
         })
         .finally(() => {
@@ -739,7 +752,7 @@ export default {
     handleDeleteClick(postId) {
       postApi
         .delete(postId)
-        .then(response => {
+        .then((response) => {
           this.$message.success('删除成功！')
         })
         .finally(() => {
@@ -753,7 +766,7 @@ export default {
       }
       postApi
         .updateStatusInBatch(this.selectedRowKeys, status)
-        .then(response => {
+        .then((response) => {
           this.$log.debug(`postId: ${this.selectedRowKeys}, status: ${status}`)
           this.selectedRowKeys = []
         })
@@ -768,7 +781,7 @@ export default {
       }
       postApi
         .deleteInBatch(this.selectedRowKeys)
-        .then(response => {
+        .then((response) => {
           this.$log.debug(`delete: ${this.selectedRowKeys}`)
           this.selectedRowKeys = []
         })
@@ -777,7 +790,7 @@ export default {
         })
     },
     handleShowPostSettings(post) {
-      postApi.get(post.id).then(response => {
+      postApi.get(post.id).then((response) => {
         this.selectedPost = response.data.data
         this.selectedTagIds = this.selectedPost.tagIds
         this.selectedCategoryIds = this.selectedPost.categoryIds
@@ -786,13 +799,13 @@ export default {
       })
     },
     handleShowPostComments(post) {
-      postApi.get(post.id).then(response => {
+      postApi.get(post.id).then((response) => {
         this.selectedPost = response.data.data
         this.postCommentVisible = true
       })
     },
     handlePreview(postId) {
-      postApi.preview(postId).then(response => {
+      postApi.preview(postId).then((response) => {
         window.open(response.data, '_blank')
       })
     },

tailwind.config.js

@@ -151,6 +151,18 @@ module.exports = {
       '64': '16rem'
     },
     backgroundColor: theme => theme('colors'),
+    backgroundImage: {
+      none: 'none',
+      'gradient-to-t': 'linear-gradient(to top, var(--gradient-color-stops))',
+      'gradient-to-tr': 'linear-gradient(to top right, var(--gradient-color-stops))',
+      'gradient-to-r': 'linear-gradient(to right, var(--gradient-color-stops))',
+      'gradient-to-br': 'linear-gradient(to bottom right, var(--gradient-color-stops))',
+      'gradient-to-b': 'linear-gradient(to bottom, var(--gradient-color-stops))',
+      'gradient-to-bl': 'linear-gradient(to bottom left, var(--gradient-color-stops))',
+      'gradient-to-l': 'linear-gradient(to left, var(--gradient-color-stops))',
+      'gradient-to-tl': 'linear-gradient(to top left, var(--gradient-color-stops))'
+    },
+    gradientColorStops: theme => theme('colors'),
     backgroundOpacity: theme => theme('opacity'),
     backgroundPosition: {
       bottom: 'bottom',
@@ -621,6 +633,34 @@ module.exports = {
       '500': '500ms',
       '700': '700ms',
       '1000': '1000ms'
+    },
+    animation: {
+      none: 'none',
+      spin: 'spin 1s linear infinite',
+      ping: 'ping 1s cubic-bezier(0, 0, 0.2, 1) infinite',
+      pulse: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+      bounce: 'bounce 1s infinite'
+    },
+    keyframes: {
+      spin: {
+        to: { transform: 'rotate(360deg)' }
+      },
+      ping: {
+        '75%, 100%': { transform: 'scale(2)', opacity: '0' }
+      },
+      pulse: {
+        '50%': { opacity: '.5' }
+      },
+      bounce: {
+        '0%, 100%': {
+          transform: 'translateY(-25%)',
+          animationTimingFunction: 'cubic-bezier(0.8,0,1,1)'
+        },
+        '50%': {
+          transform: 'none',
+          animationTimingFunction: 'cubic-bezier(0,0,0.2,1)'
+        }
+      }
     }
   },
   variants: {
@@ -630,7 +670,10 @@ module.exports = {
     alignSelf: ['responsive'],
     appearance: ['responsive'],
     backgroundAttachment: ['responsive'],
+    backgroundClip: ['responsive'],
     backgroundColor: ['responsive', 'hover', 'focus'],
+    backgroundImage: ['responsive'],
+    gradientColorStops: ['responsive', 'hover', 'focus'],
     backgroundOpacity: ['responsive', 'hover', 'focus'],
     backgroundPosition: ['responsive'],
     backgroundRepeat: ['responsive'],
@@ -643,10 +686,12 @@ module.exports = {
     borderWidth: ['responsive'],
     boxShadow: ['responsive', 'hover', 'focus'],
     boxSizing: ['responsive'],
+    container: ['responsive'],
     cursor: ['responsive'],
     display: ['responsive'],
     divideColor: ['responsive'],
     divideOpacity: ['responsive'],
+    divideStyle: ['responsive'],
     divideWidth: ['responsive'],
     fill: ['responsive'],
     flex: ['responsive'],
@@ -679,6 +724,7 @@ module.exports = {
     order: ['responsive'],
     outline: ['responsive', 'focus'],
     overflow: ['responsive'],
+    overscrollBehavior: ['responsive'],
     padding: ['responsive'],
     placeholderColor: ['responsive', 'focus'],
     placeholderOpacity: ['responsive', 'focus'],
@@ -720,7 +766,8 @@ module.exports = {
     transitionProperty: ['responsive'],
     transitionTimingFunction: ['responsive'],
     transitionDuration: ['responsive'],
-    transitionDelay: ['responsive']
+    transitionDelay: ['responsive'],
+    animation: ['responsive']
   },
   corePlugins: {},
   plugins: []