tanxue преди 4 години
родител
ревизия
e5d80d8ecf

+ 45 - 0
assets/scss/cus-client/cus-client-page.scss

@@ -970,5 +970,50 @@
 
 
   }
+
+  /********  describe: 政府机构-详情页  author: TX  date:2020-08-10  ********/
+  .client-government-page{
+    // banner
+    .government-banner{width: 100%;height: 400px;background-image: url("~static/images/client/Industrydetails/government-banner-img.png");background-position-x: center;}
+
+    // 政府行业的发展现状
+    .government-develop-box{
+      .client-container{padding: 48px 0 80px;text-align: center;}
+      p{width: 460px;display: inline-block;@include setFontStyle(-6);color: rgba(0,0,0,0.65);line-height: 22px;vertical-align: middle;margin-right: 96px;text-align: left;}
+      img{display: inline-block;vertical-align: middle;}
+    }
+
+    // 我们的系统为您改变了什么
+    .government-change-box{
+      background: #F9FAFF;
+      padding-bottom: 80px;
+      .change-content{
+        width: 100%;height: 312px;margin-top: 48px;background-image: url("~static/images/client/Industrydetails/government-change-bg.png");
+        h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);margin-bottom: 24px;text-align: center}
+        li{
+          @include setFontStyle(-6);color: rgba(0,0,0,0.65);margin-bottom: 24px;line-height: 22px;
+          i{width: 14px;height: 14px;float:left;box-sizing: border-box;opacity: 0.8;display: block;border: 1px solid #13192D;transform: rotate(45deg);margin-right: 16px;margin-top: 3px;}
+          p{margin-left: 30px}
+        }
+        img{display: inline-block;vertical-align: top;margin: 85px 42px;}
+      }
+      .change-content-left{
+        display: inline-block;padding: 32px 0 0 64px;vertical-align: top;
+        h5,li,li i{color: #fff;border-color: #fff;}
+      }
+      .change-content-right{width: 500px;display: inline-block;padding-top: 64px;}
+    }
+
+    // 我们的优势
+    .government-advantage-box{
+      padding-bottom: 50px;
+        h4{margin-bottom: 48px;}
+        dl{width:33.33%;display: inline-block;margin-bottom: 30px;}
+        dt{@include setFontStyle(-2);color: rgba(0,0,0,0.85);margin-bottom: 16px}
+        dd{@include setFontStyle(-6);color: rgba(0,0,0,0.65);margin-left: 33px;}
+        i{width: 17px;height: 17px;float:left;box-sizing: border-box;opacity: 0.8;display: inline-block;border: 1px solid #2B5CFD;transform: rotate(45deg);margin-right: 16px;}
+        .government-advantage-content{margin-right: -100px;padding: 4px 0 0 4px;}
+    }
+  }
 }
 

+ 93 - 0
pages/Industrydetails/government.vue

@@ -0,0 +1,93 @@
+<template>
+  <!-- 政府机构-详情页 -->
+  <div class="client-government-page">
+    <!-- 政府机构banner栏 -->
+    <div class="government-banner"></div>
+
+    <!-- 政府行业的发展现状 -->
+    <div class="government-develop-box">
+      <h4 class="client-title">政府行业的发展现状</h4>
+      <div class="client-container">
+          <p>为了适应市场经济的发展,越来越多的企业开始意识到人才选拔、培养的重要性,无论是国企还是私企,每年都要举行年度考核、党建考核等各种不同形式的考试。而传统考试方式,从出题、组卷、印刷,到安排场地、试卷分发、监考,再到收卷、阅卷,程序繁杂,需要投入大量的时间、人力和物力,并且周期长、工作量大,成本较高,不能完全适应现代企业管理模式。</p>
+          <img :src="developImg" alt="政府行业的发展现状" />
+      </div>
+    </div>
+
+    <!-- 我们的系统为您改变了什么 -->
+    <div class="government-change-box">
+      <h4 class="client-title">我们的系统为您改变了什么</h4>
+      <div class="client-container">
+        <div class="change-content">
+          <div class="change-content-left">
+            <h5>传统方式出现的问题</h5>
+            <ul>
+              <li><i></i><p>老员工离职,带走工作经验,新人来再靠感觉重新摸索</p></li>
+              <li><i></i><p>新人入职,需要准备培训资料,每进入一批重复工作一次</p></li>
+              <li><i></i><p>每位员工职业技能掌握情况不清晰,谁优谁劣靠猜测</p></li>
+              <li><i></i><p>组织一次培训,员工要放下手上工作在教室集中培训数小时</p></li>
+            </ul>
+          </div>
+          <img :src="changeImg" alt="我们的系统为您改变了什么" />
+          <div class="change-content-right">
+            <h5>我们能够解决的问题</h5>
+            <ul>
+              <li><i></i><p>为企业建立永恒知识库,企业知识与经验存取方便,不再因人员流动而流失</p></li>
+              <li><i></i><p>给员工分配个人账号,严格把控,考试合格就能上岗</p></li>
+              <li><i></i><p>我们为您提供学习与考核工具,各类数据智能分析,让您不再苦恼</p></li>
+              <li><i></i><p>我们提供在线培训,用手机、微信轻松几分钟解决一个问题!碎片时间就可以进行培训,无需集中时间地点</p></li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 我们的优势 -->
+    <div class="government-advantage-box">
+      <h4 class="client-title">我们的优势</h4>
+      <div class="client-container fn-hidden fn-clear-gap">
+        <div class="government-advantage-content">
+          <dl>
+            <dt><i></i><span>重复听讲</span></dt>
+            <dd>网络学习可无限次重复听讲,问答互动也可以保留分享</dd>
+          </dl><dl>
+          <dt><i></i><span>培训费用</span></dt>
+          <dd>可节省讲师、场地、交通等大笔费用</dd>
+        </dl>
+          <dl>
+            <dt><i></i><span>难点学习</span></dt>
+            <dd>网络学习可依据个人情况重复学习难点、易错点</dd>
+          </dl>
+          <dl>
+            <dt><i></i><span>个人时间</span></dt>
+            <dd>网络学习可节约个人大量时间</dd>
+          </dl>
+          <dl>
+            <dt><i></i><span>时间灵活</span></dt>
+            <dd>时间灵活,自己时间允许的情况下学习</dd>
+          </dl>
+          <dl>
+            <dt><i></i><span>学习交流</span></dt>
+            <dd>学习过程中可自由与老师交流疑点难点</dd>
+          </dl>
+        </div>
+
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+    export default {
+        name: 'government',
+        layout:     'templateB',
+        data() {
+          return {
+            // 发展现状img
+            developImg:   require(`~/static/images/client/Industrydetails/government-develop-img.png`),
+            // 我们的系统为您改变了什么 img
+            changeImg:   require(`~/static/images/client/Industrydetails/government-change-img.png`),
+          }
+        },
+    };
+</script>
+

+ 10 - 5
pages/index.vue

@@ -262,7 +262,7 @@
 </template>
 
 <script>
-
+  import { mapGetters } from 'vuex';
   export default {
     name:       'index',
     layout:     'templateA',
@@ -286,7 +286,7 @@
                                              }),
                                            ]);
       return {
-        topCarousels: res1.data.data,
+         topCarousels: res1.data.data||[],
 
       };
     },
@@ -327,7 +327,7 @@
         kaoshiLiArray: [
           {
             demandTitle:'政府机构',
-            demandHref:    '#',
+            demandHref:  this.getBaseUrl+ '/Industrydetails/government',
             demandText:    '无论是国企还是私企,每年都要举行年度考核、党建考核等各种不同形式的考试。而传统考试方式,从出题、组卷、印刷,到安排场地、试卷分发等,成本较高,不能完全适应现代企业管理模式。',
             demandLinkBox: [
               {
@@ -380,7 +380,7 @@
           },
           {
             demandTitle:'金融保险',
-            demandHref:    '#',
+            demandHref:   this.getBaseUrl+ '/Industrydetails/finance',
             demandText:    '金融无处不在并已形成一个庞大体系,金融学涉及的范畴、分支和内容非常广,对员工的知识储备要求较高,相对的考核难度也较大。所以金融保险业更需要考核数据来作为依据,帮助提升业务能力。',
             demandLinkBox: [
               {
@@ -723,7 +723,6 @@
               }
             })
           } else {
-            debugger;
             this.$message.error('手机号已存在');
             return false;
           }
@@ -750,6 +749,12 @@
         this.$router.push({ name: 'news-id', params: opt });
       },
     },
+    computed: {
+      baseUrl() {
+        return this.getBaseUrl;
+      },
+      ...mapGetters(['getBaseUrl']),
+    },
   };
 </script>
 

BIN
static/images/client/Industrydetails/government-banner-img.png


BIN
static/images/client/Industrydetails/government-change-bg.png


BIN
static/images/client/Industrydetails/government-change-img.png


BIN
static/images/client/Industrydetails/government-develop-img.png