eladmin的新增功能模块

作为一名开发小白，对eladmin是完全不太熟悉的，花了十天时间做了稍微了解，结合程序员青戈的程序终于将自定义日历和在线聊天室融入到eladmin，再根据送你一朵小红花·大佬的文章修改了前端UI。虽然不知道对别人来说有没有用，但还是想发一下。话不多说，上代码 。

日历

fetch("http://localhost:8000/api/calendar", {
              headers: {
                Authorization: getToken(),//这个一定要有，不然获取不到数据
                }
              })
              .then(res => res.json())
              .then(res => {this.arr = res})

做一个非常简单的设定只有管理员有权限添加日历内容的前端限制

<el-button v-if=" this.$store.getters.user.nickName === 管理员" type="primary" @click="save">确 定</el-button>

还有一个程序员青戈代码上的一个小小的bug，不太记得是啥了，好像是点击后修改不了对应的日期的任务。修改后的代码如下：

handleClick(date) {
            // this.dialogFormVisible = true
            // this.calendar = {date: date}
            fetch("http://localhost:8000/api/calendar/date?date="+ date, {
              headers: {
                Authorization: getToken(),
                }
              })
              .then(res => res.text())
              .then(res => {
                if(res){
                  this.calendar = JSON.parse(res)
                  // console.log(calendar)
                }
                else{
                  this.calendar = {date: date}
                }
                this.dialogFormVisible = true
                })
          },

聊天室

最主要的代码：

socket = new WebSocket(socketUrl+?token=+getToken());

我在写的时候，控制台一直显示被拦截，翻了好久，才发现是被拦截掉了

在SpringSecurityConfig.java中添加"/imserver/**"

有一点很重要的是，在eladmin中，当前登录用户的数据没有存储在sessionStorage或者本地存储。

在login.vue中进行存储数据

sessionStorage.setItem(user,JSON.stringify(user))

这样就可以成功运行了。

还有一点零零碎碎的简单的东西：

用户名限制

username: [

​     { required: true, message: 请输入用户名, trigger: blur },

​     { min: 2, max: 20, message: 长度在 2 到 20 个字符, trigger: blur },

​     {pattern:/^[^u4E00-u9FA5]+$/,message:用户名不能包含中文字符,trigger:blur}

​    ]

密码限制

newPass: [

​     { required: true, message: 请输入新密码, trigger: blur },

​     { pattern: /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/, message: 必须是6-20位数字加字母的组合, trigger: blur }

​    ],