政策添加附件

src/views/policy/library/add.vue

@@ -76,17 +76,62 @@
           <editor v-model="ruleForm.text" :min-height="192" />
         </div>
       </el-form-item>
-      <el-form-item v-if="!editPage">
+      <el-form-item label="附件">
+        <!-- <el-upload
+          action="https://jsonplaceholder.typicode.com/posts/"
+          :on-preview="handlePreview"
+          :on-remove="handleRemove"
+          :before-remove="beforeRemove"
+          multiple
+          :limit="3"
+          :on-exceed="handleExceed"
+          :file-list="fileList">
+          <el-button size="small" type="primary">点击上传</el-button>
+          <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+        </el-upload> -->
+        <!-- <el-upload ref="upload" :limit="3" accept=".xlsx, .xls, .docx" :headers="upload.headers"
+        :action="upload.url" :disabled="upload.isUploading"
+        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">
+          将文件拖到此处，或
+          <em>点击上传</em>
+        </div>
+        <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
+      </el-upload> -->
+
+      <el-button type="info" size="small" @click="upload.open = true">添加附件</el-button>
+      
+      </el-form-item>
+      <el-form-item v-if="ruleForm.method!==1">
+      <!-- <el-form-item v-if="!editPage"> -->
         <el-button type="primary" @click="submitForm('ruleForm')"
           >确定</el-button
         >
         <!-- <el-button @click="resetForm('ruleForm')">重置</el-button> -->
       </el-form-item>
     </el-form>
+    <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
+      <el-upload ref="upload" :limit="1" accept=".xlsx, .xls, .docx" :headers="upload.headers"
+        :action="upload.url" :disabled="upload.isUploading"
+        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">
+          将文件拖到此处，或
+          <em>点击上传</em>
+        </div>
+        <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
+      </el-upload>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitFileForm">确 定</el-button>
+        <el-button @click="upload.open = false">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
 import Editor from '@/components/Editor';
+import { getToken } from "@/utils/auth";
 import { addPolicy, updatePolicy, getPolicyInfo } from '@/api/policy/library';
 import { getCityByLevel } from '@/api/policy/library';
 export default {
@@ -95,6 +140,18 @@ export default {
   },
   data() {
     return {
+      upload: {
+        // 是否显示弹出层（用户导入）
+        open: false,
+        // 弹出层标题（用户导入）
+        title: "添加附件",
+        // 是否禁用上传
+        isUploading: false,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/minio/upload"
+      },
       editPage: false,
       ruleForm: {
         title: '',
@@ -175,7 +232,7 @@ export default {
               this.msgSuccess(message);
             });
           }
-          this.$router.go(-1);
+          // this.$router.go(-1);
         } else {
           console.log('error submit!!');
           return false;
@@ -185,6 +242,22 @@ export default {
     // resetForm(formName) {
     //   this.$refs[formName].resetFields();
     // }
+    // 文件上传中处理
+    handleFileUploadProgress (event, file, fileList) {
+      this.upload.isUploading = true;
+    },
+    // 文件上传成功处理
+    handleFileSuccess (response, file, fileList) {
+      this.ruleForm.text+=`<div>附件<a href="${response.data.url}">${response.data.name}</a></div>`
+      this.upload.open = false;
+      this.upload.isUploading = false;
+      this.$refs.upload.clearFiles();
+      this.$alert(response.message, "导入结果", { dangerouslyUseHTMLString: true });
+    },
+    // 提交上传文件
+    submitFileForm () {
+      this.$refs.upload.submit();
+    },
   },
   watch: {
     ruleForm: {