侧边栏中奖名单

src/api/allApi.js

@@ -530,3 +530,12 @@ export function deleteAllNews(data) {
     params: data
   })
 }
+
+//侧边栏中奖记录列表
+export function winningList(query) {
+  return request({
+    url: '/mall-act/user/winning/list',
+    method: 'get',
+    params:query
+  })
+}

src/components/SiderInfo.vue

@@ -17,7 +17,7 @@
         </div>
         <div class="sidebar-block">
             <div class="awardTitle">中奖名单</div>
-            <list-scroll></list-scroll>
+            <list-scroll :listData="listScrollData"></list-scroll>
 
             <!-- <div class="avatar">
                 <el-avatar fit="fill" :size="65" :src="avatar"></el-avatar>
@@ -121,7 +121,7 @@
 </template>
 <script>
 import { mapGetters } from 'vuex'
-import { indexList } from "@/api/allApi";
+import { indexList,winningList } from "@/api/allApi";
 import listScroll from '@/components/list-scroll.vue';
 export default {
     components: {
@@ -129,32 +129,9 @@ export default {
     },
     data() {
         return {
-            noticeList: [
-                { id: 1, text: '放低姿态' },
-                { id: 2, text: '努力进取' },
-                { id: 3, text: '勇于探索' },
-                { id: 4, text: '乐于分享' }
-            ],
-            activitykist: [
-                // {
-                //     status:0,
-                //     statusName:'未参加',
-                //     name:'每日签到',
-                //     img:'https://xiaoyou.dgtis.com/images/image/2024/08/23/xd5idemwj5itooa9t2ee.jpg'
-                // },
-                // {
-                //     status:1,
-                //     statusName:'已参加',
-                //     name:'每周竞技',
-                //     img:'https://xiaoyou.dgtis.com/images/image/2024/08/23/xd5idemwj5itooa9t2ee.jpg'
-                // },
-                // {
-                //     status:2,
-                //     statusName:'未开启',
-                //     name:'每月抽奖',
-                //     img:'https://xiaoyou.dgtis.com/images/image/2024/08/23/xd5idemwj5itooa9t2ee.jpg'
-                // }
-            ],
+            timer: null,
+            listScrollData: [],
+            activitykist: [],
             hoursTip: '你好！',
             isActive: false,
         };
@@ -167,9 +144,22 @@ export default {
         this.getHoursTip()
         indexList().then(response => {
             this.activitykist = response.data.data
-        })
+        });
+        this.getWinningList();
+        this.initWinningList();
     },
     methods: {
+        initWinningList(){
+            setInterval(() => {
+                this.getWinningList();
+            }, 300000);
+        
+        },
+        getWinningList(){
+            winningList().then(response => {
+            this.listScrollData = response.data.data.items;
+            })
+        },
         goFestiveEvents(val) {
 
             if (val.title == '每日答题') {
@@ -231,7 +221,9 @@ export default {
     mounted() {
         window.addEventListener('scroll', this.handleScroll)
     },
-
+    beforeDestroy() {
+        clearInterval(this.timer);
+    },
     destroyed() {
         // 离开该页面需要移除这个监听的事件，不然会报错
         window.removeEventListener('scroll', this.handleScroll)

src/components/list-scroll.vue

@@ -1,109 +1,86 @@
 <template>
-    <vue-seamless-scroll :data="listData" class="warp">
-      <ul class="item">
-        <li v-for="(item, index) in listData" :key="index">
-          <span class="name">{{ item.name }}</span>
-          <span class="title">{{ item.title }}</span>
-          <span class="date">{{ item.date }}</span>
-        </li>
-      </ul>
-    </vue-seamless-scroll>
-  </template>
-  
-  <script>
-    import vueSeamlessScroll from 'vue-seamless-scroll'
-  
-    export default {
-      name: 'Example01Basic',
-      components: {
-        vueSeamlessScroll
-      },
-      data () {
-        return {
-          listData: [{
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2024-09-10'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2017-12-16'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2017-12-16'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2017-12-16'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2024-09-10'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅qqqqqqqqqqqqqqqqqqqqqqqqqqqq',
-            'date': '2024-09-10'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2024-09-10'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2024-09-10'
-          }, {
-            'name':'刘伟',
-            'title': '积分抽奖 :空气炸锅',
-            'date': '2024-09-10'
-          }],
-        }
-      },
+  <vue-seamless-scroll :data="listData" class="warp">
+    <ul class="item">
+      <li v-for="(item, index) in listData" :key="index">
+        <span class="name">{{ item.userName }}</span>
+        <span class="title">{{ item.fullName }}</span>
+        <span class="date">{{ item.createTimeStr }}</span>
+      </li>
+    </ul>
+  </vue-seamless-scroll>
+</template>
+
+<script>
+import vueSeamlessScroll from 'vue-seamless-scroll'
+import { winningList } from "@/api/allApi";
+export default {
+  name: 'Example01Basic',
+  components: {
+    vueSeamlessScroll
+  },
+  props:['listData'],
+  data() {
+    return {
+      
     }
-  </script>
-  
-  <style lang="scss" scoped>
-    .warp {
-      height: 200px;
-      width: 100%;
-      margin: 0 auto;
-      overflow: hidden;
-      position:relative;
-      z-index: 10;
-      background: url(@/assets/image/zjmd.jpg) no-repeat;
-      background-size: 100% 100%;
-      width: 260px;
-      height: 200px;  
-      ul {
-        list-style: none;
-        padding: 0;
-        margin: 0 auto;
-        li{
-          color: #fff;
-          display: block;
-          height: 50px;
-          display: flex;
-         align-items: center;
-          font-size: 12px;
-          font-weight: bold;
-          border-bottom: 1px solid #fff;
-          .name{
-            width: 15%;
-            text-align: center;
-          }
-          .title{
-            text-align: center;
-            width: 55%;
-            word-wrap:break-word; 
-            word-break:break-all; 
-            // overflow: hidden;/*这个参数根据需求来决定要不要*/
+  },
+  created() {
+    
+  },
+  methods: {
+   
+
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.warp {
+  height: 200px;
+  width: 100%;
+  margin: 0 auto;
+  overflow: hidden;
+  position: relative;
+  z-index: 10;
+  background: url(@/assets/image/zjmd.jpg) no-repeat;
+  background-size: 100% 100%;
+  width: 260px;
+  height: 200px;
+
+  ul {
+    list-style: none;
+    padding: 0;
+    margin: 0 auto;
+
+    li {
+      color: #fff;
+      display: block;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      font-size: 12px;
+      font-weight: bold;
+      border-bottom: 1px solid #fff;
+
+      .name {
+        width: 15%;
+        text-align: center;
+      }
+
+      .title {
+        text-align: center;
+        width: 55%;
+        word-wrap: break-word;
+        word-break: break-all;
+        // overflow: hidden;/*这个参数根据需求来决定要不要*/
+
+      }
 
-          }
-          .data{
-            text-align: center;
-            width: 30%;
-          }
-        }
+      .data {
+        text-align: center;
+        width: 30%;
       }
     }
-  </style>
+  }
+}
+</style>

src/permission.js

@@ -4,7 +4,7 @@ import { getToken, setToken } from '@/utils/auth' // getToken from cookie
 import { lockStatus,unlock } from "@/api/allApi";
 //路由跳转之前
 router.beforeEach((to, _from, next) => {
-  setToken('6c283d788c64a1bbd1b07aef74725c32');
+  setToken('da0e2b8177b5b2448cc0ab9557a9eb7a');
   const path = to.path;
   const Authorization = to.query.Authorization
   if (path.indexOf('auth') != -1 && Authorization) {