Merge branch 'master' of lizhiqi/yongxu-web into master

config/routes.ts

@@ -176,10 +176,23 @@
     ],
   },
   {
-    path: '/AfterSalesManagement',
+    path: '/afterSales',
     name: '售后管理',
     icon: 'Appstore',
-    component: './AfterSalesManagement',
+    routes: [
+      {
+        path: '/afterSales/AfterSalesManagement',
+        name: '售后管理',
+        icon: 'Appstore',
+        component: './AfterSales/AfterSalesManagement',
+      },
+      {
+        path: '/afterSales/AfterSalesSupport',
+        name: '售后支持管理',
+        icon: 'Appstore',
+        component: './AfterSales/AfterSalesSupport',
+      },
+    ],
   },
   // 房间列表
   {

src/pages/AfterSalesManagement/deviceHistory.tsx → src/pages/AfterSales/AfterSalesManagement/deviceHistory.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { Modal, Table } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
 import moment from 'moment/moment';
-import { queryDeviceRunState } from '@/services/afterSales';
+import { queryDeviceRunState } from '@/services/afterSales/afterSales';
 
 interface editProps {
   visible: boolean;

src/pages/AfterSalesManagement/index.tsx → src/pages/AfterSales/AfterSalesManagement/index.tsx

@@ -1,10 +1,10 @@
 import React, { useEffect, useState } from 'react';
 import { PageContainer } from '@ant-design/pro-components';
-import { Button, Form, Input, Space, Table } from 'antd';
+import { Button, Card, Form, Input, Space, Table } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
-import { queryDeviceOperations, queryDeviceOperationsData } from '@/services/afterSales';
+import { queryDeviceOperations, queryDeviceOperationsData } from '@/services/afterSales/afterSales';
 import DeviceStatusData from './deviceStatusData';
-import DeviceHistory from '@/pages/AfterSalesManagement/deviceHistory';
+import DeviceHistory from '@/pages/AfterSales/AfterSalesManagement/deviceHistory';
 import { ReloadOutlined, SearchOutlined } from '@ant-design/icons';
 
 interface DataType {
@@ -254,7 +254,7 @@ const BannerManagement: React.FC = () => {
 
   return (
     <PageContainer>
-      <div style={{ background: '#fff' }}>
+      <Card>
         <Form form={form} layout="inline" onFinish={onFinish} style={{ padding: '20px' }}>
           <Form.Item name="home_name" label="家名称">
             <Input placeholder="请输入家名称" />
@@ -300,7 +300,7 @@ const BannerManagement: React.FC = () => {
             editCallback={onStatusCallback}
           />
         )}
-      </div>
+      </Card>
     </PageContainer>
   );
 };

src/pages/AfterSales/AfterSalesSupport/index.tsx

@@ -0,0 +1,204 @@
+import React, { useEffect, useState } from 'react';
+import { PageContainer } from '@ant-design/pro-components';
+import { Button, Card, Form, Input, Space, Table } from 'antd';
+import { ReloadOutlined, SearchOutlined } from '@ant-design/icons';
+import type { ColumnsType } from 'antd/es/table';
+import { queryAfterSalesSupport } from '@/services/afterSales/afterSalesSupport';
+import moment from 'moment';
+
+interface DataType {
+  name: string;
+  phone: string;
+  address: string;
+  installation_unit: string;
+  installer_name: string;
+  installer_phone: string;
+  dealer_name: string;
+  record_id: string;
+}
+
+/**
+ * 售后支持
+ * @constructor
+ */
+const AfterSalesSupport: React.FC = () => {
+  const [form] = Form.useForm();
+  const [dataList, setDataList] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [pagination, setPagination] = useState({ total: 0, current: 1, pageSize: 10 });
+  const [searchData, setSearchData] = useState<object | null>({});
+
+  // 获取列表信息
+  const getList = () => {
+    const params = {
+      q: 'page',
+      current: pagination.current,
+      pageSize: pagination.pageSize,
+      ...searchData,
+    };
+    queryAfterSalesSupport(params).then((res) => {
+      if (res && res.code === 0) {
+        setDataList(res.data.list || []);
+        setPagination(res.data.pagination);
+        setLoading(false);
+      }
+    });
+  };
+
+  useEffect(() => {
+    getList();
+  }, []);
+
+  useEffect(() => {
+    getList();
+  }, [searchData]);
+
+  // 搜索
+  const onFinish = () => {
+    form.validateFields().then((data) => {
+      setLoading(true);
+      setSearchData(data);
+    });
+  };
+
+  // 重置
+  const onReset = () => {
+    form.resetFields();
+    setLoading(true);
+    setSearchData(null);
+  };
+
+  // 分页切换
+  const tableChange = (page: any) => {
+    setLoading(true);
+    const params = {
+      q: 'page',
+      current: page.current,
+      pageSize: page.pageSize,
+      ...searchData,
+    };
+    queryAfterSalesSupport(params).then((res) => {
+      if (res && res.code === 0) {
+        setDataList(res.data.list || []);
+        setPagination(res.data.pagination);
+        setLoading(false);
+      }
+    });
+  };
+
+  const columns: ColumnsType<DataType> = [
+    {
+      title: '序号',
+      align: 'center',
+      key: 'index',
+      width: 80,
+      render: (_: any, _row: any, index: number) => index + 1,
+    },
+    {
+      title: '用户名称',
+      dataIndex: 'name',
+      key: 'name',
+      width: 150,
+    },
+    {
+      title: '用户电话',
+      dataIndex: 'phone',
+      key: 'phone',
+      width: 100,
+    },
+    {
+      title: '用户地址',
+      dataIndex: 'address',
+      key: 'address',
+      width: 300,
+    },
+    {
+      title: '安装单位名称',
+      dataIndex: 'installation_unit',
+      key: 'installation_unit',
+      width: 300,
+    },
+    {
+      title: '工人师傅姓名',
+      dataIndex: 'installer_name',
+      key: 'installer_name',
+      width: 150,
+    },
+    {
+      title: '工人师傅电话',
+      dataIndex: 'installer_phone',
+      key: 'installer_phone',
+      width: 150,
+    },
+    {
+      title: '经销商单位',
+      dataIndex: 'dealer_name',
+      key: 'dealer_name',
+      width: 300,
+    },
+    {
+      title: '主控编号',
+      dataIndex: 'main_code',
+      key: 'main_code',
+      width: 300,
+    },
+    {
+      title: '安装时间',
+      dataIndex: 'install_time',
+      key: 'install_time',
+      render: (v) => v && <span>{moment(v).format('YYYY-MM-DD HH:mm')}</span>,
+      width: 300,
+    },
+    {
+      title: '提交时间',
+      dataIndex: 'created_at',
+      key: 'created_at',
+      render: (v) => v && <span>{moment(v).format('YYYY-MM-DD HH:mm')}</span>,
+      width: 300,
+    },
+  ];
+
+  return (
+    <PageContainer>
+      <div>
+        <Card>
+          <Form form={form} layout="inline" onFinish={onFinish}>
+            <Form.Item name="user_name" label="用户名称">
+              <Input placeholder="请输入用户名称" />
+            </Form.Item>
+            <Form.Item name="user_phone" label="用户电话">
+              <Input placeholder="请输入用户电话" />
+            </Form.Item>
+            <Form.Item name="user_address" label="地址">
+              <Input placeholder="请输入地址" />
+            </Form.Item>
+            <Form.Item name="main_code" label="主控编号">
+              <Input placeholder="请输入主控编号" />
+            </Form.Item>
+            <Form.Item style={{ marginBottom: '10px' }}>
+              <Space>
+                <Button type="primary" htmlType="submit">
+                  <SearchOutlined />
+                  查询
+                </Button>
+                <Button htmlType="button" onClick={onReset}>
+                  <ReloadOutlined />
+                  重置
+                </Button>
+              </Space>
+            </Form.Item>
+          </Form>
+          <Table
+            columns={columns}
+            dataSource={dataList}
+            rowKey={(record) => record.record_id}
+            pagination={pagination}
+            loading={loading}
+            onChange={tableChange}
+          />
+        </Card>
+      </div>
+    </PageContainer>
+  );
+};
+export default AfterSalesSupport;

src/services/afterSales/afterSalesSupport.ts

@@ -0,0 +1,10 @@
+import { request } from '@@/plugin-request/request';
+import { stringify } from 'qs';
+
+/**
+ * 查询售后支持列表
+ * @param param
+ */
+export async function queryAfterSalesSupport(param: object) {
+  return request(`/web/v1/after_sales?${stringify(param)}`);
+}