wk450097098
/
mrr.sj.front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修复bug

This commit is contained in:
丁杰 2026-06-05 13:09:01 +08:00
parent 62632e0aff
commit 5ac5be413b
8 changed files with 526 additions and 482 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

538
App.vue
View File

@ -1,276 +1,284 @@
<script> <script>
// #ifdef APP-PLUS // #ifdef APP-PLUS
import { import {
isNotificationsEnabled, isNotificationsEnabled,
permissions, permissions,
registPush registPush
} from '@/utils/AS-NotifyTheAuthority.js' } from '@/utils/AS-NotifyTheAuthority.js'
import { import {
permissionListener permissionListener
} from './utils/permissionTips.js' } from './utils/permissionTips.js'
// import { appUpdateListener } from '@/common/utils/appUpdateTips.js' // import { appUpdateListener } from '@/common/utils/appUpdateTips.js'
import locationService from './utils/locationService.js' import locationService from './utils/locationService.js'
// import uploadApp from './utils/uploadApp.js' // import uploadApp from './utils/uploadApp.js'
// #endif // #endif
import request from './utils/request' import request from './utils/request'
import { import {
setVersion setVersion
} from './utils/version.js' } from './utils/version.js'
//初始化一键登录插件 //初始化一键登录插件
const aLiSDKModule = uni.requireNativePlugin('AliCloud-NirvanaPns'); const aLiSDKModule = uni.requireNativePlugin('AliCloud-NirvanaPns');
export default { export default {
globalData: { globalData: {
artisanType: 2, artisanType: 2,
latitude: '38.366667', latitude: '38.366667',
longitude: '117.333333', longitude: '117.333333',
address: '黄骅市', address: '黄骅市',
servers_region: `河北省-沧州市-黄骅市`, servers_region: `河北省-沧州市-黄骅市`,
deviceid: '', deviceid: '',
addressRes: { addressRes: {
"type": "gcj02", "type": "gcj02",
"altitude": 0, "altitude": 0,
"latitude": 38.372266, "latitude": 38.372266,
"longitude": 117.332895, "longitude": 117.332895,
"speed": 0, "speed": 0,
"accuracy": 30, "accuracy": 30,
"adcode": "130983",
"cCode": "130900",
"pcode": "130000",
"address": {
"country": "中国",
"province": "河北省",
"city": "沧州市",
"district": "黄骅市",
"street": "渤海西路",
"streetNum": "35号",
// "poiName": "请开启位置权限",
"poiName": "黄骅市人民政府",
"cityCode": "0317",
"adcode": "130983", "adcode": "130983",
"cCode": "130900", "cCode": "130900",
"pcode": "130000", "pcode": "130000",
"address": {
"country": "中国",
"province": "河北省",
"city": "沧州市",
"district": "黄骅市",
"street": "渤海西路",
"streetNum": "35号",
// "poiName": "请开启位置权限",
"poiName": "黄骅市人民政府",
"cityCode": "0317",
"adcode": "130983",
"cCode": "130900",
"pcode": "130000",
}
} }
},
onLaunch: async function() {
// #ifdef APP-PLUS
uni.hideTabBar();
if (uni.getStorageSync('accessToken')) {
registPush()
//跟新底部消息数量
this.messageUpudateNum()
}
// #endif
//缓存手机版本号
// await setVersion()
//获取访问路由
// 发起 GET 请求
let version = uni.getStorageSync('setVersion')
let baseUrl
await uni.request({
url: 'https://api.mrrwlkj.top/api/openPuc/getSjApiUrl', // 接口地址
method: 'GET', // 请求方法（默认 GET）
header: {
'Content-Type': 'application/json', // 请求头
'VersionCode': version.VersionCode,
'DeviceBrand': version.DeviceBrand,
'DeviceType': version.DeviceType
},
success: (res) => {
if (res.data.code == 200) {
// #ifndef MP-WEIXIN
uni.setStorageSync('baseUrl', res.data.data.url)
// #endif
// #ifdef MP-WEIXIN
wx.setStorageSync('baseUrl', res.data.data.url)
// #endif
this.$store.commit("setLocation", true)
}
console.log('请求成功', res.data);
},
fail: (err) => {
console.log('请求失败', err);
},
complete: () => {
console.log('请求完成（无论成功失败都会执行）');
}
});
// #ifdef APP-PLUS
//禁止手机横屏
plus.screen.lockOrientation("portrait-primary")
// #endif
// #ifdef APP-PLUS
//权限提示监听
let systemInfo = uni.getSystemInfoSync();
let platform = systemInfo.platform;
if (platform === 'android') {
// console.log('安卓用户')
permissionListener()
} else if (platform === 'ios') {
// console.log('苹果用户')
} else {
// console.log('平台未知')
}
//一键登录密钥设置
let sdkInfo = '';
//设置秘钥
if (platform == 'android') {
//开启SDK日志打印
aLiSDKModule.setLoggerEnable(true);
aLiSDKModule.expandAuthPageCheckedScope(true);
//禁用物理返回键
//aLiSDKModule.closeAuthPageReturnBack(true);
//开启区分界面返回及物理返回功能，自动控制后续返回事件
aLiSDKModule.userControlAuthPageCancel();
//是否跟随系统深色模式
aLiSDKModule.setAuthPageUseDayLight(false);
sdkInfo =
'cvJWYFO9s7xgJrzD+Ok2m2kCh3x0kdRkfJzGI0oxnyUXGlNAwAzvj87Yd6y030BWposVHUT84av2adBG9SdHl5CJpL0mGi+BRtachnyADJjfdpkJC0e0Uqb45pO7h7ZZvT+sNWQs1sa4JpL0U7hYKkgCP1iVXHoA1zKfzZynON6eKyvkzL1xpoPPag4O50slww4+6XuRVplCOSNCcsLRtot4CYnfsdcMvlV34MY5qB/rV+HNb1velpx4rg5atk3iTEiSLjla69c6pOT6vpjkK1qFVpNMxrEY';
} else if (platform == 'ios') {
sdkInfo =
'BONXQSabNMt1a8Cru1TjeW94aXen5rQHeAxzLGgpFzIUicDYeb9SD0l35MkKvjq7gQemE2HDp6B7adKZ8nrdUk4wgg1LIYSGDYVSc/Q1CwrJ9A3lMUeBfS1UUu3nBBg58bDvG1bl3j6tS4h6FjnYmP5+dDsyqb0YNmIhlSmia5Et7cfBMv2OT85N9WLJc/tOMQ9ZQCnuizKVlofkmDGFgjsBN/Bf2gLq6lTQyVqsgPJE5yEPd4riNg=='
}
aLiSDKModule.setAuthSDKInfo(sdkInfo)
// await uploadApp.uploadApp('onLaunch');
// #endif
console.log('App Launch')
this.globalData.deviceId = uni.getDeviceInfo().deviceId;
// this.globalData.deviceid = 'AC6F605124DFA87DCE40D5C062C94C3B';
// #ifndef MP-WEIXIN
if (uni.getStorageSync('refreshToken')) {
let endTime = uni.getStorageSync('refresh_token_expries');
endTime = new Date(endTime)
// 当前系统时间
var nowTime = new Date();
var residueTime = (endTime.getTime() - nowTime.getTime() / 1000);
// 4小时 14400
if (residueTime < 4 * 60 * 60) {
console.log('----------------------------')
uni.removeStorageSync('accessToken')
uni.removeStorageSync('refreshToken')
}
}
// #endif
// #ifdef MP-WEIXIN
if (wx.getStorageSync('refreshToken')) {
let endTime = wx.getStorageSync('refresh_token_expries');
endTime = new Date(endTime)
// 当前系统时间
var nowTime = new Date();
var residueTime = (endTime.getTime() - nowTime.getTime() / 1000);
// 4小时 14400
if (residueTime < 4 * 60 * 60) {
console.log('----------------------------')
wx.removeStorageSync('accessToken')
wx.removeStorageSync('refreshToken')
}
}
// #endif
},
onShow: function() {
uni.hideTabBar();
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
},
methods: {
// 验证登陆的全局方法
verifyLogin() {
if (!vuex.state.userInfo.token) {
uni.showModal({
title: '提示',
content: '您需要登陆后才能进行此操作',
confirmColor: '#F1AC66',
success(e) {
if (e.confirm) {
// uni.oprPresentLogin()
uni.navigateTo({
url: '/pages/blogPopup/blogPopup'
});
}
}
})
} else {
return true
}
},
/**
* 区/县adcode转换为6位市adcode（后两位补0）
* @param {string|number} districtAdcode - 6位区/县编码（字符串或数字类型）
* @returns {string|null} 6位市编码，无效编码返回null
*/
districtAdcodeTo6DigitCityAdcode(districtAdcode) {
// 1. 统一转换为字符串并去除空格
const adcodeStr = String(districtAdcode).trim();
// 2. 验证编码有效性（6位数字）
const adcodeReg = /^\d{6}$/;
if (!adcodeReg.test(adcodeStr)) {
console.warn('无效的区/县编码，必须是6位数字');
return null;
}
// 3. 截取前4位 + 拼接"00" → 6位市编码
const cityAdcode4Digit = adcodeStr.slice(0, 4);
const cityAdcode6Digit = cityAdcode4Digit + '00';
// 4. 可选验证：确保结果为6位数字
if (!/^\d{6}$/.test(cityAdcode6Digit)) {
console.warn('编码转换异常');
return null;
}
return cityAdcode6Digit;
},
// 更新全局定位
updateAddress(item) {
console.log('item', item)
let location = item.location.split(',');
this.globalData.latitude = location[1];
this.globalData.longitude = location[0];
this.globalData.address = item.name;
this.globalData.servers_region = `${item.pname}-${item.cityname}-${item.adname}`;
this.globalData.pcode = item.pcode;
this.globalData.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.adcode = item.adcode;
//存储用户定位
this.globalData.addressRes.latitude = location[1];
this.globalData.addressRes.longitude = location[0];
this.globalData.addressRes.address.province = item.pname;
this.globalData.addressRes.address.city = item.cityname;
this.globalData.addressRes.address.district = item.adname;
this.globalData.addressRes.address.street = item.address;
this.globalData.addressRes.address.poiName = item.name;
this.globalData.addressRes.address.streetNum = '';
this.globalData.addressRes.address.cityCode = '';
this.globalData.addressRes.address.pcode = item.pcode;
this.globalData.addressRes.address.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.addressRes.address.adcode = item.adcode;
this.globalData.addressRes.pcode = item.pcode;
this.globalData.addressRes.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.addressRes.adcode = item.adcode;
console.log('globalData', this.globalData)
uni.setStorageSync('userAdrees', this.globalData)
},
} }
},
onLaunch: async function () {
// #ifdef APP-PLUS
uni.hideTabBar();
if (uni.getStorageSync('accessToken')) {
registPush()
//跟新底部消息数量
this.messageUpudateNum()
}
// #endif
//缓存手机版本号
// await setVersion()
//获取访问路由
// 发起 GET 请求
let version = uni.getStorageSync('setVersion')
let baseUrl
await uni.request({
url: 'https://api.mrrwlkj.top/api/openPuc/getSjApiUrl', // 接口地址
method: 'GET', // 请求方法（默认 GET）
header: {
'Content-Type': 'application/json', // 请求头
'VersionCode': version.VersionCode,
'DeviceBrand': version.DeviceBrand,
'DeviceType': version.DeviceType
},
success: (res) => {
if (res.data.code == 200) {
// #ifndef MP-WEIXIN
uni.setStorageSync('baseUrl', res.data.data.url)
// #endif
// #ifdef MP-WEIXIN
wx.setStorageSync('baseUrl', res.data.data.url)
// #endif
this.$store.commit("setLocation", true)
}
console.log('请求成功', res.data);
},
fail: (err) => {
console.log('请求失败', err);
},
complete: () => {
console.log('请求完成（无论成功失败都会执行）');
}
});
// #ifdef APP-PLUS
//禁止手机横屏
plus.screen.lockOrientation("portrait-primary")
// #endif
// #ifdef APP-PLUS
//权限提示监听
let systemInfo = uni.getSystemInfoSync();
let platform = systemInfo.platform;
if (platform === 'android') {
// console.log('安卓用户')
permissionListener()
} else if (platform === 'ios') {
// console.log('苹果用户')
} else {
// console.log('平台未知')
}
//一键登录密钥设置
let sdkInfo = '';
//设置秘钥
if (platform == 'android') {
//开启SDK日志打印
aLiSDKModule.setLoggerEnable(true);
aLiSDKModule.expandAuthPageCheckedScope(true);
//禁用物理返回键
//aLiSDKModule.closeAuthPageReturnBack(true);
//开启区分界面返回及物理返回功能，自动控制后续返回事件
aLiSDKModule.userControlAuthPageCancel();
//是否跟随系统深色模式
aLiSDKModule.setAuthPageUseDayLight(false);
sdkInfo =
'cvJWYFO9s7xgJrzD+Ok2m2kCh3x0kdRkfJzGI0oxnyUXGlNAwAzvj87Yd6y030BWposVHUT84av2adBG9SdHl5CJpL0mGi+BRtachnyADJjfdpkJC0e0Uqb45pO7h7ZZvT+sNWQs1sa4JpL0U7hYKkgCP1iVXHoA1zKfzZynON6eKyvkzL1xpoPPag4O50slww4+6XuRVplCOSNCcsLRtot4CYnfsdcMvlV34MY5qB/rV+HNb1velpx4rg5atk3iTEiSLjla69c6pOT6vpjkK1qFVpNMxrEY';
} else if (platform == 'ios') {
sdkInfo =
'BONXQSabNMt1a8Cru1TjeW94aXen5rQHeAxzLGgpFzIUicDYeb9SD0l35MkKvjq7gQemE2HDp6B7adKZ8nrdUk4wgg1LIYSGDYVSc/Q1CwrJ9A3lMUeBfS1UUu3nBBg58bDvG1bl3j6tS4h6FjnYmP5+dDsyqb0YNmIhlSmia5Et7cfBMv2OT85N9WLJc/tOMQ9ZQCnuizKVlofkmDGFgjsBN/Bf2gLq6lTQyVqsgPJE5yEPd4riNg=='
}
aLiSDKModule.setAuthSDKInfo(sdkInfo)
// await uploadApp.uploadApp('onLaunch');
// #endif
console.log('App Launch')
this.globalData.deviceId = uni.getDeviceInfo().deviceId;
// this.globalData.deviceid = 'AC6F605124DFA87DCE40D5C062C94C3B';
// #ifndef MP-WEIXIN
if (uni.getStorageSync('refreshToken')) {
let endTime = uni.getStorageSync('refresh_token_expries');
endTime = new Date(endTime)
// 当前系统时间
var nowTime = new Date();
var residueTime = (endTime.getTime() - nowTime.getTime() / 1000);
// 4小时 14400
if (residueTime < 4 * 60 * 60) {
console.log('----------------------------')
uni.removeStorageSync('accessToken')
uni.removeStorageSync('refreshToken')
}
}
// #endif
// #ifdef MP-WEIXIN
if (wx.getStorageSync('refreshToken')) {
let endTime = wx.getStorageSync('refresh_token_expries');
endTime = new Date(endTime)
// 当前系统时间
var nowTime = new Date();
var residueTime = (endTime.getTime() - nowTime.getTime() / 1000);
// 4小时 14400
if (residueTime < 4 * 60 * 60) {
console.log('----------------------------')
wx.removeStorageSync('accessToken')
wx.removeStorageSync('refreshToken')
}
}
// #endif
},
onShow: function () {
uni.hideTabBar();
console.log('App Show')
},
onHide: function () {
console.log('App Hide')
},
methods: {
// 验证登陆的全局方法
verifyLogin() {
if (!vuex.state.userInfo.token) {
uni.showModal({
title: '提示',
content: '您需要登陆后才能进行此操作',
confirmColor: '#F1AC66',
success(e) {
if (e.confirm) {
// uni.oprPresentLogin()
uni.navigateTo({
url: '/pages/blogPopup/blogPopup'
});
}
}
})
} else {
return true
}
},
/**
* 区/县adcode转换为6位市adcode（后两位补0）
* @param {string|number} districtAdcode - 6位区/县编码（字符串或数字类型）
* @returns {string|null} 6位市编码，无效编码返回null
*/
districtAdcodeTo6DigitCityAdcode(districtAdcode) {
// 1. 统一转换为字符串并去除空格
const adcodeStr = String(districtAdcode).trim();
// 2. 验证编码有效性（6位数字）
const adcodeReg = /^\d{6}$/;
if (!adcodeReg.test(adcodeStr)) {
console.warn('无效的区/县编码，必须是6位数字');
return null;
}
// 3. 截取前4位 + 拼接"00" → 6位市编码
const cityAdcode4Digit = adcodeStr.slice(0, 4);
const cityAdcode6Digit = cityAdcode4Digit + '00';
// 4. 可选验证：确保结果为6位数字
if (!/^\d{6}$/.test(cityAdcode6Digit)) {
console.warn('编码转换异常');
return null;
}
return cityAdcode6Digit;
},
// 更新全局定位
updateAddress(item) {
console.log('item', item)
let location = item.location.split(',');
this.globalData.latitude = location[1];
this.globalData.longitude = location[0];
this.globalData.address = item.name;
this.globalData.servers_region = `${item.pname}-${item.cityname}-${item.adname}`;
this.globalData.pcode = item.pcode;
this.globalData.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.adcode = item.adcode;
//存储用户定位
this.globalData.addressRes.latitude = location[1];
this.globalData.addressRes.longitude = location[0];
this.globalData.addressRes.address.province = item.pname;
this.globalData.addressRes.address.city = item.cityname;
this.globalData.addressRes.address.district = item.adname;
this.globalData.addressRes.address.street = item.address;
this.globalData.addressRes.address.poiName = item.name;
this.globalData.addressRes.address.streetNum = '';
this.globalData.addressRes.address.cityCode = '';
this.globalData.addressRes.address.pcode = item.pcode;
this.globalData.addressRes.address.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.addressRes.address.adcode = item.adcode;
this.globalData.addressRes.pcode = item.pcode;
this.globalData.addressRes.cCode = this.districtAdcodeTo6DigitCityAdcode(item.adcode);
this.globalData.addressRes.adcode = item.adcode;
console.log('globalData', this.globalData)
uni.setStorageSync('userAdrees', this.globalData)
},
} }
}
</script> </script>
<style> <style>
/*每个页面公共css */ /*每个页面公共css */
@import '@/static/css/common.css'; @import '@/static/css/common.css';
/* App.vue全局style */
page,
html,
body {
-webkit-text-size-adjust: 100% !important;
text-size-adjust: 100% !important;
}
</style> </style>

19
pages/home/components/brand-card.vue
View File

@ -15,8 +15,9 @@
<view class="tags-container"> <view class="tags-container">
<view class="tag-item" v-for="(tag, idx) in displayTags" :key="idx" :style="getTagStyle(tag)"> <view class="tag-item" v-for="(tag, idx) in displayTags" :key="idx" :style="getTagStyle(tag)">
<image class="tag-icon" v-if="tag.icon" :src="tag.icon"></image> <!-- <image class="tag-icon" v-if="tag.icon" :src="tag.icon"></image> -->
<text class="tag-text">{{ tag.text }}</text> <text class="tag-text">{{ tag.text }} </text>
<text class="tag-text1">›</text>
</view> </view>
</view> </view>
</view> </view>
@ -109,7 +110,7 @@ export default {
} }
} else if (len === 2) { } else if (len === 2) {
sizeStyle = { sizeStyle = {
width: '134rpx', width: '142rpx',
height: '42rpx', height: '42rpx',
padding: '0 12rpx', padding: '0 12rpx',
boxSizing: 'border-box' boxSizing: 'border-box'
@ -219,10 +220,20 @@ export default {
} }
.tag-text { .tag-text {
font-size: 22rpx; font-size: 24rpx;
line-height: 28rpx; line-height: 28rpx;
white-space: nowrap; white-space: nowrap;
margin-top: 4rpx; margin-top: 4rpx;
padding-right: 2rpx; padding-right: 2rpx;
} }
.tag-text1 {
font-size: 40rpx;
line-height: 28rpx;
white-space: nowrap;
margin-top: 4rpx;
padding-right: 2rpx;
margin-bottom: 6rpx;
font-weight: 200;
}
</style> </style>

1
pages/home/components/skill-card.vue
View File

@ -144,6 +144,7 @@ export default {
margin-top: 10rpx; margin-top: 10rpx;
.type-icon { .type-icon {
border: 1rpx solid #D6CAC0;
width: 26rpx; width: 26rpx;
height: 26rpx; height: 26rpx;
margin-right: 8rpx; margin-right: 8rpx;

12
pages/home/home.vue
View File

@ -452,7 +452,7 @@ export default {
} }
// 小于一万，原样返回，单位为元 // 小于一万，原样返回，单位为元
return { return {
val: num, val: parseFloat(num.toFixed(2)),
unit: '元' unit: '元'
}; };
}, },
@ -1432,19 +1432,21 @@ page {
.notice-text { .notice-text {
font-weight: 400; font-weight: 400;
font-size: 24rpx; font-size: 26rpx;
color: #30353C; color: #30353C;
} }
} }
.notice-btn { .notice-btn {
font-weight: 400; // font-weight: 400;
font-size: 18rpx; font-size: 20rpx;
color: #8D4C1B; color: #8D4C1B;
padding: 2rpx 15rpx; padding: 6rpx 18rpx;
border-radius: 30rpx; border-radius: 30rpx;
border: 1rpx solid #8d4c1b50; border: 1rpx solid #8d4c1b50;
margin-left: 10rpx; margin-left: 10rpx;
margin-bottom: 4rpx;
margin-top: 4rpx;
} }
} }

211
pages/jingxuan/selected-skills.vue
View File

@ -1,20 +1,12 @@
<template> <template>
<view class="skill-market-page"> <view class="skill-market-page">
<custom-navbar
title="技能集市"
:showBack="true"
backgroundColor="#FFFFFF"
:show-headle="true"
borderBottom="none"
headleSrc="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/51ebca5d-95c5-4fb8-8aa3-560a79100d25.png"
@onHeadleClick="goToSearch">
</custom-navbar>
<view class="nav-placeholder" :style="{ height: navHeight + 'px' }"></view>
<custom-navbar title="技能集市" :showBack="true" backgroundColor="#FFFFFF" :show-headle="true" borderBottom="none"
headleSrc="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/51ebca5d-95c5-4fb8-8aa3-560a79100d25.png"
@onHeadleClick="goToSearch" class="nav-img-size">
</custom-navbar>
<view class="sticky-header-container" :style="{ top: navHeight + 'px' }"> <view class="sticky-header-container" :style="{ top: navHeight + 'px' }">
<view class="official-author-block" v-if="authorInfo.show"> <view class="official-author-block" v-if="authorInfo.show">
<view class="author-left"> <view class="author-left">
<image class="author-avatar" :src="authorInfo.avatar" mode="aspectFill"></image> <image class="author-avatar" :src="authorInfo.avatar" mode="aspectFill"></image>
@ -23,7 +15,7 @@
<text class="author-desc">发布了{{ authorInfo.videoCount }}条技能</text> <text class="author-desc">发布了{{ authorInfo.videoCount }}条技能</text>
</view> </view>
</view> </view>
<view class="view-more-btn" v-if="!authorInfo.isOfficial" @click="goToBrandDetail"> <view class="view-more-btn" v-if="!authorInfo.isOfficial" @click="goToBrandDetail">
<text>查看更多</text> <text>查看更多</text>
<view class="arrow-right"></view> <view class="arrow-right"></view>
@ -40,7 +32,7 @@
<image class="arrow-icon" :src="orderType === 2 ? iconPinkDown : iconGreyDown"></image> <image class="arrow-icon" :src="orderType === 2 ? iconPinkDown : iconGreyDown"></image>
</view> </view>
</view> </view>
<view class="sort-item" @tap="toggleSort('view')"> <view class="sort-item" @tap="toggleSort('view')">
<text class="sort-text" :class="{ active: orderType === 3 || orderType === 4 }">浏览量</text> <text class="sort-text" :class="{ active: orderType === 3 || orderType === 4 }">浏览量</text>
<view class="arrows"> <view class="arrows">
@ -67,30 +59,27 @@
</view> </view>
</view> </view>
</view> </view>
</view>
</view> <view class="list-container">
<view v-if="skillList.length > 0">
<skill-card
v-for="(item, index) in skillList"
:key="item.id || index"
:item="item"
@click="goToDetail(item)"
></skill-card>
</view> </view>
</view>
<view class="list-container">
<view v-if="skillList.length > 0">
<skill-card v-for="(item, index) in skillList" :key="item.id || index" :item="item"
@click="goToDetail(item)"></skill-card>
</view>
<view v-else> <view v-else>
<noData></noData> <noData></noData>
</view> </view>
</view> </view>
<view style="height: 60rpx;"></view> <view style="height: 60rpx;"></view>
</view> </view>
</template> </template>
<script> <script>
import request from "@/utils/request" import request from "@/utils/request"
import SkillCard from "@/pages/home/components/skill-card.vue" import SkillCard from "@/pages/home/components/skill-card.vue"
import noData from "@/components/noData/noData.vue"; import noData from "@/components/noData/noData.vue";
const USE_REAL_API = true const USE_REAL_API = true
@ -100,10 +89,10 @@ export default {
data() { data() {
return { return {
navHeight: 0, navHeight: 0,
orderType: 0, orderType: 0,
linkType: '', linkType: '',
// 【新增】：统一管理作者/官方/品牌信息 // 【新增】：统一管理作者/官方/品牌信息
authorInfo: { authorInfo: {
show: false, // 控制是否显示作者头部 show: false, // 控制是否显示作者头部
@ -113,25 +102,27 @@ export default {
avatar: '', // 头像 avatar: '', // 头像
videoCount: 0 // 视频数量 videoCount: 0 // 视频数量
}, },
filterVisible: false, filterVisible: false,
skillList: [], skillList: [],
page: 1, page: 1,
limit: 10, limit: 10,
isFinished: false, isFinished: false,
iconGreyUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png', iconGreyUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png',
iconGreyDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/dfffb601-6877-4608-a3eb-88695b05c6c2.png', iconGreyDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/dfffb601-6877-4608-a3eb-88695b05c6c2.png',
iconPinkUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/5bc84dff-e120-4d4b-a33e-25d68e065654.png', iconPinkUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/5bc84dff-e120-4d4b-a33e-25d68e065654.png',
iconPinkDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/ff2c2c9d-694a-4adf-b737-66b07f4a63ae.png', iconPinkDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/ff2c2c9d-694a-4adf-b737-66b07f4a63ae.png',
mockDatabase: [] mockDatabase: []
} }
}, },
computed: { computed: {
filterIcon() { filterIcon() {
return 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png' return this.filterVisible
? 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png'
: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/bfe7a104-bef8-4432-9487-42f05e3e9035.png'
} }
}, },
// 接收页面跳转传过来的作者参数 // 接收页面跳转传过来的作者参数
@ -139,23 +130,23 @@ export default {
if (options && options.showAuthor === '1') { if (options && options.showAuthor === '1') {
this.authorInfo.show = true; this.authorInfo.show = true;
this.authorInfo.isOfficial = options.isOfficial === '1'; this.authorInfo.isOfficial = options.isOfficial === '1';
this.authorInfo.brandId = options.linkId || null; this.authorInfo.brandId = options.linkId || null;
// 用 decodeURIComponent 把转义的字符解析回正常的中文和链接 // 用 decodeURIComponent 把转义的字符解析回正常的中文和链接
this.authorInfo.name = options.authorName ? decodeURIComponent(options.authorName) : '未知作者'; this.authorInfo.name = options.authorName ? decodeURIComponent(options.authorName) : '未知作者';
this.authorInfo.avatar = options.authorAvatar ? decodeURIComponent(options.authorAvatar) : 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/bbe832bf-aae6-4579-b3cc-246d252488c3'; this.authorInfo.avatar = options.authorAvatar ? decodeURIComponent(options.authorAvatar) : 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/bbe832bf-aae6-4579-b3cc-246d252488c3';
this.authorInfo.videoCount = options.videoCount || 0; this.authorInfo.videoCount = options.videoCount || 0;
// 强制设置筛选类型 // 强制设置筛选类型
this.linkType = this.authorInfo.isOfficial ? 1 : 2; this.linkType = this.authorInfo.isOfficial ? 1 : 2;
} else if (options && options.linkType !== undefined) { } else if (options && options.linkType !== undefined) {
this.linkType = Number(options.linkType); this.linkType = Number(options.linkType);
} }
const sysInfo = uni.getSystemInfoSync() const sysInfo = uni.getSystemInfoSync()
const sbh = sysInfo.statusBarHeight || 0 const sbh = sysInfo.statusBarHeight || 0
this.navHeight = sbh this.navHeight = sbh
this.initMockData() this.initMockData()
this.fetchData(true) this.fetchData(true)
}, },
@ -181,7 +172,7 @@ export default {
uni.showToast({ title: '缺少品牌信息', icon: 'none' }); uni.showToast({ title: '缺少品牌信息', icon: 'none' });
} }
}, },
toggleSort(type) { toggleSort(type) {
if (type === 'time') { if (type === 'time') {
if (this.orderType === 1) this.orderType = 2 if (this.orderType === 1) this.orderType = 2
@ -192,29 +183,29 @@ export default {
} }
this.fetchData(true) this.fetchData(true)
}, },
toggleFilterPanel() { toggleFilterPanel() {
this.filterVisible = !this.filterVisible this.filterVisible = !this.filterVisible
}, },
closeFilterPanel() { closeFilterPanel() {
this.filterVisible = false this.filterVisible = false
}, },
selectAndApply(typeVal) { selectAndApply(typeVal) {
this.linkType = typeVal; this.linkType = typeVal;
// 当通过本地筛选器切换时，关闭“专属展示区”，确保纯净筛选 // 当通过本地筛选器切换时，关闭“专属展示区”，确保纯净筛选
this.authorInfo.show = false; this.authorInfo.show = false;
this.closeFilterPanel(); this.closeFilterPanel();
this.fetchData(true); this.fetchData(true);
}, },
async fetchData(isReset = false) { async fetchData(isReset = false) {
if (isReset) { if (isReset) {
this.page = 1 this.page = 1
this.isFinished = false this.isFinished = false
this.skillList = [] this.skillList = []
} }
if (USE_REAL_API) { if (USE_REAL_API) {
uni.showLoading({ title: '加载中...' }) uni.showLoading({ title: '加载中...' })
try { try {
@ -224,12 +215,12 @@ export default {
} }
if (this.orderType !== 0) params.order_type = this.orderType; if (this.orderType !== 0) params.order_type = this.orderType;
if (this.linkType !== '') params.link_type = this.linkType; if (this.linkType !== '') params.link_type = this.linkType;
// 【核心接口预留】：如果当前在看某个品牌的专属页，需要传link_id给后端过滤 // 【核心接口预留】：如果当前在看某个品牌的专属页，需要传link_id给后端过滤
if (this.authorInfo.show && !this.authorInfo.isOfficial && this.authorInfo.brandId) { if (this.authorInfo.show && !this.authorInfo.isOfficial && this.authorInfo.brandId) {
params.link_id = this.authorInfo.brandId; params.link_id = this.authorInfo.brandId;
} }
const res = await request.post('/sj/skill/list', params) const res = await request.post('/sj/skill/list', params)
if ((res.code === 200 || res.state === 1) && res.data && res.data.list) { if ((res.code === 200 || res.state === 1) && res.data && res.data.list) {
const list = res.data.list.map(item => this.formatApiData(item)) const list = res.data.list.map(item => this.formatApiData(item))
@ -248,30 +239,30 @@ export default {
uni.showLoading({ title: '模拟加载中...' }) uni.showLoading({ title: '模拟加载中...' })
setTimeout(() => { setTimeout(() => {
let list = [...this.mockDatabase] let list = [...this.mockDatabase]
if (this.linkType !== '') { if (this.linkType !== '') {
list = list.filter(item => item.link_type === this.linkType) list = list.filter(item => item.link_type === this.linkType)
} }
// 模拟品牌过滤 // 模拟品牌过滤
if (this.authorInfo.show && !this.authorInfo.isOfficial && this.authorInfo.brandId) { if (this.authorInfo.show && !this.authorInfo.isOfficial && this.authorInfo.brandId) {
list = list.filter(item => item.brand_id == this.authorInfo.brandId) list = list.filter(item => item.brand_id == this.authorInfo.brandId)
} }
if (this.orderType !== 0) { if (this.orderType !== 0) {
list.sort((a, b) => { list.sort((a, b) => {
if (this.orderType === 1) return b.timestamp - a.timestamp if (this.orderType === 1) return b.timestamp - a.timestamp
if (this.orderType === 2) return a.timestamp - b.timestamp if (this.orderType === 2) return a.timestamp - b.timestamp
if (this.orderType === 3) return b.views - a.views if (this.orderType === 3) return b.views - a.views
if (this.orderType === 4) return a.views - b.views if (this.orderType === 4) return a.views - b.views
return 0 return 0
}) })
} }
const start = (this.page - 1) * this.limit const start = (this.page - 1) * this.limit
const end = start + this.limit const end = start + this.limit
const pageData = list.slice(start, end) const pageData = list.slice(start, end)
if (pageData.length < this.limit) this.isFinished = true if (pageData.length < this.limit) this.isFinished = true
this.skillList = isReset ? pageData : this.skillList.concat(pageData) this.skillList = isReset ? pageData : this.skillList.concat(pageData)
this.page++ this.page++
@ -279,7 +270,7 @@ export default {
}, 500) }, 500)
} }
}, },
formatApiData(item) { formatApiData(item) {
return { return {
id: item.id, id: item.id,
@ -288,7 +279,7 @@ export default {
type: item.link_name || (item.link_type === 1 ? '平台课程' : '品牌课程'), type: item.link_name || (item.link_type === 1 ? '平台课程' : '品牌课程'),
link_type: item.link_type, link_type: item.link_type,
views: item.browse_num || 0, views: item.browse_num || 0,
time: item.create_time ? this.formatTimeAgo(item.create_time) : '', time: item.create_time ? this.formatTimeAgo(item.create_time) : '',
typeIcon: item.link_logo || '' typeIcon: item.link_logo || ''
} }
}, },
@ -313,11 +304,11 @@ export default {
initMockData() { initMockData() {
this.mockDatabase = [ this.mockDatabase = [
{ id: 1, title: '穿戴甲的操作视频扫码验券操作教程', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 836000, time: '7小时前', timestamp: Date.now() - 7*3600000 }, { id: 1, title: '穿戴甲的操作视频扫码验券操作教程', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 836000, time: '7小时前', timestamp: Date.now() - 7 * 3600000 },
{ id: 2, title: '脸部按摩操作步骤详情', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '品牌课程', link_type: 2, brand_id: 101, views: 8334, time: '1天前', timestamp: Date.now() - 24*3600000 }, { id: 2, title: '脸部按摩操作步骤详情', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '品牌课程', link_type: 2, brand_id: 101, views: 8334, time: '1天前', timestamp: Date.now() - 24 * 3600000 },
{ id: 3, title: '全身SPA的操作视频操作教程', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 2344, time: '3天前', timestamp: Date.now() - 3*24*3600000 }, { id: 3, title: '全身SPA的操作视频操作教程', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 2344, time: '3天前', timestamp: Date.now() - 3 * 24 * 3600000 },
{ id: 4, title: '高级面部护理手法详解最新版', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 836, time: '4月26日', timestamp: Date.now() - 30*24*3600000 }, { id: 4, title: '高级面部护理手法详解最新版', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '平台课程', link_type: 1, views: 836, time: '4月26日', timestamp: Date.now() - 30 * 24 * 3600000 },
{ id: 5, title: '光疗美甲进阶全方位解析', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '品牌课程', link_type: 2, brand_id: 101, views: 12000, time: '2小时前', timestamp: Date.now() - 2*3600000 } { id: 5, title: '光疗美甲进阶全方位解析', coverSrc: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e2220528-fdf6-4cad-a25d-ec6cbee1501e.jpg', type: '品牌课程', link_type: 2, brand_id: 101, views: 12000, time: '2小时前', timestamp: Date.now() - 2 * 3600000 }
] ]
} }
} }
@ -351,7 +342,7 @@ export default {
.author-left { .author-left {
display: flex; display: flex;
align-items: center; align-items: center;
.author-avatar { .author-avatar {
width: 70rpx; width: 70rpx;
height: 70rpx; height: 70rpx;
@ -384,16 +375,16 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 24rpx; font-size: 24rpx;
color: #FF4767 ; color: #FF4767;
border: 2rpx solid #FF4767 ; border: 2rpx solid #FF4767;
padding: 8rpx 20rpx; padding: 8rpx 20rpx;
border-radius: 45rpx; border-radius: 45rpx;
.arrow-right { .arrow-right {
width: 10rpx; width: 10rpx;
height: 10rpx; height: 10rpx;
border-top: 2rpx solid #FF4767 ; border-top: 2rpx solid #FF4767;
border-right: 2rpx solid #FF4767 ; border-right: 2rpx solid #FF4767;
transform: rotate(45deg); transform: rotate(45deg);
margin-left: 6rpx; margin-left: 6rpx;
} }
@ -403,7 +394,7 @@ export default {
.sort-bar-wrap { .sort-bar-wrap {
/* 移除单独的 sticky，由外层 container 统一控制 */ /* 移除单独的 sticky，由外层 container 统一控制 */
background: #fff; background: #fff;
position: relative; position: relative;
} }
.sort-bar { .sort-bar {
@ -411,34 +402,34 @@ export default {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 24rpx 30rpx; padding: 24rpx 30rpx;
.left-sorts { .left-sorts {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 100rpx; gap: 100rpx;
.sort-item { .sort-item {
display: flex; display: flex;
align-items: center; align-items: center;
.sort-text { .sort-text {
font-size: 28rpx; font-size: 28rpx;
color: #333333; color: #333333;
margin-right: 6rpx; margin-right: 6rpx;
font-weight: 400; font-weight: 400;
&.active { &.active {
color: #FF4767; color: #FF4767;
font-weight: 500; font-weight: 500;
} }
} }
.arrows { .arrows {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.arrow-icon { .arrow-icon {
width: 14rpx; width: 14rpx;
height: 8rpx; height: 8rpx;
@ -451,19 +442,22 @@ export default {
.right-filter { .right-filter {
display: flex; display: flex;
align-items: center; align-items: center;
.filter-text { .filter-text {
font-size: 26rpx; font-size: 26rpx;
color: #666666; color: #666666;
margin-right: 8rpx; margin-right: 8rpx;
} }
.filter-icon { .filter-icon {
width: 18rpx; width: 24rpx;
height: 12rpx; height: 24rpx;
transition: transform 0.3s ease; transition: transform 0.3s ease;
&.rotate { &.rotate {
transform: rotate(180deg); transform: rotate(180deg);
width: 18rpx;
height: 12rpx;
} }
} }
} }
@ -475,8 +469,9 @@ export default {
.filter-panel { .filter-panel {
position: absolute; position: absolute;
top: 100%; top: 100%;
left: 0; right: 0; left: 0;
right: 0;
height: 100vh; height: 100vh;
z-index: 100; z-index: 100;
pointer-events: none; pointer-events: none;
@ -484,21 +479,32 @@ export default {
&.show { &.show {
pointer-events: auto; pointer-events: auto;
.filter-mask { opacity: 1; }
.filter-container { transform: translateY(0); } .filter-mask {
opacity: 1;
}
.filter-container {
transform: translateY(0);
}
} }
.filter-mask { .filter-mask {
position: absolute; position: absolute;
top: 0; left: 0; right: 0; bottom: 0; top: 0;
background: rgba(0,0,0,0.4); left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.4);
opacity: 0; opacity: 0;
transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out;
} }
.filter-container { .filter-container {
position: absolute; position: absolute;
top: 0; left: 0; right: 0; top: 0;
left: 0;
right: 0;
background: #fff; background: #fff;
border-radius: 0 0 24rpx 24rpx; border-radius: 0 0 24rpx 24rpx;
padding: 30rpx 30rpx 40rpx; padding: 30rpx 30rpx 40rpx;
@ -520,7 +526,7 @@ export default {
.course-filter { .course-filter {
display: flex; display: flex;
gap: 20rpx; gap: 20rpx;
.course-type-item { .course-type-item {
background: #F5F5F5; background: #F5F5F5;
color: #333333; color: #333333;
@ -529,11 +535,11 @@ export default {
border-radius: 12rpx; border-radius: 12rpx;
border: 1rpx solid transparent; border: 1rpx solid transparent;
transition: all 0.2s; transition: all 0.2s;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
&.active { &.active {
background: #FFF0F2; background: #FFF0F2;
color: #FF4767; color: #FF4767;
@ -547,18 +553,25 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 120rpx 0; padding: 120rpx 0;
.empty-icon { .empty-icon {
width: 346rpx; width: 346rpx;
height: 373rpx; height: 373rpx;
} }
} }
::v-deep .icon-headle { ::v-deep .icon-headle {
width: 32rpx !important; width: 32rpx !important;
height: 32rpx !important; height: 32rpx !important;
} }
::v-deep .back-icon { ::v-deep .back-icon {
width: 28rpx !important; width: 28rpx !important;
height: 36rpx !important; height: 36rpx !important;
}
.nav-img-size::v-deep .icon-headle {
width: 36rpx !important;
height: 36rpx !important;
} }
</style> </style>

36
pages/my/my.vue
View File

@ -86,7 +86,7 @@
<view class="order-card"> <view class="order-card">
<template v-for="card in currentCardList"> <template v-for="card in currentCardList">
<view class="function-list" v-if="card.type == 'line'"> <view class="function-list" v-if="card.type == 'line'" :key="card.title">
<view class="function-title">{{ card.title }}</view> <view class="function-title">{{ card.title }}</view>
<view class="function-grid"> <view class="function-grid">
<view class="grid-item" v-for="(item, index) in card.list" :key="index" <view class="grid-item" v-for="(item, index) in card.list" :key="index"
@ -98,22 +98,22 @@
</view> </view>
</view> </view>
</view> </view>
<view class="function-list" style="padding: 24rpx; padding-bottom: 28rpx" <view class="function-list" style="padding: 24rpx; padding-bottom: 28rpx" v-if="card.type == 'lineCard'"
v-if="card.type == 'lineCard'"> :key="card.title">
<view class="lineCard-title">{{ card.title }}</view> <view class="lineCard-title">{{ card.title }}</view>
<view class="lineCard-grid"> <view class="lineCard-grid">
<image v-for="(item, index) in card.list" :src="item.url" mode="widthFix" <image v-for="(item, index) in card.list" :src="item.url" mode="widthFix"
@click="handleFunction(item)"></image> @click="handleFunction(item)" :key="index"></image>
</view> </view>
</view> </view>
<view class="imagePure" v-if="card.type == 'imagePure'"> <view class="imagePure" v-if="card.type == 'imagePure'" :key="card.title">
<image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image> <image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image>
</view> </view>
<view class="image-list" v-if="card.type == 'image'"> <view class="image-list" v-if="card.type == 'image'" :key="card.title">
<view class="image-title">{{ card.title }}</view> <view class="image-title">{{ card.title }}</view>
<image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image> <image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image>
</view> </view>
<view class="listcard-list" v-if="card.type == 'listcard'"> <view class="listcard-list" v-if="card.type == 'listcard'" :key="card.title">
<view class="function-title">{{ card.title }}</view> <view class="function-title">{{ card.title }}</view>
<view class="listcard-item" v-for="(item, index) in card.list" :key="index"> <view class="listcard-item" v-for="(item, index) in card.list" :key="index">
<image @click="handleFunction(item)" :src="item.url" mode="widthFix"></image> <image @click="handleFunction(item)" :src="item.url" mode="widthFix"></image>
@ -121,7 +121,7 @@
<view class="listcard-text">{{ item.text }}</view> <view class="listcard-text">{{ item.text }}</view>
</view> </view>
</view> </view>
<view class="imageText-list" v-if="card.type == 'imageText'"> <view class="imageText-list" v-if="card.type == 'imageText'" :key="card.title">
<view class="lineCard-title">{{ card.title }}</view> <view class="lineCard-title">{{ card.title }}</view>
<view class="imageText-content"> <view class="imageText-content">
<image :src="card.url" mode="widthFix"></image> <image :src="card.url" mode="widthFix"></image>
@ -160,6 +160,8 @@
<view class="item-right orange" @tap="goToBusinessTime">去配置</view> <view class="item-right orange" @tap="goToBusinessTime">去配置</view>
</view> </view>
<view class="divider-line"></view>
<view class="missing-item" v-if="!hasServiceSkill"> <view class="missing-item" v-if="!hasServiceSkill">
<view class="item-left"> <view class="item-left">
<image class="item-icon" <image class="item-icon"
@ -173,6 +175,8 @@
<view class="item-right orange" @tap="goToServiceSkill">去配置</view> <view class="item-right orange" @tap="goToServiceSkill">去配置</view>
</view> </view>
<view class="divider-line"></view>
<view class="missing-item" v-if="!isCertified"> <view class="missing-item" v-if="!isCertified">
<view class="item-left"> <view class="item-left">
<image class="item-icon" <image class="item-icon"
@ -1682,6 +1686,13 @@ button::after {
align-items: center; align-items: center;
gap: 12rpx; gap: 12rpx;
margin-top: 10rpx; margin-top: 10rpx;
width: auto;
height: 36rpx;
padding: 0 8rpx 0 8rpx;
background-image: url('https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/378a6936-a543-4ff5-9aa0-cfcb4d4e14b3.png');
background-size: 100% 100%;
background-repeat: no-repeat;
margin-left: -6rpx;
.user_detail_tip_phone { .user_detail_tip_phone {
// width: 100rpx; // width: 100rpx;
@ -1743,7 +1754,7 @@ button::after {
.modal-header { .modal-header {
position: relative; position: relative;
z-index: 1; z-index: 1;
height: 150rpx; height: 100rpx;
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
justify-content: center; justify-content: center;
@ -1832,6 +1843,13 @@ button::after {
} }
} }
} }
.divider-line {
width: 100%;
height: 1rpx;
background-color: #f2f2f2;
margin: -26rpx 0;
}
} }
} }

53
pages/notice/notice_list.vue
View File

@ -1,14 +1,9 @@
<template> <template>
<view class="notice-page"> <view class="notice-page">
<!-- 自定义顶部导航组件 --> <!-- 自定义顶部导航组件 -->
<custom-navbar <custom-navbar title="公告通知" :showBack="true" backgroundColor="#FFFFFF" :show-headle="true"
title="公告通知" headleSrc="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/51ebca5d-95c5-4fb8-8aa3-560a79100d25.png"
:showBack="true" @onHeadleClick="goToSearch" class="nav-img-size" />
backgroundColor="#FFFFFF"
:show-headle="true"
headleSrc="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/51ebca5d-95c5-4fb8-8aa3-560a79100d25.png"
@onHeadleClick="goToSearch"
/>
<view class="page-content"> <view class="page-content">
<!-- 加载状态 --> <!-- 加载状态 -->
@ -19,13 +14,8 @@
<!-- 公告列表 --> <!-- 公告列表 -->
<view v-else-if="noticeList.length > 0" class="notice-list"> <view v-else-if="noticeList.length > 0" class="notice-list">
<NoticeCard <NoticeCard v-for="item in noticeList" :key="item.id" :item="item" @click="goToDetail" />
v-for="item in noticeList"
:key="item.id"
:item="item"
@click="goToDetail"
/>
<!-- 加载更多状态 --> <!-- 加载更多状态 -->
<view v-if="loadingMore" class="load-more"> <view v-if="loadingMore" class="load-more">
<text>加载更多...</text> <text>加载更多...</text>
@ -36,7 +26,9 @@
</view> </view>
<!-- 空状态 --> <!-- 空状态 -->
<view v-else class="empty-container"> <view v-else class="empty-container">
<image class="empty-img" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/8c5e7b2a-3d4f-4b1e-9a7c-6e8f2d1b4a5c.png" mode="aspectFit"></image> <image class="empty-img"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/8c5e7b2a-3d4f-4b1e-9a7c-6e8f2d1b4a5c.png"
mode="aspectFit"></image>
<text class="empty-text">暂无公告通知</text> <text class="empty-text">暂无公告通知</text>
</view> </view>
</view> </view>
@ -82,7 +74,7 @@ export default {
url: '/pages/search_common/search?type=notice' url: '/pages/search_common/search?type=notice'
}); });
}, },
// 获取公告列表 // 获取公告列表
fetchNoticeList(reset = true) { fetchNoticeList(reset = true) {
if (reset) { if (reset) {
@ -104,13 +96,13 @@ export default {
const list = res.data.list || []; const list = res.data.list || [];
const total = res.data.total || 0; const total = res.data.total || 0;
this.total = total; this.total = total;
if (reset) { if (reset) {
this.noticeList = list; this.noticeList = list;
} else { } else {
this.noticeList = [...this.noticeList, ...list]; this.noticeList = [...this.noticeList, ...list];
} }
// 判断是否还有更多数据 // 判断是否还有更多数据
this.hasMore = this.noticeList.length < total; this.hasMore = this.noticeList.length < total;
} else { } else {
@ -134,7 +126,7 @@ export default {
} }
}); });
}, },
// 跳转到详情页（接收 NoticeCard 组件 $emit 传递的 item） // 跳转到详情页（接收 NoticeCard 组件 $emit 传递的 item）
goToDetail(item) { goToDetail(item) {
if (item.id) { if (item.id) {
@ -163,7 +155,7 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 120rpx 0; padding: 120rpx 0;
.loading-icon { .loading-icon {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
@ -173,7 +165,7 @@ export default {
animation: spin 0.8s linear infinite; animation: spin 0.8s linear infinite;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.loading-text { .loading-text {
font-size: 26rpx; font-size: 26rpx;
color: #999; color: #999;
@ -181,9 +173,13 @@ export default {
} }
@keyframes spin { @keyframes spin {
to { transform: rotate(360deg); } to {
transform: rotate(360deg);
}
} }
.load-more, .no-more {
.load-more,
.no-more {
text-align: center; text-align: center;
padding: 30rpx 0; padding: 30rpx 0;
font-size: 24rpx; font-size: 24rpx;
@ -196,17 +192,22 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 150rpx 0; padding: 150rpx 0;
.empty-img { .empty-img {
width: 200rpx; width: 200rpx;
height: 200rpx; height: 200rpx;
margin-bottom: 30rpx; margin-bottom: 30rpx;
opacity: 0.6; opacity: 0.6;
} }
.empty-text { .empty-text {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
} }
} }
.nav-img-size::v-deep .icon-headle {
width: 36rpx !important;
height: 36rpx !important;
}
</style> </style>

138
pages/search_common/search.vue
View File

@ -3,17 +3,10 @@
<view class="search-header" :style="{ paddingTop: statusBarHeight + 'px' }"> <view class="search-header" :style="{ paddingTop: statusBarHeight + 'px' }">
<view class="header-content"> <view class="header-content">
<image class="back-icon" src="/static/images/back.png" @tap="goBack"></image> <image class="back-icon" src="/static/images/back.png" @tap="goBack"></image>
<view class="search-box"> <view class="search-box">
<input <input class="search-input" v-model="keyword" :placeholder="placeholderText"
class="search-input" placeholder-class="search-placeholder" focus confirm-type="search" @confirm="handleSearch" />
v-model="keyword"
:placeholder="placeholderText"
placeholder-class="search-placeholder"
focus
confirm-type="search"
@confirm="handleSearch"
/>
<text class="search-btn" @tap="handleSearch">搜索</text> <text class="search-btn" @tap="handleSearch">搜索</text>
</view> </view>
</view> </view>
@ -22,8 +15,9 @@
<view class="nav-placeholder" :style="{ height: navHeight + 'px' }"></view> <view class="nav-placeholder" :style="{ height: navHeight + 'px' }"></view>
<view class="result-container"> <view class="result-container">
<view class="sort-bar" v-if="hasSearched && ['brand', 'skill', 'collection_brand', 'collection_course'].includes(searchType)"> <view class="sort-bar"
v-if="hasSearched && ['brand', 'skill', 'collection_brand', 'collection_course'].includes(searchType)">
<view class="sort-item" @tap="toggleSort('time')"> <view class="sort-item" @tap="toggleSort('time')">
<text class="sort-text" :class="{ active: orderType === 1 || orderType === 2 }">发布时间</text> <text class="sort-text" :class="{ active: orderType === 1 || orderType === 2 }">发布时间</text>
<view class="arrows"> <view class="arrows">
@ -31,7 +25,7 @@
<image class="arrow-icon" :src="orderType === 2 ? iconPinkDown : iconGreyDown"></image> <image class="arrow-icon" :src="orderType === 2 ? iconPinkDown : iconGreyDown"></image>
</view> </view>
</view> </view>
<view class="sort-item" @tap="toggleSort('view')"> <view class="sort-item" @tap="toggleSort('view')">
<text class="sort-text" :class="{ active: orderType === 3 || orderType === 4 }">浏览量</text> <text class="sort-text" :class="{ active: orderType === 3 || orderType === 4 }">浏览量</text>
<view class="arrows"> <view class="arrows">
@ -42,38 +36,26 @@
</view> </view>
<view v-if="loading && page === 1" class="loading-tips">加载中...</view> <view v-if="loading && page === 1" class="loading-tips">加载中...</view>
<view v-else-if="searchType === 'notice' && resultList.length > 0"> <view v-else-if="searchType === 'notice' && resultList.length > 0">
<notice-card <notice-card v-for="item in resultList" :key="item.id" :item="item" @click="goToDetail(item)" />
v-for="item in resultList"
:key="item.id"
:item="item"
@click="goToDetail(item)"
/>
</view> </view>
<view v-else-if="(searchType === 'brand' || searchType === 'collection_brand') && resultList.length > 0" class="brand-grid"> <view v-else-if="(searchType === 'brand' || searchType === 'collection_brand') && resultList.length > 0"
<brand-card class="brand-grid">
class="brand-card-wrap" <brand-card class="brand-card-wrap" v-for="item in resultList" :key="item.id" :item="item"
v-for="item in resultList" :tagKeys="item.tagKeys || []" @click="goToDetail(item)" />
:key="item.id"
:item="item"
:tagKeys="item.tagKeys || []"
@click="goToDetail(item)"
/>
</view> </view>
<view v-else-if="(searchType === 'skill' || searchType === 'collection_course') && resultList.length > 0" class="course-list"> <view v-else-if="(searchType === 'skill' || searchType === 'collection_course') && resultList.length > 0"
<skill-card class="course-list">
v-for="item in resultList" <skill-card v-for="item in resultList" :key="item.id" :item="item" @click="goToDetail(item)" />
:key="item.id"
:item="item"
@click="goToDetail(item)"
/>
</view> </view>
<view v-else-if="!loading && hasSearched && resultList.length === 0" class="empty-state"> <view v-else-if="!loading && hasSearched && resultList.length === 0" class="empty-state">
<image class="empty-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/4e4320d1-cc5c-4312-890c-f1eb8381fdd2.png"></image> <image class="empty-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/4e4320d1-cc5c-4312-890c-f1eb8381fdd2.png">
</image>
<text>未搜索到相关内容哦~</text> <text>未搜索到相关内容哦~</text>
</view> </view>
@ -81,7 +63,7 @@
<text v-if="loading && page > 1">正在加载更多...</text> <text v-if="loading && page > 1">正在加载更多...</text>
<text v-else-if="!hasMore">没有更多了</text> <text v-else-if="!hasMore">没有更多了</text>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
@ -102,21 +84,21 @@ export default {
return { return {
statusBarHeight: 0, statusBarHeight: 0,
navHeight: 0, navHeight: 0,
searchType: '', searchType: '',
keyword: '', keyword: '',
resultList: [], resultList: [],
loading: false, loading: false,
hasSearched: false, hasSearched: false,
// 分页相关 // 分页相关
page: 1, page: 1,
limit: 10, limit: 10,
hasMore: true, hasMore: true,
// 排序参数：0代表无排序(全灰)，1/2发布时间，3/4浏览量 // 排序参数：0代表无排序(全灰)，1/2发布时间，3/4浏览量
orderType: 0, orderType: 0,
// 排序图标资源 // 排序图标资源
iconGreyUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png', iconGreyUp: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e00ab2ac-bccf-42d8-820c-65727327e279.png',
iconGreyDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/dfffb601-6877-4608-a3eb-88695b05c6c2.png', iconGreyDown: 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/dfffb601-6877-4608-a3eb-88695b05c6c2.png',
@ -139,8 +121,8 @@ export default {
onLoad(options) { onLoad(options) {
const systemInfo = uni.getSystemInfoSync(); const systemInfo = uni.getSystemInfoSync();
this.statusBarHeight = systemInfo.statusBarHeight; this.statusBarHeight = systemInfo.statusBarHeight;
this.navHeight = this.statusBarHeight + 44; this.navHeight = this.statusBarHeight + 44;
if (options.type) { if (options.type) {
this.searchType = options.type; this.searchType = options.type;
} }
@ -155,7 +137,7 @@ export default {
goBack() { goBack() {
uni.navigateBack(); uni.navigateBack();
}, },
clearSearch() { clearSearch() {
this.keyword = ''; this.keyword = '';
this.resultList = []; this.resultList = [];
@ -172,7 +154,7 @@ export default {
} else if (type === 'view') { } else if (type === 'view') {
this.orderType = this.orderType === 3 ? 4 : 3; this.orderType = this.orderType === 3 ? 4 : 3;
} }
// 切换排序直接重新加载当前结果 // 切换排序直接重新加载当前结果
if (this.hasSearched) { if (this.hasSearched) {
this.page = 1; this.page = 1;
@ -185,15 +167,15 @@ export default {
if (!this.keyword.trim()) { if (!this.keyword.trim()) {
return uni.showToast({ title: '请输入搜索内容', icon: 'none' }); return uni.showToast({ title: '请输入搜索内容', icon: 'none' });
} }
// 每次发起新的关键字搜索时，重置为全灰无排序状态 // 每次发起新的关键字搜索时，重置为全灰无排序状态
this.orderType = 0; this.orderType = 0;
this.hasSearched = true; this.hasSearched = true;
this.page = 1; this.page = 1;
this.hasMore = true; this.hasMore = true;
this.loadData(true); this.loadData(true);
}, },
async loadData(isReset) { async loadData(isReset) {
this.loading = true; this.loading = true;
@ -234,13 +216,13 @@ export default {
} }
const res = await request.post(apiUrl, params); const res = await request.post(apiUrl, params);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
const list = res.data.list || []; const list = res.data.list || [];
const totalCount = res.data.count || 0; const totalCount = res.data.count || 0;
let formattedList = list; let formattedList = list;
if (this.searchType === 'brand' || this.searchType === 'collection_brand') { if (this.searchType === 'brand' || this.searchType === 'collection_brand') {
formattedList = list.map(item => { formattedList = list.map(item => {
let tags = []; let tags = [];
@ -262,7 +244,9 @@ export default {
coverSrc: item.cover_img || 'https://dummyimage.com/300x200/ccc/fff.png', coverSrc: item.cover_img || 'https://dummyimage.com/300x200/ccc/fff.png',
type: item.link_name || (item.link_type === 1 ? '平台课程' : '品牌课程'), type: item.link_name || (item.link_type === 1 ? '平台课程' : '品牌课程'),
views: item.browse_num || 0, views: item.browse_num || 0,
typeIcon: item.link_logo || '' typeIcon: item.link_logo || '',
time: item.create_time ? item.create_time.split(' ')[0] : '',
video: item.video || ''
})); }));
} }
@ -271,9 +255,9 @@ export default {
} else { } else {
this.resultList = [...this.resultList, ...formattedList]; this.resultList = [...this.resultList, ...formattedList];
} }
this.hasMore = this.resultList.length < totalCount; this.hasMore = this.resultList.length < totalCount;
} else { } else {
if (isReset) this.resultList = []; if (isReset) this.resultList = [];
this.hasMore = false; this.hasMore = false;
@ -288,7 +272,7 @@ export default {
goToDetail(item) { goToDetail(item) {
if (!item.id) return; if (!item.id) return;
if (this.searchType === 'notice') { if (this.searchType === 'notice') {
uni.navigateTo({ url: `/pages/notice/detail?id=${item.id}` }); uni.navigateTo({ url: `/pages/notice/detail?id=${item.id}` });
} else if (this.searchType === 'brand' || this.searchType === 'collection_brand') { } else if (this.searchType === 'brand' || this.searchType === 'collection_brand') {
@ -314,19 +298,19 @@ export default {
right: 0; right: 0;
background-color: #fff; background-color: #fff;
z-index: 999; z-index: 999;
.header-content { .header-content {
height: 44px; height: 44px;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 24rpx; padding: 0 24rpx;
.back-icon { .back-icon {
width: 28rpx; width: 28rpx;
height: 28rpx; height: 28rpx;
padding-right: 20rpx; padding-right: 20rpx;
} }
.search-box { .search-box {
flex: 1; flex: 1;
height: 74rpx; height: 74rpx;
@ -335,22 +319,23 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 6rpx 0 24rpx; padding: 0 6rpx 0 24rpx;
.search-input { .search-input {
flex: 1; flex: 1;
font-size: 28rpx; font-size: 28rpx;
} }
.search-placeholder { .search-placeholder {
color: #CCCCCC; color: #CCCCCC;
} }
.clear-icon { .clear-icon {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
} }
} }
.search-btn { .search-btn {
width: 110rpx; width: 110rpx;
height: 62rpx; height: 62rpx;
@ -371,32 +356,32 @@ export default {
.sort-bar { .sort-bar {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 10rpx 0 24rpx; padding: 10rpx 0 24rpx;
gap: 100rpx; gap: 100rpx;
.sort-item { .sort-item {
display: flex; display: flex;
align-items: center; align-items: center;
.sort-text { .sort-text {
font-weight: 400; font-weight: 400;
font-size: 26rpx; font-size: 26rpx;
color: #666666; color: #666666;
line-height: 37rpx; line-height: 37rpx;
margin-right: 6rpx; margin-right: 6rpx;
&.active { &.active {
color: #FF4767; color: #FF4767;
font-weight: 500; font-weight: 500;
} }
} }
.arrows { .arrows {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.arrow-icon { .arrow-icon {
width: 13rpx; width: 13rpx;
height: 8rpx; height: 8rpx;
@ -417,7 +402,11 @@ export default {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
.brand-card-wrap { width: 48.5%; margin-bottom: 24rpx; }
.brand-card-wrap {
width: 48.5%;
margin-bottom: 24rpx;
}
} }
.course-list { .course-list {
@ -431,12 +420,13 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 200rpx 0; padding: 200rpx 0;
.empty-icon { .empty-icon {
width: 300rpx; width: 300rpx;
height: 300rpx; height: 300rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
text { text {
font-size: 28rpx; font-size: 28rpx;
color: #999; color: #999;