klaus/sodalive-vuejs-creator-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

콘텐츠 등록 - 예약 업로드 추가

Browse Source
This commit is contained in:
Yu Sung
2024-01-11 17:36:52 +09:00
parent 77756d1a9a
commit 9434c2caac
3 changed files with 120 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
package-lock.json generated
View File

@@ -11,7 +11,9 @@
"core-js": "^3.6.5",
"vue": "^2.6.11",
"vue-router": "^3.2.0",
"vue2-datepicker": "^3.11.1",
"vue2-editor": "^2.10.3",
"vue2-timepicker": "^1.1.6",
"vuedraggable": "^2.24.3",
"vuejs-datetimepicker": "^1.1.13",
"vuetify": "2.6.10",
@@ -5171,6 +5173,11 @@
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
"integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw=="
},
"node_modules/date-format-parse": {
"version": "0.2.7",
"resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.7.tgz",
"integrity": "sha512-/+lyMUKoRogMuTeOVii6lUwjbVlesN9YRYLzZT/g3TEZ3uD9QnpjResujeEqUW+OSNbT7T1+SYdyEkTcRv+KDQ=="
},
"node_modules/de-indent": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -14513,6 +14520,17 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
"node_modules/vue2-datepicker": {
"version": "3.11.1",
"resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.11.1.tgz",
"integrity": "sha512-6PU/+pnp2mgZAfnSXmbdwj9516XsEvTiw61Q5SNrvvdy8W/FCxk1GAe9UZn/m9YfS5A47yK6XkcjMHbp7aFApA==",
"dependencies": {
"date-format-parse": "^0.2.7"
},
"peerDependencies": {
"vue": "^2.5.0"
}
},
"node_modules/vue2-editor": {
"version": "2.10.3",
"resolved": "https://registry.npmjs.org/vue2-editor/-/vue2-editor-2.10.3.tgz",
@@ -14521,6 +14539,14 @@
"quill": "^1.3.6"
}
},
"node_modules/vue2-timepicker": {
"version": "1.1.6",
"resolved": "https://registry.npmjs.org/vue2-timepicker/-/vue2-timepicker-1.1.6.tgz",
"integrity": "sha512-DhO2UH4CTer/lMWxg+jqxn/+h6g2vZrsM6vCe9u7/Ie+Pej9yA+8mQA3C3VPApZ+LauKc43WxCspOXb6SGBOTw==",
"peerDependencies": {
"vue": "^2.6.5"
}
},
"node_modules/vuedraggable": {
"version": "2.24.3",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.24.3.tgz",
@@ -19750,6 +19776,11 @@
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
"integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw=="
},
"date-format-parse": {
"version": "0.2.7",
"resolved": "https://registry.npmjs.org/date-format-parse/-/date-format-parse-0.2.7.tgz",
"integrity": "sha512-/+lyMUKoRogMuTeOVii6lUwjbVlesN9YRYLzZT/g3TEZ3uD9QnpjResujeEqUW+OSNbT7T1+SYdyEkTcRv+KDQ=="
},
"de-indent": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -27255,6 +27286,14 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
"vue2-datepicker": {
"version": "3.11.1",
"resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-3.11.1.tgz",
"integrity": "sha512-6PU/+pnp2mgZAfnSXmbdwj9516XsEvTiw61Q5SNrvvdy8W/FCxk1GAe9UZn/m9YfS5A47yK6XkcjMHbp7aFApA==",
"requires": {
"date-format-parse": "^0.2.7"
}
},
"vue2-editor": {
"version": "2.10.3",
"resolved": "https://registry.npmjs.org/vue2-editor/-/vue2-editor-2.10.3.tgz",
@@ -27263,6 +27302,12 @@
"quill": "^1.3.6"
}
},
"vue2-timepicker": {
"version": "1.1.6",
"resolved": "https://registry.npmjs.org/vue2-timepicker/-/vue2-timepicker-1.1.6.tgz",
"integrity": "sha512-DhO2UH4CTer/lMWxg+jqxn/+h6g2vZrsM6vCe9u7/Ie+Pej9yA+8mQA3C3VPApZ+LauKc43WxCspOXb6SGBOTw==",
"requires": {}
},
"vuedraggable": {
"version": "2.24.3",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.24.3.tgz",

2
package.json
View File

@@ -13,7 +13,9 @@
"core-js": "^3.6.5",
"vue": "^2.6.11",
"vue-router": "^3.2.0",
"vue2-datepicker": "^3.11.1",
"vue2-editor": "^2.10.3",
"vue2-timepicker": "^1.1.6",
"vuedraggable": "^2.24.3",
"vuejs-datetimepicker": "^1.1.13",
"vuetify": "2.6.10",

74
src/views/Content/ContentList.vue
View File

@@ -62,6 +62,9 @@
<th class="text-center">
등록일
</th>
<th class="text-center">
오픈 예정일
</th>
<th class="text-center">
관리
</th>
@@ -111,6 +114,7 @@
/>
</td>
<td>{{ item.date }}</td>
<td>{{ item.releaseDate }}</td>
<td>
<v-row>
<v-col>
@@ -367,6 +371,46 @@
</v-col>
</v-row>
</v-card-text>
<v-card-text>
<v-row align="center">
<v-col cols="4">
예약 공개
</v-col>
<v-col
cols="8"
align="left"
>
<input
v-model="is_active_reservation"
type="checkbox"
>
</v-col>
</v-row>
<v-row
v-if="is_active_reservation"
align="center"
>
<v-col cols="4">
예약 날짜와 시간
</v-col>
<v-col
cols="8"
align="left"
>
<DatePicker
v-model="reservation_date"
value-type="format"
/>
&nbsp;&nbsp;
<vue-timepicker
v-model="reservation_time"
format="HH:mm"
input-class="skip-error-style"
:minute-interval="15"
/>
</v-col>
</v-row>
</v-card-text>
<v-card-text>
<v-row align="center">
<v-col cols="4">
@@ -526,15 +570,25 @@
<script>
import * as api from '@/api/audio_content'
import VuetifyAudio from 'vuetify-audio'
// Main JS (in UMD format)
import VueTimepicker from 'vue2-timepicker'
import DatePicker from 'vue2-datepicker';
import 'vue2-datepicker/index.css';
// CSS
import 'vue2-timepicker/dist/VueTimepicker.css'
export default {
name: "AudioContentList",
components: {VuetifyAudio},
components: {VuetifyAudio, VueTimepicker, DatePicker},
data() {
return {
is_loading: false,
is_active_reservation: false,
reservation_date: '',
reservation_time: '',
show_create_dialog: false,
show_modify_dialog: false,
show_delete_confirm_dialog: false,
@@ -605,6 +659,9 @@ export default {
is_adult: false,
is_comment_available: true,
}
this.reservation_time = ''
this.reservation_time = ''
this.is_active_reservation = false
this.show_create_dialog = false
this.show_modify_dialog = false
this.show_delete_confirm_dialog = false
@@ -700,6 +757,16 @@ export default {
isCommentAvailable: this.audio_content.is_comment_available
}
if (this.is_active_reservation === true) {
if (this.reservation_date.trim() === '' || this.reservation_time.trim() === '') {
this.notifyError("오픈 예정 날짜와 시간을 선택해 주세요.")
this.is_loading = false
return
}
request.releaseDate = this.reservation_date + ' ' + this.reservation_time
}
let previewStartTime = this.audio_content.preview_start_time;
let previewEndTime = this.audio_content.preview_end_time;
@@ -716,6 +783,7 @@ export default {
!this.isValidTimeFormat(previewEndTime)
) {
this.notifyError("미리 듣기 시간 형식은 00:30:00 과 같아야 합니다")
this.is_loading = false
return
}
@@ -728,6 +796,7 @@ export default {
if (timeDifference < 30) {
this.notifyError("미리 듣기의 최소 시간은 30초 입니다.")
this.is_loading = false
return
}
@@ -739,6 +808,7 @@ export default {
(previewEndTime !== undefined && previewEndTime.trim() !== '')
) {
this.notifyError("미리 듣기 시작 시간과 종료 시간 둘 다 입력을 하거나 둘 다 입력 하지 않아야 합니다.")
this.is_loading = false
return
}
}
@@ -747,6 +817,8 @@ export default {
formData.append("contentFile", this.audio_content.content_file)
formData.append("request", JSON.stringify(request))
console.log(request)
const res = await api.createAudioContent(formData)
if (res.status === 200 && res.data.success === true) {
this.is_loading = false