perf: 优化网络错误提示框

This commit is contained in:
kuaifan 2022-12-03 14:32:49 +08:00
parent 453230d774
commit fc4c44bbea
2 changed files with 23 additions and 20 deletions

View File

@ -1,5 +1,6 @@
<template> <template>
<div class="mobile-tabbar"> <div class="mobile-tabbar">
<NetworkException v-if="windowSmall" type="alert"/>
<transition name="mobile-fade"> <transition name="mobile-fade">
<div v-if="isMore" class="more-mask" @click="toggleRoute('more')"></div> <div v-if="isMore" class="more-mask" @click="toggleRoute('more')"></div>
</transition> </transition>
@ -16,7 +17,6 @@
</ul> </ul>
</div> </div>
</transition> </transition>
<NetworkException v-if="windowSmall" type="alert"/>
<ul class="tabbar-box"> <ul class="tabbar-box">
<li v-for="item in navList" @click="toggleRoute(item.name)" :class="{active: activeName === item.name}"> <li v-for="item in navList" @click="toggleRoute(item.name)" :class="{active: activeName === item.name}">
<i class="taskfont" v-html="item.icon"></i> <i class="taskfont" v-html="item.icon"></i>

View File

@ -1,25 +1,28 @@
<template> <template>
<div class="common-network-exception"> <div class="common-network-exception">
<Alert v-if="type==='alert' && show" type="error" show-icon closable>{{$L('网络连接失败,请检查网络设置。')}}</Alert> <template v-if="type==='alert'">
<Modal <Alert v-if="show" type="error" show-icon closable>{{$L('网络连接失败,请检查网络设置。')}}</Alert>
v-else </template>
v-model="show" <template v-else-if="type==='modal'">
:width="416" <Modal
:closable="false" v-model="show"
:footer-hide="true" :width="416"
class-name="common-network-exception-modal"> :closable="false"
<div class="ivu-modal-confirm"> :footer-hide="true"
<div class="ivu-modal-confirm-head"> class-name="common-network-exception-modal">
<div class="ivu-modal-confirm-head-icon ivu-modal-confirm-head-icon-error"><Icon type="ios-close-circle"/></div><div class="ivu-modal-confirm-head-title">{{$L('温馨提示')}}</div> <div class="ivu-modal-confirm">
<div class="ivu-modal-confirm-head">
<div class="ivu-modal-confirm-head-icon ivu-modal-confirm-head-icon-error"><Icon type="ios-close-circle"/></div><div class="ivu-modal-confirm-head-title">{{$L('温馨提示')}}</div>
</div>
<div class="ivu-modal-confirm-body">
<div>{{$L('网络连接失败,请检查网络设置。')}}</div>
</div>
<div class="ivu-modal-confirm-footer">
<Button type="primary" @click="show = false">{{$L('确定')}}</Button>
</div>
</div> </div>
<div class="ivu-modal-confirm-body"> </Modal>
<div>{{$L('网络连接失败,请检查网络设置。')}}</div> </template>
</div>
<div class="ivu-modal-confirm-footer">
<Button type="primary" @click="show = false">{{$L('确定')}}</Button>
</div>
</div>
</Modal>
</div> </div>
</template> </template>