From ece5b7b7d24f85a3253cf722291e69ca7a406192 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期二, 16 八月 2022 13:05:18 +0800
Subject: [PATCH] 完善大屏
---
src/views/index/index.vue | 279 ++++++++++++++++++++++---------------------------------
1 files changed, 111 insertions(+), 168 deletions(-)
diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 2c7a273..9804aa1 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -8,25 +8,27 @@
<div class="bannerLink" @click="jump"></div>
<!-- 杞挱鍥炬帶鍒跺櫒 -->
- <ul class="bannerControl">
- <li
- v-for="(item, index) in bannerList"
- :key="index"
- @click="toggleBanner(index + 1)"
- >
- <button
- class="inner"
- :class="{ active: activeBanner == index + 1 }"
- ></button>
- </li>
- </ul>
+ <div class="bannerControl">
+ <ul>
+ <li
+ v-for="(item, index) in bannerList"
+ :key="index"
+ @click="toggleBanner(index)"
+ >
+ <button
+ class="inner"
+ :class="{ active: activeBanner == index }"
+ ></button>
+ </li>
+ </ul>
+ </div>
<div class="overCard">
<div class="heart">
<!-- 鎺ㄨ崘鍗＄墖 -->
<commendCard :commendCardData="commendCardData"></commendCard>
<!-- 鐢ㄦ埛card -->
- <userCard></userCard>
+ <userCard :userCardArr="userCardArr"></userCard>
</div>
</div>
@@ -39,7 +41,7 @@
:class="{ active: activeCommend === 3 }"
@click="selecTab(3)"
>
- <img src="/images/index/绠楁硶.png" alt="" />
+ <img src="/images/index/sdk.png" alt="" />
<div class="label">绠楁硶</div>
</div>
@@ -48,7 +50,7 @@
:class="{ active: activeCommend === 4 }"
@click="selecTab(4)"
>
- <img src="/images/index/搴旂敤.png" alt="" />
+ <img src="/images/index/app.png" alt="" />
<div class="label">搴旂敤</div>
</div>
</div>
@@ -77,19 +79,19 @@
<rightTabs v-if="item.typeId == 2" :data="item"></rightTabs>
</div>
- <div
+ <!-- <div
class="productItem"
v-for="(item, index) in productData1"
- :key="index"
+ :key="index + '1'"
:class="{ short: item.typeId == 4 || item.typeId == 1 }"
>
<productLeft :data="item"></productLeft>
<rightForm v-if="item.typeId == 1" :data="item"></rightForm>
<rightTabs v-if="item.typeId == 2" :data="item"></rightTabs>
- </div>
+ </div> -->
</div>
- <Connect v-if="showConnect"></Connect>
+ <Connect></Connect>
<!-- 椤靛熬 -->
<Footer></Footer>
@@ -115,6 +117,7 @@
getIndexModelRecommend,
getModelList,
} from "@/api/product";
+import { getUserOrderInfo } from "@/api/order";
export default {
name: "Index",
@@ -136,42 +139,40 @@
this.getBanner();
this.getRecommend();
this.getModule();
- window.addEventListener("scroll", this.scrollListener);
- },
- destroyed() {
- window.removeEventListener("scroll", this.scrollListener);
+ this.getUserBuyInfo();
},
data() {
return {
commendCardData: [
{
- img: "/images/index/鍏ㄦ皯浜戣绠�.png",
+ img: "/images/index/compute.png",
title: "鍏ㄦ皯浜戣绠�",
- des: "浜戞湇鍔＄壒鎯狅紝闄愭椂3鎶樿捣锛屼綆鑷�659鍏�/3骞�",
+ des: "浜戞湇鍔＄壒鎯狅紝闄愭椂3鎶樿捣",
router: "/",
},
{
- img: "/images/index/鍞墠鍜ㄨ.png",
- title: "鍞墠鍜ㄨ",
- des: "鑷寸數0315-2233066锛岄鍙栨偍鐨勪笓灞炴潈鐩�",
+ img: "/images/index/beforeSell.png",
+ title: "鍞悗鍜ㄨ",
+ des: "鑷寸數18953384058锛岄鍙栨偍鐨勪笓灞炴潈鐩�",
router: "/",
},
{
- img: "/images/index/璇曠敤涓績.png",
- title: "璇曠敤涓績",
- des: "绠楁硶鍏嶈垂璇曠敤锛屼负鎮ㄦ彁渚� 0 闂ㄦ瀹炶返鏈轰細",
- router: "/trialCenter",
+ img: "/images/index/trialCenter.png",
+ title: "搴旂敤鍟嗗煄",
+ des: "绠楁硶鎸夐渶瀹夎锛岀伒娲婚厤缃�",
+ router: "/product",
},
], //鎺ㄨ崘鍗＄墖鏁版嵁
- activeBanner: 1, //閫変腑鐨刡anner
+ activeBanner: 0, //閫変腑鐨刡anner
activeCommend: 3, //閫変腑鐨勬帹鑽恡abs
commendData: [], //鎺ㄨ崘tab鐨勬暟鎹�
productData: [],
+ userCardArr: [],
productData1: [
{
router: "/",
typeId: 1,
- pic: "/images/index/浜戞湇鍔�.png",
+ pic: "/images/index/modelbgc2.png",
name: "浜戞湇鍔�",
desc: "涓�閿喘涔帮紝寮�鍚疉I搴旂敤涔嬫梾",
product: {
@@ -211,153 +212,59 @@
{
router: "/",
typeId: 2,
- pic: "/images/index/杈圭紭璁＄畻璁惧.png",
+ pic: "/images/index/modelbgc.png",
name: "杈圭紭璁＄畻璁惧",
desc: "涓�绉嶉儴缃插湪杩戝満渚х殑楂樺彲鐢ㄧ殑杞‖涓�浣撲骇鍝侊紝鎻愬崌搴旂敤绋嬪簭鐨勫揩閫熷搷搴旇兘鍔涖�佽妭鐪佸甫瀹芥祦閲忔垚鏈�",
product: [
{
- name: "杈圭紭璁＄畻璁惧1",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
+ name: "楂樻�ц兘杈圭紭璁＄畻璁惧",
+ title: "NVIDIA Jetson Xavier NX AI杈圭紭璁＄畻鐩掑瓙",
+ des: "绯荤粺灏哄灏忓阀锛屽畨瑁呯伒娲伙紝鎺ュ彛涓板瘜锛屽叿澶囩伒娲荤殑鎵╁睍鑳藉姏銆傚彲骞挎硾搴旂敤浜庡埗閫犮�侀搧璺�佺潱瀵熴�佺幆淇濄�佹櫤鎱у煄甯傘�佸尰鐤椾繚鍋ュ拰鐢熷懡绉戝銆佹櫤鑳芥満鍣ㄧ瓑棰嗗煙銆�",
content: [
{
key: "鐗圭偣",
value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
+ "杞‖涓�浣擄紝棰勮浜嗚礉鎬濈鑷爺鐨勭埥鐏典紒涓氱骇AI鎿嶄綔绯荤粺",
+ "寮�绠卞嵆鐢紝鍔╁姏浼佷笟蹇�熷紑鍚疉I搴旂敤鐨勬瀯寤�",
+ "寮�鏀惧吋瀹癸紝閫傞厤褰撳墠涓绘祦纭欢骞冲彴x86銆丄RM銆丄I鑺墖绛�",
+ "宸ヤ笟绾ц璁★紝楂樻姉闇囷紝閫傚簲涓ラ叿宸ヤ笟鐜",
],
},
{
key: "閰嶇疆",
value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
+ "CPU:6-core NVIDIA Carmel ARM庐v8.2 64-bit CPU 6MB L2 + 4MB L3",
+ "GPU:384-core NVIDIA VoltaTM GPU with 48 Tensor Cores",
],
},
],
- img: "/images/index/璁惧鍥�.png",
+ img: "/images/index/equipment.png",
},
{
- name: "杈圭紭璁＄畻璁惧2",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
+ name: "浣庡姛鑰楄竟缂樿绠楄澶�",
+ title: "Jetson AGX Xavier AI杈圭紭璁＄畻鐩掑瓙",
+ des: "姝や骇鍝佹惌杞絁etson AGX Xavier鏍稿績妯″潡锛岄瑁呬簡璐濇�濈鑷爺鐨勨�旂埥鐏典紒涓氱骇AI鎿嶄綔绯荤粺锛岃兘浠�30W鐨勪綆鍔熻�楁彁渚涢珮杈�321Tops鐨勫疄鏃舵帹鐞嗚兘鍔涖��",
content: [
{
key: "鐗圭偣",
value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
+ "杞‖涓�浣擄紝棰勮浜嗚礉鎬濈鑷爺鐨勭埥鐏典紒涓氱骇AI鎿嶄綔绯荤粺",
+ "寮�绠卞嵆鐢紝鍔╁姏浼佷笟蹇�熷紑鍚疉I搴旂敤鐨勬瀯寤�",
+ "寮�鏀惧吋瀹癸紝閫傞厤褰撳墠涓绘祦纭欢骞冲彴x86銆丄RM銆丄I鑺墖绛�",
+ "宸ヤ笟绾ц璁★紝楂樻姉闇囷紝閫傚簲涓ラ叿宸ヤ笟鐜",
],
},
{
key: "閰嶇疆",
value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
+ "CPU:Volta 512 CUDA Cores + 64 Tensor Cores + 2 NVDLA10TFLOPs(FP16) 32TOPs(INT8)",
+ "GPU:8x Carmel ARM V8.2",
],
},
],
- img: "/images/index/璁惧鍥�.png",
- },
- {
- name: "杈圭紭璁＄畻璁惧3",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
- content: [
- {
- key: "鐗圭偣",
- value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
- ],
- },
-
- {
- key: "閰嶇疆",
- value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
- ],
- },
- ],
- img: "/images/index/璁惧鍥�.png",
- },
- {
- name: "杈圭紭璁＄畻璁惧4",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
- content: [
- {
- key: "鐗圭偣",
- value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
- ],
- },
-
- {
- key: "閰嶇疆",
- value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
- ],
- },
- ],
- img: "/images/index/璁惧鍥�.png",
- },
- {
- name: "杈圭紭璁＄畻璁惧5",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
- content: [
- {
- key: "鐗圭偣",
- value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
- ],
- },
-
- {
- key: "閰嶇疆",
- value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
- ],
- },
- ],
- img: "/images/index/璁惧鍥�.png",
- },
- {
- name: "杈圭紭璁＄畻璁惧6",
- title: "LE-V-S003 楂樻�ц兘杈圭紭璁＄畻涓绘満",
- des: "涓撲负楂樻�ц兘瑙嗛搴旂敤鎵撻�狅紝寮烘倣鐨勫弻蹇楀己澶勭悊鍣紝杞绘澗搴斿楂樼畻鍔涘簲鐢ㄥ満鏅殑闇�姹傘��",
- content: [
- {
- key: "鐗圭偣",
- value: [
- "鎼浇涓ら楂樻�ц兘蹇楀己澶勭悊鍣紝鍙彁渚涢珮杈�64T鐨勫嚩鐚涚畻鍔�",
- "Server绯诲垪锛屽叿澶囧崟鍙颁笌闆嗙兢鏈嶅姟",
- "鏀寔绠楀姏铏氭嫙鍖栫鎺э紝楂樼ǔ瀹氭�у崟鏈虹儹澶�",
- ],
- },
-
- {
- key: "閰嶇疆",
- value: [
- "鑻辩壒灏� 蹇楀己 Silver 4114 10鏍稿鐞嗗櫒 x 2",
- "64GB 鍐呭瓨 (16GB x 4) + 480GB SSD 瀛樺偍 + 8TB HDD 瀛樺偍 鍗冨厗 LAN x 4",
- ],
- },
- ],
- img: "/images/index/璁惧鍥�.png",
+ img: "/images/index/equipment.png",
},
],
},
@@ -365,10 +272,27 @@
timer: null, //鍚戜笂鍥炴粴鍔ㄧ敾
ConnectTimer: null, // 鎺у埗寮瑰眰鐨勫畾鏃跺櫒
bannerList: [],
- showConnect: false, //鏄剧ず鑱旂郴鎴戜滑涓庡洖鍒伴《閮�
};
},
methods: {
+ getUserBuyInfo() {
+ getUserOrderInfo({}).then((res) => {
+ this.userCardArr = [
+ {
+ num: res.data.needPay,
+ label: "寰呬粯娆�",
+ },
+ /* {
+ num: res.data.needRenewal,
+ label: "寰呯画璐�",
+ },
+ {
+ num: "_",
+ label: "娑堟伅涓績",
+ }, */
+ ];
+ });
+ },
// 鍒囨崲banner
toggleBanner(i) {
this.activeBanner = i;
@@ -383,7 +307,9 @@
},
//杞挱鍥捐烦杞繛鎺�
jump() {
- window.open(this.bannerList[this.activeBanner - 1].url);
+ if (this.bannerList[this.activeBanner].url) {
+ window.open(this.bannerList[this.activeBanner].url);
+ }
},
//鑾峰彇鎺ㄨ崘鍒楄〃
async getRecommend() {
@@ -402,18 +328,19 @@
this.activeCommend = id;
this.getRecommend();
},
- //娣诲姞婊氬姩鐩戝惉
- scrollListener() {
- //椤甸潰婊戝姩瑙﹀彂浜嬩欢 (婊氬姩鏉＄Щ鍔ㄥ垯璋冪敤鏄惁鏄剧ず杩斿洖椤堕儴鎸夐挳浜嬩欢)
-
- if (document.documentElement.scrollTop < 1100) {
- this.showConnect = false;
- } else {
- this.showConnect = true;
- }
-
- //妫�鏌ユ粴鍔ㄦ潯鏄惁鍦ㄩ《閮紝鎺у埗杩斿洖椤堕儴鎸夐挳鐨勯殣钘忓拰鏄剧ず
- },
+ },
+ beforeRouteLeave(to, from, next) {
+ let userInfo = sessionStorage.getItem("userInfo");
+ if (
+ !userInfo &&
+ to.path !== "/login" &&
+ to.path !== "/register" &&
+ to.path !== "/connectUs"
+ ) {
+ next({ path: "/login" });
+ } else {
+ next();
+ }
},
};
</script>
@@ -425,14 +352,22 @@
.bannerControl {
position: absolute;
width: 1280px;
- height: 24px;
+ height: calc(28.18vw - 92px);
+ min-height: 278px;
bottom: 80px;
- top: 462px;
+ top: 62px;
left: 0;
right: 0;
transform: none;
margin: 0 auto;
z-index: 2;
+
+ ul {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ left: 0;
+ }
li {
display: inline-block;
@@ -465,16 +400,24 @@
top: 60px;
position: absolute;
width: 100%;
- height: 410px;
+ height: calc(28.18vw - 132px);
+ min-height: 236px;
cursor: pointer;
+ z-index: 3;
}
.overCard {
position: absolute;
- top: 394px;
+ height: calc(28.18vw + 38px);
+ min-height: 408px;
width: 100%;
+ top: 62px;
.heart {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
display: flex;
width: 1280px;
margin: 0 auto;
@@ -534,7 +477,7 @@
}
.product {
- background: url("/images/index/鑳屾櫙.png");
+ background: url("/images/index/background.png");
overflow: hidden;
min-width: 1280px;
--
Gitblit v1.8.0