{include file="default/user/header" title="查看工单" /}

    <style>    
        .jhhost {
            display: flex;
                        padding: 20px;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
                                    margin-bottom:20px;
                        flex-direction: column;
        }
        .cont {
            display: flex;
            flex-direction: row;

        }
        .user-image {
            width: 60px;
            height: 60px;
            border-radius: 50%;
            margin-right: 10px;            
            transform: rotate(0deg);
        }

        .user-details {
            display: flex;
            flex-direction: column;
        }

        .user-details div {
            margin-bottom: 5px;
        }
        .roll{
        height:500px;
        overflow: auto;
        padding: 5px;
        }
        </style>
                      <main id="main-container">
                <div class="content content-narrow">

<div class="row">
                        <div class="col-12">

                    <div class="block">
                        <div class="block-header">
                            <h3 class="block-title">查看工单</h3>
                        </div>

                        <div class="block-content">
<h3 class="text-primary">标题:{$ticket.title}</h3>

<div class="roll">
{foreach $ticket.content as $tc}

{if $tc.personnel=="1"}

                            <div class="jhhost">
                            <div class="cont">
        <img src="http://q1.qlogo.cn/g?b=qq&nk={$admin.qq}&s=100" class="img-thumbnail user-image" id="user-image">
        <div class="user-details">
       
            <div><span class="text-primary">{$tc.time|date="Y-m-d H:i:s",###}</span></div>
            <div><span class="text-primary">站长:{$admin.name}</span></div>
</div>
</div>

                            <div class="jhhost" style="                        margin-top:20px;width: fit-content;">
{$tc.content}
</div>
 </div>
 
{elseif $tc.personnel=="2"}


                            <div class="jhhost">
                            <div class="cont">
        <img src="http://q1.qlogo.cn/g?b=qq&nk={$user.qq}&s=100" class="img-thumbnail user-image" id="user-image">
        <div class="user-details">
       
            <div><span class="text-success">{$tc.time|date="Y-m-d H:i:s",###}</span></div>
            <div><span class="text-success">你:{$user.name}</span></div>
</div>
</div>

                            <div class="jhhost" style="                        margin-top:20px;width: fit-content;">
{$tc.content}
</div>
 </div>
 
 
 
 
{/if}

{/foreach}
</div>


状态:
{if $ticket.state=="1"}
<span class="btn btn-warning btn-round btn-sm">待回复</span>
{/if}
{if $ticket.state=="2"}
<span class="btn btn-warning btn-round btn-sm">等待回复</span>
{/if}
{if $ticket.state=="3"}
<span class="btn btn-success btn-round btn-sm">已回复</span>
{/if}
{if $ticket.state=="4"}
<span class="btn btn-error btn-round btn-danger">已关闭</span>
{/if}
<br/><br>
操作:
                                              <button type="button" onclick="end();" class="btn btn-primary">关闭此工单</button>
<br/>
<br/>
   
                          <form>                                        
<div class="form-group row">
                                            <label class="col-12">回复</label>
                                            <div class="col-12">
                                             	<textarea class="form-control" name="content" rows="10" placeholder="请输入回复内容">
</textarea>
                                            </div>
                                        </div>

                                        <div class="form-group row">
                                            <div class="col-12">
                                                <button type="submit" class="btn btn-primary btn-block">提交</button>
                                            </div>
                                        </div>
                          </form>
 



















</div>
</div>


</div>
</div>
</div>

</main>
            {include file="default/user/footer" /}
<script>
    const dialog = document.querySelector('.roll');
    dialog.scrollTop = dialog.scrollHeight;
  </script>

<script>
    $("form").submit(function (){
        var load = layer.msg('提交中，请稍后...',{icon:16,time:false});

        var content = $("textarea[name='content']").val();


        if( content.length < 1 ){
            layer.alert('提交的信息不可为空',{icon:2});
            return false;
        }

        $.ajax({
            type:'POST',
            url:'',
            data:{
                act:"reply",
                content:content,
            },
            dataType:'json',
            success:function (data){
                layer.close(load);
                if(data.code == "1"){
setTimeout(function (){
                   location.href = ''
},1000);
                    layer.alert(data.msg,{icon:1});
                }else{
                    layer.alert(data.msg,{icon:2});
                }
            }
        });
        return false;
    });


function end(){
        layer.confirm('确定要关闭此工单吗！',{icon:3},  function (){
            end1();
        });
    }

function end1(){
var load = layer.msg('提交中，请稍后...',{icon:16,time:false});

        $.ajax({
            type:'POST',
            url:'',
            data:{
                act:"end",
            },
            dataType:'json',
            success:function (data){
                layer.close(load);
                if(data.code == "1"){
setTimeout(function (){
                   location.href = ''
},1000);
                    layer.alert(data.msg,{icon:1});
                }else{
                    layer.alert(data.msg,{icon:2});
                }
            }
        });
}
</script>