|
|
@@ -1,11 +1,20 @@
|
|
|
<template>
|
|
|
<div class="ma-content-block">
|
|
|
- <sa-table ref="crudRef" :options="options" :columns="columns" :searchForm="searchForm">
|
|
|
+ <sa-table
|
|
|
+ ref="crudRef"
|
|
|
+ :options="options"
|
|
|
+ :columns="columns"
|
|
|
+ :searchForm="searchForm"
|
|
|
+ >
|
|
|
<!-- 搜索区 tableSearch -->
|
|
|
<template #tableSearch>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
<a-form-item label="用户名" field="user_name">
|
|
|
- <a-input v-model="searchForm.user_name" placeholder="请输入用户名" allow-clear />
|
|
|
+ <a-input
|
|
|
+ v-model="searchForm.user_name"
|
|
|
+ placeholder="请输入用户名"
|
|
|
+ allow-clear
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
@@ -15,23 +24,37 @@
|
|
|
</a-col>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
<a-form-item label="媒体类型" field="media_id">
|
|
|
- <a-select v-model="searchForm.media_id" placeholder="请选择媒体类型" allow-clear allow-search>
|
|
|
+ <a-select
|
|
|
+ v-model="searchForm.media_id"
|
|
|
+ placeholder="请选择媒体类型"
|
|
|
+ allow-clear
|
|
|
+ allow-search
|
|
|
+ >
|
|
|
<a-option
|
|
|
v-for="item in mediaOptions"
|
|
|
:key="item.id"
|
|
|
:value="item.id"
|
|
|
- :label="`${item.id}:${item.name}`" />
|
|
|
+ :label="`${item.id}:${item.name}`"
|
|
|
+ />
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
- <a-form-item label="渠道id" field="agent_id">
|
|
|
- <a-input v-model="searchForm.agent_id" placeholder="请输入渠道id" allow-clear />
|
|
|
+ <a-form-item label="渠道ID" field="agent_id">
|
|
|
+ <a-input
|
|
|
+ v-model="searchForm.agent_id"
|
|
|
+ placeholder="请输入渠道ID"
|
|
|
+ allow-clear
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
- <a-form-item label="广告位id" field="site_id">
|
|
|
- <a-input v-model="searchForm.site_id" placeholder="请输入广告位id" allow-clear />
|
|
|
+ <a-form-item label="广告位ID" field="site_id">
|
|
|
+ <a-input
|
|
|
+ v-model="searchForm.site_id"
|
|
|
+ placeholder="请输入广告位ID"
|
|
|
+ allow-clear
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :sm="12" :md="6" :lg="7" :xl="6" :xxl="4" :xs="24">
|
|
|
@@ -42,10 +65,26 @@
|
|
|
<a-col :sm="24" :md="17" :lg="17" :xl="12" :xxl="8" :xs="24">
|
|
|
<a-form-item label="登录日期" field="login_time">
|
|
|
<a-space>
|
|
|
- <a-range-picker class="w-full" v-model="searchForm.login_time" :clearable="false" />
|
|
|
- <a-button size="mini" type="outline" @click="refreshDay('yesterday')">前一天</a-button>
|
|
|
- <a-button size="mini" type="outline" @click="refreshDay('today')">当天</a-button>
|
|
|
- <a-button size="mini" type="outline" @click="refreshDay('tomorrow')">后一天</a-button>
|
|
|
+ <a-range-picker
|
|
|
+ class="w-full"
|
|
|
+ v-model="searchForm.login_time"
|
|
|
+ :clearable="false"
|
|
|
+ />
|
|
|
+ <a-button
|
|
|
+ size="mini"
|
|
|
+ type="outline"
|
|
|
+ @click="refreshDay('yesterday')"
|
|
|
+ >前一天</a-button
|
|
|
+ >
|
|
|
+ <a-button size="mini" type="outline" @click="refreshDay('today')"
|
|
|
+ >当天</a-button
|
|
|
+ >
|
|
|
+ <a-button
|
|
|
+ size="mini"
|
|
|
+ type="outline"
|
|
|
+ @click="refreshDay('tomorrow')"
|
|
|
+ >后一天</a-button
|
|
|
+ >
|
|
|
</a-space>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
@@ -56,10 +95,10 @@
|
|
|
</a-col>
|
|
|
</template>
|
|
|
<template #login_time="{ record }">
|
|
|
- {{ dayjs(record.login_time * 1000).format('YYYY-MM-DD HH:mm:ss') }}
|
|
|
+ {{ dayjs(record.login_time * 1000).format("YYYY-MM-DD HH:mm:ss") }}
|
|
|
</template>
|
|
|
<template #reg_time="{ record }">
|
|
|
- {{ dayjs(record.reg_time * 1000).format('YYYY-MM-DD HH:mm:ss') }}
|
|
|
+ {{ dayjs(record.reg_time * 1000).format("YYYY-MM-DD HH:mm:ss") }}
|
|
|
</template>
|
|
|
<!-- Table 自定义渲染 -->
|
|
|
</sa-table>
|
|
|
@@ -70,30 +109,30 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { onMounted, ref, reactive } from 'vue'
|
|
|
-import EditForm from './edit.vue'
|
|
|
-import api from '../../api/gameLog/sdkLoginLog'
|
|
|
-import commonApi from '../../api/common'
|
|
|
-import dayjs from 'dayjs'
|
|
|
-import GameSelect from '@/components/game-select/index.vue'
|
|
|
-import AuthSelect from '@/components/auth-select/index.vue'
|
|
|
+import { onMounted, ref, reactive } from "vue";
|
|
|
+import EditForm from "./edit.vue";
|
|
|
+import api from "../../api/gameLog/sdkLoginLog";
|
|
|
+import commonApi from "../../api/common";
|
|
|
+import dayjs from "dayjs";
|
|
|
+import GameSelect from "@/components/game-select/index.vue";
|
|
|
+import AuthSelect from "@/components/auth-select/index.vue";
|
|
|
|
|
|
// 引用定义
|
|
|
-const crudRef = ref()
|
|
|
-const editRef = ref()
|
|
|
-const mediaOptions = ref()
|
|
|
+const crudRef = ref();
|
|
|
+const editRef = ref();
|
|
|
+const mediaOptions = ref();
|
|
|
|
|
|
// 搜索表单
|
|
|
const searchForm = ref({
|
|
|
- user_name: '',
|
|
|
- game_id: '',
|
|
|
- media_id: '',
|
|
|
- agent_id: '',
|
|
|
- site_id: '',
|
|
|
- auth_id: '',
|
|
|
- login_time: [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
|
|
|
+ user_name: "",
|
|
|
+ game_id: "",
|
|
|
+ media_id: "",
|
|
|
+ agent_id: "",
|
|
|
+ site_id: "",
|
|
|
+ auth_id: "",
|
|
|
+ login_time: [dayjs().format("YYYY-MM-DD"), dayjs().format("YYYY-MM-DD")],
|
|
|
reg_time: [],
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
// SaTable 基础配置
|
|
|
const options = reactive({
|
|
|
@@ -101,78 +140,90 @@ const options = reactive({
|
|
|
rowSelection: { showCheckedAll: true },
|
|
|
operationColumn: false,
|
|
|
showSort: false,
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
// SaTable 列配置
|
|
|
const columns = reactive([
|
|
|
- { title: '用户名', dataIndex: 'user_name', width: 100 },
|
|
|
- { title: '游戏', dataIndex: 'game_name', width: 120 },
|
|
|
- { title: '媒体ID', dataIndex: 'media_id', width: 80 },
|
|
|
- { title: '广告位id', dataIndex: 'site_id', width: 80 },
|
|
|
- { title: '登录IP', dataIndex: 'ip', width: 120 },
|
|
|
- { title: '登录IMEI/IDFA', dataIndex: 'imei', width: 120 },
|
|
|
- { title: '登录OAID/CID', dataIndex: 'oaid', width: 120 },
|
|
|
+ { title: "用户名", dataIndex: "user_name", width: 100 },
|
|
|
+ { title: "游戏", dataIndex: "game_name", width: 120 },
|
|
|
+ { title: "渠道ID", dataIndex: "agent_id", width: 80 },
|
|
|
+ { title: "媒体ID", dataIndex: "media_id", width: 80 },
|
|
|
+ { title: "广告位ID", dataIndex: "site_id", width: 80 },
|
|
|
+ { title: "登录IP", dataIndex: "ip", width: 120 },
|
|
|
+ { title: "登录IMEI/IDFA", dataIndex: "imei", width: 120 },
|
|
|
+ { title: "登录OAID/CID", dataIndex: "oaid", width: 120 },
|
|
|
|
|
|
- { title: '登录时间', dataIndex: 'login_time', width: 140 },
|
|
|
- { title: '注册时间', dataIndex: 'reg_time', width: 140 },
|
|
|
+ { title: "登录时间", dataIndex: "login_time", width: 140 },
|
|
|
+ { title: "注册时间", dataIndex: "reg_time", width: 140 },
|
|
|
|
|
|
- { title: '手机品牌', dataIndex: 'brand', width: 90 },
|
|
|
- { title: '手机型号', dataIndex: 'model', width: 90 },
|
|
|
- { title: '系统版本', dataIndex: 'system_version', width: 70 },
|
|
|
- { title: 'sdk版本', dataIndex: 'sdk_version', width: 70 },
|
|
|
- { title: '设备类型', dataIndex: 'vt', type: 'dict', dict: 'vt', width: 80 },
|
|
|
- { title: '渠道名', dataIndex: 'agent_name', width: 90 },
|
|
|
- { title: '负责人', dataIndex: 'auth_name', width: 90 },
|
|
|
-])
|
|
|
+ { title: "手机品牌", dataIndex: "brand", width: 90 },
|
|
|
+ { title: "手机型号", dataIndex: "model", width: 90 },
|
|
|
+ { title: "系统版本", dataIndex: "system_version", width: 70 },
|
|
|
+ { title: "sdk版本", dataIndex: "sdk_version", width: 70 },
|
|
|
+ { title: "设备类型", dataIndex: "vt", type: "dict", dict: "vt", width: 80 },
|
|
|
+ { title: "渠道名", dataIndex: "agent_name", width: 90 },
|
|
|
+ { title: "负责人", dataIndex: "auth_name", width: 90 },
|
|
|
+]);
|
|
|
|
|
|
// 获取媒体类型
|
|
|
const getMediaOptions = async () => {
|
|
|
- const resp = await commonApi.getMediaOptionsApi()
|
|
|
+ const resp = await commonApi.getMediaOptionsApi();
|
|
|
if (resp.code === 200) {
|
|
|
- mediaOptions.value = resp.data
|
|
|
+ mediaOptions.value = resp.data;
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
// 页面数据初始化
|
|
|
const initPage = async () => {
|
|
|
- await getMediaOptions()
|
|
|
-}
|
|
|
+ await getMediaOptions();
|
|
|
+};
|
|
|
|
|
|
// SaTable 数据请求
|
|
|
const refresh = async () => {
|
|
|
- crudRef.value?.refresh()
|
|
|
-}
|
|
|
+ crudRef.value?.refresh();
|
|
|
+};
|
|
|
|
|
|
const refreshDay = async (day) => {
|
|
|
switch (day) {
|
|
|
- case 'yesterday':
|
|
|
+ case "yesterday":
|
|
|
searchForm.value.login_time = [
|
|
|
- dayjs(searchForm.value.login_time[0]).subtract(1, 'day').format('YYYY-MM-DD'),
|
|
|
- dayjs(searchForm.value.login_time[1]).subtract(1, 'day').format('YYYY-MM-DD'),
|
|
|
- ]
|
|
|
- break
|
|
|
- case 'today':
|
|
|
- searchForm.value.login_time = [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')]
|
|
|
- break
|
|
|
- case 'tomorrow':
|
|
|
+ dayjs(searchForm.value.login_time[0])
|
|
|
+ .subtract(1, "day")
|
|
|
+ .format("YYYY-MM-DD"),
|
|
|
+ dayjs(searchForm.value.login_time[1])
|
|
|
+ .subtract(1, "day")
|
|
|
+ .format("YYYY-MM-DD"),
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ case "today":
|
|
|
searchForm.value.login_time = [
|
|
|
- dayjs(searchForm.value.login_time[0]).add(1, 'day').format('YYYY-MM-DD'),
|
|
|
- dayjs(searchForm.value.login_time[1]).add(1, 'day').format('YYYY-MM-DD'),
|
|
|
- ]
|
|
|
- break
|
|
|
+ dayjs().format("YYYY-MM-DD"),
|
|
|
+ dayjs().format("YYYY-MM-DD"),
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ case "tomorrow":
|
|
|
+ searchForm.value.login_time = [
|
|
|
+ dayjs(searchForm.value.login_time[0])
|
|
|
+ .add(1, "day")
|
|
|
+ .format("YYYY-MM-DD"),
|
|
|
+ dayjs(searchForm.value.login_time[1])
|
|
|
+ .add(1, "day")
|
|
|
+ .format("YYYY-MM-DD"),
|
|
|
+ ];
|
|
|
+ break;
|
|
|
default:
|
|
|
- break
|
|
|
+ break;
|
|
|
}
|
|
|
- refresh()
|
|
|
-}
|
|
|
+ refresh();
|
|
|
+};
|
|
|
|
|
|
// 页面加载完成执行
|
|
|
onMounted(async () => {
|
|
|
- initPage()
|
|
|
- refresh()
|
|
|
-})
|
|
|
+ initPage();
|
|
|
+ refresh();
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
-export default { name: 'v1/user-logs/sdkLoginLog' }
|
|
|
+export default { name: "v1/user-logs/sdkLoginLog" };
|
|
|
</script>
|