生涯视频页面内容隐藏

src/views/career/components/CareerHollandReportList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="app-container">
     <div class="mb10">
       <el-card style="color: #5E5E5E;" ref="navBar">
         <el-breadcrumb separator-class="el-icon-arrow-right">

src/views/career/plan/index.vue

@@ -14,242 +14,242 @@
         </div>
       </div>
     </div>
-    <div class="index_container">
-      <div class="left_content">
-        <!-- 测评 -->
-        <div class="ceping">
-          <div>
-            <div class="tit" style="color: #47c6a2">
-              专业兴趣测评（HOLLAND）
-            </div>
-            <div class="desc">
-              霍兰德职业兴趣测评（Self-Directed
-              Search）是由美国职业指导专家霍兰德（John
-              Holland）根据他本人大量的职业咨询经验及其职业类型理论编制的测评工具。霍兰德认为，个人职业兴趣特性与职业之间应有一种内在的对应关系。根据兴趣的不同，人格可分为研究型（I）、艺术型（A）、社会型（S）、企业型（E）、传统型（C）、现实型（R）六个维度，每个人的性格都是这六个维度的不同程度组合。
-            </div>
-            <div class="desc_bottom">
-              职业兴趣测评，定位于高中生的职业兴趣特征，从与职业和专业选择密切相关的6种兴趣类型入手，全面深入地了解个人的职业兴趣偏好，并提供应用测评结果指导生涯规划以及大学专业的选择的建议。
-            </div>
-            <div>
-              <el-button type="primary" round @click="goCareer('HOLLAND')"
-                >进入评测</el-button
-              >
-              <el-button
-                type="primary"
-                plain
-                round
-                @click="goReportList('HOLLAND')"
-                >查看记录</el-button
-              >
-            </div>
-          </div>
-          <div>
-            <div class="tit" style="color: #1a74d3">
-              专业兴趣测评（HOLLAND）
-            </div>
-            <div class="desc">
-              MBTI已成为最权威的性格测评工具，它已经被翻译成近20种世界主要语言，每年使用者多达200多万，其中不乏世界500强的大型企业。MBTI是一种迫选型、自我报告式的性格测试，用以衡量和描述人们在获取信息、做出决策、对待生活等方面的心理活动规律和性格类型。它以瑞士心理学家Carl
-              G.Jung（荣格）的性格理论为基础，由美国的心理学家Katherine Cook
-              Briggs 和她的女儿Isabel Briggs Myers共同研究开发。
-            </div>
-            <div class="desc_bottom">
-              职业性格测评，定位于高中生的职业性格特征，从与职业和专业选择密切相关的4类性格特征入手，全面深入地了解个人的职业性格优势和偏好，并提供应用测评结果指导生涯规划以及大学专业选择的建议。
-            </div>
-            <div>
-              <el-button
-                style="background: #1a74d3; color: white"
-                round
-                @click="goCareer('BMTI')"
-                >进入评测</el-button
-              >
-              <el-button
-                style="border: 1px solid #1a74d3; color: #1a74d3"
-                @click="goReportList('MBTI')"
-                plain
-                round
-                >查看记录</el-button
-              >
-            </div>
-          </div>
-        </div>
-        <!-- 三大库 -->
-        <div class="three_library" style="margin-bottom: 40px">
-          <div class="three_library_top">
-            <img src="@/assets/images/career/icon_sandaku.png" alt="" />
-            <span style="margin-left: 8px">三大库</span>
-          </div>
-          <div style="display: flex; justify-content: space-between">
-            <img
-              @click="toDetail('/career/plan/UniversitiesColleges')"
-              src="@/assets/images/career/img_UNIVERSITIES.png"
-              alt="院校库"
-            />
-            <img
-              src="@/assets/images/career/img_major.png"
-              @click="toDetail('/career/plan/ProfessLib')"
-              alt="专业库"
-            />
-            <img
-              src="@/assets/images/career/img_zhiyeku.png"
-              @click="toDetail('/career/vocation/index')"
-              alt="职业库"
-            />
-          </div>
-          <!--  选科查询  -->
-          <div style="margin-top: 22px; margin-bottom: 35px">
-            <img
-              @click="toDetail('/career/subject/index')"
-              src="@/assets/images/career/xuanke.png"
-              alt="选科查询"
-            />
-          </div>
-          <!--  模拟志愿 -->
-          <div style="display: flex; justify-content: space-between">
-            <div style="margin-right: 16px; position: relative">
-              <img
-                src="@/assets/images/career/img_monizhiyuan.png"
-                alt="模拟志愿"
-              />
-              <el-button
-                type="primary"
-                style="position: absolute; left: 35px; bottom: 20px"
-                size="mini"
-                round
-                @click="toDetail('/career/SimulatedVolunteer')"
-                >进入评测</el-button
-              >
-            </div>
-            <div
-              style="
-                display: flex;
-                justify-content: space-between;
-                align-content: space-between;
-                flex-wrap: wrap;
-              "
-            >
-              <img
-                @click="toDetail('/career/batch')"
-                style="height: 135px"
-                src="@/assets/images/career/img_picikongzhi.png"
-                alt="批次控制线"
-              />
-              <img
-                style="height: 135px"
-                @click="toDetail('/career/yfyd')"
-                src="@/assets/images/career/img_yifenyiduan.png"
-                alt="一分一段"
-              />
-              <img
-                style="height: 135px"
-                src="@/assets/images/career/img_toudangxian.png"
-                @click="toDetail('/career/ShiftLine')"
-                alt="投档线"
-              />
-              <img
-                style="height: 135px"
-                src="@/assets/images/career/img_gaokaomingci.png"
-                @click="toDetail('/career/gkmc/index')"
-                alt="高考名词"
-              />
-            </div>
-          </div>
-        </div>
-        <!-- tabs -->
-        <div>
-          <div style="margin-bottom: 16px; display: flex; align-items: center">
-            高考资讯
-            <span style="color: #8a8a8a; font-size: 12px; margin: 0 8px"
-              >最新、最全的高考资讯</span
-            >
-            <!-- <span class="more">更多>></span> -->
-          </div>
-          <el-tabs v-model="activeName" @tab-click="handleClick">
-            <el-tab-pane
-              v-for="(item, index) in newsList"
-              :key="index"
-              :label="item.label"
-              :name="item.label"
-            >
-              <div class="news">
-                <a
-                  class="news_item"
-                  v-for="(item, index) in newsDataList"
-                  :key="index"
-                  @click="toNews(item.id,)"
-                >
-                  {{ item.createTime.split(" ")[0] }}{{ item.title }}
-                </a>
-              </div>
-            </el-tab-pane>
-          </el-tabs>
-        </div>
-      </div>
-      <div class="right_top">
-        <!-- 热门院校榜单 -->
-        <div class="university_top">
-          <div class="tit">
-            <img src="@/assets/images/career/icon_hot.png" alt="热门院校榜单" />
-            <span>热门院校榜单</span>
-          </div>
-          <div class="top_data">
-            <div
-              class="item"
-              v-for="(item, index) in universitiesTopList"
-              :key="item.id"
-            >
-              <div>
-                <span class="index" :class="{ top_active: index < 3 }">{{
-                  index + 1
-                }}</span
-                ><a @click="toUniversity(item.univerid)">{{ item.name }}</a>
-              </div>
+<!--    <div class="index_container">-->
+<!--      <div class="left_content">-->
+<!--        &lt;!&ndash; 测评 &ndash;&gt;-->
+<!--        <div class="ceping">-->
+<!--          <div>-->
+<!--            <div class="tit" style="color: #47c6a2">-->
+<!--              专业兴趣测评（HOLLAND）-->
+<!--            </div>-->
+<!--            <div class="desc">-->
+<!--              霍兰德职业兴趣测评（Self-Directed-->
+<!--              Search）是由美国职业指导专家霍兰德（John-->
+<!--              Holland）根据他本人大量的职业咨询经验及其职业类型理论编制的测评工具。霍兰德认为，个人职业兴趣特性与职业之间应有一种内在的对应关系。根据兴趣的不同，人格可分为研究型（I）、艺术型（A）、社会型（S）、企业型（E）、传统型（C）、现实型（R）六个维度，每个人的性格都是这六个维度的不同程度组合。-->
+<!--            </div>-->
+<!--            <div class="desc_bottom">-->
+<!--              职业兴趣测评，定位于高中生的职业兴趣特征，从与职业和专业选择密切相关的6种兴趣类型入手，全面深入地了解个人的职业兴趣偏好，并提供应用测评结果指导生涯规划以及大学专业的选择的建议。-->
+<!--            </div>-->
+<!--            <div>-->
+<!--              <el-button type="primary" round @click="goCareer('HOLLAND')"-->
+<!--                >进入评测</el-button-->
+<!--              >-->
+<!--              <el-button-->
+<!--                type="primary"-->
+<!--                plain-->
+<!--                round-->
+<!--                @click="goReportList('HOLLAND')"-->
+<!--                >查看记录</el-button-->
+<!--              >-->
+<!--            </div>-->
+<!--          </div>-->
+<!--          <div>-->
+<!--            <div class="tit" style="color: #1a74d3">-->
+<!--              专业兴趣测评（HOLLAND）-->
+<!--            </div>-->
+<!--            <div class="desc">-->
+<!--              MBTI已成为最权威的性格测评工具，它已经被翻译成近20种世界主要语言，每年使用者多达200多万，其中不乏世界500强的大型企业。MBTI是一种迫选型、自我报告式的性格测试，用以衡量和描述人们在获取信息、做出决策、对待生活等方面的心理活动规律和性格类型。它以瑞士心理学家Carl-->
+<!--              G.Jung（荣格）的性格理论为基础，由美国的心理学家Katherine Cook-->
+<!--              Briggs 和她的女儿Isabel Briggs Myers共同研究开发。-->
+<!--            </div>-->
+<!--            <div class="desc_bottom">-->
+<!--              职业性格测评，定位于高中生的职业性格特征，从与职业和专业选择密切相关的4类性格特征入手，全面深入地了解个人的职业性格优势和偏好，并提供应用测评结果指导生涯规划以及大学专业选择的建议。-->
+<!--            </div>-->
+<!--            <div>-->
+<!--              <el-button-->
+<!--                style="background: #1a74d3; color: white"-->
+<!--                round-->
+<!--                @click="goCareer('BMTI')"-->
+<!--                >进入评测</el-button-->
+<!--              >-->
+<!--              <el-button-->
+<!--                style="border: 1px solid #1a74d3; color: #1a74d3"-->
+<!--                @click="goReportList('MBTI')"-->
+<!--                plain-->
+<!--                round-->
+<!--                >查看记录</el-button-->
+<!--              >-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </div>-->
+<!--        &lt;!&ndash; 三大库 &ndash;&gt;-->
+<!--        <div class="three_library" style="margin-bottom: 40px">-->
+<!--          <div class="three_library_top">-->
+<!--            <img src="@/assets/images/career/icon_sandaku.png" alt="" />-->
+<!--            <span style="margin-left: 8px">三大库</span>-->
+<!--          </div>-->
+<!--          <div style="display: flex; justify-content: space-between">-->
+<!--            <img-->
+<!--              @click="toDetail('/career/plan/UniversitiesColleges')"-->
+<!--              src="@/assets/images/career/img_UNIVERSITIES.png"-->
+<!--              alt="院校库"-->
+<!--            />-->
+<!--            <img-->
+<!--              src="@/assets/images/career/img_major.png"-->
+<!--              @click="toDetail('/career/plan/ProfessLib')"-->
+<!--              alt="专业库"-->
+<!--            />-->
+<!--            <img-->
+<!--              src="@/assets/images/career/img_zhiyeku.png"-->
+<!--              @click="toDetail('/career/vocation/index')"-->
+<!--              alt="职业库"-->
+<!--            />-->
+<!--          </div>-->
+<!--          &lt;!&ndash;  选科查询  &ndash;&gt;-->
+<!--          <div style="margin-top: 22px; margin-bottom: 35px">-->
+<!--            <img-->
+<!--              @click="toDetail('/career/subject/index')"-->
+<!--              src="@/assets/images/career/xuanke.png"-->
+<!--              alt="选科查询"-->
+<!--            />-->
+<!--          </div>-->
+<!--          &lt;!&ndash;  模拟志愿 &ndash;&gt;-->
+<!--          <div style="display: flex; justify-content: space-between">-->
+<!--            <div style="margin-right: 16px; position: relative">-->
+<!--              <img-->
+<!--                src="@/assets/images/career/img_monizhiyuan.png"-->
+<!--                alt="模拟志愿"-->
+<!--              />-->
+<!--              <el-button-->
+<!--                type="primary"-->
+<!--                style="position: absolute; left: 35px; bottom: 20px"-->
+<!--                size="mini"-->
+<!--                round-->
+<!--                @click="toDetail('/career/SimulatedVolunteer')"-->
+<!--                >进入评测</el-button-->
+<!--              >-->
+<!--            </div>-->
+<!--            <div-->
+<!--              style="-->
+<!--                display: flex;-->
+<!--                justify-content: space-between;-->
+<!--                align-content: space-between;-->
+<!--                flex-wrap: wrap;-->
+<!--              "-->
+<!--            >-->
+<!--              <img-->
+<!--                @click="toDetail('/career/batch')"-->
+<!--                style="height: 135px"-->
+<!--                src="@/assets/images/career/img_picikongzhi.png"-->
+<!--                alt="批次控制线"-->
+<!--              />-->
+<!--              <img-->
+<!--                style="height: 135px"-->
+<!--                @click="toDetail('/career/yfyd')"-->
+<!--                src="@/assets/images/career/img_yifenyiduan.png"-->
+<!--                alt="一分一段"-->
+<!--              />-->
+<!--              <img-->
+<!--                style="height: 135px"-->
+<!--                src="@/assets/images/career/img_toudangxian.png"-->
+<!--                @click="toDetail('/career/ShiftLine')"-->
+<!--                alt="投档线"-->
+<!--              />-->
+<!--              <img-->
+<!--                style="height: 135px"-->
+<!--                src="@/assets/images/career/img_gaokaomingci.png"-->
+<!--                @click="toDetail('/career/gkmc/index')"-->
+<!--                alt="高考名词"-->
+<!--              />-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </div>-->
+<!--        &lt;!&ndash; tabs &ndash;&gt;-->
+<!--        <div>-->
+<!--          <div style="margin-bottom: 16px; display: flex; align-items: center">-->
+<!--            高考资讯-->
+<!--            <span style="color: #8a8a8a; font-size: 12px; margin: 0 8px"-->
+<!--              >最新、最全的高考资讯</span-->
+<!--            >-->
+<!--            &lt;!&ndash; <span class="more">更多>></span> &ndash;&gt;-->
+<!--          </div>-->
+<!--          <el-tabs v-model="activeName" @tab-click="handleClick">-->
+<!--            <el-tab-pane-->
+<!--              v-for="(item, index) in newsList"-->
+<!--              :key="index"-->
+<!--              :label="item.label"-->
+<!--              :name="item.label"-->
+<!--            >-->
+<!--              <div class="news">-->
+<!--                <a-->
+<!--                  class="news_item"-->
+<!--                  v-for="(item, index) in newsDataList"-->
+<!--                  :key="index"-->
+<!--                  @click="toNews(item.id,)"-->
+<!--                >-->
+<!--                  {{ item.createTime.split(" ")[0] }}{{ item.title }}-->
+<!--                </a>-->
+<!--              </div>-->
+<!--            </el-tab-pane>-->
+<!--          </el-tabs>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--      <div class="right_top">-->
+<!--        &lt;!&ndash; 热门院校榜单 &ndash;&gt;-->
+<!--        <div class="university_top">-->
+<!--          <div class="tit">-->
+<!--            <img src="@/assets/images/career/icon_hot.png" alt="热门院校榜单" />-->
+<!--            <span>热门院校榜单</span>-->
+<!--          </div>-->
+<!--          <div class="top_data">-->
+<!--            <div-->
+<!--              class="item"-->
+<!--              v-for="(item, index) in universitiesTopList"-->
+<!--              :key="item.id"-->
+<!--            >-->
+<!--              <div>-->
+<!--                <span class="index" :class="{ top_active: index < 3 }">{{-->
+<!--                  index + 1-->
+<!--                }}</span-->
+<!--                ><a @click="toUniversity(item.univerid)">{{ item.name }}</a>-->
+<!--              </div>-->
 
-              <div class="count">
-                <img
-                  style="margin-right: 4px"
-                  src="@/assets/images/career/icon_star.png"
-                  alt=""
-                />
-                <span>{{ item.favorities }}人</span>
-              </div>
-            </div>
-          </div>
-        </div>
-        <!-- 热门专业榜单 -->
-        <div class="marjor_top">
-          <div class="tit">
-            <img
-              src="@/assets/images/career/icon_hot2.png"
-              alt="热门专业榜单"
-            />
-            <span>热门专业榜单</span>
-          </div>
-          <div class="top_data">
-            <div
-              class="item"
-              v-for="(item, index) in marjorTopList"
-              :key="item.id"
-            >
-              <div>
-                <span class="index" :class="{ top_active: index < 3 }">{{
-                  index + 1
-                }}</span
-                ><a @click="goMarjorDetail(item.id)">{{ item.name }}</a>
-              </div>
+<!--              <div class="count">-->
+<!--                <img-->
+<!--                  style="margin-right: 4px"-->
+<!--                  src="@/assets/images/career/icon_star.png"-->
+<!--                  alt=""-->
+<!--                />-->
+<!--                <span>{{ item.favorities }}人</span>-->
+<!--              </div>-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </div>-->
+<!--        &lt;!&ndash; 热门专业榜单 &ndash;&gt;-->
+<!--        <div class="marjor_top">-->
+<!--          <div class="tit">-->
+<!--            <img-->
+<!--              src="@/assets/images/career/icon_hot2.png"-->
+<!--              alt="热门专业榜单"-->
+<!--            />-->
+<!--            <span>热门专业榜单</span>-->
+<!--          </div>-->
+<!--          <div class="top_data">-->
+<!--            <div-->
+<!--              class="item"-->
+<!--              v-for="(item, index) in marjorTopList"-->
+<!--              :key="item.id"-->
+<!--            >-->
+<!--              <div>-->
+<!--                <span class="index" :class="{ top_active: index < 3 }">{{-->
+<!--                  index + 1-->
+<!--                }}</span-->
+<!--                ><a @click="goMarjorDetail(item.id)">{{ item.name }}</a>-->
+<!--              </div>-->
 
-              <div class="count">
-                <img
-                  style="margin-right: 4px"
-                  src="@/assets/images/career/icon_star.png"
-                  alt=""
-                />
-                <span>{{ item.favorities }}人</span>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+<!--              <div class="count">-->
+<!--                <img-->
+<!--                  style="margin-right: 4px"-->
+<!--                  src="@/assets/images/career/icon_star.png"-->
+<!--                  alt=""-->
+<!--                />-->
+<!--                <span>{{ item.favorities }}人</span>-->
+<!--              </div>-->
+<!--            </div>-->
+<!--          </div>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--    </div>-->
   </div>
 </template>
 <script>