Skip to content

T
Topic1
Commit 7e556151 authored by Weerachai's avatar Weerachai
Browse files
Options

first commit

parent 534300ac
Hide whitespace changes
Inline Side-by-side
Showing with 93 additions and 38 deletions
src/app/app.component.html
View file @ 7e556151
<!-- CSS only -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<!-- JS, Popper.js, and jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<style> <style>
:host { :host {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
...@@ -308,49 +315,96 @@ ...@@ -308,49 +315,96 @@
<div class="content" role="main"> <div class="content" role="main">
<!-- Highlight Card --> <span>Student</span>
<div class="card highlight-card card-small"> <table class="table table-hover">
<thead>
<svg id="rocket" alt="Rocket Ship" xmlns="http://www.w3.org/2000/svg" width="101.678" height="101.678" viewBox="0 0 101.678 101.678"> <tr>
<g id="Group_83" data-name="Group 83" transform="translate(-141 -696)"> <th scope="col">id</th>
<circle id="Ellipse_8" data-name="Ellipse 8" cx="50.839" cy="50.839" r="50.839" transform="translate(141 696)" fill="#dd0031"/> <th scope="col">name</th>
<g id="Group_47" data-name="Group 47" transform="translate(165.185 720.185)"> <th scope="col">email</th>
<path id="Path_33" data-name="Path 33" d="M3.4,42.615a3.084,3.084,0,0,0,3.553,3.553,21.419,21.419,0,0,0,12.215-6.107L9.511,30.4A21.419,21.419,0,0,0,3.4,42.615Z" transform="translate(0.371 3.363)" fill="#fff"/> </tr>
<path id="Path_34" data-name="Path 34" d="M53.3,3.221A3.09,3.09,0,0,0,50.081,0,48.227,48.227,0,0,0,18.322,13.437c-6-1.666-14.991-1.221-18.322,7.218A33.892,33.892,0,0,1,9.439,25.1l-.333.666a3.013,3.013,0,0,0,.555,3.553L23.985,43.641a2.9,2.9,0,0,0,3.553.555l.666-.333A33.892,33.892,0,0,1,32.647,53.3c8.55-3.664,8.884-12.326,7.218-18.322A48.227,48.227,0,0,0,53.3,3.221ZM34.424,9.772a6.439,6.439,0,1,1,9.106,9.106,6.368,6.368,0,0,1-9.106,0A6.467,6.467,0,0,1,34.424,9.772Z" transform="translate(0 0.005)" fill="#fff"/> </thead>
</g> <tbody>
</g> <tr *ngFor="let s of students">
</svg> <td>{{ s.id }}</td>
<td>{{ s.name }}</td>
<span>{{ title }} app is running!</span> <td>@{{ s.email }}</td>
</tr>
</div> </tbody>
<div> </table><br>
</div>
<div *ngFor="let s of students" class="card">
<div class="card hilight-card card-small">
<span>{{ s.id }}</span>
{{ s.name }} {{ s.email }}
</div>
</div>
<span>Course</span> <span>Course</span>
<div *ngFor="let c of courses" class="card"> <table class="table table-hover">
{{ c.title }} {{ c.description }} <thead>
</div> <tr>
<th scope="col">title</th>
<th scope="col">description</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let c of courses" >
<td>{{ c.title }}</td>
<td>{{ c.description }}</td>
</tr>
</tbody>
</table><br>
<span>Lecturer</span> <span>Lecturer</span>
<div *ngFor="let l of lecturers" class="card"> <table class="table table-hover">
{{ l.id }} {{ l.name }} <thead>
</div> <tr>
<th scope="col">id</th>
<span>Score</span> <th scope="col">name</th>
<div *ngFor="let sc of scores" class="card">
<span>{{ sc.Student.id }}{{ sc.Student.name }}</span> </tr>
score: {{ sc.score }} {{ sc.full_mark }} </thead>
<tbody>
</div> <tr *ngFor="let l of lecturers">
<td>{{ l.id }}</td>
<td>{{ l.name }}</td>
</tr>
</tbody>
</table><br>
<span>Lecturer</span>
<table class="table table-hover">
<thead>
<tr>
<th scope="col">id</th>
<th scope="col">name</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let l of lecturers">
<td>{{ l.id }}</td>
<td>{{ l.name }}</td>
</tr>
</tbody>
</table><br>
<table class="table table-hover">
<thead>
<tr>
<th scope="col">Student ID</th>
<th scope="col">Student name</th>
<th scope="col">score</th>
<th scope="col">full_mark</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let sc of scores">
<td>{{ sc.Student.id }}</td>
<td>{{ sc.Student.name }}</td>
<td>{{ sc.score }}</td>
<td>{{ sc.full_mark }}</td>
</tr>
</tbody>
</table>
<router-outlet></router-outlet> <router-outlet></router-outlet>
src/app/mock/mock-courses.ts
View file @ 7e556151
import { Course } from '../models/course'; import { Course } from '../models/course';
export const COURSES: Course[] = [ export const COURSES: Course[] = [
{title: 'Course Web Application', description: 'คำอธิบายรายวิชา'}, {title: 'Course Web Application', description: 'คำอธิบายรายวิชา'},
{title: 'Course Web Application01', description: 'คำอธิบายรายวิชา01'},
]; ];
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