feat: 小红书飙升榜

src/api/business/redData.js

+import request from '@/utils/request'
+
+export function findNoteSoareData(params) {
+  return request({
+    url: '/findNoteSoareData',
+    method: 'post',
+    data: params
+  })
+}

src/router/index.js

@@ -402,6 +402,41 @@ export const asyncRouterMap = [
       }
     ]
   },
+  {
+    path: '/redData',
+    component: Layout,
+    redirect: 'noredirect',
+    alwaysShow: true,
+    name: 'redData',
+    meta: {
+      title: '小红书数据分析',
+      icon: 'people'
+    },
+    children: [
+      {
+        path: 'soringList',
+        component: () => import('@/views/redData/soringList'),
+        name: 'soringList',
+        meta: {
+          perms: ['POST /admin/sysIM/sendChatMsg'],
+          title: '笔记飙升榜单',
+          icon: 'user',
+          noCache: true
+        }
+      }
+      // {
+      //   path: 'list',
+      //   component: () => import('@/views/customerService/chatList'),
+      //   name: 'chatList',
+      //   meta: {
+      //     perms: ['POST /admin/sysIM/sendChatMsg'],
+      //     title: '会话记录',
+      //     icon: 'form',
+      //     noCache: true
+      //   }
+      // }
+    ]
+  },
   {
     path: '/profile',
     component: Layout,

src/views/redData/soringList.vue

+<template>
+  <div class="page_invite">
+    <div class="filter-container">
+      <div class="filter-item">
+        <div class="filter-item__title" style="margin-right: 10px">笔记分类:</div>
+        <div class="filter-item__category">
+          <div v-for="item in categoryList" :key="item.name" :class="{active: item.name === listQuery.category}" class="filter-item__category__content" @click="handlerSelectCateGory(item.name)">
+            {{ item.name }}
+          </div>
+        </div>
+      </div>
+      <div class="filter-item">
+        <div class="filter-item__title">时间周期：</div>
+        <el-radio-group v-model="checkboxDate" size="small" @change="handlerChange">
+          <el-radio-button v-for="item in dateOptions" :label="item" :key="item">{{ item }}</el-radio-button>
+        </el-radio-group>
+      </div>
+    </div>
+    <!-- 查询结果 -->
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      size="small"
+      element-loading-text="正在查询中..."
+      border
+      fit
+      highlight-current-row>
+      <el-table-column align="center" label="排行" width="100px" type="index" />
+
+      <el-table-column align="center" label="笔记信息" prop="title" />
+
+      <el-table-column align="center" label="点赞数" prop="differLikedNum" sortable />
+
+      <el-table-column align="center" label="收藏数" prop="differCollectedNum" sortable/>
+
+      <el-table-column align="center" label="评论数" prop="differCommentNum" sortable/>
+
+      <!--      <el-table-column align="center" label="分享数" prop="differSharedNum"/>-->
+
+      <!--      <el-table-column align="center" label="操作" width="250" class-name="small-padding fixed-width">-->
+      <!--        <template slot-scope="scope">-->
+      <!--          <el-button-->
+      <!--            type="text"-->
+      <!--            size="mini"-->
+      <!--            @click="handleToDetail(scope.row)">详情-->
+      <!--          </el-button>-->
+      <!--        </template>-->
+      <!--      </el-table-column>-->
+
+    </el-table>
+
+    <Pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList" />
+  </div>
+
+</template>
+
+<script>
+import Pagination from '@/components/Pagination'
+import axios from 'axios'
+export default {
+  name: 'SoringList',
+
+  components: {
+    Pagination
+  },
+  data() {
+    return {
+      hit: false,
+      baColor: '#fffffff',
+      listLoading: false,
+      listQuery: {
+        page: 1,
+        size: 20,
+        category: '',
+        cycle: 1,
+        sortColumn: 'likedNum'
+      },
+      list: [],
+      total: 0,
+      categoryList: [],
+      showDetail: false,
+      fromAccount: '',
+      toAccount: '',
+      checkboxDate: '近1天',
+      dateOptions: ['近1天', '近7天', '近1月']
+    }
+  },
+  created() {
+    this.handleGetCategory()
+  },
+  methods: {
+    // 切换时间周期
+    handlerChange(e) {
+      console.log('---切换时间周期--', e)
+      if (e === '近1天') {
+        this.listQuery.cycle = 1
+      } else if (e === '近7天') {
+        this.listQuery.cycle = 2
+      } else if (e === '近1月') {
+        this.listQuery.cycle = 3
+      }
+      this.handleGetCategory()
+    },
+    handlerSelectCateGory(categoryStr) {
+      if (categoryStr === this.listQuery.category) {
+        return
+      }
+      this.listQuery.category = categoryStr
+      this.getList()
+    },
+    handleClose() {
+      this.showDetail = false
+    },
+    handleReset() {
+      this.listQuery = {
+        page: 1,
+        limit: 20
+      }
+      this.getList()
+    },
+    /**
+     * 获取类目列表
+     **/
+    handleGetCategory() {
+      axios.post('http://xhs-py.wanwudezhi.work/getCategory')
+        .then(res => {
+          console.log('===类目列表', res.data)
+          this.categoryList = res.data.data
+          debugger
+          if (this.categoryList && this.categoryList.length > 0) {
+            this.listQuery.category = this.categoryList[0].name
+          }
+          this.getList()
+        })
+    },
+
+    handleToDetail(row) {
+      this.fromAccount = row.fromAccount
+      this.toAccount = row.toAccount
+      this.showDetail = true
+    },
+
+    getList() {
+      // this.listLoading = true
+      // findNoteSoareData(this.listQuery).then(response => {
+      //   this.list = response.data.data.dataList
+      //   this.total = response.data.data.total
+      //   this.listLoading = false
+      // }).catch((e) => {
+      //   this.list = []
+      //   this.total = 0
+      //   this.listLoading = false
+      // })
+      axios.post('http://xhs-py.wanwudezhi.work/findNoteSoareData',
+        this.listQuery)
+        .then(res => {
+          this.list = res.data.data.data
+          this.total = res.data.data.total
+          console.log(res.data)
+        })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .el-tag {
+  margin-right: 10px;
+  background: white;
+  border: white;
+}
+.page_invite {
+  padding: 20px;
+}
+.filter-container {
+  display: flex;
+  flex-direction: column;
+}
+.filter-item {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+}
+.filter-item__category {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  .filter-item__category__content {
+    background-color: white;
+    display: inline-block;
+    padding: 0 10px;
+    height: 32px;
+    line-height: 30px;
+    font-size: 12px;
+    color: #606266;
+    border-radius: 4px;
+    box-sizing: border-box;
+    border: 0px solid rgba(64,158,255,.2);
+    white-space: nowrap;
+    &.active {
+      border: 1px solid rgba(64,158,255,.2);
+      color: #409eff;
+      background-color: rgba(64,158,255,.1);
+      //background-color: #1890ff;
+
+    }
+  }
+}
+
+</style>