Skip to content

Commit 83b413e

Browse files
committed
feat:更新隐私设置
1 parent 5132724 commit 83b413e

2 files changed

Lines changed: 125 additions & 21 deletions

File tree

src/assets/css/dashboard/whitelist.less

Lines changed: 74 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@
7878
}
7979
.u-item {
8080
.fl;
81+
.pr;
8182

8283
.r(3px);
8384
background-color: #f9f9f9;
@@ -137,9 +138,41 @@
137138
color: #fba524;
138139
}
139140
}
140-
.u-item-btns {
141+
.u-item-actions {
142+
.pa;
143+
top: 10px;
144+
right: 10px;
145+
z-index: 2;
146+
}
147+
.u-item-dropdown {
148+
.flex;
149+
justify-content: center;
150+
align-items: center;
151+
.size(24px);
152+
.r(100%);
153+
color: #666;
154+
cursor: pointer;
155+
transition: 0.2s ease;
156+
&:hover {
157+
color: @primary;
158+
background-color: #f0f0f0;
159+
}
160+
}
161+
.u-item-time {
141162
.x;
142163
.mt(10px);
164+
min-height: 20px;
165+
.fz(12px, 20px);
166+
color: #888;
167+
opacity: 0;
168+
visibility: hidden;
169+
transition: opacity 0.2s ease, visibility 0.2s ease;
170+
}
171+
&:hover {
172+
.u-item-time {
173+
opacity: 1;
174+
visibility: visible;
175+
}
143176
}
144177
}
145178

@@ -152,6 +185,19 @@
152185
}
153186
}
154187

188+
:deep(.u-item-dropdown-menu .el-dropdown-menu__item) {
189+
padding: 0;
190+
}
191+
192+
:deep(.u-item-dropdown-action) {
193+
display: block;
194+
width: 100%;
195+
line-height: 36px;
196+
padding: 0 16px;
197+
cursor: pointer;
198+
color: inherit;
199+
}
200+
155201
.u-list {
156202
display: flex;
157203
flex-wrap: wrap;
@@ -237,6 +283,16 @@
237283
.w(100%);
238284
.mr(0);
239285

286+
.m-whitelist-pagination {
287+
display: flex;
288+
flex-wrap: nowrap;
289+
width: 100%;
290+
white-space: nowrap;
291+
overflow-x: auto;
292+
overflow-y: hidden;
293+
-webkit-overflow-scrolling: touch;
294+
}
295+
240296
.u-item {
241297
.mr(0);
242298
.w(100%);
@@ -256,9 +312,24 @@
256312
.x(left);
257313
}
258314

259-
.u-item-btns {
315+
.u-item-actions {
316+
top: 8px;
317+
right: 8px;
318+
}
319+
320+
.u-item-time {
321+
opacity: 1;
322+
visibility: visible;
323+
margin-top: 4px;
324+
}
325+
326+
.u-item-time,
327+
.u-item-remark {
328+
padding-right: 28px;
329+
}
330+
331+
.u-item-actions {
260332
.pa;
261-
.rb(10px);
262333
}
263334
}
264335
}

src/views/dashboard/privacy.vue

Lines changed: 51 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,34 @@
4949

5050
<div class="m-whitelist-list u-list" v-if="list && list.length">
5151
<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>
5280
<a class="u-item-pic" :href="userLink(item)" target="_blank">
5381
<img class="u-item-avatar" :src="showAvatar(getAvatar(item))" />
5482
</a>
@@ -60,31 +88,21 @@
6088
</span>
6189
<span class="u-item-remark u-pending" v-else> <i class="el-icon-loading"></i> 等待确认中... </span>
6290
</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) }}
7993
</div>
8094
</div>
8195
</div>
8296
<el-pagination
97+
class="m-whitelist-pagination"
8398
background
8499
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"
87104
@current-change="currentChange"
105+
@size-change="handleSizeChange"
88106
:total="pagination.total"
89107
></el-pagination>
90108
</template>
@@ -137,6 +155,7 @@ import {
137155
import { getMyRss, getMySubscribers, removeRssUser, addRssUser, cancelRssUser } from "@/service/dashboard/rss";
138156
import { getRelationNetTypes, getRelationNetMembersByType, getWaitInvites } from "@/service/dashboard/relation.js";
139157
import { getUserConf, setUserConf } from "@/service/dashboard/conf";
158+
import dateFormat from "@/utils/dateFormat";
140159
import User from "@jx3box/jx3box-common/js/user.js";
141160
import { showAvatar, authorLink } from "@jx3box/jx3box-common/js/utils";
142161
import lover from "./lover.vue";
@@ -352,6 +371,11 @@ export default {
352371
this.pagination.pageIndex = val;
353372
this.loadList();
354373
},
374+
handleSizeChange(val) {
375+
this.pagination.pageSize = val;
376+
this.pagination.pageIndex = 1;
377+
this.loadList();
378+
},
355379
// 搜索
356380
search(val) {
357381
if (!val || isNaN(val)) return;
@@ -569,6 +593,15 @@ export default {
569593
}
570594
return (item.kith_info || item).display_name;
571595
},
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+
},
572605
showAvatar: function (val) {
573606
return showAvatar(val, "m");
574607
},

0 commit comments

Comments
 (0)