|
|
@@ -0,0 +1,241 @@
|
|
|
+<!doctype html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport"
|
|
|
+ content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
|
+ <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.css">
|
|
|
+ <script type="text/javascript" src="/static/jquery-2.2.4.min.js"></script>
|
|
|
+ <script type="text/javascript" src="/static/layer/layer.js"></script>
|
|
|
+ <link rel="stylesheet" href="/repair/style.css">
|
|
|
+ <title>{$title}</title>
|
|
|
+ <style>
|
|
|
+ body{ background-color:#F1F1F1; }
|
|
|
+ .detail-container{
|
|
|
+ width:100%;
|
|
|
+ max-width:750px;
|
|
|
+ margin:0 auto;
|
|
|
+ padding-bottom:30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .detail-card{
|
|
|
+ width:calc(100% - 20px);
|
|
|
+ margin:10px 10px 0 10px;
|
|
|
+ background-color:#fff;
|
|
|
+ border-radius:10px;
|
|
|
+ padding:12px 14px 14px;
|
|
|
+ box-shadow:0 1px 4px rgba(0,0,0,.04);
|
|
|
+ }
|
|
|
+ .detail-card-title{
|
|
|
+ font-size:15px;
|
|
|
+ font-weight:bold;
|
|
|
+ color:#284a94;
|
|
|
+ padding-bottom:10px;
|
|
|
+ margin-bottom:6px;
|
|
|
+ border-bottom:1px solid #f0f0f0;
|
|
|
+ }
|
|
|
+ .detail-row{
|
|
|
+ display:flex;
|
|
|
+ font-size:14px;
|
|
|
+ line-height:1.8;
|
|
|
+ padding:3px 0;
|
|
|
+ }
|
|
|
+ .detail-row .label{
|
|
|
+ flex:0 0 84px;
|
|
|
+ color:#999;
|
|
|
+ }
|
|
|
+ .detail-row .value{
|
|
|
+ flex:1 1 auto;
|
|
|
+ color:#333;
|
|
|
+ word-break:break-all;
|
|
|
+ }
|
|
|
+ .tag{
|
|
|
+ display:inline-block;
|
|
|
+ padding:1px 8px;
|
|
|
+ border-radius:4px;
|
|
|
+ font-size:12px;
|
|
|
+ }
|
|
|
+ .tag-wait{ background:#fff7e6; color:#fa8c16; }
|
|
|
+ .tag-doing{ background:#e6f7ff; color:#1890ff; }
|
|
|
+ .tag-done{ background:#f6ffed; color:#52c41a; }
|
|
|
+ .tag-fail{ background:#fff1f0; color:#f5222d; }
|
|
|
+ .tag-closed{ background:#fafafa; color:#999; }
|
|
|
+ .tag-zg1{ background:#fff7e6; color:#fa8c16; }
|
|
|
+ .tag-zg2{ background:#f6ffed; color:#52c41a; }
|
|
|
+
|
|
|
+ /* 检查项 */
|
|
|
+ .check-group{ margin-bottom:12px; }
|
|
|
+ .check-group:last-child{ margin-bottom:0; }
|
|
|
+ .check-group-title{
|
|
|
+ font-size:14px;
|
|
|
+ font-weight:bold;
|
|
|
+ color:#333;
|
|
|
+ margin-bottom:6px;
|
|
|
+ }
|
|
|
+ .check-item{
|
|
|
+ display:flex;
|
|
|
+ align-items:center;
|
|
|
+ justify-content:space-between;
|
|
|
+ font-size:14px;
|
|
|
+ padding:7px 10px;
|
|
|
+ background:#fafafa;
|
|
|
+ border-radius:6px;
|
|
|
+ margin-bottom:6px;
|
|
|
+ }
|
|
|
+ .check-item .check-name{
|
|
|
+ flex:1 1 auto;
|
|
|
+ color:#555;
|
|
|
+ word-break:break-all;
|
|
|
+ padding-right:10px;
|
|
|
+ }
|
|
|
+ .check-item .check-right{
|
|
|
+ flex:0 0 auto;
|
|
|
+ text-align:right;
|
|
|
+ white-space:nowrap;
|
|
|
+ }
|
|
|
+ .check-item .check-val{ color:#333; }
|
|
|
+ .badge-status{
|
|
|
+ display:inline-block;
|
|
|
+ padding:1px 7px;
|
|
|
+ border-radius:10px;
|
|
|
+ font-size:12px;
|
|
|
+ margin-left:8px;
|
|
|
+ }
|
|
|
+ .badge-ok{ background:#f6ffed; color:#52c41a; }
|
|
|
+ .badge-err{ background:#fff1f0; color:#f5222d; }
|
|
|
+
|
|
|
+ /* 图片 */
|
|
|
+ .img-grid{
|
|
|
+ display:flex;
|
|
|
+ flex-wrap:wrap;
|
|
|
+ margin:0 -4px;
|
|
|
+ }
|
|
|
+ .img-grid img{
|
|
|
+ width:calc(33.33% - 8px);
|
|
|
+ height:90px;
|
|
|
+ object-fit:cover;
|
|
|
+ margin:4px;
|
|
|
+ border-radius:6px;
|
|
|
+ background:#f0f0f0;
|
|
|
+ }
|
|
|
+ .detail-content{
|
|
|
+ font-size:14px;
|
|
|
+ color:#333;
|
|
|
+ line-height:1.7;
|
|
|
+ white-space:pre-wrap;
|
|
|
+ word-break:break-all;
|
|
|
+ }
|
|
|
+ .empty-tip{
|
|
|
+ font-size:13px;
|
|
|
+ color:#bbb;
|
|
|
+ text-align:center;
|
|
|
+ padding:14px 0;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <div class="detail-container">
|
|
|
+ <!-- 基本信息 -->
|
|
|
+ <div class="detail-card">
|
|
|
+ <div class="detail-card-title">基本信息</div>
|
|
|
+ <div class="detail-row"><span class="label">编号</span><span class="value">{$info.id}</span></div>
|
|
|
+ <div class="detail-row"><span class="label">名称</span><span class="value">{$info.task_name}</span></div>
|
|
|
+ <div class="detail-row"><span class="label">地点</span><span class="value">{$info.addr}</span></div>
|
|
|
+ <div class="detail-row"><span class="label">任务内容</span><span class="value">{$info.task_addr_form}</span></div>
|
|
|
+ <div class="detail-row"><span class="label">执行人</span><span class="value">{$info.task_user}</span></div>
|
|
|
+ <div class="detail-row"><span class="label">提交时间</span><span class="value">{$info.create_time}</span></div>
|
|
|
+ <div class="detail-row">
|
|
|
+ <span class="label">状态</span>
|
|
|
+ <span class="value">
|
|
|
+ {if $info.status == 0}<span class="tag tag-wait">待完成</span>
|
|
|
+ {elseif $info.status == 1}<span class="tag tag-doing">执行中</span>
|
|
|
+ {elseif $info.status == 2}<span class="tag tag-done">已完成</span>
|
|
|
+ {elseif $info.status == 3}<span class="tag tag-fail">未完成</span>
|
|
|
+ {elseif $info.status == 5}<span class="tag tag-fail">中断</span>
|
|
|
+ {elseif $info.status == 6}<span class="tag tag-closed">已关闭</span>
|
|
|
+ {else/}<span class="tag tag-closed">-</span>
|
|
|
+ {/if}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ {if $info.zg_type > 0}
|
|
|
+ <div class="detail-row">
|
|
|
+ <span class="label">整改状态</span>
|
|
|
+ <span class="value">
|
|
|
+ {if $info.zg_type == 1}<span class="tag tag-zg1">整改中</span>
|
|
|
+ {elseif $info.zg_type == 2}<span class="tag tag-zg2">已完成</span>
|
|
|
+ {/if}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ {/if}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 检查项 -->
|
|
|
+ {if $info.check_json}
|
|
|
+ <div class="detail-card">
|
|
|
+ <div class="detail-card-title">检查项</div>
|
|
|
+ {foreach $info.check_json as $group}
|
|
|
+ <div class="check-group">
|
|
|
+ <div class="check-group-title">{$group.title}</div>
|
|
|
+ {foreach $group.forms as $form}
|
|
|
+ <div class="check-item">
|
|
|
+ <span class="check-name">{$form.title}</span>
|
|
|
+ <span class="check-right">
|
|
|
+ {if $form.type == 0}
|
|
|
+ <span class="check-val">{if $form.result == 1}是{else}否{/if}</span>
|
|
|
+ {else}
|
|
|
+ <span class="check-val">{$form.result}</span>
|
|
|
+ {/if}
|
|
|
+ {if isset($form.status)}
|
|
|
+ {if $form.status == 0}<span class="badge-status badge-err">异常</span>
|
|
|
+ {elseif $form.status == 1}<span class="badge-status badge-ok">正常</span>
|
|
|
+ {/if}
|
|
|
+ {/if}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ {/foreach}
|
|
|
+ </div>
|
|
|
+ {/foreach}
|
|
|
+ </div>
|
|
|
+ {/if}
|
|
|
+
|
|
|
+ <!-- 设备图片 -->
|
|
|
+ <div class="detail-card">
|
|
|
+ <div class="detail-card-title">设备图片</div>
|
|
|
+ {if $info.images}
|
|
|
+ <div class="img-grid">
|
|
|
+ {foreach $info.images as $img}
|
|
|
+ <img src="{$img}" onclick="previewImg(this)" alt="">
|
|
|
+ {/foreach}
|
|
|
+ </div>
|
|
|
+ {else/}
|
|
|
+ <div class="empty-tip">暂无图片</div>
|
|
|
+ {/if}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 汇报内容 -->
|
|
|
+ <div class="detail-card">
|
|
|
+ <div class="detail-card-title">汇报内容</div>
|
|
|
+ {if $info.content}
|
|
|
+ <div class="detail-content">{$info.content}</div>
|
|
|
+ {else/}
|
|
|
+ <div class="empty-tip">暂无内容</div>
|
|
|
+ {/if}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</body>
|
|
|
+</html>
|
|
|
+<script>
|
|
|
+
|
|
|
+ function previewImg(img){
|
|
|
+ var src = img.getAttribute('src');
|
|
|
+ layer.open({
|
|
|
+ type:1,
|
|
|
+ skin:'layui-layer-img',
|
|
|
+ shadeClose:true,
|
|
|
+ area:['90%','auto'],
|
|
|
+ content:'<img src="'+src+'" style="width:100%;display:block;border-radius:6px;">'
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|