fix

src/components/EarlyWarning/addEdit.tsx

@@ -1,5 +1,5 @@
 import { useAjax } from "@/Hook/useAjax"
-import { addSysWarningRuleApi } from "@/services/adMonitor/earlyWarning"
+import { addSysWarningRuleApi, editSysWarningRuleApi } from "@/services/adMonitor/earlyWarning"
 import { DeleteOutlined, PlusOutlined } from "@ant-design/icons"
 import { Button, Form, Input, InputNumber, message, Modal, Popconfirm, Select, Space, Switch } from "antd"
 import React from "react"
@@ -11,18 +11,22 @@ import PriceInput from "./priceInput"
 interface Props {
     visible?: boolean
     onClose?: () => void
-    onChange?: () => void
+    onChange?: () => void,
+    initialValues?: any
 }
 const AddEdit: React.FC<Props> = (props) => {
 
     /******************************/
-    const { visible, onClose, onChange } = props
+    const { visible, onClose, onChange, initialValues } = props
     const [form] = Form.useForm();
     const rules = Form.useWatch('rules', form);
 
     const addSysWarningRule = useAjax((params) => addSysWarningRuleApi(params))
+    const editSysWarningRule = useAjax((params) => editSysWarningRuleApi(params))
     /******************************/
 
+    console.log('initialValues--->', initialValues);
+    
 
     const handleOk = () => {
         // console.log(JSON.stringify(rules));
@@ -41,11 +45,17 @@ const AddEdit: React.FC<Props> = (props) => {
                         })
                     }
                 })
-                console.log('params--->', { rules: params, notifyFrequency, ruleName, warningType, defaultRule: defaultRule ? 1 : 0, enable: enable ? 1 : 0 });
-                addSysWarningRule.run({ rules: params, notifyFrequency, ruleName, warningType, defaultRule: defaultRule ? 1 : 0, enable: enable ? 1 : 0 }).then(res => {
-                    message.success('新增成功')
-                    onChange?.()
-                })
+                if (initialValues?.id) {
+                    editSysWarningRule.run({ ruleId: initialValues.id, rules: params, notifyFrequency, ruleName, warningType, defaultRule: defaultRule ? 1 : 0, enable: enable ? 1 : 0 }).then(res => {
+                        message.success('修改成功')
+                        onChange?.()
+                    })
+                } else {
+                    addSysWarningRule.run({ rules: params, notifyFrequency, ruleName, warningType, defaultRule: defaultRule ? 1 : 0, enable: enable ? 1 : 0 }).then(res => {
+                        message.success('新增成功')
+                        onChange?.()
+                    })
+                }
             } else {
                 message.error('请添加最少一项规则')
             }
@@ -53,13 +63,13 @@ const AddEdit: React.FC<Props> = (props) => {
     }
     return <Modal
         title={<Space size={2} align='end'>
-            <strong>设置预警</strong>
+            <strong>{initialValues?.id ? '修改预警规则' : '新增预警规则'}</strong>
             <span style={{ fontSize: 12, color: 'red' }}>(条件与条件之间是或者关系，条件内字段是并且关系, 满足任意一条件立即触发报警提醒)</span>
         </Space>}
         visible={visible}
         onOk={handleOk}
         width={750}
-        confirmLoading={addSysWarningRule.loading}
+        confirmLoading={addSysWarningRule.loading || editSysWarningRule.loading}
         onCancel={() => onClose?.()}
     >
         <Form
@@ -68,7 +78,7 @@ const AddEdit: React.FC<Props> = (props) => {
             className="addEdit_form"
             labelCol={{ span: 5 }}
             colon={false}
-            initialValues={{
+            initialValues={initialValues || {
                 enable: true,
                 notifyFrequency: 5,
                 defaultRule: false,

src/components/EarlyWarning/index.tsx

@@ -1,7 +1,7 @@
 import { useAjax } from "@/Hook/useAjax"
 import TableData from "@/pages/launchSystemNew/components/TableData"
-import { getSysWarningRuleListApi } from "@/services/adMonitor/earlyWarning"
-import { Button, Drawer, Form, Input, Modal, Space } from "antd"
+import { delSysWarningRuleApi, getSysWarningRuleListApi, RuleProps } from "@/services/adMonitor/earlyWarning"
+import { Button, Drawer, Input, message, Space } from "antd"
 import React, { useEffect, useState } from "react"
 import AddEdit from "./addEdit"
 import tableConfig from "./tableConfig"
@@ -15,11 +15,13 @@ import tableConfig from "./tableConfig"
 const EarlyWarning: React.FC = () => {
 
     /**************************/
-    const [visible, setVisible] = useState<boolean>(true)
+    const [visible, setVisible] = useState<boolean>(false)
     const [addVisible, setAddVisible] = useState<boolean>(false)
     const [queryParams, setQueryParams] = useState<{ ruleName?: string }>({})
+    const [editData, setEditData] = useState<{ initialValues?: any }>({})
 
-    const getSysWarningRuleList = useAjax((params) => getSysWarningRuleListApi(params))
+    const getSysWarningRuleList = useAjax((params) => getSysWarningRuleListApi(params), { formatResult: true })
+    const delSysWarningRule = useAjax((params) => delSysWarningRuleApi(params))
     /**************************/
 
     // 获取列表
@@ -31,8 +33,38 @@ const EarlyWarning: React.FC = () => {
         getSysWarningRuleList.run(queryParams)
     }
 
+    /** 修改 */
+    const edit = (data: any) => {
+        let newData = JSON.parse(JSON.stringify(data))
+        newData.defaultRule = newData.defaultRule ? true : false
+        newData.enable = newData.enable ? true : false
+        newData.rules = newData.rules.map((item: { rule: RuleProps[] }) => {
+            let field: string[] = []
+            let data: any = {}
+            item.rule.forEach(item => {
+                let { field: oldField, ...newItem } = item
+                field.push(oldField)
+                data[oldField] = { ...newItem }
+            })
+            return {
+                ...data,
+                field
+            }
+        })
+        
+        setEditData({ initialValues: newData })
+        setAddVisible(true)
+    }
+    /** 删除 */
+    const del = (id: number) => {
+        delSysWarningRule.run(id).then(res => {
+            message.success('删除成功')
+            getSysWarningRuleList.refresh()
+        })
+    }
+
     return <>
-        <Button type="primary" onClick={() => setVisible(true)}>监控预警</Button>
+        <Button type="primary" onClick={() => { setVisible(true); setEditData({}) }}>监控预警</Button>
 
         {/* 预警列表 */}
         {visible && <Drawer
@@ -50,23 +82,21 @@ const EarlyWarning: React.FC = () => {
                 </Space>
 
                 <TableData
+                    size="small"
                     isCard={false}
-                    columns={() => tableConfig()}
+                    columns={() => tableConfig(edit, del)}
                     ajax={getSysWarningRuleList}
-                    dataSource={getSysWarningRuleList?.data}
+                    dataSource={getSysWarningRuleList?.data?.data}
                     loading={getSysWarningRuleList?.loading}
-                    scroll={{ y: 560 }}
-                    total={getSysWarningRuleList?.data?.length}
+                    total={getSysWarningRuleList?.data?.data?.length}
                     gutter={[0, 10]}
-                    leftChild={<Space direction='vertical'>
-
-                    </Space>}
+                    leftChild={<Space direction='vertical'></Space>}
                 />
             </Space>
         </Drawer>}
 
         {/* 设置预警 */}
-        {addVisible && <AddEdit visible={addVisible} onClose={() => setAddVisible(false)} />}
+        {addVisible && <AddEdit visible={addVisible} onChange={() => { setAddVisible(false); getSysWarningRuleList.refresh(); setEditData({}) }} onClose={() => { setAddVisible(false); setEditData({}) }} {...editData} />}
     </>
 }
 

src/components/EarlyWarning/setEarlyWarning.tsx

@@ -0,0 +1,79 @@
+import { useAjax } from "@/Hook/useAjax"
+import { getSysWarningRuleListApi, modifySysWarningRuleApi } from "@/services/adMonitor/earlyWarning"
+import { AlertOutlined } from "@ant-design/icons"
+import { Button, Form, Input, message, Modal, Select } from "antd"
+import React, { useState } from "react"
+
+
+
+interface Props {
+    selectedRows?: any[],
+    onChange?: () => void
+}
+const SetEarlyWarning: React.FC<Props> = (props) => {
+
+    /******************************/
+    const { selectedRows = [], onChange } = props
+    const [visible, setVisible] = useState<boolean>(false)
+    const [form] = Form.useForm();
+    const getSysWarningRuleList = useAjax((params) => getSysWarningRuleListApi(params))
+    const modifySysWarningRule = useAjax((params) => modifySysWarningRuleApi(params))
+    /******************************/
+
+    const openModal = () => {
+        setVisible(true)
+        getSysWarningRuleList.run()
+        form.setFieldsValue({ adgroupId: selectedRows?.map(item => item.adgroupId).toString() })
+    }
+
+    const handleOk = () => {
+        form.validateFields().then(values => {
+            let params = selectedRows?.map(item => ({ adgroupId: item.adgroupId, accountId: item.accountId, campaignId: item.campaignId }))
+            console.log('values--->', params);
+            modifySysWarningRule.run({ addAds: params, ruleId: values.ruleId }).then(res => {
+                message.success('设置成功')
+                onChange?.()
+                setVisible(false)
+            })
+        })
+    }
+
+    return <>
+        <Button icon={<AlertOutlined />} onClick={openModal} disabled={selectedRows.length === 0}>设置预警</Button>
+        {visible && <Modal
+            visible={visible}
+            title="预警设置"
+            onOk={handleOk}
+            confirmLoading={modifySysWarningRule.loading}
+            onCancel={() => setVisible(false)}
+        >
+            <Form
+                form={form}
+                labelCol={{ span: 5 }}
+                colon={false}
+                initialValues={{
+
+                }}
+            >
+                <Form.Item label="当前广告ID" name="adgroupId">
+                    <Input.TextArea autoSize disabled />
+                </Form.Item>
+                <Form.Item name="ruleId" label={<strong>预警规则</strong>} rules={[{ required: true, message: '请选择预警规则' }]}>
+                    <Select
+                        showSearch
+                        allowClear
+                        placeholder="选择预警规则"
+                        filterOption={(input, option) =>
+                            ((option?.label ?? '') as any).toLowerCase().includes(input.toLowerCase())
+                        }
+                    >
+                        {getSysWarningRuleList?.data?.map((item: any) => <Select.Option value={item.id} key={item.id}>{item.ruleName}</Select.Option>)}
+                    </Select>
+                </Form.Item>
+            </Form>
+        </Modal>}
+    </>
+}
+
+
+export default React.memo(SetEarlyWarning)

src/components/EarlyWarning/tableConfig.tsx

@@ -1,7 +1,7 @@
-import { Badge, Tag } from 'antd'
+import { Badge, Popconfirm, Space, Tag } from 'antd'
 import React from 'react'
 import { WarningTypeEnum } from './config'
-function tableConfig(): any {
+function tableConfig(edit: (data: any) => void, del: (id: number) => void): any {
     return [
         {
             title: 'ID',
@@ -44,7 +44,37 @@ function tableConfig(): any {
             align: 'center',
             width: 70,
             render: (a: 0 | 1, b: any) => {
-                return <Badge status={{'0' : 'error', '1': 'success'}[a] as any} text={{'0': '否', '1': '是'}[a]}/>
+                return <Badge status={{ '0': 'error', '1': 'success' }[a] as any} text={{ '0': '否', '1': '是' }[a]} />
+            }
+        },
+        {
+            title: 'Enable?',
+            dataIndex: 'enable',
+            key: 'enable',
+            align: 'center',
+            width: 70,
+            render: (a: 0 | 1, b: any) => {
+                return <Badge status={{ '0': 'error', '1': 'success' }[a] as any} text={{ '0': '否', '1': '是' }[a]} />
+            }
+        },
+        {
+            title: '操作',
+            dataIndex: 'cz',
+            key: 'cz',
+            align: 'center',
+            width: 80,
+            render: (a: 0 | 1, b: any) => {
+                return <Space>
+                    <a onClick={() => edit(b)}>修改</a>
+                    <Popconfirm
+                        title="确定删除"
+                        onConfirm={() => del(b?.id)}
+                        okText="Yes"
+                        cancelText="No"
+                    >
+                        <a style={{ color: 'red' }}>删除</a>
+                    </Popconfirm>
+                </Space>
             }
         },
     ]

src/global.less

@@ -395,3 +395,7 @@ body {
     border-radius: 0 4px 4px 0 !important;
   }
 }
+
+.ant-modal-header {
+  border-radius: 4px 4px 0 0;
+}

src/pages/launchSystemNew/adq/ad/index.tsx

@@ -13,6 +13,7 @@ import PlanDetail from '@/pages/adMonitor/adMonitorList/components/planDetail'
 import { txAdConfig } from '../config'
 import Log from '../log'
 import EarlyWarning from '@/components/EarlyWarning'
+import SetEarlyWarning from '@/components/EarlyWarning/setEarlyWarning'
 
 type Props = {
     accountId: string,
@@ -378,12 +379,12 @@ const Ad: React.FC<Props> = (props) => {
                         <Switch checkedChildren="普通模式" unCheckedChildren="深度优化" checked={model} onChange={(checked) => { setModel(checked); setSelectedRows([]) }} style={model ? {} : { background: '#67c23a' }} />
                     </Col>
                     {model ? <>
-
                         <Col><Button type='primary' style={{ background: '#1890ff' }} icon={<FieldTimeOutlined />} disabled={selectedRows.length === 0} onClick={editScheduling}>修改排期出价名称</Button></Col>
-                        <Col><Button type='primary' style={{ background: '#1890ff' }} icon={<CopyOutlined />} disabled={selectedRows.length === 0} onClick={copyHandle}>批量复制</Button></Col>
+                        <Col><Button type='primary' style={{ background: '#1890ff' }} icon={<CopyOutlined />} disabled={selectedRows.length === 0} onClick={copyHandle}>复制</Button></Col>
                         <Col><Button type='primary' style={{ background: '#67c23a', borderColor: '#67c23a' }} loading={editAdqAdgroupsData.loading} icon={<PlayCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus('play')}>启动广告</Button></Col>
                         <Col><Button type='primary' style={{ background: '#e6a23c', borderColor: '#e6a23c' }} loading={editAdqAdgroupsData.loading} icon={<PauseCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus('suspend')}>暂停广告</Button></Col>
-                        <Col><Button type='primary' style={{ background: '#00bcd4', borderColor: '#00bcd4' }} loading={putAdqAdgroupsSyncBatchApi.loading} icon={<SyncOutlined />} disabled={selectedRows.length === 0} onClick={syncAd}>批量同步广告</Button></Col>
+                        <Col><Button type='primary' style={{ background: '#00bcd4', borderColor: '#00bcd4' }} loading={putAdqAdgroupsSyncBatchApi.loading} icon={<SyncOutlined />} disabled={selectedRows.length === 0} onClick={syncAd}>同步广告</Button></Col>
+                        <Col><SetEarlyWarning selectedRows={selectedRows} onChange={() => listAjax.refresh()}/></Col>
                         <Col>
                             <Popconfirm
                                 title="确定删除?"

src/services/adMonitor/earlyWarning.ts

@@ -2,6 +2,11 @@ import { api } from '../api'
 import { request } from 'umi'
 /***********告警接口**************/
 
+export interface RuleProps {
+    field: string,
+    condition: '>' | '>=' | '<' | '<=' | '=',
+    value: string
+}
 export interface AddSysWarningRuleProps {
     // 1：默认规则；0：非默认规则；默认规则仅能创建一条
     defaultRule: 0 | 1,
@@ -15,11 +20,7 @@ export interface AddSysWarningRuleProps {
     ruleName: string,
     // 规则列表
     rules: {
-        rule: {
-            field: string,
-            condition: '>' | '>=' | '<' | '<=' | '=',
-            value: string
-        }
+        rule: RuleProps[]
     }[],
     warningType: Array<'SMS' | 'DING_TALK'>
 }
@@ -30,6 +31,13 @@ export async function addSysWarningRuleApi(data: AddSysWarningRuleProps) {
         data
     })
 }
+/** 修改预警 */
+export async function editSysWarningRuleApi(data: AddSysWarningRuleProps) {
+    return request(`${api}/adq/sysWarningRule/modify`, {
+        method: 'POST',
+        data
+    })
+}
 
 
 /**
@@ -72,4 +80,25 @@ export async function getSysWarningRuleListApi(params: { ruleName?: string }) {
         method: 'GET',
         params
     })
+}
+
+export interface AddAdsProps {
+    accountId: number,
+    adgroupId: number,
+    campaignId: number
+}
+export interface ModifySysWarningRuleProps {
+    addAds: AddAdsProps,
+    ruleId: number
+}
+/**
+ * 广告下设置规则
+ * @param data 
+ * @returns 
+ */
+export async function modifySysWarningRuleApi(data: ModifySysWarningRuleProps) {
+    return request(`${api}/adq/sysWarningRule/modifyAd`, {
+        method: 'POST',
+        data
+    })
 }