初始化
This commit is contained in:
leiking
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<view class="ai-float" @tap="go">
|
||||
<view class="dot"></view>
|
||||
<view class="t">AI</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AiFloat',
|
||||
methods: {
|
||||
go() {
|
||||
uni.navigateTo({ url: '/pages/ai/chat' })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.ai-float {
|
||||
position: fixed;
|
||||
right: 24rpx;
|
||||
bottom: 170rpx;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 999rpx;
|
||||
background: linear-gradient(135deg, #111827 0%, #3b82f6 100%);
|
||||
box-shadow: 0 16rpx 40rpx rgba(17, 24, 39, 0.18);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 99;
|
||||
}
|
||||
.t {
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 800;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
.dot {
|
||||
position: absolute;
|
||||
top: 14rpx;
|
||||
right: 14rpx;
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 999rpx;
|
||||
background: #10b981;
|
||||
border: 4rpx solid rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<view class="card item">
|
||||
<image v-if="project.cover" class="cover" :src="project.cover" mode="aspectFill" @tap="open" />
|
||||
<view class="row between">
|
||||
<view class="name" @tap="open">{{ project.name }}</view>
|
||||
<view class="price">
|
||||
<text class="yen">¥</text>
|
||||
<text class="num">{{ project.price }}</text>
|
||||
<text class="ori muted" v-if="project.originPrice">¥{{ project.originPrice }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="muted meta">服务时长：{{ project.durationMin }} 分钟</view>
|
||||
<view class="muted meta">适合人群：{{ project.fitFor }}</view>
|
||||
<view class="muted meta">简介：{{ project.desc }}</view>
|
||||
<view class="muted meta">禁忌提醒：{{ project.taboo }}</view>
|
||||
<view class="row between ops">
|
||||
<view class="btn btn-ghost a" @tap="book">立即预约</view>
|
||||
<view class="btn btn-primary b" @tap="buy">立即购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'ProjectCard',
|
||||
props: {
|
||||
project: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
uni.navigateTo({ url: `/pages/projects/detail?id=${this.project.id}` })
|
||||
},
|
||||
book() {
|
||||
this.open()
|
||||
},
|
||||
buy() {
|
||||
uni.navigateTo({ url: `/pages/order/confirm?type=coupon&projectId=${this.project.id}` })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.item {
|
||||
padding: 22rpx;
|
||||
}
|
||||
.cover {
|
||||
width: 100%;
|
||||
height: 260rpx;
|
||||
border-radius: 18rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
.name {
|
||||
font-weight: 950;
|
||||
font-size: 34rpx;
|
||||
max-width: 520rpx;
|
||||
}
|
||||
.price {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
color: #111827;
|
||||
}
|
||||
.yen {
|
||||
font-size: 24rpx;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.num {
|
||||
font-size: 40rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.ori {
|
||||
margin-left: 10rpx;
|
||||
font-size: 24rpx;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
.meta {
|
||||
margin-top: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.ops {
|
||||
margin-top: 18rpx;
|
||||
gap: 16rpx;
|
||||
}
|
||||
.a {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
}
|
||||
.b {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<view class="card item" @tap="open">
|
||||
<image v-if="project.cover" class="cover" :src="project.cover" mode="aspectFill" />
|
||||
<view class="name">{{ project.name }}</view>
|
||||
<view class="muted meta">{{ project.durationMin }} 分钟</view>
|
||||
<view class="row between bottom">
|
||||
<view class="price">
|
||||
<text class="yen">¥</text>
|
||||
<text class="num">{{ project.price }}</text>
|
||||
<text class="ori muted" v-if="project.originPrice">¥{{ project.originPrice }}</text>
|
||||
</view>
|
||||
<view class="go">查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'ProjectGridCard',
|
||||
props: {
|
||||
project: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
uni.navigateTo({ url: `/pages/projects/detail?id=${this.project.id}` })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.item {
|
||||
padding: 20rpx;
|
||||
height: 360rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.cover {
|
||||
width: 100%;
|
||||
height: 180rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
.name {
|
||||
font-size: 30rpx;
|
||||
font-weight: 950;
|
||||
line-height: 1.2;
|
||||
max-height: 72rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.meta {
|
||||
margin-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.bottom {
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
.price {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
.yen {
|
||||
font-size: 22rpx;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.num {
|
||||
font-size: 36rpx;
|
||||
font-weight: 950;
|
||||
}
|
||||
.ori {
|
||||
margin-left: 8rpx;
|
||||
font-size: 22rpx;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
.go {
|
||||
padding: 10rpx 14rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(59, 130, 246, 0.14);
|
||||
color: #1d4ed8;
|
||||
font-size: 24rpx;
|
||||
font-weight: 900;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user