Files
cpzs-frontend-new/src/views/MemberAgreement.vue

544 lines
18 KiB
Vue
Raw Normal View History

<template>
<div class="member-agreement-page">
<!-- 页面头部 -->
<div class="page-header-modern">
<div class="header-content">
<button class="back-btn" @click="goBack">
<svg viewBox="0 0 24 24" class="back-icon">
<path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></path>
</svg>
</button>
<div class="header-info">
<div class="header-text">
<h1 class="header-title">会员服务协议</h1>
<p class="header-subtitle">精彩猪手会员服务条款</p>
</div>
</div>
</div>
</div>
<!-- 主要内容 -->
<div class="agreement-content">
<!-- 标题 -->
<div class="agreement-title-section">
<h2 class="main-title">精彩猪手会员服务协议</h2>
<p class="intro-text">
欢迎使用精彩猪手数据服务<br>
精彩猪手是一款彩票数据姿态逻辑分析推测工具是各位会员朋友的超级数据助理
</p>
<div class="notice-box">
在开始使用我们的服务之前请会员仔细阅读并充分理解本会员服务协议的全部内容
本协议是会员与我们西安溢彩数智科技有限公司之间关于使用本服务的法律协议
一旦会员使用本服务即表示会员已同意接受本协议的约束
</div>
</div>
<!-- 第一章 -->
<div class="agreement-section">
<h3 class="section-title">定义</h3>
<div class="section-content">
<div class="definition-item">
<span class="def-num">1</span>
<div class="def-content">
<strong>本服务</strong>指我们通过网站应用程序或其他相关平台向会员提供的精彩猪手数据服务包括但不限于彩票开奖信息查询姿态逻辑数据分析报告个性化推导推测辅助以及会员行为统计经验技巧交流等
</div>
</div>
<div class="definition-item">
<span class="def-num">2</span>
<div class="def-content">
<strong>会员</strong>指承认本协议接受本服务的自然人具体包括一般会员和付费会员
</div>
</div>
<div class="definition-item">
<span class="def-num">3</span>
<div class="def-content">
<strong>个人信息</strong>指以电子或者其他方式记录的与已识别或者可识别的自然人有关的各种信息不包括匿名化处理后的信息
</div>
</div>
<div class="definition-item">
<span class="def-num">4</span>
<div class="def-content">
<strong>知识产权</strong>包括但不限于著作权专利权商标权商业秘密等
</div>
</div>
</div>
</div>
<!-- 第二章 -->
<div class="agreement-section">
<h3 class="section-title">服务内容及门槛</h3>
<div class="section-content">
<p>1. 我们将尽力为会员提供稳定高效的服务服务内容包括但不限于</p>
<ul class="service-list">
<li>1.1 既定彩票开奖信息查询浏览</li>
<li>1.2 既定彩票开奖数据姿态逻辑分析及报告</li>
<li>1.3 按期次更新的号球动态数据以及通过"本期"已出的开奖号球进行"下期"开奖号球的个性化推测逻辑辅助</li>
<li>1.4 根据首球与随球的关联线索启发复式/胆拖的投注参考</li>
<li>1.5 推测行为统计分析备份</li>
<li>1.6 进行规律总结技巧探索经验交流</li>
</ul>
<p>2. 我们会根据实际情况对服务内容进行调整更新如有重大变更我们将通过企业公众号企业微信短信等方式通知会员</p>
<p>3. 会员理解并同意使用本服务可能需要会员具备相应的设备软件网络环境和一定的专业知识相关费用由会员自行承担</p>
</div>
</div>
<!-- 第三章 -->
<div class="agreement-section">
<h3 class="section-title">会员账号</h3>
<div class="section-content">
<p>1. 会员可以通过免费注册的方式获取本服务账号在注册过程中会员需提供真实准确完整的信息并确保信息的及时更新</p>
<p>2. 会员应妥善保管账号及密码不将账号出借转让赠予或共享给他人使用因会员自身原因导致账号泄露或被他人使用的后果由会员自行承担</p>
<p>3. 若会员发现账号存在异常或安全问题请立即通知我们我们将尽力协助处理但对于非因我们原因导致的损失我们不承担责任</p>
<p>4. 会员在使用账号过程中应遵守法律法规及本协议约定不得利用账号从事违法违规或损害他人权益的行为否则我们有权暂停或终止会员的账号使用</p>
</div>
</div>
<!-- 第四章 -->
<div class="agreement-section">
<h3 class="section-title">会员权利与义务</h3>
<div class="section-content">
<h4 class="sub-title">1. 权利</h4>
<ul class="rights-list">
<li>1.1 有权在遵守本协议的前提下按照我们提供的方式使用服务</li>
<li>1.2 对我们提供的服务质量有权提出合理的意见和建议</li>
</ul>
<h4 class="sub-title">2. 义务</h4>
<ul class="duties-list">
<li>2.1 遵守国家法律法规及互联网相关规定不得利用本服务从事违法犯罪活动</li>
<li>2.2 不得干扰破坏本服务的正常运行不得对服务进行反向工程反编译反汇编等行为</li>
<li>2.3 不得发布传播任何侵犯他人知识产权隐私或其他合法权益的信息</li>
<li>2.4 不得恶意注册账号发送垃圾信息或进行其他滥用服务的行为</li>
<li>2.5 如因会员的行为导致我们或第三方遭受损失责任方会员应承担相应的赔偿责任</li>
</ul>
</div>
</div>
<!-- 第五章 -->
<div class="agreement-section">
<h3 class="section-title">隐私政策</h3>
<div class="section-content">
<p>1. 我们十分重视对会员个人信息保护将谨慎收集安全存储妥善使用会员的个人信息</p>
<p>2. 会员同意我们为提供服务改进服务包括遵守法律法规的需要对会员的个人信息进行合理的调用过程中我们将采取合理措施确保信息安全</p>
</div>
</div>
<!-- 第六章 -->
<div class="agreement-section">
<h3 class="section-title">知识产权</h3>
<div class="section-content">
<p>我们对本服务及相关内容包括但不限于软件数据文字图片音频视频等享有知识产权未经我们书面许可会员不得擅自复制改编或创造基于本服务的衍生品</p>
</div>
</div>
<!-- 第七章 -->
<div class="agreement-section">
<h3 class="section-title">责任限制与免责</h3>
<div class="section-content">
<div class="warning-box">
<p><strong>重要提示</strong>会员应当理解并知晓彩票本身就是概率游戏彩票开奖也是纯粹的随机事件因此本服务仅具备参考和辅助功效会员必须对自己的判断和选择结果承担最终责任</p>
</div>
<p>1. 本服务所提供的各项数据分析报告均为根据彩票历史数据统计学数学和数据科学原理通过计算机技术进行建模分析而得出我们仅对数据的及时性客观性承担责任</p>
<p>2. 我们将尽力确保服务的正常运行但由于互联网的复杂性和不确定性可能会出现服务中断延迟错误等情况对于因不可抗力技术故障网络攻击等不可预见不可避免的原因导致的服务问题我们不承担责任</p>
<p>3. 我们对会员通过本服务获取的第三方信息的准确性完整性可靠性不承担保证责任会员应自行判断并承担使用风险</p>
<p>4. 在任何情况下我们对会员因使用本服务而产生的直接间接偶然特殊或后果性损失均不承担超过会员实际支付的服务费用的赔偿责任</p>
</div>
</div>
<!-- 第八章 -->
<div class="agreement-section">
<h3 class="section-title">收费及其规则</h3>
<div class="section-content">
<div class="price-box">
<h4>会员类型与收费标准</h4>
<div class="price-grid">
<div class="price-item">
<span class="price-label">包月付费</span>
<span class="price-value">10/</span>
</div>
<div class="price-item">
<span class="price-label">包年付费</span>
<span class="price-value">100/</span>
</div>
</div>
</div>
<p>1. 本服务采用会员制运营模式所有会员分为普通会员与VIP会员两种类型</p>
<p>2. 本服务对普通会员仅提供一般的基础数据服务</p>
<p>3. 本服务对VIP会员在提供一般基础数据服务的基础上还提供个性化的智推精推特色辅助服务</p>
<p>4. 包月付费每月10元不足一个月时按一个月计算</p>
<p>5. 包年付费每年100元若因会员原因中途提出终止协议需要发生退款时所退款项均按包月付费标准进行折算</p>
<p>6. 出现业务退款情形时所退款项只限原路退回付款账号</p>
<p>7. 所有会员在服务有效期内使用本服务额定内容的时段和频次均不受限</p>
</div>
</div>
<!-- 第九章 -->
<div class="agreement-section">
<h3 class="section-title">协议变更与终止</h3>
<div class="section-content">
<p>1. 我们有权根据法律法规变化业务发展需要等对本协议进行变更变更后的协议将在相关平台以显著方式公布自公布之日起生效</p>
<p>2. 出现以下情况下我们有权终止本协议及停止会员继续使用服务</p>
<ul>
<li>2.1 会员严重违反本协议约定</li>
<li>2.2 法律法规要求我们终止服务</li>
<li>2.3 因不可抗力等不可预见不可避免的原因导致服务无法继续提供</li>
</ul>
<p>3. 协议终止后我们有权根据法律法规要求对会员的相关信息进行封存处理</p>
</div>
</div>
<!-- 第十章 -->
<div class="agreement-section">
<h3 class="section-title">争议解决</h3>
<div class="section-content">
<p>1. 本协议的签订履行解释及争议解决均适用中华人民共和国民法典</p>
<p>2. 如双方在本协议履行过程中发生争议应首先通过友好协商解决协商不成的任何一方均有权向有管辖权的人民法院提起诉讼</p>
</div>
</div>
<!-- 第十一章 -->
<div class="agreement-section">
<h3 class="section-title">十一其他条款</h3>
<div class="section-content">
<p>1. 本协议构成会员与我们之间关于本服务的完整协议未经我们书面同意会员不得转让本协议项下的任何权利利益和义务</p>
<p>2. 本协议各条款的标题仅为方便阅读而设不影响条款的具体含义及解释</p>
<p>3. 若本协议任何条款被认定为无效或不可执行不影响其他条款的效力及执行</p>
<p>4. 我们未行使或执行本协议任何权利或条款不构成对该权利或条款的放弃</p>
<p>5. 本协议自会员成功注册精彩猪手服务相关账号之日即刻生效</p>
<p>6. 任何有关本协议项下服务的问题会员可通过本公司企业微信进行咨询</p>
</div>
</div>
<!-- 底部信息 -->
<div class="footer-info">
<p class="company-name">西安溢彩数智科技有限公司</p>
<p class="date">2025年12月31日</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'MemberAgreement',
methods: {
goBack() {
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.member-agreement-page {
min-height: 100vh;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
padding: 0;
}
/* 页面头部 */
.page-header-modern {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
color: white;
padding: 20px 0;
position: relative;
}
.header-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
align-items: center;
padding: 0 20px;
position: relative;
z-index: 1;
}
.back-btn {
background: rgba(255, 255, 255, 0.2);
border: 2px solid rgba(255, 255, 255, 0.3);
border-radius: 12px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
color: white;
margin-right: 16px;
}
.back-btn:hover {
background: rgba(255, 255, 255, 0.3);
transform: scale(1.05);
}
.back-icon {
width: 24px;
height: 24px;
fill: currentColor;
}
.header-info {
flex: 1;
}
.header-title {
font-size: 24px;
font-weight: 700;
margin: 0 0 4px 0;
color: white;
}
.header-subtitle {
font-size: 14px;
opacity: 0.8;
margin: 0;
}
/* 主要内容 */
.agreement-content {
max-width: 850px;
margin: 0 auto;
padding: 24px 20px;
}
/* 标题区域 */
.agreement-title-section {
text-align: center;
margin-bottom: 30px;
}
.main-title {
font-size: 28px;
font-weight: 700;
color: #333;
margin-bottom: 16px;
}
.intro-text {
font-size: 16px;
color: #666;
line-height: 1.8;
margin-bottom: 20px;
}
.notice-box {
background: linear-gradient(135deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 152, 0, 0.1) 100%);
padding: 16px 20px;
border-radius: 12px;
border-left: 4px solid #ffc107;
text-align: left;
font-size: 14px;
color: #666;
line-height: 1.6;
}
/* 章节样式 */
.agreement-section {
background: white;
border-radius: 16px;
padding: 24px;
margin-bottom: 20px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.section-title {
font-size: 18px;
font-weight: 700;
color: #333;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 2px solid #4facfe;
}
.section-content {
font-size: 14px;
color: #555;
line-height: 1.8;
}
.section-content p {
margin-bottom: 12px;
}
.sub-title {
font-size: 15px;
font-weight: 600;
color: #333;
margin: 16px 0 12px 0;
}
/* 定义项 */
.definition-item {
display: flex;
align-items: flex-start;
margin-bottom: 14px;
padding: 14px;
background: #fafbfc;
border-radius: 10px;
}
.def-num {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
color: white;
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 600;
flex-shrink: 0;
margin-right: 12px;
}
.def-content {
flex: 1;
line-height: 1.6;
}
/* 列表样式 */
.service-list,
.rights-list,
.duties-list {
padding-left: 20px;
margin: 12px 0;
}
.service-list li,
.rights-list li,
.duties-list li {
margin-bottom: 8px;
line-height: 1.6;
}
/* 警告框 */
.warning-box {
background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(220, 38, 38, 0.1) 100%);
padding: 16px 20px;
border-radius: 12px;
border-left: 4px solid #ef4444;
margin-bottom: 16px;
}
.warning-box p {
margin: 0;
color: #b91c1c;
}
/* 价格框 */
.price-box {
background: linear-gradient(135deg, rgba(79, 172, 254, 0.1) 0%, rgba(0, 242, 254, 0.1) 100%);
padding: 20px;
border-radius: 12px;
margin-bottom: 20px;
}
.price-box h4 {
font-size: 16px;
font-weight: 600;
color: #333;
margin-bottom: 16px;
text-align: center;
}
.price-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.price-item {
background: white;
padding: 16px;
border-radius: 10px;
text-align: center;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.price-label {
display: block;
font-size: 14px;
color: #666;
margin-bottom: 8px;
}
.price-value {
display: block;
font-size: 24px;
font-weight: 700;
color: #4facfe;
}
/* 底部信息 */
.footer-info {
text-align: center;
color: #666;
}
.company-name {
font-size: 16px;
font-weight: 600;
color: #333;
margin-bottom: 8px;
}
.date {
font-size: 14px;
color: #999;
}
/* 响应式设计 */
@media (max-width: 768px) {
.page-header-modern {
padding: 16px 0;
}
.header-content {
padding: 0 16px;
}
.back-btn {
width: 40px;
height: 40px;
margin-right: 12px;
}
.header-title {
font-size: 20px;
}
.agreement-content {
padding: 16px;
}
.main-title {
font-size: 22px;
}
.section-title {
font-size: 16px;
}
.definition-item {
flex-direction: column;
}
.def-num {
margin-bottom: 8px;
margin-right: 0;
}
.price-grid {
grid-template-columns: 1fr;
}
.price-value {
font-size: 20px;
}
}
</style>