11

WXL

5 天以前 72dc0bc085496aeb2c3936a4139546fa3cf4e1d1

 src/views/project/travelexpenseapply/travelexpensedetail/index.vue

@@ -51,16 +51,37 @@
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="15">
          <el-col :span="10">
            <el-form-item label="出差事由" prop="reason">
              <el-input v-model="form.reason" placeholder="出差事由" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="捐献者" prop="infoid">
            <el-form-item label="报销类别" prop="costtype">
              <el-select
                v-model="form.costtype"
                value-key="value"
                placeholder="请选择报销人员类别"
              >
                <el-option
                  v-for="dict in dict.type.sys_travelexpensebelong"
                  :key="dict.value"
                  :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-select
                v-model="form.infoid"
                @change="selectbaseinfo"
                clearable
                filterable
                placeholder="请选择捐献者"
              >
@@ -77,23 +98,6 @@
        </el-row>
        <el-row style="margin-top: 10px">
          <el-col :span="5">
            <el-form-item label="报销金额" prop="amountrequested">
              <el-input
                :disabled="true"
                v-model="form.amountrequested"
                placeholder="报销合计金额"
              />
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="大写金额" prop="bigstrmoney">
              <el-input
                :disabled="true"
                v-model="form.bigstrmoney"
                placeholder="报销大写金额"
              />
            </el-form-item> </el-col
          ><el-col :span="4">
            <el-form-item label="审核状态" prop="flowlevel">
              <el-select
                v-model="form.recordstatus"
@@ -111,20 +115,30 @@
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="报销金额" prop="amountrequested">
              <el-input
                :disabled="true"
                v-model="form.amountrequested"
                placeholder="报销合计金额"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="大写金额" prop="bigstrmoney">
              <el-input
                :disabled="true"
                v-model="form.bigstrmoney"
                placeholder="报销大写金额"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <!--
        <el-row>
          <el-col :span="15">
            <el-form-item label="出差事由" prop="reason">
              <el-input v-model="form.reason" placeholder="出差事由" />
            </el-form-item>
          </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>
            </el-form-item>
          </el-col>
          <el-col :span="5">
@@ -195,7 +209,7 @@
          </el-col>
        </el-row>
                -->
        <!-- 
        <!--
        <el-row type="flex" :gutter="10" align="right" class="mb8">
          <el-col :span="6">
            <el-button
@@ -541,7 +555,7 @@
              width="120"
            >
              <template slot-scope="scope">
                <el-input 
                <el-input
                  v-model="scope.row.foodexpenses"
                  placeholder="伙食费报销"
                  @blur="
@@ -909,6 +923,15 @@
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="算税状态" prop="infoid">
              <el-radio-group v-model="form.istax" align="left">
                <el-radio :label="-1">审核中</el-radio>
                <el-radio :label="0">允许算税</el-radio>
                <el-radio :label="1">已算税</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row
@@ -1083,15 +1106,25 @@
              class="pdfimgmin"
            >
              <!-- <img :src="pdfimg" /> -->
              <el-image
              <!-- <el-image
                style="width: 95%; height: 90%"
                :src="pdfimg"
                :preview-src-list="pdfimgsrcList"
                :preview-src-list="pdfimgsrcList" -->
              >
                <el-image
                  ref="imagePreview"
                  style="width: 95%; height: 90%"
                  :src="pdfimg"
                  :preview-src-list="pdfimgsrcList"
                  :initial-index="initialIndex"
                  @error="handleImageError"
                  @load="handleImageLoad"
                >
                </el-image>
                <!-- <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>
@@ -1373,6 +1406,9 @@
        ],
        deptmentname: [
          { required: true, message: "请输入所属业务组", trigger: "blur" }
        ],
        costtype: [
          { required: true, message: "请输入报销类别", trigger: "blur" }
        ]
      },
      //费用申请单form
@@ -1417,6 +1453,7 @@
      invoicefileListto: [],
      invoicepdfimg: "",
      invoicepdfimgsrcList: [],
      initialIndex: 0, // 初始索引
      //人员类别
      persontype: null,
      //到达地
@@ -1478,7 +1515,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;
@@ -1501,7 +1545,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) {
@@ -1520,7 +1572,43 @@
        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;
    },
    handleImageError() {
      console.error("图片加载失败");
    },
    handleImageLoad() {
      console.log("图片加载成功");
    },
    handleUploadError() {},
    // 获取请求头
    Getnetworkheader() {
@@ -1652,7 +1740,6 @@
      this.pdfVisible = true;

      if (this.rbDetails[index].annexfilesList) {

        const fetchPromises = this.rbDetails[index].annexfilesList.map(
          (value, indexson) => {
            const pdfimg = this.Networkheader + "/prod-api" + value.url;
@@ -1705,10 +1792,14 @@
        );

        Promise.all(fetchPromises).then(invoicefileListto => {
          this.invoicefileListto = invoicefileListto.filter(item => item !== null);
          this.invoicefileListto = invoicefileListto.filter(
            item => item !== null
          );
          this.invoicepdfimg = this.invoicefileListto[0].url;
          console.log(this.invoicepdfimg, "invoicepdfimg");
          this.invoicepdfimgsrcList = this.invoicefileListto.map(item => item.url);
          this.invoicepdfimgsrcList = this.invoicefileListto.map(
            item => item.url
          );
        });

        this.previewpdf = true;
@@ -1816,8 +1907,10 @@
        const index = this.getIndexInArray(this.fileListto, row);
        const item = this.fileListto.splice(index, 1)[0]; // 移除指定索引处的元素，并保存到item变量中
        this.fileListto.splice(index - 1, 0, item); // 将item插入到索引位置的前一位
     
        const indexann = this.rbDetails[this.atpresent].annexfilesList.findIndex(item => item.name == row.name);

        const indexann = this.rbDetails[
          this.atpresent
        ].annexfilesList.findIndex(item => item.name == row.name);
        const itemann = this.rbDetails[this.atpresent].annexfilesList.splice(
          indexann,
          1
@@ -1831,8 +1924,10 @@
        const index = this.getIndexInArray(this.invoicefileListto, row);
        const item = this.invoicefileListto.splice(index, 1)[0]; // 移除指定索引处的元素，并保存到item变量中
        this.invoicefileListto.splice(index - 1, 0, item); // 将item插入到索引位置的前一位
      
        const indexinvo = this.rbDetails[this.atpresent].invoicefilesList.findIndex(item => item.name == row.name);

        const indexinvo = this.rbDetails[
          this.atpresent
        ].invoicefilesList.findIndex(item => item.name == row.name);
        const iteminvo = this.rbDetails[this.atpresent].invoicefilesList.splice(
          indexinvo,
          1
@@ -2478,11 +2573,20 @@
      this.$modal.loading("正在提交审核，请稍候！");

      checkfund(checkfundobj).then(res => {
        this.$modal.closeLoading();
        this.$modal.msgSuccess("提交审核成功!");
        // 关闭窗口
        this.$store.dispatch("tagsView/delView", this.$route);
        this.$router.go(-1);
        if (res.code == 200) {
          this.$modal.closeLoading();
          this.$modal.msgSuccess("提交审核成功!");
          // 关闭窗口
          this.$store.dispatch("tagsView/delView", this.$route);
          this.$router.go(-1);
        } else {
          this.$modal.closeLoading();
          if (res.msg) {
            this.$modal.msgError("操作失误");
          } else {
            this.$modal.msgError(res.msg);
          }
        }
      });
    },

@@ -2508,8 +2612,48 @@

          const rbDetails = [...this.rbDetails];
          const rbPayees = [...this.rbPayees];
          //保存前校验数据
          for (let k = 0; k < rbDetails.length; k++) {
            let tempDetail = rbDetails[k];
            console.log(tempDetail, "tem");
            if (!tempDetail.persontype) {
              this.$modal.msgWarning(
                "明细表中，第" +
                  (k + 1).toString() +
                  "行的人员类别未选择，请先选择人员类别后再提交保存！"
              );
              return;
            }

            if (!tempDetail.personname) {
              this.$modal.msgWarning(
                "明细表中，第" +
                  (k + 1).toString() +
                  "行的费用人员未选择,请选择费用人员后再提交保存！"
              );
              return;
            }

            if (!tempDetail.starttime) {
              this.$modal.msgWarning(
                "明细表中，第" +
                  (k + 1).toString() +
                  "行的开始日期未选择,请选择开始日期后再提交保存！"
              );
              return;
            }

            if (!tempDetail.endtime) {
              this.$modal.msgWarning(
                "明细表中，第" +
                  (k + 1).toString() +
                  "行的结束日期姓名为选择,请选择结束日期后再提交保存！"
              );
              return;
            }
          }

          if (this.form.id != null) {
            console.log(this.form);
            updateReimbursement(this.form);
            //   .then(res => {
            //保存明细
@@ -2679,7 +2823,6 @@
          const rbDetails = [...this.rbDetails];
          const rbPayees = [...this.rbPayees];
          if (this.form.id != null) {
            console.log(this.form);
            updateReimbursement(this.form);
            //   .then(res => {
            //保存明细