lolbox.duowan.com/pcbox/frontend/tpl/recordDetail.tmpl

<%
    data = data.player_game_list[0];
    var groupNameWinOrLose;
    var bannedHeroes = data.banned_champions;
    var userInfoClass = bannedHeroes.length > 0 ? '' : 'hide';
    var gameTypeObj = data.game_type_obj;

    var localTime  = moment.utc(data.end_timestamp).toDate();
    localTime = moment(localTime).format('YYYY-MM-DD HH:mm:ss'),
    timeStrArr = localTime.split(' ')[1].split(':'),endTime = timeStrArr[0] + ':' + timeStrArr[1];

    var teamWin = data.team_win;
    var teamLose = data.team_lose;
    var killStat = parseInt(teamWin.total_killed) + '/' + parseInt(teamLose.total_killed);
    var goldStat = parseInt(teamWin.gold_earned_in_k) + '/' + parseInt(teamLose.gold_earned_in_k)+'K';   

    // 游戏时长
    var game_time__min = parseInt(data.game_length % 86400 % 3600 / 60);
    var game_time__sec = parseInt(data.game_length % 86400 % 3600 % 60 % 60);
%>
<div class="r-top">
    <p><span>人头：<%=killStat%></span><span>金钱：<%=goldStat%></span><span>结束：<%=endTime%></span><span>时长：<%=game_time__min%>:<%=game_time__sec%></span></p>
    <a class="user-info <%=userInfoClass%>" href="javascript:void(0);"><i class="user-icon"></i>禁用英雄</a>
    <ul class="user-img <%=userInfoClass%>">
        <%_.each(bannedHeroes, function(item) {%>
            <li>
                <img
                    src="<%= staticImg + '/champions/' + item.name + '_28x28.jpg' %>"
                    alt="<%=item.title%>"
                    title="<%=item.title%>"
                />
            </li>
        <%});%>
    </ul>
</div> 
<div id="detailBattle" class="r-table tab-content">
    <table id="zj-table-top" cellSpacing=0 cellPadding=0 border="0">
        <tr>
            <th class="col1">
                <div class="match-result">
                    <span><em class="zj-win"></em>胜利方</span>
                    <!-- <span><em class="zj-fail"></em>失败方</span> -->
                </div>
            </th>

        <% if (data.queueType != 'ODIN_UNRANKED') { %>
            <th class="col2">金钱</th>
            <th class="col3">杀/死/助</th>
        <% } else { %>
            <th class="col3">夺/拔/助</th>
        <% } %>

            <th class="col4">
                <span class="sel-tab-link">
                    <a href="javascript:;" class="chuzhuang-link link-on" data-type="chuzhuang" title="点击看出装">出装</a>
                    <a href="javascript:;" class="early-data-link" data-type="early-data" title="点击看前10分钟数据" style="color:#666;">查看前10分钟数据</a>
                </span>
            </th>
        </tr>
    </table>

    <div class="zj-table">
        <% var idx = 1, zjClass = ''; 
            if (data.is_very_surprise_winner) {
                zjClass = "zj-table--big-changeover";
            } else {
                if (data.is_surprise_winner) {
                zjClass="zj-table--changeover";
                }
            }
        %>
        <div id="zj-table--A" class="<%=zjClass%>">
            <div class="team-flag"></div>
            <table>
                <%
                var winPlayers = data.team_win.player_champions;
                if (winPlayers.length > 0) {
                    groupNameWinOrLose = "winner-group";

                    _.each(winPlayers, function(player) {
                        var leaverFlag, urlAvatar, summonerName,summonerTitle, pnTitle,urlDetail,totalLen,extraClass,sn,pn, GOLD_EARNED,KILL_DEATHS_ASSISTS;
                        if (player.is_deserter) {
                            leaverFlag = "<span class='red'>(逃)</span>";
                        } else {
                            leaverFlag = "";
                        }

                        var hoverPN;//英雄头像hover时传的playerName
                        var champion = player.champion;
                        var playerInfo = player.player;
                        var serverName = data.game_zone.server_name;

                        var pInfo = {
                            userId: player.player.user_id,
                            gameZone: data.game_zone.pinyin
                        };

                        if (player.is_bot) {
                            urlAvatar = staticImg + '/champions/' + champion.name + '_40x40.jpg';
                            summonerTitle = playerInfo.pn;
                            summonerName = playerInfo.pn + leaverFlag;
                            
                            pnTitle = playerInfo.pn;
                            
                            urlDetail = null;
                            hoverPN = '';
                        } else {
                            hoverPN = playerInfo.pn;
                            summonerTitle = playerInfo.pn;
                            summonerName = playerInfo.pn + leaverFlag;
                            urlAvatar = staticImg + '/champions/' + champion.name + '_40x40.jpg';
                            
                            sn = encodeURIComponent(serverName);
                            pn = encodeURIComponent(playerInfo.pn);
                            urlDetail = "generalRecord.html?serverName="+sn +"&playerName="+pn + "&userId=" + pInfo.userId + "&gameZone=" + pInfo.gameZone;
                            if( pInfo.userId ){
                                urlDetail = "generalRecord.html?serverName="+sn +"&playerName="+pn + "&userId=" + pInfo.userId + "&gameZone=" + pInfo.gameZone;
                            }else{
                                urlDetail = "javascript:;";
                            }                                  
                        }
                        var strBoxTitle = '';
                        if (player['honors'] && player['honors'].length > 0) {
                            for(var i=0,len=player['honors'].length;i<len;i++) {
                                var item = player['honors'][i], killClass = '';

                                switch(item.name) {
                                case 'brilliant_largest_killing_spree': killClass = 'brilliant_largestKillingSpree';break;
                                case 'kill4': killClass = '4kill';break;
                                case 'kill5': killClass = '5kill';break;
                                case 'kill6': killClass = '6kill';break;
                                default: killClass = item.name;
                                }
                                strBoxTitle += "<em class='zj-"+ killClass +" zj-s' title='" + item.desc + "' data-honour-key='" + item.name + "'></em>";
                            }
                        }

                        KILL_DEATHS_ASSISTS = player.total_killed + '/' + player.total_death + '/' + player.total_assist;

                        var strZB = '';
                        var zhuang_bei_array = player['items'];

                        if (zhuang_bei_array && zhuang_bei_array.length > 0) {
                            for(var i=0,len=zhuang_bei_array.length;i<len;i++) {
                                var item = zhuang_bei_array[i];
                                var url_img = staticImg + '/items/' + item.id + '_40x40.jpg';
                                strZB += '<li><img src="' + url_img + '" ' + 'title="' + item.name + ' ' + item.description + '" ' + 'alt="' + item.name + ' ' + item.description+ '" /></li>';
                                
                            }
                        }

                        var statDataIn10Min = player.kda_10;
                        
                        // MVP或者是大腿
                        var isMVPOrHope = '';
                        var flagMvpCarry = player.flag_mvp_carry;
                        
                        if (flagMvpCarry == 1) {
                            isMVPOrHope = "team-name--stronger";
                        } else if (flagMvpCarry == 2) {
                            isMVPOrHope = "team-name--mvp";
                        }

                        var p = player.player;
                        var pGameZone = data.game_zone.pinyin;
                        var pUserId = p.user_id;
                    %>
                        <tr>
                            <td class="col1">
                                <div class="team-name <%=isMVPOrHope%>">
                                    <span class="flag"></span> <span data-indent="<%=idx%>" class="avatar" game-zone="<%=pGameZone%>" user-id="<%=pUserId%>"> 
                                        <img src="<%=urlAvatar%>" data-playerName="<%=hoverPN%>" data-serverName="<%=serverName%>" data-heroName="<%=champion.name%>" data-uid="<%=playerInfo.user_id%>"/>
                                    </span>

                                    <% if (urlDetail) { %>
                                        <a user-id="<%=pUserId%>" game-zone="<%=pGameZone%>" data-playerName="<%=hoverPN%>" href="<%=urlDetail%>" title="<%=summonerTitle%>"><%=summonerName%></a>
                                    <% } else { %>
                                        <span class="bot" title="<%=summonerTitle%>">
                                        <%=summonerName%>
                                        </span>
                                    <% } %>
                                    <i class="icon-mvp-carry"></i>
                                    <div class="em-content"><%=strBoxTitle%></div>
                                </div>
                            </td>

                            <% if (data.queueType != 'ODIN_UNRANKED') { %>
                            <td class="col2"><%=player['gold_earned_in_k']%>k</td>
                            <% } %>

                            <td class="col3"><%=KILL_DEATHS_ASSISTS%></td>
                            <td class="col4">
                                <div class="u-weapon">
                                    <ul class="chuzhuang">
                                    <%=strZB%>
                                    </ul>
                                    <ul class="early-data">
                                        <li><span class="minions-killed">
                                    补兵：
                                    <%if (statDataIn10Min && statDataIn10Min['m'] >= 80) {%>
                                        <em style="font-weight: bold; color: #f19000">
                                    <%} else if (statDataIn10Min && statDataIn10Min['m'] >= 70) {%>
                                        <em style="font-weight: bold">
                                    <%}%>
                                    <%= (statDataIn10Min && statDataIn10Min['m'].toString()) || '-' %>
                                    <%if (statDataIn10Min && statDataIn10Min['m'] >= 70) {%>
                                        </em>
                                    <%}%>
                                    </span>
                                        杀死助:<%=(statDataIn10Min && statDataIn10Min['k'].toString()) || '-'%>/<%=(statDataIn10Min && statDataIn10Min['d'].toString()) || '-'%>/<%=(statDataIn10Min && statDataIn10Min['a'].toString()) || '-'%>
                                    </li>
                                    </ul>
                                </div>
                            </td>
                        </tr>
                    <%
                        idx++;});
                    for (var i = winPlayers.length; i < 5; i ++) {
                %>
                    <tr><td class='col1'></td><td class='col2'></td><td class='col3'></td><td class='col4'></td></tr>
                <%  }
                }
                %>
            </table>
        </div>

        <div class="river-chu"></div>

        <div id="zj-table--B">
            <div class="team-flag"></div>

            <table>
                <%
                var loserPlayers = data.team_lose.player_champions;
                
                if (loserPlayers.length > 0) {
                    groupNameWinOrLose = "fail-group";

                    _.each(loserPlayers, function(player) {

                        var leaverFlag, urlAvatar, summonerName, summonerTitle, pnTitle,urlDetail,totalLen,extraClass,sn,pn, GOLD_EARNED,KILL_DEATHS_ASSISTS;

                        if (player.is_deserter) {
                            leaverFlag = "<span class='red'>(逃)</span>";
                        } else {
                            leaverFlag = "";
                        }

                        var hoverPN;//英雄头像hover时传的playerName
                        var champion = player.champion;
                        var playerInfo = player.player;
                        var serverName = data.game_zone.server_name;

                        var pInfo = {
                            userId: player.player.user_id,
                            gameZone: data.game_zone.pinyin
                        };

                        if (player.is_bot) {
                            urlAvatar = staticImg + '/champions/' + champion.name + '_40x40.jpg';
                            summonerTitle = playerInfo.pn;
                            summonerName = playerInfo.pn + leaverFlag;
                            
                            pnTitle = playerInfo.pn;
                            
                            urlDetail = null;
                            hoverPN = '';
                        } else {
                            hoverPN = playerInfo.pn;
                            summonerTitle = playerInfo.pn;
                            summonerName = playerInfo.pn + leaverFlag;
                            urlAvatar = staticImg + '/champions/' + champion.name + '_40x40.jpg';
                            
                            sn = encodeURIComponent(serverName);
                            pn = encodeURIComponent(playerInfo.pn);

                            /*userId为null或者0时不跳转*/
                            if( pInfo.userId ){
                                urlDetail = "generalRecord.html?serverName="+sn +"&playerName="+pn + "&userId=" + pInfo.userId + "&gameZone=" + pInfo.gameZone;
                            }else{
                                urlDetail = "javascript:;";
                            }                                
                        }

                        var strBoxTitle = '';

                        if (player['honors'] && player['honors'].length > 0) {
                            for(var i=0,len=player['honors'].length;i<len;i++) {
                                var item = player['honors'][i], killClass = '';
                                switch(item.name) {
                                case 'brilliant_largest_killing_spree': killClass = 'brilliant_largestKillingSpree';break;
                                case 'kill4': killClass = '4kill';break;
                                case 'kill5': killClass = '5kill';break;
                                case 'kill6': killClass = '6kill';break;
                                default: killClass = item.name;
                                }
                                strBoxTitle += "<em class='zj-"+ killClass +" zj-s' title='" + item.desc + "' data-honour-key='" + item.name + "'></em>";
                            }
                        }

                        KILL_DEATHS_ASSISTS = player.total_killed + '/' + player.total_death + '/' + player.total_assist;

                        var strZB = '';
                        var zhuang_bei_array =player['items'];

                        if (zhuang_bei_array && zhuang_bei_array.length > 0) {
                            for(var i=0,len=zhuang_bei_array.length;i<len;i++) {
                                var item = zhuang_bei_array[i];
                                var url_img = staticImg + '/items/' + item.id + '_40x40.jpg'
                                strZB += '<li><img src="' + url_img + '" ' + 'title="' + item.name + ' ' + item.description + '" ' + 'alt="' + item.name + ' ' + item.description+ '" /></li>';
                            }
                        }

                        var statDataIn10Min = player.kda_10;

                        // MVP或者是大腿
                        var isMVPOrHope = '';
                        var flagMvpCarry = player.flag_mvp_carry;
                        if (flagMvpCarry == 1) {
                            isMVPOrHope = "team-name--stronger";
                        } else if (flagMvpCarry == 2) {
                            isMVPOrHope = "team-name--mvp";
                        }

                        var p = player.player;
                        var pGameZone = data.game_zone.pinyin;
                        var pUserId = p.user_id;
                %>
                    <tr>
                        <td class="col1">
                            <div class="team-name <%=isMVPOrHope%>">
                                <span class="flag"></span> <span data-indent="<%=idx%>"
                                    class="avatar" game-zone="<%=pGameZone%>" user-id="<%=pUserId%>">
                                    <img src="<%=urlAvatar%>" data-playerName="<%=hoverPN%>" data-serverName="<%=serverName%>" data-heroName="<%=champion.name%>" data-uid="<%=playerInfo.user_id%>"/>
                                </span>

                                <% if (urlDetail) { %>
                                    <a user-id="<%=pUserId%>" game-zone="<%=pGameZone%>" data-playerName="<%=hoverPN%>" href="<%=urlDetail%>" title="<%=summonerTitle%>"><%=summonerName%></a>
                                <% } else { %>
                                    <span class="bot" title="<%=summonerTitle%>">
                                    <%=summonerName%>
                                    </span>
                                <% } %>
                                <i class="icon-mvp-carry"></i>
                                <div class="em-content"><%=strBoxTitle%></div>
                            </div>
                        </td>

                        <% if (data.queueType != 'ODIN_UNRANKED') { %>
                        <td class="col2"><%=player['gold_earned_in_k']%>k</td>
                        <% } %>

                        <td class="col3"><%=KILL_DEATHS_ASSISTS%></td>
                        <td class="col4">
                            <div class="u-weapon">
                                <ul class="chuzhuang">
                                <%=strZB%>
                            </ul>
                                <ul class="early-data">
                                    <li><span class="minions-killed">
                                补兵：
                                <%if (statDataIn10Min && statDataIn10Min['m'] >= 80) {%>
                                    <em style="font-weight: bold; color: #f19000">
                                <%} else if (statDataIn10Min && statDataIn10Min['m'] >= 70) {%>
                                    <em style="font-weight: bold">
                                <%}%>
                                <%= (statDataIn10Min && statDataIn10Min['m'].toString()) || '-' %>
                                <%if (statDataIn10Min && statDataIn10Min['m'] >= 70) {%>
                                    </em>
                                <%}%>
                                </span>
                                    杀死助:<%=(statDataIn10Min && statDataIn10Min['k'].toString()) || '-'%>/<%=(statDataIn10Min && statDataIn10Min['d'].toString()) || '-'%>/<%=(statDataIn10Min && statDataIn10Min['a'].toString()) || '-'%>
                                </li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                <%  idx++;});
                    
                    for (var i = loserPlayers.length; i < 5; i ++) {
                %>
                        <tr><td class='col1'></td><td class='col2'></td><td class='col3'></td><td class='col4'></td></tr>
                <%}}%>
            </table>
        </div>
    </div>
</div>
<div id="mod-tips-s1" class="mod-tips-s1">
    <div class="mod-tips-bg">
        <div class="mod-tips-content"></div>
    </div>
    <i class="arrow l"></i>
</div>