Skip to content

Commit dd6918e

Browse files
NEKOYASANNEKOYASAN
authored
Merge branch 'development' into feature/100-create-app-index
2 parents d893291 + decde31 commit dd6918e

File tree

11 files changed

+303
-131
lines changed

11 files changed

+303
-131
lines changed

‎src/components/PeriodCard.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
</div>
1414
<v-row>
1515
<v-col
16-
v-for="(item, i) in classData.getLessonsByDisplayDate"
16+
v-for="(item, i) in classData.lessonsOnCurrentDate"
1717
:key="i"
1818
cols="12"
1919
md="6"

‎src/components/PeriodCardEditable.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
</div>
1414
<v-row>
1515
<v-col
16-
v-for="(item, i) in classData.getLessonsByDisplayDate"
16+
v-for="(item, i) in classData.lessonsOnCurrentDate"
1717
:key="i"
1818
cols="12"
1919
md="6"

‎src/layouts/classes.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export default Vue.extend({
5050
},
5151
watch: {
5252
date(value) {
53-
vxm.classData.setDate(value)
53+
vxm.app.setDate(value)
5454
}
5555
},
5656
mounted(): void {

‎src/pages/classes/index.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="MainPage">
3-
<div v-if="classData.getLessonsByDisplayDate.length">
3+
<div v-if="classData.lessonsOnCurrentDate.length">
44
<period-card :class-data="classData" />
55
</div>
66
<div v-else-if="today" class="Classes-Outer">
@@ -46,10 +46,10 @@ export default Vue.extend<Data, Methods, Computed, unknown>({
4646
},
4747
computed: {
4848
today() {
49-
return isToday(this.classData.displayDate)
49+
return isToday(vxm.app.currentDate)
5050
},
5151
dateTitle() {
52-
return dayjs(this.classData.displayDate).format('M/D')
52+
return dayjs(vxm.app.currentDate).format('M/D')
5353
}
5454
},
5555
methods: {

‎src/pages/edit/index.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="MainPage">
3-
<div v-if="classData.getLessonsByDisplayDate.length">
3+
<div v-if="classData.lessonsOnCurrentDate.length">
44
<period-card-editable :class-data="classData" />
55
</div>
66
<div v-else class="Classes-Outer">

‎src/pages/user/registerClass.vue‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<template>
2+
<bottom-sheet-layer title="クラス登録" title-en="STEP 2">
3+
<template v-slot:LayerContents>
4+
<dl class="RegisterClass-List">
5+
<dt class="RegisterClass-ItemTitle">学校名</dt>
6+
<dd>
7+
<input-field label="school" placeholder="おひさま小学校" require />
8+
</dd>
9+
<dt class="RegisterClass-ItemTitle">クラス名</dt>
10+
<dd>
11+
<input-field label="class" placeholder="2年B組" require />
12+
<span class="RegisterClass-ItemNote">
13+
クラス名は表示されますのでご注意ください
14+
</span>
15+
</dd>
16+
</dl>
17+
</template>
18+
<template v-slot:LayerFooter>
19+
<action-button theme="primary" text="登録を完了する" />
20+
</template>
21+
</bottom-sheet-layer>
22+
</template>
23+
24+
<script lang="ts">
25+
import Vue from 'vue'
26+
import BottomSheetLayer from '@/components/BottomSheetLayer.vue'
27+
import ActionButton from '@/components/ActionButton.vue'
28+
import InputField from '@/components/InputField.vue'
29+
30+
export default Vue.extend({
31+
components: { BottomSheetLayer, ActionButton, InputField },
32+
layout: 'background'
33+
})
34+
</script>
35+
36+
<style lang="scss" scoped>
37+
.RegisterClass-List {
38+
padding: 24px 0;
39+
}
40+
.RegisterClass-ItemTitle {
41+
font-size: 16px;
42+
font-weight: bold;
43+
color: $color-white;
44+
text-align: center;
45+
margin: 4px 0;
46+
}
47+
.RegisterClass-ItemNote {
48+
display: block;
49+
font-size: 14px;
50+
font-weight: bold;
51+
color: $color-white;
52+
text-align: center;
53+
margin: 4px 0;
54+
}
55+
</style>

‎src/pages/user/registered.vue‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<template>
2+
<bottom-sheet-layer title="登録されました！" title-en="THANK YOU!">
3+
<template v-slot:LayerContents>
4+
<div class="Registered-Contents">
5+
<v-icon color="white" class="Registered-Icon">
6+
mdi-clipboard-account
7+
</v-icon>
8+
<p class="Registered-Text">あなたのクラスIDです</p>
9+
<div class="Registered-Id">ほげほげほげ</div>
10+
</div>
11+
</template>
12+
<template v-slot:LayerFooter>
13+
<action-button
14+
theme="primary"
15+
text="授業を追加・編集する"
16+
class="Registered-Button"
17+
/>
18+
<action-button theme="secondary" text="クラスIDを共有する" />
19+
</template>
20+
</bottom-sheet-layer>
21+
</template>
22+
23+
<script lang="ts">
24+
import Vue from 'vue'
25+
import BottomSheetLayer from '@/components/BottomSheetLayer.vue'
26+
import ActionButton from '@/components/ActionButton.vue'
27+
28+
export default Vue.extend({
29+
components: { BottomSheetLayer, ActionButton },
30+
layout: 'background'
31+
})
32+
</script>
33+
34+
<style lang="scss" scoped>
35+
.Registered-Contents {
36+
display: flex;
37+
flex-direction: column;
38+
justify-content: center;
39+
align-items: center;
40+
padding: 24px 0;
41+
}
42+
.Registered-Icon {
43+
font-size: 50px;
44+
}
45+
.Registered-Text {
46+
font-size: 16px;
47+
font-weight: bold;
48+
color: $color-white;
49+
margin: 24px 0 12px;
50+
}
51+
.Registered-Id {
52+
max-width: 9em;
53+
padding: 16px 24px;
54+
text-align: center;
55+
background-color: $color-white;
56+
border: 2px solid $color-base-color-01;
57+
border-radius: 14px;
58+
letter-spacing: 0.2em;
59+
line-height: 1.25;
60+
font-size: 30px;
61+
color: $color-gray;
62+
}
63+
.Registered-Button {
64+
margin-bottom: 16px;
65+
}
66+
</style>

‎src/store/index.ts‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,17 @@ import Vuex, { ActionContext } from 'vuex'
33
import { Context } from '@nuxt/types/app'
44
import { createProxy, extractVuexModule } from 'vuex-class-component'
55
import jwtDecode from 'jwt-decode'
6-
import { UserStore } from '@/store/modules/user'
6+
import { AppStore } from '@/store/modules/app'
77
import { ClassDataStore } from '@/store/modules/classData'
8+
import { UserStore } from '@/store/modules/user'
89

910
Vue.use(Vuex)
1011

1112
export const store = new Vuex.Store({
1213
modules: {
13-
...extractVuexModule(UserStore),
14-
...extractVuexModule(ClassDataStore)
14+
...extractVuexModule(AppStore),
15+
...extractVuexModule(ClassDataStore),
16+
...extractVuexModule(UserStore)
1517
}
1618
})
1719

@@ -29,6 +31,7 @@ export const actions = {
2931
}
3032

3133
export const vxm = {
32-
user: createProxy(store, UserStore),
33-
classData: createProxy(store, ClassDataStore)
34+
app: createProxy(store, AppStore),
35+
classData: createProxy(store, ClassDataStore),
36+
user: createProxy(store, UserStore)
3437
}

‎src/store/modules/app.ts‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { createModule, mutation } from 'vuex-class-component'
2+
import dayjs from 'dayjs'
3+
4+
const VuexModule = createModule({
5+
namespaced: 'app',
6+
strict: false,
7+
target: 'nuxt'
8+
})
9+
10+
type CurrentDate = Date
11+
12+
interface App {
13+
currentDate: CurrentDate
14+
}
15+
16+
export class AppStore extends VuexModule implements App {
17+
currentDate: CurrentDate = new Date()
18+
19+
@mutation
20+
public goNextDate() {
21+
this.currentDate = dayjs(this.currentDate)
22+
.add(1, 'd')
23+
.toDate()
24+
}
25+
26+
@mutation
27+
public goPreviousDate() {
28+
this.currentDate = dayjs(this.currentDate)
29+
.subtract(1, 'd')
30+
.toDate()
31+
}
32+
33+
@mutation
34+
public setDate(date: Date) {
35+
this.currentDate = date
36+
}
37+
}

0 commit comments

Comments
 (0)