feat: 大司空个人版列表+编办列表

src/pages/Customer/Client/components/AddClient/index.jsx

@@ -105,14 +105,12 @@ const AddClient = props => {
                 }
                 formRef?.setFieldsValue(values)
                 handleOnOk()
-              }}
-            >
+              }}>
               添加并关联
             </Button>
           ) : null}
         </div>
-      }
-    >
+      }>
       <Form {...layout} form={formRef} onValuesChange={handleChange} initialValues={defaultValues}>
         {showDataItem ? <ProFormText name={`${dataType}Id`} hidden /> : null}
         <ProFormText
@@ -124,8 +122,7 @@ const AddClient = props => {
         <Form.Item
           label="客户地区"
           name="districtIds"
-          rules={[{ required: true, message: '请选择地区' }]}
-        >
+          rules={[{ required: true, message: '请选择地区' }]}>
           <LazyCascader showFooter={true} />
         </Form.Item>
         <Row>
@@ -147,8 +144,7 @@ const AddClient = props => {
               name="telephone"
               validateStatus={validStatusFtl}
               hasFeedback
-              rules={[{ required: true, message: '请输入手机号码' }]}
-            >
+              rules={[{ required: true, message: '请输入手机号码' }]}>
               <TelephoneFormItem validateFn={status => setValidStatusFtl(status)} />
             </Form.Item>
             <ProFormText

src/pages/Product/Cloud/index.jsx

@@ -69,8 +69,7 @@ const Cloud = () => {
               projectType: roadpricingEnum[columnStateType]
             })
           }
-          className="text-primary cursor-pointer hover:text-[#967bbd]"
-        >
+          className="text-primary cursor-pointer hover:text-[#967bbd]">
           {text}
         </span>
       )
@@ -151,8 +150,7 @@ const Cloud = () => {
                       )
                   )}
                 </div>
-              }
-            >
+              }>
               {record.all_online_times}
             </Tooltip>
           )

src/pages/Product/Road/Enterprise/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-const index = () => {
+const Enterprise = () => {
   return (
     <div>
       <span>企业版</span>
@@ -8,4 +8,4 @@ const index = () => {
   )
 }
 
-export default index
+export default Enterprise

src/pages/Product/Road/Personal/index.jsx

@@ -1,11 +1,221 @@
-import React from 'react'
+import React, { useState, useEffect, useRef } from 'react'
+import BasicTable from '@/components/Table'
+import { dayjsFormat, generateSortField } from '@/utils/utils'
+import { queryRoadpricingListV2 } from '@/services/product'
+import consts from '@/consts'
+import { useLocation, useSelector, useDispatch, connect } from 'umi'
+import { Input, Tooltip, Tag } from 'antd'
 
-const index = () => {
+const Personal = props => {
+  const { compilationv2 } = props
+  console.log(compilationv2)
+  const dispatch = useDispatch()
+  const tRef = useRef()
+  const [state, setState] = useState({
+    params: {
+      projectType: 1,
+      search: null
+    }
+  })
+  useEffect(() => {
+    if (!compilationv2?.length) {
+      dispatch({
+        type: 'road/fetchCompilationv2',
+        payload: {
+          projectType: 1
+        }
+      })
+    }
+  }, [])
+  const columns = [
+    {
+      title: '通行账号',
+      dataIndex: 'mobile',
+      key: 'mobile',
+      width: 110,
+      fixed: 'left'
+    },
+    {
+      title: '称呼',
+      dataIndex: 'username',
+      key: 'username',
+      width: 100
+    },
+    {
+      title: '真实姓名',
+      dataIndex: 'real_name',
+      key: 'real_name',
+      width: 100
+    },
+    {
+      title: 'QQ',
+      dataIndex: 'qq',
+      key: 'qq',
+      width: 110
+    },
+    {
+      title: '企业名称',
+      dataIndex: 'company',
+      key: 'company',
+      width: 150
+    },
+    {
+      title: 'CLD客户',
+      dataIndex: 'cld',
+      key: 'cld',
+      width: 150
+    },
+    {
+      title: 'CLD单位',
+      dataIndex: 'customerName',
+      key: 'customerName',
+      width: 150
+    },
+    {
+      title: '最近登录',
+      dataIndex: 'onlineTimes',
+      key: 'onlineTimes',
+      filters: true,
+      filterMultiple: false,
+      width: 110,
+      valueEnum: {
+        1: { text: '超过30分钟' },
+        2: { text: '超过1小时' },
+        3: { text: '超过2小时' },
+        4: { text: '超过3小时' }
+      },
+      renderText: (t, record) => {
+        if (record.all_online_times && record.online_list?.length) {
+          return (
+            <Tooltip
+              title={
+                <div>
+                  <div>最近登陆：</div>
+                  {record.online_list?.map(
+                    (item, i) =>
+                      i < 10 && (
+                        <div className="flex justify-between" key={item.dateString}>
+                          <span>{item.online_times}</span>
+                          <span className="ml-4">{item.dateString}</span>
+                        </div>
+                      )
+                  )}
+                </div>
+              }>
+              {record.all_online_times}
+            </Tooltip>
+          )
+        }
+        return '-'
+      }
+    },
+    {
+      title: '最近使用',
+      dataIndex: 'latestUsed',
+      key: 'latestUsed',
+      width: 120,
+      filters: true,
+      filterMultiple: false,
+      // valueEnum: compilationv2.reduce((prev, curr) => {
+      //   const obj = { ...prev }
+      //   if (curr._id) {
+      //     obj[curr._id] = {
+      //       text: curr.name
+      //     }
+      //   }
+      //   return obj
+      // }, {}),
+      renderText: (_, record) =>
+        record.latestUsedName && <Tag color="purple">{record.latestUsedName}</Tag>
+    },
+    {
+      title: '地区',
+      dataIndex: 'province',
+      key: 'province',
+      width: 80
+    },
+    {
+      title: '注册时间',
+      dataIndex: 'create_time',
+      key: 'create_time',
+      sorter: true,
+      ellipsis: true,
+      width: 150,
+      renderText: text => dayjsFormat(text, 'YYYY-MM-DD HH:mm')
+    },
+    {
+      title: '是否升级到专业版',
+      dataIndex: 'upGrade',
+      key: 'upGrade',
+      width: 150,
+      filters: true,
+      filterMultiple: false,
+      // valueEnum: compilation.reduce((prev, curr) => {
+      //   const obj = { ...prev }
+      //   if (curr._id) {
+      //     obj[curr._id] = {
+      //       text: curr.name
+      //     }
+      //   }
+      //   return obj
+      // }, {}),
+      renderText: (_, record) => (
+        <div className="children:m-2px">
+          {record.upgrade_list
+            .filter(item => item.isUpgrade)
+            .map(item => {
+              return (
+                <Tag color="purple" key={item.compilationID}>
+                  {compilation?.find(i => i._id === item.compilationID)?.name}
+                </Tag>
+              )
+            })}
+        </div>
+      )
+    }
+  ]
+  const handleSearch = value => {
+    tRef.current?.reloadAndRest()
+    setState({ ...state, params: { ...state.params, search: value } })
+  }
   return (
     <div>
-      <span>大司空个人版</span>
+      <BasicTable
+        actionRef={tRef}
+        rowKey={record => record._id}
+        columns={columns}
+        params={state.params}
+        request={async (params, sort, filter) => {
+          const sortOrder = generateSortField(sort)
+          const {
+            code = -1,
+            data: { list = [], total = 0 }
+          } = await queryRoadpricingListV2({ ...params, ...sortOrder, ...filter })
+          return {
+            data: list,
+            success: code === consts.RET_CODE.SUCCESS,
+            total
+          }
+        }}
+        toolbar={{
+          search: (
+            <Input.Search
+              style={{ width: '250px' }}
+              allowClear={true}
+              placeholder="请输入手机、QQ进行搜索"
+              onSearch={handleSearch}
+            />
+          ),
+          actions: []
+        }}
+        search={false}
+        pagination={{
+          pageSize: 20,
+          showSizeChanger: false
+        }}
+      />
     </div>
   )
 }
 
-export default index
+export default connect(({ road }) => ({ compilationv2: road.compilationv2 }))(Personal)

src/pages/Product/Road/model.js

@@ -0,0 +1,42 @@
+import consts from '@/consts'
+import { queryCompilationListV2 } from '@/services/product'
+
+export default {
+  namespace: 'road',
+  state: {
+    compilationv2: {} // 个人
+  },
+  // 用于处理异步操作和业务逻辑，由action触发，但不能修改state
+  effects: {
+    *fetchCompilationv2({ payload }, { call, put }) {
+      const response = yield call(queryCompilationListV2, payload)
+      if (response && response.code === consts.RET_CODE.SUCCESS) {
+        yield put({
+          type: 'changeCompilationStatev2',
+          payload: {
+            key: payload?.projectType,
+            data: response.data
+          }
+        })
+      }
+    }
+  },
+  // reducers:用于处理同步操作，由action触发，可修改state
+  reducers: {
+    // 通用reducer
+    changeCompilationStatev2(state, action) {
+      return {
+        ...state,
+        compilationv2: { ...state.compilationv2, [action.payload.key]: action.payload.data }
+      }
+    }
+  }
+  // reducers: {
+  //   changeCompilationState(state, action) {
+  //     return {
+  //       ...state,
+  //       compilation: { ...state.compilation, [action.payload.key]: action.payload.data }
+  //     }
+  //   }
+  // }
+}

src/services/product.js

@@ -114,3 +114,18 @@ export async function apiRoadPricingUnLinkClient(params) {
 export async function apiRoadPricingUpgrade(payload) {
   return request('/RoadPricing/upgrade', { method: 'POST', data: payload })
 }
+
+/** 大司空2.0个人版列表 */
+export async function queryRoadpricingListV2(params) {
+  return request('/RoadPricingv2/list', {
+    method: 'POST',
+    data: params
+  })
+}
+
+/** 大司空2.0编办列表 */
+export async function queryCompilationListV2(params) {
+  return request('/RoadPricingv2/compilation', {
+    params
+  })
+}