import React, { Component } from "react"; import { Form, Input, Button, message, Modal, Spin, Table } from "antd"; import { ShowModal, splitUrl, getAccountName, getSecondaryAccountName, getVehicleName, getTypeName, commonAdd, dealBigMoney } from "../../../tools" import ImgList from "../../../common/imgList"; import ReactToPrint from "react-to-print"; import moment from "moment"; import $ from "jquery/src/ajax"; import './accountReview.less'; const FormItem = Form.Item; class AccountDetails extends Component { constructor(props) { super(props); this.state = { editAmount: false, isTable: true, loading: false, visible: "", data: {}, logvisible: false, logdataSour: [], logcolumns: [ { title: "审核人", dataIndex: "auditorName", key: "auditorName" }, { title: "操作", dataIndex: "status", key: "status", width: 120, render: (text, record) => { return ( {["【发起】", "【通过】", "【完成】", "【驳回】", "【重新发起】"][text]} {this.state.processStatus == record.processStatus && !record.id &&  审核中...} ); }, }, { title: "操作时间", dataIndex: "createTimeStr", key: "createTimeStr", width: 88, }, { title: "备注", dataIndex: "remarks", key: "remarks", render: (text, record) => { return (
{text}
) } } ], columns: [ { title: "序号", dataIndex: "a", key: "a", width: "3%", render: (text, record, index) => { return (
{index + 1}
) } }, { title: "费用时间", dataIndex: "agreeTime", key: "agreeTime", width: "10%", render: (text, record) => { return (
{record.types == 1 ? (moment(record.releaseStart).format("YYYY-MM-DD HH:mm") + " 至 " + moment(record.releaseEnd).format("YYYY-MM-DD HH:mm")) : !!text ? text : record.startTime}
) } }, { title: "出差时长", dataIndex: "duration", key: "duration", width: "4%", render: (text, record) => { return (
{record.types == 1 ? text : ""}
) } }, { title: "出差地址", dataIndex: "districtName", key: "districtName", width: "10%", render: (text, record) => { return (
{text}
) } }, { title: "出差企业", dataIndex: "userNames", key: "userNames", width: "10%", render: (text, record) => { return (
{text}
) } }, { title: "合同编号", dataIndex: "contractNo", key: "contractNo", width: "8%", render: (text, record) => { return (
{text}
) } }, { title: "交通工具", dataIndex: "cost", key: "cost", width: "8%", render: (text, record) => { return (
{!!text ? text : (!!record.vehicle && record.type == 1 ? ( getVehicleName(record.vehicle, record.vehicleOther) + "(" + record.startDistrict + " - " + record.endDistrict + ")" ) : getTypeName(record.type, record.typeOther))}
) } }, { title: "费用", dataIndex: "amount", key: "amount", width: "5%", render: (text, record) => { return (
{text}
) } }, { title: "实报", dataIndex: "realAmount", key: "realAmount", width: "5%", render: (text, record) => { return (
{ !record.cost && this.props.isOperate && this.setState({ editAmount: true, upAmount: text, upId: record.id, }) }} >{text}
) } }, { title: "类型", dataIndex: "types", key: "types", width: "8%", render: (text, record) => { return (
{getAccountName(text, record.typesOther)}
) } }, { title: "出差事由", dataIndex: "plan", key: "plan", // width: "10%", render: (text, record) => { return (
{text}
) } }, { title: "报销订单/部门", dataIndex: "orderNo", key: "orderNo", // width: "10%", render: (text, record) => { return (
{text}
{record.applyDepName}
) } }, { title: "报销事由", dataIndex: "remarks", key: "remarks", // width: "10%", render: (text, record) => { return (
{text}
) } }, ] }; } componentDidMount() { const { id } = this.props !!id && this.getDetails(id) } // 报销信息详情 getDetails(id) { this.setState({ loading: true, }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/expenseAccount/mainExpense", data: { id, }, success: function (data) { ShowModal(this); this.setState({ loading: false, }); if (data.error.length === 0) { let allData = data.data; let allList = []; for (var i = 0; i < allData.sonList.length; i++) { let dlist = allData.sonList[i].detList for (var j = 0; j < dlist.length; j++) { let obj = dlist[j] allData.sonList[0].detList[0].contractNo = allData.contractNo; // 合同编号 allData.sonList[0].detList[0].orderNo = allData.orderNo; // 订单号 allData.sonList[0].detList[0].applyDepName = allData.applyDepName; // 部门 allData.sonList[0].detList[0].remarks = allData.remarks; // 报销事由 dlist[0].releaseStart = allData.sonList[i].releaseStart; dlist[0].releaseEnd = allData.sonList[i].releaseEnd; // 公出时间 dlist[0].duration = allData.sonList[i].duration; // 费用时间 dlist[0].districtName = allData.sonList[i].districtName; // 出差地址 dlist[0].userNames = allData.sonList[i].userNames; // 出差企业 dlist[0].plan = allData.sonList[i].plan; // 出差事由 dlist[0].types = allData.sonList[i].type; // 报销类型 dlist[0].typesOther = allData.sonList[i].typeOther; if (allData.sonList[i].type == 2) { // 非业务报销 obj.type = allData.sonList[i].secondaryType; obj.typeOther = allData.sonList[i].secondaryTypeOther; } else if (allData.sonList[i].type == 3 || allData.sonList[i].type == 0) { // 第三方付款 其他 obj.cost = "费用" } else if (allData.sonList[i].type == 4) { // 申请借支 obj.cost = "借支费用" } else if (allData.sonList[i].type == 4) { // 申请抵扣 obj.cost = "抵扣费用" } allList.push(obj) } allList.push({ id: allData.sonList[i].id, cost: "小计", amount: allData.sonList[i].amount, realAmount: allData.sonList[i].realAmount }) } allList.push({ id: allData.id, cost: "合计", amount: allData.amount, realAmount: allData.realAmount }) this.setState({ data: data.data, newList: allList, }) // console.log(allData, "==", allList) // this.setState({ // data: data.data, // imgs: data.data.attachmentUrl // ? splitUrl(data.data.attachmentUrl, ",", globalConfig.avatarHost + "/upload") // : [], // }) // this.getAccountList(id) // this.getLogData(id) } else { message.warning(data.error[0].message) } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); } // 报销费用详情 // getAccountList(eaid) { // const { data } = this.state // $.ajax({ // method: "get", // dataType: "json", // crossDomain: false, // url: globalConfig.context + "/api/admin/expenseAccount/details/list", // data: { eaid, }, // success: function (datas) { // if (datas.error.length === 0) { // let sum = 0 // for (var i = 0; i < datas.data.length; i++) { // sum = commonAdd(sum, datas.data[i].amount) // } // let leftList = JSON.parse(JSON.stringify(datas.data)) || [] // let jsonArray = [] // if (data.type != 4 && data.type != 5 && data.debitTotalAmount) { // leftList.push({ "other": "预借支", "amount": data.debitTotalAmount },) // } // if (data.type != 4 && data.type != 5) { // leftList.push( // { "other": "总金额", "amount": sum }, // { "other": "实报金额", "amount": (sum > data.debitTotalAmount) ? commonAdd(sum, -data.debitTotalAmount) : 0 }) // } // if (data.type == 1) { // // 差旅费 // jsonArray = [ // { "head": `支付公司:${data.payDepName}` }, // { "head": `事由:${data.remarks}` }, // { "head": `公出企业:${data.userNames}` }, // { "head": `公出地点:${data.districtName}` }, // { "head": `时间:${moment(data.releaseStartStr).format('YYYY-MM-DD HH:mm') + " 至 " + moment(data.releaseEndStr).format('YYYY-MM-DD HH:mm')}` }, // { "head": `公出时长:${data.duration}` }, // ] // } else if (data.type == 3) { // // 第三方付款 // jsonArray = [ // { "head": `支付公司:${data.payDepName}` }, // { "head": `事由:${data.remarks}` }, // ] // } else { // // 通用 // jsonArray = [ // { "head": `事由:${data.remarks}` }, // ] // } // let newArray = [] // if (jsonArray.length >= leftList.length) { // for (var i = 0; i < leftList.length; i++) { // jsonArray[i] = Object.assign(jsonArray[i], leftList[i]) // } // newArray = jsonArray // } else { // for (var i = 0; i < jsonArray.length; i++) { // leftList[i] = Object.assign(jsonArray[i], leftList[i]) // } // newArray = leftList // } // newArray.push({}, {}) // this.setState({ // list: datas.data || [], // newList: newArray, // total: sum, // }) // } else { // message.warning(datas.error[0].message); // } // }.bind(this), // }).always( // function () { // this.setState({ // loading: false, // }); // }.bind(this) // ); // } isHere(list = []) { for (var i = 0; i < list.length; i++) { if (!list[i].id) { this.setState({ processStatus: list[i].processStatus }) return } } } // 日志 getLogData(eaid) { $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/expenseAccount/log/list", data: { eaid }, success: function (data) { if (data.error.length === 0) { this.setState({ logdataSour: data.data || [] }); this.isHere(data.data || []) } else { message.warning(data.error[0].message); } }.bind(this) }).always( function () { }.bind(this) ); } // 审核 toExamine(num) { const { checkData, reason } = this.state if (!reason) { message.warning("请填写审核说明~"); return; } this.setState({ loading: true, }); $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/expenseAccount/examine", data: { id: checkData.id, reason, status: num,//1同意 3驳回 }, }).done( function (data) { if (!data.error.length) { message.success("审核成功!"); this.setState({ visible: "", reason: "", showDetails: false, checkData: {}, }); this.getDetails(this.state.data.id) } else { message.warning(data.error[0].message); } }.bind(this) ); } distinct(arr, key) { let hash = {}; let result = []; for (let i = arr.length - 1; i >= 0; i--) { let value = arr[i][key]; if (!hash[value]) { hash[value] = true; result.unshift(arr[i]); } } return result; } // 修改实报金额 updateRealAmount() { this.setState({ upLoading: true, }) $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/expenseAccount/updateRealAmount", data: { id: this.state.upId, amount: this.state.upAmount, }, }).done( function (data) { this.setState({ upLoading: false, }) if (!data.error.length) { message.success("修改成功!"); this.setState({ editAmount: false, upId: "", }); this.getDetails(this.state.data.id) } else { message.warning(data.error[0].message); } }.bind(this) ); } render() { const { TextArea } = Input const { data, visible, newList, logdataSour, columns } = this.state const { onCancel } = this.props const formItemLayout = { labelCol: { span: 5 }, wrapperCol: { span: 18 }, }; return ( 报销详情 } footer="" >
{ this.refs.all = e; }} > {this.state.isTable ?
报销明细表
报销编号:{data.checkNo}
申请部门:{data.applyDepName}
收款方式:{data.bank + " " + data.accounts + " " + data.name}
报销人:{data.aname}
报销日期:{moment(data.createTimeStr).format('YYYY年MM月DD日')}
{/*
报销公司:{data.applyDepName}
报销人:{data.aname}
*/} :
{data.checkNo}
{data.totalAmount}
{data.buyerName}
{data.contractNo}
{data.createTimeStr}
{data.type == 1 &&
公出信息
{data.userNames}
{data.districtName}
{data.releaseStartStr} 至 {data.releaseEndStr}
{data.duration}小时
}
报销详细
{data.aname}
{data.applyDepName}
{data.payDepName}

{data.remarks}

报销费用详细
{ data.sonList.map(it =>
{it.totalAmount}(元)
{getAccountName(it.type, it.typeOther)} {it.type == 2 && (" - " + getSecondaryAccountName(it.secondaryType, it.secondaryTypeOther))}
{/* 差旅费显示 */} {it.type == 1 && it.detList.map(item => item.type == 1 ?
{getVehicleName(item.vehicle, item.vehicleOther)} ({item.startDistrict + " - " + item.endDistrict}) {item.amount}(元)
:
{item.amount}(元)
) } {/* 通用 */} {(it.type == 0 || it.type == 2 || it.type == 4 || it.type == 5) && it.detList.map(item =>
{!!item.agreeTimeStr && {item.agreeTimeStr.slice(0, 10)} } {item.amount}(元)
) } {/* 第三方付款 */} {it.type == 3 && it.detList.map(item =>
{!!item.agreeTimeStr && {item.agreeTimeStr.slice(0, 10)} } {["公对公转账"][item.payType]} {["普票", "专票"][item.invoiceType]} {item.invoiceNo} {item.payerName} {item.openBank} {item.bankAccounts} {item.openBankAddress} {item.amount}
) }
{!!it.attachmentUrl ? :
}
) } {data.type != 4 && data.debitTotalAmount &&
{data.debitTotalAmount}(元)
} {data.type != 4 && data.type != 5 &&
{data.totalAmount}(元)
} {data.type != 4 && data.type != 5 &&
{data.realAmount}(元)
}
收款详情
{data.type != 3 && data.type != 5 &&
{data.name}
{data.bank}
{data.accounts}
}
审核意见
    {logdataSour.map((item, index) => { return (
  • {/* {item.auditorName + ":" + item.status + item.remarks + "(" + item.createTimeStr + ")"} */} {item.auditorName}: {["【发起】,", "【通过】,", "【完成】,", "【驳回】,", "【重新发起】,"][item.status]} {this.state.processStatus == item.processStatus && !item.id && data.status != 0 &&  审核中...} {item.remarks}    {item.createTimeStr}
  • ); })}
{this.props.isOperate && data.examine == 1 &&