YwxAppThink/addon/wxchat/view/backend/wxchatauth/index.html

<div class="layui-card" style="margin:15px;">
    <div class="layui-card-header">真人认证审核</div>
    <div class="layui-card-body">
        <form class="layui-form" lay-filter="searchForm">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <input class="layui-input" name="keyword" placeholder="真实姓名/昵称" autocomplete="off">
                </div>
                <div class="layui-inline">
                    <select name="status">
                        <option value="">全部状态</option>
                        <option value="-1">未提交</option>
                        <option value="0">待审核</option>
                        <option value="1">已通过</option>
                        <option value="2">已驳回</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" lay-submit lay-filter="searchBtn">搜索</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
        <table class="layui-hide" id="dataTable" lay-filter="dataTable"></table>
    </div>
</div>

<script type="text/html" id="barTpl">
    <a class="layui-btn layui-btn-xs" lay-event="review">审核</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
</script>

<script type="text/html" id="statusTpl">
    {{# if(d.status == 1){ }}
        <span class="layui-badge layui-bg-green">已通过</span>
    {{# } else if(d.status == 2){ }}
        <span class="layui-badge layui-bg-red">已驳回</span>
    {{# } else if(d.status == 0){ }}
        <span class="layui-badge layui-bg-orange">待审核</span>
    {{# } else { }}
        <span class="layui-badge">未提交</span>
    {{# } }}
</script>

<script type="text/html" id="imgTpl">
    {{# if(d.front_img){ }}<img src="{{d.front_img}}" style="max-width:90px;max-height:90px;" onerror="this.style.display='none'">{{# } }}
</script>

<script type="text/html" id="reviewTpl">
<div style="padding:20px;">
    <table class="layui-table">
        <tr><td>UID</td><td>{{d.uid}}</td></tr>
        <tr><td>昵称</td><td>{{d.nickname||'--'}}</td></tr>
        <tr><td>真实姓名</td><td>{{d.real_name}}</td></tr>
        <tr><td>证件号(脱敏)</td><td>{{d.id_card}}</td></tr>
        <tr><td>AI初筛</td><td>分数 {{d.ai_score}} / 结果 {{d.ai_result==1?'通过':'未通过'}}<br><small>{{d.ai_detail||''}}</small></td></tr>
    </table>
    <div style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;">
        <div>证件正面<br><img src="{{d.front_img}}" style="width:110px;" onerror="this.src=''"></div>
        <div>证件反面<br><img src="{{d.back_img}}" style="width:110px;" onerror="this.src=''"></div>
        <div>手持证件<br><img src="{{d.hold_img}}" style="width:110px;" onerror="this.src=''"></div>
        <div>人脸照<br><img src="{{d.face_img}}" style="width:110px;" onerror="this.src=''"></div>
    </div>
    <form class="layui-form" id="reviewForm">
        <input type="hidden" name="id" value="{{d.id}}">
        <div class="layui-form-item">
            <label class="layui-form-label">驳回原因</label>
            <div class="layui-input-block">
                <input type="text" name="reason" placeholder="驳回时填写" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn layui-bg-green" id="passBtn">通过</button>
                <button type="button" class="layui-btn layui-btn-danger" id="rejectBtn">驳回</button>
            </div>
        </div>
    </form>
</div>
</script>

<script>
layui.use(['table','form','layer','laytpl','http'], function(){
    var table = layui.table, form = layui.form, layer = layui.layer, laytpl = layui.laytpl, $ = layui.$, http = layui.http;
    var base = '/wxchat/backend/auth';

    var tableIns = table.render({
        elem: '#dataTable',
        url: base + '/index',
        page: true,
        limit: 15,
        cols: [[
            {field:'id', title:'ID', width:70},
            {field:'uid', title:'UID', width:90},
            {field:'nickname', title:'昵称', width:120},
            {field:'real_name', title:'真实姓名', width:110},
            {field:'id_card', title:'证件号', width:160},
            {field:'ai_score', title:'AI分数', width:90},
            {field:'status', title:'状态', width:100, templet:'#statusTpl'},
            {field:'create_at', title:'提交时间', width:170, templet:function(d){return d.create_at?layui.util.toDateString(d.create_at*1000,'yyyy-MM-dd HH:mm'):'';}},
            {title:'操作', width:130, toolbar:'#barTpl'}
        ]],
        parseData: function(res){ return {code: res.code, msg: res.message, count: res.count||0, data: res.data||[]}; }
    });

    form.on('submit(searchBtn)', function(data){
        tableIns.reload({where: data.field, page:{curr:1}});
        return false;
    });

    function post(action, data){
        return http.post(base + '/'+action, data);
    }

    table.on('tool(dataTable)', function(obj){
        var d = obj.data;
        if(obj.event==='del'){
            layer.confirm('确定删除该认证记录？', function(){
                post('del', {ids: d.id}).then(function(res){
                    if(res.code===0){ layer.msg('已删除',{icon:1}); tableIns.reload(); }
                    else layer.msg(res.message||'删除失败',{icon:2});
                });
            });
            return;
        }
        if(obj.event==='review'){
                post('detail', {id: d.id}).then(function(res){
                    if(res.code!==0){ layer.msg(res.message||'获取失败',{icon:2}); return; }
                    var tpl = laytpl($('#reviewTpl').html()).render(res.data);
                layer.open({
                    type:1, title:'认证审核 #'+d.id, area:['640px','auto'], content: tpl,
                    success:function(){
                        $('#passBtn').on('click', function(){
                            post('review', {id:d.id, pass:1}).done(function(r){
                                if(r.code===0){ layer.msg('已通过',{icon:1}); layer.closeAll(); tableIns.reload(); }
                                else layer.msg(r.message||'失败',{icon:2});
                            });
                        });
                        $('#rejectBtn').on('click', function(){
                            var reason = $('#reviewForm [name=reason]').val();
                            post('review', {id:d.id, pass:0, reason:reason}).done(function(r){
                                if(r.code===0){ layer.msg('已驳回',{icon:1}); layer.closeAll(); tableIns.reload(); }
                                else layer.msg(r.message||'失败',{icon:2});
                            });
                        });
                    }
                });
            });
        }
    });
});
</script>