能力申请：有附件的时候提供附件下载功能

back/src/views/modules/myAgent/demo/competency-application.vue

@@ -13,40 +13,32 @@
       <h3>申请人信息</h3>
       <div class="big-BOX">
         <p>
-          <span class="text"
+          <span class="text">申请人：<span> {{ dataForm.content.user || '--' }}</span></span>
-            >申请人：<span> {{ dataForm.content.user || '--' }}</span></span
+          <span class="text">电话：<span>{{ dataForm.content.phone || '--' }}</span></span>
-          >
+          <span class="text">单位：<span>{{ dataForm.content.unit || '--' }}</span></span>
-          <span class="text"
-            >电话：<span>{{ dataForm.content.phone || '--' }}</span></span
-          >
-          <span class="text"
-            >单位：<span>{{ dataForm.content.unit || '--' }}</span></span
-          >
         </p>
         <p>
           <span class="text">
             能力申请标题：<span>
-              {{ dataForm.content.title || '--' }}</span
+              {{ dataForm.content.title || '--' }}</span></span>
-            ></span
+          <span class="text" v-if="dataForm.content.applicationSystem">应用系统：<span>{{
-          >
-          <span class="text" v-if="dataForm.content.applicationSystem"
-            >应用系统：<span>{{
           dataForm.content.applicationSystem || '--'
-            }}</span></span
+          }}</span></span>
-          >
           <span class="text"></span>
         </p>
         <p>
-          <span v-if="dataForm.content.applicationSceneStr"
+          <span v-if="dataForm.content.applicationSceneStr">应用场景：<span>
-            >应用场景：<span>
+              {{ dataForm.content.applicationSceneStr || '--' }}</span></span>
-              {{ dataForm.content.applicationSceneStr || '--' }}</span
-            ></span>
         </p>
         <p>
           <span>
             需求依据：<span>
-              {{ dataForm.content.applicationBackground || '--' }}</span
+              {{ dataForm.content.applicationBackground || '--' }}</span></span>
-            ></span>
+        </p>
+        <p>
+          <div>
+            <el-button type="primary" v-if="dataForm.content.attachment" size="small" @click="download(dataForm.content)">附件下载</el-button>
+          </div>
         </p>
         <!-- <p>
           <span>
@@ -102,9 +94,7 @@
           <el-radio-button label="退回" class="redAll" @click="showDialog('退回')">退回</el-radio-button>
         </el-radio-group> -->
         <el-button type="primary" @click="showDialog('同意')">同意</el-button>
-        <el-button type="danger" plain @click="showDialog('驳回')"
+        <el-button type="danger" plain @click="showDialog('驳回')">驳回</el-button>
-          >驳回</el-button
-        >
         <!-- <el-input v-if="agreeOrList ==='同意' " v-model="inputAgree" placeholder="请输入同意意见"></el-input>
         <el-input v-if="agreeOrList ==='退回'" v-model="inputNo" placeholder="请输入退回意见"></el-input>
          <el-button class="inputBule" @click="agreeOrNot">提交</el-button> -->
@@ -113,21 +103,12 @@
 
     <!--  流程详情   -->
     <ren-process-detail></ren-process-detail>
-    <el-dialog
+    <el-dialog title="审批意见" :close-on-click-modal="false" :visible.sync="dialogVisible" width="30%"
-      title="审批意见"
+      :before-close="handleClose">
-      :close-on-click-modal="false"
-      :visible.sync="dialogVisible"
-      width="30%"
-      :before-close="handleClose"
-    >
       <el-input v-model="input" placeholder="请输入审批意见"></el-input>
       <span slot="footer" class="dialog-footer">
         <el-button @click="handleClose2">取 消</el-button>
-        <el-button
+        <el-button type="primary" @click.native="agreeOrNot($store.state.contentTabsActiveName)">确 定</el-button>
-          type="primary"
-          @click.native="agreeOrNot($store.state.contentTabsActiveName)"
-          >确 定</el-button
-        >
       </span>
     </el-dialog>
   </el-card>
@@ -486,7 +467,13 @@ export default {
       console.log(data)
     },
     // 任务处理出错回调
-    taskHandleErrorCallback (data) {}
+    taskHandleErrorCallback(data) { },
+    download(data) {
+      const alink = document.createElement('a')
+      alink.download = '附件' // 文件名,大部分浏览器兼容,IE10及以下不兼容
+      alink.href = data.attachment // 创建 url地址
+      alink.click() // 自动点击
+    },
   },
   mounted() {
     // this.applyData()
@@ -497,38 +484,47 @@ export default {
 ::v-deep .big-BOX {
   background: rgba(244, 245, 248, 0.8);
   padding: 24px;
+
   h3 {
     font-size: 16px;
     color: #212121;
   }
+
   p {
     width: 100%;
     display: flex;
     justify-content: space-between;
     color: #212121;
     font-size: 14px;
+
     span {
       display: inline-block;
       margin-left: 8px;
       line-height: 32px;
+
       span {
         font-weight: bold;
       }
     }
+
     .text {
       width: 500px;
     }
   }
+
   .lastP {
     margin-top: 16px;
     width: 100%;
+
     span {
       display: flex;
+
       span {
         padding: 0 12px;
         height: 32px;
         background: rgba(232, 234, 239, 1);
         border-radius: 2px;
+
         button {
           background: unset;
           border: 0;
@@ -539,6 +535,7 @@ export default {
     }
   }
 }
+
 ::v-deep .AbilityApply {
   margin-top: 32px;
 
@@ -548,27 +545,33 @@ export default {
     border-bottom: 1px solid #dddee1;
     padding-bottom: 10px;
   }
+
   ul {
     padding-left: 0px;
+
     li {
       list-style: none;
       padding: 30px 0;
       border-bottom: 1px solid #dddee1;
       display: flex;
+
       img {
         width: 100px;
         height: 100px;
       }
+
       div {
         margin-left: 16px;
         display: flex;
         flex-direction: column;
         justify-content: center;
+
         h2 {
           margin-bottom: 20px;
           font-size: 20px;
           color: #000;
           display: flex;
+
           span {
             display: block;
             font-size: 14px;
@@ -581,22 +584,26 @@ export default {
             border-radius: 4px;
           }
         }
+
         p {
           margin-bottom: 0;
         }
       }
     }
+
     .clearfix:after {
       display: block;
       content: "";
       clear: both;
     }
+
     .title {
       color: #0558e1;
       font-size: 18px;
       padding-bottom: 0;
       border-bottom: 0;
     }
+
     .title:before {
       content: "";
       width: 6px;
@@ -610,17 +617,21 @@ export default {
     }
   }
 }
+
 ::v-deep .agreeOr>div {
   display: flex;
   align-items: center;
+
   .el-input {
     margin-right: 10px;
     margin-left: 32px;
   }
 }
+
 ::v-deep .agreeOr>div:last-of-type {
   margin-top: 15px;
 }
+
 .blueAll {
   ::v-deep .el-radio-button__inner {
     width: 80px;
@@ -632,12 +643,14 @@ export default {
     color: #0558e1;
     border: 1px solid #0558e1;
   }
+
   ::v-deep .el-radio-button__orig-radio:checked+.el-radio-button__inner {
     box-shadow: unset !important;
     background: #0558e1;
     color: #ffffff;
   }
 }
+
 .inputBule {
   width: 55px;
   height: 32px;
@@ -648,8 +661,10 @@ export default {
   color: #ffffff;
   border: 1px solid #0558e1;
 }
+
 .redAll {
   margin-left: 10px;
+
   ::v-deep .el-radio-button__inner {
     width: 80px;
     height: 32px;
@@ -661,12 +676,14 @@ export default {
     color: #e83a48;
     margin-left: 10px;
   }
+
   ::v-deep .el-radio-button__orig-radio:checked+.el-radio-button__inner {
     box-shadow: unset !important;
     color: #ffffff;
     background: #e83a48;
   }
 }
+
 .blueInput {
   width: 55px;
 }