feat: 仪表盘调整

src/pages/Product/Road/Personal/components/Detail/TabList.jsx

@@ -101,8 +101,7 @@ const PersonalTabList = props => {
                 lockTypeEnum: lockTypeEnum.GIVE,
                 upgradeTypeEnum: upgradeTypeEnum.UPGRADE
               })
-            }
-          >
+            }>
             赠送
           </Button>
           {record.lock === 1 ? (
@@ -123,8 +122,7 @@ const PersonalTabList = props => {
                     lockTypeEnum: lockTypeEnum.SALE,
                     upgradeTypeEnum: upgradeTypeEnum.UPGRADE
                   })
-                }
-              >
+                }>
                 销售
               </Button>
             </>
@@ -147,8 +145,7 @@ const PersonalTabList = props => {
                     compilationListName: record.name,
                     upgradeTypeEnum: upgradeTypeEnum.DEMOTION
                   })
-                }
-              >
+                }>
                 降级
               </Button>
               <Button
@@ -169,8 +166,7 @@ const PersonalTabList = props => {
                     lockTypeEnum: record.lock,
                     upgradeTypeEnum: upgradeTypeEnum.DEADLINE
                   })
-                }
-              >
+                }>
                 限期
               </Button>
             </>
@@ -191,8 +187,7 @@ const PersonalTabList = props => {
                     lockTypeEnum: lockTypeEnum.LEND,
                     upgradeTypeEnum: upgradeTypeEnum.UPGRADE
                   })
-                }
-              >
+                }>
                 借出
               </Button>
               <Button
@@ -210,8 +205,7 @@ const PersonalTabList = props => {
                     lockTypeEnum: lockTypeEnum.SALE,
                     upgradeTypeEnum: upgradeTypeEnum.UPGRADE
                   })
-                }
-              >
+                }>
                 销售
               </Button>
             </>
@@ -271,15 +265,16 @@ const PersonalTabList = props => {
         actionPayload={actionPayload}
         ssoId={ssoId}
         cloudUser={{ mobile, username }}
-        loading={roadPricingUpgradev2.loading}
-        visible={roadPricingUpgradev2.visible}
-        type={roadPricingUpgradev2.type}
-        compilationId={roadPricingUpgradev2.compilationId}
-        compilationName={roadPricingUpgradev2.compilationName}
-        lock={roadPricingUpgradev2.lockTypeEnum}
-        upgradeType={roadPricingUpgradev2.upgradeTypeEnum}
-        compilationListName={roadPricingUpgradev2.compilationListName}
-        deadline={roadPricingUpgradev2.deadline}
+        roadPricingUpgradev2={roadPricingUpgradev2}
+        // loading={roadPricingUpgradev2.loading}
+        // visible={roadPricingUpgradev2.visible}
+        // type={roadPricingUpgradev2.type}
+        // compilationId={roadPricingUpgradev2.compilationId}
+        // compilationName={roadPricingUpgradev2.compilationName}
+        // lock={roadPricingUpgradev2.lockTypeEnum}
+        // upgradeType={roadPricingUpgradev2.upgradeTypeEnum}
+        // compilationListName={roadPricingUpgradev2.compilationListName}
+        // deadline={roadPricingUpgradev2.deadline}
       />
     </div>
   )

src/pages/Product/Road/Personal/components/Detail/UpgradeModal.jsx

@@ -13,22 +13,35 @@ import {
 
 const UpgradeModal = props => {
   const {
-    visible,
-    onCancel,
-    loading,
     onConfirm,
-    type,
+    onCancel,
     projectType,
+    actionPayload,
     ssoId,
-    compilationId,
-    compilationName,
-    compilationListName,
-    lock,
-    upgradeType,
     cloudUser,
-    deadline,
-    actionPayload
+    roadPricingUpgradev2: {
+      type,
+      loading,
+      visible,
+      compilationId,
+      compilationName,
+      compilationListName,
+      lock,
+      upgradeType,
+      deadline
+    }
+    // type,
+    // loading,
+    // visible,
+    // compilationId,
+    // compilationName,
+    // compilationListName,
+    // lock,
+    // upgradeType,
+    // deadline
   } = props
+  console.log(roadPricingUpgradev2)
+  console.log(roadPricingUpgradev2.type)
   const [form] = Form.useForm()
   const dispatch = useDispatch()
   const [showDeadline, setShowDeadline] = useState(false)
@@ -84,8 +97,7 @@ const UpgradeModal = props => {
       {type === lockTypeEnum.GIVE || type === lockTypeEnum.LEND || type === lockTypeEnum.SALE ? (
         <div className="mb-6">
           <p className="pb-3">
-            为用户<b>{cloudUser.mobile}</b>，<b>{cloudUser.username}</b> {modalTitleEnum[type]}{' '}
-            <b>{compilationName}</b>
+            为用户<b>{cloudUser.mobile}</b>，<b>{cloudUser.username}</b> {modalTitleEnum[type]} <b>{compilationName}</b>
           </p>
           <div className="pb-5">
             <Switch onChange={onChange} checked={showDeadline} />

src/pages/Workbench/Dashboard/index.jsx

@@ -170,12 +170,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
         type: 'staff/fetchDepartments'
       })
     }
-  }, [
-    state.params.businessGroupId,
-    state.params.dataPermission,
-    state.params.cyclical,
-    state.params.staffIds
-  ])
+  }, [state.params.businessGroupId, state.params.dataPermission, state.params.cyclical, state.params.staffIds])
   const columns = [
     {
       title: '超过周期未服务提醒',
@@ -187,8 +182,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
       render: (name, record) => (
         <span
           onClick={() => handleReminderList(record.type, '7day')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
           {name}
         </span>
       )
@@ -199,8 +193,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
       render: (name, record) => (
         <span
           onClick={() => handleReminderList(record.type, '15day')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
           {name}
         </span>
       )
@@ -211,8 +204,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
       render: (name, record) => (
         <span
           onClick={() => handleReminderList(record.type, '30day')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
           {name}
         </span>
       )
@@ -223,8 +215,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
       render: (name, record) => (
         <span
           onClick={() => handleReminderList(record.type, '3month')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
           {name}
         </span>
       )
@@ -235,21 +226,32 @@ const Dashboard = ({ dispatch, departments = [] }) => {
       render: (name, record) => (
         <span
           onClick={() => handleReminderList(record.type, '6month')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
           {name}
         </span>
       )
+    }
+  ]
+  const columnsSmall = [
+    {
+      title: '已到期备忘',
+      dataIndex: 'expiry',
+      render: (_, record) => (
+        <span
+          onClick={() => handleReminderList(record.type, 'expiry')}
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
+          {record.remind.expiry}
+        </span>
+      )
     },
     {
-      title: '备忘',
-      dataIndex: 'remind',
-      render: (name, record) => (
+      title: '未到期备忘',
+      dataIndex: 'unexpired',
+      render: (_, record) => (
         <span
-          onClick={() => handleReminderList(record.type, 'reminder')}
-          className="text-primary cursor-pointer hover:text-hex-967bbd"
-        >
-          {name}
+          onClick={() => handleReminderList(record.type, 'unexpired')}
+          className="text-primary cursor-pointer hover:text-hex-967bbd">
+          {record.remind.expiry}
         </span>
       )
     }
@@ -282,23 +284,66 @@ const Dashboard = ({ dispatch, departments = [] }) => {
   }
   return (
     <div className={styles.dashboard}>
-      <div className="shadow-card">
-        <ProTable
-          bordered
-          loading={state.loading}
-          rowKey={record => record.type + Date.now()}
-          columns={columns}
-          dataSource={state.reminderData}
-          search={false}
-          toolBarRender={false}
-          tableRender={(_, dom) => (
-            <Card bodyStyle={{ padding: state.loading ? '24px' : 0 }} loading={state.loading}>
-              {dom}
-            </Card>
-          )}
-          pagination={false}
-        />
+      <div>
+        {/* <div className="shadow-card">
+          <ProTable
+            bordered
+            loading={state.loading}
+            rowKey={record => record.type + Date.now()}
+            columns={columns}
+            dataSource={state.reminderData}
+            search={false}
+            toolBarRender={false}
+            tableRender={(_, dom) => (
+              <Card bodyStyle={{ padding: state.loading ? '24px' : 0 }} loading={state.loading}>
+                {dom}
+              </Card>
+            )}
+            pagination={false}
+          />
+        </div> */}
+        <Row gutter={[8, 8]}>
+          <Col xs={24} sm={24} md={24} lg={18} xl={18}>
+            <div className="shadow-card">
+              <ProTable
+                bordered
+                loading={state.loading}
+                rowKey={record => record.type + Date.now()}
+                columns={columns}
+                dataSource={state.reminderData}
+                search={false}
+                toolBarRender={false}
+                tableRender={(_, dom) => (
+                  <Card bodyStyle={{ padding: state.loading ? '24px' : 0 }} loading={state.loading}>
+                    {dom}
+                  </Card>
+                )}
+                pagination={false}
+              />
+            </div>
+          </Col>
+          <Col xs={24} sm={24} md={24} lg={6} xl={6}>
+            <div className="shadow-card">
+              <ProTable
+                bordered
+                loading={state.loading}
+                rowKey={record => record.type + Date.now()}
+                columns={columnsSmall}
+                dataSource={state.reminderData}
+                search={false}
+                toolBarRender={false}
+                tableRender={(_, dom) => (
+                  <Card bodyStyle={{ padding: state.loading ? '24px' : 0 }} loading={state.loading}>
+                    {dom}
+                  </Card>
+                )}
+                pagination={false}
+              />
+            </div>
+          </Col>
+        </Row>
       </div>
+
       <div className="mt-4 flex flex-row ">
         <span className="mx-4 my-4">
           <Select
@@ -351,8 +396,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
                     'relative',
                     'cursor-pointer',
                     state.selectId === item.id ? styles.imgBg : styles.paddingBg
-                  ].join(' ')}
-                >
+                  ].join(' ')}>
                   <img
                     className="w-full max-w-30px h-30px border rounded-30px"
                     src={
@@ -387,19 +431,14 @@ const Dashboard = ({ dispatch, departments = [] }) => {
                       <span
                         className={[
                           'text-xl',
-                          state.clientChainRatio.percentage.startsWith('-')
-                            ? 'text-green-500'
-                            : 'text-red-500'
-                        ].join(' ')}
-                      >
+                          state.clientChainRatio.percentage.startsWith('-') ? 'text-green-500' : 'text-red-500'
+                        ].join(' ')}>
                         {state.clientChainRatio.percentage}
                       </span>
                     </div>
                     <div className="flex justify-between items-center">
                       <div>新增客户</div>
-                      <span>
-                        {cyclicalOp.find(item => item.value === state.params.cyclical)?.title}
-                      </span>
+                      <span>{cyclicalOp.find(item => item.value === state.params.cyclical)?.title}</span>
                     </div>
                   </Col>
                 </Row>
@@ -411,10 +450,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
               {state.loading ? (
                 <Skeleton active avatar />
               ) : (
-                <Row
-                  className="cursor-pointer"
-                  onClick={() => handleRatioCard(cardTypeMap.COMPANY)}
-                >
+                <Row className="cursor-pointer" onClick={() => handleRatioCard(cardTypeMap.COMPANY)}>
                   <Col span={6}>
                     <div className="w-full max-w-48px h-48px border rounded-48px bg-[#0c7cd5] flex items-center justify-center">
                       <City size="26" fill="#fff" />
@@ -426,20 +462,15 @@ const Dashboard = ({ dispatch, departments = [] }) => {
                       <span
                         className={[
                           'text-xl',
-                          state.customerChainRatio.percentage.startsWith('-')
-                            ? 'text-green-500'
-                            : 'text-red-500'
-                        ].join(' ')}
-                      >
+                          state.customerChainRatio.percentage.startsWith('-') ? 'text-green-500' : 'text-red-500'
+                        ].join(' ')}>
                         {state.customerChainRatio.percentage}
                       </span>
                     </div>
 
                     <div className="flex justify-between items-center">
                       <div>新增单位</div>
-                      <span>
-                        {cyclicalOp.find(item => item.value === state.params.cyclical)?.title}
-                      </span>
+                      <span>{cyclicalOp.find(item => item.value === state.params.cyclical)?.title}</span>
                     </div>
                   </Col>
                 </Row>
@@ -489,10 +520,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
               {state.loading ? (
                 <Skeleton active avatar />
               ) : (
-                <Row
-                  onClick={() => handleRatioCard(cardTypeMap.SERVICE)}
-                  className="cursor-pointer"
-                >
+                <Row onClick={() => handleRatioCard(cardTypeMap.SERVICE)} className="cursor-pointer">
                   <Col span={6}>
                     <div className="w-full max-w-48px h-48px border rounded-48px bg-[#0c7cd5] flex items-center justify-center">
                       <Comment size="26" fill="#fff" />
@@ -504,20 +532,15 @@ const Dashboard = ({ dispatch, departments = [] }) => {
                       <span
                         className={[
                           'text-xl',
-                          state.serviceLogChainRatio.percentage.startsWith('-')
-                            ? 'text-green-500'
-                            : 'text-red-500'
-                        ].join(' ')}
-                      >
+                          state.serviceLogChainRatio.percentage.startsWith('-') ? 'text-green-500' : 'text-red-500'
+                        ].join(' ')}>
                         {state.serviceLogChainRatio.percentage}
                       </span>
                     </div>
 
                     <div className="flex justify-between items-center">
                       <div>服务记录</div>
-                      <span>
-                        {cyclicalOp.find(item => item.value === state.params.cyclical)?.title}
-                      </span>
+                      <span>{cyclicalOp.find(item => item.value === state.params.cyclical)?.title}</span>
                     </div>
                   </Col>
                 </Row>
@@ -542,8 +565,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
               title="数据汇总"
               className="shadow-card"
               bodyStyle={{ padding: state.loading ? '24px' : 0 }}
-              loading={state.loading}
-            >
+              loading={state.loading}>
               <ul>
                 <li className="px-12px py-16px border-b-1">
                   新增客户<b className="px-1">{state.aggregation.clientCount}</b>个，服务
@@ -570,10 +592,7 @@ const Dashboard = ({ dispatch, departments = [] }) => {
             <LeaderBoard dataList={state.leaderboard} loading={state.loading} />
           </Col>
           <Col xs={24} sm={24} md={24} lg={12} xl={12}>
-            <SoftLeaderboard
-              productLeaderBoard={state.productLeaderBoard}
-              loading={state.loading}
-            />
+            <SoftLeaderboard productLeaderBoard={state.productLeaderBoard} loading={state.loading} />
           </Col>
         </Row>
       </div>