web-test/src/views/kjpdCenter/index.vue

<template>
  <div id="index">
    <el-row>
      <el-col :span="24" class="info">
        <el-col :span="24" class="top">
          <heads></heads>
        </el-col>
        <el-col :span="24" class="main">
          <div class="w_1200">
            <el-col :span="4" class="mainMenu">
              <menuInfo></menuInfo>
            </el-col>
            <el-col :span="19" class="mainMess">
              <span v-if="num == '1'">
                <basicInfo></basicInfo>
              </span>
              <span v-else-if="num == '2'">
                <videoinfo></videoinfo>
              </span>
              <span v-else>
                退出登录
              </span>
            </el-col>
          </div>
        </el-col>
        <el-col :span="24" class="foot">
          <foot></foot>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import heads from '@/layout/userCenter/heads.vue';
import menuInfo from '@/layout/kjpdCenter/menuInfo.vue';
import foot from '@/layout/live/foot.vue';
import basicInfo from './basicInfo/index.vue';
import videoinfo from './videoinfo/index.vue';
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'index',
  props: {},
  components: {
    heads,
    menuInfo,
    foot,
    basicInfo,
    videoinfo,
  },
  data: function() {
    return {};
  },
  created() {},
  methods: {},
  computed: {
    ...mapState(['user']),
    num() {
      return this.$route.query.num;
    },
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

<style lang="less" scoped>
.w_1200 {
  width: 80%;
  margin: 0 auto;
}
.info {
  background-color: #e9edf6;
}
.main {
  min-height: 600px;
  margin: 15px 0;
}
.mainMenu {
  width: 20%;
  min-height: 600px;
  background-color: #fff;
}
.mainMess {
  float: right;
  min-height: 600px;
  background-color: #fff;
}
</style>