diff --git a/src/assets/css/common.css b/src/assets/css/common.css index b65ea26..e782316 100644 --- a/src/assets/css/common.css +++ b/src/assets/css/common.css @@ -89,7 +89,14 @@ height: 70px; overflow-y: auto; } - +.wrap { + /* 这将防止单词被拆开换行 */ + word-wrap: break-word !important; + /* 这将在单词到达边界时拆开它们进行换行 */ + word-break: break-all; + /* 确保内容不会超出其容器的宽度 */ + overflow-wrap: break-word; +} .footerBottom { padding-bottom: 248px; } diff --git a/src/assets/css/styles.css b/src/assets/css/styles.css index a80bec2..b58215b 100644 --- a/src/assets/css/styles.css +++ b/src/assets/css/styles.css @@ -1390,7 +1390,7 @@ ul.pattern .color8 { } .special .el-tabs__item { - width: 210px; + min-width: 210px; text-align: center; color: #4D5563; font-size: 22px; @@ -1407,7 +1407,6 @@ ul.pattern .color8 { } .special .el-tabs__active-bar { background: #000; - } .special .el-tabs__header { padding: 0 100px 40px; diff --git a/src/assets/icons/greenRight.png b/src/assets/icons/greenRight.png new file mode 100644 index 0000000..859ecef Binary files /dev/null and b/src/assets/icons/greenRight.png differ diff --git a/src/assets/icons/platform/shipt1.png b/src/assets/icons/platform/shipt1.png new file mode 100644 index 0000000..11f9ed7 Binary files /dev/null and b/src/assets/icons/platform/shipt1.png differ diff --git a/src/assets/icons/platform/shipt2.png b/src/assets/icons/platform/shipt2.png new file mode 100644 index 0000000..1c08ef4 Binary files /dev/null and b/src/assets/icons/platform/shipt2.png differ diff --git a/src/assets/images/footer/qrcodeAMZ.png b/src/assets/images/footer/qrcodeAMZ.png new file mode 100644 index 0000000..9bc9af1 Binary files /dev/null and b/src/assets/images/footer/qrcodeAMZ.png differ diff --git a/src/assets/images/footer/qrcodeAMZ_footer.png b/src/assets/images/footer/qrcodeAMZ_footer.png new file mode 100644 index 0000000..551ca7a Binary files /dev/null and b/src/assets/images/footer/qrcodeAMZ_footer.png differ diff --git a/src/assets/images/platform/ShipTrack-1.png b/src/assets/images/platform/ShipTrack-1.png new file mode 100644 index 0000000..81423c1 Binary files /dev/null and b/src/assets/images/platform/ShipTrack-1.png differ diff --git a/src/assets/images/platform/ShipTrack-2.png b/src/assets/images/platform/ShipTrack-2.png new file mode 100644 index 0000000..50286a5 Binary files /dev/null and b/src/assets/images/platform/ShipTrack-2.png differ diff --git a/src/assets/images/platform/ShipTrack-3.png b/src/assets/images/platform/ShipTrack-3.png new file mode 100644 index 0000000..e302d99 Binary files /dev/null and b/src/assets/images/platform/ShipTrack-3.png differ diff --git a/src/assets/images/platform/ShipTrack-4.png b/src/assets/images/platform/ShipTrack-4.png new file mode 100644 index 0000000..55379ab Binary files /dev/null and b/src/assets/images/platform/ShipTrack-4.png differ diff --git a/src/assets/images/platform/ShipTrack-5.png b/src/assets/images/platform/ShipTrack-5.png new file mode 100644 index 0000000..1ae5c1a Binary files /dev/null and b/src/assets/images/platform/ShipTrack-5.png differ diff --git a/src/assets/images/platform/ShipTrack-6.png b/src/assets/images/platform/ShipTrack-6.png new file mode 100644 index 0000000..73e5a83 Binary files /dev/null and b/src/assets/images/platform/ShipTrack-6.png differ diff --git a/src/assets/images/platform/megaphone.png b/src/assets/images/platform/megaphone.png new file mode 100644 index 0000000..0f4b3b3 Binary files /dev/null and b/src/assets/images/platform/megaphone.png differ diff --git a/src/router/index.js b/src/router/index.js index f87b0f7..adaf94d 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -19,6 +19,7 @@ import globalNetwork from "../view/globalNetwork/index.vue"; import platform from "../view/platform/index.vue" import warehouseMap from "../view/platform/tab/warehouseMap.vue" import AMAZON from "../view/platform/tab/AMAZON.vue" +import AMZDetail from "../view/platform/tab/components/AMZDetail.vue" @@ -80,6 +81,11 @@ const routes = [ name: "AMAZON", component: AMAZON }, + { + path: "/AMZDetail", + name: "AMZDetail", + component: AMZDetail + }, { path: "/login", name: "Login page", diff --git a/src/view/home/index.vue b/src/view/home/index.vue index c39775a..327bc75 100644 --- a/src/view/home/index.vue +++ b/src/view/home/index.vue @@ -282,7 +282,8 @@ export default { ceshi(paramObj).then((data) => { console.log(data); }); - + console.log(localStorage.getItem("newsIndex"),'newsIndex'); + this.newIndex = +localStorage.getItem("newsIndex") || 0; }, data() { return { @@ -329,7 +330,9 @@ export default { }, methods: { setNewsActive(item,index) { + console.log(item,index); this.newIndex = index; + localStorage.setItem('newsIndex',index); this.$router.push({ name: 'newsDetail', query:{ diff --git a/src/view/platform/index.css b/src/view/platform/index.css index 0339429..842b378 100644 --- a/src/view/platform/index.css +++ b/src/view/platform/index.css @@ -500,3 +500,100 @@ line-height: 42px; /* 210% */ } +/* 注册流程 */ +.flowBox { + width: 200px; + height: 92px; + flex-shrink: 0; + border-radius: 4px; + background: #F8F8F8; + padding: 24px; +} +.flowNum { + color: #151E2C; + font-family: Montserrat; + font-size: 32px; + font-style: normal; + font-weight: 600; + line-height: 46px; /* 143.75% */ +} +.flowContent { + color: #151E2C; + font-family: Montserrat; + font-size: 18px; + font-style: normal; + font-weight: 500; + line-height: 46px; /* 255.556% */ +} +.flowContentTip { + max-width: 412px; + flex-shrink: 0; + color: #666C89; + font-size: 14px; + font-style: normal; + font-weight: 500; + line-height: 22px; /* 157.143% */ +} +.flowTime { + color: #8E8E8E; + font-family: Montserrat; + font-size: 18px; + font-style: normal; + font-weight: 500; + line-height: 20px; /* 111.111% */ + border: 1px solid #DBDBDB; + border-top: none; + width: 56.5%; + height: 36px; + flex-shrink: 0; + margin:18px 0 40px 40px; + text-align: center; + line-height: 36px; +} +.authority-title { + margin: 100px 0 28px 0; + color: #151E2C; + font-family: Montserrat; + font-size: 28px; + font-style: normal; + font-weight: 600; + line-height: 20px; /* 71.429% */ +} +.authority-content { + color: #151E2C; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 37px; /* 264.286% */ +} +.authority-content span { + color: #00AFAF; +} +/* 底部图片 */ +.footer-img { + position: absolute; + right: 0; + top: -120px; + width: 247px; + height: 247px; + flex-shrink: 0; + text-align: center; + background-color: #fff; + line-height: 247px; +} +.writeQrcode { + color: #FFF; + font-size: 24px; + font-style: normal; + font-weight: 600; + line-height: 46px; /* 191.667% */ +} +.MT-form { + color: #FFF; + text-shadow: 0px 4px 8.7px rgba(18, 148, 148, 0.59); + font-family: zihunbiantaoti; + font-size: 40px; + font-style: normal; + font-weight: 400; + line-height: 46px; /* 115% */ +} \ No newline at end of file diff --git a/src/view/platform/tab/AMAZON.vue b/src/view/platform/tab/AMAZON.vue index 21e33f6..a5bc19e 100644 --- a/src/view/platform/tab/AMAZON.vue +++ b/src/view/platform/tab/AMAZON.vue @@ -1,6 +1,6 @@ @@ -138,6 +209,20 @@ } }; + \ No newline at end of file diff --git a/src/view/platform/tab/components/SEND.vue b/src/view/platform/tab/components/SEND.vue new file mode 100644 index 0000000..e7caba5 --- /dev/null +++ b/src/view/platform/tab/components/SEND.vue @@ -0,0 +1,34 @@ + + + \ No newline at end of file diff --git a/src/view/platform/tab/components/SHIPTRACK.vue b/src/view/platform/tab/components/SHIPTRACK.vue new file mode 100644 index 0000000..917f717 --- /dev/null +++ b/src/view/platform/tab/components/SHIPTRACK.vue @@ -0,0 +1,33 @@ + + + \ No newline at end of file diff --git a/src/view/platform/tab/components/TSPN.vue b/src/view/platform/tab/components/TSPN.vue new file mode 100644 index 0000000..283f85c --- /dev/null +++ b/src/view/platform/tab/components/TSPN.vue @@ -0,0 +1,35 @@ + + + \ No newline at end of file diff --git a/src/view/platform/tab/components/componentsIndex.css b/src/view/platform/tab/components/componentsIndex.css index cead54a..e709d24 100644 --- a/src/view/platform/tab/components/componentsIndex.css +++ b/src/view/platform/tab/components/componentsIndex.css @@ -57,4 +57,293 @@ font-style: normal; font-weight: 400; line-height: 28px; - } \ No newline at end of file + } + +::v-deep .special .el-tabs__header { + padding: 0px !important; + margin: 80px 0 96px 0; +} +/* tsdn */ +.TSDN-Box-mainTitle { + color: #151E2C; + font-size: 32px; + font-style: normal; + font-weight: 600; + line-height: 46px; /* 143.75% */ + margin-bottom: 44px; + padding-left: 25px; +} +.TSDN-title { + color: #151E2C; + font-size: 32px; + font-style: normal; + font-weight: 600; + line-height: 46px; /* 143.75% */ + margin-bottom: 20px; +} +.TSDN-content { + width: 720px; + color: rgba(21, 30, 44, 0.50); + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 42px; /* 233.333% */ +} +::v-deep .special .el-tabs__content { + padding-left: 30px; +} +.TSDN-Box { + width: 460px; + height: 110px; + flex-shrink: 0; + background: #FFF; + border-left: 4px solid #00AFAF; + padding: 30px 60px; + margin-bottom: 32px; +} +.TSDN-Box-title { + color: #151E2C; + font-size: 20px; + font-style: normal; + font-weight: 500; + line-height: 42px; /* 210% */ + margin-bottom: 16px; +} +.TSDN-Box-content { + color: rgba(21, 30, 44, 0.50); + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 28px; /* 175% */ +} +.footer-Box { + position: relative; + width: calc(100% -230px); + height: 217px; + flex-shrink: 0; + border-radius: 10px; + background: #00AFAF; + box-shadow: 0px 13px 23.1px 0px rgba(0, 175, 175, 0.20); + padding: 32px 45px 37px 185px; + margin: 100px 0 0 0; +} +.footer-Img { + position: absolute; + left: 25px; + top:-34px; +} +.footer-title { + color: #FFF; + text-shadow: 0px 4px 14.3px #007E7E; + font-family: zihunbiantaoti; + font-size: 40px; + font-style: normal; + font-weight: 400; + line-height: 42px; /* 105% */ + margin-bottom: 22px; +} +.footer-content { + width: 64.5%; + color: #FFF; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 32px; /* 200% */ + margin-bottom: 48px; +} +.footer-tip { + width: 188px; + height: 40px; + text-align: center; + line-height: 40px; + flex-shrink: 0; + border-radius: 10px; + background: #009898; + margin-right: 18px; + color: #FFF; + font-size: 16px; + font-style: normal; + font-weight: 500; + line-height: 42px; /* 262.5% */ +} +.footer-Qrcode { + width: 203px; + height: 203px; + flex-shrink: 0; + background: #FFF; + box-shadow: 0px -4px 20.1px 0px rgba(182, 182, 182, 0.25); + text-align: center; + line-height: 203px; +} +/* el-step */ +::v-deep .el-step.is-vertical .el-step__main{ + padding-left: 26px; +} +::v-deep .el-step__head.is-wait{ + color: #fff; + border-color: #00AFAF; +} +::v-deep .el-step__icon.is-text { + background: #00AFAF; +} +::v-deep .el-step__line { + background: #00AFAF; + left: 13px !important; +} +::v-deep .description { + color: #1C1F35; + font-size: 22px; + font-style: normal; + font-weight: 500; + line-height: 22px; /* 100% */ +} +.el-step .content { + color: #4D5563; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 30px; /* 187.5% */ + margin-top: 16px; +} +/* SEND */ +.SEND-Box { + padding: 34px 28px; + height: 180px; + border-radius: 30px; + /* opacity: 0.7; */ + margin: 0 9px 25px; + +} +.SEND-Box:last-child { + width: calc(100% - 85px); +} +.SEND-Box-title{ + margin-bottom: 26px !important; + color: #151E2C; + font-size: 20px; + font-style: normal; + font-weight: 500; + line-height: 20px; /* 100% */ + opacity: 100; +} +.SEND-Box-content { + color: var(--Neutral-Paragraph-Gray-500, #6C7080); + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 28px; /* 200% */ + opacity: 1; +} +.SEND-Box-content div >span { + color: #8D909C; +} +/* 头程需求 */ +.amazon-Box { + width: calc(100% - 52px); + height: 62px; + flex-shrink: 0; + background-color: #fff; + margin-bottom: 24px; + padding: 26px 33px; +} +.amazon-Box:last-child { + width: calc(100% - 120px); +} +.amazon-title { + color: #151E2C; + font-size: 18px; + font-style: normal; + font-weight: 500; + line-height: 32px; /* 177.778% */ + margin-bottom: 10px; +} +.amazon-content { + color: #818181; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 24px; /* 171.429% */ +} +.amazon-country { + color: var(--On-Surface, #23262F); + font-size: 18px; + font-style: normal; + font-weight: 600; + line-height: 24px; /* 133.333% */ + padding-right: 4px; + border-right: 1px solid #E5E5E5; + margin-right:8px ; +} +.amazon-trans { + color: var(--Secondary, #777E90); + font-size: 14px; + font-style: normal; + font-weight: 600; + line-height: 24px; /* 171.429% */ + margin-right: 55px; +} +.amazon-time { + color: #23262F; + font-family: "DM Sans"; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; /* 155.556% */ +} +/* 承运商 */ +.selectCarrier { + color: #151E2C; + font-size: 16px; + font-style: normal; + font-weight: 500; + line-height: 24px; /* 150% */ + margin: 15px 0 55px 0; + padding-left: 30px; +} +.video { + width: 100%; + height: 420px; + background: rgba(211, 211, 211, 0.30); + margin-left: 20px; + margin-bottom: 70px; +} +/* 常见问答 */ + .faq-item { + width: 100%; + height: 89px; + flex-shrink: 0; + background: #FFF; + margin: 0 15px; + padding: 30px 30px 40px 40px; + margin-bottom: 32px; +} + .faq-item h3{ + color: #151E2C; + font-size: 22px; + font-style: normal; + font-weight: 600; + line-height: 32px; /* 145.455% */ + margin-bottom: 26px; +} +.faq-item .faq-answer { + color: #666C89; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 32px; /* 200% */ +} +.faq-item .faq-answer i { + display: inline-block; + width: 18px; + height: 18px; + line-height: 18px; + flex-shrink: 0; + padding: 8px; + border-radius: 4px; + background: #00AFAF; + color: #FFF; + font-size: 18px; + font-style: normal; + font-weight: 600; + line-height: 16px; /* 88.889% */ +} \ No newline at end of file