137 lines
3.2 KiB
Vue
137 lines
3.2 KiB
Vue
<template>
|
||
<view class="page">
|
||
<view class="header">
|
||
<text class="title">用户服务协议</text>
|
||
<text class="subtitle">更新日期：2023年10月24日</text>
|
||
</view>
|
||
|
||
<view class="section">
|
||
<view class="section-title">一、前言</view>
|
||
<view class="card">
|
||
<text class="text">欢迎您使用我们的服务。本协议是您与平台之间关于使用本服务所订立的权利义务规范。</text>
|
||
<text class="text">在注册或使用本服务前，请您务必审慎阅读并充分理解本协议内容。继续使用即表示您已阅读、理解并接受本协议全部内容。</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="section">
|
||
<view class="section-title">二、服务内容</view>
|
||
<view class="list">
|
||
<text class="text">1. 本平台向用户提供信息展示、内容服务等功能，具体以实际提供为准。</text>
|
||
<text class="text">2. 我们有权根据业务发展需要，对服务内容进行调整或升级。</text>
|
||
</view>
|
||
<view class="notice">部分增值服务可能涉及收费，我们将进行明确提示。</view>
|
||
</view>
|
||
|
||
<view class="section">
|
||
<view class="section-title">三、用户行为规范</view>
|
||
<view class="card">
|
||
<view class="row">
|
||
<text class="dot"></text>
|
||
<text class="text">妥善保管账号与信息，对账号下的行为承担责任。</text>
|
||
</view>
|
||
<view class="row">
|
||
<text class="dot"></text>
|
||
<text class="text">不得利用本服务从事违法违规活动。</text>
|
||
</view>
|
||
<view class="row">
|
||
<text class="dot"></text>
|
||
<text class="text">尊重他人合法权益与知识产权。</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="section">
|
||
<view class="section-title">四、免责声明</view>
|
||
<view class="card light">
|
||
<text class="text">因不可抗力或网络原因导致服务中断或异常，我们将尽力减少影响，但不承担由此造成的损失。</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.page {
|
||
min-height: 100vh;
|
||
padding: 32rpx 32rpx 80rpx;
|
||
background: #f8f6f6;
|
||
color: #1f2d3d;
|
||
}
|
||
|
||
.header {
|
||
padding: 12rpx 0 32rpx;
|
||
}
|
||
|
||
.title {
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.subtitle {
|
||
display: block;
|
||
margin-top: 8rpx;
|
||
font-size: 24rpx;
|
||
color: #7a8699;
|
||
}
|
||
|
||
.section {
|
||
margin-top: 32rpx;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.card {
|
||
background: #fff;
|
||
border-radius: 20rpx;
|
||
padding: 24rpx;
|
||
box-shadow: 0 12rpx 24rpx rgba(15, 33, 66, 0.06);
|
||
}
|
||
|
||
.card.light {
|
||
background: #f1f3f6;
|
||
}
|
||
|
||
.text {
|
||
font-size: 26rpx;
|
||
color: #4b5565;
|
||
line-height: 1.7;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.list .text {
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.notice {
|
||
margin-top: 16rpx;
|
||
padding: 16rpx 20rpx;
|
||
border-left: 6rpx solid #ec5b13;
|
||
background: rgba(236, 91, 19, 0.08);
|
||
border-radius: 12rpx;
|
||
font-size: 24rpx;
|
||
color: #b4541f;
|
||
}
|
||
|
||
.row {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 12rpx;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.dot {
|
||
width: 10rpx;
|
||
height: 10rpx;
|
||
border-radius: 5rpx;
|
||
background: #ec5b13;
|
||
margin-top: 10rpx;
|
||
}
|
||
</style>
|