This commit is contained in:
qiuyuan 2025-08-01 09:34:21 +08:00
parent ef0b041232
commit 9efdb48938
4 changed files with 847 additions and 746 deletions

View File

@ -1,14 +1,10 @@
<template>
<view class="activity-detail-container">
<!-- 顶部图片轮播 -->
<swiper class="activity-banner" :autoplay="false" indicator-dots indicator-color="rgba(255,255,255,0.5)" indicator-active-color="#5b9cf8">
<swiper class="activity-banner" :autoplay="false" indicator-dots indicator-color="rgba(255,255,255,0.5)"
indicator-active-color="#5b9cf8">
<swiper-item v-for="(img, index) in bannerImages" :key="index">
<image
:src="img"
mode="aspectFill"
class="w-full h-full"
@click="previewImage(index)"
/>
<image :src="img" mode="aspectFill" class="w-full h-full" @click="previewImage(index)" />
</swiper-item>
</swiper>
@ -51,7 +47,7 @@
<!-- 活动详情卡片 -->
<view class="detail-card">
<!-- <view class="card-header">
<!-- <view class="card-header">
<view class="header-line"></view>
<text class="header-title">活动详情</text>
</view> -->
@ -63,12 +59,8 @@
</view>
<view class="section-content">
<view v-html="activityInfo.content"></view>
<image
src="/static/route-map.jpg"
mode="widthFix"
class="route-map"
@click="previewImage(bannerImages.length)"
></image>
<image src="/static/route-map.jpg" mode="widthFix" class="route-map"
@click="previewImage(bannerImages.length)"></image>
</view>
</view>
@ -119,31 +111,34 @@
<!-- 底部操作栏 -->
<view class="action-bar">
<!-- <view class="action-btn favorite" @click="toggleFavorite">
<u-icon :name="isFavorite ? 'heart-fill' : 'heart'" size="24" :color="isFavorite ? '#FF5A5F' : '#666'"></u-icon>
<text>收藏</text>
</view> -->
<view class="action-btn share" @click="shareActivity">
<u-icon name="share" size="30" color="#666"></u-icon>
<text>分享</text>
</view>
<button class="signup-btn" @click="handleSignUp" >
立即报名
<button class="share-btn" open-type="share" >
<u-icon name="share" size="36" color="#fff"></u-icon>
<text class="share-text">分享</text>
</button>
<button class="signup-btn" @click="handleSignUp">立即报名</button>
</view>
</view>
</template>
<script>
import { get, post } from '@/utils/request';
import { IMAGE_BASE_URL, BASE_URL } from '@/utils/config';
import { formatTime, formatRelativeTime } from '@/utils/timeFormat';
export default {
import {
get,
post
} from '@/utils/request';
import {
IMAGE_BASE_URL,
BASE_URL
} from '@/utils/config';
import {
formatTime,
formatRelativeTime
} from '@/utils/timeFormat';
export default {
data() {
return {
formatTime,
IMAGE_BASE_URL,
Id:null,
Id: null,
isFavorite: false,
isSignedUp: false,
bannerImages: [],
@ -175,7 +170,7 @@ export default {
this.Id = options.Id;
}
},
mounted(){
mounted() {
this.getActivitiesDetail();
},
methods: {
@ -187,15 +182,15 @@ export default {
})
},
async handleSignUp(){
async handleSignUp() {
try {
const res = await get(`/api/v1/app_auth/activities/${this.Id}`);
if ( !res.success) {
if (!res.success) {
uni.showToast({
title: res.msg || '报名失败',
icon: 'error'
})
}else{
} else {
uni.showToast({
title: '报名成功!',
icon: 'success'
@ -206,13 +201,12 @@ export default {
console.error('获取详情失败:', err);
}
},
shareActivity() {
uni.share({
onShareAppMessage() {
return {
title: this.activityInfo.title,
content: '一起来参加社区夜跑活动吧!',
href: '/pages/activity/detail',
imageUrl: this.bannerImages[0]
})
path: `/pages/activity/detail?id=${this.Id}`,
imageUrl: this.bannerImages[0] || '/static/logo.png'
}
},
previewImage(index) {
uni.previewImage({
@ -220,7 +214,7 @@ export default {
urls: [...this.bannerImages, '/static/route-map.jpg']
})
},
async getActivitiesDetail(){
async getActivitiesDetail() {
try {
const res = await get(`/api/v1/apps/home/activities/${this.Id}`);
if (!res || !res.success) {
@ -233,26 +227,28 @@ export default {
this.bannerImages.push(item);
}
});
this.activityInfo = {...res.data};
this.activityInfo = {
...res.data
};
} catch (err) {
console.error('获取详情失败:', err);
}
}
}
}
}
</script>
<style lang="scss" scoped>
$primary-color: #5b9cf8;
$secondary-color: #F7F8FA;
$text-color: #333;
$light-text: #666;
$border-color: #eee;
$border-radius: 16rpx;
$shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
$primary-color: #5b9cf8;
$secondary-color: #F7F8FA;
$text-color: #333;
$light-text: #666;
$border-color: #eee;
$border-radius: 16rpx;
$shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
.activity-detail-container {
.activity-detail-container {
padding-bottom: 120rpx;
background-color: $secondary-color;
@ -314,7 +310,8 @@ $shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
}
}
.detail-card, .tips-card {
.detail-card,
.tips-card {
background-color: #fff;
border-radius: $border-radius;
padding: 30rpx;
@ -502,32 +499,52 @@ $shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
bottom: 0;
left: 0;
right: 0;
height: 100rpx;
height: 120rpx;
background-color: #fff;
display: flex;
align-items: center;
padding: 0 20rpx;
box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.05);
justify-content: space-between;
padding: 0 30rpx;
box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.08);
z-index: 100;
.action-btn {
.share-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 120rpx;
height: 100%;
height: 80rpx;
padding: 0 30rpx;
background: linear-gradient(135deg, #6e8cfa, #5b9cf8);
border-radius: 40rpx;
box-shadow: 0 4rpx 12rpx rgba(91, 156, 248, 0.3);
color: #fff;
font-size: 28rpx;
margin-right: 20rpx;
border: none;
text {
font-size: 22rpx;
color: $light-text;
margin-top: 6rpx;
.share-text {
color: #fff;
font-size: 28rpx;
margin-left: 10rpx;
font-weight: 500;
}
&.btn-hover {
opacity: 0.9;
transform: translateY(2rpx);
box-shadow: 0 2rpx 6rpx rgba(91, 156, 248, 0.4);
}
}
.share-btn::after {
border: none;
}
.signup-btn {
flex: 1;
height: 80rpx;
background-color: #5b9cf8;
margin-left: 30rpx;
background: linear-gradient(135deg, #ff7e5f, #ff5a5f);
color: #fff;
border-radius: 40rpx;
font-size: 32rpx;
@ -535,20 +552,27 @@ $shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
display: flex;
align-items: center;
justify-content: center;
margin-left: 20rpx;
box-shadow: 0 4rpx 12rpx rgba(255, 90, 95, 0.3);
transition: all 0.3s ease;
border: none;
&::after {
border: none;
}
&:active {
opacity: 0.9;
transform: translateY(2rpx);
box-shadow: 0 2rpx 6rpx rgba(255, 90, 95, 0.4);
}
}
}
}
}
@media (min-width: 768px) {
@media (min-width: 768px) {
.activity-detail-container {
max-width: 750px;
margin: 0 auto;
}
}
}
</style>

View File

@ -1,18 +1,20 @@
<template>
<view class="aiHelper">
<view class="aiHelperContainer">
<!-- 标题区域 -->
<view class="aiHelperTitle" :style="{'background-image': `url(${aiHelperTitleBackground})`}">
{{ aiHelperTitle }}
</view>
<view class="aiHelperTitle" :style="{'background-image': `url(${aiHelperTitleBackground})`}">{{aiHelperTitle}}</view>
<!-- AI类型卡片容器 -->
<view class="aiBox">
<view class="aiType" v-for="(item,index) in aiType" :key="item.id" @click="goAiType(item)">
<view class="aiType" v-for="(item, index) in aiType" :key="item.id" @click="goAiType(item)">
<view class="aiTypeContainer" :style="{'background-image': `url(${item.background})`}">
<view class="aiLeft" :style="{'background-image': `url(${item.imagePath})`}">
<view class="aiLeftTitle">{{item.name}}</view>
<view class="aiLeftTitle">{{ item.name }}</view>
</view>
<view class="aiRight">
<view class="aiRightTitle"><text>{{item.description}}</text></view>
<view class="aiRightTitle"><text>{{ item.description }}</text></view>
<view class="aiDescription"><text>开始对话></text></view>
</view>
</view>
@ -20,37 +22,34 @@
</view>
</view>
<view><Footer></Footer></view>
</view>
</template>
<script>
import Footer from '@/components/footer_common.vue';
import {get,post} from '@/utils/request';
import {IMAGE_BASE_URL,BASE_URL} from '@/utils/config';
export default{
name:'aiHelper',
components:{Footer},
data(){
return{
aiHelperTitle:'AI智能助手',
aiHelperTitleBackground:'../../static/imgs/ai/title.png',
aiType:[],
import { get, post } from '@/utils/request';
import { IMAGE_BASE_URL, BASE_URL } from '@/utils/config';
export default {
name: 'aiHelper',
components: { Footer },
data() {
return {
aiHelperTitle: 'AI智能助手',
aiHelperTitleBackground: '../../static/imgs/ai/title.png',
aiType: [],
}
},
mounted() {
this.getData();
},
methods:{
goAiType(item){
methods: {
goAiType(item) {
uni.navigateTo({
url: `/pages/chat/chatPage?serviceUrl=${item.serviceUrl}&apiKey=${item.apiKey}&id=${item.id}&name=${item.name}&icon=${item.icon}`
});
},
async getData(){
async getData() {
let params = {
current: 1,
pageSize: 10,
@ -60,86 +59,91 @@
if (!res || !res.success) {
throw new Error('获取AI助手失败');
}
if(res.data.length>0){
res.data.forEach((item)=>{
item.background=IMAGE_BASE_URL+item.background
item.imagePath=IMAGE_BASE_URL+item.imagePath
item.icon=IMAGE_BASE_URL+item.icon
if (res.data.length > 0) {
res.data.forEach((item) => {
item.background = IMAGE_BASE_URL + item.background
item.imagePath = IMAGE_BASE_URL + item.imagePath
item.icon = IMAGE_BASE_URL + item.icon
})
}
this.aiType=res.data
this.aiType = res.data
} catch (err) {
console.error('获取AI助手失败:', err);
}
}
}
}
</script>
<style lang="scss" scoped>
.aiHelper{
// margin-top: 90rpx;
//
// @import "@/styles/variables.scss"; //
.aiHelper {
// 使
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
.aiHelperContainer {
padding: 2%;
padding-bottom: 50%;
padding: 30rpx; // 使rpx
box-sizing: border-box; // padding
.aiHelperTitle {
font-size: 1rem;
font-size: 36rpx;
font-weight: 600;
letter-spacing: 0;
line-height: 1.5;
color: rgba(0, 0, 0, 1);
color: #000;
text-align: center;
vertical-align: top;
margin-bottom: 3%;
// background-image: url('../../static/imgs/ai/title.png');
// padding: 20rpx 0 30rpx; //
background-repeat: no-repeat;
background-position: 50% 80%;
background-size: 30%;
line-height: 1.5;
}
.aiBox {
//
padding: 10rpx 0;
.aiType {
margin-bottom: 3%;
// 使
margin-bottom: 30rpx;
width: 100%;
height: 310rpx;
display: flex;
justify-content: center;
.aiTypeContainer {
display: flex;
margin: 1%;
border-radius: 0.5rem;
border-radius: 20rpx; //
background-size: cover;
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
background-position: 30% 50%;
background-repeat: no-repeat;
width: 96%;
aspect-ratio: 2.1/1;
width: 100%;
// 使aspect-ratio
height: 320rpx;
box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.15); //
overflow: hidden; //
.aiLeft {
border-radius: 0.5rem;
border-radius: 16rpx;
padding: 5% 0;
margin-right: 12%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 35%;
// height: 100%;
/* margin-left: -5%;*/
position: relative;
//
padding: 20rpx;
.aiLeftTitle {
font-size: 0.8rem;
font-size: 30rpx;
font-weight: 900;
letter-spacing: 0;
line-height: 1.4;
color: rgba(255, 255, 255, 1);
color: #fff;
text-align: left;
position: absolute;
bottom: 10%;
left: 10%;
bottom: 20rpx;
left: 20rpx;
text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3); //
}
}
@ -147,34 +151,66 @@
flex: 1;
display: flex;
flex-direction: column;
justify-content: normal;
justify-content: center;
padding-right: 30rpx; //
.aiRightTitle {
font-size: 0.8rem;
font-size: 30rpx;
font-weight: 700;
letter-spacing: 0;
line-height: 1.4;
color: rgba(0, 0, 0, 1);
color: #000;
text-align: left;
margin-bottom: 5%;
margin-top: 22%;
margin-bottom: 20rpx;
line-height: 1.5; //
//
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.aiDescription {
font-size: 26rpx;
font-weight: 700;
letter-spacing: 0;
line-height: 2.5;
color: #999;
text-align: right;
width: 90%;
width: 100%;
padding-top: 10rpx;
//
transition: color 0.3s ease;
}
}
}
// hover
&:active .aiTypeContainer {
transform: scale(0.98);
transition: transform 0.2s ease;
}
&:active .aiDescription {
color: #666;
}
}
}
}
}
//
@media screen and (min-width: 750rpx) {
.aiTypeContainer {
height: 340rpx !important;
}
}
@media screen and (max-width: 375rpx) {
.aiTypeContainer {
height: 280rpx !important;
}
.aiRightTitle {
font-size: 28rpx !important;
}
}
</style>

View File

@ -157,8 +157,7 @@
{
key: 5,
url: "/static/imgs/service/service_notice.png",
name: '设置',
pageUrl: 'serviceNoticeList'
name: '设置'
},
{
key: 6,
@ -559,6 +558,7 @@
this.showEditModal = false;
},
//
//
goPage(item) {
if (item.key === 6) { //
@ -566,6 +566,11 @@
return;
}
if (item.key === 5) { //
this.handleEditClick(); //
return;
}
if (!this.checkLogin()) {
this.showEditModal = true;
return;

View File

@ -3,7 +3,7 @@
<view class="content">
<!-- 选择区域 -->
<view class="form-item">
<view class="label" @click="showSelect = true" style="margin-bottom: 0;">
<view class="label" @click="showTypeSelect = true" style="margin-bottom: 0;">
<u-icon name="list" color="#3B8CFF" size="38"></u-icon>
选择区域
<view class="select-box">
@ -11,8 +11,12 @@
<u-icon name="arrow-down" color="#999" size="30"></u-icon>
</view>
</view>
<u-picker :show="showSelect" :columns="areaList" keyName="label" @confirm="handleConfirm"
@cancel="handleCancel">
<u-picker
:show="showTypeSelect"
:columns="areaList"
keyName="title"
@confirm="handleTypeConfirm"
@cancel="showTypeSelect = false">
</u-picker>
</view>
@ -116,17 +120,22 @@
fileList: [],
workOrderCategory: '',
workOrderCategoryID: '',
workOrderArea:'',
workOrderAreaID:'',
showSelect: false,
showTypeSelect:false,
categoryList: [],
workOrderLocation: '',
expectedTime: '',
uploadedImages: [],
uploadedVideos: [],
videoFormats: ['mp4', 'mov', 'avi', 'wmv', 'mpeg', '3gp', 'flv', 'mkv']
videoFormats: ['mp4', 'mov', 'avi', 'wmv', 'mpeg', '3gp', 'flv', 'mkv'],
areaList:[],
};
},
mounted() {
this.getOrderList();
this.getOrderTypeList();
},
methods: {
handleBack() {
@ -298,6 +307,7 @@
concatName: this.concatName, //
customerPhone: this.customerPhone, //
orderTypeId: this.workOrderCategoryID,
orderAreaId:this.workOrderAreaID,
address: this.workOrderLocation,
images: this.uploadedImages,
videos: this.uploadedVideos,
@ -340,6 +350,8 @@
this.fileList = [];
this.uploadedImages = [];
this.uploadedVideos = [];
this.workOrderArea = '';
this.workOrderAreaID = '';
},
handleConfirm(e) {
@ -348,6 +360,12 @@
this.showSelect = false;
},
handleTypeConfirm(e) {
this.workOrderArea = e.value[0].title;
this.workOrderAreaID = e.value[0].id;
this.showTypeSelect = false;
},
handleCancel() {
this.showSelect = false;
},
@ -368,6 +386,24 @@
});
}
},
//
async getOrderTypeList(){
try {
const res = await get('/api/v1/apps/work-order-area');
if (res?.success) {
this.areaList = [
[...res.data]
]
}
} catch (err) {
console.error('获取工作区域失败:', err);
uni.showToast({
title: '获取工作区域失败',
icon: 'none'
});
}
}
}
};
</script>