From f02f1c79ac7823813675a1835d9c51eee27e84a1 Mon Sep 17 00:00:00 2001
From: wenlele <wen.lele@free-sun.com.cn>
Date: Wed, 28 Sep 2022 15:51:20 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A1=AE=E8=AE=A4=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/client/src/components/outHidden.jsx       |  4 +-
 .../sections/problem/components/tableData.jsx | 11 +--
 .../sections/problem/containers/dataAlarm.jsx | 69 ++++++++-----------
 3 files changed, 35 insertions(+), 49 deletions(-)

diff --git a/web/client/src/components/outHidden.jsx b/web/client/src/components/outHidden.jsx
index 99e6384..24e7521 100644
--- a/web/client/src/components/outHidden.jsx
+++ b/web/client/src/components/outHidden.jsx
@@ -1,10 +1,10 @@
 import React, { useState, useEffect } from "react";
 import { Tooltip } from "@douyinfe/semi-ui";
 
-function OutHidden ({ name, width, height, color, background, numberHidden, number }) {
+function OutHidden ({ name, width, height, color, background, number }) {
 
    return <>
-      {numberHidden ?
+      {number ?
          <div style={{ display: 'inline-block' }}>
             <Tooltip content={name}>
                <div style={{
diff --git a/web/client/src/sections/problem/components/tableData.jsx b/web/client/src/sections/problem/components/tableData.jsx
index 094e2f9..788cde4 100644
--- a/web/client/src/sections/problem/components/tableData.jsx
+++ b/web/client/src/sections/problem/components/tableData.jsx
@@ -29,7 +29,8 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition
                   let tableDatas = res.payload.data?.rows.map(v => ({
                      key: v.id,
                      // serialNumber: v.serialNumber,
-                     projectName: v.app?.projectCorrelations?.map(r => r.name)?.filter(c => c),
+                     projectName: v.app?.projectCorrelations?.map(r => (r.name?{ name: r.name, state: '自定义' }:{ name: r.pepProject?.project_name, state: r.pepProject?.construction_status
+                     }))?.filter(c => c),
                      appName: v.app?.name,
                      url: v.app?.url,
                      createTime: v.createTime ? moment(v.createTime).format("YYYY-MM-DD HH:mm:ss") : "",
@@ -40,7 +41,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition
                      type: v.type ? typeData[v.type] : "",
                      confirm: v.confirm,
                   }))
-                  // console.log(tableDatas);
+                  console.log(tableDatas);
                   setTableData(tableDatas)
                }
             })
@@ -61,7 +62,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition
                   let genreData = []
                   data?.map(v => {
                      v?.unit?.map(vv => {
-                        genreData.push({ name: vv.name, value: vv.id })
+                        genreData.push({ name: vv.name, id: vv.id })
                      })
                   })
                   // console.log(genreData);
@@ -74,13 +75,13 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition
                            let tableDatas = res.payload.data?.rows?.map(v => ({
                               key: v.AlarmId,
                               StructureName: v.StructureName,
-                              projectName: v.pepProject?.map(r => r.projectName)?.filter(c => c),
+                              projectName: [],
                               createTime: v.StartTime ? moment(v.StartTime).format("YYYY-MM-DD HH:mm:ss") : "",
                               updateTime: v.EndTime ? moment(v.EndTime).format("YYYY-MM-DD HH:mm:ss") : "",
                               confirmTime: v.confirmedTime ? moment(v.confirmedTime).format("YYYY-MM-DD HH:mm:ss") : "",
                               SourceName: v.SourceName,
                               AlarmGroupUnit: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
-                              Strategy: v.AlarmGroupUnit ? genreData[0]?.unit?.find(r => r.id == v.AlarmGroupUnit)?.name : "",
+                              Strategy: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
                               type: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
                               AlarmCodeName: v.AlarmCodeName,
                               CurrentLevel: v.CurrentLevel,
diff --git a/web/client/src/sections/problem/containers/dataAlarm.jsx b/web/client/src/sections/problem/containers/dataAlarm.jsx
index 57baf2b..32d001f 100644
--- a/web/client/src/sections/problem/containers/dataAlarm.jsx
+++ b/web/client/src/sections/problem/containers/dataAlarm.jsx
@@ -13,6 +13,8 @@ import { request } from 'screenfull';
 
 const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
    let route = match.url.substring(match.url.lastIndexOf("/") + 1, match.url.length)
+
+   const { problem } = actions
    const [abnormalLenght, setAbnormalLenght] = useState(0)  //异常数量
    const [collect, setCollect] = useState([])  //搜索结构
    const [setup, setSetup] = useState(false);  //表格设置是否显现
@@ -172,54 +174,37 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
          name: '项目名称', value: 'projectName', render: (_, r, index) => {
             return <>
                {r.projectName?.map((v, index) => {
-                  let width
-                  let name = v
-                  switch (r.projectName?.length) {
-                     case 1:
-                        if (v.length > 25) width = 358
-                        break;
-                     case 2:
-                        if (v.length > 12) width = 173
-                        break;
-                     default:
-                        if (v.length > 7) width = 112
-                        break;
-                  }
-                  return (<div key={r.id + r.appName + index} style={{ display: 'inline-block', height: 20 }}>
-                     {index > 0 ? <span style={{ width: 1, height: 12, border: '1px solid #DCDEE0', margin: '3px 8px', display: 'inline-block', }}></span> : ""}
-                     {OutHidden({ width, name })}
-                  </div>)
-               })}
-               {r.projectName?.length > 3 ?
-                  <Tooltip
-                     trigger="click"
-                     // style={{ lineHeight: 2 }}
-                     content={
-                        <div style={{ display: 'flex', flexWrap: 'wrap' }}>
-                           {r.projectName?.map(vv => {
-                              return <div key={vv}>
-                                 {vv}<span style={{ color: '#FFFFFF' }}>、</span>
-                              </div>
-                           })}
-                        </div>}>
-                     <span style={{ fontSize: 14, color: '#005ABD', marginLeft: 8, cursor: "pointer", }}>
-                        {'+' + (r.projectName?.length - 3)}
-                     </span>
-                  </Tooltip> : ""}
+                  return <div key={r.id + r.appName + index} style={{ width: 176, }}>
+                     {OutHidden({
+                        number: 7,
+                        name: v.name
+                     })}
+                     <div style={{
+                        width: 58, height: 18, background: 'linear-gradient(rgb(235, 245, 255) 0%, rgb(235, 245, 255) 0%, rgb(211, 232, 255) 100%)',
+                        borderRadius: 2, display: "inline-block", marginLeft: 6
+                     }}>
+                        <img src="/assets/images/install/icon_zhengque.png" style={{ display: "inline-block", width: 10 }} />
+                        <span style={{ display: "inline-block", width: 48, fontSize: 12, textAlign: "center" }}>{v.state}</span>
+                     </div>
+                  </div>
+               })
+               }
+
             </>
          }
       },
       { name: '结构物名称', value: 'StructureName' },
       {
          name: '告警源', value: 'SourceName', render: (_, r, index) => {
-            // let data = ''
-            // if (route == 'dataLnterrupt' || route == 'dataAbnormal') {
-            //    data = '传感器'
-            // }
-            // if (route == 'strategyHit') data = '测点'
-            return <>
-               {/* <div style={{ width: 44, lineHeight: '18px', textAlign: "center", border: '1px solid #0F7EFB', fontWeight: 400, color: '#0F7EFB', fontSize: 12 }}>{data}</div> */}
-               {r.SourceName}</>
+            let data = ''
+            if (route == 'dataLnterrupt' || route == 'dataAbnormal') {
+               data = '传感器'
+            }
+            if (route == 'strategyHit') data = '测点'
+            return <div style={{ width: 136, display: 'flex', justifyContent: 'space-between' }}>
+               <div style={{ display: "inline-block", width: 84, }}>{r.SourceName}</div>
+               <div style={{ display: "inline-block", width: 44, height: 18, lineHeight: '18px', textAlign: "center", border: '1px solid #0F7EFB', fontWeight: 400, color: '#0F7EFB', fontSize: 12 }}>{data}</div>
+            </div>
          }
       },
       { name: '中断类型', value: 'AlarmGroupUnit' },