<?php include_once(mvc::$cfg['PATH_TPL'] . 'public/headBase2.php'); ?>
<?php
$userTxlList = !empty($userTxlList) && is_array($userTxlList) ? $userTxlList : [];
$defaultAvatar = mvc::$cfg['ADMIN_URL'] . 'static/images/noimg.png';
?>
<style>
    .wx-txl-stat {
        min-width: 160px;
        padding: 14px 16px;
        background: #fafafa;
        border: 1px solid #f0f0f0;
        border-radius: 8px;
    }

    .wx-txl-stat-label {
        font-size: 12px;
        color: #999;
        line-height: 1;
    }

    .wx-txl-stat-value {
        margin-top: 10px;
        font-size: 24px;
        font-weight: 600;
        color: #333;
        line-height: 1;
    }

    .wx-txl-list-table {
        background: #fff;
    }

    .wx-txl-list-table td,
    .wx-txl-list-table th {
        vertical-align: middle;
    }

    .wx-txl-avatar-link {
        display: inline-block;
    }

    .wx-txl-avatar {
        width: 56px;
        height: 56px;
        border-radius: 8px;
        object-fit: cover;
        background: #f5f5f5;
        border: 1px solid #f0f0f0;
    }

    .wx-txl-name {
        font-size: 15px;
        font-weight: 600;
        color: #333;
        line-height: 1.5;
        word-break: break-all;
    }

    .wx-txl-meta {
        margin-top: 4px;
        font-size: 12px;
        color: #999;
        line-height: 1.6;
        word-break: break-all;
    }

    .wx-txl-value {
        color: #333;
        word-break: break-all;
    }

    .wx-txl-empty {
        padding: 36px 0;
        color: #999;
        text-align: center;
        background: #fff;
        border: 1px solid #e6e6e6;
        border-top: 0;
    }

    .wx-txl-friend-done {
        color: #ff8f1f;
        font-weight: 600;
    }

    .wx-txl-friend-done.is-done {
        color: #07c160;
    }

    .wx-txl-friend-total {
        color: #07c160;
        font-weight: 600;
    }

    .wx-txl-status {
        font-weight: 600;
    }

    .wx-txl-status-full {
        color: #999;
    }

    .wx-txl-status-pending {
        color: #ff8f1f;
    }

    .wx-txl-status-processing {
        color: #1e9fff;
    }

    .wx-txl-status-done {
        color: #07c160;
    }

    .wx-txl-login-status {
        font-weight: 600;
    }

    .wx-txl-login-status-online {
        color: #07c160;
    }

    .wx-txl-login-status-offline {
        color: #999;
    }
</style>
<div class="layui-card">
    <div class="layui-card-body">
        <table class="layui-table YpTable wx-txl-list-table">
            <thead>
                <tr class="Filter Sortable">
                    <th width="20"><span>序号</span></th>
                    <th width="30"><span>头像</span></th>
                    <th width="160" class="Sort"><span>昵称</span></th>
                    <th width="100" class="Sort"><span>真实姓名</span></th>
                    <th width="160" class="Sort"><span>微信ID</span></th>
                    <th width="100" class="Sort"><span>微信号</span></th>
                    <th width="130" class="Sort"><span>手机号</span></th>
                    <th width="50" class="Sort"><span>TOKEN</span></th>
                    <th width="50" class="Sort"><span>处理情况</span></th>
                    <th width="120" class="Sort"><span>好友数</span></th>
                    <th width="120" class="Sort"><span>会员数</span></th>
                    <th width="100" class="Sort"><span>已推送</span></th>
                    <th width="120" class="Sort"><span>已回复</span></th>
                    <th width="160" class="Sort"><span>好友最后更新</span></th>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                    <td><input type="text" class="FilterTxt layui-input"></td>
                </tr>
            </thead>
            <tbody id="wxTxlListBody">
                <?php if (!empty($userTxlList)) { ?>
                    <?php foreach ($userTxlList as $key => $item) { ?>
                        <?php
                        $nickname = !empty($item['wu_nickname']) ? $item['wu_nickname'] : '未设置昵称';
                        $realname = !empty($item['wu_realname']) ? $item['wu_realname'] : '-';
                        $wxid = !empty($item['wu_wxid']) ? $item['wu_wxid'] : '-';
                        $weixin = !empty($item['wu_weixin']) ? $item['wu_weixin'] : '-';
                        $mobile = !empty($item['wu_mobile']) ? $item['wu_mobile'] : '-';
                        $avatar = !empty($item['wu_headimg']) ? $item['wu_headimg'] : $defaultAvatar;
                        $searchText = $nickname . ' ' . $realname . ' ' . $wxid . ' ' . $weixin . ' ' . $mobile;
                        $friendsLastUpDate = !empty($item['wu_address_utime2']) ? date('Y-m-d H:i:s', $item['wu_address_utime2']) : '-';
                        $friendsDoneCount = isset($item['friends_done_count']) ? (int)$item['friends_done_count'] : 0;
                        $friendsTotalCount = isset($item['friends_total_count']) ? (int)$item['friends_total_count'] : 0;
                        $friendsYpCount = isset($item['friends_yp_count']) ? (int)$item['friends_yp_count'] : 0;
                        $friendsYpCountPercent = $friendsTotalCount > 0 ? round($friendsYpCount / $friendsTotalCount * 100) . '%' : '0%';
                        $tsTotalCount = isset($item['ts_total_count']) ? (int)$item['ts_total_count'] : 0;
                        $tsReplyCount = isset($item['ts_reply_count']) ? (int)$item['ts_reply_count'] : 0;
                        $tsReplyCountPercent = $tsTotalCount > 0 ? round($tsReplyCount / $tsTotalCount * 100) . '%' : '0%';
                        $friendsDoneClass = 'wx-txl-friend-done';
                        if ($friendsDoneCount !== '-' && $friendsTotalCount !== '-' && (string)$friendsDoneCount === (string)$friendsTotalCount) {
                            $friendsDoneClass .= ' is-done';
                        }
                        $addressStatusEmun = [
                            '-1' => '无需处理',
                            '0' => '待处理',
                            '1' => '处理中',
                            '2' => '已完成',
                        ];
                        $wrtLoginStatusEmun = [
                            '-1' => '离线',
                            '1' => '在线',
                        ];
                        $wrtLoginStatus = !empty($item['wrt_loginstatus']) ? $item['wrt_loginstatus'] : '-1';
                        $wrtLoginStatusText = !empty($wrtLoginStatusEmun[$wrtLoginStatus]) ? $wrtLoginStatusEmun[$wrtLoginStatus] : '-';
                        $wrtLoginStatusClass = 'wx-txl-login-status wx-txl-login-status-offline';
                        if ((string)$wrtLoginStatus === '1') {
                            $wrtLoginStatusClass = 'wx-txl-login-status wx-txl-login-status-online';
                        }
                        
                        $addressStatus = !empty($item['wu_address_status']) ? $item['wu_address_status'] : '-1';
                        $addressStatusText = !empty($addressStatusEmun[$addressStatus]) ? $addressStatusEmun[$addressStatus] : '-';
                        $addressStatusClass = 'wx-txl-status wx-txl-status-full';
                        if ((string)$addressStatus === '0') {
                            $addressStatusClass = 'wx-txl-status wx-txl-status-pending';
                        } else if ((string)$addressStatus === '1') {
                            $addressStatusClass = 'wx-txl-status wx-txl-status-processing';
                        } else if ((string)$addressStatus === '2') {
                            $addressStatusClass = 'wx-txl-status wx-txl-status-done';
                        }
                        ?>
                        <tr class="js-wx-txl-row" data-search="<?php echo htmlspecialchars($searchText, ENT_QUOTES); ?>">
                            <td><?php echo $key + 1; ?></td>
                            <td>
                                <a class="wx-txl-avatar-link" href="<?php echo htmlspecialchars($avatar, ENT_QUOTES); ?>" target="_blank">
                                    <img class="wx-txl-avatar" src="<?php echo htmlspecialchars($avatar, ENT_QUOTES); ?>" alt="<?php echo htmlspecialchars($nickname, ENT_QUOTES); ?>" onerror="this.onerror=null;this.src='<?php echo $defaultAvatar; ?>';">
                                </a>
                            </td>
                            <td>
                                <div class="wx-txl-name"><?php echo htmlspecialchars($nickname, ENT_QUOTES); ?></div>
                            </td>
                            <td>
                                <div class="wx-txl-meta"><span class="wx-txl-value"><?php echo htmlspecialchars($realname, ENT_QUOTES); ?></span></div>
                            </td>
                            <td><?php echo htmlspecialchars($wxid, ENT_QUOTES); ?></td>
                            <td><?php echo htmlspecialchars($weixin, ENT_QUOTES); ?></td>
                            <td><?php echo htmlspecialchars($mobile, ENT_QUOTES); ?></td>
                            <td><span class="<?php echo $wrtLoginStatusClass; ?>"><?php echo htmlspecialchars($wrtLoginStatusText, ENT_QUOTES); ?></span></td>
                            <td><span class="<?php echo $addressStatusClass; ?>"><?php echo htmlspecialchars($addressStatusText, ENT_QUOTES); ?></span></td>
                            <td>
                                <span class="<?php echo $friendsDoneClass; ?>"><?php echo htmlspecialchars($friendsDoneCount, ENT_QUOTES); ?></span>
                                /
                                <span class="wx-txl-friend-total"><?php echo htmlspecialchars($friendsTotalCount, ENT_QUOTES); ?></span>
                            </td>
                            <td><?php echo htmlspecialchars($friendsYpCount.'['.$friendsYpCountPercent.']', ENT_QUOTES); ?></td>
                            <td><?php echo htmlspecialchars($tsTotalCount, ENT_QUOTES); ?></td>
                            <td><?php echo htmlspecialchars($tsReplyCount.'['.$tsReplyCountPercent.']', ENT_QUOTES); ?></td>
                            <td><?php echo htmlspecialchars($friendsLastUpDate, ENT_QUOTES); ?></td>
                        </tr>
                    <?php } ?>
                <?php } ?>
            </tbody>
        </table>
        <div id="wxTxlEmptyPanel" class="wx-txl-empty" <?php if (!empty($userTxlList)) { ?>style="display:none;" <?php } ?>>暂无通讯录数据</div>
    </div>
</div>
<?php include_once(mvc::$cfg['PATH_TPL'] . 'public/footBase.php'); ?>
<script type="text/javascript">
    $(function() {
        function syncWxTxlEmptyState() {
            var $rows = $('#wxTxlListBody').find('.js-wx-txl-row');
            var rowCount = $rows.length;
            var visibleCount = $rows.filter(':visible').length;
            $('#wxTxlEmptyPanel').toggle(rowCount === 0 || visibleCount === 0);
        }

        function delaySyncWxTxlEmptyState() {
            setTimeout(syncWxTxlEmptyState, 0);
            setTimeout(syncWxTxlEmptyState, 120);
        }

        $(document).on('input keyup change', '.FilterTxt', delaySyncWxTxlEmptyState);
        syncWxTxlEmptyState();
    });
</script>
