新增增购补贴

舒述军
1 parent 92ca4e8d
Showing 2 changed files with 161 additions and 53 deletions
src/pages/order3/CarPurchaseSubsidy/AdditionalPurchaseSubsidy/subpages/AddConfig/index.tsx
src/pages/order3/CarPurchaseSubsidy/KeyCustomerSubsidy/subpages/AddConfig/index.tsx
 import React, { useEffect, useState } from 'react';
 import { Button, Form, Select, DatePicker, Radio, Input, message, Col, Space, Row, Card, Table, InputNumber} from 'antd';
-import CarSelect from '@/pages/order3/Common/CarSelect/index';
 import {saveAdditionalApi, ApplyData} from '@/pages/order3/CarPurchaseSubsidy/AdditionalPurchaseSubsidy/api';
 import NewDataModal from '@/pages/order3/Common/NewDataModal/index';
 import moment from 'moment';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import CarTableTreeAuth from '@/components/CarTableTreeAuth';
+import { PlusSquareOutlined } from '@ant-design/icons';
+import { CarAuthList } from '@/components/CarTableTreeAuth/entity';
+import { getShopApi, ShopVo, RequestShopParams } from '@/pages/order3/Common/api';
+import { isNil } from 'lodash';
  
 const Requirements = [{value: true, label: '必买'}, {value: false, label: '非必买'}];
  
 export default function ApplyModal() {
   const [form] = Form.useForm();
   const [loading, setLoading] = useState<boolean>(false);
-  const [showTree, setShowTree] = useState<any[]>([]);
-  const [subinfo, setSubinfo] = useState<number[]>([]);
-  const [afterCar, setAfterCar] = useState<number[]>([]);
   const [hidden, setHidden] = useState<any>({data: true, price: true});
-  const [specKey, setSpecKey] = useState<any[]>([]);
   const [calc, setCalc] = useState<number>(1);
   const [insure, setInsure] = useState<any>([{mustBuyTci: undefined, mustBuyVci: undefined, vciBuyAmount: undefined}]);
   const [beforeData, setBeforeData] = useState<ApplyData[]>([]); // 前置资料
   const [afterData, setAfterData] = useState<ApplyData[]>([]); // 后置资料
   const [afterDay, setAfterDay] = useState<number>(); // 后置资料上传天数
+  const [shopList, setShopList] = useState<ShopVo[]>([]);
+  const [shopLoading, setShopLoading] = useState<boolean>(false);
+  const [carSelectData, setCarSelectData] = useState<CarAuthList[]>([]);
  
   const handleCancel = () => {
-    setSubinfo([]);
-    setSpecKey([]);
-    setAfterCar([]);
     setHidden({data: true, price: true});
+    history.back();
   };
  
   const onCalcChange = (e:any) => {
@@ -43,61 +44,49 @@ export default function ApplyModal() {
     const _param: any = {
       beginTime: (+moment(param.time[0], "YYYY-MM-DD HH:mm:ss").unix())*1000, // 开始时间
       endTime: (+moment(param.time[1], "YYYY-MM-DD HH:mm:ss").unix())*1000, // 结束时间
-      brandId: param.brand.value, // 品牌id
-      brandName: param.brand.label, // 品牌名称
+      brandId: param.optionalAuth[0].brandId, // 品牌id
+      brandName: param.optionalAuth[0].brandName, // 品牌名称
       applyCarType: param.applyCarType, // 适用车辆类型
       subsidyMode: param.subsidyMode, // 补贴方式
       subsidyValue: +param.subsidyValue, // 补贴比例/ 金额
       applyShops: param.applyShops.map((item:any) => { return {shopId: item.value, shopName: item.label}; }), // 门店列表
       subsidyDataUploadApply: beforeData.map((v:any) => { return {applyUpload: 1, dataType: v.dataType, dataName: v.dataName}; }), // 申请时上传资料
       subsidyType: 3,
+      applyCarList: handleCarData(param.optionalAuth),
+      containOrder: param.containOrder,
+      insuranceRequire: param.insuranceRequire
     };
-    if (calc === 1 && !param.retailPriceType) {
-      message.error("请选择补贴价格类型！");
-      return;
-    } else if ((afterDay && afterDay != 0) && afterData.length === 0) {
+    if ((afterDay && afterDay != 0) && afterData.length === 0) {
       message.error("请勾选交车后N天内上传的资料！");
       return;
-    } else if (param.applyCarType === 2 && param.applySeriesList.length === 0) { // 部分车系
-      message.error("请选择适用车辆！");
+    } else if (param.insuranceRequire && isNil(insure[0].mustBuyTci)) {
+      message.error("请选择是否购买交强险！");
       return;
-    } else if (param.applyCarType === 3 && showTree.length === 0) { // 部分车型
-      message.error("请选择适用车辆！");
+    } else if (param.insuranceRequire && isNil(insure[0].mustBuyVci)) {
+      message.error("请选择商是否购买商业险购！");
+      return;
+    } else if (param.insuranceRequire && isNil(insure[0].vciBuyAmount)) {
+      message.error("请选择输入商业险金额！");
       return;
-    }
-    if (calc === 1) { // 补贴价格类型
-      _param.retailPriceType = param.retailPriceType;
     }
     if (afterDay && afterDay !=0) { // 交车n天后上传资料
       _param.deliveryAfterDays = afterDay;
       _param.subsidyDataUploadNDay = afterData.map((item: any) => { return {applyUpload: 0, dataType: item.dataType, dataName: item.dataName}; });
-    }  
+    }
     if (param.applyCarType === 2) {
       _param.applySpecList = param.applySeriesList.map((item:any) => { return {seriesId: item.value, seriesName: item.label}; });
     }
-    if (param.applyCarType === 3) {
-      const _showTree = JSON.parse(JSON.stringify(showTree));
-      _param.applySpecList = _showTree.map((item:any) => {
-        const _data = item.children.map((v:any) => {
-          return {
-            seriesId: item.key,
-            seriesName: item.title,
-            specId: v.key,
-            specName: v.title
-          };
-        });
-        return [..._data];
-      }).flat();
+    if (param.insuranceRequire) {
+      _param.mustBuyTci = insure[0].mustBuyTci;
+      _param.mustBuyVci = insure[0].mustBuyVci;
+      _param.vciBuyAmount = insure[0].vciBuyAmount;
     }
     setLoading(true);
     saveAdditionalApi(_param)
     .then(res => {
       message.success(res.result);
-      setSubinfo([]);
-      setAfterCar([]);
       setLoading(false);
-      setSpecKey([]);
-      setHidden({data: true, price: true});
+      history.back();
     })
     .catch(e => {
       message.error(e.message);
@@ -105,17 +94,121 @@ export default function ApplyModal() {
     });
   };
  
+    /**
+   * 选择车辆范围回调
+   * @param value 车辆树形结构
+   */
+  function handleChange(value: CarAuthList[] = []) {
+    const brandIds: number[] = [];
+    const seriesIds: number[] = [];
+    const specIds: number[] = [];
+    value.forEach(v => {
+      if (v.children) {
+        v.children.forEach(k => {
+          if (k.children) {
+            const spec = k.children.map(q => q.specId);
+            specIds.push(...spec);
+          } else {
+            seriesIds.push(k.seriesId);
+          }
+        });
+      } else {
+        brandIds.push(v.brandId);
+      }
+    });
+    const parmas = {
+      brandIds,
+      seriesIds,
+      specIds
+    };
+    setCarSelectData(value || []);
+    getShopScope(parmas);
+    console.log(value);
+  }
+
+  /**
+   * 获取所选车辆的授权门店范围
+   * @param params 
+   */
+  function getShopScope(params: RequestShopParams) {
+    setShopLoading(true);
+    getShopApi(params)
+    .then(res => {
+      setShopLoading(false);
+      setShopList(res.data || []);
+    }).catch(e => {
+      setShopLoading(false);
+      setShopList([]);
+      message.error(e.message);
+    });
+  }
+
+  function handleInsureChange(name: string, value?: number) {
+    setInsure([{...insure[0], [name]: value}]);
+  }
+
+  function resetInsure() {
+    setInsure([{mustBuyTci: undefined, mustBuyVci: undefined, vciBuyAmount: undefined, id: 1}]);
+  }
+
+  /**
+   * 将树形车辆结构转换成扁平结构
+   * applyCarType为最细化层级的类型
+   * @param value 
+   * @returns 
+   */
+  function handleCarData(value: CarAuthList[]) {
+    const result: any = [];
+    let applyCarType = 1;
+    value.forEach(v => {
+      if (v.children) {
+        v.children.forEach(k => {
+          if (k.children) {
+            k.children.forEach(r => {
+              const item = {brandId: v.brandId, brandName: v.brandName, seriesId: k.seriesId, seriesName: k.seriesName, specId: r.specId, specName: r.specName};
+              result.push(item);
+              applyCarType = Math.max(applyCarType, 3);
+            });
+          } else {
+            const item = {brandId: v.brandId, brandName: v.brandName, seriesId: k.seriesId, seriesName: k.seriesName};
+            result.push(item);
+            applyCarType = Math.max(applyCarType, 2);
+          }
+        });
+      } else {
+        const item = { brandId: v.brandId, brandName: v.brandName, applyCarType: v.authType};
+        result.push(item);
+        applyCarType = Math.max(applyCarType, 1);
+      }
+    });
+    const _result = result.map((v: any) => ({...v, applyCarType}));
+    return _result;
+  }
+
   return (
-    <PageHeaderWrapper title="大客户补贴">
+    <PageHeaderWrapper title="增购补贴">
       <Card>
         <Row justify="center">
           <Col span={16}>
             <Form
               form={form}
-              labelCol={{ span: 8 }}
-              wrapperCol={{ span: 16 }}
             >
-              {/* <CarSelect specKey={specKey} setSpecKey={setSpecKey} modalVis={visible} setFieldsValue={form.setFieldsValue} showTree={showTree} setShowTree={setShowTree} /> */}
+              <Form.Item
+                name="optionalAuth"
+                label="授权车辆范围"
+                rules={[{ required: true, message: "选择车辆" }]}
+                tooltip={<span style={{ color: '#ccc', fontSize: 12 }}>*点击图标<PlusSquareOutlined />展开授权详情</span>}
+              >
+                <CarTableTreeAuth value={carSelectData} onChange={handleChange} brandMultiple={false} />
+              </Form.Item>
+              <Form.Item
+                label="适用门店"
+                name="applyShops"
+                labelAlign="left"
+                rules={[{ required: true, message: "请选择适用门店" }]}
+              >
+                <Select mode="multiple" allowClear filterOption optionFilterProp="children" labelInValue placeholder="请选择" options={shopList.map(v => ({label: v.shopName, value: v.shopId}))} loading={shopLoading} />
+              </Form.Item>
               <Form.Item name="time" label="有效时间" rules={[{ type: 'array' as const, required: true, message: '请选择有效时间!' }]}>
                 <DatePicker.RangePicker showNow showTime style={{width: "100%"}} />
               </Form.Item>
@@ -142,8 +235,22 @@ export default function ApplyModal() {
               >
                 <Input placeholder="请输入" allowClear suffix={calc === 1 ? "%" : "元"} />
               </Form.Item>
-              <Form.Item hidden={hidden.price} label="补贴价格类型" name="retailPriceType">
-                <Select>
+              <Form.Item 
+                hidden={hidden.price} 
+                label="补贴价格类型" 
+                name="retailPriceType"
+                rules={[
+                  ({ getFieldValue }) => ({
+                    validator(_, value) {
+                      if ((calc === 1 && isNil(value))) {
+                        return Promise.reject(new Error('请选择补贴价格类型！'));
+                      }
+                      return Promise.resolve();
+                    },
+                }),
+                ]}
+              >
+                <Select placeholder="请选择" allowClear>
                   <Select.Option value={1}>商家零售价</Select.Option>
                   <Select.Option value={2}>厂家标准零售价</Select.Option>
                   <Select.Option value={3}>厂家市场指导价</Select.Option>
@@ -152,7 +259,7 @@ export default function ApplyModal() {
               </Form.Item>
  
               <Form.Item labelAlign="left" label="保险要求" name="insuranceRequire" rules={[{required: true, message: "请选择保险要求！"}]}>
-                <Radio.Group>
+                <Radio.Group onChange={resetInsure}>
                   <Radio value={false}>无要求</Radio>
                   <Radio value>有要求</Radio>
                 </Radio.Group>
@@ -165,21 +272,21 @@ export default function ApplyModal() {
                 const bool = getFieldValue('insuranceRequire');
                 return bool ? (
                   <Card>
-                    <Table pagination={false} dataSource={insure}>
+                    <Table pagination={false} dataSource={insure} rowKey="id">
                       <Table.Column
                         title="交强险"
                         dataIndex="mustBuyTci"
-                        render={(text, record) => <Select placeholder="请选择" options={Requirements} />}
+                        render={(_text, record) => <Select value={_text} onChange={(e) => handleInsureChange("mustBuyTci", e)} placeholder="请选择" options={Requirements} />}
                       />
                       <Table.Column
                         title="商业险"
-                        dataIndex="mustBuyTci"
-                        render={(text, record) => <Select placeholder="请选择" options={Requirements} />}
+                        dataIndex="mustBuyVci"
+                        render={(_text, record) => <Select value={_text} onChange={e => handleInsureChange("mustBuyVci", e)} placeholder="请选择" options={Requirements} />}
                       />
                       <Table.Column
                         title="商业险金额(≥元)"
-                        dataIndex="mustBuyTci"
-                        render={(text, record) => <InputNumber controls={false} min={0} placeholder="请输入" />}
+                        dataIndex="vciBuyAmount"
+                        render={(_text, record) => <InputNumber value={_text} onChange={e => handleInsureChange("vciBuyAmount", e)} controls={false} min={0} precision={2} placeholder="请输入金额" />}
                       />
                     </Table>
                   </Card>
@@ -53,7 +53,8 @@ export default function ApplyModal() {
       subsidyDataUploadApply: beforeData.map((v:any) => { return {applyUpload: 1, dataType: v.dataType, dataName: v.dateName}; }), // 申请时上传资料
       subsidyType: 1,
       applyCarList: handleCarData(param.optionalAuth),
-      containOrder: param.containOrder
+      containOrder: param.containOrder,
+      insuranceRequire: param.insuranceRequire
     };
     if (!isNil(afterDay) && afterData.length === 0) {
       message.error("请勾选交车后N天内上传的资料！");