@@ -0,0 +1,583 @@
< template >
< div class = "app-container" >
<!-- 数据统计卡片 -- >
< el-row :gutter = "20" class = "mb20" v-if = "statistics" >
< el -col :span = "6" >
< el-card shadow = "hover" >
< div class = "statistics-card" >
< div class = "statistics-title" > 总线报消息 < / div >
< div class = "statistics-value" > { { statistics . total || 0 } } < / div >
< / div >
< / el-card >
< / el-col >
< el-col :span = "6" >
< el-card shadow = "hover" >
< div class = "statistics-card" >
< div class = "statistics-title" > 线报商品 < / div >
< div class = "statistics-value" > { { statistics . childrenCount || 0 } } < / div >
< / div >
< / el-card >
< / el-col >
< / el-row >
< el-form :model = "queryParams" ref = "queryForm" size = "small" :inline = "true" v-show = "showSearch" label-width="68px" >
< el -form -item label = "消息内容" prop = "content" >
< el-input v-model = "queryParams.content" placeholder="请输入消息内容" clearable style="width: 240px" @keyup.enter.native="handleQuery" / >
< / el-form-item >
< el-form-item >
< el-button type = "primary" icon = "el-icon-search" size = "mini" @click ="handleQuery" > 搜索 < / el -button >
< el-button icon = "el-icon-refresh" size = "mini" @click ="resetQuery" > 重置 < / el -button >
< / el-form-item >
< / el-form >
< el-row :gutter = "10" class = "mb8" >
< el-col :span = "1.5" >
< el-button type = "primary" plain icon = "el-icon-plus" size = "mini" @click ="handleAdd" v-hasPermi = "['system:xbmessage:add']" > 新增 < / el -button >
< / el-col >
< el-col :span = "1.5" >
< el-button type = "success" plain icon = "el-icon-edit" size = "mini" :disabled = "single" @click ="handleUpdate" v-hasPermi = "['system:xbmessage:edit']" > 修改 < / el -button >
< / el-col >
< el-col :span = "1.5" >
< el-button type = "danger" plain icon = "el-icon-delete" size = "mini" :disabled = "multiple" @click ="handleDelete" v-hasPermi = "['system:xbmessage:remove']" > 删除 < / el -button >
< / el-col >
< el-col :span = "1.5" >
< el-button type = "warning" plain icon = "el-icon-download" size = "mini" @click ="handleExport" v-hasPermi = "['system:xbmessage:export']" > 导出 < / el -button >
< / el-col >
< right-toolbar :showSearch.sync = "showSearch" @queryTable ="getList" > < / right -toolbar >
< / el-row >
< el-table v-loading = "loading" :data="xbmessageList" @selection-change="handleSelectionChange" row-key="id" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" >
< el -table -column type = "selection" width = "50" align = "center" / >
< el-table-column label = "首行" prop = "firstLine" :show-overflow-tooltip = "true" min -width = " 260 " / >
< el-table-column label = "首个商品" prop = "firstSkuName" :show-overflow-tooltip = "true" min -width = " 220 " / >
< el-table-column label = "首价" prop = "firstPrice" width = "120" align = "center" / >
< el-table-column label = "商品数" width = "100" align = "center" >
< template slot -scope = " scope " >
< el-tag v-if = "scope.row.children && scope.row.children.length > 0" type="success" size="mini" >
{{ scope.row.children.length }}
< / el -tag >
< span v-else > - < / span >
< / template >
< / el -table -column >
< el-table-column label = "线报时间" prop = "createDate" width = "180" align = "center" >
< template slot -scope = " scope " >
< span > { { scope . row . createDate ? parseTime ( scope . row . createDate ) : '-' } } < / span >
< / template >
< / el-table-column >
< el-table-column label = "操作" align = "center" width = "160" class -name = " small -padding fixed -width " >
< template slot -scope = " scope " >
< el-button size = "mini" type = "text" icon = "el-icon-info" @click ="showMessageDetail(scope.row)" > 详情 < / el -button >
< el-button size = "mini" type = "text" icon = "el-icon-edit" @click ="handleUpdate(scope.row)" v-hasPermi = "['system:xbmessage:edit']" > 修改 < / el -button >
< el-button size = "mini" type = "text" icon = "el-icon-delete" @click ="handleDelete(scope.row)" v-hasPermi = "['system:xbmessage:remove']" > 删除 < / el -button >
< / template >
< / el-table-column >
< / el-table >
< pagination
v-show = "total>0"
:total = "total"
:page.sync = "queryParams.pageNum"
:limit.sync = "queryParams.pageSize"
@pagination ="getList"
/ >
<!-- 添加或修改消息对话框 -- >
< el-dialog :title = "title" :visible.sync = "open" width = "500px" append -to -body >
< el-form ref = "form" :model = "form" :rules = "rules" label -width = " 80px " >
< el-form-item label = "消息类型" prop = "type" >
< el-input v-model = "form.type" placeholder="请输入消息类型" / >
< / el-form-item >
< el-form-item label = "消息内容" prop = "content" >
< el-input v-model = "form.content" type="textarea" placeholder="请输入消息内容" / >
< / el-form-item >
< / el-form >
< div slot = "footer" class = "dialog-footer" >
< el-button type = "primary" @click ="submitForm" > 确 定 < / el -button >
< el-button @click ="cancel" > 取 消 < / el -button >
< / div >
< / el-dialog >
<!-- 子消息详情对话框 -- >
< el-dialog title = "子消息详情" :visible.sync = "childDetailVisible" width = "900px" append -to -body >
< div v-if = "currentChild" >
< el -descriptions :column = "2" border >
< el-descriptions-item label = "ID" > { { currentChild . id } } < / el-descriptions-item >
< el-descriptions-item label = "商品名称" > { { currentChild . skuName || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "价格" > { { currentChild . firstPrice ? ` ¥ ${ currentChild . firstPrice } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "创建时间" > { { currentChild . createDate ? parseTime ( currentChild . createDate ) : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "SPUID" > { { currentChild . spuid || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "所有者" > { { currentChild . owner || '-' } } < / el-descriptions-item >
< / el-descriptions >
<!-- 商品查询结果 -- >
< div v-if = "currentChild.jsonQueryResult" style="margin-top: 20px;" >
< h4 > 商品查询结果 < / h4 >
< el-descriptions :column = "1" border >
< el-descriptions-item label = "品牌" > { { getJsonValue ( currentChild . jsonQueryResult , 'brandName' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "分类" > { { getCategoryPath ( currentChild . jsonQueryResult ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "评论数" > { { getJsonValue ( currentChild . jsonQueryResult , 'comments' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "好评率" > { { getJsonValue ( currentChild . jsonQueryResult , 'goodCommentsShare' ) ? ` ${ getJsonValue ( currentChild . jsonQueryResult , 'goodCommentsShare' ) } % ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "30天订单数" > { { getJsonValue ( currentChild . jsonQueryResult , 'inOrderCount30Days' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "是否热门" > { { getJsonValue ( currentChild . jsonQueryResult , 'isHot' ) ? '是' : '否' } } < / el-descriptions-item >
< el-descriptions-item label = "是否京东自营" > { { getJsonValue ( currentChild . jsonQueryResult , 'isJdSale' ) ? '是' : '否' } } < / el-descriptions-item >
< / el-descriptions >
< / div >
<!-- 价格信息 -- >
< div v-if = "currentChild.jsonQueryResult" style="margin-top: 20px;" >
< h4 > 价格信息 < / h4 >
< el-descriptions :column = "2" border >
< el-descriptions-item label = "原价" > { { getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.price' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.price' ) } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "最低券后价" > { { getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.lowestCouponPrice' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.lowestCouponPrice' ) } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "最低价" > { { getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.lowestPrice' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'priceInfo.lowestPrice' ) } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "购买价" > { { getJsonValue ( currentChild . jsonQueryResult , 'purchasePriceInfo.purchasePrice' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'purchasePriceInfo.purchasePrice' ) } ` : '-' } } < / el-descriptions-item >
< / el-descriptions >
< / div >
<!-- 佣金信息 -- >
< div v-if = "currentChild.jsonQueryResult" style="margin-top: 20px;" >
< h4 > 佣金信息 < / h4 >
< el-descriptions :column = "2" border >
< el-descriptions-item label = "佣金" > { { getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.commission' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.commission' ) } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "佣金比例" > { { getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.commissionShare' ) ? ` ${ getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.commissionShare' ) } % ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "券佣金" > { { getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.couponCommission' ) ? ` ¥ ${ getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.couponCommission' ) } ` : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "PLUS佣金比例" > { { getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.plusCommissionShare' ) ? ` ${ getJsonValue ( currentChild . jsonQueryResult , 'commissionInfo.plusCommissionShare' ) } % ` : '-' } } < / el-descriptions-item >
< / el-descriptions >
< / div >
<!-- 店铺信息 -- >
< div v-if = "currentChild.jsonQueryResult" style="margin-top: 20px;" >
< h4 > 店铺信息 < / h4 >
< el-descriptions :column = "2" border >
< el-descriptions-item label = "店铺ID" > { { getJsonValue ( currentChild . jsonQueryResult , 'shopInfo.shopId' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "店铺名称" > { { getJsonValue ( currentChild . jsonQueryResult , 'shopInfo.shopName' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "店铺等级" > { { getJsonValue ( currentChild . jsonQueryResult , 'shopInfo.shopLevel' ) || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "店铺标签" > { { getJsonValue ( currentChild . jsonQueryResult , 'shopInfo.shopLabel' ) || '-' } } < / el-descriptions-item >
< / el-descriptions >
< / div >
<!-- 优惠券信息 -- >
< div v-if = "currentChild.jsonCouponList && currentChild.jsonCouponList !== '[]'" style="margin-top: 20px;" >
< h4 > 优惠券信息 < / h4 >
< el-table :data = "parseCouponList(currentChild.jsonCouponList)" border style = "width: 100%" >
< el-table-column label = "优惠券类型" align = "center" prop = "couponStyle" width = "120" >
< template slot -scope = " scope " >
< span > { { scope . row . couponStyle === 0 ? '满减券' : '其他' } } < / span >
< / template >
< / el-table-column >
< el-table-column label = "满减门槛" align = "center" prop = "quota" width = "120" >
< template slot -scope = " scope " >
< span > 满 { { scope . row . quota } } 减 { { scope . row . discount } } < / span >
< / template >
< / el-table-column >
< el-table-column label = "获取时间" align = "center" width = "200" >
< template slot -scope = " scope " >
< div > 开始 : { { formatTimestamp ( scope . row . getStartTime ) } } < / div >
< div > 结束 : { { formatTimestamp ( scope . row . getEndTime ) } } < / div >
< / template >
< / el-table-column >
< el-table-column label = "使用时间" align = "center" width = "200" >
< template slot -scope = " scope " >
< div > 开始 : { { formatTimestamp ( scope . row . useStartTime ) } } < / div >
< div > 结束 : { { formatTimestamp ( scope . row . useEndTime ) } } < / div >
< / template >
< / el-table-column >
< el-table-column label = "链接" align = "center" min -width = " 200 " >
< template slot -scope = " scope " >
< el-link :href = "scope.row.link" target = "_blank" type = "primary" > 查看优惠券 < / el-link >
< / template >
< / el-table-column >
< / el-table >
< / div >
< / div >
< div slot = "footer" class = "dialog-footer" >
< el-button @click ="childDetailVisible = false" > 关 闭 < / el -button >
< / div >
< / el-dialog >
<!-- 消息详情对话框 -- >
< el-dialog title = "消息详情" :visible.sync = "messageDetailVisible" width = "900px" append -to -body >
< div v-if = "currentMessageDetail" >
< el -descriptions :column = "2" border >
< el-descriptions-item label = "消息ID" > { { currentMessageDetail . id } } < / el-descriptions-item >
< el-descriptions-item label = "创建时间" > { { currentMessageDetail . createDate ? parseTime ( currentMessageDetail . createDate ) : '-' } } < / el-descriptions-item >
< el-descriptions-item label = "来源微信ID" > { { currentMessageDetail . fromWxid || '-' } } < / el-descriptions-item >
< el-descriptions-item label = "SKUID" > { { currentMessageDetail . skuid || '-' } } < / el-descriptions-item >
< / el-descriptions >
<!-- 原始消息内容 -- >
< div style = "margin-top: 20px;" >
< h4 > 原始消息内容 < / h4 >
< el-input
type = "textarea"
:rows = "8"
v-model = "currentMessageDetail.tipOriginalMessage"
readonly
placeholder = "暂无消息内容"
/ >
< / div >
<!-- 子消息列表 -- >
< div v-if = "currentMessageDetail.children && currentMessageDetail.children.length > 0" style="margin-top: 20px;" >
< h4 > 子消息列表 ( 共 { { currentMessageDetail . children . length } } 条 ) < / h4 >
< el-table :data = "currentMessageDetail.children" border style = "width: 100%" max -height = " 400 " >
< el-table-column label = "ID" align = "center" prop = "id" width = "80" / >
< el-table-column label = "商品名称" align = "left" prop = "skuName" :show-overflow-tooltip = "true" min -width = " 200 " / >
< el-table-column label = "价格" align = "center" prop = "firstPrice" width = "100" >
< template slot -scope = " scope " >
< span v-if = "scope.row.firstPrice" > ¥ {{ scope.row.firstPrice }} < / span >
< span v-else > - < / span >
< / template >
< / el -table -column >
< el-table-column label = "商品详情" align = "left" min -width = " 300 " >
< template slot -scope = " scope " >
< el-button size = "mini" type = "text" @click ="showChildDetail(scope.row)" > 查看详情 < / el -button >
< / template >
< / el-table-column >
< / el-table >
< / div >
< / div >
< div slot = "footer" class = "dialog-footer" >
< el-button @click ="messageDetailVisible = false" > 关 闭 < / el -button >
< / div >
< / el-dialog >
< / div >
< / template >
< script >
import { listXbmessage , getXbmessage , delXbmessage , addXbmessage , updateXbmessage } from "@/api/system/xbmessage" ;
import { parseTime } from "@/utils/ruoyi" ;
export default {
name : "Xbmessage" ,
data ( ) {
return {
// 遮罩层
loading : true ,
// 选中数组
ids : [ ] ,
// 非单个禁用
single : true ,
// 非多个禁用
multiple : true ,
// 显示搜索条件
showSearch : true ,
// 总条数
total : 0 ,
// 消息表格数据
xbmessageList : [ ] ,
// 弹出层标题
title : "" ,
// 是否显示弹出层
open : false ,
// 查询参数
queryParams : {
pageNum : 1 ,
pageSize : 10 ,
id : null ,
type : null ,
content : null
} ,
// 表单参数
form : { } ,
// 表单校验
rules : {
type : [
{ required : true , message : "消息类型不能为空" , trigger : "blur" }
] ,
content : [
{ required : true , message : "消息内容不能为空" , trigger : "blur" }
]
} ,
// 子消息详情对话框
childDetailVisible : false ,
// 当前查看的子消息
currentChild : { } ,
// 消息详情对话框
messageDetailVisible : false ,
// 当前查看的消息详情
currentMessageDetail : { } ,
// 统计数据
statistics : null
} ;
} ,
created ( ) {
this . getList ( ) ;
} ,
methods : {
/** 查询消息列表 */
getList ( ) {
this . loading = true ;
listXbmessage ( this . queryParams ) . then ( response => {
this . xbmessageList = this . normalizeList ( response . rows || [ ] ) ;
this . total = response . total ;
this . loading = false ;
console . log ( "接口返回数据:" , response ) ;
// 处理统计数据
this . processStatistics ( response ) ;
} ) ;
} ,
/** 归一化列表数据(解决 children 字段结构不同) */
normalizeList ( rows ) {
if ( ! Array . isArray ( rows ) ) return [ ] ;
return rows . map ( parent => {
const normalized = { ... parent } ;
if ( Array . isArray ( parent . children ) && parent . children . length > 0 ) {
normalized . children = parent . children . map ( child => {
// 如果接口已经提供了这些字段,直接使用;否则从jsonQueryResult中解析
const parsedQuery = this . safeJsonParse ( child . jsonQueryResult ) ;
const firstPrice = child . firstPrice ||
parsedQuery ? . priceInfo ? . lowestCouponPrice ||
parsedQuery ? . priceInfo ? . price ||
parsedQuery ? . purchasePriceInfo ? . purchasePrice ||
null ;
return {
... child ,
firstSkuName : child . firstSkuName || child . skuName || parsedQuery ? . skuName || null ,
firstPrice : firstPrice ,
firstLine : child . firstLine || child . skuName || parsedQuery ? . skuName || null
}
} ) ;
// 父级信息:优先使用接口提供的字段,否则从子项中获取
const firstChild = normalized . children [ 0 ] ;
normalized . firstSkuName = normalized . firstSkuName || firstChild ? . firstSkuName || null ;
normalized . firstPrice = normalized . firstPrice || firstChild ? . firstPrice || null ;
normalized . firstLine = normalized . firstLine || firstChild ? . firstLine || null ;
}
return normalized ;
} ) ;
} ,
/** 安全 JSON 解析 */
safeJsonParse ( str ) {
if ( ! str || typeof str !== 'string' ) return null ;
try {
return JSON . parse ( str ) ;
} catch ( e ) {
return null ;
}
} ,
/** 显示消息详情 */
showMessageDetail ( message ) {
this . currentMessageDetail = message ;
this . messageDetailVisible = true ;
} ,
/** 显示子消息详情 */
showChildDetail ( child ) {
this . currentChild = child ;
this . childDetailVisible = true ;
} ,
/** 从JSON字符串中安全获取嵌套值 */
getJsonValue ( jsonStr , path ) {
try {
const obj = typeof jsonStr === 'string' ? JSON . parse ( jsonStr ) : jsonStr ;
if ( ! obj ) return null ;
const keys = path . split ( '.' ) ;
let value = obj ;
for ( const key of keys ) {
if ( value && typeof value === 'object' && key in value ) {
value = value [ key ] ;
} else {
return null ;
}
}
return value ;
} catch ( e ) {
return null ;
}
} ,
/** 获取分类路径 */
getCategoryPath ( jsonStr ) {
try {
const obj = typeof jsonStr === 'string' ? JSON . parse ( jsonStr ) : jsonStr ;
if ( ! obj ? . categoryInfo ) return null ;
const { cid1Name , cid2Name , cid3Name } = obj . categoryInfo ;
return [ cid1Name , cid2Name , cid3Name ] . filter ( Boolean ) . join ( ' > ' ) ;
} catch ( e ) {
return null ;
}
} ,
/** 解析优惠券列表 */
parseCouponList ( couponListStr ) {
try {
if ( ! couponListStr || couponListStr === '[]' ) return [ ] ;
const coupons = typeof couponListStr === 'string' ? JSON . parse ( couponListStr ) : couponListStr ;
return Array . isArray ( coupons ) ? coupons : [ ] ;
} catch ( e ) {
return [ ] ;
}
} ,
/** 转换时间戳为可读时间 */
formatTimestamp ( timestamp ) {
if ( ! timestamp ) return '-' ;
try {
// 如果是时间戳(数字),转换为日期
if ( typeof timestamp === 'number' ) {
return this . parseTime ( timestamp ) ;
}
// 如果是字符串,尝试解析
if ( typeof timestamp === 'string' ) {
const num = parseInt ( timestamp ) ;
if ( ! isNaN ( num ) ) {
return this . parseTime ( num ) ;
}
// 如果不是数字字符串,直接返回
return timestamp ;
}
return '-' ;
} catch ( e ) {
return '-' ;
}
} ,
/** 处理统计数据 */
processStatistics ( response ) {
if ( response . rows && response . rows . length > 0 ) {
const data = response . rows ;
const typeSet = new Set ( data . map ( item => item . type ) . filter ( Boolean ) ) ;
// 计算子消息总数
let childrenCount = 0 ;
data . forEach ( item => {
if ( item . children && Array . isArray ( item . children ) ) {
childrenCount += item . children . length ;
}
} ) ;
// 计算有效消息数(有内容的消息)
const validCount = data . filter ( item => item . content && item . content . trim ( ) ) . length ;
this . statistics = {
total : response . total || data . length ,
childrenCount : childrenCount ,
typeCount : typeSet . size ,
validCount : validCount
} ;
} else {
this . statistics = {
total : 0 ,
childrenCount : 0 ,
typeCount : 0 ,
validCount : 0
} ;
}
} ,
// 取消按钮
cancel ( ) {
this . open = false ;
this . reset ( ) ;
} ,
// 表单重置
reset ( ) {
this . form = {
id : null ,
type : null ,
content : null
} ;
this . resetForm ( "form" ) ;
} ,
/** 搜索按钮操作 */
handleQuery ( ) {
this . queryParams . pageNum = 1 ;
this . getList ( ) ;
} ,
/** 重置按钮操作 */
resetQuery ( ) {
this . resetForm ( "queryForm" ) ;
this . handleQuery ( ) ;
} ,
// 多选框选中数据
handleSelectionChange ( selection ) {
this . ids = selection . map ( item => item . id )
this . single = selection . length !== 1
this . multiple = ! selection . length
} ,
/** 新增按钮操作 */
handleAdd ( ) {
this . reset ( ) ;
this . open = true ;
this . title = "添加消息" ;
} ,
/** 修改按钮操作 */
handleUpdate ( row ) {
this . reset ( ) ;
const id = row . id || this . ids
getXbmessage ( id ) . then ( response => {
this . form = response . data ;
this . open = true ;
this . title = "修改消息" ;
} ) ;
} ,
/** 提交按钮 */
submitForm ( ) {
this . $refs [ "form" ] . validate ( valid => {
if ( valid ) {
if ( this . form . id != null ) {
updateXbmessage ( this . form ) . then ( response => {
this . $modal . msgSuccess ( "修改成功" ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
} else {
addXbmessage ( this . form ) . then ( response => {
this . $modal . msgSuccess ( "新增成功" ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
}
}
} ) ;
} ,
/** 删除按钮操作 */
handleDelete ( row ) {
const ids = row . id || this . ids ;
this . $modal . confirm ( '是否确认删除消息编号为"' + ids + '"的数据项?' ) . then ( function ( ) {
return delXbmessage ( ids ) ;
} ) . then ( ( ) => {
this . getList ( ) ;
this . $modal . msgSuccess ( "删除成功" ) ;
} ) . catch ( ( ) => { } ) ;
} ,
/** 导出按钮操作 */
handleExport ( ) {
this . download ( 'system/xbmessage/export' , {
... this . queryParams
} , ` xbmessage_ ${ new Date ( ) . getTime ( ) } .xlsx ` )
}
}
} ;
< / script >
< style scoped >
. statistics - card {
text - align : center ;
padding : 10 px ;
}
. statistics - title {
font - size : 14 px ;
color : # 666 ;
margin - bottom : 8 px ;
}
. statistics - value {
font - size : 24 px ;
font - weight : bold ;
color : # 409 EFF ;
}
. mb20 {
margin - bottom : 20 px ;
}
< / style >