申请列表初步完成

src/pages/applicationList/detail.jsx

@@ -1,9 +1,10 @@
 import React, { useState, useEffect } from 'react';
-import { Card, Form, Button } from 'antd';
+import { Card, Form, Button, Input, Image } from 'antd';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { getWithdrawalDetail } from '@/services/withdrawal'
+import { getApplicationDetail } from '@/services/application'
 import { history } from 'umi';
 
+const { TextArea } = Input;
 const FormItem = Form.Item;
 const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 14 } };
 const goBack = () => {
@@ -12,11 +13,11 @@ const goBack = () => {
 export default (props) => {
   const { location } = props;
   const { id } = location.query;
-  const [withdrawal, setWithdrawal] = useState();
+  const [application, setApplication] = useState({});
 
   useEffect(() => {
-    getWithdrawalDetail(id).then((res) => {
-      setWithdrawal(res)
+    getApplicationDetail(id).then((res) => {
+      setApplication(res)
     }).catch((err) => {
       console.log(err.message)
     });
@@ -25,27 +26,77 @@ export default (props) => {
     <PageHeaderWrapper    >
       <Card>
         <Form {...formItemLayout}>
-          <FormItem label="申请人">
-            {withdrawal?.userName}
-          </FormItem>
           <FormItem label="犬主">
-            {withdrawal?.phone}
+            {application?.personName}
+          </FormItem>
+          <FormItem label="电话">
+            {application?.phone}
           </FormItem>
           <FormItem label="犬名">
-            {withdrawal?.orgName}
+            {application?.petName}
+          </FormItem>
+          <FormItem label="性别">
+            {
+              application?.petSex == 1 ? '雄' :
+                application?.petSex == 2 ? '雌' : '未说明性别'
+            }
           </FormItem>
           <FormItem label="犬种">
-            {withdrawal?.amountLeft / 100}
+            {application?.petType}
           </FormItem>
           <FormItem label="毛色">
-            {withdrawal?.bankCard.ownerBank}
+            {application?.petColor}
           </FormItem>
           <FormItem label="照片">
-            {withdrawal?.bankCard.cardNo}
+            <Image src={application?.img1} width={100} />
           </FormItem>
           <FormItem label="养狗地址">
-            {withdrawal?.money / 100}
+            {application?.address}
+          </FormItem>
+          <FormItem label="免疫证号">
+            {application?.immunizationCode}
+          </FormItem>
+          <FormItem label="免疫证明">
+            <Image src={application?.immunizationImg} />
+          </FormItem>
+          <FormItem label="最近免疫日期">
+            {application?.immunizationDate}
+          </FormItem>
+          <FormItem label="申请类型">
+            {
+              application?.applyType == 'first' ? '办证' :
+                application?.applyType == 'reissue' ? '补办' :
+                  application?.applyType == 'renewal' ? '续期' : ''
+            }
+          </FormItem>
+          <FormItem label="付款状态">
+            {
+              application.payStatus === 0
+                ? '待支付'
+                : application.payStatus === 1
+                  ? '支付中'
+                  : application.payStatus === 2
+                    ? '已支付' : ''
+            }
+          </FormItem>
+          {/* <FormItem label="狗证有效期">
+           2021-1-5~2022-1-5
+          </FormItem>
+          <FormItem label="申领方式">
+            {
+              application?.applyMethod == '1' ? '上门自取' :
+                application?.applyMethod == '2' ? '快递到家' : ''
+            }
+          </FormItem>
+          <FormItem label="快递公司">
+            <Input type="text" value='极兔快递' style={{ width: '350px' }} />
+          </FormItem>
+          <FormItem label="快递单号">
+            <Input type="text" value='99999' style={{ width: '350px' }} />
           </FormItem>
+          <FormItem label="驳回原因">
+            <TextArea placeholder='请输入驳回原因' rows='3' style={{ width: '350px' }} />
+          </FormItem> */}
           <FormItem label=" " colon={false}>
             <Button type="default" onClick={() => goBack()}>
               返回

src/pages/applicationList/index.jsx

@@ -4,6 +4,8 @@ import { DatePicker, Button } from 'antd';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import PageTable from '@/components/PageTable'
 import { getApplicationList } from '@/services/application'
+import { history } from 'umi';
+
 
 const { RangePicker } = DatePicker;
 
@@ -13,9 +15,12 @@ const formatterTime = (val) => {
 
 export default (props) => {
   const actionRef = useRef();
+  const goDetail=(id)=>{
+    history.push(`applicationList/detail.jsx?id=${id}`);
+  }
   const columns = [
     {
-      title: '申请人',
+      title: '犬主',
       dataIndex: 'personName',
       key: 'personName',
       search: true,
@@ -27,24 +32,72 @@ export default (props) => {
       render: (t) => formatterTime(t),
       renderFormItem: (_, record) => <RangePicker format='YYYY-MM-DD' />
     },
+    {
+      title: '申请类型',
+      dataIndex: 'applyType',
+      key: 'applyType',
+      search: true,
+      render: (_, record) => {
+        return record.applyType === 'first'
+          ? '办证'
+          : record.applyType === 'reissue'
+            ? '补办'
+            : record.applyType === 'renewal'
+              ? '续期' : ''
+      },
+      valueType: 'select',
+      valueEnum: {
+        'first': { text: '办证' },
+        'reissue': { text: '补办' },
+        'renewal': { text: '续期' },
+      },
+    },
     {
       title: '订单状态',
-      dataIndex: 'status',
-      key: 'status',
+      dataIndex: 'payStatus',
+      key: 'payStatus',
       search: true,//已支付 待支付
+      render: (_, record) => {
+        return record.payStatus === 0
+          ? '待支付'
+          : record.payStatus === 1
+            ? '支付中'
+            : record.payStatus === 2
+              ? '已支付' : ''
+      },
+      valueType: 'select',
+      valueEnum: {
+        0: { text: '待支付' },
+        1: { text: '支付中' },
+        2: { text: '已支付' },
+      },
     },
     {
       title: '审核状态',
       dataIndex: 'verifyStatus',
       key: 'verifyStatus',
       search: true,
+      render: (_, record) => {
+        return record.verifyStatus === 0
+          ? '待审核'
+          : record.verifyStatus === 1
+            ? '审核通过'
+            : record.verifyStatus === 2
+              ? '审核驳回' : ''
+      },
+      valueType: 'select',
+      valueEnum: {
+        0: { text: '待审核' },
+        1: { text: '审核通过' },
+        2: { text: '审核驳回' },
+      },
     },
     {
       title: '操作',
       valueType: 'option',
       width: 160,
       render: (_, record) => [
-        <Button key={1} style={{ padding: 0 }} type="link">
+        <Button key={1} style={{ padding: 0 }} type="link" onClick={()=>goDetail(record.applyId)}>
           详情
         </Button>
       ],

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/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/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/components/BannerStatis.jsx

@@ -0,0 +1,61 @@
+import { useEffect, useState } from 'react';
+import { history } from 'umi';
+import { Row, Col } from 'antd'
+import { AppstoreOutlined, AuditOutlined, FieldTimeOutlined } from '@ant-design/icons'
+// import { getcomm } from '@/services/statis';
+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 || 857 }}
+          data2={{ title: '证牌发放数', value: cardData.noDataOrgNum || 364 }}
+          {...colorList[0]}
+          icon={<AppstoreOutlined />}
+        />
+      </Col>
+      <Col span={8}>
+        <StatisGroup
+          title="审核"
+          data1={{ title: '待审核数', value: cardData.todayReportNum || 20 }}
+          data2={{ title: '审核驳回数', value: cardData.yestodayReportNum || 1 }}
+          {...colorList[1]}
+          icon={<AuditOutlined />}
+        />
+      </Col>
+      <Col span={8}>
+        <StatisGroup
+          title="提交"
+          data1={{ title: '今日提交数', value: cardData.todayNormalNum || 25 }}
+          data2={{ title: '本月提交数', value: abnormalNum || 20 }}
+          {...colorList[2]}
+          icon={<FieldTimeOutlined />}
+          onClick2={toAbnormal}
+        />
+      </Col>
+    </Row>
+  )
+}

src/pages/dashboard/components/OrgSummary.jsx

@@ -0,0 +1,127 @@
+import { useEffect, useState, useCallback } from 'react';
+import Echart from '@/components/echart/echart'
+import { Card } from 'antd'
+
+const lineOption = {
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'shadow'
+    },
+    // formatter: (params) => `人次: ${params[0].data.value || 0}`
+  },
+
+  grid: {
+    containLabel: true,
+    left: 0,
+    top: 8,
+    right: 60,
+    bottom: 0,
+  },
+  yAxis: {
+    type: 'value',
+  },
+
+  xAxis: {
+    type: 'category',
+
+  },
+
+  dataset: [
+    {
+      dimensions: ['date', 'value'],
+      source: [],
+    },
+  ],
+  series: [
+    {
+      type: 'line',
+      datasetIndex: 0,
+      itemStyle: {
+        normal: {
+          color: "#08507b",
+          lineStyle: {
+            color: "#08507b"
+          }
+        }
+      }
+    },    
+  ]
+}
+export default (props) => {
+  const [loading, setLoading] = useState(false)
+  const [list, setList] = useState([
+    {
+      date:'2022-9-9',
+      value:20
+    },
+    {
+      date:'2022-9-10',
+      value:205
+    },
+    {
+      date:'2022-9-11',
+      value:200
+    },
+    {
+      date:'2022-9-12',
+      value:210
+    },
+    {
+      date:'2022-9-13',
+      value:10
+    },
+    {
+      date:'2022-9-14',
+      value:50
+    },
+    {
+      date:'2022-9-15',
+      value:80
+    },
+    {
+      date:'2022-9-16',
+      value:27
+    },
+    {
+      date:'2022-9-19',
+      value:99
+    },
+    {
+      date:'2022-9-20',
+      value:5
+    },
+  ])
+
+  const option = {
+    ...lineOption,
+    dataset: {
+      ...lineOption.dataset,
+      source: list
+    }
+  }
+  
+  const queryList = useCallback(() => {
+    // setLoading(true)
+
+    // getAllOrgLine({
+    //   days: 7,
+    //   startDate: moment().subtract(7, 'day').format('YYYY-MM-DD'),
+    // }).then((res) => {
+    //   setLoading(false)
+    //   setList(res)
+    // }).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 → src/pages/dashboard/components/ReportList.jsx

@@ -1,7 +1,7 @@
 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 { getList } from '@/services/work'
 import { random } from '@/utils/number'
 
 const colorList = [
@@ -62,19 +62,19 @@ export default (props) => {
   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)
-      })
+    // 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(() => {
@@ -86,7 +86,7 @@ export default (props) => {
   }, [list])
 
   return (
-    <Card title="今日提交记录" loading={loading} bodyStyle={{ height: '600px' }}>
+    <Card title="近期提交记录" loading={loading} bodyStyle={{ height: '600px' }}>
       <List style={{ height: '100%', overflow: 'hidden' }} itemLayout="horizontal">
         <Carousel
           autoplay={!disabled}

src/pages/dashboard/index.jsx

@@ -1,14 +1,20 @@
-// import AdminDashboard from "./components/adminDashboard";
-// import OrgDashboard from "./components/orgDashboard";
-
-import { useState } from "react";
-import RichEditor from "@/components/rich-editor";
-
-export default (props) => { 
-  
-  const [value, setValue] = useState()
+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 (
-    <RichEditor value={value} onChange={setValue} />
+    <Space direction="vertical" size="large" style={{ width: '100%' }}>
+      <BannerStatis />
+
+      <Row gutter={24}>
+        <Col span={12}><OrgSummary /></Col>
+        <Col span={12}>
+          <ReportList />
+        </Col>
+      </Row>
+    </Space>
   )
 }