|
@@ -1,134 +1,121 @@
|
|
|
<template>
|
|
|
- <common-header/>
|
|
|
+ <common-header />
|
|
|
<div class="content">
|
|
|
<div class="main-img">
|
|
|
- <div><img src="@/assets/img/zhjy/jx.png" alt="" /></div>
|
|
|
- <div><img src="@/assets/img/zhjy/jx_1.png" alt="" /></div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/jx_2.png" alt="" />
|
|
|
- <img src="@/assets/img/zhjy/jx.png" alt="" />
|
|
|
+ <div
|
|
|
+ class="img-left"
|
|
|
+ v-for="(item, index) in adData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index == 0 || index == 1"
|
|
|
+ >
|
|
|
+ <img :src="https + item.am_img" alt="" />
|
|
|
+ </div>
|
|
|
+ <div class="img-right">
|
|
|
+ <img
|
|
|
+ v-for="(item, index) in adData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index == 2 || index == 3"
|
|
|
+ :src="https + item.am_img"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 在线学习列表 -->
|
|
|
<div class="online-study">
|
|
|
<div>
|
|
|
<span>在线学习</span>
|
|
|
<span @click="zxxxDetail">查看更多</span>
|
|
|
</div>
|
|
|
- <!-- 列表 -->
|
|
|
+
|
|
|
<div class="study-list">
|
|
|
- <div class="list-left">
|
|
|
- <img src="@/assets/img/zhjy/img.png" alt="" />
|
|
|
+ <div
|
|
|
+ class="list-left"
|
|
|
+ v-for="(item, index) in zxxxData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index == 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zz_img" alt="" />
|
|
|
</div>
|
|
|
<div class="list-right">
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_1.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
+ <div
|
|
|
+ class="r-right"
|
|
|
+ v-for="(item, index) in zxxxData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index > 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zz_img" alt="" />
|
|
|
+ <div class="wenzi">
|
|
|
+ <p>{{ item.zz_name }}</p>
|
|
|
<p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_2.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>信息技术与学科教学的深度融合</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_3.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
+ {{ item.zz_content }}
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 协同备课列表 -->
|
|
|
<div class="online-study">
|
|
|
<div>
|
|
|
<span>协同备课</span>
|
|
|
<span @click="xtbkDetail">查看更多</span>
|
|
|
</div>
|
|
|
- <!-- 列表 -->
|
|
|
+
|
|
|
<div class="study-list">
|
|
|
- <div class="list-left">
|
|
|
- <img src="@/assets/img/zhjy/img_4.png" alt="" />
|
|
|
+ <div
|
|
|
+ class="list-left"
|
|
|
+ v-for="(item, index) in xtbkData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index == 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zx_img" alt="" />
|
|
|
</div>
|
|
|
<div class="list-right">
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_5.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
+ <div
|
|
|
+ class="r-right"
|
|
|
+ v-for="(item, index) in xtbkData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index > 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zx_img" alt="" />
|
|
|
+ <div class="wenzi">
|
|
|
+ <p>{{ item.zx_name }}</p>
|
|
|
<p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_6.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>信息技术与学科教学的深度融合</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_7.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
+ {{ item.zx_brief }}
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 同步教研列表 -->
|
|
|
<div class="online-study">
|
|
|
<div>
|
|
|
<span>同步教研</span>
|
|
|
<span @click="tbjyDetail">查看更多</span>
|
|
|
</div>
|
|
|
- <!-- 列表 -->
|
|
|
+
|
|
|
<div class="study-list">
|
|
|
- <div class="list-left">
|
|
|
- <img src="@/assets/img/zhjy/img_8.png" alt="" />
|
|
|
+ <div
|
|
|
+ class="list-left"
|
|
|
+ v-for="(item, index) in tbjyData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index == 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zt_img" alt="" />
|
|
|
</div>
|
|
|
<div class="list-right">
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_9.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_10.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>信息技术与学科教学的深度融合</p>
|
|
|
+ <div
|
|
|
+ class="r-right"
|
|
|
+ v-for="(item, index) in tbjyData"
|
|
|
+ :key="index"
|
|
|
+ v-show="index > 0"
|
|
|
+ >
|
|
|
+ <img :src="https + item.zt_img" alt="" />
|
|
|
+ <div class="wenzi">
|
|
|
+ <p>{{ item.zt_name }}</p>
|
|
|
<p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/img/zhjy/img_11.png" alt="" />
|
|
|
- <div>
|
|
|
- <p>五育并举的学校课程体系建设与实施</p>
|
|
|
- <p>
|
|
|
- 溯源学校制定课程规划的初衷,合理规划学校课程,通过培训促使教师参与课程规划,并编制三年整体的教学计划,明确课程实施的重点难点,
|
|
|
+ {{ item.zt_content }}
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -139,13 +126,22 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { zhjy_ad_list, zhjy_list } from "./api";
|
|
|
import commonHeader from "@/components/header/index.vue";
|
|
|
export default {
|
|
|
name: "index",
|
|
|
- components:{
|
|
|
- commonHeader
|
|
|
+ components: {
|
|
|
+ commonHeader,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ adData: {},
|
|
|
+ https: window.GLOBAL_CONFIG.api,
|
|
|
+ zxxxData: [],
|
|
|
+ tbjyData: [],
|
|
|
+ xtbkData: [],
|
|
|
+ };
|
|
|
},
|
|
|
- data() {},
|
|
|
methods: {
|
|
|
zxxxDetail() {
|
|
|
this.$router.push({ name: "zhjy_zhjyzxxx" });
|
|
@@ -156,6 +152,28 @@ export default {
|
|
|
tbjyDetail() {
|
|
|
this.$router.push({ name: "zhjy_zhjytbjy" });
|
|
|
},
|
|
|
+ getAdData() {
|
|
|
+ let data = {
|
|
|
+ page: this.page,
|
|
|
+ limit: this.limit,
|
|
|
+ };
|
|
|
+ zhjy_ad_list(data).then((res) => {
|
|
|
+ this.adData = res.data.page_data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getListData() {
|
|
|
+ let data = {};
|
|
|
+ zhjy_list(data).then((res) => {
|
|
|
+ this.zxxxData = res.data.zxxx;
|
|
|
+ console.log(this.zxxxData, 99);
|
|
|
+ this.tbjyData = res.data.tbjy;
|
|
|
+ this.xtbkData = res.data.xtbk;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getAdData();
|
|
|
+ this.getListData();
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
@@ -167,24 +185,26 @@ export default {
|
|
|
margin: 25px auto 0;
|
|
|
}
|
|
|
.main-img {
|
|
|
- width: 100%;
|
|
|
+ width: 1280px;
|
|
|
+ height: 240px;
|
|
|
display: flex;
|
|
|
margin-bottom: 70px;
|
|
|
- div {
|
|
|
- width: 33.3%;
|
|
|
- & + div {
|
|
|
- margin-left: 15px;
|
|
|
+ .img-left {
|
|
|
+ width: 850px;
|
|
|
+ img {
|
|
|
+ width: 425px;
|
|
|
+ height: 240px;
|
|
|
+ margin-right: 13px;
|
|
|
}
|
|
|
- &:last-of-type {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- img {
|
|
|
- height: 110px;
|
|
|
- width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- img {
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .img-right {
|
|
|
+ height: 240px;
|
|
|
+ width: 800px;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ img {
|
|
|
+ height: 115px;
|
|
|
+ & + img {
|
|
|
+ margin-bottom: 10px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -219,34 +239,45 @@ export default {
|
|
|
.study-list {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
- width: 100%;
|
|
|
+ width: 1280px;
|
|
|
margin-bottom: 70px;
|
|
|
box-shadow: 0px 10px 24px 0px rgba(161, 153, 168, 0.18);
|
|
|
+
|
|
|
& > .list-left {
|
|
|
+ width: 654px;
|
|
|
+ height: 381px;
|
|
|
+
|
|
|
img {
|
|
|
width: 654px;
|
|
|
height: 381px;
|
|
|
}
|
|
|
}
|
|
|
& > .list-right {
|
|
|
- width: 654px;
|
|
|
+ width: 630px;
|
|
|
height: 381px;
|
|
|
margin-left: 10px;
|
|
|
-
|
|
|
- div {
|
|
|
+ // border: 1px solid #000000;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .r-right {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
+
|
|
|
img {
|
|
|
- width: 204px;
|
|
|
+ width: 200px;
|
|
|
height: 120px;
|
|
|
display: inline-block;
|
|
|
box-sizing: border-box;
|
|
|
margin-bottom: 10px;
|
|
|
+ border-radius: 12px;
|
|
|
}
|
|
|
|
|
|
- div {
|
|
|
+ .wenzi {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
+ width: 500px;
|
|
|
+ height: 120px;
|
|
|
+
|
|
|
p:first-of-type {
|
|
|
display: inline-block;
|
|
|
vertical-align: top;
|