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

* 1.3.0-beta.2 * fix: token expire. * fix: #225
2020-08-23 10:56:20 +08:00 · 2020-08-23 10:56:20 +08:00 · 8886dfc68b
parent a09c82c6ed
commit 8886dfc68b
2 changed files with 111 additions and 51 deletions
--- a/src/views/post/PostList.vue
+++ b/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>
-              {{ item.summary }}...
-            </span>
+            <span> {{ item.summary }}... </span>
            <br />
            <br />
            <a-tag
-              v-for="(category,categoryIndex) in item.categories"
-              :key="'category_'+categoryIndex"
+              v-for="(category, categoryIndex) in item.categories"
+              :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() {
-    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')
      })
    },
--- a/tailwind.config.js
+++ b/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: []