关系图

后台管理/README.md

@@ -1,9 +1,9 @@
 1.使用 yarn。 npm 有问题
 
-2.测试后端文档地址：https://sit-hefeibwg.4dage.com/api/doc.html#/home
+2.测试后端文档地址：
 
-3.测试堡垒机位置：227/data/data01/museum_anhui_hefei_data/backstage
+3.测试堡垒机位置：
 
-4：测试网址：https://sit-hefeibwg.4dage.com/backstage
+4：测试网址：
 
-5：蓝湖地址：https://lanhuapp.com/web/#/item/project/product?tid=de3e5e3e-a489-4b19-862a-7c87ce113467&pid=65b209e8-9735-44cd-8798-992b9563a332&versionId=ef745865-c833-41a2-9e77-b50118569828&docId=26572205-7bd5-4d14-aad3-d6a8ff89a4b0&docType=axure&pageId=ba7c1c63470f4a138636f0ce65b94fd7&image_id=26572205-7bd5-4d14-aad3-d6a8ff89a4b0&parentId=efc707ef-d2ef-4d76-a50a-3c719c0ace76
+5：蓝湖地址：https://lanhuapp.com/web/#/item/project/product?tid=de3e5e3e-a489-4b19-862a-7c87ce113467&pid=ad933c2c-f106-4495-8393-98df8a3fc079&image_id=d1e2fd0d-fa26-4494-a40f-b119a0d176ba&docId=d1e2fd0d-fa26-4494-a40f-b119a0d176ba&docType=axure&versionId=86983a0b-977f-4808-82c8-43d54f773074&pageId=f92c3957af454884b7a1e0da86b72bd7&share_type=quickShare&parentId=0fd8353a-1464-402c-be92-6ce802d4fceb

后台管理/package.json

@@ -17,6 +17,7 @@
     "braft-editor": "^2.3.9",
     "braft-utils": "^3.0.12",
     "dayjs": "^1.11.10",
+    "echarts": "^6.0.0",
     "js-base64": "^3.7.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

后台管理/src/components/LookDom/index.tsx

@@ -1,41 +1,35 @@
-/* eslint-disable jsx-a11y/iframe-has-title */
-import React from "react";
-import { CloseCircleOutlined } from "@ant-design/icons";
-import styles from "./index.module.scss";
-import { useSelector } from "react-redux";
-import store, { RootState } from "@/store";
-import { baseURL } from "@/utils/http";
+import React from 'react'
+import { CloseCircleOutlined } from '@ant-design/icons'
+import styles from './index.module.scss'
+import { useSelector } from 'react-redux'
+import store, { RootState } from '@/store'
+import { baseURL } from '@/utils/http'
 function LookDom() {
-  const { src, type, flag } = useSelector(
-    (state: RootState) => state.A0Layout.lookDom
-  );
+  const { src, type, flag } = useSelector((state: RootState) => state.A0Layout.lookDom)
   return (
-    <div
-      className={styles.LookDom}
-      style={src ? { opacity: 1, pointerEvents: "auto" } : {}}
-    >
+    <div className={styles.LookDom} style={src ? { opacity: 1, pointerEvents: 'auto' } : {}}>
       {src ? (
         <>
-          {type === "video" ? (
-            <div className="viedoBox">
+          {type === 'video' ? (
+            <div className='viedoBox'>
               <video autoPlay controls src={flag ? src : baseURL + src}></video>
             </div>
-          ) : type === "audio" ? (
-            <div className="audioBox">
+          ) : type === 'audio' ? (
+            <div className='audioBox'>
               <audio autoPlay controls src={flag ? src : baseURL + src}></audio>
             </div>
           ) : (
-            <div className="modelBox">
-              <iframe src={`model.html?m=${src}`}></iframe>
+            <div className='modelBox'>
+              <iframe src={`model.html?m=${src}`} title='model'></iframe>
             </div>
           )}
 
           <div
-            className="close"
+            className='close'
             onClick={() =>
               store.dispatch({
-                type: "layout/lookDom",
-                payload: { src: "", type: "", flag: false },
+                type: 'layout/lookDom',
+                payload: { src: '', type: '', flag: false }
               })
             }
           >
@@ -44,9 +38,9 @@ function LookDom() {
         </>
       ) : null}
     </div>
-  );
+  )
 }
 
-const MemoLookDom = React.memo(LookDom);
+const MemoLookDom = React.memo(LookDom)
 
-export default MemoLookDom;
+export default MemoLookDom

后台管理/src/index.tsx

@@ -22,7 +22,7 @@ root.render(
     locale={locale}
     theme={{
       token: {
-        colorPrimary: ' #8e0620'
+        colorPrimary: '#8e0620'
       }
     }}
   >

后台管理/src/pages/A1record/A1echarts/index.module.scss

@@ -0,0 +1,5 @@
+.A1echarts {
+  width: 100%;
+  height: 100%;
+  color: aqua;
+}

后台管理/src/pages/A1record/A1echarts/index.tsx

@@ -0,0 +1,159 @@
+import React, { useCallback, useEffect } from 'react'
+import styles from './index.module.scss'
+
+import * as echarts from 'echarts/core'
+import { TitleComponent, TooltipComponent } from 'echarts/components'
+import { GraphChart } from 'echarts/charts'
+import { CanvasRenderer } from 'echarts/renderers'
+
+echarts.use([TitleComponent, TooltipComponent, GraphChart, CanvasRenderer])
+
+function A1echarts() {
+  const initFu = useCallback(() => {
+    const dom: HTMLDivElement = document.querySelector('#A1echarts')!
+
+    const myChart = echarts.getInstanceByDom(dom) || echarts.init(dom)
+
+    const option = {
+      series: [
+        {
+          type: 'graph', // 图表类型为关系图
+          layout: 'force', // 使用力导向布局
+          emphasis: { focus: 'adjacency' }, // 高亮时显示相邻节点和边
+          force: {
+            repulsion: 1000, // 节点之间的斥力大小
+            edgeLength: 100 // 边的理想长度
+          },
+          symbolSize: 70, // 默认节点大小
+          roam: true, // 允许缩放和平移
+          // draggable: true, // 允许节点拖动（已注释）
+          edgeSymbol: ['arrow'], // 边的箭头样式
+          label: {
+            show: true, // 显示节点标签
+            position: 'inside', // 标签显示在节点内部
+            color: 'gold' // 标签默认颜色
+          },
+          edgeLabel: {
+            show: true, // 显示边标签
+            fontSize: 12, // 边标签字体大小
+            color: 'red', // 边标签颜色
+            formatter: '{c}', // 显示边的value值
+            rotate: 0 // 强制边标签文字水平显示（新增）
+          },
+          itemStyle: {
+            borderColor: '#04f2a7', // 节点边框颜色
+            borderWidth: 2, // 节点边框宽度
+            shadowBlur: 10, // 阴影模糊大小
+            shadowColor: '#04f2a7', // 阴影颜色
+            color: '#001c43' // 节点默认颜色
+          },
+          lineStyle: {
+            opacity: 0.9, // 边透明度
+            width: 2, // 边宽度
+            curveness: 0.3, // 边弯曲度
+            color: {
+              // 边颜色使用线性渐变
+              type: 'linear',
+              colorStops: [
+                {
+                  offset: 0,
+                  color: '#e0f55a'
+                },
+                {
+                  offset: 1,
+                  color: '#639564'
+                }
+              ]
+            }
+          },
+          data: [
+            // 节点数据
+            {
+              name: '鸡哥', // 节点名称
+              symbolSize: [60, 60], // 节点大小（宽高）
+              label: {
+                color: '#fff', // 标签颜色
+                fontSize: 16, // 标签字体大小
+                fontWeight: 'bold' // 标签字体粗细
+              },
+              itemStyle: {
+                color: 'red' // 节点颜色
+              }
+            },
+            {
+              name: '傻星',
+              symbolSize: [40, 40]
+            },
+            {
+              name: '王大锤',
+              symbolSize: [40, 40]
+            },
+            {
+              name: '彭于晏',
+              symbolSize: [40, 40]
+            },
+            {
+              name: '笑嘻嘻',
+              symbolSize: [40, 40]
+            }
+          ],
+          links: [
+            // 边数据
+            {
+              source: 0, // 源节点索引
+              target: 1, // 目标节点索引
+              value: '孙子' // 边显示的值
+            },
+            {
+              source: 1,
+              target: 0,
+              value: '爷爷'
+            },
+            {
+              source: 0,
+              target: 2,
+              value: '儿子'
+            },
+            {
+              source: 2,
+              target: 0,
+              value: '父亲'
+            },
+            {
+              source: 0,
+              target: 3,
+              value: '小弟'
+            },
+            {
+              source: 3,
+              target: 0,
+              value: '老大'
+            },
+            {
+              source: 0,
+              target: 4,
+              value: '小弟'
+            },
+            {
+              source: 4,
+              target: 0,
+              value: '老大'
+            }
+          ]
+        }
+      ]
+    }
+
+    option && myChart.setOption(option)
+  }, [])
+
+  useEffect(() => {
+    initFu()
+  }, [initFu])
+
+  return <div className={styles.A1echarts} id='A1echarts'></div>
+}
+
+const MemoA1echarts = React.memo(A1echarts)
+
+export default MemoA1echarts

后台管理/src/pages/A1record/A1look/index.module.scss

@@ -0,0 +1,38 @@
+.A1look {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 10;
+  background-color: #ecedf1;
+  overflow: auto;
+  :global {
+    .A1Top {
+      display: flex;
+      min-height: 400px;
+      margin-bottom: 15px;
+      & > div {
+        background-color: #fff;
+        border-radius: 10px;
+        padding: 15px;
+      }
+      .A1Top1 {
+        width: calc(100% - 600px);
+        margin-right: 20px;
+      }
+      .A1Top2 {
+        width: 580px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+
+    .A1Tab {
+      background-color: #fff;
+      border-radius: 10px;
+      padding: 15px;
+    }
+  }
+}

后台管理/src/pages/A1record/A1look/index.tsx

@@ -0,0 +1,55 @@
+import React from 'react'
+import styles from './index.module.scss'
+import A1echarts from '../A1echarts'
+function A1look() {
+  return (
+    <div className={styles.A1look}>
+      <div className='A1Top'>
+        <div className='A1Top1'>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+          <h1>asdasd</h1>
+        </div>
+        <div className='A1Top2'>
+          <A1echarts />
+        </div>
+      </div>
+
+      <div className='A1Tab'>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+        <h1>asdasd</h1>
+      </div>
+    </div>
+  )
+}
+
+const MemoA1look = React.memo(A1look)
+
+export default MemoA1look

后台管理/src/pages/A1record/index.module.scss

@@ -1,4 +1,5 @@
 .A1record {
+  position: relative;
   :global {
   }
 }

后台管理/src/pages/A1record/index.tsx

@@ -1,9 +1,12 @@
 import React from 'react'
 import styles from './index.module.scss'
+import A1look from './A1look'
 function A1record() {
   return (
     <div className={styles.A1record}>
       <div className='pageTitle'>烈士档案</div>
+
+      <A1look />
     </div>
   )
 }

后台管理/src/pages/Layout/data.ts

@@ -37,7 +37,8 @@ const tabLeftArr: RouterType = [
         Com: React.lazy(() => import('../A5introduce'))
       },
       {
-        id: 105,
+        // 待完善id
+        id: 106,
         name: '数据统计',
         path: '/statistics',
         Com: React.lazy(() => import('../A6statistics'))
@@ -55,12 +56,7 @@ const tabLeftArr: RouterType = [
         path: '/user',
         Com: React.lazy(() => import('../Z1user'))
       },
-      {
-        id: 105,
-        name: '权限管理',
-        path: '/power',
-        Com: React.lazy(() => import('../Z11power'))
-      },
+
       {
         id: 2200,
         name: '操作日志',

后台管理/src/pages/Layout/index.module.scss

@@ -151,6 +151,7 @@
             height: 100%;
             background-color: #fff;
             border-radius: 10px;
+            padding: 20px;
           }
         }
       }

后台管理/src/pages/Z11power/index.module.scss

@@ -1,4 +0,0 @@
-.Z11power {
-  :global {
-  }
-}

后台管理/src/pages/Z11power/index.tsx

@@ -1,13 +0,0 @@
-import React from 'react'
-import styles from './index.module.scss'
-function Z11power() {
-  return (
-    <div className={styles.Z11power}>
-      <div className='pageTitle'>权限管理</div>
-    </div>
-  )
-}
-
-const MemoZ11power = React.memo(Z11power)
-
-export default MemoZ11power

后台管理/src/pages/Z2log/index.module.scss

@@ -22,4 +22,4 @@
       background-color: #fff;
     }
   }
-}
+}

后台管理/src/utils/http.ts

@@ -7,8 +7,8 @@ import { domShowFu } from './domShow'
 
 const envFlag = process.env.NODE_ENV === 'development'
 
-const baseUrlTemp = 'https://sit-hefeibwg.4dage.com' // 测试环境
-// const baseUrlTemp = 'http://192.168.20.61:8103' // 线下环境
+// const baseUrlTemp = 'xxxxxxxxxxxxxxx' // 测试环境
+const baseUrlTemp = 'http://192.168.20.61:8104' // 线下环境
 
 const baseFlag = baseUrlTemp.includes('https://')
 

后台管理/tsconfig.json

@@ -19,9 +19,9 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
   },
   "include": [
     "src"
   ]
-}
+}

后台管理/yarn.lock

@@ -4451,6 +4451,14 @@ eastasianwidth@^0.2.0:
   resolved "https://registry.npmmirror.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz#696ce2ec0aa0e6ea93a397ffcf24aa7840c827cb"
   integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
+echarts@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.npmmirror.com/echarts/-/echarts-6.0.0.tgz#2935aa7751c282d1abbbf7d719d397199a15b9e7"
+  integrity sha512-Tte/grDQRiETQP4xz3iZWSvoHrkCQtwqd6hs+mifXcjrCuo2iKWbajFObuLJVBlDIJlOzgQPd1hsaKt/3+OMkQ==
+  dependencies:
+    tslib "2.3.0"
+    zrender "6.0.0"
+
 ee-first@1.1.1:
   version "1.1.1"
   resolved "https://registry.npmmirror.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
@@ -10187,6 +10195,11 @@ tsconfig-paths@^3.15.0:
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
+tslib@2.3.0:
+  version "2.3.0"
+  resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
+  integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==
+
 tslib@^1.8.1:
   version "1.14.1"
   resolved "https://registry.npmmirror.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
@@ -11008,3 +11021,10 @@ yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.npmmirror.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
+
+zrender@6.0.0:
+  version "6.0.0"
+  resolved "https://registry.npmmirror.com/zrender/-/zrender-6.0.0.tgz#947077bc69cdea744134984927f132f3727f8079"
+  integrity sha512-41dFXEEXuJpNecuUQq6JlbybmnHaqqpGlbH1yxnA5V9MMP4SbohSVZsJIwz+zdjQXSSlR1Vc34EgH1zxyTDvhg==
+  dependencies:
+    tslib "2.3.0"