Browse Source

资讯 活动 增加海报图

魏熙美 5 years ago
parent
commit
0091b9e73f
3 changed files with 63 additions and 6 deletions
  1. 18
    0
      src/views/activity/add.vue
  2. 23
    4
      src/views/activity/edit.vue
  3. 22
    2
      src/views/news/edi/index.vue

+ 18
- 0
src/views/activity/add.vue View File

22
             <img width="100%" :src="dialogImageUrl" alt="">
22
             <img width="100%" :src="dialogImageUrl" alt="">
23
           </el-dialog>
23
           </el-dialog>
24
     </el-form-item>
24
     </el-form-item>
25
+      <el-form-item label="海报图:" prop="buildingId">
26
+          <el-upload
27
+                  class="avatar-uploader"
28
+                  :headers="uploadHeaders"
29
+                  :action="upFileUrl"
30
+                  :show-file-list="false"
31
+                  :on-success="shareImageHandleAvatarSuccess">
32
+              <img v-if="shareImageUrl" :src="shareImageUrl" class="avatar">
33
+              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
34
+          </el-upload>
35
+      </el-form-item>
25
     <el-form-item label="活动标题" prop="title">
36
     <el-form-item label="活动标题" prop="title">
26
       <el-input v-model="activityQuery.title"></el-input>
37
       <el-input v-model="activityQuery.title"></el-input>
27
     </el-form-item>
38
     </el-form-item>
75
       upFileUrl: apis.file.upload.url,
86
       upFileUrl: apis.file.upload.url,
76
       radio:'1',
87
       radio:'1',
77
       imgList: [],
88
       imgList: [],
89
+      shareImageUrl: '',
78
       dialogVisible: false,
90
       dialogVisible: false,
79
       dialogImageUrl: "",
91
       dialogImageUrl: "",
80
       activityQuery: {
92
       activityQuery: {
88
        enlistStart:'',
100
        enlistStart:'',
89
        enlistEnd:'',
101
        enlistEnd:'',
90
        personNum:'',
102
        personNum:'',
103
+       shareImg: ''
91
       },
104
       },
92
       rules: {
105
       rules: {
93
           buildingId: [
106
           buildingId: [
186
       this.updateDetail({...this.dynamic, imgUrl: res.data})
199
       this.updateDetail({...this.dynamic, imgUrl: res.data})
187
       this.loading.close()
200
       this.loading.close()
188
     },
201
     },
202
+    shareImageHandleAvatarSuccess(res, file) { // 海报图
203
+          this.shareImageUrl = URL.createObjectURL(file.raw);
204
+          // console.log(res)
205
+          this.activityQuery.shareImg = res.data
206
+    },
189
     onSubmit (formName) {
207
     onSubmit (formName) {
190
       this.$refs[formName].validate((valid) => {
208
       this.$refs[formName].validate((valid) => {
191
       if (valid) {
209
       if (valid) {

+ 23
- 4
src/views/activity/edit.vue View File

15
         <i v-else class="el-icon-plus avatar-uploader-icon"></i>
15
         <i v-else class="el-icon-plus avatar-uploader-icon"></i>
16
       </el-upload>
16
       </el-upload>
17
     </el-form-item>
17
     </el-form-item>
18
+    <el-form-item label="海报图:" prop="buildingId">
19
+      <el-upload
20
+              class="avatar-uploader"
21
+              :headers="uploadHeaders"
22
+              :action="upFileUrl"
23
+              :show-file-list="false"
24
+              :on-success="shareImageHandleAvatarSuccess">
25
+        <img v-if="shareImageUrl" :src="shareImageUrl" class="avatar">
26
+        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
27
+      </el-upload>
28
+    </el-form-item>
18
     <el-form-item label="活动标题" prop="title">
29
     <el-form-item label="活动标题" prop="title">
19
       <el-input v-model="activityQuery.title"></el-input>
30
       <el-input v-model="activityQuery.title"></el-input>
20
     </el-form-item>
31
     </el-form-item>
71
       upFileUrl: apis.file.upload.url,
82
       upFileUrl: apis.file.upload.url,
72
       radio:'1',
83
       radio:'1',
73
       imageUrl: '',
84
       imageUrl: '',
85
+      shareImageUrl: '',
74
       imgList: [],
86
       imgList: [],
75
       dialogVisible: false,
87
       dialogVisible: false,
76
       dialogImageUrl: "",
88
       dialogImageUrl: "",
86
        enlistStart:'',
98
        enlistStart:'',
87
        enlistEnd:'',
99
        enlistEnd:'',
88
        address:'',
100
        address:'',
89
-       personNum:''
101
+       personNum:'',
102
+       shareImg: ''
90
       },
103
       },
91
       rules: {
104
       rules: {
92
           buildingId: [
105
           buildingId: [
189
     handleAvatarSuccess (res) {
202
     handleAvatarSuccess (res) {
190
       this.imageUrl = res.data
203
       this.imageUrl = res.data
191
     },
204
     },
205
+    shareImageHandleAvatarSuccess(res, file) { // 海报图
206
+      this.shareImageUrl = URL.createObjectURL(file.raw);
207
+      // console.log(res)
208
+      this.activityQuery.shareImg = res.data
209
+    },
192
     onSubmit (formName) {
210
     onSubmit (formName) {
193
       this.$refs[formName].validate((valid) => {
211
       this.$refs[formName].validate((valid) => {
194
       if (valid) {
212
       if (valid) {
244
         this.activityQuery.desc = data.desc
262
         this.activityQuery.desc = data.desc
245
         this.activityQuery.enlistStart = dayjs(data.enlistStart).toDate()
263
         this.activityQuery.enlistStart = dayjs(data.enlistStart).toDate()
246
         this.activityQuery.enlistEnd = dayjs(data.enlistEnd).toDate()
264
         this.activityQuery.enlistEnd = dayjs(data.enlistEnd).toDate()
247
-        
248
-       
265
+        this.activityQuery.shareImg = data.shareImg
266
+        this.shareImageUrl = data.shareImg
267
+
249
         })
268
         })
250
     },
269
     },
251
     formateDate(dt) {
270
     formateDate(dt) {
262
 }
281
 }
263
 </script>
282
 </script>
264
 
283
 
265
-<style lang="scss">
284
+<style lang="scss" scoped>
266
   .avatar-uploader .el-upload {
285
   .avatar-uploader .el-upload {
267
     border: 1px dashed #d9d9d9;
286
     border: 1px dashed #d9d9d9;
268
     border-radius: 6px;
287
     border-radius: 6px;

+ 22
- 2
src/views/news/edi/index.vue View File

22
                     <i v-else class="el-icon-plus avatar-uploader-icon"></i>
22
                     <i v-else class="el-icon-plus avatar-uploader-icon"></i>
23
                 </el-upload>
23
                 </el-upload>
24
             </el-form-item>
24
             </el-form-item>
25
+            <el-form-item label="海报图片">
26
+                <el-upload
27
+                        class="avatar-uploader"
28
+                        :headers="uploadHeaders"
29
+                        :action="upFileUrl"
30
+                        :show-file-list="false"
31
+                        :on-success="shareImageHandleAvatarSuccess">
32
+                    <img v-if="shareImageUrl" :src="shareImageUrl" class="avatar">
33
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
34
+                </el-upload>
35
+            </el-form-item>
25
             <el-form-item label="资讯标题">
36
             <el-form-item label="资讯标题">
26
                 <el-input v-model="form.newsName"></el-input>
37
                 <el-input v-model="form.newsName"></el-input>
27
             </el-form-item>
38
             </el-form-item>
64
         data() {
75
         data() {
65
             return {
76
             return {
66
                 upFileUrl: apis.file.upload.url,
77
                 upFileUrl: apis.file.upload.url,
67
-                imageUrl: '',
78
+                imageUrl: '', // 资讯图预览
79
+                shareImageUrl: '', // 海报图预览
68
                 optionNewsStatus: [
80
                 optionNewsStatus: [
69
                     {
81
                     {
70
                         name: '已发布',
82
                         name: '已发布',
79
                     newsId: '',
91
                     newsId: '',
80
                     newsTypeId: '',
92
                     newsTypeId: '',
81
                     newsImg: '',
93
                     newsImg: '',
94
+                    shareImg: '',
82
                     newsName: '',
95
                     newsName: '',
83
                     buildingId: '',
96
                     buildingId: '',
84
                     newsStatus: '',
97
                     newsStatus: '',
126
                 console.log('富文本值:', value)
139
                 console.log('富文本值:', value)
127
                 this.form.newsDetail = value
140
                 this.form.newsDetail = value
128
             },
141
             },
129
-            handleAvatarSuccess(res, file) {
142
+            handleAvatarSuccess(res, file) { // 资讯图
130
                 this.imageUrl = URL.createObjectURL(file.raw);
143
                 this.imageUrl = URL.createObjectURL(file.raw);
131
                 // console.log(res)
144
                 // console.log(res)
132
                 this.form.newsImg = res.data
145
                 this.form.newsImg = res.data
133
             },
146
             },
147
+            shareImageHandleAvatarSuccess(res, file) { // 海报图
148
+                this.shareImageUrl = URL.createObjectURL(file.raw);
149
+                // console.log(res)
150
+                this.form.shareImg = res.data
151
+            },
134
             getTypeList() {
152
             getTypeList() {
135
                 this.$store.dispatch('news/getTypeList', this.typeForm).then((res) => {
153
                 this.$store.dispatch('news/getTypeList', this.typeForm).then((res) => {
136
                     this.typeList = res.records
154
                     this.typeList = res.records
182
                     this.form.newsTypeId = res.newsTypeId
200
                     this.form.newsTypeId = res.newsTypeId
183
                     this.form.newsStatus = res.newsStatus
201
                     this.form.newsStatus = res.newsStatus
184
                     this.form.newsImg = res.newsImg
202
                     this.form.newsImg = res.newsImg
203
+                    this.form.shareImg = res.shareImg
204
+                    this.shareImageUrl = res.shareImg
185
                     this.imageUrl = res.newsImg
205
                     this.imageUrl = res.newsImg
186
                     this.form.buildingId = res.buildingId
206
                     this.form.buildingId = res.buildingId
187
                     this.form.newsDetail = res.newsDetail
207
                     this.form.newsDetail = res.newsDetail