fix: 修复物联网卡新增接口

src/pages/iot-card/CardManagement/BindDevice.tsx

@@ -18,7 +18,7 @@ type BindDeviceType = {
 const BindDevice = (props: BindDeviceType) => {
   const actionRef = useRef<ActionType>();
   const [searchParams, setSearchParams] = useState<any>({});
-  const [bindKey, setBindKey] = useState<any>('');
+  const [bindKeys, setBindKeys] = useState<string[]>([]);
   const [loading, setLoading] = useState(false);
 
   const columns: ProColumns<DeviceInstance>[] = [
@@ -72,18 +72,18 @@ const BindDevice = (props: BindDeviceType) => {
 
   const submit = useCallback(async () => {
     setLoading(true);
-    const resp = await service.bind(props.cardId, bindKey[0]);
+    const resp = await service.bind(props.cardId, bindKeys[0]);
     setLoading(false);
     if (resp.status === 200) {
       message.success('操作成功');
       props?.onOk();
     }
-  }, [bindKey]);
+  }, [bindKeys]);
 
   return (
     <Modal
       title={'选择设备'}
-      width={1000}
+      width={1100}
       visible={true}
       confirmLoading={loading}
       onCancel={props.onCancel}
@@ -115,11 +115,23 @@ const BindDevice = (props: BindDeviceType) => {
         rowKey="id"
         search={false}
         pagination={{ pageSize: 10 }}
+        tableAlertRender={({ selectedRowKeys }) => <div>已选择 {selectedRowKeys.length} 项</div>}
+        tableAlertOptionRender={() => {
+          return (
+            <a
+              onClick={() => {
+                setBindKeys([]);
+              }}
+            >
+              取消选择
+            </a>
+          );
+        }}
         rowSelection={{
           type: 'radio',
-          selectedRowKeys: [bindKey],
+          selectedRowKeys: bindKeys,
           onSelect: (record) => {
-            setBindKey(record.id);
+            setBindKeys([record.id]);
           },
         }}
       />

src/pages/iot-card/CardManagement/SaveModal.tsx

@@ -1,5 +1,5 @@
 import { Form, Input, message, Modal, Select } from 'antd';
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 import { service } from './index';
 import { useRequest } from 'ahooks';
@@ -14,6 +14,7 @@ type SaveType = {
 
 const Save = (props: SaveType) => {
   const [form] = Form.useForm();
+  const [loading, setLoading] = useState(false);
 
   const { data: platformList, run: platformRun } = useRequest(service.queryPlatformNoPage, {
     manual: true,
@@ -35,9 +36,10 @@ const Save = (props: SaveType) => {
   const submit = async () => {
     const formData = await form.validateFields();
     if (formData) {
+      setLoading(true);
       const resp =
-        props.type === 'add' ? await service.save(formData) : await service.update(formData);
-
+        props.type === 'add' ? await service.add(formData) : await service.update(formData);
+      setLoading(false);
       if (resp.status === 200) {
         message.success('操作成功');
         props?.onOk();
@@ -51,6 +53,7 @@ const Save = (props: SaveType) => {
       width={600}
       onCancel={props.onCancel}
       onOk={submit}
+      confirmLoading={loading}
     >
       <Form
         form={form}

src/pages/iot-card/CardManagement/index.tsx

@@ -111,7 +111,7 @@ const CardManagementNode = () => {
       width: 120,
       valueType: 'select',
       render(_, record) {
-        return record.cardType.text;
+        return record.cardType?.text;
       },
       request: async () => {
         return [
@@ -217,12 +217,13 @@ const CardManagementNode = () => {
             isPermission={permission.delete}
             tooltip={{ title: '绑定设备' }}
             onClick={() => {
+              setCurrent(record);
               setBindDeviceVisible(true);
             }}
           >
             <LinkOutlined />
           </PermissionButton>,
-          record.cardStateType.value === 'toBeActivated' ? (
+          record.cardStateType?.value === 'toBeActivated' ? (
             <PermissionButton
               type="link"
               key="activation"
@@ -249,11 +250,11 @@ const CardManagementNode = () => {
               key="activation"
               style={{ padding: 0 }}
               isPermission={permission.action}
-              tooltip={{ title: record.cardStateType.value === 'deactivate' ? '复机' : '停用' }}
+              tooltip={{ title: record.cardStateType?.value === 'deactivate' ? '复机' : '停用' }}
               popConfirm={{
-                title: record.cardStateType.value === 'deactivate' ? '确认复机？' : '确认停用?',
+                title: record.cardStateType?.value === 'deactivate' ? '确认复机？' : '确认停用?',
                 onConfirm: async () => {
-                  if (record.cardStateType.value === 'deactivate') {
+                  if (record.cardStateType?.value === 'deactivate') {
                     service.resumption(record.id).then((resp) => {
                       if (resp.status === 200) {
                         message.success('操作成功');
@@ -271,7 +272,7 @@ const CardManagementNode = () => {
                 },
               }}
             >
-              {record.cardStateType.value === 'deactivate' ? (
+              {record.cardStateType?.value === 'deactivate' ? (
                 <PoweroffOutlined />
               ) : (
                 <StopOutlined />
@@ -463,6 +464,7 @@ const CardManagementNode = () => {
         <SaveModal
           type={current.id ? 'edit' : 'add'}
           onCancel={() => {
+            setCurrent({});
             setVisible(false);
           }}
           data={current}
@@ -495,9 +497,11 @@ const CardManagementNode = () => {
         <BindDeviceModal
           cardId={current.id!}
           onCancel={() => {
+            setCurrent({});
             setBindDeviceVisible(false);
           }}
           onOk={() => {
+            setCurrent({});
             setBindDeviceVisible(false);
             actionRef.current?.reload();
           }}

src/pages/iot-card/CardManagement/service.ts

@@ -6,6 +6,8 @@ import SystemConst from '@/utils/const';
 const basePath = `/${SystemConst.API_BASE}`;
 
 class Service extends BaseService<CardManagement> {
+  add = (data: any) => this.PATCH(`${this.uri}`, data);
+
   queryById = (id: string) => request(`${this.uri}/${id}`, { method: 'GET' });
 
   queryDeviceList = (data: any) =>

src/pages/iot-card/Dashboard/index.less

@@ -1,5 +1,6 @@
 .rankingList {
   padding: 0;
+  overflow-y: auto;
   list-style: none;
 }
 
@@ -14,26 +15,46 @@
 .rankItem {
   display: flex;
   justify-content: space-between;
-  padding: 16px 0;
+  min-width: 0;
+  padding: 12px 0;
 }
 
 .number {
-  padding: 4px;
+  flex: 0 0 24px;
+  height: 24px;
   color: #fff;
+  font-weight: bold;
+  line-height: 24px;
+  text-align: center;
   background-color: #d1d1d1;
+}
+
+.cardNum {
+  flex: 0 0 100px;
+  margin-left: 16px;
+}
+
+.progress {
+  flex: 1 1 auto;
+  margin: 0 8px;
+}
 
-  :nth-child(1) {
-    color: #e50012;
-    background-color: rgba(#e50012, 0.5);
-  }
+.total {
+  flex: 0 0 50px;
+  color: #999;
+}
 
-  :nth-child(2) {
-    color: #fba500;
-    background-color: rgba(#fba500, 0.5);
-  }
+.number-item-1 {
+  color: #e50012;
+  background-color: rgba(#e50012, 0.1);
+}
+
+.number-item-2 {
+  color: #fba500;
+  background-color: rgba(#fba500, 0.1);
+}
 
-  :nth-child(3) {
-    color: #597ef7;
-    background-color: rgba(#597ef7, 0.5);
-  }
+.number-item-3 {
+  color: #597ef7;
+  background-color: rgba(#597ef7, 0.1);
 }

src/pages/iot-card/Dashboard/index.tsx

@@ -7,6 +7,7 @@ import { PageContainer } from '@ant-design/pro-layout';
 import { useEffect, useRef, useState } from 'react';
 import { service } from '@/pages/iot-card/CardManagement';
 import type { EChartsOption } from 'echarts';
+import classNames from 'classnames';
 
 const DefaultEchartsOptions: any = {
   yAxis: {
@@ -34,7 +35,7 @@ const Dashboard = () => {
   const [dayTotal, setDayTotal] = useState(0);
   const [monthTotal, setMonthTotal] = useState(0);
   const [yearTotal, setYearTotal] = useState(0);
-  const [topList, setTopList] = useState([]);
+  const [topList, setTopList] = useState<any[]>([]);
   const [topTotal, setTotal] = useState(0);
   const echartsRef = useRef<any>();
 
@@ -243,6 +244,14 @@ const Dashboard = () => {
           const arr = resp.result.slice(0, 10).sort((a: any, b: any) => b.value - a.value);
           setTotal(arr.length ? arr[0].value : 0);
           setTopList(arr);
+          // const testArr = new Array(10).fill(1).map((item, index) => {
+          //   return {
+          //     cardNum: '123123123123' + index,
+          //     value: 50 + index
+          //   }
+          // })
+          // setTotal(60)
+          // setTopList(testArr as any[]);
         }
       });
   };
@@ -318,7 +327,7 @@ const Dashboard = () => {
             />
           </Card>
         </Col>
-        <Col flex={'480px'}>
+        <Col flex={'520px'}>
           <Card>
             <div className={styles.topName} style={{ height: 50 }}>
               <span>流量使用TOP10</span>
@@ -342,10 +351,19 @@ const Dashboard = () => {
                 topList.map((item: any, index) => {
                   return (
                     <div className={styles.rankItem} key={item.cardNum}>
-                      <div className={styles.number}>{index + 1}</div>
-                      <div>{item.cardNum}</div>
-                      <div>
-                        <Progress strokeLinecap="butt" percent={(item.value / topTotal) * 100} />
+                      <div
+                        className={classNames(styles.number, styles[`number-item-${index + 1}`])}
+                      >
+                        {index + 1}
+                      </div>
+                      <div className={styles.cardNum}>{item.cardNum}</div>
+                      <div className={styles.progress}>
+                        <Progress
+                          strokeColor={'#ADC6FF'}
+                          trailColor={'#E0E4E8'}
+                          strokeLinecap="butt"
+                          percent={Math.ceil((item.value / topTotal) * 100)}
+                        />
                       </div>
                       <div className={styles.total}>{item?.value?.toFixed(2)} M</div>
                     </div>

src/pages/link/Type/Detail/index.tsx

@@ -875,12 +875,11 @@ const Save = observer(() => {
             'x-component': 'Radio.Group',
             required: true,
             default: true,
-            enum: isNoCommunity
-              ? [
-                  { label: '共享配置', value: true },
-                  { label: '独立配置', value: false },
-                ]
-              : [{ label: '共享配置', value: true }],
+            'x-hidden': !isNoCommunity,
+            enum: [
+              { label: '共享配置', value: true },
+              { label: '独立配置', value: false },
+            ],
             'x-component-props': {
               buttonStyle: 'solid',
               optionType: 'button',