Showing scene and channel count on entity page and tile.
This commit is contained in:
DebaucheryLibrarian
parent
8322d43b09
commit
b764fdec85
|
|
@ -51,7 +51,7 @@
|
|||
>{{ tag.name }}</li>
|
||||
</ul>
|
||||
|
||||
<router-link
|
||||
<RouterLink
|
||||
v-if="entity.parent"
|
||||
:to="`/${entity.parent.type}/${entity.parent.slug}`"
|
||||
class="link link-parent"
|
||||
|
|
@ -74,7 +74,7 @@
|
|||
>{{ entity.parent.name }}</h3>
|
||||
|
||||
<Icon icon="device_hub" />
|
||||
</router-link>
|
||||
</RouterLink>
|
||||
</div>
|
||||
|
||||
<div
|
||||
|
|
|
|||
|
|
@ -4,39 +4,48 @@
|
|||
:title="entity.name"
|
||||
class="tile"
|
||||
>
|
||||
<template v-if="entity.hasLogo">
|
||||
<img
|
||||
v-if="entity.type === 'network' || entity.independent"
|
||||
:src="`/img/logos/${entity.slug}/thumbs/network.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
<div class="tile-logo">
|
||||
<template v-if="entity.hasLogo">
|
||||
<img
|
||||
v-if="entity.type === 'network' || entity.independent"
|
||||
:src="`/img/logos/${entity.slug}/thumbs/network.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
|
||||
<img
|
||||
v-else-if="entity.parent"
|
||||
:src="`/img/logos/${entity.parent.slug}/thumbs/${entity.slug}.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
<img
|
||||
v-else-if="entity.parent"
|
||||
:src="`/img/logos/${entity.parent.slug}/thumbs/${entity.slug}.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
|
||||
<img
|
||||
<img
|
||||
v-else
|
||||
:src="`/img/logos/${entity.slug}/thumbs/${entity.slug}.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
</template>
|
||||
|
||||
<span
|
||||
v-else
|
||||
:src="`/img/logos/${entity.slug}/thumbs/${entity.slug}.png`"
|
||||
:alt="entity.name"
|
||||
loading="lazy"
|
||||
class="logo"
|
||||
@load="$emit('load', $event)"
|
||||
>
|
||||
</template>
|
||||
class="name"
|
||||
>{{ entity.name }}</span>
|
||||
</div>
|
||||
|
||||
<span
|
||||
v-else
|
||||
class="name"
|
||||
>{{ entity.name }}</span>
|
||||
class="count"
|
||||
>
|
||||
<span>{{ entity.sceneTotal }} scenes</span>
|
||||
<span v-if="entity.type === 'network'">{{ entity.childrenTotal }} channels</span>
|
||||
</span>
|
||||
</router-link>
|
||||
</template>
|
||||
|
||||
|
|
@ -59,15 +68,27 @@ export default {
|
|||
height: 100%;
|
||||
background: var(--tile);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: .5rem 1rem;
|
||||
border-radius: .25rem;
|
||||
position: relative;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, .25);
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover .count {
|
||||
color: var(--lighten);
|
||||
}
|
||||
}
|
||||
|
||||
.tile-logo {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
padding: .5rem 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.logo {
|
||||
|
|
@ -75,6 +96,7 @@ export default {
|
|||
max-height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.name {
|
||||
|
|
@ -82,4 +104,16 @@ export default {
|
|||
font-size: 1.25rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.count {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: .25rem .5rem;
|
||||
border-top: solid 1px var(--lighten-hint);
|
||||
color: var(--lighten-weak);
|
||||
text-align: center;
|
||||
font-size: .8rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,20 @@
|
|||
<template>
|
||||
<div class="filter-bar noselect">
|
||||
<div class="sort">
|
||||
<router-link
|
||||
<RouterLink
|
||||
v-for="section in ranges"
|
||||
:key="section"
|
||||
:to="{ params: { range: section, pageNumber: 1 }, query: $route.query }"
|
||||
:class="{ active: $route.name === section || range === section }"
|
||||
class="range range-button"
|
||||
>{{ section }}</router-link>
|
||||
>{{ section }}</RouterLink>
|
||||
</div>
|
||||
|
||||
<span
|
||||
v-if="itemsTotal && showTotal"
|
||||
class="total"
|
||||
>{{ itemsTotal }} <template v-if="itemsTotal === 1">scene</template><template v-else>scenes</template></span>
|
||||
|
||||
<div class="filters">
|
||||
<ActorFilter
|
||||
class="filters-filter"
|
||||
|
|
@ -78,6 +83,10 @@ export default {
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
showTotal: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
itemsTotal: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
|
|
@ -240,6 +249,10 @@ export default {
|
|||
.filters-filter:last-child .filter {
|
||||
padding: .5rem 0 .5rem .5rem;
|
||||
}
|
||||
|
||||
.total {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -351,4 +364,11 @@ export default {
|
|||
margin: 0 1rem 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.total {
|
||||
flex-shrink: 0;
|
||||
padding: 0 1rem;
|
||||
color: var(--shadow);
|
||||
font-size: .8rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
:items-total="totalCount"
|
||||
:items-per-page="limit"
|
||||
:content="$refs.content"
|
||||
:show-total="false"
|
||||
/>
|
||||
|
||||
<Releases
|
||||
|
|
|
|||
|
|
@ -113,21 +113,22 @@
|
|||
:key="actor.id"
|
||||
class="actor"
|
||||
>
|
||||
<router-link
|
||||
<RouterLink
|
||||
:to="{ name: 'actor', params: { actorId: actor.id, actorSlug: actor.slug } }"
|
||||
:class="{ [actor.gender]: !!actor.gender }"
|
||||
class="actor-link"
|
||||
>{{ actor.name }}</router-link>
|
||||
>{{ actor.name }}</RouterLink>
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
|
||||
<div class="labels">
|
||||
<router-link
|
||||
<RouterLink
|
||||
v-if="release.shootId && release.studio"
|
||||
:to="`/studio/${release.studio.slug}`"
|
||||
:title="release.studio && release.studio.name"
|
||||
class="shoot nolink"
|
||||
>{{ release.shootId }}</router-link>
|
||||
>{{ release.shootId }}</RouterLink>
|
||||
|
||||
<span
|
||||
v-else-if="release.shootId"
|
||||
|
|
@ -145,10 +146,10 @@
|
|||
:key="`tag-${tag.slug}`"
|
||||
class="tag"
|
||||
>
|
||||
<router-link
|
||||
<RouterLink
|
||||
:to="`/tag/${tag.slug}`"
|
||||
class="tag-link"
|
||||
>{{ tag.name }}</router-link>
|
||||
>{{ tag.name }}</RouterLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -117,6 +117,10 @@ function curateEntity(entity, parent, releases) {
|
|||
if (entity.parent || parent) curatedEntity.parent = curateEntity(entity.parent || parent);
|
||||
if (releases) curatedEntity.releases = releases.map(release => curateRelease(release));
|
||||
|
||||
if (entity.connection) {
|
||||
curatedEntity.sceneTotal = entity.connection.totalCount;
|
||||
}
|
||||
|
||||
return curatedEntity;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ function initEntitiesActions(store, router) {
|
|||
}) {
|
||||
const { before, after, orderBy } = getDateRange(range);
|
||||
|
||||
const { entity, connection: { releases, totalCount } } = await graphql(`
|
||||
const { entity } = await graphql(`
|
||||
query Entity(
|
||||
$entitySlug: String!
|
||||
$entityType: String! = "channel"
|
||||
|
|
@ -64,6 +64,12 @@ function initEntitiesActions(store, router) {
|
|||
independent
|
||||
hasLogo
|
||||
${campaignsFragment}
|
||||
children: childEntitiesConnection {
|
||||
totalCount
|
||||
}
|
||||
connection: scenesConnection {
|
||||
totalCount
|
||||
}
|
||||
}
|
||||
}
|
||||
${campaignsFragment}
|
||||
|
|
@ -77,82 +83,45 @@ function initEntitiesActions(store, router) {
|
|||
hasLogo
|
||||
${campaignsFragment}
|
||||
}
|
||||
}
|
||||
connection: releasesConnection(
|
||||
first: $limit
|
||||
offset: $offset
|
||||
orderBy: $orderBy
|
||||
filter: {
|
||||
and: [
|
||||
{
|
||||
entity: {
|
||||
or: [
|
||||
{
|
||||
slug: { equalTo: $entitySlug }
|
||||
},
|
||||
{
|
||||
parent: {
|
||||
slug: { equalTo: $entitySlug }
|
||||
type: { equalTo: $entityType }
|
||||
}
|
||||
},
|
||||
{
|
||||
parent: {
|
||||
parent: {
|
||||
slug: { equalTo: $entitySlug }
|
||||
type: { equalTo: $entityType }
|
||||
}
|
||||
}
|
||||
}
|
||||
{
|
||||
parent: {
|
||||
parent: {
|
||||
parent: {
|
||||
slug: { equalTo: $entitySlug }
|
||||
type: { equalTo: $entityType }
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
{
|
||||
or: [
|
||||
{
|
||||
date: {
|
||||
lessThan: $before,
|
||||
greaterThan: $after
|
||||
}
|
||||
},
|
||||
{
|
||||
date: {
|
||||
isNull: true
|
||||
},
|
||||
createdAt: {
|
||||
lessThan: $beforeTime,
|
||||
greaterThan: $afterTime,
|
||||
}
|
||||
connection: scenesConnection(
|
||||
first: $limit
|
||||
offset: $offset
|
||||
orderBy: $orderBy
|
||||
filter: {
|
||||
or: [
|
||||
{
|
||||
date: {
|
||||
lessThan: $before,
|
||||
greaterThan: $after
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
releasesTagsConnection: {
|
||||
none: {
|
||||
tag: {
|
||||
slug: {
|
||||
in: $exclude
|
||||
},
|
||||
{
|
||||
date: {
|
||||
isNull: true
|
||||
},
|
||||
createdAt: {
|
||||
lessThan: $beforeTime,
|
||||
greaterThan: $afterTime,
|
||||
}
|
||||
}
|
||||
]
|
||||
releasesTagsConnection: {
|
||||
none: {
|
||||
tag: {
|
||||
slug: {
|
||||
in: $exclude
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
) {
|
||||
releases: nodes {
|
||||
${releaseFields}
|
||||
}
|
||||
totalCount
|
||||
}
|
||||
) {
|
||||
releases: nodes {
|
||||
${releaseFields}
|
||||
}
|
||||
totalCount
|
||||
}
|
||||
}
|
||||
}
|
||||
`, {
|
||||
entitySlug,
|
||||
|
|
@ -175,8 +144,8 @@ function initEntitiesActions(store, router) {
|
|||
}
|
||||
|
||||
return {
|
||||
entity: curateEntity(entity, null, releases),
|
||||
totalCount,
|
||||
entity: curateEntity(entity, null, entity.connection.releases),
|
||||
totalCount: entity.connection.totalCount,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -233,6 +202,9 @@ function initEntitiesActions(store, router) {
|
|||
children: childEntitiesConnection {
|
||||
totalCount
|
||||
}
|
||||
connection: scenesConnection {
|
||||
totalCount
|
||||
}
|
||||
}
|
||||
}
|
||||
`, {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
exports.up = async knex => knex.raw(`
|
||||
CREATE FUNCTION entities_scenes(entity entities) RETURNS SETOF releases AS $$
|
||||
WITH RECURSIVE children AS (
|
||||
SELECT entities.id
|
||||
FROM entities
|
||||
WHERE entities.id = entity.id
|
||||
|
||||
UNION ALL
|
||||
|
||||
SELECT entities.id
|
||||
FROM entities
|
||||
INNER JOIN children ON children.id = entities.parent_id
|
||||
)
|
||||
|
||||
SELECT releases FROM releases
|
||||
INNER JOIN children ON children.id = releases.entity_id;
|
||||
$$ LANGUAGE SQL STABLE;
|
||||
|
||||
COMMENT ON FUNCTION entities_scenes IS E'@sortable';
|
||||
`);
|
||||
|
||||
exports.down = async knex => knex.raw(`
|
||||
DROP FUNCTION IF EXISTS entities_scenes;
|
||||
`);
|
||||
Loading…
Reference in New Issue