增加新闻分页

king

2021-02-18 7e1e46ff062dcffe4549da8892fed754fa768594

 src/views/successCase/caseSolution.vue

@@ -2,130 +2,35 @@
   <div id="wrap">
      <div class="banner" style="margin-bottom: 1rem;">
         <img src="../../img/solve.jpg" alt="">
         <!-- <img src="../../img/jiejue.png" alt="" class="p_hide"> -->
      </div>
      <div class="wrapper">
         <div class="content_title"><span>数字化解决方案</span></div>
         <p class="p_txt">AI与IoT技术最终会将物理世界改造为万物互联世界，同时建立一个全新的数字化世界。基于自身核心的AI算法能力与软硬件结合能力，明科面向核心应用场景，构建了仓储物流、智能制造和商城营销三大业务体系，同时也通过开放基础人工智能算法赋能开发者实现应用创新。</p>
         <div class="content_title" v-if="title"><span v-text="title"></span></div>
         <p class="p_txt" v-text="description"></p>
         <div class="content_solution">
            <dl class="solution_box">
            <dl class="solution_box" v-for="(item, index) in datalist" :key="index">
               <dt class="solution_box_in">
                  <h3><span>仓储物流</span></h3>
                  <router-link to="/caseDetail" style="margin-right: 0.3rem;">
                     <p style="line-height: 0.22rem;">综合了软件系统、 条码应用、硬件系统、无线网络、系统扩展接 口等多种技术，通过无线移动终端设备，智能信息化应用渗透到仓库作业的每个细节及仓库现场</p>
                  </router-link>
                  <h3><span v-text="item.SubjClasName"></span></h3>
                  <p style="line-height: 0.22rem; margin-right: 0.3rem;font-size: 0.16rem;" v-text="item.Remark"></p>
                  <div class="title">
                     <router-link to="/caseDetail" style="margin-right: 0.3rem;">智慧仓储</router-link>
                     <router-link to="/caseDetail" style="margin-right: 0.3rem;">供应商协同</router-link>
                     <router-link to="/caseDetail">经销商管理</router-link>
                     <a href="javascript:;" style="margin-right: 0.3rem;" v-for="(menu, i) in item.Subject" :key="i"
                        v-text="menu.Title1" @click="jumpmenu(menu)"></a>
                  </div>
               </dt>
               <dd>
                  <img src="../../img/cang.png" alt="">
               </dd>
            </dl>
            <dl class="solution_box">
               <dt class="solution_box_in">
                  <h3><span>智能制造</span></h3>
                  <router-link to="/caseDetail" style="margin-right: 0.3rem;">
                     <p style="line-height: 0.22rem;">企业要实现智能制造，必须要先实现自动化，要实现自动化，就要实现人与设备的交互，由人远程操控 或者由设备自动感应运行，并通过人机交互减少人为操作，实现生产自动化</p>
                  </router-link>
                  <div class="title">
                     <router-link to="/caseDetail" style="margin-right: 0.3rem;">智能制造</router-link>
                     <router-link to="/caseDetail">质量追溯</router-link>
                  </div>
               </dt>
               <dd>
                  <img src="../../img/solution.png" alt="">
               </dd>
            </dl>
            <dl class="solution_box">
               <dt class="solution_box_in">
                  <h3><span>城市营销</span></h3>
                  <router-link to="/caseDetail">
                     <p style="line-height: 0.22rem;">以B2B2C的理念出发，创新模块化设计整合运营商，城市站点，供货 商，批发商，入驻商，分销商，门店于一体，各个模块可自由拆分组合，可以让商家在这个电 商多样化的时代下随时调整运营方案</p>
                  </router-link>
                  <div class="title">
                     <router-link to="/caseDetail" style="margin-right: 0.3rem;">微信商城</router-link>
                     <router-link to="/caseDetail" style="margin-right: 0.3rem;">红包抽奖</router-link>
                     <router-link to="/caseDetail">电商ERP</router-link>
                  </div>
               </dt>
               <dd>
                  <img src="../../img/c33.png" alt="">
               </dd>
            </dl>
            <dl class="solution_box">
               <dt class="solution_box_in">
                  <h3><span>明科商业智能开放平台</span></h3>
                  <router-link to="/caseDetail">
                     <p style="line-height: 0.22rem;">MingKeOS是由明科云计算事业部研发的可配置人工智能开发平台，她可以让用户通过简单配置、自然语言对话的交互方式，即可实现企业管理过程中复杂的业务逻辑处理</p>
                  </router-link>
                  <div class="title">
                     <router-link to="/caseDetail">MingKeOS</router-link>
                  </div>
               </dt>
               <dd>
                  <img src="../../img/ai4.png" alt="">
                  <img style="width: 100%;" :src="item.Images" alt="">
               </dd>
            </dl>
            
            <!-- 移动端样式 -->
            <div class="wrapper industry">
               <div class="content_industry_card">
                  <h3>仓储物流</h3>
                  <router-link to="/caseDetail">
                     <p>综合了软件系统、 条码应用、硬件系统、无线网络、系统扩展接 口等多种技术，通过无线移动终端设备，智能信息化应用渗透到仓库作业的每个细节及仓库现场。</p>
                  </router-link>
            <div class="wrapper industry" style="width: 100%;">
               <div class="content_industry_card" v-for="(item, index) in datalist" :key="index">
                  <h3 v-text="item.SubjClasName"></h3>
                  <p v-text="item.Remark"></p>
                  <div class="content_industry_list">
                     <ul>
                        <li @click="jump('/caseDetail')">智慧仓储</li>
                        <li @click="jump('/caseDetail')">供应商协同</li>
                        <li @click="jump('/caseDetail')">经销商管理</li>
                        <li style="font-size: 0.26rem;" v-for="(menu, i) in item.Subject" :key="i" @click="jumpmenu(menu)" v-text="menu.Title1"></li>
                     </ul>
                     <img src="../../img/wu1.png" alt="">
                  </div>
               </div>
					
               <div class="content_industry_card">
                  <h3>智能制造</h3>
                  <router-link to="/caseDetail">
                     <p>企业要实现智能制造，必须要先实现自动化，要实现自动化就要实现人与设备的交互，由人远程操控 或者由设备自动感应运行，并通过人机交互减少人为操作，实现生产自动化。</p>
                  </router-link>
                  <div class="content_industry_list">
                     <img src="../../img/wu2.png" alt="">
                     <ul>
                        <li @click="jump('/caseDetail')">智能制造</li>
                        <li @click="jump('/caseDetail')">质量追溯</li>
                     </ul>
                  </div>
               </div>
					
               <div class="content_industry_card">
                  <h3>城市营销</h3>
                  <router-link to="/caseDetail">
                     <p>以B2B2C的理念出发，创新模块化设计整合运营商，城市站点，供货 商，批发商，入驻商，分销商，门店于一体，各个模块可自由拆分组合，可以让商家在这个电 商多样化的时代下随时调整运营方案</p>
                  </router-link>
                  <div class="content_industry_list">
                     <ul>
                        <li @click="jump('/caseDetail')">微信商城</li>
                        <li @click="jump('/caseDetail')">红包抽奖</li>
                        <li @click="jump('/caseDetail')">电商ERP</li>
                     </ul>
                     <img src="../../img/wu3.png" alt="">
                  </div>
               </div>
					
               <div class="content_industry_card">
                  <h3>明科智能开放平台</h3>
                  <router-link to="/caseDetail">
                     <p>MingKeOS是由明科云计算事业部研发的可配置人工智能开发平台，她可以让用户通过简单配置、自然语言对话的交互方式，即可实现企业管理过程中复杂的业务逻辑处理</p>
                  </router-link>
                  <div class="content_industry_list">
                     <img src="../../img/wu4.png" alt="">
                     <ul>
                        <li @click="jump('/caseDetail')">MingKeOS</li>
                     </ul>
                     <img :src="item.Images" alt="">
                  </div>
               </div>
            </div>
@@ -138,18 +43,39 @@
   export default {
      data() {
         return {

            title: null,
            description: null,
            datalist: null
         }
      },
      methods: {
         jump (u) {
            this.$router.push(u)
         jumpmenu (menu) {
            let _menuId = menu.ID
         _menuId = _menuId + '.html'
            this.$router.push({name: menu.PageType.toLowerCase(), params: {menuId: _menuId}})
         },
         load () {
            let param = {
               func: 'Web_Center_GetData',
               Centertype: 'Solution'
            }
            this.Service.getParamData(param).then(res => {
               this.title = res.HeadField
               this.description = res.LongText
               this.datalist = res.data
            })
         }
      },
      mounted () {
         this.load()
      }
   }
</script>

<style lang="less" scoped>
   .wrap {
      min-height: 80vh;
   }
   @media (min-width: 751px) {
      .banner_txt {
         font-size: 0.6rem;
@@ -172,7 +98,7 @@
      p {
         padding: .4rem .4rem 0;
         color: #676767;
         font-size: .15rem;
         font-size: .16rem;
         line-height: 0.26rem;
      }
      .solution_box-m {
@@ -267,7 +193,7 @@
         margin-top: 0.4rem;
         
         h3{
            font-size:0.4rem;
            font-size: 0.36rem;
            font-family:PingFang-SC-Bold;
            font-weight:bold;
            color:rgba(59,59,60,1);