chore: optimize the code of page width style;

src/layouts/PageLayout.vue

@@ -13,7 +13,7 @@
       </div>
       <slot v-if="this.$slots.extra" slot="extra" name="extra"></slot>
     </page-header>
-    <div ref="page" :class="['page-content', layout == 'head' ? (pageWidth == 'fixed' ? layout : '') : '']" >
+    <div ref="page" :class="['page-content', layout, pageWidth]" >
       <slot></slot>
     </div>
   </div>
@@ -130,7 +130,7 @@ export default {
     padding: 24px 0 0;
     &.side{
     }
-    &.head{
+    &.head.fixed{
       margin: 0 auto;
       max-width: 1400px;
     }

src/layouts/header/AdminHeader.vue

@@ -1,6 +1,6 @@
 <template>
   <a-layout-header :class="[headerTheme, 'admin-header']">
-    <div :class="['admin-header-wide', layout == 'side' ? layout : (pageWidth == 'fixed' ? layout : '')]">
+    <div :class="['admin-header-wide', layout, pageWidth]">
       <router-link v-if="isMobile || layout === 'head'" to="/" :class="['logo', isMobile ? null : 'pc', headerTheme]">
         <img width="32" src="@/assets/img/logo.png" />
         <h1 v-if="!isMobile">{{systemName}}</h1>

src/layouts/header/index.less

@@ -21,7 +21,7 @@
   }
   .admin-header-wide{
     padding-left: 24px;
-    &.head{
+    &.head.fixed{
       max-width: 1400px;
       margin: auto;
       padding-left: 0;

src/layouts/tabs/TabsView.vue

@@ -5,7 +5,7 @@
       v-if="multiPage"
       type="editable-card"
       :active-key="activePage"
-      :style="`margin: -16px auto 8px; ${layout == 'head' && pageWidth == 'fixed' ? 'max-width: 1400px;' : ''}`"
+      :class="['tabs-view', layout, pageWidth]"
       :hide-add="true"
       @change="changePage"
       @edit="editPage"
@@ -206,6 +206,12 @@ function getPageKey (target, depth = 0) {
 </script>
 
 <style scoped lang="less">
+  .tabs-view{
+    margin: -16px auto 8px;
+    &.head.fixed{
+      max-width: 1400px;
+    }
+  }
   .tabs-view-content{
     position: relative;
   }