Compare commits
10 Commits
54f191d593
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
80cbacaf6a | ||
| 452f99b8e7 | |||
| 81630f7cb3 | |||
| 5ef641a0d6 | |||
| 1112ddb491 | |||
| 86d6e41d49 | |||
| eb77cd5e0a | |||
| 17f541482b | |||
| bf18b0a5f8 | |||
| 195b7b37f6 |
3
components.d.ts
vendored
3
components.d.ts
vendored
@@ -9,7 +9,10 @@ declare module '@vue/runtime-core' {
|
||||
export interface GlobalComponents {
|
||||
Footer: typeof import('./src/components/Footer.vue')['default']
|
||||
Header: typeof import('./src/components/Header.vue')['default']
|
||||
Header2: typeof import('./src/components/Header2.vue')['default']
|
||||
MainMenu: typeof import('./src/components/MainMenu.vue')['default']
|
||||
Menu: typeof import('./src/components/Menu.vue')['default']
|
||||
Nav: typeof import('./src/components/Nav.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
RouterView: typeof import('vue-router')['RouterView']
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" type="image/png" href="/img/favicon.ico"/>
|
||||
<title>Sreechaitanya College, Habra</title>
|
||||
<!-- <link
|
||||
rel="preload"
|
||||
|
||||
2
info.txt
Normal file
2
info.txt
Normal file
@@ -0,0 +1,2 @@
|
||||
1. https://sreechaitanyacollege.in/students-feedback
|
||||
2. Login
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "vite-vue3-tailwind-starter",
|
||||
"version": "0.0.0",
|
||||
"name": "scc-22",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"dev": "vite --host --port 2004",
|
||||
"build": "vue-tsc --noEmit && vite build",
|
||||
|
||||
8
public/.htaccess
Normal file
8
public/.htaccess
Normal file
@@ -0,0 +1,8 @@
|
||||
RewriteEngine On
|
||||
#RewriteCond %{HTTPS} !=on
|
||||
#RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301,NE]
|
||||
RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
|
||||
RewriteRule ^(.*)$ https://%1/$1 [R=301,L]
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_FILENAME} !-d
|
||||
RewriteRule ^(.*) /
|
||||
BIN
public/favicon.ico
Normal file → Executable file
BIN
public/favicon.ico
Normal file → Executable file
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
BIN
public/img/favicon.ico
Executable file
BIN
public/img/favicon.ico
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="flex flex-col h-screen justify-between">
|
||||
<Header />
|
||||
<Menu />
|
||||
<main>
|
||||
<router-view />
|
||||
</main>
|
||||
|
||||
@@ -7,21 +7,17 @@
|
||||
</div>
|
||||
<div
|
||||
class="hidden lg:block flex flex-cols bg-blue-600 h-48 text-right justify-end text-white text-3xl pt-5 font-semibold pr-12">
|
||||
<img
|
||||
src="/img/logo3.png"
|
||||
alt="/img/logo3.png"
|
||||
class="absolute left-0 top-0 h-44 w-44 mt-2 ml-14"
|
||||
<img src="/img/logo3.png" alt="/img/logo3.png" class="absolute left-0 top-0 h-44 w-44 mt-2 ml-14"
|
||||
/>
|
||||
Estd.-1956
|
||||
<br />Sree Chaitanya College,Habra
|
||||
<br />(Arts and Science)
|
||||
<br />Prafullanagar, Habra, 24Pgs(N) Pin-743268, W.B
|
||||
</div>
|
||||
<MainMenu />
|
||||
<Menu />
|
||||
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
</script>
|
||||
lg:hidden
|
||||
@@ -392,6 +392,16 @@
|
||||
>NAAC</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/nirf-data"
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>NIRF </router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/aqar"
|
||||
@@ -402,19 +412,7 @@
|
||||
>AQAR</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<!-- <MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/icc"
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>ICC</router-link
|
||||
>
|
||||
</MenuItem> -->
|
||||
<!-- <MenuItem v-slot="{ active }">
|
||||
<router-link to="/Teacher's-Council":class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'block px-1 py-2 text-sm']">Teacher's Council</router-link>
|
||||
</MenuItem> -->
|
||||
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/students-union"
|
||||
@@ -447,12 +445,12 @@
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/activity-gallery"
|
||||
to=""
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>Activity Gallery</router-link
|
||||
></router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
@@ -699,6 +697,12 @@
|
||||
</Menu>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="w-full h-8 bg-blue-700 fixed bottom-0" id="hidden_large">
|
||||
<div>
|
||||
<p></p>
|
||||
@@ -720,7 +724,15 @@
|
||||
>
|
||||
<input class="hidden" type="checkbox" id="mobile_mnu" />
|
||||
<div class="mobile_menu bg-cyan-200 transition duration-150">
|
||||
<!-- mobile_menu_item -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="bg-white">
|
||||
<div class="text-center">
|
||||
<button class="text-sm font-medium py-2 px-4 rounded">
|
||||
@@ -1037,9 +1049,36 @@
|
||||
>IQAC</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<!-- <MenuItem v-slot="{ active }">
|
||||
<router-link to="/Teacher's-Council":class="[active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', 'block px-1 py-2 text-sm']">Teacher's Council</router-link>
|
||||
</MenuItem> -->
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/naac"
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>NAAC</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/nirf-data"
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>NIRF</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/aqar"
|
||||
:class="[
|
||||
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
|
||||
'block px-1 py-2 text-sm',
|
||||
]"
|
||||
>AQAR</router-link
|
||||
>
|
||||
</MenuItem>
|
||||
<MenuItem v-slot="{ active }">
|
||||
<router-link
|
||||
to="/students-union"
|
||||
|
||||
79
src/components/Menu.vue
Normal file
79
src/components/Menu.vue
Normal file
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div>
|
||||
<header class="header">
|
||||
<div class="lg:hidden grid grid-cols-6 bg-blue-700 place-items-center text-white">
|
||||
<div class="grid col-span-1 "> <img class="w-16" src="/img/logo3.png" alt=""></div>
|
||||
<div class="grid col-span-4 ">SREE CHAITANYA COLLEGE</div>
|
||||
<div class="grid col-span-1 "><button class="hover:bg-white hover:text-blue-700 rounded-md p-1">Log In</button></div>
|
||||
</div>
|
||||
<div
|
||||
class="hidden lg:block flex flex-cols bg-blue-600 h-48 text-right justify-end text-white text-3xl pt-5 font-semibold pr-12">
|
||||
<img src="/img/logo3.png" alt="Sreechaitanya College " class="absolute left-0 top-0 h-44 w-44 mt-2 ml-14"
|
||||
/>
|
||||
Estd.-1956
|
||||
<br />Sree Chaitanya College,Habra
|
||||
<br />(Arts and Science)
|
||||
<br />Prafullanagar, Habra, 24Pgs(N) Pin-743268, W.B
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<Nav />
|
||||
</div>
|
||||
|
||||
<!-- <div id="navbar">
|
||||
<a class="active" href="#">Home</a>
|
||||
<a href="#">News</a>
|
||||
<a href="#">Contact</a>
|
||||
</div> -->
|
||||
<!--
|
||||
<div class="content">
|
||||
<h3>Sticky Navigation Example</h3>
|
||||
<p>The navbar will stick to the top when you reach its scroll position.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
<p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.</p>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
mounted () {
|
||||
window.addEventListener('scroll', this.stickyMenu);
|
||||
},
|
||||
// created () {
|
||||
// window.addEventListener('scroll', this.stickyMenu);
|
||||
// },
|
||||
unmounted () {
|
||||
window.removeEventListener('scroll', this.stickyMenu);
|
||||
},
|
||||
methods: {
|
||||
stickyMenu (event) {
|
||||
|
||||
var navbar = document.getElementById("navbar");
|
||||
var sticky = navbar.offsetTop;
|
||||
if (window.pageYOffset >= sticky) {
|
||||
navbar.classList.add("sticky")
|
||||
console.log(window.pageYOffset)
|
||||
} else {
|
||||
navbar.classList.remove("sticky");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// window.onscroll = function() {myFunction()};
|
||||
|
||||
// var navbar = document.getElementById("navbar");
|
||||
// var sticky = navbar.offsetTop;
|
||||
|
||||
// function myFunction() {
|
||||
// if (window.pageYOffset >= sticky) {
|
||||
// navbar.classList.add("sticky")
|
||||
// } else {
|
||||
// navbar.classList.remove("sticky");
|
||||
// }
|
||||
// }
|
||||
</script>
|
||||
98
src/components/Nav.vue
Normal file
98
src/components/Nav.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div class="hidden md:flex container-fluid" id="navbar" >
|
||||
<div class="container mx-auto px-4" >
|
||||
<a class="active" href="/">Home</a>
|
||||
<a class="active" href="/about-us">About</a>
|
||||
<a class="active" href="/notice">Notice</a>
|
||||
<a class="active" href="/library">Library</a>
|
||||
<a class="active" href="/administration">Administration</a>
|
||||
<a class="active" href="/academics">Academics</a>
|
||||
<a class="active" href="/organizations">Organizations</a>
|
||||
<a class="active" href="/students">Students</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
// created () {
|
||||
// window.addEventListener('scroll', this.stickyMenu);
|
||||
// },
|
||||
// unmounted () {
|
||||
// window.removeEventListener('scroll', this.stickyMenu);
|
||||
// },
|
||||
// methods: {
|
||||
// stickyMenu (event) {
|
||||
// var navbar = document.getElementById("navbar");
|
||||
// var sticky = navbar.offsetTop;
|
||||
// if (window.pageYOffset >= sticky) {
|
||||
// navbar.classList.add("sticky")
|
||||
// } else {
|
||||
// navbar.classList.remove("sticky");
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
// window.onscroll = function() {myFunction()};
|
||||
|
||||
// var navbar = document.getElementById("navbar");
|
||||
// var sticky = navbar.offsetTop;
|
||||
|
||||
// function myFunction() {
|
||||
// if (window.pageYOffset >= sticky) {
|
||||
// navbar.classList.add("sticky")
|
||||
// } else {
|
||||
// navbar.classList.remove("sticky");
|
||||
// }
|
||||
// }
|
||||
</script>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
.header {
|
||||
background-color: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#navbar {
|
||||
overflow: hidden;
|
||||
background-color: #1d4ed8;
|
||||
}
|
||||
|
||||
#navbar a {
|
||||
float: left;
|
||||
display: block;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
padding: 14px 16px;
|
||||
text-decoration: none;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#navbar a:hover {
|
||||
background-color: #1e40af;
|
||||
color: rgb(255, 255, 255);
|
||||
}
|
||||
|
||||
/* #navbar a.active {
|
||||
background-color: #1e40af;
|
||||
color: white;
|
||||
} */
|
||||
|
||||
.content {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.sticky {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sticky + .content {
|
||||
padding-top: 60px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,33 +1,89 @@
|
||||
<template>
|
||||
<div class="container-fluid bg-white mx-auto mt-3 p-0">
|
||||
<div v-if="isLoading">
|
||||
<h2 class="ml-28 text-4xl">Loading ...</h2>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-html="page[0].content" class="container mx-auto">
|
||||
<div class="container bg-white mx-auto mt-3 p-4">
|
||||
<div v-if="isLoading">
|
||||
<h2>Loading ...</h2>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- <h2>{{page[0].title}}</h2> -->
|
||||
<div v-html="page[0].content" ></div>
|
||||
<div v-if="fileAttached">
|
||||
<h2>Attachments.</h2>
|
||||
<ul>
|
||||
<li v-for="(file, index) in files">
|
||||
{{index+1}}.
|
||||
<a class="text-blue-600" :href="`https://api8.siliconpin.com/assets/` + file.id+'?download' " :download="file.filename_download">
|
||||
{{ file.filename_download }}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
page: null,
|
||||
fileAttached:false,
|
||||
files: [],
|
||||
isLoading: true
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
fetch('https://api8.siliconpin.com/items/scc22?filter[slug][_eq]=' + this.$route.params.id)
|
||||
// fetch('https://api8.siliconpin.com/items/scc22?slug=about-us')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
this.page = data.data
|
||||
console.log(data)
|
||||
this.isLoading = false
|
||||
})
|
||||
.then((response) => {
|
||||
if (response.ok) {
|
||||
return response.json();
|
||||
}
|
||||
throw new Error('Something went wrong');
|
||||
})
|
||||
.then(jsonPageData => {
|
||||
this.page = jsonPageData.data
|
||||
console.log(this.page)
|
||||
this.isLoading = false
|
||||
return jsonPageData.data[0].id
|
||||
}
|
||||
)
|
||||
.then((pageID) => {
|
||||
fetch('https://api8.siliconpin.com/items/scc22_files_1?filter[scc22_id][_in]=' + pageID)
|
||||
.then(resp => resp.json())
|
||||
.then(file => {
|
||||
let attIDs = ''
|
||||
let t = 0
|
||||
file.data.forEach(ids => {
|
||||
if (t == 0) attIDs = ids.directus_files_id
|
||||
else attIDs = attIDs + ',' + ids.directus_files_id
|
||||
t++
|
||||
});
|
||||
if(t>0) this.fileAttached=true
|
||||
return attIDs
|
||||
})
|
||||
.then((attIDs) => {
|
||||
fetch('https://api8.siliconpin.com/files?filter[id][_in]=' + attIDs)
|
||||
.then(resp => resp.json())
|
||||
.then(file => {
|
||||
this.files = file.data
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// getAttachments(att) {
|
||||
|
||||
// console.log(att)
|
||||
// // fetch('https://api8.siliconpin.com/items/ecom55?filter[slug][_eq]=' + this.$route.params.id)
|
||||
// // .then(response => response.json())
|
||||
// // .then(data => this.itemByCategory = data)
|
||||
// // console.log(this.itemByCategory)
|
||||
|
||||
// }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
@@ -5,224 +5,224 @@
|
||||
class="grid place-items-center bg-blue-700 w-48 text-4xl font-bold text-white rounded-full p-1 md:mt-8 absolute md:inset-x-2/4 top-56 md:-ml-28 -mt-40 inset-x-2/4 top-72 -ml-28 gap-4">
|
||||
Gallery</div>
|
||||
<section class="overflow-hidden text-gray-700 mt-32">
|
||||
<div class="container px-5 py-2 mx-auto lg:pt-12 lg:px-32">
|
||||
<div class="container px-5 py-2 mx-auto lg:pt-12 lg:px-32 ">
|
||||
<div class="flex flex-wrap -m-1 md:-m-2">
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/1.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/2.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/3.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/4.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/5.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/6.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/7.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/8.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/9.jpg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/11.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/12.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/13.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/14.jpg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/15.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/16.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/17.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/18.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/19.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/20.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/21.jpeg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/22.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/23.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/24.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/25.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/26.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/27.jpg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/28.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/29.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/30.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/31.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/32.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/32.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/33.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/34.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/35.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap w-1/3">
|
||||
<div class="w-full p-1 md:p-2">
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg"
|
||||
<img alt="gallery" class="block object-cover object-center w-full h-full rounded-lg transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-150"
|
||||
src="/img/36.jpg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
54
src/pages/nn/[id].vue
Normal file
54
src/pages/nn/[id].vue
Normal file
@@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<div class="container-fluid bg-white mx-auto mt-3 p-0">
|
||||
<div v-if="isLoading">
|
||||
<h2 class="ml-28 text-4xl"> Page Loading ...</h2>
|
||||
</div>
|
||||
<div v-else>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2">
|
||||
<div class="grid p-6"><h2 class="text-2xl font-semibold"> {{page[0].name}}</h2>
|
||||
<h2 class="text-blue-700">By. {{page[0].author}}</h2>
|
||||
<h2 class="text-2xl font-semibold">Price. {{page[0].Price}}</h2>
|
||||
<img :src="'https://api8.siliconpin.com/assets/'+page[0].img" alt="">
|
||||
<h2 class="text-red-900 font-bold text-xl mt-8">Book Details</h2>
|
||||
<div class="text-justify text-center " v-html="page[0].details"></div>
|
||||
<h2 class="text-xl font-semibold text-blue-700">Publishing Year {{page[0].Publishing_Year}}</h2>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
</div></div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
page: null,
|
||||
isLoading: true
|
||||
|
||||
}
|
||||
},
|
||||
mounted: function (){
|
||||
fetch('https://api8.siliconpin.com/items/books?filter[slug][_in]='+this.$route.params.id)
|
||||
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
this.page = data.data
|
||||
this.isLoading = false
|
||||
console.log(this.page.Publishingyear)
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
38
src/pages/nn/index.vue
Normal file
38
src/pages/nn/index.vue
Normal file
@@ -0,0 +1,38 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-if="isLoading">
|
||||
<h2 class="text-center text-4xl text-pink-600 font-extrabold">Loading......</h2></div>
|
||||
<div v-else>
|
||||
<div class="container mx-auto text-blue-800 " v-for="(item, index) in page">
|
||||
<router-link :to="'/nn/'+item.slug"><h3>{{item.name}} </h3></router-link>
|
||||
|
||||
|
||||
|
||||
|
||||
</div></div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
page: null,
|
||||
isLoading: true
|
||||
}
|
||||
},
|
||||
mounted: function (){
|
||||
fetch('https://api8.siliconpin.com/items/books?')
|
||||
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
this.page = data.data
|
||||
this.isLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,23 +1,22 @@
|
||||
<template>
|
||||
<div class="container-fluid bg-white mx-auto mt-3 p-0">
|
||||
<div class="container bg-white mx-auto mt-3 p-4">
|
||||
<div v-if="isLoading">
|
||||
<h2>Loading ...</h2>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-html="page[0].content" class="container mx-auto">
|
||||
|
||||
|
||||
</div>
|
||||
<h2>{{page[0].title}}</h2>
|
||||
<div v-html="page[0].content" ></div>
|
||||
<div v-if="fileAttached">
|
||||
<h2>Attachments</h2>
|
||||
<div v-for="(file, index) in files">
|
||||
<h2>Attachments.</h2>
|
||||
<ul>
|
||||
<li v-for="(file, index) in files">
|
||||
{{index+1}}.
|
||||
<a class="text-blue-600" :href="`https://api8.siliconpin.com/assets/` + file.id+'?download' " :download="file.filename_download">
|
||||
{{ file.filename_download }}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
{{index+1}}
|
||||
<a target="_blank" :href="`https://api8.siliconpin.com/assets/` + file.id+'?download' " :download="file.filename_download">
|
||||
<h3> {{ file.filename_download }}</h3>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,6 +43,7 @@ export default {
|
||||
})
|
||||
.then(jsonPageData => {
|
||||
this.page = jsonPageData.data
|
||||
console.log(this.page)
|
||||
this.isLoading = false
|
||||
return jsonPageData.data[0].id
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="container bg-white mx-auto mt-3 p-0 text-blue-700 leading-loose">
|
||||
<div class="container bg-white mx-auto mt-3 p-4 text-blue-700 leading-loose">
|
||||
<div v-if="isLoading">
|
||||
<h2>Loading ...</h2>
|
||||
</div>
|
||||
@@ -31,7 +31,7 @@
|
||||
// fetch('https://api8.siliconpin.com/items/scc22?slug=about-us')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
this.page = data.data
|
||||
this.page = data.data.reverse()
|
||||
// console.log(data)
|
||||
this.isLoading = false
|
||||
})
|
||||
|
||||
2
typed-router.d.ts
vendored
2
typed-router.d.ts
vendored
@@ -44,6 +44,8 @@ declare module 'vue-router/auto/routes' {
|
||||
'/documents/[id]': RouteRecordInfo<'/documents/[id]', '/documents/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
|
||||
'/gallery': RouteRecordInfo<'/gallery', '/gallery', Record<never, never>, Record<never, never>>,
|
||||
'/index2': RouteRecordInfo<'/index2', '/index2', Record<never, never>, Record<never, never>>,
|
||||
'/nn/': RouteRecordInfo<'/nn/', '/nn', Record<never, never>, Record<never, never>>,
|
||||
'/nn/[id]': RouteRecordInfo<'/nn/[id]', '/nn/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
|
||||
'/notice/': RouteRecordInfo<'/notice/', '/notice', Record<never, never>, Record<never, never>>,
|
||||
'/notice/[id]': RouteRecordInfo<'/notice/[id]', '/notice/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
|
||||
'/temp/google': RouteRecordInfo<'/temp/google', '/temp/google', Record<never, never>, Record<never, never>>,
|
||||
|
||||
Reference in New Issue
Block a user