end order by item(job, 0).number(tPuntos);

let tab := if View then
        ((select Equipos) order by 'Total Puntos')[Status = 1]
    else
        (select Equipos order by 'Total Puntos')[Status != 1]
    end;
let allEquipos := unique(tab.Equipo);
let object1 := for i in allEquipos do
        {
            termin: text(i),
            job: first(tab[Equipo = i].{
                id: Id,
                lEquipo: Equipo,
                cC: Campo,
                tJugados: 'Total Jugados',
                tPuntos: 'Total Puntos',
                status: number(Status)
            })
        }
    end;
let object := (object1 order by job.number('Total Puntos'));
let css := "
<style>
.grid-container {
    display:grid;
    grid-template-columns:repeat(auto-fill,22em);
    grid-gap:1em
}
.gridform{
    font-size:small;
    border-radius:.5em;
    padding:1em;
    box-shadow:2px 2px dimgray;
    color:DimGray;
    background-color:#e3ecd4;
}
.jump:hover{cursor:pointer;background-color:#bbddbb;}
ul{list-style-type:circle;}
</style>
";
let content := ---
<aside class=grid-container>{ for i in object order by termin do }
    <aside class=gridform><h2 style=text-align:center>{ i.termin } </h2>{ for j in i.job do }
        <ul>
            <li class=jump onclick=ui.popupRecord('{ j.id }')><b>equipo local:</b></b></b> { j.lEquipo }</li>
            <li><b>Campo:</b></b></b> { j.cC }</li>
                        <li><b>Total Jugados:</b></b> { j.tJugados }</li>
            <li><b>Total Puntos:</b></b> { j.tPuntos }</li>
        </ul>{ end }
    </aside>{ end }
</aside>
    ---;
html(css + content)

let tab := if View then
        ((select Equipos) order by -'Total Puntos')[Status = 1]
    else
        (select Equipos where Status != 1) order by -'Total Puntos' and 'Total GF'
    end;
let object := tab.{
        lEquipo: Equipo,
        cC: Campo,
        tJugados: 'Total Jugados',
        tPuntos: 'Total Puntos',
        status: number(Status)
    };
let css := "
<style>
.grid-container {
    display:grid;
    grid-template-columns:repeat(auto-fill,22em);
    grid-gap:1em
}
.gridform{
    font-size:small;
    border-radius:.5em;
    padding:1em;
    box-shadow:2px 2px dimgray;
    color:DimGray;
    background-color:#e3ecd4;
}
ul{list-style-type:circle;}
</style>
";
let content := ---
<aside class=grid-container>{ for i in (object order by text(lEquipo)) order by -number(tPuntos) do }
    <aside class=gridform><h2 style=text-align:center>{ i.lEquipo }</h2>
        <ul>
            <li><b>equipo local: </b>{ i.lEquipo }</li>
            <li><b>Campo: </b>{ i.cC }</li>
            <li><b>Total Jugados: </b>{ i.tJugados }</li>
            <li><b>Total Puntos: </b>{ i.tPuntos }</li>
        </ul>
    </aside>{ end }
</aside>
    ---;
html(css + content)