<template>
  <div id="detail">
    <el-row>
      <div class="w_0100">
        <div class="w_1200">
          <el-col :span="24" class="top">
            <top-Deatil></top-Deatil>
          </el-col>
        </div>
      </div>
    </el-row>
    <el-row>
      <div class="w_0100 menu">
        <div class="w_1200">
          <el-col :span="24" class="menuTit">
            <top-menu> </top-menu>
          </el-col>
        </div>
      </div>
    </el-row>
    <el-row>
      <div class="w_0100 main">
        <div class="w_1200">
          <el-col :span="24" class="mainInfo">
            <el-col class="mainSide"><slot name="mainSide">主体左部导航</slot></el-col>
            <el-col class="mainMain"><slot name="mainMain">主体右部信息</slot></el-col>
          </el-col>
        </div>
      </div>
    </el-row>
    <el-row>
      <div class="w_0100 footer">
        <div class="w_1200">
          <el-col :span="24" class="footerTit">
            <foots></foots>
          </el-col>
        </div>
      </div>
    </el-row>
  </div>
</template>

<script>
import topMenu from '@/layout/layout-part/top-menu.vue';
import foots from '@/layout/layout-part/foot.vue';
import topDeatil from '@/layout/layout-part/top-Deatil.vue';
export default {
  name: 'detail',
  props: {},
  components: {
    topMenu,
    foots,
    topDeatil,
  },
  data: () => ({}),
  created() {},
  computed: {},
  methods: {},
};
</script>

<style lang="less" scoped>
.w_0100 {
  float: left;
  width: 100%;
}
.w_1200 {
  margin: 0 auto;
  width: 1200px;
}
.top {
  float: left;
  width: 100%;
  height: 120px;
  background: #fff;
  padding: 10px 0;
}
.menu {
  float: left;
  width: 100%;
  height: 40px;
  background: #850000;
}
.main {
  background: #f6f6f6;
  min-height: 500px;
}
.mainInfo {
  float: left;
  width: 100%;
  margin: 20px 0;
}
.mainSide {
  float: left;
  width: 280px;
  min-height: 45px;
  background: #fff;
}
.mainMain {
  float: right;
  width: 900px;
  min-height: 500px;
  padding: 20px 30px;
  background: #fff;
  color: #333;
}
.footer {
  float: left;
  width: 100%;
  height: 64px;
  background-color: #333;
  padding: 0.8rem 0 3rem 0;
}
.footerTit {
  float: left;
  width: 100%;
  height: 64px;
}
</style>
