Skip to content

Commit ca63087

Browse files
authored
optimized setting configure and datasource selected (#98)
* optimized setting configure and datasource selected
1 parent d7d53f2 commit ca63087

File tree

2 files changed

+64
-16
lines changed

2 files changed

+64
-16
lines changed

src/pages/alert/rule/create.jsx

Lines changed: 33 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -145,6 +145,7 @@ export const AlertRule = ({ type }) => {
145145
const [queryWildcard,setQueryWildcard] = useState(0) // 匹配模式
146146
const [openJsonToTable,setOpenJsonToTable] = useState(false)
147147
const [jsonToTableData,setJsonToTableData] = useState([])
148+
const [metricAddress,setMetricAddress] = useState("")
148149

149150
useEffect(() => {
150151
if (ruleTemplate) {
@@ -235,6 +236,8 @@ export const AlertRule = ({ type }) => {
235236
setFilterCondition(selectedRow.elasticSearchConfig.filterCondition)
236237
setQueryWildcard(selectedRow.elasticSearchConfig.queryWildcard)
237238

239+
handleSelectedDsItem(selectedRow.datasourceId)
240+
238241
let t = 0;
239242
if (selectedRow.datasourceType === "Prometheus"){
240243
t = 0
@@ -730,8 +733,30 @@ export const AlertRule = ({ type }) => {
730733
form.setFieldsValue({ prometheusConfig: { promQL: promQL } });
731734
}, [promQL])
732735

733-
const handleSelectedDsItem = (ids) =>{
734-
setSelectedItems(ids)
736+
const handleSelectedDsItem = async (ids) => {
737+
// 获取数据源信息
738+
const url = await handleGetDatasourceInfo(ids[0]);
739+
740+
setSelectedItems(ids);
741+
742+
// 更新metricAddress
743+
setMetricAddress(url);
744+
};
745+
746+
const handleGetDatasourceInfo = async (id) => {
747+
try {
748+
const params = {
749+
id: id,
750+
}
751+
const res = await getDatasource(params)
752+
753+
if (res?.data?.http?.url) {
754+
return res?.data?.http?.url
755+
}
756+
return ""
757+
} catch (error) {
758+
console.error(`Error fetching datasource for ID ${id}:`, error)
759+
}
735760
}
736761

737762
const [dataSource, setDataSource] = useState([]);
@@ -740,12 +765,11 @@ export const AlertRule = ({ type }) => {
740765
try {
741766
setOpenMetricQueryModel(true)
742767
// 编码 PromQL 查询
743-
const encodedPromQL = encodeURIComponent(promQL);
744-
768+
// const promQL = encodeURIComponent(promQL);
745769
// 构造请求参数
746770
const params = {
747771
datasourceIds: selectedItems.join(","),
748-
query: encodedPromQL,
772+
query: promQL,
749773
};
750774

751775
// 发起请求
@@ -952,11 +976,11 @@ export const AlertRule = ({ type }) => {
952976
mode="multiple"
953977
placeholder="选择数据源"
954978
value={selectedItems}
955-
onChange={handleSelectedDsItem}
979+
onChange={(value)=>{handleSelectedDsItem(value)}}
956980
style={{
957981
width: '100%',
958982
}}
959-
tokenSeparators={[',']}
983+
// tokenSeparators={[',']}
960984
options={datasourceOptions}
961985
/>
962986
</MyFormItem>
@@ -969,7 +993,7 @@ export const AlertRule = ({ type }) => {
969993
<MyFormItemGroup prefix={['prometheusConfig']}>
970994
<MyFormItem name="promQL" label="PromQL" rules={[{required: true}]}>
971995
<PrometheusPromQL
972-
// addr={selectDatasourceURL}
996+
addr={metricAddress}
973997
value={handleGetPromQL}
974998
setPromQL={setPromQL}
975999
/>
@@ -1086,15 +1110,14 @@ export const AlertRule = ({ type }) => {
10861110
size="small"
10871111
dataSource={dataSource}
10881112
renderItem={(item) => {
1089-
const metricName = item.metric["__name__"];
10901113
const metricDetails = Object.keys(item.metric)
10911114
.filter(key => key !== "__name__")
10921115
.map(key => `${key}:${item.metric[key]}`)
10931116
.join(", ");
10941117
return (
10951118
<List.Item>
10961119
<div className="list-item-content">
1097-
{`${metricName}{${metricDetails}}`}
1120+
{`{${metricDetails}}`}
10981121
<div className="value">{`${item.value[1]}`}</div>
10991122
</div>
11001123
</List.Item>

src/pages/settings/index.jsx

Lines changed: 31 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@ export const SystemSettings = () => {
8181

8282

8383
const saveSettings = async (values) => {
84+
await form.validateFields()
8485
values.emailConfig.port = Number(values.emailConfig.port)
8586
values.aiConfig.timeout = Number(values.aiConfig.timeout)
8687
values.aiConfig.maxTokens = Number(values.aiConfig.maxTokens)
@@ -157,7 +158,11 @@ export const SystemSettings = () => {
157158
{
158159
enableAi === true && (
159160
<>
160-
<MyFormItem name="type" label="服务商">
161+
<MyFormItem
162+
name="type"
163+
label="服务商"
164+
rules={[{required: true}]}
165+
>
161166
<Select
162167
style={{ width: '100%' }}
163168
placeholder="选择 Ai 服务商"
@@ -175,23 +180,43 @@ export const SystemSettings = () => {
175180
>
176181
<Input placeholder="Ai 接口地址, 必须包含 http(s)://"/>
177182
</MyFormItem>
178-
<MyFormItem name="appKey" label="密钥">
183+
<MyFormItem
184+
name="appKey"
185+
label="密钥"
186+
rules={[{required: true}]}
187+
>
179188
<Input.Password placeholder="请求密钥"/>
180189
</MyFormItem>
181-
<MyFormItem name="model" label="模型">
190+
<MyFormItem
191+
name="model"
192+
label="模型"
193+
rules={[{required: true}]}
194+
>
182195
<Select
183196
style={{ width: '100%' }}
184197
placeholder="选择 Ai 模型"
185198
options={serviceProvider === 'OpenAi' ? openaiModels : deepseekModels}
186199
/>
187200
</MyFormItem>
188-
<MyFormItem name="timeout" label="超时时间">
201+
<MyFormItem
202+
name="timeout"
203+
label="超时时间"
204+
rules={[{required: true}]}
205+
>
189206
<Input type={'Number'} placeholder="请输入超时时间"/>
190207
</MyFormItem>
191-
<MyFormItem name="maxTokens" label="最大 Token 数">
208+
<MyFormItem
209+
name="maxTokens"
210+
label="最大 Token 数"
211+
rules={[{required: true}]}
212+
>
192213
<Input type={'Number'} placeholder="请输入最大 Token 数"/>
193214
</MyFormItem>
194-
<MyFormItem name="prompt" label="自定义提示词">
215+
<MyFormItem
216+
name="prompt"
217+
label="自定义提示词"
218+
rules={[{required: true}]}
219+
>
195220
<TextArea rows={15} placeholder="请输入自定义提示词" />
196221
</MyFormItem>
197222
</>

0 commit comments

Comments
 (0)