feats

src/apis.js

@@ -61,6 +61,12 @@ const apis = {
       url: `${prefix}/excel/winner`,
       method: 'get',
     }
+  },
+  file: {
+    upload: {
+      url: `${prefix}/file`,
+      method: 'post',
+    }
   }
 }
 

src/components/prize.vue

@@ -23,6 +23,9 @@
       <el-table-column
         prop="Picture"
         label="图片">
+        <template slot-scope="scope">
+          <img :src="scope.row.Picture" width="60" alt="">
+        </template>
       </el-table-column>
     </el-table>
     <el-dialog
@@ -40,6 +43,12 @@
           <el-input-number v-model="formData.Stock" :min="1"></el-input-number>
         </el-form-item>
         <el-form-item label="图片">
+          <el-upload
+            :action="uploadAction"
+            :on-success="onSuccess"
+            list-type="picture">
+            <el-button size="small" type="primary">点击上传</el-button>
+          </el-upload>
         </el-form-item>
         <el-form-item>
           <el-button type="primary" @click="onSubmit">确定</el-button>
@@ -54,6 +63,7 @@ export default {
   name: 'setting',
   props: [
     'data',
+    'uploadAction',
   ],
   data() {
     return {
@@ -71,6 +81,9 @@ export default {
     onSubmit() {
       this.$emit('submit', { ...this.formData })
       this.dialogVisible = false
+    },
+    onSuccess(response) {
+      this.formData.Picture = response.message.url
     }
   }
 }

src/pages/admin.vue

@@ -17,7 +17,7 @@
           <winner :data="winners" :prizes="prizes" @search="searchWinner" @cancel="cancelWinner" @exportExcel="exportExcel"></winner>
         </el-tab-pane>
         <el-tab-pane label="奖品管理" name="prize">
-          <prize :data="prizes" @submit="savePrize"></prize>
+          <prize :data="prizes" :uploadAction="uploadAction" @submit="savePrize"></prize>
         </el-tab-pane>
       </el-tabs>
     </el-main>
@@ -51,6 +51,8 @@ export default {
       prizes: [],
       // 抽奖配置
       settings: [],
+
+      uploadAction: getApi('file.upload').url,
     }
   },
   methods: {