Browse Source

新增报销详情表格及打印

dev01 1 year ago
parent
commit
5220123aad

+ 971 - 0
js/component/manageCenter/financialManage/account/accountDetails.jsx

@@ -0,0 +1,971 @@
+import React, { Component } from "react";
+import { Form, Input, Button, message, Modal, Spin, Table } from "antd";
+import { ShowModal, splitUrl, getAccountName, 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 = {
+      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 (
+              <span style={{ color: ["#1D4FEA", "#34DE38", "#108EE9", "red", "#1D4FEA"][text] }}>
+                {["【发起】", "【通过】", "【完成】", "【驳回】", "【重新发起】"][text]}
+                {this.state.processStatus == record.processStatus && !record.id &&
+                  <span style={{ color: "#FFA500" }}>&nbsp;审核中...</span>}
+              </span>
+            );
+          },
+        },
+        {
+          title: "操作时间",
+          dataIndex: "createTimeStr",
+          key: "createTimeStr",
+          width: 88,
+        },
+        {
+          title: "备注",
+          dataIndex: "remarks",
+          key: "remarks",
+          render: (text, record) => {
+            return (
+              <div style={{ minWidth: 250 }}>{text}</div>
+            )
+          }
+        }
+      ],
+    };
+  }
+
+  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/selectById",
+      data: { id, },
+      success: function (data) {
+        ShowModal(this);
+        this.setState({
+          loading: false,
+        });
+        if (data.error.length === 0) {
+          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.loadData()
+        } else {
+          message.warning(data.error[0].message);
+        }
+      }.bind(this)
+    );
+  }
+
+  render() {
+    const { TextArea } = Input
+    const { data, visible, list = [], newList, total, logdataSour, } = this.state
+    const { onCancel } = this.props
+    const formItemLayout = {
+      labelCol: { span: 5 },
+      wrapperCol: { span: 18 },
+    };
+    const logArray = logdataSour.filter((item, index, arr) => {
+      return arr.findLastIndex((t) => t.auditorName === item.auditorName) === index;
+    });
+    const reimbursement = [
+      {
+        title: !!data.contractNo ? `报销至订单:${data.contractNo}` : `报销至部门`,
+        dataIndex: "head",
+        key: "head",
+        width: 275,
+        render: (text, row, index) => {
+          if (index < newList.length - 2) {
+            return <span>{text}</span>;
+          } else if (index == newList.length - 2) {
+            return {
+              children: <div style={{ display: "flex", justifyContent: "space-between" }}>
+                <span>金额合计(大写):{data.type == 5 ? dealBigMoney(total) : (dealBigMoney((total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0))}</span>
+                <span>¥&nbsp;&nbsp;&nbsp;{data.type == 5 ? total : (total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0}&nbsp;&nbsp;&nbsp;</span>
+              </div>,
+              props: {
+                colSpan: 3,
+              },
+            };
+          } else if (index == newList.length - 1) {
+            return {
+              children: <div>
+                <div>
+                  {data.type == 3 && newList.map((item, index) => !!item.invoiceNo && <div key={index}>付款方式:{"公对公转账"}&nbsp;&nbsp;&nbsp;发票类型:{["普票", "专票"][item.invoiceType]}&nbsp;&nbsp;&nbsp;发票号:{item.invoiceNo}</div>)}
+                  {data.type == 3
+                    ? newList.map((item, index) => !!item.payerName && <div key={index}>收款方式:{item.payerName}&nbsp;&nbsp;&nbsp;{item.openBank}&nbsp;&nbsp;&nbsp;{item.bankAccounts}&nbsp;&nbsp;&nbsp;{item.openBankAddress}</div>)
+                    : data.type != 5 && <div>收款方式:{data.bank}&nbsp;&nbsp;&nbsp;{data.accounts}&nbsp;&nbsp;&nbsp;{data.name}</div>}
+                </div>
+              </div>,
+              props: {
+                colSpan: 3,
+              },
+            };
+          }
+        },
+      },
+      {
+        title: '报销数',
+        children: [
+          {
+            title: '付款项目',
+            dataIndex: "type",
+            key: "type",
+            width: 120,
+            render: (value, row, index) => {
+              if (index == newList.length - 2) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else if (index == newList.length - 1) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else {
+                return <div>
+                  {data.type == 1 &&
+                    // 差旅费显示
+                    <div>
+                      {!!row.other
+                        ? row.other
+                        : value == 1
+                          ? <span>{`交通费(${getVehicleName(row.vehicle, row.vehicleOther)})`}</span>
+                          : <span>{getTypeName(row.type)}</span>}
+                    </div>}
+                  {(data.type == 0 || data.type == 2 || data.type == 4 || data.type == 5) &&
+                    <span>{value == 4 ? "预借支金额" : value == 5 ? "抵扣金额" : !!row.other ? row.other : "申请金额"}</span>
+                  }
+                  {data.type == 3 &&
+                    <span>{!!row.other ? row.other : "申请金额"}</span>
+                  }
+
+                </div>;
+              }
+            },
+          },
+          {
+            title: '金额(元)',
+            dataIndex: "amount",
+            key: "amount",
+            width: 80,
+            render: (value, row, index) => {
+              if (index == newList.length - 2) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else if (index == newList.length - 1) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else {
+                return <span>{value}</span>;
+              }
+            },
+          }
+        ],
+      },
+      {
+        title: '审核意见',
+        dataIndex: "shyj",
+        key: "shyj",
+        width: 270,
+        render: (value, row, index) => {
+          if (index == 0) {
+            return {
+              children: <div>
+                <ul
+                  style={{
+                    overflow: "hidden",
+                    position: "relative",
+                  }}
+                >{logArray.map((item, index) => {
+                  return (
+                    // 要求只显示通过的审核
+                    (item.status == 1 || item.status == 2) &&
+                    <li
+                      key={item.auditorName}
+                      style={{
+                        height: "auto",
+                        wordBreak: "break-all",
+                      }}
+                    >
+                      <span>{item.auditorName}:</span>
+                      <span style={{ color: ["#1D4FEA", "#34DE38", "#108EE9", "red", "#1D4FEA"][item.status] }}>
+                        {["【发起】,", "【通过】,", "【完成】,", "【驳回】,", "【重新发起】,"][item.status]}
+                        {this.state.processStatus == item.processStatus && !item.id && data.status != 0 &&
+                          <span style={{ color: "#FFA500" }}>&nbsp;审核中...</span>}
+                      </span>
+                      <span>{item.remarks}</span>
+                      {/* <span>&nbsp;&nbsp;&nbsp;{item.createTimeStr}</span> */}
+                    </li>
+                  )
+                })}
+                </ul>
+              </div>,
+              props: {
+                rowSpan: newList.length - 2,
+              },
+            };
+          } else if (index == newList.length - 2) {
+            return data.type != 0 && <span>要求付款时间:{data.type == 1 ? moment(data.agreeTimeStr).format('YYYY-MM-DD') : moment(newList[0].agreeTimeStr).format('YYYY-MM-DD')}</span>;
+          } else if (index < newList.length - 1) {
+            return {
+              props: {
+                rowSpan: 0,
+              },
+            };
+          }
+        },
+      },
+    ]
+    return (
+      <Modal
+        maskClosable={false}
+        visible={true}
+        onOk={false}
+        onCancel={onCancel}
+        width="790px"
+        title={<span style={{ fontWeight: "bold" }}>{"报销详情-" + getAccountName(data.type, data.typeOther)}
+          <Button
+            type="primary"
+            style={{ marginLeft: 30 }}
+            onClick={() => { this.setState({ isTable: !this.state.isTable }) }}
+          >{this.state.isTable ? "切换列表显示" : "切换表格显示"}</Button>
+        </span>}
+        footer=""
+      >
+        <Spin spinning={this.state.loading}>
+          <div className="m_body"
+            ref={(e) => {
+              this.refs.all = e;
+            }}
+          >
+            {this.state.isTable
+              ? <div className="m_table">
+                <div className="m_title">
+                  {getAccountName(data.type, data.typeOther)}
+                  {getAccountName(data.type, data.typeOther).indexOf("报销") == -1 ? "报销清单" : "清单"}
+                </div>
+                <div className="m_head">
+                  <div>申请部门:{data.appDepName}</div>
+                  <div>报销日期:{moment(data.createTimeStr).format('YYYY年MM月DD日')}</div>
+                </div>
+                <Table
+                  columns={reimbursement}
+                  dataSource={newList}
+                  bordered
+                  size="middle"
+                  pagination={false}
+                />
+                <div className="m_head">
+                  <div>报销公司:{data.appDepName}</div>
+                  <div>报销人:{data.aname}</div>
+                </div>
+              </div>
+              : <Form layout="horizontal" id="demand-form">
+                <Spin spinning={this.state.loading}>
+                  {data.type == 1 &&
+                    <div>
+                      <div style={{ fontSize: 13, fontWeight: "bold" }}>公出信息</div>
+                      <div className="clearfix">
+                        <FormItem
+
+                          {...formItemLayout}
+                          label="公出企业"
+                        >
+                          <span>{data.userNames}</span>
+                        </FormItem>
+                      </div>
+                      <div className="clearfix">
+                        <FormItem
+
+                          {...formItemLayout}
+                          label="公出地点"
+                        >
+                          <span>{data.districtName}</span>
+                        </FormItem>
+                      </div>
+                      <div className="clearfix">
+                        <FormItem
+
+                          {...formItemLayout}
+                          label="时间"
+                        >
+                          <span>{data.releaseStartStr} 至 {data.releaseEndStr}</span>
+                        </FormItem>
+                      </div>
+                      <div className="clearfix">
+                        <FormItem
+
+                          {...formItemLayout}
+                          label="公出时长"
+                        >
+                          <span>{data.duration}小时</span>
+                        </FormItem>
+                      </div>
+                    </div>}
+                  <div style={{ fontSize: 13, fontWeight: "bold" }}>申请类型</div>
+                  <div className="clearfix">
+                    <FormItem
+                      {...formItemLayout}
+                      label="申请类型"
+                    >
+                      <span>{getAccountName(data.type, data.typeOther)}</span>
+                    </FormItem>
+                  </div>
+                  <div className="clearfix">
+                    <FormItem
+
+                      {...formItemLayout}
+                      label="报销至订单"
+                    >
+                      <div>
+                        <div>{data.buyerName}</div>
+                        <div>{data.contractNo}</div>
+                      </div>
+                    </FormItem>
+                  </div>
+                  <div className="clearfix">
+                    <FormItem
+
+                      {...formItemLayout}
+                      label="报销人"
+                    >
+                      <span>{data.aname}</span>
+                    </FormItem>
+                  </div>
+                  <div className="clearfix">
+                    <FormItem
+
+                      {...formItemLayout}
+                      label="报销公司"
+                    >
+                      <span>{data.appDepName}</span>
+                    </FormItem>
+                  </div>
+                  <div className="clearfix">
+                    <FormItem
+
+                      {...formItemLayout}
+                      label="支付公司"
+                    >
+                      <span>{data.payDepName}</span>
+                    </FormItem>
+                  </div>
+                  <div className="clearfix">
+                    <FormItem
+                      labelCol={{ span: 5 }}
+                      wrapperCol={{ span: 18 }}
+                      label="报销事由"
+                    >
+                      <p style={{ maxWidth: 500, wordWrap: "break-word" }}>
+                        {data.remarks}
+                      </p>
+                    </FormItem>
+                  </div>
+                  <div style={{ fontSize: 13, fontWeight: "bold" }}>费用详细</div>
+                  {/* 差旅费显示 */}
+                  {data.type == 1 &&
+                    list.length > 0 && list.map(item =>
+                      item.type == 1
+                        ? <div>
+                          <div className="clearfix" >
+                            <FormItem
+                              {...formItemLayout}
+                              label="交通工具"
+                            >
+                              <span>
+                                {getVehicleName(item.vehicle, item.vehicleOther)}
+                                {/* &nbsp;&nbsp; */}
+                                {/* {!!item.startDistrict && <span>({item.startDistrict}&nbsp;⇀&nbsp;{item.endDistrict})</span>} */}
+                              </span>
+                            </FormItem>
+                          </div>
+                          <div className="clearfix" >
+                            <FormItem
+                              {...formItemLayout}
+                              label="地点"
+                            >
+                              <span>{item.startDistrict}
+                                <span>&nbsp;&nbsp;⇀&nbsp;&nbsp;</span>
+                                {item.endDistrict}</span>
+                            </FormItem>
+                          </div>
+                          <div className="clearfix">
+                            <FormItem
+                              labelCol={{ span: 5 }}
+                              wrapperCol={{ span: 18 }}
+                              label="时间"
+                            >
+                              <span>{item.startTimeStr}&nbsp;&nbsp;至&nbsp;&nbsp;{item.endTimeStr}</span>
+                            </FormItem>
+                          </div>
+                          <div className="clearfix">
+                            <FormItem
+                              {...formItemLayout}
+                              label="交通费"
+                            >
+                              <span>{item.amount}(元)</span>
+                            </FormItem>
+                          </div>
+                        </div>
+                        : <div className="clearfix" >
+                          <FormItem
+                            {...formItemLayout}
+                            label={getTypeName(item.type)}
+                          >
+                            <span>{item.amount}(元)</span>
+                          </FormItem>
+                        </div>
+                    )
+                  }
+
+                  {/* 通用 */}
+                  {(data.type == 0 || data.type == 2 || data.type == 4 || data.type == 5) &&
+                    list.length > 0 && list.map(item =>
+                      <div className="clearfix" >
+                        {!!item.agreeTimeStr &&
+                          <FormItem
+                            {...formItemLayout}
+                            label={data.type == 5 ? "支付时间:" : "需付款时间:"}
+                          >
+                            <span>{item.agreeTimeStr.slice(0, 10)}</span>
+                          </FormItem>}
+                        <FormItem
+                          {...formItemLayout}
+                          label={data.type == 4
+                            ? "预借支金额:" : data.type == 5
+                              ? "抵扣金额:" : "金额:"}
+                        >
+                          <span>{item.amount}(元)</span>
+                        </FormItem>
+                      </div>
+                    )
+                  }
+
+                  {/* 第三方付款 */}
+                  {data.type == 3 &&
+                    list.length > 0 && list.map(item =>
+                      <div className="clearfix" >
+                        {!!item.agreeTimeStr &&
+                          <FormItem
+                            {...formItemLayout}
+                            label="需付款时间"
+                          >
+                            <span>{item.agreeTimeStr.slice(0, 10)}</span>
+                          </FormItem>
+                        }
+                        <FormItem
+                          {...formItemLayout}
+                          label="付款方式"
+                        >
+                          <span>{["公对公转账"][item.payType]}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="发票类型"
+                        >
+                          <span>{["普票", "专票"][item.invoiceType]}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="发票号"
+                        >
+                          <span>{item.invoiceNo}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="付款单位"
+                        >
+                          <span>{item.payerName}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="开户银行"
+                        >
+                          <span>{item.openBank}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="银行账户"
+                        >
+                          <span>{item.bankAccounts}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="开户行地址"
+                        >
+                          <span>{item.openBankAddress}</span>
+                        </FormItem>
+                        <FormItem
+                          {...formItemLayout}
+                          label="金额(元)"
+                        >
+                          <span>{item.amount}</span>
+                        </FormItem>
+                      </div>
+                    )
+                  }
+
+                  {data.type != 4 && data.debitTotalAmount &&
+                    <div className="clearfix">
+                      <FormItem
+                        {...formItemLayout}
+                        label="预借支"
+                      >
+                        <span style={{ color: "red" }}>{data.debitTotalAmount}(元)</span>
+                      </FormItem>
+                    </div>}
+
+                  {data.type != 4 && data.type != 5 &&
+                    <div className="clearfix">
+                      <FormItem
+                        {...formItemLayout}
+                        label="总金额"
+                      >
+                        <span style={{ color: "red" }}>{total}(元)</span>
+                      </FormItem>
+                    </div>}
+
+                  {data.type != 4 && data.type != 5 &&
+                    <div className="clearfix">
+                      <FormItem
+                        {...formItemLayout}
+                        label="实报金额"
+                      >
+                        <span style={{ color: "red" }}>{(total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0}(元)</span>
+                      </FormItem>
+                    </div>}
+
+                  <div className="clearfix">
+                    <FormItem
+                      {...formItemLayout}
+                      label="附件"
+                    >
+                      <div style={{ paddingTop: '10px', paddingBottom: '10px' }}>
+                        {this.state.imgs ? <ImgList fileList={this.state.imgs} ItemWidth={'96px'} /> : <div />}
+                      </div>
+                    </FormItem>
+                  </div>
+                  <div style={{ fontSize: 13, fontWeight: "bold" }}>收款详情</div>
+                  {data.type != 3 && data.type != 5 &&
+                    <div>
+                      <div className="clearfix">
+                        <FormItem
+                          {...formItemLayout}
+                          label="收款人"
+                        >
+                          <span>{data.name}</span>
+                        </FormItem>
+                      </div>
+                      <div className="clearfix">
+                        <FormItem
+                          {...formItemLayout}
+                          label="收款银行"
+                        >
+                          <span>{data.bank}</span>
+                        </FormItem>
+                      </div>
+                      <div className="clearfix">
+                        <FormItem
+                          {...formItemLayout}
+                          label="收款账户"
+                        >
+                          <span>{data.accounts}</span>
+                        </FormItem>
+                      </div>
+                    </div>}
+                  <div style={{ fontSize: 13, fontWeight: "bold" }}>审核意见</div>
+                  <ul
+                    style={{
+                      width: "560px",
+                      overflow: "hidden",
+                      paddingLeft: "90px",
+                      position: "relative",
+                    }}
+                  >
+                    {logdataSour.map((item, index) => {
+                      return (
+                        <li
+                          key={index}
+                          style={{
+                            width: "100%",
+                            height: "auto",
+                            wordBreak: "break-all",
+                            marginBottom: "10px",
+                          }}
+                        >
+                          {/* {item.auditorName + ":" + item.status + item.remarks + "(" + item.createTimeStr + ")"} */}
+                          <span>{item.auditorName}:</span>
+                          <span style={{ color: ["#1D4FEA", "#34DE38", "#108EE9", "red", "#1D4FEA"][item.status] }}>
+                            {["【发起】,", "【通过】,", "【完成】,", "【驳回】,", "【重新发起】,"][item.status]}
+                            {this.state.processStatus == item.processStatus && !item.id && data.status != 0 &&
+                              <span style={{ color: "#FFA500" }}>&nbsp;审核中...</span>}
+                          </span>
+                          <span>{item.remarks}</span>
+                          <span>&nbsp;&nbsp;&nbsp;{item.createTimeStr}</span>
+                        </li>
+                      );
+                    })}
+                  </ul>
+
+                  <div className="clearfix" style={{ marginTop: 20 }}>
+                    <Button
+                      type="primary"
+                      style={{
+                        float: "right",
+                      }}
+                      onClick={() => {
+                        this.setState({
+                          logvisible: true
+                        })
+                        this.getLogData(data.id)
+                      }}
+                    >
+                      查看日志
+                    </Button>
+                  </div>
+
+                  {this.props.isOperate && data.examine == 1 &&
+                    <div className="clearfix"
+                      style={{ width: 500, margin: "20px auto" }}>
+                      <TextArea
+                        rows={4}
+                        value={this.state.reason}
+                        onChange={(e) => {
+                          this.setState({
+                            reason: e.target.value,
+                          })
+                        }}
+                        placeholder="请填写审核内容"
+                      />
+                      <div
+                        style={{
+                          width: 250,
+                          display: "flex",
+                          justifyContent: "space-between",
+                          margin: "20px auto 0"
+                        }}
+                      >
+                        <Button type="primary"
+                          style={{ margin: 4 }}
+                          onClick={(e) => {
+                            this.setState({
+                              checkData: data
+                            }, () => {
+                              this.toExamine(1)
+                            })
+                          }}
+                        >同意</Button>
+                        <Button type="danger"
+                          style={{ margin: 4 }}
+                          onClick={(e) => {
+                            this.setState({
+                              checkData: data
+                            }, () => {
+                              this.toExamine(3)
+                            })
+                          }}
+                        >驳回</Button>
+                      </div>
+                    </div>
+                  }
+                </Spin>
+              </Form>
+            }
+          </div>
+        </Spin>
+
+        <ReactToPrint
+          trigger={() => (
+            <Button
+              type="primary"
+              style={{
+                float: "right",
+                marginTop: 10,
+                position: "absolute",
+                top: 0,
+                right: 50,
+              }}
+            >
+              打印
+            </Button>
+          )}
+          content={() => this.refs.all}
+          bodyClass="print-body"
+        />
+
+        {
+          //审核弹窗
+          this.state.visible != "" &&
+          <Modal
+            width="400px"
+            maskClosable={false}
+            title="审核"
+            confirmLoading={this.state.loading}
+            visible={this.state.visible != ""}
+            onOk={() => { this.toExamine(visible == "adopt" ? 1 : visible == "reject" && 3) }}
+            okText={this.state.visible == "adopt" ? "通过" : this.state.visible == "reject" && "驳回"}
+            onCancel={() => {
+              this.setState({
+                visible: '',
+                reason: "",
+                checkData: {},
+              })
+            }}
+          >
+            <TextArea
+              rows={4}
+              value={this.state.reason}
+              onChange={(e) => {
+                this.setState({
+                  reason: e.target.value,
+                })
+              }}
+              placeholder="请填写审核内容"
+            />
+          </Modal>
+        }
+
+        {
+          // 审核日志
+          this.state.logvisible &&
+          <Modal
+            visible={this.state.logvisible}
+            className="admin-desc-content"
+            width="800px"
+            maskClosable={false}
+            title="审核日志"
+            footer={null}
+            onCancel={() => {
+              this.setState({
+                logvisible: false,
+              })
+            }}
+          >
+            <div className="patent-table">
+              <Spin spinning={this.state.loading}>
+                <Table
+                  columns={this.state.logcolumns}
+                  dataSource={this.state.logdataSour}
+                  pagination={false}
+                  bordered
+                  size="small"
+                />
+              </Spin>
+            </div>
+          </Modal>
+        }
+
+      </Modal>
+    );
+  }
+}
+
+export default AccountDetails;

+ 189 - 527
js/component/manageCenter/financialManage/account/accountReview.jsx

@@ -15,12 +15,10 @@ import {
   Modal,
 } from "antd";
 import { ChooseList } from "../../order/orderNew/chooseList";
-import { ShowModal, splitUrl, getAccountName, getVehicleName, getTypeName, commonAdd } from "../../../tools"
+import { ShowModal,getVehicleName, getTypeName, commonAdd, dealBigMoney } from "../../../tools"
 import ShowModalDiv from "@/showModal.jsx";
-import ImgList from "../../../common/imgList";
+import AccountDetails from "./accountDetails";
 import { accountType, accountStatus } from "@/dataDic";
-import ReactToPrint from "react-to-print";
-import './accountReview.less';
 
 const FormItem = Form.Item;
 const { RangePicker } = DatePicker;
@@ -146,14 +144,12 @@ const AccountReview = React.createClass({
           render: (text, record) => {
             return (
               <div>
-                {this.props.isOperate &&
-                  <div>
+                <div>
+                  {this.props.isOperate &&
                     <Button type="primary"
                       style={{ margin: 4 }}
                       onClick={() => { this.download(record.attachmentUrl) }}
-                    >下载附件</Button>
-                  </div>}
-                <div>
+                    >下载</Button>}
                   {this.props.isOperate && record.examine == 1 &&
                     <Button type="primary"
                       style={{ margin: 4 }}
@@ -227,7 +223,7 @@ const AccountReview = React.createClass({
             )
           }
         }
-      ]
+      ],
     };
   },
 
@@ -422,71 +418,11 @@ const AccountReview = React.createClass({
 
   tableRowClick(e) {
     this.setState({
-      showDetails: true
+      showDetails: true,
+      id: e.id,
     })
-    this.getDetails(e.id)
-    this.getAccountList(e.id)
-    this.getLogData(e.id)
-  },
-
-  // 报销信息详情
-  getDetails(id) {
-    $.ajax({
-      method: "get",
-      dataType: "json",
-      crossDomain: false,
-      url: globalConfig.context + "/api/admin/expenseAccount/selectById",
-      data: { id, },
-      success: function (data) {
-        if (data.error.length === 0) {
-          this.setState({
-            data: data.data,
-            imgs: data.data.attachmentUrl
-              ? splitUrl(data.data.attachmentUrl, ",", globalConfig.avatarHost + "/upload")
-              : [],
-          })
-        } else {
-          message.warning(data.error[0].message);
-        }
-      }.bind(this),
-    }).always(
-      function () {
-        this.setState({
-          loading: false,
-        });
-      }.bind(this)
-    );
-  },
+    // this.getDetails(e.id)
 
-  // 报销费用详情
-  getAccountList(eaid) {
-    $.ajax({
-      method: "get",
-      dataType: "json",
-      crossDomain: false,
-      url: globalConfig.context + "/api/admin/expenseAccount/details/list",
-      data: { eaid, },
-      success: function (data) {
-        if (data.error.length === 0) {
-          let sum = 0
-          for (var i = 0; i < data.data.length; i++) {
-            sum = commonAdd(sum, data.data[i].amount)
-          }
-          this.setState({
-            list: data.data,
-            total: sum,
-          })
-        } else {
-          message.warning(data.error[0].message);
-        }
-      }.bind(this),
-    }).always(
-      function () {
-        this.setState({
-          loading: false,
-        });
-      }.bind(this)
-    );
   },
 
   // 查询负责人
@@ -566,7 +502,7 @@ const AccountReview = React.createClass({
 
   render() {
     const { TextArea } = Input
-    const { searchValues, data, visible, list = [], total, logdataSour, } = this.state
+    const { searchValues, data, visible, list = [], newList, total, logdataSour, } = this.state
     const formItemLayout = {
       labelCol: { span: 5 },
       wrapperCol: { span: 18 },
@@ -577,6 +513,168 @@ const AccountReview = React.createClass({
         {group.name}
       </Select.Option>
     ));
+    const logArray = logdataSour.filter((item, index, arr) => {
+      return arr.findLastIndex((t) => t.auditorName === item.auditorName) === index;
+    });
+    const reimbursement = [
+      {
+        title: !!data.contractNo ? `报销至订单:${data.contractNo}` : `报销至部门`,
+        dataIndex: "head",
+        key: "head",
+        width: 275,
+        render: (text, row, index) => {
+          if (index < newList.length - 2) {
+            return <span>{text}</span>;
+          } else if (index == newList.length - 2) {
+            return {
+              children: <div style={{ display: "flex", justifyContent: "space-between" }}>
+                <span>金额合计(大写):{data.type == 5 ? dealBigMoney(total) : (dealBigMoney((total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0))}</span>
+                <span>¥&nbsp;&nbsp;&nbsp;{data.type == 5 ? total : (total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0}&nbsp;&nbsp;&nbsp;</span>
+              </div>,
+              props: {
+                colSpan: 3,
+              },
+            };
+          } else if (index == newList.length - 1) {
+            return {
+              children: <div>
+                <div>
+                  {data.type == 3 && newList.map((item, index) => !!item.invoiceNo && <div key={index}>付款方式:{"公对公转账"}&nbsp;&nbsp;&nbsp;发票类型:{["普票", "专票"][item.invoiceType]}&nbsp;&nbsp;&nbsp;发票号:{item.invoiceNo}</div>)}
+                  {data.type == 3
+                    ? newList.map((item, index) => !!item.payerName && <div key={index}>收款方式:{item.payerName}&nbsp;&nbsp;&nbsp;{item.openBank}&nbsp;&nbsp;&nbsp;{item.bankAccounts}&nbsp;&nbsp;&nbsp;{item.openBankAddress}</div>)
+                    : data.type != 5 && <div>收款方式:{data.bank}&nbsp;&nbsp;&nbsp;{data.accounts}&nbsp;&nbsp;&nbsp;{data.name}</div>}
+                </div>
+              </div>,
+              props: {
+                colSpan: 3,
+              },
+            };
+          }
+        },
+      },
+      {
+        title: '报销数',
+        children: [
+          {
+            title: '付款项目',
+            dataIndex: "type",
+            key: "type",
+            width: 120,
+            render: (value, row, index) => {
+              if (index == newList.length - 2) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else if (index == newList.length - 1) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else {
+                return <div>
+                  {data.type == 1 &&
+                    // 差旅费显示
+                    <div>
+                      {!!row.other
+                        ? row.other
+                        : value == 1
+                          ? <span>{`交通费(${getVehicleName(row.vehicle, row.vehicleOther)})`}</span>
+                          : <span>{getTypeName(row.type)}</span>}
+                    </div>}
+                  {(data.type == 0 || data.type == 2 || data.type == 4 || data.type == 5) &&
+                    <span>{value == 4 ? "预借支金额" : value == 5 ? "抵扣金额" : !!row.other ? row.other : "申请金额"}</span>
+                  }
+                  {data.type == 3 &&
+                    <span>{!!row.other ? row.other : "申请金额"}</span>
+                  }
+
+                </div>;
+              }
+            },
+          },
+          {
+            title: '金额(元)',
+            dataIndex: "amount",
+            key: "amount",
+            width: 80,
+            render: (value, row, index) => {
+              if (index == newList.length - 2) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else if (index == newList.length - 1) {
+                return {
+                  props: {
+                    rowSpan: 0,
+                  },
+                };
+              } else {
+                return <span>{value}</span>;
+              }
+            },
+          }
+        ],
+      },
+      {
+        title: '审核意见',
+        dataIndex: "shyj",
+        key: "shyj",
+        width: 270,
+        render: (value, row, index) => {
+          if (index == 0) {
+            return {
+              children: <div>
+                <ul
+                  style={{
+                    overflow: "hidden",
+                    position: "relative",
+                  }}
+                >{logArray.map((item, index) => {
+                  return (
+                    // 要求只显示通过的审核
+                    (item.status == 1 || item.status == 2) &&
+                    <li
+                      key={item.auditorName}
+                      style={{
+                        height: "auto",
+                        wordBreak: "break-all",
+                      }}
+                    >
+                      <span>{item.auditorName}:</span>
+                      <span style={{ color: ["#1D4FEA", "#34DE38", "#108EE9", "red", "#1D4FEA"][item.status] }}>
+                        {["【发起】,", "【通过】,", "【完成】,", "【驳回】,", "【重新发起】,"][item.status]}
+                        {this.state.processStatus == item.processStatus && !item.id && data.status != 0 &&
+                          <span style={{ color: "#FFA500" }}>&nbsp;审核中...</span>}
+                      </span>
+                      <span>{item.remarks}</span>
+                      {/* <span>&nbsp;&nbsp;&nbsp;{item.createTimeStr}</span> */}
+                    </li>
+                  )
+                })}
+                </ul>
+              </div>,
+              props: {
+                rowSpan: newList.length - 2,
+              },
+            };
+          } else if (index == newList.length - 2) {
+            return data.type != 0 && <span>要求付款时间:{data.type == 1 ? moment(data.agreeTimeStr).format('YYYY-MM-DD') : moment(newList[0].agreeTimeStr).format('YYYY-MM-DD')}</span>;
+          } else if (index < newList.length - 1) {
+            return {
+              props: {
+                rowSpan: 0,
+              },
+            };
+          }
+        },
+      },
+    ]
+
     return (
       <div className="user-content">
         <ShowModalDiv ShowModal={this.state.showModal} />
@@ -795,464 +893,28 @@ const AccountReview = React.createClass({
               })
             }}
           >
-            <TextArea
-              rows={4}
-              value={this.state.reason}
-              onChange={(e) => {
-                this.setState({
-                  reason: e.target.value,
-                })
-              }}
-              placeholder="请填写审核内容"
-            />
+            <div style={{ width: "90%", margin: "0 auto" }}>
+              <TextArea
+                rows={4}
+                value={this.state.reason}
+                onChange={(e) => {
+                  this.setState({
+                    reason: e.target.value,
+                  })
+                }}
+                placeholder="请填写审核内容"
+              />
+            </div>
           </Modal>
         }
         {
-          // 报销详情
           this.state.showDetails &&
-          <Modal
-            maskClosable={false}
-            visible={this.state.showDetails}
-            onOk={false}
+          <AccountDetails
+            showDetails={this.state.showDetails}
+            id={this.state.id}
+            isOperate={this.props.isOperate}
             onCancel={() => { this.setState({ showDetails: false }) }}
-            width="800px"
-            title={<span style={{ fontWeight: "bold" }}>{"报销详情-" + getAccountName(data.type, data.typeOther)}</span>}
-            footer=""
-          >
-            <div className="m_body"
-              ref={(e) => {
-                this.refs.all = e;
-              }}
-            >
-              <Form layout="horizontal" id="demand-form">
-                <Spin spinning={this.state.loading}>
-                  {data.type == 1 &&
-                    <div>
-                      <div style={{ fontSize: 13, fontWeight: "bold" }}>公出信息</div>
-                      <div className="clearfix">
-                        <FormItem
-
-                          {...formItemLayout}
-                          label="公出企业"
-                        >
-                          <span>{data.userNames}</span>
-                        </FormItem>
-                      </div>
-                      <div className="clearfix">
-                        <FormItem
-
-                          {...formItemLayout}
-                          label="公出地点"
-                        >
-                          <span>{data.districtName}</span>
-                        </FormItem>
-                      </div>
-                      <div className="clearfix">
-                        <FormItem
-
-                          {...formItemLayout}
-                          label="时间"
-                        >
-                          <span>{data.releaseStartStr} 至 {data.releaseEndStr}</span>
-                        </FormItem>
-                      </div>
-                      <div className="clearfix">
-                        <FormItem
-
-                          {...formItemLayout}
-                          label="公出时长"
-                        >
-                          <span>{data.duration}小时</span>
-                        </FormItem>
-                      </div>
-                    </div>}
-                  <div style={{ fontSize: 13, fontWeight: "bold" }}>申请类型</div>
-                  <div className="clearfix">
-                    <FormItem
-                      {...formItemLayout}
-                      label="申请类型"
-                    >
-                      <span>{getAccountName(data.type, data.typeOther)}</span>
-                    </FormItem>
-                  </div>
-                  <div className="clearfix">
-                    <FormItem
-
-                      {...formItemLayout}
-                      label="报销至订单"
-                    >
-                      <div>
-                        <div>{data.buyerName}</div>
-                        <div>{data.contractNo}</div>
-                      </div>
-                    </FormItem>
-                  </div>
-                  <div className="clearfix">
-                    <FormItem
-
-                      {...formItemLayout}
-                      label="报销人"
-                    >
-                      <span>{data.aname}</span>
-                    </FormItem>
-                  </div>
-                  <div className="clearfix">
-                    <FormItem
-
-                      {...formItemLayout}
-                      label="报销公司"
-                    >
-                      <span>{data.appDepName}</span>
-                    </FormItem>
-                  </div>
-                  <div className="clearfix">
-                    <FormItem
-
-                      {...formItemLayout}
-                      label="支付公司"
-                    >
-                      <span>{data.payDepName}</span>
-                    </FormItem>
-                  </div>
-                  <div className="clearfix">
-                    <FormItem
-                      labelCol={{ span: 5 }}
-                      wrapperCol={{ span: 18 }}
-                      label="报销事由"
-                    >
-                      <p style={{ maxWidth: 500, wordWrap: "break-word" }}>
-                        {data.remarks}
-                      </p>
-                    </FormItem>
-                  </div>
-                  <div style={{ fontSize: 13, fontWeight: "bold" }}>费用详细</div>
-                  {/* 差旅费显示 */}
-                  {data.type == 1 &&
-                    list.length > 0 && list.map(item =>
-                      item.type == 1
-                        ? <div>
-                          <div className="clearfix" >
-                            <FormItem
-                              {...formItemLayout}
-                              label="交通工具"
-                            >
-                              <span>
-                                {getVehicleName(item.vehicle, item.vehicleOther)}
-                                {/* &nbsp;&nbsp; */}
-                                {/* {!!item.startDistrict && <span>({item.startDistrict}&nbsp;⇀&nbsp;{item.endDistrict})</span>} */}
-                              </span>
-                            </FormItem>
-                          </div>
-                          <div className="clearfix" >
-                            <FormItem
-                              {...formItemLayout}
-                              label="地点"
-                            >
-                              <span>{item.startDistrict}
-                                <span>&nbsp;&nbsp;⇀&nbsp;&nbsp;</span>
-                                {item.endDistrict}</span>
-                            </FormItem>
-                          </div>
-                          <div className="clearfix">
-                            <FormItem
-                              labelCol={{ span: 5 }}
-                              wrapperCol={{ span: 18 }}
-                              label="时间"
-                            >
-                              <span>{item.startTimeStr}&nbsp;&nbsp;至&nbsp;&nbsp;{item.endTimeStr}</span>
-                            </FormItem>
-                          </div>
-                          <div className="clearfix">
-                            <FormItem
-                              {...formItemLayout}
-                              label="交通费"
-                            >
-                              <span>{item.amount}(元)</span>
-                            </FormItem>
-                          </div>
-                        </div>
-                        : <div className="clearfix" >
-                          <FormItem
-                            {...formItemLayout}
-                            label={getTypeName(item.type)}
-                          >
-                            <span>{item.amount}(元)</span>
-                          </FormItem>
-                        </div>
-                    )
-                  }
-
-                  {/* 通用 */}
-                  {(data.type == 0 || data.type == 2 || data.type == 4 || data.type == 5) &&
-                    list.length > 0 && list.map(item =>
-                      <div className="clearfix" >
-                        {!!item.agreeTimeStr &&
-                          <FormItem
-                            {...formItemLayout}
-                            label={data.type == 5 ? "支付时间:" : "需付款时间:"}
-                          >
-                            <span>{item.agreeTimeStr.slice(0, 10)}</span>
-                          </FormItem>}
-                        <FormItem
-                          {...formItemLayout}
-                          label={data.type == 4
-                            ? "预借支金额:" : data.type == 5
-                              ? "抵扣金额:" : "金额:"}
-                        >
-                          <span>{item.amount}(元)</span>
-                        </FormItem>
-                      </div>
-                    )
-                  }
-
-                  {/* 第三方付款 */}
-                  {data.type == 3 &&
-                    list.length > 0 && list.map(item =>
-                      <div className="clearfix" >
-                        {!!item.agreeTimeStr &&
-                          <FormItem
-                            {...formItemLayout}
-                            label="需付款时间"
-                          >
-                            <span>{item.agreeTimeStr.slice(0, 10)}</span>
-                          </FormItem>
-                        }
-                        <FormItem
-                          {...formItemLayout}
-                          label="付款方式"
-                        >
-                          <span>{["公对公转账"][item.payType]}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="发票类型"
-                        >
-                          <span>{["普票", "专票"][item.invoiceType]}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="发票号"
-                        >
-                          <span>{item.invoiceNo}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="付款单位"
-                        >
-                          <span>{item.payerName}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="开户银行"
-                        >
-                          <span>{item.openBank}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="银行账户"
-                        >
-                          <span>{item.bankAccounts}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="开户行地址"
-                        >
-                          <span>{item.openBankAddress}</span>
-                        </FormItem>
-                        <FormItem
-                          {...formItemLayout}
-                          label="金额(元)"
-                        >
-                          <span>{item.amount}</span>
-                        </FormItem>
-                      </div>
-                    )
-                  }
-
-                  {data.type != 4 && data.debitTotalAmount &&
-                    <div className="clearfix">
-                      <FormItem
-                        {...formItemLayout}
-                        label="预借支"
-                      >
-                        <span style={{ color: "red" }}>{data.debitTotalAmount}(元)</span>
-                      </FormItem>
-                    </div>}
-
-                  {data.type != 4 && data.type != 5 &&
-                    <div className="clearfix">
-                      <FormItem
-                        {...formItemLayout}
-                        label="总金额"
-                      >
-                        <span style={{ color: "red" }}>{total}(元)</span>
-                      </FormItem>
-                    </div>}
-
-                  {data.type != 4 && data.type != 5 &&
-                    <div className="clearfix">
-                      <FormItem
-                        {...formItemLayout}
-                        label="实报金额"
-                      >
-                        <span style={{ color: "red" }}>{(total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0}(元)</span>
-                      </FormItem>
-                    </div>}
-
-                  <div className="clearfix">
-                    <FormItem
-                      {...formItemLayout}
-                      label="附件"
-                    >
-                      <div style={{ paddingTop: '10px', paddingBottom: '10px' }}>
-                        {this.state.imgs ? <ImgList fileList={this.state.imgs} ItemWidth={'96px'} /> : <div />}
-                      </div>
-                    </FormItem>
-                  </div>
-                  <div style={{ fontSize: 13, fontWeight: "bold" }}>收款详情</div>
-                  {data.type != 3 && data.type != 5 &&
-                    <div>
-                      <div className="clearfix">
-                        <FormItem
-                          {...formItemLayout}
-                          label="收款人"
-                        >
-                          <span>{data.name}</span>
-                        </FormItem>
-                      </div>
-                      <div className="clearfix">
-                        <FormItem
-                          {...formItemLayout}
-                          label="收款银行"
-                        >
-                          <span>{data.bank}</span>
-                        </FormItem>
-                      </div>
-                      <div className="clearfix">
-                        <FormItem
-                          {...formItemLayout}
-                          label="收款账户"
-                        >
-                          <span>{data.accounts}</span>
-                        </FormItem>
-                      </div>
-                    </div>}
-                  <div style={{ fontSize: 13, fontWeight: "bold" }}>审核意见</div>
-                  <ul
-                    style={{
-                      width: "560px",
-                      overflow: "hidden",
-                      paddingLeft: "90px",
-                      position: "relative",
-                    }}
-                  >
-                    {logdataSour.map((item, index) => {
-                      return (
-                        <li
-                          key={index}
-                          style={{
-                            width: "100%",
-                            height: "auto",
-                            wordBreak: "break-all",
-                            marginBottom: "10px",
-                          }}
-                        >
-                          {/* {item.auditorName + ":" + item.status + item.remarks + "(" + item.createTimeStr + ")"} */}
-                          <span>{item.auditorName}:</span>
-                          <span style={{ color: ["#1D4FEA", "#34DE38", "#108EE9", "red", "#1D4FEA"][item.status] }}>
-                            {["【发起】,", "【通过】,", "【完成】,", "【驳回】,", "【重新发起】,"][item.status]}
-                            {this.state.processStatus == item.processStatus && !item.id && data.status != 0 &&
-                              <span style={{ color: "#FFA500" }}>&nbsp;审核中...</span>}
-                          </span>
-                          <span>{item.remarks}</span>
-                          <span>&nbsp;&nbsp;&nbsp;{item.createTimeStr}</span>
-                        </li>
-                      );
-                    })}
-                  </ul>
-
-                  <div className="clearfix" style={{ marginTop: 20 }}>
-                    <Button
-                      type="primary"
-                      style={{
-                        float: "right",
-                      }}
-                      onClick={() => {
-                        this.setState({
-                          logvisible: true
-                        })
-                        this.getLogData(data.id)
-                      }}
-                    >
-                      查看日志
-                    </Button>
-                  </div>
-
-                  {this.props.isOperate && data.examine == 1 &&
-                    <div className="clearfix"
-                      style={{ width: 500, margin: "20px auto" }}>
-                      <TextArea
-                        rows={4}
-                        value={this.state.reason}
-                        onChange={(e) => {
-                          this.setState({
-                            reason: e.target.value,
-                          })
-                        }}
-                        placeholder="请填写审核内容"
-                      />
-                      <div
-                        style={{
-                          width: 250,
-                          display: "flex",
-                          justifyContent: "space-between",
-                          margin: "20px auto 0"
-                        }}
-                      >
-                        <Button type="primary"
-                          style={{ margin: 4 }}
-                          onClick={(e) => {
-                            this.setState({
-                              checkData: data
-                            }, () => {
-                              this.toExamine(1)
-                            })
-                          }}
-                        >同意</Button>
-                        <Button type="danger"
-                          style={{ margin: 4 }}
-                          onClick={(e) => {
-                            this.setState({
-                              checkData: data
-                            }, () => {
-                              this.toExamine(3)
-                            })
-                          }}
-                        >驳回</Button>
-                      </div>
-                    </div>
-                  }
-                </Spin>
-              </Form>
-            </div>
-            <ReactToPrint
-              trigger={() => (
-                <Button
-                  type="primary"
-                  style={{
-                    float: "right",
-                    marginTop: 10,
-                    position: "absolute",
-                    top: 0,
-                    right: 30,
-                  }}
-                >
-                  打印
-                </Button>
-              )}
-              content={() => this.refs.all}
-            />
-          </Modal>
+          />
         }
         {
           // 审核日志

+ 74 - 6
js/component/manageCenter/financialManage/account/accountReview.less

@@ -1,22 +1,90 @@
 // .clearfix{
 //   height: 32px;
 // }
-.ant-modal-body{
+.ant-modal-body {
   padding: 0;
 }
 
-.m_body{
-  padding: 16px;
+.m_body {
+  padding: 20px 30px 40px;
 }
 
-.ant-form-item{
+.ant-form-item {
   margin-bottom: 0 !important;
 }
 
-.ant-form-item-label{
+.ant-form-item-label {
   line-height: 24px;
 }
 
-.ant-form-item-control{
+.ant-form-item-control {
   line-height: 24px;
+}
+
+
+// 清单
+
+@media print {
+  table {
+    font-size: 12px !important;
+  }
+}
+
+.m_table {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  font-size: 12px;
+
+  .ant-table-middle .ant-table-thead>tr>th:not(.ant-table-selection-column),
+  .ant-table-middle .ant-table-tbody>tr>td {
+    padding: 5px;
+  }
+
+  .ant-table-bordered .ant-table-header>table,
+  .ant-table-bordered .ant-table-body>table,
+  .ant-table-bordered .ant-table-fixed-left table,
+  .ant-table-bordered .ant-table-fixed-right table {
+    border: 1px solid #000;
+    border-right: 0;
+    border-bottom: 0;
+  }
+
+  .ant-table-tbody>tr>td {
+    border-bottom: 1px solid #000;
+  }
+
+  .ant-table-bordered .ant-table-thead>tr>th,
+  .ant-table-bordered .ant-table-tbody>tr>td {
+    border-right: 1px solid #000;
+  }
+
+  .ant-table-bordered .ant-table-thead>tr>th,
+  .ant-table-bordered .ant-table-tbody>tr>td {
+    border-right: 1px solid #000;
+  }
+
+  .ant-table-bordered .ant-table-thead>tr>th {
+    border-bottom: 1px solid #000;
+  }
+
+  .m_title {
+    font-size: 24px;
+    font-weight: bold;
+    padding: 2px 5px;
+    border-bottom: 1px solid #000;
+    margin-bottom: 30px;
+  }
+
+  .m_head {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    font-size: 12px;
+  }
+
+  .ant-table-thead>tr>th {
+    background: transparent;
+  }
 }

+ 78 - 2
js/component/manageCenter/topTab.jsx

@@ -14,11 +14,12 @@ import {
   Tag,
 } from "antd";
 import { getProvince } from "../NewDicProvinceList.js";
-import { getActives } from "../tools.js";
+import { ShowModal, getActives } from "../tools.js";
 import "./topTab.less";
 import $ from "jquery/src/ajax";
 import logo from "../../../image/acc-logo.png";
 import FollowDetail from "./customer/NEW/intentionCustomer/followDetail";
+import AccountDetails from "./financialManage/account/accountDetails";
 
 const TabPane = Tabs.TabPane;
 
@@ -659,6 +660,7 @@ const TopTab = React.createClass({
       defaultActiveKey: "-1",
       htmlMenus: [],
       count: 0,
+      visible: false,
     };
   },
   logOut() {
@@ -787,6 +789,43 @@ const TopTab = React.createClass({
     }
   },
 
+  
+  onAccount() {
+    if (!this.state.checkNo) {
+      message.warning("报销单编号不能为空!")
+      return
+    }
+
+    $.ajax({
+      method: "get",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/expenseAccount/selectByCheckNo",
+      data: { checkNo: this.state.checkNo, },
+      success: function (data) {
+        ShowModal(this);
+        if (data.error.length === 0) {
+          if (!data.data) {
+            message.warning("您输入的报销单编号有误,请重新输入!")
+          } else {
+            this.setState({
+              detailsPup: true,
+              visible: false,
+              id: data.data.id,
+            })
+          }
+        } else {
+          message.warning(data.error[0].message);
+        }
+      }.bind(this),
+    }).always(
+      function () {
+
+      }.bind(this)
+    );
+  },
+
+
   render() {
     return (
       <div className="account-top">
@@ -812,6 +851,11 @@ const TopTab = React.createClass({
           </span>
           <span className="acc-top-user-toindex">
             {/* <a href={jumpUrl || "" + "/portal/index.html"}>返回首页</a> */}
+            <span
+              style={{ cursor: "pointer", color: "#58A3FF" }}
+              onClick={() => { this.setState({ checkNo: undefined, visible: true }) }}
+            >报销清单打印</span>
+            <span>&nbsp;&nbsp;|&nbsp;&nbsp;</span>
             <a href={globalConfig.context + "/RD/admin/login"}>前往RD库</a>
           </span>
           {this.props.active ? (
@@ -865,7 +909,39 @@ const TopTab = React.createClass({
           showDesc={this.state.messageModalShow}
           closeDesc={this.closeMessageModal}
         />
-      </div>
+
+        <Modal
+          title="报销清单查询"
+          visible={this.state.visible}
+          onOk={() => { this.onAccount() }}
+          onCancel={() => { this.setState({ visible: false, }) }}
+          okText="确认"
+          cancelText="取消"
+          maskClosable={false}
+        >
+          <div style={{ width: "60%", margin: "40px auto" }}>
+            <Input
+              placeholder="请输入报销单编号"
+              value={this.state.checkNo}
+              onChange={(e) => {
+                this.setState({ checkNo: e.target.value });
+              }}
+            />
+          </div>
+        </Modal>
+
+        {
+          // 报销信息详情
+          this.state.detailsPup &&
+          <AccountDetails
+            isSelect={true}
+            showDetails={this.state.detailsPup}
+            id={this.state.id}
+            onCancel={() => { this.setState({ detailsPup: false }) }}
+          />
+        }
+
+      </div >
     );
   },
 });

+ 23 - 0
js/component/tools.js

@@ -2344,9 +2344,32 @@ const obj = {
     return result;
   },
 
+  /** 数字金额大写转换(可以处理整数,小数,负数) */
+  dealBigMoney(n) {
+    var fraction = ['角', '分'];
+    var digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
+    var unit = [['元', '万', '亿'], ['', '拾', '佰', '仟']];
+    var head = n < 0 ? '欠' : '';
+    n = Math.abs(n);
 
+    var s = '';
 
+    for (var i = 0; i < fraction.length; i++) {
+      s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
+    }
+    s = s || '整';
+    n = Math.floor(n);
 
+    for (var i = 0; i < unit[0].length && n > 0; i++) {
+      var p = '';
+      for (var j = 0; j < unit[1].length && n > 0; j++) {
+        p = digit[n % 10] + unit[1][j] + p;
+        n = Math.floor(n / 10);
+      }
+      s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
+    }
+    return head + s.replace(/(零.)*零元/, '元').replace(/(零.)+/g, '零').replace(/^整$/, '零元整');
+  }
 
 
 };