2019-08-14update

king

2019-08-14 68cbb649c933776838e937446ce9ed384916a5e8

 src/views/successCase/index.vue

@@ -9,51 +9,19 @@
        <div class="content_title">
          <span>案例详情</span>
        </div>
        <div class="content">
          <div class="left_border">仓储物流</div>
        <div class="content" v-for="(_case, index) in caselist" :key="index" :class="(index % 2) && 'f-right'">
          <div class="left_border" :style="(index % 2) && 'float: right;'" v-text="_case.SubjClasName"></div>
          <div class="contnt-describe">
            <div class="left" style="float: left;padding-top: 0.1rem;">
              <ul>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s1.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s2.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s3.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s4.png" alt=""></li>
                </router-link>
            <div class="left" style="padding-top: 0.1rem;" :style="!(index % 2) && 'float: left;'">
              <ul :style="(index % 2) && 'padding-left: 0.7rem;'">
                <li v-for="(sub, i) in _case.Subject" :key="i" @click="jumpmenu(sub)">
                  <img :src="sub.Image3" alt="">
                </li>
              </ul>
            </div>
            <div class="right" style="position: relative;">
              <img src="../../img/s5.png" alt="" >
              <span v-if="isShow1" class="txt">明科为中石油实施了物资条码管理系统，实现了需求部门在线计划报批、供应商协同送货、项目现场收、发、盘、存等功能。系统采用了互联网、无线技术条码技术相结合的方案进行实施，为中石油节省大量人力、物力。</span>
            </div>
          </div>
          <div class="left_border" style="float: right;margin-top: 0.5rem;">智能制造</div>
          <div class="contnt-describe" style="margin-bottom: 1.48rem;">
            <div class="left">
              <ul style="margin-left: 1rem;">
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s7.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s8.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s9.png" alt=""></li>
                </router-link>
                <router-link to="/successCaseIndex" style="padding: 0;">
                  <li><img src="../../img/s10.png" alt=""></li>
                </router-link>
              </ul>
            </div>
            <div class="right" style="position: relative;">
              <img src="../../img/s6.png" alt="">
              <span v-if="isShow2" class="txt">明科为中广核实施了物资条码追溯系统，该系统基于明科可配置平台K9 1.0实施，从来料验收开始，经过销售出库、生产装配等环节，完成追溯数据的采集并提供产品生命周期的数据追溯查询</span>
              <img :src="_case.Images" alt="" >
              <!-- <span class="txt"></span> -->
            </div>
          </div>
        </div>
@@ -62,40 +30,13 @@
    <!-- 移动端样式 -->
    <div class="webapp p_hide">
      <h3 class="content_title2 fadeInUp zoomIn animated"><span>案例详情</span></h3>
      <div class="project" style="padding: 0.2rem 0 0.3rem;">
        <h3 class="content_title3"><span>仓储物流</span></h3>
        <div class="img_box"><img src="../../img/an2.png" alt=""></div>
      <div class="project" v-for="(_case, index) in caselist" :key="index" style="padding: 0.1rem 0 0.3rem;">
        <h3 class="content_title3"><span v-text="_case.SubjClasName"></span></h3>
        <div class="img_box"><img :src="_case.Images" alt=""></div>
        <div class="three_box">
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an3.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an4.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an5.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an6.png" alt="">
          </router-link>
        </div>
      </div>
      <div class="project" style="padding: 0.2rem 0 0.3rem;margin-bottom: 0.8rem;">
        <h3 class="content_title3"><span>智能制造</span></h3>
        <div class="img_box"><img src="../../img/an7.png" alt=""></div>
        <div class="three_box">
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an8.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an9.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an10.png" alt="">
          </router-link>
          <router-link tag="div" to="/successCaseIndex">
            <img src="../../img/an11.png" alt="">
          </router-link>
          <div v-for="(sub, i) in _case.Subject" :key="i" @click="jumpmenu(sub)">
            <img :src="sub.Image3" alt="">
          </div>
        </div>
      </div>
    </div>
@@ -106,20 +47,35 @@
export default {
   data () {
      return {
         isShow1: false,
         isShow2: true
         caselist: null
      }
   },
  },
  methods: {
    jumpmenu (menu) {
      this.$router.push({name: menu.PageType, params: {menuId: menu.ID}})
    },
    load () {
      this.Service.getBaseData('Web_Case_GetData').then(res => {
        this.caselist = res.Case
      })
      let param = {
        func: 'Web_Center_GetData',
        Centertype: 'Product'
      }
      this.Service.getParamData(param).then(res => {

      })
    }
  },
   mounted () {
    document.body.scrollTop = 0
    document.documentElement.scrollTop = 0
    this.load()
  }
}
</script>

<style lang="less" scoped>
  .content_title {
    padding: 0.94rem 0 1.03rem;
    padding: 0.94rem 0 0.2rem;
    p {
      color: #838383;
      font-size: .16rem;
@@ -150,15 +106,11 @@
      margin-bottom: .2rem;
    }
  }
  .content:nth-child(2) {
    text-align: center;
    a {
      color:#3B3B3C;
      padding: 0.06rem 0.2rem;
      display: inline-block;
      font-size: 0.16rem;
      margin: 0.21rem 0.1rem;
    }
  .content {
    padding-top: 0.4rem;
  }
  .content:last-child {
    padding-bottom: 0.5rem;
  }
  @media (min-width: 751px) {
    .contnt-describe {
@@ -184,22 +136,18 @@
      .right {
        margin-top: .3rem;
        float: right;
        // width: 3.85rem;
        // height: 2.38rem;
        background: url(../../img/shiyou.png);
        background-size: 100% 100%;
        position: relative;
        .txt {
          position: absolute;
          left: 0.12rem;
          top: 2.65rem;
          width:545px;
          height:67px;
          font-size:16px;
          font-family:MicrosoftYaHei;
          font-weight:400;
          color:rgba(255,255,255,1);
          line-height:25px;
          width: 545px;
          height: 67px;
          font-size: 16px;
          font-family: MicrosoftYaHei;
          font-weight: 400;
          color: rgba(255,255,255,1);
          line-height: 25px;
          text-align: left;
        }
        p {
@@ -225,15 +173,17 @@
        }
      }
    }
    .contnt-describe:nth-child(2n) {
      .right {
        float: left;
      }
      .left {
        float: right;
        span {
          text-align: right;
    .content.f-right {
      .contnt-describe {
        .right {
          float: left;
        }
        .left {
          float: right;
          span {
            text-align: right;
            float: right;
          }
        }
      }
    }
@@ -244,6 +194,7 @@
      position: relative;
      padding-left: .2rem;
      margin-bottom: 0.3rem;
      font-size: 0.16rem;
      float: none;
    }
    .left_border::after {
@@ -267,7 +218,7 @@
        margin-top: 0.2rem;
        position: relative;
        span {
          font-size: 0.36rem;
          font-size: 0.30rem;
          margin-left: 0.18rem;
          margin-top: 0.02rem;
          display: inline-block;
@@ -275,8 +226,8 @@
      }
      .content_title3::after {
        content: '';
        width:0.09rem;
        height:0.45rem;
        width: 0.08rem;
        height:0.36rem;
        background:rgba(0,112,192,1);
        position: absolute;
        top: 0.05rem;