src/components/swichLabel/main1-show.vue

File was renamed from src/components/layouts/main1-show.vue
@@ -1,47 +1,59 @@
<template>
   <div class="blog-main">
      <a-row>
         <a-col v-bind="colApiLeft">
   <div>
      <div class="blog-drawer">
         <a-drawer placement="left" :closable="false" :visible="visible1" :getContainer="'body'"
            :after-visible-change="afterVisibleChange" @close="onClose1" :zIndex="10" :width=270
            :bodyStyle="{padding:'0px'}" :wrapStyle="{padding:'0px',top:'60px'}">
            <boxLeft></boxLeft>
            <a-drawer placement="left" :closable="false" :visible="visible1" 
               :after-visible-change="afterVisibleChange" @close="onClose1">
               <boxLeft></boxLeft>
            </a-drawer>
         </a-col>
         <a-col v-bind="colApiMain ">
            <a-button @click="showDrawer1">
               小抽屉1
            </a-button>
            <a-button @click="showDrawer2">
               小抽屉2
            </a-button>
            <router-view></router-view>
         </a-col>
         <a-col v-bind="colApiRight" ref="myDrawer">
            <boxRight></boxRight>
         </a-drawer>

            <a-drawer placement="right" :closable="false" :visible="visible2" 
               :after-visible-change="afterVisibleChange" @close="onClose2">
         <a-drawer placement="right" :closable="false" :visible="visible2" :getContainer="'body'"
            :after-visible-change="afterVisibleChange" @close="onClose2" :zIndex="10" :width=270
            :bodyStyle="{padding:'0px'}" :wrapStyle="{padding:'0px',top:'60px'}">
            <boxRight></boxRight>
         </a-drawer>
      </div>
      <div class="blog-main">
			
			
         <a-row>
            <a-col v-bind="colApiLeft">
               <boxLeft></boxLeft>
            </a-col>
            <a-col v-bind="colApiMain ">
					
               <a-button @click="showDrawer1">
                  小抽屉1
               </a-button>
               <a-button @click="showDrawer2">
                  小抽屉2
               </a-button>
               <router-view></router-view>
            </a-col>
				
            <a-col v-bind="colApiRight" ref="myDrawer">
               <boxRight></boxRight>
            </a-drawer>
         </a-col>
      </a-row>
            </a-col>
         </a-row>
      </div>

   </div>
</template>

<script>
   import boxLeft from "./boxLeft.vue"
   import boxRight from "./boxRight.vue"
   import box6 from "./box6-articleList.vue"
   import boxLeft from "../group/boxLeft.vue"
   import boxRight from "../group/boxRight.vue"
   import articleList from "../group/articleList.vue"

   export default {

      components: {
         boxLeft,
         boxRight,
         box6
         articleList
      },
      methods: {
         afterVisibleChange(val) {
         },
         afterVisibleChange(val) {},
         showDrawer1() {
            this.visible1 = true;
         },
@@ -55,40 +67,67 @@
            this.visible2 = false;
         },
      },

      data() {
         return {
            visible1: false,
            visible2: false,
            sliderApi: {
               collapsible: true, //是否可收起

               collapsedWidth: 0 //收缩宽度，设置为 0 会出现特殊 trigger
            },
            colApiLeft: {
               xs: 0,
               sm: 0,
               md: 0,
               lg: 8,
               xl: 8,
               xxl: 6,
               md: {
                  span: 8,
               },
               lg: {
                  span: 7,
                  offset: 1,
               },
               xl: {
                  span: 5,
                  offset: 2,
               },
               xxl: {
                  span: 4,
                  offset: 3,
               },
            },
            colApiRight: {
               xs: 0,
               sm: 0,
               md: 0,
               lg: 0,
               xl: 0,
               xxl: 4,
               xl: {
                  span: 5,
                  offset: 1,
               },
               xxl: {
                  span: 4,
                  offset: 1,
               },
            },
            colApiMain: {
               xs: 24,
               sm: 24,
               md: 24,
               lg: 14,
               xl: 14,
               xxl: 14,
               sm: {
                  span: 20,
                  offset: 2,
               },
               md: {
                  span: 14,
                  offset: 1,
               },
               lg: {
                  span: 13,
                  offset: 2,
               },
               xl: {
                  span: 9,
                  offset: 1,
               },
               xxl: {
                  span: 8,
                  offset: 1,
               },
            }

         }
      }
   }
@@ -96,6 +135,7 @@

<style lang="less">
   .swichTag {
      min-height: 750px;
      padding: 30px 30px 10px;
      background-color: white;
      border-radius: 15px;
@@ -107,9 +147,9 @@
   }

   .blog-main {
      margin-top: 80px;
      padding-left: 5%;
      padding-right: 5%;
      padding-top: 80px;
   }

   /*左右两边的盒子容器*/
@@ -122,9 +162,8 @@
   .blog-left-side {
      position: sticky;
      // top: 80px;
      padding-left: 2%;
      // padding-left: 2%;
      /*padding-right: 2%;*/
      z-index: 100;
   }

   /*中间部分*/
@@ -141,7 +180,6 @@
      padding-top: 10px;
      /*padding-left: 2%;*/
      /*padding-right: 2%;*/
      z-index: 100;
   }

   div .blog-right-side-meta div {