mz/video-gen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

创建前测表单

Browse Source
This commit is contained in:
Lrd
2026-06-18 18:05:43 +08:00
parent 11f424a333
commit 8ef6de2deb
1 changed files with 262 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
video-gen-app/src/pages/PreTest.tsx
+262 -16
View File
@@ -107,9 +107,9 @@ const PRETEST_FIELDS: PreTestField[] = [
{ id: 'AD_PRODUCT_FORM', name: 'AD_PRODUCT_FORM', label: 'AD：商品-表单提交', description: '商品表单提交' },
{ id: 'AD_PRODUCT_KEY_BEHAVIOR', name: 'AD_PRODUCT_KEY_BEHAVIOR', label: 'AD：商品-关键行为', description: '商品关键行为' },
{ id: 'AD_PRODUCT_PAY', name: 'AD_PRODUCT_PAY', label: 'AD：商品-付费', description: '商品付费' },
{ id: 'AD_TINYAPP_ACTIVATE', name: 'AD_TINYAPP_ACTIVATE', label: '千川：小程序-激活', description: '小程序激活' },
{ id: 'AD_TINYAPP_KEY_BEHAVIOR', name: 'AD_TINYAPP_KEY_BEHAVIOR', label: '千川：小程序-关键行为', description: '小程序关键行为' },
{ id: 'AD_TINYAPP_PAY', name: 'AD_TINYAPP_PAY', label: '千川：小程序-付费', description: '小程序付费' },
{ id: 'AD_TINYAPP_ACTIVATE', name: 'AD_TINYAPP_ACTIVATE', label: 'AD：小程序-激活', description: '小程序激活' },
{ id: 'AD_TINYAPP_KEY_BEHAVIOR', name: 'AD_TINYAPP_KEY_BEHAVIOR', label: 'AD：小程序-关键行为', description: '小程序关键行为' },
{ id: 'AD_TINYAPP_PAY', name: 'AD_TINYAPP_PAY', label: 'AD：小程序-付费', description: '小程序付费' },
{ id: 'QC_LIVE_BUY', name: 'QC_LIVE_BUY', label: '千川：直播投放-直播间下单', description: '直播间下单' },
{ id: 'QC_LIVE_CHECK', name: 'QC_LIVE_CHECK', label: '千川：直播投放-直播间结算', description: '直播间结算' },
{ id: 'QC_LIVE_COMMENTS', name: 'QC_LIVE_COMMENTS', label: '千川：直播投放-直播间评论', description: '直播间评论' },
@@ -232,6 +232,7 @@ const PreTest: React.FC = () => {
const [submitLoading, setSubmitLoading] = useState(false);
const [currentPage, setCurrentPage] = useState(1);
const [pageSize, setPageSize] = useState(10);
const [platform, setPlatform] = useState<string>('AD');
useEffect(() => {
loadRecords();
@@ -258,12 +259,14 @@ const PreTest: React.FC = () => {
const handleOpenModal = () => {
form.resetFields();
setPlatform('AD');
setModalOpen(true);
};
const handleCloseModal = () => {
setModalOpen(false);
form.resetFields();
setPlatform('AD');
};
const handleSubmit = async () => {
@@ -272,9 +275,23 @@ const PreTest: React.FC = () => {
setSubmitLoading(true);
const result = await createPreTest({
templateName: values.templateName,
selectedFields: values.selectedFields,
status: values.status,
name: values.name,
note: values.note,
platform: values.platform,
external_action: values.external_action,
cpa_bid: values.cpa_bid || 0,
audience_gender: values.audience_gender,
audience_age: values.audience_age || [],
audience_region: values.audience_region || [],
audience_network: values.audience_network || [],
cus_name: values.cus_name,
pricing_type: values.pricing_type,
cost_cap: values.cost_cap || false,
target_cost: values.target_cost || false,
nobid: values.nobid || false,
cpc_bid: values.cpc_bid || 0,
budget: values.budget || 0,
is_default: values.is_default || false,
});
message.success('前测模板创建成功');
@@ -364,7 +381,7 @@ const PreTest: React.FC = () => {
onOk={handleSubmit}
okText="提交"
cancelText="取消"
width={520}
width={720}
confirmLoading={submitLoading}
style={{ borderRadius: 16 }}
>
@@ -374,7 +391,7 @@ const PreTest: React.FC = () => {
style={{ marginTop: 16 }}
>
<Form.Item
name="templateName"
name="name"
label="模板名称"
rules={[{ required: true, message: '请输入模板名称' }]}
>
@@ -385,7 +402,38 @@ const PreTest: React.FC = () => {
</Form.Item>
<Form.Item
name="selectedFields"
name="note"
label="备注"
>
<Input.TextArea
placeholder="请输入备注"
rows={3}
style={{ borderRadius: 8 }}
/>
</Form.Item>
<Form.Item
name="platform"
label="平台"
initialValue="AD"
rules={[{ required: true, message: '请选择平台' }]}
>
<Select
placeholder="请选择平台"
style={{ borderRadius: 8, height: 40 }}
onChange={(value) => {
setPlatform(value);
}}
options={[
{ value: 'AD', label: 'AD' },
{ value: 'QIANCHUAN', label: '千川' },
{ value: 'LOCAL', label: '本地推' },
]}
/>
</Form.Item>
<Form.Item
name="external_action"
label="前测字段"
rules={[{ required: true, message: '请选择前测字段' }]}
>
@@ -394,7 +442,16 @@ const PreTest: React.FC = () => {
placeholder="请选择前测字段（可多选）"
style={{ borderRadius: 8, minHeight: 40 }}
maxTagCount="responsive"
options={PRETEST_FIELDS.map(field => ({
options={PRETEST_FIELDS.filter(field => {
if (platform === 'AD') {
return field.name.startsWith('AD_');
} else if (platform === 'QIANCHUAN') {
return field.name.startsWith('QC_');
} else if (platform === 'LOCAL') {
return field.name.startsWith('LOCAL_');
}
return true;
}).map(field => ({
value: field.name,
label: (
<span>
@@ -411,16 +468,205 @@ const PreTest: React.FC = () => {
</Form.Item>
<Form.Item
name="status"
label="状态"
initialValue="pending"
name="cpa_bid"
label="目标转化成本"
rules={[
{ type: 'number', min: 1, max: 10000, message: '取值范围: 1-10000' },
]}
>
<Input
type="number"
placeholder="取值范围: 1-10000，精确到小数点后2位"
style={{ borderRadius: 8, height: 40 }}
min={1}
max={10000}
step={0.01}
/>
</Form.Item>
<Form.Item
name="audience_gender"
label="受众性别"
>
<Select
placeholder="请选择状态"
placeholder="请选择受众性别"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: 'pending', label: '待测试' },
{ value: 'testing', label: '测试中' },
{ value: 'ALL', label: '不限' },
{ value: 'MALE', label: '男' },
{ value: 'FEMALE', label: '女' },
]}
/>
</Form.Item>
<Form.Item
name="audience_age"
label="受众年龄"
>
<Select
mode="multiple"
placeholder="请选择受众年龄（可多选）"
style={{ borderRadius: 8, minHeight: 40 }}
maxTagCount="responsive"
options={[
{ value: 'ALL', label: '不限' },
{ value: '18-23', label: '18-23岁' },
{ value: '24-30', label: '24-30岁' },
{ value: '31-40', label: '31-40岁' },
{ value: '41-49', label: '41-49岁' },
{ value: '50', label: '50岁以上' },
]}
/>
</Form.Item>
<Form.Item
name="audience_region"
label="受众地区"
>
<Select
mode="multiple"
placeholder="请选择受众地区（可多选）"
style={{ borderRadius: 8, minHeight: 40 }}
maxTagCount="responsive"
options={[
{ value: 110000, label: '北京市' },
{ value: 310000, label: '上海市' },
{ value: 440000, label: '广东省' },
{ value: 330000, label: '浙江省' },
{ value: 320000, label: '江苏省' },
{ value: 510000, label: '四川省' },
{ value: 420000, label: '湖北省' },
{ value: 370000, label: '山东省' },
]}
/>
</Form.Item>
<Form.Item
name="audience_network"
label="受众网络"
>
<Select
mode="multiple"
placeholder="请选择受众网络（可多选）"
style={{ borderRadius: 8, minHeight: 40 }}
maxTagCount="responsive"
options={[
{ value: 'ALL', label: '不限' },
{ value: '5G', label: '5G' },
{ value: '4G', label: '4G' },
{ value: '3G', label: '3G' },
{ value: '2G', label: '2G' },
{ value: 'WIFI', label: 'wifi' },
]}
/>
</Form.Item>
<Form.Item
name="cus_name"
label="自定义名称"
>
<Input
placeholder="请输入自定义名称"
style={{ borderRadius: 8, height: 40 }}
/>
</Form.Item>
{platform == 'AD' && (
<>
<Form.Item
name="pricing_type"
label="计费方式"
>
<Select
placeholder="请选择计费方式"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: 'OCPC', label: 'OCPC' },
{ value: 'CPA', label: 'CPA' },
{ value: 'OCPM', label: 'OCPM' },
]}
/>
</Form.Item>
<Form.Item
name="cost_cap"
label="成本上限"
valuePropName="checked"
>
<Select
placeholder="请选择成本上限"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: true, label: '开启' },
{ value: false, label: '关闭' },
]}
/>
</Form.Item>
<Form.Item
name="target_cost"
label="目标成本"
valuePropName="checked"
>
<Select
placeholder="请选择目标成本"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: true, label: '开启' },
{ value: false, label: '关闭' },
]}
/>
</Form.Item>
<Form.Item
name="nobid"
label="无出价"
valuePropName="checked"
>
<Select
placeholder="请选择无出价"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: true, label: '开启' },
{ value: false, label: '关闭' },
]}
/>
</Form.Item>
</>
)}
<Form.Item
name="cpc_bid"
label="CPC出价"
>
<Input
type="number"
placeholder="请输入CPC出价"
style={{ borderRadius: 8, height: 40 }}
/>
</Form.Item>
<Form.Item
name="budget"
label="预算金额"
>
<Input
type="number"
placeholder="请输入预算金额"
style={{ borderRadius: 8, height: 40 }}
/>
</Form.Item>
<Form.Item
name="is_default"
label="默认模板"
initialValue={false}
valuePropName="checked"
>
<Select
placeholder="请选择默认模板"
style={{ borderRadius: 8, height: 40 }}
options={[
{ value: true, label: '是' },
{ value: false, label: '否' },
]}
/>
</Form.Item>