用户隐私协议开发

packageA/pages/agreement/user.vue

@@ -0,0 +1,322 @@
+<template>
+    <view class="agreement-page">
+        <!-- 顶部导航栏 -->
+        <!-- <view class="nav-bar">
+            <view class="nav-left" @click="goBack">
+                <uni-icons type="back" size="28" color="#333"></uni-icons>
+            </view>
+            <view class="nav-title">用户协议</view>
+            <view class="nav-right"></view>
+        </view> -->
+        
+        <!-- 内容区域 -->
+        <scroll-view class="content" scroll-y>
+            <view class="agreement-content">
+                <!-- 协议标题 -->
+                <!-- <view class="agreement-title">用户协议与隐私政策</view> -->
+            
+            <!-- 重要提示 -->
+            <view class="important-tip">
+                在您注册、登录、使用本小程序服务之前，请您务必审慎阅读、充分理解本协议各条款内容，特别是以加粗形式提示您注意的、关于免除或限制责任、争议解决及法律适用的条款。一旦您以任何方式访问、使用本小程序，即表示您已同意接受本协议及我们另行发布的《隐私政策》的全部内容约束。如您不同意本协议的任何内容，请立即停止使用本小程序。
+            </view>
+            
+            <view class="important-tip">
+                如果您未满18周岁，请在法定监护人的陪同下阅读和判断是否同意本协议，并特别注意未成年人使用条款。
+            </view>
+            
+            <!-- 第一部分：用户服务协议 -->
+            <view class="section">
+                <view class="section-title">第一部分：用户服务协议</view>
+                
+                <!-- 一、服务定义与变更 -->
+                <view class="section-subtitle">一、 服务定义与变更</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">1.1 服务内容：</view>
+                        <view class="paragraph-text">本小程序是喀什地区人社局为您提供的的平台服务。具体服务内容可能因版本更新而调整。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">1.2 服务变更与中断：</view>
+                        <view class="paragraph-text">为保障服务质量，我们有权随时对服务内容、功能、操作界面等进行调整、变更或中断，恕不另行单独通知。对于因服务调整、中断或终止对用户或任何第三方造成的损失，除法律明确规定外，不承担任何责任。</view>
+                    </view>
+                </view>
+                
+                <!-- 二、账号管理与安全 -->
+                <view class="section-subtitle">二、 账号管理与安全</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">2.1 账号注册：</view>
+                        <view class="paragraph-text">您需要通过微信授权登录来使用本小程序的核心功能。该授权将帮助我们获取您的微信头像、昵称、地区等基本信息。您知悉并同意，该授权行为即视为您已完成账号注册。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">2.2 账号安全：</view>
+                        <view class="paragraph-text">您的微信账号由您自行保管并承担安全责任。您应妥善保管与微信账号相关的一切信息，并对您账号下发生的一切活动（包括但不限于言论发表、信息发布、服务购买等）承担全部法律责任。如发现任何未经授权的账号使用行为，应立即通知我们。我们将对前述情况采取合理的行动，但除因我们的过错外，我们不承担由此导致的任何损失。</view>
+                    </view>
+                </view>
+                
+                <!-- 三、用户行为规范 -->
+                <view class="section-subtitle">三、 用户行为规范</view>
+                <view class="section-content">
+                    <view class="paragraph-text">您承诺并保证在使用本小程序服务时遵守中华人民共和国法律法规、社会公德，并不得从事以下行为：</view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.1 </view>
+                        <view class="paragraph-text">上传、发布、传播或分享任何反对宪法所确定的基本原则、危害国家安全、泄露国家秘密、颠覆国家政权、破坏国家统一、损害国家荣誉和利益、煽动民族仇恨、民族歧视、破坏民族团结、破坏国家宗教政策、宣扬邪教和封建迷信、淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪等法律、行政法规禁止的内容；</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.2 </view>
+                        <view class="paragraph-text">侵犯他人知识产权、商业秘密、肖像权、隐私权等合法权益；</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.3 </view>
+                        <view class="paragraph-text">发布任何虚假、骚扰性、侮辱性、诽谤性、恐吓性、庸俗淫秽或任何其他非法信息；</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.4 </view>
+                        <view class="paragraph-text">利用技术手段恶意爬取、干扰、破坏本小程序的正常运营，或增加服务器负载；</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.5 </view>
+                        <view class="paragraph-text">未经许可，从事任何形式的商业广告行为，或利用本小程序进行传销、金字塔骗局等非法营销活动；</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">3.6 </view>
+                        <view class="paragraph-text">其他任何违反法律规定或干扰本小程序正常运营的行为。</view>
+                    </view>
+                    
+                    <view class="paragraph-text">若用户违反上述规定，我们有权单方面判断采取中断服务、限制功能、封禁账号等措施，并保留追究法律责任的权利。</view>
+                </view>
+                
+                <!-- 四、知识产权声明 -->
+                <view class="section-subtitle">四、 知识产权声明</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">4.1 </view>
+                        <view class="paragraph-text">本公司独立拥有或与相关内容提供者共同拥有本小程序及相关软件、技术、代码、文档、页面设计、Logo、商标、信息内容等的知识产权。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">4.2 </view>
+                        <view class="paragraph-text">未经本公司或相关权利人书面许可，任何单位和个人不得以任何方式（包括但不限于非法复制、传播、展示、修改、创建衍生作品等）使用上述知识产权，否则我们将依法追究其法律责任。</view>
+                    </view>
+                </view>
+                
+                <!-- 五、免责与责任限制 -->
+                <view class="section-subtitle">五、 免责与责任限制</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">5.1 "现状"提供：</view>
+                        <view class="paragraph-text">本小程序的服务按"现状"和"可得到"的状态提供。在法律允许的最大范围内，我们明确表示不提供任何明示或默示的担保，包括但不限于对服务的适用性、没有错误或疏漏、持续性、准确性、可靠性、适用于某一特定用途。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">5.2 不可抗力：</view>
+                        <view class="paragraph-text">对于因战争、动乱、自然灾害、政府行为、电信线路中断、黑客攻击、计算机病毒侵入或发作、第三方服务瑕疵等不可抗力因素导致的任何服务中断、数据丢失或信息泄露等问题，我们不承担责任。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">5.3 第三方链接与内容：</view>
+                        <view class="paragraph-text">本小程序内可能包含由第三方提供的服务或链接。该等第三方服务或链接由第三方独立运营和控制，我们不对其内容、隐私政策或行为承担任何责任。您使用任何第三方服务时，需受其自身的条款和政策的约束。</view>
+                    </view>
+                </view>
+                
+                <!-- 六、协议修改与终止 -->
+                <view class="section-subtitle">六、 协议修改与终止</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">6.1 </view>
+                        <view class="paragraph-text">我们有权根据国家法律法规变化及运营需要，随时修改本协议的任何条款。更新后的协议将在本小程序上公布，并取代旧版本。如您继续使用服务，即视为接受更新后的协议。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">6.2 </view>
+                        <view class="paragraph-text">您有权随时停止使用本小程序服务。若我们判断您严重违反本协议，我们有权单方面终止向您提供服务，并保留追偿损失的权利。</view>
+                    </view>
+                </view>
+                
+                <!-- 七、法律适用与争议解决 -->
+                <view class="section-subtitle">七、 法律适用与争议解决</view>
+                <view class="section-content">
+                    <view class="paragraph">
+                        <view class="paragraph-title">7.1 </view>
+                        <view class="paragraph-text">本协议的订立、效力、解释、履行及争议的解决，均适用中华人民共和国大陆地区法律。</view>
+                    </view>
+                    
+                    <view class="paragraph">
+                        <view class="paragraph-title">7.2 </view>
+                        <view class="paragraph-text">因本协议引起的或与本协议有关的任何争议，双方应首先友好协商解决；协商不成的，您同意将争议提交至 【填写您公司所在地】 有管辖权的人民法院通过诉讼解决。</view>
+                    </view>
+                </view>
+            </view>
+            
+            <!-- 同意按钮 -->
+            <!-- <view class="agreement-actions">
+                <button class="agree-btn primary" @click="agreeAgreement">同意并继续</button>
+                <button class="agree-btn secondary" @click="disagreeAgreement">不同意</button>
+            </view> -->
+        </view>
+    </scroll-view>
+</view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const goBack = () => {
+    uni.navigateBack();
+};
+
+// 同意协议
+const agreeAgreement = () => {
+    // 存储用户同意状态
+    uni.setStorageSync('agreedToUserAgreement', true);
+    // 返回上一页
+    uni.navigateBack();
+};
+
+// 不同意协议
+const disagreeAgreement = () => {
+    uni.showModal({
+        title: '提示',
+        content: '您需要同意用户协议才能使用本服务',
+        showCancel: false,
+        confirmText: '我知道了'
+    });
+};
+</script>
+
+<style lang="stylus" scoped>
+.agreement-page
+    height: 100vh
+    background: #f5f5f5
+    display: flex
+    flex-direction: column
+    .nav-bar
+        height: 88rpx
+        background: #fff
+        display: flex
+        align-items: center
+        justify-content: space-between
+        padding: 0 32rpx
+        box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05)
+        position: sticky
+        top: 0
+        z-index: 10
+        
+        .nav-left
+        .nav-right
+            width: 80rpx
+            height: 88rpx
+            display: flex
+            align-items: center
+            
+        .nav-left
+            justify-content: flex-start
+            
+        .nav-right
+            justify-content: flex-end
+            
+        .nav-title
+            font-size: 32rpx
+            font-weight: 600
+            color: #333
+    
+    .content
+        flex: 1
+        height: 0 /* 让flex:1生效 */
+        
+    .agreement-content
+        padding: 32rpx
+        background: #fff
+        margin: 20rpx
+        border-radius: 16rpx
+        
+    .agreement-title
+        font-size: 36rpx
+        font-weight: 700
+        color: #333
+        text-align: center
+        margin-bottom: 40rpx
+        
+    .important-tip
+        background: #f0f5ff
+        border-left: 8rpx solid #256bfa
+        padding: 24rpx
+        margin-bottom: 40rpx
+        font-size: 28rpx
+        line-height: 1.6
+        color: #333
+        
+    .section
+        margin-bottom: 48rpx
+        
+    .section-title
+        font-size: 32rpx
+        font-weight: 600
+        color: #333
+        margin-bottom: 32rpx
+        padding-bottom: 16rpx
+        border-bottom: 2rpx solid #f0f0f0
+        
+    .section-subtitle
+        font-size: 28rpx
+        font-weight: 600
+        color: #333
+        margin-bottom: 24rpx
+        
+    .section-content
+        margin-bottom: 32rpx
+        
+    .paragraph
+        display: flex
+        margin-bottom: 24rpx
+        
+    .paragraph-title
+        font-weight: 500
+        color: #333
+        min-width: 120rpx
+        flex-shrink: 0
+        
+    .paragraph-text
+        font-size: 26rpx
+        line-height: 1.6
+        color: #666
+        flex: 1
+        
+    .paragraph:last-child
+        margin-bottom: 0
+    
+    .agreement-actions
+        margin-top: 60rpx
+        padding: 0 32rpx
+        display: flex
+        flex-direction: column
+        gap: 24rpx
+        
+        .agree-btn
+            width: 100%
+            height: 88rpx
+            border-radius: 44rpx
+            display: flex
+            align-items: center
+            justify-content: center
+            font-size: 32rpx
+            font-weight: 500
+            border: none
+            
+            &.primary
+                background: linear-gradient(135deg, #256BFA 0%, #1E5BFF 100%)
+                color: #FFFFFF
+                box-shadow: 0 8rpx 20rpx rgba(37, 107, 250, 0.3)
+            
+            &.secondary
+                background: #F7F8FA
+                color: #666666
+</style>