活动管理上传文件完成

src/views/activityManage/makerActvity.vue

@@ -257,25 +257,26 @@
       :visible.sync="endDialog"
       width="600px"
       class="endDialog"
-      :before-close="init">
+      :before-close="cancelEndTableFile">
       <div class="addDialogLogo">LOGO</div>
       <div class="deleteContent">"{{ endTable.title }}"项目活动，是否确定完结？</div>
       <div class="deleteContent1">活动完结报告</div>
-      <div class="download" v-if="endTable.file!=''">
-        <div>{{ endTable.file!=''&&endTable.file!=null?endTable.file.fileName:"" }}</div>
+      <div class="download" v-for="item in endTable.file">
+        <div>{{ item.fileName }}</div>
+        <el-button type="primary" @click="delEndTableFile(item.fid)" size="mini">删除文件</el-button>
       </div>
-      <div class="addMoneyBtn" style="margin-left: 0;" v-if="endTable.file==''||endTable.file==null">
+      <div class="addMoneyBtn">
           <div class="jia">+</div>添加
           <div id="upFile">
             <beUpload @getFile="getFile" :navName="'上传文件'" :accept="accept"> </beUpload>
           </div>
       </div>
-      <div class="DelBtn" style="margin-left: 0;" v-if="endTable.file!=''&&endTable.file!=null">
+      <!-- <div class="DelBtn" style="margin-left: 0;" v-if="endTable.file!=''&&endTable.file!=null">
           <el-button type="primary" @click="endTable.file=''">删除文件</el-button>
-      </div>
+      </div> -->
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="ending" class="diaBtn">确认提交</el-button>
-        <el-button @click="init" class="diaBtn">取消</el-button>
+        <el-button @click="cancelEndTableFile" class="diaBtn">取消</el-button>
       </div>
     </el-dialog>
     <!-- 完结对话框结束 -->
@@ -293,6 +294,7 @@
 
 <script>
 import beUpload from '../../components/tool/beUpload'
+import { uuid } from 'vue-uuid';
     export default {
       components:{beUpload},
       data() {
@@ -333,15 +335,31 @@ import beUpload from '../../components/tool/beUpload'
           endTable:{
             Id:"",
             title:"",
-            file:"",
+            file:[],
           }
         }
       },
       methods:{
         getFile(val) {//上传文件
-          this.endTable.file = val;
+          val.fid = uuid.v1();
+          this.endTable.file.push(val);
+        },
+        delEndTableFile(id){
+          this.endTable.file = this.endTable.file.filter(item=>item.fid!=id);
+        },
+        cancelEndTableFile(){
+          if(this.endTable.file.length>=1){
+            this.$confirm('文件还未上传,确定取消吗?', '提示', {
+              confirmButtonText: '确定',
+              cancelButtonText: '取消',
+              type: 'warning'
+            }).then(() => {
+              this.endDialog = false;
+            })
+          }else{
+            this.endDialog = false;
+          }
         },
-
         init(){//重置
           this.auditDialog=false;
           this.endDialog=false;
@@ -377,11 +395,11 @@ import beUpload from '../../components/tool/beUpload'
         end(val){//完结按钮
           this.endTable.title = val.title;
           this.endTable.Id = val.acId;
-          this.endTable.file = val.reportFile;
+          this.endTable.file = val.reportFile==''||val.reportFile==null?[]:val.reportFile;
           this.endDialog=true;
         },
         ending(){   //完结提交
-          if(this.endTable.file==""&&this.endTable.file==null)return this.$message.error("请上传完结报告");
+          if(this.endTable.file.length.length==0)return this.$message.error("请上传完结报告");
           this.ajax.post(this.$store.state.api+"/UploadActivityFile",{
             uid:this.$store.state.userInfo.userid,
             aid:this.endTable.Id,
@@ -435,11 +453,13 @@ import beUpload from '../../components/tool/beUpload'
             lim:this.Page.lim,
           }).then(res=>{
             let data = res.data;
+            data[0].forEach(item=>item.reportFile = item.reportFile==''||item.reportFile==null?[]:JSON.parse(item.reportFile));
             this.tableData = data[0];
             this.options = data[1];
             this.options1 = data[2];
             this.options2 = data[3];
             this.Page.total = data[4][0]['total'];
+            console.log(this.tableData)
           }).catch(err=>{
             this.$message.error(err.message)
           })
@@ -587,12 +607,14 @@ import beUpload from '../../components/tool/beUpload'
       margin-top: 30px;
     }
     .download{
-      margin: 50px 0 20px;
+      margin: 10px 0 10px;
       width: 100%;
       text-align: left;
       font-size: 16px;
       font-weight: bold;
       color: #5391fd;
+      display: flex;
+      justify-content: space-between;
     }
 
     .addDialogLogo{

src/views/activityManage/makerActvityDetails.vue

@@ -85,17 +85,24 @@
                 <div><p>活动完结报告</p></div>
             </div>
             <div style="width: 85%" v-loading="loading" element-loading-text="文件正在上传中">
-              <div style="display: flex;width: 100%;align-items: center;">
-                  <div  class="download" v-if="tableData.reportFile!=''&&tableData.reportFile!=null">{{ tableData.reportFile!=''&&tableData.reportFile!=null?JSON.parse(tableData.reportFile).fileName:'' }}</div>
-                  <div class="addMoneyBtn" v-if="tableData.reportFile==''||tableData.reportFile==null">
+              <div style="display: flex;width: 100%;flex-direction: column;">
+                  <div class="download" v-for="item in tableData.reportFile">
+                      <span>{{ item.fileName }}</span>
+                      <div class="downloadBtn">
+                        <el-button type="primary" size="mini">下载文件</el-button>
+                        <el-button type="primary" @click="checkDelFile(item.fid)" size="mini">删除文件</el-button>
+                      </div>
+                  </div>
+                  <!-- <div  class="download" v-if="tableData.reportFile!=''&&tableData.reportFile!=null">{{ tableData.reportFile!=''&&tableData.reportFile!=null?JSON.parse(tableData.reportFile).fileName:'' }}</div> -->
+                  <div class="addMoneyBtn">
                       <div class="jia">+</div>添加
                       <div id="upFile">
                         <beUpload @getFile="getFile" :navName="'上传文件'" :accept="accept"> </beUpload>
                       </div>
                   </div>
-                  <div class="DelFile" v-if="tableData.reportFile!=''&&tableData.reportFile!=null">
+                  <!-- <div class="DelFile" v-if="tableData.reportFile!=''&&tableData.reportFile!=null">
                     <el-button type="danger" @click="DelFileDialog = true">删除文件</el-button>
-                  </div>
+                  </div> -->
               </div>
             </div>
             <!-- 活动完结报告结束 -->
@@ -272,7 +279,7 @@
                     width="600px"
                     class="MAputIn AddMember">
                     <div class="addDialogLogo">LOGO</div>
-                    <div class="deleteContent" v-if="tableData.reportFile!=''&&tableData.reportFile!=null">是否删除“{{JSON.parse(tableData.reportFile).fileName}}”文件？</div>
+                    <div class="deleteContent" >是否删除“{{DelFileData.fileName}}”文件？</div>
                     <span slot="footer" class="dialog-footer">
                         <el-button type="danger" @click="DelFileYes" class="btn5" size="small">确认删除</el-button>
                         <el-button @click="DelFileDialog=false;" class="btn5" style="background:#cccccc" size="small">取消</el-button>
@@ -338,6 +345,11 @@ export default {
         project:[],
         class:[]
       },
+      DelFileData:{
+        fid:"",
+        fileName:"",
+
+      },
       Member:{
         Id:'',
         Name:'',
@@ -348,10 +360,11 @@ export default {
   },
   methods:{
     DelFileYes(){
+      let newFile = this.tableData.reportFile.filter(item=>item.fid!=this.DelFileData.fid);
       this.ajax.post(this.$store.state.api+"/UploadActivityFile",{
         uid:this.$store.state.userInfo.userid,
         aid:this.$route.query['Id'],
-        file:""
+        file:JSON.stringify(newFile)
       }).then(res=>{
         if(res.data==1){
           this.$message.success("删除成功");
@@ -364,11 +377,28 @@ export default {
         this.$message.error(err.message)
       })
     },
+    checkDelFile(Id){
+      this.DelFileData = this.tableData.reportFile.filter(item=>item.fid==Id)[0];
+      this.DelFileDialog = true;
+    },
+    // delFile(Id){
+    //   let file = this.tableData.reportFile.filter(item=>item.fid==Id)[0];
+    //   this.$confirm(`确定删除${file.fileName}这个文件吗?`, '提示', {
+    //     confirmButtonText: '确定',
+    //     cancelButtonText: '取消',
+    //     type: 'warning'
+    //   }).then(() => {
+    //     let newFile = this.tableData.reportFile.filter(item=>item.fid!=Id);
+    //     console.log(newFile);
+    //   })
+    // },
     getFile(val) {//上传文件
+      val.fid = uuid.v1()
+      let newData = [...this.tableData.reportFile,val];
       this.ajax.post(this.$store.state.api+"/UploadActivityFile",{
         uid:this.$store.state.userInfo.userid,
         aid:this.$route.query['Id'],
-        file:JSON.stringify(val)
+        file:JSON.stringify(newData)
       }).then(res=>{
         if(res.data==1){
           this.$message.success("添加成功");
@@ -548,6 +578,10 @@ export default {
         data.begin_at = JSON.parse(data.begin_at);
         data.course_teacher = JSON.parse(data.course_teacher);
         data.chapters = JSON.parse(data.chapters)
+        // console.log(data.reportFile)
+        // console.log(data.reportFile==''||data.reportFile==null?[]:JSON.parse(data.reportFile))
+        data.reportFile = data.reportFile==''||data.reportFile==null?[]:JSON.parse(data.reportFile)
+        // data.reportFile = data.reportFile==''||data.reportFile==null?[]:JSON.parse(data.reportFile);
         this.tableData = data;
         console.log(this.tableData)
         // this.$message.success("获取数据成功")
@@ -587,14 +621,23 @@ export default {
 
     
   .download{   //pdf下载
-    margin: 20px 15px;
-    width: 250px;
+    margin: 10px 10px;
+    width: 500px;
     line-height: 35px;
     text-align: left;
     font-size: 16px;
     font-weight: bold;
     color: #5391fd;
+    display: flex;
+    justify-content: space-between;
     cursor: pointer;
+    span{
+      display: block;
+      max-width: 250px;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
   }
 
     

src/views/firm.vue

@@ -56,7 +56,7 @@
           >
           <template #default="scope">
               <div class="operations">
-                      <el-button type="primary" class="bt1" size="mini" >查看信息</el-button>
+                      <el-button type="primary" class="bt1" size="mini" @click='checkFile(scope.row)'>查看信息</el-button>
                       <el-button type="primary" class="bt1" size="mini" @click="del(scope.row.startupId)" >删除</el-button>
               </div>
           </template>
@@ -87,20 +87,38 @@
       </span>
     </el-dialog>
 <!-- 删除通知结束-->
+
+<!-- 展示文档开始 -->
+<el-dialog
+    title="展示文件"
+    :visible.sync="showFile"
+    width="80vw"
+    class="addDialog showDialog">
+    <div class="addDialogLogo">LOGO</div>
+    <div class="showFileArea">
+        <!-- <vpdf v-if="/^\s*$/g.test(showFileUrl)&&showFileUrl.split('.')[showFileUrl.split('.').length-1]=='pdf'" :pdfUrl="showFileUrl"></vpdf> -->
+        <vword  :pdfUrl="showFileUrl"></vword>
+    </div>
+</el-dialog>
+<!-- 展示文档结束 -->
     </div>
   </template>
   
   <script>
-  import beUpload from '@/components/tool/beUpload.vue'; 
+  import beUpload from '@/components/tool/beUpload.vue';
+  import vpdf from "@/components/vpdf.vue"
+  import vword from '@/components/vword.vue'
       export default {
-        components:{beUpload},
+        components:{beUpload,vpdf,vword},
         data() {
           return {
             accept:"*",
+            showFile:false,
             dialogVisible1:false,
             delId:"",
             input:'',
             tableData:[],
+            showFileUrl:"",
             Page:{
               nowPage:1,
               total:0,
@@ -109,6 +127,12 @@
           }
         },
         methods:{
+          //展示文件
+          checkFile(row){
+            console.log(row)
+            this.showFileUrl = row.startFile.url;
+            this.showFile = true;
+          },
           del(Id){
             this.delId = Id;
             this.dialogVisible1=true;
@@ -278,5 +302,9 @@
   bottom: 0;
   display: flex;
   justify-content: flex-end;
+}
+.showFileArea{
+  width: 100%;
+  height: 65vh;
 }
   </style>