fix: 调整搜索组件showHint样式和提示文本，隐藏/显示相关实体时联动左侧filter

src/assets/css/components/components/advancedSearch/codemirror.scss

@@ -375,16 +375,15 @@ span.CodeMirror-selectedtext { background: none; }
 }
 
 .hint-title {
-  margin: 10px 10px 10px 0;
+  margin: 7px 0 3px 0 !important;
-  height: 24px;
-  line-height: 24px;
   /* 禁止选中  样式 */
   background: #fff !important;
   font-family: NotoSansHans-Medium;
-  font-size: 14px;
+  font-size: 12px;
   color: #333333 !important;
   letter-spacing: 0;
-  font-weight: 500;
+  font-weight: 600 !important;
+  line-height: 12px;
 }
 
 .cm-s-eclipse span.cm-string-2 {
@@ -435,7 +434,7 @@ span.CodeMirror-selectedtext { background: none; }
 }
 
 .cm-variable-2{
-  font-weight: bold;
+  color: #164 !important;
 }
 
 .default-tips-header,.default-tips-title {

src/components/advancedSearch/TextMode.vue

@@ -134,12 +134,13 @@ export default {
         option = {
           keyMap: 'sublime',
           tabSize: 2, // 缩进格式
-          theme: 'eclipse', // 主题，对应主题库 JS 需要提前引入
+          // theme: 'eclipse', // 主题，对应主题库 JS 需要提前引入
           line: true,
           lineNumbers: false, // 显示行数
           indentUnit: 4, // 缩进单位为4
           styleActiveLine: true, // 当前行背景高亮
-          mode: 'text/x-filter', // HMTL混合模式
+          // mode: 'text/x-filter', // HMTL混合模式
+          mode: 'sql', // HMTL混合模式
           foldGutter: true,
           lint: true,
           auto: 'auto', // 自动换行

src/components/advancedSearch/showhint/Hint/HintInfo.vue

@@ -3,6 +3,7 @@
     <ul style="padding-left: 0;margin: -10px 0 0 0;min-width: calc(100% - 12px)">
       <template v-for="(item,index) in hintList" :key="index">
         <li :ref="'hint_'+index" class="relative-item CodeMirror-hint"
+            style="margin-bottom: 2px"
             @click="handleSelect(item,index,hintList)"
             :class="{'CodeMirror-hint-active':index === activeIndex,[item.className]:true}"
         >{{ item.displayText }}</li>
@@ -113,14 +114,12 @@ export default {
     box-sizing: border-box;
     padding-bottom: 10px;
   }
-  .hint-title{
-    margin: 10px !important;
-    margin-left: 0 !important;
-    font-size: 14px;
-    line-height: 24px;
-  }
   .el-dropdown-menu__item{
     text-indent: 1em;
+    font-size: 12px !important;
+    font-family: NotoSansSChineseRegular;
+    color: #575757;
+    font-weight: 400;
   }
   .hint-clear{
     text-indent: 1em;

src/components/advancedSearch/showhint/const/defaultTips.js

@@ -5,15 +5,25 @@ export default {
         <div class='default-tips-header'>How To Search</div>
         <p class='show-hint-tips__p'> You can write queries to retrieve entities, including their basic information, activity levels, network performance, threat events, relationships with other entities, and so on. A query has three basic parts: fields, operators, and values.</p>
         <code>[Field + operator + value] keyword [operator(Field)]</code>
-        <p class='show-hint-tips__p'>Field - Fields are different types of traffic attributes in the system. Fields include ip, domain, app, and so on.</p>
+        <ul style="padding: 0">
-        <p class='show-hint-tips__p'>Operator - Operators are the foundation of the query. They relate the field to the value and build a query condition. Common operators include =, IN, Like, and so on.</p>
+          <li className='show-hint-tips__p'>Field - Fields are different types of traffic attributes in the system.
-        <p class='show-hint-tips__p'>Value - Values are the actual data in the query.</p>
+            Fields include ip, domain, app, and so on.
-        <p class='show-hint-tips__p'>Use the percent(%) wildcard substitutes for one or more characters in a string. Such as: </p>
+          </li>
+          <li className='show-hint-tips__p'>Operator - Operators are the foundation of the query. They relate the field
+            to the value and build a query condition. Common operators include =, IN, Like, and so on.
+          </li>
+          <li className='show-hint-tips__p'>Value - Values are the actual data in the query.</li>
+          <p className='show-hint-tips__p'>Use the percent(%) wildcard substitutes for one or more characters in a
+            string. Such as: </p>
           <code>domain like '%google.com'</code>
-        <p class='show-hint-tips__p'>Strings containing spaces must be enclosed in single quotes ('). Such as:</p>
+          <p className='show-hint-tips__p'>Strings containing spaces must be enclosed in single quotes ('). Such as:</p>
           <code>ip=192.168.10.53</code>
           <code>ip.country='United States'</code>
-        <p class='show-hint-tips__p'>Keyword - Keywords are specific words in the query. You can specify the AND and OR to create more complex query conditions. Currently only support AND.</p>
+          <li className='show-hint-tips__p'>Keyword - Keywords are specific words in the query. You can specify the AND
+            and OR to create more complex query conditions.
+          </li>
+          <p className='show-hint-tips__p'>Currently only support AND.</p>
+        </ul>
         <p class='show-hint-tips__p'>There are two input modes, which can be switched by clicking the button on the right side of the input box.</p>
 
         <div class='default-tips-title'> 1. Text Mode</div>
@@ -30,15 +40,23 @@ export default {
         <div class='default-tips-header'>如何搜索</div>
         <p class='show-hint-tips__p'>您可以编写查询来检索实体。查询具有三个基本部分：字段、运算符和值。</p>
         <code>[字段 + 运算符 + 值]  关键字  [运算符(字段)]</code>
-        <p class='show-hint-tips__p'>字段 - 字段是系统中不同类型的属性。字段包括 ip、domain、app 等。</p>
+        <ul style="padding: 0">
-        <p class='show-hint-tips__p'>运算符 - 运算符是查询的基础。他们将字段与值相关联并构建查询条件。常见的运算符包括 =、IN、Like 等。</p>
+          <li className='show-hint-tips__p'>字段 - 字段是系统中不同类型的属性。字段包括 ip、domain、app 等。</li>
-        <p class='show-hint-tips__p'>值 - 值是查询中的实际数据。</p>
+          <li className='show-hint-tips__p'>运算符 - 运算符是查询的基础。他们将字段与值相关联并构建查询条件。常见的运算符包括
-        <p class='show-hint-tips__p'>使用百分号(%)通配符替换字符串中的一个或多个字符。例如：</p>
+            =、IN、Like 等。
+          </li>
+          <li className='show-hint-tips__p'>值 - 值是查询中的实际数据。</li>
+          <p className='show-hint-tips__p'>使用百分号(%)通配符替换字符串中的一个或多个字符。例如：</p>
           <code>domain like '%google.com'</code>
-        <p class='show-hint-tips__p'>包含空格的字符串必须用单引号(')括住。例如：</p>
+          <p className='show-hint-tips__p'>包含空格的字符串必须用单引号(')括住。例如：</p>
           <code>ip=192.168.10.53</code>
           <code>ip.country='United States'</code>
-        <p class='show-hint-tips__p'>关键字 - 关键字是查询中的特定单词。您可以指定 AND 和 OR 来创建更复杂的查询条件。暂时只支持AND。</p>
+          <li className='show-hint-tips__p'>关键字 - 关键字是查询中的特定单词。您可以指定 AND 和 OR
+            来创建更复杂的查询条件。
+          </li>
+          <p className='show-hint-tips__p'>暂时只支持AND。</p>
+        </ul>
+
         <p class='show-hint-tips__p'>有两种输入模式，通过点击输入框右侧的按钮进行切换。</p>
 
         <div class='default-tips-title'> 1. 文本模式</div>

src/views/entityExplorer/EntityExplorer.vue

@@ -806,6 +806,7 @@ export default {
     hideRelatedEntities (e) {
       this.isHideRelatedEntities = e
       this.reloadUrl({ hideRelated: e })
+      this.queryFilterNew({ q: this.q, ...this.pageObj, ...this.timeFilter })
       this.queryList({ q: this.q, ...this.pageObj, ...this.timeFilter })
       this.queryCount({ q: this.q, ...this.pageObj, ...this.timeFilter })
     }