审核产品页面: 表格, 数据结构

public/locales/zh/products.json

@@ -30,7 +30,7 @@
   "Unit": "单位",
   "GroupSize": "人等",
   "UseDates": "使用日期",
-  "Weekdays": "有效日",
+  "Weekdays": "有效日/周X",
 
   "AgeType": {
     "Type": "人群",

src/hooks/useProductsSets.js

@@ -33,11 +33,11 @@ export const useProductsAuditStates = () => {
 
   useEffect(() => {
     const newData = [
-      { value: '0', label: t('products:auditState.New') },
+      { key: '0', value: '0', label: t('products:auditState.New') },
-      { value: '1', label: t('products:auditState.Pending') },
+      { key: '1', value: '1', label: t('products:auditState.Pending') },
-      { value: '2', label: t('products:auditState.Approve') },
+      { key: '2', value: '2', label: t('products:auditState.Approve') },
-      { value: '3', label: t('products:auditState.Rejected') },
+      { key: '3', value: '3', label: t('products:auditState.Rejected') },
-      { value: '4', label: t('products:auditState.Published') },
+      { key: '4', value: '4', label: t('products:auditState.Published') },
     ];
     setTypes(newData);
   }, [i18n.language]);

src/stores/Products/Index.js

@@ -3,10 +3,19 @@ import { devtools } from 'zustand/middleware';
 
 import { fetchJSON } from '@/utils/request';
 import { HT_HOST } from '@/config';
+import { groupBy } from '@/utils/commons';
+
+const searchAgency = async (param) => {
+  const { errcode, result } = await fetchJSON(`${HT_HOST}/Service_BaseInfoWeb/products_search`, param);
+
+};
+const getAgencyProducts = async (param) => {
+  const { errcode, Result, Result1 } = await fetchJSON(`${HT_HOST}/Service_BaseInfoWeb/products_search`, param);
+};
 
 const initialState = {
   loading: false,
-  productsList: [
+  agencyList: [
     {
       'audit_date': '2001-03-03',
       'travel_agency_name': '新油低外',
@@ -18,6 +27,237 @@ const initialState = {
       'audit_state': '1',
     },
   ],
+  activeAgency: {},
+  agencyProducts: groupBy([
+    {
+        "info": {
+            "id": "640000198509289851",
+            "title": "如拉下完公",
+            "code": "grlkt",
+            "type": "Guide",
+            "audit_state": "1",
+            "create_date": "2022-01-13",
+            "created_by": "郝涛",
+            "travel_agency_id": "710000200712195349",
+            "travel_agency_name": "国得气验",
+            "lastedit_memo": "划百引程级门会需代领主属快。",
+            "remarks": "及决对金利低集小理电和按常如门。",
+            "duration": 2,
+            "duration_unit": "m",
+            "open_weekdays": "6",
+            "recommends_rate": 3,
+            "dept": 1,
+            "display_to_c": "2",
+            "km": 27,
+            "city_id": 77,
+            "city_name": "称命"
+        },
+        "quotation": [
+            {
+                "id": "21000020030611324X",
+                "value": 70,
+                "currency": "CNY",
+                "unit": "团",
+                "age_type": "儿童",
+                "group_size_min": 4,
+                "group_size_max": 4,
+                "use_dates_start": "2004-01-19",
+                "use_dates_end": "1990-03-10",
+                "weekdays": "4",
+                "audit_state": "ea pariatur",
+                "lastedit_memo": "sunt"
+            },
+            {
+                "id": "610000197306240177",
+                "value": 86,
+                "currency": "CNY",
+                "unit": "人",
+                "age_type": "儿童",
+                "group_size_min": 6,
+                "group_size_max": 8,
+                "use_dates_start": "1996-12-16",
+                "use_dates_end": "1974-11-19",
+                "weekdays": "4",
+                "audit_state": "aliqua aute quis ipsum",
+                "lastedit_memo": "commodo adipisicing ea ipsum"
+            }
+        ],
+        "lgc_details": [
+            {
+                "lgc": "mollit",
+                "title": "林运但",
+                "description": "学克信图走法因心委周说步将且文手越。",
+                "id": "35"
+            },
+            {
+                "lgc": "et laborum",
+                "title": "备上引深量知量",
+                "description": "到听少文话包由北层中争二调原务越明在。",
+                "id": "74"
+            },
+            {
+                "lgc": "minim velit",
+                "title": "安都始新",
+                "description": "取影压前手府要青白支大而。",
+                "id": "23"
+            }
+        ]
+    },
+    {
+        "info": {
+            "id": "41000019901227754X",
+            "title": "据划京少国取",
+            "code": "ore",
+            "type": "Guide",
+            "audit_state": "2",
+            "create_date": "1979-01-31",
+            "created_by": "陆芳",
+            "travel_agency_id": "110000198612200137",
+            "travel_agency_name": "少平酸型",
+            "lastedit_memo": "八想军也装运知长示各院步济水。",
+            "remarks": "千改原统实专回列参目党却是样与后收。",
+            "duration": 3,
+            "duration_unit": "d",
+            "open_weekdays": "5",
+            "recommends_rate": 5,
+            "dept": 1,
+            "display_to_c": "2",
+            "km": 30,
+            "city_id": 62,
+            "city_name": "业入"
+        },
+        "quotation": [
+            {
+                "id": "37000019760525515X",
+                "value": 93,
+                "currency": "CNY",
+                "unit": "团",
+                "age_type": "成人",
+                "group_size_min": 7,
+                "group_size_max": 11,
+                "use_dates_start": "1992-11-22",
+                "use_dates_end": "1997-07-16",
+                "weekdays": "7",
+                "audit_state": "id nulla irure cupidatat",
+                "lastedit_memo": "quis aute reprehenderit consectetur"
+            },
+            {
+                "id": "150000199506023175",
+                "value": 90,
+                "currency": "CNY",
+                "unit": "人",
+                "age_type": "儿童",
+                "group_size_min": 9,
+                "group_size_max": 10,
+                "use_dates_start": "2007-09-11",
+                "use_dates_end": "2013-07-27",
+                "weekdays": "5",
+                "audit_state": "commodo ad ut",
+                "lastedit_memo": "id anim incididunt"
+            }
+        ],
+        "lgc_details": [
+            {
+                "lgc": "adipisicing elit Excepteur in",
+                "title": "很很结龙认",
+                "description": "事起复京长立然将采共层列工。",
+                "id": "43"
+            },
+            {
+                "lgc": "dolore fugiat",
+                "title": "专中小",
+                "description": "示史想当集认点离反而原化精满并计前。",
+                "id": "28"
+            },
+            {
+                "lgc": "sunt consectetur ea cillum",
+                "title": "他率带没",
+                "description": "节经厂面际是统表王活基书色活至是干验。",
+                "id": "83"
+            },
+            {
+                "lgc": "incididunt labore fugiat",
+                "title": "精话西改",
+                "description": "须事金性别民学少拉个且须专需断连。",
+                "id": "97"
+            },
+            {
+                "lgc": "dolore id",
+                "title": "文技话",
+                "description": "上任成条到则查支外很素给务府三。",
+                "id": "99"
+            }
+        ]
+    },
+    {
+        "info": {
+            "id": "44000019990112280X",
+            "title": "节到和",
+            "code": "ixlmndtmz",
+            "type": "Meals",
+            "audit_state": "1",
+            "create_date": "2006-12-30",
+            "created_by": "易敏",
+            "travel_agency_id": "640000197111288408",
+            "travel_agency_name": "术备带走",
+            "lastedit_memo": "认队什教调问传改万消然声地全。",
+            "remarks": "属须厂几问总识看部群该克员方。",
+            "duration": 2,
+            "duration_unit": "m",
+            "open_weekdays": "6",
+            "recommends_rate": 3,
+            "dept": 2,
+            "display_to_c": "1",
+            "km": 13,
+            "city_id": 55,
+            "city_name": "铁以"
+        },
+        "quotation": [
+            {
+                "id": "13000019860219219X",
+                "value": 88,
+                "currency": "CNY",
+                "unit": "团",
+                "age_type": "儿童",
+                "group_size_min": 2,
+                "group_size_max": 4,
+                "use_dates_start": "1991-03-19",
+                "use_dates_end": "1974-03-13",
+                "weekdays": "3",
+                "audit_state": "officia voluptate ad adipisicing dolore",
+                "lastedit_memo": "Duis amet veniam enim"
+            },
+            {
+                "id": "420000201706118123",
+                "value": 61,
+                "currency": "CNY",
+                "unit": "人",
+                "age_type": "儿童",
+                "group_size_min": 4,
+                "group_size_max": 10,
+                "use_dates_start": "1992-04-23",
+                "use_dates_end": "1970-07-19",
+                "weekdays": "5",
+                "audit_state": "commodo labore",
+                "lastedit_memo": "ullamco anim culpa do in"
+            }
+        ],
+        "lgc_details": [
+            {
+                "lgc": "ut minim",
+                "title": "回等这意",
+                "description": "农满界个整千书得被写况空派会想头无。",
+                "id": "40"
+            },
+            {
+                "lgc": "laborum id elit irure commodo",
+                "title": "增正数白养土子",
+                "description": "么划才共别程以元于族完难变。",
+                "id": "84"
+            }
+        ]
+    }
+], row => row.info.type),
 };
 export const useProductsStore = create(
   devtools((set, get) => ({
@@ -25,7 +265,9 @@ export const useProductsStore = create(
     ...initialState,
 
     // state actions
-    setProductsList: (productsList) => set({ productsList }),
+    setAgencyList: (agencyList) => set({ agencyList }),
+    setActiveAgency: activeAgency => set({ activeAgency }),
+    setAgencyProducts: agencyProducts => set({ agencyProducts }),
 
     reset: () => set(initialState),
 

src/views/App.jsx

@@ -152,7 +152,6 @@ function App() {
                       { label: <Link to='/account/management'>{t('account:management.tile')}</Link>, key: '3' },
                       { type: 'divider' },
                       { label: <Link to='/logout'>{t('Logout')}</Link>, key: '4' },
-                      { label: <Link to='/account/change-vendor'>{t('ChangeVendor')}</Link>, key: 'change-vendor' },
                     ],
                       { type: 'divider' },
                       { label: <>v{BUILD_VERSION}</>, key: 'BUILD_VERSION' },

src/views/products/Audit.jsx

@@ -1,14 +1,22 @@
 import { createContext, useContext, useEffect, useState } from 'react';
-import { Button, Table, Tabs } from 'antd';
+import { Link, useLocation, } from 'react-router-dom';
+import { Button, Collapse, Table, Tabs, Typography, Space,  } from 'antd';
 import { useProductsTypes } from '@/hooks/useProductsSets';
 import SecondHeaderWrapper from '@/components/SecondHeaderWrapper';
+import { useTranslation } from 'react-i18next';
+import useProductsStore from '@/stores/Products/Index';
+import { isEmpty } from '@/utils/commons';
 
-const Header = () => {
+const Header = ({title, ...props}) => {
+  const { t } = useTranslation();
   return (
-    <div className='flex justify-end gap-4 '>
+    <div className='flex justify-end items-center gap-4 h-full'>
-      <div className='flex-auto'></div>
+      <div className='grow'>
-      <Button size='small'>导入合同</Button>
+        <h2 className='m-0 leading-tight'>{title}</h2>
-      <Button size='small'>导出PDF</Button>
+      </div>
+      {/* <Button size='small'>{t('Copy')}</Button> */}
+      {/* <Button size='small'>{t('Import')}</Button> */}
+      <Button size='small' type={'primary'} ghost>{t('Export')} PDF</Button>
     </div>
   );
 };
@@ -20,11 +28,93 @@ const TypesTabs = () => {
   )
 }
 
+const subjectComponents = {
+  // 'sum_profit': ProfitTable,
+  // 'in_order_count': Count,
+  // 'confirm_order_count': Count,
+  // 'depart_order_count': Count,
+  // 'confirm_rates': Rates,
+  // 'praise_rates': Rates,
+  // 'sum_person_num': Count,
+};
+
+const PriceTable = ({dataSource}) => {
+  const { t } = useTranslation('products');
+  // console.log(dataSource, );
+  const columns = [
+    { key: 'title', dataIndex: ['info', 'title'], title: t('Title'), onCell: (r, index) => ({ rowSpan: r.rowSpan }) },
+    { key: 'value', title: t('Quotation'), render: (_, { value, currency, unit }) => `${value} ${currency} / ${unit}` },
+    // {key: 'price', title: t('Currency'), },
+    // {key: 'currency', title: t('Currency'), },
+    // {key: 'unit', title: t('Unit'), },
+    { key: 'ageType', dataIndex: ['age_type'], title: t('AgeType.Type') },
+    {
+      key: 'groupSize',
+      dataIndex: ['group_size_min'],
+      title: t('GroupSize'),
+      render: (_, { group_size_min, group_size_max} ) => `${group_size_min} - ${group_size_max}`,
+    },
+    {
+      key: 'useDates',
+      dataIndex: ['use_dates_start'],
+      title: t('UseDates'),
+      render: (_, { use_dates_start, use_dates_end} ) => `${use_dates_start} ~ ${use_dates_end}`,
+    },
+    { key: 'weekdays', dataIndex: ['weekdays'], title: t('Weekdays'), },
+    {key: 'status', title: t('Status'), render: () => '已通过'},
+    {
+      title: '',
+      key: 'action',
+      render: () => (
+        <Space>
+          <Button >✔</Button>
+          <Button >✖</Button>
+        </Space>
+      ),
+    },
+  ];
+  return <Table pagination={false} columns={columns} dataSource={dataSource} rowKey={(r) => r.id} />;
+}
+
+/**
+ *
+ */
+const TypesPanels = () => {
+  const [loading, agencyProducts] = useProductsStore((state) => [state.loading, state.agencyProducts]);
+  // console.log(agencyProducts);
+  const productsTypes = useProductsTypes();
+  const [activeKey, setActiveKey] = useState([]);
+  const [showTypes, setShowTypes] = useState([]);
+  useEffect(() => {
+    // 只显示有产品的类型
+    const hasDataTypes = Object.keys(agencyProducts);
+    const _show = productsTypes
+      .filter((kk) => hasDataTypes.includes(kk.value))
+      .map((ele) => ({ ...ele, children: <PriceTable dataSource={agencyProducts[ele.value].reduce((r, c) => r.concat(c.quotation.map((q, i) => ({ ...q, info: c.info, rowSpan: i=== 0 ? c.quotation.length : 0 }))), [])} /> }));
+    setShowTypes(_show);
+
+    setActiveKey(isEmpty(_show) ? [] : [_show[0].key]);
+
+    return () => {};
+  }, [productsTypes, agencyProducts]);
+
+  const onCollapseChange = (_activeKey) => {
+    setActiveKey(_activeKey)
+  }
+  return (
+    <Collapse items={showTypes} activeKey={activeKey} onChange={onCollapseChange} />
+  )
+}
+
 const Audit = ({ ...props }) => {
+  // const [loading, agencyProducts] = useProductsStore((state) => [state.loading, state.agencyProducts]);
+
   return (
     <>
-      <SecondHeaderWrapper header={<Header />}>
+      <SecondHeaderWrapper header={<Header title={'{供应商名字}'} />}>
-        <TypesTabs />
+        <hr />
+        <TypesPanels />
+        {/* <PriceTable dataSource={agencyProductsList} /> */}
       </SecondHeaderWrapper>
     </>
   );

src/views/products/Index.jsx

@@ -1,17 +1,17 @@
 import { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { Row, Col, Space, Typography, Table, Button } from 'antd';
-import useProductsStore from '@/stores/Products/Index';
 import { usingStorage } from '@/hooks/usingStorage';
 import SearchForm from '@/components/SearchForm';
 import dayjs from 'dayjs';
 import { useTranslation } from 'react-i18next';
+import useProductsStore from '@/stores/Products/Index';
 import { useProductsTypes } from '@/hooks/useProductsSets';
 
 function Index() {
   const { t } = useTranslation();
   const { userId } = usingStorage();
-  const [loading, productsList] = useProductsStore((state) => [state.loading, state.productsList]);
+  const [loading, agencyList, ] = useProductsStore((state) => [state.loading, state.agencyList, ]);
 
   const [noticeList, setNoticeList] = useState([]);
   useEffect(() => {}, []);
@@ -56,7 +56,7 @@ function Index() {
       />
       <Row>
         <Col md={24} lg={24} xxl={24}>
-          <Table bordered={true} columns={columns} dataSource={productsList} pagination={{ defaultPageSize: 20, showTotal: showTotal }} loading={loading} rowKey={'travel_agency_id'} />
+          <Table bordered={true} columns={columns} dataSource={agencyList} pagination={{ defaultPageSize: 20, showTotal: showTotal }} loading={loading} rowKey={'travel_agency_id'} />
         </Col>
         <Col md={24} lg={24} xxl={24}></Col>
       </Row>