update

packages/qjkankan-editor/src/components/materialListInMaterialSelector.vue

@@ -13,7 +13,9 @@
       :rootName="$i18n.t(`gather.${materialTypeAlias}`)"
       @click-path="onClickPath"
     />
-    <div v-if="searchKey" class="crumbs">{{$i18n.t(`gather.${materialTypeAlias}`)}}</div>
+    <div v-if="searchKey" class="crumbs">
+      {{ $i18n.t(`gather.${materialTypeAlias}`) }}
+    </div>
 
     <div class="table">
       <!-- <div class="table-head-row">
@@ -42,8 +44,6 @@
         v-infinite-scroll="requestMoreData"
         :infinite-scroll-disabled="!hasMoreData || isRequestingMoreData"
       >
-
-
         <div v-for="(item, i) in uploadStatusList" :key="item.uid">
           <div
             class="table-body-row"
@@ -52,15 +52,15 @@
           >
             <!-- 如果已经上传成功 -->
             <template v-if="item.status === 'SUCCESS'">
-              <span
-                class="table-data"
-              >
+              <span class="table-data">
                 <RadioOrCheckbox
                   class="checkbox"
                   :isLightTheme="!isDarkTheme"
                   :isMultiSelection="isMultiSelection"
-                  :isCheckedInitial="select.some(i => i.id === item.successInfo.id)"
-                  @change="v => selectItem(item.successInfo, v)"
+                  :isCheckedInitial="
+                    select.some((i) => i.id === item.successInfo.id)
+                  "
+                  @change="(v) => selectItem(item.successInfo, v)"
                 />
               </span>
               <span
@@ -72,7 +72,11 @@
                 :key="idx"
               >
                 <div v-if="tableItemStructure.type" class="list-img">
-                  <slot name="materialUploadSuccessIcon" :uploadInfo="item" :tableItemStructure="tableItemStructure">
+                  <slot
+                    name="materialUploadSuccessIcon"
+                    :uploadInfo="item"
+                    :tableItemStructure="tableItemStructure"
+                  >
                   </slot>
                 </div>
                 <span
@@ -83,22 +87,17 @@
                     class="name-inner ellipsis"
                     v-title="item.successInfo[tableItemStructure.key]"
                   >
-                    {{ item.successInfo[tableItemStructure.key] }}
+                    {{ item.successInfo[tableItemStructure.key].len }}
                   </div>
                 </span>
-                <span
-                  v-else
-                  class="ellipsis"
-                >
-                  {{item.successInfo[tableItemStructure.key]}}
+                <span v-else class="ellipsis">
+                  {{ item.successInfo[tableItemStructure.key] }}
                 </span>
               </span>
             </template>
             <!-- 如果还在上传或切图处理中 -->
             <template v-else-if="item.status === 'LOADING'">
-              <span
-                class="table-data"
-              >
+              <span class="table-data">
                 <RadioOrCheckbox
                   class="checkbox"
                   :isLightTheme="!isDarkTheme"
@@ -115,21 +114,18 @@
                 :key="idx"
               >
                 <div v-if="tableItemStructure.type" class="list-img">
-                  <slot name="materialUploadingIcon">
-                  </slot>
+                  <slot name="materialUploadingIcon"> </slot>
                 </div>
                 <span
                   v-if="tableItemStructure.key === 'name'"
                   class="name upload-status-wrap"
                 >
-                  <div
-                    class="name-inner ellipsis"
-                    v-title="item.title"
-                  >
+                  <div class="name-inner ellipsis" v-title="item.title">
                     {{ item.title }}
                   </div>
                   <div v-if="item.ifKnowProgress" class="upload-status">
-                    {{$i18n.t(`gather.upload_material`)}} {{ Math.round(item.progress * 100)}}%
+                    {{ $i18n.t(`gather.upload_material`) }}
+                    {{ Math.round(item.progress * 100) }}%
                   </div>
                   <div v-else class="upload-status">
                     {{ item.statusText }}
@@ -140,9 +136,7 @@
             </template>
             <!-- 如果上传失败了 -->
             <template v-else-if="item.status === 'FAIL'">
-              <span
-                class="table-data"
-              >
+              <span class="table-data">
                 <RadioOrCheckbox
                   class="checkbox"
                   :isLightTheme="!isDarkTheme"
@@ -159,25 +153,28 @@
                 :key="idx"
               >
                 <div v-if="tableItemStructure.type" class="list-img">
-                  <slot name="materialUploadFailIcon">
-                  </slot>
+                  <slot name="materialUploadFailIcon"> </slot>
                 </div>
                 <span
                   v-if="tableItemStructure.key === 'name'"
                   class="name upload-status-wrap"
                 >
-                  <div
-                    class="name-inner ellipsis"
-                    v-title="item.title"
-                  >
+                  <div class="name-inner ellipsis" v-title="item.title">
                     {{ item.title }}
                   </div>
                   <div class="upload-status">
                     {{ item.statusText }}
                   </div>
                 </span>
-                <span v-if="tableItemStructure.key === 'fileSize'">{{ $i18n.t(`tips_code.FAILURE_3025`) }}</span>
-                <span v-if="tableItemStructure.key !== 'name' && tableItemStructure.key !== 'fileSize'"></span>
+                <span v-if="tableItemStructure.key === 'fileSize'">{{
+                  $i18n.t(`tips_code.FAILURE_3025`)
+                }}</span>
+                <span
+                  v-if="
+                    tableItemStructure.key !== 'name' &&
+                    tableItemStructure.key !== 'fileSize'
+                  "
+                ></span>
               </span>
             </template>
           </div>
@@ -187,24 +184,24 @@
           class="table-body-row"
           v-for="(item, i) in list"
           :key="i"
-          @click="(e) => {
-            if (item.type === 'dir') {
-              onClickFolder(item)
-            } else {
-              onClickRow(e)
+          @click="
+            (e) => {
+              if (item.type === 'dir') {
+                onClickFolder(item);
+              } else {
+                onClickRow(e);
+              }
             }
-          }"
+          "
         >
-          <span
-            class="table-data"
-          >
+          <span class="table-data">
             <RadioOrCheckbox
               class="checkbox"
               :isLightTheme="!isDarkTheme"
               :isDisabled="item.type === 'dir'"
               :isMultiSelection="isMultiSelection"
-              :isCheckedInitial="select.some(i => i.id === item.id)"
-              @change="v => selectItem(item, v)"
+              :isCheckedInitial="select.some((i) => i.id === item.id)"
+              @change="(v) => selectItem(item, v)"
             />
           </span>
           <span
@@ -215,17 +212,19 @@
             }"
             :key="idx"
           >
-            <div
-              v-if="tableItemStructure.type"
-              class="list-img"
-            >
+            <div v-if="tableItemStructure.type" class="list-img">
               <img
                 v-if="item.type === 'dir'"
                 class="folderIcon"
                 src="@/assets/images/icons/folder-blue.png"
                 alt=""
               />
-              <slot v-else name="materialIcon" :materialInfo="item" :tableItemStructure="tableItemStructure">
+              <slot
+                v-else
+                name="materialIcon"
+                :materialInfo="item"
+                :tableItemStructure="tableItemStructure"
+              >
               </slot>
             </div>
             <span
@@ -241,17 +240,18 @@
               >
                 {{ item[tableItemStructure.key] }}
               </div>
-              <div
-                v-if="latestUsedSearchKey"
-                class="parent-info"
-              >
-                {{$i18n.t('gather.dir')}} <span class="parent-name" @click.stop="onClickParentFolder(item)">{{item.dirId === 1 ? $i18n.t('gather.root_dir') : item.dirName}}</span>
+              <div v-if="latestUsedSearchKey" class="parent-info">
+                {{ $i18n.t("gather.dir") }}
+                <span
+                  class="parent-name"
+                  @click.stop="onClickParentFolder(item)"
+                  >{{
+                    item.dirId === 1 ? $i18n.t("gather.root_dir") : item.dirName
+                  }}</span
+                >
               </div>
             </span>
-            <span
-              v-else
-              class="ellipsis"
-            >
+            <span v-else class="ellipsis">
               {{ item[tableItemStructure.key] }}
             </span>
           </span>
@@ -267,21 +267,41 @@
       <!-- 无数据时的提示 -->
       <div v-show="!(listLocalLength !== 0 || hasMoreData)" class="no-data">
         <div v-if="latestUsedSearchKey">
-          <img :src="require(`@/assets/images/default/empty_search_${isDarkTheme ? 'dark' : 'bright'}.png`)" alt="">
+          <img
+            :src="
+              require(`@/assets/images/default/empty_search_${
+                isDarkTheme ? 'dark' : 'bright'
+              }.png`)
+            "
+            alt=""
+          />
           <span>{{ $i18n.t("gather.no_serch_result") }}</span>
         </div>
         <div v-if="!latestUsedSearchKey">
-          <img :src="require(`@/assets/images/default/empty_${isDarkTheme ? 'dark' : 'bright'}.png`)" alt="">
+          <img
+            :src="
+              require(`@/assets/images/default/empty_${
+                isDarkTheme ? 'dark' : 'bright'
+              }.png`)
+            "
+            alt=""
+          />
           <span>{{ $i18n.t("gather.no_material_result") }}</span>
           <a v-if="!canUpload" href="/#/">
-            <button class="ui-button">{{ $i18n.t("gather.how_to_shoot") }}</button>
+            <button class="ui-button">
+              {{ $i18n.t("gather.how_to_shoot") }}
+            </button>
           </a>
         </div>
       </div>
     </div>
 
     <div class="btns">
-      <button v-if="canUpload && !searchKey" class="ui-button upload-btn" @click="onClickUpload">
+      <button
+        v-if="canUpload && !searchKey"
+        class="ui-button upload-btn"
+        @click="onClickUpload"
+      >
         <span>{{ $i18n.t("gather.upload_material") }}</span>
         <i
           class="iconfont icon-material_prompt tool-tip-for-editor"
@@ -311,7 +331,7 @@ import {
 } from "@/api";
 
 import { changeByteUnit } from "@/utils/file";
-import { debounce, capitalize } from "@/utils/other.js"
+import { debounce, capitalize } from "@/utils/other.js";
 
 import config from "@/config";
 
@@ -327,9 +347,7 @@ export default {
     RadioOrCheckbox,
     LoadingPoints,
   },
-  mixins: [
-    folderMixin,
-  ],
+  mixins: [folderMixin],
   props: {
     isDarkTheme: {
       type: Boolean,
@@ -346,19 +364,19 @@ export default {
     materialItemCustomProcess: {
       type: Function,
       default: (item) => {
-        return
-      }
+        return;
+      },
     },
     tableHeaderKeyList: {
       type: Array,
       default: () => {
-        return []
-      }
+        return [];
+      },
     },
     columnWidthList: {
       type: Array,
       default: () => {
-        return []
+        return [];
       },
     },
     isMultiSelection: {
@@ -369,10 +387,10 @@ export default {
       type: Array,
       required: true,
     },
-    
+
     searchKey: {
       type: String,
-      default: '',
+      default: "",
     },
     canUpload: {
       type: Boolean,
@@ -384,16 +402,16 @@ export default {
     fileInputCustomCheck: {
       type: Function,
       default: async () => {
-        return true
-      }
+        return true;
+      },
     },
     fileUploadLongPollingCb: {
       type: Function || null,
-      default: null
+      default: null,
     },
     fileUploadLongPollingStatusText: {
       type: String,
-      defaut: ''
+      defaut: "",
     },
     fileInputFailString: {
       type: String,
@@ -415,20 +433,20 @@ export default {
     return {
       list: [],
 
-      latestUsedSearchKey: '',
+      latestUsedSearchKey: "",
 
       isRequestingMoreData: false,
       hasMoreData: true,
 
       longPollingIntervalId: null,
-    }
+    };
   },
   computed: {
     materialTypeAlias() {
-      if (this.materialType === '3D') {
-        return 'scene'
+      if (this.materialType === "3D") {
+        return "scene";
       } else {
-        return this.materialType
+        return this.materialType;
       }
     },
     tableHeaders() {
@@ -455,36 +473,41 @@ export default {
         }
       ]
        */
-      return this.$MAPTABLEHEADER[this.materialTypeAlias].filter(item => {
-        return this.tableHeaderKeyList.includes(item.key)
-      })
+      return this.$MAPTABLEHEADER[this.materialTypeAlias].filter((item) => {
+        return this.tableHeaderKeyList.includes(item.key);
+      });
     },
     uploadStatusList() {
       if (this.canUpload) {
-        return this.$store.state[`uploadStatusList${capitalize(this.materialType)}`]
+        return this.$store.state[
+          `uploadStatusList${capitalize(this.materialType)}`
+        ];
       } else {
-        return []
+        return [];
       }
     },
     listRealLength() {
-      return this.list.length + this.uploadStatusList.filter((item) => {
-        return item.status === 'SUCCESS'
-      }).length
+      return (
+        this.list.length +
+        this.uploadStatusList.filter((item) => {
+          return item.status === "SUCCESS";
+        }).length
+      );
     },
     listLocalLength() {
-      return this.list.length + this.uploadStatusList.length
+      return this.list.length + this.uploadStatusList.length;
     },
     needLongPolling() {
       return this.uploadStatusList.some((item) => {
-        return item.status === 'LOADING' && item.ifKnowProgress === false
-      })
+        return item.status === "LOADING" && item.ifKnowProgress === false;
+      });
     },
   },
   watch: {
     searchKey: {
       handler: function () {
         if (this.currentMaterialType === this.materialType) {
-          this.refreshMaterialList()
+          this.refreshMaterialList();
         }
       },
       immediate: false,
@@ -492,7 +515,7 @@ export default {
     currentMaterialType: {
       handler: function (newVal) {
         if (newVal === this.materialType && this.list.length === 0) {
-          this.refreshMaterialList()
+          this.refreshMaterialList();
         }
       },
       immediate: false,
@@ -500,11 +523,11 @@ export default {
     needLongPolling: {
       handler: function (newVal) {
         if (!newVal) {
-          clearInterval(this.longPollingIntervalId)
-          this.longPollingIntervalId = null
+          clearInterval(this.longPollingIntervalId);
+          this.longPollingIntervalId = null;
         } else {
-          clearInterval(this.longPollingIntervalId)
-          this.longPollingIntervalId = null
+          clearInterval(this.longPollingIntervalId);
+          this.longPollingIntervalId = null;
           this.longPollingIntervalId = setInterval(() => {
             this.fileUploadLongPollingCb(this.uploadStatusList);
           }, 3000);
@@ -515,97 +538,106 @@ export default {
   },
   methods: {
     selectItem(item, v) {
-      item.materialType = this.materialType // 三维场景数据没有type字段来表明自己是三维场景。所以统一加一个字段。
+      item.materialType = this.materialType; // 三维场景数据没有type字段来表明自己是三维场景。所以统一加一个字段。
       if (this.isMultiSelection) {
         if (v) {
-          this.select.push(item)
+          this.select.push(item);
         } else {
           const toDeleteIdx = this.select.findIndex((eachSelect) => {
-            return eachSelect.id === item.id
-          })
+            return eachSelect.id === item.id;
+          });
           if (toDeleteIdx >= 0) {
-            this.select.splice(toDeleteIdx, 1)
+            this.select.splice(toDeleteIdx, 1);
           }
         }
       } else {
-        this.select.splice(0, this.select.length)
+        this.select.splice(0, this.select.length);
         if (v) {
-          this.select.push(item)
+          this.select.push(item);
         }
       }
     },
     requestMoreData() {
-      this.isRequestingMoreData = true
-      const latestUsedSearchKey = this.searchKey
+      this.isRequestingMoreData = true;
+      const latestUsedSearchKey = this.searchKey;
 
-      let getListFn = null
-      let params = null
-      if (this.materialType === '3D') {
+      let getListFn = null;
+      let params = null;
+      if (this.materialType === "3D") {
         if (!this.searchKey) {
-          getListFn = get3DSceneList
+          getListFn = get3DSceneList;
           params = {
             pathLevel2Id: this.folderPath[1]?.id,
             folderId: this.currentFolderId,
             pageNum: Math.floor(this.list.length / config.PAGE_SIZE) + 1,
             pageSize: config.PAGE_SIZE,
             searchKey: this.searchKey,
-          }
+          };
         } else {
-          getListFn = searchInAll3DScenes
+          getListFn = searchInAll3DScenes;
           params = {
-            searchKey: this.searchKey
-          }
+            searchKey: this.searchKey,
+          };
         }
       } else {
-        getListFn = getMaterialList
+        getListFn = getMaterialList;
         params = {
           dirId: this.currentFolderId,
           pageNum: Math.floor(this.listRealLength / config.PAGE_SIZE) + 1,
           pageSize: config.PAGE_SIZE,
           searchKey: this.searchKey,
           type: this.materialType,
-        }
+        };
       }
-      getListFn(params, (data) => {
-        const newData = data.data.list.map((i) => {
-          if (i.fileSize) {
-            i.fileSize = changeByteUnit(Number(i.fileSize));
-          } else {
-            i.fileSize = ''
+      getListFn(
+        params,
+        (data) => {
+          const newData = data.data.list.map((i) => {
+            if (i.fileSize) {
+              i.fileSize = changeByteUnit(Number(i.fileSize));
+            } else {
+              i.fileSize = "";
+            }
+            this.materialItemCustomProcess(i);
+            return i;
+          });
+          this.list = this.list.concat(newData);
+          if (this.listRealLength === data.data.total) {
+            this.hasMoreData = false;
           }
-          this.materialItemCustomProcess(i)
-          return i;
-        });
-        this.list = this.list.concat(newData)
-        if (this.listRealLength === data.data.total) {
-          this.hasMoreData = false
+          this.isRequestingMoreData = false;
+          this.latestUsedSearchKey = latestUsedSearchKey;
+        },
+        () => {
+          this.isRequestingMoreData = false;
+          this.latestUsedSearchKey = latestUsedSearchKey;
         }
-        this.isRequestingMoreData = false
-        this.latestUsedSearchKey = latestUsedSearchKey
-      }, () => {
-        this.isRequestingMoreData = false
-        this.latestUsedSearchKey = latestUsedSearchKey
-      });
+      );
     },
-    refreshMaterialList: debounce(function (type) {
-      this.isRequestingMoreData = false
-      this.hasMoreData = true
-      this.list = []
-      if (this.canUpload) {
-        let filterResult = this.uploadStatusList.filter((item) => {
-          return item.status === 'LOADING'
-        })
-        const capitalizedMaterialType = capitalize(this.materialType)
-        this.$store.commit(`setUploadStatusList${capitalizedMaterialType}`, filterResult)
-      }
-      this.requestMoreData()
-    }, 500, false),
+    refreshMaterialList: debounce(
+      function (type) {
+        this.isRequestingMoreData = false;
+        this.hasMoreData = true;
+        this.list = [];
+        if (this.canUpload) {
+          let filterResult = this.uploadStatusList.filter((item) => {
+            return item.status === "LOADING";
+          });
+          const capitalizedMaterialType = capitalize(this.materialType);
+          this.$store.commit(
+            `setUploadStatusList${capitalizedMaterialType}`,
+            filterResult
+          );
+        }
+        this.requestMoreData();
+      },
+      500,
+      false
+    ),
     onFileInputChange(e) {
       e.files.forEach(async (eachFile, i) => {
-        if (
-          this.fileInputAcceptType.indexOf(eachFile.type) <= -1
-        ) {
-          console.log('格式不对！');
+        if (this.fileInputAcceptType.indexOf(eachFile.type) <= -1) {
+          console.log("格式不对！");
           setTimeout(() => {
             this.$msg({
               message: `“${eachFile.name}”${this.fileInputFailString}`,
@@ -615,30 +647,34 @@ export default {
           return;
         }
 
-        if (eachFile.name.substring(0, eachFile.name.lastIndexOf(".")).length > 50) {
+        if (
+          eachFile.name.substring(0, eachFile.name.lastIndexOf(".")).length > 50
+        ) {
           setTimeout(() => {
             this.$msg({
-              message: `“${eachFile.name}”${this.$i18n.t(`gather.too_long_word`)}`,
+              message: `“${eachFile.name}”${this.$i18n.t(
+                `gather.too_long_word`
+              )}`,
               type: "warning",
             });
           }, i * 100);
           return;
         }
 
-        const customCheckRes = await this.fileInputCustomCheck(eachFile, i)
+        const customCheckRes = await this.fileInputCustomCheck(eachFile, i);
         if (!customCheckRes) {
-          return
+          return;
         }
 
         let itemInUploadList = {
           title: eachFile.name,
           ifKnowProgress: true,
           progress: 0,
-          status: 'LOADING',
+          status: "LOADING",
           statusText: this.$i18n.t(`gather.uploading_material`),
           uid: `u_${this.$randomWord(true, 8, 8)}`,
           abortHandler: null,
-          backendId: '', // 只用于全景图上传
+          backendId: "", // 只用于全景图上传
           parentFolderId: this.currentFolderId,
         };
 
@@ -649,77 +685,88 @@ export default {
             tempId: itemInUploadList.uid,
             type: this.materialType,
           },
-          (response) => { // 上传成功
+          (response) => {
+            // 上传成功
             if (response.code !== 0) {
-              console.error('上传接口响应异常：', response);
-              return
+              console.error("上传接口响应异常：", response);
+              return;
             }
-            console.log('上传成功');
+            console.log("上传成功");
             if (this.fileUploadLongPollingCb) {
-              itemInUploadList.statusText = this.fileUploadLongPollingStatusText
-              itemInUploadList.ifKnowProgress = false
-              itemInUploadList.backendId = response.data.id
+              itemInUploadList.statusText =
+                this.fileUploadLongPollingStatusText;
+              itemInUploadList.ifKnowProgress = false;
+              itemInUploadList.backendId = response.data.id;
             } else {
-              itemInUploadList.status = 'SUCCESS'
+              itemInUploadList.status = "SUCCESS";
               if (response.data.fileSize) {
-                response.data.fileSize = changeByteUnit(Number(response.fileSize));
+                response.data.fileSize = changeByteUnit(
+                  Number(response.fileSize)
+                );
               } else {
-                response.data.fileSize = ''
+                response.data.fileSize = "";
               }
-              itemInUploadList.successInfo = response.data
+              itemInUploadList.successInfo = response.data;
             }
           },
           (err) => {
-            if (err.statusText === 'abort') { // 用户取消了上传任务。
-              console.log('用户取消了任务！');
+            if (err.statusText === "abort") {
+              // 用户取消了上传任务。
+              console.log("用户取消了任务！");
               const index = this.uploadStatusList.findIndex((eachItem) => {
-                return eachItem.uid === itemInUploadList.uid
-              })
-              this.uploadStatusList.splice(index, 1)
+                return eachItem.uid === itemInUploadList.uid;
+              });
+              this.uploadStatusList.splice(index, 1);
             } else {
-              console.log('上传失败！');
-              itemInUploadList.status = 'FAIL'
-              itemInUploadList.statusText = this.$i18n.t(`gather.material_upload_fail`)
+              console.log("上传失败！");
+              itemInUploadList.status = "FAIL";
+              itemInUploadList.statusText = this.$i18n.t(
+                `gather.material_upload_fail`
+              );
             }
           },
           (progress) => {
-            console.log('进度：', progress);
-            itemInUploadList.progress = progress
+            console.log("进度：", progress);
+            itemInUploadList.progress = progress;
           }
-        )
+        );
 
         // this.uploadStatusList.unshift(itemInUploadList);
         this.refreshMaterialList();
-      })
+      });
     },
     onClickRow(e) {
-      const checkboxNodeList = e.currentTarget.getElementsByClassName('selection-click-target')
+      const checkboxNodeList = e.currentTarget.getElementsByClassName(
+        "selection-click-target"
+      );
       if (checkboxNodeList && checkboxNodeList[0]) {
-        checkboxNodeList[0].click()
+        checkboxNodeList[0].click();
       }
     },
     onClickUpload() {
       checkUserSize({}, (data) => {
         //判断已用是否大于3G
-        if ((data.data / 1024 / 1024) > 3) {
-          this.$alert({ content: this.$i18n.t('tips_code.FAILURE_3024')});
+        if (data.data / 1024 / 1024 > 3) {
+          this.$alert({ content: this.$i18n.t("tips_code.FAILURE_3024") });
         } else {
-          this.$refs['file-input'].click()
+          this.$refs["file-input"].click();
         }
-      })
+      });
     },
   },
-  mounted() {
-  },
+  mounted() {},
   beforeDestroy() {
     if (this.canUpload) {
-      const capitalizedMaterialType = capitalize(this.materialType)
-      this.$store.commit(`setUploadStatusList${capitalizedMaterialType}`, this.uploadStatusList.filter((item) => {
-        return item.status === 'LOADING'
-      }))
+      const capitalizedMaterialType = capitalize(this.materialType);
+      this.$store.commit(
+        `setUploadStatusList${capitalizedMaterialType}`,
+        this.uploadStatusList.filter((item) => {
+          return item.status === "LOADING";
+        })
+      );
     }
-  }
-}
+  },
+};
 </script>
 
 <style lang="less" scoped>
@@ -744,7 +791,6 @@ export default {
   @table-head-row-height: 0px;
   @table-border-size: 0px;
 
-
   .table {
     margin-top: 10px;
     // border: @table-border-size solid #EBEDF0;
@@ -768,8 +814,11 @@ export default {
     //   }
     // }
 
-    >.table-body {
-      height: calc(@table-height - @table-head-row-height - @table-border-size - @table-border-size);
+    > .table-body {
+      height: calc(
+        @table-height - @table-head-row-height - @table-border-size -
+          @table-border-size
+      );
       overflow: auto;
       display: inline-block;
       width: 100%;
@@ -782,9 +831,9 @@ export default {
         border-radius: 4px;
         cursor: pointer;
         &:hover {
-          background: #F7F8FA;
+          background: #f7f8fa;
         }
-        >.table-data {
+        > .table-data {
           font-size: 14px;
           line-height: 50px;
           height: 100%;
@@ -801,13 +850,13 @@ export default {
           &:last-of-type {
             padding-right: 10px;
           }
-          >.list-img {
+          > .list-img {
             position: relative;
             height: 100%;
             display: inline-block;
             width: 100%;
 
-            >img,
+            > img,
             .audio-player {
               position: absolute;
               top: 50%;
@@ -874,31 +923,34 @@ export default {
       }
     }
 
-    >.no-data {
-      height: calc(@table-height - @table-head-row-height - @table-border-size - @table-border-size);
+    > .no-data {
+      height: calc(
+        @table-height - @table-head-row-height - @table-border-size -
+          @table-border-size
+      );
       width: 100%;
       position: relative;
 
-      >div {
+      > div {
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         text-align: center;
 
-        >img {
+        > img {
           width: 116px;
         }
 
-        >span {
+        > span {
           margin-top: 20px;
           display: block;
           font-size: 14px;
           color: #646566;
         }
 
-        >a {
-          >button {
+        > a {
+          > button {
             margin-top: 20px;
           }
         }
@@ -918,7 +970,7 @@ export default {
       display: flex;
       align-items: center;
 
-      >span {
+      > span {
         display: inline-block;
         margin-right: 4px;
       }
@@ -936,8 +988,13 @@ export default {
   .ellipsis {
   }
   .crumbs {
+    // display: none;
+    ul > li .name {
+      max-width: 80px;
+      display: block;
+    }
   }
-  
+
   .table {
     // border: @table-border-size solid #EBEDF0;
     // >.table-head-row {
@@ -950,16 +1007,16 @@ export default {
     //   }
     // }
 
-    >.table-body {
+    > .table-body {
       .table-body-row {
         // border-bottom: 1px solid #EBEDF0;
         &:hover {
           background: #252526;
         }
-        >.table-data {
+        > .table-data {
           color: #fff;
-          >.list-img {
-            >img,
+          > .list-img {
+            > img,
             .audio-player {
               &.folderIcon {
               }
@@ -969,15 +1026,15 @@ export default {
       }
     }
 
-    >.no-data {
-      >div {
-        >img {
+    > .no-data {
+      > div {
+        > img {
         }
-        >span {
+        > span {
           color: rgba(255, 255, 255, 0.6);
         }
-        >a {
-          >button {
+        > a {
+          > button {
           }
         }
       }
@@ -989,11 +1046,28 @@ export default {
 
   .btns {
     .upload-btn {
-      >span {
+      > span {
       }
       i.tool-tip-for-editor {
       }
     }
   }
 }
-</style>
+</style>
+
+<style lang="less">
+.material-list.dark {
+  .crumbs {
+    // display: none;
+    ul > li {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      .name {
+        max-width: 180px;
+        display: block;
+      }
+    }
+  }
+}
+</style>

packages/qjkankan-editor/src/views/material/audio/index.vue

@@ -418,6 +418,13 @@ export default {
               const index = this.list.findIndex((eachItem) => {
                 return eachItem.id === item.id;
               });
+              //去掉已存在移动的id
+              const alreadySelectIndex = this.selectedList.findIndex(
+                (i) => i.id === item.id
+              );
+              if (alreadySelectIndex > -1) {
+                this.selectedList.splice(alreadySelectIndex, 1);
+              }
               if (index >= 0) {
                 this.list.splice(index, 1);
                 const newData = data.data.list.map((i) => {
@@ -464,6 +471,13 @@ export default {
                   const index = this.list.findIndex((eachItem) => {
                     return eachItem.id === item.id;
                   });
+                  //去掉已存在移动的id
+                  const alreadySelectIndex = this.selectedList.findIndex(
+                    (i) => i.id === item.id
+                  );
+                  if (alreadySelectIndex > -1) {
+                    this.selectedList.splice(alreadySelectIndex, 1);
+                  }
                   if (index >= 0) {
                     this.list.splice(index, 1);
                     const newData = data.data.list.map((i) => {

packages/qjkankan-editor/src/views/material/folderMixinFactory.js

@@ -148,8 +148,8 @@ export default function (materialType) {
           type: materialType,
         }).then((res) => {
           this.folderTree = res.data
-          console.log('onClickMoveFolder->>', res.data)
-          if (this.folderTree.length === 0) {
+          console.log('onClickMoveFolder->>', res.data,this.folderTree);
+          if (this.folderTree.children.length === 0) {
             this.$confirm({
               title: this.$i18n.t('gather.move_folder_to'),
               content: this.$i18n.t('gather.no_folder_need_create'),

packages/qjkankan-editor/src/views/material/image/index.vue

@@ -419,6 +419,13 @@ export default {
               const index = this.list.findIndex((eachItem) => {
                 return eachItem.id === item.id;
               });
+              //去掉已存在移动的id
+              const alreadySelectIndex = this.selectedList.findIndex(
+                (i) => i.id === item.id
+              );
+              if (alreadySelectIndex > -1) {
+                this.selectedList.splice(alreadySelectIndex, 1);
+              }
               if (index >= 0) {
                 this.list.splice(index, 1);
                 const newData = data.data.list.map((i) => {
@@ -467,6 +474,14 @@ export default {
                   const index = this.list.findIndex((eachItem) => {
                     return eachItem.id === item.id;
                   });
+                  //去掉已存在移动的id
+                  const alreadySelectIndex = this.selectedList.findIndex(
+                    (i) => i.id === item.id
+                  );
+                  if (alreadySelectIndex > -1) {
+                    this.selectedList.splice(alreadySelectIndex, 1);
+                  }
+
                   if (index >= 0) {
                     this.list.splice(index, 1);
                     const newData = data.data.list.map((i) => {

packages/qjkankan-editor/src/views/material/pano/index.vue

@@ -547,7 +547,6 @@ export default {
         this.delFolder(
           item.id,
           (lastestUsedSearchKey) => {
-            debugger;
             getMaterialList(
               {
                 dirId: this.currentFolderId,
@@ -560,6 +559,13 @@ export default {
                 const index = this.list.findIndex((eachItem) => {
                   return eachItem.id === item.id;
                 });
+                //去掉已存在移动的id
+                const alreadySelectIndex = this.selectedList.findIndex(
+                  (i) => i.id === item.id
+                );
+                if (alreadySelectIndex > -1) {
+                  this.selectedList.splice(alreadySelectIndex, 1);
+                }
                 if (index >= 0) {
                   this.list.splice(index, 1);
                   const newData = data.data.list.map((i) => {
@@ -612,6 +618,13 @@ export default {
                   const index = this.list.findIndex((eachItem) => {
                     return eachItem.id === item.id;
                   });
+                  //去掉已存在移动的id
+                  const alreadySelectIndex = this.selectedList.findIndex(
+                    (i) => i.id === item.id
+                  );
+                  if (alreadySelectIndex > -1) {
+                    this.selectedList.splice(alreadySelectIndex, 1);
+                  }
                   if (index >= 0) {
                     this.list.splice(index, 1);
                     const newData = data.data.list.map((i) => {
@@ -653,9 +666,7 @@ export default {
         if (eachFile.type.indexOf("jpeg") <= -1) {
           setTimeout(() => {
             this.$msg({
-              message: `“${eachFile.name}”${i18n.t(
-                "gather.pano_fail"
-              )}`,
+              message: `“${eachFile.name}”${i18n.t("gather.pano_fail")}`,
               type: "warning",
             });
           }, i * 100);
@@ -675,7 +686,7 @@ export default {
               type: "warning",
             });
           }, i * 100);
-          
+
           return;
         }
 

packages/qjkankan-editor/src/views/material/video/index.vue

@@ -7,7 +7,9 @@
         :rootName="$i18n.t('gather.video')"
         @click-path="onClickPath"
       />
-      <div v-if="lastestUsedSearchKey" class="">{{$i18n.t("gather.video")}}</div>
+      <div v-if="lastestUsedSearchKey" class="">
+        {{ $i18n.t("gather.video") }}
+      </div>
     </div>
     <div class="second-line">
       <template v-if="!searchKey">
@@ -17,11 +19,8 @@
             @click="onUploadFile"
             class="ui-button submit"
           >
-            <span>{{upload_material}}</span>
-            <i
-              class="iconfont icon-material_prompt"
-              v-tooltip="video_size"
-            />
+            <span>{{ upload_material }}</span>
+            <i class="iconfont icon-material_prompt" v-tooltip="video_size" />
             <upload
               ref="uploadFile"
               :failString="video_limit"
@@ -33,31 +32,36 @@
             ></upload>
           </button>
         </div>
-        <button
-          class="ui-button submit"
-          @click="isShowNewFolder = true"
-        >
-          {{$i18n.t(`gather.new_folder`)}}
+        <button class="ui-button submit" @click="isShowNewFolder = true">
+          {{ $i18n.t(`gather.new_folder`) }}
         </button>
         <button
           class="ui-button cancel"
-          :class="{disable: selectedList.length === 0}"
+          :class="{ disable: selectedList.length === 0 }"
           @click="onClickMoveFolder"
         >
-          {{$i18n.t(`gather.move_folder`)}}
+          {{ $i18n.t(`gather.move_folder`) }}
         </button>
       </template>
       <div class="filter">
-          <div :class="{active: isFilterFocus}" @focusin="onFilterFocus" @focusout="onFilterBlur">
-            <i class="iconfont icon-works_search search"></i>
-            <input
-              type="text"
-              v-model="searchKey"
-              :placeholder="serch_material"
-            />
-            <i v-if="searchKey" @click="searchKey=''" class="iconfont icontoast_red del"></i>
-          </div>
+        <div
+          :class="{ active: isFilterFocus }"
+          @focusin="onFilterFocus"
+          @focusout="onFilterBlur"
+        >
+          <i class="iconfont icon-works_search search"></i>
+          <input
+            type="text"
+            v-model="searchKey"
+            :placeholder="serch_material"
+          />
+          <i
+            v-if="searchKey"
+            @click="searchKey = ''"
+            class="iconfont icontoast_red del"
+          ></i>
         </div>
+      </div>
     </div>
     <div class="list">
       <tableList
@@ -77,17 +81,21 @@
       >
         <!-- 插到tableList组件各个header插槽，并通过插槽的headerItem作用域拿到表头各项 -->
         <div slot-scope="{ headerItem }" slot="header">
-          {{ headerItem.name && $i18n.t(`zh_key.${headerItem.name}`)  }}
+          {{ headerItem.name && $i18n.t(`zh_key.${headerItem.name}`) }}
         </div>
         <!-- 内容各单元格 -->
-        <div slot-scope="{ itemData, lineData, headerItem }" slot="tableItem" style="width: 100%">
+        <div
+          slot-scope="{ itemData, lineData, headerItem }"
+          slot="tableItem"
+          style="width: 100%"
+        >
           <div class="handle" v-if="headerItem.canclick">
             <i
               class="iconfont icon-material_operation_editor hover-tips"
               @click="onClickRename(lineData)"
             >
               <div>
-                <div class="remark">{{rename}}</div>
+                <div class="remark">{{ rename }}</div>
               </div>
             </i>
             <i
@@ -95,7 +103,7 @@
               @click="del(lineData)"
             >
               <div>
-                <div class="remark">{{deltips}}</div>
+                <div class="remark">{{ deltips }}</div>
               </div>
             </i>
           </div>
@@ -120,18 +128,10 @@
             />
           </div>
 
-
-
           <!-- 文字型单元格 -->
-          <div
-            v-else
-            class="textItem"
-          >
-          
-          
+          <div v-else class="textItem">
             <!-- 名称 -->
             <div v-if="headerItem.key === 'name'" class="name">
-              
               <!-- 不是搜索出来的 -->
               <div v-if="!lastestUsedSearchKey" class="not-search-res">
                 <!-- 文件夹名称 -->
@@ -148,22 +148,25 @@
                 </div>
               </div>
               <!-- end of 不是搜索出来的 -->
-              
+
               <!-- 搜索出来的 -->
               <div v-if="lastestUsedSearchKey" class="search-res">
                 <!-- 文件夹名称 -->
-                <div
-                  v-if="lineData.type === 'dir'"
-                  class="dirName"
-                >
-                  <div
-                    class="self-name"
-                    @click="onClickFolder(lineData)"
-                  >
+                <div v-if="lineData.type === 'dir'" class="dirName">
+                  <div class="self-name" @click="onClickFolder(lineData)">
                     {{ itemData || "-" }}
                   </div>
                   <div class="parent-name-wrap">
-                    目录 <span class="parent-name" @click="onClickParentFolder(lineData)">{{lineData.dirId === 1 ? $i18n.t('gather.root_dir') : lineData.dirName}}</span>
+                    目录
+                    <span
+                      class="parent-name"
+                      @click="onClickParentFolder(lineData)"
+                      >{{
+                        lineData.dirId === 1
+                          ? $i18n.t("gather.root_dir")
+                          : lineData.dirName
+                      }}</span
+                    >
                   </div>
                 </div>
                 <!-- 素材名称 -->
@@ -172,28 +175,30 @@
                     {{ itemData || "-" }}
                   </div>
                   <div class="parent-name-wrap">
-                    目录 <span class="parent-name" @click="onClickParentFolder(lineData)">{{lineData.dirId === 1 ? $i18n.t('gather.root_dir') : lineData.dirName}}</span>
+                    目录
+                    <span
+                      class="parent-name"
+                      @click="onClickParentFolder(lineData)"
+                      >{{
+                        lineData.dirId === 1
+                          ? $i18n.t("gather.root_dir")
+                          : lineData.dirName
+                      }}</span
+                    >
                   </div>
                 </div>
               </div>
               <!-- end of 搜索出来的 -->
-              
             </div>
             <!-- end of 名称 -->
-            
-            
+
             <!-- 不是名称 -->
             <div v-else class="not-name">
               {{ itemData || "-" }}
             </div>
             <!-- end of 不是名称 -->
-
-            
           </div>
           <!-- end of 文字型单元格 -->
-
-
-
         </div>
       </tableList>
       <UploadTaskList
@@ -203,28 +208,38 @@
         :targetFolderId="lastestUsedSearchKey ? -1 : currentFolderId"
         @cancel-task="onCancelTask"
       />
-      <div class="total-number" v-if="list.length !== 0 || hasMoreData">{{had_load}}</div>
-      <div class="nodata" v-if="list.length == 0 && !hasMoreData && lastestUsedSearchKey">
+      <div class="total-number" v-if="list.length !== 0 || hasMoreData">
+        {{ had_load }}
+      </div>
+      <div
+        class="nodata"
+        v-if="list.length == 0 && !hasMoreData && lastestUsedSearchKey"
+      >
         <img :src="$noresult" alt="" />
-        <span>{{no_serch_result}}</span>
+        <span>{{ no_serch_result }}</span>
       </div>
-      <div class="nodata" v-if="list.length == 0 && !hasMoreData && !lastestUsedSearchKey">
+      <div
+        class="nodata"
+        v-if="list.length == 0 && !hasMoreData && !lastestUsedSearchKey"
+      >
         <img :src="config.empty" alt="" />
-        <span>{{no_material_result}}</span>
-        <button @click="$refs.uploadFile.click()" class="upload-btn-in-table">{{upload_material}}</button>
+        <span>{{ no_material_result }}</span>
+        <button @click="$refs.uploadFile.click()" class="upload-btn-in-table">
+          {{ upload_material }}
+        </button>
       </div>
     </div>
 
     <CreateFolder
       v-if="isShowNewFolder"
-      :validate=validateNewFolderName
+      :validate="validateNewFolderName"
       @close="isShowNewFolder = false"
       @submit="onSubmitNewFolder"
     />
     <RenameFolder
       v-if="isShowRenameFolder"
       :oldName="popupItem.name"
-      :validate=validateRenameFolderName
+      :validate="validateRenameFolderName"
       @close="isShowRenameFolder = false"
       @submit="onSubmitRenameFolder"
     />
@@ -241,10 +256,7 @@
       @rename="handleRename"
       @close="showRename = false"
     />
-    <preview
-      ref="video-previewer"
-      :item="popupItem"
-    />
+    <preview ref="video-previewer" :item="popupItem" />
   </div>
 </template>
 
@@ -258,9 +270,9 @@ import Upload from "@/components/shared/uploads/UploadMultiple";
 import { changeByteUnit } from "@/utils/file";
 import preview from "../popup/videoPreviewer.vue";
 import UploadTaskList from "../components/uploadList1.1.0.vue";
-import { debounce } from "@/utils/other.js"
-import { mapState } from 'vuex';
-import {i18n} from "@/lang"
+import { debounce } from "@/utils/other.js";
+import { mapState } from "vuex";
+import { i18n } from "@/lang";
 import folderMixinFactory from "../folderMixinFactory.js";
 
 import {
@@ -268,17 +280,15 @@ import {
   uploadMaterial,
   editMaterial,
   delMaterial,
-  checkUserSize
+  checkUserSize,
 } from "@/api";
 
 const TYPE = "video";
 
-const folderMixin = folderMixinFactory(TYPE)
+const folderMixin = folderMixinFactory(TYPE);
 
 export default {
-  mixins: [
-    folderMixin,
-  ],
+  mixins: [folderMixin],
   components: {
     tableList,
     preview,
@@ -299,7 +309,6 @@ export default {
       no_serch_result: i18n.t("gather.no_serch_result"),
       no_material_result: i18n.t("gather.no_material_result"),
 
-
       config,
       showRename: false,
       showList: false,
@@ -307,7 +316,7 @@ export default {
       tabHeader: data,
 
       // 因为searchKey的变化经过debounce、异步请求的延时，才会反映到数据列表的变化上，所以是否显示、显示哪种无数据提示，也要等到数据列表变化后，根据数据列表是否为空，以及引发本次变化的那个searchKey瞬时值来决定。本变量就是用来保存那个瞬时值。
-      lastestUsedSearchKey: '',
+      lastestUsedSearchKey: "",
       isFilterFocus: false,
       searchKey: "",
       list: [],
@@ -317,51 +326,58 @@ export default {
   },
   computed: {
     ...mapState({
-      uploadListForUI: 'uploadStatusListVideo',
+      uploadListForUI: "uploadStatusListVideo",
     }),
-    had_load(){
-      return i18n.t("gather.had_load",{msg:this.list.length})
-    }
-  },
-  mounted() {
+    had_load() {
+      return i18n.t("gather.had_load", { msg: this.list.length });
+    },
   },
+  mounted() {},
   watch: {
     searchKey: {
       handler: function () {
-        this.refreshListDebounced()
+        this.refreshListDebounced();
       },
       immediate: false,
     },
   },
   methods: {
-    onUploadFile(){
-      checkUserSize({},(data)=>{
+    onUploadFile() {
+      checkUserSize({}, (data) => {
         //判断已用是否大于3G
-        if ((data.data / 1024 / 1024) > 3) {
+        if (data.data / 1024 / 1024 > 3) {
           this.$alert({ content: i18n.t("tips_code.FAILURE_3024") });
-        }else{
-          this.$refs.uploadFile.click()
+        } else {
+          this.$refs.uploadFile.click();
         }
-      })
+      });
     },
     previewVedio(clickItem) {
       const index = this.list.findIndex((eachItem) => {
-        return eachItem.id === clickItem.id
-      })
-      index >= 0 && this.$refs['video-previewer'].show(this.list[index].name, this.list[index].ossPath)
+        return eachItem.id === clickItem.id;
+      });
+      index >= 0 &&
+        this.$refs["video-previewer"].show(
+          this.list[index].name,
+          this.list[index].ossPath
+        );
     },
     onFilterFocus() {
-      this.isFilterFocus = true
+      this.isFilterFocus = true;
     },
     onFilterBlur() {
-      this.isFilterFocus = false
+      this.isFilterFocus = false;
     },
-    refreshListDebounced: debounce(function() {
-      this.list = []
-      this.isRequestingMoreData = false
-      this.hasMoreData = true
-      this.$refs['table-list'].requestMoreData()
-    }, 500, false),
+    refreshListDebounced: debounce(
+      function () {
+        this.list = [];
+        this.isRequestingMoreData = false;
+        this.hasMoreData = true;
+        this.$refs["table-list"].requestMoreData();
+      },
+      500,
+      false
+    ),
     handleRename(newName) {
       editMaterial(
         {
@@ -371,12 +387,12 @@ export default {
         () => {
           this.$msg.success(i18n.t("gather.edit_success"));
           const index = this.list.findIndex((eachItem) => {
-            return eachItem.id === this.popupItem.id
-          })
+            return eachItem.id === this.popupItem.id;
+          });
           if (index >= 0) {
-            this.list[index].name = newName
+            this.list[index].name = newName;
           } else {
-            console.error('在素材列表里没找到要重命名的那一项！');
+            console.error("在素材列表里没找到要重命名的那一项！");
           }
           this.showRename = false;
           this.popupItem = null;
@@ -384,15 +400,15 @@ export default {
       );
     },
     onClickRename(lineData) {
-      this.popupItem = lineData
-      if (lineData.type !== 'dir') {
-        this.showRename = true
+      this.popupItem = lineData;
+      if (lineData.type !== "dir") {
+        this.showRename = true;
       } else {
-        this.isShowRenameFolder = true
+        this.isShowRenameFolder = true;
       }
     },
     del(item) {
-      if (item.type === 'dir') {
+      if (item.type === "dir") {
         this.delFolder(item.id, (lastestUsedSearchKey) => {
           getMaterialList(
             {
@@ -404,32 +420,39 @@ export default {
             },
             (data) => {
               const index = this.list.findIndex((eachItem) => {
-                return eachItem.id === item.id
-              })
+                return eachItem.id === item.id;
+              });
+              //去掉已存在移动的id
+              const alreadySelectIndex = this.selectedList.findIndex(
+                (i) => i.id === item.id
+              );
+              if (alreadySelectIndex > -1) {
+                this.selectedList.splice(alreadySelectIndex, 1);
+              }
               if (index >= 0) {
-                this.list.splice(index, 1)
+                this.list.splice(index, 1);
                 const newData = data.data.list.map((i) => {
                   i.fileSize = changeByteUnit(Number(i.fileSize));
                   i.icon = i.ossPath + this.$videoImg;
                   return i;
                 });
-                this.list = this.list.concat(newData)
+                this.list = this.list.concat(newData);
                 if (this.list.length === data.data.total) {
-                  this.hasMoreData = false
+                  this.hasMoreData = false;
                 }
               } else {
-                console.error('在素材列表里没找到要删除的那一项！');
+                console.error("在素材列表里没找到要删除的那一项！");
               }
 
-              this.isRequestingMoreData = false
-              this.lastestUsedSearchKey = lastestUsedSearchKey
+              this.isRequestingMoreData = false;
+              this.lastestUsedSearchKey = lastestUsedSearchKey;
             },
             () => {
-              this.lastestUsedSearchKey = lastestUsedSearchKey
-              this.isRequestingMoreData = false
+              this.lastestUsedSearchKey = lastestUsedSearchKey;
+              this.isRequestingMoreData = false;
             }
-          )
-        })
+          );
+        });
       } else {
         this.$confirm({
           title: i18n.t("gather.delete_material"),
@@ -438,8 +461,8 @@ export default {
           ok: () => {
             delMaterial(item.id, () => {
               this.$msg.success(i18n.t("gather.delete_success"));
-              this.isRequestingMoreData = true
-              const lastestUsedSearchKey = this.searchKey
+              this.isRequestingMoreData = true;
+              const lastestUsedSearchKey = this.searchKey;
               getMaterialList(
                 {
                   dirId: this.currentFolderId,
@@ -450,31 +473,38 @@ export default {
                 },
                 (data) => {
                   const index = this.list.findIndex((eachItem) => {
-                    return eachItem.id === item.id
-                  })
+                    return eachItem.id === item.id;
+                  });
+                  //去掉已存在移动的id
+                  const alreadySelectIndex = this.selectedList.findIndex(
+                    (i) => i.id === item.id
+                  );
+                  if (alreadySelectIndex > -1) {
+                    this.selectedList.splice(alreadySelectIndex, 1);
+                  }
                   if (index >= 0) {
-                    this.list.splice(index, 1)
+                    this.list.splice(index, 1);
                     const newData = data.data.list.map((i) => {
                       i.fileSize = changeByteUnit(Number(i.fileSize));
                       i.icon = i.ossPath + this.$videoImg;
                       return i;
                     });
-                    this.list = this.list.concat(newData)
+                    this.list = this.list.concat(newData);
                     if (this.list.length === data.data.total) {
-                      this.hasMoreData = false
+                      this.hasMoreData = false;
                     }
                   } else {
-                    console.error('在素材列表里没找到要删除的那一项！');
+                    console.error("在素材列表里没找到要删除的那一项！");
                   }
 
-                  this.isRequestingMoreData = false
-                  this.lastestUsedSearchKey = lastestUsedSearchKey
+                  this.isRequestingMoreData = false;
+                  this.lastestUsedSearchKey = lastestUsedSearchKey;
                 },
                 () => {
-                  this.lastestUsedSearchKey = lastestUsedSearchKey
-                  this.isRequestingMoreData = false
+                  this.lastestUsedSearchKey = lastestUsedSearchKey;
+                  this.isRequestingMoreData = false;
                 }
-              )
+              );
             });
           },
         });
@@ -492,7 +522,9 @@ export default {
           return;
         }
 
-        if (eachFile.name.substring(0, eachFile.name.lastIndexOf(".")).length > 50) {
+        if (
+          eachFile.name.substring(0, eachFile.name.lastIndexOf(".")).length > 50
+        ) {
           setTimeout(() => {
             this.$msg({
               message: `“${
@@ -510,13 +542,13 @@ export default {
           title: eachFile.name,
           ifKnowProgress: true,
           progress: 0,
-          status: 'LOADING',
+          status: "LOADING",
           statusText: i18n.t("gather.uploading_material"),
           uid: `u_${this.$randomWord(true, 8, 8)}`,
           abortHandler: null,
           parentFolderId: this.currentFolderId,
         };
-        
+
         itemInUploadList.abortHandler = uploadMaterial(
           {
             dirId: this.currentFolderId,
@@ -524,26 +556,30 @@ export default {
             temId: itemInUploadList.uid,
             type: TYPE,
           },
-          () => { // 上传成功
+          () => {
+            // 上传成功
             const index = this.uploadListForUI.findIndex((eachItem) => {
-              return eachItem.uid === itemInUploadList.uid
-            })
-            this.uploadListForUI.splice(index, 1)
-            this.refreshListDebounced()
+              return eachItem.uid === itemInUploadList.uid;
+            });
+            this.uploadListForUI.splice(index, 1);
+            this.refreshListDebounced();
           },
           (err) => {
-            if (err.statusText === 'abort') { // 用户取消了上传任务。
+            if (err.statusText === "abort") {
+              // 用户取消了上传任务。
               const index = this.uploadListForUI.findIndex((eachItem) => {
-                return eachItem.uid === itemInUploadList.uid
-              })
-              this.uploadListForUI.splice(index, 1)
+                return eachItem.uid === itemInUploadList.uid;
+              });
+              this.uploadListForUI.splice(index, 1);
             } else {
-              itemInUploadList.status = 'FAIL'
-              itemInUploadList.statusText = i18n.t("gather.material_upload_fail")
+              itemInUploadList.status = "FAIL";
+              itemInUploadList.statusText = i18n.t(
+                "gather.material_upload_fail"
+              );
             }
           },
           (progress) => {
-            itemInUploadList.progress = progress
+            itemInUploadList.progress = progress;
           }
         );
 
@@ -552,17 +588,17 @@ export default {
     },
     onCancelTask(uid) {
       const index = this.uploadListForUI.findIndex((eachItem) => {
-        return eachItem.uid === uid
-      })
-      if (this.uploadListForUI[index].status === 'LOADING') {
-        this.uploadListForUI[index].abortHandler.abort()
+        return eachItem.uid === uid;
+      });
+      if (this.uploadListForUI[index].status === "LOADING") {
+        this.uploadListForUI[index].abortHandler.abort();
       } else {
-        this.uploadListForUI.splice(index, 1)
+        this.uploadListForUI.splice(index, 1);
       }
     },
     getMoreMaterialItem() {
-      this.isRequestingMoreData = true
-      const lastestUsedSearchKey = this.searchKey
+      this.isRequestingMoreData = true;
+      const lastestUsedSearchKey = this.searchKey;
       getMaterialList(
         {
           dirId: this.currentFolderId,
@@ -573,22 +609,25 @@ export default {
         },
         (data) => {
           const newData = data.data.list.map((i) => {
-            if (i.type !== 'dir') {
+            if (i.type !== "dir") {
               i.fileSize = changeByteUnit(Number(i.fileSize));
             }
-            i.icon = process.env.VUE_APP_ORIGIN=='aws' ? i.icon : (i.ossPath + this.$videoImg);
+            i.icon =
+              process.env.VUE_APP_ORIGIN == "aws"
+                ? i.icon
+                : i.ossPath + this.$videoImg;
             return i;
           });
-          this.list = this.list.concat(newData)
+          this.list = this.list.concat(newData);
           if (this.list.length === data.data.total) {
-            this.hasMoreData = false
+            this.hasMoreData = false;
           }
-          this.isRequestingMoreData = false
-          this.lastestUsedSearchKey = lastestUsedSearchKey
+          this.isRequestingMoreData = false;
+          this.lastestUsedSearchKey = lastestUsedSearchKey;
         },
         () => {
-          this.isRequestingMoreData = false
-          this.lastestUsedSearchKey = lastestUsedSearchKey
+          this.isRequestingMoreData = false;
+          this.lastestUsedSearchKey = lastestUsedSearchKey;
         }
       );
     },
@@ -626,4 +665,4 @@ export default {
 </style>
 <style lang="less" scoped>
 @import "../style.less";
-</style>
+</style>