素材库-组件问题

src/views/content/material/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <div class="content_warp">
-      <el-tabs v-model="activeIndex" @tab-click="handleClick">
+      <el-tabs v-model="index" @tab-click="handleClick">
         <el-tab-pane label="全部" name="0" />
         <el-tab-pane name="1">
           <span slot="label">
@@ -19,7 +19,7 @@
           </span>
         </el-tab-pane>
       </el-tabs>
-      <MaterialList ref="MaterialList" :is-multi-selected="isMultiSelected" :mulit-text="mulitText" :active-index="activeIndex" @changedMultiSelected="changedMultiSelected" />
+      <MaterialList ref="MaterialList" :is-publish-layer="isPublishLayer" :is-multi-selected="isMultiSelected" :mulit-text="mulitText" :active-item-index="activeItemIndex" @changedMultiSelected="changedMultiSelected" />
     </div>
     <div class="material_btn">
       <el-button round type="primary" @click="handleUpload">上传列表</el-button>
@@ -35,12 +35,14 @@ export default {
   components: { MaterialList },
   data() {
     return {
-      activeIndex: 0 || '0',
+      index: 0,
+      activeItemIndex: 0,
       isMultiSelected: false,
       mulitText: '多选',
       audioNum: 0,
       imgNum: 0,
-      videoNum: 0
+      videoNum: 0,
+      isPublishLayer: false
     }
   },
   mounted: function() {
@@ -52,18 +54,19 @@ export default {
   },
   methods: {
     handleClick(tab) {
-      this.activeIndex = tab.index
-      switch (this.activeIndex) {
-        case '0':
+      this.index = tab.index
+      this.activeItemIndex = parseInt(this.index)
+      switch (this.activeItemIndex) {
+        case 0:
           this.$refs.MaterialList.tabType = null
           break
-        case '1':
+        case 1:
           this.$refs.MaterialList.tabType = 0
           break
-        case '2':
+        case 2:
           this.$refs.MaterialList.tabType = 1
           break
-        case '3':
+        case 3:
           this.$refs.MaterialList.tabType = 2
           break
       }

src/views/content/material/materialList/index.vue

@@ -134,8 +134,12 @@ export default {
       type: Boolean,
       required: true
     },
-    activeIndex: {
-      type: String,
+    activeItemIndex: {
+      type: Number,
+      required: true
+    },
+    isPublishLayer: {
+      type: Boolean,
       required: true
     }
   },
@@ -183,7 +187,8 @@ export default {
       videoNum: 0,
       previewVisible: false, // 预览
       previewSrc: null,
-      previewType: null
+      previewType: null,
+      materialTypeNot: null
     }
   },
   computed: {
@@ -197,30 +202,39 @@ export default {
         this.selectedListId = []
       }
     },
-    activeIndex(newName, oldName) {
-      this.tabIndex = newName
-      this.$nextTick(() => {
-        switch (this.tabIndex) {
-          case '0':
-            this.$refs.uploadMaterial.isActiveType = null
-            break
-          case '1':
-            this.formatType = 1
-            this.$refs.uploadMaterial.isActiveType = 0
-            break
-          case '2':
-            this.formatType = 2
-            this.$refs.uploadMaterial.isActiveType = 1
-            break
-          case '3':
-            this.formatType = 2
-            this.$refs.uploadMaterial.isActiveType = 2
-            break
+    activeItemIndex(val) {
+      console.log(this.isPublishLayer)
+      console.log(val)
+      if (this.isPublishLayer) {
+        if (val == 0) {
+          this.tabType = null
+          this.materialTypeNot = 2
+        } else {
+          this.tabType = val - 1
         }
-      })
-    },
-    '$route.query.folderTag'(Val) {
-      // console.log(Val)
+        this.getMaterialList()
+      } else {
+        this.tabIndex = val
+        this.$nextTick(() => {
+          switch (this.tabIndex) {
+            case 0:
+              this.$refs.uploadMaterial.isActiveType = null
+              break
+            case 1:
+              this.formatType = 1
+              this.$refs.uploadMaterial.isActiveType = 0
+              break
+            case 2:
+              this.formatType = 2
+              this.$refs.uploadMaterial.isActiveType = 1
+              break
+            case 3:
+              this.formatType = 2
+              this.$refs.uploadMaterial.isActiveType = 2
+              break
+          }
+        })
+      }
     }
   },
   mounted: function() {
@@ -265,7 +279,7 @@ export default {
           'folder_id': this.currentFolderId,
           'material_name': null,
           'material_type': this.tabType,
-          'material_type_not': null,
+          'material_type_not': this.materialTypeNot,
           'orga_id': this.orga_id
         }
       } else {
@@ -276,7 +290,7 @@ export default {
           'folder_id': null,
           'material_name': null,
           'material_type': this.tabType,
-          'material_type_not': null,
+          'material_type_not': this.materialTypeNot,
           'orga_id': this.orga_id
         }
       }

src/views/immediateRelease/index.vue

@@ -136,11 +136,11 @@
         <!-- 素材库 -->
         <div v-if="activeIndex === 0">
           <ul class="tab_item">
-            <li v-for="(item, index) in materialTabItem" :key="index" :class="{'active': activeItemIndex === index}" @click="tabItem(index)">{{ item.name }}<span>{{ item.num }}</span>
+            <li v-for="(item, index) in materialTabItem" :key="index" :class="{'active': activeItemIndex == index}" @click="tabItem(index)">{{ item.name }}<span>{{ item.num }}</span>
             </li>
           </ul>
           <div class="material_list" style="min-height: 260px">
-            <MaterialList ref="MaterialList" :is-multi-selected="isMultiSelected" :mulit-text="mulitText" :active-item-index="activeItemIndex" />
+            <MaterialList ref="MaterialList" :is-publish-layer="isPublishLayer" :is-multi-selected="isMultiSelected" :mulit-text="mulitText" :active-item-index="activeItemIndex" />
           </div>
         </div>
         <!-- 主题库 -->
@@ -251,7 +251,8 @@
 <script>
 import draggable from 'vuedraggable'
 import ThemeGalleryList from '@/views/components/ThemeGalleryList.vue'
-import MaterialList from '@/views/components/MaterialCompontentList.vue'
+// import MaterialList from '@/views/components/MaterialCompontentList.vue'
+import MaterialList from '@/views/content/material/materialList/index'
 import { getMaterialByType, FetchFindMaterialById } from '@/api/material/material'
 import { ReqDeviceList } from '@/api/device/deviceList.js'
 import { FetchSaveRelease, FetchGetReleaseDetailsById } from '@/api/release/release.js'
@@ -276,7 +277,7 @@ export default {
   },
   data() {
     return {
-      isThemeOrMaterial: false,
+      isPublishLayer: true,
       orga_id: '133221333123111',
       selectedMaterial: [], // 从其他页面选择带过来的素材
       publishType: 0, // 判断是定时发布还是即时发布页面