Lind преди 3 години
родител
ревизия
e1492a93ea

+ 21 - 21
src/pages/device/Instance/Detail/index.tsx

@@ -5,7 +5,7 @@ import { Badge, Button, Card, Descriptions, Divider, message, Tooltip } from 'an
 import { useEffect, useState } from 'react';
 import { observer } from '@formily/react';
 import Log from '@/pages/device/Instance/Detail/Log';
-import Alarm from '@/pages/device/components/Alarm';
+// import Alarm from '@/pages/device/components/Alarm';
 import Info from '@/pages/device/Instance/Detail/Info';
 import Functions from '@/pages/device/Instance/Detail/Functions';
 import Running from '@/pages/device/Instance/Detail/Running';
@@ -113,26 +113,26 @@ const InstanceDetail = observer(() => {
       tab: '子设备',
       component: <ChildDevice />,
     },
-    {
-      key: 'alarm',
-      tab: intl.formatMessage({
-        id: 'pages.device.instanceDetail.alarm',
-        defaultMessage: '告警设置',
-      }),
-      component: (
-        <Card>
-          <Alarm type="device" />
-        </Card>
-      ),
-    },
-    {
-      key: 'visualization',
-      tab: intl.formatMessage({
-        id: 'pages.device.instanceDetail.visualization',
-        defaultMessage: '可视化',
-      }),
-      component: <div>开发中...</div>,
-    },
+    // {
+    //   key: 'alarm',
+    //   tab: intl.formatMessage({
+    //     id: 'pages.device.instanceDetail.alarm',
+    //     defaultMessage: '告警设置',
+    //   }),
+    //   component: (
+    //     <Card>
+    //       <Alarm type="device" />
+    //     </Card>
+    //   ),
+    // },
+    // {
+    //   key: 'visualization',
+    //   tab: intl.formatMessage({
+    //     id: 'pages.device.instanceDetail.visualization',
+    //     defaultMessage: '可视化',
+    //   }),
+    //   component: <div>开发中...</div>,
+    // },
   ];
 
   useEffect(() => {

+ 48 - 27
src/pages/device/Product/Detail/Access/AccessConfig/index.tsx

@@ -48,6 +48,25 @@ const AccessConfig = (props: Props) => {
       title: '名称',
       dataIndex: 'name',
     },
+    {
+      title: '状态',
+      dataIndex: 'state',
+      valueType: 'select',
+      valueEnum: {
+        disabled: {
+          text: '已停止',
+          status: 'disabled',
+        },
+        enabled: {
+          text: '已启动',
+          status: 'enabled',
+        },
+      },
+    },
+    {
+      title: '说明',
+      dataIndex: 'description',
+    },
   ];
 
   useEffect(() => {
@@ -89,36 +108,38 @@ const AccessConfig = (props: Props) => {
         }
       }}
     >
-      <SearchComponent
-        field={columns}
-        pattern={'simple'}
-        onSearch={(data: any) => {
-          const dt = {
-            pageSize: 4,
-            terms: [...data.terms],
-          };
-          handleSearch(dt);
-        }}
-        onReset={() => {
-          handleSearch({ pageSize: 4 });
-        }}
-      />
-      <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-        <Button
-          type="primary"
-          onClick={() => {
-            const tab: any = window.open(`${origin}/#/link/AccessConfig/Detail`);
-            tab!.onTabSaveSuccess = (value: any) => {
-              if (value.status === 200) {
-                handleSearch(param);
-              }
+      <div className={styles.search}>
+        <SearchComponent
+          field={columns}
+          pattern={'simple'}
+          onSearch={(data: any) => {
+            const dt = {
+              pageSize: 4,
+              terms: [...data.terms],
             };
+            handleSearch(dt);
+          }}
+          onReset={() => {
+            handleSearch({ pageSize: 4 });
           }}
-        >
-          新增
-        </Button>
+        />
+        <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
+          <Button
+            type="primary"
+            onClick={() => {
+              const tab: any = window.open(`${origin}/#/link/AccessConfig/Detail`);
+              tab!.onTabSaveSuccess = (value: any) => {
+                if (value.status === 200) {
+                  handleSearch(param);
+                }
+              };
+            }}
+          >
+            新增
+          </Button>
+        </div>
       </div>
-      <Row gutter={[16, 16]} style={{ marginTop: 10 }}>
+      <Row gutter={[16, 16]}>
         {dataSource.data.map((item: any) => (
           <Col key={item.name} span={12}>
             <Card

+ 22 - 0
src/pages/device/Product/Detail/Access/index.less

@@ -89,3 +89,25 @@
     content: '|';
   }
 }
+
+.search {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 24px;
+
+  :global {
+    .ant-card {
+      margin-bottom: 0 !important;
+      border: none !important;
+    }
+
+    .ant-formily-item-feedback-layout-loose {
+      margin-bottom: 0 !important;
+    }
+
+    .ant-card-body {
+      padding: 24px !important;
+    }
+  }
+}

+ 39 - 28
src/pages/device/Product/Detail/Access/index.tsx

@@ -54,6 +54,7 @@ const Access = () => {
       dataIndex: 'group',
       key: 'group',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -61,16 +62,11 @@ const Access = () => {
       ),
     },
     {
-      title: 'qos',
-      dataIndex: 'qos',
-      key: 'qos',
-      ellipsis: true,
-    },
-    {
-      title: '地址',
-      dataIndex: 'address',
-      key: 'address',
+      title: 'topic',
+      dataIndex: 'topic',
+      key: 'topic',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -78,14 +74,15 @@ const Access = () => {
       ),
     },
     {
-      title: 'topic',
-      dataIndex: 'topic',
-      key: 'topic',
+      title: '上下行',
+      dataIndex: 'stream',
+      key: 'stream',
       ellipsis: true,
-      render: (text: any) => (
-        <Tooltip placement="top" title={text}>
-          {text}
-        </Tooltip>
+      align: 'center',
+      render: (text: any, record: any) => (
+        <span>
+          上行: {String(record?.upstream)}, 下行: {String(record?.downstream)}
+        </span>
       ),
     },
     {
@@ -93,6 +90,7 @@ const Access = () => {
       dataIndex: 'description',
       key: 'description',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -103,10 +101,11 @@ const Access = () => {
 
   const columnsHTTP: any[] = [
     {
-      title: '地址',
-      dataIndex: 'address',
-      key: 'address',
+      title: '分组',
+      dataIndex: 'group',
+      key: 'group',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -114,10 +113,11 @@ const Access = () => {
       ),
     },
     {
-      title: '分组',
-      dataIndex: 'group',
-      key: 'group',
+      title: '地址',
+      dataIndex: 'address',
+      key: 'address',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -129,6 +129,7 @@ const Access = () => {
       dataIndex: 'example',
       key: 'example',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -140,6 +141,7 @@ const Access = () => {
       dataIndex: 'description',
       key: 'description',
       ellipsis: true,
+      align: 'center',
       render: (text: any) => (
         <Tooltip placement="top" title={text}>
           {text}
@@ -205,13 +207,23 @@ const Access = () => {
             <Descriptions.Item label="接入方式">
               {providers.find((i) => i.id === access?.provider)?.name || ''}
             </Descriptions.Item>
-            <Descriptions.Item>
-              {providers.find((i) => i.id === access?.provider)?.description || ''}
-            </Descriptions.Item>
+            {providers.find((i) => i.id === access?.provider)?.description && (
+              <Descriptions.Item label="">
+                <span style={{ color: 'rgba(0,0,0,0.55)' }}>
+                  {providers.find((i) => i.id === access?.provider)?.description || ''}
+                </span>
+              </Descriptions.Item>
+            )}
             <Descriptions.Item label="消息协议">
               {access?.protocolDetail?.name || ''}
             </Descriptions.Item>
-            <Descriptions.Item>{access?.protocolDetail?.description || ''}</Descriptions.Item>
+            {access?.protocolDetail?.description && (
+              <Descriptions.Item label="">
+                <span style={{ color: 'rgba(0,0,0,0.55)' }}>
+                  {access?.protocolDetail?.description || ''}
+                </span>
+              </Descriptions.Item>
+            )}
             <Descriptions.Item label="网络组件">
               {(networkList.find((i) => i.id === access?.channelId)?.addresses || []).map(
                 (item: any) => (
@@ -228,12 +240,11 @@ const Access = () => {
           </Descriptions>
           {config?.routes && config?.routes?.length > 0 && (
             <div>
-              <div>路由信息:</div>
               <Table
                 dataSource={config?.routes || []}
                 columns={config.id === 'MQTT' ? columnsMQTT : columnsHTTP}
                 pagination={false}
-                scroll={{ x: 500 }}
+                scroll={{ y: 240 }}
               />
             </div>
           )}

+ 3 - 3
src/pages/link/AccessConfig/Detail/Access/index.less

@@ -19,7 +19,7 @@
 }
 
 .title {
-  font-weight: 600;
+  font-weight: 800;
 }
 
 .desc {
@@ -35,12 +35,12 @@
 
 .cardContent {
   display: flex;
-  margin-top: 10px;
+  flex-direction: column;
+  margin-top: 5px;
   color: rgba(0, 0, 0, 0.55);
 
   .item {
     width: 100%;
-    margin: 5px 0;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;

+ 107 - 89
src/pages/link/AccessConfig/Detail/Access/index.tsx

@@ -168,16 +168,9 @@ const Access = (props: Props) => {
       ),
     },
     {
-      title: 'qos',
-      dataIndex: 'qos',
-      key: 'qos',
-      ellipsis: true,
-      align: 'center',
-    },
-    {
-      title: '地址',
-      dataIndex: 'address',
-      key: 'address',
+      title: 'topic',
+      dataIndex: 'topic',
+      key: 'topic',
       ellipsis: true,
       align: 'center',
       render: (text: any) => (
@@ -187,15 +180,15 @@ const Access = (props: Props) => {
       ),
     },
     {
-      title: 'topic',
-      dataIndex: 'topic',
-      key: 'topic',
+      title: '上下行',
+      dataIndex: 'stream',
+      key: 'stream',
       ellipsis: true,
       align: 'center',
-      render: (text: any) => (
-        <Tooltip placement="top" title={text}>
-          {text}
-        </Tooltip>
+      render: (text: any, record: any) => (
+        <span>
+          上行: {String(record?.upstream)}, 下行: {String(record?.downstream)}
+        </span>
       ),
     },
     {
@@ -314,13 +307,23 @@ const Access = (props: Props) => {
                     >
                       <div className={styles.title}>{item.name}</div>
                       <div className={styles.cardContent}>
-                        <div style={{ width: '100%', height: '50px' }}>
+                        <div
+                          style={{
+                            width: '100%',
+                            height: '40px',
+                            display: 'flex',
+                            flexDirection: 'column',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                          }}
+                        >
                           {item.addresses.slice(0, 2).map((i: any) => (
                             <div className={styles.item} key={i.address}>
                               <Badge color={i.health === -1 ? 'red' : 'green'} text={i.address} />
                             </div>
                           ))}
                         </div>
+                        <div className={styles.desc}>{item?.description || ''}</div>
                       </div>
                     </Card>
                   </Col>
@@ -330,7 +333,7 @@ const Access = (props: Props) => {
               <Empty
                 description={
                   <span>
-                    暂无数据{' '}
+                    暂无数据
                     <a
                       onClick={() => {
                         const tab: any = window.open(`${origin}/#/link/Type/Save/:id`);
@@ -400,8 +403,10 @@ const Access = (props: Props) => {
                         setProcotolCurrent(item.id);
                       }}
                     >
-                      <div className={styles.title}>{item.name}</div>
-                      <div className={styles.desc}>{item.description}</div>
+                      <div style={{ height: '45px' }}>
+                        <div className={styles.title}>{item.name}</div>
+                        <div className={styles.desc}>{item.description}</div>
+                      </div>
                     </Card>
                   </Col>
                 ))}
@@ -446,6 +451,68 @@ const Access = (props: Props) => {
                   <Input.TextArea showCount maxLength={200} />
                 </Form.Item>
               </Form>
+              <div className={styles.action}>
+                <Button style={{ margin: '0 8px' }} onClick={() => prev()}>
+                  上一步
+                </Button>
+                <Button
+                  type="primary"
+                  onClick={async () => {
+                    try {
+                      const values = await form.validateFields();
+                      // 编辑还是保存
+                      if (!params.get('id')) {
+                        service
+                          .save({
+                            name: values.name,
+                            description: values.description,
+                            provider: props.data.id,
+                            protocol: procotolCurrent,
+                            transport: ProcotoleMapping.get(props.data.id),
+                            channel: 'network', // 网络组件
+                            channelId: networkCurrent,
+                          })
+                          .then((resp: any) => {
+                            if (resp.status === 200) {
+                              message.success('操作成功!');
+                              history.goBack();
+                              if ((window as any).onTabSaveSuccess) {
+                                (window as any).onTabSaveSuccess(resp);
+                                setTimeout(() => window.close(), 300);
+                              }
+                            }
+                          });
+                      } else {
+                        service
+                          .update({
+                            id: access?.id,
+                            name: values.name,
+                            description: values.description,
+                            provider: access?.provider,
+                            protocol: procotolCurrent,
+                            transport: access?.transport,
+                            channel: 'network', // 网络组件
+                            channelId: networkCurrent,
+                          })
+                          .then((resp: any) => {
+                            if (resp.status === 200) {
+                              message.success('操作成功!');
+                              history.goBack();
+                              if ((window as any).onTabSaveSuccess) {
+                                (window as any).onTabSaveSuccess(resp);
+                                setTimeout(() => window.close(), 300);
+                              }
+                            }
+                          });
+                      }
+                    } catch (errorInfo) {
+                      console.error('Failed:', errorInfo);
+                    }
+                  }}
+                >
+                  保存
+                </Button>
+              </div>
             </div>
             <div className={styles.config}>
               <div className={styles.title}>配置概览</div>
@@ -453,16 +520,25 @@ const Access = (props: Props) => {
                 <Descriptions.Item label="接入方式">
                   {props.data?.name || providers.find((i) => i.id === access?.provider)?.name}
                 </Descriptions.Item>
-                <Descriptions.Item>
-                  {props.data?.description ||
-                    providers.find((i) => i.id === access?.provider)?.description}
-                </Descriptions.Item>
+                {(props.data?.description ||
+                  providers.find((i) => i.id === access?.provider)?.description) && (
+                  <Descriptions.Item>
+                    <span style={{ color: 'rgba(0,0,0,0.55)' }}>
+                      {props.data?.description ||
+                        providers.find((i) => i.id === access?.provider)?.description}
+                    </span>
+                  </Descriptions.Item>
+                )}
                 <Descriptions.Item label="消息协议">
                   {procotolList.find((i) => i.id === procotolCurrent)?.name || ''}
                 </Descriptions.Item>
-                <Descriptions.Item>
-                  {procotolList.find((i) => i.id === procotolCurrent)?.description || ''}
-                </Descriptions.Item>
+                {procotolList.find((i) => i.id === procotolCurrent)?.description && (
+                  <Descriptions.Item style={{ color: 'rgba(0,0,0,0.55)' }}>
+                    <span style={{ color: 'rgba(0,0,0,0.55)' }}>
+                      {procotolList.find((i) => i.id === procotolCurrent)?.description || ''}
+                    </span>
+                  </Descriptions.Item>
+                )}
                 <Descriptions.Item label="网络组件">
                   {(networkList.find((i) => i.id === networkCurrent)?.addresses || []).map(
                     (item: any) => (
@@ -479,12 +555,11 @@ const Access = (props: Props) => {
               </Descriptions>
               {config?.routes && config?.routes?.length > 0 && (
                 <div>
-                  <div>路由信息:</div>
                   <Table
                     dataSource={config?.routes || []}
                     columns={config.id === 'MQTT' ? columnsMQTT : columnsHTTP}
                     pagination={false}
-                    scroll={{ x: 500 }}
+                    scroll={{ y: 240 }}
                   />
                 </div>
               )}
@@ -520,73 +595,16 @@ const Access = (props: Props) => {
         </div>
         <div className={styles.content}>{renderSteps(current)}</div>
         <div className={styles.action}>
-          {current > 0 && (
+          {current === 1 && (
             <Button style={{ margin: '0 8px' }} onClick={() => prev()}>
               上一步
             </Button>
           )}
-          {current < steps.length - 1 && (
+          {(current === 0 || current === 1) && (
             <Button type="primary" onClick={() => next()}>
               下一步
             </Button>
           )}
-          {current === steps.length - 1 && (
-            <Button
-              type="primary"
-              onClick={async () => {
-                try {
-                  const values = await form.validateFields();
-                  // 编辑还是保存
-                  if (!params.get('id')) {
-                    const param = {
-                      name: values.name,
-                      description: values.description,
-                      provider: props.data.id,
-                      protocol: procotolCurrent,
-                      transport: ProcotoleMapping.get(props.data.id),
-                      channel: 'network', // 网络组件
-                      channelId: networkCurrent,
-                    };
-                    service.save(param).then((resp: any) => {
-                      if (resp.status === 200) {
-                        message.success('操作成功!');
-                        history.goBack();
-                        if ((window as any).onTabSaveSuccess) {
-                          (window as any).onTabSaveSuccess(resp);
-                          setTimeout(() => window.close(), 300);
-                        }
-                      }
-                    });
-                  } else {
-                    const param = {
-                      id: access?.id,
-                      name: values.name,
-                      description: values.description,
-                      provider: access?.provider,
-                      protocol: procotolCurrent,
-                      transport: access?.transport,
-                      channel: 'network', // 网络组件
-                      channelId: networkCurrent,
-                    };
-                    service.update(param).then((resp: any) => {
-                      if (resp.status === 200) {
-                        message.success('操作成功!');
-                        history.goBack();
-                        if ((window as any).onTabSaveSuccess) {
-                          (window as any).onTabSaveSuccess(resp);
-                          setTimeout(() => window.close(), 300);
-                        }
-                      }
-                    });
-                  }
-                } catch (errorInfo) {
-                  console.error('Failed:', errorInfo);
-                }
-              }}
-            >
-              保存
-            </Button>
-          )}
         </div>
       </div>
     </Card>

+ 23 - 2
src/pages/link/AccessConfig/index.tsx

@@ -20,6 +20,25 @@ const AccessConfig = () => {
       title: '名称',
       dataIndex: 'name',
     },
+    {
+      title: '状态',
+      dataIndex: 'state',
+      valueType: 'select',
+      valueEnum: {
+        disabled: {
+          text: '已停止',
+          status: 'disabled',
+        },
+        enabled: {
+          text: '已启动',
+          status: 'enabled',
+        },
+      },
+    },
+    {
+      title: '说明',
+      dataIndex: 'description',
+    },
   ];
 
   const [dataSource, setDataSource] = useState<any>({
@@ -154,7 +173,7 @@ const AccessConfig = () => {
                           </a>
                         </div>
                       </div>
-                      <div className={styles.desc}>这里是接入方式的解释说明</div>
+                      <div className={styles.desc}>{item.description}</div>
                     </div>
                     <div className={styles.container}>
                       <div className={styles.server}>
@@ -169,7 +188,9 @@ const AccessConfig = () => {
                       </div>
                       <div className={styles.procotol}>
                         <div className={styles.title}>{item?.protocolDetail?.name}</div>
-                        <p style={{ color: 'rgba(0, 0, 0, .55)' }}>{item.description}</p>
+                        <p style={{ color: 'rgba(0, 0, 0, .55)' }}>
+                          {item.protocolDetail?.description}
+                        </p>
                       </div>
                     </div>
                   </div>

+ 4 - 5
src/pages/link/Protocol/index.tsx

@@ -31,18 +31,15 @@ const Protocol = () => {
 
   const columns: ProColumns<ProtocolItem>[] = [
     {
-      dataIndex: 'index',
-      valueType: 'indexBorder',
-      width: 48,
-    },
-    {
       dataIndex: 'id',
       title: 'ID',
       sorter: true,
+      ellipsis: true,
       defaultSortOrder: 'ascend',
     },
     {
       dataIndex: 'name',
+      ellipsis: true,
       title: intl.formatMessage({
         id: 'pages.table.name',
         defaultMessage: '名称',
@@ -51,6 +48,7 @@ const Protocol = () => {
     {
       dataIndex: 'type',
       title: '类型',
+      ellipsis: true,
     },
     {
       dataIndex: 'state',
@@ -61,6 +59,7 @@ const Protocol = () => {
     },
     {
       dataIndex: 'description',
+      ellipsis: true,
       title: '说明',
     },
     {

+ 1 - 1
src/pages/system/Permission/index.tsx

@@ -438,7 +438,7 @@ const Permission: React.FC = observer(() => {
         actionRef={actionRef}
         columns={columns}
         service={service}
-        defaultParams={{ sorts: [{ name: 'modifyTime', order: 'desc' }] }}
+        defaultParams={{ sorts: [{ name: 'id', order: 'desc' }] }}
         title={intl.formatMessage({
           id: 'pages.system.permission',
           defaultMessage: '',

+ 1 - 1
src/pages/system/Role/Edit/Permission/index.tsx

@@ -95,7 +95,7 @@ const Permission = () => {
       </Card>
       <Card style={{ marginTop: 20 }}>
         <div className={styles.title}>权限分配</div>
-        <Form.Item label="权限" name="permission" rules={[{ required: true }]}>
+        <Form.Item name="permission" rules={[{ required: true }]}>
           <Allocate />
         </Form.Item>
         <Form.Item>

+ 0 - 6
src/pages/system/Role/Edit/UserManage/BindUser.tsx

@@ -22,17 +22,11 @@ const BindUser = (props: Props) => {
 
   const columns: ProColumns<UserItem>[] = [
     {
-      dataIndex: 'index',
-      valueType: 'indexBorder',
-      width: 48,
-    },
-    {
       title: intl.formatMessage({
         id: 'pages.table.name',
         defaultMessage: '名称',
       }),
       dataIndex: 'name',
-      // copyable: true,
       ellipsis: true,
       tip: intl.formatMessage({
         id: 'pages.system.userName.tips',

+ 0 - 5
src/pages/system/Role/Edit/UserManage/index.tsx

@@ -30,11 +30,6 @@ const UserManage = () => {
   };
   const columns: ProColumns<UserItem>[] = [
     {
-      dataIndex: 'index',
-      valueType: 'indexBorder',
-      width: 48,
-    },
-    {
       title: '姓名',
       dataIndex: 'name',
       ellipsis: true,

+ 1 - 0
src/pages/system/Role/index.tsx

@@ -69,6 +69,7 @@ const Role: React.FC = observer(() => {
         id: 'pages.table.describe',
         defaultMessage: '描述',
       }),
+      ellipsis: true,
       dataIndex: 'description',
       filters: true,
       onFilter: true,