barta-india.in-old/pages/en/index.vue

439 lines
18 KiB
Vue

<template>
<v-container>
<v-row class="px-lg-14 ">
<v-col cols="12" sm="12" md="12" lg="6">
<nuxt-link :to="`/en/${worldNews[0].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${worldNews[0].image.url}`" aspect-ratio="1.75">
<span v-text="worldNews[0].text_over_image" class="text_over_image"></span>
</v-img>
<v-card-title primary-title>
<p> <span>Publish on : {{ worldNews[0].created_at.slice(0, 10) }}, </span>
<span>at : {{ worldNews[0].created_at.slice(11, -5) }} </span></p>
<p v-text="worldNews[0].title" class="text-lg-h4 text-sm-h5"></p>
<!-- <v-text class="text-lg-h4 text-sm-h5">{{worldNews[0].title}}</v-text> -->
</v-card-title>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="12" md="12" lg="6">
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${worldNews[1].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${worldNews[1].image.url}`" aspect-ratio="1.75">
<span v-text="worldNews[1].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ worldNews[1].created_at.slice(0, 10) }} , </span>
<span>at : {{ worldNews[1].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{worldNews[1].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${worldNews[2].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${worldNews[2].image.url}`" aspect-ratio="1.75">
<span v-text="worldNews[2].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ worldNews[2].created_at.slice(0, 10) }} , </span>
<span>at : {{ worldNews[2].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{worldNews[2].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${worldNews[3].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${worldNews[3].image.url}`" aspect-ratio="1.75">
<span v-text="worldNews[3].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ worldNews[3].created_at.slice(0, 10) }} , </span>
<span>at : {{ worldNews[3].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{worldNews[3].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${worldNews[4].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${worldNews[4].image.url}`" aspect-ratio="1.75">
<span v-text="worldNews[4].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ worldNews[4].created_at.slice(0, 10) }} , </span>
<span>at : {{ worldNews[4].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{worldNews[4].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
</v-col>
</v-row>
<!-- ////////////////////////////////////// -->
<v-row class="px-lg-14 ">
<v-col cols="12" sm="12" md="12" lg="6">
<nuxt-link :to="`/en/${localNews[0].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${localNews[0].image.url}`" aspect-ratio="1.75">
<span v-text="localNews[0].text_over_image" class="text_over_image"></span>
</v-img>
<v-card-title primary-title>
<p> <span>Publish on : {{ worldNews[0].created_at.slice(0, 10) }}, </span>
<span>at : {{ worldNews[0].created_at.slice(11, -5) }} </span></p>
<span v-text="localNews[0].title" class="text-lg-h4 text-sm-h5"></span>
<!-- <v-text class="text-lg-h4 text-sm-h5">{{localNews[0].title}}</v-text> -->
</v-card-title>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="12" md="12" lg="6">
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${localNews[1].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${localNews[1].image.url}`" aspect-ratio="1.75">
<span v-text="localNews[1].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ localNews[1].created_at.slice(0, 10) }} , </span>
<span>at : {{ localNews[1].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{localNews[1].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${localNews[2].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${localNews[2].image.url}`" aspect-ratio="1.75">
<span v-text="localNews[2].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ localNews[2].created_at.slice(0, 10) }} , </span>
<span>at : {{ localNews[2].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{localNews[2].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${localNews[3].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${localNews[3].image.url}`" aspect-ratio="1.75">
<span v-text="localNews[3].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ localNews[3].created_at.slice(0, 10) }} , </span>
<span>at : {{ localNews[3].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{localNews[3].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${localNews[4].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${localNews[4].image.url}`" aspect-ratio="1.75">
<span v-text="localNews[4].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ localNews[4].created_at.slice(0, 10) }} , </span>
<span>at : {{ localNews[4].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{localNews[4].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
</v-col>
</v-row>
<!-- /////////////////////////////////////////////// -->
<v-row class="px-lg-14 ">
<v-col cols="12" sm="12" md="12" lg="6">
<nuxt-link :to="`/en/${nationalNews[0].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${nationalNews[0].image.url}`" aspect-ratio="1.75">
<span v-text="nationalNews[0].text_over_image" class="text_over_image"></span>
</v-img>
<v-card-title primary-title>
<p> <span>Publish on : {{ nationalNews[0].created_at.slice(0, 10) }}, </span>
<span>at : {{ nationalNews[0].created_at.slice(11, -5) }} </span></p>
<span v-text="nationalNews[0].title" class="text-lg-h4 text-sm-h5"></span>
<!-- <v-text class="text-lg-h4 text-sm-h5">{{nationalNews[0].title}}</v-text> -->
</v-card-title>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="12" md="12" lg="6">
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${nationalNews[1].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${nationalNews[1].image.url}`" aspect-ratio="1.75">
<span v-text="nationalNews[1].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ nationalNews[1].created_at.slice(0, 10) }} , </span>
<span>at : {{ nationalNews[1].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{nationalNews[1].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${nationalNews[2].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${nationalNews[2].image.url}`" aspect-ratio="1.75">
<span v-text="nationalNews[2].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ nationalNews[2].created_at.slice(0, 10) }} , </span>
<span>at : {{ nationalNews[2].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{nationalNews[2].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
<v-row>
<v-col lg="6" sm="6">
<nuxt-link :to="`/en/${nationalNews[3].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${nationalNews[3].image.url}`" aspect-ratio="1.75">
<span v-text="nationalNews[3].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ nationalNews[3].created_at.slice(0, 10) }} , </span>
<span>at : {{ nationalNews[3].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{nationalNews[3].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
<v-col sm="6" lg="6">
<nuxt-link :to="`/en/${nationalNews[4].slug}`">
<v-card>
<v-img :src="`https://api5.siliconpin.com${nationalNews[4].image.url}`" aspect-ratio="1.75">
<span v-text="nationalNews[4].text_over_image" class="text_over_image"></span>
</v-img>
<p class="pa-2"> <span>On : {{ nationalNews[4].created_at.slice(0, 10) }} , </span>
<span>at : {{ nationalNews[4].created_at.slice(11, -5) }} </span><br>
<span class="font-weight-bold">{{nationalNews[4].title}}</span></p>
</v-card>
</nuxt-link>
</v-col>
</v-row>
</v-col>
</v-row>
<!-- ////////////////////////////////////////// -->
<!-- <v-layout row wrap >
<v-flex v-for="wn in latestNews" :key="latestNews.slug" xs12 md6 lg3>
<nuxt-link :to="`/${wn.slug}`">
<v-card >
<v-img
:src="`https://api5.siliconpin.com${wn.image.url}`"
aspect-ratio="1.75"
>
<span v-text="wn.text_over_image" class="text_over_image"></span>
</v-img>
<v-card-title primary-title>
<div>
<h3 class="headline mb-0" v-text="wn.title"></h3>
</div>
</v-card-title>
</v-card>
</nuxt-link>
</v-flex>
</v-layout>-->
<v-layout row wrap>
<v-flex v-for="wn in worldNews" :key="worldNews.slug" xs6 md6 lg3>
<nuxt-link :to="`/en/${wn.slug}`">
<v-card class="mx-2 mb-2">
<v-img :src="`https://api5.siliconpin.com${wn.image.url}`" aspect-ratio="1.75">
<span v-text="wn.text_over_image" class="text_over_image"></span>
</v-img>
<div class="pa-4">
<p>On : <span >{{wn.created_at.slice(0,10)}} ,</span>
at : <span >{{wn.created_at.slice(11,-5)}} </span></p>
<div>
<h3 class="headline mb-0" v-text="wn.title"></h3>
</div>
</div>
</v-card>
</nuxt-link>
</v-flex>
</v-layout>
<v-layout row wrap>
<v-flex v-for="wn in nationalNews" :key="nationalNews.slug" xs6 md6 lg3>
<nuxt-link :to="`/en/${wn.slug}`">
<v-card class="mx-2 mt-8">
<v-img :src="`https://api5.siliconpin.com${wn.image.url}`" aspect-ratio="1.75">
<span v-text="wn.text_over_image" class="text_over_image"></span>
</v-img>
<div class="pa-4">
<p>On : <span >{{wn.created_at.slice(0,10)}} ,</span>
at : <span >{{wn.created_at.slice(11,-5)}} </span></p>
<div>
<h3 class="headline mb-0" v-text="wn.title"></h3>
</div>
</div>
</v-card>
</nuxt-link>
</v-flex>
</v-layout>
<v-layout row wrap>
<v-flex v-for="wn in localNews" :key="localNews.slug" xs6 md6 lg3>
<nuxt-link :to="`/en/${wn.slug}`">
<v-card class="mx-2 mt-8">
<v-img :src="`https://api5.siliconpin.com${wn.image.url}`" aspect-ratio="1.75">
<span v-text="wn.text_over_image" class="text_over_image"></span>
</v-img>
<div class="pa-4">
<p>On : <span >{{wn.created_at.slice(0,10)}} ,</span>
at : <span >{{wn.created_at.slice(11,-5)}} </span></p>
<div>
<h3 class="headline mb-0" v-text="wn.title"></h3>
</div>
</div>
</v-card>
</nuxt-link>
</v-flex>
</v-layout>
<v-layout row wrap>
<v-flex v-for="vn in videoNews" :key="videoNews.id" xs6 md6 lg3>
<v-card width="95%">
<lite-youtube v-bind:videoid="`${vn.content}`"
params="controls=0&start=10&end=30&modestbranding=2&rel=0&enablejsapi=1" />
<v-card-title primary-title>
<div>
<h3 class="headline mb-0" v-text="vn.title"></h3>
</div>
</v-card-title>
</v-card>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
export default {
layout: 'en',
async asyncData({ $axios, $config }) {
let worldNews = await $axios.$get(`/bartas/?category=world&lang=en&_sort=id:DESC&_limit=8`)
let nationalNews = await $axios.$get(`/bartas/?category=national&lang=en&_sort=id:DESC&_limit=8`)
let localNews = await $axios.$get(`/bartas/?category=local&lang=en&_sort=id:DESC&_limit=8`)
// let articleNews = await $axios.$get(`/bartas/?category=article&_sort=id:DESC&_limit=4`)
// let editorialNews = await $axios.$get(`/bartas/?category=editorial&_sort=id:DESC&_limit=4`)
let videoNews = await $axios.$get(`/bartas/?category=video&lang=en&_sort=id:DESC&_limit=8`)
//_ne:category=video&
// let latestNews = await $axios.$get(`/bartas/?_sort=id:DESC&_limit=40&category=:video`)
// need to create the json / var first
// if(worldNews.length < 1) { worldNews[0].image.url="", worldNews[0].slug="404", worldNews[0].slug="not found";}
// if(nationalNews.length < 1) { nationalNews[0].image.url="", nationalNews[0].slug="404", nationalNews[0].slug="not found";}
// if(localNews.length < 1) { localNews[0].image.url="", localNews[0].slug="404", localNews[0].slug="not found";}
// if(articleNews.length < 1) { articleNews[0].image.url="", articleNews[0].slug="404", articleNews[0].slug="not found";}
// if(editorialNews.length < 1) { editorialNews[0].image.url="", editorialNews[0].slug="404", editorialNews[0].slug="not found";}
// if(videoNews.length < 1) { videoNews[0].image.url="", videoNews[0].slug="404", videoNews[0].slug="not found";}
worldNews = JSON.parse(JSON.stringify(worldNews).replace(/\:null/gi, "\:\"\""));
nationalNews = JSON.parse(JSON.stringify(nationalNews).replace(/\:null/gi, "\:\"\""));
localNews = JSON.parse(JSON.stringify(localNews).replace(/\:null/gi, "\:\"\""));
// articleNews = JSON.parse(JSON.stringify(articleNews).replace(/\:null/gi, "\:\"\""));
// editorialNews = JSON.parse(JSON.stringify(editorialNews).replace(/\:null/gi, "\:\"\""));
videoNews = JSON.parse(JSON.stringify(videoNews).replace(/\:null/gi, "\:\"\""));
// latestNews = JSON.parse(JSON.stringify(latestNews).replace(/\:null/gi, "\:\"\""));
return { worldNews, nationalNews, localNews, videoNews }
},
head() {
return {
title: "barta-india.in news with views",
meta: [
// hid is used as unique identifier. Do not use `vmid` for it as it will not work
{
hid: 'description',
name: 'description',
content: "local news, national and international news with our views."
},
{
hid: 'og:description',
name: 'og:description',
content: "local news, national and international news with our views."
},
{
hid: 'og:title',
name: 'og:title',
content: "barta-india.in news with views"
},
{
hid: 'og:url',
name: 'og:url',
content: 'https://barta-india.in/'
},
{
hid: 'og:image',
name: 'og:image',
content: 'https://barta-india.in/icon.png'
},
{
hid: 'og:image:secure_url',
name: 'og:image:secure_url',
content: 'https://barta-india.in/icon.png'
},
{
hid: 'og:type',
name: 'og:type',
content: 'News list'
}
]
}
}
}
</script>
<style scoped>
</style>