From 8324c778ee797ea5a844614c47d93bdacf3ffeab Mon Sep 17 00:00:00 2001
From: WXL <1785969728@qq.com>
Date: 星期日, 07 一月 2024 13:17:33 +0800
Subject: [PATCH] 11

---
 src/views/project/fund/performancedetails/index.vue |  483 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 483 insertions(+), 0 deletions(-)

diff --git a/src/views/project/fund/performancedetails/index.vue b/src/views/project/fund/performancedetails/index.vue
index e4a72ef..a675411 100644
--- a/src/views/project/fund/performancedetails/index.vue
+++ b/src/views/project/fund/performancedetails/index.vue
@@ -335,6 +335,14 @@
                 >
                   鍒犻櫎
                 </el-button>
+                <el-button
+                  @click.native.prevent="
+                    Filepopup(scope.$index, rbDetails, scope.row)
+                  "
+                  type="text"
+                  size="small"
+                  >绁ㄦ嵁</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
@@ -482,6 +490,258 @@
         <el-button @click="unsave">鍙� 娑�</el-button>
         <el-button type="primary" @click="Savenow">纭� 瀹�</el-button>
       </span>
+    </el-dialog>
+    <!-- 闄勪欢 -->
+    <el-dialog
+      v-dialogDrags
+      :modal="false"
+      :close-on-click-modal="false"
+      :title="pdftitle"
+      :visible.sync="pdfVisible"
+      width="60%"
+    >
+      <div>
+        <el-table :data="tableDatatop" style="width: 100%">
+          <el-table-column
+            prop="beneficiaryname"
+            align="center"
+            label="鍗曚綅/涓汉"
+            width="250"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="idcardno"
+            align="center"
+            label="韬唤璇佸彿"
+            width="200"
+            v-if="form.applytype == '1' || form.applytype == '2'"
+          >
+          </el-table-column>
+          <el-table-column prop="depositbank" align="center" label="寮�鎴烽摱琛�">
+          </el-table-column>
+          <el-table-column
+            prop="bankcardno"
+            align="center"
+            label="閾惰甯愬彿"
+            width="210"
+          >
+          </el-table-column>
+        </el-table>
+      </div>
+
+      <el-tabs
+        style="margin-top: 20px;"
+        v-model="activeName"
+        type="border-card"
+        @tab-click="handleClick"
+      >
+        <el-tab-pane label="鏅�氶檮浠�" :name="1">
+          <div class="pdfimg">
+            <div class="box-pdf">
+              <div>
+                <el-upload
+                  size="mini"
+                  class="upload-demo"
+                  :action="uploadFileUrl"
+                  :file-list="fileListto"
+                  :show-file-list="false"
+                  multiple
+                  drag
+                  :headers="headers"
+                  :on-success="
+                    (response, file, fileList) =>
+                      uploadSccess(response, file, fileList)
+                  "
+                  :on-preview="downFile"
+                  :disabled="operationType == 'detail'"
+                  :on-error="handleUploadError"
+                  :on-remove="remove"
+                  accept="image/*,.pdf"
+                >
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">
+                    灏嗙エ鎹嫋鍒版澶勶紝鎴�
+                    <em
+                      ><el-button
+                        :disabled="operationType == 'detail'"
+                        size="small"
+                        type="primary"
+                        >鐐瑰嚮涓婁紶</el-button
+                      ></em
+                    >
+                  </div>
+                </el-upload>
+                <el-table
+                  :data="fileListto"
+                  @row-click="downFile"
+                  style="width: 100%"
+                  height="400"
+                >
+                  <el-table-column
+                    prop="name"
+                    :show-overflow-tooltip="true"
+                    label="鍚嶇О"
+                  >
+                    <template slot-scope="scope">
+                      <i style="color:#409EFF" class=" el-icon-s-order" />
+                      <span>{{ scope.row.name }}</span>
+                    </template>
+                  </el-table-column>
+
+                  <el-table-column
+                    prop="name"
+                    width="190"
+                    :show-overflow-tooltip="true"
+                    label="鍔熻兘"
+                  >
+                    <template slot-scope="scope">
+                      <el-button
+                        type="primary"
+                        size="mini"
+                        @click.native.prevent.stop="deletedowfile(scope.row)"
+                        >鍒犻櫎</el-button
+                      >
+                      <el-button
+                        type="primary"
+                        size="mini"
+                        @click.native.prevent.stop="moveupdowfile(scope.row)"
+                        >涓婄Щ</el-button
+                      >
+                      <el-button
+                        type="success"
+                        size="mini"
+                        icon="el-icon-search"
+                        circle
+                        @click.native.prevent.stop="Downloadfile(scope.row)"
+                      ></el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </div>
+
+            <div
+              v-if="this.previewpdf && pdfimgsrcList.length"
+              class="pdfimgmin"
+            >
+              <!-- <img :src="pdfimg" /> -->
+              <el-image
+                style="width: 95%; height: 90%"
+                :src="pdfimg"
+                :preview-src-list="pdfimgsrcList"
+              >
+                <!-- <div slot="error" class="image-slot">
+              <i class="el-icon-picture-outline"></i>
+            </div> -->
+              </el-image>
+            </div>
+            <div v-else class="pdfimgmins">{{ hintitle }}</div>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="鍙戠エ鏂囦欢" :name="2">
+          <div class="pdfimg">
+            <div class="box-pdf">
+              <div>
+                <el-upload
+                  size="mini"
+                  class="upload-demo"
+                  :action="uploadFileUrl"
+                  :file-list="invoicefileList"
+                  :show-file-list="false"
+                  multiple
+                  drag
+                  :headers="headers"
+                  :on-success="
+                    (response, file, fileList) =>
+                      uploadSccess(response, file, fileList)
+                  "
+                  :on-preview="downFile"
+                  :disabled="operationType == 'detail'"
+                  :on-error="handleUploadError"
+                  :on-remove="remove"
+                  accept="image/*,.pdf"
+                >
+                  <i class="el-icon-upload"></i>
+                  <div class="el-upload__text">
+                    灏嗗彂绁ㄦ枃浠舵嫋鍒版澶勶紝鎴�
+                    <em
+                      ><el-button
+                        :disabled="operationType == 'detail'"
+                        size="small"
+                        type="primary"
+                        >鐐瑰嚮涓婁紶</el-button
+                      ></em
+                    >
+                  </div>
+                </el-upload>
+                <el-table
+                  :data="invoicefileListto"
+                  @row-click="downFile"
+                  style="width: 100%"
+                  height="400"
+                >
+                  <el-table-column
+                    prop="name"
+                    :show-overflow-tooltip="true"
+                    label="鍚嶇О"
+                  >
+                    <template slot-scope="scope">
+                      <i style="color:#409EFF" class=" el-icon-s-order" />
+                      <span>{{ scope.row.name }}</span>
+                    </template>
+                  </el-table-column>
+
+                  <el-table-column
+                    prop="name"
+                    width="190"
+                    :show-overflow-tooltip="true"
+                    label="鍔熻兘"
+                  >
+                    <template slot-scope="scope">
+                      <el-button
+                        type="primary"
+                        size="mini"
+                        @click.native.prevent.stop="deletedowfile(scope.row)"
+                        >鍒犻櫎</el-button
+                      >
+                      <el-button
+                        type="primary"
+                        size="mini"
+                        @click.native.prevent.stop="moveupdowfile(scope.row)"
+                        >涓婄Щ</el-button
+                      >
+                      <el-button
+                        type="success"
+                        size="mini"
+                        icon="el-icon-search"
+                        circle
+                        @click.native.prevent.stop="Downloadfile(scope.row)"
+                      ></el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </div>
+
+            <div
+              v-if="this.previewpdf && invoicepdfimgsrcList.length"
+              class="pdfimgmin"
+            >
+              <!-- <img :src="pdfimg" /> -->
+              <el-image
+                style="width: 95%; height: 90%"
+                :src="invoicepdfimg"
+                :preview-src-list="invoicepdfimgsrcList"
+              >
+                <!-- <div slot="error" class="image-slot">
+              <i class="el-icon-picture-outline"></i>
+            </div> -->
+              </el-image>
+            </div>
+            <div v-else class="pdfimgmins">{{ hintitle }}</div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
     </el-dialog>
 
     <!-- 鎵归噺閫夊彇 -->
@@ -813,6 +1073,21 @@
         usestate: null
       },
 
+      //闄勪欢鍒楄〃
+      fileList: [],
+      fileListto: [],
+      invoicefileList: [],
+      invoicefileListto: [],
+      invoicepdfimg: "",
+      invoicepdfimgsrcList: [],
+      invoDatatop: [],
+      activeName: 1, //鏂囦欢绫诲瀷
+      //涓婁紶闄勪欢璺緞
+      uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload",
+      //鏂囦欢涓婁紶token
+      headers: {
+        Authorization: "Bearer " + getToken()
+      },
       //绁ㄦ嵁鏂囦欢
       pdftitle: "",
       pdfimg: "",
@@ -2116,6 +2391,214 @@
       } else {
         this.optionsperformance = [];
       }
+    },
+    handleUploadError() {},
+    remove(file, fileList) {
+      const rbDetails = [...this.rbDetails];
+      if (this.activeName == 1) {
+        this.fileListto.splice(this.fileListto.indexOf(file), 1);
+        rbDetails[this.atpresent].annexfilesList = this.fileListto;
+      } else {
+        this.invoicefileListto.splice(this.invoicefileListto.indexOf(file), 1);
+        rbDetails[this.atpresent].invoicefilesList = this.invoicefileListto;
+      }
+    },
+
+    uploadSccess(response, file, fileList) {
+      this.rbDetails;
+      //鑾峰彇绁ㄦ嵁淇℃伅浣嶇疆
+      console.log(response);
+      console.log(file);
+      if (this.activeName == 1) {
+        if (response.code == 200) {
+          // this.form.filename = file.raw.name;
+          this.previewpdf = true;
+          this.$modal.msgSuccess(response.msg);
+          this.fileListto.push({
+            name: file.name,
+            url: response.fileName
+          });
+          this.pdfimgsrcList.push(
+            this.Networkheader + "/prod-api" + response.fileName
+          );
+          console.log(this.pdfimgsrcList);
+          this.pdftitle = "鍏�" + this.pdfimgsrcList.length + "椤�";
+          this.pdfimg = this.Networkheader + "/prod-api" + response.fileName;
+          this.rbDetails[this.atpresent].annexfilesList = this.fileListto;
+        } else {
+          console.log(response.msg);
+        }
+      } else {
+        if (response.code == 200) {
+          // this.form.filename = file.raw.name;
+          this.previewpdf = true;
+          this.$modal.msgSuccess(response.msg);
+          this.invoicefileListto.push({
+            name: file.name,
+            url: response.fileName
+          });
+          this.invoicepdfimgsrcList.push(
+            this.Networkheader + "/prod-api" + response.fileName
+          );
+          console.log(this.invoicepdfimgsrcList);
+          this.pdftitle = "鍏�" + this.invoicepdfimgsrcList.length + "椤�";
+          this.pdfimg = this.Networkheader + "/prod-api" + response.fileName;
+          this.rbDetails[
+            this.atpresent
+          ].invoicefilesList = this.invoicefileListto;
+          console.log(this.rbDetails[this.atpresent]);
+        } else {
+          console.log(response.msg);
+        }
+      }
+    },
+
+    // 鐐瑰嚮绁ㄦ嵁
+    Filepopup(index, rows, row) {
+      this.tableDatatop = [];
+      this.pdfimgsrcList = [];
+      this.invoDatatop = [];
+      this.invoicepdfimgsrcList = [];
+      this.invoDatatop.push(row);
+      this.tableDatatop.push(row);
+      this.atpresent = index;
+      this.pdfVisible = true;
+      console.log(this.rbDetails[index]);
+      if (this.rbDetails[index].annexfilesList) {
+        this.previewpdf = true;
+        this.fileListto = this.rbDetails[index].annexfilesList;
+        console.log(this.fileListto);
+        this.pdfimg = this.Networkheader + "/prod-api" + this.fileListto[0].url;
+        this.fileListto.forEach(item => {
+          this.pdfimgsrcList.push(this.Networkheader + "/prod-api" + item.url);
+        });
+      } else {
+        this.fileListto = [];
+        this.pdfimg = "";
+        this.pdftitle = "";
+      }
+      // -鍙戠エ鏂囦欢
+      if (this.rbDetails[index].invoicefilesList) {
+        this.previewpdf = true;
+        this.invoicefileListto = this.rbDetails[index].invoicefilesList;
+        console.log(this.invoicefileListto);
+        this.invoicepdfimg =
+          this.Networkheader + "/prod-api" + this.invoicefileListto[0].url;
+        this.invoicefileListto.forEach(item => {
+          this.invoicepdfimgsrcList.push(
+            this.Networkheader + "/prod-api" + item.url
+          );
+        });
+        console.log(this.invoicepdfimgsrcList);
+        console.log(this.invoicepdfimg);
+      } else {
+        this.invoicefileListto = [];
+        this.invoicepdfimg = "";
+        this.pdftitle = "";
+      }
+
+      if (this.activeName == 1) {
+        this.pdftitle = "鍏�" + this.pdfimgsrcList.length + "椤�";
+      } else {
+        this.pdftitle = "鍏�" + this.invoicepdfimgsrcList.length + "椤�";
+      }
+    },
+
+    // 鐐瑰嚮宸蹭笂浼犳枃浠�
+    downFile(item) {
+      if (this.activeName == 1) {
+        console.log(item, "鐐瑰嚮鏂囦欢鎷縤tem");
+        this.pdftitle =
+          "鍏�" + this.pdfimgsrcList.length + "椤癸紝褰撳墠閫変腑" + item.name;
+        let name = item.name.split(".");
+        if (name[1] == "pdf") {
+          this.$modal.msgWarning("褰撳墠鏂囦欢鏆備笉鏀寔棰勮");
+          this.previewpdf = false;
+          this.hintitle = "褰撳墠鏂囦欢鏆備笉鏀寔棰勮";
+        } else if (name[1] == "jpg" || "png") {
+          this.previewpdf = true;
+          if (item.url) {
+            this.pdfimg = this.Networkheader + "/prod-api" + item.url;
+          } else {
+            this.pdfimg = this.Networkheader + "/prod-api" + item.response.url;
+          }
+        } else {
+          this.hintitle = "褰撳墠鏂囦欢鏆備笉鏀寔棰勮";
+          this.$modal.msgWarning("褰撳墠鏂囦欢鏆備笉鏀寔棰勮");
+          this.previewpdf = false;
+        }
+      } else {
+        console.log(item, "鐐瑰嚮鏂囦欢鎷縤tem");
+        this.pdftitle =
+          "鍏�" + this.invoicepdfimgsrcList.length + "椤癸紝褰撳墠閫変腑" + item.name;
+        let name = item.name.split(".");
+        if (name[1] == "pdf") {
+          this.$modal.msgWarning("褰撳墠鏂囦欢鏆備笉鏀寔棰勮");
+          this.previewpdf = false;
+          this.hintitle = "褰撳墠鏂囦欢鏆備笉鏀寔棰勮";
+        } else if (name[1] == "jpg" || "png") {
+          this.previewpdf = true;
+          if (item.url) {
+            this.invoicepdfimg = this.Networkheader + "/prod-api" + item.url;
+            console.log(this.invoicepdfimg, "pdfimg");
+            console.log(this.invoicepdfimgsrcList, "imglist");
+          } else {
+            this.invoicepdfimg =
+              this.Networkheader + "/prod-api" + item.response.url;
+          }
+        } else {
+          this.hintitle = "褰撳墠鏂囦欢鏆備笉鏀寔棰勮";
+          this.$modal.msgWarning("褰撳墠鏂囦欢鏆備笉鏀寔棰勮");
+          this.previewpdf = false;
+        }
+      }
+    },
+    getIndexInArray(arr, obj) {
+      return arr.indexOf(obj);
+    },
+    // 鍙戠エ鍒囨崲
+    handleClick(tab, event) {
+      if (this.activeName == 1) {
+        this.pdftitle = "鍏�" + this.pdfimgsrcList.length + "椤�";
+      } else {
+        this.pdftitle = "鍏�" + this.invoicepdfimgsrcList.length + "椤�";
+      }
+    },
+    // 鐐瑰嚮鍒犻櫎
+    deletedowfile(row) {
+      if (this.activeName == 1) {
+        const indexlist = this.getIndexInArray(
+          this.pdfimgsrcList,
+          this.Networkheader + "/prod-api" + row.url
+        );
+        this.pdfimgsrcList.splice(indexlist, 1);
+        const index = this.getIndexInArray(this.fileListto, row);
+        this.fileListto.splice(index, 1);
+      } else {
+        const indexlist = this.getIndexInArray(
+          this.invoicepdfimgsrcList,
+          this.Networkheader + "/prod-api" + row.url
+        );
+        this.invoicepdfimgsrcList.splice(indexlist, 1);
+        const index = this.getIndexInArray(this.invoicefileListto, row);
+        this.invoicefileListto.splice(index, 1);
+      }
+    },
+    // 鐐瑰嚮涓婄Щ
+    moveupdowfile(row) {
+      if (this.activeName == 1) {
+        const index = this.getIndexInArray(this.fileListto, row);
+        const item = this.fileListto.splice(index, 1)[0]; // 绉婚櫎鎸囧畾绱㈠紩澶勭殑鍏冪礌锛屽苟淇濆瓨鍒癷tem鍙橀噺涓�
+        this.fileListto.splice(index - 1, 0, item); // 灏唅tem鎻掑叆鍒扮储寮曚綅缃殑鍓嶄竴浣�
+      } else {
+        const index = this.getIndexInArray(this.invoicefileListto, row);
+        const item = this.invoicefileListto.splice(index, 1)[0]; // 绉婚櫎鎸囧畾绱㈠紩澶勭殑鍏冪礌锛屽苟淇濆瓨鍒癷tem鍙橀噺涓�
+        this.invoicefileListto.splice(index - 1, 0, item); // 灏唅tem鎻掑叆鍒扮储寮曚綅缃殑鍓嶄竴浣�
+      }
+    },
+    Downloadfile(row) {
+      console.log(row);
+      window.location.href = this.Networkheader + "/prod-api" + row.url;
     }
   },
 

--
Gitblit v1.9.3