客服审核页面

public/locales/en/common.json

@@ -11,6 +11,7 @@
   "Close": "Close",
   "Save": "Save",
   "Edit": "Edit",
+  "Audit": "Audit",
   "Delete": "Delete",
   "Add": "Add",
   "View": "View",
@@ -19,6 +20,7 @@
   "Upload": "Upload",
   "preview": "Preview",
   "Total": "Total",
+  "Action": "Action",
 
   "Login": "Login",
   "Username": "Username",

public/locales/en/products.json

@@ -21,6 +21,6 @@
   "AuState": "Audit State",
   "CreatedBy": "Created By",
   "CreateDate": "Create Date",
-  "Auditors": "Auditors",
+  "AuditedBy": "Audited By",
   "AuditDate": "Audit Date"
 }

public/locales/zh/common.json

@@ -11,6 +11,7 @@
   "Close": "关闭",
   "Save": "保存",
   "Edit": "编辑",
+  "Audit": "审核",
   "Delete": "删除",
   "Add": "添加",
   "View": "查看",
@@ -19,6 +20,7 @@
   "Upload": "上传",
   "preview": "预览",
   "Total": "总数",
+  "Action": "操作",
 
   "Login": "登录",
   "Username": "账号",

src/components/SearchForm.jsx

@@ -47,7 +47,7 @@ const SearchForm = ({ initialValue, onSubmit, onReset, ...props }) => {
         { key: 'endtime', transform: (arrVal) => (arrVal ? arrVal[1].format(SMALL_DATETIME_FORMAT) : '') },
       ],
       'invoiceStatus': { key: 'invoiceStatus', transform: (value) => value?.value || value?.key || '', default: '' },
-      'auditStatus': { key: 'auditStatus', transform: (value) => value?.value || value?.key || '', default: '' },
+      'auditState': { key: 'auditState', transform: (value) => value?.value || value?.key || '', default: '' },
       'agency': {
         key: 'agency',
         transform: (value) => {
@@ -225,7 +225,7 @@ function getFields(props) {
             { value: '0', label: 'New' },
             { value: '1', label: 'Pending' },
             { value: '2', label: 'Approve' },
-            { value: '3', label: 'Rejected' },
+            // { value: '3', label: 'Rejected' },
             { value: '4', label: 'Published' },
           ]}
         />

src/components/SecondHeaderWrapper.jsx

@@ -0,0 +1,28 @@
+import { Outlet, useNavigate } from 'react-router-dom';
+import { Layout, Flex, theme } from 'antd';
+import BackBtn from './BackBtn';
+
+const { Content, Header } = Layout;
+const HeaderWrapper = ({ children, header, ...props }) => {
+  const navigate = useNavigate();
+  const {
+    token: { colorBgContainer },
+  } = theme.useToken();
+  return (
+    <>
+      <Layout className=''>
+        <Header className='header px-6 h-10 ' style={{ background: 'white' }}>
+          <Flex justify={'space-between'} align={'center'} className='h-full'>
+            {/* {header} */}
+            <div className="flex-auto">{header}</div>
+            <BackBtn />
+          </Flex>
+        </Header>
+        <Content className='' style={{ backgroundColor: colorBgContainer }}>
+          {children || <Outlet />}
+        </Content>
+      </Layout>
+    </>
+  );
+};
+export default HeaderWrapper;

src/hooks/useProductsSets.js

@@ -11,14 +11,14 @@ export const useProductsTypes = () => {
 
   useEffect(() => {
     const newData = [
-      { label: t('products:type.Experience'), value: t('products:type.Experience') },
+      { label: t('products:type.Experience'), value: 'Experience', key: 'Experience' },
-      {label: t("products:type.Car"), value: t("products:type.Car"),},
+      { label: t('products:type.Car'), value: 'Car', key: 'Car' },
-      {label: t("products:type.Guide"), value: t("products:type.Guide"),},
+      { label: t('products:type.Guide'), value: 'Guide', key: 'Guide' },
-      {label: t("products:type.Package"), value: t("products:type.Package"),},
+      { label: t('products:type.Package'), value: 'Package', key: 'Package' },
-      {label: t("products:type.Attractions"), value: t("products:type.Attractions"),},
+      { label: t('products:type.Attractions'), value: 'Attractions', key: 'Attractions' },
-      {label: t("products:type.Meals"), value: t("products:type.Meals"),},
+      { label: t('products:type.Meals'), value: 'Meals', key: 'Meals' },
-      {label: t("products:type.Extras"), value: t("products:type.Extras"),},
+      { label: t('products:type.Extras'), value: 'Extras', key: 'Extras' },
-      {label: t("products:type.Special"), value: t("products:type.Special")},
+      { label: t('products:type.Special'), value: 'Special', key: 'Special' },
     ];
     setTypes(newData);
   }, [i18n.language]);

src/main.jsx

@@ -31,6 +31,8 @@ import InvoicePaid from "@/views/invoice/Paid";
 import InvoicePaidDetail from "@/views/invoice/PaidDetail";
 import Airticket from "@/views/airticket/Index";
 import ProductsIndex from '@/views/products/Index';
+import ProductsDetail from '@/views/products/Detail';
+import ProductsAudit from '@/views/products/Audit';
 
 import './i18n';
 
@@ -67,6 +69,8 @@ const router = createBrowserRouter([
       { path: "invoice/paid/detail/:flid",element:<InvoicePaidDetail />},
       { path: "airticket",element:<Airticket />},
       { path: "products",element:<ProductsIndex />},
+      { path: "products/:travel_agency_id/audit",element:<ProductsAudit />},
+      { path: "products/:travel_agency_id",element:<ProductsDetail />},
     ]
   },
   {

src/stores/Products/Index.js

@@ -6,7 +6,18 @@ import { HT_HOST } from '@/config';
 
 const initialState = {
   loading: false,
-  productsList: [],
+  productsList: [
+    {
+      'audit_date': '2001-03-03',
+      'travel_agency_name': '新油低外',
+      'travel_agency_id': '650000200301029585',
+      'created_by': '冯丽',
+      'create_date': '1989-06-20',
+      'lastedit_memo': 'nostrud ad eu',
+      'audited_by': '黎静',
+      'audit_state': '1',
+    },
+  ],
 };
 export const useProductsStore = create(
   devtools((set, get) => ({

src/views/products/Audit.jsx

@@ -0,0 +1,32 @@
+import { createContext, useContext, useEffect, useState } from 'react';
+import { Button, Table, Tabs } from 'antd';
+import { useProductsTypes } from '@/hooks/useProductsSets';
+import SecondHeaderWrapper from '@/components/SecondHeaderWrapper';
+
+const Header = () => {
+  return (
+    <div className='flex justify-end gap-4 '>
+      <div className='flex-auto'></div>
+      <Button size='small'>导入合同</Button>
+      <Button size='small'>导出PDF</Button>
+    </div>
+  );
+};
+
+const TypesTabs = () => {
+  const productsTypes = useProductsTypes();
+  return (
+    <Tabs items={productsTypes} type='card' />
+  )
+}
+
+const Audit = ({ ...props }) => {
+  return (
+    <>
+      <SecondHeaderWrapper header={<Header />}>
+        <TypesTabs />
+      </SecondHeaderWrapper>
+    </>
+  );
+};
+export default Audit;

src/views/products/Detail.jsx

@@ -0,0 +1,10 @@
+import { createContext, useContext, useEffect, useState } from 'react';
+import { Table } from 'antd';
+
+const Detail = ((props) => {
+    return (
+      <>
+      </>
+    );
+});
+export default Detail;

src/views/products/Index.jsx

@@ -1,4 +1,5 @@
 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';
@@ -10,20 +11,29 @@ import { useProductsTypes } from '@/hooks/useProductsSets';
 function Index() {
   const { t } = useTranslation();
   const { userId } = usingStorage();
-  const [loading, productsList] = useProductsStore((state) => state.productsList);
+  const [loading, productsList] = useProductsStore((state) => [state.loading, state.productsList]);
 
   const [noticeList, setNoticeList] = useState([]);
   useEffect(() => {}, []);
 
   const showTotal = (total) => `Total ${total} items`;
   const columns = [
-    { title: t('products:Vendor'), key: '', dataIndex: '' },
+    { title: t('products:Vendor'), key: 'vendor', dataIndex: 'travel_agency_name' },
-    { title: t('products:AuState'), key: '', dataIndex: '' },
+    { title: t('products:CreatedBy'), key: 'created_by', dataIndex: 'created_by' },
-    { title: t('products:CreatedBy'), key: '', dataIndex: '' },
+    { title: t('products:CreateDate'), key: 'create_date', dataIndex: 'create_date' },
-    { title: t('products:CreateDate'), key: '', dataIndex: '' },
+    { title: t('products:AuState'), key: 'audit_state', dataIndex: 'audit_state' },
-    { title: t('products:Auditors'), key: '', dataIndex: '' },
+    { title: t('products:AuditedBy'), key: 'audited_by', dataIndex: 'audited_by' },
-    { title: t('products:AuditDate'), key: '', dataIndex: '' },
+    { title: t('products:AuditDate'), key: 'audit_date', dataIndex: 'audit_date' },
-    { title: '', key: 'action', render: () => <Button>{t('Edit')}</Button> },
+    {
+      title: '',
+      key: 'action',
+      render: (_, r) => (
+        <Space size={'large'}>
+          <Link to={`/products/${r.travel_agency_id}`}>{t('Edit')}</Link>
+          <Link to={`/products/${r.travel_agency_id}/audit`}>{t('Audit')}</Link>
+        </Space>
+      ),
+    },
   ];
   return (
     <Space direction='vertical' style={{ width: '100%' }}>