@extends('manager.layout.master')

@section('body')
    <style>
        .teacher-page-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 12px 16px;
            margin-bottom: 15px;
            background: #fff;
            border-left: 4px solid #009688;
            box-shadow: 0 1px 2px rgba(0,0,0,.05);
        }
        .teacher-page-header h3 {
            margin: 0;
            font-size: 16px;
            font-weight: 600;
            color: #333;
        }
        .teacher-page-header .sub-text {
            font-size: 12px;
            color: #999;
            margin-left: 10px;
            font-weight: normal;
        }

        .teacher-search-bar {
            background: #fff;
            padding: 12px 15px;
            margin-bottom: 15px;
            border-radius: 2px;
            box-shadow: 0 1px 2px rgba(0,0,0,.05);
        }
        .teacher-search-bar .layui-form-item {
            margin-bottom: 0;
        }
        .teacher-search-bar .layui-inline {
            margin-right: 0;
        }

        .teacher-avatar {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            object-fit: cover;
            border: 1px solid #eee;
            display: block;
        }
        .teacher-name {
            font-weight: 500;
            color: #333;
        }
        .teacher-tel {
            color: #666;
            font-size: 13px;
        }
        .teacher-job {
            color: #666;
            font-size: 13px;
            max-width: 120px;
            display: inline-block;
        }

        .service-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            max-width: 360px;
        }
        .service-tag {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 3px 8px;
            border-radius: 4px;
            background: #f0f9ff;
            border: 1px solid #d6e9ff;
            color: #1e9fff;
            font-size: 12px;
            line-height: 1.4;
            white-space: nowrap;
        }
        .service-tag img {
            width: 14px;
            height: 14px;
            border-radius: 2px;
            object-fit: cover;
        }
        .service-empty {
            display: inline-block;
            padding: 3px 8px;
            border-radius: 4px;
            background: #f2f2f2;
            color: #999;
            font-size: 12px;
        }

        .teacher-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            min-width: 220px;
        }
        .teacher-actions .layui-btn {
            margin: 0 !important;
        }
        .teacher-actions .action-divider {
            width: 1px;
            background: #e6e6e6;
            margin: 4px 4px;
        }

        .layui-table tbody tr:hover {
            background-color: #f8fafa;
        }
        .layui-table th {
            background-color: #f2f2f2;
            color: #555;
            font-weight: 600;
        }
        .layui-table td {
            vertical-align: middle;
        }
    </style>

    <div class="teacher-page-header">
        <div>
            <h3>老师信息 <span class="sub-text">共 {{$list->total()}} 位老师</span></h3>
        </div>
        <a class="layui-btn layui-btn-sm layui-btn-primary" id="reload"><i class="layui-icon">&#xe669;</i> 刷新</a>
    </div>

    <!-- 搜索 -->
    <div class="teacher-search-bar">
        <form class="layui-form" action="" method="get">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label" style="width:auto; padding-left:0;">性别</label>
                    <div class="layui-input-inline" style="width: 100px;">
                        <select name="sex">
                            <option value="">全部</option>
                            @foreach(\App\Models\User::$sexList as $key=>$vo)
                                <option value="{{$key}}" @if(request('sex')==$key) selected @endif>{{$vo}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <div class="layui-input-inline" style="width: 260px;">
                        <input type="text" name="keyword" value="{{request()->get('keyword')}}" autocomplete="off" placeholder="昵称 / 编号 / 电话" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button type="submit" class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe615;</i> 查询</button>
                    <a href="{{route('teacherList')}}" class="layui-btn layui-btn-sm layui-btn-primary">重置</a>
                </div>
            </div>
        </form>
    </div>

    <!-- 表格 -->
    <table class="layui-table">
        <thead>
        <tr>
            <th style="width:70px;">头像</th>
            <th style="width:120px;">姓名 / 电话</th>
            <th style="width:130px;">职业</th>
            <th>提供服务</th>
            <th style="width:70px; text-align:center;">首页</th>
            <th style="width:70px; text-align:center;">排序</th>
            <th style="width:260px;">操作</th>
        </tr>
        </thead>
        <tbody id="idFrom">
        @foreach($list as $key=>$vo)
            <tr>
                <td>
                    <img class="teacher-avatar" src="{{$vo->head_img_url ?? asset('admin/img/ico.png')}}" alt="">
                </td>
                <td>
                    <div class="teacher-name">{{$vo->nickname ?: '-'}}</div>
                    <div class="teacher-tel">{{$vo->tel ?: '-'}}</div>
                </td>
                <td><span class="teacher-job">{{$vo->teacherInfo->job ?? '-'}}</span></td>
                <td>
                    <div class="service-tags">
                        @foreach($vo->teacherItem as $v)
                            <span class="service-tag" title="{{$v->item->type_text}}">
                                <img src="{{$v->item->ico->url ?? asset('admin/img/ico.png')}}" alt="">
                                {{$v->item->type_text}}
                            </span>
                        @endforeach
                        @if($vo->teacherItem->count() < 1)
                            <span class="service-empty">未配置服务</span>
                        @endif
                    </div>
                </td>
                <td style="text-align:center;">
                    @if(($vo->teacherInfo->is_index ?? 0) == 1)
                        <span class="layui-badge layui-bg-green">是</span>
                    @else
                        <span class="layui-badge layui-bg-gray">否</span>
                    @endif
                </td>
                <td style="text-align:center;">{{$vo->sort}}</td>
                <td>
                    <div class="teacher-actions">
                        <a class="layui-btn layui-btn-xs layui-btn-normal" onclick="openView('{{route('teacherInfoEdit',['user_id' => $vo->id])}}','编辑信息','980px')" title="编辑信息"><i class="layui-icon">&#xe642;</i> 编辑</a>
                        <a class="layui-btn layui-btn-xs" onclick="openView('{{route('teacherItemEdit',['user_id' => $vo->id])}}','服务项目','1180px')" title="服务配置"><i class="layui-icon">&#xe620;</i> 服务</a>
                        <a class="layui-btn layui-btn-xs layui-btn-normal" onclick="openView('{{route('teacherVideoList',['user_id' => $vo->id])}}','视频专栏','980px')" title="视频专栏"><i class="layui-icon">&#xe6ed;</i> 视频</a>

                        <span class="action-divider"></span>

                        <a class="layui-btn layui-btn-xs layui-btn-danger" onclick="handle('{{route('userSetTeacher', ['id' => $vo->id])}}','是否将【{{$vo->nickname}}】设为普通会员？')" title="取消老师身份"><i class="layui-icon">&#xe640;</i> 取消老师</a>

                        @if($vo->is_ts_teacher == 2)
                            <a class="layui-btn layui-btn-xs layui-btn-warm" onclick="handle('{{route('userSetTsTeacher', ['id' => $vo->id])}}','是否将【{{$vo->nickname}}】设为特殊老师？')" title="设为特殊老师"><i class="layui-icon">&#xe672;</i> 特殊老师</a>
                        @else
                            <a class="layui-btn layui-btn-xs layui-btn-danger" onclick="handle('{{route('userSetTsTeacher', ['id' => $vo->id])}}','是否将【{{$vo->nickname}}】取消特殊老师？')" title="取消特殊老师"><i class="layui-icon">&#xe672;</i> 取消特殊</a>
                        @endif
                    </div>
                </td>
            </tr>
        @endforeach
        </tbody>
    </table>

    @include('manager.include.pageBtn')

@stop