<!--
 * @Author: ysh
 * @Date: 2024-05-10 14:45:08
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2026-03-26 16:34:59
-->
<template>
  <div class="mt20">
    <div class="nav-btn" v-if="taskName != ''">
      <div>
        <el-button class="mb20" type="primary" plain size="mini" icon="el-icon-plus"
          @click="addBorrowFlow">新增借款</el-button>
      </div>
      <div>
        <el-button icon="el-icon-refresh" circle size="mini" @click="getBorrowData()"></el-button>
      </div>
    </div>

    <el-table :data="borrowList" style="width: 100%">
      <el-table-column type="index" label="序号" width="50" />
      <el-table-column label="申请状态" width="110">
        <template slot-scope="scope">
          <el-tag :type="scope.row.lendTime == null ? 'warning' : 'success'">
            {{ scope.row.lendTime == null ? '审批中' : '已完成' }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="borrowUsage" label="申请类型" width="110">
        <template slot-scope="scope">
          <el-tag :type="scope.row.borrowUsage === '0' ? 'primary' : 'info'">{{ scope.row.borrowUsage === '0' ?
            '项目借款' : '非项目借款' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="applyAmount" label="申请金额" width="110" />
      <el-table-column prop="managerAmount" label="核准金额"  width="110"/>
      <el-table-column prop="applierUser.nickName" label="申请人"  width="110"/>
      <el-table-column prop="dept.deptName" label="申请部门" width="110" />
      <el-table-column prop="applyDate" label="申请时间" width="110" />
      <el-table-column prop="deptComment" label="部门审核" show-overflow-tooltip width="110">
        <template slot-scope="scope">
          {{ scope.row.deptComment == null ? '待审' : scope.row.deptComment }}
        </template>
      </el-table-column>
      <el-table-column prop="managerComment" label="分管审核" show-overflow-tooltip width="110">
        <template slot-scope="scope">
          {{ scope.row.managerComment == null ? '待审' : scope.row.managerComment }}
        </template>
      </el-table-column>
      <el-table-column prop="zjlComment" label="总经理审核" show-overflow-tooltip width="110">
        <template slot-scope="scope">
          {{ scope.row.zjlComment == null ? '待审' : scope.row.zjlComment }}
        </template>
      </el-table-column>
      <el-table-column prop="cwUser.nickName" label="财务经办人" show-overflow-tooltip width="110">
      </el-table-column>
      <el-table-column prop="lendTime" label="支付时间">
      </el-table-column>
      <el-table-column label="操作" fixed="right" header-align="center" width="110">
        <template slot-scope="scope">
          <el-button icon="el-icon-view" type="text" size="mini" @click="handleLook(scope.row)">查看明细</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog title="借款明细" :visible.sync="open" append-to-body>
      <el-table :data="detailList" style="width: 100%">
        <el-table-column type="index" label="序号" width="50" />
        <el-table-column prop="borrowItem" label="借款项目" />
        <el-table-column prop="unit" label="单位" />
        <el-table-column prop="price" label="单价" />
        <el-table-column prop="quantity" label="数量" />
        <el-table-column prop="applyAmount" label="金额" />
        <!-- <el-table-column prop="xmAmount" label="项目部校核金额" /> -->
        <el-table-column prop="managerAmount" label="分管校核金额" />
      </el-table>
      <div class="mt20" style="display:flex;">
        <div style="width:120px"><b>借款人说明：</b></div>
        <div>{{ clickRow.remark }}</div>
      </div>
      <el-form inline class="mt20">
        <el-form-item label="申请金额：">
          {{ clickRow.applyAmount }}
        </el-form-item>
        <el-form-item label="校准金额：" style="margin-left:20px;">
          {{ clickRow.managerAmount == null ? 0 : clickRow.managerAmount }}
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { listBorrow, getBorrow, delBorrow, addBorrow, updateBorrow } from "@/api/oa/borrow/borrow";
import { listBorrowDetail, addBorrowDetail, updateBorrowDetail } from "@/api/oa/borrow/borrowDetail";
import { listDefinition } from "@/api/flowable/definition";
import { getNextFlowNodeByStart } from "@/api/flowable/todo";
import { definitionStart, flowXmlAndNode } from "@/api/flowable/definition";
import { todoList } from "@/api/flowable/todo";
import { Snowflake } from '@/utils/snowFlake.js'
import { MessageBox } from 'element-ui'
export default {
  props: {
    taskForm: {
      type: Object,
      required: true
    },
    taskName: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      borrowList: [],
      detailList: [],
      definitionList: [], //流程列表
      clickRow: {},
      open: false,
    }
  },
  mounted() {
    this.getBorrowData()
    this.listDefinition();
  },
  methods: {
    getBorrowData() {
      listBorrow({ pageSize: 9999, projectId: this.taskForm.formId }).then(res => {
        if (res.code == 200) {
          this.borrowList = res.rows
        }
      })
    },
    getBorrowDetailData(borrowId) {
      listBorrowDetail({ pageSize: 9999, borrowId: borrowId }).then(res => {
        if (res.rows.length != 0) {
          this.detailList = res.rows
        }
      });
    },
    handleLook(row) {
      this.open = true
      this.clickRow = row
      this.getBorrowDetailData(row.borrowId);
    },
    addBorrowFlow() {
      let row = this.definitionList[0];
      let formId = new Snowflake(1n, 1n, 0n).nextId().toString();
      getNextFlowNodeByStart({ deploymentId: row.deploymentId, variables: { formId: formId } }).then(res => {
        let data = res.data
        const variables = {};
        const formData = {};
        formData.formId = formId
        if (row.id) {
          MessageBox.confirm('是否发起借款申请？', '系统提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => {
            variables.variables = formData;
            // 启动流程并将表单数据加入流程变量
            definitionStart(row.id, JSON.stringify(variables)).then(res => {
              this.$modal.msgSuccess(res.msg);
              let procInstanceId = res.data;
              todoList({
                pageNum: 1,
                pageSize: 99999999,
                processInsId: procInstanceId
              }).then(toDoRes => {
                let records = toDoRes.data.records;
                if (records.length == 1) {
                  records = records[0]
                }
                this.$router.push({
                  path: '/applyForm/borrow',
                  query: {
                    procInsId: records.procInsId,
                    executionId: records.executionId,
                    deployId: records.deployId,
                    taskId: records.taskId,
                    taskName: records.taskName,
                    startUser: records.startUserName + '--' + records.startDeptName,
                    formId: formData.formId,
                    procDefName: records.procDefName,
                    projectId: this.taskForm.formId
                  }
                })
              })
            })
          })
        }
      })
    },
    listDefinition() {
      listDefinition({
        pageNum: 1,
        pageSize: 9999,
        name: '借款审批'
      }).then(response => {
        this.definitionList = response.data.records;
      });
    },
  }
}
</script>

<style lang="scss" scoped>
.nav-btn {
  display: flex;
  justify-content: space-between;
}
</style>