Commit 03ee765f authored by jakkree kongpha's avatar jakkree kongpha

last change

parent 5c254a27
......@@ -15,11 +15,11 @@ mongoose.connection.on('error', () => {
const animes = [
{ sid: 60112233440, first: 'ชูใจ', last: 'เลิศล้ำ', info: 'เป็นเพื่อนสนิทของมานี เลี้ยงแมวไว้ตัวหนึ่งชื่อ สีเทา เธอพักอยู่กับย่าและอาตั้งแต่ยังเล็ก โดยไม่ทราบว่าใครเป็นพ่อแม่ ซึ่งความจริงก็คือ พ่อเสียชีวิตตั้งแต่เธอมีอายุเพียง 1 ขวบ ส่วนแม่อาศัยอยู่ในต่างประเทศ และต่อมาก็เดินทางกลับมา ตั้งใจจะรับลูกสาวกลับไปอยู่ด้วยกัน แต่เธอเลือกจะอยู่กับย่าต่อไป' },
{ sid: 60112233441, first: 'มานี', last: 'รักเผ่าไทย', info: 'น้องสาวของมานะ เลี้ยงนกแก้วไว้ตัวหนึ่ง เมื่อขึ้นชั้นประถมศึกษาปีที่ 6 เพื่อนๆ เลือกตั้งให้เธอเป็นรองประธานนักเรียน' },
{ sid: 60112233442, first: 'ปิติ', last: 'พิทักษ์ถิ่น', info: 'เลี้ยงม้าไว้ตัวหนึ่งชื่อ เจ้าแก่ แต่ภายหลังก็ตายไปตามวัย ทำให้ปิติเสียใจมาก ต่อมาเขาถูกรางวัลสลากออมสิน เป็นเงิน 10,000 บาท จึงนำไปซื้อลูกม้าตัวใหม่ เพื่อทดแทนเจ้าแก่ และตั้งชื่อให้ว่า เจ้านิล' },
{ sid: 60112233443, first: 'มานะ', last: 'รักเผ่าไทย', info: 'พี่ชายของมานี เลี้ยงสุนัขไว้ตัวหนึ่งชื่อ เจ้าโต เขาขยันตั้งใจเรียน จึงมีผลการเรียนดี จึงเป็นนักเรียนคนเดียวของโรงเรียน ที่สามารถเข้าศึกษาต่อระดับมัธยมศึกษาในกรุงเทพมหานคร เมื่อจบการศึกษาชั้นประถมปีที่ 6' },
{ sid: 60112233444, first: 'วีระ', last: 'ประสงค์สุข', info: 'มีพ่อเป็นทหาร แต่เสียชีวิตในระหว่างรบ ตั้งแต่วีระยังอยู่ในท้อง ส่วนแม่ตรอมใจ เสียชีวิตหลังจากคลอดวีระได้ 15 วัน ทำให้เขาต้องอยู่กับลุงตั้งแต่เกิด และเลี้ยงลิงแสมไว้ตัวหนึ่งชื่อ เจ้าจ๋อ' }
{ animename: "dragoball", animetype: 'Fighting', animedetail: 'เลิศล้ำ' ,animeimage: src="" },
{ animename: "one piece", animetype: 'Fighting', animedetail: 'เลิศล้ำ' },
{ animename: "naruto", animetype: 'Fighting', animedetail: 'เลิศล้ำ' },
{ animename: "fairy tail", animetype: 'Magic', animedetail: 'เลิศล้ำ' },
{ animename: "Log Horizon", animetype: 'Magic', animedetail: 'เลิศล้ำ' },
];
Anime.insertMany(animes, (error, docs) => {
......
......@@ -2,9 +2,10 @@ const Joi = require('joi');
const Anime = require('../models/anime.model');
const animeSchema = Joi.object({
sid: Joi.number().integer().required(),
first: Joi.string().required(),
last: Joi.string().required()
animename: Joi.number().integer().required(),
animetype: Joi.string().required(),
animedetail: Joi.string().required(),
//animeimage:Joi.string().required()
})
......
......@@ -5,11 +5,11 @@ const mongoose = require('mongoose');
*/
const AnimeSchema = new mongoose.Schema(
{
sid: { type: String, required: true },
first: { type: String, required: true },
last: { type: String, required: true },
info: { type: String, required: true },
createdAt: { type: Date, default: Date.now },
animename: { type: String, required: true },
animetype: { type: String, required: true },
animedetail: { type: String, required: true },
//animeimage: { type: File, required: true },
createdAt: { type: Date, default: Date.now },
},
{
versionKey: false
......
......@@ -16,21 +16,22 @@
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="animename" ngModel class="form-control input-sm" placeholder="Anime Name">
<input type="text" name="animename" class="form-control input-sm" placeholder="Anime Name">
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="animetype" ngModel class="form-control input-sm" placeholder="Type Name">
<input type="text" name="animetype" class="form-control input-sm" placeholder="Type Name">
</div>
</div>
</div>
<div class="form-group">
<input type="text" name="animedetail" ngModel class="form-control input-sm" placeholder="Anime Detail">
<input type="text" name="animedetail" class="form-control input-sm" placeholder="Anime Detail">
</div>
<button type="submit" >Add Anime</button>
<button (click)="insert()" >Add Anime</button>
You have successsfully posted {{result}}
</form>
</div>
......
import { Component, OnInit } from '@angular/core';
import { AnimeService} from '../shared/services/anime.service'
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-addanime',
......@@ -7,9 +10,27 @@ import { Component, OnInit } from '@angular/core';
})
export class AddanimeComponent implements OnInit {
constructor() { }
name: string | undefined;
result: string | undefined;
constructor(private animeService: AnimeService ,private http: HttpClient ) { }
ngOnInit(): void {
throw new Error('Method not implemented.');
}
insert() {
let url = "http://localhost:4040/api/anime/add"
this.http.post(url, {
name:this.name
}).toPromise().then((data: any) => {
console.log(data)
console.log(JSON.stringify(data.json.name))
this.result = JSON.stringify(data.json.name)
})
}
}
<!DOCTYPE html>
<html>
<head>
<style>
.center {
margin-left: auto;
margin-right: auto;
}
.centered-form{
text-align: center;
}
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 80%;
}
td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
</head>
<body>
<h2 class="centered-form">Anime Manage</h2>
<table class="center">
<tr >
<th>Animename </th>
<th>Animetype</th>
<th>Animedetail</th>
<th>update</th>
<th>delete</th>
</tr>
<tr *ngFor="let s of animes">
<td>{{ s.animename }}</td>
<td>{{ s.animetype }}</td>
<td>{{ s.animedetail }}</td>
<td> <button>Update</button> </td>
<td> <button>Delete</button> </td>
</tr>
</table>
</body>
</html>
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { HeroComponent } from './hero.component';
import { AnimeManageComponent } from './anime-manage.component';
describe('HeroComponent', () => {
let component: HeroComponent;
let fixture: ComponentFixture<HeroComponent>;
describe('AnimeManageComponent', () => {
let component: AnimeManageComponent;
let fixture: ComponentFixture<AnimeManageComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ HeroComponent ]
declarations: [ AnimeManageComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(HeroComponent);
fixture = TestBed.createComponent(AnimeManageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
......
import { Component, OnInit } from '@angular/core';
import { AnimeService} from '../shared/services/anime.service'
@Component({
selector: 'app-anime-manage',
templateUrl: './anime-manage.component.html',
styleUrls: ['./anime-manage.component.css']
})
export class AnimeManageComponent implements OnInit {
animes: any[] = [];
constructor(private animeService: AnimeService) { }
ngOnInit(): void {
this.animeService.getAll().subscribe( (resp: any) => {
this.animes = resp;
});
}
}
......@@ -3,20 +3,17 @@
<div>{{ students | json }}</div>
-->
<mat-grid-list cols="3" rowHeight="720px" gutterSize="10px">
<mat-grid-tile *ngFor="let s of students">
<mat-grid-tile *ngFor="let s of animes">
<mat-card>
<mat-card-header>
<div mat-card-avatar class="student-header-image"></div>
<mat-card-title>{{ s.first }} {{ s.last }}</mat-card-title>
<mat-card-subtitle>{{ s.sid }}</mat-card-subtitle>
<mat-card-title>{{ s.animename }} {{ s.animetype }}</mat-card-title>
</mat-card-header>
<img mat-card-image src="https://picsum.photos/id/{{ s.sid%1000 }}/750/600" alt="Photo of a {{ s.name }}">
<img mat-card-image src="../image/dragonball.jpg" >
<mat-card-content>
<p> {{ s.info }} </p>
<p> {{ s.animedetail }} </p>
</mat-card-content>
<mat-card-actions>
<button mat-button>LIKE</button>
<button mat-button>SHARE</button>
</mat-card-actions>
</mat-card>
</mat-grid-tile>
......
......@@ -8,13 +8,13 @@ import { AnimeService} from '../shared/services/anime.service'
})
export class AnimelistComponent implements OnInit {
students: any[] = [];
animes: any[] = [];
constructor(private animeService: AnimeService) { }
ngOnInit(): void {
this.animeService.getAll().subscribe( (resp: any) => {
this.students = resp;
this.animes = resp;
});
}
......
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { AuthGuard } from './shared/guards';
import { HomeComponent } from './home/home.component';
import { HeroComponent } from './hero/hero.component';
import { AddanimeComponent } from './addanime/addanime.component';
import { AnimelistComponent } from './animelist/animelist.component';
import { AnimeManageComponent } from './anime-manage/anime-manage.component';
const routes: Routes = [
{
path: '',
component: HomeComponent,
//canActivate: [AuthGuard],
},
{
path: 'hero',
component: HeroComponent,
path: 'animemanage',
component: AnimeManageComponent,
},
{
path: 'animelist',
......
......@@ -12,10 +12,10 @@ import { AppRoutingModule } from './app-routing.module';
import { HeaderComponent } from './header/header.component';
import { HomeComponent } from './home/home.component';
import { AuthService } from './shared/services';
import { HeroComponent } from './hero/hero.component';
import { AddanimeComponent } from './addanime/addanime.component';
import { FormsModule } from '@angular/forms';
import { AnimelistComponent } from './animelist/animelist.component';
import { AnimeManageComponent } from './anime-manage/anime-manage.component';
export function appInitializerFactory(authService: AuthService) {
return () => authService.checkTheUserOnTheFirstLoad();
......@@ -23,7 +23,7 @@ export function appInitializerFactory(authService: AuthService) {
@NgModule({
imports: [BrowserAnimationsModule, HttpClientModule, SharedModule, AppRoutingModule, FormsModule],
declarations: [AppComponent, HeaderComponent, HomeComponent, HeroComponent, AddanimeComponent, AnimelistComponent],
declarations: [AppComponent, HeaderComponent, HomeComponent, AddanimeComponent, AnimelistComponent, AnimeManageComponent],
providers: [
{
provide: HTTP_INTERCEPTORS,
......
......@@ -6,6 +6,7 @@
<div>
<a class="links side" *ngIf="user" routerLink="/animelist">animeList</a>
<a class="links side" *ngIf="user" routerLink="/addanime">addAnime</a>
<a class="links side" *ngIf="user" routerLink="/animemanage">animeManage</a>
<a class="links side" *ngIf="user" [matMenuTriggerFor]="menu">
<mat-icon>account_circle</mat-icon>{{ user.fullname }}
</a>
......
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-hero',
templateUrl: './hero.component.html',
styleUrls: ['./hero.component.css']
})
export class HeroComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}
<p>
home works!
</p>
<!DOCTYPE html>
<html>
<head>
<title>Welcome Anime-sai-kou</title>
</head>
<body>
<h1 class="centered-form">Welcome to Anime-sai-kou</h1>
<h2 class="centered-form">This web for people like anime:</h2>
<h3 class="centered-form">Wehave animelist for you</h3>
<h3 class="centered-form">Fighting anime, Magic anime, Drama anime, Fantasy anime</h3>
</body>
</html>
.centered-form{
text-align: center;
}
export interface Anime {
_id: string;
fullname: string;
createdAt: string;
roles: string[];
isAdmin: boolean;
}
......@@ -8,6 +8,7 @@ import { HttpClient } from '@angular/common/http';
providedIn: 'root'
})
export class AnimeService {
animeId: any;
constructor(private http: HttpClient) { }
......@@ -15,3 +16,6 @@ export class AnimeService {
return this.http.get('api/anime/all');
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment