consumer-app/pages/profileSub/userAgreement.vue

<template>
  <view class="agreement-page">
    <view class="header-fixed-wrapper" :style="{ height: headerHeight + 'px' }">
      <NavHeader title="用户服务协议" />
    </view>
    <view class="main-wrap" :style="{ paddingTop: headerHeight + 'px' }">
    <scroll-view class="content" scroll-y="true">
      <view class="agreement-content">
        <text class="agreement-text">{{ agreementText }}</text>
      </view>
    </scroll-view>
    </view>
  </view>
</template>

<script>
import NavHeader from "@/components/NavHeader/NavHeader.vue";

export default {
  components: {
    NavHeader
  },
  data() {
    return {
      statusBarHeight: 0,
      agreementText: `用户服务协议

鉴于甲方运营微信小程序（以下简称"小程序"），为乙方提供餐饮、维修、保险、健康等专属收费服务；乙方自愿使用甲方提供的服务，为明确双方权利义务，根据《中华人民共和国民法典》《中华人民共和国个人信息保护法》等相关法律法规，甲乙双方本着平等、自愿、公平、诚实信用的原则，达成如下协议，以资共同遵守。

一、服务内容与范围
1.1 甲方通过小程序为乙方提供以下服务（具体服务详情以小程序内公示为准）：
1.餐饮服务：包括但不限于餐饮优惠套餐选购、定点合作商家就餐预约、专属餐食配送对接等收费服务；
2.维修服务：包括但不限于车辆维修保养套餐销售、优先维修预约、上门维修费用对接、维修机构推荐等收费服务；
3.保险服务：包括但不限于车辆保险、人身意外险等产品的投保咨询、保费缴纳协助、理赔协助等收费服务；
4.健康服务：包括但不限于司机专属健康体检套餐、健康咨询、职业病预防指导等收费服务。
1.2 甲方有权根据市场需求、业务发展等情况调整服务内容及收费项目，相关调整将通过小程序公告或短信提前通知乙方。乙方继续使用服务的，视为认可调整后的内容。

二、服务费用与支付
2.1 收费标准：本协议项下服务均为收费服务，具体收费标准、计费方式、服务明细均在小程序对应服务页面明确公示，乙方可自行查看并选择购买。
2.2 价格调整：甲方可根据市场行情、服务成本等因素调整收费标准，调整后将通过小程序公告提前7个自然日公示，公示期满后生效。
2.3 支付方式：乙方应通过小程序内指定支付渠道（如微信支付）支付费用，支付成功后视为订单确认，甲方依订单约定提供服务。
2.4 套餐续费：套餐类、周期类服务需一次性支付对应周期费用，乙方应在服务期满前按小程序提示续费，逾期未续费的，服务自动终止。

三、费用退还
3.1 因甲方原因（如无法提供约定服务、服务存在重大瑕疵无法补救）导致服务无法履行的，甲方应根据乙方未使用的服务内容或时长，退还相应费用。
3.2 因乙方自身原因（如主动放弃服务、不再需要服务）申请退款的，除小程序明确标注可退款情形外，甲方不予退还已收费用。
3.3 退款申请：乙方需通过小程序客服提交书面退款申请及相关证明材料，甲方在收到申请后7个工作日内完成审核，审核通过的，退款金额原路返还；审核不通过的，告知乙方具体原因。

四、乙方权利与义务
4.1 乙方权利：
1.要求甲方按协议及订单约定提供符合标准的服务；
2.监督服务质量，对服务问题提出改进建议；
3.查询、更正本人的个人信息及服务订单、支付记录；
4.符合退款条件时，申请退还相应服务费用；
5.按约定申请终止本协议。
4.2 乙方义务：
1.向甲方提供真实、准确、完整的个人信息及相关资料，不得提供虚假信息或隐瞒重要事实；
2.遵守国家法律法规及甲方发布的服务规则，不得利用服务从事违法违规、损害他人合法权益的活动；
3.妥善保管小程序账号、密码等身份信息，对账号下所有操作行为承担责任，发现账号泄露、被盗用应及时通知甲方；
4.按协议及小程序公示标准，及时、足额支付服务费用；
5.配合甲方完成服务必需的信息核验、服务对接等工作。

五、甲方权利与义务
5.1 甲方权利：
1.按协议及公示标准向乙方收取服务费用；
2.取得乙方明确同意后，收集、使用乙方个人信息（详见《隐私政策》）；
3.对乙方提供的信息进行必要核验，保障服务安全与合规；
4.乙方违约时，有权暂停或终止服务，并追究乙方相应责任；
5.提前公示后，调整服务内容、收费标准及服务规则。
5.2 甲方义务：
1.按协议及订单承诺，提供稳定、优质的各项服务；
2.在小程序显著位置公示收费标准、服务内容、退款规则等关键信息，保障乙方知情权；
3.严格保密乙方个人信息，不得泄露、篡改、非法出售或转让；
4.建立信息安全保障措施，保障乙方账号及信息安全；
5.设立客服通道，及时受理乙方咨询、投诉与建议，7个工作日内响应处理。

六、信息授权与保护
6.1 乙方知悉并同意，甲方为提供服务需收集、使用乙方相关个人信息，具体范围、方式、存储及保护措施详见《隐私政策》。《隐私政策》为本协议不可分割的组成部分，与本协议具有同等法律效力。
6.2 乙方有权随时撤回信息收集、使用的授权，但撤回后甲方可能无法继续提供部分或全部服务，由此产生的不利后果由乙方自行承担。

七、协议期限与终止
7.1 本协议自乙方点击小程序"同意"按钮之日起生效，有效期至一方按约定终止为止。
7.2 乙方可随时通过小程序客服提交协议终止申请，经甲方审核确认后，协议终止。终止后，乙方未使用完毕的服务可按退款条款申请退费。
7.3 乙方有下列情形之一的，甲方有权单方终止协议，无需承担违约责任：
1.提供虚假信息、伪造证明材料，影响服务开展的；
2.违反协议或甲方服务规则，经通知后限期未改正的；
3.利用服务从事违法违规活动的；
4.逾期支付费用超过15日，经催告仍未支付的；
5.其他严重损害甲方合法权益的行为。
7.4 因不可抗力、政策调整等不可归责于双方的原因导致协议无法履行的，协议自动终止，双方互不担责，甲方退还乙方未使用部分的服务费用。

八、违约责任
8.1 任何一方违反协议约定，给对方造成损失的，应承担全部赔偿责任（包括直接损失、维权产生的律师费、诉讼费等合理费用）。
8.2 甲方未按约定提供服务的，除退还相应费用外，还应按乙方已支付对应服务费用的10%支付违约金；违约金不足以弥补损失的，补足差额。
8.3 乙方未按时支付费用的，每逾期一日按逾期金额的0.5%支付违约金；逾期超过15日的，甲方有权终止协议并要求乙方赔偿损失。
8.4 乙方利用服务从事违法违规活动或损害第三方权益的，法律责任由乙方自行承担，给甲方造成损失的，乙方全额赔偿。

九、争议解决
因本协议签订、履行、解释产生的纠纷，双方应友好协商解决；协商不成的，任何一方均有权向甲方所在地有管辖权的人民法院提起诉讼。

十、其他
10.1 本协议未尽事宜，双方可另行签订补充协议，补充协议与本协议具有同等法律效力。
10.2 甲方通过小程序公告、短信发送的通知、公示，自发布或送达之日起生效，视为已履行告知义务，乙方应及时关注。
10.3 本协议条款被认定为无效或不可执行的，不影响其他条款的效力。`
    };
  },
  computed: {
    headerHeight() {
      return this.statusBarHeight + 44;
    },
  },
  onLoad() {
    const systemInfo = uni.getSystemInfoSync();
    this.statusBarHeight = systemInfo.statusBarHeight || 0;
  },
};
</script>

<style lang="scss" scoped>
.agreement-page {
  min-height: 100vh;
  background-color: #f5f5f5;
  display: flex;
  flex-direction: column;
}

.header-fixed-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: #f5f5f5;
}

.main-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.content {
  flex: 1;
  padding: 20rpx;
}

.agreement-content {
  background-color: #ffffff;
  border-radius: 20rpx;
  padding: 40rpx 30rpx;
  margin-bottom: 20rpx;
}

.agreement-text {
  font-size: 28rpx;
  line-height: 1.8;
  color: #333333;
  white-space: pre-wrap;
  word-break: break-all;
}
</style>