pbl_admin_table/src/views/homepageL.vue

<template>
    <div class="allPage">
        <div class="packageL">
            <topPage @cutUrl="cutUrl" ref="topPageRef"></topPage>
            <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','userinfo2']),
            roleUser(){
                return this.userinfo.role == 1 && this.userinfo.rrole == 1 && this.userinfo.type == 1&& this.userinfo2 !== "" ? this.userinfo2 : this.userinfo
            }
        },
        components:{
            topPage,
            botPage
        },
        data() {
            return {
                // CocoFlowList:[],
                hotApp:[],
            }
        },
        

        methods: {
            // 获取后台管理设置常见应用
            getadmincocoFlow(){
                this.$refs.topPageRef.getAdmincocoFlow()
            },

            // 查询首页应用
            getData(){
                // 获取已添加cocoFlow应用
                this.$refs.topPageRef.getData()

                let params = [
                    {
                        functionName: API_CONFIG.ajax_allApp.functionName, // 调用存储过程的名称
                        uid: this.roleUser.userid, 
                        cn: this.roleUser.schoolArea ? this.roleUser.schoolArea : this.roleUser.orgArea, 
                    },
                ];
                
                // 发起请求
                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('AddAppJson',val)
            },
        },
    }
</script>

<style scoped>
    .allPage{
        width: 100%;
        justify-content: center;
        height: 100%;
        overflow: auto;
    }
    .packageL{
        padding: 10px 81px;
        box-sizing: border-box;
        margin: auto;
        padding-bottom: 100px;
        /* 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>