兼容移动端样式

src/router/modules/remaining.js

@@ -1,6 +1,6 @@
 import common from './common'
 import recruit from './recruit'
-import Layout from '@/layout'
+// import Layout from '@/layout'
 import { setLoginType } from '@/utils/loginType'
 
 
@@ -61,7 +61,6 @@ const remainingRouter = [
   },
   {
     path: '/userAgreement',
-    component: Layout,
     name: 'userAgreement',
     children: [
       {
@@ -75,7 +74,6 @@ const remainingRouter = [
   },
   {
     path: '/privacyPolicy',
-    component: Layout,
     name: 'privacyPolicy',
     children: [
       {
@@ -89,7 +87,6 @@ const remainingRouter = [
   },
   {
     path: '/UserBehaviorNorms',
-    component: Layout,
     name: 'UserBehaviorNorms',
     children: [
       {
@@ -103,7 +100,6 @@ const remainingRouter = [
   },
   {
     path: '/WorkplaceCommunityPolicy',
-    component: Layout,
     name: 'WorkplaceCommunityPolicy',
     children: [
       {
@@ -117,7 +113,6 @@ const remainingRouter = [
   },
   {
     path: '/CopyrightPolicy',
-    component: Layout,
     name: 'CopyrightPolicy',
     children: [
       {

src/styles/protocol/index.scss

@@ -51,6 +51,7 @@ del,ins,u,s,a,a:hover {
 .conter,.conttle {
   width: 100%;
   overflow: hidden;
+  background-color: var(--default-bgc);
 }
 
 .large {
@@ -67,6 +68,14 @@ del,ins,u,s,a,a:hover {
   box-sizing: border-box;
   font-family: "微软雅黑";
 }
+.mobileProtocol {
+  width: 100%;
+  margin: 0 auto;
+  background-color: #fff;
+  padding: 5% 5% 15px;
+  box-sizing: border-box;
+  font-family: "微软雅黑";
+}
 
 .Protocol p {
   color: var(--color-333);
@@ -78,7 +87,7 @@ del,ins,u,s,a,a:hover {
   width: 100%;
   font-size: 22px;
   color: var(--color-333);
-  margin-top: 45px;
+  // margin-top: 45px;
   margin-bottom: 32px;
   font-weight: 700;
   text-align: center;

src/views/login/components/CopyrightPolicy.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="conter">
-    <div class="Protocol">
+    <div :class="isMobile ? 'mobileProtocol': 'Protocol'">
+      <v-btn size="large" color="primary" variant="text" prepend-icon="mdi-chevron-triple-left" @click="router.go(-1)">返回上一页</v-btn>
       <h1 class="segment">版权政策</h1>
       <p class="text-color"><span class="text-font">苏州识喜识谊信息科技有限公司（以下称“门墩儿网站”、“本网站”）尊重他人的知识产权，志在提供内容不侵犯他人知识产权的网站。根据《中华人民共和国著作权法》、《信息网络传播权保护条例》、《互联网著作权行政保护办法》等相关法律、法规的规定，门墩儿网站针对网络侵权采取如下版权政策：</span></p>
       <p class="text-color"><span class="text-font">1. 本网站对网络版权保护尽合理、审慎的义务，在有理由确信存在明显侵犯任何第三人版权的作品时，有权不事先通知并随时删除该涉嫌侵权作品；</span></p>
@@ -31,6 +32,16 @@
   </div>
 </template>
 
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const isMobile = ref(false)
+onMounted(() => {
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
+})
+</script>
+
 <style scoped lang="scss">
 @import url('../../../styles/protocol/index.scss');
 </style>

src/views/login/components/UserBehaviorNorms.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="conter">
-    <div class="Protocol">
+    <div :class="isMobile ? 'mobileProtocol': 'Protocol'">
+      <v-btn size="large" color="primary" variant="text" prepend-icon="mdi-chevron-triple-left" @click="router.go(-1)">返回上一页</v-btn>
       <h1 class="segment">用户行为规范</h1>
       <h2 class="subtitle text-size"><span class="text-font">一、前言</span></h2>
       <p class="text-color"><span class="text-font">《用户行为规范》（以下简称“本规范”）适用门墩儿招聘所有用户，是《门墩儿招聘用户服务协议》的重要组成部分，两者具有同等法律效力，用户同意或使用门墩儿招聘服务（即《门墩儿招聘用户协议》所提及的门墩儿招聘网页（www.menduner.com）、移动客户端（包括IOS、安卓及已有或未来将新增的任何其他移动客户端）等各类平台或媒介的服务，以下简称“本服务”）的行为即视为同意受到本规范的约束。本协议术语及定义与《门墩儿招聘用户协议》一致。
@@ -97,6 +98,16 @@
   </div>
 </template>
 
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const isMobile = ref(false)
+onMounted(() => {
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
+})
+</script>
+
 <style scoped lang="scss">
 @import url('../../../styles/protocol/index.scss');
 </style>

src/views/login/components/WorkplaceCommunityPolicy.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="conter">
-    <div class="Protocol">
+    <div :class="isMobile ? 'mobileProtocol': 'Protocol'">
+      <v-btn size="large" color="primary" variant="text" prepend-icon="mdi-chevron-triple-left" @click="router.go(-1)">返回上一页</v-btn>
       <h1 class="segment">职场社区政策</h1>
       <p class="text-color"><span class="text-font">我们将竭诚为会员提供专业的“服务”，为更好提供服务，我们制定此职场社区政策。职场社区政策旨在规范何种行为在社区是被允许的，何种行为在社区是被禁止的。您在使用本网站服务时，应该遵守此规定。</span></p>
       <h2 class="subtitle text-size"><span class="text-font">1. 个人资料</span></h2>
@@ -22,6 +23,16 @@
   </div>
 </template>
 
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const isMobile = ref(false)
+onMounted(() => {
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
+})
+</script>
+
 <style scoped lang="scss">
 @import url('../../../styles/protocol/index.scss');
 </style>

src/views/login/components/privacyPolicy.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="conter">
-    <div class="Protocol">
+    <div :class="isMobile ? 'mobileProtocol': 'Protocol'">
+      <v-btn size="large" color="primary" variant="text" prepend-icon="mdi-chevron-triple-left" @click="router.go(-1)">返回上一页</v-btn>
       <h1 class="segment">隐私政策</h1>
       <h2 class="subtitle text-size"><span class="text-font">引言</span></h2>
       <p class="text-color"><span class="text-font">苏州识喜识谊信息科技有限公司（“识喜识谊”、“我们”、“我们的”）尊重您的隐私，致力于保护您在使用我们的网站www.menduner.com、企业公众服务号、小程序、其他线上产品和服务（“网站”）、在您注册网站会员时、或在您以其他方式与我们互动时，提供给我们、或我们收集的属于您的个人信息的隐私性、保密性和安全性。</span></p>
@@ -45,6 +46,16 @@
     </div>
   </div>
 </template>
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router';const router = useRouter()
+
+const isMobile = ref(false)
+onMounted(() => {
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
+})
+</script>
 
 <style scoped lang="scss">
 @import url('../../../styles/protocol/index.scss');

src/views/login/components/userAgreement.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="conter">
-    <div class="Protocol">
+    <div :class="isMobile ? 'mobileProtocol': 'Protocol'">
+      <v-btn size="large" color="primary" variant="text" prepend-icon="mdi-chevron-triple-left" @click="router.go(-1)">返回上一页</v-btn>
       <h1 class="segment">用户协议</h1>
       <h2 class="subtitle text-size"><span class="text-font">1.引言</span></h2>
       <p class="text-color"><span class="text-font">1.1苏州识喜识谊信息科技有限公司同意按照本协议的规定及其不时发布的操作规则提供门墩儿网站，小程序（www.menduner.com）（以下称“本网站”或“我们”）网络服务，为获得网络服务，服务使用人（以下称“用户”或“您”，包括酒店管理者及相关从业人员、企业用户等）应当同意本协议的全部条款并按照页面上的提示完成全部的注册程序。用户在进行注册程序过程中勾选“我已阅读并同意”选项表示您完全接受并遵守本用户协议项下的全部条款，请您务必仔细阅读，充分理解协议的条款内容后再点击同意确认，您点击同意后即视为已接受本用户协议为构成对双方具有约束力的法律文件。</span></p>
@@ -73,6 +74,16 @@
   </div>
 </template>
 
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const isMobile = ref(false)
+onMounted(() => {
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
+})
+</script>
+
 <style scoped lang="scss">
 @import url('../../../styles/protocol/index.scss');
 </style>