{include file="common/header"}
<link href="/static/admin/css/other.css" rel="stylesheet">
<main class="lyear-layout-content">
    <div class="container-fluid">
        <div class="row ant-menu-submenu">
            <div class="col-lg-10 col-b90">
                <div class="card right-card">
                    <div class="right-card-header card-header">
                        <h4>{:lang('set.management_service')}</h4>
                    </div>
                    <div class="card-toolbar clearfix">
                        <div class="toolbar-btn-action">
                            <button class="btn btn-label btn-default" data-toggle="modal" data-target=".add_service">
                                <label>
                                    <i class="iconfont icon-plus-line"></i>
                                </label>{:lang('set.add_customer_service')}
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th width="8%">{:lang('public.uname')}</th>
                                        <th width="8%">{:lang('user.nick')}</th>
                                        <th width="8%">{:lang('set.customer_service_type')}</th>
                                        <th width="8%">{:lang('user.web_id')}</th>
                                        <th>{:lang('set.exclusive_connection')}</th>
                                        <th width="12%">{:lang('public.phone')}</th>
                                        <th width="12%">{:lang('public.email')}</th>
                                        <th width="8%">{:lang('public.operation')}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                {foreach $service_lists as $item}
                                    <tr id="service-{$item['id']}">
                                        <td id="ser-uname">{$item['uname']}</td>
                                        <td id="ser-nick">{$item['nick']}</td>
                                        <td id="ser-name" group-id="{$item['group_id']}">{$item['name']}</td>
                                        <td id="ser-main-uname">{$main_uname}</td>
                                        <td class="td-form-control">
                                            <div class="col-lg-12">
                                                <div class="input-group">
                                                    <input type="text" class="form-control" value="{:exclusiveUrl(['cuid'=>$item['id'],'uname'=>$item['uname'],'gid'=>$item['group_id'],'wname'=>$main_uname])}">
                                                    <span class="input-group-btn">
                                                        <button class="copy-link btn btn-default" id="copyVal_{$item['id']}" data-clipboard-text="{:exclusiveUrl(['cuid'=>$item['id'],'uname'=>$item['uname'],'gid'=>$item['group_id'],'wname'=>$main_uname])}" type="button" data-id="{$item['id']}">{:lang('public.copy')}</button>
                                                    </span>
                                                </div>
                                            </div>
                                        </td>
                                        <td id="ser-phone">{:__empty($item['phone'])}</td>
                                        <td id="ser-email">{:__empty($item['email'])}</td>
                                        <td>
                                            <div class="btn-group">
                                                {if $item['is_main'] == 0}
                                                <a class="btn btn-xs btn-success" data-avatar="{$item['avatar']}" data-id="{$item['id']}" id="addservice" href="#!" data-toggle="modal" data-target=".edit_service" data-toggle="tooltip" data-original-title="{:lang('public.editor')}">
                                                    <i class="iconfont icon-xiugai"></i>
                                                </a>
                                                <a class="btn btn-xs btn-success" href="#!" data-id="{$item['id']}" id="delservice" data-toggle="tooltip" data-original-title="{:lang('public.delete')}">
                                                    <i class="iconfont icon-shanchu"></i>
                                                </a>
                                                {else/}
                                                主客服
                                                {/if}
                                            </div>
                                        </td>
                                    </tr>
                                {/foreach}
                                </tbody>
                            </table>
                        </div>
                        {$service_lists->render()|raw}
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<div class="modal fade add_service" tabindex="-1" role="dialog">
    <div class="modal-dialog wh550" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title" id="myLargeModalLabel">{:lang('set.add_customer_service')}</h4>
            </div>
            <div class="modal-body">
                {php}$rand_avatar = get_avatar_id(rand(1,500));{/php}
                <div class="form-group am-form-group am-form-file">
                    <label class="control-label">{:lang('user.avatar')}</label>
                    <img class="img-avatar img-avatar-30 m-r-10" src="/images/avatar/cust/{$rand_avatar}.jpg">
                    <input type="hidden" id="mer-avatar" value="/images/avatar/cust/{$rand_avatar}.jpg">
                    <input type="file" class="form-control-file"><i class="iconfont icon-tupianshangchuan"></i>
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.uname')}</label>
                    <input type="text" class="form-control" id="mer-uname">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.upass')}</label>
                    <input type="password" class="form-control" id="mer-upass">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('user.confirm_password')}</label>
                    <input type="password" class="form-control" id="mer-upass2">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('user.nick')}</label>
                    <input type="text" class="form-control" id="mer-nick">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.phone')}</label>
                    <input type="text" class="form-control" id="mer-phone">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.email')}</label>
                    <input type="text" class="form-control" id="mer-email">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('user.service_group')}</label>
                    <select class="form-control" id="mer-group_id">
                        {foreach :getDataLists('im_customer_group',"cuid=".$main_id) as $item}
                        <option{:selected($item['id'],$custs['group_id'])} value="{$item['id']}">{$item['name']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{:lang('public.close')}</button>
                <button type="button" class="btn btn-primary" id="add-service">{:lang('public.save')}</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade edit_service" tabindex="-1" role="dialog">
    <div class="modal-dialog wh550" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title" id="myLargeModalLabel">{:lang('set.edit_customer_service')}</h4>
            </div>
            <div class="modal-body">
                <div class="form-group am-form-group am-form-file">
                    <label class="control-label">{:lang('user.avatar')}</label>
                    <img class="img-avatar img-avatar-30 m-r-10" src="">
                    <input type="hidden" id="emer-avatar" value="">
                    <input type="file" class="form-control-file"><i class="iconfont icon-tupianshangchuan"></i>
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.uname')}</label>
                    <input type="text" class="form-control" id="emer-uname" disabled>
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('user.nick')}</label>
                    <input type="text" class="form-control" id="emer-nick">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.phone')}</label>
                    <input type="text" class="form-control" id="emer-phone">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('public.email')}</label>
                    <input type="text" class="form-control" id="emer-email">
                </div>
                <div class="form-group">
                    <label class="control-label">{:lang('user.service_group')}</label>
                    <select class="form-control" id="emer-group_id">
                    {foreach :getDataLists('im_customer_group',"cuid=".$main_id) as $item}
                        <option{:selected($item['id'],$custs['group_id'])} value="{$item['id']}">{$item['name']}</option>
                    {/foreach}
                    </select>
                </div>
                <input type="hidden" id="emer-id">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{:lang('public.close')}</button>
                <button type="button" class="btn btn-primary" id="edit-service">{:lang('public.save')}</button>
            </div>
        </div>
    </div>
</div>
{include file="common/footer"}
<script type="text/javascript" src="/static/admin/js/clipboard.min.js"></script>
<script type="text/javascript" src="/static/admin/js/set.js"></script>
<script type="text/javascript">
    let IM_config = {
        addService: "{:adminUrl('admin/Set/set_service')}",
        editService: "{:adminUrl('admin/Set/edit_service')}",
        delService: "{:adminUrl('admin/Set/del_service')}"
    };

    $('.input-group .copy-link').on('click', function() {
        var obj = $(this);
        var copy_id = $(this).attr('data-id');
        var clipboard = new ClipboardJS('#copyVal_' + copy_id);
        clipboard.on('success', function(e) {
            we_im_msg("{:lang('public.copy_success')}");
            obj.parent().siblings('input').select();
        });
    });

</script>