feat(): 对接开具发票开票操作

src/pages/DataAnalysisPrediction/ParkingOverview/index.scss

@@ -3,3 +3,236 @@ $color-container-bg : var(--color-container-bg);
 $color-user-list-bg : var(--color-user-list-bg);
 $color-text : var(--color-text);
 $color-primary : var(--color-primary);
+
+.ParkingOverview {
+  width: 100%;
+  height: 100%;
+  position: relative;
+
+  .pkh_title {
+    display: flex;
+    font-size: 16px;
+    padding: 6px 0 0 44px;
+    align-items: center;
+    width: 100%;
+    height: 50px;
+    background: url("../../../assets/images/equip/home/pvhome_title.png");
+  }
+
+  .pk_header {
+    position: fixed;
+    width: 100%;
+    height: 100px;
+    font-size: 36px;
+    font-family: Alibaba PuHuiTi, Alibaba PuHuiTi-Bold;
+    font-weight: 700;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    color: #ffffff;
+    z-index: 1000;
+    background: url("../../../assets/images/equip/home/pvhome_header.png") no-repeat;
+  }
+
+  .input_h {
+    z-index: 1000;
+    position: absolute;
+    top: 96px;
+    left: 392px;
+    width: 340px;
+    height: 34px;
+    background: #1e2635;
+    border: 1px solid #a9c6ff;
+    border-radius: 2px;
+    display: flex;
+    overflow: hidden;
+  }
+
+  .show_c {
+    z-index: 1000;
+    position: absolute;
+    top: 96px;
+    left: 749px;
+    height: 100px;
+    display: flex;
+    width: 422px;
+    justify-content: space-between;
+
+    .lf_num {
+      width: 200px;
+      padding: 10px;
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      background: url("../../../assets/images/equip/home/pvhome_topbk.png");
+      justify-content: space-between;
+
+      .pldf {
+        display: flex;
+        font-size: 28px;
+        font-family: Alibaba PuHuiTi, Alibaba PuHuiTi-Medium;
+        font-weight: bold;
+        height: 48px;
+        text-align: left;
+        color: #75bcff;
+        align-items: baseline;
+        justify-content: center;
+
+        p {
+          max-width: 170px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+
+        i {
+          font-style: normal;
+          font-size: 14px;
+          // margin-left: -6px;
+        }
+      }
+
+      span {
+        width: 180px;
+        line-height: 26px;
+        background: #75bcff;
+        cursor: pointer;
+        color: #1e2635;
+        text-align: center;
+      }
+    }
+  }
+
+  .left_home {
+    z-index: 1000;
+    position: absolute;
+    top: 96px;
+    left: 50px;
+    width: 320px;
+    height: 84%;
+    background: rgba(30, 38, 53, 0.64);
+    display: flex;
+    flex-direction: column;
+
+    p {
+      margin-bottom: 0%;
+    }
+
+    .lf_s {
+      width: 100%;
+      display: flex;
+      padding: 14px 0 14px 20px;
+
+      img {
+        width: 80px;
+        height: 80px;
+        margin-right: 20px;
+      }
+
+      .lf_num {
+        display: flex;
+        flex-direction: column;
+
+        .pldf {
+          display: flex;
+          font-size: 28px;
+          font-family: Alibaba PuHuiTi, Alibaba PuHuiTi-Medium;
+          font-weight: bold;
+          text-align: left;
+          color: #75bcff;
+          align-items: baseline;
+
+          p {
+            max-width: 170px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+          }
+
+          i {
+            font-style: normal;
+            font-size: 14px;
+            // margin-left: -6px;
+          }
+        }
+      }
+    }
+  }
+
+  .pk_footer {
+    z-index: 1000;
+    position: absolute;
+    bottom: 0%;
+    width: 100%;
+    height: 112px;
+    background: url("../../../assets/images/equip/home/pvhome_footer.png") no-repeat;
+
+
+    .f_center {
+      width: 300px;
+      height: 100%;
+      padding-top: 20px;
+      position: absolute;
+      left: 50%;
+      transform: translateX(-50%);
+      display: flex;
+      flex-direction: column;
+
+      p {
+        margin-bottom: 0%;
+      }
+    }
+
+    .f_x {
+      display: flex;
+      height: 48px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0 10px;
+
+      .tab_road {
+        opacity: 0.5;
+        font-size: 14px;
+        font-family: Microsoft YaHei, Microsoft YaHei-Regular;
+        font-weight: 400;
+        text-align: center;
+        color: #ffffff;
+        width: 60px;
+        text-align: center;
+        cursor: pointer;
+      }
+
+      .select_road {
+        opacity: 1;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+
+        align-items: center;
+
+        img {
+          width: 11px;
+          height: 9px;
+        }
+      }
+    }
+
+    .f_q {
+      position: relative;
+      display: flex;
+      height: 48px;
+      justify-content: space-between;
+      align-items: center;
+
+      .taw {
+        width: 130px;
+        text-align: center;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .q {
+        cursor: pointer;
+      }
+    }
+  }
+}

src/pages/DataAnalysisPrediction/ParkingOverview/loadable.jsx

@@ -1,15 +1,231 @@
 import React, { useState, useRef, useEffect } from "react";
-// import {  message, Pagination, Table, Space, Modal, } from "antd";
+import {
+  message,
+  Pagination,
+  Input,
+  AutoComplete,
+  Table,
+  Select,
+  Modal,
+} from "antd";
+import { UserOutlined } from "@ant-design/icons";
 // import { dictionary, utils } from "@/config/common";
 // import moment from 'moment'
 // import {   useSessionStorageState, useUpdateEffect, useSize, useUpdate } from 'ahooks';
-// import ajax from "@/services"
-// import {  FormInput, FormSelect, OptionPanel, ResultPanel, FormSliderPicker, AreaCascader, ImgResize, ImgZoom, } from "@/components"
-// import "./index.scss";
+import ajax from "@/services";
+import { BaseMap } from "@/components";
+import "./index.scss";
+import Btckd from "@/assets/images/equip/home/bottom_checked.png";
+import Pkhl from "@/assets/images/equip/home/pkhome_left.png";
+import Pkhr from "@/assets/images/equip/home/pkhome_right.png";
+import Lf1 from "@/assets/images/equip/home/left_1.png";
+import Lf2 from "@/assets/images/equip/home/left_2.png";
+import Lf3 from "@/assets/images/equip/home/left_3.png";
+import Lf4 from "@/assets/images/equip/home/left_4.png";
+import Lf5 from "@/assets/images/equip/home/left_5.png";
+import Lf6 from "@/assets/images/equip/home/left_6.png";
+import Lf7 from "@/assets/images/equip/home/left_7.png";
 // import errorImg from "@/assets/images/layout/error.png"
 // import {  useLocation } from "react-router-dom";
 function ParkingOverview() {
-    return <div>ParkingOverview</div>
+  //左侧展示栏
+  const [LeftShow, setLeftShow] = useState([
+    {
+      text: "车场总数",
+      value: "233",
+      img: Lf1,
+      status: "",
+    },
+    {
+      text: "泊位总数",
+      value: "42,176",
+      img: Lf2,
+      status: "",
+    },
+    {
+      text: "近7日交易订单数",
+      value: "60,637",
+      img: Lf3,
+      status: "单",
+    },
+    {
+      text: "近7日收入",
+      value: "264,578.000",
+      img: Lf4,
+      status: "元",
+    },
+    {
+      text: "近7日泊位利用率",
+      value: "228.80",
+      img: Lf5,
+      status: "%",
+    },
+    {
+      text: "近7日泊位周转率",
+      value: "1.00",
+      img: Lf6,
+      status: "次",
+    },
+    {
+      text: "注册会员",
+      value: "466,188",
+      img: Lf7,
+      status: "",
+    },
+  ]);
+  //底部车场类型切换
+  const Road = [
+    {
+      text: "全部车场",
+      value: "0",
+    },
+
+    {
+      text: "路内车场",
+      value: "1",
+    },
+    {
+      text: "路外车场",
+      value: "2",
+    },
+  ];
+  //底部车场类型切换
+  const [RoadSelect, setRoadSelect] = useState("0");
+  //底部车场切换数据
+  const [CarRoad, setCarRoad] = useState([
+    {
+      text: "西海岸新区",
+      value: "1",
+    },
+    {
+      text: "西海岸东区",
+      value: "2",
+    },
+    {
+      text: "西海岸南区",
+      value: "3",
+    },
+  ]);
+  //底部车场切换展示
+  const [CarShow, setCarShow] = useState(0);
+  //底部车场切换
+  const BottomCar = (val) => {
+    let length = CarRoad.length;
+    let index = CarShow;
+    if (val == "left") {
+      if (index <= 0) {
+        setCarShow(length - 1);
+      } else {
+        setCarShow(index - 1);
+      }
+    } else {
+      if (index >= length - 1) {
+        setCarShow(0);
+      } else {
+        setCarShow(index + 1);
+      }
+    }
+  };
+  //底部车场类型切换
+  const BottomTab = (val) => {
+    setRoadSelect(val);
+  };
+  return (
+    <div className="ParkingOverview">
+      <div className="pk_header">西海岸新区停车信息管理平台</div>
+      <div className="left_home">
+        <div className="pkh_title">停车业务概览</div>
+        {LeftShow.map((ele) => {
+          return (
+            <div className="lf_s" key={ele.text}>
+              <img src={ele.img} alt="" />
+              <div className="lf_num">
+                <div className="pldf">
+                  <p title={ele.value}>{ele.value}</p>
+                  <i>{ele.status}</i>
+                </div>
+                <span>{ele.text}</span>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+      <div className="input_h">
+        <Select
+          defaultValue="1"
+          style={{
+            width: 90,
+          }}
+          options={[
+            {
+              value: "1",
+              label: "停车场",
+            },
+            {
+              value: "2",
+              label: "位置",
+            },
+          ]}
+          onChange={(e) => {}}
+        />
+        <AutoComplete
+          style={{
+            width: 250,
+          }}
+        ></AutoComplete>
+      </div>
+      <div className="show_c">
+        <div className="lf_num">
+          <div className="pldf">
+            <p title={448.0}>{448.0}</p>
+            <i>元</i>
+          </div>
+          <span>今日收入</span>
+        </div>
+        <div className="lf_num">
+          <div className="pldf">
+            <p title={448.0}>{448.0}</p>
+            <i>次</i>
+          </div>
+          <span>今日服务车次数</span>
+        </div>
+      </div>
+      <BaseMap></BaseMap>
+      <div className="pk_footer">
+        <div className="f_center">
+          <div className="f_x">
+            {Road.map((ele) => {
+              return (
+                <p
+                  key={ele.value}
+                  className={
+                    RoadSelect == ele.value
+                      ? "tab_road select_road"
+                      : "tab_road"
+                  }
+                  onClick={() => BottomTab(ele.value)}
+                >
+                  {ele.text}
+                  {RoadSelect == ele.value ? <img src={Btckd} alt="" /> : ""}
+                </p>
+              );
+            })}
+          </div>
+          <div className="f_q">
+            <div className="q" onClick={() => BottomCar("left")}>
+              <img src={Pkhl} alt="" srcset="" />
+            </div>
+            <p className="taw" title={CarRoad[CarShow]?.text || ""}>
+              {CarRoad[CarShow]?.text || ""}
+            </p>
+            <div className="q" onClick={() => BottomCar("right")}>
+              <img src={Pkhr} alt="" srcset="" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
 }
 
-export default ParkingOverview;
+export default ParkingOverview;

src/pages/FinancialMgm/Invoice/CreateInvoice/loadable.jsx

@@ -77,7 +77,7 @@ function CreateInvoice() {
     },
     {
       text: "发票类型",
-      value: "qylx",
+      value: "header_type",
       type: 2,
       data: [
         {
@@ -98,7 +98,7 @@ function CreateInvoice() {
     },
     {
       text: "发票抬头",
-      value: "fptt",
+      value: "header_name",
       rules: [
         {
           required: true,
@@ -108,17 +108,17 @@ function CreateInvoice() {
     },
     {
       text: "纳税人识别号",
-      value: "nsrsbh",
+      value: "duty_paragraph",
       rules: "",
     },
     {
       text: "地址",
-      value: "dz",
+      value: "address",
       rules: "",
     },
     {
       text: "电话",
-      value: "dh",
+      value: "tel",
       rules: [
         {
           pattern: /^1[3|4|5|7|8|9]\d{9}$/,
@@ -128,12 +128,12 @@ function CreateInvoice() {
     },
     {
       text: "开户行",
-      value: "khh",
+      value: "bank",
       rules: "",
     },
     {
       text: "账号",
-      value: "zh",
+      value: "account",
       rules: "",
     },
   ];
@@ -160,7 +160,10 @@ function CreateInvoice() {
   //弹框显示？
   const [Open, setOpen] = useState(false);
   //备注
-  const [Textcl, setTextcl] = useState("");
+  const [Textcl, setTextcl] = useState({
+    list: [],
+    money: "0.00",
+  });
   //商户
   const [Yunying, setYunying] = useState([]);
   const column = () => {
@@ -253,19 +256,17 @@ function CreateInvoice() {
               <Button
                 type="primary"
                 onClick={() => {
-                  form.setFieldsValue({
-                    email: record.email,
-                    qylx: record.employee,
-                    fptt: record.invoice_t,
+                  setTextcl({
+                    list: [record.park_record_id],
+                    money: record.invoice_tclass,
                   });
-                  setTextcl(record);
                   setOpen(true);
                 }}
               >
                 开票
               </Button>
               <a
-                href={`#/financialMgm/parkingOrderInquiry?orderId=${record.id}`}
+                href={`#/financialMgm/parkingOrderInquiry?order_id=${record.order_id}`}
               >
                 支付详情
               </a>
@@ -285,14 +286,6 @@ function CreateInvoice() {
     },
   };
 
-  //时间
-  const onChangeData = (dates, dataString) => {
-    setFormData({
-      ...FormData,
-      start_time: dataString[0],
-      end_time: dataString[1],
-    });
-  };
   //页码
   function onShowSizeChange(pn, page_size) {
     let temFormData = {};
@@ -316,8 +309,18 @@ function CreateInvoice() {
     if (!Selectdata.length) {
       message.warn("至少选择一项开票信息");
     } else {
+      let money = 0;
+      Selectdata.forEach((ele) => {
+        let con = ele.invoice_tclass;
+        if (con) {
+          money += con * 100;
+        }
+      });
+      setTextcl({
+        list: Selectdata.map((ele) => ele.park_record_id),
+        money: money / 100,
+      });
       setOpen(true);
-      console.log("还没想好");
     }
   };
   //提交
@@ -325,15 +328,24 @@ function CreateInvoice() {
     form
       .validateFields()
       .then((val) => {
-        console.log(val);
-        // ajax.CreateInvoice({ ...val }).then((res) => {
-        //   if (res.status == 20000) {
-        //     form.resetFields();
-        //     message.success(res.message);
-        //   } else {
-        //     message.error(res.message);
-        //   }
-        // });
+        ajax.ElectInvoice.CreateInvoice({ ...val, list: Textcl.list }).then(
+          (res) => {
+            if (res.status == 20000) {
+              setOpen(false);
+              var reset = formdata;
+              setFormData(reset);
+              setFormDatas(reset);
+              form.resetFields();
+              setTextcl({
+                list: [],
+                money: "0.00",
+              });
+              message.success(res.message);
+            } else {
+              message.error(res.message);
+            }
+          }
+        );
       })
       .catch((e) => {
         console.log(e);
@@ -649,7 +661,7 @@ function CreateInvoice() {
               <Table
                 // className="yisa-table"
                 columns={columns}
-                rowKey={(record) => record.id}
+                rowKey={(record) => record.park_record_id}
                 dataSource={Data.data}
                 pagination={false}
                 rowSelection={{
@@ -696,7 +708,7 @@ function CreateInvoice() {
           </p>
           <p className="fpo">
             <span>发票金额</span>
-            <span>4.00元</span>
+            <span>{Textcl.money}元</span>
           </p>
         </div>
         <div className="submitBtn">
@@ -707,6 +719,10 @@ function CreateInvoice() {
             className="ant-btn cancel"
             onClick={() => {
               form.resetFields();
+              setTextcl({
+                list: [],
+                money: "0.00",
+              });
               setOpen(false);
             }}
           >

src/router/index.jsx

@@ -139,17 +139,15 @@ function RouterMap(props) {
     })
   }, [storeRoutes])
 
-  return (  
+  return (
     <>
       {loading ? (
         <div className="full-loading">
           <img
             className="loading-img"
-            src={require(
-              skin == "dark" ?
-                '../assets/images/layout/loading-dark.gif' :
-                '../assets/images/layout/loading-light.gif'
-            )}
+            src={require(skin == "dark"
+              ? "../assets/images/layout/loading-dark.gif"
+              : "../assets/images/layout/loading-light.gif")}
             alt=""
           />
         </div>
@@ -159,13 +157,17 @@ function RouterMap(props) {
           <Route path="/nav" element={<pages.Nav></pages.Nav>} />
           <Route path="/_404" element={<pages._404></pages._404>} />
           <Route path="/_403" element={<pages._403></pages._403>} />
+          <Route
+            path="/dataAlyPrediction/parkingOverview"
+            element={<pages.ParkingOverview></pages.ParkingOverview>}
+          />
           {renderRouter}
           <Route path="/" element={<pages.Nav></pages.Nav>} />
           <Route path="*" element={<Navigate to="/_404" />} />
         </Routes>
       )}
     </>
-  )
+  );
 }
 
 export default RouterMap

src/services/ElectInvoice/index.js

@@ -32,7 +32,7 @@ const getInvoice = (params) => {
 // 开票
 const CreateInvoice = (params) => {
   return ajax({
-    url: "/api/fin/elec_invoice/get_invoice_list",
+    url: "/api/fin/elec_invoice/invoice",
     type: "post",
     data: params,
   });
@@ -118,7 +118,7 @@ const getPayRepeat = (params) => {
     type: "post",
     data: params,
   });
-}; 
+};
 //退款
 const getPayRepeatRefund = (params) => {
   return ajax({