|
|
@@ -43,57 +43,71 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 查询条件 -->
|
|
|
- <div class="flex flex-wrap items-center gap-4 mb-6">
|
|
|
- <!-- 时间口径 radio -->
|
|
|
- <div class="flex items-center gap-2">
|
|
|
- <span class="text-sm text-gray-600 font-medium">时间口径:</span>
|
|
|
- <el-radio-group v-model="queryForm.timeLine" @change="handleTimeLineChange">
|
|
|
- <el-radio-button value="REQUEST_TIME">请求时间</el-radio-button>
|
|
|
- <el-radio-button value="REPORTING_TIME">上报时间</el-radio-button>
|
|
|
- </el-radio-group>
|
|
|
- </div>
|
|
|
+ <div class="flex flex-col gap-3 mb-6">
|
|
|
+ <!-- 第一行:筛选控件 -->
|
|
|
+ <div class="flex flex-wrap items-center gap-4">
|
|
|
+ <!-- 时间口径 radio -->
|
|
|
+ <div class="flex items-center gap-2">
|
|
|
+ <span class="text-sm text-gray-600 font-medium">时间口径:</span>
|
|
|
+ <el-radio-group v-model="queryForm.timeLine" @change="handleTimeLineChange">
|
|
|
+ <el-radio-button value="REQUEST_TIME">请求时间</el-radio-button>
|
|
|
+ <el-radio-button value="REPORTING_TIME">上报时间</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-select
|
|
|
+ v-model="queryForm.groupId"
|
|
|
+ placeholder="账号组筛选"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ style="width: 180px"
|
|
|
+ @change="handleSearch"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="g in groupOptions"
|
|
|
+ :key="g.id"
|
|
|
+ :label="g.groupName"
|
|
|
+ :value="g.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
|
|
|
- <el-select
|
|
|
- v-model="queryForm.groupId"
|
|
|
- placeholder="账号组筛选"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- style="width: 180px"
|
|
|
- @change="handleSearch"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="g in groupOptions"
|
|
|
- :key="g.id"
|
|
|
- :label="g.groupName"
|
|
|
- :value="g.id"
|
|
|
+ <el-input
|
|
|
+ v-model="queryForm.accountId"
|
|
|
+ placeholder="账户ID筛选"
|
|
|
+ clearable
|
|
|
+ style="width: 160px"
|
|
|
+ @clear="handleSearch"
|
|
|
/>
|
|
|
- </el-select>
|
|
|
|
|
|
- <el-input
|
|
|
- v-model="queryForm.accountId"
|
|
|
- placeholder="账户ID筛选"
|
|
|
- clearable
|
|
|
- style="width: 160px"
|
|
|
- @clear="handleSearch"
|
|
|
- />
|
|
|
+ <el-input
|
|
|
+ v-model="queryForm.dynamicCreativeId"
|
|
|
+ placeholder="动态创意ID筛选"
|
|
|
+ clearable
|
|
|
+ style="width: 180px"
|
|
|
+ @clear="handleSearch"
|
|
|
+ />
|
|
|
|
|
|
- <el-date-picker
|
|
|
- v-model="queryDateRange"
|
|
|
- type="daterange"
|
|
|
- range-separator="~"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- format="YYYY-MM-DD"
|
|
|
- value-format="YYYY-MM-DD"
|
|
|
- style="width: 240px"
|
|
|
- @change="handleSearch"
|
|
|
- />
|
|
|
+ <el-date-picker
|
|
|
+ v-model="queryDateRange"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="~"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ format="YYYY-MM-DD"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ style="width: 240px"
|
|
|
+ @change="handleSearch"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
|
|
|
- <el-button type="primary" @click="handleSearch">
|
|
|
- <el-icon><Search /></el-icon>
|
|
|
- 查询
|
|
|
- </el-button>
|
|
|
- <el-button @click="handleReset">重置</el-button>
|
|
|
+ <!-- 第二行:按钮右对齐 -->
|
|
|
+ <div class="flex justify-end gap-2">
|
|
|
+ <el-button type="primary" @click="handleSearch">
|
|
|
+ <el-icon><Search /></el-icon>
|
|
|
+ 查询
|
|
|
+ </el-button>
|
|
|
+ <el-button @click="handleReset">重置</el-button>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 数据统计卡片 -->
|
|
|
@@ -233,9 +247,12 @@
|
|
|
import { ref, reactive, computed, onMounted } from 'vue'
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
import { Refresh, Search } from '@element-plus/icons-vue'
|
|
|
+import { useRoute } from 'vue-router'
|
|
|
import { syncDailyReport, getDailyReportList } from '@/api/dailyReport'
|
|
|
import { getAccountGroupListAll } from '@/api/accountGroup'
|
|
|
|
|
|
+const route = useRoute()
|
|
|
+
|
|
|
// ─── 响应式状态 ───────────────────────────────────────────────────────────────
|
|
|
const loading = ref(false)
|
|
|
const syncing = ref(false)
|
|
|
@@ -251,6 +268,7 @@ const queryForm = reactive({
|
|
|
timeLine: 'REQUEST_TIME',
|
|
|
accountId: '',
|
|
|
groupId: null,
|
|
|
+ dynamicCreativeId: '',
|
|
|
})
|
|
|
const getDefaultDateRange = () => {
|
|
|
const end = new Date()
|
|
|
@@ -284,6 +302,7 @@ const loadList = async () => {
|
|
|
}
|
|
|
if (queryForm.accountId) params.accountId = queryForm.accountId
|
|
|
if (queryForm.groupId) params.groupId = queryForm.groupId
|
|
|
+ if (queryForm.dynamicCreativeId) params.dynamicCreativeId = queryForm.dynamicCreativeId
|
|
|
if (queryDateRange.value && queryDateRange.value.length === 2) {
|
|
|
params.startDate = queryDateRange.value[0]
|
|
|
params.endDate = queryDateRange.value[1]
|
|
|
@@ -317,6 +336,7 @@ const handleSearch = () => {
|
|
|
const handleReset = () => {
|
|
|
queryForm.accountId = ''
|
|
|
queryForm.groupId = null
|
|
|
+ queryForm.dynamicCreativeId = ''
|
|
|
queryDateRange.value = getDefaultDateRange()
|
|
|
pagination.page = 1
|
|
|
loadList()
|
|
|
@@ -407,6 +427,9 @@ const loadGroupOptions = async () => {
|
|
|
// ─── 初始化 ───────────────────────────────────────────────────────────────────
|
|
|
onMounted(() => {
|
|
|
loadGroupOptions()
|
|
|
+ if (route.query.dynamicCreativeId) {
|
|
|
+ queryForm.dynamicCreativeId = String(route.query.dynamicCreativeId)
|
|
|
+ }
|
|
|
loadList()
|
|
|
})
|
|
|
</script>
|