.

config/routes.js

@@ -18,12 +18,6 @@ export default [
       },
     ],
   },
-  {
-    path: '/dashboard',
-    name: '工作台',
-    icon: 'DashboardOutlined',
-    component: './dashboard',
-  },  
   {
     path: '/',
     name: '工作台',//暂定
@@ -43,7 +37,12 @@ export default [
     component: '@/pages/invoiceFill/edit.jsx',
     hideInMenu:true
   },
-
+  {
+    path: '/invoiceDetail',
+    name: '报销明细列表',
+    icon: 'ProfileOutlined',
+    component: '@/pages/invoiceDetail',    
+  },
   {
     path: '/',
     redirect: '/welcome',

src/components/BanjiSearch/index.jsx

@@ -0,0 +1,62 @@
+import { useEffect, useState } from 'react';
+import { Select } from 'antd'
+import { getInvoiceFillDetail,getInvoiceFillList } from '@/services/invoiceFill'
+
+const Option = Select.Option;
+export default (props) => {
+  const { value, onChange, ...otherProps } = props;
+
+  const showType = 0; // 不显示报错
+
+  const [list, setList] = useState([])
+
+  const searchData = (val) => { 
+    getInvoiceFillList({ pageSize: 999,name:val }, showType).then(res => {
+      setList(res.records || [])
+    })    
+  }
+
+  const handleSearch = (text) => {
+    if (text) {
+      searchData(text)
+    }else{
+      getInvoiceFillList({ pageSize: 999 }, showType).then(res => {
+        setList(res.records || [])
+      })
+    }
+  }
+
+  useEffect(() => {
+    if (value) {
+      getInvoiceFillDetail(value).then((res) => {
+        setList([res])
+      })
+    }else{
+      getInvoiceFillList({ pageSize: 999 }, showType).then(res => {
+        setList(res.records || [])
+      })
+    }
+  }, [value])
+
+  return (
+    <Select
+      showSearch
+      value={value}
+      defaultActiveFirstOption={false}
+      showArrow={false}
+      filterOption={false}
+      onSearch={handleSearch}
+      onChange={onChange}
+      notFoundContent={null}
+      {...otherProps}
+    >
+      {
+        list.map((item) => {
+          return (
+            <Option key={item.invoiceId} value={item.invoiceId}>{item.name}</Option>
+          )
+        })
+      }
+    </Select>
+  )
+}

src/components/PageTable/index.jsx

@@ -15,7 +15,7 @@ export default (props) => {
   // 导出函数需要使用的 params
   const exportParams = useRef()
   const handleBeforSearch = (params) => {
-    params.invoiceId=invoiceId||''
+    params.invoiceId=invoiceId||params.invoiceId||''
     if (typeof beforeSearchSubmit === 'function') {
       exportParams.current = beforeSearchSubmit(params);
     } else {

src/pages/dashboard/components/AdminDashboard/components/BannerStatis.jsx

@@ -1,111 +0,0 @@
-import { useEffect, useState } from 'react';
-import { history } from 'umi';
-import { Card, Row, Col } from 'antd'
-import { AppstoreOutlined, MacCommandOutlined, TeamOutlined, UsergroupDeleteOutlined, UsergroupAddOutlined } from '@ant-design/icons'
-import { getcomm } from '@/services/statis';
-import StatisCard from './StatisCard';
-import StatisGroup from './StatisGroup';
-
-const colorList = [
-  { backColor: '#126BAE', frontColor: '#fff' },
-  { backColor: '#66A9C9', frontColor: '#fff' },
-  { backColor: '#08507b', frontColor: '#fff' },
-]
-
-export default (props) => {
-  const [cardData, setCardData] = useState({})
-  
-  const toAbnormal = () => {
-    history.push('../resume-work/abnormal');
-  }
-
-  useEffect(() => {
-    getcomm().then((res) => {
-      setCardData(res || {});
-    })
-  }, [])
-
-  const abnormalNum = (cardData.todayReportNum || 0) - (cardData.todayNormalNum || 0)
-
-  return (
-    <Row justify='space-around' gutter={24} >
-      <Col span={8}>
-        <StatisGroup
-          title="企业"
-          data1={{ title: '企业总数', value: cardData.orgTotalNum || 0 }}
-          data2={{ title: '无数据企业', value: cardData.noDataOrgNum || 0 }}
-          {...colorList[0]}
-          icon={<AppstoreOutlined />}
-        />
-      </Col>
-      <Col span={8}>
-        <StatisGroup
-          title="上报人次"
-          data1={{ title: '今日提交', value: cardData.todayReportNum || 0 }}
-          data2={{ title: '昨日提交', value: cardData.yestodayReportNum || 0 }}
-          {...colorList[1]}
-          icon={<TeamOutlined />}
-        />
-      </Col>
-      <Col span={8}>
-        <StatisGroup
-          title="今日概况"
-          data1={{ title: '正常人次', value: cardData.todayNormalNum || 0 }}
-          data2={{ title: '异常人次', value: abnormalNum }}
-          {...colorList[2]}
-          icon={<UsergroupDeleteOutlined />}
-          onClick2={toAbnormal}
-        />
-      </Col>
-      {/* <Col span={4}>
-        <StatisCard
-          title="企业总数"
-          value={cardData?.orgTotalNum || 0}
-          icon={<AppstoreOutlined />}
-          {...colorList[0]}
-        />
-      </Col>
-      <Col span={4}>
-        <StatisCard
-          title="无数据企业"
-          value={`${cardData?.noDataOrgNum || 0} / ${cardData?.orgTotalNum || 0}`}
-          icon={<MacCommandOutlined />}
-          {...colorList[1]}
-        />
-      </Col>
-      <Col span={4}>
-        <StatisCard
-          title="今日提交总人数"
-          value={cardData?.todayReportNum || 0}
-          icon={<TeamOutlined />}
-          {...colorList[2]}
-        />
-      </Col>
-      <Col span={4}>
-        <StatisCard
-          title="昨日提交总人数"
-          value={cardData?.yestodayReportNum || 0}
-          icon={<TeamOutlined />}
-          {...colorList[3]}
-        />
-      </Col>
-      <Col span={4}>
-        <StatisCard
-          title="今日正常人数"
-          value={cardData?.todayNormalNum || 0}
-          icon={<UsergroupDeleteOutlined />}
-          {...colorList[4]}
-        />
-      </Col>
-      <Col span={4}>
-        <StatisCard
-          title="今日异常人数"
-          value={(cardData?.todayReportNum || 0) - (cardData?.todayNormalNum || 0)}
-          icon={<UsergroupAddOutlined />}
-          {...colorList[5]}
-          onClick={toAbnormal}
-        />
-      </Col> */}
-    </Row>
-  )
-}

src/pages/dashboard/components/AdminDashboard/components/OrgSummary.jsx

@@ -1,103 +0,0 @@
-import { useEffect, useState, useCallback } from 'react';
-import Echart from '@/components/echart/echart'
-import { Card } from 'antd'
-import { getAllOrgPersonNum } from '@/services/statis'
-
-const barOption = {
-  color: ['#08507b'],
-  tooltip: {
-    trigger: 'axis',
-    axisPointer: {
-      type: 'shadow'
-    },
-    formatter: (params) => `人次: ${params[0].data.totalReportNum || 0}`
-  },
-  grid: {
-    containLabel: true,
-    left: 0,
-    top: 0,
-    right: 60,
-    bottom: 0,
-  }, 
-  yAxis: {
-    type: 'category',
-    axisLabel: {
-      // rotate: 45,
-      formatter: (value) => value.length > 10 ? value.substring(0, 10) + '...' : value,
-      color: (value, index) => 'black'
-    },
-  },
-  xAxis: {
-    type: 'value',
-  },
-  dataZoom: [
-    {
-      type: 'slider',
-      yAxisIndex: [0],
-      start: 100,
-      end: 80,
-      // width: 10,
-      // fillerColor: '#08507b',
-      selectedDataBackground: {
-        areaStyle: { color: '#08507b', },
-        lineStyle: { color: '#08507b', width: 1 },
-      }
-    },
-    {
-      type: 'inside',
-      yAxisIndex: [0],
-      start: 100,
-      end: 80
-    }
-  ],
-  dataset: {
-    dimensions: ['orgName', 'totalReportNum'],
-    source: [],
-  },
-  series: [
-    {
-      type: 'bar',
-    },
-  ]
-}
-
-export default (props) => {
-  const [loading, setLoading] = useState(false)
-  const [list, setList] = useState([])
-
-  const option = {
-    ...barOption,
-    dataset: {
-      ...barOption.dataset,
-      source: list
-    },
-    yAxis: {
-      ...barOption.yAxis,
-      axisLabel: {
-        ...barOption.yAxis.axisLabel,
-        color: value => list.filter(x => x.orgName === value)[0].totalReportNum ? 'black' : 'red'
-      }
-    }
-  }
-  
-  const queryList = useCallback(() => {
-    setLoading(true)
-
-    getAllOrgPersonNum().then((res) => {
-      setLoading(false)
-      setList((res || []).reverse())
-    }).catch(err => {
-      setLoading(false)
-    })
-  }, [])
-  
-  useEffect(() => {
-    queryList()
-  }, [])
-
-  return (
-    <Card title='企业数据总览' loading={loading} bodyStyle={{height: 600}}>
-      <Echart option={option} />
-    </Card>
-  )
-}

src/pages/dashboard/components/AdminDashboard/components/ReportList.jsx

@@ -1,120 +0,0 @@
-import moment from 'moment'
-import { Card, List, Badge, Space, Carousel } from 'antd'
-import { useCallback, useEffect, useMemo, useState } from 'react'
-import { getList } from '@/services/work'
-import { random } from '@/utils/number'
-
-const colorList = [
-  '#a8071a',
-  '#ad2102',
-  '#ad4e00',
-  '#ad6800',
-  '#ad8b00',
-  '#5b8c00',
-  '#237804',
-  '#006d75',
-  '#0050b3',
-  '#10239e',
-  '#391085',
-  '#9e1068',
-]
-
-const Avatar = (props) => {
-  const style = useMemo(() => {
-    let r = random(0, colorList.length)
-    if (r >= 12) r = 0;
-    const color = colorList[r];
-
-    return {
-      background: color,
-      color: '#fff',
-      width: '48px',
-      height: '48px',
-      fontSize: '1.8em',
-      lineHeight: '48px',
-      textAlign: 'center',
-    }
-  }, [])
-
-  return <div style={style}>{props.children}</div>
-}
-
-
-const Content = (props) => {
-  const { item } = props;
-
-  const abnormal = item.antigenIsNormal === 0 || item.nucleicIsNormal === 0
-  const status = abnormal ? 'error' : 'success'
-
-  return (
-    <Space size="large">
-      <span><Badge status={status} /> { abnormal ? '异常' : '正常' }</span>
-      <span>{moment(item.createDate).format('HH:mm')}</span>
-    </Space>
-  )
-}
-
-const showNum = 8;
-
-export default (props) => {
-  const [loading, setLoading] = useState(false)
-  const [list, setList] = useState([])
-  const [disabled, setDisabled] = useState(false)
-
-  const queryList = useCallback(() => {
-    setLoading(true)
-    getList(
-      {
-        pageSize: 50, // 过多会很卡
-        start: moment().format('YYYY-MM-DD'),
-        end: moment().format('YYYY-MM-DD'),
-        isAll: true
-      }).then(res => {
-        setLoading(false)
-        setList((res.records || []).reverse())
-      }).catch(er => {
-        setLoading(false)
-      })
-  }, [])
-
-  useEffect(() => {
-    queryList()
-  }, [])
-
-  useEffect(() => {
-    setDisabled(!list || list.length <= showNum)
-  }, [list])
-
-  return (
-    <Card title="今日提交记录" loading={loading} bodyStyle={{ height: '600px' }}>
-      <List style={{ height: '100%', overflow: 'hidden' }} itemLayout="horizontal">
-        <Carousel
-          autoplay={!disabled}
-          infinite={!disabled}
-          rtl
-          slidesToShow={showNum}
-          slidesToScroll={1}
-          dot={false}
-          dotPosition="right"
-          style={{ height: '100%' }}
-        >
-          {
-            list.map(item => (
-              <div key={item.formId} style={{ display: 'flex' }}>
-                <List.Item>
-                  <List.Item.Meta
-                    avatar={<Avatar>{item.orgName.substring(0,1)}</Avatar>}
-                    title={item.userName}
-                    con
-                    description={item.orgName}
-                  />
-                  <Content item={item} />
-                </List.Item>
-              </div>
-            ))
-          }
-        </Carousel>
-      </List>
-    </Card>
-  )
-}

src/pages/dashboard/components/AdminDashboard/components/StatisCard.jsx

@@ -1,41 +0,0 @@
-import React from 'react'
-import { Statistic, Card } from 'antd';
-
-const iconDivStyle = {
-  position: 'absolute',
-  top: 20,
-  right: 20,
-}
-
-const iconStyle = {
-  fontSize: '5em',
-  color: '#fff',
-  opacity: 0.3,
-}
-
-export default (props) => {
-  const { title, value, icon, backColor = '#fff', frontColor='#000', onClick } = props
-
-  const bodyStyle = {
-    background: backColor,
-    overflow: 'hidden',
-    position: 'relative',
-  }
-
-  return (
-    <Card bodyStyle={bodyStyle} onClick={onClick}>
-      <Statistic
-        title={title}
-        value={value}
-        valueStyle={{ color: frontColor }}
-      />
-      {
-        icon && (
-          <div style={iconDivStyle}>
-            {React.cloneElement(icon, { style: iconStyle })}
-          </div>
-        )
-      }
-    </Card>
-  )
-}

src/pages/dashboard/components/AdminDashboard/components/StatisGroup.jsx

@@ -1,74 +0,0 @@
-import React, { useState } from 'react';
-import { StatisticCard } from '@ant-design/pro-card';
-
-const { Divider } = StatisticCard;
-const iconDivStyle = {
-  position: 'absolute',
-  top: '4px',
-  right: '-30px',
-}
-
-const iconStyle = {
-  fontSize: '10em',
-  color: '#fff',
-  opacity: 0.45,
-}
-
-export default (props) => {
-  const { title, data1, data2, icon, onClick1, onClick2, backColor = '#fff', frontColor='#000' } = props
-
-  const headStyle = {
-    background: backColor,
-    color: frontColor,
-  }
-
-  const bodyStyle = {
-    background: backColor,
-    color: frontColor,
-    position: 'relative',
-    overflow: 'hidden',
-  }
-
-  const groupBodyStyle = {
-    ...bodyStyle,
-    padding: 0,
-  }
-
-  const valueStyle = {
-    color: frontColor
-  }
-
-  const headTitleStyle = {
-    color: frontColor,
-    fontSize: '19px',
-    fontWeight: 700,
-    letterSpacing: '2px',
-  }
-
-  const titleStyle = {
-    color: frontColor,
-  }
-
-  return (
-    <StatisticCard.Group title={<div style={headTitleStyle}>{title}</div>} headStyle={headStyle} bodyStyle={groupBodyStyle}>
-      <StatisticCard
-        bodyStyle={bodyStyle}
-        statistic={{ ...data1, title: (<div style={titleStyle}>{data1.title}</div>), valueStyle }}
-        onClick={onClick1}
-      />
-      <Divider type="vertical" />
-      <StatisticCard
-        bodyStyle={bodyStyle}
-        statistic={{ ...data2, title: (<div style={titleStyle}>{data2.title}</div>), valueStyle }}
-        onClick={onClick2}
-      />
-      {
-        icon && (
-          <div style={iconDivStyle}>
-            {React.cloneElement(icon, { style: iconStyle })}
-          </div>
-        )
-      }
-    </StatisticCard.Group>
-  )
-}

src/pages/dashboard/components/AdminDashboard/index.jsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import { Space, Row, Col } from 'antd'
-import ReportList from './components/ReportList';
-import OrgSummary from './components/OrgSummary';
-import BannerStatis from './components/BannerStatis';
-
-export default (props) => {  
-  return (
-    <Space direction="vertical" size="large" style={{ width: '100%' }}>
-      <BannerStatis />
-
-      <Row gutter={24}>
-        <Col span={12}><OrgSummary /></Col>
-        <Col span={12}>
-          <ReportList />
-        </Col>
-      </Row>
-    </Space>
-  )
-}

src/pages/dashboard/index.jsx

@@ -1,6 +0,0 @@
-import AdminDashboard from "./components/adminDashboard";
-export default (props) => {
-  return (
-    <AdminDashboard />
-  )
-}

src/pages/invoiceDetail/index.jsx

@@ -0,0 +1,163 @@
+
+import moment from 'moment';
+import React, { useRef, useEffect, useState } from 'react'
+
+import { Button, Modal, Popconfirm, message } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import { getInvoiceDetailList } from '@/services/invoiceDetail'
+import { getExport } from '@/services/invoiceFill'
+
+import PageTable from '@/components/PageTable'
+import { history } from 'umi';
+import BanjiSearch from '@/components/BanjiSearch';
+
+const formatterTime = (val) => {
+  return val ? moment(val).format('YYYY-MM-DD HH:mm') : '';
+};
+
+export default (props) => {
+  const actionRef = useRef();
+
+  const handleClick = () => {
+    history.push('/invoiceFill/edit.jsx');
+  }
+  const handleDelete = (id) => {
+    deleteInvoiceFill(id).then((res) => {
+      message.success('删除成功')
+      actionRef.current.reload();
+    }).catch((err) => {
+      console.log(err.message)
+    });
+  }
+
+  const handleBeforSearch = (params) => {
+    const { ...others } = params;    
+    return { ...others };
+  }
+
+  const columns = [
+    {
+      title: '班级名称',
+      dataIndex: 'invoiceId',
+      key: 'invoiceId',
+      search: true,
+      hideInTable: true,
+      renderFormItem: () => (
+        <BanjiSearch placeholder='请输入班级名称' />
+      ),
+      formItemProps: {
+        rules: [          
+          {
+            required: true,
+            message: '请输入班级名称',
+          }
+        ],
+      }
+    },
+    {
+      title: '姓名',
+      dataIndex: 'personName',
+      key: 'personName',
+      search: true,
+    },
+    {
+      title: '开票单位',
+      dataIndex: 'orgName',
+      key: 'orgName',
+      search: true,
+    },
+    {
+      title: '纳税识别号',
+      dataIndex: 'taxNo',
+      key: 'taxNo',
+      search: false,
+    },
+    {
+      title: '地址',
+      dataIndex: 'address',
+      key: 'address',
+      search: false,
+    },
+    {
+      title: '电话',
+      dataIndex: 'phone',
+      key: 'phone',
+      search: false,
+    },
+    {
+      title: '开户银行',
+      dataIndex: 'bankName',
+      key: 'bankName',
+      search: false,
+    },
+    {
+      title: '开户行账号',
+      dataIndex: 'cardNo',
+      key: 'cardNo',
+      search: false,
+    },
+    {
+      title: '报销项目',
+      dataIndex: 'itemName',
+      key: 'itemName',
+      search: false,
+    },
+    {
+      title: '开票金额',
+      dataIndex: 'charge',
+      key: 'charge',
+      search: false,
+    },
+    {
+      title: '是否合开',
+      dataIndex: 'mergeRemark',
+      key: 'mergeRemark',
+      search: false,
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      key: 'option',
+      ellipsis: true,
+      render: (_, record) => [
+        <Button type="link" key={1} onClick={() => history.push(`/invoiceFill/edit.jsx?id=${record.detailId}`)} style={{ padding: 0 }}>
+          编辑
+        </Button>,
+        <Popconfirm
+          key={2}
+          title="您是否确认删除 ?"
+          onConfirm={() => handleDelete(record.detailId)}
+          okText="确定"
+          cancelText="取消"
+        >
+          <Button style={{ padding: 0 }} type="link">
+            删除
+          </Button>
+        </Popconfirm>
+      ],
+    },
+  ]
+
+
+  return (
+    <PageHeaderWrapper>
+      <PageTable
+        columns={columns}
+        request={getInvoiceDetailList}
+        expfunc={getExport}
+        options={false}        
+        actionRef={actionRef}
+        search={{
+          defaultCollapsed:false
+        }}
+        form={{ ignoreRules: false }}
+        manualRequest={true}
+        revalidateOnFocus={false}
+        beforeSearchSubmit={handleBeforSearch}
+        rowKey="detailId"
+        scroll={{x:2000}}
+      />
+    </PageHeaderWrapper>
+  )
+}

src/pages/invoiceFill/components/BasicInfo.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useRef, useEffect } from 'react';
+import React, { useState, useRef, useEffect, useMemo } from 'react';
 import { Form, Input, Popconfirm, Select, Button, Modal, InputNumber, message, Col, Row, DatePicker } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
 import moment from 'moment';
@@ -7,6 +7,8 @@ import { saveInvoiceItemTpl, getInvoiceItemTplList, deleteInvoiceItemTpl } from
 import { history } from 'umi';
 import PageTable from '@/components/PageTable';
 import locale from 'antd/es/date-picker/locale/zh_CN';
+import QRCode from './QRCode'
+
 
 const FormItem = Form.Item;
 const { Option } = Select;
@@ -20,10 +22,22 @@ export default (props) => {
   const dateFormat = "YYYY-MM-DD HH:mm:ss";
   const [loading, setLoading] = useState(false);
   const [formModel] = Form.useForm();
+  const [formData, setFormData] = useState()
   const [editModal, setEditModal] = useState(false);
   const [modelLoading, setModelLoading] = useState(false);
   const actionRef = useRef();
 
+
+  const qrcodeText = useMemo(() => 
+  // initialState.report_url + '#resume-work-form?org=' + 
+  'https://www.baidu.com/#resume-work-form?org='+
+  invoiceId, 
+  [invoiceId
+    // , initialState.report_url
+  ]
+  )
+
+
   //保存班级
   const onSubmit = (data) => {
     var newData = { ...data, endDate: moment(data.endDate) };
@@ -94,6 +108,7 @@ export default (props) => {
     if (invoiceId) {
       getInvoiceFillDetail(invoiceId).then((res) => {
         form.setFieldsValue({ ...res, endDate: moment(res.endDate) })
+        setFormData({ ...res, endDate: moment(res.endDate) })
       }).catch((err) => {
         message.error(err.message || err);
       });
@@ -146,6 +161,12 @@ export default (props) => {
                 <Option value={2}>已截止</Option>
               </Select>
             </FormItem>
+            {
+              invoiceId &&
+              <FormItem label='申报二维码' >
+                <QRCode text={qrcodeText} title={formData?.name} />
+              </FormItem>
+            }
             <FormItem label=" " colon={false}>
               <Button type="default" onClick={goBack}>
                 返回

src/pages/invoiceFill/components/InvoiceDetail.jsx

@@ -1,7 +1,6 @@
 import React, { useState, useRef, useImperativeHandle, forwardRef } from 'react';
 import { Form, Input, Button, Modal, message, Popconfirm, Radio } from 'antd';
-import { getInvoiceDetailList, updateInvoiceDetail, deleteInvoiceDetail } from '@/services/invoiceDetail'
-import { getExport } from '@/services/invoiceFill'
+import { getInvoiceTplList, updateInvoiceDetail, deleteInvoiceTpl } from '@/services/invoiceDetail'
 import PageTable from '@/components/PageTable';
 
 const FormItem = Form.Item;
@@ -46,7 +45,7 @@ export default forwardRef((props, ref) => {
     refrash
   }))
   const handleDelete = (val) => {
-    deleteInvoiceDetail(val.invoiceId,val.invoiceItemId).then(res => {
+    deleteInvoiceTpl(val.invoiceId,val.invoiceItemId).then(res => {
       message.success('删除成功')
       refrash()
     }).catch((err) => {
@@ -99,11 +98,10 @@ export default forwardRef((props, ref) => {
   return (
     <>
       <PageTable
-        request={getInvoiceDetailList}
+        request={getInvoiceTplList}
         actionRef={actionRef}
         columns={columns}
         rowKey={(record, index) => (record, index)}
-        expfunc={getExport}
         invoiceId={invoiceId}
         options={false}
         search={false}

src/pages/invoiceFill/components/QRCode.jsx

@@ -0,0 +1,43 @@
+import React, { useRef } from 'react'
+import { Popover, Button } from 'antd';
+import { QrcodeOutlined } from '@ant-design/icons';
+import QRCode from '@/components/QRCode'
+
+const style = {
+  display: 'flex',
+  alignItem: 'center',
+  justifyContent: 'center',
+  flexDirection: 'column',
+}
+
+export default (props) => {
+  const { text, title } = props
+
+  const qrcodeRef = useRef()
+  const download = () => {
+    if (qrcodeRef.current) {
+      qrcodeRef.current.getCanvas().then((canvas) => {
+        const imageData = canvas.toDataURL('image/png', .8);
+        const link = document.createElement('a');
+        link.download = `${title}.png`
+        link.href = imageData
+        link.click()
+      });
+    }
+  }
+
+  const content = (
+    <div style={style}>
+      <QRCode ref={qrcodeRef} border content={text} title={title} />
+      <div style={{ textAlign: 'center' }}>
+        <Button  onClick={download} type='primary'>下载</Button>
+      </div>
+    </div>
+  )
+
+  return (
+    <Popover content={content} placement="right">
+      <QrcodeOutlined style={{ fontSize: '32px' }} />
+    </Popover>
+  )
+}

src/pages/invoiceFill/components/ReimbursementPerson.jsx

@@ -7,6 +7,7 @@ import { UploadExcel } from '@/components/Upload';
 
 const FormItem = Form.Item;
 const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 14 } };
+const modelUrl='https://h5.njyunzhi.com/assets/%E6%8A%A5%E9%94%80%E4%BA%BA%E5%91%98%E6%A8%A1%E6%9D%BF.xlsx'
 
 export default (props) => {
   const { invoiceId } = props
@@ -14,7 +15,6 @@ export default (props) => {
   const [editModal, setEditModal] = useState(false);
   const [modelLoading, setModelLoading] = useState(false);
   const actionRef = useRef();
-
   //弹窗保存
   const Submit = (val) => {
     setModelLoading(true);
@@ -50,8 +50,13 @@ export default (props) => {
       message.error(err.message || err);
     });
   }
+  const downloadExcel=()=>{
+    const link=document.createElement('a')
+    link.href=modelUrl
+    link.click()
+  }
   const actions = () => [
-    <Button key="dowload" icon={<DownloadOutlined />} >
+    <Button key="dowload" icon={<DownloadOutlined />} onClick={downloadExcel} >
       下载模板
     </Button>,
     <UploadExcel key='upload' id={invoiceId} refrash={refrash}/>,
@@ -98,6 +103,7 @@ export default (props) => {
         rowKey="invoicePersonId"
         options={false}
         search={false}
+        pagination={{pageSize:500}}
         params={{ invoiceId }}
       />
       <Modal

src/services/invoiceDetail.js

@@ -1,21 +1,25 @@
 import request from '@/utils/request';
 
-// 获取列表
-export const getInvoiceDetailList = (params) =>
+// 获取模板列表
+export const getInvoiceTplList = (params) =>
   request(`/invoice/${params.invoiceId}/detail-tpl`, { params });
 
-// 生成明细
+// 生成模板
 export const saveInvoiceDetail = (invoiceId) =>
   request(`/invoice/${invoiceId}/detail-tpl`, { method: 'post' });
 
-// 更新信息
+// 更新模板报销费用信息
 export const updateInvoiceDetail = (invoiceId, data) =>
   request(`/invoice/${invoiceId}/detail-tpl/item`, { data, method: 'post' });
 
 /**
- * 删除报销明细
+ * 删除报销模板
  * @param {*} data
  * @returns
  */
-export const deleteInvoiceDetail = (invoiceId, itemId ) =>
+export const deleteInvoiceTpl = (invoiceId, itemId ) =>
   request(`/invoice/${invoiceId}/detail-tpl/item/${itemId}`, { method: 'delete' });
+
+// 获取模板列表
+export const getInvoiceDetailList = (params) =>
+request(`/invoice/${params.invoiceId}/detail`, { params });