From be6794cfc1cab5553188674eba57eaec78622057 Mon Sep 17 00:00:00 2001 From: "YLHEALTH\\jackson.li" Date: Thu, 3 Jan 2019 17:36:34 +0800 Subject: [PATCH] commit --- src/app/home/dataList.const.ts | 362 +++++++++++++++++++++++++++++++ src/app/home/home.component.html | 66 ++++++ src/app/home/home.component.ts | 3 + src/app/p2/data.ts | 17 ++ src/app/p2/message.ts | 15 -- src/app/p2/p2.component.html | 18 +- src/app/p2/p2.component.ts | 38 +++- src/app/p3/p3.component.html | 5 +- src/app/p3/p3.component.ts | 16 +- 9 files changed, 504 insertions(+), 36 deletions(-) create mode 100644 src/app/home/dataList.const.ts create mode 100644 src/app/p2/data.ts delete mode 100644 src/app/p2/message.ts diff --git a/src/app/home/dataList.const.ts b/src/app/home/dataList.const.ts new file mode 100644 index 0000000..4d01121 --- /dev/null +++ b/src/app/home/dataList.const.ts @@ -0,0 +1,362 @@ +export const dataList = [ + { + 'city': { + 'id': 2643743, + 'name': 'London', + 'coord': { + 'lon': -0.1258, + 'lat': 51.5085 + }, + 'country': 'GB', + 'population': 0 + }, + 'cod': '200', + 'message': 0.0597013, + 'cnt': 14, + 'list_': [ + { + 'dt': 1546430400, + 'temp': { + 'day': 4, + 'min': -5.23, + 'max': 4, + 'night': -5.23, + 'eve': -0.13, + 'morn': -1.36 + }, + 'pressure': 1049.36, + 'humidity': 0, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 3.37, + 'deg': 2, + 'clouds': 0 + }, + { + 'dt': 1546516800, + 'temp': { + 'day': 7.33, + 'min': -7.13, + 'max': 7.33, + 'night': -7.13, + 'eve': -2.57, + 'morn': 1.34 + }, + 'pressure': 1048.26, + 'humidity': 73, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 1.92, + 'deg': 350, + 'clouds': 0 + }, + { + 'dt': 1546603200, + 'temp': { + 'day': 1.56, + 'min': -7.9, + 'max': 2.3, + 'night': -3.84, + 'eve': -1.88, + 'morn': -7.9 + }, + 'pressure': 1046.87, + 'humidity': 78, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 2.3, + 'deg': 277, + 'clouds': 0 + }, + { + 'dt': 1546689600, + 'temp': { + 'day': 2.85, + 'min': -3.8, + 'max': 3.54, + 'night': -1, + 'eve': 2.45, + 'morn': -3.8 + }, + 'pressure': 1043.75, + 'humidity': 92, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 3.21, + 'deg': 303, + 'clouds': 88, + 'rain': 0.34 + }, + { + 'dt': 1546776000, + 'temp': { + 'day': 4.45, + 'min': 0.69, + 'max': 4.45, + 'night': 1.04, + 'eve': 2.55, + 'morn': 0.69 + }, + 'pressure': 1040.37, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 3.75, + 'deg': 297, + 'clouds': 92 + }, + { + 'dt': 1546862400, + 'temp': { + 'day': 4.61, + 'min': -3.07, + 'max': 4.61, + 'night': -3.07, + 'eve': 0.6, + 'morn': 1.42 + }, + 'pressure': 1039.55, + 'humidity': 0, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 1.98, + 'deg': 314, + 'clouds': 56 + }, + { + 'dt': 1546948800, + 'temp': { + 'day': 4.95, + 'min': 1.45, + 'max': 5.88, + 'night': 5.71, + 'eve': 5.88, + 'morn': 1.45 + }, + 'pressure': 1038.93, + 'humidity': 0, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 3.14, + 'deg': 213, + 'clouds': 71 + }, + { + 'dt': 1547035200, + 'temp': { + 'day': 11.64, + 'min': 8.74, + 'max': 11.64, + 'night': 10.89, + 'eve': 11.33, + 'morn': 8.74 + }, + 'pressure': 1030.48, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 6.9, + 'deg': 261, + 'clouds': 53, + 'rain': 0.34 + }, + { + 'dt': 1547121600, + 'temp': { + 'day': 12.54, + 'min': 8.77, + 'max': 12.54, + 'night': 8.77, + 'eve': 10.37, + 'morn': 11.46 + }, + 'pressure': 1026.72, + 'humidity': 0, + 'weather': [ + { + 'id': 800, + 'main': 'Clear', + 'description': 'sky is clear', + 'icon': '01d' + } + ], + 'speed': 6.71, + 'deg': 292, + 'clouds': 72 + }, + { + 'dt': 1547208000, + 'temp': { + 'day': 11.32, + 'min': 9.37, + 'max': 11.32, + 'night': 9.83, + 'eve': 10.92, + 'morn': 9.37 + }, + 'pressure': 1023.9, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 6.22, + 'deg': 243, + 'clouds': 75, + 'rain': 0.25 + }, + { + 'dt': 1547294400, + 'temp': { + 'day': 10.72, + 'min': 9.82, + 'max': 10.72, + 'night': 10.45, + 'eve': 10.06, + 'morn': 9.82 + }, + 'pressure': 1013.87, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 7.32, + 'deg': 203, + 'clouds': 100, + 'rain': 1.6 + }, + { + 'dt': 1547380800, + 'temp': { + 'day': 9.19, + 'min': 5.48, + 'max': 9.28, + 'night': 5.48, + 'eve': 6.64, + 'morn': 9.28 + }, + 'pressure': 999.12, + 'humidity': 0, + 'weather': [ + { + 'id': 501, + 'main': 'Rain', + 'description': 'moderate rain', + 'icon': '10d' + } + ], + 'speed': 5.19, + 'deg': 220, + 'clouds': 94, + 'rain': 8.85 + }, + { + 'dt': 1547467200, + 'temp': { + 'day': 8.05, + 'min': 3.22, + 'max': 8.05, + 'night': 3.22, + 'eve': 5.32, + 'morn': 7.02 + }, + 'pressure': 986.3, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 8.15, + 'deg': 186, + 'clouds': 92, + 'rain': 0.8 + }, + { + 'dt': 1547553600, + 'temp': { + 'day': 7.66, + 'min': 2.62, + 'max': 7.66, + 'night': 4.34, + 'eve': 3.78, + 'morn': 2.62 + }, + 'pressure': 989.42, + 'humidity': 0, + 'weather': [ + { + 'id': 500, + 'main': 'Rain', + 'description': 'light rain', + 'icon': '10d' + } + ], + 'speed': 3.5, + 'deg': 199, + 'clouds': 34, + 'rain': 2.8 + } + ] + } +]; diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 5745794..cf5a344 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -2,6 +2,7 @@ cnt:
城市資訊;
+ @@ -13,6 +14,17 @@ cnt:
+ + + + + + + + + + +
id name lon lat
{{item.city.id}}{{item.city.name}}{{item.city.coord.lon}}{{item.city.coord.lat}}{{item.city.country}}{{item.city.population}}
天氣資訊;
@@ -39,5 +51,59 @@ cnt:
+ + + + + + + + + + + + + + + + + + + +
description icon
+ {{item.list_.dt}} + + {{item.list_.temp.day}} °C + + {{item.list_.temp.min}} °C + + {{item.list_.temp.max }} °C + + {{item.list_.temp.night }} °C + + {{item.list_.temp.eve }} °C + + {{item.list_.temp.morn }} °C + + {{item.list_.pressure}} hpa + + {{item.list_.humidity}} % + + {{item.list_.weather.id }} + + {{item.list_.weather.main }} + + {{item.list_.weather.description }} + + {{item.list_.weather.icon }} + + {{item.list_.speed}} meter/sec + + {{item.list_.deg}} ° + + {{item.list_.clouds}} % + + {{item.list_.rain}} +

diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 33fd770..46547fa 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { dataList } from './dataList.const'; @Component({ selector: 'app-home', @@ -7,6 +8,8 @@ import { Component, OnInit } from '@angular/core'; }) export class HomeComponent implements OnInit { + list = dataList; + constructor() { } ngOnInit() { diff --git a/src/app/p2/data.ts b/src/app/p2/data.ts new file mode 100644 index 0000000..c79e1d9 --- /dev/null +++ b/src/app/p2/data.ts @@ -0,0 +1,17 @@ +export class Data { + + name: string; + price: any; + quantity: any; + + + constructor(name: string, price: any, quantity: any) { + + this.name = name; + this.price = price; + this.quantity = quantity; + + + } + + } diff --git a/src/app/p2/message.ts b/src/app/p2/message.ts deleted file mode 100644 index 4f57ac1..0000000 --- a/src/app/p2/message.ts +++ /dev/null @@ -1,15 +0,0 @@ -export class Message { - - name: string; - price: string; - quantity: string; - - constructor(name: string, price: string, quantity: string) { - - this.name = name; - this.price = price; - this.quantity = quantity; - - } - - } diff --git a/src/app/p2/p2.component.html b/src/app/p2/p2.component.html index 546c074..7bb7849 100644 --- a/src/app/p2/p2.component.html +++ b/src/app/p2/p2.component.html @@ -1,7 +1,7 @@

題二

-
+

- 單品：
+ 單品：
單價：
數量：
你購買 {{ name }} 商品，單價 {{ price }} 元，數量{{ quantity }}元，共計NT${{ price * quantity}} 元 @@ -19,18 +19,18 @@ 小計 - + - - {{ message.name }} - {{ message.price }} - {{ message.quantity }} - {{ message.price * message.quantity}} + + {{ data.name }} + {{ data.price }} + {{ data.quantity }} + {{ data.price * data.quantity}} 加總 - {{total}} + {{ totalPrice() }}
diff --git a/src/app/p2/p2.component.ts b/src/app/p2/p2.component.ts index aa263ad..17201c4 100644 --- a/src/app/p2/p2.component.ts +++ b/src/app/p2/p2.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { Message } from './message'; +import { Data } from './data'; @Component({ selector: 'app-p2', @@ -14,26 +14,48 @@ export class P2Component implements OnInit { quantity = ''; - messages: Message[] = []; + datas: Data[] = []; result = 0; + total = ''; - addMessage(): void { + message = ''; + + buildMessage(): void { + if (this.name !== null && this.price !== null && this.quantity !== null && + this.name !== undefined && this.price !== undefined && this.quantity !== undefined + ) { + this.message = "你購買" + this.name + "商品，單價" + this.price + "元，數量" + + this.quantity + "元，共計NT$"; + } + + } + + addData(): void { // 防呆，避免名稱或內容是空值時也可以留言 if ( !this.name.trim() && !this.price.trim() && !this.quantity.trim() ) { - return; + return alert('項目資訊沒填好'); } // 用名稱跟內容產生一個留言的資料物件 - const message = new Message(this.name, this.price, this.quantity); + const data = new Data(this.name, this.price, this.quantity); + // 將留言的資料物件放進容器裡 - this.messages.push(message); + this.datas.push(data); + } - deleteItem(): void { - alert('清空啦'); + + totalPrice(){ + return '算不出來'; + } + + deleteItem(name): void { + console.log(name); + // if(this.datas[i]['name'] == name) + // this.datas.splice(this.datas, 1); } constructor() { } diff --git a/src/app/p3/p3.component.html b/src/app/p3/p3.component.html index d737df6..833a04a 100644 --- a/src/app/p3/p3.component.html +++ b/src/app/p3/p3.component.html @@ -1,5 +1,6 @@

題三

- 寬度 :
- 高度 :
+ 寬度 :
+ 高度 :
+ diff --git a/src/app/p3/p3.component.ts b/src/app/p3/p3.component.ts index a6d7c3f..269bcef 100644 --- a/src/app/p3/p3.component.ts +++ b/src/app/p3/p3.component.ts @@ -7,9 +7,21 @@ import { Component, OnInit } from '@angular/core'; }) export class P3Component implements OnInit { - constructor() { } + widthLength = '1024'; + heightLength = '768'; + imageUrl = 'http://lorempixel.com//{{widthLength}}/{{heightLength}}/'; - ngOnInit() { + showPic() { + if (this.widthLength !== null && this.heightLength !== null && + this.widthLength !== undefined && this.heightLength !== undefined) { + this.imageUrl = "http://lorempixel.com/" + this.widthLength + "/" + this.heightLength + "/"; + } else { + alert("長度或高度不得為空!"); + } } + constructor() { } + + ngOnInit() { } + } -- 2.26.2