Skip to content

H
haoban-3
Commit 8dad1a33 by 曾经
Options

好办 模拟过期

parent 1949c022
Showing with 301 additions and 13 deletions
src/components/layout/index.vue
<template>
<div class="hb-layout" v-loading="fullLoading.visible">
<main-menu ref="mainMenu" :menu-list="menuList" :actived-code="activedMenu.length > 0 ? activedMenu[0].menuCode : ''" @showLoading="onShowLoading"></main-menu>
<aside-menu v-show="showAside" :menu-list="activedMenu.length > 0 ? activedMenu[0].childList : []" :actived-code="activedMenu.length > 2 ? activedMenu[2].menuCode : ''"></aside-menu>
<div class="hb-layout-content" :style="{ width: showAside ? 'calc(100% - 206px)' : '100%' }">
<bread-menu v-if="activedMenu.length > 3" :menu-list="activedMenu.slice(2)"></bread-menu>
<div class="hb-layout-pager" id="hb-layout-pager-one" :style="{ height: activedMenu.length > 3 ? `calc(100% - 30px)` : '100%', 'padding-bottom': pagePaddingBottom }">
<!-- 页面内容 -->
<!-- <router-view v-if="activeBrand" :brandId="activeBrand" :activeGroupId="activeGroup" :tabType="activeTab" @showTab="showTab"></router-view> -->
<keep-alive>
<router-view :brand-id="enterpriseId" v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" :brand-id="enterpriseId"></router-view>
<div>
<notice></notice>
<div class="hb-layout" v-loading="fullLoading.visible">
<main-menu ref="mainMenu" :menu-list="menuList" :actived-code="activedMenu.length > 0 ? activedMenu[0].menuCode : ''" @showLoading="onShowLoading"></main-menu>
<aside-menu v-show="showAside" :menu-list="activedMenu.length > 0 ? activedMenu[0].childList : []" :actived-code="activedMenu.length > 2 ? activedMenu[2].menuCode : ''"></aside-menu>
<div class="hb-layout-content" :style="{ width: showAside ? 'calc(100% - 206px)' : '100%' }">
<bread-menu v-if="activedMenu.length > 3" :menu-list="activedMenu.slice(2)"></bread-menu>
<div class="hb-layout-pager" id="hb-layout-pager-one" :style="{ height: activedMenu.length > 3 ? `calc(100% - 30px)` : '100%', 'padding-bottom': pagePaddingBottom }">
<!-- 页面内容 -->
<!-- <router-view v-if="activeBrand" :brandId="activeBrand" :activeGroupId="activeGroup" :tabType="activeTab" @showTab="showTab"></router-view> -->
<keep-alive>
<router-view :brand-id="enterpriseId" v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" :brand-id="enterpriseId"></router-view>
</div>
</div>
</div>
</div>
</template>
<script>
import Notice from '@/components/notice/notice.vue';
import { getRequest } from '@/api/api.js';
import errorMsg from '@/common/js/error.js';
import MainMenu from './main-menu.vue';
......@@ -25,7 +29,7 @@ import BreadMenu from './bread-menu.vue';
let provideData = { layoutVm: {} };
export default {
name: 'DmHbLayout',
components: { MainMenu, AsideMenu, BreadMenu },
components: { Notice, MainMenu, AsideMenu, BreadMenu },
provide: () => provideData,
props: {
// 菜单树数据
......
src/components/notice/expire-dialog.vue 0 → 100644
<template>
<el-dialog title="查看服务到期时间" :visible.sync="visible" width="600px" @close="onClose">
<el-table :data="list" max-height="700">
<el-table-column label="服务" prop="serviceName"></el-table-column>
<el-table-column label="到期时间" prop="expireDayStr"></el-table-column>
</el-table>
</el-dialog>
</template>
<script>
export default {
name: 'ExpireDialog',
data() {
return {};
},
props: {
visible: false,
list: []
},
methods: {
onClose() {
this.$emit('update:visible', false);
}
}
};
</script>
<style scoped></style>
src/components/notice/notice.vue 0 → 100644
<template>
<div>
<el-alert v-if="showNotice" class="notice-box" type="warning" show-icon @close="onClose">
<div class="notice-content" slot="title">
<div
class="expire-tip"
v-if="expireTip.show"
:style="{
'max-width': rechargeTip.show ? 'calc(100% - 500px)' : '100%'
}"
>
{{ expireTip.content }}
<el-button type="text" class="more-btn" @click="showDialog = true" v-if="expireTip.showButton">更多到期时间<i class="iconfont-components3 icon-cp-right"></i></el-button>
</div>
<div v-if="expireTip.show && rechargeTip.show" class="separator"></div>
<div v-if="rechargeTip.show" class="recharge-tip">
当前账户已欠费，为不影响正常的通讯业务，请及时充值。
<el-button type="text" class="rechange-btn" @click="toRecharge">前往充值中心<i class="iconfont-components3 icon-cp-right"></i></el-button>
</div>
</div>
</el-alert>
<expire-dialog :visible.sync="showDialog" :list="otherExpireServices"></expire-dialog>
</div>
</template>
<script>
import ExpireDialog from './expire-dialog.vue';
import { getAccountStateInfo, getExpireData } from './request.js';
export default {
name: 'Notice',
inject: ['projectName'],
components: { ExpireDialog },
data() {
return {
showNotice: false,
expireTip: {
show: false,
content: ''
},
rechargeTip: {
show: false
},
showDialog: false,
otherExpireServices: []
};
},
created() {
// 关闭通知后，所有页面都不再显示
// 下次登录后，如果任然欠费，需要再次显示通知
// 所以关闭通知后，不再查询账户欠费状态
if (sessionStorage.getItem('dmShowNotice') != 0) {
this.getAccountState();
}
},
methods: {
getAccountState() {
this.loadAccountStateInfo();
this.loadExpireData();
},
loadAccountStateInfo() {
getAccountStateInfo().then(res => {
const { errorCode, result } = res.data || {};
if (errorCode != 0) return;
this.rechargeTip.show = result.accountBlance <= 0;
if (this.rechargeTip.show) {
this.updateNoticeShow();
}
});
},
loadExpireData() {
let dmUserInfo = JSON.parse(sessionStorage.getItem('userInfos'));
let service = {
serviceType: 1,
serviceName: '好办'
};
let serviceType = service.serviceType;
getExpireData({
serviceType
}).then(res => {
const { errorCode, result } = res.data || {};
if (errorCode != 0) return;
let { otherExpireServices, expireStatus, expireDayStr } = result;
expireStatus = 1;
otherExpireServices = otherExpireServices || [];
if (expireStatus == 1) {
this.expireTip.content = `${service.serviceName}将于 ${expireDayStr} 到期，到期后将被冻结无法登录，请及时联系运营人员续费。`;
this.expireTip.show = true;
} else if (otherExpireServices.length) {
this.expireTip.content = `${otherExpireServices[0].serviceName}将于 ${otherExpireServices[0].expireDayStr} 到期，到期后功能无法使用，请及时联系运营人员续费。`;
this.expireTip.show = true;
}
this.expireTip.showButton = otherExpireServices.length && serviceType == 11;
this.otherExpireServices = otherExpireServices || [];
if (serviceType == 11 && !dmUserInfo.superAdmin) {
this.expireTip.show = false;
}
if (this.expireTip.show) {
this.updateNoticeShow();
}
});
},
updateNoticeShow() {
if (this.showNotice) return;
this.showNotice = true;
this.$emit('show');
},
onClose() {
sessionStorage.setItem('dmShowNotice', 0);
this.showNotice = false;
this.$emit('close');
},
toRecharge() {
window.open(location.origin + '/marketing/#/recharge/do');
}
}
};
</script>
<style scoped>
.notice-box {
flex-shrink: 0;
padding: 0 21px;
width: 100%;
height: 42px;
background: #fef3eb;
}
.notice-box /deep/ .el-alert__content {
width: 100%;
}
.notice-box .notice-content {
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
font-size: 14px;
font-weight: 400;
color: #303133;
line-height: 42px;
}
.notice-box .recharge-tip {
flex-shrink: 0;
width: 500px;
}
.notice-box .recharge-tip .rechange-btn {
margin-left: 12px;
font-weight: 500;
color: #fa8c16;
}
.notice-box .recharge-tip .rechange-btn /deep/ span {
display: flex;
align-items: center;
}
.notice-box .separator {
margin: 0 25px;
width: 2px;
height: 28px;
background: linear-gradient(180deg, rgba(253, 192, 49, 0) 0%, #fa8c16 50%, rgba(253, 192, 49, 0) 100%);
}
.notice-box .expire-tip {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-weight: 600;
}
.notice-box .more-btn {
margin-left: 12px;
font-weight: 500;
color: #fa8c16;
}
.notice-box .more-btn /deep/ span {
display: flex;
align-items: center;
}
.notice-box /deep/ .el-alert__closebtn {
top: 50%;
transform: translateY(-50%);
font-size: 18px;
color: #606266;
}
</style>
src/components/notice/request.js 0 → 100644
import { getCurrentService } from "./serviceUtil.js";
import axios from 'axios';
function getRequest(url,params) {
return axios({
method: 'get',
url: `${window.origin}${url}`,
data: {},
params: params,
headers: { 'content-type': 'application/x-www-form-urlencoded' }// "token": token
});
}
export function getAccountStateInfo() {
return getRequest('api-marketing/account-state-info', {
requestProject: "haoban-manage-web",
})
}
export function getExpireData(params) {
params = params || {};
let dmUserInfo = JSON.parse(sessionStorage.getItem('userInfos'));
let serviceType = 1;
return getRequest("/api-admin/enterprise_expirebar", {
requestProject: "haoban-manage-web",
serviceType: serviceType,
isSuperAdmin: dmUserInfo.superAdmin,
enterpriseId: dmUserInfo.enterpriseId,
...params
})
}
\ No newline at end of file
src/components/notice/serviceUtil.js 0 → 100644
// 1好办，2微盟，3取数平台，4观云台，5万象仪，6分享有礼，7付费会员，8会员通，9抖音 10云服务器 11商户后台
const config = {
'/api-auth/login-for-haoban?requestProject=1': {
serviceName: '好办',
serviceType: 1
},
'/data-hook-frontend/#/flat-query-list': {
serviceName: '取数平台',
serviceType: 3
},
'/gicweb/cloud/#/storelist': {
serviceName: '观云台',
serviceType: 4
},
'/share-config/shareIndex': {
serviceName: '分享有礼',
serviceType: 6
},
'/gic-web/#/memberCardSet': {
serviceName: '付费会员',
serviceType: 7
}
};
const defaultService = {
serviceType: 11,
serviceName: '商户'
};
function getService(key) {
return config[key] || defaultService;
}
export function getCurrentService() {
return getService(window.location.pathname + window.location.hash);
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment