mirror of
https://github.com/kuaifan/dootask.git
synced 2026-04-20 11:28:07 +00:00
feat：新增推广页
This commit is contained in:
gwokwong
parent
620465d62a
commit
8c8c5b04d5
329
public/site/css/about.css
vendored
329
public/site/css/about.css
vendored
@ -1,205 +1,206 @@
|
||||
/* 头部样式 */
|
||||
.about_green_bg{
|
||||
background: var(--bg-11-url) top right no-repeat;
|
||||
.about_green_bg {
|
||||
background: var(--bg-11-url) top right no-repeat;
|
||||
}
|
||||
.head{
|
||||
background-color: transparent !important;
|
||||
.head {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.company-ul{
|
||||
padding: 32px 0;
|
||||
margin-top: 32px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
background: var(--bg-fa-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
z-index: 2;
|
||||
.company-ul {
|
||||
padding: 32px 0;
|
||||
margin-top: 32px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
background: var(--bg-fa-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
z-index: 2;
|
||||
}
|
||||
.company-ul-item{
|
||||
text-align: center;
|
||||
padding: 0 32px;
|
||||
width: 362px;
|
||||
.company-ul-item {
|
||||
text-align: center;
|
||||
padding: 0 32px;
|
||||
width: 362px;
|
||||
}
|
||||
.company-ul-item:nth-of-type(1),.company-ul-item:nth-of-type(2){
|
||||
border-right: 1px solid var(--border-color);
|
||||
.company-ul-item:nth-of-type(1),
|
||||
.company-ul-item:nth-of-type(2) {
|
||||
border-right: 1px solid var(--border-color);
|
||||
}
|
||||
.company-h2{
|
||||
color: var(--text-color);
|
||||
opacity: 0.5;
|
||||
.company-h2 {
|
||||
color: var(--text-color);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.company-h6{
|
||||
color: var(--txt-gray-color);
|
||||
.company-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.company-sup{
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
margin-left: 5px;
|
||||
color: var(--txt-gray-color);
|
||||
vertical-align: super;
|
||||
.company-sup {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
margin-left: 5px;
|
||||
color: var(--txt-gray-color);
|
||||
vertical-align: super;
|
||||
}
|
||||
.company-profile{
|
||||
padding-top: 120px;
|
||||
.company-profile {
|
||||
padding-top: 120px;
|
||||
}
|
||||
.company-profile-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
.company-profile-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.company-profile-layout{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 120px;
|
||||
.company-profile-layout {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
.company-profile-l{
|
||||
display: inline-block;
|
||||
height: auto;
|
||||
width: 580px;
|
||||
.company-profile-l {
|
||||
display: inline-block;
|
||||
height: auto;
|
||||
width: 580px;
|
||||
}
|
||||
.company-profile-r{
|
||||
width: 620px;
|
||||
.company-profile-r {
|
||||
width: 620px;
|
||||
}
|
||||
.company-profile-h1{
|
||||
position: relative;
|
||||
color: var(--text-color);
|
||||
width: fit-content;
|
||||
.company-profile-h1 {
|
||||
position: relative;
|
||||
color: var(--text-color);
|
||||
width: fit-content;
|
||||
}
|
||||
.company-profile-arcs{
|
||||
display: block;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: -28px;
|
||||
left: 0;
|
||||
.company-profile-arcs {
|
||||
display: block;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: -28px;
|
||||
left: 0;
|
||||
}
|
||||
.company-profile-h6{
|
||||
color: var(--txt-gray-color);
|
||||
.company-profile-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.company-year,.company-area,.company-size{
|
||||
|
||||
.company-year,
|
||||
.company-area,
|
||||
.company-size {
|
||||
}
|
||||
@keyframes randomize {
|
||||
from {
|
||||
content: attr(data-value); /* 使用 data-value 属性作为初始值 */
|
||||
}
|
||||
to {
|
||||
content: attr(data-random); /* 使用 data-random 属性作为随机值 */
|
||||
}
|
||||
from {
|
||||
content: attr(data-value); /* 使用 data-value 属性作为初始值 */
|
||||
}
|
||||
to {
|
||||
content: attr(data-random); /* 使用 data-random 属性作为随机值 */
|
||||
}
|
||||
}
|
||||
.scenario-app{
|
||||
position: relative;
|
||||
padding: 120px 0px;
|
||||
background-color: var(--bg-fa-color);
|
||||
.scenario-app {
|
||||
position: relative;
|
||||
padding: 120px 0px;
|
||||
background-color: var(--bg-fa-color);
|
||||
}
|
||||
.scenario-app-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
.scenario-app-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.scenario-app-h1{
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
.scenario-app-h1 {
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.scenario-app-h6{
|
||||
color: var(--txt-gray-color);
|
||||
.scenario-app-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.scenario-app-ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.scenario-app-ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.scenario-app-ul-item{
|
||||
padding: 24px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
width: 576px;
|
||||
height: 225px;
|
||||
position: relative;
|
||||
transition: all .3s ease-in-out;
|
||||
.scenario-app-ul-item {
|
||||
padding: 24px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
width: 576px;
|
||||
height: 225px;
|
||||
position: relative;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.scenario-app-ul-item:hover{
|
||||
transform: translateY(-16px);
|
||||
.scenario-app-ul-item:hover {
|
||||
transform: translateY(-16px);
|
||||
}
|
||||
.scenario-app-ul-item-svg{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
.scenario-app-ul-item-svg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
.scenario-app-icon-bg{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 16px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--txt-theme-color);
|
||||
.scenario-app-icon-bg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 16px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--txt-theme-color);
|
||||
}
|
||||
.scenario-app-icon{
|
||||
display: inline-block;
|
||||
|
||||
.scenario-app-icon {
|
||||
display: inline-block;
|
||||
}
|
||||
.scenario-app-h5{
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 25px;
|
||||
color: var(--txt-191a15-color);
|
||||
.scenario-app-h5 {
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 25px;
|
||||
color: var(--txt-191a15-color);
|
||||
}
|
||||
.from-submit{
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
.from-submit {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
/* 底部样式 */
|
||||
.footer-layut{
|
||||
border-top: var(--border-color) solid 1px;
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
/* 弹框样式 */
|
||||
.BulletBox{
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
padding: 8px;
|
||||
background-color: var(--txt-theme-color);
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
.BulletBox {
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
padding: 8px;
|
||||
background-color: var(--txt-theme-color);
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
}
|
||||
#desc_wrap{
|
||||
position: relative;
|
||||
#desc_wrap {
|
||||
position: relative;
|
||||
}
|
||||
#characterCount{
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
bottom: 7px;
|
||||
z-index:999;
|
||||
color: #ccc;
|
||||
#characterCount {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
bottom: 7px;
|
||||
z-index: 999;
|
||||
color: #ccc;
|
||||
}
|
||||
#loadingWrap{
|
||||
position: relative;
|
||||
#loadingWrap {
|
||||
position: relative;
|
||||
}
|
||||
#submitLoading{
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 42%;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
animation: spin 3s infinite linear;
|
||||
#submitLoading {
|
||||
position: absolute;
|
||||
display: none;
|
||||
left: 42%;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
animation: spin 3s infinite linear;
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
440
public/site/css/ad.css
vendored
Normal file
440
public/site/css/ad.css
vendored
Normal file
@ -0,0 +1,440 @@
|
||||
.ad-wrapper {
|
||||
color: #441726;
|
||||
}
|
||||
|
||||
.ad-wrapper #ad-banner {
|
||||
background-image: url(../img/ad/banner.png);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
header .ad {
|
||||
width: 100vw;
|
||||
height: 0;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
header .ad .ad-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
padding: 0 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-content-left {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-right: 32px;
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-close {
|
||||
position: absolute;
|
||||
right: 24px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 50%;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
transition: all 0.3s;
|
||||
}
|
||||
header .ad .ad-content .ad-close:hover {
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-close img {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-content-left .ad-text {
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: #441726;
|
||||
font-family: Lexend;
|
||||
margin-right: 16px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-content-left .ad-btn {
|
||||
height: 36px;
|
||||
min-width: 72px;
|
||||
background: linear-gradient(
|
||||
104.43deg,
|
||||
#fc8c80 1.18%,
|
||||
#f3596e 46.98%,
|
||||
#ee61d4 93.24%
|
||||
);
|
||||
padding: 8px 16px 8px 16px;
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
font-family: Lexend;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
footer.ad-footer {
|
||||
background-color: #1d0f14;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer.ad-footer .dootask {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer.ad-footer .footer-layout {
|
||||
border-top-color: transparent;
|
||||
}
|
||||
|
||||
.ad-wrapper .arcs {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
left: 0;
|
||||
top: 60px;
|
||||
z-index: -1;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .topics-h1-green {
|
||||
color: #f3474c;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .btn-primary {
|
||||
background: linear-gradient(
|
||||
104.43deg,
|
||||
#ff7155 1.18%,
|
||||
#ef3e56 46.98%,
|
||||
#ee61d4 93.24%
|
||||
);
|
||||
box-shadow: 0px 3px 6px 0px #ff010133;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .topics-btn {
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .topics-btn .btn {
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .btn-primary:hover {
|
||||
background: linear-gradient(
|
||||
-104.43deg,
|
||||
#ff7155 1.18%,
|
||||
#ef3e56 46.98%,
|
||||
#ee61d4 93.24%
|
||||
);
|
||||
border: 1px solid #f3474c;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .btn-default {
|
||||
color: #f3474c;
|
||||
background-color: #fff;
|
||||
border: 1px solid #f3474c;
|
||||
box-shadow: 0px 3px 6px 0px #ff010133;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.ad-wrapper .topics .btn-default:hover {
|
||||
background-color: #f3474c;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.ad-wrapper main {
|
||||
background-image: url(../img/ad/plan.png);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.ad-plan,
|
||||
.ad-intro {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.section-wrapper {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 96px 0 64px;
|
||||
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.section-wrapper .section-title {
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: #441726;
|
||||
}
|
||||
|
||||
.section-wrapper .section-description {
|
||||
font-size: 16px;
|
||||
color: #441726;
|
||||
}
|
||||
|
||||
.section-wrapper .section-content {
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
||||
.ad-plan .section-content {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item {
|
||||
box-shadow: 0px 4px 16px 8px #0000001f;
|
||||
border-radius: 16px;
|
||||
background-color: #fff;
|
||||
|
||||
min-height: 360px;
|
||||
padding: 32px 24px;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item:hover,
|
||||
.ad-plan .section-content .plan-item.active {
|
||||
border-color: #f3474c;
|
||||
box-shadow: 0px 24px 32px 16px #0000001f;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-title {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-price {
|
||||
font-family: Lexend;
|
||||
margin-top: 32px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-price .plan-item-price-current {
|
||||
font-size: 24px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-price .plan-item-price-payment {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #727570;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-price
|
||||
.plan-item-price-original {
|
||||
font-size: 14px;
|
||||
color: #727570;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-price
|
||||
.plan-item-price-original.price {
|
||||
color: #f3474c;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-button {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-button .btn-primary {
|
||||
width: 100%;
|
||||
|
||||
height: 40px;
|
||||
padding: 10px 16px 10px 16px;
|
||||
border-radius: 8px;
|
||||
background: linear-gradient(
|
||||
104.43deg,
|
||||
#ff7155 1.18%,
|
||||
#ef3e56 46.98%,
|
||||
#ee61d4 93.24%
|
||||
);
|
||||
border: none;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ad-plan .section-content .plan-item .plan-item-description {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-description
|
||||
.plan-item-description-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-description
|
||||
.plan-item-description-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-description
|
||||
.plan-item-description-item
|
||||
.plan-item-description-item-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-end;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.ad-plan
|
||||
.section-content
|
||||
.plan-item
|
||||
.plan-item-description
|
||||
.plan-item-description-item
|
||||
.plan-item-description-item-content {
|
||||
color: #727570;
|
||||
}
|
||||
|
||||
.ad-intro .section-content {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 16px;
|
||||
padding: 24px;
|
||||
position: relative;
|
||||
|
||||
box-shadow: 0px 4px 16px 8px #0000001f;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-header {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-header img {
|
||||
border-top-left-radius: 16px;
|
||||
border-top-right-radius: 16px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-image {
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-image img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-title {
|
||||
margin-top: 12px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.ad-intro .section-content .ad-intro-item .ad-intro-item-description {
|
||||
font-size: 14px;
|
||||
align-self: flex-start;
|
||||
color: #727570;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.ad-plan .section-content {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
.section-wrapper {
|
||||
padding: 96px 24px 64px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.ad-plan .section-content {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
.ad-intro .section-content {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
header .ad .ad-content .ad-content-left .ad-text {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
header .ad .ad-content .ad-content-left .ad-btn {
|
||||
font-size: 14px;
|
||||
height: 28px;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.ad-plan .section-content {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
}
|
||||
}
|
||||
1227
public/site/css/common.css
vendored
1227
public/site/css/common.css
vendored
File diff suppressed because it is too large
Load Diff
264
public/site/css/download.css
vendored
264
public/site/css/download.css
vendored
@ -1,172 +1,172 @@
|
||||
/* 头部样式 */
|
||||
.head{
|
||||
text-align: center;
|
||||
background: var(--bg-8-url) top left no-repeat;
|
||||
background-size: contain;
|
||||
.head {
|
||||
text-align: center;
|
||||
background: var(--bg-8-url) top left no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.nav{
|
||||
background-color: var(--pop-bg-color);
|
||||
box-shadow: 0px 4px 9px var(--box-shadow-color);
|
||||
.nav {
|
||||
background-color: var(--pop-bg-color);
|
||||
box-shadow: 0px 4px 9px var(--box-shadow-color);
|
||||
}
|
||||
|
||||
.download-ul{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 70%;
|
||||
.download-ul {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 70%;
|
||||
}
|
||||
.download-ul-item{
|
||||
cursor: pointer;
|
||||
.download-ul-item {
|
||||
cursor: pointer;
|
||||
}
|
||||
.download-ul-item .normal{
|
||||
display: flex;
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 80px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.download-ul-item .normal {
|
||||
display: flex;
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 80px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.download-ul-item .icon{
|
||||
display: block;
|
||||
height: 48px;
|
||||
.download-ul-item .icon {
|
||||
display: block;
|
||||
height: 48px;
|
||||
}
|
||||
.download-ul-item .hover{
|
||||
display: none;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.download-ul-item .hover {
|
||||
display: none;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.download-ul-item .hover.radius{
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 80px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
.download-ul-item .hover.radius {
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 80px;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
}
|
||||
.download-ul-item .qr-code{
|
||||
display: block;
|
||||
height: 100px;
|
||||
.download-ul-item .qr-code {
|
||||
display: block;
|
||||
height: 100px;
|
||||
}
|
||||
.download-ul-item .txt{
|
||||
color: var(--txt-gray-color);
|
||||
.download-ul-item .txt {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.download-ul-item .hover.radius .txt{
|
||||
color: var(--txt-theme-color);
|
||||
.download-ul-item .hover.radius .txt {
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.chips-txt{
|
||||
color: var(--txt-theme-color);
|
||||
.chips-txt {
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.download-ul-item .btn:hover .chips-txt{
|
||||
color: #fff;
|
||||
.download-ul-item .btn:hover .chips-txt {
|
||||
color: #fff;
|
||||
}
|
||||
.update{
|
||||
position: relative;
|
||||
background-color: var(--bg-fa-color);
|
||||
.update {
|
||||
position: relative;
|
||||
background-color: var(--bg-fa-color);
|
||||
}
|
||||
.update-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 120px 0px;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
.update-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 120px 0px;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
.update-layout{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.update-layout {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.update-h1{
|
||||
color: var(--text-color);
|
||||
.update-h1 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.update-ul{
|
||||
width: 465px;
|
||||
.update-ul {
|
||||
width: 465px;
|
||||
}
|
||||
.update-item{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding: 16px 0;
|
||||
cursor: pointer;
|
||||
.update-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding: 16px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.update-item:hover .update-h5{
|
||||
color: var(--txt-theme-color);
|
||||
.update-item:hover .update-h5 {
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.update-item:hover .time{
|
||||
color: var(--txt-theme-color);
|
||||
.update-item:hover .time {
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.update-h5{
|
||||
color: var(--txt-gray-color);
|
||||
.update-h5 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.update-item .time{
|
||||
color: var(--txt-gray-color);
|
||||
.update-item .time {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.update-ul .more-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.update-ul .more-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.more-item .more{
|
||||
color: var(--txt-theme-color);
|
||||
margin-right: 8px;
|
||||
cursor: pointer;
|
||||
padding: 16px 0;
|
||||
.more-item .more {
|
||||
color: var(--txt-theme-color);
|
||||
margin-right: 8px;
|
||||
cursor: pointer;
|
||||
padding: 16px 0;
|
||||
}
|
||||
.more-item .icon{
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
line-height: 24px;
|
||||
.more-item .icon {
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.update-bg-svg{
|
||||
background: var(--bg-9-url) no-repeat top right;
|
||||
background-size: contain;
|
||||
.update-bg-svg {
|
||||
background: var(--bg-9-url) no-repeat top right;
|
||||
background-size: contain;
|
||||
}
|
||||
.update-r{
|
||||
max-width: 672px;
|
||||
margin-left: 123px;
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 45px;
|
||||
.update-r {
|
||||
max-width: 672px;
|
||||
margin-left: 123px;
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 45px;
|
||||
}
|
||||
.update-r-svg{
|
||||
display: block;
|
||||
background: var(--bg-pic1-url) no-repeat;
|
||||
background-size: cover;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.update-r-svg {
|
||||
display: block;
|
||||
background: var(--bg-pic1-url) no-repeat;
|
||||
background-size: cover;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
/* 底部布局 */
|
||||
.footer-layut{
|
||||
padding-top: 120px;
|
||||
.footer-layout {
|
||||
padding-top: 120px;
|
||||
}
|
||||
.btn-padding{
|
||||
padding: 0 !important;
|
||||
.btn-padding {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.btn-padding a{
|
||||
display: block;
|
||||
padding: 10px 16px;
|
||||
.btn-padding a {
|
||||
display: block;
|
||||
padding: 10px 16px;
|
||||
}
|
||||
/* 弹框样式 */
|
||||
.BulletBox{
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
padding: 8px;
|
||||
background-color: var(--txt-theme-color);
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
.BulletBox {
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
padding: 8px;
|
||||
background-color: var(--txt-theme-color);
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
color: #fff;
|
||||
}
|
||||
.download-other-btn{
|
||||
.download-other-btn {
|
||||
padding: 10px 16px;
|
||||
border-radius: 8px;
|
||||
margin-top: 64px;
|
||||
|
||||
497
public/site/css/home.css
vendored
497
public/site/css/home.css
vendored
@ -1,34 +1,34 @@
|
||||
/* 头部样式 */
|
||||
.head{
|
||||
text-align: center;
|
||||
background: var(--bg-1-url) top left no-repeat;
|
||||
background-size: cover;
|
||||
.head {
|
||||
text-align: center;
|
||||
background: var(--bg-1-url) top left no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
section{
|
||||
background: var(--bg-2-url) bottom left no-repeat;
|
||||
section {
|
||||
background: var(--bg-2-url) bottom left no-repeat;
|
||||
}
|
||||
/* 底部样式 */
|
||||
.footer-layut{
|
||||
border-top: var(--border-color) solid 1px;
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
.collaboration{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
max-height: 243px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
margin-bottom: 120px;
|
||||
.collaboration {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
max-height: 243px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
margin-bottom: 120px;
|
||||
}
|
||||
.collaboration-content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
z-index: 5;
|
||||
.collaboration-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 5;
|
||||
}
|
||||
/* .collaboration-content-zh{
|
||||
top: 27.7%;
|
||||
@ -38,280 +38,281 @@ section{
|
||||
top: 27.7%;
|
||||
left: 28.6%;
|
||||
} */
|
||||
.collaboration-txt{
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
.collaboration-txt {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
/* 合作公司 */
|
||||
.companies{
|
||||
height: 100%;
|
||||
background: var(--bg-fa-color);
|
||||
.companies {
|
||||
height: 100%;
|
||||
background: var(--bg-fa-color);
|
||||
}
|
||||
.companies-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 88px 0;
|
||||
.companies-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 88px 0;
|
||||
}
|
||||
.companies-h1{
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
.companies-h1 {
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.companies-ul{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
margin-top: 56px;
|
||||
.companies-ul {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
margin-top: 56px;
|
||||
}
|
||||
.companies-ul .companies-ul-item{
|
||||
height: 64px;
|
||||
.companies-ul .companies-ul-item {
|
||||
height: 64px;
|
||||
}
|
||||
.companies-ul .companies-ul-item img{
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
.companies-ul .companies-ul-item img {
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
.ten_img{
|
||||
opacity: 0;
|
||||
animation-name: fadeSlideIn2;
|
||||
animation-duration: 2s;
|
||||
animation-delay: 0.6s;
|
||||
transition-timing-function: ease;
|
||||
animation-fill-mode: forwards;
|
||||
.ten_img {
|
||||
opacity: 0;
|
||||
animation-name: fadeSlideIn2;
|
||||
animation-duration: 2s;
|
||||
animation-delay: 0.6s;
|
||||
transition-timing-function: ease;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
/* 定义动画 */
|
||||
@keyframes fadeSlideIn2 {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
/* 功能卡片 */
|
||||
.card{
|
||||
height: auto;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
.card {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.card-pic{
|
||||
max-width: 717px;
|
||||
.card-pic {
|
||||
max-width: 717px;
|
||||
}
|
||||
.card-con{
|
||||
padding-top: 120px;
|
||||
.card-con {
|
||||
padding-top: 120px;
|
||||
}
|
||||
.card-con-768{
|
||||
padding-top: 56px;
|
||||
display: none;
|
||||
.card-con-768 {
|
||||
padding-top: 56px;
|
||||
display: none;
|
||||
}
|
||||
.card-con-layout{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-top: 56px;
|
||||
.card-con-layout {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-top: 56px;
|
||||
}
|
||||
.card-h1{
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
.card-h1 {
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.card-ul{
|
||||
width: 483px;
|
||||
margin-right: 48px;
|
||||
padding-right: 32px;
|
||||
.card-ul {
|
||||
width: 483px;
|
||||
margin-right: 48px;
|
||||
padding-right: 32px;
|
||||
}
|
||||
.card-768-ul .icon{
|
||||
flex: 1;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
background-color: var(--bg-292c2f-color);
|
||||
box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
.card-768-ul .icon {
|
||||
flex: 1;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
background-color: var(--bg-292c2f-color);
|
||||
box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.card-ul .card-ul-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 24px 16px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
cursor: pointer;
|
||||
max-height: 50px;
|
||||
transition: max-height 1s ease;
|
||||
.card-ul .card-ul-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 24px 16px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
cursor: pointer;
|
||||
max-height: 50px;
|
||||
transition: max-height 1s ease;
|
||||
}
|
||||
@keyframes fadeSlideIn3 {
|
||||
from {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.card-ul .card-ul-item:hover {
|
||||
background-color: var(--bg-hover-color);
|
||||
}
|
||||
.card-ul .card-ul-item .icon {
|
||||
flex: 1;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
background-color: var(--bg-292c2f-color);
|
||||
box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.card-ul .card-ul-item .arrows {
|
||||
display: inline-block;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
}
|
||||
.card-ul-item-h3 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.card-ul-item-unfolded {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 14;
|
||||
}
|
||||
.card-ul-item-expand {
|
||||
display: none;
|
||||
}
|
||||
.card-ul-item-expand-tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.card-ul-item-txt {
|
||||
display: inline-block;
|
||||
color: var(--txt-gray-color);
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.card-ul .card-ul-item:hover{
|
||||
background-color: var(--bg-hover-color);
|
||||
}
|
||||
.card-ul .card-ul-item .icon{
|
||||
flex: 1;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
background-color: var(--bg-292c2f-color);
|
||||
box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.card-ul .card-ul-item .arrows{
|
||||
display: inline-block;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
}
|
||||
.card-ul-item-h3{
|
||||
color: var(--text-color);
|
||||
}
|
||||
.card-ul-item-unfolded{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 14;
|
||||
}
|
||||
.card-ul-item-expand{
|
||||
display: none;
|
||||
}
|
||||
.card-ul-item-expand-tit{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.card-ul-item-txt{
|
||||
display: inline-block;
|
||||
color: var(--txt-gray-color);
|
||||
opacity: 0;
|
||||
animation: fadeSlideIn3 0.5s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards var(--delay);
|
||||
animation: fadeSlideIn3 0.5s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards
|
||||
var(--delay);
|
||||
}
|
||||
@keyframes fadeSlideIn3 {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.card-ul-item.active{
|
||||
align-items: flex-start !important;
|
||||
max-height: 138px;
|
||||
.card-ul-item.active {
|
||||
align-items: flex-start !important;
|
||||
max-height: 138px;
|
||||
}
|
||||
.card-ul-item.active .arrows{
|
||||
transform: rotate(180deg);
|
||||
.card-ul-item.active .arrows {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.card-ul-item.active .card-ul-item-unfolded{
|
||||
display: none;
|
||||
.card-ul-item.active .card-ul-item-unfolded {
|
||||
display: none;
|
||||
}
|
||||
.card-ul-item.active .card-ul-item-expand{
|
||||
display: inline-block;
|
||||
.card-ul-item.active .card-ul-item-expand {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* 为什么选择我们 */
|
||||
.choose{
|
||||
position: relative;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
z-index: 10;
|
||||
.choose {
|
||||
position: relative;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
z-index: 10;
|
||||
}
|
||||
.choose-con{
|
||||
padding: 240px 0 120px 0;
|
||||
.choose-con {
|
||||
padding: 240px 0 120px 0;
|
||||
}
|
||||
.choose-con-768{
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-bottom: 88px;
|
||||
.choose-con-768 {
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-bottom: 88px;
|
||||
}
|
||||
.choose-con-768-box{
|
||||
position: relative;
|
||||
width: calc(100vw);
|
||||
overflow-x: hidden;
|
||||
.choose-con-768-box {
|
||||
position: relative;
|
||||
width: calc(100vw);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.zh_choose_768,.en_choose_768{
|
||||
/* min-height: 257px; */
|
||||
.zh_choose_768,
|
||||
.en_choose_768 {
|
||||
/* min-height: 257px; */
|
||||
}
|
||||
.choose-con-768-ul{
|
||||
z-index: 99;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 10px;
|
||||
transition: all cubic-bezier(0, -0.26, 0.13, 1.04) .8s;
|
||||
.choose-con-768-ul {
|
||||
z-index: 99;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 10px;
|
||||
transition: all cubic-bezier(0, -0.26, 0.13, 1.04) 0.8s;
|
||||
}
|
||||
.choose-con-768-ul::-webkit-scrollbar {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
.choose-con-768-item{
|
||||
padding: 30px 24px;
|
||||
width: calc(100vw - 88px);
|
||||
min-height: 177px;
|
||||
height: 100%;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
margin: 0 20px;
|
||||
.choose-con-768-item {
|
||||
padding: 30px 24px;
|
||||
width: calc(100vw - 88px);
|
||||
min-height: 177px;
|
||||
height: 100%;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
margin: 0 20px;
|
||||
}
|
||||
#card-indicators {
|
||||
position: absolute;
|
||||
bottom: 54px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 99;
|
||||
position: absolute;
|
||||
bottom: 54px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 99;
|
||||
}
|
||||
.card-indicators-item {
|
||||
list-style: none;
|
||||
margin: 0 5px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--border-color);
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease-in-out;
|
||||
list-style: none;
|
||||
margin: 0 5px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--border-color);
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease-in-out;
|
||||
}
|
||||
.card-indicators-item.active {
|
||||
background-color: var(--txt-theme-color);
|
||||
background-color: var(--txt-theme-color);
|
||||
}
|
||||
.arcs2{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: -28px;
|
||||
.arcs2 {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: -28px;
|
||||
}
|
||||
.choose-con-ul{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.choose-con-ul {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.choose-con-item{
|
||||
width: calc(18vw + 12px);
|
||||
padding: 24px;
|
||||
|
||||
.choose-con-item {
|
||||
width: calc(18vw + 12px);
|
||||
padding: 24px;
|
||||
}
|
||||
.choose-con-ul .hover{
|
||||
cursor: pointer;
|
||||
transition: all .3s ease-in-out;
|
||||
.choose-con-ul .hover {
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.choose-con-ul .hover:hover{
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
transform: translateY(-16px);
|
||||
.choose-con-ul .hover:hover {
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
transform: translateY(-16px);
|
||||
}
|
||||
.choose-con-tit{
|
||||
color: var(--text-color);
|
||||
padding-top: 80px;
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
.choose-con-tit {
|
||||
color: var(--text-color);
|
||||
padding-top: 80px;
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
}
|
||||
.home_pic7_768 {
|
||||
display: none;
|
||||
}
|
||||
.home_pic7_768{
|
||||
display: none;
|
||||
}
|
||||
216
public/site/css/log.css
vendored
216
public/site/css/log.css
vendored
@ -1,146 +1,146 @@
|
||||
/* 头部样式 */
|
||||
.nav{
|
||||
background-color: var(--pop-bg-color);
|
||||
box-shadow: 0px 4px 9px var(--box-shadow-color);
|
||||
.nav {
|
||||
background-color: var(--pop-bg-color);
|
||||
box-shadow: 0px 4px 9px var(--box-shadow-color);
|
||||
}
|
||||
.logs{
|
||||
position: relative;
|
||||
margin: 136px 0 96px 0;
|
||||
.logs {
|
||||
position: relative;
|
||||
margin: 136px 0 96px 0;
|
||||
}
|
||||
.logs-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
.logs-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.logs-layout{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
/* height: 929px; */
|
||||
.logs-layout {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
/* height: 929px; */
|
||||
}
|
||||
.logs-l{
|
||||
padding: 24px;
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 8px;
|
||||
margin-right: 32px;
|
||||
height: 95%;
|
||||
.logs-l {
|
||||
padding: 24px;
|
||||
background-color: var(--bg-fa-color);
|
||||
border-radius: 8px;
|
||||
margin-right: 32px;
|
||||
height: 95%;
|
||||
}
|
||||
.logs-h5{
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
color: var(--text-color);
|
||||
.logs-h5 {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.logs-l-ul{
|
||||
width: 240px;
|
||||
.logs-l-ul {
|
||||
width: 240px;
|
||||
}
|
||||
.l-ul-item.active .txt{
|
||||
color: var(--txt-theme-color);
|
||||
.l-ul-item.active .txt {
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.l-ul-item.active{
|
||||
background-color: var(--bg-hover-color);
|
||||
border-radius: 8px;
|
||||
.l-ul-item.active {
|
||||
background-color: var(--bg-hover-color);
|
||||
border-radius: 8px;
|
||||
}
|
||||
.l-ul-item:hover{
|
||||
background-color: var(--bg-hover-color);
|
||||
border-radius: 8px;
|
||||
.l-ul-item:hover {
|
||||
background-color: var(--bg-hover-color);
|
||||
border-radius: 8px;
|
||||
}
|
||||
.txt{
|
||||
/* display: inline-block; */
|
||||
color: var(--txt-gray-color);
|
||||
.txt {
|
||||
/* display: inline-block; */
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.logs-r{
|
||||
border-left: 1px solid var(--border-color);
|
||||
padding-left: 32px;
|
||||
/* height: 929px; */
|
||||
/* overflow-y:scroll; */
|
||||
.logs-r {
|
||||
border-left: 1px solid var(--border-color);
|
||||
padding-left: 32px;
|
||||
/* height: 929px; */
|
||||
/* overflow-y:scroll; */
|
||||
}
|
||||
.logs-r::-webkit-scrollbar{
|
||||
width: 0 !important
|
||||
.logs-r::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
}
|
||||
.logs-h1{
|
||||
color: var(--text-color);
|
||||
.logs-h1 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.logs-h4{
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
line-height: 30px;
|
||||
color: var(--text-color);
|
||||
padding-top: 15px;
|
||||
box-sizing: border-box;
|
||||
.logs-h4 {
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
line-height: 30px;
|
||||
color: var(--text-color);
|
||||
padding-top: 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.r-ol-item{
|
||||
color: var(--txt-gray-color);
|
||||
position: relative;
|
||||
.r-ol-item {
|
||||
color: var(--txt-gray-color);
|
||||
position: relative;
|
||||
}
|
||||
.r-ul-item:last-child{
|
||||
margin-bottom: 0 !important;
|
||||
.r-ul-item:last-child {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
.dots{
|
||||
background: url(../img/dots.svg) no-repeat;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
.dots {
|
||||
background: url(../img/dots.svg) no-repeat;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
}
|
||||
.logs-t-768{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 14px 16px;
|
||||
background: var(--bg-fa-color);
|
||||
border-radius: 8px;
|
||||
margin-top: 16px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 40px;
|
||||
.logs-t-768 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 14px 16px;
|
||||
background: var(--bg-fa-color);
|
||||
border-radius: 8px;
|
||||
margin-top: 16px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.logs-t-prev{
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
margin-right: 8px;
|
||||
.logs-t-prev {
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.logs-t-tit{
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
color: var(--txt-theme-color);
|
||||
.logs-t-tit {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.logs-drawer{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: -90vw;
|
||||
width: 75vw;
|
||||
height: 100%;
|
||||
padding: 22px 24px;
|
||||
background-color: var(--pop-bg-color);
|
||||
border: 1px solid var(--box-shadow-color);
|
||||
box-shadow: var(--pop-box-shadow);
|
||||
transition: all 0.5s ease-in-out;
|
||||
z-index: 999;
|
||||
.logs-drawer {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: -90vw;
|
||||
width: 75vw;
|
||||
height: 100%;
|
||||
padding: 22px 24px;
|
||||
background-color: var(--pop-bg-color);
|
||||
border: 1px solid var(--box-shadow-color);
|
||||
box-shadow: var(--pop-box-shadow);
|
||||
transition: all 0.5s ease-in-out;
|
||||
z-index: 999;
|
||||
}
|
||||
.open-logs-drawer{
|
||||
left: 0;
|
||||
.open-logs-drawer {
|
||||
left: 0;
|
||||
}
|
||||
.logs-t-768{
|
||||
display: none;
|
||||
.logs-t-768 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.log-a{
|
||||
.log-a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 9px 16px;
|
||||
line-height: normal;
|
||||
}
|
||||
.logs-sticky{
|
||||
position: sticky;
|
||||
top: 80px;
|
||||
height: calc(100vh - 136px);
|
||||
.logs-sticky {
|
||||
position: sticky;
|
||||
top: 80px;
|
||||
height: calc(100vh - 136px);
|
||||
}
|
||||
#help-l-ul{
|
||||
#help-l-ul {
|
||||
overflow-y: auto;
|
||||
height: calc(100% - 36px);
|
||||
}
|
||||
.footer-layut{
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
|
||||
405
public/site/css/price.css
vendored
405
public/site/css/price.css
vendored
@ -1,228 +1,229 @@
|
||||
|
||||
/* 头部样式 */
|
||||
.head{
|
||||
background: var(--bg-10-url) top left no-repeat;
|
||||
background-size: contain;
|
||||
.head {
|
||||
background: var(--bg-10-url) top left no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.price-card{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
z-index: 2;
|
||||
.price-card {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
z-index: 2;
|
||||
}
|
||||
.price-card-item{
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 24px;
|
||||
width: 298px;
|
||||
transition: all .3s ease-in-out;
|
||||
background: var(--choose-bg-hover-color);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
.price-card-item {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 24px;
|
||||
width: 298px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
background: var(--choose-bg-hover-color);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.price-card-item:hover{
|
||||
border: 1px solid var(--txt-theme-color);
|
||||
transform: translateY(-16px);
|
||||
.price-card-item:hover {
|
||||
border: 1px solid var(--txt-theme-color);
|
||||
transform: translateY(-16px);
|
||||
}
|
||||
.price-animate-box{
|
||||
opacity: 0;
|
||||
transform: translateY(50%);
|
||||
animation: fadeIn 1s ease-in-out forwards var(--delay); /* 应用动画效果 */
|
||||
.price-animate-box {
|
||||
opacity: 0;
|
||||
transform: translateY(50%);
|
||||
animation: fadeIn 1s ease-in-out forwards var(--delay); /* 应用动画效果 */
|
||||
}
|
||||
.price-card-item:hover .btn-green{
|
||||
background-color: var(--txt-theme-color);
|
||||
color: #fff;
|
||||
.price-card-item:hover .btn-green {
|
||||
background-color: var(--txt-theme-color);
|
||||
color: #fff;
|
||||
}
|
||||
.price-card-h4{
|
||||
color: var(--text-color);
|
||||
display: flex;
|
||||
.price-card-h4 {
|
||||
color: var(--text-color);
|
||||
display: flex;
|
||||
}
|
||||
.price-card-item.active{
|
||||
border: 2px solid var(--txt-theme-color);
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
.price-card-item.active {
|
||||
border: 2px solid var(--txt-theme-color);
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.price-card-item.active .btn-green{
|
||||
background-color: var(--txt-theme-color);
|
||||
color: #fff;
|
||||
.price-card-item.active .btn-green {
|
||||
background-color: var(--txt-theme-color);
|
||||
color: #fff;
|
||||
}
|
||||
.price-card-item.active .btn-green:hover{
|
||||
background-color: var(--btn-hover-color);
|
||||
border-color: var(--btn-hover-color);
|
||||
.price-card-item.active .btn-green:hover {
|
||||
background-color: var(--btn-hover-color);
|
||||
border-color: var(--btn-hover-color);
|
||||
}
|
||||
.price-card-item.active .price-card-h4{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--txt-theme-color);
|
||||
.price-card-item.active .price-card-h4 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--txt-theme-color);
|
||||
}
|
||||
.rec-icon{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 2px 6px;
|
||||
height: 20px;
|
||||
background-color: var(--bg-rec-color);
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-left: 8px;
|
||||
.rec-icon {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 2px 6px;
|
||||
height: 20px;
|
||||
background-color: var(--bg-rec-color);
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.price-card-money{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
.price-card-money {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.price-card-h2{
|
||||
color: var(--text-color);
|
||||
text-align: left;
|
||||
margin-right: 4px;
|
||||
.price-card-h2 {
|
||||
color: var(--text-color);
|
||||
text-align: left;
|
||||
margin-right: 4px;
|
||||
}
|
||||
.price-card-unit{
|
||||
color: var(--txt-gray-color);
|
||||
.price-card-unit {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.price-card-h6{
|
||||
color: var(--txt-gray-color);
|
||||
text-align: left;
|
||||
.price-card-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
text-align: left;
|
||||
}
|
||||
.price-card-ol-item{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
.price-card-ol-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.price-card-ol-item .icon{
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
.price-card-ol-item .icon {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
}
|
||||
.plans-ul-t .plans-ul-t-item:last-child,.plans-ol-item:last-child{
|
||||
border-bottom: none !important;
|
||||
.plans-ul-t .plans-ul-t-item:last-child,
|
||||
.plans-ol-item:last-child {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.plans-ol .plans-ol-item:first-child{
|
||||
background-color: var(--bg-fa-color);
|
||||
padding: 20px 24px !important;
|
||||
.plans-ol .plans-ol-item:first-child {
|
||||
background-color: var(--bg-fa-color);
|
||||
padding: 20px 24px !important;
|
||||
}
|
||||
.plans{
|
||||
position: relative;
|
||||
.plans {
|
||||
position: relative;
|
||||
}
|
||||
.plans-tit-h2{
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
.plans-tit-h2 {
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.plans-tit-h5{
|
||||
text-align: center;
|
||||
color: var(--txt-gray-color);
|
||||
.plans-tit-h5 {
|
||||
text-align: center;
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.plans-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
.plans-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
.plans-layout{
|
||||
padding: 120px 0;
|
||||
.plans-layout {
|
||||
padding: 120px 0;
|
||||
}
|
||||
.plans-ul-t-item{
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
.plans-ul-t-item {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.plans-ul-t-item-h4{
|
||||
color: var(--text-color);
|
||||
.plans-ul-t-item-h4 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.plans-ol-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 24px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
.plans-ol-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 24px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.plans-ol-item .plans-ol-item-h6:first-child{
|
||||
color: var(--txt-gray-color) !important;
|
||||
.plans-ol-item .plans-ol-item-h6:first-child {
|
||||
color: var(--txt-gray-color) !important;
|
||||
}
|
||||
.plans-ol-item-h6{
|
||||
color: var(--txt-4ca5);
|
||||
line-height: normal;
|
||||
.plans-ol-item-h6 {
|
||||
color: var(--txt-4ca5);
|
||||
line-height: normal;
|
||||
}
|
||||
.plans-ol-item-icon{
|
||||
display: block;
|
||||
height: 24px;
|
||||
.plans-ol-item-icon {
|
||||
display: block;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.plans-ol-item-icon2{
|
||||
display: block;
|
||||
height: 24px;
|
||||
opacity: 0.5;
|
||||
.plans-ol-item-icon2 {
|
||||
display: block;
|
||||
height: 24px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.plans-ul-b{
|
||||
display: grid;
|
||||
.plans-ul-b {
|
||||
display: grid;
|
||||
grid-template-columns: 506px 266px 266px 266px;
|
||||
}
|
||||
.plans-ul-b-item-btn{
|
||||
display: inline-block;
|
||||
width: 160px;
|
||||
.plans-ul-b-item-btn {
|
||||
display: inline-block;
|
||||
width: 160px;
|
||||
}
|
||||
.flex-s-c{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.flex-s-c {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
.plans-ul-768{
|
||||
display: none;
|
||||
.plans-ul-768 {
|
||||
display: none;
|
||||
}
|
||||
.plans-ul-768-item:nth-of-type(1),.plans-ul-768-item:nth-of-type(2){
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 36px;
|
||||
.plans-ul-768-item:nth-of-type(1),
|
||||
.plans-ul-768-item:nth-of-type(2) {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 36px;
|
||||
}
|
||||
.plans-ol-768-item{
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
margin-bottom: 24px;
|
||||
background-color: var(--bg-color);
|
||||
.plans-ol-768-item {
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
margin-bottom: 24px;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
.plans-ol-768-item .plans-ol-768-content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20px 24px;
|
||||
.plans-ol-768-item .plans-ol-768-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20px 24px;
|
||||
}
|
||||
.plans-ol-768-item .plans-ol-768-content:nth-child(2n){
|
||||
background-color: var(--bg-fa-color);
|
||||
.plans-ol-768-item .plans-ol-768-content:nth-child(2n) {
|
||||
background-color: var(--bg-fa-color);
|
||||
}
|
||||
.plans-ol-768-item .plans-ol-768-content:last-child{
|
||||
border-radius: 0 0 12px 12px;
|
||||
.plans-ol-768-item .plans-ol-768-content:last-child {
|
||||
border-radius: 0 0 12px 12px;
|
||||
}
|
||||
|
||||
/* 底部样式 */
|
||||
.footer-layut{
|
||||
border-top: var(--border-color) solid 1px;
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
.BulletBox1{
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
background-color: #fff;
|
||||
width: 430px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 18px;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,.15);
|
||||
.BulletBox1 {
|
||||
position: fixed;
|
||||
display: none;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: #fff;
|
||||
width: 430px;
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 18px;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.BulletBox1{
|
||||
width: 80%;
|
||||
}
|
||||
.BulletBox1 {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.BulletBox1 .top{
|
||||
width: 382px;
|
||||
line-height: 20px;
|
||||
padding: 22px 24px 20px 24px;
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
.BulletBox1 .top {
|
||||
width: 382px;
|
||||
line-height: 20px;
|
||||
padding: 22px 24px 20px 24px;
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
font-weight: 500;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -230,38 +231,38 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.BulletBox1 .content{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.5;
|
||||
font-size: 14px;
|
||||
padding:16px 32px 2px 32px;
|
||||
text-align: left;
|
||||
color: rgb(96, 98, 102);
|
||||
.BulletBox1 .content {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.5;
|
||||
font-size: 14px;
|
||||
padding: 16px 32px 2px 32px;
|
||||
text-align: left;
|
||||
color: rgb(96, 98, 102);
|
||||
}
|
||||
.BulletBox1 .bottom{
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
padding: 20px 30px 22px 30px;
|
||||
position: relative;
|
||||
.BulletBox1 .bottom {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
padding: 20px 30px 22px 30px;
|
||||
position: relative;
|
||||
}
|
||||
.BulletBox1 .bottom .BulletBox1Btn{
|
||||
min-width: 100px;
|
||||
right: 20px;
|
||||
height: 34px;
|
||||
line-height: 32px;
|
||||
color: #fff;
|
||||
background-color: #8bcf70;
|
||||
border-color: #8bcf70;
|
||||
cursor: pointer;
|
||||
border-radius: 8px;
|
||||
padding: 5px;
|
||||
.BulletBox1 .bottom .BulletBox1Btn {
|
||||
min-width: 100px;
|
||||
right: 20px;
|
||||
height: 34px;
|
||||
line-height: 32px;
|
||||
color: #fff;
|
||||
background-color: #8bcf70;
|
||||
border-color: #8bcf70;
|
||||
cursor: pointer;
|
||||
border-radius: 8px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.price-ceiling {
|
||||
position: sticky;
|
||||
top: 80px;
|
||||
background-color: var(--bg-color);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
z-index: 9999;
|
||||
}
|
||||
position: sticky;
|
||||
top: 80px;
|
||||
background-color: var(--bg-color);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
509
public/site/css/product.css
vendored
509
public/site/css/product.css
vendored
@ -1,309 +1,312 @@
|
||||
/* 头部样式 */
|
||||
.head.product{
|
||||
position: relative;
|
||||
background: var(--bg-3-url) top right no-repeat;
|
||||
.head.product {
|
||||
position: relative;
|
||||
background: var(--bg-3-url) top right no-repeat;
|
||||
}
|
||||
.prooduct-con{
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
.prooduct-con {
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
.prooduct-list{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.prooduct-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item{
|
||||
padding: 24px;
|
||||
background-color: var(--bg-fa-color);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
margin-right: 32px;
|
||||
width: 100%;
|
||||
margin-bottom: 24px;
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.5s ease-in-out forwards var(--delay); /* 应用动画效果 */
|
||||
.prooduct-list .prooduct-list-item {
|
||||
padding: 24px;
|
||||
background-color: var(--bg-fa-color);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
margin-right: 32px;
|
||||
width: 100%;
|
||||
margin-bottom: 24px;
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.5s ease-in-out forwards var(--delay); /* 应用动画效果 */
|
||||
}
|
||||
/* 定义动画 */
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(50%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.prooduct-list .prooduct-list-item.top {
|
||||
max-width: 180px;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item:nth-of-type(6),
|
||||
.prooduct-list .prooduct-list-item:nth-of-type(10) {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item.bot {
|
||||
max-width: 246px;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item:hover {
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
border: 1px solid var(--txt-theme-color);
|
||||
box-shadow: 0px 1px 6px 2px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
.prooduct-list .prooduct-list-item .icon {
|
||||
width: 48px;
|
||||
display: block;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item .txt {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.prooduct-list .active {
|
||||
background-color: var(--choose-bg-hover-color) !important;
|
||||
border: 1px solid var(--txt-theme-color) !important;
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05) !important;
|
||||
}
|
||||
.prooduct-list .prev,
|
||||
.prooduct-list .next {
|
||||
padding: 14px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
.prooduct-list .prev {
|
||||
margin-right: 16px;
|
||||
}
|
||||
.prooduct-list .next {
|
||||
margin-left: 16px;
|
||||
}
|
||||
.active .txt {
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
.details {
|
||||
display: none;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
opacity: 0;
|
||||
transform: translateY(50%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
transform: translateY(20%); /* 将元素向下移动 50 像素 */
|
||||
animation-name: fadeIn2; /* 指定动画名称 */
|
||||
animation-duration: 1s; /* 动画持续时间为 1 秒 */
|
||||
transition-delay: 1s;
|
||||
transition-timing-function: ease;
|
||||
animation-fill-mode: forwards; /* 元素保持动画结束状态 */
|
||||
}
|
||||
.prooduct-list .prooduct-list-item.top{
|
||||
max-width: 180px;
|
||||
.details.active {
|
||||
display: block;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item:nth-of-type(6),.prooduct-list .prooduct-list-item:nth-of-type(10){
|
||||
margin-right: 0 !important;
|
||||
.details-ul-1280 {
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
padding: 56px 48px;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item.bot{
|
||||
max-width: 246px;
|
||||
.details-ul-1280 .details-ul-item {
|
||||
width: 48%;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item:hover{
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
border: 1px solid var(--txt-theme-color);
|
||||
box-shadow: 0px 1px 6px 2px rgba(0, 0, 0, 0.12);
|
||||
.prooduct-ul {
|
||||
margin: 12px 0 125px 0;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item .icon{
|
||||
width: 48px;
|
||||
display: block;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.prooduct-list .prooduct-list-item .txt{
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.prooduct-list .active{
|
||||
background-color: var(--choose-bg-hover-color) !important;
|
||||
border: 1px solid var(--txt-theme-color) !important;
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05) !important;
|
||||
}
|
||||
.prooduct-list .prev,.prooduct-list .next{
|
||||
padding: 14px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
.prooduct-list .prev{
|
||||
margin-right: 16px;
|
||||
}
|
||||
.prooduct-list .next{
|
||||
margin-left: 16px;
|
||||
}
|
||||
.active .txt{
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
.details{
|
||||
display: none;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
opacity: 0;
|
||||
transform: translateY(20%); /* 将元素向下移动 50 像素 */
|
||||
animation-name: fadeIn2; /* 指定动画名称 */
|
||||
animation-duration: 1s; /* 动画持续时间为 1 秒 */
|
||||
transition-delay: 1s;
|
||||
transition-timing-function: ease;
|
||||
animation-fill-mode: forwards; /* 元素保持动画结束状态 */
|
||||
}
|
||||
.details.active{
|
||||
display: block;
|
||||
}
|
||||
.details-ul-1280{
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
padding: 56px 48px;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.details-ul-1280 .details-ul-item{
|
||||
width: 48%;
|
||||
}
|
||||
.prooduct-ul{
|
||||
margin: 12px 0 125px 0;
|
||||
}
|
||||
.details-con{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 56px 48px;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);;
|
||||
border-radius: 12px;
|
||||
|
||||
.details-con {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 56px 48px;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
}
|
||||
/* 定义动画 */
|
||||
@keyframes fadeIn2 {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(20%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(20%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.details-con .pic{
|
||||
display: block;
|
||||
.details-con .pic {
|
||||
display: block;
|
||||
}
|
||||
.details-con .details-ul{
|
||||
margin-left: 56px;
|
||||
.details-con .details-ul {
|
||||
margin-left: 56px;
|
||||
}
|
||||
.details-con .details-ul.item4{
|
||||
width: 764px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
.details-con .details-ul.item4 {
|
||||
width: 764px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.details-con .details-ul.item4 .details-ul-item{
|
||||
width: 364px;
|
||||
.details-con .details-ul.item4 .details-ul-item {
|
||||
width: 364px;
|
||||
}
|
||||
|
||||
main{
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
main {
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
.manage{
|
||||
background-color: var(--bg-fa-color);
|
||||
.manage {
|
||||
background-color: var(--bg-fa-color);
|
||||
}
|
||||
.manage-con{
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
.manage-con {
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
.manage-t{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.manage-t {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.manage-b{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
.manage-b {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
}
|
||||
.manage-h1{
|
||||
color: var(--text-color);
|
||||
.manage-h1 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.manage-h3{
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 25px;
|
||||
color: var(--txt-191a15-color);
|
||||
.manage-h3 {
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 25px;
|
||||
color: var(--txt-191a15-color);
|
||||
}
|
||||
.manage-h5{
|
||||
color: var(--txt-gray-color);
|
||||
.manage-h5 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.manage-h6{
|
||||
color: var(--txt-gray-color);
|
||||
.manage-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.manage-h5-768{
|
||||
display: none;
|
||||
.manage-h5-768 {
|
||||
display: none;
|
||||
}
|
||||
.manage-tit{
|
||||
width: 341px;
|
||||
.manage-tit {
|
||||
width: 341px;
|
||||
}
|
||||
.manage-icon{
|
||||
height: 24px;
|
||||
display: block;
|
||||
.manage-icon {
|
||||
height: 24px;
|
||||
display: block;
|
||||
}
|
||||
.manage-bg{
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
height: 100% ;
|
||||
.manage-bg {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.manage-svg{
|
||||
position: relative;
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 30px;
|
||||
width: 405px;
|
||||
.manage-svg {
|
||||
position: relative;
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 30px;
|
||||
width: 405px;
|
||||
}
|
||||
.manage-tips{
|
||||
padding: 18px 20px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
left: 100px;
|
||||
width: 76%;
|
||||
.manage-tips {
|
||||
padding: 18px 20px;
|
||||
background: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
left: 100px;
|
||||
width: 76%;
|
||||
}
|
||||
.manage-tips-txt{
|
||||
margin-left: 12px;
|
||||
color: var(--text-color);
|
||||
.manage-tips-txt {
|
||||
margin-left: 12px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.manage-svg-h2{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 52px;
|
||||
left: 120px;
|
||||
text-align: end;
|
||||
color: #fff;
|
||||
width: 60%;
|
||||
.manage-svg-h2 {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 52px;
|
||||
left: 120px;
|
||||
text-align: end;
|
||||
color: #fff;
|
||||
width: 60%;
|
||||
}
|
||||
.manage-ul-item{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
.manage-ul-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.performance{
|
||||
position: relative;
|
||||
background: var(--bg-4-url) top left no-repeat;
|
||||
.performance {
|
||||
position: relative;
|
||||
background: var(--bg-4-url) top left no-repeat;
|
||||
}
|
||||
.performance-con{
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
|
||||
.performance-con {
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.performance-con .pic{
|
||||
display: block;
|
||||
height: auto;
|
||||
.performance-con .pic {
|
||||
display: block;
|
||||
height: auto;
|
||||
}
|
||||
.performance-h1{
|
||||
color: var(--text-color);
|
||||
text-align: center;
|
||||
.performance-h1 {
|
||||
color: var(--text-color);
|
||||
text-align: center;
|
||||
}
|
||||
.performance-ul{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin-top: 48px;
|
||||
.performance-ul {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin-top: 48px;
|
||||
}
|
||||
.performance-ul-item{
|
||||
width: 248px;
|
||||
.performance-ul-item {
|
||||
width: 248px;
|
||||
}
|
||||
.performance-ul-item .icon{
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-color: var(--txt-theme-color);
|
||||
border-radius: 4px;
|
||||
transform: rotate(45deg);
|
||||
.performance-ul-item .icon {
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-color: var(--txt-theme-color);
|
||||
border-radius: 4px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.performance-h5{
|
||||
color: var(--txt-191a15-color);
|
||||
.performance-h5 {
|
||||
color: var(--txt-191a15-color);
|
||||
}
|
||||
.performance-h6{
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: var(--txt-gray-color);
|
||||
.performance-h6 {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.product-animate-box,.product-animate-box2{
|
||||
opacity: 0;
|
||||
transform: translateY(25%);
|
||||
.product-animate-box,
|
||||
.product-animate-box2 {
|
||||
opacity: 0;
|
||||
transform: translateY(25%);
|
||||
}
|
||||
.product-animate-box.animate{
|
||||
animation: fadeIn5 0.8s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards var(--delay); /* 应用动画效果 */
|
||||
.product-animate-box.animate {
|
||||
animation: fadeIn5 0.8s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards
|
||||
var(--delay); /* 应用动画效果 */
|
||||
}
|
||||
.product-animate-box2.animate{
|
||||
animation: fadeIn5 0.7s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards var(--delay); /* 应用动画效果 */
|
||||
.product-animate-box2.animate {
|
||||
animation: fadeIn5 0.7s cubic-bezier(0.61, -0.01, 0.57, 0.96) forwards
|
||||
var(--delay); /* 应用动画效果 */
|
||||
}
|
||||
/* 定义动画 */
|
||||
@keyframes fadeIn5 {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30%);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
/* 底部样式 */
|
||||
.footer-layut{
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
|
||||
1754
public/site/css/rem.css
vendored
1754
public/site/css/rem.css
vendored
File diff suppressed because it is too large
Load Diff
180
public/site/css/solution.css
vendored
180
public/site/css/solution.css
vendored
@ -1,116 +1,116 @@
|
||||
/* 头部样式 */
|
||||
.head{
|
||||
text-align: center;
|
||||
background: var(--bg-5-url) top center no-repeat;
|
||||
background-size: cover;
|
||||
.head {
|
||||
text-align: center;
|
||||
background: var(--bg-5-url) top center no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.app{
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
background-color: var(--bg-fa-color);
|
||||
.app {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
background-color: var(--bg-fa-color);
|
||||
}
|
||||
.bg-style{
|
||||
background: var(--bg-6-url) top left no-repeat;
|
||||
.bg-style {
|
||||
background: var(--bg-6-url) top left no-repeat;
|
||||
}
|
||||
.app-con{
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
.app-con {
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
.app-tit{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.app-tit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.app-h1{
|
||||
color: var(--text-color);
|
||||
.app-h1 {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.app-h4{
|
||||
color: var(--txt-191a15-color);
|
||||
.app-h4 {
|
||||
color: var(--txt-191a15-color);
|
||||
}
|
||||
.app-ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
.app-ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.app-ul-item{
|
||||
width: 624px;
|
||||
.app-ul-item {
|
||||
width: 624px;
|
||||
}
|
||||
.app-bg-box{
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
overflow: hidden;
|
||||
border-radius: 16px;
|
||||
margin-bottom: 32px;
|
||||
.app-bg-box {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
overflow: hidden;
|
||||
border-radius: 16px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.app-bg{
|
||||
display: block;
|
||||
height: auto;
|
||||
transform: scale(1);
|
||||
transition: all 2s;
|
||||
.app-bg {
|
||||
display: block;
|
||||
height: auto;
|
||||
transform: scale(1);
|
||||
transition: all 2s;
|
||||
}
|
||||
.app-bg:hover{
|
||||
transform: scale(1.15);
|
||||
.app-bg:hover {
|
||||
transform: scale(1.15);
|
||||
}
|
||||
.app-h5{
|
||||
color: var(--txt-gray-color);
|
||||
.app-h5 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.app-h6{
|
||||
color: var(--txt-gray-color);
|
||||
.app-h6 {
|
||||
color: var(--txt-gray-color);
|
||||
}
|
||||
.team{
|
||||
background: var(--bg-7-url) top right no-repeat;
|
||||
background-size: contain;
|
||||
.team {
|
||||
background: var(--bg-7-url) top right no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.team-con{
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
.team-con {
|
||||
padding: 120px 0px;
|
||||
width: 100%;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.team-tit{
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
.team-tit {
|
||||
text-align: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.team-ul{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
.team-ul {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.team-ul-item{
|
||||
padding: 24px;
|
||||
width: 357px;
|
||||
transition: all .3s ease-in-out;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
z-index: 2;
|
||||
.team-ul-item {
|
||||
padding: 24px;
|
||||
width: 357px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
background-color: var(--choose-bg-hover-color);
|
||||
box-shadow: 0px 2px 8px 4px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
z-index: 2;
|
||||
}
|
||||
.team-ul-item:hover{
|
||||
transform: translateY(-16px);
|
||||
.team-ul-item:hover {
|
||||
transform: translateY(-16px);
|
||||
}
|
||||
.team-ul-item-en{
|
||||
height: 358px;
|
||||
.team-ul-item-en {
|
||||
height: 358px;
|
||||
}
|
||||
.team-ul-item-zh{
|
||||
height: 234px;
|
||||
.team-ul-item-zh {
|
||||
height: 234px;
|
||||
}
|
||||
.team-icon{
|
||||
display: block;
|
||||
width: 48px;
|
||||
.team-icon {
|
||||
display: block;
|
||||
width: 48px;
|
||||
}
|
||||
/* 底部样式 */
|
||||
footer{
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
background-color: var(--bg-color);
|
||||
footer {
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
.footer-layout {
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
.footer-layut{
|
||||
border-top: var(--border-color) solid 1px;
|
||||
}
|
||||
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>About Us - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier.">
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/about.css">
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier." />
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/about.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="BulletBox"></div>
|
||||
<div id="layout" class="about_green_bg">
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
Support
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -47,10 +50,12 @@
|
||||
<a class="txt-4001418 txt-sub" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,36 +68,38 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="Light theme">
|
||||
<img src="../img/light.svg" alt="Light theme" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="Dark theme">
|
||||
<img src="../img/drak.svg" alt="Dark theme" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >Try Now</button>
|
||||
<button class="btn btn-primary">
|
||||
Try Now
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -102,25 +109,41 @@
|
||||
<div class="topics-tit mb-32 topics-tit-en">
|
||||
<span class="txt-6007290 topics-h1">About our company</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32 topics-h4-en">Focusing on the field of network security, we are committed to providing users with a full range of network security solutions.</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32 topics-h4-en">
|
||||
Focusing on the field of network security, we
|
||||
are committed to providing users with a full
|
||||
range of network security solutions.
|
||||
</h4>
|
||||
<ul class="company-ul">
|
||||
<li class="company-ul-item">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-year">2020</h2>
|
||||
<h6 class="txt-4001624 company-h6">Company founded</h6>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-year">
|
||||
2020
|
||||
</h2>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
Company founded
|
||||
</h6>
|
||||
</li>
|
||||
<li class="company-ul-item">
|
||||
<div class="flex-sc">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-area">10</h2>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-area">
|
||||
10
|
||||
</h2>
|
||||
<i class="company-sup">+</i>
|
||||
</div>
|
||||
<h6 class="txt-4001624 company-h6">Team experience</h6>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
Team experience
|
||||
</h6>
|
||||
</li>
|
||||
<li class="company-ul-item">
|
||||
<div class="flex-sc">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-size">99</h2>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-size">
|
||||
99
|
||||
</h2>
|
||||
<i class="company-sup">%</i>
|
||||
</div>
|
||||
<h6 class="txt-4001624 company-h6">Customer staisfaction</h6>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
Customer staisfaction
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -129,15 +152,31 @@
|
||||
<article class="company-profile">
|
||||
<div class="company-profile-con">
|
||||
<div class="company-profile-layout">
|
||||
<img class="company-profile-l" id="about_pic1" src="../img/light/about_pic1.png" alt="广西海豚有海信息科技公司,HITOSEA,海豚有海,广西海豚有海">
|
||||
<img class="company-profile-l" id="about_pic1" src="../img/light/about_pic1.png"
|
||||
alt="广西海豚有海信息科技公司,HITOSEA,海豚有海,广西海豚有海" />
|
||||
<div class="company-profile-r">
|
||||
<h1 class="txt-5004455 company-profile-h1 mb-80">
|
||||
Company profile
|
||||
<svg class="company-profile-arcs" width="312" height="23" viewBox="0 0 312 23" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="arc" opacity="0.5" d="M3 20C47.4822 7.1714 170.957 -10.7886 309 20" stroke="#8BCF70" stroke-width="6" stroke-linecap="round" stroke-dasharray="600, 600" stroke-dashoffset="0"/>
|
||||
<svg class="company-profile-arcs" width="312" height="23" viewBox="0 0 312 23" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="arc" opacity="0.5" d="M3 20C47.4822 7.1714 170.957 -10.7886 309 20" stroke="#8BCF70"
|
||||
stroke-width="6" stroke-linecap="round" stroke-dasharray="600, 600" stroke-dashoffset="0" />
|
||||
</svg>
|
||||
</h1>
|
||||
<h6 class="txt-4001830 company-profile-h6">Since its establishment, Guangxi Hitosea Information Technology Co., Ltd.(HITOSEA) has been focusing on the innovation of cutting-edge technologies in the field of network security, providing network security products and services including border security, cloud security, data security, intranet security, and is committed to providing users with comprehensive, smarter, and zero-disturbance network security solutions, and is a dynamic technology company with a young and energetic team.</h6>
|
||||
<h6 class="txt-4001830 company-profile-h6">
|
||||
Since its establishment, Guangxi Hitosea
|
||||
Information Technology Co., Ltd.(HITOSEA)
|
||||
has been focusing on the innovation of
|
||||
cutting-edge technologies in the field of
|
||||
network security, providing network security
|
||||
products and services including border
|
||||
security, cloud security, data security,
|
||||
intranet security, and is committed to
|
||||
providing users with comprehensive, smarter,
|
||||
and zero-disturbance network security
|
||||
solutions, and is a dynamic technology
|
||||
company with a young and energetic team.
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -147,7 +186,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -163,10 +202,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
Support
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="support" >
|
||||
<ol class="drawer-active hide" id="support">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -174,7 +213,7 @@
|
||||
<a class="txt-4001620 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank" >Privacy Policy</a>
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
@ -191,28 +230,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
Theme
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="theme" >
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active hide" id="theme">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
Language
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="language">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -231,42 +270,89 @@
|
||||
<article class="scenario-app">
|
||||
<div class="scenario-app-con">
|
||||
<div class="scenario-app-layout">
|
||||
<h1 class="txt-5004455 scenario-app-h1 mb-16">Scenario Application</h1>
|
||||
<h6 class="txt-4001824 scenario-app-h6 mb-80" style="text-align: center;">The product supports a variety of application scenarios to help team collaboration</h6>
|
||||
<h1 class="txt-5004455 scenario-app-h1 mb-16">
|
||||
Scenario Application
|
||||
</h1>
|
||||
<h6 class="txt-4001824 scenario-app-h6 mb-80" style="text-align: center">
|
||||
The product supports a variety of
|
||||
application scenarios to help team
|
||||
collaboration
|
||||
</h6>
|
||||
<ul class="scenario-app-ul">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0s;">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon7.svg" alt="Edge Security">
|
||||
<img class="scenario-app-icon" src="../img/about_icon7.svg" alt="Edge Security" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">Edge Security</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">HITOSEA next-generation firewall, intrusion prevention/intrusion detection system, cloud sandbox and other products provide users with comprehensive intelligent security protection such as access control to network boundaries, deep attack detection and APT attack detection.</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/01.svg" alt="">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
Edge Security
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
HITOSEA next-generation firewall,
|
||||
intrusion prevention/intrusion
|
||||
detection system, cloud sandbox and
|
||||
other products provide users with
|
||||
comprehensive intelligent security
|
||||
protection such as access control to
|
||||
network boundaries, deep attack
|
||||
detection and APT attack detection.
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/01.svg" alt="" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0.1s;">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0.1s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon8.svg" alt="Cloud Security">
|
||||
<img class="scenario-app-icon" src="../img/about_icon8.svg" alt="Cloud Security" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">Cloud Security</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">We provide safe and reliable high-proof cloud servers to solve the primary network security risks faced by servers, alleviate the risk of business interruption due to flooding attacks, and meet the needs of regular security operations.</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/02.svg" alt="">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
Cloud Security
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
We provide safe and reliable
|
||||
high-proof cloud servers to solve
|
||||
the primary network security risks
|
||||
faced by servers, alleviate the risk
|
||||
of business interruption due to
|
||||
flooding attacks, and meet the needs
|
||||
of regular security operations.
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/02.svg" alt="" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.3s;">
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.3s">
|
||||
<i class="scenario-app-ul-item-icon-num"></i>
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon9.svg" alt="Data Security">
|
||||
<img class="scenario-app-icon" src="../img/about_icon9.svg" alt="Data Security" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">Data Security</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">Database audit and data leakage protection system can protect sensitive data and documents, identify data and monitor operations, and block data theft by internal and external personnel through the network, e-mail and other channels.</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/03.svg" alt="">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
Data Security
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
Database audit and data leakage
|
||||
protection system can protect
|
||||
sensitive data and documents,
|
||||
identify data and monitor
|
||||
operations, and block data theft by
|
||||
internal and external personnel
|
||||
through the network, e-mail and
|
||||
other channels.
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/03.svg" alt="" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.4s;">
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.4s">
|
||||
<i class="scenario-app-ul-item-icon-num"></i>
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon10.svg" alt="Intranet Security">
|
||||
<img class="scenario-app-icon" src="../img/about_icon10.svg" alt="Intranet Security" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">Intranet Security</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">Web application firewall and web anti-tampering system provide overall security protection for the application system, effectively blocking malicious behaviors such as web tampering and attacks.</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/04.svg" alt="">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
Intranet Security
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
Web application firewall and web
|
||||
anti-tampering system provide
|
||||
overall security protection for the
|
||||
application system, effectively
|
||||
blocking malicious behaviors such as
|
||||
web tampering and attacks.
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/04.svg" alt="" />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -276,35 +362,50 @@
|
||||
<div class="footer-t-con">
|
||||
<div class="footer-t-layout">
|
||||
<div class="footer-t-l">
|
||||
<h1 class="footer-t-h1 mb-56">We'd love to hear from you</h1>
|
||||
<h6 class="footer-t-h6 mb-56">Have questions about pricing, plans or products? Please fill out the form and we will contact you.</h6>
|
||||
<h1 class="footer-t-h1 mb-56">
|
||||
We'd love to hear from you
|
||||
</h1>
|
||||
<h6 class="footer-t-h6 mb-56">
|
||||
Have questions about pricing, plans or
|
||||
products? Please fill out the form and
|
||||
we will contact you.
|
||||
</h6>
|
||||
<div class="footer-t-contact mb-24">
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon1.svg" alt="Contact telephone number,0771-3164099">
|
||||
<h6 class="footer-t-contact-h6">0771-3164099</h6>
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon1.svg"
|
||||
alt="Contact telephone number,0771-3164099" />
|
||||
<h6 class="footer-t-contact-h6">
|
||||
0771-3164099
|
||||
</h6>
|
||||
</div>
|
||||
<div class="footer-t-contact">
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon2.svg" alt="E-mail,service@hitosea.com">
|
||||
<h6 class="footer-t-contact-h6">service@hitosea.com</h6>
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon2.svg"
|
||||
alt="E-mail,service@hitosea.com" />
|
||||
<h6 class="footer-t-contact-h6">
|
||||
service@hitosea.com
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
<form class="from">
|
||||
<ul class="from-ul">
|
||||
<li class="from-ul-item mb-16">
|
||||
<i class="from-ul-tags mb-8">Name</i>
|
||||
<input id="username" class="input" type="text" placeholder="Please enter a nickname">
|
||||
<input id="username" class="input" type="text" placeholder="Please enter a nickname" />
|
||||
</li>
|
||||
<li class="from-ul-item mb-16">
|
||||
<i class="from-ul-tags mb-8">Email</i>
|
||||
<input id="email" class="input" type="text" placeholder="Please enter your email address">
|
||||
<input id="email" class="input" type="text" placeholder="Please enter your email address" />
|
||||
</li>
|
||||
<li class="from-ul-item mb-16" id="desc_wrap">
|
||||
<i class="from-ul-tags mb-8">Message</i>
|
||||
<textarea id="desc" class="textarea" cols="3" rows="8" placeholder="Optional" oninput="limitCharacters(255)"></textarea>
|
||||
<textarea id="desc" class="textarea" cols="3" rows="8" placeholder="Optional"
|
||||
oninput="limitCharacters(255)"></textarea>
|
||||
<p id="characterCount">0/255</p>
|
||||
</li>
|
||||
<li>
|
||||
<span class="from-submit">
|
||||
<button class="btn btn-primary" id="loadingWrap" type="button" onclick="sendFormRequest()"><img id="submitLoading" alt="" src="../img/loading.png" />Submit</button>
|
||||
<button class="btn btn-primary" id="loadingWrap" type="button" onclick="sendFormRequest()">
|
||||
<img id="submitLoading" alt="" src="../img/loading.png" />Submit
|
||||
</button>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
@ -317,19 +418,22 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently and makes work easier.</i>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently
|
||||
and makes work easier.</i>
|
||||
</div>
|
||||
<div class="footer-r">
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Links</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Links
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/product.html">Product</a>
|
||||
</li>
|
||||
@ -346,7 +450,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Support</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Support
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -354,16 +460,20 @@
|
||||
<a class="txt-4001624 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Community</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Community
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -374,7 +484,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ group</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618" />
|
||||
<i class="group_num">Group：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -389,7 +499,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -402,19 +515,20 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script>
|
||||
/* 数字滚动动画 */
|
||||
const companyYearEl = document.querySelector('.company-year');
|
||||
const companyAreaEl = document.querySelector('.company-area');
|
||||
const companySizeEl = document.querySelector('.company-size');
|
||||
const companyYearEl = document.querySelector(".company-year");
|
||||
const companyAreaEl = document.querySelector(".company-area");
|
||||
const companySizeEl = document.querySelector(".company-size");
|
||||
let yearTimerId;
|
||||
let areaTimerId;
|
||||
let sizeTimerId;
|
||||
let curYearNumber = 999
|
||||
let curAreaNumber = 0
|
||||
let curSizeNumber = 0
|
||||
let curYearNumber = 999;
|
||||
let curAreaNumber = 0;
|
||||
let curSizeNumber = 0;
|
||||
function updateYearNumber() {
|
||||
const increment = Math.ceil((2020 - curYearNumber) / 50); // 使用缓动函数计算增量
|
||||
curYearNumber += increment; // 更新当前数字
|
||||
if (curYearNumber >= 2020) { // 数字已经达到目标值
|
||||
if (curYearNumber >= 2020) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(yearTimerId); // 停止定时器
|
||||
curYearNumber = 2020; // 将当前数字设置为目标值
|
||||
}
|
||||
@ -422,15 +536,19 @@
|
||||
}
|
||||
function updateAreaNumber() {
|
||||
curAreaNumber += 0.05; // 更新当前数字
|
||||
if (curAreaNumber >= 10) { // 数字已经达到目标值
|
||||
if (curAreaNumber >= 10) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(areaTimerId); // 停止定时器
|
||||
curAreaNumber = 10; // 将当前数字设置为目标值
|
||||
}
|
||||
companyAreaEl.innerText = Number(curAreaNumber.toFixed(1)).toString(); // 更新数字显示
|
||||
companyAreaEl.innerText = Number(
|
||||
curAreaNumber.toFixed(1)
|
||||
).toString(); // 更新数字显示
|
||||
}
|
||||
function updateSizeNumber() {
|
||||
curSizeNumber += 0.5; // 更新当前数字
|
||||
if (curSizeNumber >= 99) { // 数字已经达到目标值
|
||||
if (curSizeNumber >= 99) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(sizeTimerId); // 停止定时器
|
||||
curSizeNumber = 99; // 将当前数字设置为目标值
|
||||
}
|
||||
@ -441,176 +559,208 @@
|
||||
sizeTimerId = setInterval(updateSizeNumber, 1);
|
||||
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.about-animate-box');
|
||||
let timerId = null
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxes = document.querySelectorAll(".about-animate-box");
|
||||
let timerId = null;
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
timerId = setTimeout(()=>{
|
||||
box.classList.remove('about-animate-box');
|
||||
timerId = null
|
||||
},1300)
|
||||
box.classList.add("animate");
|
||||
timerId = setTimeout(() => {
|
||||
box.classList.remove("about-animate-box");
|
||||
timerId = null;
|
||||
}, 1300);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
/* 限制表单textarea字符数 */
|
||||
function limitCharacters( maxCharacters) {
|
||||
const textarea = document.getElementById("desc")
|
||||
function limitCharacters(maxCharacters) {
|
||||
const textarea = document.getElementById("desc");
|
||||
let text = textarea.value;
|
||||
if (text.length > maxCharacters) {
|
||||
textarea.value = text.slice(0, maxCharacters); // 截断文本
|
||||
textarea.value = text.slice(0, maxCharacters); // 截断文本
|
||||
text = textarea.value;
|
||||
}
|
||||
document.getElementById('characterCount').textContent = `${text.length}/${maxCharacters}`;
|
||||
document.getElementById(
|
||||
"characterCount"
|
||||
).textContent = `${text.length}/${maxCharacters}`;
|
||||
}
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text){
|
||||
const box = document.querySelector('.BulletBox')
|
||||
box.style.display = 'block'
|
||||
box.innerHTML = text
|
||||
setTimeout(()=>{
|
||||
box.style.display = 'none'
|
||||
},1000)
|
||||
function showBox(text) {
|
||||
const box = document.querySelector(".BulletBox");
|
||||
box.style.display = "block";
|
||||
box.innerHTML = text;
|
||||
setTimeout(() => {
|
||||
box.style.display = "none";
|
||||
}, 1000);
|
||||
}
|
||||
/* 表单发送请求 */
|
||||
function sendFormRequest(){
|
||||
const username = document.getElementById("username").value
|
||||
const form = document.querySelector('.from')
|
||||
const email = document.getElementById("email").value
|
||||
const desc = document.getElementById("desc").value
|
||||
const pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
|
||||
if(!username&&!email){
|
||||
return showBox('Nickname cannot be empty! Email cannot be empty！')
|
||||
}else if(!username){
|
||||
return showBox('Nickname cannot be empty!')
|
||||
}else if(!email){
|
||||
return showBox('Email cannot be empty!')
|
||||
}else if(email){
|
||||
if(!pattern.test(email)){
|
||||
return showBox('Email input error!')
|
||||
}else{
|
||||
const url = 'https://t.hitosea.com/api/dialog/msg/sendtext';
|
||||
function sendFormRequest() {
|
||||
const username = document.getElementById("username").value;
|
||||
const form = document.querySelector(".from");
|
||||
const email = document.getElementById("email").value;
|
||||
const desc = document.getElementById("desc").value;
|
||||
const pattern =
|
||||
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
|
||||
if (!username && !email) {
|
||||
return showBox(
|
||||
"Nickname cannot be empty! Email cannot be empty！"
|
||||
);
|
||||
} else if (!username) {
|
||||
return showBox("Nickname cannot be empty!");
|
||||
} else if (!email) {
|
||||
return showBox("Email cannot be empty!");
|
||||
} else if (email) {
|
||||
if (!pattern.test(email)) {
|
||||
return showBox("Email input error!");
|
||||
} else {
|
||||
const url = "https://t.hitosea.com/api/dialog/msg/sendtext";
|
||||
const headers = {
|
||||
'version': '0.22.0',
|
||||
'token': 'YIG8ANC8q2SAXWxKu7L4Nf5VLWDxBixpIl_OSDnaVTug7P_DVHq--HV_7QKl2rNYlmCs-xsQuj0NAfktdsbyxNqCU9efF2ggFOQCYoE7l-np9ltT-LOGj3LGU422lVRC',
|
||||
'content-type': 'application/json'
|
||||
version: "0.22.0",
|
||||
token: "YIG8ANC8q2SAXWxKu7L4Nf5VLWDxBixpIl_OSDnaVTug7P_DVHq--HV_7QKl2rNYlmCs-xsQuj0NAfktdsbyxNqCU9efF2ggFOQCYoE7l-np9ltT-LOGj3LGU422lVRC",
|
||||
"content-type": "application/json",
|
||||
};
|
||||
const data = {
|
||||
"dialog_id": 10466,
|
||||
"text": `[nickName]:${username}\n[email]:${email}\n[message]:${desc}
|
||||
dialog_id: 10466,
|
||||
text: `[nickName]:${username}\n[email]:${email}\n[message]:${desc}
|
||||
`,
|
||||
"silence": "no"
|
||||
silence: "no",
|
||||
};
|
||||
document.getElementById("submitLoading").style.display = "block"
|
||||
axios.post(url, data, { headers })
|
||||
.then(response => {
|
||||
form.reset()
|
||||
document.getElementById("submitLoading").style.display = "none"
|
||||
limitCharacters(255)
|
||||
showBox('Submitted successfully！')
|
||||
document.getElementById("submitLoading").style.display =
|
||||
"block";
|
||||
axios
|
||||
.post(url, data, { headers })
|
||||
.then((response) => {
|
||||
form.reset();
|
||||
document.getElementById(
|
||||
"submitLoading"
|
||||
).style.display = "none";
|
||||
limitCharacters(255);
|
||||
showBox("Submitted successfully！");
|
||||
})
|
||||
.catch(error => {
|
||||
form.reset()
|
||||
document.getElementById("submitLoading").style.display = "none"
|
||||
limitCharacters(255)
|
||||
showBox(error.message)
|
||||
.catch((error) => {
|
||||
form.reset();
|
||||
document.getElementById(
|
||||
"submitLoading"
|
||||
).style.display = "none";
|
||||
limitCharacters(255);
|
||||
showBox(error.message);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
1227
public/site/en/ad.html
Normal file
1227
public/site/en/ad.html
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>Download Center - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier.">
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/download.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier." />
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/download.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="BulletBox"></div>
|
||||
<div id="layout">
|
||||
@ -25,7 +28,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -38,7 +41,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
Support
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -48,10 +51,12 @@
|
||||
<a class="txt-4001418 txt-sub" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -64,36 +69,38 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="Brighter themes">
|
||||
<img src="../img/light.svg" alt="Brighter themes" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="Dark theme">
|
||||
<img src="../img/drak.svg" alt="Dark theme" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >Try Now</button>
|
||||
<button class="btn btn-primary">
|
||||
Try Now
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -103,54 +110,70 @@
|
||||
<div class="topics-tit mb-32 topics-tit-en">
|
||||
<span class="txt-6005670 topics-h1">Download DooTask client</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-64 topics-h4-en">Also supports iOS, Android, macOS, Windows versions</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-64 topics-h4-en">
|
||||
Also supports iOS, Android, macOS, Windows
|
||||
versions
|
||||
</h4>
|
||||
<ul class="download-ul">
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0s;" onmouseover='handleMouseover(0)' onmouseout='handleMouseout(0)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0s" onmouseover="handleMouseover(0)"
|
||||
onmouseout="handleMouseout(0)">
|
||||
<a class="normal" href="https://apps.apple.com/cn/app/dootask/id1624855111" target="_blank" id="ios">
|
||||
<img class="icon mb-8" src="../img/dow_ios.svg" alt="ios">
|
||||
<img class="icon mb-8" src="../img/dow_ios.svg" alt="ios" />
|
||||
<i class="txt-4001624 txt">ios</i>
|
||||
</a>
|
||||
<a class="hover" href="https://apps.apple.com/cn/app/dootask/id1624855111" target="_blank">
|
||||
<img class="qr-code mb-8" src="../img/ios_code.png" alt="Scan download,ios">
|
||||
<img class="qr-code mb-8" src="../img/ios_code.png" alt="Scan download,ios" />
|
||||
<i class="txt-4001624 txt"> Download</i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.1s;" onmouseover='handleMouseover(1)' onmouseout='handleMouseout(1)'>
|
||||
<a class="normal" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank" id="Android">
|
||||
<img class="icon mb-8" src="../img/dow_android.svg" alt="Android">
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.1s" onmouseover="handleMouseover(1)"
|
||||
onmouseout="handleMouseout(1)">
|
||||
<a class="normal" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank"
|
||||
id="Android">
|
||||
<img class="icon mb-8" src="../img/dow_android.svg" alt="Android" />
|
||||
<i class="txt-4001624 txt">Android</i>
|
||||
</a>
|
||||
<a class="hover radius" id="winx64Link" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,download">
|
||||
<a class="hover radius" id="winx64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,download" />
|
||||
<i class="txt-4001624 txt">Download</i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.2s;" onmouseover='handleMouseover(2)' onmouseout='handleMouseout(2)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.2s" onmouseover="handleMouseover(2)"
|
||||
onmouseout="handleMouseout(2)">
|
||||
<div class="normal">
|
||||
<img class="icon mb-8" src="../img/dow_mac.svg" alt="macOS">
|
||||
<img class="icon mb-8" src="../img/dow_mac.svg" alt="macOS" />
|
||||
<i class="txt-4001624 txt">macOS</i>
|
||||
</div>
|
||||
<div class="hover radius">
|
||||
<button class="btn btn-green mb-12 btn-padding" style="width: 70%;">
|
||||
<a class="chips-txt txt-4001418" id="arm64Link" href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=arm64" target="_blank">Apple Chips</a>
|
||||
<button class="btn btn-green mb-12 btn-padding" style="width: 70%">
|
||||
<a class="chips-txt txt-4001418" id="arm64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=arm64"
|
||||
target="_blank">Apple Chips</a>
|
||||
</button>
|
||||
<button class="btn btn-green btn-padding" style="width: 70%;">
|
||||
<a class="chips-txt txt-4001418" id="x64Link" href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=x64" target="_blank">Intel Chips</a>
|
||||
<button class="btn btn-green btn-padding" style="width: 70%">
|
||||
<a class="chips-txt txt-4001418" id="x64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=x64" target="_blank">Intel
|
||||
Chips</a>
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.3s;" onmouseover='handleMouseover(3)' onmouseout='handleMouseout(3)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.3s" onmouseover="handleMouseover(3)"
|
||||
onmouseout="handleMouseout(3)">
|
||||
<div class="normal">
|
||||
<img class="icon mb-8" src="../img/dow_window.svg" alt="Windows">
|
||||
<img class="icon mb-8" src="../img/dow_window.svg" alt="Windows" />
|
||||
<i class="txt-4001624 txt">Windows</i>
|
||||
</div>
|
||||
<a class="hover radius" id="winx64Link" href="https://www.dootask.com/desktop/publish/latest?platform=win&arch=x64" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,download">
|
||||
<a class="hover radius" id="winx64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=win&arch=x64" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,download" />
|
||||
<i class="txt-4001624 txt">Download</i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="download-other-btn dow-animate-box" style="--delay: 0.5s;" href="https://www.dootask.com/desktop/publish/latest" target="_blank"><span>Other Versions</span></a>
|
||||
<a class="download-other-btn dow-animate-box" style="--delay: 0.5s"
|
||||
href="https://www.dootask.com/desktop/publish/latest" target="_blank"><span>Other
|
||||
Versions</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -159,7 +182,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -175,7 +198,7 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
Support
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="support">
|
||||
@ -186,7 +209,7 @@
|
||||
<a class="txt-4001620 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
@ -203,28 +226,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
Theme
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" >
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active hide">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
Language
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="language" >
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active hide" id="language">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -245,19 +268,23 @@
|
||||
<div class="update-con">
|
||||
<div class="update-layout">
|
||||
<div class="update-l">
|
||||
<h1 class="txt-4003645 update-h1 mb-36">Update Log</h1>
|
||||
<h1 class="txt-4003645 update-h1 mb-36">
|
||||
Update Log
|
||||
</h1>
|
||||
<ul class="update-ul">
|
||||
<li id="releases"></li>
|
||||
<li>
|
||||
<a class="more-item" href="../en/log.html">
|
||||
<h5 class="txt-4001624 more">More Logs</h5>
|
||||
<img class="icon" src="../img/dow_arrow.svg" alt="More Logs">
|
||||
<h5 class="txt-4001624 more">
|
||||
More Logs
|
||||
</h5>
|
||||
<img class="icon" src="../img/dow_arrow.svg" alt="More Logs" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="update-r">
|
||||
<img class="update-r-svg" id="dow_pic1" src="../img/light/zh_dow_pic1.png" alt="Download Centre">
|
||||
<img class="update-r-svg" id="dow_pic1" src="../img/light/zh_dow_pic1.png" alt="Download Centre" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -268,19 +295,22 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently and makes work easier.</i>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently
|
||||
and makes work easier.</i>
|
||||
</div>
|
||||
<div class="footer-r">
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Links</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Links
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/product.html">Product</a>
|
||||
</li>
|
||||
@ -297,7 +327,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Support</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Support
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -305,16 +337,20 @@
|
||||
<a class="txt-4001624 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001620 txt" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Community</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Community
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -325,7 +361,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ group</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618" />
|
||||
<i class="group_num">Group：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -340,7 +376,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -352,231 +391,263 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script src="//cdn.bootcdn.net/ajax/libs/axios/1.3.6/axios.js"></script>
|
||||
<script>
|
||||
const isMobile = 'ontouchstart' in window
|
||||
const androidDOM = document.getElementById("Android")
|
||||
const iosDOM = document.getElementById("ios")
|
||||
// 判断是否为ios
|
||||
const isIos = /iPad|iPhone|iPod/.test(window.navigator.userAgent);
|
||||
// 判断是否为安卓
|
||||
const isAndroid = /Android/.test(window.navigator.userAgent);
|
||||
// 判断是否为windows
|
||||
const isWindows = /Win64/.test(window.navigator.userAgent);
|
||||
/* 下载应用的hover处理函数 */
|
||||
const download = document.querySelector('.download-ul');
|
||||
const downloadItems = download.querySelectorAll('.download-ul-item');
|
||||
const handleMouseover = (val)=>{
|
||||
if(isIos||isAndroid){
|
||||
return;
|
||||
}else{
|
||||
downloadItems[val].children[0].style.display = 'none'
|
||||
downloadItems[val].children[1].style.display = 'flex'
|
||||
}
|
||||
}
|
||||
const handleMouseout = (val)=>{
|
||||
if(isIos||isAndroid){
|
||||
return;
|
||||
}else{
|
||||
downloadItems[val].children[0].style.display = 'flex'
|
||||
downloadItems[val].children[1].style.display = 'none'
|
||||
}
|
||||
}
|
||||
/* 对于ios与Android pc端点击时a链接直接跳转 移动端点击时需要阻止a链接直接跳转 */
|
||||
androidDOM.addEventListener('click',function(e){
|
||||
if(isMobile){
|
||||
e.preventDefault()
|
||||
}
|
||||
})
|
||||
iosDOM.addEventListener('click',function(e){
|
||||
if(isMobile){
|
||||
e.preventDefault()
|
||||
}
|
||||
})
|
||||
// 对于不同类型的移动端进行处理
|
||||
function movieHandle(flag=true){
|
||||
if(flag){
|
||||
downloadItems.forEach((item,index)=>{
|
||||
item.addEventListener('touchstart',function(){
|
||||
if(index==2||index==3){
|
||||
return showBox("Not supported on current device")
|
||||
}
|
||||
if(index==0){
|
||||
if(isIos){
|
||||
window.location.href = item.children[0].href
|
||||
return
|
||||
}
|
||||
return showBox("Not supported on current device")
|
||||
}
|
||||
if(index==1){
|
||||
if(isAndroid){
|
||||
window.location.href = item.children[0].href
|
||||
return
|
||||
}
|
||||
return showBox("Not supported on current device")
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
// 移动端
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text){
|
||||
const box = document.querySelector('.BulletBox')
|
||||
box.style.display = 'block'
|
||||
box.innerHTML = text
|
||||
setTimeout(()=>{
|
||||
box.style.display = 'none'
|
||||
},1000)
|
||||
}
|
||||
// 是否是移动端
|
||||
if(isMobile){
|
||||
if(isAndroid||isIos){
|
||||
movieHandle()
|
||||
}else if(isWindows){
|
||||
movieHandle(false)
|
||||
}
|
||||
}
|
||||
const localStorageHandle = (val)=>{
|
||||
localStorage.setItem('update_log_num',val)
|
||||
window.location.href = '../en/log.html'
|
||||
}
|
||||
const getItem = (key)=> {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
}
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.dow-animate-box');
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
const isMobile = "ontouchstart" in window;
|
||||
const androidDOM = document.getElementById("Android");
|
||||
const iosDOM = document.getElementById("ios");
|
||||
// 判断是否为ios
|
||||
const isIos = /iPad|iPhone|iPod/.test(window.navigator.userAgent);
|
||||
// 判断是否为安卓
|
||||
const isAndroid = /Android/.test(window.navigator.userAgent);
|
||||
// 判断是否为windows
|
||||
const isWindows = /Win64/.test(window.navigator.userAgent);
|
||||
/* 下载应用的hover处理函数 */
|
||||
const download = document.querySelector(".download-ul");
|
||||
const downloadItems = download.querySelectorAll(".download-ul-item");
|
||||
const handleMouseover = (val) => {
|
||||
if (isIos || isAndroid) {
|
||||
return;
|
||||
} else {
|
||||
downloadItems[val].children[0].style.display = "none";
|
||||
downloadItems[val].children[1].style.display = "flex";
|
||||
}
|
||||
};
|
||||
const handleMouseout = (val) => {
|
||||
if (isIos || isAndroid) {
|
||||
return;
|
||||
} else {
|
||||
downloadItems[val].children[0].style.display = "flex";
|
||||
downloadItems[val].children[1].style.display = "none";
|
||||
}
|
||||
};
|
||||
/* 对于ios与Android pc端点击时a链接直接跳转 移动端点击时需要阻止a链接直接跳转 */
|
||||
androidDOM.addEventListener("click", function (e) {
|
||||
if (isMobile) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
animateBoxes();
|
||||
|
||||
// 获取日志
|
||||
const logsItem = getItem('logs_dowmload_en')
|
||||
const updates = document.getElementById('releases');
|
||||
if(!logsItem) {
|
||||
const url = "../../api/system/get/updatelog"
|
||||
axios.get(url).then(res=>{
|
||||
const changelog=res.data.data.updateLog
|
||||
const regex = /## \[(.*?)\]\n([\s\S]*?)(?=\n\n## \[|$)/g;
|
||||
let match;
|
||||
const Versions = []
|
||||
while ((match = regex.exec(changelog)) !== null) {
|
||||
Versions.push(match[1])
|
||||
iosDOM.addEventListener("click", function (e) {
|
||||
if (isMobile) {
|
||||
e.preventDefault();
|
||||
}
|
||||
const releases = Versions.slice(0,5).map((item,index)=>{
|
||||
return `
|
||||
<li class="update-item" onclick="localStorageHandle(${index+1})">
|
||||
});
|
||||
// 对于不同类型的移动端进行处理
|
||||
function movieHandle(flag = true) {
|
||||
if (flag) {
|
||||
downloadItems.forEach((item, index) => {
|
||||
item.addEventListener("touchstart", function () {
|
||||
if (index == 2 || index == 3) {
|
||||
return showBox("Not supported on current device");
|
||||
}
|
||||
if (index == 0) {
|
||||
if (isIos) {
|
||||
window.location.href = item.children[0].href;
|
||||
return;
|
||||
}
|
||||
return showBox("Not supported on current device");
|
||||
}
|
||||
if (index == 1) {
|
||||
if (isAndroid) {
|
||||
window.location.href = item.children[0].href;
|
||||
return;
|
||||
}
|
||||
return showBox("Not supported on current device");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
// 移动端
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text) {
|
||||
const box = document.querySelector(".BulletBox");
|
||||
box.style.display = "block";
|
||||
box.innerHTML = text;
|
||||
setTimeout(() => {
|
||||
box.style.display = "none";
|
||||
}, 1000);
|
||||
}
|
||||
// 是否是移动端
|
||||
if (isMobile) {
|
||||
if (isAndroid || isIos) {
|
||||
movieHandle();
|
||||
} else if (isWindows) {
|
||||
movieHandle(false);
|
||||
}
|
||||
}
|
||||
const localStorageHandle = (val) => {
|
||||
localStorage.setItem("update_log_num", val);
|
||||
window.location.href = "../en/log.html";
|
||||
};
|
||||
const getItem = (key) => {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
};
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll(".dow-animate-box");
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add("animate");
|
||||
}
|
||||
});
|
||||
};
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
|
||||
// 获取日志
|
||||
const logsItem = getItem("logs_dowmload_en");
|
||||
const updates = document.getElementById("releases");
|
||||
if (!logsItem) {
|
||||
const url = "../../api/system/get/updatelog";
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => {
|
||||
const changelog = res.data.data.updateLog;
|
||||
const regex = /## \[(.*?)\]\n([\s\S]*?)(?=\n\n## \[|$)/g;
|
||||
let match;
|
||||
const Versions = [];
|
||||
while ((match = regex.exec(changelog)) !== null) {
|
||||
Versions.push(match[1]);
|
||||
}
|
||||
const releases = Versions.slice(0, 5)
|
||||
.map((item, index) => {
|
||||
return `
|
||||
<li class="update-item" onclick="localStorageHandle(${index + 1})">
|
||||
<h5 class="txt-4001624 update-h5">DooTask ${item} update</h5>
|
||||
</li>
|
||||
`;
|
||||
}).join('')
|
||||
let record = {value: releases, expired: new Date().getTime() + 30 * 60 * 1000};
|
||||
localStorage.setItem('logs_dowmload_en', JSON.stringify(record))
|
||||
updates.innerHTML = releases;
|
||||
}).catch(err=>{
|
||||
})
|
||||
}else{
|
||||
updates.innerHTML = logsItem;
|
||||
}
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
})
|
||||
.join("");
|
||||
let record = {
|
||||
value: releases,
|
||||
expired: new Date().getTime() + 30 * 60 * 1000,
|
||||
};
|
||||
localStorage.setItem(
|
||||
"logs_dowmload_en",
|
||||
JSON.stringify(record)
|
||||
);
|
||||
updates.innerHTML = releases;
|
||||
})
|
||||
.catch((err) => { });
|
||||
} else {
|
||||
updates.innerHTML = logsItem;
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>Logs - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier.">
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/log.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier." />
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/log.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="layout">
|
||||
<!-- 页头区域 -->
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
Support
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -47,10 +50,12 @@
|
||||
<a class="txt-4001418 txt-sub" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,7 +68,7 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
@ -74,25 +79,27 @@
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="Light theme">
|
||||
<img src="../img/light.svg" alt="Light theme" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="Dark theme">
|
||||
<img src="../img/drak.svg" alt="Dark theme" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >Try Now</button>
|
||||
<button class="btn btn-primary">
|
||||
Try Now
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -101,7 +108,7 @@
|
||||
<div class="logs-drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeLogsDraweHandle()">✕</i>
|
||||
@ -113,7 +120,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -129,10 +136,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
Support
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="support" >
|
||||
<ol class="drawer-active hide" id="support">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -157,28 +164,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
Theme
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="theme" >
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active hide" id="theme">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
Language
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="language" >
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active hide" id="language">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -197,7 +204,7 @@
|
||||
<article class="logs">
|
||||
<div class="logs-con">
|
||||
<div class="logs-t-768" id="menuBtn-logs">
|
||||
<img class="logs-t-prev" src="../img/prev.svg" alt="Logs">
|
||||
<img class="logs-t-prev" src="../img/prev.svg" alt="Logs" />
|
||||
<i class="logs-t-tit">Logs</i>
|
||||
</div>
|
||||
<div class="logs-layout">
|
||||
@ -206,7 +213,9 @@
|
||||
<ul class="logs-l-ul logs-l-1920" id="help-l-ul"></ul>
|
||||
</div>
|
||||
<div class="logs-r" id="google_translate_element">
|
||||
<h1 class="txt-6003645 logs-h1 mb-36">DooTask Update Log </h1>
|
||||
<h1 class="txt-6003645 logs-h1 mb-36">
|
||||
DooTask Update Log
|
||||
</h1>
|
||||
<ul class="logs-r-ul"></ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -217,19 +226,22 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently and makes work easier.</i>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently
|
||||
and makes work easier.</i>
|
||||
</div>
|
||||
<div class="footer-r">
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Links</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Links
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/product.html">Product</a>
|
||||
</li>
|
||||
@ -246,7 +258,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Support</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Support
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -254,16 +268,20 @@
|
||||
<a class="txt-4001624 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Community</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Community
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -274,7 +292,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ group</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618" />
|
||||
<i class="group_num">Group：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -289,7 +307,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -302,325 +323,380 @@
|
||||
<script src="//cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
|
||||
<script src="//cdn.bootcdn.net/ajax/libs/axios/1.3.6/axios.js"></script>
|
||||
<script>
|
||||
const getItem = (key)=> {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
}
|
||||
function getUpdatesFromHtml(html,li) {
|
||||
html.map(item=>{
|
||||
const liItem = document.createElement('li');
|
||||
liItem.className = 'txt-4001624 r-ol-item mb-12 pl-26';
|
||||
liItem.innerHTML = `
|
||||
const getItem = (key) => {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
};
|
||||
function getUpdatesFromHtml(html, li) {
|
||||
html.map((item) => {
|
||||
const liItem = document.createElement("li");
|
||||
liItem.className = "txt-4001624 r-ol-item mb-12 pl-26";
|
||||
liItem.innerHTML = `
|
||||
<i class="dots"></i>${item};
|
||||
`;
|
||||
const ol = li.querySelector('.logs-r-ol')
|
||||
ol.appendChild(liItem)
|
||||
})
|
||||
}
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
const closeLogsDraweHandle = ()=>{
|
||||
logsDrawer.classList.remove('open-logs-drawer');
|
||||
}
|
||||
function domHandle (html){
|
||||
const changelog = document.querySelector('.logs-r-ul');
|
||||
const rlog = document.querySelector('.logs-l-1920');
|
||||
const rlog2 = document.querySelector('.logs-l-768');
|
||||
const versions = html.match(/<h2>(.*?)<\/h2>/g).slice(0, 15);
|
||||
const versionsNumbers = versions.map(str => str.split('<h2>[')[1].split(']</h2>')[0]);
|
||||
for (let i = 0; i < versionsNumbers.length; i++) {
|
||||
const updatesHtml = html.split(versionsNumbers[i])[1].split('<h2>')[0].match(/<li>(.*?)<\/li>/g);
|
||||
const updatesHtmlText = updatesHtml.map(str => str.split('<li>')[1].split('</li>')[0]);
|
||||
const rLi = document.createElement('li');
|
||||
rLi.className = `l-ul-item ${i==0?'active':''}`;
|
||||
rLi.setAttribute('data-id',`section-${i+1}`)
|
||||
rLi.innerHTML = `
|
||||
const ol = li.querySelector(".logs-r-ol");
|
||||
ol.appendChild(liItem);
|
||||
});
|
||||
}
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
const closeLogsDraweHandle = () => {
|
||||
logsDrawer.classList.remove("open-logs-drawer");
|
||||
};
|
||||
function domHandle(html) {
|
||||
const changelog = document.querySelector(".logs-r-ul");
|
||||
const rlog = document.querySelector(".logs-l-1920");
|
||||
const rlog2 = document.querySelector(".logs-l-768");
|
||||
const versions = html.match(/<h2>(.*?)<\/h2>/g).slice(0, 15);
|
||||
const versionsNumbers = versions.map(
|
||||
(str) => str.split("<h2>[")[1].split("]</h2>")[0]
|
||||
);
|
||||
for (let i = 0; i < versionsNumbers.length; i++) {
|
||||
const updatesHtml = html
|
||||
.split(versionsNumbers[i])[1]
|
||||
.split("<h2>")[0]
|
||||
.match(/<li>(.*?)<\/li>/g);
|
||||
const updatesHtmlText = updatesHtml.map(
|
||||
(str) => str.split("<li>")[1].split("</li>")[0]
|
||||
);
|
||||
const rLi = document.createElement("li");
|
||||
rLi.className = `l-ul-item ${i == 0 ? "active" : ""}`;
|
||||
rLi.setAttribute("data-id", `section-${i + 1}`);
|
||||
rLi.innerHTML = `
|
||||
<a class="txt-4001620 txt log-a">v${versionsNumbers[i]} update</a>
|
||||
`;
|
||||
const rLi2 = document.createElement('li');
|
||||
rLi2.className = `l-ul-item`;
|
||||
rLi2.setAttribute('data-id',`section-${i+1}`)
|
||||
rLi2.addEventListener('click', function() {
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
logsDrawer.classList.remove('open-logs-drawer');
|
||||
});
|
||||
rLi2.innerHTML = `
|
||||
const rLi2 = document.createElement("li");
|
||||
rLi2.className = `l-ul-item`;
|
||||
rLi2.setAttribute("data-id", `section-${i + 1}`);
|
||||
rLi2.addEventListener("click", function () {
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
logsDrawer.classList.remove("open-logs-drawer");
|
||||
});
|
||||
rLi2.innerHTML = `
|
||||
<a class="txt-4001620 txt">v${versionsNumbers[i]} update</a>
|
||||
`;
|
||||
rlog.appendChild(rLi);
|
||||
rlog2.appendChild(rLi2);
|
||||
rlog.appendChild(rLi);
|
||||
rlog2.appendChild(rLi2);
|
||||
|
||||
const li = document.createElement('li');
|
||||
li.className = 'r-ul-item mb-36';
|
||||
li.innerHTML = `
|
||||
const li = document.createElement("li");
|
||||
li.className = "r-ul-item mb-36";
|
||||
li.innerHTML = `
|
||||
<ol class="logs-r-ol">
|
||||
<li class="txt-4001624 r-ol-item mb-24" id="section-${i+1}"><h4 class="logs-h4">v${versionsNumbers[i]} update</h4></li>
|
||||
<li class="txt-4001624 r-ol-item mb-24" id="section-${i + 1
|
||||
}"><h4 class="logs-h4">v${versionsNumbers[i]} update</h4></li>
|
||||
</ol>
|
||||
`;
|
||||
changelog.appendChild(li);
|
||||
getUpdatesFromHtml(updatesHtmlText,li)
|
||||
// translateAllText()
|
||||
}
|
||||
let updateLogNum = localStorage.getItem('update_log_num')
|
||||
/* logs点击激活函数 */
|
||||
let isThrottled = false;
|
||||
let timerId;
|
||||
const logs_tabs = document.querySelector('.logs-l-1920');
|
||||
const logs_tabItems = logs_tabs.querySelectorAll('.l-ul-item');
|
||||
const contentContainer = document.querySelector('.logs-r');
|
||||
const contentContainer_Items = contentContainer.querySelectorAll('.r-ul-item');
|
||||
const sections = Array.from(document.querySelectorAll('h4'));
|
||||
logs_tabs.addEventListener('click', function (event) {
|
||||
const clickedItem = event.target.closest('.l-ul-item');
|
||||
clearTimeout(timerId);
|
||||
if (clickedItem && !clickedItem.classList.contains('active')) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle('active', value === clickedItem);
|
||||
}
|
||||
changelog.appendChild(li);
|
||||
getUpdatesFromHtml(updatesHtmlText, li);
|
||||
// translateAllText()
|
||||
}
|
||||
});
|
||||
const handleScroll = ()=> {
|
||||
if (!isThrottled) {
|
||||
isThrottled = true;
|
||||
// 在下一个滴答钟时重置isThrottled标志位
|
||||
timerId = setTimeout(() => {
|
||||
isThrottled = false;
|
||||
}, 0);
|
||||
// 处理滚动事件
|
||||
const currentScrollPosition = contentContainer.scrollTop;
|
||||
// 获取当前滚动位置并遍历所有标题元素
|
||||
sections.map((item,index)=>{
|
||||
const section = sections[index];
|
||||
if(section.offsetParent.offsetTop <= currentScrollPosition){
|
||||
// 将对应的菜单项设置为激活状态
|
||||
const activeMenuItem = logs_tabItems[index];
|
||||
if (activeMenuItem) {
|
||||
Array.from(logs_tabItems).forEach(titem => titem.classList.remove('active'));
|
||||
activeMenuItem.classList.add('active');
|
||||
}
|
||||
let updateLogNum = localStorage.getItem("update_log_num");
|
||||
/* logs点击激活函数 */
|
||||
let isThrottled = false;
|
||||
let timerId;
|
||||
const logs_tabs = document.querySelector(".logs-l-1920");
|
||||
const logs_tabItems = logs_tabs.querySelectorAll(".l-ul-item");
|
||||
const contentContainer = document.querySelector(".logs-r");
|
||||
const contentContainer_Items =
|
||||
contentContainer.querySelectorAll(".r-ul-item");
|
||||
const sections = Array.from(document.querySelectorAll("h4"));
|
||||
logs_tabs.addEventListener("click", function (event) {
|
||||
const clickedItem = event.target.closest(".l-ul-item");
|
||||
clearTimeout(timerId);
|
||||
if (clickedItem && !clickedItem.classList.contains("active")) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle("active", value === clickedItem);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
contentContainer.addEventListener('scroll', handleScroll);
|
||||
/* 当屏幕宽度低于768px时显示logs的抽屉的相关操作逻辑 */
|
||||
const logsMenuBtn = document.getElementById('menuBtn-logs');
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
logsMenuBtn.addEventListener('click', () => {
|
||||
logsDrawer.classList.add('open-logs-drawer');
|
||||
});
|
||||
/* 从下载页跳转过来执行的函数 */
|
||||
const handleMou = ()=>{
|
||||
const clickedItem = logs_tabItems[updateLogNum-1];
|
||||
if (clickedItem && !clickedItem.classList.contains('active')) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle('active', value === clickedItem);
|
||||
}
|
||||
}
|
||||
window.history.scrollRestoration = 'manual';
|
||||
const topSection = changelog.querySelector(`#section-${updateLogNum}`)
|
||||
if (topSection) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition = topSection.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition-offset,
|
||||
});
|
||||
const handleScroll = () => {
|
||||
if (!isThrottled) {
|
||||
isThrottled = true;
|
||||
// 在下一个滴答钟时重置isThrottled标志位
|
||||
timerId = setTimeout(() => {
|
||||
isThrottled = false;
|
||||
}, 0);
|
||||
// 处理滚动事件
|
||||
const currentScrollPosition = contentContainer.scrollTop;
|
||||
// 获取当前滚动位置并遍历所有标题元素
|
||||
sections.map((item, index) => {
|
||||
const section = sections[index];
|
||||
if (
|
||||
section.offsetParent.offsetTop <=
|
||||
currentScrollPosition
|
||||
) {
|
||||
// 将对应的菜单项设置为激活状态
|
||||
const activeMenuItem = logs_tabItems[index];
|
||||
if (activeMenuItem) {
|
||||
Array.from(logs_tabItems).forEach((titem) =>
|
||||
titem.classList.remove("active")
|
||||
);
|
||||
activeMenuItem.classList.add("active");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
contentContainer.addEventListener("scroll", handleScroll);
|
||||
/* 当屏幕宽度低于768px时显示logs的抽屉的相关操作逻辑 */
|
||||
const logsMenuBtn = document.getElementById("menuBtn-logs");
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
logsMenuBtn.addEventListener("click", () => {
|
||||
logsDrawer.classList.add("open-logs-drawer");
|
||||
});
|
||||
/* 从下载页跳转过来执行的函数 */
|
||||
const handleMou = () => {
|
||||
const clickedItem = logs_tabItems[updateLogNum - 1];
|
||||
if (clickedItem && !clickedItem.classList.contains("active")) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle("active", value === clickedItem);
|
||||
}
|
||||
}
|
||||
window.history.scrollRestoration = "manual";
|
||||
const topSection = changelog.querySelector(
|
||||
`#section-${updateLogNum}`
|
||||
);
|
||||
if (topSection) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition =
|
||||
topSection.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition - offset,
|
||||
});
|
||||
}
|
||||
};
|
||||
handleMou();
|
||||
localStorage.removeItem("update_log_num");
|
||||
}
|
||||
const logs = getItem("logs");
|
||||
if (!logs) {
|
||||
const url = "../../api/system/get/updatelog";
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => {
|
||||
const changelog = res.data.data.updateLog;
|
||||
const md = new markdownit();
|
||||
const html = md.render(changelog);
|
||||
let record = {
|
||||
value: html,
|
||||
expired: new Date().getTime() + 30 * 60 * 1000,
|
||||
};
|
||||
localStorage.setItem("logs", JSON.stringify(record));
|
||||
domHandle(html);
|
||||
logsHandler();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err, "err");
|
||||
});
|
||||
} else {
|
||||
domHandle(logs);
|
||||
logsHandler();
|
||||
}
|
||||
let tabItems1 = document.querySelectorAll(".l-ul-item");
|
||||
function rm() {
|
||||
tabItems1.forEach((link1) => {
|
||||
link1.classList.remove("active");
|
||||
});
|
||||
}
|
||||
function logsHandler() {
|
||||
let tabItems = document.querySelectorAll(".l-ul-item");
|
||||
function rm() {
|
||||
tabItems.forEach((link1) => {
|
||||
link1.classList.remove("active");
|
||||
});
|
||||
}
|
||||
}
|
||||
handleMou()
|
||||
localStorage.removeItem('update_log_num')
|
||||
}
|
||||
const logs = getItem('logs')
|
||||
if(!logs) {
|
||||
const url = "../../api/system/get/updatelog"
|
||||
axios.get(url).then(res=>{
|
||||
const changelog=res.data.data.updateLog
|
||||
const md = new markdownit();
|
||||
const html = md.render(changelog);
|
||||
let record = {value: html, expired: new Date().getTime() + 30 * 60 * 1000};
|
||||
localStorage.setItem('logs',JSON.stringify(record))
|
||||
domHandle(html)
|
||||
logsHandler()
|
||||
}).catch(err=>{
|
||||
console.log(err,"err");
|
||||
})
|
||||
}else{
|
||||
domHandle(logs)
|
||||
logsHandler()
|
||||
}
|
||||
let tabItems1 = document.querySelectorAll('.l-ul-item');
|
||||
function rm(){
|
||||
tabItems1.forEach(link1=>{
|
||||
link1.classList.remove('active')
|
||||
})
|
||||
}
|
||||
function logsHandler(){
|
||||
let tabItems = document.querySelectorAll('.l-ul-item');
|
||||
function rm(){
|
||||
tabItems.forEach(link1=>{
|
||||
link1.classList.remove('active')
|
||||
})
|
||||
}
|
||||
tabItems.forEach(item=>{
|
||||
item.addEventListener('click',function(event){
|
||||
event.preventDefault()
|
||||
const id = event.currentTarget.getAttribute('data-id')
|
||||
const content = document.getElementById(`${id}`)
|
||||
if (content) {
|
||||
tabItems.forEach((item) => {
|
||||
item.addEventListener("click", function (event) {
|
||||
event.preventDefault();
|
||||
const id = event.currentTarget.getAttribute("data-id");
|
||||
const content = document.getElementById(`${id}`);
|
||||
if (content) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition = content.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
const targetPosition =
|
||||
content.getBoundingClientRect().top +
|
||||
window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition-offset,
|
||||
behavior: "smooth"
|
||||
top: targetPosition - offset,
|
||||
behavior: "smooth",
|
||||
});
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
function getAllDataIds(parentId) {
|
||||
});
|
||||
});
|
||||
}
|
||||
function getAllDataIds(parentId) {
|
||||
let parentElement = document.getElementById(parentId);
|
||||
if (parentElement) {
|
||||
let elementsWithDataId = parentElement.querySelectorAll("[data-id]");
|
||||
let dataIds = [];
|
||||
for (let i = 0; i < elementsWithDataId.length; i++) {
|
||||
let dataId = elementsWithDataId[i].getAttribute("data-id");
|
||||
dataIds.push(dataId);
|
||||
}
|
||||
return dataIds;
|
||||
let elementsWithDataId =
|
||||
parentElement.querySelectorAll("[data-id]");
|
||||
let dataIds = [];
|
||||
for (let i = 0; i < elementsWithDataId.length; i++) {
|
||||
let dataId = elementsWithDataId[i].getAttribute("data-id");
|
||||
dataIds.push(dataId);
|
||||
}
|
||||
return dataIds;
|
||||
}
|
||||
return [];
|
||||
}
|
||||
let allDataIds = getAllDataIds("help-l-ul");
|
||||
let arrOffsetTop = []
|
||||
allDataIds.map(item=>{
|
||||
}
|
||||
let allDataIds = getAllDataIds("help-l-ul");
|
||||
let arrOffsetTop = [];
|
||||
allDataIds.map((item) => {
|
||||
let id = document.getElementById(`${item}`);
|
||||
arrOffsetTop.push(id.offsetTop)
|
||||
})
|
||||
// 监听页面滚动事件
|
||||
window.addEventListener('scroll',scrollHandler)
|
||||
function scrollHandler(){
|
||||
arrOffsetTop.push(id.offsetTop);
|
||||
});
|
||||
// 监听页面滚动事件
|
||||
window.addEventListener("scroll", scrollHandler);
|
||||
function scrollHandler() {
|
||||
for (let i = 0; i < arrOffsetTop.length; i++) {
|
||||
if(window.scrollY<=arrOffsetTop[0]){
|
||||
rm()
|
||||
let elementsWithDataId = document.querySelectorAll("[data-id='" + `section-${1}` + "']");
|
||||
if (window.scrollY <= arrOffsetTop[0]) {
|
||||
rm();
|
||||
let elementsWithDataId = document.querySelectorAll(
|
||||
"[data-id='" + `section-${1}` + "']"
|
||||
);
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
return;
|
||||
}
|
||||
if (arrOffsetTop[i] > window.scrollY || window.scrollY<=arrOffsetTop[0]){
|
||||
rm()
|
||||
let elementsWithDataId = document.querySelectorAll("[data-id='" + `section-${i}` + "']");
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
//滚动设置
|
||||
const liHight = elementsWithDataId[1]?.offsetTop;
|
||||
const pHihtt = elementsWithDataId[1]?.offsetHeight;
|
||||
const ulElement = document.getElementById('help-l-ul'); // 替换为你的 <div> 元素的 id
|
||||
const scrollHeight = ulElement.scrollTop;
|
||||
const ulHeight = ulElement.offsetHeight;
|
||||
if (liHight > scrollHeight + ulHeight) {
|
||||
ulElement.scrollTop += (pHihtt + pHihtt);
|
||||
}
|
||||
if ((liHight - scrollHeight) <= 40) {
|
||||
ulElement.scrollTop -= (pHihtt );
|
||||
}
|
||||
return;
|
||||
if (
|
||||
arrOffsetTop[i] > window.scrollY ||
|
||||
window.scrollY <= arrOffsetTop[0]
|
||||
) {
|
||||
rm();
|
||||
let elementsWithDataId = document.querySelectorAll(
|
||||
"[data-id='" + `section-${i}` + "']"
|
||||
);
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
//滚动设置
|
||||
const liHight = elementsWithDataId[1]?.offsetTop;
|
||||
const pHihtt = elementsWithDataId[1]?.offsetHeight;
|
||||
const ulElement = document.getElementById("help-l-ul"); // 替换为你的 <div> 元素的 id
|
||||
const scrollHeight = ulElement.scrollTop;
|
||||
const ulHeight = ulElement.offsetHeight;
|
||||
if (liHight > scrollHeight + ulHeight) {
|
||||
ulElement.scrollTop += pHihtt + pHihtt;
|
||||
}
|
||||
if (liHight - scrollHeight <= 40) {
|
||||
ulElement.scrollTop -= pHihtt;
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>Solutions - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier.">
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/solution.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="Lightweight open source online project task management tool to help teams efficiently advance their projects and make work easier." />
|
||||
<meta name="keywords" content="China DooTask Task management Lightweight Hitosea Teamwork" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/solution.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="layout">
|
||||
<!-- 页头区域 -->
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
Support
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="Support" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -47,10 +50,12 @@
|
||||
<a class="txt-4001418 txt-sub" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001418 txt-sub" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,36 +68,38 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="Language switch" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="Light theme">
|
||||
<img src="../img/light.svg" alt="Light theme" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="Dark theme">
|
||||
<img src="../img/drak.svg" alt="Dark theme" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >Try Now</button>
|
||||
<button class="btn btn-primary">
|
||||
Try Now
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="Menu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -102,11 +109,17 @@
|
||||
<div class="topics-tit mb-32 topics-tit-en">
|
||||
<span class="txt-6007290 topics-h1">Helping you collaborate better</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32 topics-h4-en">DooTask offers a range of solutions based on different scenarios so that you can quickly start collaborating with your team or department</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32 topics-h4-en">
|
||||
DooTask offers a range of solutions based on
|
||||
different scenarios so that you can quickly
|
||||
start collaborating with your team or department
|
||||
</h4>
|
||||
<div class="flex-cc topics-btn">
|
||||
<span class="mr-24 get-started">
|
||||
<a href="./price.html" >
|
||||
<button class="btn btn-primary mr-20">Get Started</button>
|
||||
<a href="./price.html">
|
||||
<button class="btn btn-primary mr-20">
|
||||
Get Started
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
@ -118,7 +131,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -134,10 +147,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
Support
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="Support" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="support" >
|
||||
<ol class="drawer-active hide" id="support">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -162,28 +175,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
Theme
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="Theme" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="theme" >
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active hide" id="theme">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
Language
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="Language" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active hide" id="language" >
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active hide" id="language">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -203,39 +216,96 @@
|
||||
<div class="bg-style">
|
||||
<div class="app-con">
|
||||
<div class="app-tit">
|
||||
<h1 class="txt-5004455 app-h1 mb-16">Scenario Application</h1>
|
||||
<div style="text-align: center;">
|
||||
<h6 class="txt-4001830 app-h5" style="width: 600px;">The product supports a variety of application scenarios to help team collaboration</h6>
|
||||
<h1 class="txt-5004455 app-h1 mb-16">
|
||||
Scenario Application
|
||||
</h1>
|
||||
<div style="text-align: center">
|
||||
<h6 class="txt-4001830 app-h5" style="width: 600px">
|
||||
The product supports a variety of
|
||||
application scenarios to help team
|
||||
collaboration
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="app-ul mt-80">
|
||||
<li class="app-ul-item mb-48">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic1" src="../img/light/zh_solution_pic1.png" alt="Project Management">
|
||||
<img class="app-bg" id="solution_pic1" src="../img/light/zh_solution_pic1.png"
|
||||
alt="Project Management" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Project Management</h4>
|
||||
<h6 class="txt-4001624 app-h6">Support a variety of project management models, such as Agile Development, Crystal Planning, Kanban, etc., for all sizes and types of project management. Users can use the project management tools in DooTask, such as task assignment, progress tracking, resource allocation, etc. to manage the whole project.</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Project Management
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
Support a variety of project
|
||||
management models, such as Agile
|
||||
Development, Crystal Planning,
|
||||
Kanban, etc., for all sizes and
|
||||
types of project management. Users
|
||||
can use the project management tools
|
||||
in DooTask, such as task assignment,
|
||||
progress tracking, resource
|
||||
allocation, etc. to manage the whole
|
||||
project.
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item mb-48">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic2" src="../img/light/zh_solution_pic2.png" alt="Team Collaboration">
|
||||
<img class="app-bg" id="solution_pic2" src="../img/light/zh_solution_pic2.png"
|
||||
alt="Team Collaboration" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Team Collaboration</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask's rich and useful tools can facilitate communication and collaboration among team members and improve work efficiency. For example, team members can use the document collaboration tools, online mind maps, flowcharts and other tools in DooTask to collaborate.</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Team Collaboration
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask's rich and useful tools can
|
||||
facilitate communication and
|
||||
collaboration among team members and
|
||||
improve work efficiency. For
|
||||
example, team members can use the
|
||||
document collaboration tools, online
|
||||
mind maps, flowcharts and other
|
||||
tools in DooTask to collaborate.
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic3" src="../img/light/zh_solution_pic3.png" alt="Data Security Protection">
|
||||
<img class="app-bg" id="solution_pic3" src="../img/light/zh_solution_pic3.png"
|
||||
alt="Data Security Protection" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Data Security Protection</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask uses asymmetric encryption technology in its messaging function to ensure maximum protection of users' information. In addition, it also provides a powerful permission management system that enables flexible setting of permissions and scope of operations for different users in project management according to their roles and responsibilities.</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Data Security Protection
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask uses asymmetric encryption
|
||||
technology in its messaging function
|
||||
to ensure maximum protection of
|
||||
users' information. In addition, it
|
||||
also provides a powerful permission
|
||||
management system that enables
|
||||
flexible setting of permissions and
|
||||
scope of operations for different
|
||||
users in project management
|
||||
according to their roles and
|
||||
responsibilities.
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic4" src="../img/light/solution_pic4.png" alt="Free Customization">
|
||||
<img class="app-bg" id="solution_pic4" src="../img/light/solution_pic4.png"
|
||||
alt="Free Customization" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Free Customization</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask is a completely open source tool that allows users to freely modify and customize it, avoiding the extra costs associated with commercial software subscription fees.</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Free Customization
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask is a completely open source
|
||||
tool that allows users to freely
|
||||
modify and customize it, avoiding
|
||||
the extra costs associated with
|
||||
commercial software subscription
|
||||
fees.
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -243,23 +313,65 @@
|
||||
</article>
|
||||
<article class="team solutions">
|
||||
<div class="team-con">
|
||||
<h1 class="txt-5004455 team-tit">Team Operations</h1>
|
||||
<h1 class="txt-5004455 team-tit">
|
||||
Team Operations
|
||||
</h1>
|
||||
<ul class="team-ul mt-80">
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon1.svg" alt="Corporate Management">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Corporate Management</h4>
|
||||
<h6 class="txt-4001624 app-h6">Helping enterprises to their corporate goals, connecting goals, key results and individual work, and jointly promoting strategy implementation and goal achievement;Through co-creation, share the progress, completion status, and schedule of all corporate work, promote information flow, allow all staff to access key information of projects, follow up in time, and promote cross-departmental collaboration.Translated with DeepL</h6>
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon1.svg" alt="Corporate Management" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Corporate Management
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
Helping enterprises to their corporate
|
||||
goals, connecting goals, key results and
|
||||
individual work, and jointly promoting
|
||||
strategy implementation and goal
|
||||
achievement;Through co-creation, share
|
||||
the progress, completion status, and
|
||||
schedule of all corporate work, promote
|
||||
information flow, allow all staff to
|
||||
access key information of projects,
|
||||
follow up in time, and promote
|
||||
cross-departmental
|
||||
collaboration.Translated with DeepL
|
||||
</h6>
|
||||
</li>
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0.1s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon2.svg" alt="Product Management">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Product Management</h4>
|
||||
<h6 class="txt-4001624 app-h6">Customize the workflow of the product development process, assign tasks to different roles at different stages, and promote the product development process;
|
||||
Uniform archiving of each completed project and task history data, which is convenient to recall or discuss at any time, forming a closed loop of knowledge precipitation to reuse.</h6>
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0.1s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon2.svg" alt="Product Management" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Product Management
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
Customize the workflow of the product
|
||||
development process, assign tasks to
|
||||
different roles at different stages, and
|
||||
promote the product development process;
|
||||
Uniform archiving of each completed
|
||||
project and task history data, which is
|
||||
convenient to recall or discuss at any
|
||||
time, forming a closed loop of knowledge
|
||||
precipitation to reuse.
|
||||
</h6>
|
||||
</li>
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0.2s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon3.svg" alt="Corporate Management">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">Corporate Management</h4>
|
||||
<h6 class="txt-4001624 app-h6">Get multi-dimensional corporate data through data visualization statistical reports to get a comprehensive understanding of employee performance and make performance evaluation more objective and fair; use announcements to release notices, arrange company activities, convey corporate decisions, facilitate the shaping of corporate culture, and make employees more engaged.</h6>
|
||||
<li class="team-ul-item team-ul-item-en solutions-animate-box" style="--delay: 0.2s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon3.svg" alt="Corporate Management" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
Corporate Management
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
Get multi-dimensional corporate data
|
||||
through data visualization statistical
|
||||
reports to get a comprehensive
|
||||
understanding of employee performance
|
||||
and make performance evaluation more
|
||||
objective and fair; use announcements to
|
||||
release notices, arrange company
|
||||
activities, convey corporate decisions,
|
||||
facilitate the shaping of corporate
|
||||
culture, and make employees more
|
||||
engaged.
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -269,19 +381,22 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../en/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently and makes work easier.</i>
|
||||
<i class="txt txt-4001624">Helps teams move projects forward efficiently
|
||||
and makes work easier.</i>
|
||||
</div>
|
||||
<div class="footer-r">
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Links</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Links
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/product.html">Product</a>
|
||||
</li>
|
||||
@ -298,7 +413,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Support</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Support
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/download.html">Download Center</a>
|
||||
</li>
|
||||
@ -306,16 +423,20 @@
|
||||
<a class="txt-4001624 txt" href="../en/help.html">Help Center</a>
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy Policy</a>
|
||||
<a class="txt-4001624 txt" href="../en/privacy.html" target="_blank">Privacy
|
||||
Policy</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API document</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
document</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">Community</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
Community
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -326,7 +447,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ group</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/light/home_code.svg" alt="Group：546574618" />
|
||||
<i class="group_num">Group：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -341,7 +462,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -353,110 +477,132 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script>
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.solutions-animate-box');
|
||||
let timerId = null
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxes = document.querySelectorAll(".solutions-animate-box");
|
||||
let timerId = null;
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
timerId = setTimeout(()=>{
|
||||
box.classList.remove('solutions-animate-box');
|
||||
timerId = null
|
||||
},1200)
|
||||
box.classList.add("animate");
|
||||
timerId = setTimeout(() => {
|
||||
box.classList.remove("solutions-animate-box");
|
||||
timerId = null;
|
||||
}, 1200);
|
||||
}
|
||||
});
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
};
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
BIN
public/site/img/ad/banner.png
Normal file
BIN
public/site/img/ad/banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 963 KiB |
10
public/site/img/ad/checked.svg
Normal file
10
public/site/img/ad/checked.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1358_323)">
|
||||
<path d="M1.66699 9.32L7.47699 15.12L17.667 5" stroke="#F3474C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1358_323">
|
||||
<rect width="20" height="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 377 B |
BIN
public/site/img/ad/intro-card-head.png
Normal file
BIN
public/site/img/ad/intro-card-head.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
76
public/site/img/ad/intro-card-img01.svg
Normal file
76
public/site/img/ad/intro-card-img01.svg
Normal file
@ -0,0 +1,76 @@
|
||||
<svg width="528" height="240" viewBox="0 0 528 240" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1358_671)">
|
||||
<rect width="528" height="240" rx="20" fill="#F8F6F6"/>
|
||||
<rect x="50" y="96" width="501" height="351" rx="10" fill="#F8D7CF"/>
|
||||
<rect x="76" y="114" width="463" height="314" fill="#F5FAFA"/>
|
||||
<path d="M169 181H522" stroke="#E7E9E4" stroke-width="2" stroke-dasharray="12 12"/>
|
||||
<path d="M169 220H522" stroke="#E7E9E4" stroke-width="2" stroke-dasharray="12 12"/>
|
||||
<rect x="124.5" y="156.5" width="414" height="133" rx="8.5" stroke="#E7E9E4"/>
|
||||
<rect x="492" y="191" width="18" height="64" rx="9" fill="url(#paint0_linear_1358_671)"/>
|
||||
<rect x="401" y="191" width="18" height="64" rx="9" fill="url(#paint1_linear_1358_671)"/>
|
||||
<rect x="446" y="209" width="18" height="64" rx="9" fill="url(#paint2_linear_1358_671)"/>
|
||||
<rect x="176" y="209" width="18" height="64" rx="9" fill="url(#paint3_linear_1358_671)"/>
|
||||
<rect x="221" y="177" width="18" height="64" rx="9" fill="url(#paint4_linear_1358_671)"/>
|
||||
<rect x="266" y="191" width="18" height="64" rx="9" fill="url(#paint5_linear_1358_671)"/>
|
||||
<rect x="311" y="209" width="18" height="64" rx="9" fill="url(#paint6_linear_1358_671)"/>
|
||||
<rect x="356" y="182" width="18" height="64" rx="9" fill="url(#paint7_linear_1358_671)"/>
|
||||
<mask id="path-15-inside-1_1358_671" fill="white">
|
||||
<path d="M305 114C305 101.524 302.543 89.171 297.769 77.6451C292.994 66.1191 285.997 55.6464 277.175 46.8249C268.354 38.0033 257.881 31.0056 246.355 26.2314C234.829 21.4572 222.476 19 210 19C197.524 19 185.171 21.4572 173.645 26.2314C162.119 31.0056 151.646 38.0033 142.825 46.8249C134.003 55.6464 127.006 66.1191 122.231 77.6451C117.457 89.171 115 101.524 115 114H149.013C149.013 105.991 150.591 98.0606 153.655 90.6613C156.72 83.262 161.213 76.5389 166.876 70.8757C172.539 65.2126 179.262 60.7203 186.661 57.6554C194.061 54.5906 201.991 53.0131 210 53.0131C218.009 53.0131 225.939 54.5906 233.339 57.6554C240.738 60.7203 247.461 65.2126 253.124 70.8757C258.787 76.5389 263.28 83.262 266.345 90.6613C269.409 98.0606 270.987 105.991 270.987 114H305Z"/>
|
||||
</mask>
|
||||
<path d="M305 114C305 101.524 302.543 89.171 297.769 77.6451C292.994 66.1191 285.997 55.6464 277.175 46.8249C268.354 38.0033 257.881 31.0056 246.355 26.2314C234.829 21.4572 222.476 19 210 19C197.524 19 185.171 21.4572 173.645 26.2314C162.119 31.0056 151.646 38.0033 142.825 46.8249C134.003 55.6464 127.006 66.1191 122.231 77.6451C117.457 89.171 115 101.524 115 114H149.013C149.013 105.991 150.591 98.0606 153.655 90.6613C156.72 83.262 161.213 76.5389 166.876 70.8757C172.539 65.2126 179.262 60.7203 186.661 57.6554C194.061 54.5906 201.991 53.0131 210 53.0131C218.009 53.0131 225.939 54.5906 233.339 57.6554C240.738 60.7203 247.461 65.2126 253.124 70.8757C258.787 76.5389 263.28 83.262 266.345 90.6613C269.409 98.0606 270.987 105.991 270.987 114H305Z" stroke="#52459F" stroke-width="68" mask="url(#path-15-inside-1_1358_671)"/>
|
||||
<mask id="path-16-inside-2_1358_671" fill="white">
|
||||
<path d="M305 114C305 88.8044 294.991 64.6408 277.175 46.8249C259.359 29.0089 235.196 19 210 19C184.804 19 160.641 29.0089 142.825 46.8248C125.009 64.6408 115 88.8044 115 114L149.03 114C149.03 97.8297 155.454 82.3218 166.888 70.8877C178.322 59.4536 193.83 53.03 210 53.03C226.17 53.03 241.678 59.4536 253.112 70.8877C264.546 82.3218 270.97 97.8298 270.97 114H305Z"/>
|
||||
</mask>
|
||||
<path d="M305 114C305 88.8044 294.991 64.6408 277.175 46.8249C259.359 29.0089 235.196 19 210 19C184.804 19 160.641 29.0089 142.825 46.8248C125.009 64.6408 115 88.8044 115 114L149.03 114C149.03 97.8297 155.454 82.3218 166.888 70.8877C178.322 59.4536 193.83 53.03 210 53.03C226.17 53.03 241.678 59.4536 253.112 70.8877C264.546 82.3218 270.97 97.8298 270.97 114H305Z" stroke="#FF7155" stroke-width="68" mask="url(#path-16-inside-2_1358_671)"/>
|
||||
<mask id="path-17-inside-3_1358_671" fill="white">
|
||||
<path d="M305 114C305 94.391 298.932 75.2623 287.629 59.2389C276.325 43.2155 260.341 31.0824 241.868 24.5045L230.452 56.5627C242.308 60.7844 252.567 68.5712 259.821 78.8549C267.076 89.1386 270.97 101.415 270.97 114H305Z"/>
|
||||
</mask>
|
||||
<path d="M305 114C305 94.391 298.932 75.2623 287.629 59.2389C276.325 43.2155 260.341 31.0824 241.868 24.5045L230.452 56.5627C242.308 60.7844 252.567 68.5712 259.821 78.8549C267.076 89.1386 270.97 101.415 270.97 114H305Z" stroke="#F3474C" stroke-width="68" mask="url(#path-17-inside-3_1358_671)"/>
|
||||
<mask id="path-18-inside-4_1358_671" fill="white">
|
||||
<path d="M305 114C305 99.5478 301.703 85.2861 295.359 72.3005C289.015 59.315 279.793 47.948 268.393 39.0648L247.476 65.9073C254.792 71.6085 260.711 78.9037 264.783 87.2377C268.854 95.5717 270.97 104.725 270.97 114H305Z"/>
|
||||
</mask>
|
||||
<path d="M305 114C305 99.5478 301.703 85.2861 295.359 72.3005C289.015 59.315 279.793 47.948 268.393 39.0648L247.476 65.9073C254.792 71.6085 260.711 78.9037 264.783 87.2377C268.854 95.5717 270.97 104.725 270.97 114H305Z" stroke="#EE61D4" stroke-width="68" mask="url(#path-18-inside-4_1358_671)"/>
|
||||
<path opacity="0.8" d="M123.534 138.139C123.08 138.133 122.633 138.05 122.192 137.891C121.754 137.732 121.357 137.466 120.999 137.095C120.641 136.724 120.354 136.225 120.138 135.599C119.926 134.972 119.82 134.19 119.82 133.252C119.82 132.364 119.908 131.575 120.084 130.886C120.263 130.196 120.52 129.615 120.854 129.141C121.189 128.663 121.594 128.3 122.067 128.052C122.541 127.803 123.073 127.679 123.663 127.679C124.27 127.679 124.808 127.798 125.279 128.037C125.75 128.276 126.131 128.605 126.423 129.026C126.718 129.447 126.905 129.926 126.984 130.463H125.468C125.365 130.039 125.161 129.692 124.857 129.424C124.552 129.156 124.154 129.021 123.663 129.021C122.918 129.021 122.336 129.346 121.918 129.996C121.504 130.645 121.295 131.549 121.292 132.705H121.366C121.542 132.417 121.758 132.172 122.013 131.969C122.271 131.764 122.56 131.607 122.878 131.497C123.199 131.384 123.537 131.328 123.892 131.328C124.482 131.328 125.016 131.472 125.493 131.761C125.973 132.046 126.356 132.44 126.641 132.944C126.926 133.448 127.069 134.024 127.069 134.674C127.069 135.324 126.921 135.912 126.626 136.439C126.335 136.966 125.924 137.384 125.393 137.692C124.863 137.997 124.243 138.146 123.534 138.139ZM123.529 136.847C123.92 136.847 124.27 136.75 124.578 136.558C124.886 136.366 125.13 136.107 125.309 135.783C125.488 135.458 125.577 135.095 125.577 134.694C125.577 134.303 125.49 133.946 125.314 133.625C125.142 133.304 124.903 133.048 124.598 132.859C124.296 132.67 123.952 132.576 123.564 132.576C123.269 132.576 122.996 132.632 122.744 132.745C122.495 132.858 122.276 133.013 122.087 133.212C121.898 133.411 121.749 133.64 121.64 133.898C121.534 134.154 121.481 134.424 121.481 134.709C121.481 135.09 121.569 135.443 121.744 135.768C121.923 136.093 122.167 136.354 122.475 136.553C122.787 136.749 123.138 136.847 123.529 136.847ZM132.425 138.169C131.639 138.166 130.968 137.959 130.411 137.548C129.854 137.137 129.428 136.538 129.133 135.753C128.838 134.967 128.691 134.021 128.691 132.914C128.691 131.81 128.838 130.867 129.133 130.085C129.432 129.303 129.859 128.706 130.416 128.295C130.976 127.884 131.646 127.679 132.425 127.679C133.203 127.679 133.871 127.886 134.428 128.3C134.985 128.711 135.411 129.308 135.706 130.09C136.004 130.869 136.153 131.81 136.153 132.914C136.153 134.024 136.006 134.972 135.711 135.758C135.416 136.54 134.99 137.138 134.433 137.553C133.876 137.964 133.207 138.169 132.425 138.169ZM132.425 136.842C133.114 136.842 133.653 136.505 134.04 135.832C134.431 135.16 134.627 134.187 134.627 132.914C134.627 132.069 134.537 131.355 134.358 130.771C134.183 130.185 133.929 129.741 133.598 129.439C133.27 129.134 132.879 128.982 132.425 128.982C131.738 128.982 131.2 129.32 130.809 129.996C130.418 130.672 130.22 131.645 130.217 132.914C130.217 133.763 130.305 134.48 130.481 135.067C130.66 135.65 130.913 136.093 131.241 136.394C131.569 136.692 131.964 136.842 132.425 136.842ZM143.232 136.091V135.554C143.232 135.17 143.311 134.818 143.47 134.5C143.633 134.179 143.868 133.922 144.176 133.729C144.488 133.534 144.864 133.436 145.305 133.436C145.755 133.436 146.133 133.532 146.438 133.724C146.743 133.917 146.973 134.174 147.129 134.495C147.288 134.817 147.368 135.17 147.368 135.554V136.091C147.368 136.475 147.288 136.828 147.129 137.15C146.97 137.468 146.737 137.725 146.428 137.92C146.123 138.113 145.749 138.209 145.305 138.209C144.857 138.209 144.479 138.113 144.171 137.92C143.863 137.725 143.629 137.468 143.47 137.15C143.311 136.828 143.232 136.475 143.232 136.091ZM144.39 135.554V136.091C144.39 136.376 144.458 136.634 144.594 136.866C144.73 137.098 144.967 137.214 145.305 137.214C145.639 137.214 145.873 137.098 146.006 136.866C146.138 136.634 146.205 136.376 146.205 136.091V135.554C146.205 135.269 146.14 135.01 146.011 134.778C145.885 134.546 145.649 134.43 145.305 134.43C144.973 134.43 144.738 134.546 144.599 134.778C144.46 135.01 144.39 135.269 144.39 135.554ZM138.111 130.264V129.727C138.111 129.343 138.19 128.99 138.349 128.668C138.512 128.347 138.747 128.09 139.055 127.898C139.367 127.705 139.743 127.609 140.184 127.609C140.635 127.609 141.013 127.705 141.317 127.898C141.622 128.09 141.853 128.347 142.009 128.668C142.164 128.99 142.242 129.343 142.242 129.727V130.264C142.242 130.649 142.163 131.002 142.004 131.323C141.848 131.641 141.616 131.898 141.308 132.094C141.003 132.286 140.628 132.382 140.184 132.382C139.733 132.382 139.354 132.286 139.045 132.094C138.741 131.898 138.509 131.641 138.349 131.323C138.19 131.002 138.111 130.649 138.111 130.264ZM139.274 129.727V130.264C139.274 130.549 139.34 130.808 139.473 131.04C139.609 131.272 139.846 131.388 140.184 131.388C140.515 131.388 140.747 131.272 140.88 131.04C141.016 130.808 141.084 130.549 141.084 130.264V129.727C141.084 129.442 141.019 129.184 140.89 128.952C140.761 128.72 140.525 128.604 140.184 128.604C139.853 128.604 139.617 128.72 139.478 128.952C139.342 129.184 139.274 129.442 139.274 129.727ZM138.583 138L145.583 127.818H146.771L139.771 138H138.583Z" fill="black"/>
|
||||
<path opacity="0.8" d="M279.524 138.139C278.841 138.139 278.232 138.022 277.695 137.786C277.161 137.551 276.738 137.224 276.427 136.807C276.119 136.386 275.953 135.899 275.93 135.345H277.491C277.511 135.647 277.612 135.909 277.794 136.131C277.98 136.349 278.222 136.518 278.52 136.638C278.818 136.757 279.15 136.817 279.514 136.817C279.915 136.817 280.27 136.747 280.578 136.608C280.89 136.469 281.133 136.275 281.309 136.026C281.485 135.774 281.572 135.484 281.572 135.156C281.572 134.815 281.485 134.515 281.309 134.256C281.137 133.995 280.883 133.789 280.548 133.64C280.217 133.491 279.816 133.416 279.345 133.416H278.485V132.163H279.345C279.723 132.163 280.054 132.095 280.339 131.96C280.628 131.824 280.853 131.635 281.016 131.393C281.178 131.147 281.259 130.861 281.259 130.533C281.259 130.218 281.188 129.944 281.045 129.712C280.906 129.477 280.707 129.293 280.449 129.161C280.194 129.028 279.892 128.962 279.544 128.962C279.213 128.962 278.903 129.023 278.614 129.146C278.329 129.265 278.097 129.437 277.918 129.663C277.739 129.885 277.643 130.152 277.63 130.463H276.143C276.16 129.913 276.322 129.429 276.631 129.011C276.942 128.594 277.353 128.267 277.864 128.032C278.374 127.797 278.941 127.679 279.564 127.679C280.217 127.679 280.78 127.807 281.254 128.062C281.732 128.314 282.099 128.65 282.358 129.071C282.62 129.492 282.749 129.953 282.746 130.453C282.749 131.023 282.59 131.507 282.268 131.905C281.95 132.303 281.526 132.569 280.996 132.705V132.785C281.672 132.888 282.196 133.156 282.567 133.59C282.941 134.024 283.127 134.563 283.124 135.206C283.127 135.766 282.971 136.268 282.656 136.712C282.345 137.156 281.919 137.506 281.379 137.761C280.838 138.013 280.22 138.139 279.524 138.139ZM288.866 127.818V138H287.325V129.359H287.265L284.829 130.95V129.479L287.369 127.818H288.866ZM296.935 136.091V135.554C296.935 135.17 297.014 134.818 297.173 134.5C297.336 134.179 297.571 133.922 297.879 133.729C298.191 133.534 298.567 133.436 299.008 133.436C299.459 133.436 299.836 133.532 300.141 133.724C300.446 133.917 300.677 134.174 300.832 134.495C300.991 134.817 301.071 135.17 301.071 135.554V136.091C301.071 136.475 300.991 136.828 300.832 137.15C300.673 137.468 300.44 137.725 300.131 137.92C299.826 138.113 299.452 138.209 299.008 138.209C298.56 138.209 298.183 138.113 297.874 137.92C297.566 137.725 297.332 137.468 297.173 137.15C297.014 136.828 296.935 136.475 296.935 136.091ZM298.093 135.554V136.091C298.093 136.376 298.161 136.634 298.297 136.866C298.433 137.098 298.67 137.214 299.008 137.214C299.343 137.214 299.576 137.098 299.709 136.866C299.841 136.634 299.908 136.376 299.908 136.091V135.554C299.908 135.269 299.843 135.01 299.714 134.778C299.588 134.546 299.353 134.43 299.008 134.43C298.676 134.43 298.441 134.546 298.302 134.778C298.163 135.01 298.093 135.269 298.093 135.554ZM291.814 130.264V129.727C291.814 129.343 291.893 128.99 292.053 128.668C292.215 128.347 292.45 128.09 292.759 127.898C293.07 127.705 293.446 127.609 293.887 127.609C294.338 127.609 294.716 127.705 295.021 127.898C295.326 128.09 295.556 128.347 295.712 128.668C295.867 128.99 295.945 129.343 295.945 129.727V130.264C295.945 130.649 295.866 131.002 295.707 131.323C295.551 131.641 295.319 131.898 295.011 132.094C294.706 132.286 294.331 132.382 293.887 132.382C293.436 132.382 293.057 132.286 292.749 132.094C292.444 131.898 292.212 131.641 292.053 131.323C291.893 131.002 291.814 130.649 291.814 130.264ZM292.977 129.727V130.264C292.977 130.549 293.044 130.808 293.176 131.04C293.312 131.272 293.549 131.388 293.887 131.388C294.219 131.388 294.451 131.272 294.583 131.04C294.719 130.808 294.787 130.549 294.787 130.264V129.727C294.787 129.442 294.722 129.184 294.593 128.952C294.464 128.72 294.228 128.604 293.887 128.604C293.556 128.604 293.32 128.72 293.181 128.952C293.045 129.184 292.977 129.442 292.977 129.727ZM292.286 138L299.286 127.818H300.474L293.474 138H292.286Z" fill="black"/>
|
||||
<circle cx="210" cy="114" r="39" fill="#FEFEFD"/>
|
||||
<circle cx="210" cy="114" r="30" fill="#F1F6FF"/>
|
||||
<path d="M202.48 126.757C207.533 129.897 213.885 128.197 216.699 122.952C217.68 121.123 218.054 119.027 218.041 117.106L217.825 102.714C217.826 101.783 217.261 100.966 216.552 100.526C215.842 100.085 214.939 99.9891 214.155 100.433L202.47 107.421C200.911 108.366 199.434 109.735 198.436 111.595C195.622 116.84 197.427 123.617 202.48 126.757ZM209.068 114.476C210.903 115.617 211.567 118.104 210.546 120.009C209.524 121.914 207.19 122.538 205.355 121.398C203.52 120.258 202.856 117.77 203.878 115.865C204.903 113.954 207.233 113.336 209.068 114.476Z" fill="#FF7155"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1358_671" x1="506" y1="185" x2="521.937" y2="189.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_1358_671" x1="415" y1="185" x2="430.937" y2="189.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_1358_671" x1="460" y1="203" x2="475.937" y2="207.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_1358_671" x1="190" y1="203" x2="205.937" y2="207.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint4_linear_1358_671" x1="235" y1="171" x2="250.937" y2="175.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint5_linear_1358_671" x1="280" y1="185" x2="295.937" y2="189.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint6_linear_1358_671" x1="325" y1="203" x2="340.937" y2="207.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint7_linear_1358_671" x1="370" y1="176" x2="385.937" y2="180.386" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_1358_671">
|
||||
<rect width="528" height="240" rx="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 16 KiB |
77
public/site/img/ad/intro-card-img02.svg
Normal file
77
public/site/img/ad/intro-card-img02.svg
Normal file
@ -0,0 +1,77 @@
|
||||
<svg width="528" height="240" viewBox="0 0 528 240" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1358_723)">
|
||||
<rect width="528" height="240" rx="20" fill="#F8F6F6"/>
|
||||
<rect x="90" y="38" width="522" height="405" rx="10" fill="#F8D7CF"/>
|
||||
<rect x="117" y="56" width="482" height="374" fill="#F5FAFA"/>
|
||||
<rect x="137.5" y="74.5" width="450" height="105" rx="9.5" stroke="#EFF2F7"/>
|
||||
<g filter="url(#filter0_d_1358_723)">
|
||||
<rect x="155" y="92" width="70" height="70" rx="35" fill="#FF7155"/>
|
||||
</g>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M193.564 127.063C196.749 125.768 198.974 122.816 198.974 119.381C198.974 114.752 194.934 111 189.949 111C184.964 111 180.923 114.752 180.923 119.381C180.923 122.816 183.149 125.768 186.334 127.063C180.383 128.655 176 134.085 176 140.538V143H203.897V140.538C203.897 134.085 199.515 128.655 193.564 127.063Z" fill="#DBE5FA"/>
|
||||
<rect x="255" y="149" width="190" height="10" rx="5" fill="#E5E1E0"/>
|
||||
<rect x="255" y="149" width="92" height="10" rx="5" fill="#F3474C"/>
|
||||
<rect x="255" y="127" width="160" height="6" rx="3" fill="#E5E1E0"/>
|
||||
<rect x="255" y="95" width="293" height="16" rx="8" fill="#E5E1E0"/>
|
||||
<g filter="url(#filter1_d_1358_723)">
|
||||
<rect x="47" y="146" width="445" height="106" rx="10" fill="white"/>
|
||||
<rect x="47.5" y="146.5" width="444" height="105" rx="9.5" stroke="#EFF2F7"/>
|
||||
</g>
|
||||
<rect x="65.5" y="164.5" width="69" height="69" rx="9.5" fill="white" stroke="#E7E9E4"/>
|
||||
<circle cx="100" cy="199" r="20" fill="url(#paint0_linear_1358_723)"/>
|
||||
<rect x="165" y="221" width="228" height="10" rx="5" fill="#E5E1E0"/>
|
||||
<rect x="165" y="221" width="163.2" height="10" rx="5" fill="url(#paint1_linear_1358_723)"/>
|
||||
<rect x="165" y="199" width="124.8" height="6" rx="3" fill="#E5E1E0"/>
|
||||
<rect x="165" y="167" width="304" height="16" rx="8" fill="#E5E1E0"/>
|
||||
<g filter="url(#filter2_d_1358_723)">
|
||||
<path d="M446.625 218.04L438.48 240.408L412.366 192.219L465.233 206.522L446.625 218.04Z" fill="#EE61D4"/>
|
||||
<path d="M446.625 218.04L438.48 240.408L412.366 192.219L465.233 206.522L446.625 218.04Z" stroke="white" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<filter id="filter0_d_1358_723" x="146" y="87" width="88" height="88" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="4"/>
|
||||
<feGaussianBlur stdDeviation="4.5"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1358_723"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1358_723" result="shape"/>
|
||||
</filter>
|
||||
<filter id="filter1_d_1358_723" x="23" y="126" width="493" height="154" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feMorphology radius="8" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_1358_723"/>
|
||||
<feOffset dy="4"/>
|
||||
<feGaussianBlur stdDeviation="8"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1358_723"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1358_723" result="shape"/>
|
||||
</filter>
|
||||
<filter id="filter2_d_1358_723" x="386.375" y="170.645" width="105.344" height="100.194" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feMorphology radius="8" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_1358_723"/>
|
||||
<feOffset dy="4"/>
|
||||
<feGaussianBlur stdDeviation="8"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1358_723"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1358_723" result="shape"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_1358_723" x1="82.9752" y1="169.739" x2="126.401" y2="180.913" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
<stop offset="1" stop-color="#EE61D4"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_1358_723" x1="177.139" y1="218.685" x2="187.277" y2="261.257" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
<stop offset="1" stop-color="#EE61D4"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_1358_723">
|
||||
<rect width="528" height="240" rx="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
36
public/site/img/ad/intro-card-img03.svg
Normal file
36
public/site/img/ad/intro-card-img03.svg
Normal file
@ -0,0 +1,36 @@
|
||||
<svg width="528" height="240" viewBox="0 0 528 240" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1358_771)">
|
||||
<rect width="528" height="240" rx="20" fill="#F8F6F6"/>
|
||||
<path d="M168 42H258C264.627 42 270 47.3726 270 54V172" stroke="#F3474C" stroke-width="2" stroke-dasharray="6 6"/>
|
||||
<rect x="240" y="98" width="353" height="288" rx="10" fill="#F8D7CF"/>
|
||||
<rect x="258" y="116" width="326" height="260" fill="#F5FAFA"/>
|
||||
<path d="M401.213 140.46L358.241 155.243V203.683C358.241 218.534 371.721 232.004 399.465 244.864L400.919 245.54L402.406 244.92C429.844 233.474 443.76 219.602 443.76 203.683V155.614L401.213 140.46ZM425.139 181.649L403.135 207.893C401.775 209.501 399.744 210.433 397.601 210.437C395.631 210.437 393.668 209.644 392.271 208.105L378.707 193.203C377.406 191.771 377.543 189.584 379.015 188.318C380.402 187.126 380.56 186.683 382.043 185.314C382.235 185.137 382.47 185.011 382.724 184.949L383.682 184.718L397.873 200.569L418.575 174.688C419.819 173.207 423.102 175.573 424.627 176.78C426.152 177.988 426.38 180.166 425.139 181.649Z" fill="url(#paint0_linear_1358_771)"/>
|
||||
<rect x="-24" y="-22" width="205.917" height="168" rx="10" fill="#FCE3EC"/>
|
||||
<rect x="-12" y="-10" width="181" height="144" fill="#F5FAFA"/>
|
||||
<path d="M100.254 48.6899H57.7457C54.0742 48.6899 51.0981 51.6597 51.0981 55.3242V83.467C51.0981 87.1316 54.0742 90.1014 57.7457 90.1014H100.254C103.925 90.1014 106.902 87.1316 106.902 83.467V55.3242C106.902 51.6597 103.925 48.6899 100.254 48.6899ZM81.7993 69.2052V76.5921C81.7993 78.1377 80.5468 79.3919 78.9996 79.3919C77.4533 79.3919 76.1999 78.1377 76.1999 76.5921V69.2052C74.5282 68.2369 73.4002 66.4319 73.4002 64.3602C73.4002 61.2675 75.9069 58.7607 78.9996 58.7607C82.0923 58.7607 84.5999 61.2675 84.5999 64.3602C84.5999 66.4319 83.4728 68.2369 81.7993 69.2052ZM78.9996 22.0891C68.1754 22.0891 59.3999 30.7409 59.3999 42.108V50.8019L98.6003 52.6684V42.108C98.6003 30.7409 89.8248 22.0891 78.9996 22.0891ZM65.0028 50.3107V41.9134C65.0028 34.1843 71.2696 27.9166 78.9995 27.9166C86.7303 27.9166 92.9963 34.1843 92.9963 41.9134V50.5072L65.0028 50.3107Z" fill="#FF7155"/>
|
||||
<g filter="url(#filter0_d_1358_771)">
|
||||
<rect x="246" y="12" width="66" height="66" rx="10" fill="white"/>
|
||||
</g>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M289.586 45.0006C289.856 44.1148 290 43.1802 290 42.2143C290 36.5731 285.075 32 279 32C272.925 32 268 36.5731 268 42.2143C268 43.1802 268.144 44.1148 268.414 45.0006C264.864 45.0465 262 47.9388 262 51.5C262 55.0899 264.91 58 268.5 58H289.5C293.09 58 296 55.0899 296 51.5C296 47.9388 293.136 45.0465 289.586 45.0006Z" fill="#F3474C"/>
|
||||
</g>
|
||||
<defs>
|
||||
<filter id="filter0_d_1358_771" x="237" y="7" width="84" height="84" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="4"/>
|
||||
<feGaussianBlur stdDeviation="4.5"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1358_771"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1358_771" result="shape"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_1358_771" x1="364.602" y1="116.131" x2="459.434" y2="135.99" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
<stop offset="1" stop-color="#EE61D4"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_1358_771">
|
||||
<rect width="528" height="240" rx="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
28
public/site/img/ad/intro-card-img04.svg
Normal file
28
public/site/img/ad/intro-card-img04.svg
Normal file
@ -0,0 +1,28 @@
|
||||
<svg width="528" height="240" viewBox="0 0 528 240" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1358_798)">
|
||||
<rect width="528" height="240" rx="20" fill="#F8F6F6"/>
|
||||
<rect x="117" y="31" width="372" height="15" fill="#E5E0E0"/>
|
||||
<rect x="117" y="56" width="338.757" height="15" fill="#E5E0E0"/>
|
||||
<rect x="117" y="81" width="300.766" height="15" fill="#E5E0E0"/>
|
||||
<rect x="117" y="106" width="265.94" height="15" fill="#E5E0E0"/>
|
||||
<rect x="32" y="31" width="63" height="90" rx="2" fill="#F3474C"/>
|
||||
<circle cx="326" cy="61" r="25" transform="rotate(180 326 61)" fill="#FF7155"/>
|
||||
<path d="M378.5 51.2588L366 31L420 40.3882L376 73L378.5 51.2588Z" fill="#F3474C" stroke="white" stroke-width="2"/>
|
||||
<circle cx="242.922" cy="180.922" r="40.9219" fill="#E5E0E0"/>
|
||||
<circle cx="347.5" cy="180.922" r="40.9219" fill="#EE61D4"/>
|
||||
<circle cx="451.922" cy="180.922" r="40.9219" fill="url(#paint0_linear_1358_798)"/>
|
||||
<circle cx="472" cy="181" r="4" fill="white"/>
|
||||
<circle cx="457" cy="181" r="6" fill="white"/>
|
||||
<circle cx="437" cy="181" r="9" fill="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1358_798" x1="417.088" y1="121.051" x2="505.941" y2="143.913" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF7155"/>
|
||||
<stop offset="0.497468" stop-color="#EF3E56"/>
|
||||
<stop offset="1" stop-color="#EE61D4"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_1358_798">
|
||||
<rect width="528" height="240" rx="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
BIN
public/site/img/ad/intro.png
Normal file
BIN
public/site/img/ad/intro.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
BIN
public/site/img/ad/plan.png
Normal file
BIN
public/site/img/ad/plan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 162 KiB |
703
public/site/js/ad.js
vendored
Normal file
703
public/site/js/ad.js
vendored
Normal file
@ -0,0 +1,703 @@
|
||||
// 根据窗口宽度设置广告栏高度
|
||||
let adBarHeight = window?.innerWidth <= 768 ? 48 : 64;
|
||||
const adBarHeightPX = `${adBarHeight}px`;
|
||||
|
||||
// 当DOM加载完成时执行
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// 获取当前页面路径
|
||||
const currentPath = window.location.pathname;
|
||||
// 判断是否为广告页面
|
||||
const isAdPage = currentPath.includes("ad.html");
|
||||
|
||||
// 获取URL对象
|
||||
const url = new URL(window.location.href);
|
||||
// 分割路径
|
||||
const pathSegments = url.pathname.split("/");
|
||||
// 确定语言
|
||||
const language = pathSegments.includes("zh")
|
||||
? "zh"
|
||||
: pathSegments.includes("en")
|
||||
? "en"
|
||||
: "zh";
|
||||
|
||||
if (isAdPage) {
|
||||
// 如果是广告页面，设置导航背景色并获取广告计划和介绍
|
||||
setNavBackgroundColor();
|
||||
fetchAdBanner(language);
|
||||
fetchAdPlan(language);
|
||||
fetchAdIntro(language);
|
||||
|
||||
manageAnimate();
|
||||
} else {
|
||||
// 如果不是广告页面，插入广告样式表并获取广告栏
|
||||
insertAdStylesheet();
|
||||
fetchAdBar(language);
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化广告栏
|
||||
function initializeAdBar() {
|
||||
displayAdBar();
|
||||
adjustNavPosition("down");
|
||||
|
||||
// 添加关闭广告栏的事件监听器
|
||||
const closeAdBarButton = document.getElementById("ad-close");
|
||||
closeAdBarButton.addEventListener("click", () => {
|
||||
hideAdBar();
|
||||
adjustNavPosition("up");
|
||||
});
|
||||
}
|
||||
|
||||
// 显示广告栏
|
||||
function displayAdBar() {
|
||||
const adWrapper = document.getElementById("ad");
|
||||
if (!adWrapper) return;
|
||||
adWrapper.style.height = adBarHeightPX;
|
||||
adWrapper.style.display = "block";
|
||||
|
||||
// 调整头部元素的边距
|
||||
const headerEl = document.getElementsByTagName("header")[0];
|
||||
if (!headerEl) return;
|
||||
headerEl.style.marginTop = adBarHeightPX;
|
||||
}
|
||||
|
||||
// 隐藏广告栏
|
||||
function hideAdBar() {
|
||||
const adWrapper = document.getElementById("ad");
|
||||
if (!adWrapper) return;
|
||||
adWrapper.style.height = "0px";
|
||||
adWrapper.style.display = "none";
|
||||
|
||||
// 重置头部元素的边距
|
||||
const headerEl = document.getElementsByTagName("header")[0];
|
||||
if (!headerEl) return;
|
||||
headerEl.style.marginTop = "0px";
|
||||
}
|
||||
|
||||
// 调整导航栏位置
|
||||
function adjustNavPosition(direction) {
|
||||
const navWrapper = document.getElementsByClassName("nav")[0];
|
||||
navWrapper.style.top = direction === "down" ? adBarHeightPX : "0";
|
||||
}
|
||||
|
||||
// 获取广告栏数据
|
||||
function fetchAdBar(language) {
|
||||
const apiUrl = `https://cms.hitosea.com/api/doo-task-ad-bar?locale=${language}&populate[0]=background`;
|
||||
fetchData(apiUrl)
|
||||
.then(({ data: { attributes } }) => {
|
||||
updateAdBar(attributes);
|
||||
})
|
||||
.catch(handleError);
|
||||
}
|
||||
|
||||
// 获取广告banner数据
|
||||
function fetchAdBanner(language) {
|
||||
const query = window.Qs.stringify(
|
||||
{
|
||||
locale: language,
|
||||
populate: {
|
||||
title: {
|
||||
populate: "*",
|
||||
},
|
||||
description: {
|
||||
populate: "*",
|
||||
},
|
||||
background: {
|
||||
populate: "*",
|
||||
},
|
||||
underline: {
|
||||
populate: "*",
|
||||
},
|
||||
signUpButton: {
|
||||
populate: "*",
|
||||
},
|
||||
selfHostButton: {
|
||||
populate: "*",
|
||||
},
|
||||
localizations: {
|
||||
populate: "*",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
encodeValuesOnly: true,
|
||||
}
|
||||
);
|
||||
const apiUrl = `https://cms.hitosea.com/api/doo-task-ad-banner?${query}`;
|
||||
fetchData(apiUrl).then(handleAdBannerResponse).catch(handleError);
|
||||
}
|
||||
|
||||
// 获取广告计划数据
|
||||
function fetchAdPlan(language) {
|
||||
const query = window.Qs.stringify({
|
||||
locale: language,
|
||||
populate: {
|
||||
plans: {
|
||||
populate: {
|
||||
price: {
|
||||
populate: "*",
|
||||
},
|
||||
button: {
|
||||
populate: "*",
|
||||
},
|
||||
features: {
|
||||
populate: "*",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
const apiUrl = `https://cms.hitosea.com/api/doo-task-ad-plan?${query}`;
|
||||
fetchData(apiUrl).then(handleAdPlanResponse).catch(handleError);
|
||||
}
|
||||
|
||||
// 获取广告介绍数据
|
||||
function fetchAdIntro(language) {
|
||||
const query = window.Qs.stringify({
|
||||
locale: language,
|
||||
populate: {
|
||||
intros: {
|
||||
populate: {
|
||||
bar: {
|
||||
populate: "*",
|
||||
},
|
||||
cover: {
|
||||
populate: "*",
|
||||
},
|
||||
title: {
|
||||
populate: "*",
|
||||
},
|
||||
description: {
|
||||
populate: "*",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
const apiUrl = `https://cms.hitosea.com/api/doo-task-ad-intro?${query}`;
|
||||
fetchData(apiUrl).then(handleAdIntroResponse).catch(handleError);
|
||||
}
|
||||
|
||||
// 通用数据获取函数
|
||||
function fetchData(url) {
|
||||
return fetch(url).then((response) => response.json());
|
||||
}
|
||||
|
||||
function getMediaUrl(media) {
|
||||
if (!media?.data?.attributes?.url) {
|
||||
return "";
|
||||
}
|
||||
return `https://cms.hitosea.com${media.data.attributes.url}`;
|
||||
}
|
||||
|
||||
function getStyle(style) {
|
||||
if (!style) return null;
|
||||
return Object.keys(style)
|
||||
.map((key) => `${key}: ${style[key]}`)
|
||||
.join("; ");
|
||||
}
|
||||
|
||||
// 处理广告banner响应
|
||||
function handleAdBannerResponse(response) {
|
||||
// 在此实现广告banner处理逻辑
|
||||
try {
|
||||
const {
|
||||
data: {
|
||||
attributes: {
|
||||
title,
|
||||
description,
|
||||
background,
|
||||
underline,
|
||||
signUpButton,
|
||||
selfHostButton,
|
||||
},
|
||||
},
|
||||
} = response;
|
||||
handleAdBannerTitle(title);
|
||||
handleAdBannerDescription(description);
|
||||
handleAdBannerBackground(background);
|
||||
handleAdBannerUnderline(underline);
|
||||
handleAdBannerSignUpButton(signUpButton);
|
||||
handleAdBannerSelfHostButton(selfHostButton);
|
||||
} catch (error) {
|
||||
console.error("处理广告banner响应时出错:", error);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerTitle(title) {
|
||||
const titleText = {};
|
||||
if (Array.isArray(title)) {
|
||||
title.forEach((item) => {
|
||||
titleText[item.key] = { text: item.text, style: item.style };
|
||||
});
|
||||
}
|
||||
const titlePart1El = document.getElementById("ad-banner-title-part1");
|
||||
const titlePart2El = document.getElementById("ad-banner-title-part2");
|
||||
const titlePart3El = document.getElementById("ad-banner-title-part3");
|
||||
if (titlePart1El && titleText["part1"]) {
|
||||
titlePart1El.textContent = titleText["part1"].text;
|
||||
titlePart1El.style = getStyle(titleText["part1"].style);
|
||||
}
|
||||
if (titlePart2El && titleText["part2"]) {
|
||||
titlePart2El.textContent = titleText["part2"].text;
|
||||
titlePart2El.style = getStyle(titleText["part2"].style);
|
||||
}
|
||||
if (titlePart3El && titleText["part3"]) {
|
||||
titlePart3El.textContent = titleText["part3"].text;
|
||||
titlePart3El.style = getStyle(titleText["part3"].style);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerDescription(description) {
|
||||
const descriptionText = {
|
||||
text: description.text,
|
||||
style: description.style,
|
||||
};
|
||||
const descriptionEl = document.getElementById("ad-banner-description");
|
||||
if (descriptionEl && descriptionText.text) {
|
||||
descriptionEl.textContent = descriptionText.text;
|
||||
descriptionEl.style = getStyle(descriptionText.style);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerBackground(background) {
|
||||
const backgroundUrl = getMediaUrl(background);
|
||||
const adBannerEl = document.getElementById("ad-banner");
|
||||
|
||||
if (adBannerEl && backgroundUrl) {
|
||||
adBannerEl.style.backgroundImage = `url(${backgroundUrl})`;
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerUnderline(underline) {
|
||||
const underlineUrl = getMediaUrl(underline);
|
||||
const adBannerTitleUnderlineEl = document.getElementById(
|
||||
"ad-banner-title-underline"
|
||||
);
|
||||
if (adBannerTitleUnderlineEl && underlineUrl) {
|
||||
adBannerTitleUnderlineEl.innerHTML = `<img class="arcs ad" src="${underlineUrl}" alt="underline" />`;
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerSignUpButton({
|
||||
theme,
|
||||
style,
|
||||
link: { label, href, target, slug },
|
||||
}) {
|
||||
const signUpButtonEl = document.getElementById("ad-banner-sign-up-button");
|
||||
if (signUpButtonEl) {
|
||||
signUpButtonEl.innerHTML = `
|
||||
<a href="${href}" ${target === "_blank" ? 'target="_blank"' : ""} >
|
||||
<button class="btn btn-primary">
|
||||
${label}
|
||||
</button>
|
||||
</a>`;
|
||||
signUpButtonEl.style = getStyle(style);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdBannerSelfHostButton({
|
||||
theme,
|
||||
style,
|
||||
link: { label, href, target, slug },
|
||||
}) {
|
||||
const selfHostButtonEl = document.getElementById(
|
||||
"ad-banner-self-host-button"
|
||||
);
|
||||
if (selfHostButtonEl) {
|
||||
selfHostButtonEl.innerHTML = `
|
||||
<a href="${href}" ${target === "_blank" ? 'target="_blank"' : ""} >
|
||||
<button class="btn btn-default">
|
||||
${label}
|
||||
</button>
|
||||
</a>`;
|
||||
selfHostButtonEl.style = getStyle(style);
|
||||
}
|
||||
}
|
||||
|
||||
// 处理广告计划响应
|
||||
function handleAdPlanResponse(response) {
|
||||
// 在此实现广告计划处理逻辑
|
||||
try {
|
||||
const {
|
||||
data: {
|
||||
attributes: { title, description, plans },
|
||||
},
|
||||
} = response;
|
||||
handleAdPlanTitle(title);
|
||||
handleAdPlanDescription(description);
|
||||
handleAdPlanPlans(plans);
|
||||
} catch (error) {
|
||||
console.error("处理广告计划响应时出错:", error);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdPlanTitle(title) {
|
||||
const planTitleEl = document.getElementById("ad-plan-title");
|
||||
if (planTitleEl && title) {
|
||||
planTitleEl.textContent = title;
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdPlanDescription(description) {
|
||||
const planDescriptionEl = document.getElementById("ad-plan-description");
|
||||
if (planDescriptionEl && description) {
|
||||
planDescriptionEl.textContent = description;
|
||||
}
|
||||
}
|
||||
|
||||
async function handleAdPlanPlans(plans) {
|
||||
const planContentEl = document.getElementById("ad-plan-content");
|
||||
if (planContentEl && Array.isArray(plans)) {
|
||||
const prevPlanItems = planContentEl.querySelectorAll(".plan-item");
|
||||
|
||||
for (const prevPlanItem of prevPlanItems) {
|
||||
prevPlanItem.classList.add(
|
||||
"animate__animated",
|
||||
"animate__backOutDown"
|
||||
);
|
||||
prevPlanItem.addEventListener(
|
||||
"animationend",
|
||||
() => {
|
||||
prevPlanItem.remove();
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
}
|
||||
|
||||
plans.sort((a, b) => a.priority - b.priority);
|
||||
for (const plan of plans) {
|
||||
const planItemEl = document.createElement("div");
|
||||
planItemEl.className = `plan-item ${plan.activated ? "active" : ""
|
||||
}`;
|
||||
planItemEl.innerHTML =
|
||||
`
|
||||
<div class="plan-item-title">
|
||||
<span>${plan.title}</span>
|
||||
</div>
|
||||
<div class="plan-item-price">
|
||||
<span class="plan-item-price-current">
|
||||
${plan.price.current}
|
||||
<span class="plan-item-price-payment">
|
||||
${plan.price.payment ?? ""}
|
||||
</span>
|
||||
</span>
|
||||
<span class="plan-item-price-original ${plan.price.isPrice ? "price" : ""}">
|
||||
${plan.price.original ?? ""}
|
||||
</span>
|
||||
</div>
|
||||
<div class="plan-item-button">
|
||||
<a href="${plan.button.href}" ${plan.button.target === "_blank" ? 'target="_blank"' : ""}>
|
||||
<button class="btn-primary">
|
||||
${plan.button.label}
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="plan-item-description">
|
||||
<ul class="plan-item-description-list">
|
||||
${plan.features.map((feature) => {
|
||||
const iconUrl = feature.icon.data
|
||||
? getMediaUrl(feature.icon)
|
||||
: "../img/ad/checked.svg";
|
||||
return `
|
||||
<li class="plan-item-description-item">
|
||||
<i class="plan-item-description-item-icon">
|
||||
<img src="${iconUrl}" alt="${feature.title}" />
|
||||
</i>
|
||||
<span class="plan-item-description-item-content ${feature.activated ? "" : "disabled"}">
|
||||
${feature.text}
|
||||
</span>
|
||||
</li>
|
||||
`;
|
||||
}).join("")}
|
||||
</ul>
|
||||
</div>
|
||||
`;
|
||||
planContentEl.appendChild(planItemEl);
|
||||
planItemEl.classList.add(
|
||||
"animate__animated",
|
||||
"animate__backInUp",
|
||||
"animate__faster",
|
||||
"animate__delay-1s"
|
||||
);
|
||||
couldAdPlanElAnimate[`${plan.id}`] = false
|
||||
planItemEl.addEventListener("animationend", () => {
|
||||
planItemEl.classList.remove("animate__backInUp", "animate__faster", "animate__delay-1s")
|
||||
couldAdPlanElAnimate[`${plan.id}`] = true
|
||||
}, { once: true })
|
||||
|
||||
await new Promise((resolve) => {
|
||||
setTimeout(resolve, 150);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 处理广告介绍响应
|
||||
function handleAdIntroResponse(response) {
|
||||
try {
|
||||
const {
|
||||
data: {
|
||||
attributes: { title, description, intros },
|
||||
},
|
||||
} = response;
|
||||
handleAdIntroTitle(title);
|
||||
handleAdIntroDescription(description);
|
||||
handleAdIntroIntros(intros);
|
||||
} catch (error) {
|
||||
console.error("处理广告介绍响应时出错:", error);
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdIntroTitle(title) {
|
||||
const introTitleEl = document.getElementById("ad-intro-title");
|
||||
if (introTitleEl && title) {
|
||||
introTitleEl.textContent = title;
|
||||
}
|
||||
}
|
||||
|
||||
function handleAdIntroDescription(description) {
|
||||
const introDescriptionEl = document.getElementById("ad-intro-description");
|
||||
if (introDescriptionEl && description) {
|
||||
introDescriptionEl.textContent = description;
|
||||
}
|
||||
}
|
||||
|
||||
async function handleAdIntroIntros(intros) {
|
||||
const introContentEl = document.getElementById("ad-intro-content");
|
||||
if (introContentEl && Array.isArray(intros)) {
|
||||
const prevIntroItems =
|
||||
introContentEl.querySelectorAll(".ad-intro-item");
|
||||
for (const prevIntroItem of prevIntroItems) {
|
||||
prevIntroItem.classList.add(
|
||||
"animate__animated",
|
||||
"animate__zoomOut"
|
||||
);
|
||||
prevIntroItem.addEventListener(
|
||||
"animationend",
|
||||
() => {
|
||||
prevIntroItem.remove();
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
}
|
||||
|
||||
intros.sort((a, b) => a.priority - b.priority);
|
||||
|
||||
for (const intro of intros) {
|
||||
const introItemEl = document.createElement("div");
|
||||
const barUrl = intro.bar.data
|
||||
? getMediaUrl(intro.bar)
|
||||
: "../img/ad/intro-card-head.png";
|
||||
const coverUrl = intro.cover.data
|
||||
? getMediaUrl(intro.cover)
|
||||
: `../img/ad/intro-card-img${intro.priority + 1}.svg`;
|
||||
introItemEl.className = "ad-intro-item";
|
||||
introItemEl.innerHTML =
|
||||
`
|
||||
<div class="ad-intro-item-header">
|
||||
<img src="${barUrl}" alt="intro-bar" />
|
||||
</div>
|
||||
<div class="ad-intro-item-image">
|
||||
<img src="${coverUrl}" alt="intro-cover" />
|
||||
</div>
|
||||
<div class="ad-intro-item-title">
|
||||
<span>${intro.title}</span>
|
||||
</div>
|
||||
<div class="ad-intro-item-description">
|
||||
<span>${intro.description}</span>
|
||||
</div>
|
||||
`;
|
||||
introContentEl.appendChild(introItemEl);
|
||||
introItemEl.classList.add(
|
||||
"animate__animated",
|
||||
"animate__zoomIn",
|
||||
"animate__delay-1s"
|
||||
);
|
||||
couldAdIntroElAnimate[`${intro.id}`] = false
|
||||
|
||||
|
||||
introItemEl.addEventListener("animationend", () => {
|
||||
introItemEl.classList.remove("animate__zoomIn", "animate__delay-1s")
|
||||
couldAdIntroElAnimate[`${intro.id}`] = true
|
||||
}, { once: true })
|
||||
await new Promise((resolve) => {
|
||||
setTimeout(resolve, 150);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 错误处理函数
|
||||
function handleError(error) {
|
||||
console.error("获取数据时出错:", error);
|
||||
}
|
||||
|
||||
// 插入广告栏元素
|
||||
function insertAdBarElement() {
|
||||
const adBarHTML =
|
||||
`
|
||||
<div id="ad" class="ad">
|
||||
<div class="ad-content">
|
||||
<div class="ad-content-left">
|
||||
<p id="ad-text" class="ad-text">最新活动</p>
|
||||
<button id="ad-btn" class="ad-btn">查看详情</button>
|
||||
</div>
|
||||
<div id="ad-close" class="ad-close">
|
||||
<img src="../img/price_icon2.svg" alt="关闭" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
const headerElement = document.getElementsByTagName("header")[0];
|
||||
if (headerElement) {
|
||||
headerElement.insertAdjacentHTML("afterbegin", adBarHTML);
|
||||
}
|
||||
|
||||
// 添加广告按钮点击事件
|
||||
const adButton = document.getElementById("ad-btn");
|
||||
if (adButton) {
|
||||
adButton.addEventListener("click", () => {
|
||||
window.location.href = "ad.html";
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 插入广告样式表
|
||||
function insertAdStylesheet() {
|
||||
const adStylesheet = document.createElement("link");
|
||||
adStylesheet.rel = "stylesheet";
|
||||
adStylesheet.type = "text/css";
|
||||
adStylesheet.href = "../css/ad.css";
|
||||
document.head.appendChild(adStylesheet);
|
||||
}
|
||||
|
||||
// 更新广告栏内容
|
||||
function updateAdBar({ background, text, buttonText }) {
|
||||
insertAdBarElement();
|
||||
|
||||
const adWrapper = document.getElementById("ad");
|
||||
if (!adWrapper) return;
|
||||
|
||||
// 设置背景图片
|
||||
const backgroundUrl = background?.data?.attributes?.url;
|
||||
if (backgroundUrl) {
|
||||
adWrapper.style.backgroundImage = `url(https://cms.hitosea.com${backgroundUrl})`;
|
||||
}
|
||||
|
||||
// 更新文本内容
|
||||
const textElement = adWrapper.querySelector(".ad-text");
|
||||
if (textElement) {
|
||||
textElement.textContent = text;
|
||||
}
|
||||
|
||||
// 更新按钮文本
|
||||
const buttonElement = adWrapper.querySelector(".ad-btn");
|
||||
if (buttonElement) {
|
||||
buttonElement.textContent = buttonText;
|
||||
}
|
||||
|
||||
initializeAdBar();
|
||||
}
|
||||
|
||||
// 设置导航栏背景颜色
|
||||
function setNavBackgroundColor() {
|
||||
const navWrapper = document.getElementsByClassName("nav")[0];
|
||||
navWrapper.style.backgroundColor = "#fff";
|
||||
}
|
||||
|
||||
// 管理动画
|
||||
function manageAnimate() {
|
||||
let throttleTimer = null;
|
||||
const throttle = (callback, time) => {
|
||||
if (throttleTimer) return;
|
||||
throttleTimer = true;
|
||||
setTimeout(() => {
|
||||
callback();
|
||||
throttleTimer = false;
|
||||
}, time);
|
||||
};
|
||||
|
||||
window.addEventListener("scroll", () => {
|
||||
throttle(() => {
|
||||
console.log("scroll")
|
||||
detectAdPlanEl()
|
||||
detectAdIntroEl()
|
||||
}, 200)
|
||||
});
|
||||
}
|
||||
|
||||
const couldAdPlanElAnimate = {}
|
||||
const couldAdIntroElAnimate = {}
|
||||
|
||||
function detectAdPlanEl() {
|
||||
const adPlanEl = document.querySelector(".ad-plan")
|
||||
if (isElementOutOfViewport(adPlanEl)) {
|
||||
const els = document.querySelectorAll(".plan-item")
|
||||
for (const el of els) {
|
||||
couldAdPlanElAnimate[`${el.id}`] = true
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
const _couldAdPlanElAnimate = Object.values(couldAdPlanElAnimate).every(Boolean)
|
||||
if (!_couldAdPlanElAnimate) return;
|
||||
if (isElementPartiallyInViewport(adPlanEl)) {
|
||||
const els = document.querySelectorAll(".plan-item")
|
||||
for (const el of els) {
|
||||
el.classList.add("animate__flipInX")
|
||||
couldAdPlanElAnimate[`${el.id}`] = false
|
||||
el.addEventListener("animationend", () => {
|
||||
el.classList.remove("animate__flipInX")
|
||||
}, { once: true })
|
||||
}
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
function detectAdIntroEl() {
|
||||
const adIntroEl = document.querySelector(".ad-intro")
|
||||
if (isElementOutOfViewport(adIntroEl)) {
|
||||
const els = document.querySelectorAll(".ad-intro-item")
|
||||
for (const el of els) {
|
||||
couldAdIntroElAnimate[`${el.id}`] = true
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
const _couldAdIntroElAnimate = Object.values(couldAdIntroElAnimate).every(Boolean)
|
||||
if (!_couldAdIntroElAnimate) return;
|
||||
if (isElementPartiallyInViewport(adIntroEl)) {
|
||||
const els = document.querySelectorAll(".ad-intro-item")
|
||||
for (const el of els) {
|
||||
el.classList.add("animate__zoomIn")
|
||||
couldAdIntroElAnimate[`${el.id}`] = false
|
||||
el.addEventListener("animationend", () => {
|
||||
el.classList.remove("animate__zoomIn")
|
||||
}, { once: true })
|
||||
}
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
function isElementPartiallyInViewport(el) {
|
||||
if (!el) return false;
|
||||
const rect = el.getBoundingClientRect();
|
||||
return (
|
||||
rect.top < (window.innerHeight || document.documentElement.clientHeight) &&
|
||||
rect.bottom > 0 &&
|
||||
rect.left < (window.innerWidth || document.documentElement.clientWidth) &&
|
||||
rect.right > 0
|
||||
);
|
||||
}
|
||||
|
||||
function isElementOutOfViewport(el) {
|
||||
if (!el) return false;
|
||||
const rect = el.getBoundingClientRect();
|
||||
return (
|
||||
rect.bottom < 0 ||
|
||||
rect.top > (window.innerHeight || document.documentElement.clientHeight) ||
|
||||
rect.right < 0 ||
|
||||
rect.left > (window.innerWidth || document.documentElement.clientWidth)
|
||||
);
|
||||
}
|
||||
475
public/site/js/common.js
vendored
475
public/site/js/common.js
vendored
@ -1,221 +1,308 @@
|
||||
const menuBtn = document.getElementById('menuBtn'); // 768模式下的菜单按钮
|
||||
const drawer = document.querySelector('.drawer'); // 768模式下的菜单
|
||||
const theme_light = document.querySelectorAll('.theme_light');
|
||||
const theme_dark = document.querySelectorAll('.theme_dark');
|
||||
const menuBtn = document.getElementById("menuBtn"); // 768模式下的菜单按钮
|
||||
const drawer = document.querySelector(".drawer"); // 768模式下的菜单
|
||||
const theme_light = document.querySelectorAll(".theme_light");
|
||||
const theme_dark = document.querySelectorAll(".theme_dark");
|
||||
/* 主题切换更换图片 */
|
||||
const themeSwitch = (val1,val2)=>{
|
||||
theme_light.forEach(item=>{
|
||||
item.style.display = val1
|
||||
})
|
||||
theme_dark.forEach(item=>{
|
||||
item.style.display = val2
|
||||
})
|
||||
}
|
||||
const themeSwitch = (val1, val2) => {
|
||||
theme_light.forEach((item) => {
|
||||
item.style.display = val1;
|
||||
});
|
||||
theme_dark.forEach((item) => {
|
||||
item.style.display = val2;
|
||||
});
|
||||
};
|
||||
/* 更换图片 */
|
||||
const changeImageSrc = (img, src) => {
|
||||
const imgDom = document.querySelectorAll(img);
|
||||
const url = window.location.href // 获取当前浏览器 URL
|
||||
if (imgDom.length > 0) {
|
||||
imgDom.forEach(item=>{
|
||||
item.src = url.includes('site/i') ? `./img/${src}` : `../img/${src}`;
|
||||
})
|
||||
}
|
||||
const imgDom = document.querySelectorAll(img);
|
||||
const url = window.location.href; // 获取当前浏览器 URL
|
||||
if (imgDom.length > 0) {
|
||||
imgDom.forEach((item) => {
|
||||
item.src = url.includes("site/i")
|
||||
? `./img/${src}`
|
||||
: `../img/${src}`;
|
||||
});
|
||||
}
|
||||
};
|
||||
/* 设置默认语言 */
|
||||
if(!localStorage.getItem('lang')){
|
||||
localStorage.setItem('lang','zh')
|
||||
if (!localStorage.getItem("lang")) {
|
||||
localStorage.setItem("lang", "zh");
|
||||
}
|
||||
/* 设置默认主题 */
|
||||
const localStorageTheme = localStorage.getItem('theme')
|
||||
if(!localStorageTheme){
|
||||
setTheme('light')
|
||||
localStorage.setItem('theme', 'light')
|
||||
}else{
|
||||
setTheme(localStorageTheme)
|
||||
const localStorageTheme = localStorage.getItem("theme");
|
||||
if (!localStorageTheme) {
|
||||
setTheme("light");
|
||||
localStorage.setItem("theme", "light");
|
||||
} else {
|
||||
setTheme(localStorageTheme);
|
||||
}
|
||||
|
||||
/* 切换主题函数 */
|
||||
function setTheme(theme) {
|
||||
const root = document.documentElement;
|
||||
const lang = localStorage.getItem('lang')
|
||||
changeImageSrc('#logo', `${theme}/logo.svg`)
|
||||
changeImageSrc('#home_pic', `${theme}/${lang}_home_pic1.png`)
|
||||
changeImageSrc('#home_pic2', `${theme}/${lang}_home_pic2.png`)
|
||||
changeImageSrc('#home_pic3', `${theme}/${lang}_home_pic3.png`)
|
||||
changeImageSrc('#home_pic4', `${theme}/${lang}_home_pic4.png`)
|
||||
changeImageSrc('#home_pic5', `${theme}/${lang}_home_pic5.png`)
|
||||
changeImageSrc('#home_pic6', `${theme}/${lang}_home_pic6.png`)
|
||||
changeImageSrc('#solution_pic1', `${theme}/${lang}_solution_pic1.png`)
|
||||
changeImageSrc('#solution_pic2', `${theme}/${lang}_solution_pic2.png`)
|
||||
changeImageSrc('#solution_pic3', `${theme}/${lang}_solution_pic3.png`)
|
||||
changeImageSrc('#dow_pic1', `${theme}/${lang}_dow_pic1.png`)
|
||||
changeImageSrc('#solution_pic4', `${theme}/solution_pic4.png`)
|
||||
changeImageSrc('#about_pic1', `${theme}/about_pic1.png`)
|
||||
changeImageSrc('#home_icon1', `${theme}/home_icon1.png`)
|
||||
changeImageSrc('#home_icon2', `${theme}/home_icon2.png`)
|
||||
changeImageSrc('#home_icon3', `${theme}/home_icon3.png`)
|
||||
changeImageSrc('#home_icon4', `${theme}/home_icon4.png`)
|
||||
changeImageSrc('#home_pic7', `${theme}/home_pic7.svg`)
|
||||
changeImageSrc('#home_pic7_768', `${theme}/home_pic7_768.svg`)
|
||||
changeImageSrc('#help_pic2', `${theme}/help_pic2.png`)
|
||||
changeImageSrc('#help_pic3', `${theme}/help_pic3.png`)
|
||||
root.style.setProperty('--bg-pic7-url', `url(../img/${theme}/home_pic7.svg)`);
|
||||
root.style.setProperty('--bg-pic7-768-url', `url(../img/${theme}/home_pic7-768.svg)`);
|
||||
root.style.setProperty(`--bg-pic1-url`, `url(../img/${theme}/${lang}_dow_pic1.png)`);
|
||||
root.style.setProperty(`--bg-pic2-url`, `url(../img/${theme}/help_pic1.svg)`);
|
||||
root.style.setProperty(`--bg-1-url`, `url(../img/${theme}/bg1.png)`);
|
||||
root.style.setProperty(`--bg-2-url`, `url(../img/${theme}/bg2.png)`);
|
||||
root.style.setProperty(`--bg-3-url`, `url(../img/${theme}/bg3.png)`);
|
||||
root.style.setProperty(`--bg-4-url`, `url(../img/${theme}/bg4.png)`);
|
||||
root.style.setProperty(`--bg-5-url`, `url(../img/${theme}/bg5.png)`);
|
||||
root.style.setProperty(`--bg-6-url`, `url(../img/${theme}/bg6.png)`);
|
||||
root.style.setProperty(`--bg-7-url`, `url(../img/${theme}/bg7.png)`);
|
||||
root.style.setProperty(`--bg-8-url`, `url(../img/${theme}/bg8.png)`);
|
||||
root.style.setProperty(`--bg-9-url`, `url(../img/${theme}/bg9.png)`);
|
||||
root.style.setProperty(`--bg-10-url`, `url(../img/${theme}/bg10.png)`);
|
||||
root.style.setProperty(`--bg-11-url`, `url(../img/${theme}/bg11.png)`);
|
||||
root.style.setProperty(`--bg-768-3-url`, `url(../img/${theme}/bg3_768.png)`);
|
||||
root.style.setProperty(`--bg-768-4-url`, `url(../img/${theme}/bg4_768.png)`);
|
||||
root.style.setProperty(`--bg-768-5-url`, `url(../img/${theme}/bg5_768.png)`);
|
||||
root.style.setProperty(`--bg-768-6-url`, `url(../img/${theme}/bg6_768.png)`);
|
||||
root.style.setProperty(`--bg-768-7-url`, `url(../img/${theme}/bg7_768.png)`);
|
||||
root.style.setProperty(`--bg-768-8-url`, `url(../img/${theme}/bg8_768.png)`);
|
||||
root.style.setProperty(`--bg-768-9-url`, `url(../img/${theme}/bg9_768.png)`);
|
||||
root.style.setProperty('--bg-color', theme === 'dark' ? '#1E1E1E' :'#fff');
|
||||
root.style.setProperty('--text-color', theme === 'dark' ? '#fff' : '#000');
|
||||
root.style.setProperty('--txt-gray-color', theme === 'dark' ? '#888C8A':'#727570');
|
||||
root.style.setProperty('--txt-4ca5', theme === 'dark' ? '#A5ACA9':'#4C4E4B');
|
||||
root.style.setProperty('--txt-theme-color', theme === 'dark' ? '#58A738':'#8BCF70');
|
||||
root.style.setProperty('--bg-hover-color', theme === 'dark' ? '#2C312E':'#F2F3F1');
|
||||
root.style.setProperty('--btn-hover-color', theme === 'dark' ? '#5EB939':'#98d87f');
|
||||
root.style.setProperty('--choose-bg-hover-color', theme === 'dark' ? '#2E3533':'#fff');
|
||||
root.style.setProperty('--box-shadow-color', theme === 'dark' ? 'rgba(0, 0, 0, 0.12)':'rgba(234, 236, 242, 0.5)');
|
||||
root.style.setProperty('--border-color', theme === 'dark' ? '#2F3329':'#E7E9E4');
|
||||
root.style.setProperty('--pop-bg-color', theme === 'dark' ? '#202124':'#fff');
|
||||
root.style.setProperty('--bg-fa-color', theme === 'dark' ? '#262B2A':'#fafafa');
|
||||
root.style.setProperty('--txt-191a15-color', theme === 'dark' ? '#fff':'#191a15');
|
||||
root.style.setProperty('--bg-rec-color', theme === 'dark' ? '#D6B300':'#FFDD33');
|
||||
root.style.setProperty('--bg-292c2f-color', theme === 'dark' ? '#292C2F':'#fff');
|
||||
root.style.setProperty('--pop-box-shadow', theme === 'dark' ? '0px 4px 16px 8px rgba(0, 0, 0, 0.12)':'0px 0px 8px #F3F2F5');
|
||||
root.style.setProperty('--code-bg-color', theme === 'dark' ? '#2E3533':'#000');
|
||||
theme === 'dark'?themeSwitch('none','block'):themeSwitch('block','none')
|
||||
localStorage.setItem('theme', theme)
|
||||
drawer.classList.remove('open-drawer');
|
||||
const root = document.documentElement;
|
||||
const lang = localStorage.getItem("lang");
|
||||
changeImageSrc("#logo", `${theme}/logo.svg`);
|
||||
changeImageSrc("#home_pic", `${theme}/${lang}_home_pic1.png`);
|
||||
changeImageSrc("#home_pic2", `${theme}/${lang}_home_pic2.png`);
|
||||
changeImageSrc("#home_pic3", `${theme}/${lang}_home_pic3.png`);
|
||||
changeImageSrc("#home_pic4", `${theme}/${lang}_home_pic4.png`);
|
||||
changeImageSrc("#home_pic5", `${theme}/${lang}_home_pic5.png`);
|
||||
changeImageSrc("#home_pic6", `${theme}/${lang}_home_pic6.png`);
|
||||
changeImageSrc("#solution_pic1", `${theme}/${lang}_solution_pic1.png`);
|
||||
changeImageSrc("#solution_pic2", `${theme}/${lang}_solution_pic2.png`);
|
||||
changeImageSrc("#solution_pic3", `${theme}/${lang}_solution_pic3.png`);
|
||||
changeImageSrc("#dow_pic1", `${theme}/${lang}_dow_pic1.png`);
|
||||
changeImageSrc("#solution_pic4", `${theme}/solution_pic4.png`);
|
||||
changeImageSrc("#about_pic1", `${theme}/about_pic1.png`);
|
||||
changeImageSrc("#home_icon1", `${theme}/home_icon1.png`);
|
||||
changeImageSrc("#home_icon2", `${theme}/home_icon2.png`);
|
||||
changeImageSrc("#home_icon3", `${theme}/home_icon3.png`);
|
||||
changeImageSrc("#home_icon4", `${theme}/home_icon4.png`);
|
||||
changeImageSrc("#home_pic7", `${theme}/home_pic7.svg`);
|
||||
changeImageSrc("#home_pic7_768", `${theme}/home_pic7_768.svg`);
|
||||
changeImageSrc("#help_pic2", `${theme}/help_pic2.png`);
|
||||
changeImageSrc("#help_pic3", `${theme}/help_pic3.png`);
|
||||
root.style.setProperty(
|
||||
"--bg-pic7-url",
|
||||
`url(../img/${theme}/home_pic7.svg)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--bg-pic7-768-url",
|
||||
`url(../img/${theme}/home_pic7-768.svg)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-pic1-url`,
|
||||
`url(../img/${theme}/${lang}_dow_pic1.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-pic2-url`,
|
||||
`url(../img/${theme}/help_pic1.svg)`
|
||||
);
|
||||
root.style.setProperty(`--bg-1-url`, `url(../img/${theme}/bg1.png)`);
|
||||
root.style.setProperty(`--bg-2-url`, `url(../img/${theme}/bg2.png)`);
|
||||
root.style.setProperty(`--bg-3-url`, `url(../img/${theme}/bg3.png)`);
|
||||
root.style.setProperty(`--bg-4-url`, `url(../img/${theme}/bg4.png)`);
|
||||
root.style.setProperty(`--bg-5-url`, `url(../img/${theme}/bg5.png)`);
|
||||
root.style.setProperty(`--bg-6-url`, `url(../img/${theme}/bg6.png)`);
|
||||
root.style.setProperty(`--bg-7-url`, `url(../img/${theme}/bg7.png)`);
|
||||
root.style.setProperty(`--bg-8-url`, `url(../img/${theme}/bg8.png)`);
|
||||
root.style.setProperty(`--bg-9-url`, `url(../img/${theme}/bg9.png)`);
|
||||
root.style.setProperty(`--bg-10-url`, `url(../img/${theme}/bg10.png)`);
|
||||
root.style.setProperty(`--bg-11-url`, `url(../img/${theme}/bg11.png)`);
|
||||
root.style.setProperty(
|
||||
`--bg-768-3-url`,
|
||||
`url(../img/${theme}/bg3_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-4-url`,
|
||||
`url(../img/${theme}/bg4_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-5-url`,
|
||||
`url(../img/${theme}/bg5_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-6-url`,
|
||||
`url(../img/${theme}/bg6_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-7-url`,
|
||||
`url(../img/${theme}/bg7_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-8-url`,
|
||||
`url(../img/${theme}/bg8_768.png)`
|
||||
);
|
||||
root.style.setProperty(
|
||||
`--bg-768-9-url`,
|
||||
`url(../img/${theme}/bg9_768.png)`
|
||||
);
|
||||
root.style.setProperty("--bg-color", theme === "dark" ? "#1E1E1E" : "#fff");
|
||||
root.style.setProperty("--text-color", theme === "dark" ? "#fff" : "#000");
|
||||
root.style.setProperty(
|
||||
"--txt-gray-color",
|
||||
theme === "dark" ? "#888C8A" : "#727570"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--txt-4ca5",
|
||||
theme === "dark" ? "#A5ACA9" : "#4C4E4B"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--txt-theme-color",
|
||||
theme === "dark" ? "#58A738" : "#8BCF70"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--bg-hover-color",
|
||||
theme === "dark" ? "#2C312E" : "#F2F3F1"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--btn-hover-color",
|
||||
theme === "dark" ? "#5EB939" : "#98d87f"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--choose-bg-hover-color",
|
||||
theme === "dark" ? "#2E3533" : "#fff"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--box-shadow-color",
|
||||
theme === "dark" ? "rgba(0, 0, 0, 0.12)" : "rgba(234, 236, 242, 0.5)"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--border-color",
|
||||
theme === "dark" ? "#2F3329" : "#E7E9E4"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--pop-bg-color",
|
||||
theme === "dark" ? "#202124" : "#fff"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--bg-fa-color",
|
||||
theme === "dark" ? "#262B2A" : "#fafafa"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--txt-191a15-color",
|
||||
theme === "dark" ? "#fff" : "#191a15"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--bg-rec-color",
|
||||
theme === "dark" ? "#D6B300" : "#FFDD33"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--bg-292c2f-color",
|
||||
theme === "dark" ? "#292C2F" : "#fff"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--pop-box-shadow",
|
||||
theme === "dark"
|
||||
? "0px 4px 16px 8px rgba(0, 0, 0, 0.12)"
|
||||
: "0px 0px 8px #F3F2F5"
|
||||
);
|
||||
root.style.setProperty(
|
||||
"--code-bg-color",
|
||||
theme === "dark" ? "#2E3533" : "#000"
|
||||
);
|
||||
theme === "dark"
|
||||
? themeSwitch("none", "block")
|
||||
: themeSwitch("block", "none");
|
||||
localStorage.setItem("theme", theme);
|
||||
drawer.classList.remove("open-drawer");
|
||||
}
|
||||
/* 导航选中激活 */
|
||||
const url = window.location.pathname;
|
||||
const currentTabName = url.split('/')[url.split('/').length - 1].split('.')[0]
|
||||
if(currentTabName
|
||||
&& currentTabName != 'index'
|
||||
&& currentTabName != 'help'
|
||||
&& currentTabName != 'download'
|
||||
&& currentTabName != 'log'){
|
||||
const currentTab = document.querySelector(`.nav-${currentTabName}`)
|
||||
currentTab.style.backgroundColor = 'var(--bg-hover-color)';
|
||||
currentTab.style.color = 'var(--text-color)';
|
||||
currentTab.style.borderRadius = '6px';
|
||||
const currentTabName = url.split("/")[url.split("/").length - 1].split(".")[0];
|
||||
if (
|
||||
currentTabName &&
|
||||
currentTabName != "index" &&
|
||||
currentTabName != "help" &&
|
||||
currentTabName != "download" &&
|
||||
currentTabName != "log"
|
||||
) {
|
||||
const currentTab = document.querySelector(`.nav-${currentTabName}`);
|
||||
if (currentTab) {
|
||||
currentTab.style.backgroundColor = "var(--bg-hover-color)";
|
||||
currentTab.style.color = "var(--text-color)";
|
||||
currentTab.style.borderRadius = "6px";
|
||||
}
|
||||
}
|
||||
/* 导航下拉菜单函数 */
|
||||
const submenuPopDom = document.querySelector('#submenu-pop');
|
||||
const dropDownSvgDom = document.querySelector('#drop-down-svg');
|
||||
const showMenuPopHandle = ()=>{
|
||||
submenuPopDom.style.display = 'block';
|
||||
dropDownSvgDom.style.transform = 'rotate(180deg)'
|
||||
}
|
||||
const changeMenu = (type)=>{
|
||||
submenuPopDom.style.display = 'none';
|
||||
dropDownSvgDom.style.transform = ''
|
||||
}
|
||||
document.addEventListener('click', function (event) {
|
||||
if (!event.target.closest('#support-txt')) {
|
||||
submenuPopDom.style.display = 'none';
|
||||
dropDownSvgDom.style.transform = ''
|
||||
}
|
||||
const submenuPopDom = document.querySelector("#submenu-pop");
|
||||
const dropDownSvgDom = document.querySelector("#drop-down-svg");
|
||||
const showMenuPopHandle = () => {
|
||||
submenuPopDom.style.display = "block";
|
||||
dropDownSvgDom.style.transform = "rotate(180deg)";
|
||||
};
|
||||
const changeMenu = (type) => {
|
||||
submenuPopDom.style.display = "none";
|
||||
dropDownSvgDom.style.transform = "";
|
||||
};
|
||||
document.addEventListener("click", function (event) {
|
||||
if (!event.target.closest("#support-txt")) {
|
||||
submenuPopDom.style.display = "none";
|
||||
dropDownSvgDom.style.transform = "";
|
||||
}
|
||||
});
|
||||
/* 语言切换函数 */
|
||||
const langPopDom = document.querySelector('#lang-pop');
|
||||
const shouLangPopHandle = ()=>{
|
||||
langPopDom.style.display = 'block';
|
||||
}
|
||||
const changeLanguage = (type)=>{
|
||||
const str = window.location.pathname
|
||||
const index = str.lastIndexOf('/');
|
||||
const newStr = str.slice(index + 1);
|
||||
const lang = localStorage.getItem('lang')
|
||||
if(type != lang){
|
||||
if (str.includes('site')){
|
||||
window.location.href = `/site/${type}/${newStr}`
|
||||
}else{
|
||||
window.location.href = `/site/${type}/index.html`
|
||||
const langPopDom = document.querySelector("#lang-pop");
|
||||
const shouLangPopHandle = () => {
|
||||
langPopDom.style.display = "block";
|
||||
};
|
||||
const changeLanguage = (type) => {
|
||||
const str = window.location.pathname;
|
||||
const index = str.lastIndexOf("/");
|
||||
const newStr = str.slice(index + 1);
|
||||
const lang = localStorage.getItem("lang");
|
||||
if (type != lang) {
|
||||
if (str.includes("site")) {
|
||||
window.location.href = `/site/${type}/${newStr}`;
|
||||
} else {
|
||||
window.location.href = `/site/${type}/index.html`;
|
||||
}
|
||||
} else {
|
||||
if (str.includes("site")) {
|
||||
window.location.href = `/site/${lang}/${newStr}`;
|
||||
} else {
|
||||
window.location.href = `/site/${lang}/index.html`;
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if (str.includes('site')){
|
||||
window.location.href = `/site/${lang}/${newStr}`
|
||||
}else{
|
||||
window.location.href = `/site/${lang}/index.html`
|
||||
langPopDom.style.display = "none";
|
||||
localStorage.setItem("lang", type);
|
||||
drawer.classList.remove("open-drawer");
|
||||
};
|
||||
document.addEventListener("click", function (event) {
|
||||
if (!event.target.closest("#lang-img")) {
|
||||
langPopDom.style.display = "none";
|
||||
}
|
||||
}
|
||||
langPopDom.style.display = 'none';
|
||||
localStorage.setItem('lang',type)
|
||||
drawer.classList.remove('open-drawer');
|
||||
}
|
||||
document.addEventListener('click', function (event) {
|
||||
if (!event.target.closest('#lang-img')) {
|
||||
langPopDom.style.display = 'none';
|
||||
}
|
||||
});
|
||||
/* 当屏幕宽度低于768px时显示菜单的抽屉的相关操作逻辑 */
|
||||
menuBtn.addEventListener('click', () => {
|
||||
drawer.classList.add('open-drawer');
|
||||
menuBtn.addEventListener("click", () => {
|
||||
drawer.classList.add("open-drawer");
|
||||
});
|
||||
const closeDraweHandle = ()=>{
|
||||
drawer.classList.remove('open-drawer');
|
||||
}
|
||||
window.addEventListener('click', (e) => {
|
||||
if (!drawer.contains(e.target) && e.target !== menuBtn) {
|
||||
drawer.classList.remove('open-drawer');
|
||||
}
|
||||
const closeDraweHandle = () => {
|
||||
drawer.classList.remove("open-drawer");
|
||||
};
|
||||
window.addEventListener("click", (e) => {
|
||||
if (!drawer.contains(e.target) && e.target !== menuBtn) {
|
||||
drawer.classList.remove("open-drawer");
|
||||
}
|
||||
});
|
||||
const expandMenuHandle = (val)=>{
|
||||
const actives = document.querySelector(`#${val}`);
|
||||
const dropDownSvgDom = document.querySelector(`#drawer-down-${val}-svg`);
|
||||
if(actives.style.display == 'none') {
|
||||
actives.style.display = 'block'
|
||||
dropDownSvgDom.style.transform = 'rotate(180deg)'
|
||||
}else{
|
||||
dropDownSvgDom.style.transform = ''
|
||||
actives.style.display = 'none'
|
||||
}
|
||||
}
|
||||
const expandMenuHandle = (val) => {
|
||||
const actives = document.querySelector(`#${val}`);
|
||||
const dropDownSvgDom = document.querySelector(`#drawer-down-${val}-svg`);
|
||||
if (actives.style.display == "none") {
|
||||
actives.style.display = "block";
|
||||
dropDownSvgDom.style.transform = "rotate(180deg)";
|
||||
} else {
|
||||
dropDownSvgDom.style.transform = "";
|
||||
actives.style.display = "none";
|
||||
}
|
||||
};
|
||||
/* 导航栏悬浮函数 */
|
||||
const navbar = document.querySelector('.nav');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (window.scrollY >= 30) {
|
||||
navbar.classList.add('navbar-white');
|
||||
} else {
|
||||
navbar.classList.remove('navbar-white');
|
||||
}
|
||||
const navbar = document.querySelector(".nav");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (window.scrollY >= 30) {
|
||||
navbar.classList.add("navbar-white");
|
||||
} else {
|
||||
navbar.classList.remove("navbar-white");
|
||||
}
|
||||
});
|
||||
const openInNewTab = (url)=> {
|
||||
const win = window.open(url, '_blank');
|
||||
win.focus();
|
||||
}
|
||||
const openInNewTab = (url) => {
|
||||
const win = window.open(url, "_blank");
|
||||
win.focus();
|
||||
};
|
||||
// 点击其他地方置为none
|
||||
document.addEventListener('click', function(event) {
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
if (!toolbarPhone.contains(event.target)) {
|
||||
tooltipPhone.style.display = "none";
|
||||
}
|
||||
if (!toolbarWhtasapp.contains(event.target)) {
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
}
|
||||
if (!toolbarQrcode.contains(event.target)) {
|
||||
tooltipQrcode.style.display = "none";
|
||||
}
|
||||
})
|
||||
|
||||
document.addEventListener("click", function (event) {
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
if (!toolbarPhone.contains(event.target)) {
|
||||
tooltipPhone.style.display = "none";
|
||||
}
|
||||
if (!toolbarWhtasapp.contains(event.target)) {
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
}
|
||||
if (!toolbarQrcode.contains(event.target)) {
|
||||
tooltipQrcode.style.display = "none";
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>关于我们 - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。">
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/about.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。" />
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/about.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="BulletBox"></div>
|
||||
<div id="layout" class="about_green_bg">
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
支持
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -50,7 +53,8 @@
|
||||
<a class="txt-4001418 txt-sub" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,36 +67,38 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="明亮主题">
|
||||
<img src="../img/light.svg" alt="明亮主题" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="暗黑主题">
|
||||
<img src="../img/drak.svg" alt="暗黑主题" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >立即体验</button>
|
||||
<button class="btn btn-primary">
|
||||
立即体验
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -102,25 +108,39 @@
|
||||
<div class="topics-tit mb-32">
|
||||
<span class="txt-6007290 topics-h1">关于我们的公司</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32">专注于网络安全领域，我们致力于为用户提供全方位的网络安全解决方案。</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32">
|
||||
专注于网络安全领域，我们致力于为用户提供全方位的网络安全解决方案。
|
||||
</h4>
|
||||
<ul class="company-ul">
|
||||
<li class="company-ul-item">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-year">2020</h2>
|
||||
<h6 class="txt-4001624 company-h6">公司成立</h6>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-year">
|
||||
2020
|
||||
</h2>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
公司成立
|
||||
</h6>
|
||||
</li>
|
||||
<li class="company-ul-item">
|
||||
<div class="flex-sc">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-area">10</h2>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-area">
|
||||
10
|
||||
</h2>
|
||||
<i class="company-sup">+</i>
|
||||
</div>
|
||||
<h6 class="txt-4001624 company-h6">团队经验</h6>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
团队经验
|
||||
</h6>
|
||||
</li>
|
||||
<li class="company-ul-item">
|
||||
<div class="flex-sc">
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-size">99</h2>
|
||||
<h2 class="txt-5003636 company-h2 mb-8 company-size">
|
||||
99
|
||||
</h2>
|
||||
<i class="company-sup">%</i>
|
||||
</div>
|
||||
<h6 class="txt-4001624 company-h6">客户满意</h6>
|
||||
<h6 class="txt-4001624 company-h6">
|
||||
客户满意
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -129,15 +149,20 @@
|
||||
<article class="company-profile">
|
||||
<div class="company-profile-con">
|
||||
<div class="company-profile-layout">
|
||||
<img class="company-profile-l" id="about_pic1" src="../img/light/about_pic1.png" alt="广西海豚有海信息科技公司,HITOSEA,海豚有海,广西海豚有海">
|
||||
<img class="company-profile-l" id="about_pic1" src="../img/light/about_pic1.png"
|
||||
alt="广西海豚有海信息科技公司,HITOSEA,海豚有海,广西海豚有海" />
|
||||
<div class="company-profile-r">
|
||||
<h1 class="txt-5004455 company-profile-h1 mb-80">
|
||||
公司介绍
|
||||
<svg style="bottom: -15px !important;" class="company-profile-arcs" width="312" height="23" viewBox="0 0 312 23" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="arc" opacity="0.5" d="M3 20C47.4822 7.1714 170.957 -10.7886 309 20" stroke="#8BCF70" stroke-width="6" stroke-linecap="round" stroke-dasharray="600, 600" stroke-dashoffset="0"/>
|
||||
<svg style="bottom: -15px !important" class="company-profile-arcs" width="312" height="23"
|
||||
viewBox="0 0 312 23" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="arc" opacity="0.5" d="M3 20C47.4822 7.1714 170.957 -10.7886 309 20" stroke="#8BCF70"
|
||||
stroke-width="6" stroke-linecap="round" stroke-dasharray="600, 600" stroke-dashoffset="0" />
|
||||
</svg>
|
||||
</h1>
|
||||
<h6 class="txt-4001830 company-profile-h6">自成立以来，广西海豚有海信息科技有限公司（HITOSEA）一直专注于网络安全领域前沿技术的创新，提供包括边界安全、云安全、数据安全、内网安全在内的网络安全产品和服务，致力于为用户提供更全面、更智能、零干扰的网络安全解决方案，是一家拥有年轻活力的技术公司。</h6>
|
||||
<h6 class="txt-4001830 company-profile-h6">
|
||||
自成立以来，广西海豚有海信息科技有限公司（HITOSEA）一直专注于网络安全领域前沿技术的创新，提供包括边界安全、云安全、数据安全、内网安全在内的网络安全产品和服务，致力于为用户提供更全面、更智能、零干扰的网络安全解决方案，是一家拥有年轻活力的技术公司。
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -147,7 +172,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -163,10 +188,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
支持
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="support" style="display: none;">
|
||||
<ol class="drawer-active" id="support" style="display: none">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -191,28 +216,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
主题
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="theme" style="display: none;">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active" id="theme" style="display: none">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
语言
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="language" style="display: none;">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active" id="language" style="display: none">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -231,40 +256,64 @@
|
||||
<article class="scenario-app">
|
||||
<div class="scenario-app-con">
|
||||
<div class="scenario-app-layout">
|
||||
<h1 class="txt-5004455 scenario-app-h1 mb-16">情景应用</h1>
|
||||
<h6 class="txt-4001824 scenario-app-h6 mb-80" style="text-align: center;">该产品支持各种应用场景，帮助团队协作</h6>
|
||||
<h1 class="txt-5004455 scenario-app-h1 mb-16">
|
||||
情景应用
|
||||
</h1>
|
||||
<h6 class="txt-4001824 scenario-app-h6 mb-80" style="text-align: center">
|
||||
该产品支持各种应用场景，帮助团队协作
|
||||
</h6>
|
||||
<ul class="scenario-app-ul">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0s;">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon7.svg" alt="边缘安全">
|
||||
<img class="scenario-app-icon" src="../img/about_icon7.svg" alt="边缘安全" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">边缘安全</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">HITOSEA下一代防火墙、入侵防御/入侵检测系统、云沙箱等产品为用户提供网络边界访问控制、深度攻击检测和APT攻击检测等全面的智能安全保护。</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/01.svg" alt="HITOSEA下一代防火墙、入侵防御/入侵检测系统、云沙箱等产品为用户提供网络边界访问控制、深度攻击检测和APT攻击检测等全面的智能安全保护。">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
边缘安全
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
HITOSEA下一代防火墙、入侵防御/入侵检测系统、云沙箱等产品为用户提供网络边界访问控制、深度攻击检测和APT攻击检测等全面的智能安全保护。
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/01.svg"
|
||||
alt="HITOSEA下一代防火墙、入侵防御/入侵检测系统、云沙箱等产品为用户提供网络边界访问控制、深度攻击检测和APT攻击检测等全面的智能安全保护。" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0.1s;">
|
||||
<li class="scenario-app-ul-item mb-32 about-animate-box" style="--delay: 0.1s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon8.svg" alt="云安全">
|
||||
<img class="scenario-app-icon" src="../img/about_icon8.svg" alt="云安全" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">云安全</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">我们提供安全可靠的高防云服务器，解决了服务器面临的主要网络安全风险，缓解了因洪水攻击而导致的业务中断风险，满足了常规安全操作的需要。</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/02.svg" alt="我们提供安全可靠的高防云服务器，解决了服务器面临的主要网络安全风险，缓解了因洪水攻击而导致的业务中断风险，满足了常规安全操作的需要。">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
云安全
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
我们提供安全可靠的高防云服务器，解决了服务器面临的主要网络安全风险，缓解了因洪水攻击而导致的业务中断风险，满足了常规安全操作的需要。
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/02.svg"
|
||||
alt="我们提供安全可靠的高防云服务器，解决了服务器面临的主要网络安全风险，缓解了因洪水攻击而导致的业务中断风险，满足了常规安全操作的需要。" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.2s;">
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.2s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon9.svg" alt="数据安全">
|
||||
<img class="scenario-app-icon" src="../img/about_icon9.svg" alt="数据安全" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">数据安全</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">数据库审计和数据泄漏保护系统可以保护敏感数据和文件，识别数据和监控操作，阻止内部和外部人员通过网络、电子邮件和其他渠道进行数据盗窃。</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/03.svg" alt="数据库审计和数据泄漏保护系统可以保护敏感数据和文件，识别数据和监控操作，阻止内部和外部人员通过网络、电子邮件和其他渠道进行数据盗窃。">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
数据安全
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
数据库审计和数据泄漏保护系统可以保护敏感数据和文件，识别数据和监控操作，阻止内部和外部人员通过网络、电子邮件和其他渠道进行数据盗窃。
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/03.svg"
|
||||
alt="数据库审计和数据泄漏保护系统可以保护敏感数据和文件，识别数据和监控操作，阻止内部和外部人员通过网络、电子邮件和其他渠道进行数据盗窃。" />
|
||||
</li>
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.3s;">
|
||||
<li class="scenario-app-ul-item about-animate-box" style="--delay: 0.3s">
|
||||
<i class="scenario-app-icon-bg mb-24">
|
||||
<img class="scenario-app-icon" src="../img/about_icon10.svg" alt="内联网安全">
|
||||
<img class="scenario-app-icon" src="../img/about_icon10.svg" alt="内联网安全" />
|
||||
</i>
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">内联网安全</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">网络应用防火墙和网络防篡改系统为应用系统提供了全面的安全保护，有效阻止了网络篡改和攻击等恶意行为的发生。</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/04.svg" alt="网络应用防火墙和网络防篡改系统为应用系统提供了全面的安全保护，有效阻止了网络篡改和攻击等恶意行为的发生。">
|
||||
<h5 class="txt-5002025 scenario-app-h5 mb-16">
|
||||
内联网安全
|
||||
</h5>
|
||||
<h6 class="txt-4001624 scenario-app-h6">
|
||||
网络应用防火墙和网络防篡改系统为应用系统提供了全面的安全保护，有效阻止了网络篡改和攻击等恶意行为的发生。
|
||||
</h6>
|
||||
<img class="scenario-app-ul-item-svg" src="../img/04.svg"
|
||||
alt="网络应用防火墙和网络防篡改系统为应用系统提供了全面的安全保护，有效阻止了网络篡改和攻击等恶意行为的发生。" />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -274,35 +323,46 @@
|
||||
<div class="footer-t-con">
|
||||
<div class="footer-t-layout">
|
||||
<div class="footer-t-l">
|
||||
<h1 class="footer-t-h1 mb-56">我们希望听到您的意见</h1>
|
||||
<h6 class="footer-t-h6 mb-56">对价格、计划或产品有疑问吗？请填写表格，我们将与您联系。</h6>
|
||||
<h1 class="footer-t-h1 mb-56">
|
||||
我们希望听到您的意见
|
||||
</h1>
|
||||
<h6 class="footer-t-h6 mb-56">
|
||||
对价格、计划或产品有疑问吗？请填写表格，我们将与您联系。
|
||||
</h6>
|
||||
<div class="footer-t-contact mb-24">
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon1.svg" alt="联系手机,13471168831">
|
||||
<h6 class="footer-t-contact-h6">0771-3164099</h6>
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon1.svg" alt="联系手机,13471168831" />
|
||||
<h6 class="footer-t-contact-h6">
|
||||
0771-3164099
|
||||
</h6>
|
||||
</div>
|
||||
<div class="footer-t-contact">
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon2.svg" alt="邮箱,service@hitosea.com">
|
||||
<h6 class="footer-t-contact-h6">service@hitosea.com</h6>
|
||||
<img class="footer-t-contact-icon mr-12" src="../img/about_icon2.svg" alt="邮箱,service@hitosea.com" />
|
||||
<h6 class="footer-t-contact-h6">
|
||||
service@hitosea.com
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
<form class="from">
|
||||
<ul class="from-ul">
|
||||
<li class="from-ul-item mb-16">
|
||||
<i class="from-ul-tags mb-8">昵称</i>
|
||||
<input id="username" class="input" type="text" placeholder="请输入昵称">
|
||||
<input id="username" class="input" type="text" placeholder="请输入昵称" />
|
||||
</li>
|
||||
<li class="from-ul-item mb-16">
|
||||
<i class="from-ul-tags mb-8">邮箱</i>
|
||||
<input id="email" class="input" type="text" placeholder="请输入邮箱">
|
||||
<input id="email" class="input" type="text" placeholder="请输入邮箱" />
|
||||
</li>
|
||||
<li class="from-ul-item mb-16" id="desc_wrap">
|
||||
<i class="from-ul-tags mb-8">留言</i>
|
||||
<textarea id="desc" class="textarea" cols="3" rows="8" placeholder="选填" oninput="limitCharacters( 255)"></textarea>
|
||||
<textarea id="desc" class="textarea" cols="3" rows="8" placeholder="选填"
|
||||
oninput="limitCharacters( 255)"></textarea>
|
||||
<p id="characterCount">0/255</p>
|
||||
</li>
|
||||
<li>
|
||||
<span class="from-submit">
|
||||
<button id="loadingWrap" class="btn btn-primary" type="button" onclick="sendFormRequest()"><img id="submitLoading" alt="" src="../img/loading.png" />提交</button>
|
||||
<button id="loadingWrap" class="btn btn-primary" type="button" onclick="sendFormRequest()">
|
||||
<img id="submitLoading" alt="" src="../img/loading.png" />提交
|
||||
</button>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
@ -315,10 +375,10 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">帮助团队有效地推进项目，使工作更轻松。</i>
|
||||
@ -327,7 +387,9 @@
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">链接</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
链接
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/product.html">产品</a>
|
||||
</li>
|
||||
@ -344,7 +406,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">支持</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
支持
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -355,13 +419,16 @@
|
||||
<a class="txt-4001624 txt" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ul class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">社区</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
社区
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -372,7 +439,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ 群</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618" />
|
||||
<i class="group_num">群号：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -387,7 +454,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -400,19 +470,20 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script>
|
||||
/* 数字滚动动画 */
|
||||
const companyYearEl = document.querySelector('.company-year');
|
||||
const companyAreaEl = document.querySelector('.company-area');
|
||||
const companySizeEl = document.querySelector('.company-size');
|
||||
const companyYearEl = document.querySelector(".company-year");
|
||||
const companyAreaEl = document.querySelector(".company-area");
|
||||
const companySizeEl = document.querySelector(".company-size");
|
||||
let yearTimerId;
|
||||
let areaTimerId;
|
||||
let sizeTimerId;
|
||||
let curYearNumber = 999
|
||||
let curAreaNumber = 0
|
||||
let curSizeNumber = 0
|
||||
let curYearNumber = 999;
|
||||
let curAreaNumber = 0;
|
||||
let curSizeNumber = 0;
|
||||
function updateYearNumber() {
|
||||
const increment = Math.ceil((2020 - curYearNumber) / 50); // 使用缓动函数计算增量
|
||||
curYearNumber += increment; // 更新当前数字
|
||||
if (curYearNumber >= 2020) { // 数字已经达到目标值
|
||||
if (curYearNumber >= 2020) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(yearTimerId); // 停止定时器
|
||||
curYearNumber = 2020; // 将当前数字设置为目标值
|
||||
}
|
||||
@ -420,197 +491,233 @@
|
||||
}
|
||||
function updateAreaNumber() {
|
||||
curAreaNumber += 0.05; // 更新当前数字
|
||||
if (curAreaNumber >= 10) { // 数字已经达到目标值
|
||||
if (curAreaNumber >= 10) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(areaTimerId); // 停止定时器
|
||||
curAreaNumber = 10; // 将当前数字设置为目标值
|
||||
}
|
||||
companyAreaEl.innerText = Number(curAreaNumber.toFixed(1)).toString(); // 更新数字显示
|
||||
companyAreaEl.innerText = Number(
|
||||
curAreaNumber.toFixed(1)
|
||||
).toString(); // 更新数字显示
|
||||
}
|
||||
function updateSizeNumber() {
|
||||
curSizeNumber += 0.5; // 更新当前数字
|
||||
if (curSizeNumber >= 99) { // 数字已经达到目标值
|
||||
if (curSizeNumber >= 99) {
|
||||
// 数字已经达到目标值
|
||||
clearInterval(sizeTimerId); // 停止定时器
|
||||
curSizeNumber = 99; // 将当前数字设置为目标值
|
||||
}
|
||||
companySizeEl.innerText = curSizeNumber.toString(); // 更新数字显示
|
||||
}
|
||||
let isMobile = window.matchMedia("only screen and (max-width: 768px)").matches; // 判断是否是移动端
|
||||
if(!isMobile){
|
||||
let isMobile = window.matchMedia(
|
||||
"only screen and (max-width: 768px)"
|
||||
).matches; // 判断是否是移动端
|
||||
if (!isMobile) {
|
||||
yearTimerId = setInterval(updateYearNumber, 1);
|
||||
areaTimerId = setInterval(updateAreaNumber, 1);
|
||||
sizeTimerId = setInterval(updateSizeNumber, 1);
|
||||
}
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.about-animate-box');
|
||||
let timerId = null
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxes = document.querySelectorAll(".about-animate-box");
|
||||
let timerId = null;
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
timerId = setTimeout(()=>{
|
||||
box.classList.remove('about-animate-box');
|
||||
timerId = null
|
||||
},1200)
|
||||
box.classList.add("animate");
|
||||
timerId = setTimeout(() => {
|
||||
box.classList.remove("about-animate-box");
|
||||
timerId = null;
|
||||
}, 1200);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
/* 限制表单textarea字符数 */
|
||||
function limitCharacters( maxCharacters) {
|
||||
const textarea = document.getElementById("desc")
|
||||
function limitCharacters(maxCharacters) {
|
||||
const textarea = document.getElementById("desc");
|
||||
let text = textarea.value;
|
||||
if (text.length > maxCharacters) {
|
||||
textarea.value = text.slice(0, maxCharacters); // 截断文本
|
||||
textarea.value = text.slice(0, maxCharacters); // 截断文本
|
||||
text = textarea.value;
|
||||
}
|
||||
document.getElementById('characterCount').textContent = `${text.length}/${maxCharacters}`;
|
||||
document.getElementById(
|
||||
"characterCount"
|
||||
).textContent = `${text.length}/${maxCharacters}`;
|
||||
}
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text){
|
||||
const box = document.querySelector('.BulletBox')
|
||||
box.style.display = 'block'
|
||||
box.innerHTML = text
|
||||
setTimeout(()=>{
|
||||
box.style.display = 'none'
|
||||
},1000)
|
||||
function showBox(text) {
|
||||
const box = document.querySelector(".BulletBox");
|
||||
box.style.display = "block";
|
||||
box.innerHTML = text;
|
||||
setTimeout(() => {
|
||||
box.style.display = "none";
|
||||
}, 1000);
|
||||
}
|
||||
/* 表单发送请求 */
|
||||
function sendFormRequest(){
|
||||
const username = document.getElementById("username").value
|
||||
const form = document.querySelector('.from')
|
||||
const email = document.getElementById("email").value
|
||||
const desc = document.getElementById("desc").value
|
||||
const pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
|
||||
if(!username&&!email){
|
||||
return showBox('昵称不能为空! 邮箱不能为空！')
|
||||
}else if(!username){
|
||||
return showBox('昵称不能为空!')
|
||||
}else if(!email){
|
||||
return showBox('邮箱不能为空!')
|
||||
}else if(email){
|
||||
if(!pattern.test(email)){
|
||||
return showBox('邮箱输入错误!')
|
||||
}else{
|
||||
const url = 'https://t.hitosea.com/api/dialog/msg/sendtext';
|
||||
function sendFormRequest() {
|
||||
const username = document.getElementById("username").value;
|
||||
const form = document.querySelector(".from");
|
||||
const email = document.getElementById("email").value;
|
||||
const desc = document.getElementById("desc").value;
|
||||
const pattern =
|
||||
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
|
||||
if (!username && !email) {
|
||||
return showBox("昵称不能为空! 邮箱不能为空！");
|
||||
} else if (!username) {
|
||||
return showBox("昵称不能为空!");
|
||||
} else if (!email) {
|
||||
return showBox("邮箱不能为空!");
|
||||
} else if (email) {
|
||||
if (!pattern.test(email)) {
|
||||
return showBox("邮箱输入错误!");
|
||||
} else {
|
||||
const url = "https://t.hitosea.com/api/dialog/msg/sendtext";
|
||||
const headers = {
|
||||
'version': '0.22.0',
|
||||
'token': 'YIG8ANC8q2SAXWxKu7L4Nf5VLWDxBixpIl_OSDnaVTug7P_DVHq--HV_7QKl2rNYlmCs-xsQuj0NAfktdsbyxNqCU9efF2ggFOQCYoE7l-np9ltT-LOGj3LGU422lVRC',
|
||||
'content-type': 'application/json'
|
||||
version: "0.22.0",
|
||||
token: "YIG8ANC8q2SAXWxKu7L4Nf5VLWDxBixpIl_OSDnaVTug7P_DVHq--HV_7QKl2rNYlmCs-xsQuj0NAfktdsbyxNqCU9efF2ggFOQCYoE7l-np9ltT-LOGj3LGU422lVRC",
|
||||
"content-type": "application/json",
|
||||
};
|
||||
const data = {
|
||||
"dialog_id": 10466,
|
||||
"text": `[昵称]:${username}\n[邮箱]:${email}\n[留言]:${desc}
|
||||
dialog_id: 10466,
|
||||
text: `[昵称]:${username}\n[邮箱]:${email}\n[留言]:${desc}
|
||||
`,
|
||||
"silence": "no"
|
||||
silence: "no",
|
||||
};
|
||||
document.getElementById("submitLoading").style.display = "block"
|
||||
axios.post(url, data, { headers })
|
||||
.then(response => {
|
||||
form.reset()
|
||||
document.getElementById("submitLoading").style.display = "none"
|
||||
limitCharacters(255)
|
||||
showBox('提交成功！')
|
||||
document.getElementById("submitLoading").style.display =
|
||||
"block";
|
||||
axios
|
||||
.post(url, data, { headers })
|
||||
.then((response) => {
|
||||
form.reset();
|
||||
document.getElementById(
|
||||
"submitLoading"
|
||||
).style.display = "none";
|
||||
limitCharacters(255);
|
||||
showBox("提交成功！");
|
||||
})
|
||||
.catch(error => {
|
||||
form.reset()
|
||||
document.getElementById("submitLoading").style.display = "none"
|
||||
limitCharacters(255)
|
||||
showBox(error.message)
|
||||
.catch((error) => {
|
||||
form.reset();
|
||||
document.getElementById(
|
||||
"submitLoading"
|
||||
).style.display = "none";
|
||||
limitCharacters(255);
|
||||
showBox(error.message);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
1191
public/site/zh/ad.html
Normal file
1191
public/site/zh/ad.html
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>下载中心 - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。">
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/download.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。" />
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/download.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="BulletBox"></div>
|
||||
<div id="layout">
|
||||
@ -25,7 +28,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -38,7 +41,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
支持
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -51,7 +54,8 @@
|
||||
<a class="txt-4001418 txt-sub" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -64,7 +68,7 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
@ -75,25 +79,27 @@
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="明亮主题">
|
||||
<img src="../img/light.svg" alt="明亮主题" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="暗黑主题">
|
||||
<img src="../img/drak.svg" alt="暗黑主题" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >立即体验</button>
|
||||
<button class="btn btn-primary">
|
||||
立即体验
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -103,54 +109,68 @@
|
||||
<div class="topics-tit mb-32">
|
||||
<span class="txt-6005670 topics-h1">下载DooTask客户端</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-64">同时支持iOS、Android、macOS、Windows版本</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-64">
|
||||
同时支持iOS、Android、macOS、Windows版本
|
||||
</h4>
|
||||
<ul class="download-ul">
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0s;" onmouseover='handleMouseover(0)' onmouseout='handleMouseout(0)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0s" onmouseover="handleMouseover(0)"
|
||||
onmouseout="handleMouseout(0)">
|
||||
<a class="normal" href="https://apps.apple.com/cn/app/dootask/id1624855111" target="_blank" id="ios">
|
||||
<img class="icon mb-8" src="../img/dow_ios.svg" alt="ios">
|
||||
<img class="icon mb-8" src="../img/dow_ios.svg" alt="ios" />
|
||||
<i class="txt-4001624 txt">ios</i>
|
||||
</a>
|
||||
<a class="hover" href="https://apps.apple.com/cn/app/dootask/id1624855111" target="_blank">
|
||||
<img class="qr-code mb-8" src="../img/ios_code.png" alt="扫描下载,ios">
|
||||
<img class="qr-code mb-8" src="../img/ios_code.png" alt="扫描下载,ios" />
|
||||
<i class="txt-4001624 txt">扫描下载</i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.1s;" onmouseover='handleMouseover(1)' onmouseout='handleMouseout(1)'>
|
||||
<a class="normal" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank" id="Android">
|
||||
<img class="icon mb-8" src="../img/dow_android.svg" alt="Android">
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.1s" onmouseover="handleMouseover(1)"
|
||||
onmouseout="handleMouseout(1)">
|
||||
<a class="normal" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank"
|
||||
id="Android">
|
||||
<img class="icon mb-8" src="../img/dow_android.svg" alt="Android" />
|
||||
<i class="txt-4001624 txt">Android</i>
|
||||
</a>
|
||||
<a class="hover radius" id="winx64Link" href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Android,下载">
|
||||
<a class="hover radius" id="winx64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=android" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Android,下载" />
|
||||
<i class="txt-4001624 txt">下载</i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.2s;" onmouseover='handleMouseover(2)' onmouseout='handleMouseout(2)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.2s" onmouseover="handleMouseover(2)"
|
||||
onmouseout="handleMouseout(2)">
|
||||
<div class="normal">
|
||||
<img class="icon mb-8" src="../img/dow_mac.svg" alt="macOS">
|
||||
<img class="icon mb-8" src="../img/dow_mac.svg" alt="macOS" />
|
||||
<i class="txt-4001624 txt">macOS</i>
|
||||
</div>
|
||||
<div class="hover radius">
|
||||
<button class="btn btn-green mb-12 btn-padding" style="width: 70%;">
|
||||
<a class="chips-txt txt-4001418" id="arm64Link" href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=arm64" target="_blank">Apple Chips</a>
|
||||
<button class="btn btn-green mb-12 btn-padding" style="width: 70%">
|
||||
<a class="chips-txt txt-4001418" id="arm64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=arm64"
|
||||
target="_blank">Apple Chips</a>
|
||||
</button>
|
||||
<button class="btn btn-green btn-padding" style="width: 70%;">
|
||||
<a class="chips-txt txt-4001418" id="x64Link" href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=x64" target="_blank">Intel Chips</a>
|
||||
<button class="btn btn-green btn-padding" style="width: 70%">
|
||||
<a class="chips-txt txt-4001418" id="x64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=mac&arch=x64" target="_blank">Intel
|
||||
Chips</a>
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.3s;" onmouseover='handleMouseover(3)' onmouseout='handleMouseout(3)'>
|
||||
<li class="download-ul-item dow-animate-box" style="--delay: 0.3s" onmouseover="handleMouseover(3)"
|
||||
onmouseout="handleMouseout(3)">
|
||||
<p class="normal">
|
||||
<img class="icon mb-8" src="../img/dow_window.svg" alt="Windows">
|
||||
<img class="icon mb-8" src="../img/dow_window.svg" alt="Windows" />
|
||||
<i class="txt-4001624 txt">Windows</i>
|
||||
</p>
|
||||
<a class="hover radius" id="winx64Link" href="https://www.dootask.com/desktop/publish/latest?platform=win&arch=x64" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,下载">
|
||||
<a class="hover radius" id="winx64Link"
|
||||
href="https://www.dootask.com/desktop/publish/latest?platform=win&arch=x64" target="_blank">
|
||||
<img class="icon mb-8" src="../img/dow_icon.svg" alt="Windows,下载" />
|
||||
<i class="txt-4001624 txt">下载</i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="download-other-btn dow-animate-box" style="--delay: 0.5s;" href="https://www.dootask.com/desktop/publish/latest" target="_blank"><span>其他版本</span></a>
|
||||
<a class="download-other-btn dow-animate-box" style="--delay: 0.5s"
|
||||
href="https://www.dootask.com/desktop/publish/latest" target="_blank"><span>其他版本</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -159,7 +179,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -175,10 +195,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
支持
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="support" style="display: none;">
|
||||
<ol class="drawer-active" id="support" style="display: none">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -203,28 +223,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
主题
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="theme" style="display: none;">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active" id="theme" style="display: none">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
语言
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="language" style="display: none;">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active" id="language" style="display: none">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -244,19 +264,23 @@
|
||||
<div class="update-con">
|
||||
<div class="update-layout">
|
||||
<div class="update-l">
|
||||
<h1 class="txt-4003645 update-h1 mb-36">更新日志</h1>
|
||||
<h1 class="txt-4003645 update-h1 mb-36">
|
||||
更新日志
|
||||
</h1>
|
||||
<ul class="update-ul">
|
||||
<li id="releases"></li>
|
||||
<li>
|
||||
<a href="../zh/log.html" class="more-item">
|
||||
<h5 class="txt-4001624 more">更多日志</h5>
|
||||
<img class="icon" src="../img/dow_arrow.svg" alt="更多日志">
|
||||
<h5 class="txt-4001624 more">
|
||||
更多日志
|
||||
</h5>
|
||||
<img class="icon" src="../img/dow_arrow.svg" alt="更多日志" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="update-r">
|
||||
<img class="update-r-svg" id="dow_pic1" src="../img/light/zh_dow_pic1.png" alt="DooTask,下载中心">
|
||||
<img class="update-r-svg" id="dow_pic1" src="../img/light/zh_dow_pic1.png" alt="DooTask,下载中心" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -266,10 +290,10 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">帮助团队有效地推进项目，使工作更轻松。</i>
|
||||
@ -278,7 +302,9 @@
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">链接</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
链接
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/product.html">产品</a>
|
||||
</li>
|
||||
@ -295,7 +321,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">支持</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
支持
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -306,13 +334,16 @@
|
||||
<a class="txt-4001624 txt" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">社区</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
社区
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -323,7 +354,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ 群</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618" />
|
||||
<i class="group_num">群号：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -338,7 +369,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -350,231 +384,263 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script src="//cdn.bootcdn.net/ajax/libs/axios/1.3.6/axios.js"></script>
|
||||
<script>
|
||||
const isMobile = 'ontouchstart' in window
|
||||
const androidDOM = document.getElementById("Android")
|
||||
const iosDOM = document.getElementById("ios")
|
||||
// 判断是否为ios
|
||||
const isIos = /iPad|iPhone|iPod/.test(window.navigator.userAgent);
|
||||
// 判断是否为安卓
|
||||
const isAndroid = /Android/.test(window.navigator.userAgent);
|
||||
// 判断是否为windows
|
||||
const isWindows = /Win64/.test(window.navigator.userAgent);
|
||||
/* 下载应用的hover处理函数 */
|
||||
const download = document.querySelector('.download-ul');
|
||||
const downloadItems = download.querySelectorAll('.download-ul-item');
|
||||
const handleMouseover = (val)=>{
|
||||
if(isIos||isAndroid){
|
||||
return;
|
||||
}else{
|
||||
downloadItems[val].children[0].style.display = 'none'
|
||||
downloadItems[val].children[1].style.display = 'flex'
|
||||
}
|
||||
}
|
||||
const handleMouseout = (val)=>{
|
||||
if(isIos||isAndroid){
|
||||
return;
|
||||
}else{
|
||||
downloadItems[val].children[0].style.display = 'flex'
|
||||
downloadItems[val].children[1].style.display = 'none'
|
||||
}
|
||||
}
|
||||
/* 对于ios与Android pc端点击时a链接直接跳转 移动端点击时需要阻止a链接直接跳转 */
|
||||
androidDOM.addEventListener('click',function(e){
|
||||
if(isMobile){
|
||||
e.preventDefault()
|
||||
}
|
||||
})
|
||||
iosDOM.addEventListener('click',function(e){
|
||||
if(isMobile){
|
||||
e.preventDefault()
|
||||
}
|
||||
})
|
||||
// 对于不同类型的移动端进行处理
|
||||
function movieHandle(flag=true){
|
||||
if(flag){
|
||||
downloadItems.forEach((item,index)=>{
|
||||
item.addEventListener('touchstart',function(){
|
||||
if(index==2||index==3){
|
||||
return showBox("当前终端不支持")
|
||||
}
|
||||
if(index==0){
|
||||
if(isIos){
|
||||
window.location.href = item.children[0].href
|
||||
return
|
||||
}
|
||||
return showBox("当前终端不支持")
|
||||
}
|
||||
if(index==1){
|
||||
if(isAndroid){
|
||||
window.location.href = item.children[0].href
|
||||
return
|
||||
}
|
||||
return showBox("当前终端不支持")
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
// 移动端
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text){
|
||||
const box = document.querySelector('.BulletBox')
|
||||
box.style.display = 'block'
|
||||
box.innerHTML = text
|
||||
setTimeout(()=>{
|
||||
box.style.display = 'none'
|
||||
},1000)
|
||||
}
|
||||
// 是否是移动端
|
||||
if(isMobile){
|
||||
if(isAndroid||isIos){
|
||||
movieHandle()
|
||||
}else if(isWindows){
|
||||
movieHandle(false)
|
||||
}
|
||||
}
|
||||
const localStorageHandle = (val)=>{
|
||||
localStorage.setItem('update_log_num',val)
|
||||
window.location.href = '../zh/log.html'
|
||||
}
|
||||
const getItem = (key)=> {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
}
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.dow-animate-box');
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
const isMobile = "ontouchstart" in window;
|
||||
const androidDOM = document.getElementById("Android");
|
||||
const iosDOM = document.getElementById("ios");
|
||||
// 判断是否为ios
|
||||
const isIos = /iPad|iPhone|iPod/.test(window.navigator.userAgent);
|
||||
// 判断是否为安卓
|
||||
const isAndroid = /Android/.test(window.navigator.userAgent);
|
||||
// 判断是否为windows
|
||||
const isWindows = /Win64/.test(window.navigator.userAgent);
|
||||
/* 下载应用的hover处理函数 */
|
||||
const download = document.querySelector(".download-ul");
|
||||
const downloadItems = download.querySelectorAll(".download-ul-item");
|
||||
const handleMouseover = (val) => {
|
||||
if (isIos || isAndroid) {
|
||||
return;
|
||||
} else {
|
||||
downloadItems[val].children[0].style.display = "none";
|
||||
downloadItems[val].children[1].style.display = "flex";
|
||||
}
|
||||
};
|
||||
const handleMouseout = (val) => {
|
||||
if (isIos || isAndroid) {
|
||||
return;
|
||||
} else {
|
||||
downloadItems[val].children[0].style.display = "flex";
|
||||
downloadItems[val].children[1].style.display = "none";
|
||||
}
|
||||
};
|
||||
/* 对于ios与Android pc端点击时a链接直接跳转 移动端点击时需要阻止a链接直接跳转 */
|
||||
androidDOM.addEventListener("click", function (e) {
|
||||
if (isMobile) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
animateBoxes();
|
||||
|
||||
// 获取日志
|
||||
const logsItem = getItem('logs_dowmload_zh')
|
||||
const updates = document.getElementById('releases');
|
||||
if(!logsItem) {
|
||||
const url = "../../api/system/get/updatelog"
|
||||
axios.get(url).then(res=>{
|
||||
const changelog=res.data.data.updateLog
|
||||
const regex = /## \[(.*?)\]\n([\s\S]*?)(?=\n\n## \[|$)/g;
|
||||
let match;
|
||||
const Versions = []
|
||||
while ((match = regex.exec(changelog)) !== null) {
|
||||
Versions.push(match[1])
|
||||
iosDOM.addEventListener("click", function (e) {
|
||||
if (isMobile) {
|
||||
e.preventDefault();
|
||||
}
|
||||
const releases = Versions.slice(0,5).map((item,index)=>{
|
||||
return `
|
||||
<li class="update-item" onclick="localStorageHandle(${index+1})">
|
||||
});
|
||||
// 对于不同类型的移动端进行处理
|
||||
function movieHandle(flag = true) {
|
||||
if (flag) {
|
||||
downloadItems.forEach((item, index) => {
|
||||
item.addEventListener("touchstart", function () {
|
||||
if (index == 2 || index == 3) {
|
||||
return showBox("当前终端不支持");
|
||||
}
|
||||
if (index == 0) {
|
||||
if (isIos) {
|
||||
window.location.href = item.children[0].href;
|
||||
return;
|
||||
}
|
||||
return showBox("当前终端不支持");
|
||||
}
|
||||
if (index == 1) {
|
||||
if (isAndroid) {
|
||||
window.location.href = item.children[0].href;
|
||||
return;
|
||||
}
|
||||
return showBox("当前终端不支持");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
// 移动端
|
||||
/* 显示/隐藏提示弹框 */
|
||||
function showBox(text) {
|
||||
const box = document.querySelector(".BulletBox");
|
||||
box.style.display = "block";
|
||||
box.innerHTML = text;
|
||||
setTimeout(() => {
|
||||
box.style.display = "none";
|
||||
}, 1000);
|
||||
}
|
||||
// 是否是移动端
|
||||
if (isMobile) {
|
||||
if (isAndroid || isIos) {
|
||||
movieHandle();
|
||||
} else if (isWindows) {
|
||||
movieHandle(false);
|
||||
}
|
||||
}
|
||||
const localStorageHandle = (val) => {
|
||||
localStorage.setItem("update_log_num", val);
|
||||
window.location.href = "../zh/log.html";
|
||||
};
|
||||
const getItem = (key) => {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
};
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll(".dow-animate-box");
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add("animate");
|
||||
}
|
||||
});
|
||||
};
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
|
||||
// 获取日志
|
||||
const logsItem = getItem("logs_dowmload_zh");
|
||||
const updates = document.getElementById("releases");
|
||||
if (!logsItem) {
|
||||
const url = "../../api/system/get/updatelog";
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => {
|
||||
const changelog = res.data.data.updateLog;
|
||||
const regex = /## \[(.*?)\]\n([\s\S]*?)(?=\n\n## \[|$)/g;
|
||||
let match;
|
||||
const Versions = [];
|
||||
while ((match = regex.exec(changelog)) !== null) {
|
||||
Versions.push(match[1]);
|
||||
}
|
||||
const releases = Versions.slice(0, 5)
|
||||
.map((item, index) => {
|
||||
return `
|
||||
<li class="update-item" onclick="localStorageHandle(${index + 1})">
|
||||
<h5 class="txt-4001624 update-h5">DooTask ${item} 更新</h5>
|
||||
</li>
|
||||
`;
|
||||
}).join('')
|
||||
let record = {value: releases, expired: new Date().getTime() + 30 * 60 * 1000};
|
||||
localStorage.setItem('logs_dowmload_zh', JSON.stringify(record))
|
||||
updates.innerHTML = releases;
|
||||
}).catch(err=>{
|
||||
})
|
||||
}else{
|
||||
updates.innerHTML = logsItem;
|
||||
}
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
})
|
||||
.join("");
|
||||
let record = {
|
||||
value: releases,
|
||||
expired: new Date().getTime() + 30 * 60 * 1000,
|
||||
};
|
||||
localStorage.setItem(
|
||||
"logs_dowmload_zh",
|
||||
JSON.stringify(record)
|
||||
);
|
||||
updates.innerHTML = releases;
|
||||
})
|
||||
.catch((err) => { });
|
||||
} else {
|
||||
updates.innerHTML = logsItem;
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>更新日志 - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。">
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/log.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。" />
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/log.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="layout">
|
||||
<!-- 页头区域 -->
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
支持
|
||||
<img src="../img/vector.svg" alt="" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -50,7 +53,8 @@
|
||||
<a class="txt-4001418 txt-sub" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,36 +67,38 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="明亮主题">
|
||||
<img src="../img/light.svg" alt="明亮主题" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="暗黑主题">
|
||||
<img src="../img/drak.svg" alt="暗黑主题" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >立即体验</button>
|
||||
<button class="btn btn-primary">
|
||||
立即体验
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -101,19 +107,19 @@
|
||||
<div class="logs-drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeLogsDraweHandle()">✕</i>
|
||||
</div>
|
||||
<h5 class="logs-h5 mb-16" style="font-weight: 500;">更新日志</h5>
|
||||
<h5 class="logs-h5 mb-16" style="font-weight: 500">更新日志</h5>
|
||||
<ul class="logs-l-ul logs-l-768"></ul>
|
||||
</div>
|
||||
<!-- 菜单抽屉 -->
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -129,10 +135,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
支持
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="support" style="display: none;">
|
||||
<ol class="drawer-active" id="support" style="display: none">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -157,28 +163,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
主题
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="theme" style="display: none;">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active" id="theme" style="display: none">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
语言
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="language" style="display: none;">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active" id="language" style="display: none">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -197,16 +203,20 @@
|
||||
<article class="logs">
|
||||
<div class="logs-con">
|
||||
<div class="logs-t-768" id="menuBtn-logs">
|
||||
<img class="logs-t-prev" src="../img/prev.svg" alt="更新日志">
|
||||
<img class="logs-t-prev" src="../img/prev.svg" alt="更新日志" />
|
||||
<i class="logs-t-tit">更新日志</i>
|
||||
</div>
|
||||
<div class="logs-layout">
|
||||
<div class="logs-l logs-sticky">
|
||||
<h5 class="logs-h5 mb-16" style="font-weight: 500;">更新日志</h5>
|
||||
<h5 class="logs-h5 mb-16" style="font-weight: 500">
|
||||
更新日志
|
||||
</h5>
|
||||
<ul class="logs-l-ul logs-l-1920" id="help-l-ul"></ul>
|
||||
</div>
|
||||
<div class="logs-r">
|
||||
<h1 class="txt-6003645 logs-h1 mb-36">DooTask更新日志</h1>
|
||||
<h1 class="txt-6003645 logs-h1 mb-36">
|
||||
DooTask更新日志
|
||||
</h1>
|
||||
<ul class="logs-r-ul"></ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -217,10 +227,10 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">帮助团队有效地推进项目，使工作更轻松。</i>
|
||||
@ -229,7 +239,9 @@
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">链接</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
链接
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/product.html">产品</a>
|
||||
</li>
|
||||
@ -246,7 +258,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">支持</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
支持
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -257,13 +271,16 @@
|
||||
<a class="txt-4001624 txt" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ul class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">社区</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
社区
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -274,7 +291,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ 群</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618" />
|
||||
<i class="group_num">群号：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -289,7 +306,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -302,323 +322,378 @@
|
||||
<script src="//cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
|
||||
<script src="//cdn.bootcdn.net/ajax/libs/axios/1.3.6/axios.js"></script>
|
||||
<script>
|
||||
const getItem = (key)=> {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
}
|
||||
function getUpdatesFromHtml(html,li) {
|
||||
html.map(item=>{
|
||||
const liItem = document.createElement('li');
|
||||
liItem.className = 'txt-4001624 r-ol-item mb-12 pl-26';
|
||||
liItem.innerHTML = `
|
||||
const getItem = (key) => {
|
||||
var record = JSON.parse(localStorage.getItem(key));
|
||||
if (!record) return null;
|
||||
if (new Date().getTime() > record.expired) {
|
||||
localStorage.removeItem(key);
|
||||
return null;
|
||||
}
|
||||
return record.value;
|
||||
};
|
||||
function getUpdatesFromHtml(html, li) {
|
||||
html.map((item) => {
|
||||
const liItem = document.createElement("li");
|
||||
liItem.className = "txt-4001624 r-ol-item mb-12 pl-26";
|
||||
liItem.innerHTML = `
|
||||
<i class="dots"></i>${item};
|
||||
`;
|
||||
const ol = li.querySelector('.logs-r-ol')
|
||||
ol.appendChild(liItem)
|
||||
})
|
||||
}
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
const closeLogsDraweHandle = ()=>{
|
||||
logsDrawer.classList.remove('open-logs-drawer');
|
||||
}
|
||||
const domHandle = (html)=>{
|
||||
const changelog = document.querySelector('.logs-r-ul');
|
||||
const rlog = document.querySelector('.logs-l-1920');
|
||||
const rlog2 = document.querySelector('.logs-l-768');
|
||||
const versions = html.match(/<h2>(.*?)<\/h2>/g).slice(0,15);
|
||||
const versionsNumbers = versions.map(str => str.split('<h2>[')[1].split(']</h2>')[0]);
|
||||
for (let i = 0; i < versionsNumbers.length; i++) {
|
||||
const updatesHtml = html.split(versionsNumbers[i])[1].split('<h2>')[0].match(/<li>(.*?)<\/li>/g);
|
||||
const updatesHtmlText = updatesHtml.map(str => str.split('<li>')[1].split('</li>')[0]);
|
||||
const rLi = document.createElement('li');
|
||||
rLi.className = `l-ul-item ${i==0?'active':''}`;
|
||||
rLi.setAttribute('data-id',`section-${i+1}`)
|
||||
rLi.innerHTML = `
|
||||
const ol = li.querySelector(".logs-r-ol");
|
||||
ol.appendChild(liItem);
|
||||
});
|
||||
}
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
const closeLogsDraweHandle = () => {
|
||||
logsDrawer.classList.remove("open-logs-drawer");
|
||||
};
|
||||
const domHandle = (html) => {
|
||||
const changelog = document.querySelector(".logs-r-ul");
|
||||
const rlog = document.querySelector(".logs-l-1920");
|
||||
const rlog2 = document.querySelector(".logs-l-768");
|
||||
const versions = html.match(/<h2>(.*?)<\/h2>/g).slice(0, 15);
|
||||
const versionsNumbers = versions.map(
|
||||
(str) => str.split("<h2>[")[1].split("]</h2>")[0]
|
||||
);
|
||||
for (let i = 0; i < versionsNumbers.length; i++) {
|
||||
const updatesHtml = html
|
||||
.split(versionsNumbers[i])[1]
|
||||
.split("<h2>")[0]
|
||||
.match(/<li>(.*?)<\/li>/g);
|
||||
const updatesHtmlText = updatesHtml.map(
|
||||
(str) => str.split("<li>")[1].split("</li>")[0]
|
||||
);
|
||||
const rLi = document.createElement("li");
|
||||
rLi.className = `l-ul-item ${i == 0 ? "active" : ""}`;
|
||||
rLi.setAttribute("data-id", `section-${i + 1}`);
|
||||
rLi.innerHTML = `
|
||||
<a class="txt-4001620 txt log-a">v${versionsNumbers[i]} 更新</a>
|
||||
`;
|
||||
const rLi2 = document.createElement('li');
|
||||
rLi2.className = `l-ul-item`;
|
||||
rLi2.setAttribute('data-id',`section-${i+1}`)
|
||||
rLi2.addEventListener('click', function() {
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
logsDrawer.classList.remove('open-logs-drawer');
|
||||
});
|
||||
rLi2.innerHTML = `
|
||||
const rLi2 = document.createElement("li");
|
||||
rLi2.className = `l-ul-item`;
|
||||
rLi2.setAttribute("data-id", `section-${i + 1}`);
|
||||
rLi2.addEventListener("click", function () {
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
logsDrawer.classList.remove("open-logs-drawer");
|
||||
});
|
||||
rLi2.innerHTML = `
|
||||
<a class="txt-4001620 txt">v${versionsNumbers[i]} 更新</a>
|
||||
`;
|
||||
rlog.appendChild(rLi);
|
||||
rlog2.appendChild(rLi2);
|
||||
const li = document.createElement('li');
|
||||
li.className = 'r-ul-item mb-36';
|
||||
li.innerHTML = `
|
||||
rlog.appendChild(rLi);
|
||||
rlog2.appendChild(rLi2);
|
||||
const li = document.createElement("li");
|
||||
li.className = "r-ul-item mb-36";
|
||||
li.innerHTML = `
|
||||
<ol class="logs-r-ol">
|
||||
<li class="txt-4001624 r-ol-item mb-24" id="section-${i+1}"><h4 class="logs-h4">v${versionsNumbers[i]} 更新</h4></li>
|
||||
<li class="txt-4001624 r-ol-item mb-24" id="section-${i + 1
|
||||
}"><h4 class="logs-h4">v${versionsNumbers[i]} 更新</h4></li>
|
||||
</ol>
|
||||
`
|
||||
changelog.appendChild(li);
|
||||
getUpdatesFromHtml(updatesHtmlText,li)
|
||||
}
|
||||
let updateLogNum = localStorage.getItem('update_log_num')
|
||||
/* logs点击激活函数 */
|
||||
let isThrottled = false;
|
||||
let timerId;
|
||||
const logs_tabs = document.querySelector('.logs-l-1920');
|
||||
const logs_tabItems = logs_tabs.querySelectorAll('.l-ul-item');
|
||||
const contentContainer = document.querySelector('.logs-r');
|
||||
const contentContainer_Items = contentContainer.querySelectorAll('.r-ul-item');
|
||||
const sections = Array.from(document.querySelectorAll('h4'));
|
||||
logs_tabs.addEventListener('click', function (event) {
|
||||
const clickedItem = event.target.closest('.l-ul-item');
|
||||
clearTimeout(timerId);
|
||||
if (clickedItem && !clickedItem.classList.contains('active')) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle('active', value === clickedItem);
|
||||
}
|
||||
`;
|
||||
changelog.appendChild(li);
|
||||
getUpdatesFromHtml(updatesHtmlText, li);
|
||||
}
|
||||
});
|
||||
const handleScroll = ()=> {
|
||||
if (!isThrottled) {
|
||||
isThrottled = true;
|
||||
// 在下一个滴答钟时重置isThrottled标志位
|
||||
timerId = setTimeout(() => {
|
||||
isThrottled = false;
|
||||
}, 0);
|
||||
// 处理滚动事件
|
||||
const currentScrollPosition = contentContainer.scrollTop;
|
||||
// 获取当前滚动位置并遍历所有标题元素
|
||||
sections.map((item,index)=>{
|
||||
const section = sections[index];
|
||||
if(section.offsetParent.offsetTop <= currentScrollPosition){
|
||||
// 将对应的菜单项设置为激活状态
|
||||
const activeMenuItem = logs_tabItems[index];
|
||||
if (activeMenuItem) {
|
||||
Array.from(logs_tabItems).forEach(titem => titem.classList.remove('active'));
|
||||
activeMenuItem.classList.add('active');
|
||||
}
|
||||
let updateLogNum = localStorage.getItem("update_log_num");
|
||||
/* logs点击激活函数 */
|
||||
let isThrottled = false;
|
||||
let timerId;
|
||||
const logs_tabs = document.querySelector(".logs-l-1920");
|
||||
const logs_tabItems = logs_tabs.querySelectorAll(".l-ul-item");
|
||||
const contentContainer = document.querySelector(".logs-r");
|
||||
const contentContainer_Items =
|
||||
contentContainer.querySelectorAll(".r-ul-item");
|
||||
const sections = Array.from(document.querySelectorAll("h4"));
|
||||
logs_tabs.addEventListener("click", function (event) {
|
||||
const clickedItem = event.target.closest(".l-ul-item");
|
||||
clearTimeout(timerId);
|
||||
if (clickedItem && !clickedItem.classList.contains("active")) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle("active", value === clickedItem);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
contentContainer.addEventListener('scroll', handleScroll);
|
||||
/* 当屏幕宽度低于768px时显示logs的抽屉的相关操作逻辑 */
|
||||
const logsMenuBtn = document.getElementById('menuBtn-logs');
|
||||
const logsDrawer = document.querySelector('.logs-drawer');
|
||||
logsMenuBtn.addEventListener('click', () => {
|
||||
logsDrawer.classList.add('open-logs-drawer');
|
||||
});
|
||||
/* 从下载页跳转过来执行的函数 */
|
||||
const handleMou = ()=>{
|
||||
const clickedItem = logs_tabItems[updateLogNum-1];
|
||||
if (clickedItem && !clickedItem.classList.contains('active')) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle('active', value === clickedItem);
|
||||
}
|
||||
}
|
||||
window.history.scrollRestoration = 'manual';
|
||||
const topSection = changelog.querySelector(`#section-${updateLogNum}`)
|
||||
if (topSection) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition = topSection.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition-offset,
|
||||
});
|
||||
const handleScroll = () => {
|
||||
if (!isThrottled) {
|
||||
isThrottled = true;
|
||||
// 在下一个滴答钟时重置isThrottled标志位
|
||||
timerId = setTimeout(() => {
|
||||
isThrottled = false;
|
||||
}, 0);
|
||||
// 处理滚动事件
|
||||
const currentScrollPosition = contentContainer.scrollTop;
|
||||
// 获取当前滚动位置并遍历所有标题元素
|
||||
sections.map((item, index) => {
|
||||
const section = sections[index];
|
||||
if (
|
||||
section.offsetParent.offsetTop <=
|
||||
currentScrollPosition
|
||||
) {
|
||||
// 将对应的菜单项设置为激活状态
|
||||
const activeMenuItem = logs_tabItems[index];
|
||||
if (activeMenuItem) {
|
||||
Array.from(logs_tabItems).forEach((titem) =>
|
||||
titem.classList.remove("active")
|
||||
);
|
||||
activeMenuItem.classList.add("active");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
contentContainer.addEventListener("scroll", handleScroll);
|
||||
/* 当屏幕宽度低于768px时显示logs的抽屉的相关操作逻辑 */
|
||||
const logsMenuBtn = document.getElementById("menuBtn-logs");
|
||||
const logsDrawer = document.querySelector(".logs-drawer");
|
||||
logsMenuBtn.addEventListener("click", () => {
|
||||
logsDrawer.classList.add("open-logs-drawer");
|
||||
});
|
||||
/* 从下载页跳转过来执行的函数 */
|
||||
const handleMou = () => {
|
||||
const clickedItem = logs_tabItems[updateLogNum - 1];
|
||||
if (clickedItem && !clickedItem.classList.contains("active")) {
|
||||
// 切换激活状态
|
||||
for (let value of logs_tabItems) {
|
||||
value.classList.toggle("active", value === clickedItem);
|
||||
}
|
||||
}
|
||||
window.history.scrollRestoration = "manual";
|
||||
const topSection = changelog.querySelector(
|
||||
`#section-${updateLogNum}`
|
||||
);
|
||||
if (topSection) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition =
|
||||
topSection.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition - offset,
|
||||
});
|
||||
}
|
||||
};
|
||||
handleMou();
|
||||
localStorage.removeItem("update_log_num");
|
||||
};
|
||||
const logs = getItem("logs");
|
||||
if (!logs) {
|
||||
const url = "../../api/system/get/updatelog";
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => {
|
||||
const changelog = res.data.data.updateLog;
|
||||
const md = new markdownit();
|
||||
const html = md.render(changelog);
|
||||
let record = {
|
||||
value: html,
|
||||
expired: new Date().getTime() + 30 * 60 * 1000,
|
||||
};
|
||||
localStorage.setItem("logs", JSON.stringify(record));
|
||||
domHandle(html);
|
||||
logsHandler();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err, "err");
|
||||
});
|
||||
} else {
|
||||
domHandle(logs);
|
||||
logsHandler();
|
||||
}
|
||||
let tabItems1 = document.querySelectorAll(".l-ul-item");
|
||||
function rm() {
|
||||
tabItems1.forEach((link1) => {
|
||||
link1.classList.remove("active");
|
||||
});
|
||||
}
|
||||
function logsHandler() {
|
||||
let tabItems = document.querySelectorAll(".l-ul-item");
|
||||
function rm() {
|
||||
tabItems.forEach((link1) => {
|
||||
link1.classList.remove("active");
|
||||
});
|
||||
}
|
||||
}
|
||||
handleMou()
|
||||
localStorage.removeItem('update_log_num')
|
||||
}
|
||||
const logs = getItem('logs')
|
||||
if(!logs) {
|
||||
const url = "../../api/system/get/updatelog"
|
||||
axios.get(url).then(res=>{
|
||||
const changelog=res.data.data.updateLog
|
||||
const md = new markdownit();
|
||||
const html = md.render(changelog);
|
||||
let record = {value: html, expired: new Date().getTime() + 30 * 60 * 1000};
|
||||
localStorage.setItem('logs',JSON.stringify(record))
|
||||
domHandle(html)
|
||||
logsHandler()
|
||||
}).catch(err=>{
|
||||
console.log(err,"err");
|
||||
})
|
||||
}else{
|
||||
domHandle(logs)
|
||||
logsHandler()
|
||||
}
|
||||
let tabItems1 = document.querySelectorAll('.l-ul-item');
|
||||
function rm(){
|
||||
tabItems1.forEach(link1=>{
|
||||
link1.classList.remove('active')
|
||||
})
|
||||
}
|
||||
function logsHandler(){
|
||||
let tabItems = document.querySelectorAll('.l-ul-item');
|
||||
function rm(){
|
||||
tabItems.forEach(link1=>{
|
||||
link1.classList.remove('active')
|
||||
})
|
||||
}
|
||||
tabItems.forEach(item=>{
|
||||
item.addEventListener('click',function(event){
|
||||
event.preventDefault()
|
||||
const id = event.currentTarget.getAttribute('data-id')
|
||||
const content = document.getElementById(`${id}`)
|
||||
if (content) {
|
||||
tabItems.forEach((item) => {
|
||||
item.addEventListener("click", function (event) {
|
||||
event.preventDefault();
|
||||
const id = event.currentTarget.getAttribute("data-id");
|
||||
const content = document.getElementById(`${id}`);
|
||||
if (content) {
|
||||
const offset = 90; // 上偏移量（可以根据需要进行调整）
|
||||
const targetPosition = content.getBoundingClientRect().top + window.scrollY; // 目标位置相对于视口的位置
|
||||
const targetPosition =
|
||||
content.getBoundingClientRect().top +
|
||||
window.scrollY; // 目标位置相对于视口的位置
|
||||
// 滚动到目标位置，并考虑上偏移量
|
||||
window.scrollTo({
|
||||
top: targetPosition-offset,
|
||||
behavior: "smooth"
|
||||
top: targetPosition - offset,
|
||||
behavior: "smooth",
|
||||
});
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
function getAllDataIds(parentId) {
|
||||
});
|
||||
});
|
||||
}
|
||||
function getAllDataIds(parentId) {
|
||||
let parentElement = document.getElementById(parentId);
|
||||
if (parentElement) {
|
||||
let elementsWithDataId = parentElement.querySelectorAll("[data-id]");
|
||||
let dataIds = [];
|
||||
for (let i = 0; i < elementsWithDataId.length; i++) {
|
||||
let dataId = elementsWithDataId[i].getAttribute("data-id");
|
||||
dataIds.push(dataId);
|
||||
}
|
||||
return dataIds;
|
||||
let elementsWithDataId =
|
||||
parentElement.querySelectorAll("[data-id]");
|
||||
let dataIds = [];
|
||||
for (let i = 0; i < elementsWithDataId.length; i++) {
|
||||
let dataId = elementsWithDataId[i].getAttribute("data-id");
|
||||
dataIds.push(dataId);
|
||||
}
|
||||
return dataIds;
|
||||
}
|
||||
return [];
|
||||
}
|
||||
let allDataIds = getAllDataIds("help-l-ul");
|
||||
let arrOffsetTop = []
|
||||
allDataIds.map(item=>{
|
||||
}
|
||||
let allDataIds = getAllDataIds("help-l-ul");
|
||||
let arrOffsetTop = [];
|
||||
allDataIds.map((item) => {
|
||||
let id = document.getElementById(`${item}`);
|
||||
arrOffsetTop.push(id.offsetTop)
|
||||
})
|
||||
// 监听页面滚动事件
|
||||
window.addEventListener('scroll',scrollHandler)
|
||||
function scrollHandler(){
|
||||
arrOffsetTop.push(id.offsetTop);
|
||||
});
|
||||
// 监听页面滚动事件
|
||||
window.addEventListener("scroll", scrollHandler);
|
||||
function scrollHandler() {
|
||||
for (let i = 0; i < arrOffsetTop.length; i++) {
|
||||
if(window.scrollY<=arrOffsetTop[0]){
|
||||
rm()
|
||||
let elementsWithDataId = document.querySelectorAll("[data-id='" + `section-${1}` + "']");
|
||||
if (window.scrollY <= arrOffsetTop[0]) {
|
||||
rm();
|
||||
let elementsWithDataId = document.querySelectorAll(
|
||||
"[data-id='" + `section-${1}` + "']"
|
||||
);
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
return;
|
||||
}
|
||||
if (arrOffsetTop[i] > window.scrollY || window.scrollY<=arrOffsetTop[0]){
|
||||
rm()
|
||||
let elementsWithDataId = document.querySelectorAll("[data-id='" + `section-${i}` + "']");
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
//滚动设置
|
||||
const liHight = elementsWithDataId[1]?.offsetTop - 20;
|
||||
const pHihtt = elementsWithDataId[1]?.offsetHeight;
|
||||
const ulElement = document.getElementById('help-l-ul'); // 替换为你的 <div> 元素的 id
|
||||
const scrollHeight = ulElement.scrollTop;
|
||||
const ulHeight = ulElement.offsetHeight;
|
||||
if (liHight > scrollHeight + ulHeight) {
|
||||
ulElement.scrollTop += (pHihtt + pHihtt);
|
||||
}
|
||||
if ((liHight - scrollHeight) <= 40) {
|
||||
ulElement.scrollTop -= (pHihtt );
|
||||
}
|
||||
return;
|
||||
if (
|
||||
arrOffsetTop[i] > window.scrollY ||
|
||||
window.scrollY <= arrOffsetTop[0]
|
||||
) {
|
||||
rm();
|
||||
let elementsWithDataId = document.querySelectorAll(
|
||||
"[data-id='" + `section-${i}` + "']"
|
||||
);
|
||||
elementsWithDataId[1]?.classList?.add("active");
|
||||
//滚动设置
|
||||
const liHight = elementsWithDataId[1]?.offsetTop - 20;
|
||||
const pHihtt = elementsWithDataId[1]?.offsetHeight;
|
||||
const ulElement = document.getElementById("help-l-ul"); // 替换为你的 <div> 元素的 id
|
||||
const scrollHeight = ulElement.scrollTop;
|
||||
const ulHeight = ulElement.offsetHeight;
|
||||
if (liHight > scrollHeight + ulHeight) {
|
||||
ulElement.scrollTop += pHihtt + pHihtt;
|
||||
}
|
||||
if (liHight - scrollHeight <= 40) {
|
||||
ulElement.scrollTop -= pHihtt;
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta charset="UTF-8" />
|
||||
<title>解决方案 - DooTask</title>
|
||||
<meta name="google" value="notranslate">
|
||||
<meta name="description" content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。">
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="../img/favicon.ico">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css">
|
||||
<link rel="stylesheet" href="../css/solution.css">
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<meta name="google" value="notranslate" />
|
||||
<meta name="description"
|
||||
content="DooTask是一款轻量级的开源在线项目任务管理工具，提供各类文档协作工具、在线思维导图、在线流程图、项目管理、任务分发、即时IM，文件管理等工具。助力团队高效推进项目，让工作更简单。" />
|
||||
<meta name="keywords" content="中国 DooTask 开源在线项目 任务管理工具 任务管理 轻量级 海豚有海 团队协作" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="../img/favicon.ico" />
|
||||
<link rel="stylesheet" href="../css/common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../css/rem.css" />
|
||||
<link rel="stylesheet" href="../css/solution.css" />
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-16660800396"></script>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PE77P6491J"></script>
|
||||
<script src="../js/googleAds.js"></script>
|
||||
<script src="../js/googleAnalyze.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="layout">
|
||||
<!-- 页头区域 -->
|
||||
@ -24,7 +27,7 @@
|
||||
<div class="nav">
|
||||
<div class="nav-layout">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<ul class="nav-ul">
|
||||
@ -37,7 +40,7 @@
|
||||
<li class="nav-ul-item">
|
||||
<i class="txt-4001620 txt nav-support" id="support-txt" onclick="showMenuPopHandle()">
|
||||
支持
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg">
|
||||
<img src="../img/vector.svg" alt="支持" class="nav-vector" id="drop-down-svg" />
|
||||
</i>
|
||||
<ol class="submenu-pop" id="submenu-pop">
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
@ -50,7 +53,8 @@
|
||||
<a class="txt-4001418 txt-sub" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="submenu-pop-item" onclick="changeMenu()">
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001418 txt-sub" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
@ -63,50 +67,56 @@
|
||||
</ul>
|
||||
<div class="nav-r">
|
||||
<div class="lang" id="lang-img">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()">
|
||||
<img src="../img/lang-select.svg" alt="语言切换" onclick="shouLangPopHandle()" />
|
||||
<ul class="lang-pop" id="lang-pop">
|
||||
<li class="lang-pop-item" onclick="changeLanguage('zh')">
|
||||
<i class="lang-txt">简体中文</i>
|
||||
</li>
|
||||
<li class="lang-pop-item" onclick="changeLanguage('en')">
|
||||
<i class="lang-txt" >English</i>
|
||||
<i class="lang-txt">English</i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<i class="nav-r-icon theme_dark" onclick="setTheme('light')">
|
||||
<img src="../img/light.svg" alt="明亮主题">
|
||||
<img src="../img/light.svg" alt="明亮主题" />
|
||||
</i>
|
||||
<i class="nav-r-icon theme_light" onclick="setTheme('dark')">
|
||||
<img src="../img/drak.svg" alt="暗黑主题">
|
||||
<img src="../img/drak.svg" alt="暗黑主题" />
|
||||
</i>
|
||||
<a href="https://github.com/kuaifan/dootask" target="_blank">
|
||||
<i class="nav-r-icon">
|
||||
<img src="../img/github.svg" alt="github">
|
||||
<img src="../img/github.svg" alt="github" />
|
||||
</i>
|
||||
</a>
|
||||
<i class="line-1"></i>
|
||||
<span class="get-started">
|
||||
<a href="../../manage/dashboard">
|
||||
<button class="btn btn-primary" >立即体验</button>
|
||||
<button class="btn btn-primary">
|
||||
立即体验
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="menuBtn">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单">
|
||||
<img id="menuBtn" src="../img/menu.svg" alt="菜单" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="topics">
|
||||
<div class="topics-con">
|
||||
<div class="topics-layout">
|
||||
<div class="topics-tit mb-32" style="width: auto !important;">
|
||||
<div class="topics-tit mb-32" style="width: auto !important">
|
||||
<span class="txt-6007290 topics-h1">帮助您更好地进行协作</span>
|
||||
</div>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32" style="width: auto !important;">DooTask提供了一系列基于不同场景的解决方案，以便您可以快速开始与您的团队或部门合作</h4>
|
||||
<h4 class="txt-4001830 topics-h4 mb-32" style="width: auto !important">
|
||||
DooTask提供了一系列基于不同场景的解决方案，以便您可以快速开始与您的团队或部门合作
|
||||
</h4>
|
||||
<div class="flex-cc topics-btn">
|
||||
<span class="mr-24 get-started">
|
||||
<a href="./price.html">
|
||||
<button class="btn btn-primary mr-20">开始使用</button>
|
||||
<button class="btn btn-primary mr-20">
|
||||
开始使用
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
@ -118,7 +128,7 @@
|
||||
<div class="drawer">
|
||||
<div class="drawer-t mb-36">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTaskLogo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="close-drawer" onclick="closeDraweHandle()">✕</i>
|
||||
@ -134,10 +144,10 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('support')">
|
||||
<i class="txt-4001620 txt">
|
||||
支持
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg">
|
||||
<img src="../img/vector.svg" class="nav-vector" alt="支持" id="drawer-down-support-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="support" style="display: none;">
|
||||
<ol class="drawer-active" id="support" style="display: none">
|
||||
<li class="drawer-item" onclick="changeMenu()">
|
||||
<a class="txt-4001620 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -162,28 +172,28 @@
|
||||
<div class="drawer-item" onclick="expandMenuHandle('theme')">
|
||||
<i class="txt-4001620 txt">
|
||||
主题
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg">
|
||||
<img src="../img/vector.svg" alt="主题" class="nav-vector" id="drawer-down-theme-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="theme" style="display: none;">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<ol class="drawer-active" id="theme" style="display: none">
|
||||
<li class="drawer-item" onclick="setTheme('light')">
|
||||
<i class="txt-4001620 txt">Light</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<li class="drawer-item" onclick="setTheme('dark')">
|
||||
<i class="txt-4001620 txt">Dark</i>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="drawer-item" onclick="expandMenuHandle('language')">
|
||||
<i class="txt-4001620 txt">
|
||||
语言
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg">
|
||||
<img src="../img/vector.svg" alt="语言" class="nav-vector" id="drawer-down-language-svg" />
|
||||
</i>
|
||||
</div>
|
||||
<ol class="drawer-active" id="language" style="display: none;">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<ol class="drawer-active" id="language" style="display: none">
|
||||
<li class="drawer-item" onclick="changeLanguage('zh')">
|
||||
<i class="txt-4001620 txt">简体中文</i>
|
||||
</li>
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<li class="drawer-item" onclick="changeLanguage('en')">
|
||||
<i class="txt-4001620 txt">English</i>
|
||||
</li>
|
||||
</ol>
|
||||
@ -203,39 +213,59 @@
|
||||
<div class="bg-style">
|
||||
<div class="app-con">
|
||||
<div class="app-tit">
|
||||
<h1 class="txt-5004455 app-h1 mb-16">场景应用</h1>
|
||||
<div style="text-align: center;">
|
||||
<h6 class="txt-4001830 app-h5" style="width: 600px;">该产品支持各种应用场景，帮助团队协作</h6>
|
||||
<h1 class="txt-5004455 app-h1 mb-16">
|
||||
场景应用
|
||||
</h1>
|
||||
<div style="text-align: center">
|
||||
<h6 class="txt-4001830 app-h5" style="width: 600px">
|
||||
该产品支持各种应用场景，帮助团队协作
|
||||
</h6>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="app-ul mt-80">
|
||||
<li class="app-ul-item mb-48">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic1" src="../img/light/zh_solution_pic1.png" alt="项目管理">
|
||||
<img class="app-bg" id="solution_pic1" src="../img/light/zh_solution_pic1.png" alt="项目管理" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">项目管理</h4>
|
||||
<h6 class="txt-4001624 app-h6">支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
项目管理
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item mb-48">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic2" src="../img/light/zh_solution_pic2.png" alt="团队协作">
|
||||
<img class="app-bg" id="solution_pic2" src="../img/light/zh_solution_pic2.png" alt="团队协作" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">团队协作</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
团队协作
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic3" src="../img/light/zh_solution_pic3.png" alt="数据安全保护">
|
||||
<img class="app-bg" id="solution_pic3" src="../img/light/zh_solution_pic3.png" alt="数据安全保护" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">数据安全保护</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask在消息功能上使用非对称加密技术，确保用户的信息得到最大程度的保护。此外，它还提供了强大的权限管理系统，能够根据不同用户的角色和职责，灵活地设置他们在项目管理中的权限和操作范围。</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
数据安全保护
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask在消息功能上使用非对称加密技术，确保用户的信息得到最大程度的保护。此外，它还提供了强大的权限管理系统，能够根据不同用户的角色和职责，灵活地设置他们在项目管理中的权限和操作范围。
|
||||
</h6>
|
||||
</li>
|
||||
<li class="app-ul-item">
|
||||
<div class="app-bg-box">
|
||||
<img class="app-bg" id="solution_pic4" src="../img/light/solution_pic4.png" alt="自由定制">
|
||||
<img class="app-bg" id="solution_pic4" src="../img/light/solution_pic4.png" alt="自由定制" />
|
||||
</div>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">自由定制</h4>
|
||||
<h6 class="txt-4001624 app-h6">DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。</h6>
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
自由定制
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -245,22 +275,33 @@
|
||||
<div class="team-con">
|
||||
<h1 class="txt-5004455 team-tit">团队运营</h1>
|
||||
<ul class="team-ul mt-80">
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon1.svg" alt="公司管理">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">公司管理</h4>
|
||||
<h6 class="txt-4001624 app-h6">帮助企业对其公司目标，将目标、关键结果与个人工作连接，共同推动战略落地、目标达成；通过协同创作，共享企业各项工作的进度、完成状态、日程安排，促进信息流动，让全员获取项目关键信息，及时跟进，推动跨部门协作。</h6>
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon1.svg" alt="公司管理" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
公司管理
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
帮助企业对其公司目标，将目标、关键结果与个人工作连接，共同推动战略落地、目标达成；通过协同创作，共享企业各项工作的进度、完成状态、日程安排，促进信息流动，让全员获取项目关键信息，及时跟进，推动跨部门协作。
|
||||
</h6>
|
||||
</li>
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0.1s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon2.svg" alt="产品管理">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">产品管理</h4>
|
||||
<h6 class="txt-4001624 app-h6">自定义产品研发过程的工作流程，在不同阶段把任务分派不同角色，推动产品研发进程；
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0.1s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon2.svg" alt="产品管理" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
产品管理
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
自定义产品研发过程的工作流程，在不同阶段把任务分派不同角色，推动产品研发进程；
|
||||
各完成项目及任务历史资料统一归档，方便随时调用或展开讨论，形成知识沉淀到复用的闭环。
|
||||
</h6>
|
||||
</h6>
|
||||
</li>
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0.2s;">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon3.svg" alt="人事行政">
|
||||
<h4 class="txt-5002025 app-h4 mb-16">人事行政</h4>
|
||||
<h6 class="txt-4001624 app-h6">通过数据可视化统计报表获取多维度企业数据，全面了解员工表现，让绩效评价更客观、公正；使用公告发布通知，安排公司活动，传递企业决策，便于塑造企业文化，让员工更有参与感。</h6>
|
||||
<li class="team-ul-item team-ul-item-zh solutions-animate-box" style="--delay: 0.2s">
|
||||
<img class="team-icon mb-24" src="../img/solution_icon3.svg" alt="人事行政" />
|
||||
<h4 class="txt-5002025 app-h4 mb-16">
|
||||
人事行政
|
||||
</h4>
|
||||
<h6 class="txt-4001624 app-h6">
|
||||
通过数据可视化统计报表获取多维度企业数据，全面了解员工表现，让绩效评价更客观、公正；使用公告发布通知，安排公司活动，传递企业决策，便于塑造企业文化，让员工更有参与感。
|
||||
</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -270,10 +311,10 @@
|
||||
<!-- 页脚区域 -->
|
||||
<footer>
|
||||
<div class="footer-con">
|
||||
<div class="footer-layut">
|
||||
<div class="footer-layout">
|
||||
<div class="footer-l">
|
||||
<a href="../zh/index.html" class="logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo">
|
||||
<img id="logo" src="../img/light/logo.svg" alt="DooTask,Logo" />
|
||||
<i class="dootask txt-7002027">DooTask</i>
|
||||
</a>
|
||||
<i class="txt txt-4001624">帮助团队有效地推进项目，使工作更轻松。</i>
|
||||
@ -282,7 +323,9 @@
|
||||
<ul class="footer-r-ul">
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">链接</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
链接
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/product.html">产品</a>
|
||||
</li>
|
||||
@ -299,7 +342,9 @@
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">支持</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
支持
|
||||
</li>
|
||||
<li class="footer-ol-item mb-16">
|
||||
<a class="txt-4001624 txt" href="../zh/download.html">下载中心</a>
|
||||
</li>
|
||||
@ -310,13 +355,16 @@
|
||||
<a class="txt-4001624 txt" href="../zh/privacy.html" target="_blank">隐私政策</a>
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API 文档</a>
|
||||
<a class="txt-4001624 txt" href="../../docs/index.html" target="_blank">API
|
||||
文档</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class="footer-r-item">
|
||||
<ol class="footer-r-ol">
|
||||
<li class="footer-ol-item txt-5001624 mb-24">社区</li>
|
||||
<li class="footer-ol-item txt-5001624 mb-24">
|
||||
社区
|
||||
</li>
|
||||
<li class="footer-ol-item">
|
||||
<div class="footer-ol-item mb-16">
|
||||
<i class="txt-4001624 txt" onclick="openInNewTab('https://github.com/kuaifan/dootask')">Github</i>
|
||||
@ -327,7 +375,7 @@
|
||||
<div class="footer-ol-item" id="qq_group">
|
||||
<i class="txt-4001624 txt">QQ 群</i>
|
||||
<div class="group_code">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618">
|
||||
<img class="code-svg" id="home_code" src="../img/qq_code.jpg" alt="群号：546574618" />
|
||||
<i class="group_num">群号：546574618</i>
|
||||
<i class="lower_triangle"></i>
|
||||
</div>
|
||||
@ -342,7 +390,10 @@
|
||||
<span>
|
||||
Copyright © 2022-2023 DooTask. All rights reserved.
|
||||
</span>
|
||||
<div class="footer_beian" style="display: flex;"><img src="../img/beian.png" alt=""><span style="padding-left: 3px;">桂公网安备 45010802000393号</span></div>
|
||||
<div class="footer_beian" style="display: flex">
|
||||
<img src="../img/beian.png" alt="" /><span style="padding-left: 3px">桂公网安备
|
||||
45010802000393号</span>
|
||||
</div>
|
||||
<a class="footer_beian_a" href="http://beian.miit.gov.cn">桂ICP备2021003642号-5</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -354,110 +405,132 @@
|
||||
<script src="../js/common.js"></script>
|
||||
<script>
|
||||
/* 滑动到可视区域执行动画 */
|
||||
const boxes = document.querySelectorAll('.solutions-animate-box');
|
||||
let timerId = null
|
||||
const animateBoxes = ()=> {
|
||||
boxes.forEach(box => {
|
||||
const boxes = document.querySelectorAll(".solutions-animate-box");
|
||||
let timerId = null;
|
||||
const animateBoxes = () => {
|
||||
boxes.forEach((box) => {
|
||||
const boxTop = box.getBoundingClientRect().top;
|
||||
const boxBottom = box.getBoundingClientRect().bottom;
|
||||
if (boxTop < window.innerHeight && boxBottom > 0) {
|
||||
box.classList.add('animate');
|
||||
timerId = setTimeout(()=>{
|
||||
box.classList.remove('solutions-animate-box');
|
||||
timerId = null
|
||||
},1200)
|
||||
box.classList.add("animate");
|
||||
timerId = setTimeout(() => {
|
||||
box.classList.remove("solutions-animate-box");
|
||||
timerId = null;
|
||||
}, 1200);
|
||||
}
|
||||
});
|
||||
}
|
||||
window.addEventListener('scroll', animateBoxes);
|
||||
};
|
||||
window.addEventListener("scroll", animateBoxes);
|
||||
animateBoxes();
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
fetch('./sideNav.html')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
document.getElementById('nav_wrap').innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button = document.getElementById('back_to_top');
|
||||
window.addEventListener('scroll', () => {
|
||||
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block';
|
||||
} else {
|
||||
back_top_button.style.display = 'none';
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener('click', () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = 'block'; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById("side_toolbar_item_phone");
|
||||
let tooltipPhone = document.getElementById("toolbar_tooltip_phone");
|
||||
let toolbarWhtasapp = document.getElementById("side_toolbar_item_whtasapp");
|
||||
let tooltipWhtasapp = document.getElementById("toolbar_tooltip_whtasapp");
|
||||
let toolbarQrcode = document.getElementById("side_toolbar_item_qrcode");
|
||||
let tooltipQrcode = document.getElementById("toolbar_tooltip_qrcode");
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if(toolbarPhone){
|
||||
toolbarPhone.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_phone'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone)
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
|
||||
window.location.href = 'tel:0771-3164099';
|
||||
}
|
||||
});
|
||||
}
|
||||
if(toolbarWhtasapp){
|
||||
toolbarWhtasapp.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_Whtasapp'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if(toolbarQrcode){
|
||||
toolbarQrcode.addEventListener("click", ()=>{
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if(gtag){
|
||||
gtag('event', 'click', {
|
||||
'event_category': 'button',
|
||||
'event_label': 'right_side_toolbar_WeChat'
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode)
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
fetch("./sideNav.html")
|
||||
.then((response) => response.text())
|
||||
.then((data) => {
|
||||
document.getElementById("nav_wrap").innerHTML = data;
|
||||
// 回到顶部
|
||||
const back_top_button =
|
||||
document.getElementById("back_to_top");
|
||||
window.addEventListener("scroll", () => {
|
||||
if (
|
||||
document.body.scrollTop > 20 ||
|
||||
document.documentElement.scrollTop > 20
|
||||
) {
|
||||
back_top_button.style.display = "block";
|
||||
} else {
|
||||
back_top_button.style.display = "none";
|
||||
}
|
||||
});
|
||||
back_top_button.addEventListener("click", () => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
// 检查页面加载时的滚动位置以决定是否显示回到顶部按钮
|
||||
if (document.documentElement.scrollTop > 20) {
|
||||
back_top_button.style.display = "block"; // 显示回到顶部按钮
|
||||
}
|
||||
let toolbarPhone = document.getElementById(
|
||||
"side_toolbar_item_phone"
|
||||
);
|
||||
let tooltipPhone = document.getElementById(
|
||||
"toolbar_tooltip_phone"
|
||||
);
|
||||
let toolbarWhtasapp = document.getElementById(
|
||||
"side_toolbar_item_whtasapp"
|
||||
);
|
||||
let tooltipWhtasapp = document.getElementById(
|
||||
"toolbar_tooltip_whtasapp"
|
||||
);
|
||||
let toolbarQrcode = document.getElementById(
|
||||
"side_toolbar_item_qrcode"
|
||||
);
|
||||
let tooltipQrcode = document.getElementById(
|
||||
"toolbar_tooltip_qrcode"
|
||||
);
|
||||
|
||||
function toggleTooltip(dom) {
|
||||
if (dom.style.display === "block") {
|
||||
dom.style.display = "none";
|
||||
} else {
|
||||
dom.style.display = "block";
|
||||
}
|
||||
}
|
||||
if (toolbarPhone) {
|
||||
toolbarPhone.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_phone",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipPhone);
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
if (
|
||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
||||
navigator.userAgent
|
||||
)
|
||||
) {
|
||||
window.location.href = "tel:0771-3164099";
|
||||
}
|
||||
});
|
||||
}
|
||||
if (toolbarWhtasapp) {
|
||||
toolbarWhtasapp.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_Whtasapp",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipWhtasapp);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipQrcode.style.display = "none";
|
||||
});
|
||||
}
|
||||
if (toolbarQrcode) {
|
||||
toolbarQrcode.addEventListener("click", () => {
|
||||
event.stopPropagation();
|
||||
// 谷歌分析事件追踪
|
||||
if (gtag) {
|
||||
gtag("event", "click", {
|
||||
event_category: "button",
|
||||
event_label: "right_side_toolbar_WeChat",
|
||||
});
|
||||
}
|
||||
toggleTooltip(tooltipQrcode);
|
||||
tooltipPhone.style.display = "none";
|
||||
tooltipWhtasapp.style.display = "none";
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
<script src="../js/ad.js"></script>
|
||||
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user