vue+elementui+springboot后端菜单国际化

vue提供了前端国际化,但菜单栏通过后端控制,个人写个后端菜单国际化的控制(可扩展)

主要思路:后端启动时初始化将数据库中所有的菜单初始到容器里,前端发请求带上语言类型请求头,更据语言类型返回菜单数据

 新增一张表sys_lang

/*==============================================================*/
/* Table: sys_lang                                              */
/*==============================================================*/
create table sys_lang
(
   lang_id              bigint not null auto_increment comment '主键',
   lang_key             varchar(50) comment '语言key',
   lang_value           varchar(150) comment '语言value',
   lang_type            tinyint default 1 comment '语言类型(1 中文 2 英文)',
   primary key (lang_id)
);

alter table sys_lang comment '系统语言表';

 

import java.util.HashMap;
import java.util.Map;

import org.apache.commons.lang3.StringUtils;

/**
  * @description 国际化菜单数据容器
  * @autor linxh
  * @date 2019年12月4日
  */
public class L18nMenuContainer {
    
    /**
     * 中文容器
     */
    private static Map<String, String> L18N_ZH_MENU_MAP = new HashMap<String, String>(16);
    
    /**
     * 英文容器
     */
    private static Map<String, String> L18N_EN_MENU_MAP = new HashMap<String, String>(16);
    
    /**
     * 获取
     * @param key
     * @return
     */
    protected static String get(String key) {
        if (StringUtils.isBlank(key)) {
            throw new NullPointerException("menu key is null");
        }
        return getContainerByHeader().get(key);
    }
    
    /**
     * 清空
     */
    protected static void clearAll() {
        if (!L18N_EN_MENU_MAP.isEmpty()) {
            L18N_EN_MENU_MAP.clear();
        }
        if (!L18N_ZH_MENU_MAP.isEmpty()) {
            L18N_ZH_MENU_MAP.clear();
        }
    }
    
    /**
     * 获取容器
     * @return
     */
    protected static Map<String, String> getContainerByHeader() {
        String header = L18nHeader.getHeader();
        if (Constant.EN_US.equals(header)) {
            return L18N_EN_MENU_MAP;
        } else  if (Constant.ZH_CN.equals(header)){
            return L18N_ZH_MENU_MAP;
        }
        throw new RuntimeException("get l18n header error");
    }
    
    /**
     * 获取容器
     * @return
     */
    protected static Map<String, String> getContainerByType(int type) {
        if (type == L18nEnum.EN_US.getOrdial()) {
            return L18N_EN_MENU_MAP;
        } else  if (type == L18nEnum.ZH_CN.getOrdial()){
            return L18N_ZH_MENU_MAP;
        }
        throw new RuntimeException("get lang type error");
    }
}

 

import java.util.List;

import javax.annotation.PostConstruct;

import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;

import lombok.extern.slf4j.Slf4j;

/**
  * @description 菜单国际化
  * @autor linxh
  * @date 2019年12月3日
  */
@Component
@Slf4j
public class L18nMenu {
    
    @Autowired
    private SysLangService langService;
    
    
    
    /**
     * 重试次数
     */
    private static final int RETRY_COUNT = 3;
    
    /**
     * 初始化
     */
    @PostConstruct
    public void init() {
        int updCount = 0;
        while (updCount < RETRY_COUNT) {
            if (this.insertAll()) {
                return;
            }
            updCount++;
        }
        if (log.isErrorEnabled()) {
            log.error("lang init faild");
        }
        throw new RuntimeException("lang init faild");
    }
    
    /**
     * 插入所有数据
     */
    public boolean insertAll() {
        try {
            List<SysLang> menuLangList = langService.selectAll();
            for (SysLang sysLang : menuLangList) {
                addOrUpd(sysLang.getLangKey(), sysLang.getLangValue(), sysLang.getLangType());
            }
        } catch (Exception e) {
            return false;
        }
        return true;
    }
    
    /**
     * 定时更新
     */
    public void execute() {
        L18nMenuContainer.clearAll();
        int updCount = 0;
        while (updCount < RETRY_COUNT) {
            if (this.insertAll()) {
                return;
            }
            updCount++;
        }
        if (log.isErrorEnabled()) {
            log.error("lang update faild");
        }
        throw new RuntimeException("lang update faild");
    }
    
    /**
     * 添加或修改
     * @param key
     * @param val
     */
    public void addOrUpd(String key, String val, int type) {
        if (StringUtils.isBlank(key) || StringUtils.isBlank(val)) {
            throw new NullPointerException("menu key or value is null");
        }
        L18nMenuContainer.getContainerByType(type).put(key, val);
    }
    
    /**
     * 获取值
     * @param key
     * @return
     */
    public String getVal(String key) {
        return L18nMenuContainer.get(key);
    }
}

 /**
  * @description 语言类型枚举
  * @autor linxh
  * @date 2019年12月4日
  */
public enum L18nEnum {
    ZH_CN(1,"中文"),
    EN_US(2,"英文");
    
    /**
     * 类型值
     */
    private int ordial;
    /**
     * 类型描述
     */
    private String l18nDesc;
    
    private L18nEnum(int ordial, String l18nDesc) {
        this.ordial = ordial;
        this.l18nDesc = l18nDesc;
    }
    
    public final int getOrdial(){
        return this.ordial;
    }
}

 

import javax.servlet.http.HttpServletRequest;

import org.springframework.web.context.request.RequestContextHolder;
import org.springframework.web.context.request.ServletRequestAttributes;

/**
 * @description 国际化请求头
 * @autor linxh
 * @date 2019年12月3日
 */
public class L18nHeader {
    
    private final static String L18N_VAL= "i18n";
    
    public static String getHeader() {
        ServletRequestAttributes requestAttributes = (ServletRequestAttributes)RequestContextHolder.getRequestAttributes();
        if(null != requestAttributes) {
            HttpServletRequest request = requestAttributes.getRequest();            
            String headerVal = request.getHeader(L18N_VAL);
            return headerVal;
        }
        return "";
    }
}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
摘 要 在如今这个人才需求量大的时代,各方企业为了永葆企业的活力与生机,在不断开 拓进取的同时,又广泛纳用人才,为企业的长久发展奠定了基础。于是,各个企业与部 门机构,都不可避免地会接触到人力资源管理的问题。 Hrm 是一款人力资源管理系统,其主要功能模块有员工个人信息修改、请假、员工 的薪资管理、考勤管理、社保管理。其中考勤管理实现了员工考勤状态的修改与员工考 勤月报表的导出,以及通过员工考勤记录的导入来实现员工考勤状态的判断。社保管理, 主要实现了员工社保的计算以及明细的修改。薪资管理,实现了员工工资的调整,以及 员工月工资报表的导出。 本项目采用了前后端分离的技术,前端是基于 Vue+ElementUI+Axios 开发的,后端 则是基于 Spring Boot+MyBatis Plus+ Jwt+Mysql。本项目实现了权限菜单管理,通过员 工的权限动态渲染菜单,并动态生成路由。通过 Jwt token 来判断当前登录的员工以及 员工的登录状态。 关键词:人力资源管理系统,Spring Boot,Vue,权限管 人力资源管理是企业运营中必不可少的一环,它关系到企业的前途与发展。尤其对 于中小微企业来说,对企业的发展有着举足轻重的作用。随着近年来,政府对创业项目 的大力扶持,我国创业型企业蓬勃发展。据统计,2019 年,我国创业企业数量已达 1810 万余家,占全国企业数的 97%,截止 2020 年,我国创业企业数量达到了 2030 万,同比 增长 10%。虽然我国创业企业的基数在不断增大,但是能够长久存活的企业却少之又少。 在创业初期,随着企业初具规模,大多数创业者开始将主要精力集中在市场调研和 开发产品上,而忽略了团队的内部管理。据调查,中国企业的平均寿命是 7.02 年,但 70%的企业存活不超过 5 年,究其原因有很多,其中最重要的一点就是,人力资源管理 未能有效推动企业向前发展
实现动态路由需要在前端和后端两个方面进行处理,以下是使用VueElementUI和Spring Boot实现动态路由的代码示例: 前端代码示例: 1. 在Vue中,可以使用Vue Router来处理路由。首先需要在main.js中引入Vue Router并创建router实例,然后在路由配置文件中定义路由。在路由配置文件中,可以使用动态路由参数(例如:id)来处理动态路由: ```javascript // main.js import Vue from 'vue' import VueRouter from 'vue-router' import App from './App.vue' import router from './router' Vue.use(VueRouter) new Vue({ router, render: h => h(App) }).$mount('#app') // router.js import VueRouter from 'vue-router' import Home from './views/Home.vue' import About from './views/About.vue' import Dynamic from './views/Dynamic.vue' const router = new VueRouter({ routes: [ { path: '/', name: 'home', component: Home }, { path: '/about', name: 'about', component: About }, { path: '/dynamic/:id', name: 'dynamic', component: Dynamic } ] }) export default router ``` 2. 在ElementUI中,可以使用Menu组件来实现动态路由。首先需要在App.vue中引入Menu组件,并在Menu组件中定义路由菜单。在路由菜单中,可以使用动态路由参数(例如:id)来处理动态路由: ```html <template> <div id="app"> <el-container> <el-aside> <el-menu :default-active="activeIndex" class="el-menu-vertical-demo" @select="handleSelect"> <el-menu-item index="/"> <i class="el-icon-menu"></i> <span>Home</span> </el-menu-item> <el-menu-item index="/about"> <i class="el-icon-document"></i> <span>About</span> </el-menu-item> <el-menu-item v-for="item in dynamicRoutes" :key="item.path" :index="item.path"> <i class="el-icon-folder"></i> <span>{{ item.name }}</span> </el-menu-item> </el-menu> </el-aside> <el-main> <router-view></router-view> </el-main> </el-container> </div> </template> <script> import { Menu } from 'element-ui' export default { name: 'App', components: { 'el-menu': Menu }, data() { return { activeIndex: '/', dynamicRoutes: [] } }, created() { this.dynamicRoutes = [ { path: '/dynamic/1', name: 'Dynamic1' }, { path: '/dynamic/2', name: 'Dynamic2' } ] }, methods: { handleSelect(index) { this.activeIndex = index this.$router.push(index) } } } </script> ``` 后端代码示例: 1. 在Spring Boot中,可以使用@RestController注解来定义控制器,并在控制器中定义动态路由。在动态路由中,可以使用@PathVariable注解来处理动态

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值