feat: 投诉建议

src/layout/index.tsx

@@ -35,7 +35,7 @@ const AdminLayout: any = (props: any) => {
         {
           routes.filter(item => !item.hideInMenu).map((route) => {
             return (
-              route.children
+              route.children && route.children.filter(({ hideInMenu }) => !hideInMenu)?.length
                 ?
                 <Menu.SubMenu key={route.path} title={route.title}>
                   {

src/router/config.tsx

@@ -88,10 +88,14 @@ const UserList = lazy(() => import('../views/User/account'))
 // 报时报修相关
 const FixType = lazy(() => import('../views/Fix/type'))
 const FixOnlineForm = lazy(() => import('../views/Fix/online-form'))
-const FixReturnVisit = lazy(() => import('../views/Fix/return-visit'))
-const FixTodo = lazy(() => import('../views/Fix/to-do'))
+// const FixReturnVisit = lazy(() => import('../views/Fix/return-visit'))
+// const FixTodo = lazy(() => import('../views/Fix/to-do'))
 const FixOrderDetail = lazy(() => import('../views/Fix/order-detail'))
 
+// 投诉相关
+const Complaint = lazy(() => import('../views/Complaint/index'))
+const ComplaintDetail = lazy(() => import('../views/Complaint/order-detail'))
+
 export const Wrapper = (Component) => (props) => {
   return (
     <Suspense fallback={() => {}}>
@@ -415,6 +419,21 @@ export const routes: any = [
       // }
     ]
   },
+  {
+    title: '投诉建议',
+    path: '/admin/complaint',
+    exact: true,
+    component: Wrapper(Complaint),
+    children: [
+      {
+        title: '投诉建议详情',
+        path: '/admin/complaint/detail',
+        exact: true,
+        component: Wrapper(ComplaintDetail),
+        hideInMenu: true
+      },
+    ]
+  },
   {
     title: '房屋租售',
     path: '/admin/house',

src/views/Complaint/index.tsx

@@ -1,11 +1,187 @@
 import React from 'react'
+import type { ActionType } from '@ant-design/pro-table'
+import ProTable from '@ant-design/pro-table'
+import {Button, Modal, Form, Radio, Input, message, Select, DatePicker, Upload} from 'antd'
+import { withRouter } from 'react-router-dom'
+import { User } from '../../services/user'
+import './index.scss'
+import {PlusOutlined} from "@ant-design/icons";
 
-const CustomerService: React.FC = () => {
-  return (
+const Complaint: React.FC = (props: any) => {
+  const columns: any = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      search: false
+    },
+    {
+      title: '投诉类型',
+      dataIndex: 'suggestion_type',
+      search: true,
+      valueEnum: {
+        1: { text: '投诉' },
+        2: { text: '建议' }
+      }
+    },
+    {
+      title: '投诉人',
+      dataIndex: 'user_name',
+      search: true,
+    },
+    {
+      title: '联系电话',
+      dataIndex: 'user_name',
+      search: true,
+    },
+    {
+      title: '投诉内容',
+      dataIndex: 'user_name',
+      search: false,
+    },
+    {
+      title: '投诉日期',
+      dataIndex: 'user_name',
+      search: false,
+    },
+    {
+      title: '状态',
+      dataIndex: 'phone',
+      search: false,
+    },
+    {
+      title: '操作',
+      dataIndex: 'option',
+      search: false,
+      render: (_, row, index, action) => {
+        return [
+          <Button
+            className="mr-1.5"
+            onClick={() => {
+              form.setFieldsValue(row)
+              setState(prevState => ({
+                ...prevState,
+                visible: true,
+                editId: row.id
+              }))
+            }}
+          >编辑</Button>,
+          <Button
+            className="mr-1.5"
+            onClick={() => {}}
+          >派单</Button>,
+          <Button
+            className="mr-1.5"
+            onClick={() => {
+              props.history.push('/admin/complaint/detail')
+            }}
+          >详情</Button>,
+          <Button onClick={() => {
+            Modal.confirm({
+              title: '删除记录',
+              content: '你确定删除这条记录吗？',
+              onOk: async () => {
+                await User({ method: 'delete', id: row.id })
+                message.success('操作成功！')
+                actionRef.current.reload()
+              }
+            })
+          }}>删除</Button>
+        ]
+      }
+    }
+  ]
+
+  const [pic, setPic]: any = React.useState([])
+
+  const uploadButton = (
     <div>
-      Im客服
+      <PlusOutlined />
+      <div style={{ marginTop: 8 }}>上传图片</div>
     </div>
   )
+  const [state, setState] = React.useState({
+    visible: false,
+    orderVisible: false,
+    editId: null
+  })
+
+  const actionRef: any = React.useRef<ActionType>()
+  const [form] = Form.useForm()
+  const [orderForm] = Form.useForm()
+
+  const onSubmit = () => {
+    form.validateFields().then(async values => {
+      await User({
+        method: 'post',
+        ...values,
+        group_id: 11,
+        department_id: 0
+      })
+      message.success('操作成功！')
+      form.resetFields()
+      actionRef.current?.reloadAndRest()
+      setState(prevState => ({ ...prevState, visible: false }))
+    })
+  }
+
+  return (
+    <React.Fragment>
+      <ProTable
+        headerTitle="投诉建议/投诉录入"
+        actionRef={actionRef}
+        rowKey="key"
+        request={User}
+        toolBarRender={() => [
+          <Button
+            type="primary"
+            key="primary"
+            onClick={() => {
+              setState(preState => ({ ...preState, visible: true }))
+            }}
+          >添加</Button>
+        ]}
+        columns={columns}
+      />
+      <Modal
+        title='添加投诉建议'
+        visible={state.visible}
+        onOk={onSubmit}
+        onCancel={() => setState(pre => ({ ...pre, visible: false }))}
+      >
+        <Form
+          labelCol={{ span: 5 }}
+          wrapperCol={{ span: 15 }}
+          form={form}
+        >
+          <Form.Item label='投诉类型' name="group_id" rules={[{ required: true }]}>
+            <Select placeholder='请选择' options={[
+              { label: '投诉', value: 1 },
+              { label: '建议', value: 2 },
+            ]} />
+          </Form.Item>
+          <Form.Item label='投诉人' name="user_name" rules={[{ required: true }]}>
+            <Input placeholder="请输入" />
+          </Form.Item>
+          <Form.Item label='联系方式' name="user_name" rules={[{ required: true }]}>
+            <Input placeholder="请输入" />
+          </Form.Item>
+          <Form.Item label='投诉内容' name="user_name" rules={[{ required: true }]}>
+            <Input.TextArea placeholder="多行输入" rows={4} />
+          </Form.Item>
+          <Form.Item label='投诉图片' name="user_name" rules={[{ required: false }]}>
+            <Upload
+              action="http://localhost:3000/api/v1/upload"
+              listType="picture-card"
+              fileList={pic}
+              onChange={(({ fileList }) => setPic(fileList))}
+            >
+              { uploadButton }
+            </Upload>
+          </Form.Item>
+        </Form>
+      </Modal>
+    </React.Fragment>
+  )
 }
 
-export default CustomerService
+export default withRouter(Complaint)

src/views/Complaint/order-detail.tsx

@@ -0,0 +1,84 @@
+import React from 'react'
+import { Button, Card, Divider, Form, Table, Col, Row, Image } from "antd"
+import { useHistory } from "react-router"
+
+const columns = [
+  {
+    title: 'ID',
+    dataIndex: ''
+  },
+  {
+    title: '处理人',
+    dataIndex: ''
+  },
+  {
+    title: '状态',
+    dataIndex: ''
+  },
+  {
+    title: '处理时间',
+    dataIndex: ''
+  },
+  {
+    title: '意见',
+    dataIndex: 'feedback'
+  },
+]
+const infoKeys = [
+  { label: '分类名称', key: '' },
+  { label: '联系地址', key: '' },
+  { label: '报修人', key: '' },
+  { label: '联系方式', key: '' },
+  { label: '预约时间', key: '' },
+  { label: '报修时间', key: '' },
+  { label: '报修内容', key: '' },
+  { label: '报修图片', key: '', col: 24, type: 'picture' },
+]
+
+const OrderDetail: React.FC = () => {
+
+  const history = useHistory()
+
+  return (
+    <React.Fragment>
+      <div className="flex justify-between items-center pb-3" style={{ fontSize: '18px' }}>
+        投诉建议/投诉详情
+        <div>
+          <Button className="mr-1.5" type="primary">打印</Button>
+          <Button onClick={() => history.goBack()}>返回</Button>
+        </div>
+      </div>
+      <Card title="工单详情">
+        <Form>
+          <Row>
+            {
+              infoKeys.map(item => (
+                <Col span={item.col || 8}>
+                  <Form.Item label={item.label}>
+                    { item.type === 'picture' ? (
+                      <Image className="mr-1.5" width={120} src="https://hbimg.huabanimg.com/683615e8e5dd8c4660efbdf1fbc3c26f1da40cae2a7a7-fcKebd_fw658/format/webp" />
+                    ) : item.label }
+                  </Form.Item>
+                </Col>
+              ))
+            }
+          </Row>
+        </Form>
+      </Card>
+      <Divider />
+      <Card title="工单流转">
+        <Table columns={columns} bordered />
+      </Card>
+      <Divider />
+      <Card title="回访/业主评价">
+        <Form>
+          <Form.Item label="满意度">xxxxxx</Form.Item>
+          <Form.Item label="业主评价">xxxxxxxxxxxxxxxxxx</Form.Item>
+        </Form>
+      </Card>
+    </React.Fragment>
+
+  )
+}
+
+export default OrderDetail

src/views/Fix/online-form.tsx

@@ -22,7 +22,7 @@ const FixOnlineForm: React.FC = (props: any) => {
     {
       title: '联系地址',
       dataIndex: 'user_name',
-      search: true,
+      search: false,
     },
     {
       title: '报修人',
@@ -37,22 +37,22 @@ const FixOnlineForm: React.FC = (props: any) => {
     {
       title: '预约时间',
       dataIndex: 'user_name',
-      search: true,
+      search: false,
     },
     {
       title: '报修内容',
       dataIndex: 'user_name',
-      search: true,
+      search: false,
     },
     {
       title: '报修时间',
       dataIndex: 'user_name',
-      search: true,
+      search: false,
     },
     {
       title: '状态',
       dataIndex: 'phone',
-      search: false,
+      search: true,
     },
     {
       title: '操作',
@@ -141,7 +141,6 @@ const FixOnlineForm: React.FC = (props: any) => {
         headerTitle="报事报修/在线报修"
         actionRef={actionRef}
         rowKey="key"
-        search={false}
         request={User}
         toolBarRender={() => [
           <Button