<template>
  <div class="container">
    <!-- 表格内容区域 -->
    <div class="total_content">
      <el-table :data="tableData" style="width: 100%" border>
        <el-table-column type="expand" align="center">
          <template slot-scope="props">
            <el-form label-position="left" class="demo-table-expand">
              <div style="width: 100%">
                <el-descriptions title="报销详情" :column="5" border>
                  <el-descriptions-item label="组长审批状态" :span="2">
                    <el-tag
                      :type="
                        props.row.tripStatus == 0
                          ? 'info'
                          : props.row.tripStatus == 2
                          ? 'danger'
                          : 'success'
                      "
                    >
                      {{
                        props.row.tripStatus == 0
                          ? "待审批"
                          : props.row.tripStatus == 2
                          ? "驳回"
                          : "通过"
                      }}
                    </el-tag>
                  </el-descriptions-item>
                  <el-descriptions-item
                    label="组长审批时间"
                    :span="3"
                    :formatter="timestampToTime"
                    >{{ props.row.headmanTime }}</el-descriptions-item
                  >
                  <el-descriptions-item label="组长驳回缘由" :span="5">{{
                    props.row.headmanRefute || "无"
                  }}</el-descriptions-item>
                  <el-descriptions-item label="财务审批状态" :span="2">
                    <el-tag
                      :type="
                        props.row.tripStatus == 4
                          ? 'danger'
                          : props.row.tripStatus == 3
                          ? 'success'
                          : 'info'
                      "
                    >
                      {{
                        props.row.tripStatus == 4
                          ? "驳回"
                          : props.row.tripStatus == 3
                          ? "通过"
                          : "待审批"
                      }}
                    </el-tag>
                  </el-descriptions-item>
                  <el-descriptions-item
                    label="财务审批时间"
                    :span="3"
                    :formatter="timestampToTime"
                    >{{ props.row.financeTime }}</el-descriptions-item
                  >
                  <el-descriptions-item label="财务驳回缘由" :span="5">{{
                    props.row.finaceRefute || "无"
                  }}</el-descriptions-item>
                  <el-descriptions-item label="查看详情" :span="5">
                    <el-button
                      @click="getdetails(props.row)"
                      type="primary"
                      style="margin: 5px"
                      size="mini"
                      >查看详情</el-button
                    >
                  </el-descriptions-item>
                </el-descriptions>
              </div>
            </el-form>
          </template>
        </el-table-column>
        <el-table-column align="center" label="序号" width="50px">
          <template slot-scope="scope">
            {{
              (queryitem.pageNum - 1) * queryitem.pageSize + scope.$index + 1
            }}
          </template>
        </el-table-column>
        <el-table-column align="center" label="报销人" prop="userName">
        </el-table-column>
        <el-table-column align="center" label="报销项目" prop="projectName">
        </el-table-column>
        <el-table-column
          align="center"
          label="申报总金额"
          prop="applyTotalAmountSmall"
        >
        </el-table-column>
        <el-table-column label="核报总金额" align="center">
          <template slot-scope="props">
            {{ props.row.verifyTotalAmountSmall || "还未核实金额" }}
          </template>
        </el-table-column>
        <el-table-column align="center" label="组长审批人">
          <template slot-scope="props">
            {{ props.row.financeName || "暂无" }}
          </template>
        </el-table-column>
        <el-table-column align="center" label="财务审批人">
          <template slot-scope="props">
            {{ props.row.financeName || "暂无" }}
          </template>
        </el-table-column>
        <el-table-column
          label="报销日期"
          prop="applyTime"
          :formatter="timestampToTime"
          align="center"
        >
        </el-table-column>
        <el-table-column align="center" label="发票图片">
          <template slot-scope="scope">
            <el-button
              type="primary"
              size="mini"
              @click="ReviseImage(scope.row)"
              >点击查看</el-button
            >
          </template>
        </el-table-column>
        <el-table-column align="center" label="附件">
          <template slot-scope="scope">
            <el-button
              type="primary"
              size="mini"
              @click="selectImage(scope.row)"
              >点击查看</el-button
            >
          </template>
        </el-table-column>
        <el-table-column align="center" label="状态">
          <template slot-scope="props">
            <el-tag
              :type="
                props.row.tripStatus == 0
                  ? 'info'
                  : props.row.tripStatus == 1 || props.row.tripStatus == 3
                  ? 'success'
                  : 'danger'
              "
            >
              {{
                props.row.tripStatus == 0
                  ? "待审批"
                  : props.row.tripStatus == 1
                  ? "小组长通过"
                  : props.row.tripStatus == 2
                  ? "小组长驳回"
                  : props.row.tripStatus == 3
                  ? "财务通过"
                  : props.row.tripStatus == 4
                  ? "财务驳回"
                  : "不存在"
              }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作">
          <template slot-scope="scope">
            <div v-if="scope.row.tripStatus == 1">
              <el-button type="primary" @click="agreeandrefuse(scope.row)"
                >同意和驳回</el-button
              >
            </div>
            <div
              v-else-if="scope.row.tripStatus == 0"
              style="width：100%;text-align: center;"
            >
              待小组长审批
            </div>
            <div
              v-else-if="scope.row.tripStatus == 2"
              style="width：100%;text-align: center;color: red"
            >
              小组长已驳回
            </div>
            <div v-else style="width：100%;text-align: center;color:#13ce66">
              已处理
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 发票图片 -->
      <el-drawer
        title="发票详情"
        :visible.sync="invoiceShow"
        :direction="direction"
        size="40%"
      >
        <!-- filePath-->
        <el-table
          :data="getinvoivelist"
          style="width: 100%; text-align: center"
          border
        >
          <el-table-column
            type="index"
            label="序号"
            width="40"
          ></el-table-column>
          <el-table-column prop="prop" label="发票详情">
            <template slot-scope="scope">
              <div v-if="fromgetlist(scope.row)">
                <el-image
                  style="width: 100px; height: 100px"
                  :src="scope.row.filePath"
                  :preview-src-list="[scope.row.filePath]"
                ></el-image>
              </div>
              <div v-else>
                <a class="a-style" @click="Agrt(scope.row)">点击查看文件</a>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-drawer>
      <!-- 查看详情 -->
      <el-drawer
        title="查看详情"
        :visible.sync="drawer"
        :direction="direction"
        size="40%"
      >
        <el-form label-width="180px">
          <el-row>
            <el-col :span="12">
              <div class="grid-content bg-purple">
                <el-form-item label="审批状态">
                  <el-tag
                    :type="
                      paramlist.tripStatus == 0
                        ? 'info'
                        : paramlist.tripStatus == 1 || paramlist.tripStatus == 3
                        ? 'success'
                        : 'danger'
                    "
                  >
                    {{
                      paramlist.tripStatus == 0
                        ? "待审批"
                        : paramlist.tripStatus == 1
                        ? "小组长通过"
                        : paramlist.tripStatus == 2
                        ? "小组长驳回"
                        : paramlist.tripStatus == 3
                        ? "财务通过"
                        : paramlist.tripStatus == 4
                        ? "财务驳回"
                        : "不存在"
                    }}
                  </el-tag>
                </el-form-item>
                <el-form-item label="附件数量">
                  <span>{{ paramlist.enclosureNumber }}</span>
                </el-form-item>
                <el-form-item label="出差理由">
                  <span>{{ paramlist.tripReason }}</span>
                </el-form-item>
                <el-form-item label="出发地点">
                  <span>{{ paramlist.fromPlace }}</span>
                </el-form-item>
                <el-form-item label="目的地点">
                  <span>{{ paramlist.purposePlace }}</span>
                </el-form-item>
                <el-form-item label="经过地点">
                  <span>{{ paramlist.transitPlace }}</span>
                </el-form-item>
                <el-form-item label="交通工具">
                  <span>{{ paramlist.vehicle }}</span>
                </el-form-item>

                <el-form-item label="伙食补贴">
                  <span>{{ paramlist.foodAllowance }}</span>
                </el-form-item>
                <el-form-item label="公杂补贴">
                  <span>{{ paramlist.publicMiscellaneousSubsidy }}</span>
                </el-form-item>
                <el-form-item label="随从人员">
                  <el-tag
                    type="warning"
                    size="medium"
                    v-for="item in paramlist.entouragelist"
                    :key="item.id"
                    style="margin: 0px 5px"
                    >{{ item.personnelName }}</el-tag
                  >
                </el-form-item>
              </div>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light">
                <el-form-item label="火车/汽车/轮船费">
                  <span>{{ paramlist.tripCost }}</span>
                </el-form-item>
                <el-form-item label="机票费">
                  <span>{{ paramlist.planeTicket }}</span>
                </el-form-item>
                <el-form-item label="汽油费">
                  <span>{{ paramlist.trafficCost }}</span>
                </el-form-item>
                <el-form-item label="住宿费">
                  <span>{{ paramlist.lodgingCost }}</span>
                </el-form-item>
                <el-form-item label="其他费用">
                  <span>{{ paramlist.otherCost }}</span>
                </el-form-item>
                <el-form-item label="备注">
                  <span>{{ paramlist.remarks }}</span>
                </el-form-item>
                <el-form-item label="无票据说明">
                  <span>{{ paramlist.nobillExplain }}</span>
                </el-form-item>
                <el-form-item label="是否领取补贴">
                  <span>{{ paramlist.receiveSubsidy == 0 ? "否" : "是" }}</span>
                </el-form-item>
                <el-form-item label="天数">
                  <span>{{ paramlist.days }}</span>
                </el-form-item>
              </div>
            </el-col>
          </el-row>
        </el-form>
      </el-drawer>
    </div>
    <!-- 同意和驳回 -->
    <el-drawer
      title="核实金额"
      :visible.sync="dialogVisible"
      direction="btt"
      :size="'100%'"
    >
      <div style="padding: 10px; width: 100%">
        <el-row :gutter="20">
          <el-col :xl="12" :lg="12" :md="24" :sm="24" style="margin: 10px 0px">
            <el-descriptions title="报销详情" :column="3" border>
              <el-descriptions-item label="审批状态"
                ><el-tag
                  :type="
                    financelistData.tripStatus == 0
                      ? 'info'
                      : financelistData.tripStatus == 1 ||
                        financelistData.tripStatus == 3
                      ? 'success'
                      : 'danger'
                  "
                >
                  {{
                    financelistData.tripStatus == 0
                      ? "待审批"
                      : financelistData.tripStatus == 1
                      ? "小组长通过"
                      : financelistData.tripStatus == 2
                      ? "小组长驳回"
                      : financelistData.tripStatus == 3
                      ? "财务通过"
                      : financelistData.tripStatus == 4
                      ? "财务驳回"
                      : "不存在"
                  }}
                </el-tag></el-descriptions-item
              >
              <el-descriptions-item label="项目列表">{{
                financelistData.projectName
              }}</el-descriptions-item>
              <el-descriptions-item label="申请时间">{{
                financelistData.applyTime
              }}</el-descriptions-item>
              <el-descriptions-item label="出差开始时间">{{
                financelistData.startTime
              }}</el-descriptions-item>
              <el-descriptions-item label="出差结束时间">{{
                financelistData.endTime
              }}</el-descriptions-item>
            </el-descriptions>
            <el-descriptions border>
              <el-descriptions-item :span="2" label="出差理由">{{
                financelistData.tripReason
              }}</el-descriptions-item>
              <el-descriptions-item label="出发地点">{{
                financelistData.fromPlace
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="目的地点">{{
                financelistData.purposePlace
              }}</el-descriptions-item>
              <el-descriptions-item label="经过地点">{{
                financelistData.transitPlace
              }}</el-descriptions-item>
              <el-descriptions-item label="交通工具">{{
                financelistData.vehicle
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="伙食补贴">{{
                financelistData.foodAllowance
              }}</el-descriptions-item>
              <el-descriptions-item label="公杂补贴">{{
                financelistData.publicMiscellaneousSubsidy
              }}</el-descriptions-item>
              <el-descriptions-item label="驳回理由">{{
                financelistData.headmanRefute
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="火车/汽车/轮船费">{{
                financelistData.tripCost
              }}</el-descriptions-item>
              <el-descriptions-item label="机票费">{{
                financelistData.planeTicket
              }}</el-descriptions-item>
              <el-descriptions-item label="汽油费">{{
                financelistData.trafficCost
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="住宿费">{{
                financelistData.lodgingCost
              }}</el-descriptions-item>
              <el-descriptions-item label="其他费用">{{
                financelistData.otherCost
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="备注">{{
                financelistData.remarks
              }}</el-descriptions-item>
              <el-descriptions-item label="无票据说明">{{
                financelistData.nobillExplain
              }}</el-descriptions-item>
              <el-descriptions-item label="是否领取补贴">{{
                financelistData.receiveSubsidy
              }}</el-descriptions-item>
              <el-descriptions-item :span="2" label="天数">{{
                financelistData.days
              }}</el-descriptions-item>
              <el-descriptions-item label="随从人员">
                <span
                  v-for="item in financelistData.entouragelist"
                  :key="item.tripId"
                  style="margin: 0px 5px"
                >
                  {{ item.userName }}
                </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-col>
          <el-col :xl="12" :lg="12" :md="24" :sm="24" style="margin: 10px 0px">
            <el-form
              ref="form"
              :model="agreeOrapproval"
              :inline="true"
              label-width="200px"
              :rules="rules"
            >
              <el-form-item
                label="核实报销总金额（大写）"
                prop="verifyTotalAmountLarge"
              >
                <el-input
                  disabled
                  v-model="agreeOrapproval.verifyTotalAmountLarge"
                ></el-input>
              </el-form-item>
              <el-form-item
                label="核实报销总金额（小写）"
                prop="verifyTotalAmountSmall"
              >
                <el-input
                  v-model="agreeOrapproval.verifyTotalAmountSmall"
                  @change="
                    convertCurrency(agreeOrapproval.verifyTotalAmountSmall)
                  "
                ></el-input>
              </el-form-item>
            </el-form>
            <div style="width: 100%; text-align: right; padding: 0px 10%">
              <el-button style="margin: 5px" type="success" @click="agree()"
                >同意</el-button
              >
              <el-button style="margin: 5px" type="warning" @click="refuse()"
                >驳回</el-button
              >
            </div>
          </el-col>
        </el-row>
      </div>
    </el-drawer>
    <!-- 分页区域 -->
    <div class="block">
      <el-pagination
        layout="->, total, prev, pager, next"
        :total="total"
        :page-size="queryitem.pageSize"
        @current-change="getpagelist"
      >
      </el-pagination>
    </div>
    <!-- 附件的下载与添加 -->
    <div>
      <el-drawer
        title="附件操作"
        :visible.sync="drawer2"
        :direction="direction"
        size="50%"
      >
        <!-- <el-button
          type="primary"
          style="margin-left: 5%; margin: 30px 50px"
          :disabled="disabled"
          @click="updatecard"
          >添加附件</el-button
        > -->

        <el-card
          class="box-card"
          style="width: 90%; margin-left: 5%; margin-top: 20px"
          v-show="getshow == 1"
        >
          <el-row class="row-bg">
            <div
              v-for="index in queryDTOList"
              :key="index.enclosureId"
              class="lsitall"
            >
              <el-col :span="10">
                <div style="margin-top: 6px; margin-left: 40px">
                  附件{{ index.enclosureId }}
                </div>
              </el-col>
              <el-col :span="12" style="margin-left: -50px">
                <el-button
                  type="primary"
                  icon="el-icon-folder-checked"
                  class="a-style"
                  size="mini"
                  style="font-size: 13px"
                  @click="delProject(index)"
                  >下载</el-button
                >

                <!-- <el-popover placement="top" width="160" v-model="index.visible">
                  <p>确定要删除此条附件吗</p>
                  <div style="text-align: right; margin: 0">
                    <el-button
                      size="mini"
                      type="text"
                      @click="index.visible = false"
                      >取消</el-button
                    >
                    <el-button
                      type="primary"
                      size="mini"
                      @click="deleteProject(index)"
                      >确定</el-button
                    >
                  </div>
                  <el-button
                    type="danger"
                    icon="el-icon-delete"
                    class="a-style"
                    size="mini "
                    style="font-size: 13px"
                    slot="reference"
                    >删除</el-button
                  >
                </el-popover> -->
              </el-col>
            </div>
          </el-row>
        </el-card>
        <!-- 附件上传 -->
        <!-- <el-card
          class="box-card"
          style="width: 90%; margin-left: 5%; margin-top: 20px"
          v-show="getshow == 0"
        >
          <div style="width: 60%; margin-left: 30px">
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入附件详情"
              v-model="proutlist1.enclosureDescribe"
              style="margin: 20px 0px"
            ></el-input>
            <el-upload
              class="upload-demo"
              ref="upload1"
              drag
              :action="action1"
              :file-list="fileList1"
              :on-remove="delfile1"
              :auto-upload="false"
              :on-change="onChangepdf"
              :on-success="Refresh"
              :data="proutlist1"
              multiple
              style="margin: 20px 0px"
            >
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">
                将文件拖到此处，或
                <em>点击上传附件</em>
              </div>
              <div class="el-upload__tip" slot="tip">
                只能上传文件，且不超过500kb
              </div>
            </el-upload>
          </div>
          <div style="margin-left: 75%">
            <el-button @click="remove()">取 消</el-button>
            <el-button
              type="primary"
              @click="determine()"
              style="margin-top: 20px"
              >确 定</el-button
            >
          </div>
        </el-card> -->

        <div class="box-card" v-show="getshow == 3"></div>
      </el-drawer>
    </div>
  </div>
</template>
  
<script>
import { money } from "@/utils/myValidate";
import { queryBypagefinance } from "@/api/spendreimbursement";
import { selectAll } from "@/api/spendreimbursement";
import { finApproval } from "@/api/spendreimbursement";
import { selectAllById, selectByIdF, deleteById } from "@/api/project";
export default {
  created() {
    // 获取 companyId
    this.queryitem.companyId = this.$store.getters.companyId;
    this.getinvoiveId.companyId = this.$store.getters.companyId;
    this.queryDTO.companyId = this.$store.getters.companyId;
    this.action1 = process.env.VUE_APP_BASE_API + "/file/updataEnclosures"; //保存附件与下载的接口
    this.getpagelist();
  },
  data() {
    return {
      queryitem: {
        pageNum: 1,
        pageSize: 10,
        companyId: null,
      },
      //查询图片给的值
      getinvoiveId: {
        companyId: null,
        tripId: 0,
      },
      total: null,
      dialogVisible: false,
      // 接受的数据
      tableData: [],
      // 随从人员
      entouragelist: [],
      // 同意和驳回
      agreeOrapproval: {
        tripId: null,
        tripStatus: 0, //状态
        financeId: null,
        finaceRefute: "无",
        financeTime: null,
        verifyTotalAmountLarge: null,
        verifyTotalAmountSmall: null,
      },
      invoiceShow: false,
      drawer: false,
      paramlist: {},
      financelistData: {},
      rules: {
        verifyTotalAmountLarge: [
          {
            required: true,
            message: "请输入申请报销总金额（大写）",
            trigger: "blur",
          },
        ],
        verifyTotalAmountSmall: [
          { required: true, validator: money, trigger: "blur" },
        ],
      },

      //附件///-------
      //drawer1: false,
      direction: "rtl",
      fileList1: [], //合同文件
      disabled: false, //隐藏
      getshow: 1, //判断show的显示与隐藏,
      //查询附件
      queryDTO: {
        companyId: null,
        tripId: null,
      },
      queryDTOList: [], //收集附件的数据
      //附件抽屉
      drawer2: false,
      //发票对话框
      dialogFormVisible: false,
      invoiceListAdd: [], //查询发票的集合
      getFormslist: {
        userId: null,
        companyId: null,
        type: 0,
      }, //查询的能选择的表单信息
      getListincom: [], //收集选择的数组
      incomeIdgrt: null, //收集incomeId数据
      getshow: 1, //判断show的显示与隐藏,
      //合同文件上传携带参数
      proutlist1: {
        Id: null,
        enclosureDescribe: "",
        status: 3, //0收入 1支出
        companyId: null,
        userId: null,
      },
      fileTypepdf: false, //判断合同文件是否存在
      fileList1: [], //附件文件
      disabled: false, //隐藏
    };
  },
  methods: {
    // 展示数据的方法
    getpagelist(pager = 1) {
      this.queryitem.pageNum = pager;
      queryBypagefinance(this.queryitem)
        .then((res) => {
          if (res.success) {
            console.log(res);
            this.total = res.data.total;
            this.tableData = res.data.list;
            res.data.list.forEach((item) => {
              selectAll({ tripId: item.tripId })
                .then((resu) => {
                  if (resu.success) {
                    item.entouragelist = resu.data;
                  } else {
                    this.$message.error(resu.msg);
                  }
                })
                .catch((error) => {
                  this.$message.error("失败");
                });
            });
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error("查询失败");
        });
    },
    agreeandrefuse(data) {
      this.financelistData = data;
      this.dialogVisible = true;
    },
    // 查看详情
    getdetails(data) {
      this.drawer = true;
      this.paramlist = data;
    },
    // 同意
    agree() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.$confirm("是否同意此报销单?, 是否继续?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              this.agreeOrapproval.financeId = this.$store.getters.urId;
              this.agreeOrapproval.tripStatus = 3;
              this.agreeOrapproval.tripId = this.financelistData.tripId;
              this.agreeOrapproval.financeTime = this.time();
              console.log(this.agreeOrapproval);
              finApproval(this.agreeOrapproval)
                .then((res) => {
                  if (res.success) {
                    this.$message({
                      type: "success",
                      message: "同意成功!",
                    });
                    this.getpagelist();
                  } else {
                    this.$message.error(res.msg);
                  }
                })
                .catch((error) => {
                  this.$message.error("操作失败");
                });
              this.dialogVisible = false;
            })
            .catch(() => {
              this.$message({
                type: "info",
                message: "已取消操作",
              });
            });
        }
      });
    },
    // 驳回
    refuse() {
      this.$prompt("驳回理由", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then((value) => {
          this.agreeOrapproval.financeId = this.$store.getters.urId;
          this.agreeOrapproval.finaceRefute = value.value;
          this.agreeOrapproval.tripStatus = 4;
          this.agreeOrapproval.tripId = this.financelistData.tripId;
          this.agreeOrapproval.financeTime = this.time();
          finApproval(this.agreeOrapproval)
            .then((res) => {
              if (res.success) {
                this.$message.success("操作成功");
                this.getpagelist();
              } else {
                this.$message.error(res.msg);
              }
            })
            .catch((error) => {
              this.$message.error("操作失败");
            });
          this.dialogVisible = false;
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消操作",
          });
        });
    },
    //时间处理 yyyy-MM-dd hh:mm:ss
    time() {
      var date = new Date();
      var Y = date.getFullYear() + "-";
      var M =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      var D =
        (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
      var h =
        (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
      var m =
        (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) +
        ":";
      var s =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      return Y + M + D + h + m + s;
    },
    //时间处理
    timestampToTime(row, column, cellValue) {
      return cellValue.split(" ")[0];
    },
    //查看图片的方法
    ReviseImage(row) {
      this.invoiceShow = true;
      this.getinvoiveId.tripId = row.tripId;
      this.Selectinsertlsit();
    },
    //查询发票图片
    Selectinsertlsit() {
      selectAllById(this.getinvoiveId)
        .then((res) => {
          if (res.success) {
            this.getinvoivelist = res.data;
            this.getinvoivelist.forEach((e) => {
              e.filePath = process.env.VUE_APP_BASE_API + e.filePath;
            });
            // console.log(this.getinvoivelist);
          } else {
            this.$message.error(res.msg);
            this.back();
          }
        })
        .catch((error) => {
          this.$message.error("获取发票图片失败");
          this.back();
        });
    },
    // 大小写
    convertCurrency(money) {
      //汉字的数字
      var cnNums = new Array(
        "零",
        "壹",
        "贰",
        "叁",
        "肆",
        "伍",
        "陆",
        "柒",
        "捌",
        "玖"
      );
      //基本单位
      var cnIntRadice = new Array("", "拾", "佰", "仟");
      //对应整数部分扩展单位
      var cnIntUnits = new Array("", "万", "亿", "兆");
      //对应小数部分单位
      var cnDecUnits = new Array("角", "分", "毫", "厘");
      //整数金额时后面跟的字符
      var cnInteger = "整";
      //整型完以后的单位
      var cnIntLast = "元";
      //最大处理的数字
      var maxNum = 999999999999999.9999;
      //金额整数部分
      var integerNum;
      //金额小数部分
      var decimalNum;
      //输出的中文金额字符串
      var chineseStr = "";
      //分离金额后用的数组，预定义
      var parts;
      if (money == "") {
        return "";
      }
      money = parseFloat(money);
      if (money >= maxNum) {
        //超出最大处理数字
        this.$message.warning("你输入的数字太大了");
        return "";
      }
      if (money == 0) {
        chineseStr = cnNums[0] + cnIntLast;
        // this.agreeOrapproval.verifyTotalAmountLarge = chineseStr;
      }
      //转换为字符串
      money = money.toString();
      if (money.indexOf(".") == -1) {
        integerNum = money;
        decimalNum = "";
      } else {
        parts = money.split(".");
        integerNum = parts[0];
        decimalNum = parts[1].substr(0, 4);
      }
      //获取整型部分转换
      if (parseInt(integerNum, 10) > 0) {
        var zeroCount = 0;
        var IntLen = integerNum.length;
        for (var i = 0; i < IntLen; i++) {
          var n = integerNum.substr(i, 1);
          var p = IntLen - i - 1;
          var q = p / 4;
          var m = p % 4;
          if (n == "0") {
            zeroCount++;
          } else {
            if (zeroCount > 0) {
              chineseStr += cnNums[0];
            }
            //归零
            zeroCount = 0;
            chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
          }
          if (m == 0 && zeroCount < 4) {
            chineseStr += cnIntUnits[q];
          }
        }
        chineseStr += cnIntLast;
      }
      //小数部分
      if (decimalNum != "") {
        var decLen = decimalNum.length;
        for (var i = 0; i < decLen; i++) {
          var n = decimalNum.substr(i, 1);
          if (n != "0") {
            chineseStr += cnNums[Number(n)] + cnDecUnits[i];
          }
        }
      }
      if (chineseStr == "") {
        chineseStr += cnNums[0] + cnIntLast + cnInteger;
      } else if (decimalNum == "") {
        chineseStr += cnInteger;
      }
      this.agreeOrapproval.verifyTotalAmountLarge = chineseStr;
    },

    ///----附件区域

    //查看项目附件.....
    selectImage(row) {
      this.queryDTO.tripId = row.tripId;
      this.proutlist1.Id = row.tripId;
      selectByIdF(this.queryDTO)
        .then((res) => {
          if (res.success) {
            this.queryDTOList = res.data;
            if (this.queryDTOList.length > 0) {
              this.drawer2 = true;
              this.getshow = 1;
              this.disabled = false;
            } else {
              this.drawer2 = true;
              this.disabled = false;
              this.getshow = 3;
            }
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error("获取附件文件失败");
        });
    },
    //下载附件
    delProject(row) {
      var a = document.createElement("a"); //创建一个<a></a>标签
      a.href = process.env.VUE_APP_BASE_API + row.enclosureFile; // 给a标签的href属性值加上地址，注意，这里是绝对路径，不用加 点.
      //a.download = row.enclosureFile; //设置下载文件文件名，这里加上.xlsx指定文件类型，pdf文件就指定.fpd即可
      a.target = "_blank";
      a.style.display = "none"; // 障眼法藏起来a标签
      document.body.appendChild(a); // 将a标签追加到文档对象中
      a.click(); // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
      a.remove(); // 一次性的，用完就删除a标签
    },
    //显示添加附件
    // updatecard() {
    //   this.getshow = 0;
    //   this.disabled = true;
    //   this.delfile1();
    // },
    //删除附件
    // deleteProject(row) {
    //   deleteById(row)
    //     .then((res) => {
    //       if (res.success) {
    //         this.selectImage(row);
    //         this.$message({
    //           message: "删除成功",
    //           type: "success",
    //         });
    //         this.visible = false;
    //         console.log(res.msg);
    //       }
    //     })
    //     .catch((errror) => {
    //       this.$message.error(res.msg);
    //     });
    // },
    //清除附件文件
    // delfile1(file) {
    //   this.fileList1 = this.fileList1.filter((item) => item.uid !== file.uid);
    //   this.fileTypepdf = false;
    //   this.proutlist1.enclosureDescribe = "";
    // },
    //确定提交附件
    // determine() {
    //   //判断是否有附件文件
    //   if (this.fileTypepdf) {
    //     this.proutlist1.userId = this.$store.getters.urId;
    //     this.proutlist1.companyId = this.$store.getters.companyId;
    //     this.$refs.upload1.submit();
    //     this.getshow = 1; //隐藏与显示
    //     this.disabled = false;
    //     this.$message({
    //       showClose: true,
    //       message: "上传附件成功",
    //       type: "success",
    //     });
    //     this.Refresh();
    //   } else {
    //     this.$message.error("请添加附件，在进行提交");
    //   }
    // },
    //刷新附件
    Refresh() {
      this.queryDTO.tripId = this.proutlist1.Id;
      console.log(this.proutlist1.Id);
      selectByIdF(this.queryDTO)
        .then((res) => {
          if (res.success) {
            this.queryDTOList = res.data;
            this.proutlist1.enclosureDescribe = ""; //初始化数据
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error("获取附件文件失败");
        });
    },
    //附件取消
    // remove() {
    //   if (this.queryDTOList.length > 0) {
    //     this.getshow = 1;
    //     this.disabled = false;
    //     this.backii();
    //     this.delfile1();
    //   } else {
    //     this.getshow = 3;
    //     this.disabled = false;
    //     this.backii();
    //     this.delfile1();
    //   }
    // },
    //附件文件校验
    // onChangepdf(file) {
    //   console.log(this.proutlist1);
    //   const fileNamepdf = file.name;
    //   let fileType = fileNamepdf.substring(fileNamepdf.lastIndexOf("."));
    //   if (fileType != "") {
    //     this.fileTypepdf = true;
    //   } else {
    //     this.$message.warning("附件只能只能上传文件");
    //     this.$refs.upload1.clearFiles();
    //     this.fileTypepdf = false;
    //   }
    // },

    //判断图片与pdf显示与隐藏
    fromgetlist(row) {
      if (row.filePath == null) {
        return false;
      } else {
        let fileNamepdf = row.filePath;
        let fileType = fileNamepdf.substring(fileNamepdf.lastIndexOf("."));
        if (fileType == ".pdf") {
          return true;
        } else {
          return false;
        }
      }
    },
    //跳转修改
    Agrt(row) {
      const photopath = row.filePath;
      console.log(photopath);
      window.open(photopath, "_blank");
    },
  },
};
</script>
  
<style scoped>
.total_content {
  padding: 15px;
}
.demo-table-expand {
  font-size: 0;
  padding: 0px 100px;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 150px;
  margin-bottom: 0;
  width: 80%;
}

.total_top {
  margin: 15px 20px;
}

.lsitall .el-col {
  margin: 20px 10px;
}
.lsitall .el-button {
  margin-left: 16px;
}
.row-bg {
  margin-left: 15%;
}
.dialog-footer {
  width: 90%;
  margin: 20px 5%;
}
.lsitall .el-col {
  margin: 20px 10px;
}
.lsitall .el-button {
  margin-left: 16px;
}
.row-bg {
  margin-left: 15%;
}
.dialog-footer {
  width: 90%;
  margin: 20px 5%;
}
</style>