|
|
@@ -23,15 +23,8 @@
|
|
|
|
|
|
<el-table border v-loading="loading" :data="siteList">
|
|
|
<el-table-column label="ID" align="center" prop="id" width="80" />
|
|
|
- <el-table-column label="站点名称" align="center" prop="siteName" width="150" show-overflow-tooltip />
|
|
|
- <el-table-column label="站点地址" align="center" prop="siteUrl" width="180" show-overflow-tooltip />
|
|
|
+ <el-table-column label="站点名称" align="center" prop="siteName" min-width="150" show-overflow-tooltip />
|
|
|
<el-table-column label="投放类型" align="center" prop="launchType" width="100" />
|
|
|
- <el-table-column label="广告类型" align="center" prop="adType" width="120" />
|
|
|
- <el-table-column label="投放广告商" align="center" prop="advertiserName" width="150" show-overflow-tooltip />
|
|
|
- <el-table-column label="投放广告商账号" align="center" prop="promotionAccountName" width="150" show-overflow-tooltip />
|
|
|
- <el-table-column label="投放页面" align="center" prop="launchPageName" width="150" show-overflow-tooltip />
|
|
|
- <el-table-column label="来源" align="center" prop="sourceName" width="120" show-overflow-tooltip />
|
|
|
- <el-table-column label="投放域名" align="center" prop="launchDomain" width="150" show-overflow-tooltip />
|
|
|
<el-table-column label="配置回传" align="center" prop="configCallback" width="100">
|
|
|
<template slot-scope="scope">
|
|
|
<el-tag :type="scope.row.configCallback === 1 ? 'success' : 'info'" size="small">
|
|
|
@@ -39,14 +32,26 @@
|
|
|
</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="回传账号" align="center" prop="callbackAccountName" width="150" show-overflow-tooltip />
|
|
|
+ <el-table-column label="站点状态" align="center" prop="status" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag :type="scope.row.status === 1 ? 'success' : 'info'" size="small">
|
|
|
+ {{ scope.row.status === 1 ? '启用' : '停用' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
|
|
<template slot-scope="scope">
|
|
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="280" fixed="right">
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="360" fixed="right">
|
|
|
<template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-view"
|
|
|
+ @click="handleDetail(scope.row)"
|
|
|
+ >详情</el-button>
|
|
|
<el-button
|
|
|
size="mini"
|
|
|
type="text"
|
|
|
@@ -59,6 +64,12 @@
|
|
|
icon="el-icon-data-line"
|
|
|
@click="handleStatistics(scope.row)"
|
|
|
>统计</el-button>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ :icon="scope.row.status === 1 ? 'el-icon-video-pause' : 'el-icon-video-play'"
|
|
|
+ @click="handleEnable(scope.row)"
|
|
|
+ >{{ scope.row.status === 1 ? '停用' : '启用' }}</el-button>
|
|
|
<el-button
|
|
|
size="mini"
|
|
|
type="text"
|
|
|
@@ -84,6 +95,7 @@
|
|
|
placeholder="请输入站点名称"
|
|
|
prefix-icon="el-icon-notebook-2"
|
|
|
clearable
|
|
|
+ :disabled="isDetail"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
@@ -100,6 +112,8 @@
|
|
|
placeholder="请选择投放类型"
|
|
|
style="width: 100%"
|
|
|
prefix-icon="el-icon-s-flag"
|
|
|
+ @change="handleLaunchTypeChange"
|
|
|
+ :disabled="isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in launchTypeOptions"
|
|
|
@@ -114,6 +128,7 @@
|
|
|
v-model="form.adType"
|
|
|
placeholder="请选择广告类型"
|
|
|
style="width: 100%"
|
|
|
+ :disabled="isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in adTypeOptions"
|
|
|
@@ -134,10 +149,11 @@
|
|
|
<el-form-item label="投放广告商" prop="advertiserId">
|
|
|
<el-select
|
|
|
v-model="form.advertiserId"
|
|
|
- placeholder="请选择投放广告商"
|
|
|
+ placeholder="请先选择投放类型"
|
|
|
style="width: 100%"
|
|
|
@change="handleAdvertiserChange"
|
|
|
filterable
|
|
|
+ :disabled="!form.launchType || isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in advertiserList"
|
|
|
@@ -154,7 +170,7 @@
|
|
|
style="width: 100%"
|
|
|
@change="handlePromotionAccountChange"
|
|
|
filterable
|
|
|
- :disabled="!form.advertiserId"
|
|
|
+ :disabled="!form.advertiserId || isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in promotionAccountList"
|
|
|
@@ -179,6 +195,7 @@
|
|
|
style="width: 100%"
|
|
|
@change="handleLaunchPageChange"
|
|
|
filterable
|
|
|
+ :disabled="isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in landingPageTemplateList"
|
|
|
@@ -194,6 +211,7 @@
|
|
|
placeholder="请选择投放域名"
|
|
|
style="width: 100%"
|
|
|
filterable
|
|
|
+ :disabled="isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in launchDomainList"
|
|
|
@@ -203,22 +221,7 @@
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="来源" prop="sourceId">
|
|
|
- <el-select
|
|
|
- v-model="form.sourceId"
|
|
|
- placeholder="请选择来源"
|
|
|
- style="width: 100%"
|
|
|
- @change="handleSourceChange"
|
|
|
- filterable
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in leadSourceList"
|
|
|
- :key="item.id"
|
|
|
- :label="item.sourceName"
|
|
|
- :value="item.id"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
+
|
|
|
</div>
|
|
|
|
|
|
<!-- 回传配置 -->
|
|
|
@@ -228,7 +231,7 @@
|
|
|
<span>回传配置</span>
|
|
|
</div>
|
|
|
<el-form-item label="是否配置回传" prop="configCallback">
|
|
|
- <el-radio-group v-model="form.configCallback">
|
|
|
+ <el-radio-group v-model="form.configCallback" @change="handleConfigCallbackChange" :disabled="isDetail">
|
|
|
<el-radio
|
|
|
v-for="item in configCallbackOptions"
|
|
|
:key="item.value"
|
|
|
@@ -249,20 +252,122 @@
|
|
|
style="width: 100%"
|
|
|
@change="handleCallbackAccountChange"
|
|
|
filterable
|
|
|
+ :disabled="isDetail"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in callbackAccountList"
|
|
|
:key="item.id"
|
|
|
- :label="item.callbackAccountName"
|
|
|
+ :label="item.accountName"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+
|
|
|
+ <!-- 转换类型配置区域 -->
|
|
|
+ <div v-if="form.configCallback === 1 && form.callbackAccountId" class="conversion-config-section">
|
|
|
+ <div class="config-header">
|
|
|
+ <span class="config-title">转换类型配置</span>
|
|
|
+ <el-button type="primary" size="small" icon="el-icon-plus" @click="addConversionEvent">添加事件</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="conversionEvents.length === 0" class="empty-tip">
|
|
|
+ 暂无转换事件,请点击“添加事件”按钮添加
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-for="(event, index) in conversionEvents" :key="index" class="conversion-event-item">
|
|
|
+ <div class="event-header">
|
|
|
+ <span class="event-title">事件{{ index + 1 }}</span>
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="mini"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ circle
|
|
|
+ @click="removeConversionEvent(index)"
|
|
|
+ ></el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-form label-width="130px" style="margin-top: 10px;">
|
|
|
+ <el-form-item label="广告商转化类型">
|
|
|
+ <el-select
|
|
|
+ v-model="event.advertiserEventType"
|
|
|
+ placeholder="请选择广告商转化类型"
|
|
|
+ style="width: 100%"
|
|
|
+ @change="handleAdvertiserEventChange(index, $event)"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in advertiserEventOptions"
|
|
|
+ :key="item.eventType"
|
|
|
+ :label="item.eventName"
|
|
|
+ :value="item.eventType"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="回传数据类型">
|
|
|
+ <el-select
|
|
|
+ v-model="event.systemEventType"
|
|
|
+ placeholder="请选择回传数据类型"
|
|
|
+ style="width: 100%"
|
|
|
+ @change="handleSystemEventChange(index, $event)"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in systemEventOptions"
|
|
|
+ :key="item.eventType"
|
|
|
+ :label="item.eventName"
|
|
|
+ :value="item.eventType"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="cancel">取 消</el-button>
|
|
|
- <el-button type="primary" @click="submitForm" icon="el-icon-check">确 定</el-button>
|
|
|
+ <el-button v-if="!isDetail" type="primary" @click="submitForm" icon="el-icon-check">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 站点详情对话框 -->
|
|
|
+ <el-dialog title="站点详情" :visible.sync="detailOpen" width="900px" append-to-body>
|
|
|
+ <el-descriptions :column="2" border>
|
|
|
+ <el-descriptions-item label="站点名称">{{ detail.siteName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="站点URL" :span="2">{{ detail.siteUrl || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="投放类型">{{ detail.launchType || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="广告类型">{{ detail.adType || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="运营部门">{{ detail.operationDept || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="负责人">{{ detail.manager || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="广告商名称" :span="2">{{ detail.advertiserName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="推广账户名称" :span="2">{{ detail.promotionAccountName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="投放页面名称" :span="2">{{ detail.launchPageName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="投放域名" :span="2">{{ detail.launchDomain || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="分配方式">
|
|
|
+ <span v-if="detail.distributeType === 1">手动分配</span>
|
|
|
+ <span v-else-if="detail.distributeType === 2">自动分配</span>
|
|
|
+ <span v-else>-</span>
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="分配规则">{{ detail.distributeRule || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="来源名称">{{ detail.sourceName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="项目名称">{{ detail.projectName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="配置回传">
|
|
|
+ <el-tag :type="detail.configCallback === 1 ? 'success' : 'info'" size="small">
|
|
|
+ {{ detail.configCallback === 1 ? '是' : '否' }}
|
|
|
+ </el-tag>
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="回传账号名称">{{ detail.callbackAccountName || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="站点状态">
|
|
|
+ <el-tag :type="detail.status === 1 ? 'success' : 'info'" size="small">
|
|
|
+ {{ detail.status === 1 ? '启用' : '停用' }}
|
|
|
+ </el-tag>
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="创建人">{{ detail.creator || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="创建时间">{{ parseTime(detail.createTime) || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="更新人">{{ detail.updater || '-' }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="更新时间" :span="2">{{ parseTime(detail.updateTime) || '-' }}</el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="detailOpen = false">关 闭</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
|
|
|
@@ -289,12 +394,12 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { listSite, getSite, addSite, updateSite, delSite, getSiteStatistics } from "@/api/adv/site";
|
|
|
+import { listSite, getSite, addSite, updateSite, delSite, getSiteStatistics, enableSite } from "@/api/adv/site";
|
|
|
import { pageAdvertiser } from "@/api/adv/advertiser";
|
|
|
import { pagePromotionAccount } from "@/api/adv/promotionAccount";
|
|
|
import { pageTemplate } from "@/api/adv/landingPageTemplate";
|
|
|
-import { pageLeadSource } from "@/api/adv/leadSource";
|
|
|
-import { pageCallbackAccount } from "@/api/adv/callbackAccount";
|
|
|
+
|
|
|
+import { pageCallbackAccount, getCallbackAccount, queryEventType, saveEventType } from "@/api/adv/callbackAccount";
|
|
|
import { pageDomain } from "@/api/adv/domain";
|
|
|
|
|
|
export default {
|
|
|
@@ -309,6 +414,12 @@ export default {
|
|
|
title: "",
|
|
|
// 是否显示弹出层
|
|
|
open: false,
|
|
|
+ // 是否为详情模式(只读)
|
|
|
+ isDetail: false,
|
|
|
+ // 是否显示详情对话框
|
|
|
+ detailOpen: false,
|
|
|
+ // 详情数据
|
|
|
+ detail: {},
|
|
|
// 是否显示统计弹出层
|
|
|
statisticsOpen: false,
|
|
|
// 统计数据
|
|
|
@@ -317,8 +428,8 @@ export default {
|
|
|
form: {},
|
|
|
// 投放类型选项
|
|
|
launchTypeOptions: [
|
|
|
- { label: "线上投放", value: "线上投放" },
|
|
|
- { label: "线下投放", value: "线下投放" }
|
|
|
+ { label: "线上投放", value: 1 },
|
|
|
+ { label: "线下投放", value: 2 }
|
|
|
],
|
|
|
// 广告类型选项
|
|
|
adTypeOptions: [
|
|
|
@@ -335,12 +446,17 @@ export default {
|
|
|
promotionAccountList: [],
|
|
|
// 落地页模板列表
|
|
|
landingPageTemplateList: [],
|
|
|
- // 线索来源列表
|
|
|
- leadSourceList: [],
|
|
|
+
|
|
|
// 回传账号列表
|
|
|
callbackAccountList: [],
|
|
|
// 投放域名列表
|
|
|
launchDomainList: [],
|
|
|
+ // 转换事件列表
|
|
|
+ conversionEvents: [],
|
|
|
+ // 广告商事件选项(systemBuiltin='0')
|
|
|
+ advertiserEventOptions: [],
|
|
|
+ // 系统事件选项(systemBuiltin='1')
|
|
|
+ systemEventOptions: [],
|
|
|
// 表单校验
|
|
|
rules: {
|
|
|
siteName: [
|
|
|
@@ -364,9 +480,7 @@ export default {
|
|
|
launchPageId: [
|
|
|
{ required: true, message: "请选择投放页面", trigger: "change" }
|
|
|
],
|
|
|
- sourceId: [
|
|
|
- { required: true, message: "请选择来源", trigger: "change" }
|
|
|
- ],
|
|
|
+
|
|
|
launchDomain: [
|
|
|
{ required: true, message: "请选择投放域名", trigger: "change" }
|
|
|
],
|
|
|
@@ -419,8 +533,7 @@ export default {
|
|
|
promotionAccountName: undefined,
|
|
|
launchPageId: undefined,
|
|
|
launchPageName: undefined,
|
|
|
- sourceId: undefined,
|
|
|
- sourceName: undefined,
|
|
|
+
|
|
|
launchDomain: undefined,
|
|
|
configCallback: 0,
|
|
|
callbackAccountId: undefined,
|
|
|
@@ -428,24 +541,44 @@ export default {
|
|
|
};
|
|
|
this.promotionAccountList = [];
|
|
|
this.launchDomainList = [];
|
|
|
+ this.conversionEvents = [];
|
|
|
+ this.advertiserEventOptions = [];
|
|
|
+ this.systemEventOptions = [];
|
|
|
this.resetForm("form");
|
|
|
},
|
|
|
/** 新增按钮操作 */
|
|
|
handleAdd() {
|
|
|
this.reset();
|
|
|
- this.loadSelectOptions();
|
|
|
+ // 不再预加载广告商列表,等待选择投放类型后再加载
|
|
|
+ this.loadCommonSelectOptions();
|
|
|
+ this.isDetail = false;
|
|
|
this.open = true;
|
|
|
this.title = "添加站点";
|
|
|
},
|
|
|
/** 修改按钮操作 */
|
|
|
handleUpdate(row) {
|
|
|
this.reset();
|
|
|
- this.loadSelectOptions();
|
|
|
+ this.loadCommonSelectOptions();
|
|
|
+ this.isDetail = false;
|
|
|
getSite(row.id).then(response => {
|
|
|
this.form = response.data;
|
|
|
+ // 根据投放类型加载广告商列表
|
|
|
+ if (this.form.launchType) {
|
|
|
+ this.loadAdvertiserList(this.form.launchType);
|
|
|
+ }
|
|
|
// 如果有广告商ID,加载对应的广告商账号列表
|
|
|
if (this.form.advertiserId) {
|
|
|
this.loadPromotionAccountList(this.form.advertiserId);
|
|
|
+
|
|
|
+ // 如果配置了回传,加载回传账号列表
|
|
|
+ if (this.form.configCallback === 1) {
|
|
|
+ this.loadCallbackAccountList(this.form.advertiserId);
|
|
|
+
|
|
|
+ // 如果有回传账号,加载事件类型和转换事件
|
|
|
+ if (this.form.callbackAccountId) {
|
|
|
+ this.loadEventTypesAndConversionEvents(this.form.advertiserId, this.form.callbackAccountId);
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
this.open = true;
|
|
|
this.title = "修改站点";
|
|
|
@@ -453,32 +586,60 @@ export default {
|
|
|
},
|
|
|
/** 查看统计按钮操作 */
|
|
|
handleStatistics(row) {
|
|
|
- this.statistics = null;
|
|
|
- this.statisticsOpen = true;
|
|
|
- getSiteStatistics(row.id).then(response => {
|
|
|
- this.statistics = response.data;
|
|
|
- }).catch(() => {
|
|
|
- this.statistics = null;
|
|
|
+ this.$router.push({
|
|
|
+ path: '/adv/statistics',
|
|
|
+ query: { siteId: row.id }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 详情按钮操作 */
|
|
|
+ handleDetail(row) {
|
|
|
+ this.detail = {};
|
|
|
+ this.detailOpen = true;
|
|
|
+ getSite(row.id).then(response => {
|
|
|
+ this.detail = response.data;
|
|
|
});
|
|
|
},
|
|
|
/** 提交按钮 */
|
|
|
submitForm() {
|
|
|
this.$refs["form"].validate(valid => {
|
|
|
if (valid) {
|
|
|
+ // 如果配置了回传且有转换事件,校验转换事件
|
|
|
+ if (this.form.configCallback === 1 && this.form.callbackAccountId && this.conversionEvents.length > 0) {
|
|
|
+ for (let i = 0; i < this.conversionEvents.length; i++) {
|
|
|
+ const event = this.conversionEvents[i];
|
|
|
+ if (!event.systemEventType || !event.advertiserEventType) {
|
|
|
+ this.msgError(`请完善事件${i + 1}的配置`);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
if (this.form.id != undefined) {
|
|
|
+ // 修改
|
|
|
updateSite(this.form.id, this.form).then(response => {
|
|
|
if (response.code === 200) {
|
|
|
- this.msgSuccess("修改成功");
|
|
|
- this.open = false;
|
|
|
- this.getList();
|
|
|
+ // 如果配置了回传,保存转换事件
|
|
|
+ if (this.form.configCallback === 1 && this.form.callbackAccountId) {
|
|
|
+ this.saveConversionEvents();
|
|
|
+ } else {
|
|
|
+ this.msgSuccess("修改成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ }
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
+ // 新增
|
|
|
addSite(this.form).then(response => {
|
|
|
if (response.code === 200) {
|
|
|
- this.msgSuccess("新增成功");
|
|
|
- this.open = false;
|
|
|
- this.getList();
|
|
|
+ // 如果配置了回传,保存转换事件
|
|
|
+ if (this.form.configCallback === 1 && this.form.callbackAccountId) {
|
|
|
+ this.saveConversionEvents();
|
|
|
+ } else {
|
|
|
+ this.msgSuccess("新增成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ }
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
@@ -498,9 +659,23 @@ export default {
|
|
|
this.msgSuccess("删除成功");
|
|
|
}).catch(function() {});
|
|
|
},
|
|
|
+ /** 启用/停用按钮操作 */
|
|
|
+ handleEnable(row) {
|
|
|
+ const statusText = row.status === 1 ? '停用' : '启用';
|
|
|
+ this.$confirm(`是否确认${statusText}站点"${row.siteName}"?`, "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(() => {
|
|
|
+ return enableSite(row.id);
|
|
|
+ }).then(() => {
|
|
|
+ this.getList();
|
|
|
+ this.msgSuccess(`${statusText}成功`);
|
|
|
+ }).catch(function() {});
|
|
|
+ },
|
|
|
/** 加载下拉选项数据 */
|
|
|
loadSelectOptions() {
|
|
|
- // 加载广告商列表
|
|
|
+ // 加载广告商列表(已废弃,改用loadAdvertiserList)
|
|
|
pageAdvertiser({ pageNum: 1, pageSize: 1000 }).then(response => {
|
|
|
this.advertiserList = response.data.records;
|
|
|
}).catch(error => {
|
|
|
@@ -516,20 +691,22 @@ export default {
|
|
|
this.landingPageTemplateList = [];
|
|
|
});
|
|
|
|
|
|
- // 加载线索来源列表
|
|
|
- pageLeadSource({ pageNum: 1, pageSize: 1000 }).then(response => {
|
|
|
- this.leadSourceList = response.data.records;
|
|
|
+ // 加载域名列表
|
|
|
+ pageDomain({ pageNum: 1, pageSize: 1000, status: 1 }).then(response => {
|
|
|
+ this.launchDomainList = response.data.records;
|
|
|
}).catch(error => {
|
|
|
- console.error('加载线索来源失败:', error);
|
|
|
- this.leadSourceList = [];
|
|
|
+ console.error('加载域名失败:', error);
|
|
|
+ this.launchDomainList = [];
|
|
|
});
|
|
|
-
|
|
|
- // 加载回传账号列表
|
|
|
- pageCallbackAccount({ pageNum: 1, pageSize: 1000 }).then(response => {
|
|
|
- this.callbackAccountList = response.data.records;
|
|
|
+ },
|
|
|
+ /** 加载公共下拉选项数据(不包含广告商) */
|
|
|
+ loadCommonSelectOptions() {
|
|
|
+ // 加载落地页模板列表
|
|
|
+ pageTemplate({ pageNum: 1, pageSize: 1000, status: 1 }).then(response => {
|
|
|
+ this.landingPageTemplateList = response.data.records;
|
|
|
}).catch(error => {
|
|
|
- console.error('加载回传账号失败:', error);
|
|
|
- this.callbackAccountList = [];
|
|
|
+ console.error('加载落地页模板失败:', error);
|
|
|
+ this.landingPageTemplateList = [];
|
|
|
});
|
|
|
|
|
|
// 加载域名列表
|
|
|
@@ -540,6 +717,47 @@ export default {
|
|
|
this.launchDomainList = [];
|
|
|
});
|
|
|
},
|
|
|
+ /** 投放类型变化时 */
|
|
|
+ handleLaunchTypeChange(launchType) {
|
|
|
+ // 重置广告商相关数据
|
|
|
+ this.form.advertiserId = undefined;
|
|
|
+ this.form.advertiserName = "";
|
|
|
+ this.form.promotionAccountId = undefined;
|
|
|
+ this.form.promotionAccountName = "";
|
|
|
+ this.advertiserList = [];
|
|
|
+ this.promotionAccountList = [];
|
|
|
+
|
|
|
+ // 重置回传账号相关数据
|
|
|
+ this.form.callbackAccountId = undefined;
|
|
|
+ this.form.callbackAccountName = "";
|
|
|
+ this.callbackAccountList = [];
|
|
|
+ this.conversionEvents = [];
|
|
|
+ this.advertiserEventOptions = [];
|
|
|
+ this.systemEventOptions = [];
|
|
|
+
|
|
|
+ // 根据投放类型加载广告商列表
|
|
|
+ if (launchType) {
|
|
|
+ this.loadAdvertiserList(launchType);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 加载广告商列表 */
|
|
|
+ loadAdvertiserList(launchType) {
|
|
|
+ if (!launchType) return;
|
|
|
+ // launchType: 1=线上投放, 2=线下投放
|
|
|
+ // custom: 1=线上广告商, 2=自定义广告商
|
|
|
+ const customValue = launchType; // launchType值直接对应custom值
|
|
|
+ pageAdvertiser({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 1000,
|
|
|
+ enabled: 1,
|
|
|
+ custom: customValue
|
|
|
+ }).then(response => {
|
|
|
+ this.advertiserList = response.data.records;
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('加载广告商列表失败:', error);
|
|
|
+ this.advertiserList = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
/** 广告商变化时 */
|
|
|
handleAdvertiserChange(advertiserId) {
|
|
|
this.form.advertiserName = "";
|
|
|
@@ -547,6 +765,11 @@ export default {
|
|
|
this.form.promotionAccountName = "";
|
|
|
this.promotionAccountList = [];
|
|
|
|
|
|
+ // 重置回传账号相关数据
|
|
|
+ this.form.callbackAccountId = undefined;
|
|
|
+ this.form.callbackAccountName = "";
|
|
|
+ this.callbackAccountList = [];
|
|
|
+
|
|
|
if (advertiserId) {
|
|
|
const advertiser = this.advertiserList.find(item => item.id === advertiserId);
|
|
|
if (advertiser) {
|
|
|
@@ -554,6 +777,11 @@ export default {
|
|
|
}
|
|
|
// 加载对应的广告商账号列表
|
|
|
this.loadPromotionAccountList(advertiserId);
|
|
|
+
|
|
|
+ // 如果已选择配置回传,加载回传账号列表
|
|
|
+ if (this.form.configCallback === 1) {
|
|
|
+ this.loadCallbackAccountList(advertiserId);
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
/** 加载广告商账号列表 */
|
|
|
@@ -587,25 +815,124 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- /** 线索来源变化时 */
|
|
|
- handleSourceChange(sourceId) {
|
|
|
- this.form.sourceName = "";
|
|
|
- if (sourceId) {
|
|
|
- const source = this.leadSourceList.find(item => item.id === sourceId);
|
|
|
- if (source) {
|
|
|
- this.form.sourceName = source.sourceName;
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
+
|
|
|
/** 回传账号变化时 */
|
|
|
handleCallbackAccountChange(callbackAccountId) {
|
|
|
this.form.callbackAccountName = "";
|
|
|
+ this.conversionEvents = [];
|
|
|
+ this.advertiserEventOptions = [];
|
|
|
+ this.systemEventOptions = [];
|
|
|
+
|
|
|
if (callbackAccountId) {
|
|
|
const account = this.callbackAccountList.find(item => item.id === callbackAccountId);
|
|
|
if (account) {
|
|
|
- this.form.callbackAccountName = account.callbackAccountName;
|
|
|
+ this.form.callbackAccountName = account.accountName;
|
|
|
+ // 加载事件类型和转换事件
|
|
|
+ this.loadEventTypesAndConversionEvents(this.form.advertiserId, callbackAccountId);
|
|
|
}
|
|
|
}
|
|
|
+ },
|
|
|
+ /** 配置回传变化时 */
|
|
|
+ handleConfigCallbackChange(value) {
|
|
|
+ // 重置回传账号
|
|
|
+ this.form.callbackAccountId = undefined;
|
|
|
+ this.form.callbackAccountName = "";
|
|
|
+ this.callbackAccountList = [];
|
|
|
+ this.conversionEvents = [];
|
|
|
+ this.advertiserEventOptions = [];
|
|
|
+ this.systemEventOptions = [];
|
|
|
+
|
|
|
+ // 如果选择配置回传,且已选择广告商,加载回传账号列表
|
|
|
+ if (value === 1 && this.form.advertiserId) {
|
|
|
+ this.loadCallbackAccountList(this.form.advertiserId);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 加载回传账号列表 */
|
|
|
+ loadCallbackAccountList(advertiserId) {
|
|
|
+ if (!advertiserId) return;
|
|
|
+ pageCallbackAccount({ pageNum: 1, pageSize: 1000, advertiserId: advertiserId }).then(response => {
|
|
|
+ this.callbackAccountList = response.data.records;
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('加载回传账号列表失败:', error);
|
|
|
+ this.callbackAccountList = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 加载事件类型和转换事件 */
|
|
|
+ loadEventTypesAndConversionEvents(advertiserId, callbackAccountId) {
|
|
|
+ // 加载事件类型选项
|
|
|
+ queryEventType(advertiserId).then(response => {
|
|
|
+ const eventTypes = response.data || [];
|
|
|
+ // systemBuiltin='0' 为广告商事件
|
|
|
+ this.advertiserEventOptions = eventTypes.filter(item => item.systemBuiltin === '0');
|
|
|
+ // systemBuiltin='1' 为系统事件
|
|
|
+ this.systemEventOptions = eventTypes.filter(item => item.systemBuiltin === '1');
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('加载事件类型失败:', error);
|
|
|
+ });
|
|
|
+
|
|
|
+ // 加载已有的转换事件
|
|
|
+ getCallbackAccount(callbackAccountId).then(response => {
|
|
|
+ const account = response.data;
|
|
|
+ this.parseConversionEvents(account.conversionEvent);
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('加载回传账号详情失败:', error);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 解析转换事件 */
|
|
|
+ parseConversionEvents(conversionEvent) {
|
|
|
+ try {
|
|
|
+ if (conversionEvent && typeof conversionEvent === 'string') {
|
|
|
+ this.conversionEvents = JSON.parse(conversionEvent);
|
|
|
+ } else if (Array.isArray(conversionEvent)) {
|
|
|
+ this.conversionEvents = conversionEvent;
|
|
|
+ } else {
|
|
|
+ this.conversionEvents = [];
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('解析转换事件失败:', error);
|
|
|
+ this.conversionEvents = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 添加转换事件 */
|
|
|
+ addConversionEvent() {
|
|
|
+ this.conversionEvents.push({
|
|
|
+ systemEventType: '',
|
|
|
+ systemEventTypeName: '',
|
|
|
+ advertiserEventType: '',
|
|
|
+ advertiserEventName: ''
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 删除转换事件 */
|
|
|
+ removeConversionEvent(index) {
|
|
|
+ this.conversionEvents.splice(index, 1);
|
|
|
+ },
|
|
|
+ /** 广告商事件变化 */
|
|
|
+ handleAdvertiserEventChange(index, eventType) {
|
|
|
+ const event = this.advertiserEventOptions.find(item => item.eventType === eventType);
|
|
|
+ if (event) {
|
|
|
+ this.conversionEvents[index].advertiserEventName = event.eventName;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 系统事件变化 */
|
|
|
+ handleSystemEventChange(index, eventType) {
|
|
|
+ const event = this.systemEventOptions.find(item => item.eventType === eventType);
|
|
|
+ if (event) {
|
|
|
+ this.conversionEvents[index].systemEventTypeName = event.eventName;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 保存转换事件 */
|
|
|
+ saveConversionEvents() {
|
|
|
+ // 调用保存接口
|
|
|
+ saveEventType(this.form.callbackAccountId, this.conversionEvents).then(response => {
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.msgSuccess('保存成功');
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('保存失败:', error);
|
|
|
+ this.msgError('保存失败');
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
@@ -869,5 +1196,62 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+// 转换类型配置区域样式
|
|
|
+.conversion-config-section {
|
|
|
+ margin-top: 20px;
|
|
|
+ padding: 20px;
|
|
|
+ background: #f8f9fa;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+
|
|
|
+ .config-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 15px;
|
|
|
+
|
|
|
+ .config-title {
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .empty-tip {
|
|
|
+ text-align: center;
|
|
|
+ padding: 30px 0;
|
|
|
+ color: #909399;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.conversion-event-item {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ padding: 15px;
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+ border-radius: 6px;
|
|
|
+ background-color: #fff;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
|
|
+ }
|
|
|
+
|
|
|
+ .event-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #f0f0f0;
|
|
|
+
|
|
|
+ .event-title {
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
|
|
|