首页图表加载修改

guanqb

2023-04-04 9cb291282c56288a85654bb461b1ecd0b369e73f

首页图表加载修改

 src/views/home/components/rightContainer.vue

@@ -104,27 +104,28 @@

        <div class="crowd-box" ref="crowdBox">
            <div class="box">
                <div class="title">
                    <div>现有设备</div>
                    <div class="title-tab">
                        <span :class="{ choosed: linetype == 0 }" @click="initEquipmentEcharts(0)">设备种类</span>/
                        <span :class="{ choosed: linetype == 1 }" @click="initEquipmentEcharts(1)">设备状态</span>
                    </div>
                </div>
                <div class="title">现有设备</div>
                <el-main v-loading="equipmentEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                    <div class="sub-tab">
                        <div class="tab" :class="{ 'select-on-tab': linetype == 0 }" @click="initEquipmentEcharts(0)">
                            <div class="tab-title-small">设备种类</div>
                        </div>
                        <div class="tab" :class="{ 'select-on-tab': linetype == 1 }" @click="initEquipmentEcharts(1)">
                            <div class="tab-title-small">设备状态</div>
                        </div>
                    </div>
                    <div style="overflow: hidden" id="EquipmentEcharts" class="echarts-box"></div>
                </el-main>
            </div>

            <svg class="border-svg">
                <use stroke-width="2" xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)" stroke="#4fd2dd">
                    <animate attributeName="stroke-dasharray" from="0, 1442" to="1442, 0" dur="8s"
                        repeatCount="indefinite" />
                </use>
            </svg>
        </div>

        <svg class="border-svg">
            <use stroke-width="2" xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)" stroke="#4fd2dd">
                <animate attributeName="stroke-dasharray" from="0, 1442" to="1442, 0" dur="8s" repeatCount="indefinite" />
            </use>
        </svg>
    </div>
</template>
 
@@ -1032,16 +1033,25 @@
        .sub-tab {
            padding: 10px;
            display: flex;
            color: #99cccc;

            .tab {
                display: flex;
                justify-content: center;
                margin: 0 10px;
                flex: 1;
                background: $sub-tab-bg-color;
                border-radius: 8px;
                cursor: pointer;
                height: 22px;
                display: flex;
                align-items: center;
                justify-content: center;

                &>div {
                    height: 26px;
                    line-height: 26px;
                    height: 22px;
                    line-height: 22px;
                    white-space: nowrap;
                }
            }
        }
@@ -1049,8 +1059,8 @@
        .echarts-box {
            padding: 12px;
            flex: 1;
            height: 100%;
            width: 100%;
            // height: 100%;
            // width: 100%;
        }

        .table-box {