Use VideoItem in Search Results.

This commit is contained in:
FireMasterK 2021-09-04 00:57:22 +05:30
parent 85e2296dc4
commit c97a0ef6c6
No known key found for this signature in database
GPG Key ID: 49451E4482CC5BCD

View File

@ -25,15 +25,11 @@
v-bind:key="result.url" v-bind:key="result.url"
v-for="result in results.items" v-for="result in results.items"
> >
<div class="uk-text-secondary"> <VideoItem v-if="shouldUseVideoItem(result)" :video="result" height="94" width="168" />
<div class="uk-text-secondary" v-if="!shouldUseVideoItem(result)">
<router-link class="uk-text-emphasis" v-bind:to="result.url"> <router-link class="uk-text-emphasis" v-bind:to="result.url">
<div class="uk-position-relative"> <div class="uk-position-relative">
<img style="width: 100%" v-bind:src="result.thumbnail" loading="lazy" /> <img style="width: 100%" v-bind:src="result.thumbnail" loading="lazy" />
<span
v-if="result.duration"
class="uk-label uk-border-rounded uk-position-absolute uk-dark"
style="bottom: 5px; right: 5px; opacity: .95;"
>{{ timeFormat(result.duration) }}</span>
</div> </div>
<p> <p>
{{ result.name }}&thinsp;<font-awesome-icon {{ result.name }}&thinsp;<font-awesome-icon
@ -52,25 +48,18 @@
</p> </p>
</router-link> </router-link>
<b v-if="result.uploadDate">
{{ result.uploadDate }}
</b>
<a v-if="result.uploaderName" class="uk-text-muted">{{ result.uploaderName }}</a> <a v-if="result.uploaderName" class="uk-text-muted">{{ result.uploaderName }}</a>
<b v-if="result.videos >= 0"><br v-if="result.uploaderName" />{{ result.videos }} Videos</b> <b v-if="result.videos >= 0"><br v-if="result.uploaderName" />{{ result.videos }} Videos</b>
<br /> <br />
<b v-if="result.views >= 0" class="uk-text-small">
<font-awesome-icon icon="eye"></font-awesome-icon>
{{ numberFormat(result.views) }} views
</b>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import VideoItem from "@/components/VideoItem.vue";
export default { export default {
data() { data() {
return { return {
@ -124,6 +113,12 @@ export default {
}); });
} }
}, },
shouldUseVideoItem(item) {
return item.title;
},
},
components: {
VideoItem,
}, },
}; };
</script> </script>