#报销审核实装

LSH

2023-08-22 688ab515b1eadad9fc4cd3be5578833ef418a59b

#报销审核实装

 src/main/java/com/zy/crm/common/model/SettleDto.java

@@ -2,6 +2,7 @@

import com.core.common.DateUtils;
import com.zy.crm.manager.entity.Plan;
import com.zy.crm.manager.entity.ReimburseOnline;
import com.zy.crm.system.entity.User;
import lombok.Data;

@@ -115,4 +116,60 @@
        return list;
    }

    public static List<SettleDto> initPriQuote(ReimburseOnline reimburseOnline, User manager , User president3, User president4,User president5,User president6,User user) {
        List<SettleDto> list = new ArrayList<>();
        for (int i = 1; i < 7; i++) {
            SettleDto dto = new SettleDto();
            dto.setStep(i);
            switch (i) {
                case 1:
                    dto.setTitle("开始");
                    dto.setMsg(user.getUsername() + "创建了审批");
                    dto.setUserId(user.getId());
                    dto.setUsername(user.getUsername());
                    dto.setTime(DateUtils.convert(new Date()));
                    dto.setCurr(Boolean.TRUE);
                    list.add(dto);
                    break;
                case 2:
                    dto.setTitle("部门经理审核");
                    dto.setUserId(manager.getId());
                    dto.setUsername(manager.getNickname());
                    list.add(dto);
                    break;
                case 3:
                    dto.setTitle(president3.getUsername()+"审核");
                    dto.setUserId(president3.getId());
                    dto.setUsername(president3.getNickname());
                    list.add(dto);
                    break;
                case 4:
                    dto.setTitle(president4.getUsername()+"审核");
                    dto.setUserId(president4.getId());
                    dto.setUsername(president4.getNickname());
                    list.add(dto);
                    break;
                case 5:
                    dto.setTitle(president5.getUsername()+"审核");
                    dto.setUserId(president5.getId());
                    dto.setUsername(president5.getNickname());
                    list.add(dto);
                    break;
                case 6:
                    dto.setTitle(president6.getUsername()+"审核");
                    dto.setUserId(president6.getId());
                    dto.setUsername(president6.getNickname());
                    list.add(dto);
                    break;
//                case 4:
//                    dto.setTitle("业务员审核");
//                    list.add(dto);
//                    break;
                default:
                    break;
            }
        }
        return list;
    }

}

 src/main/java/com/zy/crm/manager/controller/PriQuoteController.java

@@ -153,8 +153,8 @@
        priQuote.setForm(JSON.toJSONString(map));     // 自定义表单内容
        priQuote.setSettle(1);  // 1.开始
        User manager = userService.getDeptManager(getHostId(), getUser().getDeptId());        // 获取部门领导
        ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 2).eq("process", 3));//2：报价流程
        User president = userService.selectById(processPermissions.getUserId());       // 获取报价流程节点3确认人
        ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 2).eq("process", "3-1"));//2：报价流程
        User president = userService.selectById(processPermissions.getUserId());       // 获取报价流程节点3-1确认人
        priQuote.setSettleMsg(JSON.toJSONString(SettleDto.initPriQuote(plan, manager,president,getUser())));

        planService.updateById(plan);
@@ -470,11 +470,10 @@
                }
                break;
            case 2:
                // 查找规划组长
                ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 2).eq("process", 3));//2：报价流程
                ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 2).eq("process", "3-1"));//2：报价流程
                User planLeader = userService.selectById(processPermissions.getUserId());       // 获取报价流程节点3确认人
                if (Cools.isEmpty(planLeader)) {
                    throw new CoolException("未查找到报价流程节点3确认人，请联系在审批权限添加确认人！");
                    throw new CoolException("未查找到报价流程节点3-1确认人，请联系在审批权限添加确认人！");
                }
                if (!getUserId().equals(planLeader.getId())) {
                    return R.error("抱歉，您没有审核的权限");
@@ -590,10 +589,10 @@
//                }
//                break;
//            case 2:
//                // 查找规划组长
//                User planLeader = userService.selectOne(new EntityWrapper<User>().eq("username","王开杰"));
//                ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 2).eq("process", "3-1"));//2：报价流程
//                User planLeader = userService.selectById(processPermissions.getUserId());       // 获取报价流程节点3确认人
//                if (Cools.isEmpty(planLeader)) {
//                    throw new CoolException("未查找总裁办，请联系管理员");
//                    throw new CoolException("未查找到报价流程节点3-1确认人，请联系在审批权限添加确认人！");
//                }
//                if (!getUserId().equals(planLeader.getId())) {
//                    return R.error("抱歉，您没有审核的权限");

 src/main/java/com/zy/crm/manager/controller/ReimburseOnlineController.java

@@ -1,5 +1,6 @@
package com.zy.crm.manager.controller;

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONObject;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
@@ -10,11 +11,15 @@
import com.core.common.DateUtils;
import com.core.common.R;
import com.core.domain.KeyValueVo;
import com.core.exception.CoolException;
import com.zy.crm.common.model.SettleDto;
import com.zy.crm.common.web.BaseController;
import com.zy.crm.manager.entity.*;
import com.zy.crm.manager.entity.param.ReimburseOnlineDomainParam;
import com.zy.crm.manager.service.*;
import com.zy.crm.manager.utils.RuleUtils;
import com.zy.crm.system.entity.User;
import com.zy.crm.system.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.core.io.ClassPathResource;
import org.springframework.transaction.annotation.Transactional;
@@ -38,15 +43,34 @@

    @Autowired
    private PlanService planService;

    @Autowired
    private ReimburseOnlineDetlService reimburseOnlineDetlService;

    @Autowired
    private RuleService ruleService;

    @Autowired
    private UserService userService;

    @Autowired
    private ProcessPermissionsService processPermissionsService;

    @RequestMapping(value = "/reimburseOnline/{id}/auth")
    @ManagerAuth
    public R get(@PathVariable("id") String id) {
        return R.ok(reimburseOnlineService.selectById(String.valueOf(id)));
        ReimburseOnline reimburseOnline = reimburseOnlineService.selectById(String.valueOf(id));
        assert reimburseOnline != null;
        JSONObject resultObj = JSON.parseObject(JSON.toJSONString(reimburseOnline));
        if (!Cools.isEmpty(reimburseOnline.getForm())) {
            JSONObject formObj = JSON.parseObject(reimburseOnline.getForm());
            formObj.forEach(resultObj::putIfAbsent);
        }

        // 步骤条相关
        resultObj.put("step", reimburseOnline.getSettle() == 6 ? 0 : reimburseOnline.getSettle() + 1);

        return R.ok().add(resultObj);
    }

    @RequestMapping(value = "/reimburseOnline/viewCheck/{id}/auth")
@@ -122,9 +146,36 @@
        Date now = new Date();
        Rule rule = ruleService.selectById(1);
        ReimburseOnline reimburseOnline = new ReimburseOnline(planId,RuleUtils.rule(rule),now,getUser());
        reimburseOnline.setMemberId(getUserId());
        reimburseOnline.setCheckData(param.getCheckData());
        reimburseOnline.setTemplateName(param.getTemplateName());

        reimburseOnline.setSettle(1);  // 1.开始
        User manager = userService.getDeptManager(getHostId(), getUser().getDeptId());        // 获取部门领导

        ProcessPermissions processPermissions3 = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 3).eq("process", param.getCheckData().equals("否")? "3-1" : "3-2"));//3：报销流程
        User president3 = userService.selectById(processPermissions3.getUserId());       // 获取报价流程节点3确认人

        ProcessPermissions processPermissions4 = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 3).eq("process", "4-1"));//3：报销流程
        User president4 = userService.selectById(processPermissions4.getUserId());       // 获取报价流程节点4确认人

        ProcessPermissions processPermissions5 = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 3).eq("process", "5-1"));//3：报销流程
        User president5 = userService.selectById(processPermissions5.getUserId());       // 获取报价流程节点5确认人

        ProcessPermissions processPermissions6 = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 3).eq("process", "6-1"));//3：报销流程
        User president6 = userService.selectById(processPermissions6.getUserId());       // 获取报价流程节点6确认人

        reimburseOnline.setSettleMsg(JSON.toJSONString(SettleDto.initPriQuote(reimburseOnline, manager,president3,president4,president5,president6,getUser())));
        Map<String, Object> map = new HashMap<>();
        map.put("title","非项目型报销");
        map.put("reimburseId",param.getReimburseId());
        map.put("docType",param.getDocType());
        map.put("orderNo",param.getOrderNo());
        map.put("templateName",param.getTemplateName());
        map.put("checkData",param.getCheckData());
        map.put("reimburseOnlineDetls",param.getReimburseOnlineDetls());
        reimburseOnline.setForm(JSON.toJSONString(map));
        reimburseOnline.setMemberId(president3.getId());

        if (!reimburseOnlineService.insert(reimburseOnline)){
            return R.error("添加报销主档失败");
        }
@@ -382,4 +433,109 @@
        return R.ok().add(vos);
    }

    @PostMapping(value = "/reimburseOnline/approval/auth")
    @ManagerAuth
    public R approvalReimburseOnline(@RequestParam Long planId,
                              @RequestParam(required = false) Long plannerId){
        ReimburseOnline reimburseOnline = reimburseOnlineService.selectById(planId);
        assert reimburseOnline != null;
        Integer settle = reimburseOnline.getSettle();
        String process="";
        switch (reimburseOnline.getSettle()) {
            case 1:
                // 本部门经理审核
                User user = userService.selectById(reimburseOnline.getUserId());
                User manager = userService.getDeptManager(getHostId(), user.getDeptId());
                if (manager.getId().equals(getUserId())) {

                    // 修改 settle 步骤数据
                    List<SettleDto> list = JSON.parseArray(reimburseOnline.getSettleMsg(), SettleDto.class);
                    for (SettleDto dto : list) {
                        switch (dto.getStep()) {
                            case 1:
                                dto.setCurr(Boolean.FALSE);
                                break;
                            case 2:
                                dto.setCurr(Boolean.TRUE);
                                dto.setMsg("部门经理" + manager.getNickname() + "审批通过");
                                dto.setTime(DateUtils.convert(new Date()));
                                break;
                            default:
                                break;
                        }
                    }
                    reimburseOnline.setSettleMsg(JSON.toJSONString(list));

                    // 修改规划单状态
                    reimburseOnline.setSettle(2);  // 总裁办待审
                    reimburseOnline.setUpdateUserId(getUserId());
                    reimburseOnline.setUpdateTime(new Date());

                    if (!reimburseOnlineService.updateById(reimburseOnline)) {
                        throw new CoolException("审核失败，请联系管理员");
                    }

                } else {
                    return R.error("抱歉，您没有审核的权限");
                }
                break;
            case 2:
                if (reimburseOnline.getCheckData().equals("否")){
                    process="3-1";
                }else {
                    process="3-2";
                }
            case 3:
                if (Cools.isEmpty(process) || process.equals("")){
                    process="4-1";
                }
            case 4:
                if (Cools.isEmpty(process) || process.equals("")){
                    process="5-1";
                }
            case 5:
                if (Cools.isEmpty(process) || process.equals("")){
                    process="6-1";
                }
                ProcessPermissions processPermissions = processPermissionsService.selectOne(new EntityWrapper<ProcessPermissions>().eq("process_memo", 3).eq("process", process));//3：报销流程
                User planLeader = userService.selectById(processPermissions.getUserId());       // 获取报价流程节点确认人

                if (Cools.isEmpty(planLeader)) {
                    throw new CoolException("未查找到报价流程节点"+process+"确认人，请联系在审批权限添加确认人！");
                }
                if (!getUserId().equals(planLeader.getId())) {
                    return R.error("抱歉，您没有审核的权限");
                }
                // 修改 settle 步骤数据
                List<SettleDto> list = JSON.parseArray(reimburseOnline.getSettleMsg(), SettleDto.class);
                for (SettleDto dto : list) {
                    if (dto.getStep().equals(settle)){
                        dto.setCurr(Boolean.FALSE);
                        break;
                    }else if (dto.getStep().equals(settle+1)){
                        dto.setCurr(Boolean.TRUE);
                        dto.setMsg("报价流程节点"+process+"确认人:"+planLeader.getNickname() + "审批通过");
                        dto.setTime(DateUtils.convert(new Date()));
                        break;
                    }else {
                        break;
                    }
                }
                reimburseOnline.setSettleMsg(JSON.toJSONString(list));
                // 修改规划单状态
                reimburseOnline.setSettle(settle+1);
                reimburseOnline.setUpdateUserId(getUserId());
                reimburseOnline.setUpdateTime(new Date());
                reimburseOnline.setMemberId(planLeader.getId());

                if (!reimburseOnlineService.updateById(reimburseOnline)) {
                    throw new CoolException("审核失败，请联系管理员");
                }
                break;
            default:
                return R.error();
        }
        return R.ok("审批成功");
    }

}

 src/main/java/com/zy/crm/manager/entity/ProcessPermissions.java

@@ -89,7 +89,7 @@
     * 权限节点
     */
    @ApiModelProperty(value= "权限节点")
    private Integer process;
    private String process;

    /**
     * 备注
@@ -106,7 +106,7 @@

    public ProcessPermissions() {}

    public ProcessPermissions(String userName, Long userId, String priQuote, String reimburse, String standby1, String standby2, String standby3, String standby4, String standby5, String standby6, Integer process, String memo, Integer processMemo) {
    public ProcessPermissions(String userName, Long userId, String priQuote, String reimburse, String standby1, String standby2, String standby3, String standby4, String standby5, String standby6, String process, String memo, Integer processMemo) {
        this.userName = userName;
        this.userId = userId;
        this.priQuote = priQuote;

 src/main/webapp/static/js/common.js

@@ -223,3 +223,4 @@
var orderByMore;
var planByMore;
var priQuoteByMore;
var reimburseOnlineByMore;

 src/main/webapp/static/js/reimburseOnline/reimburseOnline.js

@@ -4,6 +4,7 @@
layui.config({
    base: baseUrl + "/static/layui/lay/modules/"
}).extend({
    steps: 'steps/steps',
    cascader: 'cascader/cascader',
}).use(['table','laydate', 'form', 'admin', 'xmSelect', 'element', 'cascader', 'tree', 'dropdown'], function(){
    var table = layui.table;
@@ -86,7 +87,7 @@
            {field: 'id', title: 'ID', sort: true,align: 'center', fixed: 'left', width: 80,hide: true}
            ,{field: 'templateName', align: 'center',title: '报销类型',hide: false}
            ,{field: 'checkData', align: 'center',title: '是否冲账',hide: false}
            ,{field: 'orderNum', align: 'center',title: '报销单号',width: 320, hide:false}
            ,{field: 'orderNum', align: 'center',title: '报销单号',width: 320, style: 'color: #1890ff;cursor:pointer', event: 'more',hide: false}
            ,{field: 'planId$', align: 'center',title: '项目号',hide: false}
            ,{field: 'createTime$', align: 'center',title: '创建时间',hide: false}
            ,{field: 'updateTime$', align: 'center',title: '更新时间',hide: false}
@@ -235,20 +236,34 @@
    table.on('tool(reimburseOnline)', function(obj){
        var data = obj.data;
        switch (obj.event) {
            // 核价
            case 'check':
                layer.open({
                    type: 2,
                    title: '核价',
                    maxmin: true,
                    area: [top.detailWidth, top.detailHeight],
                    shadeClose: false,
                    content: 'reimburseOnline_detail.html?id=' + data.id,
                    success: function(layero, index){
                        // layer.iframeAuto(index);layer.style(index, {top: (($(window).height()-layer.getChildFrame('#data-detail', index).height())/3)+"px"});
            case 'more':
                top.reimburseOnlineByMore=data.id;
                console.log(top.reimburseOnlineByMore)

                admin.popupRight({
                    type: 1,
                    window: "top",
                    area: "1250px",
                    url: "reimburseOnline_more.html",
                    end: function () {
                        // $(".layui-laypage-btn")[0].click();
                    }
                });
                })
                break;
            // // 核价
            // case 'check':
            //     layer.open({
            //         type: 2,
            //         title: '核价',
            //         maxmin: true,
            //         area: [top.detailWidth, top.detailHeight],
            //         shadeClose: false,
            //         content: 'reimburseOnline_detail.html?id=' + data.id,
            //         success: function(layero, index){
            //             // layer.iframeAuto(index);layer.style(index, {top: (($(window).height()-layer.getChildFrame('#data-detail', index).height())/3)+"px"});
            //         }
            //     });
            //     break;
            case 'del':
                layer.confirm('确定删除这条数据吗', function(){
                    $.ajax({
@@ -370,13 +385,13 @@
            case "look":
                var $a = $(obj.tr).find('a[lay-event="look"]');
                var offset = $a.offset();
                var top = offset.top;
                var top2 = offset.top;
                var left = offset.left;
                layer.open({
                    type: 1,
                    title: false,
                    area: '2100px',
                    offset: [top + 'px', (left - 1730 + $a.outerWidth()) + 'px'],
                    offset: [top2 + 'px', (left - 1730 + $a.outerWidth()) + 'px'],
                    shade: .01,
                    shadeClose: true,
                    fixed: false,
@@ -697,6 +712,33 @@
        });
    }

    function approval(planId, plannerId, dIdx) {
        let loadIndex = layer.load(2);
        $.ajax({
            url: baseUrl+"/reimburseOnline/approval/auth",
            headers: {'token': localStorage.getItem('token')},
            data: {
                planId: planId,
                plannerId: plannerId
            },
            method: 'POST',
            success: function (res) {
                if (dIdx) {
                    layer.close(dIdx);
                }
                layer.close(loadIndex);
                if (res.code === 200){
                    layer.msg(res.msg, {icon: 1});
                    tableReload();
                } else if (res.code === 403){
                    top.location.href = baseUrl+"/";
                } else {
                    layer.msg(res.msg, {icon: 2});
                }
            }
        })
    }

    /* 弹窗 - 新增、修改 */
    // function showEditModel(mData) {
    //     admin.open({

 src/main/webapp/views/priQuote/priQuote_more.html

@@ -189,7 +189,7 @@
                        form.val('formAdvForm', priQuote);
                        top.convertDisabled($('#formAdvForm :input'), true);
                        // 跟进人
                        initFollowers(priQuote.id);
                        // initFollowers(priQuote.id);
                        layDateRender();
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/";

 src/main/webapp/views/processPermissions/processPermissions.html

@@ -146,13 +146,14 @@
                    <div class="layui-input-block">
                        <select name="process" lay-vertype="tips" lay-verify="required">
                            <option value="">请选择状态</option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                            <option value="7">7</option>
                            <option value="1-1">1-1</option>
                            <option value="2-1">2-1</option>
                            <option value="3-1">3-1</option>
                            <option value="3-2">3-2</option>
                            <option value="4-1">4-1</option>
                            <option value="5-1">5-1</option>
                            <option value="6-1">6-1</option>
                            <option value="7-1">7-1</option>
                        </select>
                    </div>
                </div>

 src/main/webapp/views/reimburseOnline/reimburseOnline.html

@@ -82,6 +82,9 @@


<script type="text/html" id="operate">
  {{# if (d.settle == 1 || d.settle == 2 || d.settle == 3) { }}
  <a class="layui-btn layui-btn-xs btn-edit" lay-event="approval2">审批</a>
  {{# } }}
  <a class="layui-btn layui-btn-xs btn-edit" lay-event="approval">提交</a>
<!--  <a class="layui-btn layui-btn-xs btn-edit" lay-event="check">模板</a>-->
  <a class="layui-btn layui-btn-primary layui-btn-xs btn-edit" lay-event="edit">编辑</a>
@@ -92,12 +95,14 @@

<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script>
<script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/js/cool.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/js/luckysheet_js/luckyexcel.umd.js"></script>
<script type="text/javascript" src="../../static/js/luckysheet_js/pako.es5.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/js/luckysheet_js/base64.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/js/reimburseOnline/reimburseOnline.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/layui/lay/modules/cascader/citys-data.js" charset="utf-8"></script>
<!--&lt;!&ndash; 表单弹窗 &ndash;&gt;-->
<!--<script type="text/html" id="editDialog">-->
<!--  <div id="detail" lay-filter="detail" class="layui-form admin-form model-form">-->

 src/main/webapp/views/reimburseOnline/reimburseOnline_more.html

New file
@@ -0,0 +1,219 @@
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<style>
    #formAdvForm {
        background-color: #f3f3f3;
    }
    #formAdvForm .layui-form-item {
        margin-top: 20px;
        margin-bottom: 0;
    }

    #formAdvForm .layui-form-item .layui-inline {
        margin-bottom: 25px;
        margin-right: 0;
    }

    .form-group-bottom {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 10px 20px;
        background-color: #fff;
        box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, .05);
    }

    .card-body-item {
        display: inline-block;
        border-right: 1px solid #e0e0e0;
        width: 250px;
        padding: 0 30px 0 10px;
    }
    .header-desc {
        overflow:hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        -o-text-overflow:ellipsis;
    }

</style>
<!-- 正文开始 -->
<form class="layui-form" id="formAdvForm" lay-filter="formAdvForm" style="height: 100%">
    <div class="layui-fluid" style="padding-bottom: 75px;height: 100%; overflow: scroll;box-sizing: border-box">
        <!-- 标题 -->
        <div class="layui-card">
            <div class="layui-card-header" style="padding-top: 5px; padding-bottom: 5px">
                <div>
                    <i class="layui-icon" style="font-size: 20px;color: #1890ff;font-weight: bold">&#xe656;</i>
                    <span id="form-name" style="margin: 0 6px;font-size: 18px;font-weight: bold;letter-spacing: 1px"></span>
                    <span style="opacity: .5;font-size: small;margin-left: 5px">报销审批</span>
                </div>
            </div>
            <div class="layui-card-body" style="padding: 30px 20px">

                <div class="layui-tab layui-steps">
                    <ul class="layui-tab-title" id="stepBox">
                    </ul>
                </div>

            </div>
        </div>
        <div class="layui-row">
            <!-- 数据 -->
<!--            <div class="layui-col-md9">-->
<!--                <div class="layui-card">-->
<!--                    <div class="layui-card-header">-->
<!--                        基本信息-->
<!--                    </div>-->
<!--                    <div class="layui-card-body">-->

<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
            <!-- 动态 -->
<!--            <div class="layui-col-md3" style="width: 24%;margin-left: 1%">-->
            <div class="layui-col-md3" style="width: 100%;">
                <!-- 时间线 -->
                <div class="layui-card">
                    <div class="layui-card-header">
                        <span>流程动态</span>
                    </div>
                    <div class="layui-card-body">
                        <ul class="layui-timeline" id="timelineBox">
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="form-group-bottom text-right">
        <button class="layui-btn" lay-filter="refresh" lay-submit><i class="layui-icon">&#xe666;</i>&emsp;刷新&emsp;</button>
    </div>

</form>

<script type="text/html" id="followerTabOperate">
    <a class="layui-btn layui-btn-primary layui-btn-xs btn-edit" lay-event="del">删除</a>
</script>

<!--&lt;!&ndash; 跟进人 &ndash;&gt;-->
<!--<script type="text/html" id="followerEditDialog">-->
<!--    <form id="followerEditForm" lay-filter="followerEditForm" class="layui-form model-form">-->
<!--        <input name="experimentId" type="hidden"/>-->
<!--        <div class="layui-form-item" style="float: left;clear: none;margin-right: 20px">-->
<!--            <label class="layui-form-label">选择成员</label>-->
<!--            <div class="layui-input-block">-->
<!--                <div id="followersBox" name="followersBox">-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="layui-form-item text-right" style="float: left;clear: none">-->
<!--            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>-->
<!--            <button class="layui-btn" lay-filter="followerSubmit" lay-submit>保存</button>-->
<!--        </div>-->
<!--    </form>-->
<!--</script>-->

<script type="text/template" id="stepTpl">
    {{#each list}}
    <li id="step-{{step}}" style="pointer-events: none">
        <i class="layui-icon layui-icon-ok">{{step}}</i>
        <span class="layui-steps-title">{{title}}</span>
        {{# if username}}
        <span class="layui-steps-content">{{username}}</span>
        {{ else }}
        <span class="layui-steps-content">&nbsp;</span>
        {{/if}}
    </li>
    {{/each}}
</script>

<script type="text/template" id="timelineTpl">
    {{#each list}}
    <li class="layui-timeline-item">
        <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
        <div class="layui-timeline-content layui-text">
            <h4 class="layui-timeline-title" style="display: inline;margin-right: 10px;">{{title}}</h4>
            <span>{{time}}</span>
            <p>
                {{msg}}
            </p>
        </div>
    </li>
    {{/each}}
</script>

<script>
    var reimburseOnlineId = top.reimburseOnlineByMore;
    $('.layui-layer-close').hide();
    layui.config({
        base: baseUrl + "/static/layui/lay/modules/"
    }).extend({
        notice: 'notice/notice',
        steps: 'steps/steps',
    }).use(['form', 'table', 'laydate', 'notice', 'xmSelect', 'steps'], function () {
        var $ = layui.jquery;
        var form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        var notice = layui.notice;
        var xmSelect = layui.xmSelect;
        var steps = layui.steps;

        form.render('select');

        init();
        function init(){
            notice.msg('正在载入数据......', {icon: 4, position: "topRight"});
            $.ajax({
                url: baseUrl + "/reimburseOnline/" + reimburseOnlineId + "/auth",
                headers: {'token': localStorage.getItem('token')},
                method: 'GET',
                success: function (res) {
                    notice.destroy();
                    if (res.code === 200) {
                        let reimburseOnline = res.data;
                        top.reimburseOnlineByMore = null;
                        $("#form-name").html(reimburseOnline.name);
                        // 进度步骤图
                        let template0 = Handlebars.compile($('#stepTpl').html());
                        $('#stepBox').html(template0({list: JSON.parse(reimburseOnline.settleMsg)}));
                        $('#step-' + Number(reimburseOnline.step)).addClass("layui-this");

                        let template1 = Handlebars.compile($('#timelineTpl').html());
                        $('#timelineBox').html(template1({list: JSON.parse(reimburseOnline.settleMsg)}));
                        // 补充html
                        $('#customizeBox').html(reimburseOnline.formHtml);
                        // 设备明细
                        form.val('formAdvForm', reimburseOnline);
                        top.convertDisabled($('#formAdvForm :input'), true);
                        // 跟进人
                        // initFollowers(reimburseOnline.id);
                        layDateRender();
                    } else if (res.code === 403) {
                        top.location.href = baseUrl + "/";
                    } else {
                        layer.msg(res.msg, {icon: 2})
                    }
                }
            })
        }

        /* 渲染laydate */
        function layDateRender() {
            laydate.render({
                elem: '#endTime',
                type: 'datetime'
            });
        }
        layDateRender();

        /* 监听表单提交 */
        form.on('submit(refresh)', function (data) {
            init();
            return false;
        });

    })
</script>