|
49 | 49 |
|
50 | 50 | <div class="m-whitelist-list u-list" v-if="list && list.length"> |
51 | 51 | <div class="u-item" v-for="(item, i) in list" :key="item.kith_id || item.id"> |
| 52 | + <div class="u-item-actions"> |
| 53 | + <el-dropdown trigger="click" placement="bottom-end"> |
| 54 | + <span class="u-item-dropdown" @click.stop> |
| 55 | + <i class="el-icon-more"></i> |
| 56 | + </span> |
| 57 | + <template #dropdown> |
| 58 | + <el-dropdown-menu> |
| 59 | + <el-dropdown-item v-if="active === 'whitelist'" class="u-item-dropdown-menu"> |
| 60 | + <el-popconfirm |
| 61 | + title="确认删除亲友关系吗?" |
| 62 | + @confirm="remove(item.kith_id, i)" |
| 63 | + > |
| 64 | + <template #reference> |
| 65 | + <span class="u-item-dropdown-action" @click.stop>移除</span> |
| 66 | + </template> |
| 67 | + </el-popconfirm> |
| 68 | + </el-dropdown-item> |
| 69 | + <el-dropdown-item |
| 70 | + v-else |
| 71 | + class="u-item-dropdown-menu" |
| 72 | + @click="removeOther(item)" |
| 73 | + > |
| 74 | + 移除 |
| 75 | + </el-dropdown-item> |
| 76 | + </el-dropdown-menu> |
| 77 | + </template> |
| 78 | + </el-dropdown> |
| 79 | + </div> |
52 | 80 | <a class="u-item-pic" :href="userLink(item)" target="_blank"> |
53 | 81 | <img class="u-item-avatar" :src="showAvatar(getAvatar(item))" /> |
54 | 82 | </a> |
|
60 | 88 | </span> |
61 | 89 | <span class="u-item-remark u-pending" v-else> <i class="el-icon-loading"></i> 等待确认中... </span> |
62 | 90 | </template> |
63 | | - <div class="u-item-btns"> |
64 | | - <template v-if="active === 'whitelist'"> |
65 | | - <el-popconfirm title="确认删除亲友关系吗?" @confirm="remove(item.kith_id, i)"> |
66 | | - <template #reference> |
67 | | - <el-button icon="Delete" size="small">移除</el-button> |
68 | | - </template> |
69 | | - </el-popconfirm> |
70 | | - <!-- <el-button @click="edit(item.kith_id, item)" icon="Edit" class="u-btn-edit" size="small" type="warning" |
71 | | - >编辑</el-button |
72 | | - > --> |
73 | | - </template> |
74 | | - <template v-else> |
75 | | - <el-button @click="removeOther(item)" icon="Delete" class="u-btn-delete" size="small" |
76 | | - >移除</el-button |
77 | | - > |
78 | | - </template> |
| 91 | + <div class="u-item-time" :title="`建立时间:${formatCreatedAt(item)}`"> |
| 92 | + 建立时间:{{ formatCreatedAt(item) }} |
79 | 93 | </div> |
80 | 94 | </div> |
81 | 95 | </div> |
82 | 96 | <el-pagination |
| 97 | + class="m-whitelist-pagination" |
83 | 98 | background |
84 | 99 | v-if="active !== 'whitelist'" |
85 | | - hide-on-single-page |
86 | | - :current-page="pagination.pageIndex" |
| 100 | + :page-sizes="[10, 20, 50, 100]" |
| 101 | + v-model:current-page="pagination.pageIndex" |
| 102 | + v-model:page-size="pagination.pageSize" |
| 103 | + layout="total, sizes, prev, pager, next, jumper" |
87 | 104 | @current-change="currentChange" |
| 105 | + @size-change="handleSizeChange" |
88 | 106 | :total="pagination.total" |
89 | 107 | ></el-pagination> |
90 | 108 | </template> |
@@ -137,6 +155,7 @@ import { |
137 | 155 | import { getMyRss, getMySubscribers, removeRssUser, addRssUser, cancelRssUser } from "@/service/dashboard/rss"; |
138 | 156 | import { getRelationNetTypes, getRelationNetMembersByType, getWaitInvites } from "@/service/dashboard/relation.js"; |
139 | 157 | import { getUserConf, setUserConf } from "@/service/dashboard/conf"; |
| 158 | +import dateFormat from "@/utils/dateFormat"; |
140 | 159 | import User from "@jx3box/jx3box-common/js/user.js"; |
141 | 160 | import { showAvatar, authorLink } from "@jx3box/jx3box-common/js/utils"; |
142 | 161 | import lover from "./lover.vue"; |
@@ -352,6 +371,11 @@ export default { |
352 | 371 | this.pagination.pageIndex = val; |
353 | 372 | this.loadList(); |
354 | 373 | }, |
| 374 | + handleSizeChange(val) { |
| 375 | + this.pagination.pageSize = val; |
| 376 | + this.pagination.pageIndex = 1; |
| 377 | + this.loadList(); |
| 378 | + }, |
355 | 379 | // 搜索 |
356 | 380 | search(val) { |
357 | 381 | if (!val || isNaN(val)) return; |
@@ -569,6 +593,15 @@ export default { |
569 | 593 | } |
570 | 594 | return (item.kith_info || item).display_name; |
571 | 595 | }, |
| 596 | + formatCreatedAt(item) { |
| 597 | + const createdAt = item?.created_at; |
| 598 | + if (!createdAt) return "--"; |
| 599 | +
|
| 600 | + const date = new Date(createdAt); |
| 601 | + if (isNaN(date.getTime())) return createdAt; |
| 602 | +
|
| 603 | + return dateFormat(date); |
| 604 | + }, |
572 | 605 | showAvatar: function (val) { |
573 | 606 | return showAvatar(val, "m"); |
574 | 607 | }, |
|
0 commit comments