clay commit : 第一阶段完成

ebts-ui/src/views/sist/article/components/article.vue

@@ -105,6 +105,26 @@
           </el-form-item>
         </el-col>
       </el-row>
+
+      <el-row>
+        <el-col :offset="1" :span="22">
+
+          <el-upload
+            class="upload-demo"
+            ref="upload"
+            :action="uploadFileUrl"
+            :headers="headers"
+            :on-remove="handleRemove"
+            :on-success="handleUploadSuccess"
+            :file-list="fileList"
+            :auto-upload="true"
+          >
+            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
+            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+          </el-upload>
+
+        </el-col>
+      </el-row>
       <el-row>
         <el-col :offset="1" :span="22">
           <Editor v-model="formData.content" :height="800"/>
@@ -122,20 +142,31 @@
   </div>
 </template>
 <script>
+// import ArticleFile from './ArticleFile'
 import Editor from '@/components/Editor';
 import {updateArticle, getArticle, drafts, getArticleType, getArticleApprove} from "@/api/sist/article";
 import {Message} from "element-ui";
 import UploadFile from '@/views/utils/uploadFile.vue';
 import { getArticleNav } from '../../../../api/sist/article'
+import { getToken } from '../../../../utils/auth'
+import { addFile, delFile } from '../../../../api/sist/file'
 
 export default {
   components: {
     Editor,
-    UploadFile
+    UploadFile,
+    // ArticleFile
   },
   props: [],
   data() {
     return {
+      isAdmin:false,
+      uploadFileUrl: process.env.VUE_APP_BASE_API + '/common/upload', // 上传的图片服务器地址
+      headers: {
+        Authorization: 'Bearer ' + getToken()
+      },
+      fileList:[],
+      fileMapper:[],
       submit: 1,
       imgurlShow:false,
       formData: {
@@ -219,21 +250,22 @@ export default {
         this.formData = response.data
         if (this.formData.siteType === '2') {
           this.approveShow.sist = false
-          this.params.labArticleType = parseInt(this.formData.type)
-          this.getLabApprove(this.params.labArticleType)
+          if (null != this.formData.navId){
+            this.params.labArticleType = parseInt(this.formData.navId)
+            this.getLabApprove(this.params.labArticleType)
+          }
         } else if (this.formData.siteType === '1') {
           this.approveShow.lab = false
-          this.params.sistArticleType = parseInt(this.formData.type)
-          this.getSistApprove(this.params.sistArticleType)
+          if (null != this.formData.navId){
+            this.params.sistArticleType = parseInt(this.formData.navId)
+            this.getSistApprove(this.params.sistArticleType)
+          }
         }
       })
     }
     this.getDicts("article_site_type").then(response => {
       this.sitetypeOptions = response.data;
     });
-    // this.getDicts("article_type").then(response => {
-    //   this.articleTypeOptions = response.data;
-    // });
     this.getDicts("is_top").then(response => {
       this.isTopOptions = response.data;
     });
@@ -256,28 +288,54 @@ export default {
           this.labArticleTypeOption.push(item)
         }
       }
-      console.log(res)
     })
-    // getArticleType().then(res => {
-    //   let dictCodes = res.data
-    //   let articleList = this.articleTypeOptions
-    //   console.log("dictCodes",dictCodes,"articleList",articleList)
-    //   for (let i = 0; i < articleList.length; i++) {
-    //     for (let j = 0; j < dictCodes.length; j++) {
-    //       if (articleList[i].dictCode == dictCodes[j]) {
-    //         if (articleList[i].attribute2 == 1) {
-    //           this.sistArticleTypeOption.push(articleList[i])
-    //         } else if (articleList[i].attribute2 == 2) {
-    //           this.labArticleTypeOption.push(articleList[i])
-    //         }
-    //       }
-    //     }
-    //   }
-    // })
   },
   mounted() {
   },
   methods: {
+    handleRemove(file, fileList) {
+      let fileId = null
+      let index = 0
+      for (let item of this.fileMapper) {
+        console.log(file.uid, item)
+        if (file.uid == item.uid) {
+          fileId = item.id
+          break
+        }
+        index++
+      }
+      console.log(index)
+      let that = this
+      delFile(fileId).then(res => {
+        that.fileMapper.splice(index, 1)
+        console.log(that.fileMapper)
+        that.$message.success('提交成功!')
+      })
+    },
+    // 上传成功回调
+    handleUploadSuccess(res, file) {
+      let data = {
+        isPublic: '1',
+        fileType: '',
+        fileName:res.fileName,
+        fileAddr: res.fileAddr
+      }
+      addFile(data).then(res => {
+        console.log(res)
+        let dataFile = res.data
+        let mapperItem = {
+          id: dataFile.fileId,
+          uid: file.uid,
+          url:dataFile.url,
+          fileName:data.fileName,
+        }
+        let fileStr = '<p><a target="_blank" href="'+mapperItem.url+'">'+mapperItem.fileName+'</a><br/></p>'
+        this.formData.content = this.formData.content + fileStr
+        this.fileMapper.push(mapperItem)
+      })
+      this.$message.success('提交成功!')
+    },
+
     getSistApprove(navId) {
       this.judgeThumbnail(navId)
       getArticleApprove(navId).then(res => {
@@ -323,13 +381,6 @@ export default {
             })
             return
           }
-          // if (that_.imgurlShow&&(that_.formData.imgurl == ''||that_.formData.imgurl == null)){
-          //   Message({
-          //     message: "请选择缩略图",
-          //     type: "error",
-          //   })
-          //   return;
-          // }
         }
         that_.formData.params = that_.params
         if (that_.submit == 0) {
@@ -360,16 +411,16 @@ export default {
       this.$router.push({path: "/SIST/article/", query: {t: Date.now()}})
     },
     saveDrafts() {
-      let that_ = this
+      let that = this
       this.$refs['elForm'].validate(valid => {
-        drafts(this.formData).then(res => {
-          if (this.formData.id == null || this.formData.id == "") {
-            this.formData.id = res.data
+        drafts(that.formData).then(res => {
+          if (that.formData.id == null || this.formData.id == "") {
+            that.formData.id = res.data
           }
           if (res.code == 200) {
-            that_.msgSuccess('保存成功');
+            that.msgSuccess('保存成功');
           } else {
-            that_.Message({
+            that.Message({
               message: res.code,
               type: "error"
             })