somewhere

2023-08-17 13:05:51 +03:30
parent 30c7eb0e7b
commit 53843207cc
429 changed files with 117489 additions and 1 deletions
@@ -0,0 +1,175 @@
+<template>
+  <div>
+    <CustomSubHeader>
+      <CBreadcrumb class="border-0 mb-0">{{ title }}</CBreadcrumb>
+      <CButton size="sm" color="primary" class="mr-auto" :to="{ name: 'admin-learning-page', params: { page: 1 } }"
+        >برگشت به صفحه قبل</CButton
+      >
+      <CButton size="sm" color="success" style="margin-right: 10px" :disabled="pending" @click="upload">ایجاد</CButton>
+    </CustomSubHeader>
+    <CRow>
+      <CCol xl="6">
+        <CCard>
+          <CCardBody>
+            <CForm>
+              <CInput
+                v-model="formData.title"
+                label="عنوان"
+                horizontal
+                :description="validation.title ? validation.title.msg : null"
+                :class="validation.title ? 'err' : null"
+              />
+
+              <CTextarea
+                v-model="formData.short_description"
+                label="توضیح کوتاه"
+                horizontal
+                rows="4"
+                :description="validation.short_description ? validation.short_description.msg : null"
+                :class="validation.short_description ? 'err' : null"
+              />
+
+              <CRow form class="form-group" :class="validation.description ? 'err' : null">
+                <CCol tag="label" sm="3" class="col-form-label">توضیحات</CCol>
+                <CCol sm="9">
+                  <client-only>
+                    <ckeditor v-model="formData.description" :config="editorConfig"></ckeditor>
+                  </client-only>
+                  <small v-if="validation.description" class="form-text text-muted w-100">
+                    {{ validation.description.msg }}
+                  </small>
+                </CCol>
+              </CRow>
+            </CForm>
+          </CCardBody>
+        </CCard>
+      </CCol>
+      <CCol xl="6">
+        <CCard>
+          <CCardBody>
+            <h1>تصویر:</h1>
+            <el-divider />
+            <CRow>
+              <CCol col="12" class="mb-3">
+                <img :src="formData.cover" alt="" style="width: 100%; max-width: 500px" />
+              </CCol>
+              <CCol col="1">
+                <span>کاور</span>
+              </CCol>
+              <CCol col="11">
+                <input ref="cover" type="file" @change="imagePreview" />
+              </CCol>
+              <CCol col="11" class="mr-auto mt-3">
+                <small v-if="validation.cover" class="form-text alert-danger w-100">
+                  {{ validation.cover.msg }}
+                </small>
+              </CCol>
+            </CRow>
+
+            <h1 class="mt-5">ویدیو:</h1>
+            <el-divider />
+            <CRow>
+              <CCol v-if="formData.video" col="12" class="mb-3">
+                <video :src="formData.video" controls autoplay muted style="width: 100%"></video>
+              </CCol>
+              <CCol col="1">
+                <span>ویدیو</span>
+              </CCol>
+              <CCol col="11">
+                <input ref="video" type="file" @change="videoPreview" />
+              </CCol>
+              <CCol col="11" class="mr-auto mt-3">
+                <small v-if="validation.video" class="form-text alert-danger w-100">
+                  {{ validation.video.msg }}
+                </small>
+                <small v-else class="form-text text-muted w-100">
+                  فایل ویدیو را انتخاب کنید.(ویدیو اجباری نیست)
+                  <br />
+                  فرمت های قابل قبول: mp4 wmv avi
+                </small>
+              </CCol>
+            </CRow>
+          </CCardBody>
+        </CCard>
+      </CCol>
+    </CRow>
+  </div>
+</template>
+
+<script>
+import axiosUploadProcess from '@/mixins/axiosUploadProcess'
+
+export default {
+  name: 'AddminAddNewLearnning',
+  mixins: [axiosUploadProcess],
+  layout: 'admin',
+  data() {
+    return {
+      title: 'افزودن آموزش',
+      formData: {
+        title: '',
+        short_description: '',
+        description: '',
+        cover: '',
+        video: ''
+      },
+      editorConfig: {
+        language: 'fa',
+        extraPlugins: ['bidi', 'justify']
+      },
+      validation: {},
+      pending: false
+    }
+  },
+  head() {
+    return {
+      title: this.title
+    }
+  },
+  methods: {
+    upload() {
+      this.pending = true
+      this.validation = {}
+      const data = new FormData()
+      data.append('title', this.formData.title)
+      data.append('short_description', this.formData.short_description)
+      data.append('description', this.formData.description)
+      data.append('cover', this.$refs.cover.files[0])
+      if (this.$refs.video.files[0]) data.append('video', this.$refs.video.files[0])
+
+      this.$axios
+        .post(`/api/admin/learning`, data, this.axiosConfig)
+        .then(response => {
+          this.pending = false
+          if (response.data) {
+            this.$message({
+              message: 'آیتم با موفقیت ثبت شد.',
+              type: 'success'
+            })
+            this.$router.push({ name: 'admin-learning-page', params: { page: 1 } })
+          }
+        })
+        .catch(error => {
+          this.pending = false
+          if (error.response.status === 422) {
+            this.validation = error.response.data.validation
+            this.$message({
+              type: 'error',
+              message: 'اطلاعات رو بررسی و دوباره تلاش کنید'
+            })
+          } else {
+            this.$alert(error.response.data.message, 'خطا', {
+              confirmButtonText: 'باشه'
+            })
+          }
+        })
+    },
+    imagePreview(event) {
+      this.formData.cover = URL.createObjectURL(event.target.files[0])
+    },
+    videoPreview(event) {
+      this.formData.video = URL.createObjectURL(event.target.files[0])
+    }
+  }
+}
+</script>