Skip to content

O
offical_web
Commit bbc399ce by wusiyi
Options

feat: 添加隐私政策、用户条款，联系我们

parent 0adde1fb
Showing with 401 additions and 20 deletions
src/components/footer.vue
...@@ -198,7 +198,7 @@ ...@@ -198,7 +198,7 @@
<p <p
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer" class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer"
@click="copy('19359109726')"> @click="copy('19359109726')">
<span class="mr-2">售前咨询电话:19359109726</span> <span class="mr-2">售前咨询电话: 19359109726</span>
<i class="el-icon-document-copy"></i> <i class="el-icon-document-copy"></i>
</p> </p>
</li> </li>
...@@ -213,8 +213,10 @@ ...@@ -213,8 +213,10 @@
<li> <li>
<p <p
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer" class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer"
@click="copy('广州市南沙区丰泽东路106号')"> @click="copy('广东省广州市番禺区金欧大道78号')">
<span class="mr-2">地址: 广州市南沙区丰泽东路106号</span> <span class="mr-2">
地址: 广东省广州市番禺区金欧大道78号
</span>
<i class="el-icon-document-copy"></i> <i class="el-icon-document-copy"></i>
</p> </p>
</li> </li>
...@@ -222,20 +224,13 @@ ...@@ -222,20 +224,13 @@
</div> </div>
</div> </div>
<div <div
class="overflow-hidden col-span-full border-t border-gray-700 border-solid"> class="overflow-hidden col-span-full border-t border-gray-700 border-solid text-xs flex flex-col">
<ul
class="flex flex-wrap justify-end -mr-3 lg:pt-8 hidden lg:flex"></ul>
<div class="hidden lg:block text-right">
<a
href="/after-sales-agreement"
target="_blank"
class="text-xs text-gray-400 text-white text-opacity-45 font-light">
售后协议
</a>
</div>
<div <div
class="text-xs text-center lg:text-right lg:mt-4 text-white text-opacity-45 font-light mt-4"> class="flex lg:flex-row flex-col items-center justify-center text-gray-400 text-opacity-45 font-light text-xs gap-5 my-3">
<span class="flex justify-center items-center md:justify-end"> <div class="flex items-center">Copyright ©2022</div>
<div class="flex items-center">九猫科技（广州）有限公司</div>
<div class="flex items-center">
<img <img
src="https://static.distributetop.com/office-site-new/office-site-upload/img/gongan.0c57706.png" src="https://static.distributetop.com/office-site-new/office-site-upload/img/gongan.0c57706.png"
class="w-5 h-5 mr-1" /> class="w-5 h-5 mr-1" />
...@@ -243,11 +238,30 @@ ...@@ -243,11 +238,30 @@
href="https://beian.miit.gov.cn" href="https://beian.miit.gov.cn"
target="_blank" target="_blank"
rel="noopener nofollow noreferrer" rel="noopener nofollow noreferrer"
static="true" static="true">
class="text-xs text-gray-400 text-white text-opacity-45 font-light">
粤ICP备2022141405号-1 粤ICP备2022141405号-1
</a> </a>
</span> </div>
</div>
<div class="flex justify-center gap-5">
<a
href="/after-sales-agreement"
target="_blank"
class="text-gray-400 text-white text-opacity-45 font-light">
售后协议
</a>
<a
href="/privacy-policy"
target="_blank"
class="text-gray-400 text-white text-opacity-45 font-light">
隐私政策
</a>
<a
href="/user-terms"
target="_blank"
class="text-gray-400 text-white text-opacity-45 font-light">
用户条款
</a>
</div> </div>
</div> </div>
</div> </div>
......
src/router/index.js
...@@ -157,6 +157,16 @@ const routes = [ ...@@ -157,6 +157,16 @@ const routes = [
name: 'after-sales-agreement', name: 'after-sales-agreement',
component: (resolve) => require(['../views/agreement'], resolve), component: (resolve) => require(['../views/agreement'], resolve),
}, },
{
path: '/privacy-policy',
name: 'privacy-policy',
component: (resolve) => require(['../views/privacy'], resolve),
},
{
path: '/user-terms',
name: 'user-terms',
component: (resolve) => require(['../views/terms'], resolve),
},
] ]
const router = new VueRouter({ const router = new VueRouter({
......
src/views/aboutus/aboutPage.vue
...@@ -90,14 +90,60 @@ ...@@ -90,14 +90,60 @@
<timeline /> <timeline />
</div> </div>
</div> </div>
<div class="w-full flex flex-col m-auto mt-20 py-10">
<h2 class="text-center fade-up-animation">联系我们</h2>
<div class="fade-up-animation flex lg:flex-row flex-col lg:px-20 px-5">
<div class="lg:w-1/2 w-full lg:ml-20">
<img
class="rounded-xl shadow-lg lg:w-3/4 w-full"
src="../../assets/images/about/map.png"
alt="map" />
</div>
<div
class="flex flex-col lg:w-1/2 w-full lg:py-20 py-10 gap-5 text-xs lg:text-base">
<div
class="flex items-center cursor-pointer"
@click="copy('广东省广州市番禺区金欧大道78号')">
<Icon
class="erp-function-item-icon lg:w-8 lg:h-8 w-5 h-5 mr-3"
icon="fluent:location-28-filled"
color="#1d5f97" />
<span>地址：广东省广州市番禺区金欧大道78号</span>
<i class="el-icon-document-copy ml-2"></i>
</div>
<div
class="flex items-center cursor-pointer"
@click="copy('19359109726')">
<Icon
class="erp-function-item-icon lg:w-8 lg:h-8 w-5 h-5 mr-3"
icon="line-md:phone-filled"
color="#1d5f97" />
<span>电话：19359109726</span>
<i class="el-icon-document-copy ml-2"></i>
</div>
<div
class="flex items-center cursor-pointer"
@click="copy('wangshuo@jomalls.com')">
<Icon
class="erp-function-item-icon lg:w-8 lg:h-8 w-5 h-5 mr-3"
icon="majesticons:mail"
color="#1d5f97" />
<span>邮箱：wangshuo@jomalls.com</span>
<i class="el-icon-document-copy ml-2"></i>
</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import { Icon } from '@iconify/vue2'
import Timeline from './timeline.vue' import Timeline from './timeline.vue'
export default { export default {
name: 'aboutUs', name: 'aboutUs',
components: { components: {
Timeline, Timeline,
Icon,
}, },
mounted() { mounted() {
// 初始化淡入上移动画 // 初始化淡入上移动画
...@@ -142,6 +188,23 @@ export default { ...@@ -142,6 +188,23 @@ export default {
}) })
this._animationObserver = observer this._animationObserver = observer
}, },
async copy(text) {
try {
// 优先使用 Clipboard API（现代浏览器）
await navigator.clipboard.writeText(text)
} catch (err) {
// 降级方案：使用 document.execCommand
const textarea = document.createElement('textarea')
textarea.value = text
document.body.appendChild(textarea)
textarea.focus()
textarea.select()
document.execCommand('copy')
document.body.removeChild(textarea)
} finally {
this.$message.success('复制成功')
}
},
}, },
} }
</script> </script>
......
src/views/agreement.vue
...@@ -275,6 +275,12 @@ ...@@ -275,6 +275,12 @@
</div> </div>
</template> </template>
<style scoped> <style scoped>
.article-header {
text-align: center;
margin-bottom: 10px;
font-size: 20px;
font-weight: bold;
}
.agreement { .agreement {
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
...@@ -292,7 +298,8 @@ ...@@ -292,7 +298,8 @@
.next_prev_wrap { .next_prev_wrap {
margin-bottom: 16px; margin-bottom: 16px;
} }
ul,li { ul,
li {
list-style: unset !important; list-style: unset !important;
margin: 0 20px !important; margin: 0 20px !important;
} }
......
src/views/privacy.vue 0 → 100644
<template>
<div class="agreement">
<article class="article">
<header class="article-header">
<h2>隐私政策</h2>
</header>
<div class="article-content">
<div class="original-content">
<h3 class="text-center"><strong>前言</strong></h3>
<p class="indent">
我们深知个人信息对您的重要性，并会尽全力保护您的个人信息安全可靠。我们致力于维持您对我们的信任，恪守权责一致、目的明确、选择同意、最少够用、确保安全、主体参与、公开透明等原则，并采取相应的安全保护措施，尽力保护您的个人信息安全。
</p>
<p class="indent">
请在使用我们的产品或服务前，仔细阅读并理解本《隐私政策》的全部内容。一旦您使用或继续使用我们的产品或服务，即表示您同意我们按照本政策收集、使用、存储和共享您的相关信息。
</p>
<h3><strong>一、我们如何收集和使用您的个人信息</strong></h3>
<p class="indent">
个人信息是指以电子或者其他方式记录的与已识别或者可识别的自然人有关的各种信息。我们仅会出于本政策所述的以下目的，收集和使用您的个人信息：
</p>
<ol class="list-paddingleft-2">
<li>
<strong>账号注册与登录：</strong>
当您注册或登录账号时，我们可能收集您的手机号码、电子邮箱、用户名、密码等，用于创建账号、身份验证及账号安全保护。
</li>
<li>
<strong>产品与服务的提供：</strong>
为向您提供订购、咨询、售后等服务，我们可能收集您的姓名、联系方式、收货地址、订单信息、支付信息等。
</li>
<li>
<strong>改善产品与服务：</strong>
我们可能收集设备信息、日志信息、浏览与操作行为等，用于分析产品使用情况、优化服务体验及保障系统安全。
</li>
<li>
<strong>客服与争议处理：</strong>
当您联系客服或我们处理争议时，我们可能保存您的联系方式、沟通记录及相关证明材料。
</li>
<li>
<strong>法律与合规：</strong>
为遵守法律法规或响应有权机关要求，我们可能在法律允许的范围内收集、使用或披露您的个人信息。
</li>
</ol>
<p class="indent">
如我们拟将您的个人信息用于本政策未载明的其他用途，我们将事先征求您的同意。
</p>
<h3><strong>二、我们如何使用 Cookie 和同类技术</strong></h3>
<p class="indent">
为使您获得更便捷的访问体验，我们可能会使用
Cookie、本地存储等同类技术来收集、存储您的设备与使用信息。您可根据自己的偏好管理或删除
Cookie；但请注意，关闭或清除 Cookie
可能影响您使用我们部分功能或服务。
</p>
<h3><strong>三、我们如何共享、转让、公开披露您的个人信息</strong></h3>
<ol class="list-paddingleft-2">
<li>
<strong>共享：</strong>
我们不会与第三方共享您的个人信息，除非：经您明确同意；根据法律法规或政府主管部门要求；与我们的关联方、授权合作伙伴（如物流、支付机构）共享，且我们要求其严格遵循本政策及相关法律要求。
</li>
<li>
<strong>转让：</strong>
我们不会将您的个人信息转让给任何公司、组织或个人，但以下情况除外：在获取明确同意的情况下；在涉及合并、收购或破产清算时，如涉及个人信息转让，我们会要求新的持有您个人信息的公司、组织继续受本政策约束。
</li>
<li>
<strong>公开披露：</strong>
我们仅会在获得您明确同意或基于法律的明确规定、诉讼争议解决需要、保护您或其他用户的人身与财产安全等必要情形下，公开披露您的个人信息。
</li>
</ol>
<h3><strong>四、我们如何保护您的个人信息</strong></h3>
<p class="indent">
我们采取业界标准的安全技术和管理措施，防止个人信息遭到未经授权的访问、使用、修改、泄露或丢失，包括但不限于：数据加密、访问控制、安全审计、安全培训等。若发生个人信息安全事件，我们将按照法律法规的要求，及时向您告知事件相关情况、可能的影响、我们已采取或将要采取的措施等，并按要求向有关主管部门报告。
</p>
<h3><strong>五、您如何管理您的个人信息</strong></h3>
<p class="indent">
我们非常重视您对个人信息的关注。按照适用的法律，您有权：
</p>
<ul class="list-paddingleft-2">
<li>查询、更正或补充您的个人信息；</li>
<li>删除您的个人信息（在法律允许的范围内）；</li>
<li>改变您授权同意的范围或撤回同意；</li>
<li>注销您的账号；</li>
<li>获取您的个人信息副本；</li>
<li>要求我们解释个人信息的处理规则。</li>
</ul>
<p class="indent">
您可以通过账号设置、联系客服等方式行使上述权利。我们将在法律法规规定的期限内响应您的请求。
</p>
<h3><strong>六、我们如何存储您的个人信息</strong></h3>
<p class="indent">
我们在中华人民共和国境内收集和产生的个人信息，将存储在中国境内。除法律另有规定或经您明确同意外，我们不会将您的个人信息传输至境外。我们仅在为实现目的所必需的期限内保留您的个人信息，超出期限后将进行删除或匿名化处理，法律另有规定的除外。
</p>
<h3><strong>七、未成年人保护</strong></h3>
<p class="indent">
我们的产品与服务主要面向成年人。如您为未成年人，请在监护人陪同下阅读本政策，并在取得监护人同意后使用我们的产品或服务。我们不会主动收集未成年人的个人信息；如发现我们在未事先获得监护人同意的情况下收集了未成年人的个人信息，我们将尽快删除相关数据。
</p>
<h3><strong>八、本政策如何更新</strong></h3>
<p class="indent">
我们可能适时修订本《隐私政策》。如发生重大变更，我们将在网站、应用程序等显著位置发布更新版本，并以适当方式提醒您。若您继续使用我们的产品或服务，即表示您接受更新后的政策。我们建议您定期查阅本政策以了解最新内容。
</p>
<h3><strong>九、如何联系我们</strong></h3>
<p class="indent">
如您对本《隐私政策》或您的个人信息相关事宜有任何疑问、意见或建议，您可通过我们网站公示的客服电话、在线客服、电子邮件等方式与我们联系。我们将在收到您的反馈后尽快答复。
</p>
<p class="indent mt">感谢您信任并使用我们的产品与服务。</p>
</div>
</div>
</article>
</div>
</template>
<style scoped>
.article-header {
text-align: center;
margin-bottom: 10px;
font-size: 20px;
font-weight: bold;
}
.agreement {
width: 1200px;
margin: 0 auto;
padding: 20px;
}
.article-content {
line-height: 1.8em;
font-size: 16px;
padding-bottom: 50px;
}
.original-content {
margin-bottom: 10px;
}
.text-center {
text-align: center;
}
.indent {
text-indent: 2em;
}
.mt {
margin-top: 1.5em;
}
.list-paddingleft-2 {
margin-bottom: 16px;
}
ul,
li {
list-style: unset !important;
margin: 0 20px !important;
}
</style>
src/views/terms.vue 0 → 100644
<template>
<div class="agreement">
<article class="article">
<header class="article-header">
<h2>用户条款</h2>
</header>
<div class="article-content">
<div class="original-content">
<h3 class="text-center"><strong>前言</strong></h3>
<p class="indent">
欢迎使用我们的产品与服务。在使用前，请您务必仔细阅读并充分理解本《用户条款》（以下简称“本条款”）的全部内容。本条款是您与我们之间关于使用我们提供的网站、应用程序、产品及服务（以下统称“服务”）所订立的协议。一旦您注册、登录、使用或继续使用我们的服务，即视为您已阅读、理解并同意接受本条款的约束。
</p>
<p class="indent">
如您不同意本条款的任何内容，请立即停止使用我们的服务。我们有权根据需要适时修订本条款，修订后的条款将在相关页面公布，若您继续使用服务，即视为接受修订后的条款。
</p>
<h3><strong>一、服务说明</strong></h3>
<p class="indent">
我们向您提供包括但不限于信息浏览、账号注册与登录、产品展示与订购、在线咨询、售后支持等服务。服务的具体内容、范围及使用规则以我们实际提供及平台公示为准。我们保留根据业务发展需要调整、变更、中断或终止部分或全部服务的权利，并将尽可能提前通知您。
</p>
<h3><strong>二、账号注册与使用</strong></h3>
<ol class="list-paddingleft-2">
<li>
<strong>注册资格：</strong>
您应当具有完全民事行为能力。若您为无民事行为能力人或限制民事行为能力人，请在监护人同意的前提下使用我们的服务。
</li>
<li>
<strong>账号安全：</strong>
您应提供真实、准确、完整、合法有效的注册信息，并负责保管账号与密码。因您保管不善、主动泄露或遭受他人攻击、诈骗等导致的账号被盗、信息泄露或财产损失，由您自行承担责任。
</li>
<li>
<strong>账号规范：</strong>
您不得将账号出借、转让、出租或以其他方式供他人使用。如我们发现上述行为或账号存在异常使用情况，有权暂停或终止向该账号提供服务。
</li>
</ol>
<h3><strong>三、用户行为规范</strong></h3>
<p class="indent">
在使用我们的服务时，您应遵守中华人民共和国相关法律法规，并承诺不会从事以下行为：
</p>
<ul class="list-paddingleft-2">
<li>发布、传播违反法律法规、公序良俗或侵犯他人合法权益的内容；</li>
<li>利用我们的服务从事欺诈、传销、洗钱等违法活动；</li>
<li>干扰、破坏或试图未经授权访问我们的系统、网络或数据；</li>
<li>利用技术手段批量注册、刷量、作弊或干扰正常经营秩序；</li>
<li>侵犯我们或第三方的知识产权、商业秘密或其他合法权益；</li>
<li>
其他我们合理认为不当或损害我们、其他用户或第三方利益的行为。
</li>
</ul>
<p class="indent">
如我们发现您存在上述行为，有权根据情节采取警告、限制功能、冻结或注销账号、追究法律责任等措施，且不退还您已支付的费用（如有）。
</p>
<h3><strong>四、知识产权</strong></h3>
<p class="indent">
我们服务中所包含的商标、标识、版面设计、文本、图片、图形、软件等内容的著作权、商标权及其他知识产权，除另有约定外，均归我们或相关权利人所有。未经我们或权利人书面同意，您不得擅自使用、修改、复制、传播或用于商业目的。您在使用服务过程中提交、上传的内容，您应确保拥有相应权利或已获授权；您授予我们在提供服务所必需的范围内使用该内容的非独占、可转授权、免费的许可。
</p>
<h3><strong>五、订单与支付</strong></h3>
<p class="indent">
您通过我们平台提交的订单，在您成功支付或我们确认接受之前，不构成我们对您的承诺。价格、库存、配送等信息以订单确认页及我们实际履行情况为准。您应按照我们公示的支付方式及规则完成支付；因您自身原因（如余额不足、支付超时、信息错误等）导致的订单未完成，由您自行承担责任。关于退款、取消订单等规则，以我们公示的售后政策或具体订单约定为准。
</p>
<h3><strong>六、免责声明</strong></h3>
<p class="indent">
在法律允许的范围内，我们对以下情形不承担责任：因不可抗力、政府行为、网络故障、黑客攻击、病毒等我们无法控制的原因导致的服务中断、延迟或数据丢失；因您自身设备、网络或操作不当导致无法正常使用服务；因您违反本条款或法律法规导致的任何后果；因第三方（如支付机构、物流方）原因导致的纠纷或损失。我们仅在法律规定的范围内承担相应责任。
</p>
<h3><strong>七、隐私与个人信息</strong></h3>
<p class="indent">
我们重视您的个人信息保护。关于我们如何收集、使用、存储、共享及保护您的个人信息，请详见我们另行公布的《隐私政策》。《隐私政策》构成本条款的有效组成部分。
</p>
<h3><strong>八、条款的变更与终止</strong></h3>
<p class="indent">
我们可能适时修订本条款。如发生重大变更，我们将在网站或应用程序等显著位置公布修订后的条款。若您继续使用服务，即表示您接受修订后的条款。您有权随时停止使用服务并注销账号；我们亦可能因业务调整、合规要求等原因暂停或终止向您提供部分或全部服务，我们将尽可能提前通知您。
</p>
<h3><strong>九、争议解决</strong></h3>
<p class="indent">
本条款的订立、履行、解释及争议解决均适用中华人民共和国法律（不包括冲突法）。因本条款或使用我们服务所产生的任何争议，双方应尽量友好协商解决；协商不成的，任何一方可将争议提交我们住所地有管辖权的人民法院诉讼解决。
</p>
<h3><strong>十、其他</strong></h3>
<p class="indent">
本条款的任何条款无论因何种原因无效或不可执行，其余条款仍有效。本条款未约定的事项，以我们另行公示的规则或与您达成的补充协议为准。如您对本条款有任何疑问，请通过我们网站公示的客服渠道与我们联系。
</p>
<p class="indent mt">感谢您选择并使用我们的服务。</p>
</div>
</div>
</article>
</div>
</template>
<style scoped>
.article-header {
text-align: center;
margin-bottom: 10px;
font-size: 20px;
font-weight: bold;
}
.agreement {
width: 1200px;
margin: 0 auto;
padding: 20px;
}
.article-content {
line-height: 1.8em;
font-size: 16px;
padding-bottom: 50px;
}
.original-content {
margin-bottom: 10px;
}
.text-center {
text-align: center;
}
.indent {
text-indent: 2em;
}
.mt {
margin-top: 1.5em;
}
.list-paddingleft-2 {
margin-bottom: 16px;
}
ul,
li {
list-style: unset !important;
margin: 0 20px !important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment