WXL
昨天 f409f83de7f803178715f128f275d77741c3072d
src/views/project/travelexpenseapply/travelexpensedetail/index.vue
@@ -30,7 +30,6 @@
              >
                <el-option
                  v-for="item in personsList"
                  :key="item.reportNo"
                  :label="item.reportName"
                  :value="item.reportName"
                >
@@ -58,17 +57,29 @@
          </el-col>
          <el-col :span="5">
            <el-form-item label="报销类别" prop="costtype">
              <el-select v-model="form.costtype" value-key="value" placeholder="请选择报销人员类别" @change="getTravelers">
                <el-option v-for="dict in dict.type.sys_travelexpensebelong" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              <el-select
                v-model="form.costtype"
                value-key="value"
                placeholder="请选择报销人员类别"
              >
                <el-option
                  v-for="dict in dict.type.sys_travelexpensebelong"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="捐献者" prop="infoid" v-show="form.costtype==4">
            <el-form-item
              label="捐献者"
              prop="infoid"
              v-show="form.costtype == 4"
            >
              <el-select
                v-model="form.infoid"
                @change="selectbaseinfo"
                @clear="clearDonatorInfo"
                clearable
                filterable
                placeholder="请选择捐献者"
@@ -82,6 +93,14 @@
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <div style="margin-left: 10px;">
              <dict-tag
                :options="dict.type.sys_DonationStatus"
                :value="form.invoicecount"
              />
            </div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px">
@@ -119,8 +138,8 @@
                v-model="form.bigstrmoney"
                placeholder="报销大写金额"
              />
            </el-form-item>
            </el-col>
            </el-form-item>
          </el-col>
        </el-row>
        <!--
        <el-row>
@@ -128,12 +147,12 @@
            <el-form-item label="出差事由" prop="reason">
              <el-input v-model="form.reason" placeholder="出差事由" />
            </el-form-item>
          </el-col>
          </el-col>
          <el-col :span="5">
            <el-form-item label="出差人" prop="travelers">
              <el-select v-model="form.travelers" clearable filterable allow-create ref="getReportname"
                default-first-option placeholder="请选择" @change="getAccountinfo()">
                <el-option v-for="item in travelers" :key="item.reportNo" :label="item.reportName"
                <el-option v-for="item in travelers"  :label="item.reportName"
                  :value="item.reportName">
                </el-option>
              </el-select>
@@ -317,8 +336,8 @@
                  @focus1="getPersons(scope.row)"
                >
                  <el-option
                    v-for="item in personsSel"
                    :key="item.reportNo"
                    v-for="(item, index) in personsSel"
                    :key="`${item.reportNo}_${index}`"
                    :label="item.reportName"
                    :value="item.reportName"
                  >
@@ -767,8 +786,8 @@
                  @change="getAccountinfo2(scope.row, scope.row.persontype)"
                >
                  <el-option
                    v-for="item in personsSel"
                    :key="item.reportNo"
                    v-for="(item, index) in personsSel"
                    :key="`${item.reportNo}_${index}`"
                    :label="item.reportName"
                    :value="item.reportName"
                  >
@@ -1094,15 +1113,29 @@
              class="pdfimgmin"
            >
              <!-- <img :src="pdfimg" /> -->
              <el-image
              <!-- <el-image
                style="width: 95%; height: 90%"
                :src="pdfimg"
                :preview-src-list="pdfimgsrcList"
                :preview-src-list="pdfimgsrcList" -->
              >
                <!-- <div slot="error" class="image-slot">
              <el-image
                ref="imagePreview"
                style="width: 95%; height: 90%"
                :src="pdfimg"
                @click="handleImageClick(initialIndex)"
              >
              </el-image>
              <custom-image-viewer
                :url-list="pdfimgsrcList"
                :initial-index="currentIndex"
                :visible="viewerVisible"
                @update:visible="viewerVisible = $event"
                @close="handleViewerClose"
              />
              <!-- <div slot="error" class="image-slot">
              <i class="el-icon-picture-outline"></i>
            </div> -->
              </el-image>
              <!-- </el-image> -->
            </div>
            <div v-else class="pdfimgmins">{{ hintitle }}</div>
          </div>
@@ -1194,12 +1227,16 @@
              <el-image
                style="width: 95%; height: 90%"
                :src="invoicepdfimg"
                :preview-src-list="invoicepdfimgsrcList"
                @click="invoicehandleImageClick(initialIndex)"
              >
                <!-- <div slot="error" class="image-slot">
              <i class="el-icon-picture-outline"></i>
            </div> -->
              </el-image>
              <custom-image-viewer
                :url-list="invoicepdfimgsrcList"
                :initial-index="invoicecurrentIndex"
                :visible="invoiceviewerVisible"
                @update:visible="invoiceviewerVisible = $event"
                @close="invoicehandleViewerClose"
              />
            </div>
            <div v-else class="pdfimgmins">{{ hintitle }}</div>
          </div>
@@ -1259,6 +1296,7 @@
import { getInfoBytheUserNo } from "@/api/project/externalperson";
import { regionDataPlus, CodeToText } from "element-china-area-data";
import Li_area_select from "@/components/Address";
import CustomImageViewer from "@/components/CustomImageViewer"; // 根据你的路径调整
import { getUser, getUserProfile } from "@/api/system/user";
import { treeselect } from "@/api/system/dept";
import { getSubsidy } from "@/api/project/travelcity";
@@ -1269,6 +1307,7 @@
  components: {
    Treeselect,
    Li_area_select,
    CustomImageViewer,
    pdf
  },
  name: "Funddetail",
@@ -1280,7 +1319,8 @@
    "sys_recordstatus",
    "sys_travelexpensebelong",
    "sys_traffictype",
    "sys_area_name"
    "sys_area_name",
    "sys_DonationStatus"
  ],
  data() {
    return {
@@ -1431,6 +1471,12 @@
      invoicefileListto: [],
      invoicepdfimg: "",
      invoicepdfimgsrcList: [],
      currentIndex: 0, // 初始索引
      invoicecurrentIndex: 0, // 初始索引
      initialIndex: 0, // 初始索引
      viewerVisible: false, // 控制预览组件显示
      invoiceviewerVisible: false, // 控制预览组件显示
      //人员类别
      persontype: null,
      //到达地
@@ -1492,7 +1538,14 @@
  mounted() {
    window.addEventListener("beforeunload", e => this.beforeunloadHandler(e));
    this.$nextTick(() => {
      const viewer = this.$refs.imagePreview.$el.querySelector(
        ".el-image-viewer"
      );
      if (viewer) {
        viewer.addEventListener("click", this.handlePreviewClick);
      }
    });
    //选择业务类型:1、新增;2、修改;3、查看
    let curId = this.$route.query.id;
    let pos = this.$route.query.pos;
@@ -1515,7 +1568,15 @@
  destroyed() {
    window.removeEventListener("beforeunload", e => this.beforeunloadFn(e));
  }, //生命周期 - 销毁完成
  beforeDestroy() {
    // 移除事件监听
    const viewer = this.$refs.imagePreview.$el.querySelector(
      ".el-image-viewer"
    );
    if (viewer) {
      viewer.removeEventListener("click", this.handlePreviewClick);
    }
  },
  methods: {
    // 浏览器页面关闭或刷新提示
    beforeunloadHandler(e) {
@@ -1534,7 +1595,57 @@
        return "关闭提示";
      }
    },
    handlePreviewClick(e) {
      const viewer = this.$refs.imagePreview.$el.querySelector(
        ".el-image-viewer"
      );
      if (!viewer) return;
      // 判断是否点击了“下一张”按钮(右侧箭头)
      const isNextBtn = e.target.closest(".el-image-viewer__next");
      if (isNextBtn) {
        const currentIndex = this.getCurrentPreviewIndex();
        if (currentIndex === this.pdfimgsrcList.length - 1) {
          e.preventDefault(); // 阻止默认切换行为
          this.$message.warning("已经是最后一张了!");
          return;
        }
      }
    },
    // 获取当前预览的图片索引
    getCurrentPreviewIndex() {
      const viewer = this.$refs.imagePreview.$el.querySelector(
        ".el-image-viewer"
      );
      if (viewer) {
        const img = viewer.querySelector(".el-image-viewer__img");
        if (img) {
          const currentSrc = img.getAttribute("src");
          return this.pdfimgsrcList.indexOf(currentSrc);
        }
      }
      return 0;
    },
    handleImageClick(index) {
      this.currentIndex = index;
      this.viewerVisible = true;
    },
    invoicehandleImageClick(index) {
      this.invoicecurrentIndex = index;
      this.invoiceviewerVisible = true;
    },
    handleViewerClose() {
      this.viewerVisible = false;
    },
    invoicehandleViewerClose() {
      this.invoiceviewerVisible = false;
    },
    handleImageError() {
      console.error("图片加载失败");
    },
    handleImageLoad() {
      console.log("图片加载成功");
    },
    handleUploadError() {},
    // 获取请求头
    Getnetworkheader() {
@@ -1802,13 +1913,27 @@
        const index = this.getIndexInArray(this.fileListto, row);
        this.fileListto.splice(index, 1);
        console.log(this.rbDetails[this.atpresent].annexfilesList);
        indexvalue = this.rbDetails[this.atpresent].annexfilesList.find(
          (item, index) => {
            return item.name == row.name;
          }
        );
        console.log(indexvalue, "删除索引");
        this.rbDetails[this.atpresent].annexfilesList.splice(indexvalue, 1);
        // indexvalue = this.rbDetails[this.atpresent].annexfilesList.find(
        //   (item, index) => {
        //     return item.name == row.name;
        //   }
        // );
        // console.log(indexvalue, "删除索引");
        // this.rbDetails[this.atpresent].annexfilesList.splice(indexvalue, 1);
        const targetIndex = this.rbDetails[
          this.atpresent
        ].annexfilesList.findIndex(item => {
          return item.name === row.name; // 建议使用严格相等 ===
        });
        console.log(targetIndex, "删除索引"); // 现在打印的是索引号,例如 0, 1, 2...
        if (targetIndex > -1) {
          // 确保找到了元素
          this.rbDetails[this.atpresent].annexfilesList.splice(targetIndex, 1);
          console.log("删除成功");
        } else {
          console.log("未找到对应项目,无法删除");
        }
      } else {
        const indexlist = this.getIndexInArray(
          this.invoicepdfimgsrcList,
@@ -1818,13 +1943,23 @@
        const index = this.getIndexInArray(this.invoicefileListto, row);
        this.invoicefileListto.splice(index, 1);
        console.log(this.rbDetails[this.atpresent].invoicefilesList);
        indexvalue = this.rbDetails[this.atpresent].invoicefilesList.find(
          (item, index) => {
            return item.name == row.name;
          }
        );
        console.log(indexvalue, "删除索引");
        this.rbDetails[this.atpresent].invoicefilesList.splice(indexvalue, 1);
        const targetIndex = this.rbDetails[
          this.atpresent
        ].invoicefilesList.findIndex(item => {
          return item.name === row.name; // 建议使用严格相等 ===
        });
        console.log(targetIndex, "删除索引"); // 现在打印的是索引号,例如 0, 1, 2...
        if (targetIndex > -1) {
          // 确保找到了元素
          this.rbDetails[this.atpresent].invoicefilesList.splice(
            targetIndex,
            1
          );
          console.log("删除成功");
        } else {
          console.log("未找到对应项目,无法删除");
        }
      }
    },
    // 点击上移
@@ -2116,10 +2251,22 @@
        if (item.id == this.form.infoid) {
          this.form.donorno = item.donorno;
          this.form.donorname = item.name;
          // 新增:将捐献者的 recordstate 赋值到 invoicecount
          if (item.recordstate !== undefined && item.recordstate !== null) {
            this.form.invoicecount = item.recordstate.toString();
          } else {
            this.form.invoicecount = ""; // 如果 recordstate 为空,清空字段
          }
        }
      });
    },
    // 添加清除方法
    clearDonatorInfo() {
      this.form.donorno = "";
      this.form.donorname = "";
      this.form.invoicecount = ""; // 清空 invoicecount
    },
    onpick(e) {
      // console.log(e,this.value1)
    },
@@ -2526,8 +2673,12 @@
            0
          );
          //校验请款金额合计是否等于报销单金额
          if (this.form.amountrequested != addnumber) {
          // 保留2位小数后进行比较
          const requestedAmount = Number(this.form.amountrequested);
          const calculatedAmount = Number(addnumber);
          // 使用toFixed保留2位小数
          if (requestedAmount.toFixed(2) !== calculatedAmount.toFixed(2)) {
            this.$message({
              message:
                "报销请款表中合计金额不等于报销单的报销金额,请更正后再保存!",
@@ -2577,9 +2728,9 @@
              );
              return;
            }
          }
          }
          if (this.form.id != null) {
          if (this.form.id != null) {
            updateReimbursement(this.form);
            //   .then(res => {
            //保存明细