```

feat(router): 添加协议页面路由并重构订单确认页面

新增协议页面路由配置，将服务协议和知识产权保护协议相关文本
移至独立的agreement模块，并为协议链接添加跳转功能，使用户可以
点击协议名称查看具体内容。

BREAKING CHANGE: 协议相关国际化文本位置发生变更
```

src/locales/en.js

@@ -302,10 +302,12 @@ export default {
     payVoucher:'Payment Voucher',
     totalPrice:'Total Price',
     payAmount:'Pay Amount',
-    serviceAgreement:'AI Learning Forum Service Agreement',
-    IntellectualAgreement:'AI Learning Forum Intellectual Property Protection Agreement',
     pleaseAgreeAgreement:'Please agree to the agreement',
     pleaseInputAmount:'Please input amount',
     pleaseUploadVoucher:'Please upload payment voucher',
+  },
+  agreement:{
+    serviceAgreement:'AI Learning Forum Service Agreement',
+    IntellectualAgreement:'AI Learning Forum Intellectual Property Protection Agreement',
   }
 }

src/locales/zh-CN.js

@@ -306,11 +306,13 @@ export default {
     payVoucher:'付款凭证',
     totalPrice:'总价',
     payAmount:'需付金额',
-    serviceAgreement:'AI学习论坛服务协议',
-    IntellectualAgreement:'AI学习论坛知识产权保护协议',
     pleaseAgreeAgreement:'请先同意协议',
     pleaseInputAmount:'请输入金额',
     pleaseUploadVoucher:'请上传转账凭证',
+  },
+  agreement:{
+    serviceAgreement:'AI学习论坛服务协议',
+    IntellectualAgreement:'AI学习论坛知识产权保护协议',
   }
 
 }

src/pages/Agreement.vue

@@ -0,0 +1,35 @@
+<template>
+  <el-button class="mt20 mb20" @click="router.back()">
+    <el-icon><ArrowLeft /></el-icon>
+    <span>{{$t('common.back')}}</span>
+  </el-button>
+  <div class="padding16 bg_color_fff border_radius_10 box_shadow_card">
+    <div class="mb-20 bold font_size32 flex-center">{{$t('agreement.' + type)}}</div>
+    <div class="font_size16 ql-container">
+      <div class="ql-editor">
+        <div v-html="agreementContent"></div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { getAgreementType } from '@/api/common.js'
+import { useRoute, useRouter } from 'vue-router'
+import { ref,onMounted } from 'vue'
+
+const route = useRoute()
+const router = useRouter()
+const type = route.query.type || '';
+const agreementContent = ref('');
+
+onMounted(() => {
+  getAgreementTypeFn();
+});
+
+const getAgreementTypeFn = () => {
+  getAgreementType({agreementType: type}).then(res => {
+    console.log(res)
+    agreementContent.value = res.data.content || '';
+  })
+};
+</script>

src/pages/order/orderConfirm.vue

@@ -192,7 +192,9 @@
       <!-- <div class="mt20 font_size14">录播和体验课课程属于虚拟商品，购买后无特殊原因，不支持退款</div> -->
       <div class="mt20 gap10 cursor-pointer" @click="agreement = !agreement">
         <div class="checkType" :class="{'active': agreement}"></div>
-        {{$t('common.readAndAgree')}} <span class="color_theme bold">《{{$t('orderConfirm.serviceAgreement')}}》</span> 和 <span class="color_theme bold">《{{$t('orderConfirm.IntellectualAgreement')}}》</span>
+        {{$t('common.readAndAgree')}} 
+        <span class="color_theme bold" @click="router.push({name:'Agreement',query:{type:'serviceAgreement'}})">《{{$t('agreement.serviceAgreement')}}》</span> 和
+         <span class="color_theme bold" @click="router.push({name:'Agreement',query:{type:'IntellectualAgreement'}})">《{{$t('agreement.IntellectualAgreement')}}》</span> 
       </div>
     </div>
   </div>

src/router/index.js

@@ -173,6 +173,14 @@ const routes = [
     name:'Member',
     component: () => import('@/pages/Member.vue')
   },
+  {
+    path: '/agreement',
+    name: 'Agreement',
+    component: () => import('@/pages/Agreement.vue'),
+    meta: { title: 'common.agreement' }
+  },
+
+