素材库-文件夹管理

.eslintrc.js

@@ -44,7 +44,7 @@ module.exports = {
     'curly': [2, 'multi-line'],
     'dot-location': [2, 'property'],
     'eol-last': 2,
-    'eqeqeq': ["error", "always", {"null": "ignore"}],
+    'eqeqeq': ["off"],
     'generator-star-spacing': [2, {
       'before': true,
       'after': true

src/assets/styles/adminIndex.scss

@@ -475,12 +475,10 @@
   position: absolute;
   left: 0;
   bottom: 38px;
-
   span {
     display: block;
     width: 47px;
     height: 18px;
-    // padding: 2px 5px;
     margin-left: 6px;
     text-align: center;
     background: #3a8aeb;
@@ -488,6 +486,10 @@
     font-size: 12px;
     line-height: 18px;
     border-radius: 9px;
+    &.item_time{
+      width: auto;
+      padding: 0 5px;
+    }
   }
 }
 // 主题-素材-文件名样式
@@ -502,6 +504,11 @@
   -webkit-line-clamp: 1;
   overflow: hidden;
   text-overflow: ellipsis;
+  -moz-user-select:none;/*火狐*/
+  -webkit-user-select:none;/*webkit浏览器*/
+  -ms-user-select:none;/*IE10*/
+  -khtml-user-select:none;/*早期浏览器*/
+    user-select:none;
 }
 // 首页-主题库-按钮
 .home_publish_btn {
@@ -542,7 +549,7 @@
 .multi_handle {
   display: flex;
   position: fixed;
-  bottom: 140px;
+  bottom: 60px;
   left: 50%;
   // width: 1100px;
   padding: 25px 150px;

src/views/components/upload.vue

@@ -68,7 +68,7 @@
   </div>
 </template>
 <script>
-import axios from 'axios'
+// import axios from 'axios'
 import * as qiniu from 'qiniu-js'
 import { getQiniuToken } from '@/api/upload/upload'
 export default {
@@ -123,7 +123,6 @@ export default {
           this.$message.error('图片大小不能超过 4MB !')
         }
       }
-
       // this.uploadListVisible = true
       // this.fileData.push({
       //   fileNames: this.fileNames,
@@ -179,7 +178,7 @@ export default {
           _this.filePercent = parseInt(res.total.percent)
           console.log(_this.filePercent)
           this.filePercentTxt = '上传中'
-          if (_this.filePercent === 100) {
+          if (_this.filePercent == 100) {
             // _this.fileData.push(_this.filePercent)
             // _this.fileData.forEach((value, index) => {
             //   value['filePercent'] = parseInt(res.total.percent)
@@ -209,7 +208,7 @@ export default {
           _this.getVideoDuration(_this.uploadFileUrl)
           setTimeout(() => {
             _this.$emit('saveMaterial')
-          }, 2000)
+          }, 200)
           // console.log(_this.fileUrl.push({ name: _this.file.name, url: _this.fileUrl }))
           // console.log(_this.fileUrl)
         }

src/views/materialContent/materialList/index.vue

@@ -2,7 +2,7 @@
   <div>
     <div v-if="isToFolder" class="material_crumbs">
       <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item :to="{ path: '/content' }">素材库</el-breadcrumb-item>
+        <el-breadcrumb-item><a href="/content">素材库</a></el-breadcrumb-item>
         <el-breadcrumb-item>{{ currentFolder }}</el-breadcrumb-item>
       </el-breadcrumb>
     </div>
@@ -10,11 +10,12 @@
       <!-- 上传 / 创建文件夹 -->
       <div class="material_item cont_upload">
         <Upload ref="uploadMaterial" @saveMaterial="saveMaterial" />
-        <el-button class="mkdir_btn" round type="primary" @click="handleMkdir(0)">创建文件夹</el-button>
+        <el-button v-if="!isToFolder" class="mkdir_btn" round type="primary" @click="handleMkdir(0)">创建文件夹</el-button>
+        <el-button v-else class="mkdir_btn" round type="primary"><a href="/content">返回</a></el-button>
       </div>
 
       <!-- 文件夹list -->
-      <div v-for="(item,index) in materialFolders" :key="item.id" :class="['material_item', 'folder', { 'item_multi': folderChecked == index }]" @click="editFolder(item,index)" @dblclick="dbHandle">
+      <div v-for="(item,index) in materialFolders" :key="item.id" :class="['material_item', 'folder', { 'item_multi': folderChecked == index }]" @click="editFolder(item,index)" @dblclick="floderDbClick(item,index)">
         <div class="icon_bg">
           <svg v-if="!item.imgPath" class="font-icon icon" aria-hidden="true">
             <use xlink:href="#icon-wenjianjia" />
@@ -66,7 +67,7 @@
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button v-if="!isEditMaterial" type="primary" round @click="submitForm('folderForm')">保 存</el-button>
-          <el-button v-else type="primary" round @click="saveMaterial">保 存2</el-button>
+          <el-button v-else type="primary" round @click="saveMaterial">保 存</el-button>
           <el-button round @click="resetForm()">取 消</el-button>
         </div>
       </el-dialog>
@@ -182,7 +183,9 @@ export default {
       layerTitle: '创建文件夹', // 文件夹/素材编辑框title
       labelTxt: '文件夹名称',
       isToFolder: false, // 是否进入文件夹
+      isToFolderRouter: null,
       currentFolder: '', // 当前进入的文件夹名
+      currentFolderId: null,
       movingVisible: false,
       uploadListData: [ // 上传列表
       ],
@@ -208,23 +211,47 @@ export default {
       if (newName === false) {
         this.selectedList = []
       }
+    },
+    '$route.query.folderTag'(Val) {
+      console.log(Val)
+      // if (Val) {
+      //   this.isToFolder = true
+      // } else {
+      //   this.isToFolder = false
+      // }
     }
   },
   mounted: function() {
-    this.start()
+    console.log(this.$route.query.folderTag)
     this.getMaterialList()
   },
   methods: {
-    dbHandle() {
-      alert('双击了')
-    },
+
     // 获取素材库list
     getMaterialList() {
-      const params = {
-        'folder_id': null,
-        'material_name': null,
-        'material_type': null,
-        'orga_id': this.orga_id
+      let params
+      if (this.$route.query.folderTag) {
+        console.log('文件夹内')
+        this.isToFolder = true
+        this.currentFolder = localStorage.getItem('currentFolder')
+        this.currentFolderId = localStorage.getItem('currentFolderId')
+        params = {
+          'folder_id': this.currentFolderId,
+          'material_name': null,
+          'material_type': null,
+          'orga_id': this.orga_id
+        }
+      } else {
+        console.log('文件夹外')
+        this.isToFolder = false
+        localStorage.removeItem('currentFolder')
+        localStorage.removeItem('currentFolderId')
+        params = {
+          'folder_id': null,
+          'material_name': null,
+          'material_type': null,
+          'orga_id': this.orga_id
+        }
       }
       getMaterialList(params).then(res => {
         this.materialFolders = res.data.materialFolders
@@ -259,6 +286,20 @@ export default {
         })
       }
     },
+    // 文件夹双击操作
+    floderDbClick(item, index) {
+      this.isEditMaterial = false
+      this.$router.push(
+        {
+          path: '/content', query: { folderTag: 1 }
+        }
+      )
+      this.currentFolder = item.name
+      this.currentFolderId = item.id
+      localStorage.setItem('currentFolder', this.currentFolder)
+      localStorage.setItem('currentFolderId', this.currentFolderId)
+      this.getMaterialList()
+    },
     // 选择 编辑 文件夹
     editFolder(item, index) {
       this.isEditMaterial = false