CN-1479 fix: 搜索组件showHint提示文本修改

This commit is contained in:
刘洪洪
2023-12-13 17:05:16 +08:00
parent 3d1fbfa5fd
commit f5f857bcb4
14 changed files with 471 additions and 579 deletions

View File

@@ -1,56 +1,51 @@
export default {
default: {
enDefault: {
description () {
const code = `SELECT aggregate_function(field) [as field] … (5)
FROM [db.]table|$log_type(1)
WHERE $filter [and <expression-list> ](2)
GROUP BY <field-list>(3)
[HAVING <expression-list>](4)
[ORDER BY <sort-field> [ASC|DESC]](6)
[LIMIT [n, ]m ](7)`
return (<div className='default-tips'>
<h2>How To Search</h2>
<p> You can write a query to retieve logs from an log type, use group by aggregation keywords to calculate
metrics
and generate statistical results , search for specific conditions within a rolling time window, predict future
trends, and so on. </p>
<h3> 1. Filter Mode</h3>
<p> A query in SQL ( also known as a "Where clause") has three basic parts: fields, operators, and values. Where
clause can be combined with AND , OR and NOT keywords. </p>
<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>
<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>
<p class='show-hint-tips__p'>Value - Values are the actual data in the query.</p>
<p class='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>
<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 SQL. You can specify the AND and OR to create more complex query conditions. Currently only support AND.</p>
<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>
<ul>
<li>Field - Fields are different types of traffic attributes int the system. Fields include server_ip,
server_port, ssl_sni , and so on.
</li>
<li>Operator - Operators are the foundation of the query. They relate the field to the value and build a query
condition. Common operators include equals(=), IN, Like, etc.
</li>
<li>
<span>Value - Values are the actual data in the query.</span>
<ul class="sub-url">
<li>Use the percent (%) wildcard substitutes for one or more characters in a string. Such as ssl_sni like
'%google.com' .
</li>
<li>Use underscore (_) wildcard substitutes for exactly one character in a string. Such as
client_ip like '192.168.10.1_'.
</li>
<li>String requires single quotes (') around text values. Such as client_ip='192.168.10.53'.</li>
</ul>
</li>
<li>Keyword - Keywords are specific words in the SQL. You can specify the AND and OR in the WHERE clause to
create more complex query conditions.
</li>
</ul>
<h3> 2. Statistics Mode </h3>
<p>More advanced searches use the SQL keywords WHERE, GROUP BY to build aggregated query and return aggregated
results.</p>
<i class='ref-txt'>All clauses are optional , except for the required list of expressions after SELECT, WHERE and GROUP BY .</i>
<pre class="code">
{code}
</pre>
<div class='default-tips-title'> 1. Text Mode</div>
<p class='show-hint-tips__p'>In text mode, you will write your query with the help of input suggestions.</p>
<div class='default-tips-title'> 2. Tag Mode </div>
<p class='show-hint-tips__p'>In tag mode, you will be guided through preset steps to write a query.</p>
</div>)
}
},
zhDefault: {
description () {
return (<div className='default-tips'>
<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>
<p class='show-hint-tips__p'>运算符 - 运算符是查询的基础。他们将字段与值相关联并构建查询条件。常见的运算符包括 =、IN、Like 等。</p>
<p class='show-hint-tips__p'>值 - 值是查询中的实际数据。</p>
<p class='show-hint-tips__p'>使用百分号(%)通配符替换字符串中的一个或多个字符。例如:</p>
<code>domain like '%google.com'</code>
<p class='show-hint-tips__p'>包含空格的字符串必须用单引号(')括住例如</p>
<code>ip=192.168.10.53</code>
<code>ip.country='United States'</code>
<p class='show-hint-tips__p'>关键字 - 关键字是 SQL 中的特定单词您可以指定 AND OR 来创建更复杂的查询条件暂时只支持AND</p>
<p class='show-hint-tips__p'>有两种输入模式通过点击输入框右侧的按钮进行切换</p>
<div class='default-tips-title'> 1. 文本模式</div>
<p class='show-hint-tips__p'>文本模式中您将在输入建议的帮助下编写查询语句</p>
<div class='default-tips-title'> 2. 标签模式 </div>
<p class='show-hint-tips__p'>标签模式中您将在引导下按预设好的步骤编写查询</p>
</div>)
}
}