搜索数据高亮显示

src/pages/log/omsLog/index.js

@@ -27,6 +27,7 @@ const OmsLog = () => {
   const [endTime, setEndTime] = useState(
     moment(new Date(), 'YYYY-MM-DD HH:mm:ss'), // 默认值当前时间
   );
+  const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
 
   const columns = [
     {
@@ -45,6 +46,7 @@ const OmsLog = () => {
       key: 'Function',
       ellipsis: 'true',
       width: 200,
+      render: item => searchStyle(item),
       // filters: functionNameFilters,
       // onFilter: (value, record) => record.functionName === value,
     },
@@ -54,6 +56,7 @@ const OmsLog = () => {
       key: 'Label',
       ellipsis: 'true',
       width: 300,
+      render: item => searchStyle1(item),
     },
     {
       title: '操作信息',
@@ -90,6 +93,33 @@ const OmsLog = () => {
     },
   ];
 
+  //模糊查询匹配的样式
+  const searchStyle = val => {
+    let n;
+    if (showSearchStyle) {
+      n = val.replace(
+        new RegExp(functionName, 'g'),
+        `<span style='color:red'>${functionName}</span>`,
+      );
+    } else {
+      n = val;
+    }
+    return <div dangerouslySetInnerHTML={{ __html: n }} />;
+  };
+
+  const searchStyle1 = val => {
+    let n;
+    if (showSearchStyle) {
+      n = val.replace(
+        new RegExp(label, 'g'),
+        `<span style='color:red'>${label}</span>`,
+      );
+    } else {
+      n = val;
+    }
+    return <div dangerouslySetInnerHTML={{ __html: n }} />;
+  };
+
   // 在起止时间任意一个变化后获取数据
   useEffect(() => {
     if (startTime && endTime) {
@@ -162,6 +192,7 @@ const OmsLog = () => {
     setFunctionName('');
     setFilteredValue([]);
     setLabel('');
+    setShowSearchStyle(false);
   };
   const onChangeInput = filters => {
     console.log('filters', filters);
@@ -218,7 +249,10 @@ const OmsLog = () => {
             <Button
               type="primary"
               style={{ marginLeft: '10px' }}
-              onClick={getData}
+              onClick={() =>{
+                getData()
+                setShowSearchStyle(true);
+              }}
             >
               查询
             </Button>

src/pages/log/serviceLog/index.js

@@ -33,6 +33,7 @@ const ServiceLog = () => {
   );
   const [logType, setLogType] = useState('9999'); // 请求参数，日志类型，默认是正常，0:成功 -1:异常 9999:全部
   const [searchWord, setSearchWord] = useState(''); // 关键字
+  const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
 
   // 计算时间间隔（分钟）
   const start = new Date(startTime).getTime();
@@ -76,6 +77,7 @@ const ServiceLog = () => {
       key: 'Path',
       fixed: 'left',
       width: 400,
+      render: item => searchStyle(item),
     },
     {
       title: '调用时间',
@@ -130,6 +132,20 @@ const ServiceLog = () => {
       sorter: (a, b) => a.ResponseSize - b.ResponseSize,
     },
   ];
+
+   // 模糊查询匹配的样式
+   const searchStyle = val => {
+    let n;
+    if (showSearchStyle) {
+      n = val.replace(
+        new RegExp(searchWord, 'g'),
+        `<span style='color:red'>${searchWord}</span>`,
+      );
+    } else {
+      n = val;
+    }
+    return <div dangerouslySetInnerHTML={{ __html: n }} />;
+  };
   // 在起止时间任意一个变化后获取数据,且起止时间应该早于结束时间,且不允许跨月查询
   useEffect(() => {
     if (
@@ -251,6 +267,7 @@ const ServiceLog = () => {
     setStartTime(moment().startOf('week'));
     setEndTime(moment(new Date(), 'YYYY-MM-DD HH:mm:ss'));
     setSearchWord('');
+    setShowSearchStyle(false);
   };
   return (
     <>
@@ -298,6 +315,7 @@ const ServiceLog = () => {
               placeholder="请输入接口名称"
               onSearch={() => {
                 getData('/GetOMSLog', setDataTable);
+                setShowSearchStyle(true);
               }}
               onChange={e => handleSearch(e)}
               enterButton

src/pages/platformCenter/bsmanager/tablemanager/index.jsx

@@ -53,8 +53,10 @@ const TableManager = props => {
   const [tableData, setTableData] = useState([]);
   const [select, setSelect] = useState([]);
   const [selectTableName, setSelectTableName] = useState('');
+  const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
   useEffect(
     record => {
+      console.log(343434)
       loadTable(searchValue);
       getField();
       //   if (props.history.location.query && selectTableName !== {}) {
@@ -158,6 +160,7 @@ const TableManager = props => {
   const handleSearch = text => {
     loadTable(text);
     setSearchValue(text);
+    setShowSearchStyle(true);
   };
   const getField = () => {
     loadUnattachedTables().then(res => {
@@ -168,6 +171,7 @@ const TableManager = props => {
   };
   // 加载表
   const loadTable = keyword => {
+    console.log(222)
     setTreeLoading(true);
     CM_Table_LoadTable({
       _version: 9999,
@@ -242,7 +246,7 @@ const TableManager = props => {
         key: 'tableName',
         width: 300,
         render: (text, record) => (
-          <div onClick={e => fieldsConfig(record, e)}>{text}</div>
+          <div onClick={e => fieldsConfig(record, e)}>{searchStyle(text)}</div>
         ),
       },
       {
@@ -344,6 +348,20 @@ const TableManager = props => {
       },
     ];
 
+    // 模糊查询匹配的样式
+  const searchStyle = val => {
+    let n;
+    if (showSearchStyle) {
+      n = val.replace(
+        new RegExp(searchValue, 'g'),
+        `<span style='color:red'>${searchValue}</span>`,
+      );
+    } else {
+      n = val;
+    }
+    return <div dangerouslySetInnerHTML={{ __html: n }} />;
+  };
+
     return (
       <Table
         columns={columns1}

src/pages/platformCenter/bsmanager/workOrder/AddModal.jsx

@@ -857,7 +857,7 @@ const AddModal = props => {
                         >
                             <div className={styles.filed_listItem} >
                                 <Input style={{ width: '83%' }} placeholder="请选择摘要字段" onChange={(e) => changeText(e, 'SummaryFields')} value={inputValue.SummaryFields} allowClear />
-                                <Button type="dashed" onClick={() => pickFiled('SummaryFields')} icon={<PlusOutlined />} style={{ marginLeft: '0.5rem', width: '4rem' }} />
+                                <Button type="dashed" onClick={() => pickFiled('SummaryFields')} icon={<PlusOutlined style={{marginTop:'5px'}}/>} style={{ marginLeft: '0.5rem', width: '4rem' }} />
                             </div>
 
                         </Item>

src/pages/platformCenter/messageManage/projectManage/ProjectManage.jsx

@@ -39,21 +39,25 @@ const ProjectManage = () => {
     const [pageSize, setPageSize] = useState(10)
     const [dataList, setDataList] = useState([])
     const [treeLoading, setTreeLoading] = useState(false);
+    const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
+    const [value, setValue] = useState('')
     const columns = [
         {
             title: '方案名称',
             dataIndex: 'name',
             key: 'name',
             render: (text, record) => (
-                <div>{record.type == '定时推送' ? text : <div style={{ display: 'flex', alignItems: 'center' }}>
+                <div>{record.type == '定时推送' ? searchStyle(text) : <div style={{ display: 'flex', alignItems: 'center' }}>
                     <Tooltip title={text} >
                         <FieldTimeOutlined
                             style={{ fontSize: '16px', color: '#1890FF', marginRight: '0.1rem' }}
                         />
                     </Tooltip>
-                    {text}
-                </div>}</div>
-            )
+                    {searchStyle(text)}
+                </div>}
+                </div>
+
+            ),
         },
         {
             title: '方案类型',
@@ -118,9 +122,28 @@ const ProjectManage = () => {
         },
 
     ];
+
+    // 模糊查询匹配的样式
+    const searchStyle = val => {
+        console.log(val)
+        console.log(value)
+        let n;
+        if (showSearchStyle) {
+            n = val.replace(
+                new RegExp(value, 'g'),
+                `<span style='color:red'>${value}</span>`,
+            );
+        } else {
+            n = val;
+        }
+        console.log(val)
+        return <div dangerouslySetInnerHTML={{ __html: n }} />;
+    };
+
     const placeholder = '请输入方案名称'
     const handleSearch = (value) => {
         GetMessageList({ pageSize: 10, pageIndex: 0, search: value })
+        setShowSearchStyle(true);
     }
     const changeDesc = (record) => {
         setCurrentTempalte(record)
@@ -188,6 +211,7 @@ const ProjectManage = () => {
         setCurrentType("全部")
         setCurrentName("全部")
         GetMessageList({ pageSize: 10, pageIndex: 0 })
+        setShowSearchStyle(false);
     }
     // 弹出模态框
     const handleShowModal = (key, value) => {
@@ -266,6 +290,10 @@ const ProjectManage = () => {
         )
     }
 
+    const handleChange = e =>{
+       setValue(e.target.value)
+    }
+
     const pagenation = {
         showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
         pageSizeOptions: [10, 20, 50, 100],
@@ -306,9 +334,10 @@ const ProjectManage = () => {
                             allowClear
                             placeholder={placeholder}
                             onSearch={handleSearch}
-                            // onChange={handleChange}
+                            onChange={e=>{handleChange(e)}}
                             enterButton
                             style={{ width: "300px" }}
+                            value={value}
                         />
                     </div>
                     <Button type="primary" onClick={handleReset}>重置</Button>
@@ -322,7 +351,7 @@ const ProjectManage = () => {
                         dataSource={dataList}
                         pagination={pagenation}
                         rowKey='ID'
-                       />
+                    />
                 </div>
                 <EditModal
                     visible={visibleParams.editVisible}

src/pages/platformCenter/messageManage/templateManage/TemplateManage.jsx

@@ -39,6 +39,8 @@ const TemplateManage = () => {
     const [flag, setFlag] = useState(0)
     const [option, setOption] = useState([]); // 下拉列表数据
     const [treeLoading, setTreeLoading] = useState(false);
+    const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
+    const [value, setValue] = useState('')
 
     useEffect(() => {
         getTemplateList()
@@ -105,6 +107,7 @@ const TemplateManage = () => {
             dataIndex: 'name',
             key: 'name',
             align: 'center',
+            render: item => searchStyle(item),
         },
         {
             title: '模板类型',
@@ -182,12 +185,34 @@ const TemplateManage = () => {
 
     ];
 
+    // 模糊查询匹配的样式
+    const searchStyle = val => {
+        let n;
+        if (showSearchStyle) {
+            n = val.replace(
+                new RegExp(value, 'g'),
+                `<span style='color:red'>${value}</span>`,
+            );
+        } else {
+            n = val;
+        }
+        console.log(n)
+        return <div dangerouslySetInnerHTML={{ __html: n }} />;
+    };
+
     const placeholder = '请输入模板名称'
     const handleSearch = (value) => {
+        setValue(value)
         getTemplateList({ queryInfo: value })
+        setShowSearchStyle(true);
     }
     const handleReset = () => {
         getTemplateList()
+        setValue('')
+        setShowSearchStyle(false);
+    }
+    const handleChange = e =>{
+        setValue(e.target.value)
     }
     const handleSelectType = (value) => {
         if (value === '全部') {
@@ -300,9 +325,10 @@ const TemplateManage = () => {
                             allowClear
                             placeholder={placeholder}
                             onSearch={handleSearch}
-                            // onChange={handleChange}
+                            onChange={e => handleChange(e)}
                             enterButton
                             style={{ width: "300px" }}
+                            value={value}
                         />
                     </div>
                     <Button type="primary" onClick={handleReset}>重置</Button>

src/pages/platformCenter/videoManager/index.js

@@ -49,6 +49,7 @@ const videoManager = () => {
   const [obj, setObj] = useState({});
   const [show1, setShow1] = useState('block');
   const [show2, setShow2] = useState('none');
+  const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
 
   const columns = [
     {
@@ -57,6 +58,7 @@ const videoManager = () => {
       key: 'Name',
       width: 200,
       align: 'center',
+      render: item => searchStyle(item),
     },
     {
       title: '视频厂商',
@@ -71,6 +73,7 @@ const videoManager = () => {
       key: 'LoginName',
       width: 350,
       align: 'center',
+      render: item => searchStyle(item),
     },
     {
       title: '登录密码',
@@ -85,6 +88,7 @@ const videoManager = () => {
       key: 'EquipmentCode',
       width: 150,
       align: 'center',
+      render: item => searchStyle(item),
     },
     {
       title: '通道ID',
@@ -183,6 +187,20 @@ const videoManager = () => {
     },
   ];
 
+  // 模糊查询匹配的样式
+  const searchStyle = val => {
+    let n;
+    if (showSearchStyle) {
+      n = val.replace(
+        new RegExp(searchWord, 'g'),
+        `<span style='color:red'>${searchWord}</span>`,
+      );
+    } else {
+      n = val;
+    }
+    return <div dangerouslySetInnerHTML={{ __html: n }} />;
+  };
+
   const edit = record => {
     setAddVisible(true);
     setKind('edit');
@@ -255,6 +273,7 @@ const videoManager = () => {
   useEffect(() => {
     setLoading(true);
     getData();
+    setShowSearchStyle(false);
   }, [type, flag]);
 
   const getData = () => {
@@ -304,6 +323,7 @@ const videoManager = () => {
       QueryWhere: searchWord,
     }).then(res => {
       if (res.msg === 'Ok') {
+        setShowSearchStyle(true);
         setTableData(res.data.list);
       }
     });

src/pages/userCenter/roleManage/RoleManage.jsx

@@ -108,6 +108,8 @@ const SiteManage = () => {
       if (res.code === 0) {
         const { roleList } = res.data;
         let arr = transTree(roleList);
+        console.log(roleList)
+        console.log(arr)
         setTreeData(arr);
       }
     });

src/pages/userCenter/siteManageV2/siteManage.jsx

@@ -64,7 +64,7 @@ const SiteManageV2 = () => {
 
 
 
-
+    const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
     const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
     const [treeData, setTreeData] = useState([]); // 用户站点树
     const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份，用于更改机构
@@ -175,14 +175,15 @@ const SiteManageV2 = () => {
         updateTrees();
     }, [flag]);
 
-    useEffect(()=>{
+    useEffect(() => {
         getValue()
-    },[])
+    }, [])
 
     //切换站点，点击分页按钮，提交 
     useEffect(() => {
         if (!currentStation) return;
         getList();
+        setShowSearchStyle(false);
     }, [updatePageUser, name]);
     //切换站点，提交时触发已勾选列表更新
     useEffect(() => {
@@ -201,6 +202,7 @@ const SiteManageV2 = () => {
         if (name) params = { ...params, name };
         groupUserPagingList(params).then(res => {
             if (res.code === 0 && res.data) {
+                setShowSearchStyle(true);
                 let { list } = res.data;
                 // 还原选择的数据
                 if (selectList.length > 0) {
@@ -303,33 +305,33 @@ const SiteManageV2 = () => {
         setPage({ pageNum: 1, pageSize: 10 });
         console.log(data)
         data.map((item, index) => {
-            if(item.id == props[0]){
+            if (item.id == props[0]) {
                 console.log(item.id)
                 console.log(item.describe)
                 setDes(item.describe)
             }
-        }) 
+        })
     }
 
     const getValue = () => {
         getSiteTree({ selectNode: -1 }).then(
             res => {
                 console.log(res.data)
-                getData1(res.data)  
+                getData1(res.data)
             }
-        )   
+        )
     }
     const getData1 = e => {
         console.log(e)
-        e.map((i, j)=>{
+        e.map((i, j) => {
             a.push(i)
-            if(i.children.length>0){
+            if (i.children.length > 0) {
                 getData1(i.children)
             }
         })
         console.log(a)
         setData(a)
-        
+
     }
 
     // 弹出模态框
@@ -505,6 +507,23 @@ const SiteManageV2 = () => {
     const addTopStation = () => {
         handleShowModal('modalVisible', true);
     }
+
+    // 模糊查询匹配的样式
+    const searchStyle = val => {
+        console.log(name)
+        let n;
+        if (showSearchStyle) {
+            n = val.replace(
+                new RegExp(name, 'g'),
+                `<span style='color:red'>${name}</span>`,
+            );
+        } else {
+            n = val;
+        }
+        console.log(n)
+        return <div dangerouslySetInnerHTML={{ __html: n }} />;
+    };
+
     return (
         <PageContainer className={styles.siteManageContainer}>
             <div className={styles.contentContainer}>
@@ -628,7 +647,7 @@ const SiteManageV2 = () => {
                                                         key={`${item.userName}${item.GroupId}${index}`}
                                                         onClick={() => handleDel(index)}
                                                     >
-                                                        {`${item.userName}(${item.GroupName})`}
+                                                        {`${item.userName}(${searchStyle(item.GroupName)})`}
                                                     </li>
                                                 ))}
                                             </ul>

src/pages/userCenter/userManage/RelateRoleModal.jsx

@@ -50,6 +50,7 @@ const RelateRoleModal = props => {
 
   // 提交-关联角色
   const submitRole = () => {
+    console.log(1212121212)
     SetUserRelationList(
       currentUser.userID,
       Object.keys(roleValueList)
@@ -83,13 +84,7 @@ const RelateRoleModal = props => {
   };
   // 提交-批量关联角色
   const submitRoles = () => {
-    
-    console.log(roleValueList)
-    console.log(stationValueList)
-    console.log( Object.keys(roleValueList)
-    .map(k => roleValueList[k])
-    .flat()
-    .toString())
+    console.log(64634676437)
     setUserRelations(
       userIDs,
       Object.keys(roleValueList)

src/pages/webConfig/index.js

@@ -256,7 +256,7 @@ const WebConfigPage = props => {
           }, 500);
         } else {
           notification.warning({
-            message: res.message || failMsg,
+            message: res.msg || failMsg,
             duration: 5,
           });
         }