课程管理

project/qujing/app/AppCurriculumManage/components/Add.vue

@@ -7,39 +7,40 @@
       <ai-card title="基本信息">
         <template #content>
           <el-form class="ai-form" :model="form" label-width="120px" ref="form">
-            <el-form-item label="标题" style="width: 100%;" prop="title" :rules="[{required: true, message: '请输入标题', trigger: 'blur'}]">
+            <el-form-item label="课程名称" style="width: 100%;" prop="title" :rules="[{required: true, message: '请输入标题', trigger: 'blur'}]">
               <el-input size="small" v-model="form.title" clearable placeholder="请输入..." :maxlength="50" :show-word-limit="true"></el-input>
             </el-form-item>
-            <el-form-item prop="contentType" label="课程类型" :rules="[{required: true, message: '请选择课程类型', trigger: 'change'}]">
-              <el-select style="width: 100%;" v-model="form.contentType" size="small" placeholder="请选择课程类型">
-                <el-option
-                  v-for="item in contentTypeList"
-                  :key="item.value"
-                  :label="item.name"
-                  :value="item.value">
-                </el-option>
-              </el-select>
+            <el-form-item prop="courseType" label="课程类型" :rules="[{required: true, message: '请选择课程类型', trigger: 'change'}]">
+              <ai-select
+                v-model="form.courseType"
+                clearable
+                placeholder="请选择课程类型"
+                :selectList="dict.getDict('qjCourseType')">
+              </ai-select>
             </el-form-item>
             <el-form-item prop="showIndex" label="排序" :rules="[{required: true, message: '请选择文章类型', trigger: 'change'}]">
               <el-input-number size="small" v-model="form.showIndex" :min="0"></el-input-number>
             </el-form-item>
-            <el-form-item v-if="form.contentType === '0'" label="正文" prop="content" style="width: 100%;" :rules="[{required: true, message: '请输入内容', trigger: 'change'}]">
+            <el-form-item v-if="form.courseType === '0'" label="正文" prop="content" style="width: 100%;" :rules="[{required: true, message: '请输入内容', trigger: 'change'}]">
               <ai-editor v-model="form.content" :instance="instance"/>
             </el-form-item>
-            <el-form-item v-if="form.contentType === '0' && !isHideCoverimg" label="封面图片" prop="files" style="width: 100%;">
+            <el-form-item v-if="form.courseType === '0' && !isHideCoverimg" label="封面图片" prop="pictureUrl" :rules="[{required: true, message: '请上传封面图片', trigger: 'change'}]" style="width: 100%;">
               <ai-uploader
                 :instance="instance"
-                v-model="form.files"
-                key="file"
-                :limit="9">
+                isShowTip
+                v-model="form.pictureUrl"
+                :limit="1"
+                :cropOps="cropOps"
+                is-crop>
                 <template slot="tips">
-                  <p>最多上传9张图片,单个文件最大10MB，支持jpg、jpeg、png格式</p>
+                  <p>最多上传1张图片,单个文件最大10MB，支持jpg、jpeg、png格式</p>
+                  <p>图片比例：1.6：1</p>
                 </template>
               </ai-uploader>
             </el-form-item>
-            <el-form-item v-if="form.contentType === '1'" label="视频" prop="files" style="width: 100%;" :rules="[{required: true, message: '请上传视频', trigger: 'change'}]">
+            <el-form-item v-if="form.courseType === '1'" label="视频" prop="videoUrl" style="width: 100%;" :rules="[{required: true, message: '请上传视频', trigger: 'change'}]">
               <el-upload :show-file-list="false" ref="upload1" action :http-request="submitUpload" :accept="accept" :limit="1">
-                <div class="video" v-if="!form.files.length">
+                <div class="video" v-if="!form.videoUrl.length">
                   <div class="icon">
                     <ai-icon type="svg" icon="iconVideo"/>
                     <span>上传视频</span>
@@ -48,13 +49,13 @@
                 </div>
               </el-upload>
               <video class="video-com" style="width:100%; height:100%; object-fit: fill;" muted
-                    :src="form.files[0].url" controls="controls" v-if="form.files.length"></video>
+                    :src="form.videoUrl[0].url" controls="controls" v-if="form.videoUrl.length"></video>
               <el-upload :show-file-list="false" ref="upload2" action :http-request="submitUpload" :accept="accept"
-                        :limit="1" v-if="form.files.length">
+                        :limit="1" v-if="form.videoUrl.length">
                 <el-button style="margin-top: 10px;">重新选择</el-button>
               </el-upload>
             </el-form-item>
-            <el-form-item label="视频封面" prop="pictureUrl" style="width: 100%;" v-if="form.contentType === '1'" :rules="[{required: true, message: '请上传视频封面', trigger: 'change'}]">
+            <el-form-item label="视频封面" prop="pictureUrl" style="width: 100%;" v-if="form.courseType === '1'" :rules="[{required: true, message: '请上传视频封面', trigger: 'change'}]">
               <ai-uploader
                 :instance="instance"
                 isShowTip
@@ -81,15 +82,13 @@
 
 <script>
   import mp4box from 'mp4box'
-  import { mapState } from 'vuex'
   export default {
     name: 'Add',
 
     props: {
       instance: Function,
       dict: Object,
-      params: Object,
-      areaId: String
+      params: Object
     },
     data () {
       return {
@@ -99,10 +98,10 @@
           title: '',
           content: '',
           showIndex: '',
-          files: [],
+          videoUrl: [],
           pictureUrl: [],
-          contentType: '0',
-          thumbUrl: []
+          courseType: '0',
+          duration: ''
         },
         isLoading: false,
         cropOps: {
@@ -126,31 +125,31 @@
       }
     },
 
-    computed: {
-      ...mapState(['user'])
-    },
-
     created () {
-      if (this.params && this.params.id) {
-        this.id = this.params.id
-        this.getInfo(this.params.id)
-      }
+      this.dict.load('qjCourseType').then(() => {
+        if (this.params && this.params.id) {
+          this.getInfo(this.params.id)
+        }
+      })
     },
 
     methods: {
       getInfo (id) {
-        this.instance.post(`/app/appcontentinfo/queryDetailById?id=${id}`).then(res => {
+        this.instance.post(`/app/appcourseinfo/queryDetailById?id=${id}`).then(res => {
           if (res.code === 0) {
             this.form = res.data
             this.form.pictureUrl = res.data.pictureUrl ? [{
               url: res.data.pictureUrl
             }] : []
+            this.form.videoUrl = res.data.videoUrl ? [{
+              url: res.data.videoUrl
+            }] : []
           }
         })
       },
 
       onChange () {
-        this.form.files = []
+        this.form.videoUrl = []
       },
 
       submitUpload(file) {
@@ -181,14 +180,19 @@
             let formData = new FormData()
             formData.append('file', file.file);
             this.isLoading = true
-            this.instance.post(`/admin/file/add-unlimited`, formData).then(res => {
+            this.instance.post(`/admin/file/addVideo1`, formData).then(res => {
               if (res && res.data) {
-                let videoList = res.data[0].split(";");
+                let videoList = res.data[0].split(";")
+                this.form.duration = res.data[2]
 
-                this.form.files = [{
+                this.form.videoUrl = [{
                   id: videoList[1],
                   url: videoList[0]
                 }]
+                this.form.pictureUrl = [{
+                  id: res.data[1].split(";")[1],
+                  url: res.data[1].split(";")[0]
+                }]
               }
 
               this.isLoading = false
@@ -205,16 +209,13 @@
         this.$refs.form.validate((valid) => {
           if (valid) {
             this.isLoading = true
-            this.instance.post(`/app/appcontentinfo/addOrUpdate`, {
+            this.instance.post(`/app/appcourseinfo/addOrUpdate`, {
               ...this.form,
+              videoUrl: this.form.courseType === '1' ? this.form.videoUrl[0].url : '',
               pictureUrl: this.form.pictureUrl.length ? this.form.pictureUrl[0].url : ''
             }).then(res => {
               if (res.code == 0) {
-                if (this.needExamine === '1') {
-                  this.$message.success('提交成功，等待管理员审核')
-                } else {
-                  this.$message.success('提交成功')
-                }
+                this.$message.success('提交成功')
                 setTimeout(() => {
                   this.cancel(true)
                 }, 600)