aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/components/services/OpenWeather.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/services/OpenWeather.vue')
-rw-r--r--src/components/services/OpenWeather.vue29
1 files changed, 28 insertions, 1 deletions
diff --git a/src/components/services/OpenWeather.vue b/src/components/services/OpenWeather.vue
index ba0be96..3169866 100644
--- a/src/components/services/OpenWeather.vue
+++ b/src/components/services/OpenWeather.vue
@@ -22,7 +22,12 @@
22 <div v-else> 22 <div v-else>
23 <p class="title is-4">{{ name }}</p> 23 <p class="title is-4">{{ name }}</p>
24 <p class="subtitle is-6"> 24 <p class="subtitle is-6">
25 {{ temperature }} 25 <span>
26 {{ temp | tempSuffix(this.item.units) }}
27 </span>
28 <span class="location-time">
29 {{ locationTime }}
30 </span>
26 </p> 31 </p>
27 </div> 32 </div>
28 </div> 33 </div>
@@ -49,6 +54,7 @@ export default {
49 temp: null, 54 temp: null,
50 conditions: null, 55 conditions: null,
51 error: false, 56 error: false,
57 timezoneOffset: 0,
52 }), 58 }),
53 computed: { 59 computed: {
54 temperature: function () { 60 temperature: function () {
@@ -66,6 +72,11 @@ export default {
66 created() { 72 created() {
67 this.fetchWeather(); 73 this.fetchWeather();
68 }, 74 },
75 computed: {
76 locationTime: function () {
77 return this.calcTime(this.timezoneOffset);
78 },
79 },
69 methods: { 80 methods: {
70 fetchWeather: async function () { 81 fetchWeather: async function () {
71 let locationQuery; 82 let locationQuery;
@@ -92,12 +103,23 @@ export default {
92 this.temp = parseInt(weather.main.temp).toFixed(1); 103 this.temp = parseInt(weather.main.temp).toFixed(1);
93 this.icon = weather.weather[0].icon; 104 this.icon = weather.weather[0].icon;
94 this.conditions = weather.weather[0].description; 105 this.conditions = weather.weather[0].description;
106 this.timezoneOffset = weather.timezone;
95 }) 107 })
96 .catch((e) => { 108 .catch((e) => {
97 console.log(e); 109 console.log(e);
98 this.error = true; 110 this.error = true;
99 }); 111 });
100 }, 112 },
113 calcTime: (offset) => {
114 const localTime = new Date();
115 const utcTime =
116 localTime.getTime() + localTime.getTimezoneOffset() * 60000;
117 const calculatedTime = new Date(utcTime + 1000 * offset);
118 return calculatedTime.toLocaleString([], {
119 hour: "2-digit",
120 minute: "2-digit",
121 });
122 },
101 }, 123 },
102}; 124};
103</script> 125</script>
@@ -133,4 +155,9 @@ export default {
133 } 155 }
134 } 156 }
135} 157}
158
159//Location Time
160.location-time {
161 margin-left: 20px;
162}
136</style> 163</style>