逻辑修改.
This commit is contained in:
parent
93f7b104c8
commit
9cdd391a04
|
|
@ -48,3 +48,31 @@ export function getPrivacyPolicy() {
|
|||
export function setPrivacyPolicy(content: string) {
|
||||
return request.post('/admin/config/privacyPolicy', { content })
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取会员权益长图
|
||||
*/
|
||||
export function getMemberBenefitsImage() {
|
||||
return request.get('/admin/config/memberBenefitsImage')
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置会员权益长图
|
||||
*/
|
||||
export function setMemberBenefitsImage(imageUrl: string) {
|
||||
return request.post('/admin/config/memberBenefitsImage', { imageUrl })
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取搜索页Banner
|
||||
*/
|
||||
export function getSearchBanner() {
|
||||
return request.get('/admin/config/searchBanner')
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置搜索页Banner
|
||||
*/
|
||||
export function setSearchBanner(imageUrl: string) {
|
||||
return request.post('/admin/config/searchBanner', { imageUrl })
|
||||
}
|
||||
|
|
|
|||
65
admin/src/api/memberTier.ts
Normal file
65
admin/src/api/memberTier.ts
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
export interface MemberTier {
|
||||
id: number
|
||||
level: number
|
||||
name: string
|
||||
badge?: string
|
||||
price: number
|
||||
originalPrice: number
|
||||
discount?: string
|
||||
benefitsImage?: string
|
||||
sort: number
|
||||
status: number
|
||||
createTime: string
|
||||
updateTime: string
|
||||
}
|
||||
|
||||
export interface CreateMemberTierRequest {
|
||||
level: number
|
||||
name: string
|
||||
badge?: string
|
||||
price: number
|
||||
originalPrice: number
|
||||
discount?: string
|
||||
benefitsImage?: string
|
||||
sort: number
|
||||
status: number
|
||||
}
|
||||
|
||||
export interface UpdateMemberTierRequest extends CreateMemberTierRequest {}
|
||||
|
||||
/**
|
||||
* 获取会员等级配置列表
|
||||
*/
|
||||
export function getMemberTierList() {
|
||||
return request.get<MemberTier[]>('/admin/memberTiers')
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取单个会员等级配置
|
||||
*/
|
||||
export function getMemberTierById(id: number) {
|
||||
return request.get<MemberTier>(`/admin/memberTiers/${id}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建会员等级配置
|
||||
*/
|
||||
export function createMemberTier(data: CreateMemberTierRequest) {
|
||||
return request.post<MemberTier>('/admin/memberTiers', data)
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新会员等级配置
|
||||
*/
|
||||
export function updateMemberTier(id: number, data: UpdateMemberTierRequest) {
|
||||
return request.put(`/admin/memberTiers/${id}`, data)
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除会员等级配置
|
||||
*/
|
||||
export function deleteMemberTier(id: number) {
|
||||
return request.delete(`/admin/memberTiers/${id}`)
|
||||
}
|
||||
|
|
@ -154,6 +154,12 @@ export const asyncRoutes: RouteRecordRaw[] = [
|
|||
name: 'Notification',
|
||||
component: () => import('@/views/content/notification.vue'),
|
||||
meta: { title: '系统通知' }
|
||||
},
|
||||
{
|
||||
path: 'memberTier',
|
||||
name: 'MemberTier',
|
||||
component: () => import('@/views/content/memberTier.vue'),
|
||||
meta: { title: '会员配置' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
|
|||
650
admin/src/views/content/memberTier.vue
Normal file
650
admin/src/views/content/memberTier.vue
Normal file
|
|
@ -0,0 +1,650 @@
|
|||
<template>
|
||||
<div class="member-tier-container">
|
||||
<el-card>
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<div class="header-left">
|
||||
<span class="title">会员等级配置</span>
|
||||
<span class="subtitle">配置小程序会员页面展示的等级信息和权益图</span>
|
||||
</div>
|
||||
<el-button type="primary" @click="handleAdd">
|
||||
<el-icon><Plus /></el-icon>
|
||||
新增等级
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 卡片式展示 -->
|
||||
<div class="tier-cards" v-loading="loading">
|
||||
<div
|
||||
v-for="tier in tierList"
|
||||
:key="tier.id"
|
||||
class="tier-card"
|
||||
:class="{ disabled: tier.status !== 1 }"
|
||||
>
|
||||
<!-- 角标 -->
|
||||
<div class="tier-badge" v-if="tier.badge">{{ tier.badge }}</div>
|
||||
|
||||
<!-- 状态标签 -->
|
||||
<div class="tier-status">
|
||||
<el-tag :type="tier.status === 1 ? 'success' : 'info'" size="small">
|
||||
{{ tier.status === 1 ? '启用' : '禁用' }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<!-- 等级信息 -->
|
||||
<div class="tier-info">
|
||||
<div class="tier-level">等级 {{ tier.level }}</div>
|
||||
<div class="tier-name">{{ tier.name }}</div>
|
||||
<div class="tier-price">
|
||||
<span class="current-price">¥{{ tier.price }}</span>
|
||||
<span class="original-price">¥{{ tier.originalPrice }}</span>
|
||||
</div>
|
||||
<div class="tier-discount" v-if="tier.discount">{{ tier.discount }}</div>
|
||||
</div>
|
||||
|
||||
<!-- 权益图预览 -->
|
||||
<div class="tier-image">
|
||||
<el-image
|
||||
v-if="tier.benefitsImage"
|
||||
:src="getFullUrl(tier.benefitsImage)"
|
||||
:preview-src-list="[getFullUrl(tier.benefitsImage)]"
|
||||
fit="contain"
|
||||
class="benefits-preview"
|
||||
>
|
||||
<template #error>
|
||||
<div class="image-error">
|
||||
<el-icon><Picture /></el-icon>
|
||||
<span>加载失败</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
<div v-else class="no-image">
|
||||
<el-icon><Picture /></el-icon>
|
||||
<span>暂无权益图</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div class="tier-actions">
|
||||
<el-button type="primary" size="small" @click="handleEdit(tier)">
|
||||
<el-icon><Edit /></el-icon>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button type="danger" size="small" plain @click="handleDelete(tier)">
|
||||
<el-icon><Delete /></el-icon>
|
||||
删除
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 排序标识 -->
|
||||
<div class="tier-sort">排序: {{ tier.sort }}</div>
|
||||
</div>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<el-empty v-if="!loading && tierList.length === 0" description="暂无会员等级配置">
|
||||
<el-button type="primary" @click="handleAdd">立即添加</el-button>
|
||||
</el-empty>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- 编辑弹窗 -->
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="isEdit ? '编辑会员等级' : '新增会员等级'"
|
||||
width="650px"
|
||||
destroy-on-close
|
||||
>
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="会员等级" prop="level">
|
||||
<el-select v-model="formData.level" placeholder="请选择等级" style="width: 100%">
|
||||
<el-option :value="1" label="等级1 - 永久会员" />
|
||||
<el-option :value="2" label="等级2 - 诚意会员" />
|
||||
<el-option :value="3" label="等级3 - 家庭版会员" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="等级名称" prop="name">
|
||||
<el-input v-model="formData.name" placeholder="如：永久会员" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="现价(元)" prop="price">
|
||||
<el-input-number v-model="formData.price" :min="0" :precision="0" :controls="false" style="width: 100%" placeholder="1299" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="原价(元)" prop="originalPrice">
|
||||
<el-input-number v-model="formData.originalPrice" :min="0" :precision="0" :controls="false" style="width: 100%" placeholder="1899" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="角标文字" prop="badge">
|
||||
<el-input v-model="formData.badge" placeholder="如：家庭版（可选）" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="折扣描述" prop="discount">
|
||||
<el-input v-model="formData.discount" placeholder="如：8折优惠" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="权益图片" prop="benefitsImage">
|
||||
<div class="benefits-upload-wrapper">
|
||||
<el-upload
|
||||
class="image-uploader"
|
||||
:action="uploadUrl"
|
||||
:headers="uploadHeaders"
|
||||
:show-file-list="false"
|
||||
:on-success="handleUploadSuccess"
|
||||
:before-upload="beforeUpload"
|
||||
accept="image/*"
|
||||
>
|
||||
<div v-if="formData.benefitsImage" class="preview-wrapper">
|
||||
<img :src="getFullUrl(formData.benefitsImage)" class="preview-image" />
|
||||
<div class="preview-mask">
|
||||
<el-icon><Upload /></el-icon>
|
||||
<span>重新上传</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="upload-placeholder">
|
||||
<el-icon><Plus /></el-icon>
|
||||
<span>上传权益图</span>
|
||||
</div>
|
||||
</el-upload>
|
||||
<div class="upload-tip">
|
||||
<p><el-icon><InfoFilled /></el-icon> 建议尺寸：宽度750px，高度不限</p>
|
||||
<p><el-icon><InfoFilled /></el-icon> 支持JPG、PNG格式，最大5MB</p>
|
||||
<p><el-icon><InfoFilled /></el-icon> 此图片将在小程序会员页面展示</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="排序" prop="sort">
|
||||
<el-input-number v-model="formData.sort" :min="0" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-switch
|
||||
v-model="formData.status"
|
||||
:active-value="1"
|
||||
:inactive-value="2"
|
||||
active-text="启用"
|
||||
inactive-text="禁用"
|
||||
inline-prompt
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="handleSubmit" :loading="submitting">保存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, computed, onMounted } from 'vue'
|
||||
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
|
||||
import { Plus, Edit, Delete, Picture, Upload, InfoFilled } from '@element-plus/icons-vue'
|
||||
import {
|
||||
getMemberTierList,
|
||||
createMemberTier,
|
||||
updateMemberTier,
|
||||
deleteMemberTier,
|
||||
type MemberTier
|
||||
} from '@/api/memberTier'
|
||||
import { useUserStore } from '@/stores/user'
|
||||
|
||||
const userStore = useUserStore()
|
||||
const apiBaseUrl = import.meta.env.VITE_API_BASE_URL || 'http://localhost:5001/api'
|
||||
const serverUrl = apiBaseUrl.replace(/\/api$/, '')
|
||||
|
||||
const loading = ref(false)
|
||||
const tierList = ref<MemberTier[]>([])
|
||||
const dialogVisible = ref(false)
|
||||
const isEdit = ref(false)
|
||||
const submitting = ref(false)
|
||||
const formRef = ref<FormInstance>()
|
||||
const editingId = ref<number | null>(null)
|
||||
|
||||
const formData = reactive({
|
||||
level: 1,
|
||||
name: '',
|
||||
badge: '',
|
||||
price: 0,
|
||||
originalPrice: 0,
|
||||
discount: '',
|
||||
benefitsImage: '',
|
||||
sort: 0,
|
||||
status: 1
|
||||
})
|
||||
|
||||
const formRules: FormRules = {
|
||||
level: [{ required: true, message: '请选择会员等级', trigger: 'change' }],
|
||||
name: [{ required: true, message: '请输入等级名称', trigger: 'blur' }],
|
||||
price: [{ required: true, message: '请输入现价', trigger: 'blur' }],
|
||||
originalPrice: [{ required: true, message: '请输入原价', trigger: 'blur' }]
|
||||
}
|
||||
|
||||
const uploadUrl = computed(() => `${apiBaseUrl}/admin/upload`)
|
||||
const uploadHeaders = computed(() => ({
|
||||
Authorization: `Bearer ${userStore.token}`
|
||||
}))
|
||||
|
||||
const getFullUrl = (url: string) => {
|
||||
if (!url) return ''
|
||||
if (url.startsWith('http')) return url
|
||||
return `${serverUrl}${url}`
|
||||
}
|
||||
|
||||
const loadList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res: any = await getMemberTierList()
|
||||
tierList.value = res || []
|
||||
} catch (error) {
|
||||
console.error('加载列表失败:', error)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const resetForm = () => {
|
||||
formData.level = 1
|
||||
formData.name = ''
|
||||
formData.badge = ''
|
||||
formData.price = 0
|
||||
formData.originalPrice = 0
|
||||
formData.discount = ''
|
||||
formData.benefitsImage = ''
|
||||
formData.sort = 0
|
||||
formData.status = 1
|
||||
editingId.value = null
|
||||
}
|
||||
|
||||
const handleAdd = () => {
|
||||
resetForm()
|
||||
isEdit.value = false
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
const handleEdit = (row: MemberTier) => {
|
||||
isEdit.value = true
|
||||
editingId.value = row.id
|
||||
formData.level = row.level
|
||||
formData.name = row.name
|
||||
formData.badge = row.badge || ''
|
||||
formData.price = row.price
|
||||
formData.originalPrice = row.originalPrice
|
||||
formData.discount = row.discount || ''
|
||||
formData.benefitsImage = row.benefitsImage || ''
|
||||
formData.sort = row.sort
|
||||
formData.status = row.status
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
const handleDelete = async (row: MemberTier) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要删除「${row.name}」吗？删除后小程序将不再显示该等级。`,
|
||||
'删除确认',
|
||||
{ type: 'warning', confirmButtonText: '确定删除', cancelButtonText: '取消' }
|
||||
)
|
||||
await deleteMemberTier(row.id)
|
||||
ElMessage.success('删除成功')
|
||||
loadList()
|
||||
} catch (error) {
|
||||
if (error !== 'cancel') {
|
||||
console.error('删除失败:', error)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const handleUploadSuccess = (response: any) => {
|
||||
if (response.code === 0 && response.data) {
|
||||
formData.benefitsImage = response.data.url
|
||||
ElMessage.success('上传成功')
|
||||
} else {
|
||||
ElMessage.error(response.message || '上传失败')
|
||||
}
|
||||
}
|
||||
|
||||
const beforeUpload = (file: File) => {
|
||||
const isImage = file.type.startsWith('image/')
|
||||
const isLt5M = file.size / 1024 / 1024 < 5
|
||||
|
||||
if (!isImage) {
|
||||
ElMessage.error('只能上传图片文件!')
|
||||
return false
|
||||
}
|
||||
if (!isLt5M) {
|
||||
ElMessage.error('图片大小不能超过 5MB!')
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!formRef.value) return
|
||||
|
||||
try {
|
||||
await formRef.value.validate()
|
||||
submitting.value = true
|
||||
|
||||
const data = {
|
||||
level: formData.level,
|
||||
name: formData.name,
|
||||
badge: formData.badge || undefined,
|
||||
price: formData.price,
|
||||
originalPrice: formData.originalPrice,
|
||||
discount: formData.discount || undefined,
|
||||
benefitsImage: formData.benefitsImage || undefined,
|
||||
sort: formData.sort,
|
||||
status: formData.status
|
||||
}
|
||||
|
||||
if (isEdit.value && editingId.value) {
|
||||
await updateMemberTier(editingId.value, data)
|
||||
ElMessage.success('更新成功')
|
||||
} else {
|
||||
await createMemberTier(data)
|
||||
ElMessage.success('创建成功')
|
||||
}
|
||||
|
||||
dialogVisible.value = false
|
||||
loadList()
|
||||
} catch (error) {
|
||||
console.error('提交失败:', error)
|
||||
} finally {
|
||||
submitting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.member-tier-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.header-left .title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.header-left .subtitle {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
/* 卡片式布局 */
|
||||
.tier-cards {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
flex-wrap: wrap;
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.tier-card {
|
||||
width: 280px;
|
||||
background: linear-gradient(135deg, #fdfbf7 0%, #fff 100%);
|
||||
border: 1px solid #e8e4dc;
|
||||
border-radius: 12px;
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.tier-card:hover {
|
||||
box-shadow: 0 4px 20px rgba(201, 168, 108, 0.15);
|
||||
border-color: #c9a86c;
|
||||
}
|
||||
|
||||
.tier-card.disabled {
|
||||
opacity: 0.6;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 角标 */
|
||||
.tier-badge {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
right: -1px;
|
||||
padding: 4px 12px;
|
||||
background: linear-gradient(135deg, #ff6b6b 0%, #ff5252 100%);
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
border-radius: 0 12px 0 12px;
|
||||
}
|
||||
|
||||
/* 状态标签 */
|
||||
.tier-status {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
/* 等级信息 */
|
||||
.tier-info {
|
||||
text-align: center;
|
||||
padding: 10px 0 15px;
|
||||
border-bottom: 1px dashed #e8e4dc;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tier-level {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.tier-name {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #c9a86c;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.tier-price {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.current-price {
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.original-price {
|
||||
font-size: 14px;
|
||||
color: #c0c4cc;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.tier-discount {
|
||||
font-size: 12px;
|
||||
color: #ff6b6b;
|
||||
background: #fff2f0;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* 权益图预览 */
|
||||
.tier-image {
|
||||
height: 120px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #fafafa;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.benefits-preview {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.no-image,
|
||||
.image-error {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #c0c4cc;
|
||||
font-size: 12px;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.no-image .el-icon,
|
||||
.image-error .el-icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
/* 操作按钮 */
|
||||
.tier-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 排序标识 */
|
||||
.tier-sort {
|
||||
position: absolute;
|
||||
bottom: 8px;
|
||||
right: 12px;
|
||||
font-size: 11px;
|
||||
color: #c0c4cc;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.benefits-upload-wrapper {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.image-uploader :deep(.el-upload) {
|
||||
border: 2px dashed #dcdfe6;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s;
|
||||
width: 200px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.image-uploader :deep(.el-upload:hover) {
|
||||
border-color: #c9a86c;
|
||||
}
|
||||
|
||||
.preview-wrapper {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.preview-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.preview-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.preview-wrapper:hover .preview-mask {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.preview-mask .el-icon {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.upload-placeholder {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #909399;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.upload-placeholder .el-icon {
|
||||
font-size: 32px;
|
||||
color: #c0c4cc;
|
||||
}
|
||||
|
||||
.upload-tip {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
color: #909399;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.upload-tip p {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.upload-tip .el-icon {
|
||||
color: #c9a86c;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -34,6 +34,29 @@
|
|||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 搜索页Banner设置 -->
|
||||
<el-form-item label="搜索页Banner">
|
||||
<div class="banner-upload">
|
||||
<el-upload
|
||||
class="banner-uploader"
|
||||
:action="uploadUrl"
|
||||
:headers="uploadHeaders"
|
||||
:show-file-list="false"
|
||||
:on-success="handleBannerSuccess"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
accept="image/*"
|
||||
>
|
||||
<img v-if="configForm.searchBanner" :src="getFullUrl(configForm.searchBanner)" class="banner-preview" />
|
||||
<el-icon v-else class="banner-uploader-icon"><Plus /></el-icon>
|
||||
</el-upload>
|
||||
<div class="avatar-tip">
|
||||
<p>建议尺寸：750x320像素</p>
|
||||
<p>支持格式：JPG、PNG</p>
|
||||
<p>小程序搜索页顶部展示的Banner图片</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="saveBasicConfig" :loading="saving">
|
||||
保存配置
|
||||
|
|
@ -94,19 +117,21 @@ import {
|
|||
getUserAgreement,
|
||||
setUserAgreement,
|
||||
getPrivacyPolicy,
|
||||
setPrivacyPolicy
|
||||
setPrivacyPolicy,
|
||||
getSearchBanner,
|
||||
setSearchBanner
|
||||
} from '@/api/config'
|
||||
import { useUserStore } from '@/stores/user'
|
||||
|
||||
const userStore = useUserStore()
|
||||
const apiBaseUrl = import.meta.env.VITE_API_BASE_URL || 'http://localhost:5000/api'
|
||||
// 去掉 /api 后缀获取服务器根地址
|
||||
const serverUrl = apiBaseUrl.replace(/\/api$/, '')
|
||||
|
||||
const activeTab = ref('basic')
|
||||
|
||||
const configForm = ref({
|
||||
defaultAvatar: ''
|
||||
defaultAvatar: '',
|
||||
searchBanner: ''
|
||||
})
|
||||
|
||||
const agreementForm = ref({
|
||||
|
|
@ -132,10 +157,15 @@ const getFullUrl = (url) => {
|
|||
|
||||
const loadConfig = async () => {
|
||||
try {
|
||||
const res = await getDefaultAvatar()
|
||||
// request 拦截器已经处理了 code，直接返回 data
|
||||
if (res) {
|
||||
configForm.value.defaultAvatar = res.avatarUrl || ''
|
||||
const [avatarRes, bannerRes] = await Promise.all([
|
||||
getDefaultAvatar(),
|
||||
getSearchBanner()
|
||||
])
|
||||
if (avatarRes) {
|
||||
configForm.value.defaultAvatar = avatarRes.avatarUrl || ''
|
||||
}
|
||||
if (bannerRes) {
|
||||
configForm.value.searchBanner = bannerRes.imageUrl || ''
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载配置失败:', error)
|
||||
|
|
@ -170,6 +200,15 @@ const handleAvatarSuccess = (response) => {
|
|||
}
|
||||
}
|
||||
|
||||
const handleBannerSuccess = (response) => {
|
||||
if (response.code === 0 && response.data) {
|
||||
configForm.value.searchBanner = response.data.url
|
||||
ElMessage.success('上传成功')
|
||||
} else {
|
||||
ElMessage.error(response.message || '上传失败')
|
||||
}
|
||||
}
|
||||
|
||||
const beforeAvatarUpload = (file) => {
|
||||
const isImage = file.type.startsWith('image/')
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
|
@ -186,18 +225,22 @@ const beforeAvatarUpload = (file) => {
|
|||
}
|
||||
|
||||
const saveBasicConfig = async () => {
|
||||
if (!configForm.value.defaultAvatar) {
|
||||
ElMessage.warning('请先上传默认头像')
|
||||
return
|
||||
}
|
||||
|
||||
saving.value = true
|
||||
try {
|
||||
// request 拦截器会处理错误，成功时直接返回
|
||||
await setDefaultAvatar(configForm.value.defaultAvatar)
|
||||
ElMessage.success('保存成功')
|
||||
const promises = []
|
||||
if (configForm.value.defaultAvatar) {
|
||||
promises.push(setDefaultAvatar(configForm.value.defaultAvatar))
|
||||
}
|
||||
if (configForm.value.searchBanner) {
|
||||
promises.push(setSearchBanner(configForm.value.searchBanner))
|
||||
}
|
||||
if (promises.length > 0) {
|
||||
await Promise.all(promises)
|
||||
ElMessage.success('保存成功')
|
||||
} else {
|
||||
ElMessage.warning('请先上传配置图片')
|
||||
}
|
||||
} catch (error) {
|
||||
// 错误已在拦截器中处理
|
||||
console.error('保存失败:', error)
|
||||
} finally {
|
||||
saving.value = false
|
||||
|
|
@ -317,6 +360,47 @@ onMounted(() => {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.banner-upload {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.banner-uploader {
|
||||
width: 300px;
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
.banner-uploader :deep(.el-upload) {
|
||||
border: 1px dashed var(--el-border-color);
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: var(--el-transition-duration-fast);
|
||||
width: 300px;
|
||||
height: 128px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.banner-uploader :deep(.el-upload:hover) {
|
||||
border-color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.banner-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
}
|
||||
|
||||
.banner-preview {
|
||||
width: 300px;
|
||||
height: 128px;
|
||||
display: block;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.agreement-editor {
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,17 @@
|
|||
<script>
|
||||
import { useConfigStore } from './store/config.js'
|
||||
import { useUserStore } from './store/user.js'
|
||||
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
console.log('App Launch')
|
||||
// 恢复用户状态
|
||||
const userStore = useUserStore()
|
||||
userStore.restoreFromStorage()
|
||||
|
||||
// 加载所有配置（一次请求）
|
||||
const configStore = useConfigStore()
|
||||
configStore.loadAppConfig()
|
||||
},
|
||||
onShow: function() {
|
||||
console.log('App Show')
|
||||
|
|
|
|||
|
|
@ -1,60 +1,43 @@
|
|||
/**
|
||||
* 配置接口模块
|
||||
* Requirements: 2.1, 2.2, 3.2
|
||||
* 小程序启动时调用统一配置接口，一次获取所有配置
|
||||
*/
|
||||
|
||||
import { get } from './request'
|
||||
|
||||
/**
|
||||
* 获取首页配置（Banner和金刚位）
|
||||
* WHEN a user visits the home page, THE XiangYi_MiniApp SHALL display Banner images
|
||||
* WHEN a user visits the home page, THE XiangYi_MiniApp SHALL display KingKong navigation icons
|
||||
* Requirements: 2.1, 2.2
|
||||
* 获取小程序统一配置（启动时调用）
|
||||
* 包含：Banner、金刚位、默认头像、搜索页Banner、弹窗配置
|
||||
*
|
||||
* @returns {Promise<Object>} 首页配置，包含banners和kingKongs
|
||||
* @returns {Promise<Object>} 统一配置
|
||||
*/
|
||||
export async function getHomeConfig() {
|
||||
const response = await get('/config/home', {}, { needAuth: false })
|
||||
export async function getAppConfig() {
|
||||
const response = await get('/config/app', {}, { needAuth: false })
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取弹窗配置
|
||||
* WHEN a user opens the XiangYi_MiniApp for the first time each day,
|
||||
* THE XiangYi_MiniApp SHALL display the daily popup
|
||||
* Requirements: 3.2
|
||||
* 获取用户协议
|
||||
*
|
||||
* @param {number} popupType - 弹窗类型：1每日首次 2服务号关注 3会员广告
|
||||
* @returns {Promise<Object>} 弹窗配置
|
||||
* @returns {Promise<Object>} 用户协议内容
|
||||
*/
|
||||
export async function getPopupConfig(popupType = 1) {
|
||||
const response = await get('/config/popup', { popupType })
|
||||
export async function getUserAgreement() {
|
||||
const response = await get('/config/userAgreement', {}, { needAuth: false })
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取所有弹窗配置
|
||||
* 获取隐私协议
|
||||
*
|
||||
* @returns {Promise<Object>} 弹窗配置列表
|
||||
* @returns {Promise<Object>} 隐私协议内容
|
||||
*/
|
||||
export async function getAllPopupConfigs() {
|
||||
const response = await get('/config/popups')
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取默认头像配置
|
||||
*
|
||||
* @returns {Promise<Object>} 默认头像URL
|
||||
*/
|
||||
export async function getDefaultAvatarConfig() {
|
||||
const response = await get('/config/defaultAvatar', {}, { needAuth: false })
|
||||
export async function getPrivacyPolicy() {
|
||||
const response = await get('/config/privacyPolicy', {}, { needAuth: false })
|
||||
return response
|
||||
}
|
||||
|
||||
export default {
|
||||
getHomeConfig,
|
||||
getPopupConfig,
|
||||
getAllPopupConfigs,
|
||||
getDefaultAvatarConfig
|
||||
getAppConfig,
|
||||
getUserAgreement,
|
||||
getPrivacyPolicy
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const ENV = {
|
|||
}
|
||||
|
||||
// 当前环境 - 开发时使用 development，打包时改为 production
|
||||
const CURRENT_ENV = 'development'
|
||||
const CURRENT_ENV = 'production'
|
||||
|
||||
// 导出配置
|
||||
export const config = {
|
||||
|
|
@ -44,4 +44,20 @@ export const config = {
|
|||
REQUEST_RETRY_DELAY: 1000
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取API基础地址
|
||||
* @returns {string}
|
||||
*/
|
||||
export function getApiBaseUrl() {
|
||||
return ENV[CURRENT_ENV].API_BASE_URL
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取静态资源基础地址
|
||||
* @returns {string}
|
||||
*/
|
||||
export function getStaticBaseUrl() {
|
||||
return ENV[CURRENT_ENV].STATIC_BASE_URL
|
||||
}
|
||||
|
||||
export default config
|
||||
|
|
@ -81,6 +81,7 @@
|
|||
{
|
||||
"path": "pages/member/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "会员中心"
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -12,8 +12,29 @@
|
|||
:buttonText="dailyPopup?.buttonText" :linkUrl="dailyPopup?.linkUrl" @close="handleCloseDailyPopup"
|
||||
@confirm="handleDailyPopupConfirm" />
|
||||
|
||||
<!-- 固定头部区域 -->
|
||||
<view class="fixed-header">
|
||||
<!-- 会员广告条 - 固定在底部 -->
|
||||
<view class="member-ad-section" v-if="showMemberAd">
|
||||
<view class="member-ad-bar" :style="memberAdBgStyle">
|
||||
<view class="ad-content" @click="handleMemberAdClick">
|
||||
<text class="ad-icon">👑</text>
|
||||
<text class="ad-text">{{ memberAdConfig?.title || '开通会员，解锁更多优质用户' }}</text>
|
||||
</view>
|
||||
<text class="ad-btn" @click="handleMemberAdClick">{{ memberAdConfig?.buttonText || '购买' }}</text>
|
||||
<view class="ad-close" @click.stop="handleCloseMemberAd">
|
||||
<text>×</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 整页滚动区域 -->
|
||||
<scroll-view
|
||||
class="page-scroll"
|
||||
scroll-y
|
||||
refresher-enabled
|
||||
:refresher-triggered="isRefreshing"
|
||||
@refresherrefresh="handleRefresh"
|
||||
@scrolltolower="handleScrollToLower"
|
||||
>
|
||||
<!-- Banner区域（导航栏和搜索框浮在Banner上） -->
|
||||
<view class="banner-section">
|
||||
<!-- Banner 轮播图 -->
|
||||
|
|
@ -65,25 +86,7 @@
|
|||
</view>
|
||||
<text class="section-subtitle">每天早上五点准时更新</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员广告条 - 固定在底部 -->
|
||||
<view class="member-ad-section" v-if="showMemberAd">
|
||||
<view class="member-ad-bar" :style="memberAdBgStyle">
|
||||
<view class="ad-content" @click="handleMemberAdClick">
|
||||
<text class="ad-icon">👑</text>
|
||||
<text class="ad-text">{{ memberAdConfig?.title || '开通会员，解锁更多优质用户' }}</text>
|
||||
</view>
|
||||
<text class="ad-btn" @click="handleMemberAdClick">{{ memberAdConfig?.buttonText || '购买' }}</text>
|
||||
<view class="ad-close" @click.stop="handleCloseMemberAd">
|
||||
<text>×</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 可滚动的用户列表区域 -->
|
||||
<scroll-view class="user-scroll-area" scroll-y :style="{ height: scrollHeight }" refresher-enabled
|
||||
:refresher-triggered="isRefreshing" @refresherrefresh="handleRefresh" @scrolltolower="handleScrollToLower">
|
||||
<!-- 用户列表 -->
|
||||
<view class="user-list" v-if="recommendList.length > 0">
|
||||
<UserCard v-for="user in recommendList" :key="user.userId" :userId="user.userId"
|
||||
|
|
@ -103,6 +106,9 @@
|
|||
|
||||
<!-- 加载更多 -->
|
||||
<Loading type="more" :loading="listLoading" :noMore="noMoreData" />
|
||||
|
||||
<!-- 底部占位（tabbar高度） -->
|
||||
<view class="bottom-placeholder"></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -119,10 +125,6 @@
|
|||
import {
|
||||
useConfigStore
|
||||
} from '@/store/config.js'
|
||||
import {
|
||||
getHomeConfig,
|
||||
getPopupConfig
|
||||
} from '@/api/config.js'
|
||||
import {
|
||||
getRecommend
|
||||
} from '@/api/user.js'
|
||||
|
|
@ -153,7 +155,6 @@
|
|||
const pageLoading = ref(true)
|
||||
const listLoading = ref(false)
|
||||
const noMoreData = ref(false)
|
||||
const scrollHeight = ref('300px')
|
||||
const isRefreshing = ref(false)
|
||||
|
||||
// 分页参数
|
||||
|
|
@ -191,7 +192,6 @@
|
|||
backgroundPosition: 'center'
|
||||
}
|
||||
}
|
||||
// 默认渐变背景
|
||||
return {
|
||||
background: 'linear-gradient(135deg, #ff9a9e 0%, #fecfef 50%, #fecfef 100%)'
|
||||
}
|
||||
|
|
@ -208,46 +208,6 @@
|
|||
}
|
||||
})
|
||||
|
||||
// 加载首页配置
|
||||
const loadHomeConfig = async () => {
|
||||
try {
|
||||
const res = await getHomeConfig()
|
||||
if (res && res.code === 0) {
|
||||
configStore.setHomeConfig({
|
||||
banners: res.data?.banners || [],
|
||||
kingKongs: res.data?.kingKongs || [],
|
||||
defaultAvatar: res.data?.defaultAvatar || ''
|
||||
})
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载首页配置失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 加载每日弹窗配置
|
||||
const loadDailyPopup = async () => {
|
||||
try {
|
||||
const res = await getPopupConfig(1)
|
||||
if (res && res.code === 0 && res.data) {
|
||||
configStore.setDailyPopup(res.data)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载弹窗配置失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 加载会员广告配置
|
||||
const loadMemberAdConfig = async () => {
|
||||
try {
|
||||
const res = await getPopupConfig(3) // 3=会员广告
|
||||
if (res && res.code === 0 && res.data) {
|
||||
configStore.setMemberAdConfig(res.data)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载会员广告配置失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 加载推荐用户列表
|
||||
const loadRecommendList = async (isLoadMore = false) => {
|
||||
if (listLoading.value) return
|
||||
|
|
@ -272,7 +232,6 @@
|
|||
recommendList.value = items
|
||||
}
|
||||
|
||||
// 判断是否还有更多数据
|
||||
noMoreData.value = recommendList.value.length >= total.value
|
||||
pageIndex.value++
|
||||
}
|
||||
|
|
@ -306,23 +265,16 @@
|
|||
// 恢复用户状态
|
||||
userStore.restoreFromStorage()
|
||||
|
||||
// 先加载不需要登录的配置
|
||||
await Promise.all([
|
||||
loadHomeConfig(),
|
||||
loadDailyPopup(),
|
||||
loadMemberAdConfig()
|
||||
])
|
||||
// 确保配置已加载（App.vue中已调用，这里等待完成）
|
||||
if (!configStore.isLoaded) {
|
||||
await configStore.loadAppConfig()
|
||||
}
|
||||
|
||||
// 加载推荐列表（无论是否登录都加载）
|
||||
// 加载推荐列表
|
||||
await loadRecommendList()
|
||||
|
||||
// 检查弹窗显示
|
||||
checkPopups()
|
||||
|
||||
// 计算滚动区域高度
|
||||
setTimeout(() => {
|
||||
calcScrollHeight()
|
||||
}, 100)
|
||||
} catch (error) {
|
||||
console.error('初始化页面失败:', error)
|
||||
} finally {
|
||||
|
|
@ -342,12 +294,10 @@
|
|||
if (!banner.linkUrl) return
|
||||
|
||||
if (banner.linkType === 1) {
|
||||
// 内部页面
|
||||
uni.navigateTo({
|
||||
url: banner.linkUrl
|
||||
})
|
||||
} else if (banner.linkType === 2) {
|
||||
// 外部链接
|
||||
uni.setClipboardData({
|
||||
data: banner.linkUrl,
|
||||
success: () => {
|
||||
|
|
@ -364,7 +314,6 @@
|
|||
const handleKingKongClick = (item) => {
|
||||
if (!item.linkUrl) return
|
||||
|
||||
// 判断是否是tabbar页面
|
||||
const tabbarPages = ['/pages/index/index', '/pages/message/index', '/pages/mine/index']
|
||||
if (tabbarPages.includes(item.linkUrl)) {
|
||||
uni.switchTab({
|
||||
|
|
@ -381,12 +330,10 @@
|
|||
const handleMemberAdClick = () => {
|
||||
const linkUrl = configStore.memberAdConfig?.linkUrl
|
||||
if (linkUrl) {
|
||||
// 使用后台配置的链接
|
||||
uni.navigateTo({
|
||||
url: linkUrl
|
||||
})
|
||||
} else {
|
||||
// 默认跳转会员中心
|
||||
uni.navigateTo({
|
||||
url: '/pages/member/index'
|
||||
})
|
||||
|
|
@ -402,32 +349,19 @@
|
|||
const handleGenderSelect = (gender) => {
|
||||
userStore.setGenderPref(gender)
|
||||
configStore.closeGenderPopup()
|
||||
// 选择性别后重新加载推荐列表
|
||||
loadRecommendList()
|
||||
// 检查是否需要显示其他弹窗
|
||||
checkPopups()
|
||||
}
|
||||
|
||||
// 关闭每日弹窗
|
||||
const handleCloseDailyPopup = () => {
|
||||
configStore.closeDailyPopup()
|
||||
// 检查是否需要显示会员广告
|
||||
checkPopups()
|
||||
}
|
||||
|
||||
// 每日弹窗确认按钮
|
||||
const handleDailyPopupConfirm = () => {
|
||||
configStore.closeDailyPopup()
|
||||
// 如果有链接，Popup组件会自动处理跳转
|
||||
}
|
||||
|
||||
// 刷新推荐列表
|
||||
const handleRefreshRecommend = async () => {
|
||||
await loadRecommendList()
|
||||
uni.showToast({
|
||||
title: '已刷新',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
|
||||
// 用户卡片点击
|
||||
|
|
@ -439,7 +373,6 @@
|
|||
|
||||
// 联系用户
|
||||
const handleUserContact = (userId) => {
|
||||
// 1. 首先检查是否已登录
|
||||
if (!userStore.isLoggedIn) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
|
|
@ -448,7 +381,7 @@
|
|||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/auth/login'
|
||||
url: '/pages/login/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -456,7 +389,6 @@
|
|||
return
|
||||
}
|
||||
|
||||
// 2. 检查是否完善资料
|
||||
if (!userStore.isProfileCompleted) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
|
|
@ -473,30 +405,11 @@
|
|||
return
|
||||
}
|
||||
|
||||
// 3. 跳转到聊天页面（后续会实现解锁逻辑）
|
||||
uni.navigateTo({
|
||||
url: `/pages/chat/index?targetUserId=${userId}`
|
||||
})
|
||||
}
|
||||
|
||||
// 计算滚动区域高度
|
||||
const calcScrollHeight = () => {
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
// 获取固定头部高度后计算剩余高度
|
||||
const query = uni.createSelectorQuery()
|
||||
query.select('.fixed-header').boundingClientRect((rect) => {
|
||||
if (rect) {
|
||||
// 屏幕高度 - 头部高度 - tabbar高度(50px)
|
||||
const tabbarHeight = 50
|
||||
const height = res.windowHeight - rect.height - tabbarHeight
|
||||
scrollHeight.value = `${height}px`
|
||||
}
|
||||
}).exec()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 滚动到底部 - 加载更多
|
||||
const handleScrollToLower = () => {
|
||||
if (!noMoreData.value && !listLoading.value) {
|
||||
|
|
@ -514,7 +427,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
// 页面显示时检查弹窗
|
||||
onMounted(() => {
|
||||
initPage()
|
||||
})
|
||||
|
|
@ -524,7 +436,6 @@
|
|||
pageLoading,
|
||||
listLoading,
|
||||
noMoreData,
|
||||
scrollHeight,
|
||||
isRefreshing,
|
||||
banners,
|
||||
kingKongs,
|
||||
|
|
@ -545,16 +456,13 @@
|
|||
handleGenderSelect,
|
||||
handleCloseDailyPopup,
|
||||
handleDailyPopupConfirm,
|
||||
handleRefreshRecommend,
|
||||
handleUserClick,
|
||||
handleUserContact,
|
||||
handleScrollToLower,
|
||||
handleRefresh
|
||||
}
|
||||
},
|
||||
// 页面显示
|
||||
onShow() {
|
||||
// 每次显示页面时检查弹窗
|
||||
const configStore = useConfigStore()
|
||||
const userStore = useUserStore()
|
||||
configStore.checkPopupDisplay({
|
||||
|
|
@ -566,19 +474,15 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.home-page {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f8f8f8;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 固定头部区域
|
||||
.fixed-header {
|
||||
flex-shrink: 0;
|
||||
// 整页滚动区域
|
||||
.page-scroll {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
// Banner区域
|
||||
|
|
@ -587,7 +491,6 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
// Banner 轮播图
|
||||
.banner-swiper {
|
||||
width: 100%;
|
||||
height: 420rpx;
|
||||
|
|
@ -659,6 +562,7 @@
|
|||
// 金刚位导航
|
||||
.kingkong-section {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.kingkong-grid {
|
||||
display: flex;
|
||||
|
|
@ -709,12 +613,8 @@
|
|||
.section-title-highlight {
|
||||
font-size: 42rpx;
|
||||
color: #FF6A6A;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -722,19 +622,27 @@
|
|||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.section-more {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
text {
|
||||
font-size: 26rpx;
|
||||
color: #ff6b6b;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 会员广告条 - 固定在底部导航栏上方
|
||||
// 用户列表
|
||||
.user-list {
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
// 空状态
|
||||
.empty-wrapper {
|
||||
padding: 100rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
// 底部占位
|
||||
.bottom-placeholder {
|
||||
height: 120rpx;
|
||||
}
|
||||
|
||||
// 会员广告条
|
||||
.member-ad-section {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
|
|
@ -747,7 +655,6 @@
|
|||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 24rpx;
|
||||
// 默认背景通过动态样式设置，这里不设置默认背景
|
||||
|
||||
.ad-content {
|
||||
display: flex;
|
||||
|
|
@ -791,18 +698,4 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 可滚动的用户列表区域
|
||||
.user-scroll-area {
|
||||
flex: 1;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.empty-wrapper {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -2,86 +2,80 @@
|
|||
<view class="member-page">
|
||||
<!-- 页面加载状态 -->
|
||||
<Loading type="page" :loading="pageLoading" />
|
||||
|
||||
<!-- 头部用户信息 -->
|
||||
<view class="header-section">
|
||||
<view class="user-info">
|
||||
|
||||
<!-- 顶部背景图 -->
|
||||
<view class="top-bg">
|
||||
<image src="/static/title_bg.png" mode="aspectFill" class="bg-img" />
|
||||
</view>
|
||||
|
||||
<!-- 自定义导航栏 -->
|
||||
<view class="custom-navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
|
||||
<view class="navbar-content">
|
||||
<view class="navbar-back" @click="handleBack">
|
||||
<text class="back-icon">‹</text>
|
||||
</view>
|
||||
<text class="navbar-title">成为会员</text>
|
||||
<view class="navbar-placeholder"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员等级选择卡片（固定） -->
|
||||
<view class="member-tiers" :style="{ top: (statusBarHeight + 44) + 'px' }">
|
||||
<view
|
||||
v-for="tier in memberTiers"
|
||||
:key="tier.level"
|
||||
class="tier-card"
|
||||
:class="{ selected: selectedTier === tier.level }"
|
||||
@click="handleSelectTier(tier.level)"
|
||||
>
|
||||
<!-- 角标 -->
|
||||
<view class="tier-badge" v-if="tier.badge">{{ tier.badge }}</view>
|
||||
|
||||
<text class="tier-name">{{ tier.name }}</text>
|
||||
<view class="tier-price">
|
||||
<text class="price-value">{{ tier.price }}</text>
|
||||
<text class="price-unit">元</text>
|
||||
</view>
|
||||
<text class="tier-original-price">{{ tier.originalPrice }}元</text>
|
||||
<text class="tier-discount">{{ tier.discount }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 可滚动的权益长图区域 -->
|
||||
<scroll-view
|
||||
class="benefits-scroll"
|
||||
scroll-y
|
||||
:style="{ top: (statusBarHeight + 44 + tierCardHeight) + 'px' }"
|
||||
>
|
||||
<!-- 会员权益长图 -->
|
||||
<view class="benefits-image-section" v-if="selectedTierInfo?.benefitsImage">
|
||||
<image
|
||||
class="user-avatar"
|
||||
:src="userInfo.avatar || defaultAvatar"
|
||||
mode="aspectFill"
|
||||
class="benefits-image"
|
||||
:src="selectedTierInfo.benefitsImage"
|
||||
mode="widthFix"
|
||||
@click="previewImage"
|
||||
/>
|
||||
<view class="user-detail">
|
||||
<text class="user-nickname">{{ userInfo.nickname || '未设置昵称' }}</text>
|
||||
<view class="member-status" v-if="userInfo.isMember">
|
||||
<text class="status-icon">👑</text>
|
||||
<text class="status-text">{{ memberLevelText }}</text>
|
||||
</view>
|
||||
<view class="member-status not-member" v-else>
|
||||
<text class="status-text">暂未开通会员</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员等级选择 (Requirements 10.1) -->
|
||||
<view class="member-tiers">
|
||||
<view class="section-title">选择会员等级</view>
|
||||
<view class="tier-list">
|
||||
<view
|
||||
v-for="tier in memberTiers"
|
||||
:key="tier.level"
|
||||
class="tier-card"
|
||||
:class="{ 'selected': selectedTier === tier.level, [`tier-${tier.level}`]: true }"
|
||||
@click="handleSelectTier(tier.level)"
|
||||
>
|
||||
<view class="tier-header">
|
||||
<text class="tier-name">{{ tier.name }}</text>
|
||||
<view class="tier-badge" v-if="tier.badge">{{ tier.badge }}</view>
|
||||
</view>
|
||||
<view class="tier-price">
|
||||
<text class="price-symbol">¥</text>
|
||||
<text class="price-value">{{ tier.price }}</text>
|
||||
</view>
|
||||
<view class="tier-desc">{{ tier.desc }}</view>
|
||||
<view class="tier-check" v-if="selectedTier === tier.level">
|
||||
<text>✓</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 会员权益说明 -->
|
||||
<view class="benefits-section">
|
||||
<view class="section-title">会员权益</view>
|
||||
<view class="benefits-list">
|
||||
<view
|
||||
v-for="(benefit, index) in currentBenefits"
|
||||
:key="index"
|
||||
class="benefit-item"
|
||||
>
|
||||
<view class="benefit-icon">{{ benefit.icon }}</view>
|
||||
<view class="benefit-content">
|
||||
<text class="benefit-title">{{ benefit.title }}</text>
|
||||
<text class="benefit-desc">{{ benefit.desc }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部购买按钮 (Requirements 10.2) -->
|
||||
|
||||
<!-- 底部占位 -->
|
||||
<view class="bottom-placeholder"></view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 底部固定购买栏 -->
|
||||
<view class="bottom-action">
|
||||
<view class="price-info">
|
||||
<text class="label">应付金额：</text>
|
||||
<text class="price">¥{{ selectedTierInfo?.price || 0 }}</text>
|
||||
<view class="price-section">
|
||||
<view class="price-row">
|
||||
<text class="price-amount">{{ selectedTierInfo?.price || 0 }}元</text>
|
||||
<text class="price-discount">{{ selectedTierInfo?.discount || '' }}</text>
|
||||
</view>
|
||||
<text class="price-agreement" @click="showPurchaseNote">购买即同意《购买说明》</text>
|
||||
</view>
|
||||
<button
|
||||
class="btn-purchase"
|
||||
:disabled="!selectedTier || purchasing"
|
||||
@click="handlePurchase"
|
||||
>
|
||||
<text v-if="purchasing">支付中...</text>
|
||||
<text v-else>立即开通</text>
|
||||
{{ purchasing ? '支付中...' : '立即开通' }}
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -90,7 +84,6 @@
|
|||
<script>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useUserStore } from '@/store/user.js'
|
||||
import { useConfigStore } from '@/store/config.js'
|
||||
import { getMemberInfo } from '@/api/member.js'
|
||||
import { createOrder } from '@/api/order.js'
|
||||
import { getFullImageUrl } from '@/utils/image.js'
|
||||
|
|
@ -103,196 +96,191 @@ export default {
|
|||
},
|
||||
setup() {
|
||||
const userStore = useUserStore()
|
||||
const configStore = useConfigStore()
|
||||
|
||||
|
||||
// 状态栏高度
|
||||
const statusBarHeight = ref(20)
|
||||
|
||||
// 页面状态
|
||||
const pageLoading = ref(true)
|
||||
const purchasing = ref(false)
|
||||
const selectedTier = ref(1) // 默认选中第一个
|
||||
|
||||
// 从 configStore 获取默认头像
|
||||
const defaultAvatar = computed(() => configStore.defaultAvatar || '/static/logo.png')
|
||||
|
||||
// 会员等级映射
|
||||
const memberLevelMap = {
|
||||
1: '不限时会员',
|
||||
2: '诚意会员',
|
||||
3: '家庭版会员'
|
||||
const tierCardHeight = ref(180) // 会员卡片区域高度（rpx转px约90px）
|
||||
|
||||
// 获取系统信息
|
||||
const getSystemInfo = () => {
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
statusBarHeight.value = res.statusBarHeight || 20
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 返回
|
||||
const handleBack = () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
|
||||
/**
|
||||
* 会员等级配置 (Requirements 10.1)
|
||||
* 三种会员等级：不限时会员(1299), 诚意会员(1999), 家庭版(2999)
|
||||
* 会员等级配置
|
||||
*/
|
||||
const memberTiers = ref([
|
||||
{
|
||||
level: 1,
|
||||
name: '不限时会员',
|
||||
name: '永久会员',
|
||||
price: 1299,
|
||||
desc: '基础会员权益，不限时使用',
|
||||
originalPrice: 1899,
|
||||
discount: '8折优惠',
|
||||
badge: ''
|
||||
},
|
||||
{
|
||||
level: 2,
|
||||
name: '诚意会员',
|
||||
price: 1999,
|
||||
desc: '更多解锁次数，优先推荐',
|
||||
badge: '推荐'
|
||||
originalPrice: 2899,
|
||||
discount: '7折优惠',
|
||||
badge: ''
|
||||
},
|
||||
{
|
||||
level: 3,
|
||||
name: '家庭版',
|
||||
name: '诚意会员',
|
||||
price: 2999,
|
||||
desc: '可绑定家人，共享会员权益',
|
||||
badge: '超值'
|
||||
originalPrice: 4299,
|
||||
discount: '7折优惠',
|
||||
badge: '家庭版'
|
||||
}
|
||||
])
|
||||
|
||||
/**
|
||||
* 各等级会员权益
|
||||
*/
|
||||
const benefitsMap = {
|
||||
1: [
|
||||
{ icon: '🔓', title: '无限解锁', desc: '不限次数解锁联系方式' },
|
||||
{ icon: '👀', title: '查看访客', desc: '查看谁看过我的资料' },
|
||||
{ icon: '🔍', title: '高级搜索', desc: '使用全部筛选条件' },
|
||||
{ icon: '📱', title: '专属客服', desc: '一对一客服支持' }
|
||||
],
|
||||
2: [
|
||||
{ icon: '🔓', title: '无限解锁', desc: '不限次数解锁联系方式' },
|
||||
{ icon: '👀', title: '查看访客', desc: '查看谁看过我的资料' },
|
||||
{ icon: '🔍', title: '高级搜索', desc: '使用全部筛选条件' },
|
||||
{ icon: '📱', title: '专属客服', desc: '一对一客服支持' },
|
||||
{ icon: '⭐', title: '优先推荐', desc: '资料优先展示给其他用户' },
|
||||
{ icon: '💎', title: '诚意标识', desc: '展示诚意会员专属标识' }
|
||||
],
|
||||
3: [
|
||||
{ icon: '🔓', title: '无限解锁', desc: '不限次数解锁联系方式' },
|
||||
{ icon: '👀', title: '查看访客', desc: '查看谁看过我的资料' },
|
||||
{ icon: '🔍', title: '高级搜索', desc: '使用全部筛选条件' },
|
||||
{ icon: '📱', title: '专属客服', desc: '一对一客服支持' },
|
||||
{ icon: '⭐', title: '优先推荐', desc: '资料优先展示给其他用户' },
|
||||
{ icon: '💎', title: '诚意标识', desc: '展示诚意会员专属标识' },
|
||||
{ icon: '👨👩👧', title: '家庭共享', desc: '可绑定1位家人共享权益' },
|
||||
{ icon: '🎁', title: '专属礼包', desc: '家庭版专属福利礼包' }
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
// 计算属性
|
||||
const userInfo = computed(() => ({
|
||||
userId: userStore.userId,
|
||||
nickname: userStore.nickname,
|
||||
avatar: getFullImageUrl(userStore.avatar),
|
||||
isMember: userStore.isMember,
|
||||
memberLevel: userStore.memberLevel
|
||||
}))
|
||||
|
||||
const memberLevelText = computed(() => {
|
||||
return memberLevelMap[userStore.memberLevel] || '会员'
|
||||
})
|
||||
|
||||
const selectedTierInfo = computed(() => {
|
||||
return memberTiers.value.find(t => t.level === selectedTier.value)
|
||||
})
|
||||
|
||||
const currentBenefits = computed(() => {
|
||||
return benefitsMap[selectedTier.value] || benefitsMap[1]
|
||||
})
|
||||
|
||||
// 加载会员信息
|
||||
const loadMemberInfo = async () => {
|
||||
|
||||
// 加载会员配置（包括权益长图）
|
||||
const loadMemberConfig = async () => {
|
||||
try {
|
||||
const res = await getMemberInfo()
|
||||
if (res && res.success && res.data) {
|
||||
if (res && (res.success || res.code === 0) && res.data) {
|
||||
// 更新用户会员状态
|
||||
userStore.setMemberStatus(res.data.isMember, res.data.memberLevel)
|
||||
|
||||
// 如果后台返回了会员等级配置，更新本地配置
|
||||
if (res.data.tiers && res.data.tiers.length > 0) {
|
||||
memberTiers.value = res.data.tiers.map(tier => ({
|
||||
level: tier.level,
|
||||
name: tier.name,
|
||||
badge: tier.badge || '',
|
||||
price: tier.price,
|
||||
originalPrice: tier.originalPrice,
|
||||
discount: tier.discount || '',
|
||||
benefitsImage: tier.benefitsImage ? getFullImageUrl(tier.benefitsImage) : ''
|
||||
}))
|
||||
// 默认选中第一个
|
||||
if (memberTiers.value.length > 0) {
|
||||
selectedTier.value = memberTiers.value[0].level
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载会员信息失败:', error)
|
||||
console.error('加载会员配置失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 初始化页面
|
||||
const initPage = async () => {
|
||||
pageLoading.value = true
|
||||
try {
|
||||
getSystemInfo()
|
||||
userStore.restoreFromStorage()
|
||||
await loadMemberInfo()
|
||||
await loadMemberConfig()
|
||||
} catch (error) {
|
||||
console.error('初始化页面失败:', error)
|
||||
} finally {
|
||||
pageLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 选择会员等级
|
||||
const handleSelectTier = (level) => {
|
||||
selectedTier.value = level
|
||||
}
|
||||
|
||||
|
||||
// 预览权益长图
|
||||
const previewImage = () => {
|
||||
if (selectedTierInfo.value?.benefitsImage) {
|
||||
uni.previewImage({
|
||||
urls: [selectedTierInfo.value.benefitsImage]
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 显示购买说明
|
||||
const showPurchaseNote = () => {
|
||||
uni.showModal({
|
||||
title: '购买说明',
|
||||
content: '1. 会员服务一经购买，不支持退款\n2. 会员权益自购买之日起生效\n3. 如有疑问请联系客服',
|
||||
showCancel: false,
|
||||
confirmText: '我知道了'
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 购买会员 (Requirements 10.2, 10.3, 10.4)
|
||||
* 1. 创建订单
|
||||
* 2. 调用微信支付
|
||||
* 3. 支付成功后更新会员状态
|
||||
* 购买会员
|
||||
*/
|
||||
const handlePurchase = async () => {
|
||||
if (!selectedTier.value || purchasing.value) return
|
||||
|
||||
|
||||
purchasing.value = true
|
||||
|
||||
|
||||
try {
|
||||
// 创建订单 (Requirements 10.2)
|
||||
// 创建订单
|
||||
const orderRes = await createOrder({
|
||||
orderType: 1, // 会员订单
|
||||
orderType: 1,
|
||||
memberLevel: selectedTier.value
|
||||
})
|
||||
|
||||
if (!orderRes || !orderRes.success) {
|
||||
uni.showToast({
|
||||
title: orderRes?.message || '创建订单失败',
|
||||
icon: 'none'
|
||||
|
||||
if (!orderRes || !(orderRes.success || orderRes.code === 0)) {
|
||||
uni.showToast({
|
||||
title: orderRes?.message || '创建订单失败',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
const paymentParams = orderRes.data
|
||||
|
||||
// 调用微信支付 (Requirements 10.3)
|
||||
|
||||
// 调用微信支付
|
||||
await requestPayment(paymentParams)
|
||||
|
||||
// 支付成功，更新会员状态 (Requirements 10.4)
|
||||
|
||||
// 支付成功，更新会员状态
|
||||
userStore.setMemberStatus(true, selectedTier.value)
|
||||
|
||||
uni.showToast({
|
||||
title: '开通成功',
|
||||
icon: 'success'
|
||||
|
||||
uni.showToast({
|
||||
title: '开通成功',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
// 延迟返回上一页
|
||||
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1500)
|
||||
|
||||
|
||||
} catch (error) {
|
||||
console.error('购买失败:', error)
|
||||
|
||||
|
||||
if (error.errMsg && error.errMsg.includes('cancel')) {
|
||||
uni.showToast({ title: '支付已取消', icon: 'none' })
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: error.message || '支付失败，请重试',
|
||||
icon: 'none'
|
||||
uni.showToast({
|
||||
title: error.message || '支付失败，请重试',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
} finally {
|
||||
purchasing.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 调用微信支付
|
||||
* @param {Object} params - 支付参数
|
||||
*/
|
||||
const requestPayment = (params) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
|
|
@ -308,26 +296,26 @@ export default {
|
|||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
initPage()
|
||||
})
|
||||
|
||||
|
||||
return {
|
||||
statusBarHeight,
|
||||
pageLoading,
|
||||
purchasing,
|
||||
selectedTier,
|
||||
tierCardHeight,
|
||||
memberTiers,
|
||||
userInfo,
|
||||
memberLevelText,
|
||||
selectedTierInfo,
|
||||
currentBenefits,
|
||||
defaultAvatar,
|
||||
handleBack,
|
||||
handleSelectTier,
|
||||
handlePurchase
|
||||
handlePurchase,
|
||||
previewImage,
|
||||
showPurchaseNote
|
||||
}
|
||||
},
|
||||
// 页面显示时刷新数据
|
||||
onShow() {
|
||||
const userStore = useUserStore()
|
||||
userStore.restoreFromStorage()
|
||||
|
|
@ -335,246 +323,189 @@ export default {
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.member-page {
|
||||
min-height: 100vh;
|
||||
background-color: #f8f8f8;
|
||||
padding-bottom: 180rpx;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
// 头部用户信息
|
||||
.header-section {
|
||||
background: linear-gradient(135deg, #ffd700 0%, #ffb800 100%);
|
||||
padding: 60rpx 30rpx 80rpx;
|
||||
|
||||
.user-info {
|
||||
// 顶部背景图
|
||||
.top-bg {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 400rpx;
|
||||
z-index: 0;
|
||||
|
||||
.bg-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// 自定义导航栏
|
||||
.custom-navbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
|
||||
.navbar-content {
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.user-avatar {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(255, 255, 255, 0.5);
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.user-detail {
|
||||
flex: 1;
|
||||
|
||||
.user-nickname {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
display: block;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.member-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.status-icon {
|
||||
font-size: 28rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&.not-member {
|
||||
.status-text {
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
|
||||
// 会员等级选择
|
||||
.member-tiers {
|
||||
margin: -40rpx 20rpx 20rpx;
|
||||
|
||||
.section-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
|
||||
.tier-list {
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
|
||||
.tier-card {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx 16rpx;
|
||||
position: relative;
|
||||
border: 2rpx solid #eee;
|
||||
transition: all 0.3s;
|
||||
|
||||
&.selected {
|
||||
border-color: #ffd700;
|
||||
box-shadow: 0 4rpx 20rpx rgba(255, 215, 0, 0.3);
|
||||
}
|
||||
|
||||
&.tier-2 {
|
||||
&.selected {
|
||||
border-color: #ff6b6b;
|
||||
box-shadow: 0 4rpx 20rpx rgba(255, 107, 107, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
&.tier-3 {
|
||||
&.selected {
|
||||
border-color: #9c27b0;
|
||||
box-shadow: 0 4rpx 20rpx rgba(156, 39, 176, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
.tier-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
.tier-name {
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.tier-badge {
|
||||
font-size: 20rpx;
|
||||
padding: 4rpx 12rpx;
|
||||
background: linear-gradient(135deg, #ff6b6b 0%, #ff5252 100%);
|
||||
color: #fff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tier-price {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
margin-bottom: 12rpx;
|
||||
|
||||
.price-symbol {
|
||||
font-size: 24rpx;
|
||||
color: #ff6b6b;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.price-value {
|
||||
font-size: 44rpx;
|
||||
color: #ff6b6b;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.tier-desc {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.tier-check {
|
||||
position: absolute;
|
||||
top: 12rpx;
|
||||
right: 12rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
background: linear-gradient(135deg, #ffd700 0%, #ffb800 100%);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
&.tier-2 .tier-check {
|
||||
background: linear-gradient(135deg, #ff6b6b 0%, #ff5252 100%);
|
||||
}
|
||||
|
||||
&.tier-3 .tier-check {
|
||||
background: linear-gradient(135deg, #9c27b0 0%, #7b1fa2 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 会员权益
|
||||
.benefits-section {
|
||||
margin: 0 20rpx;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
|
||||
.section-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.benefits-list {
|
||||
.benefit-item {
|
||||
.navbar-back {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.benefit-icon {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
font-size: 36rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.benefit-content {
|
||||
flex: 1;
|
||||
|
||||
.benefit-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
display: block;
|
||||
margin-bottom: 6rpx;
|
||||
}
|
||||
|
||||
.benefit-desc {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.back-icon {
|
||||
font-size: 56rpx;
|
||||
color: #333;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-title {
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.navbar-placeholder {
|
||||
width: 80rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 底部购买按钮
|
||||
// 滚动区域
|
||||
.benefits-scroll {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
// 会员等级选择（固定定位）
|
||||
.member-tiers {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 50;
|
||||
display: flex;
|
||||
padding: 24rpx 20rpx;
|
||||
gap: 16rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.tier-card {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx 12rpx;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
border: 2rpx solid #eee;
|
||||
transition: all 0.3s;
|
||||
|
||||
&.selected {
|
||||
border-color: #c9a86c;
|
||||
background: linear-gradient(180deg, #fffbf0 0%, #fff 100%);
|
||||
|
||||
.tier-name {
|
||||
color: #c9a86c;
|
||||
}
|
||||
|
||||
.price-value {
|
||||
color: #c9a86c;
|
||||
}
|
||||
}
|
||||
|
||||
.tier-badge {
|
||||
position: absolute;
|
||||
top: -2rpx;
|
||||
right: -2rpx;
|
||||
padding: 6rpx 16rpx;
|
||||
background: linear-gradient(135deg, #ff6b6b 0%, #ff5252 100%);
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
border-radius: 0 16rpx 0 16rpx;
|
||||
}
|
||||
|
||||
.tier-name {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
display: block;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.tier-price {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: center;
|
||||
margin-bottom: 8rpx;
|
||||
|
||||
.price-value {
|
||||
font-size: 48rpx;
|
||||
font-weight: 700;
|
||||
color: #c9a86c;
|
||||
}
|
||||
|
||||
.price-unit {
|
||||
font-size: 24rpx;
|
||||
color: #c9a86c;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tier-original-price {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-decoration: line-through;
|
||||
display: block;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.tier-discount {
|
||||
font-size: 22rpx;
|
||||
color: #ff6b6b;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 会员权益长图
|
||||
.benefits-image-section {
|
||||
padding: 0;
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.benefits-image {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部占位
|
||||
.bottom-placeholder {
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
// 底部购买栏
|
||||
.bottom-action {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 100;
|
||||
background: #fff;
|
||||
padding: 20rpx 30rpx;
|
||||
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
|
||||
|
|
@ -582,43 +513,51 @@ export default {
|
|||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
.price-info {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
|
||||
.label {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
|
||||
.price-section {
|
||||
flex: 1;
|
||||
|
||||
.price-row {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
margin-bottom: 4rpx;
|
||||
|
||||
.price-amount {
|
||||
font-size: 44rpx;
|
||||
font-weight: 700;
|
||||
color: #c9a86c;
|
||||
}
|
||||
|
||||
.price-discount {
|
||||
font-size: 24rpx;
|
||||
color: #ff6b6b;
|
||||
margin-left: 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 40rpx;
|
||||
font-weight: 700;
|
||||
color: #ff6b6b;
|
||||
|
||||
.price-agreement {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.btn-purchase {
|
||||
width: 280rpx;
|
||||
width: 240rpx;
|
||||
height: 88rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(135deg, #ffd700 0%, #ffb800 100%);
|
||||
background: linear-gradient(135deg, #c9a86c 0%, #b8956a 100%);
|
||||
border-radius: 44rpx;
|
||||
border: none;
|
||||
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
text {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
||||
&[disabled] {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
|
||||
<!-- 照片上传 -->
|
||||
<view class="photo-upload-section">
|
||||
<view class="photo-label">上传照片（最多5张）</view>
|
||||
<view class="photo-label required">上传照片（至少1张，最多5张）</view>
|
||||
<view class="photo-grid">
|
||||
<view
|
||||
v-for="(photo, index) in formData.photos"
|
||||
|
|
@ -84,7 +84,7 @@
|
|||
|
||||
<!-- 关系 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label required">您与相亲者的关系</text>
|
||||
<text class="form-label required">您与孩子的关系</text>
|
||||
<picker
|
||||
:value="relationshipIndex"
|
||||
:range="relationshipOptions"
|
||||
|
|
@ -100,7 +100,7 @@
|
|||
|
||||
<!-- 姓氏 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label required">姓氏</text>
|
||||
<text class="form-label required">您的姓氏</text>
|
||||
<input
|
||||
v-model="formData.surname"
|
||||
placeholder="请输入姓氏"
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
|
||||
<!-- 相亲者性别 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label required">相亲者性别</text>
|
||||
<text class="form-label required">您家孩子的性别</text>
|
||||
<view class="radio-group">
|
||||
<view
|
||||
class="radio-item"
|
||||
|
|
@ -252,7 +252,7 @@
|
|||
|
||||
<!-- 体重 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">体重(kg)</text>
|
||||
<text class="form-label required">体重(kg)</text>
|
||||
<picker
|
||||
:value="weightIndex"
|
||||
:range="weightOptions"
|
||||
|
|
@ -347,63 +347,119 @@
|
|||
</view>
|
||||
|
||||
<!-- 步骤4: 择偶要求 -->
|
||||
<view v-show="currentStep === 3" class="form-section">
|
||||
<view v-show="currentStep === 3" class="form-section requirement-section">
|
||||
<view class="section-title">择偶要求</view>
|
||||
<view class="section-tip">以下条件均为可选，帮助您更精准匹配</view>
|
||||
|
||||
<!-- 年龄范围 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">年龄范围</text>
|
||||
<view class="range-picker">
|
||||
<!-- 基本条件卡片 -->
|
||||
<view class="requirement-card">
|
||||
<view class="card-title">基本条件</view>
|
||||
|
||||
<!-- 年龄范围 -->
|
||||
<view class="form-item range-item">
|
||||
<text class="form-label">年龄范围</text>
|
||||
<view class="range-picker-inline">
|
||||
<picker
|
||||
:value="requirementAgeMinIndex"
|
||||
:range="ageRangeOptions"
|
||||
@change="handleAgeMinChange"
|
||||
>
|
||||
<view class="range-value">{{ formData.requirement.ageMin || '不限' }}</view>
|
||||
</picker>
|
||||
<text class="range-separator">-</text>
|
||||
<picker
|
||||
:value="requirementAgeMaxIndex"
|
||||
:range="ageRangeOptions"
|
||||
@change="handleAgeMaxChange"
|
||||
>
|
||||
<view class="range-value">{{ formData.requirement.ageMax || '不限' }}</view>
|
||||
</picker>
|
||||
<text class="range-unit">岁</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 身高范围 -->
|
||||
<view class="form-item range-item">
|
||||
<text class="form-label">身高范围</text>
|
||||
<view class="range-picker-inline">
|
||||
<picker
|
||||
:value="requirementHeightMinIndex"
|
||||
:range="heightRangeOptions"
|
||||
@change="handleHeightMinChange"
|
||||
>
|
||||
<view class="range-value">{{ formData.requirement.heightMin || '不限' }}</view>
|
||||
</picker>
|
||||
<text class="range-separator">-</text>
|
||||
<picker
|
||||
:value="requirementHeightMaxIndex"
|
||||
:range="heightRangeOptions"
|
||||
@change="handleHeightMaxChange"
|
||||
>
|
||||
<view class="range-value">{{ formData.requirement.heightMax || '不限' }}</view>
|
||||
</picker>
|
||||
<text class="range-unit">cm</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 期望月收入 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">期望月收入</text>
|
||||
<picker
|
||||
:value="requirementAgeMinIndex"
|
||||
:range="ageRangeOptions"
|
||||
@change="handleAgeMinChange"
|
||||
:value="requirementIncomeMinIndex"
|
||||
:range="incomeRangeOptions"
|
||||
@change="handleIncomeMinChange"
|
||||
>
|
||||
<view class="picker-value small">{{ formData.requirement.ageMin || '不限' }}</view>
|
||||
<view class="picker-value">
|
||||
{{ getIncomeLabel(formData.requirement.monthlyIncomeMin) }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
</view>
|
||||
</picker>
|
||||
<text class="range-separator">至</text>
|
||||
<picker
|
||||
:value="requirementAgeMaxIndex"
|
||||
:range="ageRangeOptions"
|
||||
@change="handleAgeMaxChange"
|
||||
>
|
||||
<view class="picker-value small">{{ formData.requirement.ageMax || '不限' }}</view>
|
||||
</picker>
|
||||
<text class="range-unit">岁</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 身高范围 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">身高范围</text>
|
||||
<view class="range-picker">
|
||||
<!-- 意向城市卡片 -->
|
||||
<view class="requirement-card">
|
||||
<view class="card-title">意向城市</view>
|
||||
|
||||
<view class="form-item">
|
||||
<text class="form-label">城市1</text>
|
||||
<picker
|
||||
:value="requirementHeightMinIndex"
|
||||
:range="heightRangeOptions"
|
||||
@change="handleHeightMinChange"
|
||||
mode="region"
|
||||
:level="'city'"
|
||||
:value="[formData.requirement.city1Province, formData.requirement.city1City]"
|
||||
@change="handleCity1Change"
|
||||
>
|
||||
<view class="picker-value small">{{ formData.requirement.heightMin || '不限' }}</view>
|
||||
<view class="picker-value">
|
||||
{{ city1Text || '请选择' }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
</view>
|
||||
</picker>
|
||||
<text class="range-separator">至</text>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<text class="form-label">城市2</text>
|
||||
<picker
|
||||
:value="requirementHeightMaxIndex"
|
||||
:range="heightRangeOptions"
|
||||
@change="handleHeightMaxChange"
|
||||
mode="region"
|
||||
:level="'city'"
|
||||
:value="[formData.requirement.city2Province, formData.requirement.city2City]"
|
||||
@change="handleCity2Change"
|
||||
>
|
||||
<view class="picker-value small">{{ formData.requirement.heightMax || '不限' }}</view>
|
||||
<view class="picker-value">
|
||||
{{ city2Text || '请选择' }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
</view>
|
||||
</picker>
|
||||
<text class="range-unit">cm</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 学历要求 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">学历要求</text>
|
||||
<view class="checkbox-group">
|
||||
<!-- 学历要求卡片 -->
|
||||
<view class="requirement-card">
|
||||
<view class="card-title">学历要求 <text class="card-tip">可多选</text></view>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="edu in educationOptions"
|
||||
:key="edu.value"
|
||||
class="checkbox-item"
|
||||
class="tag-item"
|
||||
:class="{ active: formData.requirement.education.includes(edu.value) }"
|
||||
@click="toggleEducationRequirement(edu.value)"
|
||||
>
|
||||
|
|
@ -412,78 +468,49 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 意向城市1 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">意向城市1</text>
|
||||
<picker
|
||||
mode="region"
|
||||
:level="'city'"
|
||||
:value="[formData.requirement.city1Province, formData.requirement.city1City]"
|
||||
@change="handleCity1Change"
|
||||
>
|
||||
<view class="picker-value">
|
||||
{{ city1Text || '请选择' }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
<!-- 房车要求卡片 -->
|
||||
<view class="requirement-card">
|
||||
<view class="card-title">房车要求 <text class="card-tip">可多选</text></view>
|
||||
|
||||
<view class="sub-section">
|
||||
<text class="sub-title">房产</text>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="house in houseOptions"
|
||||
:key="house.value"
|
||||
class="tag-item"
|
||||
:class="{ active: formData.requirement.houseStatus.includes(house.value) }"
|
||||
@click="toggleHouseRequirement(house.value)"
|
||||
>
|
||||
{{ house.label }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 意向城市2 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">意向城市2</text>
|
||||
<picker
|
||||
mode="region"
|
||||
:level="'city'"
|
||||
:value="[formData.requirement.city2Province, formData.requirement.city2City]"
|
||||
@change="handleCity2Change"
|
||||
>
|
||||
<view class="picker-value">
|
||||
{{ city2Text || '请选择' }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<!-- 房产要求 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">房产要求</text>
|
||||
<view class="checkbox-group">
|
||||
<view
|
||||
v-for="house in houseOptions"
|
||||
:key="house.value"
|
||||
class="checkbox-item"
|
||||
:class="{ active: formData.requirement.houseStatus.includes(house.value) }"
|
||||
@click="toggleHouseRequirement(house.value)"
|
||||
>
|
||||
{{ house.label }}
|
||||
<view class="sub-section">
|
||||
<text class="sub-title">车辆</text>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="car in carOptions"
|
||||
:key="car.value"
|
||||
class="tag-item"
|
||||
:class="{ active: formData.requirement.carStatus.includes(car.value) }"
|
||||
@click="toggleCarRequirement(car.value)"
|
||||
>
|
||||
{{ car.label }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 车辆要求 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">车辆要求</text>
|
||||
<view class="checkbox-group">
|
||||
<view
|
||||
v-for="car in carOptions"
|
||||
:key="car.value"
|
||||
class="checkbox-item"
|
||||
:class="{ active: formData.requirement.carStatus.includes(car.value) }"
|
||||
@click="toggleCarRequirement(car.value)"
|
||||
>
|
||||
{{ car.label }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 婚姻状态要求 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">婚姻状态要求</text>
|
||||
<view class="checkbox-group">
|
||||
<!-- 婚姻状态要求卡片 -->
|
||||
<view class="requirement-card">
|
||||
<view class="card-title">婚姻状态要求 <text class="card-tip">可多选</text></view>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="marriage in marriageOptions"
|
||||
:key="marriage.value"
|
||||
class="checkbox-item"
|
||||
class="tag-item"
|
||||
:class="{ active: formData.requirement.marriageStatus.includes(marriage.value) }"
|
||||
@click="toggleMarriageRequirement(marriage.value)"
|
||||
>
|
||||
|
|
@ -491,21 +518,6 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 期望月收入 -->
|
||||
<view class="form-item">
|
||||
<text class="form-label">期望月收入</text>
|
||||
<picker
|
||||
:value="requirementIncomeMinIndex"
|
||||
:range="incomeRangeOptions"
|
||||
@change="handleIncomeMinChange"
|
||||
>
|
||||
<view class="picker-value">
|
||||
{{ getIncomeLabel(formData.requirement.monthlyIncomeMin) }}
|
||||
<text class="picker-arrow">▼</text>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 步骤5: 联系方式 -->
|
||||
|
|
@ -798,12 +810,14 @@ const incomeIndex = computed(() => {
|
|||
|
||||
const heightIndex = computed(() => {
|
||||
const idx = heightOptions.value.indexOf(formData.height)
|
||||
return idx >= 0 ? idx : 0
|
||||
// 默认选中160cm (索引20，因为从140开始)
|
||||
return idx >= 0 ? idx : 20
|
||||
})
|
||||
|
||||
const weightIndex = computed(() => {
|
||||
const idx = weightOptions.value.indexOf(formData.weight)
|
||||
return idx >= 0 ? idx : 0
|
||||
// 默认选中55kg (索引25，因为从30开始)
|
||||
return idx >= 0 ? idx : 25
|
||||
})
|
||||
|
||||
const houseIndex = computed(() => {
|
||||
|
|
@ -1131,6 +1145,10 @@ const handleGetPhoneNumber = async (e) => {
|
|||
const validateStep = (step) => {
|
||||
switch (step) {
|
||||
case 0: // 基础信息
|
||||
if (formData.photos.length === 0) {
|
||||
uni.showToast({ title: '请至少上传一张照片', icon: 'none' })
|
||||
return false
|
||||
}
|
||||
if (!formData.relationship) {
|
||||
uni.showToast({ title: '请选择与相亲者的关系', icon: 'none' })
|
||||
return false
|
||||
|
|
@ -1170,6 +1188,10 @@ const validateStep = (step) => {
|
|||
uni.showToast({ title: '请选择身高', icon: 'none' })
|
||||
return false
|
||||
}
|
||||
if (!formData.weight) {
|
||||
uni.showToast({ title: '请选择体重', icon: 'none' })
|
||||
return false
|
||||
}
|
||||
if (!formData.houseStatus) {
|
||||
uni.showToast({ title: '请选择房产状态', icon: 'none' })
|
||||
return false
|
||||
|
|
@ -1207,10 +1229,19 @@ const validateStep = (step) => {
|
|||
}
|
||||
}
|
||||
|
||||
// 滚动到页面顶部
|
||||
const scrollToTop = () => {
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
})
|
||||
}
|
||||
|
||||
// 步骤导航
|
||||
const handlePrevStep = () => {
|
||||
if (currentStep.value > 0) {
|
||||
currentStep.value--
|
||||
scrollToTop()
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1218,6 +1249,7 @@ const handleNextStep = () => {
|
|||
if (validateStep(currentStep.value)) {
|
||||
if (currentStep.value < steps.length - 1) {
|
||||
currentStep.value++
|
||||
scrollToTop()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1680,6 +1712,12 @@ export default {
|
|||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
&.required::before {
|
||||
content: '*';
|
||||
color: #ff6b6b;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.photo-grid {
|
||||
|
|
@ -1785,6 +1823,135 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
// 择偶要求区域样式
|
||||
.requirement-section {
|
||||
background-color: transparent !important;
|
||||
padding: 0 !important;
|
||||
|
||||
.section-title {
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
padding: 30rpx 30rpx 20rpx;
|
||||
margin-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.section-tip {
|
||||
background-color: #fff;
|
||||
padding: 0 30rpx 20rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
border-radius: 0 0 16rpx 16rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.requirement-card {
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.card-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-tip {
|
||||
font-size: 22rpx;
|
||||
font-weight: 400;
|
||||
color: #999;
|
||||
margin-left: 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 范围选择器内联样式
|
||||
.range-item {
|
||||
.form-label {
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.range-picker-inline {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.range-value {
|
||||
min-width: 120rpx;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.range-separator {
|
||||
margin: 0 16rpx;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.range-unit {
|
||||
margin-left: 12rpx;
|
||||
color: #666;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 标签组样式
|
||||
.tag-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
|
||||
.tag-item {
|
||||
padding: 16rpx 24rpx;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 12rpx;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
border: 2rpx solid transparent;
|
||||
transition: all 0.2s;
|
||||
|
||||
&.active {
|
||||
background-color: #fff0f0;
|
||||
color: #ff6b6b;
|
||||
border-color: #ff6b6b;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 子区域样式
|
||||
.sub-section {
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部按钮
|
||||
.bottom-buttons {
|
||||
position: fixed;
|
||||
|
|
|
|||
|
|
@ -19,14 +19,22 @@
|
|||
>
|
||||
<!-- 顶部Banner -->
|
||||
<view class="banner-section">
|
||||
<view class="banner-bg"></view>
|
||||
<view class="banner-text">
|
||||
<text class="banner-title">大胆说出</text>
|
||||
<text class="banner-title">你的爱</text>
|
||||
</view>
|
||||
<view class="banner-decoration">
|
||||
<text class="deco-heart">💕</text>
|
||||
<text class="deco-ring">💍</text>
|
||||
<image
|
||||
v-if="searchBanner"
|
||||
:src="getFullUrl(searchBanner)"
|
||||
class="banner-image"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
<view v-else class="banner-default">
|
||||
<view class="banner-bg"></view>
|
||||
<view class="banner-text">
|
||||
<text class="banner-title">大胆说出</text>
|
||||
<text class="banner-title">你的爱</text>
|
||||
</view>
|
||||
<view class="banner-decoration">
|
||||
<text class="deco-heart">💕</text>
|
||||
<text class="deco-ring">💍</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
|
@ -34,7 +42,7 @@
|
|||
<view class="filter-form">
|
||||
<!-- 年龄要求 -->
|
||||
<view class="filter-item" @click="showAgePicker">
|
||||
<text class="filter-label">年龄要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>年龄要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ ageText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -43,7 +51,7 @@
|
|||
|
||||
<!-- 身高要求 -->
|
||||
<view class="filter-item" @click="showHeightPicker">
|
||||
<text class="filter-label">身高要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>身高要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ heightText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -52,7 +60,7 @@
|
|||
|
||||
<!-- 学历要求(可多选) -->
|
||||
<view class="filter-item-multi">
|
||||
<text class="filter-label">学历要求(可多选)</text>
|
||||
<text class="filter-label"><text class="required">*</text>学历要求(可多选)</text>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="edu in educationOptions"
|
||||
|
|
@ -68,7 +76,7 @@
|
|||
|
||||
<!-- 地区要求(可多选) -->
|
||||
<view class="filter-item-multi">
|
||||
<text class="filter-label">地区要求(可多选)</text>
|
||||
<text class="filter-label"><text class="required">*</text>地区要求(可多选)</text>
|
||||
<view class="tag-group">
|
||||
<view
|
||||
v-for="(city, index) in selectedCities"
|
||||
|
|
@ -87,7 +95,7 @@
|
|||
|
||||
<!-- 月收入要求 -->
|
||||
<view class="filter-item" @click="showIncomePicker">
|
||||
<text class="filter-label">月收入要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>月收入要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ incomeText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -96,7 +104,7 @@
|
|||
|
||||
<!-- 房产要求 -->
|
||||
<view class="filter-item" @click="showHousePicker">
|
||||
<text class="filter-label">房产要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>房产要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ houseText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -105,7 +113,7 @@
|
|||
|
||||
<!-- 车产要求 -->
|
||||
<view class="filter-item" @click="showCarPicker">
|
||||
<text class="filter-label">车产要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>车产要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ carText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -114,7 +122,7 @@
|
|||
|
||||
<!-- 婚姻要求 -->
|
||||
<view class="filter-item" @click="showMarriagePicker">
|
||||
<text class="filter-label">婚姻要求</text>
|
||||
<text class="filter-label"><text class="required">*</text>婚姻要求</text>
|
||||
<view class="filter-value">
|
||||
<text>{{ marriageText }}</text>
|
||||
<text class="arrow">›</text>
|
||||
|
|
@ -308,10 +316,28 @@
|
|||
<script setup>
|
||||
import { ref, reactive, computed, onMounted } from 'vue'
|
||||
import { provinceData, hotCities } from '@/utils/cityData.js'
|
||||
import { getApiBaseUrl } from '@/config/index.js'
|
||||
import { useUserStore } from '@/store/user.js'
|
||||
import { useConfigStore } from '@/store/config.js'
|
||||
|
||||
// stores
|
||||
const userStore = useUserStore()
|
||||
const configStore = useConfigStore()
|
||||
|
||||
// 状态栏高度
|
||||
const statusBarHeight = ref(20)
|
||||
|
||||
// 搜索页Banner（从store获取）
|
||||
const searchBanner = computed(() => configStore.searchBanner)
|
||||
|
||||
// 获取完整URL
|
||||
const getFullUrl = (url) => {
|
||||
if (!url) return ''
|
||||
if (url.startsWith('http')) return url
|
||||
const baseUrl = getApiBaseUrl().replace(/\/api$/, '')
|
||||
return `${baseUrl}${url}`
|
||||
}
|
||||
|
||||
// 获取系统信息
|
||||
const getSystemInfo = () => {
|
||||
uni.getSystemInfo({
|
||||
|
|
@ -626,6 +652,70 @@ const removeCity = (index) => {
|
|||
|
||||
// 搜索
|
||||
const handleSearch = () => {
|
||||
// 检查是否登录
|
||||
if (!userStore.isLoggedIn) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先登录后再搜索',
|
||||
confirmText: '去登录',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({ url: '/pages/login/index' })
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 检查是否填写资料
|
||||
if (!userStore.isProfileCompleted) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先完善个人资料后再搜索',
|
||||
confirmText: '去填写',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({ url: '/pages/profile/edit' })
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 验证必填项
|
||||
if (!filters.ageMin && !filters.ageMax) {
|
||||
uni.showToast({ title: '请选择年龄要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (!filters.heightMin && !filters.heightMax) {
|
||||
uni.showToast({ title: '请选择身高要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (filters.education.length === 0) {
|
||||
uni.showToast({ title: '请选择学历要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (selectedCities.value.length === 0) {
|
||||
uni.showToast({ title: '请选择地区要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (filters.monthlyIncome === 0) {
|
||||
uni.showToast({ title: '请选择月收入要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (filters.houseStatus === 0) {
|
||||
uni.showToast({ title: '请选择房产要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (filters.carStatus === 0) {
|
||||
uni.showToast({ title: '请选择车产要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (filters.marriageStatus === 0) {
|
||||
uni.showToast({ title: '请选择婚姻要求', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
// 构建搜索参数
|
||||
const params = {
|
||||
ageMin: filters.ageMin,
|
||||
|
|
@ -713,6 +803,17 @@ onMounted(() => {
|
|||
height: 320rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.banner-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.banner-default {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.banner-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
@ -793,6 +894,11 @@ onMounted(() => {
|
|||
.filter-label {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
|
||||
.required {
|
||||
color: #ff6b6b;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-value {
|
||||
|
|
@ -825,6 +931,11 @@ onMounted(() => {
|
|||
font-size: 30rpx;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.required {
|
||||
color: #ff6b6b;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
/**
|
||||
* 配置状态管理模块
|
||||
* Requirements: 2.1, 2.2, 3.1, 3.2, 3.3
|
||||
* 小程序启动时一次性加载所有配置
|
||||
*/
|
||||
|
||||
import { defineStore } from 'pinia'
|
||||
|
|
@ -8,9 +8,9 @@ import {
|
|||
getLastPopupDate, setLastPopupDate,
|
||||
getMemberAdClosedDate, setMemberAdClosedDate,
|
||||
getMemberAdClosedForever, setMemberAdClosedForever,
|
||||
getGenderPreference,
|
||||
getDefaultAvatar, setDefaultAvatar
|
||||
} from '../utils/storage.js'
|
||||
import { getAppConfig } from '../api/config.js'
|
||||
|
||||
/**
|
||||
* 获取今天的日期字符串 (YYYY-MM-DD)
|
||||
|
|
@ -21,35 +21,26 @@ export function getTodayDateString() {
|
|||
return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`
|
||||
}
|
||||
|
||||
/**
|
||||
* 配置状态定义
|
||||
* @typedef {Object} ConfigState
|
||||
* @property {Array} banners - Banner轮播图列表
|
||||
* @property {Array} kingKongs - 金刚位导航列表
|
||||
* @property {Object|null} dailyPopup - 每日弹窗配置
|
||||
* @property {string} lastPopupDate - 上次显示弹窗的日期
|
||||
* @property {string} memberAdClosedDate - 会员广告关闭日期
|
||||
* @property {boolean} showGenderPopup - 是否显示性别选择弹窗
|
||||
* @property {boolean} showDailyPopup - 是否显示每日弹窗
|
||||
* @property {boolean} showMemberAd - 是否显示会员广告
|
||||
*/
|
||||
|
||||
export const useConfigStore = defineStore('config', {
|
||||
state: () => ({
|
||||
// 是否已加载配置
|
||||
isLoaded: false,
|
||||
|
||||
// 首页配置
|
||||
banners: [],
|
||||
kingKongs: [],
|
||||
|
||||
// 系统配置
|
||||
defaultAvatar: getDefaultAvatar() || '/static/logo.png',
|
||||
searchBanner: '',
|
||||
|
||||
// 弹窗配置
|
||||
dailyPopup: null,
|
||||
memberAdConfig: null, // 会员广告配置（从后台获取）
|
||||
memberAdConfig: null,
|
||||
lastPopupDate: getLastPopupDate() || '',
|
||||
memberAdClosedDate: getMemberAdClosedDate() || '',
|
||||
memberAdClosedForever: getMemberAdClosedForever() || false,
|
||||
|
||||
// 默认头像（从后台配置获取）
|
||||
defaultAvatar: getDefaultAvatar() || '/static/logo.png',
|
||||
|
||||
// 弹窗显示状态
|
||||
showGenderPopup: false,
|
||||
showDailyPopup: false,
|
||||
|
|
@ -57,79 +48,50 @@ export const useConfigStore = defineStore('config', {
|
|||
}),
|
||||
|
||||
getters: {
|
||||
/**
|
||||
* 是否有Banner数据
|
||||
*/
|
||||
hasBanners: (state) => state.banners.length > 0,
|
||||
|
||||
/**
|
||||
* 是否有金刚位数据
|
||||
*/
|
||||
hasKingKongs: (state) => state.kingKongs.length > 0,
|
||||
|
||||
/**
|
||||
* 是否有每日弹窗
|
||||
*/
|
||||
hasDailyPopup: (state) => state.dailyPopup !== null,
|
||||
|
||||
/**
|
||||
* 是否有会员广告配置
|
||||
*/
|
||||
hasMemberAdConfig: (state) => state.memberAdConfig !== null && state.memberAdConfig.status === 1,
|
||||
|
||||
/**
|
||||
* 获取默认头像URL
|
||||
*/
|
||||
getDefaultAvatar: (state) => state.defaultAvatar || '/static/logo.png'
|
||||
},
|
||||
|
||||
actions: {
|
||||
/**
|
||||
* 设置首页配置
|
||||
* @param {Object} config - 首页配置
|
||||
* @param {Array} config.banners - Banner列表
|
||||
* @param {Array} config.kingKongs - 金刚位列表
|
||||
* @param {string} config.defaultAvatar - 默认头像URL
|
||||
* 加载所有配置（小程序启动时调用一次）
|
||||
*/
|
||||
setHomeConfig(config) {
|
||||
if (config.banners) {
|
||||
this.banners = config.banners
|
||||
async loadAppConfig() {
|
||||
if (this.isLoaded) return
|
||||
|
||||
try {
|
||||
const res = await getAppConfig()
|
||||
if (res && res.data) {
|
||||
const config = res.data
|
||||
|
||||
// 首页配置
|
||||
this.banners = config.banners || []
|
||||
this.kingKongs = config.kingKongs || []
|
||||
|
||||
// 系统配置
|
||||
if (config.defaultAvatar) {
|
||||
this.defaultAvatar = config.defaultAvatar
|
||||
setDefaultAvatar(config.defaultAvatar)
|
||||
}
|
||||
this.searchBanner = config.searchBanner || ''
|
||||
|
||||
// 弹窗配置
|
||||
this.dailyPopup = config.dailyPopup || null
|
||||
this.memberAdConfig = config.memberAdPopup || null
|
||||
|
||||
this.isLoaded = true
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载配置失败:', error)
|
||||
}
|
||||
if (config.kingKongs) {
|
||||
this.kingKongs = config.kingKongs
|
||||
}
|
||||
if (config.defaultAvatar) {
|
||||
this.defaultAvatar = config.defaultAvatar
|
||||
setDefaultAvatar(config.defaultAvatar)
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置每日弹窗配置
|
||||
* @param {Object} popup - 弹窗配置
|
||||
*/
|
||||
setDailyPopup(popup) {
|
||||
this.dailyPopup = popup
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置会员广告配置
|
||||
* @param {Object} config - 会员广告配置
|
||||
*/
|
||||
setMemberAdConfig(config) {
|
||||
this.memberAdConfig = config
|
||||
},
|
||||
|
||||
/**
|
||||
* 检查并决定显示哪个弹窗
|
||||
* Property 5: Popup Priority Logic - 性别选择弹窗优先级最高
|
||||
* Property 6: Daily Popup Display - 每日首次显示弹窗
|
||||
* Property 7: Member Ad Visibility - 非会员且未关闭时显示广告
|
||||
*
|
||||
* @param {Object} userState - 用户状态
|
||||
* @param {number} userState.genderPreference - 性别偏好
|
||||
* @param {boolean} userState.isProfileCompleted - 资料是否完成
|
||||
* @param {boolean} userState.isMember - 是否会员
|
||||
*/
|
||||
checkPopupDisplay(userState) {
|
||||
const today = getTodayDateString()
|
||||
|
|
@ -140,36 +102,29 @@ export const useConfigStore = defineStore('config', {
|
|||
this.showDailyPopup = false
|
||||
this.showMemberAd = false
|
||||
|
||||
// Property 5: 性别选择弹窗优先级最高
|
||||
// 当用户未选择性别偏好且未完成资料时显示
|
||||
// 性别选择弹窗优先级最高
|
||||
if (genderPreference === 0 && !isProfileCompleted) {
|
||||
this.showGenderPopup = true
|
||||
return // 性别弹窗优先级最高，显示后不再检查其他弹窗
|
||||
return
|
||||
}
|
||||
|
||||
// Property 6: 每日弹窗显示
|
||||
// 当今天还没显示过弹窗时显示
|
||||
// 每日弹窗
|
||||
if (this.lastPopupDate !== today && this.dailyPopup) {
|
||||
this.showDailyPopup = true
|
||||
return // 每日弹窗显示后不再检查会员广告
|
||||
return
|
||||
}
|
||||
|
||||
// Property 7: 会员广告可见性
|
||||
// 非会员且后台配置启用时，根据显示模式判断是否显示
|
||||
// 会员广告
|
||||
if (!isMember && this.memberAdConfig && this.memberAdConfig.status === 1) {
|
||||
const displayMode = this.memberAdConfig.displayMode || 2
|
||||
|
||||
// displayMode: 1每次进入都显示 2关闭后当天不再显示 3关闭后永不显示
|
||||
if (displayMode === 1) {
|
||||
// 每次进入都显示
|
||||
this.showMemberAd = true
|
||||
} else if (displayMode === 2) {
|
||||
// 关闭后当天不再显示
|
||||
if (this.memberAdClosedDate !== today) {
|
||||
this.showMemberAd = true
|
||||
}
|
||||
} else if (displayMode === 3) {
|
||||
// 关闭后永不显示
|
||||
if (!this.memberAdClosedForever) {
|
||||
this.showMemberAd = true
|
||||
}
|
||||
|
|
@ -177,16 +132,10 @@ export const useConfigStore = defineStore('config', {
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 关闭性别选择弹窗
|
||||
*/
|
||||
closeGenderPopup() {
|
||||
this.showGenderPopup = false
|
||||
},
|
||||
|
||||
/**
|
||||
* 关闭每日弹窗并记录日期
|
||||
*/
|
||||
closeDailyPopup() {
|
||||
const today = getTodayDateString()
|
||||
this.showDailyPopup = false
|
||||
|
|
@ -194,10 +143,6 @@ export const useConfigStore = defineStore('config', {
|
|||
setLastPopupDate(today)
|
||||
},
|
||||
|
||||
/**
|
||||
* 关闭会员广告
|
||||
* 根据显示模式决定关闭行为
|
||||
*/
|
||||
closeMemberAd() {
|
||||
const today = getTodayDateString()
|
||||
this.showMemberAd = false
|
||||
|
|
@ -205,74 +150,24 @@ export const useConfigStore = defineStore('config', {
|
|||
const displayMode = this.memberAdConfig?.displayMode || 2
|
||||
|
||||
if (displayMode === 2) {
|
||||
// 关闭后当天不再显示
|
||||
this.memberAdClosedDate = today
|
||||
setMemberAdClosedDate(today)
|
||||
} else if (displayMode === 3) {
|
||||
// 关闭后永不显示
|
||||
this.memberAdClosedForever = true
|
||||
setMemberAdClosedForever(true)
|
||||
}
|
||||
// displayMode === 1 时不记录，下次进入还会显示
|
||||
},
|
||||
|
||||
/**
|
||||
* 判断是否应该显示性别选择弹窗
|
||||
* Property 5: Popup Priority Logic
|
||||
* @param {number} genderPreference - 性别偏好
|
||||
* @param {boolean} isProfileCompleted - 资料是否完成
|
||||
* @returns {boolean}
|
||||
*/
|
||||
shouldShowGenderPopup(genderPreference, isProfileCompleted) {
|
||||
return genderPreference === 0 && !isProfileCompleted
|
||||
},
|
||||
|
||||
/**
|
||||
* 判断是否应该显示每日弹窗
|
||||
* Property 6: Daily Popup Display
|
||||
* @param {string} lastShownDate - 上次显示日期
|
||||
* @param {string} today - 今天日期
|
||||
* @returns {boolean}
|
||||
*/
|
||||
shouldShowDailyPopup(lastShownDate, today) {
|
||||
return lastShownDate !== today
|
||||
},
|
||||
|
||||
/**
|
||||
* 判断是否应该显示会员广告
|
||||
* Property 7: Member Ad Visibility
|
||||
* @param {boolean} isMember - 是否会员
|
||||
* @param {string} adClosedDate - 广告关闭日期
|
||||
* @param {string} today - 今天日期
|
||||
* @returns {boolean}
|
||||
*/
|
||||
shouldShowMemberAd(isMember, adClosedDate, today) {
|
||||
return !isMember && adClosedDate !== today
|
||||
},
|
||||
|
||||
/**
|
||||
* 重置配置状态
|
||||
*/
|
||||
reset() {
|
||||
this.isLoaded = false
|
||||
this.banners = []
|
||||
this.kingKongs = []
|
||||
this.searchBanner = ''
|
||||
this.dailyPopup = null
|
||||
this.memberAdConfig = null
|
||||
this.showGenderPopup = false
|
||||
this.showDailyPopup = false
|
||||
this.showMemberAd = false
|
||||
// 不重置 defaultAvatar，保留后台配置
|
||||
},
|
||||
|
||||
/**
|
||||
* 设置默认头像
|
||||
* @param {string} avatar - 默认头像URL
|
||||
*/
|
||||
setDefaultAvatarConfig(avatar) {
|
||||
if (avatar) {
|
||||
this.defaultAvatar = avatar
|
||||
setDefaultAvatar(avatar)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -117,6 +117,62 @@ public class AdminConfigController : ControllerBase
|
|||
var result = await _configService.SetPrivacyPolicyAsync(request.Content);
|
||||
return result ? ApiResponse.Success("设置成功") : ApiResponse.Error(40001, "设置失败");
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取会员权益长图
|
||||
/// </summary>
|
||||
[HttpGet("memberBenefitsImage")]
|
||||
public async Task<ApiResponse<MemberBenefitsImageResponse>> GetMemberBenefitsImage()
|
||||
{
|
||||
var imageUrl = await _configService.GetMemberBenefitsImageAsync();
|
||||
return ApiResponse<MemberBenefitsImageResponse>.Success(new MemberBenefitsImageResponse
|
||||
{
|
||||
ImageUrl = imageUrl
|
||||
});
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 设置会员权益长图
|
||||
/// </summary>
|
||||
[HttpPost("memberBenefitsImage")]
|
||||
public async Task<ApiResponse> SetMemberBenefitsImage([FromBody] SetMemberBenefitsImageRequest request)
|
||||
{
|
||||
if (string.IsNullOrWhiteSpace(request.ImageUrl))
|
||||
{
|
||||
return ApiResponse.Error(40001, "图片URL不能为空");
|
||||
}
|
||||
|
||||
var result = await _configService.SetMemberBenefitsImageAsync(request.ImageUrl);
|
||||
return result ? ApiResponse.Success("设置成功") : ApiResponse.Error(40001, "设置失败");
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取搜索页Banner
|
||||
/// </summary>
|
||||
[HttpGet("searchBanner")]
|
||||
public async Task<ApiResponse<SearchBannerResponse>> GetSearchBanner()
|
||||
{
|
||||
var imageUrl = await _configService.GetSearchBannerAsync();
|
||||
return ApiResponse<SearchBannerResponse>.Success(new SearchBannerResponse
|
||||
{
|
||||
ImageUrl = imageUrl
|
||||
});
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 设置搜索页Banner
|
||||
/// </summary>
|
||||
[HttpPost("searchBanner")]
|
||||
public async Task<ApiResponse> SetSearchBanner([FromBody] SetSearchBannerRequest request)
|
||||
{
|
||||
if (string.IsNullOrWhiteSpace(request.ImageUrl))
|
||||
{
|
||||
return ApiResponse.Error(40001, "图片URL不能为空");
|
||||
}
|
||||
|
||||
var result = await _configService.SetSearchBannerAsync(request.ImageUrl);
|
||||
return result ? ApiResponse.Success("设置成功") : ApiResponse.Error(40001, "设置失败");
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
|
|
@ -162,3 +218,47 @@ public class SetAgreementRequest
|
|||
/// </summary>
|
||||
public string Content { get; set; } = string.Empty;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 会员权益长图响应
|
||||
/// </summary>
|
||||
public class MemberBenefitsImageResponse
|
||||
{
|
||||
/// <summary>
|
||||
/// 图片URL
|
||||
/// </summary>
|
||||
public string? ImageUrl { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 设置会员权益长图请求
|
||||
/// </summary>
|
||||
public class SetMemberBenefitsImageRequest
|
||||
{
|
||||
/// <summary>
|
||||
/// 图片URL
|
||||
/// </summary>
|
||||
public string ImageUrl { get; set; } = string.Empty;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 搜索页Banner响应
|
||||
/// </summary>
|
||||
public class SearchBannerResponse
|
||||
{
|
||||
/// <summary>
|
||||
/// 图片URL
|
||||
/// </summary>
|
||||
public string? ImageUrl { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 设置搜索页Banner请求
|
||||
/// </summary>
|
||||
public class SetSearchBannerRequest
|
||||
{
|
||||
/// <summary>
|
||||
/// 图片URL
|
||||
/// </summary>
|
||||
public string ImageUrl { get; set; } = string.Empty;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,238 @@
|
|||
using Microsoft.AspNetCore.Authorization;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using XiangYi.Application.DTOs.Responses;
|
||||
using XiangYi.Core.Entities.Biz;
|
||||
using XiangYi.Core.Interfaces;
|
||||
|
||||
namespace XiangYi.AdminApi.Controllers;
|
||||
|
||||
/// <summary>
|
||||
/// 会员等级配置控制器
|
||||
/// </summary>
|
||||
[ApiController]
|
||||
[Route("api/admin/memberTiers")]
|
||||
[Authorize]
|
||||
public class AdminMemberTierController : ControllerBase
|
||||
{
|
||||
private readonly IRepository<MemberTierConfig> _tierRepository;
|
||||
private readonly ILogger<AdminMemberTierController> _logger;
|
||||
|
||||
public AdminMemberTierController(
|
||||
IRepository<MemberTierConfig> tierRepository,
|
||||
ILogger<AdminMemberTierController> logger)
|
||||
{
|
||||
_tierRepository = tierRepository;
|
||||
_logger = logger;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取所有会员等级配置
|
||||
/// </summary>
|
||||
[HttpGet]
|
||||
public async Task<ApiResponse<List<MemberTierDto>>> GetList()
|
||||
{
|
||||
var list = await _tierRepository.GetListAsync(t => true);
|
||||
var result = list.OrderBy(t => t.Sort).Select(t => new MemberTierDto
|
||||
{
|
||||
Id = t.Id,
|
||||
Level = t.Level,
|
||||
Name = t.Name,
|
||||
Badge = t.Badge,
|
||||
Price = t.Price,
|
||||
OriginalPrice = t.OriginalPrice,
|
||||
Discount = t.Discount,
|
||||
BenefitsImage = t.BenefitsImage,
|
||||
Sort = t.Sort,
|
||||
Status = t.Status,
|
||||
CreateTime = t.CreateTime,
|
||||
UpdateTime = t.UpdateTime
|
||||
}).ToList();
|
||||
|
||||
return ApiResponse<List<MemberTierDto>>.Success(result);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取单个会员等级配置
|
||||
/// </summary>
|
||||
[HttpGet("{id}")]
|
||||
public async Task<ApiResponse<MemberTierDto>> GetById(long id)
|
||||
{
|
||||
var tier = await _tierRepository.GetByIdAsync(id);
|
||||
if (tier == null)
|
||||
{
|
||||
return ApiResponse<MemberTierDto>.Error(40004, "配置不存在");
|
||||
}
|
||||
|
||||
return ApiResponse<MemberTierDto>.Success(new MemberTierDto
|
||||
{
|
||||
Id = tier.Id,
|
||||
Level = tier.Level,
|
||||
Name = tier.Name,
|
||||
Badge = tier.Badge,
|
||||
Price = tier.Price,
|
||||
OriginalPrice = tier.OriginalPrice,
|
||||
Discount = tier.Discount,
|
||||
BenefitsImage = tier.BenefitsImage,
|
||||
Sort = tier.Sort,
|
||||
Status = tier.Status,
|
||||
CreateTime = tier.CreateTime,
|
||||
UpdateTime = tier.UpdateTime
|
||||
});
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 创建会员等级配置
|
||||
/// </summary>
|
||||
[HttpPost]
|
||||
public async Task<ApiResponse<MemberTierDto>> Create([FromBody] CreateMemberTierRequest request)
|
||||
{
|
||||
// 检查等级是否已存在
|
||||
var exists = await _tierRepository.ExistsAsync(t => t.Level == request.Level);
|
||||
if (exists)
|
||||
{
|
||||
return ApiResponse<MemberTierDto>.Error(40001, "该会员等级已存在");
|
||||
}
|
||||
|
||||
var tier = new MemberTierConfig
|
||||
{
|
||||
Level = request.Level,
|
||||
Name = request.Name,
|
||||
Badge = request.Badge,
|
||||
Price = request.Price,
|
||||
OriginalPrice = request.OriginalPrice,
|
||||
Discount = request.Discount,
|
||||
BenefitsImage = request.BenefitsImage,
|
||||
Sort = request.Sort,
|
||||
Status = request.Status,
|
||||
CreateTime = DateTime.Now,
|
||||
UpdateTime = DateTime.Now
|
||||
};
|
||||
|
||||
tier = await _tierRepository.AddAsync(tier);
|
||||
_logger.LogInformation("创建会员等级配置: Id={Id}, Level={Level}", tier.Id, tier.Level);
|
||||
|
||||
return ApiResponse<MemberTierDto>.Success(new MemberTierDto
|
||||
{
|
||||
Id = tier.Id,
|
||||
Level = tier.Level,
|
||||
Name = tier.Name,
|
||||
Badge = tier.Badge,
|
||||
Price = tier.Price,
|
||||
OriginalPrice = tier.OriginalPrice,
|
||||
Discount = tier.Discount,
|
||||
BenefitsImage = tier.BenefitsImage,
|
||||
Sort = tier.Sort,
|
||||
Status = tier.Status,
|
||||
CreateTime = tier.CreateTime,
|
||||
UpdateTime = tier.UpdateTime
|
||||
});
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 更新会员等级配置
|
||||
/// </summary>
|
||||
[HttpPut("{id}")]
|
||||
public async Task<ApiResponse> Update(long id, [FromBody] UpdateMemberTierRequest request)
|
||||
{
|
||||
var tier = await _tierRepository.GetByIdAsync(id);
|
||||
if (tier == null)
|
||||
{
|
||||
return ApiResponse.Error(40004, "配置不存在");
|
||||
}
|
||||
|
||||
// 如果修改了等级，检查新等级是否已存在
|
||||
if (request.Level != tier.Level)
|
||||
{
|
||||
var exists = await _tierRepository.ExistsAsync(t => t.Level == request.Level && t.Id != id);
|
||||
if (exists)
|
||||
{
|
||||
return ApiResponse.Error(40001, "该会员等级已存在");
|
||||
}
|
||||
}
|
||||
|
||||
tier.Level = request.Level;
|
||||
tier.Name = request.Name;
|
||||
tier.Badge = request.Badge;
|
||||
tier.Price = request.Price;
|
||||
tier.OriginalPrice = request.OriginalPrice;
|
||||
tier.Discount = request.Discount;
|
||||
tier.BenefitsImage = request.BenefitsImage;
|
||||
tier.Sort = request.Sort;
|
||||
tier.Status = request.Status;
|
||||
tier.UpdateTime = DateTime.Now;
|
||||
|
||||
await _tierRepository.UpdateAsync(tier);
|
||||
_logger.LogInformation("更新会员等级配置: Id={Id}", id);
|
||||
|
||||
return ApiResponse.Success("更新成功");
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 删除会员等级配置
|
||||
/// </summary>
|
||||
[HttpDelete("{id}")]
|
||||
public async Task<ApiResponse> Delete(long id)
|
||||
{
|
||||
var tier = await _tierRepository.GetByIdAsync(id);
|
||||
if (tier == null)
|
||||
{
|
||||
return ApiResponse.Error(40004, "配置不存在");
|
||||
}
|
||||
|
||||
await _tierRepository.DeleteAsync(id);
|
||||
_logger.LogInformation("删除会员等级配置: Id={Id}", id);
|
||||
|
||||
return ApiResponse.Success("删除成功");
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 会员等级DTO
|
||||
/// </summary>
|
||||
public class MemberTierDto
|
||||
{
|
||||
public long Id { get; set; }
|
||||
public int Level { get; set; }
|
||||
public string Name { get; set; } = string.Empty;
|
||||
public string? Badge { get; set; }
|
||||
public decimal Price { get; set; }
|
||||
public decimal OriginalPrice { get; set; }
|
||||
public string? Discount { get; set; }
|
||||
public string? BenefitsImage { get; set; }
|
||||
public int Sort { get; set; }
|
||||
public int Status { get; set; }
|
||||
public DateTime? CreateTime { get; set; }
|
||||
public DateTime? UpdateTime { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 创建会员等级请求
|
||||
/// </summary>
|
||||
public class CreateMemberTierRequest
|
||||
{
|
||||
public int Level { get; set; }
|
||||
public string Name { get; set; } = string.Empty;
|
||||
public string? Badge { get; set; }
|
||||
public decimal Price { get; set; }
|
||||
public decimal OriginalPrice { get; set; }
|
||||
public string? Discount { get; set; }
|
||||
public string? BenefitsImage { get; set; }
|
||||
public int Sort { get; set; }
|
||||
public int Status { get; set; } = 1;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 更新会员等级请求
|
||||
/// </summary>
|
||||
public class UpdateMemberTierRequest
|
||||
{
|
||||
public int Level { get; set; }
|
||||
public string Name { get; set; } = string.Empty;
|
||||
public string? Badge { get; set; }
|
||||
public decimal Price { get; set; }
|
||||
public decimal OriginalPrice { get; set; }
|
||||
public string? Discount { get; set; }
|
||||
public string? BenefitsImage { get; set; }
|
||||
public int Sort { get; set; }
|
||||
public int Status { get; set; }
|
||||
}
|
||||
|
|
@ -27,6 +27,18 @@ public class ConfigController : ControllerBase
|
|||
_logger = logger;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取小程序统一配置（启动时调用，一次获取所有配置）
|
||||
/// </summary>
|
||||
/// <returns>统一配置</returns>
|
||||
[HttpGet("app")]
|
||||
[AllowAnonymous]
|
||||
public async Task<ApiResponse<AppConfigResponse>> GetAppConfig()
|
||||
{
|
||||
var result = await _configService.GetAppConfigAsync();
|
||||
return ApiResponse<AppConfigResponse>.Success(result);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取首页配置（Banner和金刚位）
|
||||
/// </summary>
|
||||
|
|
@ -39,30 +51,6 @@ public class ConfigController : ControllerBase
|
|||
return ApiResponse<HomeConfigResponse>.Success(result);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取弹窗配置
|
||||
/// </summary>
|
||||
/// <param name="popupType">弹窗类型：1每日首次 2服务号关注 3会员广告</param>
|
||||
/// <returns>弹窗配置</returns>
|
||||
[HttpGet("popup")]
|
||||
[AllowAnonymous]
|
||||
public async Task<ApiResponse<PopupConfigResponse?>> GetPopupConfig([FromQuery] int popupType = 1)
|
||||
{
|
||||
var result = await _configService.GetPopupConfigAsync(popupType);
|
||||
return ApiResponse<PopupConfigResponse?>.Success(result);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取所有弹窗配置
|
||||
/// </summary>
|
||||
/// <returns>弹窗配置列表</returns>
|
||||
[HttpGet("popups")]
|
||||
public async Task<ApiResponse<List<PopupConfigResponse>>> GetAllPopupConfigs()
|
||||
{
|
||||
var result = await _configService.GetAllPopupConfigsAsync();
|
||||
return ApiResponse<List<PopupConfigResponse>>.Success(result);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取用户协议
|
||||
/// </summary>
|
||||
|
|
@ -92,21 +80,6 @@ public class ConfigController : ControllerBase
|
|||
Content = content ?? "暂无隐私协议内容"
|
||||
});
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获取默认头像配置
|
||||
/// </summary>
|
||||
/// <returns>默认头像URL</returns>
|
||||
[HttpGet("defaultAvatar")]
|
||||
[AllowAnonymous]
|
||||
public async Task<ApiResponse<DefaultAvatarConfigResponse>> GetDefaultAvatar()
|
||||
{
|
||||
var avatarUrl = await _systemConfigService.GetDefaultAvatarAsync();
|
||||
return ApiResponse<DefaultAvatarConfigResponse>.Success(new DefaultAvatarConfigResponse
|
||||
{
|
||||
AvatarUrl = avatarUrl
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
|
|
@ -119,14 +92,3 @@ public class AgreementContentResponse
|
|||
/// </summary>
|
||||
public string Content { get; set; } = string.Empty;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 默认头像配置响应
|
||||
/// </summary>
|
||||
public class DefaultAvatarConfigResponse
|
||||
{
|
||||
/// <summary>
|
||||
/// 默认头像URL
|
||||
/// </summary>
|
||||
public string? AvatarUrl { get; set; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -59,6 +59,52 @@ public class MemberInfoResponse
|
|||
/// 最大可绑定家庭成员数量
|
||||
/// </summary>
|
||||
public int MaxFamilyBindCount { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 会员等级配置列表
|
||||
/// </summary>
|
||||
public List<MemberTierResponse> Tiers { get; set; } = new();
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 会员等级配置响应
|
||||
/// </summary>
|
||||
public class MemberTierResponse
|
||||
{
|
||||
/// <summary>
|
||||
/// 会员等级
|
||||
/// </summary>
|
||||
public int Level { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 等级名称
|
||||
/// </summary>
|
||||
public string Name { get; set; } = string.Empty;
|
||||
|
||||
/// <summary>
|
||||
/// 角标文字
|
||||
/// </summary>
|
||||
public string? Badge { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 现价
|
||||
/// </summary>
|
||||
public decimal Price { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 原价
|
||||
/// </summary>
|
||||
public decimal OriginalPrice { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 折扣描述
|
||||
/// </summary>
|
||||
public string? Discount { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 权益图片URL
|
||||
/// </summary>
|
||||
public string? BenefitsImage { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
|
|
|
|||
|
|
@ -5,6 +5,12 @@ namespace XiangYi.Application.Interfaces;
|
|||
/// </summary>
|
||||
public interface IConfigService
|
||||
{
|
||||
/// <summary>
|
||||
/// 获取小程序统一配置（包含所有配置项）
|
||||
/// </summary>
|
||||
/// <returns>统一配置响应</returns>
|
||||
Task<AppConfigResponse> GetAppConfigAsync();
|
||||
|
||||
/// <summary>
|
||||
/// 获取首页配置（Banner列表和金刚位列表）
|
||||
/// </summary>
|
||||
|
|
@ -58,6 +64,42 @@ public class HomeConfigResponse
|
|||
public string? DefaultAvatar { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 小程序统一配置响应
|
||||
/// </summary>
|
||||
public class AppConfigResponse
|
||||
{
|
||||
/// <summary>
|
||||
/// Banner列表
|
||||
/// </summary>
|
||||
public List<BannerResponse> Banners { get; set; } = new();
|
||||
|
||||
/// <summary>
|
||||
/// 金刚位列表
|
||||
/// </summary>
|
||||
public List<KingKongResponse> KingKongs { get; set; } = new();
|
||||
|
||||
/// <summary>
|
||||
/// 默认头像URL
|
||||
/// </summary>
|
||||
public string? DefaultAvatar { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 搜索页Banner URL
|
||||
/// </summary>
|
||||
public string? SearchBanner { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 每日弹窗配置
|
||||
/// </summary>
|
||||
public PopupConfigResponse? DailyPopup { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 会员广告弹窗配置
|
||||
/// </summary>
|
||||
public PopupConfigResponse? MemberAdPopup { get; set; }
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Banner响应
|
||||
/// </summary>
|
||||
|
|
|
|||
|
|
@ -49,4 +49,24 @@ public interface ISystemConfigService
|
|||
/// 设置隐私协议内容
|
||||
/// </summary>
|
||||
Task<bool> SetPrivacyPolicyAsync(string content);
|
||||
|
||||
/// <summary>
|
||||
/// 获取会员权益长图URL
|
||||
/// </summary>
|
||||
Task<string?> GetMemberBenefitsImageAsync();
|
||||
|
||||
/// <summary>
|
||||
/// 设置会员权益长图URL
|
||||
/// </summary>
|
||||
Task<bool> SetMemberBenefitsImageAsync(string imageUrl);
|
||||
|
||||
/// <summary>
|
||||
/// 获取搜索页Banner图URL
|
||||
/// </summary>
|
||||
Task<string?> GetSearchBannerAsync();
|
||||
|
||||
/// <summary>
|
||||
/// 设置搜索页Banner图URL
|
||||
/// </summary>
|
||||
Task<bool> SetSearchBannerAsync(string imageUrl);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,6 +40,27 @@ public class ConfigService : IConfigService
|
|||
_logger = logger;
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<AppConfigResponse> GetAppConfigAsync()
|
||||
{
|
||||
var banners = await GetBannersAsync();
|
||||
var kingKongs = await GetKingKongsAsync();
|
||||
var defaultAvatar = await _systemConfigService.GetDefaultAvatarAsync();
|
||||
var searchBanner = await _systemConfigService.GetSearchBannerAsync();
|
||||
var dailyPopup = await GetPopupConfigAsync(1); // 每日弹窗
|
||||
var memberAdPopup = await GetPopupConfigAsync(3); // 会员广告弹窗
|
||||
|
||||
return new AppConfigResponse
|
||||
{
|
||||
Banners = banners,
|
||||
KingKongs = kingKongs,
|
||||
DefaultAvatar = defaultAvatar,
|
||||
SearchBanner = searchBanner,
|
||||
DailyPopup = dailyPopup,
|
||||
MemberAdPopup = memberAdPopup
|
||||
};
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<HomeConfigResponse> GetHomeConfigAsync()
|
||||
{
|
||||
|
|
|
|||
|
|
@ -20,7 +20,9 @@ public class MemberService : IMemberService
|
|||
private readonly IRepository<Member> _memberRepository;
|
||||
private readonly IRepository<MemberFamily> _memberFamilyRepository;
|
||||
private readonly IRepository<Order> _orderRepository;
|
||||
private readonly IRepository<MemberTierConfig> _tierConfigRepository;
|
||||
private readonly IWeChatService _weChatService;
|
||||
private readonly ISystemConfigService _systemConfigService;
|
||||
private readonly ILogger<MemberService> _logger;
|
||||
|
||||
/// <summary>
|
||||
|
|
@ -60,14 +62,18 @@ public class MemberService : IMemberService
|
|||
IRepository<Member> memberRepository,
|
||||
IRepository<MemberFamily> memberFamilyRepository,
|
||||
IRepository<Order> orderRepository,
|
||||
IRepository<MemberTierConfig> tierConfigRepository,
|
||||
IWeChatService weChatService,
|
||||
ISystemConfigService systemConfigService,
|
||||
ILogger<MemberService> logger)
|
||||
{
|
||||
_userRepository = userRepository;
|
||||
_memberRepository = memberRepository;
|
||||
_memberFamilyRepository = memberFamilyRepository;
|
||||
_orderRepository = orderRepository;
|
||||
_tierConfigRepository = tierConfigRepository;
|
||||
_weChatService = weChatService;
|
||||
_systemConfigService = systemConfigService;
|
||||
_logger = logger;
|
||||
}
|
||||
|
||||
|
|
@ -80,6 +86,19 @@ public class MemberService : IMemberService
|
|||
throw new BusinessException(ErrorCodes.UserNotFound, "用户不存在");
|
||||
}
|
||||
|
||||
// 获取会员等级配置
|
||||
var tierConfigs = await _tierConfigRepository.GetListAsync(t => t.Status == 1);
|
||||
var tiers = tierConfigs.OrderBy(t => t.Sort).Select(t => new MemberTierResponse
|
||||
{
|
||||
Level = t.Level,
|
||||
Name = t.Name,
|
||||
Badge = t.Badge,
|
||||
Price = t.Price,
|
||||
OriginalPrice = t.OriginalPrice,
|
||||
Discount = t.Discount,
|
||||
BenefitsImage = t.BenefitsImage
|
||||
}).ToList();
|
||||
|
||||
var response = new MemberInfoResponse
|
||||
{
|
||||
IsMember = user.IsMember,
|
||||
|
|
@ -89,7 +108,8 @@ public class MemberService : IMemberService
|
|||
ContactCount = user.ContactCount,
|
||||
DailyRecommendCount = GetDailyRecommendCount(user.MemberLevel),
|
||||
CanBindFamily = user.MemberLevel == 3, // 家庭版可绑定
|
||||
MaxFamilyBindCount = IMemberService.MaxFamilyBindCount
|
||||
MaxFamilyBindCount = IMemberService.MaxFamilyBindCount,
|
||||
Tiers = tiers
|
||||
};
|
||||
|
||||
// 获取会员记录详情
|
||||
|
|
|
|||
|
|
@ -28,6 +28,16 @@ public class SystemConfigService : ISystemConfigService
|
|||
/// </summary>
|
||||
public const string PrivacyPolicyKey = "privacy_policy";
|
||||
|
||||
/// <summary>
|
||||
/// 会员权益长图配置键
|
||||
/// </summary>
|
||||
public const string MemberBenefitsImageKey = "member_benefits_image";
|
||||
|
||||
/// <summary>
|
||||
/// 搜索页Banner配置键
|
||||
/// </summary>
|
||||
public const string SearchBannerKey = "search_banner";
|
||||
|
||||
public SystemConfigService(
|
||||
IRepository<SystemConfig> configRepository,
|
||||
ILogger<SystemConfigService> logger)
|
||||
|
|
@ -126,4 +136,28 @@ public class SystemConfigService : ISystemConfigService
|
|||
{
|
||||
return await SetConfigValueAsync(PrivacyPolicyKey, content, "隐私协议内容");
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<string?> GetMemberBenefitsImageAsync()
|
||||
{
|
||||
return await GetConfigValueAsync(MemberBenefitsImageKey);
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<bool> SetMemberBenefitsImageAsync(string imageUrl)
|
||||
{
|
||||
return await SetConfigValueAsync(MemberBenefitsImageKey, imageUrl, "会员权益长图URL");
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<string?> GetSearchBannerAsync()
|
||||
{
|
||||
return await GetConfigValueAsync(SearchBannerKey);
|
||||
}
|
||||
|
||||
/// <inheritdoc />
|
||||
public async Task<bool> SetSearchBannerAsync(string imageUrl)
|
||||
{
|
||||
return await SetConfigValueAsync(SearchBannerKey, imageUrl, "搜索页Banner图URL");
|
||||
}
|
||||
}
|
||||
|
|
|
|||
61
server/src/XiangYi.Core/Entities/Biz/MemberTierConfig.cs
Normal file
61
server/src/XiangYi.Core/Entities/Biz/MemberTierConfig.cs
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
using FreeSql.DataAnnotations;
|
||||
|
||||
namespace XiangYi.Core.Entities.Biz;
|
||||
|
||||
/// <summary>
|
||||
/// 会员等级配置表
|
||||
/// </summary>
|
||||
[Table(Name = "MemberTierConfig")]
|
||||
public class MemberTierConfig : BaseEntity
|
||||
{
|
||||
/// <summary>
|
||||
/// 会员等级：1永久会员 2诚意会员 3家庭版会员
|
||||
/// </summary>
|
||||
public int Level { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 等级名称
|
||||
/// </summary>
|
||||
[Column(StringLength = 50)]
|
||||
public string Name { get; set; } = string.Empty;
|
||||
|
||||
/// <summary>
|
||||
/// 角标文字（如"家庭版"）
|
||||
/// </summary>
|
||||
[Column(StringLength = 50)]
|
||||
public string? Badge { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 现价（元）
|
||||
/// </summary>
|
||||
[Column(Precision = 10, Scale = 2)]
|
||||
public decimal Price { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 原价（元）
|
||||
/// </summary>
|
||||
[Column(Precision = 10, Scale = 2)]
|
||||
public decimal OriginalPrice { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 折扣描述（如"8折优惠"）
|
||||
/// </summary>
|
||||
[Column(StringLength = 50)]
|
||||
public string? Discount { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 权益图片URL
|
||||
/// </summary>
|
||||
[Column(StringLength = 500)]
|
||||
public string? BenefitsImage { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 排序
|
||||
/// </summary>
|
||||
public int Sort { get; set; } = 0;
|
||||
|
||||
/// <summary>
|
||||
/// 状态：1启用 2禁用
|
||||
/// </summary>
|
||||
public int Status { get; set; } = 1;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user