优化

MrShi

19 小时以前 3003ab05f20cacea2d1e7d9bd027d26b1813864e

 screen/src/views/KeyCabinet.vue

@@ -4,7 +4,7 @@
            <img src="@/assets/images/bg.png" class="main_bg" alt="" />
            <div class="main_header">
                <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" />
                <div class="title">钥匙柜数据看板</div>
                <div class="title">三交一封智能柜</div>
                <div class="time_wrap">
                    <span class="date">{{ date }}</span>
                    <span class="week">{{ week }}</span>
@@ -176,9 +176,9 @@
                                </div>
                                <div class="car_static">
                                    <div class="echart_wrap">
                                        <div class="pie_text">
                                            <div class="fs30"><strong>30</strong></div>
                                            <div style="font-size: 15px; color: rgba(255,255,255,0.8); font-weight: 400;">入库总量</div>
                                        <div class="pie_text" v-if="fenbu">
                                            <div class="fs30"><strong>{{fenbu.alcoholNum + fenbu.unCloseNum + fenbu.timeOutNum}}</strong></div>
                                            <div style="font-size: 15px; color: rgba(255,255,255,0.8); font-weight: 400;">告警总量</div>
                                        </div>
                                        <div class="echart1" id="echart1"></div>
                                    </div>
@@ -195,14 +195,14 @@
                                                <div class="icon" :style="{ background: `linear-gradient(270deg, ${colors[1].color1} 0%, ${colors[1].color2} 100%)` }"></div>
                                                <div class="text">柜门未关告警</div>
                                            </div>
                                            <div class="num" :style="{ color: '#FEAF01' }">{{fenbu.timeOutNum}}次｜{{fenbu.timeOutNumPct}}%</div>
                                            <div class="num" :style="{ color: '#FEAF01' }">{{fenbu.unCloseNum}}次｜{{fenbu.unCloseNumPct}}%</div>
                                        </div>
                                        <div class="item1">
                                            <div class="line">
                                                <div class="icon" :style="{ background: `linear-gradient(270deg, ${colors[2].color1} 0%, ${colors[2].color2} 100%)` }"></div>
                                                <div class="text">超时未还告警</div>
                                            </div>
                                            <div class="num" :style="{ color: '#28F0C4' }">{{fenbu.unCloseNum}}次｜{{fenbu.unCloseNumPct}}%</div>
                                            <div class="num" :style="{ color: '#28F0C4' }">{{fenbu.timeOutNum}}次｜{{fenbu.timeOutNumPct}}%</div>
                                        </div>
                                    </div>
                                </div>
@@ -350,10 +350,10 @@
                fenbu.value = {
                    ...res.data,
                    alcoholNumPct: calculatePercentage(res.data.alcoholNum,[res.data.alcoholNum + res.data.timeOutNum + res.data.unCloseNum]),
                    timeOutNumPct: calculatePercentage(res.data.timeOutNum,[res.data.alcoholNum + res.data.timeOutNum + res.data.unCloseNum]),
                    unCloseNumPct: calculatePercentage(res.data.unCloseNum,[res.data.alcoholNum + res.data.timeOutNum + res.data.unCloseNum])
                    unCloseNumPct: calculatePercentage(res.data.unCloseNum,[res.data.alcoholNum + res.data.timeOutNum + res.data.unCloseNum]),
                    timeOutNumPct: calculatePercentage(res.data.timeOutNum,[res.data.alcoholNum + res.data.timeOutNum + res.data.unCloseNum])
                }
                dataList5.value = [res.data.alcoholNum, res.data.timeOutNum, res.data.unCloseNum]
                dataList5.value = [res.data.alcoholNum, res.data.unCloseNum, res.data.timeOutNum]
                nextTick(() => {
                    initEchart1()
                })
@@ -626,12 +626,12 @@
                            <div style="display: flex; align-items: center;margin-top: 4px;">
                                <div style="width: 12px;height: 12px;background: linear-gradient(to bottom, #50afd3, #1d4861);border-radius: 50%;margin-right: 12px;"></div>
                                <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">领取：</div>
                                <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[0].data}个</div>
                                <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[0].data}次</div>
                            </div>
                            <div style="display: flex; align-items: center;margin-top: 4px;">
                                <div style="width: 12px;height: 12px;background: linear-gradient(to bottom, rgb(255,184,0), rgba(255, 138, 0, 0.20));border-radius: 50%;margin-right: 12px;"></div>
                                <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">归还：</div>
                                <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[1].data}个</div>
                                <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[1].data}次</div>
                            </div>
                        </div>
                      `;
@@ -647,7 +647,7 @@
            },
            yAxis: {
                type: 'value',
                name: '单位：个',
                name: '单位：次',
                minInterval: 1,
                axisLabel: {
                    color: '#D2E0FF',