项目实战——emos在线办公系统:会议申请、请假申请等部分代码理解

92 阅读2分钟

哈喽哈喽,这里是小菜不拖延博主!

春日打卡day6~

记录思路:

请假需要上传图片

审批添加驳回理由:

点击驳回之后,会弹出驳回的界面

驳回界面当中填写驳回理由

最后驳回理由可以查看到

思路

第一种,点击之后弹出像会议申请那样的界面

第二种,跳出原来的界面之后,点击否决,弹出我们的驳回理由

第三种,把审批直接改成否决 同意,点击否决之后使用messagebox弹窗的组件

采用第三种

第一:先把操作界面改成“否决 同意——在approval当中”170行

参考:会议管理部分的线上会议,online_meeting.vue的操作部分代码54行代码的进入和删除操作

第二步:修改了同意,使其能有已同意弹窗

第三步:为否决按钮添加弹窗,采用elementui当中messagebox弹框

第四步:实现点击之后出现类似于添加会议申请的弹窗

会议申请流程:

首先点击会议申请,调用addHandle函数 ,addHandle中,让addVisible为true,也就是说,让弹窗可见,

所以我先创建一个否决的vue文件

然后在approve.vue当中引入,注册,

然后用这个使用这个标签,最开始的时候,v-if要写成false,让其不可见

点击否决这个按钮,启用一个函数,函数,函数里面将v-if的值修改成true,使弹窗可见

现在进行:先不着急提交文本框里面的内容,我先让否决点击之后,可以弹出弹框,并且在点击确定的时候,可以提示操作成功

现在卡住了,点击之后没有弹出弹框

image.png

image.png

image.png

image.png 卡住了没有弹出弹框,所以现在我们来尝试复制整个offine_meeting_add的代码,先让他能弹出会议申请的那个弹框

现在已经完成了弹窗的必填以及验证,

现在需要做的是将理由提交,然后显示到被拒绝的用户的地方

发现同样的代码出现在在线办公-员工共请假,leave.vue70行

image.png 所以我们现在去理解这一部分代码,让我们的拒绝理由可以被看到

Leave_add.vue

image.png

image.png

image.png Leave.vue

image.png