| <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"></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"></i> 刷新 </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"> </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"></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 contractId = top.contractByMore; | 
|     $('.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 + "/contract/" + contractId + "/auth", | 
|                 headers: {'token': localStorage.getItem('token')}, | 
|                 method: 'GET', | 
|                 success: function (res) { | 
|                     notice.destroy(); | 
|                     if (res.code === 200) { | 
|                         let contract = res.data; | 
|                         top.contractByMore = null; | 
|                         $("#form-name").html(contract.name); | 
|                         // 进度步骤图 | 
|                         let template0 = Handlebars.compile($('#stepTpl').html()); | 
|                         $('#stepBox').html(template0({list: JSON.parse(contract.settleMsg)})); | 
|                         $('#step-' + Number(contract.step)).addClass("layui-this"); | 
|   | 
|                         let template1 = Handlebars.compile($('#timelineTpl').html()); | 
|                         $('#timelineBox').html(template1({list: JSON.parse(contract.settleMsg)})); | 
|                         // 补充html | 
|                         $('#customizeBox').html(contract.formHtml); | 
|                         // 设备明细 | 
|                         // form.val('formAdvForm', contract); | 
|                         // top.convertDisabled($('#formAdvForm :input'), true); | 
|                         // 跟进人 | 
|                         // initFollowers(contract.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> |