From e03af8e839791f7bd00ee5b4f8af2d90d5e0be41 Mon Sep 17 00:00:00 2001
From: qinjie <jqinjie@foxmail.com>
Date: Mon, 1 Nov 2021 21:42:12 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E5=A4=B4=E5=83=8F=EF=BC=8C?=
 =?UTF-8?q?=E7=AD=89=E5=BE=85=E7=BB=A7=E7=BB=AD=E5=B0=81=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/course/CourseAdd.vue | 105 +++++++++++++++++++++------------
 1 file changed, 66 insertions(+), 39 deletions(-)

diff --git a/src/views/course/CourseAdd.vue b/src/views/course/CourseAdd.vue
index 2dc0e09..22db19b 100644
--- a/src/views/course/CourseAdd.vue
+++ b/src/views/course/CourseAdd.vue
@@ -5,10 +5,7 @@
         <!-- 课程名称 -->
         <a-col :span="18" :offset="3">
           <a-form-model-item label="课程名称" :label-col="{ span: 4 }" :wrapper-col="{ span: 15 }">
-            <a-input
-              v-model="form.courseName"
-              v-decorator="['courseName', { rules: [{ required: true, message: '请填写课程名称' }] }]"
-            />
+            <a-input v-model="form.courseName" v-decorator="['courseName', { rules: [{ required: true, message: '请填写课程名称' }] }]" />
           </a-form-model-item>
         </a-col>
 
@@ -25,14 +22,7 @@
         <!-- 课时 -->
         <a-col :span="9">
           <a-form-item label="课时" :label-col="{ span: 4 }" :wrapper-col="{ span: 10 }">
-            <a-input-number
-              id="hour"
-              v-model="dataValue"
-              :min="1"
-              :max="1000"
-              @change="onChange"
-              :style="{ display: 'ln', width: '100%' }"
-            />
+            <a-input-number id="hour" v-model="dataValue" :min="1" :max="1000" @change="onChange" :style="{ display: 'ln', width: '100%' }" />
             {{ dataValue }}分钟
           </a-form-item>
         </a-col>
@@ -79,28 +69,32 @@
             <a-input v-model="form.remark" type="textarea" />
           </a-form-model-item>
         </a-col>
-        <a-button @click="save">保存</a-button>
 
         <!-- 上传封面图片 -->
-        <!-- <a-col :span="18" :offset="3">
-        <a-form-model-item label="上传封面图片" :label-col="{ span: 4 }" :wrapper-col="{ span: 15 }">
-          <a-upload
-            name="avatar"
-            list-type="picture-card"
-            class="avatar-uploader"
-            :show-upload-list="false"
-            action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
-            :before-upload="beforeUpload"
-            @change="handleChange"
-          >
-            <img v-if="imageUrl" :src="imageUrl" alt="avatar" />
-            <div v-else>
-              <a-icon :type="loading ? 'loading' : 'plus'" />
-              <div class="ant-upload-text">封面图片</div>
-            </div>
-          </a-upload>
-        </a-form-model-item>
-      </a-col> -->
+        <a-col :span="18" :offset="3">
+          <a-form-model-item label="上传封面图片" :label-col="{ span: 4 }" :wrapper-col="{ span: 15 }">
+            <a-upload action="/dawa/sys/oss/upload?sourceId=course" list-type="picture-card" :file-list="fileList" :headers="getToken()" @change="handleChange" @preview="handlePreview">
+              <div v-if="fileList.length < 1">
+                <a-icon type="plus" />
+                <div class="ant-upload-text">上传</div>
+              </div>
+            </a-upload>
+            <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
+              <img alt="example" style="width: 100%" :src="previewImage" />
+            </a-modal>
+
+            <!-- <a-upload name="file" list-type="picture-card" class="avatar-uploader" :show-upload-list="false" action="" :headers="getToken()" :change="onSuccess">
+              <img v-if="imageUrl" :src="imageUrl" alt="avatar" />
+              <div v-else>
+                <a-icon :type="loading ? 'loading' : 'plus'" />
+                <div class="ant-upload-text">封面图片</div>
+              </div>
+            </a-upload> -->
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row :span="18" :offset="3">
+        <a-button @click="save">保存</a-button>
       </a-row>
     </a-form-model>
   </a-card>
@@ -109,7 +103,9 @@
 
 
 <script>
-import { courseAdd, getCourseDetails} from '@/api/course/course'
+import { courseAdd, getCourseDetails } from '@/api/course/course'
+import storage from 'store'
+import { ACCESS_TOKEN } from '@/store/mutation-types'
 
 export default {
   name: 'step1',
@@ -122,6 +118,11 @@ export default {
         { id: '2', name: '人员类别2' },
         { id: '3', name: '人员类别3' },
       ],
+
+      previewVisible: false,
+      fileList: []
+
+
     }
   },
   components: {
@@ -129,14 +130,16 @@ export default {
     getCourseDetails
   },
   created() {
-    getCourseDetails({id: this.$route.query.id }).then(res => { 
-      this.form = res.data;
+    if (this.$route.query.id) {
+      getCourseDetails({ id: this.$route.query.id }).then(res => {
+        this.form = res.data;
 
-      this.form.courseType = this.form.courseType+'';
-      this.form.industryInvolved = this.form.industryInvolved + '';
-      this.form.isRequired = this.form.isRequired + '';
+        this.form.courseType = this.form.courseType + '';
+        this.form.industryInvolved = this.form.industryInvolved + '';
+        this.form.isRequired = this.form.isRequired + '';
 
-    });
+      });
+    }
   },
   methods: {
     //获取字典值
@@ -160,6 +163,30 @@ export default {
         }
       })
     },
+
+    getToken() {
+      let hreader = {};
+      hreader[ACCESS_TOKEN] = storage.get(ACCESS_TOKEN);
+      return hreader;
+    },
+    onSuccess(file) {
+      console.log('1---', file);
+
+    },
+    handleCancel() {
+      this.previewVisible = false;
+    },
+    async handlePreview(file) {
+      if (!file.url && !file.preview) {
+        file.preview = await getBase64(file.originFileObj);
+      }
+      this.previewImage = file.url || file.preview;
+      this.previewVisible = true;
+    },
+    handleChange({ fileList }) {
+      this.fileList = fileList;
+    },
+
   },
 }
 </script>