<script src="/static/ui_template/js/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
<style>
    .content-main{
        height: 100% !important;
        min-height: 980px !important;
        padding: 10px;
    }
</style>

<el-main style="padding: 10;" id="pane-1">
    <el-card>
        <link rel="stylesheet" href="/static/django_sohoui/typescript/css/dashboard.css">

        <div class="content-main">
            <div class="content-main-left">
                <div class="card card-container">卡片1</div>
                <div class="card card-container">卡片2</div>
                <div class="card card-container">卡片3</div>
                <div class="card card-container">卡片4</div>
            </div>
            <div class="content-main-right card-container">
                <div id="line-chart" style="height: 400px;"></div>
            </div>
            <div class="charts" style="margin-top: 40px; clear: both;">
            </div>
            <div id="bar-chart" class="card-container" style="height: 400px;width:32%; float: left;margin-left: 20px;"></div>
            <div id="pie-chart" class="card-container" style="height: 400px;width:32%; float: left;margin-left: 20px;"></div>
                <div id="map-chart" class="card-container" style="height: 400px;width:32%; float: left;margin-left: 20px;"></div>
        </div>
    </el-card>
</el-main>

<script src="/static/django_sohoui/typescript/js/dashboard.js"></script>