中扬CRM客户关系管理系统
Junjie
2023-09-14 2a8710c50e2f7c4dd0e333dcf650a2dff960fff4
src/main/webapp/views/priOnline2/priOnline_more.html
New file
@@ -0,0 +1,187 @@
<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);
    }
</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>
<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 priOnlineId = top.priOnlineByMore;
    $('.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 + "/priOnline2/" + priOnlineId + "/auth",
                headers: {'token': localStorage.getItem('token')},
                method: 'GET',
                success: function (res) {
                    notice.destroy();
                    if (res.code === 200) {
                        let priOnline = res.data;
                        top.priOnlineByMore = null;
                        $("#form-name").html(priOnline.name);
                        // 进度步骤图
                        let template0 = Handlebars.compile($('#stepTpl').html());
                        $('#stepBox').html(template0({list: JSON.parse(priOnline.settleMsg)}));
                        $('#step-' + Number(priOnline.step)).addClass("layui-this");
                        let template1 = Handlebars.compile($('#timelineTpl').html());
                        $('#timelineBox').html(template1({list: JSON.parse(priOnline.settleMsg)}));
                        // 补充html
                        $('#customizeBox').html(priOnline.formHtml);
                        // 设备明细
                        // form.val('formAdvForm', priOnline);
                        // top.convertDisabled($('#formAdvForm :input'), true);
                        // 跟进人
                        // initFollowers(priOnline.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>