From 1f6893d24ba87313d4114c68813073ead53b2e12 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期五, 30 八月 2024 09:26:22 +0800
Subject: [PATCH] 群发新通讯录懒加载
---
src/views/Admin/msgRecord.vue | 86 +++++++++++++------------------------------
1 files changed, 26 insertions(+), 60 deletions(-)
diff --git a/src/views/Admin/msgRecord.vue b/src/views/Admin/msgRecord.vue
index 3cf0327..20a1e70 100644
--- a/src/views/Admin/msgRecord.vue
+++ b/src/views/Admin/msgRecord.vue
@@ -12,7 +12,7 @@
/>
</a-col>
<a-col :span="4">
- <a-button type="primary" @click="getData">查询</a-button>
+ <a-button type="primary" @click="searchData()">查询</a-button>
<a-button style="margin-left: 12px" @click="resetSearch">重置</a-button>
</a-col>
</a-row>
@@ -25,15 +25,16 @@
</div>
<a-divider type="vertical" />
<div class="tit">
- 任务ID：<span>{{item.id}}</span>
+ 任务ID：<span>{{item.id}}</span>
</div>
+ 发送人数：{{item.recipients?item.recipients.length:0}}
</template>
<p>
{{item.content}}
</p>
<template #actions>
<div>
- 接收号码：<span>{{item.recipients.map(i=>i.name + '(' + i.phone + ')').join('、')}}</span>
+ 接收号码：<span>{{item.recipients?item.recipients.map(i=>i.realName + '(' + i.phone.replace(/(\d{3})\d{4}(\d+)/, "$1****$2") + ')').join('、'):'暂无'}}</span>
</div>
<div>
<a-button type="primary" @click="viewDetails(item)">查看详情</a-button>
@@ -42,62 +43,38 @@
</a-card>
</div>
</div>
- <a-pagination v-model="search.pageIndex" :total="total" :show-total="total => `共 ${total} 条数据`" show-less-items/>
- <a-modal v-model="visible" width="40%" title="短信详情" @ok="handleOk" cancelText="取消" okText="确认" centered>
- <div class="detail-mod">
- <a-row :gutter="24"><a-col :span="4" style="text-align: right">{{ details.emergType == 1?'紧急':details.emergType == 2?'常规':'' }}</a-col></a-row>
- <a-row :gutter="24"><a-col :span="4" style="text-align: right">发送时间</a-col><a-col :span="14" style="border: 1px solid #d9d9d9;padding: 5px 10px !important;">{{details.gmtCreate}}</a-col></a-row>
- <a-row :gutter="24"><a-col :span="4" style="text-align: right">灾种类型</a-col><a-col :span="14" style="border: 1px solid #d9d9d9;padding: 5px 10px !important;">{{ getRiskName(details.disasterType)}}</a-col></a-row>
- <a-row :gutter="24"><a-col :span="4" style="text-align: right">预警级别</a-col><a-col :span="14" style="border: 1px solid #d9d9d9;padding: 5px 10px !important;">{{ getLevelName(details.warningLevel)}}</a-col></a-row>
- <a-row :gutter="24"><a-col :span="4" style="text-align: right">信息内容</a-col><a-col :span="14" style="border: 1px solid #d9d9d9;padding: 5px 10px !important;">{{details.content}}</a-col></a-row>
- <a-row :gutter="24">
- <a-col :span="4" style="text-align: right">接收人</a-col>
- <a-col :span="20" style="border: 1px solid #d9d9d9;padding: 0 !important;">
- <div v-for="(item,index) in details.recipients" :key="index" class="table">
- <div style="width: 20%">
- {{item.name}}
- </div>
- <div style="width: 20%">
- {{item.phone}}
- </div>
- <div style="width: 60%">
- {{item.recipientUnit}}
- </div>
- </div>
- </a-col>
- </a-row>
- </div>
- </a-modal>
+ <a-pagination class="pageItem" v-model="search.pageIndex" :total="total" :defaultPageSize="search.pageSize" @change="onPageChange" :show-total="total => `共 ${total} 条数据`"/>
+ <msg-detail-mod ref="msgDetail"></msg-detail-mod>
</div>
</template>
<script>
import {getUser} from '@/api/user'
import {getMassRecord} from "@/api/send";
+import msgDetailMod from "@/views/Admin/components/msgDetailMod";
export default {
name: 'msgRecord',
- components: {},
+ components: {msgDetailMod},
data () {
return {
search:{
pageIndex: 1,
- pageSize: 10,
+ pageSize: 5,
searchParams:{
startTime: '',
endTime: ''
}
},
timeRange: [],
- total: 0,
+ total: null,
msg: [],
visible: false,
details: {},
riskOptions: [
{name: '地震',value: 1},
- {name: '洪涝',value: 2},
{name: '气象',value: 3},
- {name: '泥石流',value: 4},
+ {name: '地质灾害',value: 4},
{name: '水旱',value: 5},
{name: '森林草原火灾',value: 6}
],
@@ -119,10 +96,15 @@
const res = await getMassRecord(this.search)
if(res.data.code == 200){
t.msg = res.data.data
- t.pagination.total = res.data.total
+ t.total = res.data.total
}else{
this.$message.error(res.data.msg)
}
+ },
+
+ searchData(){
+ this.search.pageIndex = 1
+ this.getData()
},
resetSearch(){
@@ -139,6 +121,12 @@
t.getData()
},
+ onPageChange(page, pageSize) {
+ const t= this
+ t.search.pageIndex = page
+ t.getData()
+ },
+
timeChange(value, dateString) {
const t = this
if(dateString){
@@ -151,8 +139,8 @@
},
viewDetails(item){
const t = this
- t.details = item
- t.visible = true
+ t.$refs.msgDetail.details = item
+ t.$refs.msgDetail.visible = true
},
getRiskName(disasterType){
@@ -184,6 +172,7 @@
align-items: center !important;
.tit{
width: 50%;
+ color: @base
}
}
/deep/ .ant-card-actions{
@@ -203,29 +192,6 @@
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
- }
- }
- }
- }
-}
-.detail-mod{
- font-size: 16px;
-
- .ant-row{
- margin-bottom: 24px;
-
- .table{
- display: flex;
- align-items: center;
- border-bottom: 1px solid @blackBorder;
- &:last-of-type{
- border-bottom: none;
- }
- &>div{
- border-right: 1px solid @blackBorder;
- padding: 5px 10px;
- &:last-of-type{
- border-right: none;
}
}
}
--
Gitblit v1.9.2