huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

consumerm模块完成度90%，完善消费者和商家端数据库表，商品、聊天、订单数据对接好了supabase，和商家端对接了聊天功能，安卓端编译通过了css样式，剩余几个页面在处理函数规范问题

Browse Source
This commit is contained in:
cyh666666
2026-02-24 17:17:49 +08:00
parent e2f1dfb097
commit e606c597ca
174 changed files with 37917 additions and 4444 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
pages/mall/consumer/search.uvue
View File

@@ -285,7 +285,7 @@ onMounted(() => {
const initPage = () => {
try {
const systemInfo = uni.getSystemInfoSync()
statusBarHeight.value = systemInfo.statusBarHeight || 0
statusBarHeight.value = systemInfo.statusBarHeight ?? 0
const windowHeight = systemInfo.windowHeight
// 减去头部高度 (约60px + statusBarHeight)
scrollHeight.value = windowHeight - (60 + statusBarHeight.value)
@@ -343,7 +343,7 @@ const loadData = async () => {
id: p.id,
name: p.name,
price: p.base_price,
image: p.main_image_url || '/static/default.jpg',
image: p.main_image_url ?? '/static/default.jpg',
sales: typeof p.sale_count === 'number' ? p.sale_count : 0
}))
@@ -386,7 +386,7 @@ const saveSearchHistory = () => {
}
const addToHistory = (keyword: string) => {
if (!keyword) return
if (keyword == '') return
const index = searchHistory.value.indexOf(keyword)
if (index > -1) {
searchHistory.value.splice(index, 1)
@@ -418,30 +418,11 @@ const deleteHistoryItem = (index: number) => {
const searchSuggestions = ref<string[]>([])
let suggestTimer = 0
const fetchSuggestions = async (kw: string) => {
if (!kw || showResults.value) return
// 简单搜索前5个相关商品作为建议
try {
const res = await supabaseService.searchProducts(kw.trim(), 1, 5)
if (res.data.length > 0) {
// 去重
const names = res.data.map((p:any) => p.name as string)
// @ts-ignore
searchSuggestions.value = [...new Set(names)]
} else {
searchSuggestions.value = []
}
} catch(e) {
searchSuggestions.value = []
}
}
// 搜索逻辑
const onInput = (e: any) => {
const val = e.detail.value
searchKeyword.value = val
if (!val) {
if (val == '') {
showResults.value = false
searchSuggestions.value = []
return
@@ -454,13 +435,37 @@ const onInput = (e: any) => {
}, 300)
}
const fetchSuggestions = async (kw: string) => {
if (kw == '' || showResults.value) return
// 简单搜索前5个相关商品作为建议
try {
const res = await supabaseService.searchProducts(kw.trim(), 1, 5)
if (Array.isArray(res.data) && res.data.length > 0) {
// 去重
const names = res.data.map((p:any) :string => {
if(p instanceof UTSJSONObject){
return p.getString('name') ?? ''
}
return p['name'] as string
})
// @ts-ignore
searchSuggestions.value = Array.from(new Set(names))
} else {
searchSuggestions.value = []
}
} catch(e) {
searchSuggestions.value = []
}
}
const clearSearch = () => {
searchKeyword.value = ''
showResults.value = false
}
const onSearch = () => {
if (!searchKeyword.value.trim()) return
if (searchKeyword.value.trim() == '') return
addToHistory(searchKeyword.value.trim())
performSearch()
}
@@ -493,7 +498,7 @@ const performSearch = async () => {
// 使用 Supabase 搜索真实数据
const keyword = searchKeyword.value.trim()
if (!keyword) {
if (keyword == '') {
loading.value = false
return
}
@@ -523,8 +528,8 @@ const performSearch = async () => {
searchShopResults.value = shopResp.data.map((s: any) => ({
id: s.id,
name: s.shop_name,
logo: s.shop_logo || '/static/shop_logo_default.png',
productCount: s.product_count || 0
logo: s.shop_logo ?? '/static/shop_logo_default.png',
productCount: s.product_count ?? 0
}))
} else {
searchShopResults.value = []
@@ -543,11 +548,11 @@ const performSearch = async () => {
return {
id: p.id,
name: p.name,
image: p.main_image_url || '/static/default.jpg',
image: p.main_image_url ?? '/static/default.jpg',
price: p.base_price,
specification: p.specification || '标准规格',
specification: p.specification ?? '标准规格',
tag: tag,
sales: p.sale_count || 0
sales: p.sale_count ?? 0
}
})
@@ -576,7 +581,7 @@ const switchSort = (type: string) => {
}
const loadMore = async () => {
if (loading.value || !hasMore.value || !searchKeyword.value.trim()) return
if (loading.value || !hasMore.value || searchKeyword.value.trim() == '') return
loading.value = true
// 增加页码
@@ -607,11 +612,11 @@ const loadMore = async () => {
return {
id: p.id,
name: p.name,
image: p.main_image_url || '/static/default.jpg',
image: p.main_image_url ?? '/static/default.jpg',
price: p.base_price,
specification: p.specification || '标准规格',
specification: p.specification ?? '标准规格',
tag: tag,
sales: p.sale_count || 0
sales: p.sale_count ?? 0
}
})
searchResults.value.push(...newItems)
@@ -698,7 +703,7 @@ const goBack = () => {
<style>
.search-page {
width: 100%;
height: 100vh;
flex: 1; /* Fixed 100vh */
background-color: #f5f5f5;
display: flex;
flex-direction: column;
@@ -764,7 +769,7 @@ const goBack = () => {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: block;
/* display: block; REMOVED */
margin-bottom: 2px;
}
@@ -787,7 +792,6 @@ const goBack = () => {
flex-direction: row; /* UVUE 必须显式设置 row */
align-items: center;
padding: 10px 16px;
gap: 12px;
width: 100%; /* 确保占满宽度 */
}
@@ -799,6 +803,7 @@ const goBack = () => {
justify-content: center;
width: 32px; /* 固定宽度防止压缩 */
height: 32px;
margin-right: 12px;
}
.back-icon {
@@ -875,7 +880,7 @@ const goBack = () => {
.inner-search-text {
font-size: 13px;
color: #ffffff;
font-weight: 500;
font-weight: bold;
}
/* 内容区域 */
@@ -907,11 +912,12 @@ const goBack = () => {
display: flex;
flex-direction: row; /* UVUE 显式设置 row */
align-items: center;
gap: 4px;
/* gap: 4px; REMOVED */
flex-shrink: 0; /* 防止被压缩 */
}
.clear-text {
margin-right: 4px; /* REPLACED gap */
font-size: 12px;
color: #999;
}
@@ -929,7 +935,7 @@ const goBack = () => {
.history-tags {
display: flex;
flex-direction: row; /* UVUE 显式设置 row */
gap: 10px;
/* gap: 10px; REMOVED */
flex-wrap: wrap; /* 允许换行 */
padding: 0 4px;
align-items: center;
@@ -941,8 +947,10 @@ const goBack = () => {
border-radius: 16px;
display: flex;
align-items: center;
gap: 6px;
/* gap: 6px; REMOVED */
flex-shrink: 0; /* 防止被压缩 */
margin-right: 10px; /* REPLACED gap */
margin-bottom: 10px; /* REPLACED gap */
}
.history-text {
@@ -951,6 +959,7 @@ const goBack = () => {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-right: 6px; /* REPLACED gap */
}
.delete-tag-btn {
@@ -959,7 +968,7 @@ const goBack = () => {
justify-content: center;
width: 16px;
height: 16px;
border-radius: 50%;
border-radius: 8px;
background-color: #f0f0f0;
}
@@ -978,10 +987,16 @@ const goBack = () => {
display: flex;
flex-direction: row; /* UVUE 显式设置 row */
flex-wrap: wrap; /* 允许换行 */
gap: 10px;
/* gap: 10px; REMOVED */
padding: 0 4px;
}
.hot-tag {
/* ... existing styles ... */
margin-right: 10px; /* REPLACED gap */
margin-bottom: 10px; /* REPLACED gap */
}
.hot-tag {
background-color: #fff;
padding: 6px 12px;
@@ -989,8 +1004,9 @@ const goBack = () => {
display: flex;
flex-direction: row;
align-items: center;
gap: 4px;
flex-shrink: 0; /* 防止被压缩 */
margin-right: 10px; /* REPLACED gap */
margin-bottom: 10px; /* REPLACED gap */
}
.hot-tag.hot {
@@ -1001,7 +1017,7 @@ const goBack = () => {
font-size: 12px;
color: #999;
font-weight: bold;
margin-right: 2px;
margin-right: 6px;
}
.hot-rank.top-three {
@@ -1015,6 +1031,7 @@ const goBack = () => {
.hot-icon {
font-size: 12px;
margin-left: 4px;
}
/* 猜你需要 */
@@ -1025,11 +1042,11 @@ const goBack = () => {
.title-with-icon {
display: flex;
align-items: center;
gap: 6px;
}
.section-icon {
font-size: 16px;
margin-right: 6px;
}
.refresh-btn {
@@ -1038,9 +1055,11 @@ const goBack = () => {
}
.guess-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 4px;
}
.guess-item {
@@ -1048,6 +1067,8 @@ const goBack = () => {
border-radius: 8px;
overflow: hidden;
padding-bottom: 8px;
width: 48%;
margin-bottom: 10px;
}
.guess-img-box {
@@ -1074,15 +1095,15 @@ const goBack = () => {
font-size: 13px;
color: #333;
margin-bottom: 6px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.3;
height: 34px; /* 限制2行高度 */
}
.guess-price-row {
display: flex;
align-items: baseline;
align-items: flex-end; /* REPLACED baseline */
}
.price-symbol {
@@ -1139,19 +1160,18 @@ const goBack = () => {
align-items: center;
margin-bottom: 12px;
flex-wrap: wrap; /* 允许换行以适应小屏 */
gap: 8px;
}
.results-title {
font-size: 15px;
font-weight: bold;
color: #333;
margin-right: 8px;
}
.filter-tabs {
display: flex;
flex-direction: row; /* UVUE 显式设置 row */
gap: 16px;
flex: 1; /* 自适应填充剩余空间 */
justify-content: flex-end; /* 靠右对齐 */
}
@@ -1160,17 +1180,19 @@ const goBack = () => {
font-size: 13px;
color: #666;
padding: 4px 8px; /* 增加点击区域 */
margin-left: 16px;
}
.filter-tab.active {
color: #4CAF50;
font-weight: 500;
font-weight: bold; /* REPLACED 500 */
}
.results-list {
display: grid;
grid-template-columns: repeat(2, 1fr); /* 默认移动端双列 */
gap: 10px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 4px;
}
@@ -1178,26 +1200,30 @@ const goBack = () => {
/* 平板设备 (768px以上) */
@media screen and (min-width: 768px) {
.results-list {
grid-template-columns: repeat(3, 1fr); /* 平板显示3列 */
gap: 16px;
padding: 0 16px;
}
.guess-grid {
grid-template-columns: repeat(4, 1fr); /* 猜你喜欢在平板上显示4列 */
.result-item {
width: 32%;
}
.guess-item {
width: 24%; /* 猜你喜欢在平板上显示4列 */
}
}
/* 桌面设备 (1024px以上) */
@media screen and (min-width: 1024px) {
.results-list {
grid-template-columns: repeat(4, 1fr); /* 桌面显示4列 */
gap: 20px;
padding: 0 24px;
}
.result-item {
width: 24%;
}
.guess-grid {
grid-template-columns: repeat(6, 1fr); /* 猜你喜欢在桌面上显示6列 */
.guess-item {
width: 16%; /* 猜你喜欢在桌面上显示6列 */
}
/* 桌面端调整图片高度 */
@@ -1212,7 +1238,8 @@ const goBack = () => {
padding: 8px;
display: flex;
flex-direction: column; /* 垂直排列 */
gap: 8px;
width: 48%;
margin-bottom: 10px;
}
.product-image {
@@ -1227,19 +1254,17 @@ const goBack = () => {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 8px;
}
.product-name {
font-size: 13px; /* 减小字号 */
color: #333;
font-weight: 500;
font-weight: bold;
line-height: 1.3;
height: 34px; /* 限制高度 */
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.product-tags-row {
@@ -1261,7 +1286,7 @@ const goBack = () => {
.price-box {
color: #ff5000;
display: flex;
align-items: baseline;
align-items: flex-end;
}
.price-symbol {
@@ -1270,7 +1295,7 @@ const goBack = () => {
.price-value {
font-size: 16px; /* 减小价格字号 */
font-weight: 600;
font-weight: 700;
}
.add-cart-btn {
@@ -1302,17 +1327,18 @@ const goBack = () => {
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
}
.error-icon {
font-size: 48px;
margin-bottom: 12px;
}
.error-title {
font-size: 16px;
font-weight: bold;
color: #333;
margin-bottom: 12px;
}
.error-desc {
@@ -1333,16 +1359,10 @@ const goBack = () => {
height: 24px;
border: 2px solid #f0f0f0;
border-top-color: #4CAF50;
border-radius: 50%;
animation: spin 1s linear infinite;
border-radius: 12px;
margin-bottom: 8px;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.loading-text {
font-size: 12px;
color: #999;