<template>
    <div style="display: flex;flex-direction: row;flex-wrap: nowrap">
        <div style="display: flex;flex-direction: column;flex-wrap: nowrap">
            <div>
                <el-card style="border: none">
                    <div slot="header" class="clearfix" style="display: flex;flex-direction: row;flex-wrap: nowrap">
                        <div style="width: 150px;height: 150px;cursor: pointer" >
                            <el-avatar style="background-color: #969896" :src="require('@/assets/logo/tx.png')"
                                       :size="150"></el-avatar>
                        </div>
                        <div style="margin-left: 30px;margin-right: 30px;display: flex;flex-direction: column;flex-wrap: nowrap;align-items: center;justify-content: center">
                            <span style="font-size: 50px;">
                                {{ this.$cookie.get("adminName") }}
                            </span>
                            <span style="margin-top: 10px;font-size: 16px;color: #969896">
                                超级管理员
                            </span>
                        </div>
                    </div>
                    <div class="text item" style="display: flex;justify-content: flex-start">
                        <span style="font-size: 16px;color: #9ca3af">
                            登录时间: 2023-7-9
                        </span>
                    </div>
                </el-card>
            </div>
            <div style="margin-top: 20px">
                <el-card class="box-card" style="border: none">
                    <div id="Echart_1">

                    </div>
                </el-card>
            </div>
        </div>
        <div style="display: flex;flex-direction: column;flex-wrap: nowrap">
            <div style="display: flex;flex-direction: row;flex-wrap: wrap">
                <el-card style="margin-left: 40px;margin-bottom: 45px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-s-finance"
                           style="width: 100px;
                        height: 100px;
                        background-color: #2ec7c9;
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共项目数量</span>
                        </div>
                    </div>
                </el-card>

                <el-card style="margin-left: 40px;margin-bottom: 45px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-user-solid"
                           style="width: 100px;
                        height: 100px;
                        background-color: #ffb980;
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共用户数量</span>
                        </div>
                    </div>
                </el-card>

                <el-card style="margin-left: 40px;margin-bottom: 45px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-s-tools"
                           style="width: 100px;
                        height: 100px;
                        background-color: #5ab1ef;
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共管理员数量</span>
                        </div>
                    </div>
                </el-card>

                <el-card style="margin-left: 40px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-s-management"
                           style="width: 100px;
                        height: 100px;
                        background-color: rgb(255,208,20);
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共文章数量</span>
                        </div>
                    </div>
                </el-card>

                <el-card style="margin-left: 40px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-s-flag"
                           style="width: 100px;
                        height: 100px;
                        background-color: rgba(87,218,93,0.86);
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共标签数量</span>
                        </div>
                    </div>
                </el-card>

                <el-card style="margin-left: 40px;width: 18vw;border: none;display: flex;flex-direction: row;align-items: center;" :body-style="{ display: 'flex', padding: 0 }">
                    <div style="border: none;display: flex;flex-direction: row;align-items: center;justify-content: center">
                        <i class="el-icon-s-comment"
                           style="width: 100px;
                        height: 100px;
                        background-color: #ea64bb;
                        line-height: 100px;
                        text-align: center;
                        font-size: 30px;
                        color: #fff;"
                        ></i>
                        <div style="margin-left: 20px;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center">
                            <span style="font-size: 30px;font-weight: bold">
                                678993 <span>/个</span>
                            </span>
                            <span style="font-size: 15px;color: #9ca3af">总共评论数量</span>
                        </div>
                    </div>
                </el-card>
            </div>
<!--            eChart 图-->
            <div style="margin-top: 23px;margin-left: 40px">
                <el-card style="border: none">

                </el-card>
            </div>
        </div>
    </div>
</template>

<script>
import * as echarts from 'echarts'
import Vue from "vue";

Vue.prototype.$echarts = echarts;


export default {
    data() {
        return {

        }
    },
    methods: {

    },
    mounted() {

    }
}
</script>

<style scoped>

</style>