upload project
This commit is contained in:
commit
06961cae04
422 changed files with 110626 additions and 0 deletions
241
subpackages/media/visibility-selector/visibility-selector.js
Normal file
241
subpackages/media/visibility-selector/visibility-selector.js
Normal file
|
|
@ -0,0 +1,241 @@
|
|||
Page({
|
||||
data: {
|
||||
currentVisibility: '',
|
||||
selectedTags: [], // 选中的标签列表
|
||||
selectedTagsFriendsCount: 0, // 标签里的好友数量
|
||||
selectedTagsDisplayText: '', // 标签显示文本
|
||||
selectedFriends: [], // 选中的好友列表
|
||||
selectedFriendsCount: 0, // 选中的好友数量
|
||||
selectedFriendsDisplayText: '', // 选中的好友显示文本
|
||||
excludeTags: [], // 排除的标签列表
|
||||
excludeTagsFriendsCount: 0, // 排除标签里的好友数量
|
||||
excludeTagsDisplayText: '', // 排除标签显示文本
|
||||
excludeFriends: [], // 排除的好友列表
|
||||
excludeFriendsCount: 0, // 排除的好友数量
|
||||
excludeFriendsDisplayText: '' // 排除的好友显示文本
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
let visibility = options.currentVisibility || '';
|
||||
|
||||
// 如果当前选中的是隐藏的选项，重置为公开
|
||||
if (visibility === 'friends_only' || visibility === 'partial_visible' || visibility === 'exclude_friends') {
|
||||
visibility = 'public';
|
||||
}
|
||||
|
||||
if (visibility) {
|
||||
this.setData({
|
||||
currentVisibility: visibility
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onShow() {
|
||||
// 从标签或好友选择页面返回时，更新数据
|
||||
// 这里可以通过全局变量或事件总线来获取更新的数据
|
||||
// TODO: 实现从选择页面返回时的数据同步
|
||||
},
|
||||
|
||||
// 加载部分可见的数据
|
||||
loadPartialVisibleData() {
|
||||
// TODO: 从上一页获取已选中的标签和好友
|
||||
// 暂时使用空数据
|
||||
this.setData({
|
||||
selectedTags: [],
|
||||
selectedTagsFriendsCount: 0,
|
||||
selectedFriends: [],
|
||||
selectedFriendsCount: 0
|
||||
});
|
||||
},
|
||||
|
||||
// 选择标签
|
||||
selectTags() {
|
||||
const selectedTagsStr = encodeURIComponent(JSON.stringify(this.data.selectedTags || []));
|
||||
wx.navigateTo({
|
||||
url: `/subpackages/social/tag-friends/tag-friends?selectedTags=${selectedTagsStr}&mode=partial_visible`,
|
||||
success: (res) => {
|
||||
console.log('跳转到标签选择页面成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转失败:', err);
|
||||
wx.showToast({
|
||||
title: '跳转失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 选择好友
|
||||
selectFriends() {
|
||||
const selectedFriendsStr = encodeURIComponent(JSON.stringify(this.data.selectedFriends || []));
|
||||
wx.navigateTo({
|
||||
url: `/subpackages/social/friend-selector/friend-selector?selectedFriends=${selectedFriendsStr}&mode=partial_visible`,
|
||||
success: (res) => {
|
||||
console.log('跳转到好友选择页面成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转失败:', err);
|
||||
wx.showToast({
|
||||
title: '跳转失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 更新标签数据（从标签选择页面返回时调用）
|
||||
updateSelectedTags(tags, friendsCount, displayText) {
|
||||
this.setData({
|
||||
selectedTags: tags,
|
||||
selectedTagsFriendsCount: friendsCount,
|
||||
selectedTagsDisplayText: displayText || ''
|
||||
});
|
||||
},
|
||||
|
||||
// 更新好友数据（从好友选择页面返回时调用）
|
||||
updateSelectedFriends(friends, friendsCount, displayText) {
|
||||
this.setData({
|
||||
selectedFriends: friends,
|
||||
selectedFriendsCount: friendsCount,
|
||||
selectedFriendsDisplayText: displayText || ''
|
||||
});
|
||||
},
|
||||
|
||||
// 加载不给谁看的数据
|
||||
loadExcludeFriendsData() {
|
||||
// TODO: 从上一页获取已选中的排除标签和好友
|
||||
// 暂时使用空数据
|
||||
this.setData({
|
||||
excludeTags: [],
|
||||
excludeTagsFriendsCount: 0,
|
||||
excludeFriends: [],
|
||||
excludeFriendsCount: 0
|
||||
});
|
||||
},
|
||||
|
||||
// 选择排除标签
|
||||
selectExcludeTags() {
|
||||
const excludeTagsStr = encodeURIComponent(JSON.stringify(this.data.excludeTags || []));
|
||||
wx.navigateTo({
|
||||
url: `/subpackages/social/tag-friends/tag-friends?selectedTags=${excludeTagsStr}&mode=exclude_friends`,
|
||||
success: (res) => {
|
||||
console.log('跳转到排除标签选择页面成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转失败:', err);
|
||||
wx.showToast({
|
||||
title: '跳转失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 选择排除好友
|
||||
selectExcludeFriends() {
|
||||
const excludeFriendsStr = encodeURIComponent(JSON.stringify(this.data.excludeFriends || []));
|
||||
wx.navigateTo({
|
||||
url: `/subpackages/social/friend-selector/friend-selector?selectedFriends=${excludeFriendsStr}&mode=exclude_friends`,
|
||||
success: (res) => {
|
||||
console.log('跳转到排除好友选择页面成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转失败:', err);
|
||||
wx.showToast({
|
||||
title: '跳转失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 更新排除标签数据（从标签选择页面返回时调用）
|
||||
updateExcludeTags(tags, friendsCount, displayText) {
|
||||
this.setData({
|
||||
excludeTags: tags,
|
||||
excludeTagsFriendsCount: friendsCount,
|
||||
excludeTagsDisplayText: displayText || ''
|
||||
});
|
||||
},
|
||||
|
||||
// 更新排除好友数据（从好友选择页面返回时调用）
|
||||
updateExcludeFriends(friends, friendsCount, displayText) {
|
||||
this.setData({
|
||||
excludeFriends: friends,
|
||||
excludeFriendsCount: friendsCount,
|
||||
excludeFriendsDisplayText: displayText || ''
|
||||
});
|
||||
},
|
||||
|
||||
// 选择可见性选项
|
||||
selectVisibility(e) {
|
||||
const type = e.currentTarget.dataset.type;
|
||||
|
||||
// 禁止选择隐藏的选项
|
||||
if (type === 'friends_only' || type === 'partial_visible' || type === 'exclude_friends') {
|
||||
return;
|
||||
}
|
||||
|
||||
this.setData({
|
||||
currentVisibility: type
|
||||
});
|
||||
},
|
||||
|
||||
// 完成选择
|
||||
completeSelection() {
|
||||
// 获取当前选择的可见性状态
|
||||
const { currentVisibility, selectedTags, selectedFriends, excludeTags, excludeFriends } = this.data;
|
||||
|
||||
console.log('completeSelection 被调用，currentVisibility:', currentVisibility);
|
||||
|
||||
// 检查是否选择了可见性
|
||||
if (!currentVisibility || currentVisibility.trim() === '') {
|
||||
wx.showToast({
|
||||
title: '请选择可见性',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const pages = getCurrentPages();
|
||||
const prevPage = pages[pages.length - 2];
|
||||
|
||||
console.log('上一页是否存在:', !!prevPage);
|
||||
console.log('updateVisibility 方法是否存在:', prevPage && typeof prevPage.updateVisibility === 'function');
|
||||
|
||||
if (prevPage && typeof prevPage.updateVisibility === 'function') {
|
||||
// 如果是部分可见，传递标签和好友数据
|
||||
if (currentVisibility === 'partial_visible') {
|
||||
console.log('传递部分可见数据');
|
||||
prevPage.updateVisibility(currentVisibility, {
|
||||
selectedTags: selectedTags,
|
||||
selectedFriends: selectedFriends
|
||||
});
|
||||
} else if (currentVisibility === 'exclude_friends') {
|
||||
// 如果是不给谁看，传递排除标签和好友数据
|
||||
console.log('传递排除好友数据');
|
||||
prevPage.updateVisibility(currentVisibility, {
|
||||
excludeTags: excludeTags,
|
||||
excludeFriends: excludeFriends
|
||||
});
|
||||
} else {
|
||||
console.log('传递普通可见性:', currentVisibility);
|
||||
prevPage.updateVisibility(currentVisibility);
|
||||
}
|
||||
|
||||
// 延迟返回，确保 updateVisibility 执行完成
|
||||
setTimeout(() => {
|
||||
console.log('准备返回上一页');
|
||||
wx.navigateBack();
|
||||
}, 100);
|
||||
} else {
|
||||
console.error('无法获取上一页或 updateVisibility 方法不存在');
|
||||
// 如果无法获取上一页，直接返回
|
||||
wx.navigateBack();
|
||||
}
|
||||
},
|
||||
navigateBack() {
|
||||
wx.navigateBack();
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"navigationBarTitleText": "谁可以看",
|
||||
"navigationBarBackgroundColor": "#000000",
|
||||
"navigationBarTextStyle": "white",
|
||||
"backgroundColor": "#000000",
|
||||
"disableScroll": false
|
||||
}
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
<view class="visibility-selector-container">
|
||||
<!-- 主内容区 -->
|
||||
<scroll-view class="content-scroll" scroll-y>
|
||||
<!-- 可见性选项列表 -->
|
||||
<view class="options-list">
|
||||
<view
|
||||
class="visibility-option {{currentVisibility === 'public' ? 'selected' : ''}}"
|
||||
bindtap="selectVisibility"
|
||||
data-type="public"
|
||||
>
|
||||
<view class="option-checkbox">
|
||||
<view class="checkbox {{currentVisibility === 'public' ? 'checked' : ''}}">
|
||||
<image wx:if="{{currentVisibility === 'public'}}" src="/images/Selected.svg" mode="aspectFit" class="check-image"></image>
|
||||
<image wx:else src="/images/fram.svg" mode="aspectFit" class="uncheck-image"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="option-content">
|
||||
<view class="option-main">
|
||||
<text class="option-title">公开</text>
|
||||
<text class="option-desc"> 所有人可见</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="visibility-option {{currentVisibility === 'private' ? 'selected' : ''}}"
|
||||
bindtap="selectVisibility"
|
||||
data-type="private"
|
||||
>
|
||||
<view class="option-checkbox">
|
||||
<view class="checkbox {{currentVisibility === 'private' ? 'checked' : ''}}">
|
||||
<image wx:if="{{currentVisibility === 'private'}}" src="/images/Selected.svg" mode="aspectFit" class="check-image"></image>
|
||||
<image wx:else src="/images/fram.svg" mode="aspectFit" class="uncheck-image"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="option-content">
|
||||
<view class="option-main">
|
||||
<text class="option-title">私密</text>
|
||||
<text class="option-desc"> 仅自己可见</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 底部完成按钮 -->
|
||||
<view class="bottom-action">
|
||||
<button class="complete-btn" bindtap="completeSelection">完成</button>
|
||||
</view>
|
||||
</view>
|
||||
287
subpackages/media/visibility-selector/visibility-selector.wxss
Normal file
287
subpackages/media/visibility-selector/visibility-selector.wxss
Normal file
|
|
@ -0,0 +1,287 @@
|
|||
/* 页面根容器 */
|
||||
.page {
|
||||
background-color: #000000;
|
||||
color: #ffffff;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
/* 主容器 */
|
||||
.visibility-selector-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
/* 内容滚动区域 */
|
||||
.content-scroll {
|
||||
flex: 1;
|
||||
overflow-y: scroll;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
/* 选项列表 */
|
||||
.options-list {
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
/* 可见性选项 */
|
||||
.visibility-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
background-color: #111111;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.visibility-option.selected {
|
||||
background-color: #111111;
|
||||
}
|
||||
|
||||
/* 部分可见选项的头部（复选框和标题）- 默认保持水平布局 */
|
||||
.partial-visible-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 部分可见选项的特殊样式 - 按列排列 */
|
||||
.visibility-option.partial-visible-expanded {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 30rpx; /* 保持与默认一致的 padding */
|
||||
}
|
||||
|
||||
/* 部分可见选项头部在选中时的对齐 */
|
||||
.visibility-option.partial-visible-expanded .partial-visible-header {
|
||||
width: 100%;
|
||||
margin-bottom: 0; /* 确保没有额外间距 */
|
||||
}
|
||||
|
||||
/* 不给谁看选项的特殊样式 - 按列排列 */
|
||||
.visibility-option.exclude-friends-expanded {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 30rpx; /* 保持与默认一致的 padding */
|
||||
}
|
||||
|
||||
/* 不给谁看选项的头部（复选框和标题）- 默认保持水平布局 */
|
||||
.exclude-friends-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 不给谁看选项头部在选中时的对齐 */
|
||||
.visibility-option.exclude-friends-expanded .exclude-friends-header {
|
||||
width: 100%;
|
||||
margin-bottom: 0; /* 确保没有额外间距 */
|
||||
}
|
||||
|
||||
/* 复选框样式 */
|
||||
.option-checkbox {
|
||||
margin-right: 30rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.checkbox.checked {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* 选中图标样式 */
|
||||
.check-image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.uncheck-image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* 选项内容 */
|
||||
.option-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.option-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.option-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.option-desc {
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* 标签区域 */
|
||||
.tags-section {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tags-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tag-item {
|
||||
padding: 16rpx 30rpx;
|
||||
background-color: #333333;
|
||||
border-radius: 40rpx;
|
||||
font-size: 26rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.tags-description {
|
||||
font-size: 24rpx;
|
||||
color: #888888;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 好友选择区域 */
|
||||
.friends-selection-section {
|
||||
margin: 0 30rpx;
|
||||
background-color: #111111;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.friend-option {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 1rpx solid #333333;
|
||||
}
|
||||
|
||||
.friend-option:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.friend-option-label {
|
||||
font-size: 30rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.friend-option-value {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
margin-left: 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
/* 底部操作按钮 */
|
||||
.bottom-action {
|
||||
position: fixed;
|
||||
bottom: 100rpx;
|
||||
left: 30rpx;
|
||||
right: 30rpx;
|
||||
padding: 10rpx;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.complete-btn {
|
||||
width: 50%;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
background-image: linear-gradient(73deg, #EF6460, #EC42C8, #435CFF, #00D5FF);
|
||||
color: #ffffff;
|
||||
border-radius: 28rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
letter-spacing: 12rpx;
|
||||
}
|
||||
|
||||
/* 部分可见详细设置 */
|
||||
.partial-visible-details {
|
||||
margin-top: 20rpx;
|
||||
padding-left: 90rpx; /* 与复选框对齐 */
|
||||
padding-right: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 不给谁看详细设置 */
|
||||
.exclude-friends-details {
|
||||
margin-top: 20rpx;
|
||||
padding-left: 90rpx; /* 与复选框对齐 */
|
||||
padding-right: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.detail-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
padding: 20rpx 0;
|
||||
background-color: transparent;
|
||||
margin-bottom: 1px;
|
||||
margin-left: 20rpx
|
||||
}
|
||||
|
||||
.detail-title {
|
||||
flex-shrink: 0;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.detail-title-text {
|
||||
font-size: 32rpx;
|
||||
background: linear-gradient(90deg, #e90abb, #fbcb09);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.detail-value-text {
|
||||
font-size: 26rpx;
|
||||
color: #888888;
|
||||
line-height: 1.6;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue