实验台跟学生端统一

src/pages/station/list/index.vue

@@ -1,16 +1,22 @@
 <template>
     <!--  实验台  -->
-    <div class="box">
+    <div class="wrap">
         <div class="search">
-            <input type="text" placeholder="请输入关键词" v-model="keyword">
+            <h6>创新实验，智能教学</h6>
-            <button>搜索</button>
+            <div class="input">
+                <img src="@/assets/img/search.png" alt="">
+                <input type="text" placeholder="请输入关键词" v-model="keyword">
+            </div>
         </div>
-        <div class="wrap">
+        <div class="station">
-            <template v-for="(item,index) in curriculumList">
+            <div class="inner">
-                <a class="item" @click="goPreview(item)" :key="index" v-if="!keyword || item.curriculumName.includes(keyword)">
+                <template v-for="(item,index) in curriculumList">
-                    <img :src="item.coverUrl" alt="">
+                    <a class="item" @click="goPreview(item)" :key="index" v-if="!keyword || item.curriculumName.includes(keyword)">
-                </a>
+                        <img :src="item.coverUrl" alt="">
-            </template>
+                        <p class="text">{{ item.curriculumName }}</p>
+                    </a>
+                </template>
+            </div>
         </div>
     </div>
 </template>
@@ -36,7 +42,6 @@ export default {
             });
         },
         goPreview(item) {
-            // let systemName = item.name.replace("<br>","")
             this.$router.push(`/station/preview?courseId=${item.cid}&curriculumName=${item.curriculumName}`);
         },
     }
@@ -44,57 +49,55 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.box {
+.wrap {
-    padding: 20px;
+    margin: -24px;
-    background-color: #fff;
-}
-
-/deep/ .el-card {
-    margin-bottom: 0;
 }
-
 .search {
     position: relative;
-    width: 30%;
+    padding: 121px 0 167px;
-    margin: 50px auto 130px;
+    text-align: center;
-    border-radius: 30px;
+    background: url(../../../assets/img/station-bg.png) 0 0/100% 100% no-repeat;
-    border: 1px solid #9076FF;
+    h6 {
-    border-right: 0;
+        margin-bottom: 25px;
-    overflow: hidden;
+        font-size: 32px;
+        color: #fff;
+    }
+    .input {
+        position: relative;
+        width: 700px;
+        margin: 0 auto;
+    }
+    img {
+        position: absolute;
+        top: 19px;
+        left: 14px;
+    }
     input {
         width: 100%;
-        height: 44px;
+        height: 62px;
-        line-height: 44px;
+        line-height: 62px;
-        padding: 0 20px;
+        padding: 0 50px;
-        font-size: 14px;
+        font-size: 18px;
         color: #333;
         border: 0;
-        outline: none !important;
+        outline: none;
-        box-sizing: border-box;
+        border-radius: 4px;
-    }
-
-    button {
-        position: absolute;
-        top: 0;
-        right: 0;
-        padding: 0 20px;
-        line-height: 46px;
-        color: #fff;
-        background-color: #9076FF;
-        border: 0;
-        outline: none !important;
     }
 }
 
-.wrap {
+.station {
-    display: flex;
+    background: url(../../../assets/img/station1.png) (top left)/auto no-repeat,
-    flex-wrap: wrap;
+                url(../../../assets/img/station2.png) bottom right/auto no-repeat;
-    width: 1072px;
+    .inner {
-    margin: 0 auto;
+        display: flex;
-    min-height: calc(100vh - 520px);
+        flex-wrap: wrap;
-    box-sizing: border-box;
+        width: 1072px;
-
+        min-height: calc(100vh - 520px);
+        padding: 30px 0;
+        margin: 0 auto;
+    }
     .item {
+        position: relative;
         width: 256px;
         height: 195px;
         margin: 0 6px 4px;
@@ -106,6 +109,18 @@ export default {
             width: 100%;
             height: 100%;
         }
+        .text {
+            position: absolute;
+            bottom: 14px;
+            left: 25px;
+            display: flex;
+            align-items: center;
+            width: 130px;
+            height: 50px;
+            font-size: 12px;
+            line-height: 1.6;
+            overflow: hidden;
+        }
     }
 }
 </style>

src/setting.js

@@ -40,8 +40,8 @@ if (isHh) {
     jumpPath = "http://192.168.31.154:8087/";
     bankPath = `http://192.168.31.125:8093`
     // host = "http://www.occupationlab.com:9000/";//线上
-    // host = "http://39.108.250.202:9000/"; // 中台测试服
+    host = "http://39.108.250.202:9000/"; // 中台测试服
-    host = "http://192.168.31.151:9000/"; // 榕
+    // host = "http://192.168.31.151:9000/"; // 榕
     // host = 'http://192.168.31.137:9000/'; // 赓
     title = "职站服务端管理系统";
 } else {