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>
@@ -75,13 +77,13 @@
       </div>
 
       <div class="table-operator">
-        <router-link :to="{name:'PostEdit'}">
+        <router-link :to="{ name: 'PostEdit' }">
           <a-button
             type="primary"
             icon="plus"
           >写文章</a-button>
         </router-link>
-        <a-dropdown v-show="queryParam.status!=null && queryParam.status!='' && !isMobile()">
+        <a-dropdown v-show="queryParam.status != null && queryParam.status != '' && !isMobile()">
           <a-menu slot="overlay">
             <a-menu-item
               key="1"
@@ -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);"
@@ -175,7 +181,7 @@
                   <a-menu-item v-else-if="item.status === 'RECYCLE'">
                     <a-popconfirm
                       :title="'你确定要发布【' + item.title + '】文章？'"
-                      @confirm="handleEditStatusClick(item.id,'PUBLISHED')"
+                      @confirm="handleEditStatusClick(item.id, 'PUBLISHED')"
                       okText="确定"
                       cancelText="取消"
                     >
@@ -185,7 +191,7 @@
                   <a-menu-item v-if="item.status === 'PUBLISHED' || item.status === 'DRAFT' || item.status === 'INTIMATE'">
                     <a-popconfirm
                       :title="'你确定要将【' + item.title + '】文章移到回收站？'"
-                      @confirm="handleEditStatusClick(item.id,'RECYCLE')"
+                      @confirm="handleEditStatusClick(item.id, 'RECYCLE')"
                       okText="确定"
                       cancelText="取消"
                     >
@@ -230,31 +236,31 @@
               >
                 <a-icon
                   type="pushpin"
-                  v-if="item.topPriority!=0"
+                  v-if="item.topPriority != 0"
                   theme="twoTone"
                   twoToneColor="red"
                   style="margin-right: 3px;"
                 />
                 <a
-                  v-if="item.status=='PUBLISHED' || item.status == 'INTIMATE'"
+                  v-if="item.status == 'PUBLISHED' || item.status == 'INTIMATE'"
                   :href="item.fullPath"
                   target="_blank"
                   class="no-underline"
                 >
                   <a-tooltip
                     placement="top"
-                    :title="'点击访问【'+item.title+'】'"
+                    :title="'点击访问【' + item.title + '】'"
                   >{{ item.title }}</a-tooltip>
                 </a>
                 <a
-                  v-else-if="item.status=='DRAFT'"
+                  v-else-if="item.status == 'DRAFT'"
                   href="javascript:void(0)"
                   class="no-underline"
                   @click="handlePreview(item.id)"
                 >
                   <a-tooltip
                     placement="topLeft"
-                    :title="'点击预览【'+item.title+'】'"
+                    :title="'点击预览【' + item.title + '】'"
                   >{{ item.title }}</a-tooltip>
                 </a>
                 <a
@@ -266,27 +272,23 @@
                   {{ item.title }}
                 </a>
               </span>
-
             </a-list-item-meta>
-            <span>
+            <span> {{ item.summary }}... </span>
-              {{ item.summary }}...
-            </span>
             <br />
             <br />
             <a-tag
-              v-for="(category,categoryIndex) in item.categories"
+              v-for="(category, categoryIndex) in item.categories"
-              :key="'category_'+categoryIndex"
+              :key="'category_' + categoryIndex"
               color="blue"
               style="margin-bottom: 8px"
             >{{ category.name }}</a-tag>
             <br />
             <a-tag
               v-for="(tag, tagIndex) in item.tags"
-              :key="'tag_'+tagIndex"
+              :key="'tag_' + tagIndex"
               color="green"
               style="margin-bottom: 8px"
             >{{ tag.name }}</a-tag>
-
           </a-list-item>
         </a-list>
 
@@ -307,35 +309,35 @@
         >
           <span
             slot="postTitle"
-            slot-scope="text,record"
+            slot-scope="text, record"
           >
             <a-icon
               type="pushpin"
-              v-if="record.topPriority!=0"
+              v-if="record.topPriority != 0"
               theme="twoTone"
               twoToneColor="red"
               style="margin-right: 3px;"
             />
             <a
-              v-if="record.status=='PUBLISHED' || record.status == 'INTIMATE'"
+              v-if="record.status == 'PUBLISHED' || record.status == 'INTIMATE'"
               :href="record.fullPath"
               target="_blank"
               class="no-underline"
             >
               <a-tooltip
                 placement="top"
-                :title="'点击访问【'+text+'】'"
+                :title="'点击访问【' + text + '】'"
               >{{ text }}</a-tooltip>
             </a>
             <a
-              v-else-if="record.status=='DRAFT'"
+              v-else-if="record.status == 'DRAFT'"
               href="javascript:void(0)"
               class="no-underline"
               @click="handlePreview(record.id)"
             >
               <a-tooltip
                 placement="topLeft"
-                :title="'点击预览【'+text+'】'"
+                :title="'点击预览【' + text + '】'"
               >{{ text }}</a-tooltip>
             </a>
             <a
@@ -362,11 +364,13 @@
             slot-scope="categoriesOfPost"
           >
             <a-tag
-              v-for="(category,index) in categoriesOfPost"
+              v-for="(category, index) in categoriesOfPost"
               :key="index"
               color="blue"
               style="margin-bottom: 8px"
-            >{{ category.name }}</a-tag>
+            >{{
+              category.name
+            }}</a-tag>
           </span>
 
           <span
@@ -378,18 +382,20 @@
               :key="index"
               color="green"
               style="margin-bottom: 8px"
-            >{{ tag.name }}</a-tag>
+            >{{
+              tag.name
+            }}</a-tag>
           </span>
 
           <span
             slot="commentCount"
-            slot-scope="text,record"
+            slot-scope="text, record"
             @click="handleShowPostComments(record)"
             style="cursor: pointer;"
           >
             <a-badge
               :count="record.commentCount"
-              :numberStyle="{backgroundColor: '#f38181'} "
+              :numberStyle="{ backgroundColor: '#f38181' }"
               :showZero="true"
               :overflowCount="999"
             />
@@ -401,7 +407,7 @@
           >
             <a-badge
               :count="visits"
-              :numberStyle="{backgroundColor: '#00e0ff'} "
+              :numberStyle="{ backgroundColor: '#00e0ff' }"
               :showZero="true"
               :overflowCount="9999"
             />
@@ -430,7 +436,7 @@
             >编辑</a>
             <a-popconfirm
               :title="'你确定要发布【' + post.title + '】文章？'"
-              @confirm="handleEditStatusClick(post.id,'PUBLISHED')"
+              @confirm="handleEditStatusClick(post.id, 'PUBLISHED')"
               okText="确定"
               cancelText="取消"
               v-else-if="post.status === 'RECYCLE'"
@@ -442,7 +448,7 @@
 
             <a-popconfirm
               :title="'你确定要将【' + post.title + '】文章移到回收站？'"
-              @confirm="handleEditStatusClick(post.id,'RECYCLE')"
+              @confirm="handleEditStatusClick(post.id, 'RECYCLE')"
               okText="确定"
               cancelText="取消"
               v-if="post.status === 'PUBLISHED' || post.status === 'DRAFT' || post.status === 'INTIMATE'"
@@ -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() {
+  beforeMount() {
-    this.handleListPosts()
     this.handleListCategories()
   },
   destroyed: function() {
@@ -632,13 +638,20 @@ export default {
     }
   },
   beforeRouteEnter(to, from, next) {
-    next(vm => {
+    next((vm) => {
-      vm.queryParam.page = to.query.page
+      if (to.query.page) {
-      vm.queryParam.size = to.query.size
+        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: []