lind 3 лет назад
Родитель
Сommit
014297cc43
32 измененных файлов с 189 добавлено и 106 удалено
  1. BIN
      public/images/access/background.png
  2. BIN
      public/images/access/child-device.png
  3. BIN
      public/images/access/coap.png
  4. BIN
      public/images/access/ctwing.png
  5. BIN
      public/images/access/gb28181.png
  6. BIN
      public/images/access/http.png
  7. BIN
      public/images/access/modbus.png
  8. BIN
      public/images/access/mqtt-broke.png
  9. BIN
      public/images/access/mqtt.png
  10. BIN
      public/images/access/onenet.png
  11. BIN
      public/images/access/opc-ua.png
  12. BIN
      public/images/access/tcp.png
  13. BIN
      public/images/access/udp.png
  14. BIN
      public/images/access/video-device.png
  15. BIN
      public/images/access/websocket.png
  16. BIN
      public/images/northbound/aliyun3.png
  17. BIN
      public/images/northbound/aliyun4.png
  18. 3 2
      src/pages/Log/Access/index.tsx
  19. 1 1
      src/pages/Log/System/index.tsx
  20. 29 27
      src/pages/Northbound/AliCloud/Detail/index.less
  21. 11 2
      src/pages/Northbound/AliCloud/Detail/index.tsx
  22. 13 0
      src/pages/device/Instance/Detail/index.tsx
  23. 2 3
      src/pages/device/Instance/Import/index.tsx
  24. 18 10
      src/pages/device/Product/Detail/index.tsx
  25. 14 11
      src/pages/home/components/ProductChoose.tsx
  26. 2 0
      src/pages/link/AccessConfig/Detail/Access/index.tsx
  27. 4 0
      src/pages/link/AccessConfig/Detail/Channel/index.tsx
  28. 61 27
      src/pages/link/AccessConfig/Detail/Provider/index.less
  29. 26 20
      src/pages/link/AccessConfig/Detail/Provider/index.tsx
  30. 1 1
      src/pages/media/Stream/index.tsx
  31. 3 1
      src/pages/notice/Config/BindUser/index.tsx
  32. 1 1
      src/pages/system/DataSource/Management/EditTable.tsx

BIN
public/images/access/background.png


BIN
public/images/access/child-device.png


BIN
public/images/access/coap.png


BIN
public/images/access/ctwing.png


BIN
public/images/access/gb28181.png


BIN
public/images/access/http.png


BIN
public/images/access/modbus.png


BIN
public/images/access/mqtt-broke.png


BIN
public/images/access/mqtt.png


BIN
public/images/access/onenet.png


BIN
public/images/access/opc-ua.png


BIN
public/images/access/tcp.png


BIN
public/images/access/udp.png


BIN
public/images/access/video-device.png


BIN
public/images/access/websocket.png


BIN
public/images/northbound/aliyun3.png


BIN
public/images/northbound/aliyun4.png


+ 3 - 2
src/pages/Log/Access/index.tsx

@@ -92,8 +92,9 @@ const Access = () => {
         id: 'pages.log.access.requestUser',
         defaultMessage: '请求用户',
       }),
-      dataIndex: 'username',
-      render: (text, record: any) => <Tag color="geekblue">{record?.context?.username || ''}</Tag>,
+      dataIndex: 'context.username',
+      render: (text, record: any) =>
+        record?.context?.username ? <Tag color="geekblue">{record?.context?.username}</Tag> : '',
     },
     {
       title: intl.formatMessage({

+ 1 - 1
src/pages/Log/System/index.tsx

@@ -68,7 +68,7 @@ const System = () => {
         id: 'pages.log.system.serviceName',
         defaultMessage: '服务名',
       }),
-      dataIndex: 'server',
+      dataIndex: 'context.server',
       width: 150,
       ellipsis: true,
       render: (text, record) => record?.context?.server || '--',

+ 29 - 27
src/pages/Northbound/AliCloud/Detail/index.less

@@ -1,35 +1,37 @@
-.doc {
-  height: 750px;
-  padding: 24px;
-  overflow-y: auto;
-  color: rgba(#000, 0.8);
-  font-size: 14px;
-  background-color: #fafafa;
+.aliyun {
+  .doc {
+    height: 1000px;
+    padding: 24px;
+    overflow-y: auto;
+    color: rgba(#000, 0.8);
+    font-size: 14px;
+    background-color: #fafafa;
 
-  .url {
-    padding: 8px 16px;
-    color: #2f54eb;
-    background-color: rgba(#a7bdf7, 0.2);
-  }
+    .url {
+      padding: 8px 16px;
+      color: #2f54eb;
+      background-color: rgba(#a7bdf7, 0.2);
+    }
 
-  h1 {
-    margin: 16px 0;
-    color: rgba(#000, 0.85);
-    font-weight: bold;
-    font-size: 14px;
+    h1 {
+      margin: 16px 0;
+      color: rgba(#000, 0.85);
+      font-weight: bold;
+      font-size: 14px;
 
-    &:first-child {
-      margin-top: 0;
+      &:first-child {
+        margin-top: 0;
+      }
     }
-  }
 
-  h2 {
-    margin: 6px 0;
-    color: rgba(0, 0, 0, 0.8);
-    font-size: 14px;
-  }
+    h2 {
+      margin: 6px 0;
+      color: rgba(0, 0, 0, 0.8);
+      font-size: 14px;
+    }
 
-  .image {
-    margin: 16px 0;
+    .image {
+      margin: 16px 0;
+    }
   }
 }

+ 11 - 2
src/pages/Northbound/AliCloud/Detail/index.tsx

@@ -441,7 +441,7 @@ const Detail = observer(() => {
               </FormButtonGroup.Sticky>
             </Form>
           </Col>
-          <Col span={10}>
+          <Col span={10} className="aliyun">
             <div className="doc">
               <div className="url">
                 阿里云物联网平台:
@@ -467,6 +467,10 @@ const Detail = observer(() => {
                 <div>
                   阿里云内部给每台机器设置的唯一编号。请根据购买的阿里云服务器地址进行选择。
                 </div>
+                <div>获取路径:“阿里云物联网平台”--“服务地址”</div>
+                <div className={'image'}>
+                  <Image width="100%" src={require('/public/images/northbound/aliyun3.png')} />
+                </div>
                 <h2> 2、AccesskeyID/Secret</h2>
                 <div>
                   用于程序通知方式调用云服务费API的用户标识和秘钥获取路径:“阿里云管理控制台”--“用户头像”--“”--“AccessKey管理”--“查看”
@@ -479,7 +483,12 @@ const Detail = observer(() => {
                   物联网平台对于阿里云物联网平台,是一个网关设备,需要映射到阿里云物联网平台的具体产品
                 </div>
                 <h2> 4. 产品映射</h2>
-                <div>将阿里云物联网平台中的产品实例与物联网平台的产品实例进行关联</div>
+                <div>
+                  将阿里云物联网平台中的产品实例与物联网平台的产品实例进行关联。关联后需要进入该产品下的每一个设备的实例信息页,填入对应的阿里云物联网平台设备的DeviceName、DeviceSecret进行一对一绑定。
+                </div>
+                <div className={'image'}>
+                  <Image width="100%" src={require('/public/images/northbound/aliyun4.png')} />
+                </div>
               </div>
             </div>
           </Col>

+ 13 - 0
src/pages/device/Instance/Detail/index.tsx

@@ -153,6 +153,16 @@ const InstanceDetail = observer(() => {
       component: <MetadataMap type="device" />,
     },
   ];
+
+  // const pList = [
+  //   'websocket-server',
+  //   'http-server-gateway',
+  //   'udp-device-gateway',
+  //   'coap-server-gateway',
+  //   'mqtt-client-gateway',
+  //   'mqtt-server-gateway',
+  //   'tcp-server-gateway',
+  // ];
   const [list, setList] =
     useState<{ key: string; tab: string | ReactNode; component: ReactNode }[]>(baseList);
 
@@ -160,6 +170,9 @@ const InstanceDetail = observer(() => {
     service.detail(id).then((response) => {
       InstanceModel.detail = response?.result;
       const datalist = [...baseList];
+      // if(InstanceModel.detail){
+
+      // }
       if (response.result.protocol === 'modbus-tcp') {
         datalist.push({
           key: 'modbus',

+ 2 - 3
src/pages/device/Instance/Import/index.tsx

@@ -106,13 +106,12 @@ const NormalUpload = (props: any) => {
       <Space>
         <Upload
           action={`/${SystemConst.API_BASE}/file/static`}
-          accept={`.${props?.fileType?.fileType || 'xlsx'}`}
+          accept={'.xlsx, .csv'}
           headers={{
             'X-Access-Token': Token.get(),
           }}
           onChange={async (info) => {
             if (info.file.status === 'done') {
-              onlyMessage('上传成功');
               const resp: any = info.file.response || { result: '' };
               await submitData(resp?.result || '');
             }
@@ -277,7 +276,7 @@ const Import = (props: Props) => {
         </Button>,
       ]}
     >
-      <div style={{ marginTop: '20px' }}>
+      <div style={{ marginTop: '10px' }}>
         <FormProvider form={form}>
           <SchemaField schema={schema} />
         </FormProvider>

+ 18 - 10
src/pages/device/Product/Detail/index.tsx

@@ -144,16 +144,6 @@ const ProductDetail = observer(() => {
         const metadata: DeviceMetadata = JSON.parse(data.metadata);
         MetadataAction.insert(metadata);
       }
-      if (data?.accessProvider && pList.includes(data?.accessProvider)) {
-        setList([
-          ...initList,
-          {
-            key: 'metadata-map',
-            tab: '物模型映射',
-            component: <MetadataMap type="product" />,
-          },
-        ]);
-      }
       service.instanceCount(encodeQuery({ terms: { productId: param?.id } })).then((res: any) => {
         if (res.status === 200) {
           productModel.current = { ...data, count: res.result };
@@ -163,6 +153,24 @@ const ProductDetail = observer(() => {
   };
 
   useEffect(() => {
+    if (
+      productModel.current?.accessProvider &&
+      pList.includes(productModel.current?.accessProvider)
+    ) {
+      setList([
+        ...initList,
+        {
+          key: 'metadata-map',
+          tab: '物模型映射',
+          component: <MetadataMap type="product" />,
+        },
+      ]);
+    } else {
+      setList([...initList]);
+    }
+  }, [productModel.current]);
+
+  useEffect(() => {
     const queryParam = new URLSearchParams(location.search);
     const _mode = queryParam.get('type');
     if (_mode) {

+ 14 - 11
src/pages/home/components/ProductChoose.tsx

@@ -5,7 +5,6 @@ import { Button, message, Modal } from 'antd';
 import 'antd/lib/tree-select/style/index.less';
 import { useEffect, useState } from 'react';
 import { service } from '@/pages/device/Instance';
-import encodeQuery from '@/utils/encodeQuery';
 import { PermissionButton } from '@/components';
 import useHistory from '@/hooks/route/useHistory';
 import { getMenuPathByParams, MENUS_CODE } from '@/utils/menu';
@@ -29,16 +28,20 @@ const ProductChoose = (props: Props) => {
   });
 
   useEffect(() => {
-    service.getProductList(encodeQuery({ paging: false, terms: { state: 1 } })).then((resp) => {
-      if (resp.status === 200) {
-        const list = resp.result.map((item: { name: any; id: any }) => ({
-          label: item.name,
-          value: item.id,
-        }));
-        setProductList(list);
-      }
-    });
-  }, []);
+    if (visible) {
+      service.getProductList().then((resp) => {
+        if (resp.status === 200) {
+          const list = resp.result
+            .filter((i: any) => !i?.accessId)
+            .map((item: { name: any; id: any }) => ({
+              label: item.name,
+              value: item.id,
+            }));
+          setProductList(list);
+        }
+      });
+    }
+  }, [visible]);
 
   const form = createForm({});
 

+ 2 - 0
src/pages/link/AccessConfig/Detail/Access/index.tsx

@@ -253,6 +253,7 @@ const Access = (props: Props) => {
               <Input.Search
                 key={'network'}
                 placeholder="请输入名称"
+                allowClear
                 onSearch={(value: string) => {
                   queryNetworkList(
                     props.provider?.id,
@@ -392,6 +393,7 @@ const Access = (props: Props) => {
             <div className={styles.search}>
               <Input.Search
                 key={'protocol'}
+                allowClear
                 placeholder="请输入名称"
                 onSearch={(value: string) => {
                   queryProcotolList(

+ 4 - 0
src/pages/link/AccessConfig/Detail/Channel/index.tsx

@@ -90,6 +90,10 @@ const Media = (props: Props) => {
                       if (resp.status === 200) {
                         onlyMessage('操作成功!');
                         history.goBack();
+                        if ((window as any).onTabSaveSuccess) {
+                          (window as any).onTabSaveSuccess(resp);
+                          setTimeout(() => window.close(), 300);
+                        }
                       }
                     } catch (errorInfo) {
                       console.error('Failed:', errorInfo);

+ 61 - 27
src/pages/link/AccessConfig/Detail/Provider/index.less

@@ -1,29 +1,63 @@
-.images {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 64px;
-  height: 64px;
-  color: white;
-  font-size: 12px;
-  text-align: center;
-  background: linear-gradient(
-    128.453709216706deg,
-    rgba(255, 255, 255, 1) 4%,
-    rgba(113, 187, 255, 1) 43%,
-    rgba(24, 144, 255, 1) 100%
-  );
-  border: 1px solid rgba(242, 242, 242, 1);
-  border-radius: 50%;
-}
-
-.desc {
+.provider {
+  position: relative;
   width: 100%;
-  margin-top: 10px;
-  overflow: hidden;
-  color: rgba(0, 0, 0, 0.55);
-  font-weight: 400;
-  font-size: 13px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
+  padding: 20px;
+  background: url('/images/access/background.png') no-repeat;
+  background-size: 100% 100%;
+  border: 1px solid #e6e6e6;
+
+  &::before {
+    position: absolute;
+    top: 0;
+    left: 40px;
+    display: block;
+    width: 15%;
+    min-width: 64px;
+    height: 2px;
+    background-image: url('/images/rectangle.png');
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    content: ' ';
+  }
+
+  &:hover {
+    box-shadow: 0 0 24px rgba(#000, 0.1);
+  }
+
+  .box {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+
+    .left {
+      display: flex;
+      width: calc(100% - 70px);
+
+      .images {
+        width: 64px;
+        height: 64px;
+
+        img {
+          width: 100%;
+        }
+      }
+
+      .context {
+        width: calc(100% - 84px);
+        margin: 10px;
+
+        .desc {
+          width: 100%;
+          margin-top: 10px;
+          overflow: hidden;
+          color: rgba(0, 0, 0, 0.55);
+          font-weight: 400;
+          font-size: 13px;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+      }
+    }
+  }
 }

+ 26 - 20
src/pages/link/AccessConfig/Detail/Provider/index.tsx

@@ -52,33 +52,39 @@ const Provider = (props: Props) => {
     ]);
   }, [props.data]);
 
+  const backMap = new Map();
+  backMap.set('mqtt-server-gateway', require('/public/images/access/mqtt.png'));
+  backMap.set('websocket-server', require('/public/images/access/websocket.png'));
+  backMap.set('modbus-tcp', require('/public/images/access/modbus.png'));
+  backMap.set('coap-server-gateway', require('/public/images/access/coap.png'));
+  backMap.set('tcp-server-gateway', require('/public/images/access/tcp.png'));
+  backMap.set('Ctwing', require('/public/images/access/ctwing.png'));
+  backMap.set('child-device', require('/public/images/access/child-device.png'));
+  backMap.set('opc-ua', require('/public/images/access/opc-ua.png'));
+  backMap.set('http-server-gateway', require('/public/images/access/http.png'));
+  backMap.set('fixed-media', require('/public/images/access/video-device.png'));
+  backMap.set('udp-device-gateway', require('/public/images/access/udp.png'));
+  backMap.set('OneNet', require('/public/images/access/onenet.png'));
+  backMap.set('gb28181-2016', require('/public/images/access/gb28181.png'));
+  backMap.set('mqtt-client-gateway', require('/public/images/access/mqtt-broke.png'));
+
   return (
     <div>
       {dataSource.map((i) => (
         <Card key={i.type} style={{ marginTop: 20 }}>
           <TitleComponent data={i.title} />
-          <Row gutter={[16, 16]}>
+          <Row gutter={[24, 24]}>
             {(i?.list || []).map((item: any) => (
               <Col key={item.name} span={12}>
-                <Card style={{ width: '100%' }} hoverable>
-                  <div
-                    style={{
-                      width: '100%',
-                      display: 'flex',
-                      alignItems: 'center',
-                      justifyContent: 'space-between',
-                    }}
-                  >
-                    <div
-                      style={{
-                        display: 'flex',
-                        width: 'calc(100% - 70px)',
-                      }}
-                    >
-                      <div className={styles.images}>{item.name}</div>
-                      <div style={{ margin: '10px', width: 'calc(100% - 84px)' }}>
+                <div className={styles.provider}>
+                  <div className={styles.box}>
+                    <div className={styles.left}>
+                      <div className={styles.images}>
+                        <img src={backMap.get(item.id)} />
+                      </div>
+                      <div className={styles.context}>
                         <div style={{ fontWeight: 600 }}>{item.name}</div>
-                        <div className={styles.desc}>{item?.description || '--'}</div>
+                        <div className={styles.desc}>{item?.description || ''}</div>
                       </div>
                     </div>
                     <div style={{ width: '70px' }}>
@@ -92,7 +98,7 @@ const Provider = (props: Props) => {
                       </Button>
                     </div>
                   </div>
-                </Card>
+                </div>
               </Col>
             ))}
           </Row>

+ 1 - 1
src/pages/media/Stream/index.tsx

@@ -26,7 +26,7 @@ const Stream = () => {
   const [param, setParam] = useState<any>({ pageSize: 10, terms: [] });
   const permissionCode = 'media/Stream';
   const { permission } = PermissionButton.usePermission(permissionCode);
-  const { minHeight } = useDomFullHeight(`.stream`, 36);
+  const { minHeight } = useDomFullHeight(`.stream`, 24);
 
   const columns: ProColumns<StreamItem>[] = [
     {

+ 3 - 1
src/pages/notice/Config/BindUser/index.tsx

@@ -60,6 +60,8 @@ const BindUser = (props: Props) => {
         'x-component': 'Select',
         'x-component-props': {
           placeholder: '请选择用户',
+          showSearch: true,
+          showArrow: true,
           filterOption: (input: string, option: any) =>
             option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0,
         },
@@ -76,7 +78,7 @@ const BindUser = (props: Props) => {
 
   return (
     <Modal
-      title="绑定用户 "
+      title="绑定用户"
       onCancel={() => {
         props.close();
       }}

+ 1 - 1
src/pages/system/DataSource/Management/EditTable.tsx

@@ -135,7 +135,7 @@ const EditTable = (props: Props) => {
                     // },
                     {
                       maximum: 99999,
-                      minimum: 1,
+                      minimum: 0,
                     },
                   ],
                   // required: true,