fix:bug修复

src/views/marketing/apps/components/domainCollapse.vue

@@ -8,7 +8,7 @@
         <template v-for="item in domains" >
           <!-- 具体域名 -->
             <el-tag v-if="item.sourceType == SourceType.DOMAIN" effect="light" :closable="domainDeletable"
-            @close="handleDeleteDomain(item, SourceType.DOMAIN)" color="#f4f4f4" round class="ml-1 mb-1 cursor-pointer">
+            @close="handleDeleteDomain(item, SourceType.DOMAIN)" color="#f4f4f4" round class="mr-1 mb-1 cursor-pointer">
               <span class="ellipsis">{{ item.domain }}</span>
           </el-tag>
           <!-- 分组域名 -->
@@ -126,7 +126,7 @@ function addSinglesUnique(newSingles: DomainItem[]) {
       })
     })
     domains.value = [...domains.value, ...filtered];
-    console.log(filtered);
+    console.log('去重后的域名：', filtered);
 		useMessage().success(t('common.addSuccessText'));
   }else{
     useMessage().warning(t('marketingApps.addDomainTip2'));
@@ -142,10 +142,12 @@ const addDomain = (data: DomainItem[], type: 'group' | 'domain') => {
 }
 
 const onLoadDetail = async (item: any) => {
+  item.loading = true;
 	if (item?.domains && item?.domains?.length !== 0) return;
 	await getGroupDetail({ id: item.groupId }).then((val) => {
 		item.domains = val.data.domains
 	});
+  item.loading = false;
 };
 
 </script>

src/views/marketing/apps/components/domainEdit.vue

@@ -4,10 +4,10 @@
 		<el-form style="height: 80px;" ref="dialogFormRef" :rules="dataRules" :model="state.ruleForm"
 			v-loading="loading">
 			<div class="custom-style">
-				<el-segmented v-model="activeName"
-					:options="['group', 'domain']" size="default">
+				<el-segmented v-model="activeName" :options="['group', 'domain']" size="default">
 					<template #default="scope">
-						<div style="min-width: 50px; line-height: 32px;">{{ scope.item == 'group' ? t('marketingApps.group') : t('marketingApps.domain') }}</div>
+						<div style="min-width: 50px; line-height: 32px;">{{ scope.item == 'group' ?
+							t('marketingApps.group') : t('marketingApps.domain') }}</div>
 					</template>
 				</el-segmented>
 			</div>
@@ -26,13 +26,13 @@
 			<span class="dialog-footer">
 				<el-button @click="onCancel">{{ t('common.cancelButtonText') }}</el-button>
 				<el-button type="primary" @click="onSubmit()" :disabled="loading">{{ t('common.confirmButtonText')
-					}}</el-button>
+				}}</el-button>
 			</span>
 		</template>
 	</el-dialog>
 </template>
 
-<script setup lang="ts" name="systemMenuDialog">
+<script setup lang="ts" name="domainEdit">
 import { useI18n } from 'vue-i18n';
 import { pageListDomain } from '/@/api/marketing/config';
 import { useMessage } from '/@/hooks/message';
@@ -69,7 +69,7 @@ watch(() => props.open, async (val) => {
 	if (val) {
 		state.ruleForm.selectedIds = [];
 		state.ruleForm.domain = [];
-	    getDomainList();
+		getDomainList();
 	}
 })
 
@@ -94,10 +94,10 @@ const onSubmit = async () => {
 		loading.value = true;
 		if (activeName.value == 'group') {
 			selectedObjects.value = [];
-			selectedObjects.value = listSelect.value.filter(item => state.ruleForm.selectedIds.includes(item.id));
+			selectedObjects.value = listSelect.value.filter(item => state.ruleForm.selectedIds.includes(item.id as string));
 			emit('onsuccess', selectedObjects.value, activeName.value);
-		}else if(state.ruleForm.domain.length > 0) {
-			emit('onsuccess', [{domain: state.ruleForm.domain}], activeName.value);
+		} else if (state.ruleForm.domain.length > 0) {
+			emit('onsuccess', [{ domain: state.ruleForm.domain }], activeName.value);
 		}
 		onCancel();
 	} catch (err) {
@@ -108,7 +108,7 @@ const onSubmit = async () => {
 	}
 };
 
-const getDomainList = async ()=>{
+const getDomainList = async () => {
 	const data = await pageListDomain();
 	listSelect.value = data.data;
 }

src/views/marketing/apps/components/domainForm.vue

@@ -16,8 +16,8 @@
   </div>
 </template>
 
-<script setup lang="ts" name="systemMenuDialog">
-import { ElMessage } from 'element-plus';
+<script setup lang="ts" name="domainForm">
+import { useMessage } from '/@/hooks/message';
 import { useI18n } from 'vue-i18n';
 import { updateModDomains } from '/@/api/marketing/apps';
 import { DomainItem } from '../types';
@@ -57,10 +57,10 @@ const onSubmit = async () => {
   try {
     updateModDomains({ domains: childDomains.value, delDomains: delDomains.value, id: rowData.value.id})
     emit('refresh');
-    ElMessage.success(t('marketingApps.submitSuccess'));
+    useMessage().success(t('marketingApps.submitSuccess'));
     visible.value = false;
   } catch (error) {
-    ElMessage.error(t('marketingApps.submitFail'));
+    useMessage().error(t('marketingApps.submitFail'));
     console.error(error);
   }
 };

src/views/marketing/apps/components/form.vue

@@ -23,8 +23,8 @@
         </el-row>
         <el-row :gutter="20">
           <el-col :span="12">
-            <el-form-item :label="'触发频率'" prop="triggerNum">
-              <el-input style="width: 200px;" v-model="state.ruleForm.triggerNum" :placeholder="'请输入触发频率'" clearable />
+            <el-form-item :label="'触发频率'" prop="triggerNumFormat">
+              <el-input style="width: 200px;" v-model="state.ruleForm.triggerNumFormat" :placeholder="'请输入触发频率'" clearable />
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -58,13 +58,13 @@
   </div>
 </template>
 
-<script setup lang="ts" name="systemMenuDialog">
+<script setup lang="ts">
 const DomainCollapse = defineAsyncComponent(() => import('./domainCollapse.vue'));
 const IpCollapse = defineAsyncComponent(() => import('./ipCollapse.vue'));
-import { ElMessage } from 'element-plus';
+import { useMessage } from '/@/hooks/message';
 import { useI18n } from 'vue-i18n';
 import { appUpdate } from '/@/api/marketing/apps';
-import { Form, DomainItem, IpItem } from '../types';
+import { AppData, DomainItem, IpItem } from '../types';
 
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['refresh']);
@@ -74,12 +74,12 @@ const { t } = useI18n();
 const visible = ref(false);
 const loading = ref(false);
 const appDialogFormRef = ref();
-const domains = ref();
+const domains = ref<DomainItem[]>();
 const delDomains = ref<string[]>([]);
-const childIps = ref();
+const childIps = ref<IpItem[]>();
 const delIps = ref<string[]>([]);
 // 批量操作
-const rows = ref<Form[]>([]);
+const rows = ref<AppData[]>([]);
 
 const triggerRules = [
   {
@@ -99,8 +99,9 @@ const state = reactive({
     domainLimit: true,
     launch: true,
     triggerNum: "",
+    triggerNumFormat: "",
     triggerRule: 1,
-  } as Form,
+  } as AppData,
 });
 
 watch(() => state.ruleForm, async (val) => {
@@ -129,7 +130,7 @@ const formatNum = (value: string | number = 0) => {
   }else if (num >= 1 && num < 10000) {
     return num;
   }
-  return '--'
+  return ''
 }
 
 // 打开弹窗
@@ -142,11 +143,11 @@ const openDialog = async (type: string, row: any) => {
       launch: true,
       triggerNum: "",
       triggerRule: 1,
-    } as Form;
+    } as AppData;
     rows.value = row;
   }else if(row instanceof Object) {
     if(row.triggerNum) {
-      row.triggerNum = formatNum(row.triggerNum);
+      row.triggerNumFormat = formatNum(row.triggerNum);
     }
     state.ruleForm = row;
     rows.value = [row]
@@ -158,7 +159,7 @@ const openDialog = async (type: string, row: any) => {
 
 // 表单校验规则
 const dataRules = reactive({
-  triggerNum: [
+  triggerNumFormat: [
     { required: true, message: '触发频率不能为空', trigger: 'blur' },
     {
       pattern: /^(10000|[1-9]\d{0,3}|0)$|^(100%|[1-9]?\d%|0%)$/,
@@ -218,7 +219,7 @@ const onSubmit = async () => {
   
   try {
     loading.value = true;
-    const data:Form[] = [];
+    const data:AppData[] = [];
     rows.value.forEach(async (item) => {
       data.push({
         ...item,
@@ -229,18 +230,18 @@ const onSubmit = async () => {
         remark: state.ruleForm.remark,
         domainLimit: state.ruleForm.domainLimit,
         launch: state.ruleForm.launch,
-        triggerNum: `${processNumberString(state.ruleForm.triggerNum)}`,
+        triggerNum: `${processNumberString(state.ruleForm.triggerNumFormat)}`,
         triggerRule: state.ruleForm.triggerRule,
       })
     })
     console.log('rows.value', data);
     
     await appUpdate(data);
-    ElMessage.success(t('marketingApps.submitSuccess'));
+    useMessage().success(t('marketingApps.submitSuccess'));
     visible.value = false;
     emit('refresh');
   } catch (err: any) {
-    ElMessage.error(t('marketingApps.submitFail'));
+    useMessage().error(t('marketingApps.submitFail'));
     console.error(err);
   } finally {
     loading.value = false;

src/views/marketing/apps/components/ipCollapse.vue

@@ -10,7 +10,7 @@
           <template v-for="item in getTargetList(type)" :key="item.id">
             <!-- 单个 -->
             <el-tag v-if="item.sourceType == 2" effect="light" :closable="ipDeletable" @close="handleDeleteIp(item)"
-              color="#f4f4f4" round class="ml-1 mb-1 cursor-pointer">
+              color="#f4f4f4" round class="mr-1 mb-1 cursor-pointer">
               <span class="ellipsis">{{ ipSplicing(item.startIp, item.endIp) }}</span>
             </el-tag>
             <!-- 分组 -->

src/views/marketing/apps/components/ipEdit.vue

@@ -50,7 +50,7 @@
 	</el-dialog>
 </template>
 
-<script setup name="systemMenuDialog" lang="ts">
+<script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { useMessage } from '/@/hooks/message';
 import { pageListIp } from '/@/api/marketing/config';

src/views/marketing/apps/components/ipForm.vue

@@ -15,8 +15,8 @@
   </div>
 </template>
 
-<script setup lang="ts" name="systemMenuDialog">
-import { ElMessage } from 'element-plus';
+<script setup lang="ts">
+import { useMessage } from '/@/hooks/message';
 import { useI18n } from 'vue-i18n';
 import { updateModIp } from '/@/api/marketing/apps';
 const IpCollapse = defineAsyncComponent(() => import('./ipCollapse.vue'));
@@ -53,10 +53,10 @@ const onSubmit = async () => {
   try {
     await updateModIp({ ips: childIps.value, delIps: delIps.value, id: rowData.value.id});
     emit('refresh');
-    ElMessage.success(t('marketingApps.submitSuccess'));
+    useMessage().success(t('marketingApps.submitSuccess'));
     visible.value = false;
   } catch (error) {
-    ElMessage.error(t('marketingApps.submitFail'));
+    useMessage().error(t('marketingApps.submitFail'));
     console.error(error);
   }
 };

src/views/marketing/apps/components/statistical.vue

@@ -12,12 +12,16 @@
         <div class="statistics-table-wrapper">
           <el-row v-show="showSearch">
             <el-form :inline="true" :model="state.queryForm" @keyup.enter="withCollapsedChildren(getDataList)" ref="queryRef">
-              <el-form-item :label="t('marketingApps.timeRange')" prop="timeRange">
-                <el-select v-model="state.queryForm.timeRange" @change="handleTimeChange()">
-                    <el-option v-for="item in timeRangeOptions" :value="item.value" :label="item.label">{{ item.label }}</el-option>
-                </el-select>
+              <el-form-item :label="t('marketingApps.startTime')" prop="startTime">
+                <el-date-picker v-model="state.queryForm.startTime" type="datetime" placeholder="请选择开始时间" />
+              </el-form-item>
+              <el-form-item :label="t('marketingApps.endTime')" prop="endTime">
+                <el-date-picker v-model="state.queryForm.endTime" type="datetime" placeholder="请选择结束时间" />
               </el-form-item>
             </el-form>
+            <el-form-item>
+              <el-button @click="withCollapsedChildren(getDataList)" type="primary" icon="Search">{{ t('common.queryBtn') }}</el-button>
+            </el-form-item>
           </el-row>
           <el-table class="statistics-table" :data="state.dataList" row-key="ip" @sort-change="withCollapsedChildren(sortChangeHandle)" style="width: 100%"
             v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
@@ -26,23 +30,29 @@
             @expand-change="handleExpandChange"
             >
             <!-- <el-table-column align="center" type="selection" width="40" /> -->
-            <el-table-column show-overflow-tooltip type="expand">
+            <el-table-column :formatter="statusFormatter" show-overflow-tooltip type="expand">
               <template #default="{ row }">
                 <div class="child-table-container">
                   <el-table :data="row.childTableData" v-loading="row.childTableData.childLoading" border :cell-style="tableStyle.cellStyle"
                     :header-cell-style="tableStyle.headerCellStyle">
-                    <!-- <el-table-column :label="t('marketingApps.ip')" prop="ip" show-overflow-tooltip></el-table-column> -->
-                    <el-table-column :label="t('marketingApps.fingerprint')" prop="fingerprint" show-overflow-tooltip></el-table-column>
-                    <el-table-column :label="t('marketingApps.device')" prop="device" show-overflow-tooltip>
+                    <!-- <el-table-column :formatter="statusFormatter" :label="t('marketingApps.ip')" prop="ip" show-overflow-tooltip></el-table-column> -->
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.fingerprint')" prop="fingerprint" show-overflow-tooltip></el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.device')" prop="device" show-overflow-tooltip>
                       <template #default="{ row }">
-                        系统类型：{{ row.osType == 'Unknown' ? '--' : row.osType }} <br>
-                        系统版本：{{ row.osVersion == 'Unknown' ? '--' : row.osVersion }}
+                        系统类型：{{ statusFormatter('','',row.osType,'') }} <br>
+                        系统版本：{{ statusFormatter('','',row.osVersion,'') }}
                       </template>
                     </el-table-column>
-                    <el-table-column :label="t('marketingApps.firstAccessTime')" prop="firstTime" show-overflow-tooltip></el-table-column>
-                    <el-table-column :label="t('marketingApps.lastAccessTime')" prop="lastTime" show-overflow-tooltip></el-table-column>
-                    <el-table-column :label="t('marketingApps.lastVisitedPage')" prop="url" show-overflow-tooltip></el-table-column>
-                    <el-table-column :label="t('marketingApps.accessVolume')" prop="count" show-overflow-tooltip></el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.browser')" prop="browser" show-overflow-tooltip>
+                      <template #default="{ row }">
+                        浏览器名称：{{ statusFormatter('','',row.browserName,'') }} <br>
+                        浏览器版本：{{ statusFormatter('','',row.browserVersion,'') }}
+                      </template>
+                    </el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.firstAccessTime')" prop="firstTime" show-overflow-tooltip></el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.lastAccessTime')" prop="lastTime" show-overflow-tooltip></el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.lastVisitedPage')" prop="url" show-overflow-tooltip></el-table-column>
+                    <el-table-column :formatter="statusFormatter" :label="t('marketingApps.accessVolume')" prop="count" show-overflow-tooltip></el-table-column>
                   </el-table>
                   <div class="pagination-container" @click.stop>
                     <pagination v-bind="row.childPagination"
@@ -56,13 +66,13 @@
                 </div>
               </template>
             </el-table-column>
-            <el-table-column :label="t('marketingApps.firstAccessTime')" prop="firstTime" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.lastAccessTime')" prop="lastTime" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.accessSource')" prop="utmSource" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.lastVisitedPage')" prop="url" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.IP')" prop="ip" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.area')" prop="region" show-overflow-tooltip></el-table-column>
-            <el-table-column :label="t('marketingApps.accessVolume')" prop="count" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.IP')" prop="ip" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.firstAccessTime')" prop="firstTime" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.lastAccessTime')" prop="lastTime" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.accessSource')" prop="utmSource" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.lastVisitedPage')" prop="url" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.area')" prop="region" show-overflow-tooltip></el-table-column>
+            <el-table-column :formatter="statusFormatter" :label="t('marketingApps.accessVolume')" prop="count" show-overflow-tooltip></el-table-column>
           </el-table>
 
           <pagination 
@@ -90,10 +100,9 @@ enum TimeRange {
   FIFTEEN_MINUTES = "2",
 }
 
-const visible = ref(false);
-const row = ref({});
-const { t } = useI18n();
 // 定义变量内容
+const { t } = useI18n();
+const visible = ref(false);
 const queryRef = ref();
 const showSearch = ref(true);
 const expandedRowKeys = ref<number[]>([]); // 记录展开的行
@@ -103,10 +112,12 @@ const setIntervalTime = ref(0);
 const state: BasicTableProps = reactive<BasicTableProps>({
   queryForm: {
     timeRange: TimeRange.ALL,
+    startTime: '',
+    endTime: '',
     appId: '',
   },
   pageList: getStatPage,
-  dataListLoading: true,
+  createdIsNeed: false,
   pagination: {
     current: 1,
     size: 10,
@@ -132,6 +143,8 @@ const openDialog = async (_row: any) => {
   await getTimeRangeList();
   visible.value = true;
   state.queryForm.appId = _row.appId;
+  state.queryForm.endTime = new Date().getTime();
+  state.queryForm.startTime = state.queryForm.endTime - (7 * 24 * 60 * 60 * 1000);
   expandedRowKeys.value = [];
   getDataList();
 };
@@ -234,6 +247,12 @@ const handleExpandChange = (row: any, expandedRows: any[]) => {
   }
 };
 
+const statusFormatter = (row: any, column: any, cellValue: any, index: any) => {
+  let unknownArray = ['unknown', 'Unknown', '未知'];
+  if(unknownArray.includes(cellValue)) return '--';
+  return cellValue || '--';
+}
+
 // 暴露变量 只有暴漏出来的变量 父组件才能使用
 defineExpose({
   openDialog,

src/views/marketing/apps/i18n/zh-cn.ts

@@ -1,67 +1,71 @@
 export default {
-	marketingApps: {
-		/* 应用列表 */
-		index: '#',
-		name: '应用名称',
-		config: '配置方案',
-		app: '应用',
-		id: 'ID',
-		appId: '应用ID',
-		appImg: '应用图片',
-		appType: '应用类型',
-		remark: '备注',
-		triggerRule: '触发规则',
-		blackList: '黑名单',
-		whiteList: '白名单',
-		statistical: '统计',
-		ipSegment: 'IP/网段',
+  marketingApps: {
+    /* 应用列表 */
+    index: '#',
+    name: '应用名称',
+    config: '配置方案',
+    app: '应用',
+    id: 'ID',
+    appId: '应用ID',
+    appImg: '应用图片',
+    appType: '应用类型',
+    remark: '备注',
+    triggerRule: '触发规则',
+    blackList: '黑名单',
+    whiteList: '白名单',
+    statistical: '统计',
+    ipSegment: 'IP/网段',
+    startTime: '开始时间',
+    endTime: '结束时间',
+    browser: '浏览器',
 
-		add: '新增',
-		edit: '修改',
-		delete: '删除',
-		group: '分组',
-		domain: '域名',
-		editIp: '修改IP',
-		addIp: '添加IP',
-		noData: '暂无数据',
-		viewDetail: '查看详情',
-		addDomain: '添加域名',
-		editDomain: '修改域名',
+    add: '新增',
+    edit: '修改',
+    delete: '删除',
+    group: '分组',
+    domain: '域名',
+    editIp: '修改IP',
+    addIp: '添加IP',
+    noData: '暂无数据',
+    viewDetail: '查看详情',
+    addDomain: '添加域名',
+    editDomain: '修改域名',
 
-		inputAppSel: '请选择应用',
-		inputNameTip: '请输入应用名称名称',
-		addDomainTip: '该分组已添加到域名集合，无需重复添加',
-		addDomainTip2: '该域名已存在于集合中，无需重复添加',
-		addIpTip: '该分组已添加到IP集合，无需重复添加',
-		addIpTip2: '该IP已存在于集合中，无需重复添加',
-		inputGroupTip: '请选择分组名称',
-		submitSuccess: '提交成功！',
-		submitFail: '提交失败！',
+    loading: '加载中...',
+    inputAppSel: '请选择应用',
+    inputNameTip: '请输入应用名称名称',
+    addDomainTip: '该分组已添加到域名集合，无需重复添加',
+    addDomainTip2: '该域名已存在于集合中，无需重复添加',
+    addIpTip: '该分组已添加到IP集合，无需重复添加',
+    addIpTip2: '该IP已存在于集合中，无需重复添加',
+    inputGroupTip: '请选择分组名称',
+    submitSuccess: '提交成功！',
+    submitFail: '提交失败！',
 
-		/* 数据统计 */
-		statistics: '统计',
-		ip: 'IP',
-		content: '访问量',
-		dayActive: '日活',
-		hourActive: '时活',
-		fifteenOnline: '15分钟在线人数',
-		referrer: '来源',
-		fingerprint: '指纹',
-		timeRange: '时间范围',
-		firstAccessTime: '首次访问时间',
-		lastAccessTime: '最后访问时间',
-		accessSource: '访问来源',
-		lastVisitedPage: '最后受访页面',
-		IP: 'IP',
-		area: '地区',
-		accessVolume: '访问量',
-		device: '设备',
+    /* 数据统计 */
+    statistics: '统计',
+    ip: 'IP',
+    content: '访问量',
+    dayActive: '日活',
+    hourActive: '时活',
+    fifteenOnline: '15分钟在线人数',
+    referrer: '来源',
+    fingerprint: '指纹',
+    timeRange: '时间范围',
+    firstAccessTime: '首次访问时间',
+    lastAccessTime: '最后访问时间',
+    accessSource: '访问来源',
+    lastVisitedPage: '最后受访页面',
+    IP: 'IP',
+    area: '地区',
+    accessVolume: '访问量',
+    device: '设备',
 
-		queryBtn: '查询',
-		resetBtn: '重置',
+    queryBtn: '查询',
+    resetBtn: '重置',
 
-		inputReferrer: '请输入来源',
-		inputIpAddress: '请输入IP地址',
-		inputDomainTip: '请输入域名',
-	},
+    inputReferrer: '请输入来源',
+    inputIpAddress: '请输入IP地址',
+    inputDomainTip: '请输入域名',
+  },
 };

src/views/marketing/apps/index.vue

@@ -2,16 +2,16 @@
   <div class="layout-padding">
     <div class="layout-padding-auto layout-padding-view">
       <el-row shadow="hover" v-show="showSearch" class="ml10">
-        <el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
+        <el-form :inline="true" :model="state.queryForm" @keyup.enter="query" ref="queryRef">
           <el-form-item :label="t('marketingApps.name')" prop="appName">
-            <el-input :placeholder="t('marketingApps.inputNameTip')" clearable
-              v-model="state.queryForm.appName" />
+            <el-input :placeholder="t('marketingApps.inputNameTip')" clearable v-model="state.queryForm.appName" />
           </el-form-item>
           <el-form-item :label="t('marketingApps.appId')" prop="appId">
             <el-input :placeholder="'请输入应用ID'" clearable v-model="state.queryForm.appId" />
           </el-form-item>
           <el-form-item :label="t('marketingApps.appType')" prop="domainSelected">
-            <el-select placeholder="请选择应用类型" v-model="state.queryForm.domainSelected">
+            <el-select placeholder="请选择应用类型" v-model="state.queryForm.domainSelected" @change="query()">
+              <el-option :key="'0'" :label="'全部'" :value="'0'" />
               <el-option v-for="item in domainTypeOptions" :key="item.value" :label="item.description" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -27,140 +27,158 @@
           </el-form-item>
         </el-form>
       </el-row>
-      <!-- <el-row>
-        <div class="mb8" style="width: 100%">
-          <right-toolbar v-model:showSearch="showSearch" class="ml10" style="float: right; margin-right: 20px"
-            @queryTable="getDataList"></right-toolbar>
-        </div>
-      </el-row> -->
 
       <el-tabs v-model="activeName" class="table-tabs" @tab-click="handleClick">
-          <el-tab-pane label="使用中" name="tab1"></el-tab-pane>
-          <el-tab-pane label="回收站" name="tab2"></el-tab-pane>
+        <el-tab-pane label="使用中" name="tab1"></el-tab-pane>
+        <el-tab-pane label="回收站" name="tab2"></el-tab-pane>
       </el-tabs>
 
       <el-table @selection-change="handleSelectionChange" ref="tableRef" :data="state.dataList" row-key="path"
         style="width: 100%" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
         :header-cell-style="tableStyle?.headerCellStyle">
-        <el-table-column type="selection" fixed="left" width="55" v-if="activeName == 'tab1'" />
-        <el-table-column fixed="left" :label="t('marketingApps.id')" prop="id" width="80" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" type="selection" fixed="left" width="55"
+          v-if="activeName == 'tab1'" />
+        <el-table-column :formatter="statusFormatter" fixed="left" :label="t('marketingApps.id')" prop="id" width="80"
+          show-overflow-tooltip>
           <template #default="{ row }">{{ row.id }}</template>
         </el-table-column>
-        <el-table-column :label="t('marketingApps.appId')" prop="appId" width="220" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" :label="t('marketingApps.appId')" prop="appId" width="220"
+          show-overflow-tooltip>
           <template #default="{ row }">{{ row.appId }}</template>
         </el-table-column>
         <el-table-column :label="t('marketingApps.appImg')" prop="appImg" width="150" show-overflow-tooltip>
           <template #default="{ row }" style="display: flex; align-self: center;">
-            <el-image style="width: 80px; height: 80px; border-radius: 10px;" :src="row.appImg" :fit="fit" />
+            <el-image style="width: 80px; height: 80px; border-radius: 10px;" :src="row.appImg" :fit="'cover'" />
           </template>
         </el-table-column>
-        <el-table-column :label="t('marketingApps.name')" prop="appName" width="150" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" :label="t('marketingApps.name')" prop="appName" width="150"
+          show-overflow-tooltip>
           <template #default="{ row }">
-            <el-link :href="row.url">{{ row.appName }}</el-link>
+            <el-link :disabled="activeName === 'tab2'" :href="row.appUrl" target="_blank"
+              :style="{ color: '#409EFF', opacity: activeName == 'tab2' ? 0.68 : 1 }">{{ row.appName }}</el-link>
           </template>
         </el-table-column>
-        <el-table-column :label="t('marketingApps.appType')" prop="domainType" width="110" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" :label="t('marketingApps.appType')" prop="domainType" width="110"
+          show-overflow-tooltip>
           <template #default="{ row }">
-            <el-select @change="handleChange(row)" :disabled="activeName === 'tab2'" v-model="row.domainType" placeholder="" style="width: 80px">
-              <el-option v-for="item in domainTypeOptions" :key="item.value" :label="item.description" :value="item.value" />
+            <el-select @change="handleChange(row)" :disabled="activeName === 'tab2'" v-model="row.domainType"
+              placeholder="" style="width: 80px">
+              <el-option v-for="item in domainTypeOptions" :key="item.value" :label="item.description"
+                :value="item.value" />
             </el-select>
           </template>
         </el-table-column>
-        <el-table-column label="营销投放" prop="launch" width="120">
+        <el-table-column :formatter="statusFormatter" label="营销投放" prop="launch" width="120">
           <template #default="{ row }">
             <el-switch :disabled="activeName === 'tab2'" v-model="row.launch" inline-prompt :active-value="true"
               :inactive-value="false" @change="handleChange(row)" />
           </template>
         </el-table-column>
-        <el-table-column label="域名限制" prop="domainLimit" width="120">
+        <el-table-column :formatter="statusFormatter" label="域名限制" prop="domainLimit" width="120">
           <template #default="{ row }">
             <el-switch :disabled="activeName === 'tab2'" v-model="row.domainLimit" inline-prompt :active-value="true"
               :inactive-value="false" @change="handleChange(row)" />
           </template>
         </el-table-column>
-        <el-table-column :label="'域名集合'" prop="domains" width="280">
+        <el-table-column :formatter="statusFormatter" :label="'域名集合'" prop="domains" width="280">
           <template #default="{ row }">
-            <DomainCell :domainList="row.domains" :state="activeName=='tab1'" :rowData="row" @refresh="getDataList()" />
+            <DomainCell :domainList="row.domains" :state="activeName == 'tab1'" :rowData="row" @refresh="query" />
           </template>
         </el-table-column>
-        <el-table-column :label="'IP集合'" prop="ips" width="320">
+        <el-table-column :formatter="statusFormatter" :label="'IP集合'" prop="ips" width="320">
           <template #default="{ row }">
-            <IpCell :ipList="row.ips" :state="activeName=='tab1'" :rowData="row" @refresh="getDataList()" />
+            <IpCell :ipList="row.ips" :state="activeName == 'tab1'" :rowData="row" @refresh="query" />
           </template>
         </el-table-column>
-        <el-table-column :label="'触发频率'" prop="triggerNum" width="120" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" :label="'触发频率'" prop="triggerNum" width="120"
+          show-overflow-tooltip>
           <template #default="{ row }">
             <!-- <el-input-number v-model="row.triggerNum" :max=20 /> -->
-             {{ formatNum(row.triggerNum)  }}
+            {{ formatNum(row.triggerNum) }}
           </template>
         </el-table-column>
-        <el-table-column :label="t('marketingApps.triggerRule')" width="140" prop="triggerRule" show-overflow-tooltip>
+        <el-table-column :formatter="statusFormatter" :label="t('marketingApps.triggerRule')" width="140"
+          prop="triggerRule" show-overflow-tooltip>
           <template #default="{ row }">
-            <el-select @change="handleChange(row)" :disabled="activeName === 'tab2'" v-model="row.triggerRule" placeholder="" style="width: 100px">
+            <el-select @change="handleChange(row)" :disabled="activeName === 'tab2'" v-model="row.triggerRule"
+              placeholder="" style="width: 100px">
               <el-option v-for="item in triggerRules" :key="item.value" :label="item.label" :value="item.value" />
             </el-select>
           </template>
         </el-table-column>
-        <el-table-column :label="t('marketingApps.remark')" prop="remark" width="150" show-overflow-tooltip>
-          <template #default="{ row }">
-             {{ row.remark || '--' }}
-          </template>
+        <el-table-column :formatter="statusFormatter" :label="t('marketingApps.remark')" prop="remark" width="150"
+          show-overflow-tooltip>
         </el-table-column>
         <el-table-column fixed="right" :label="t('common.action')" width="200">
           <template #default="scope">
             <div class="action" style="text-align: left;">
-              <el-button :disabled="activeName == 'tab2'" style="margin-right: 0px;" @click="onOpenEditMenu('edit', scope.row)" text type="primary"
-                v-auth="'sys_menu_edit'">
-                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
-                  <mask id="mask0_362_1714" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="16">
-                  <rect width="16" height="16" fill="#D9D9D9"/>
+              <el-button :disabled="activeName == 'tab2'" style="margin-right: 0px;"
+                @click="onOpenEditMenu('edit', scope.row)" text type="primary" v-auth="'sys_menu_edit'">
+                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+                  viewBox="0 0 16 16" fill="none">
+                  <mask id="mask0_362_1714" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="16"
+                    height="16">
+                    <rect width="16" height="16" fill="#D9D9D9" />
                   </mask>
                   <g mask="url(#mask0_362_1714)">
-                  <path d="M4.60017 12.2954L5.97782 12.2954C6.50827 12.2955 7.017 12.0847 7.39208 11.7097L13.7925 5.30925C14.4017 4.70003 14.4017 3.71229 13.7925 3.10308V3.10308C13.1833 2.49386 12.1955 2.49387 11.5863 3.10308L5.18591 9.5035C4.81082 9.87859 4.60011 10.3873 4.60012 10.9178L4.60017 12.2954Z" stroke="#167AF0" stroke-linejoin="round"/>
-                  <path d="M10.4832 4.20593L12.6893 6.41211" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M8.5 2H4C2.89543 2 2 2.89543 2 4V13C2 14.1046 2.89543 15 4 15H13C14.1046 15 15 14.1046 15 13V8.5" stroke="#167AF0" stroke-linecap="round"/>
+                    <path
+                      d="M4.60017 12.2954L5.97782 12.2954C6.50827 12.2955 7.017 12.0847 7.39208 11.7097L13.7925 5.30925C14.4017 4.70003 14.4017 3.71229 13.7925 3.10308V3.10308C13.1833 2.49386 12.1955 2.49387 11.5863 3.10308L5.18591 9.5035C4.81082 9.87859 4.60011 10.3873 4.60012 10.9178L4.60017 12.2954Z"
+                      stroke="#167AF0" stroke-linejoin="round" />
+                    <path d="M10.4832 4.20593L12.6893 6.41211" stroke="#167AF0" stroke-linecap="round"
+                      stroke-linejoin="round" />
+                    <path
+                      d="M8.5 2H4C2.89543 2 2 2.89543 2 4V13C2 14.1046 2.89543 15 4 15H13C14.1046 15 15 14.1046 15 13V8.5"
+                      stroke="#167AF0" stroke-linecap="round" />
                   </g>
                 </svg>
                 {{ t('marketingApps.edit') }}
               </el-button>
               <el-button style="margin-right: 0px;" @click="onOpenStatistical(scope.row)" text type="primary"
                 v-auth="'sys_menu_edit'">
-                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
-                  <path d="M2 6V3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V6" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M10.6667 8V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M8 5V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M5.33325 6.33334V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M2 10V13C2 13.5523 2.44772 14 3 14H13C13.5523 14 14 13.5523 14 13V10" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round"/>
+                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+                  viewBox="0 0 16 16" fill="none">
+                  <path d="M2 6V3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V6" stroke="#167AF0"
+                    stroke-linecap="round" stroke-linejoin="round" />
+                  <path d="M10.6667 8V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round" />
+                  <path d="M8 5V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round" />
+                  <path d="M5.33325 6.33334V10.3333" stroke="#167AF0" stroke-linecap="round" stroke-linejoin="round" />
+                  <path d="M2 10V13C2 13.5523 2.44772 14 3 14H13C13.5523 14 14 13.5523 14 13V10" stroke="#167AF0"
+                    stroke-linecap="round" stroke-linejoin="round" />
                 </svg>
                 {{ t('marketingApps.statistics') }}
               </el-button>
-              <el-button v-if="activeName == 'tab1'" style="margin-right: 0px;" @click="handleDelete(scope.row)" text type="danger"
-                v-auth="'sys_menu_edit'">
-                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
+              <el-button v-if="activeName == 'tab1'" style="margin-right: 0px;" @click="handleDelete(scope.row)" text
+                type="danger" v-auth="'sys_menu_edit'">
+                <svg style="margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+                  viewBox="0 0 16 16" fill="none">
                   <g clip-path="url(#clip0_35_722)">
-                  <path d="M3 3.33334V12.6667C3 13.7712 3.89543 14.6667 5 14.6667H11C12.1046 14.6667 13 13.7712 13 12.6667V3.33334H3Z" stroke="#E64242" stroke-linejoin="round"/>
-                  <path d="M6.66675 6.66666V11" stroke="#E64242" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M9.33325 6.66666V11" stroke="#E64242" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M1.33325 3.33334H14.6666" stroke="#E64242" stroke-linecap="round" stroke-linejoin="round"/>
-                  <path d="M5.33325 3.33334L6.42959 1.33334H9.59229L10.6666 3.33334H5.33325Z" stroke="#E64242" stroke-linejoin="round"/>
+                    <path
+                      d="M3 3.33334V12.6667C3 13.7712 3.89543 14.6667 5 14.6667H11C12.1046 14.6667 13 13.7712 13 12.6667V3.33334H3Z"
+                      stroke="#E64242" stroke-linejoin="round" />
+                    <path d="M6.66675 6.66666V11" stroke="#E64242" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M9.33325 6.66666V11" stroke="#E64242" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M1.33325 3.33334H14.6666" stroke="#E64242" stroke-linecap="round"
+                      stroke-linejoin="round" />
+                    <path d="M5.33325 3.33334L6.42959 1.33334H9.59229L10.6666 3.33334H5.33325Z" stroke="#E64242"
+                      stroke-linejoin="round" />
                   </g>
                   <defs>
-                  <clipPath id="clip0_35_722">
-                  <rect width="16" height="16" fill="white"/>
-                  </clipPath>
+                    <clipPath id="clip0_35_722">
+                      <rect width="16" height="16" fill="white" />
+                    </clipPath>
                   </defs>
                 </svg>
                 拉黑</el-button>
-              <el-button v-if="activeName == 'tab2'" style="margin-right: 0px;" icon="refresh" @click="handleDelete(scope.row)" text type="success"
-                v-auth="'sys_menu_edit'">还原</el-button>
+              <el-button v-if="activeName == 'tab2'" style="margin-right: 0px;" icon="refresh"
+                @click="handleDelete(scope.row)" text type="success" v-auth="'sys_menu_edit'">还原</el-button>
             </div>
           </template>
         </el-table-column>
       </el-table>
-      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+      <pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination" />
     </div>
-    <EditDialog @refresh="getDataList()" ref="EditDialogRef" />
-    <StatisticalDialog @refresh="getDataList()" ref="statisticalDialogRef" />
+    <EditDialog @refresh="query" ref="EditDialogRef" />
+    <StatisticalDialog @refresh="query" ref="statisticalDialogRef" />
   </div>
 </template>
 
@@ -176,7 +194,7 @@ const StatisticalDialog = defineAsyncComponent(() => import('./components/statis
 const IpCell = defineAsyncComponent(() => import('./components/ipCell.vue'));
 const DomainCell = defineAsyncComponent(() => import('./components/domainCell.vue'));
 
-import { ElMessage, type TabsPaneContext } from 'element-plus'
+import { type TabsPaneContext } from 'element-plus'
 
 const activeName = ref('tab1')
 const handleClick = (tab: TabsPaneContext, event: Event) => {
@@ -204,7 +222,13 @@ const state: BasicTableProps = reactive<BasicTableProps>({
     domainSelected: '0',
     domainType: '',
     remark: '',
-  }
+  },
+  pagination: {
+    current: 1,
+    size: 10,
+    total: 0,
+    pageSizes: [5, 10, 20, 50, 100]
+  },
 });
 
 const domainTypeOptions = ref([]) as any;
@@ -213,13 +237,9 @@ const getDomianTypeList = async () => {
     dictType: 'DomianType'
   });
   domainTypeOptions.value = data?.records || [];
-  domainTypeOptions.value.map((item)=>{
+  domainTypeOptions.value.map((item) => {
     item.value = Number(item.value);
   })
-  domainTypeOptions.value.unshift({
-    description: '全部',
-    value: '0'
-  })
 }
 getDomianTypeList();
 
@@ -237,11 +257,11 @@ const triggerRules = [
 const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state);
 
 // 搜索事件
-const query = () => {
+const query = (refresh: boolean = false) => {
   activeName.value == 'tab1' ? state.pageList = pageList : state.pageList = pageDel;
   state.dataList = [];
   state.queryForm.domainType = state.queryForm.domainSelected == 0 ? '' : state.queryForm.domainSelected;
-  getDataList();
+  getDataList(refresh);
 };
 
 // 修改单条配置信息
@@ -263,8 +283,8 @@ const resetQuery = () => {
 
 // 批量修改配置
 const handleEdit = () => {
-  console.log('selectObjs', selectObjs);
-  
+  console.log('被选中的项', selectObjs);
+
   if (selectObjs.value.length === 0) {
     useMessage().warning('请选择要修改的项');
     return;
@@ -284,36 +304,40 @@ const onOpenEditMenu = (type: string, row: any) => {
 
 // 打开统计弹窗
 const onOpenStatistical = (row: any) => {
-  statisticalDialogRef.value.openDialog(row);
+  statisticalDialogRef.value.openDialog(row, true);
 };
 
 // 拉黑操作
 const handleDelete = async (row: any) => {
-	try {
-      await useMessageBox().confirm('是否确认拉黑该应用');
-      await delAppById({
-        id: row.id,
-        status: activeName.value == 'tab2'
-      });
-      ElMessage.success(activeName.value == 'tab2' ? '还原成功！' : '拉黑成功！');    
-	} catch {
-		return;
-	}
+  try {
+    await useMessageBox().confirm('是否确认拉黑该应用');
+    await delAppById({
+      id: row.id,
+      status: activeName.value == 'tab2'
+    });
+    useMessage().success(activeName.value == 'tab2' ? '还原成功！' : '拉黑成功！');
+  } catch {
+    return;
+  }
   query();
 };
 
 // 格式化数据展示
 const formatNum = (value: string | number = 0) => {
   let num = Number(value);
-  if(num > 0 && num < 1) {
+  if (num > 0 && num < 1) {
     return num * 100 + '%';
-  }else if (num >= 1 && num < 10000) {
+  } else if (num >= 1 && num < 10000) {
     return num;
   }
   return '--'
 }
 
-onMounted(()=>{
+const statusFormatter = (row: any, column: any, cellValue: any, index: any) => {
+  return cellValue || '--';
+}
+
+onMounted(() => {
   query();
 })
 

src/views/marketing/apps/types.ts

@@ -1,7 +1,22 @@
+export enum SourceType {
+  GROUP = 1, // 分组
+  DOMAIN = 2 // 具体域名
+}
+
+export enum IpType {
+  WHITE = 1,
+  BLACK = 2
+}
+
+export enum IpMode {
+  IP = 1, // 单个IP
+  IPRange = 2 // IP段
+}
+
 export interface DomainItem {
   id?: string;
   domain: string;
-  sourceType: number; // 1:分组 2:具体域名
+  sourceType: SourceType; // 1:分组 2:具体域名
   groupId: string;
   groupName: string;
   modify: boolean; // 是否被修改/新增
@@ -11,21 +26,6 @@ export interface DomainItem {
   }[];
 }
 
-export enum SourceType {
-  GROUP = 1,
-  DOMAIN = 2
-}
-
-export enum IpType {
-  WHITE = 1,
-  BLACK = 2
-}
-
-export enum IpMode {
-  IP = 1,
-  IPRange = 2
-}
-
 export interface IpItem {
   id?: string;
   ipMode: IpMode;
@@ -43,7 +43,7 @@ export interface IpItem {
   ip: string; 
 }
 
-export interface Form {
+export interface AppData {
   id?: string;
   appId?: string;
   appName?: string;
@@ -55,6 +55,7 @@ export interface Form {
   launch: boolean;
   triggerRule: number;
   triggerNum: string;
+  triggerNumFormat: string;
   remark: string;
   ips?: IpItem[];
   domains?: DomainItem[];

src/views/marketing/statistics/index.vue

@@ -31,13 +31,13 @@
               <el-table :data="row.childTableData" v-loading="row.childTableData.childLoading" border :cell-style="tableStyle.cellStyle"
                 :header-cell-style="tableStyle.headerCellStyle">
                 <!-- <el-table-column :label="t('statistics.ip')" prop="ip" show-overflow-tooltip></el-table-column> -->
-                <el-table-column :label="t('statistics.domain')" prop="domain" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.fingerprint')" prop="fingerprint" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.referrer')" prop="referrer" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.content')" prop="total" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.dayActive')" prop="daily" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.hourActive')" prop="hourly" show-overflow-tooltip></el-table-column>
-                <el-table-column :label="t('statistics.fifteenOnline')" prop="online" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.domain')" :formatter="statusFormatter" prop="domain" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.fingerprint')" :formatter="statusFormatter" prop="fingerprint" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.referrer')" :formatter="statusFormatter" prop="referrer" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.content')" :formatter="statusFormatter" prop="total" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.dayActive')" :formatter="statusFormatter" prop="daily" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.hourActive')" :formatter="statusFormatter" prop="hourly" show-overflow-tooltip></el-table-column>
+                <el-table-column :label="t('statistics.fifteenOnline')" :formatter="statusFormatter" prop="online" show-overflow-tooltip></el-table-column>
               </el-table>
               <div class="pagination-container" @click.stop>
                 <pagination v-bind="row.childPagination"
@@ -51,11 +51,11 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column :label="t('statistics.ip')" prop="ip" show-overflow-tooltip></el-table-column>
-        <el-table-column :label="t('statistics.content')" prop="total" show-overflow-tooltip></el-table-column>
-        <el-table-column :label="t('statistics.dayActive')" prop="daily" show-overflow-tooltip></el-table-column>
-        <el-table-column :label="t('statistics.hourActive')" prop="hourly" show-overflow-tooltip></el-table-column>
-        <el-table-column :label="t('statistics.fifteenOnline')" prop="online" show-overflow-tooltip></el-table-column>
+        <el-table-column :label="t('statistics.ip')" :formatter="statusFormatter" prop="ip" show-overflow-tooltip></el-table-column>
+        <el-table-column :label="t('statistics.content')" :formatter="statusFormatter" prop="total" show-overflow-tooltip></el-table-column>
+        <el-table-column :label="t('statistics.dayActive')" :formatter="statusFormatter" prop="daily" show-overflow-tooltip></el-table-column>
+        <el-table-column :label="t('statistics.hourActive')" :formatter="statusFormatter" prop="hourly" show-overflow-tooltip></el-table-column>
+        <el-table-column :label="t('statistics.fifteenOnline')" :formatter="statusFormatter" prop="online" show-overflow-tooltip></el-table-column>
       </el-table>
 
       <pagination 
@@ -117,6 +117,10 @@ const resetQuery = () => {
   withCollapsedChildren(getDataList);
 };
 
+const statusFormatter = (row: any, column: any, cellValue: any, index: any) => {
+  return cellValue || '--';
+}
+
 // 初始化二级表格数据和分页
 const initChildData = (parentRow) => {
   parentRow.expanded = false;