pbl_admin_table/src/views/homepageL.vue

<template>
    <div class="allPage">
        <div class="packageL">
            <topPage @cutUrl="cutUrl"  :CocoFlowList="CocoFlowList" ref="topPageRef"></topPage>
            <div style="height: 30px;width: 100%;"></div>
            <botPage :hotApp="hotApp" ref="botPageRef"></botPage>
        </div>
    </div>
</template>

<script>
import topPage from '../components/topPage'
import botPage from '../components/botPage'
import { mapGetters } from 'vuex';
import { API_CONFIG } from "@/common/apiConfig";

    export default {
        props:['urlAddress'],
        computed: {
            ...mapGetters(['userinfo']),
        },
        components:{
            topPage,
            botPage
        },
        data() {
            return {
                CocoFlowList:[],
                hotApp:[],
                
            }
        },
        

        methods: {
            getData(){
                let params = [
                    {
                    functionName: API_CONFIG.ajax_allApp.functionName, // 调用存储过程的名称
                    uid: this.userinfo.userid, //组织id
                    cn: this.userinfo.schoolArea ? this.userinfo.schoolArea : this.userinfo.orgArea, //学校id
                    },
                ];
                
                // 发起请求
                this.$ajax
                    .post(API_CONFIG.baseUrl, params)
                    .then((res) => {
                        console.log(res);
                        let data = res.data
                        this.CocoFlowList = data[0]
                        this.hotApp = [data[1],data[2],data[3],data[4],]

                    })
                    .catch((err) => {
                        console.error("请求失败，错误信息：", err);
                    });
            },
            cutUrl(val){
                this.$emit('update:urlAddress',val)
            },
        },
    }
</script>

<style scoped>
    .allPage{
        width: 100%;
        justify-content: center;
        height: 100%;
        overflow: auto;
    }
    .packageL{
        padding: 24px;
        box-sizing: border-box;
        margin: auto;
        max-width: 1280px;
    }

/* 整个滚动条轨道 */
::-webkit-scrollbar {
  width: 10px;   /* 垂直滚动条宽度 */
  height: 10px;  /* 水平滚动条高度 */
}

/* 滚动条轨道背景 */
::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 5px;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 5px;
}

/* 鼠标悬停时的滑块 */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

</style>