kd-aiot-frontend/src/views/ledgerAssets/equipment/detail.vue

<template>
  <div class="ele-body">
    <el-card :body-style="{ padding: 0 }">
      <!-- tab切换 -->
<!--      <div class="switch">
        <div class="switch_left">
          <ul>
            <li
              v-for="item in tabOptions"
              :key="item.key"
              :class="{ active: activeComp == item.key }"
              @click="activeComp = item.key"
            >
              {{ item.name }}
            </li>
          </ul>
        </div>
        <div class="right" style="padding: 10px">
          <el-button @click="$router.go(-1)">返回</el-button>
        </div>
      </div> -->
      <div class="page-title">
        <el-page-header @back="$router.go(-1)">
          <div slot="content" class="pageContent">
            <div>设备信息详情</div>
          </div>
        </el-page-header>
      </div>
      <div class="content-wrapper">
        <component :is="activeComp" :id="id" :code="code"></component>
      </div>
    </el-card>
  </div>
</template>

<script>
  import baseInfo from './components/baseInfo.vue';
  // import mould from '../components/details/mould.vue'
  // import maintain from '../components/details/maintain.vue'
  // import repair from '../components/details/repair.vue'
  // import malfunction from '../components/details/malfunction.vue'
  // import InternetRecord from '../components/details/InternetRecord.vue'
  // import production from '../components/details/production.vue'
  // import pointInspection from '../components/details/point-inspection.vue'
  // import internet from '../components/details/internet.vue'
  export default {
    components: {
      baseInfo
      // mould,
      // pointInspection,
      // maintain,
      // repair,
      // production,
      // InternetRecord,
      // malfunction,
      // internet
    },
    data () {
      return {
        // 设备主键id
        id: '',
        code: '',
        activeComp: 'baseInfo',
        tabOptions: [
          { key: 'baseInfo', name: '设备信息' }
          // { key: 'mould', name: '关联模具' },
          // { key: 'pointInspection', name: '巡点检记录' },
          // { key: 'maintain', name: '保养记录' },
          // { key: 'repair', name: '维修记录' },
          // { key: 'malfunction', name: '故障记录' },
          // // { key: 'production', name: '生产记录' },
          // { key: 'internet', name: '物联数据' }
          // // { key: "InternetRecord", name: "物联记录" },
        ]
      };
    },
    created () {
      this.id = this.$route.query.id;
      this.code = this.$route.query.code;
    }
  };
</script>

<style lang="scss" scoped>
  .content-wrapper {
    background-color: #fff;
  }
  .page-title{
    background: #fff;
    padding:26px 10px 15px;
    border-bottom:1px solid #eaeefb;
  }
</style>