From 1861d195f7f3a7364c1099356858c94a6c0741e2 Mon Sep 17 00:00:00 2001
From: 明梦爽 <2972214568@qq.com>
Date: 星期三, 02 三月 2022 18:11:16 +0800
Subject: [PATCH] 所有功能实现

---
 src/components/Administrator/EditLunBo.vue |   95 ++++++++++++++++++++++++++++++++++-------------
 1 files changed, 68 insertions(+), 27 deletions(-)

diff --git a/src/components/Administrator/EditLunBo.vue b/src/components/Administrator/EditLunBo.vue
index 47900d7..b8ae69d 100644
--- a/src/components/Administrator/EditLunBo.vue
+++ b/src/components/Administrator/EditLunBo.vue
@@ -3,29 +3,23 @@
     <el-row><h3 style="margin-top: 0px">{{ $route.query.title }}</h3></el-row>
     鏂伴椈鏍囬锛�<el-input v-model="title" placeholder="璇疯緭鍏ユ柊闂绘爣棰�"></el-input><br/><br/>
     鍙戝竷鏃ユ湡锛�<el-date-picker  format="yyyy 骞� MM 鏈� dd 鏃�" value-format="yyyy-MM-dd" v-model="releaseTime" placeholder="璇烽�夋嫨鏂伴椈鍙戝竷鏃ユ湡"></el-date-picker><br/><br/>
-    <el-upload
-      class="upload-demo"
-      drag
-      action="http://localhost:8080//news/add"
-      :on-remove="handleRemove"
-      multiple>
-      <i class="el-icon-upload"></i>
-      <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
-      <div class="el-upload__tip" slot="tip">鍙兘涓婁紶jpg/png鏂囦欢锛屼笖涓嶈秴杩�500kb</div>
-    </el-upload><br/>
+    <input type="file" @change="chooseFile"/><br/><br/>
     鏂伴椈鍐呭锛�<quill-editor ref="text" v-model="content" class="myQuillEditor" :options="editorOption" />
     <el-row style="margin-top:50px;">
       <el-button  type="success" @click="submit">鍙戝竷</el-button>
     </el-row>
-    杞挱鍥�
   </div>
 </template>
 <script>
-import { add } from '../../api/api'
-import { quillEditor } from 'vue-quill-editor'
+import { add,fileUpload, login } from '../../api/api'
+import {quillEditor,Quill} from 'vue-quill-editor'
 import 'quill/dist/quill.core.css'
 import 'quill/dist/quill.snow.css'
 import 'quill/dist/quill.bubble.css'
+import { container, ImageExtend,QuillWatch } from 'quill-image-extend-module'
+Quill.register('modules/ImageExtend', ImageExtend)
+// axios.defaults.withCredentials = true;
+
 export default {
   components:{ quillEditor },
   data(){
@@ -33,17 +27,58 @@
       title:'', //鏍囬鍐呭
       releaseTime:'', //鍙戝竷鏃ユ湡
       content: '',  //鏂伴椈鍐呭
-      newsCategoryId:2,
+      newsCategoryId:45,
       editorOption: {
         placeholder: "璇疯緭鍏ユ鏂�",
-        // editorOption閲屾槸鏀惧浘鐗囦笂浼犻厤缃弬鏁扮敤鐨勶紝渚嬪锛�
-        action:  '/api/product/richtext_img_upload.do',  // 蹇呭~鍙傛暟 鍥剧墖涓婁紶鍦板潃
-        methods: 'POST',  // 蹇呭~鍙傛暟 鍥剧墖涓婁紶鏂瑰紡
-        token: '',  // 鍙�夊弬鏁� 濡傛灉闇�瑕乼oken楠岃瘉锛屽亣璁句綘鐨則oken鏈夊瓨鏀惧湪sessionStorage
-        name: 'upload_file',  // 蹇呭~鍙傛暟 鏂囦欢鐨勫弬鏁板悕
-        size: 10000000,  // 鍙�夊弬鏁�   鍥剧墖澶у皬锛屽崟浣嶄负Kb, 1M = 1024Kb
-        accept: 'multipart/form-data, image/png, image/gif, image/jpeg, image/bmp, image/x-icon,image/jpg'  // 鍙�� 鍙笂浼犵殑鍥剧墖鏍煎紡
+        modules: {
+            ImageExtend: {  // 濡傛灉涓嶄綔璁剧疆锛屽嵆{}  鍒欎緷鐒跺紑鍚鍒剁矘璐村姛鑳戒笖浠ase64鎻掑叆 
+                name: 'file',  // 鍥剧墖鍙傛暟鍚�
+                loading: true,
+                size: 10,  // 鍙�夊弬鏁� 鍥剧墖澶у皬锛屽崟浣嶄负M锛�1M = 1024kb
+                action:'http://localhost:7070/uploading',
+                response: (res) => {
+                  console.log(res);
+                    return 'http://localhost:7070/'+res.data
+                },
+                headers: (xhr) => {
+                  // axios.defaults.withCredentials = true;
+                  // xhr.setRequestHeader('Cookie','NMTID=00OVM6QOJcTDVhqDUtvgSnd-5FBxLcAAAF9nTiDHg; JSESSIONID=5ACC52D29A2434E09450CB975E08C288')
+                },  // 鍙�夊弬鏁� 璁剧疆璇锋眰澶撮儴
+                sizeError: () => {},  // 鍥剧墖瓒呰繃澶у皬鐨勫洖璋�
+                start: () => {},  // 鍙�夊弬鏁� 鑷畾涔夊紑濮嬩笂浼犺Е鍙戜簨浠�
+                end: () => {},  // 鍙�夊弬鏁� 鑷畾涔変笂浼犵粨鏉熻Е鍙戠殑浜嬩欢锛屾棤璁烘垚鍔熸垨鑰呭け璐�
+                error: () => {},  // 鍙�夊弬鏁� 涓婁紶澶辫触瑙﹀彂鐨勪簨浠�
+                success: () => {},  // 鍙�夊弬鏁�  涓婁紶鎴愬姛瑙﹀彂鐨勪簨浠�
+                change: (xhr, formData) => {
+                // formData.append('token', 'myToken')
+                } // 鍙�夊弬鏁� 姣忔閫夋嫨鍥剧墖瑙﹀彂锛屼篃鍙敤鏉ヨ缃ご閮紝浣嗘瘮headers澶氫簡涓�涓弬鏁帮紝鍙缃甪ormData
+            },
+            toolbar:{
+                container:[
+                    ['bold', 'italic', 'underline', 'strike'],        //鍔犵矖锛屾枩浣擄紝涓嬪垝绾匡紝鍒犻櫎绾�
+                    ['blockquote', 'code-block'],         //寮曠敤锛屼唬鐮佸潡
+                    [{ 'header': 1 }, { 'header': 2 }],               // 鏍囬锛岄敭鍊煎鐨勫舰寮忥紱1銆�2琛ㄧず瀛椾綋澶у皬
+                    [{ 'list': 'ordered'}, { 'list': 'bullet' }],          //鍒楄〃
+                    [{ 'script': 'sub'}, { 'script': 'super' }],      // 涓婁笅鏍�
+                    [{ 'indent': '-1'}, { 'indent': '+1' }],          // 缂╄繘
+                    [{ 'direction': 'rtl' }],                         // 鏂囨湰鏂瑰悜
+                    [{ 'size': ['small', false, 'large', 'huge'] }],  // 瀛椾綋澶у皬
+                    [{ 'header': [1, 2, 3, 4, 5, 6, false] }],         //鍑犵骇鏍囬
+                    [{ 'color': [] }, { 'background': [] }],          // 瀛椾綋棰滆壊锛屽瓧浣撹儗鏅鑹�
+                    [{ 'font': [] }],         //瀛椾綋
+                    [{ 'align': [] }],        //瀵归綈鏂瑰紡
+                    ['clean'],        //娓呴櫎瀛椾綋鏍峰紡
+                    ['image']        //涓婁紶鍥剧墖銆佷笂浼犺棰�
+                ],
+                handlers: {
+                    'image': function () {  // 鍔寔鍘熸潵鐨勫浘鐗囩偣鍑绘寜閽簨浠�
+                        QuillWatch.emit(this.quill.id)
+                    }
+                }
+            },
+        },
       } ,  //缂栬緫鍣ㄦ柊闂诲璞�
+      fileList:[],
     }
   },
   created(){
@@ -51,20 +86,26 @@
     this.newsCategoryId = this.$route.query.id
   },
   methods:{
-    handleRemove(file,fileList){
-      console.log(file,fileList);
+    chooseFile(file) {
+      this.pictureFile = file.target.files[0];
+      console.log(this.pictureFile)
+      console.log(file);
+      return false;
     },
     submit(){
+      const fd = new FormData();
+      fd.append('pictureFile',this.pictureFile);
       const data = {
         newsCategoryId:this.newsCategoryId,
         content:this.content,
-        title:this.title,
         releaseTime:this.releaseTime,
-        pictureFile:this.file,
+        title:this.title
       }
-      add(data).then(res => {
+      // console.log(999)
+      add(data,fd).then(res => {
         console.log(res);
-        if(res.code !== 200){
+        console.log(this.newsCategoryId);
+        if (res.code != 200) {
           return this.$message.error('鍙戝竷鏂伴椈澶辫触锛岃閲嶈瘯锛�')
         }else{
           this.$message.success('鏂伴椈鍙戝竷鎴愬姛锛�')

--
Gitblit v1.8.0