Home Explore Help
Sign In
CocoRoboLabs
/
r2r_pbl
3
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

update

lsc 5 months ago
parent
c17fa101dd
commit
86e578d0d0
17 changed files with 434 additions and 39 deletions
Split View Show Diff Stats
  1. 1 1
      dist/index.html
  2. 0 0
      dist/static/css/app.5ebcbc29d375b890aa2d8390e57137a4.css
  3. 0 0
      dist/static/css/app.5ebcbc29d375b890aa2d8390e57137a4.css.map
  4. 0 0
      dist/static/css/app.a7b2d655cbda7c7e4e23a0c209e1f8ba.css
  5. 0 0
      dist/static/css/app.a7b2d655cbda7c7e4e23a0c209e1f8ba.css.map
  6. 0 0
      dist/static/js/app.771e7c5cadeec4456ad3.js
  7. 0 0
      dist/static/js/app.771e7c5cadeec4456ad3.js.map
  8. 0 0
      dist/static/js/app.9f1333e3c0aacee369b1.js
  9. 0 0
      dist/static/js/app.9f1333e3c0aacee369b1.js.map
  10. 0 0
      dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map
  11. 16 0
      src/App.vue
  12. 151 0
      src/components/pages/knowledge/components/selectTag.vue
  13. 210 0
      src/components/pages/knowledge/components/selectTag2.vue
  14. 8 2
      src/components/pages/knowledge/fileBox.vue
  15. 8 2
      src/components/pages/knowledge/folder.vue
  16. 28 31
      src/components/pages/knowledge/folderDetail.vue
  17. 12 3
      src/components/pages/knowledge/folderFileBox.vue

+ 1 - 1
dist/index.html
View File 

@@ -32,7 +32,7 @@
 
       width: 100%;
 
       background: #e6eaf0;
 
       font-family: '黑体';
 
-    }</style><link href=./static/css/app.a7b2d655cbda7c7e4e23a0c209e1f8ba.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.114c70b69d26bbdf9624.js></script><script type=text/javascript src=./static/js/app.771e7c5cadeec4456ad3.js></script></body></html><script>function stopSafari() {
 
+    }</style><link href=./static/css/app.5ebcbc29d375b890aa2d8390e57137a4.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.114c70b69d26bbdf9624.js></script><script type=text/javascript src=./static/js/app.9f1333e3c0aacee369b1.js></script></body></html><script>function stopSafari() {
 
     //阻止safari浏览器双击放大功能
 
     let lastTouchEnd = 0  //更新手指弹起的时间
 
     document.documentElement.addEventListener("touchstart", function (event) {

File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.5ebcbc29d375b890aa2d8390e57137a4.css


File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.5ebcbc29d375b890aa2d8390e57137a4.css.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.a7b2d655cbda7c7e4e23a0c209e1f8ba.css


File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.a7b2d655cbda7c7e4e23a0c209e1f8ba.css.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.771e7c5cadeec4456ad3.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.771e7c5cadeec4456ad3.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.9f1333e3c0aacee369b1.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.9f1333e3c0aacee369b1.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map


+ 16 - 0
src/App.vue
View File 

@@ -545,4 +545,20 @@ html::-webkit-scrollbar-thumb {
 
   background: none;
 
   z-index: 99999;
 
 }
 
+
 
+.count-node {
 
+  position: absolute;
 
+  top: 2px;
 
+  display: none;
 
+  height: 24px;
 
+  padding: 0 8px;
 
+  line-height: 22px;
 
+  margin-left: 6px;
 
+  background-color: #f4f4f5;
 
+  border: 1px solid #e9e9eb;
 
+  border-radius: 4px;
 
+  color: #909399;
 
+  font-size: 12px;
 
+  box-sizing: border-box;
 
+}
 
 </style>

+ 151 - 0
src/components/pages/knowledge/components/selectTag.vue
View File 

@@ -0,0 +1,151 @@
 
+<template>
 
+  <main>
 
+    <el-select
 
+      ref="select"
 
+      v-model="values"
 
+      multiple
 
+      style="width:100%"
 
+      :placeholder="placeholder"
 
+      @change="handleChange"
 
+      @remove-tag="removeTag"
 
+    >
 
+      <el-option
 
+        v-for="item in options"
 
+        :key="item.id"
 
+        :disabled="disabled && item.id === Number(judgingCondition)"
 
+        :label="item.name"
 
+        :value="item.id"
 
+      />
 
+    </el-select>
 
+  </main>
 
+</template>
 
+<script>
 
+export default {
 
+  name: 'select-tags',
 
+  props: {
 
+    // 选项
 
+    options: {
 
+      type: Array,
 
+      default: () => []
 
+    },
 
+    // 选中的值
 
+    value: {
 
+      type: Array,
 
+      default: () => []
 
+    },
 
+    // 提示
 
+    placeholder: {
 
+      type: String,
 
+      default: '请选择'
 
+    },
 
+    // 是否禁用
 
+    disabled: {
 
+      type: Boolean,
 
+      default: false
 
+    },
 
+    // 判断条件
 
+    judgingCondition: {
 
+      type: String | Number,
 
+      default: ''
 
+    }
 
+  },
 
+  data() {
 
+    return {
 
+      observer: null,
 
+      hideDom: null
 
+    };
 
+  },
 
+  computed: {
 
+    /**
 
+     * @description 获取当前选中的值
 
+    */
 
+    values: {
 
+      get() {
 
+        return this.value;
 
+      },
 
+      set(val) {
 
+        this.$emit('input', val);
 
+      }
 
+    }
 
+  },
 
+  mounted() {
 
+    this.mutationObserver();
 
+  },
 
+  beforeDestroy() {
 
+    this.observer.disconnect();
 
+  },
 
+  methods: {
 
+    /**
 
+     * @description 监听tag变化
 
+     */
 
+    mutationObserver() {
 
+      const tagLIstDom = this.$refs.select.$el.querySelector('.el-select__tags');
 
+      const tagSpanDom = this.$refs.select.$el.querySelector('.el-select__tags > span');
 
+
 
+      // 创建隐藏的计数节点
 
+      this.hideDom = document.createElement('span');
 
+      this.hideDom.classList.add('count-node');
 
+      tagSpanDom.append(this.hideDom);
 
+
 
+      const config = { childList: true };
 
+
 
+      const callback = mutationsList => {
 
+        mutationsList.forEach(item => {
 
+          if (item.type === 'childList') {
 
+            const tagList = item.target.childNodes;
 
+            let tagWidth = 0;
 
+            let tagNum = 0;
 
+            let availableTagWidth = 0;
 
+
 
+            for (let i = 0; i < tagList.length; i++) {
 
+              const e = tagList[i];
 
+              if (tagWidth > tagLIstDom.offsetWidth) {
 
+                e.style.display = 'none';
 
+              } else {
 
+                e.style.display = 'inline-block';
 
+              }
 
+              tagWidth += e.offsetWidth + 5;
 
+
 
+              if (tagWidth > tagLIstDom.offsetWidth) {
 
+                e.style.display = 'none';
 
+              } else {
 
+                e.style.display = 'inline-block';
 
+              }
 
+
 
+              if (e.style.display !== 'none') {
 
+                tagNum++;
 
+                this.hideDom.style.display = 'none';
 
+                const margin = tagNum === 1 ? 0 : 7;
 
+                availableTagWidth += e.offsetWidth + margin;
 
+              } else {
 
+                this.hideDom.style.display = 'inline-block';
 
+                this.hideDom.style.left = `${availableTagWidth}px`;
 
+                this.hideDom.innerHTML = `+${tagList.length - tagNum}`;
 
+              }
 
+            }
 
+          }
 
+        });
 
+      };
 
+
 
+      this.observer = new MutationObserver(callback);
 
+      this.observer.observe(tagSpanDom, config);
 
+    },
 
+    /**
 
+     * @description 选择框改变
 
+     */
 
+    handleChange() {
 
+      this.$emit('change', this.value);
 
+    },
 
+    /**
 
+     *
 
+     * @param val 当前角色绑定的分校不允许删除
 
+     */
 
+    removeTag(val) {
 
+      this.$emit('remove-tag', val);
 
+    }
 
+  }
 
+};
 
+</script>
 
+<style scoped>
 
+
 
+</style>

+ 210 - 0
src/components/pages/knowledge/components/selectTag2.vue
View File 

@@ -0,0 +1,210 @@
 
+<template>
 
+  <main>
 
+    <el-select
 
+      ref="select"
 
+      v-model="values"
 
+      multiple
 
+      clearable
 
+      filterable
 
+      allow-create
 
+      style="width:100%"
 
+      :placeholder="placeholder"
 
+      @change="handleChange"
 
+      @remove-tag="removeTag"
 
+    >
 
+      <el-option
 
+        v-for="item in options"
 
+        :key="item.id"
 
+        :disabled="disabled && item.id === Number(judgingCondition)"
 
+        :label="item.name"
 
+        :value="item.name"
 
+      >
 
+        <div class="selectBox">
 
+          <span>{{ item.name }}</span>
 
+          <div class="controlsBox">
 
+            <span
 
+              class="delSelect"
 
+              @click.stop="deleteTag(item.id, item.name)"
 
+            ></span>
 
+          </div>
 
+        </div>
 
+      </el-option>
 
+    </el-select>
 
+  </main>
 
+</template>
 
+<script>
 
+export default {
 
+  name: "select-tags",
 
+  props: {
 
+    // 选项
 
+    options: {
 
+      type: Array,
 
+      default: () => []
 
+    },
 
+    // 选中的值
 
+    value: {
 
+      type: Array,
 
+      default: () => []
 
+    },
 
+    // 提示
 
+    placeholder: {
 
+      type: String,
 
+      default: "请选择"
 
+    },
 
+    // 是否禁用
 
+    disabled: {
 
+      type: Boolean,
 
+      default: false
 
+    },
 
+    // 判断条件
 
+    judgingCondition: {
 
+      type: String | Number,
 
+      default: ""
 
+    }
 
+  },
 
+  data() {
 
+    return {
 
+      observer: null,
 
+      hideDom: null
 
+    };
 
+  },
 
+  computed: {
 
+    /**
 
+     * @description 获取当前选中的值
 
+     */
 
+    values: {
 
+      get() {
 
+        return this.value;
 
+      },
 
+      set(val) {
 
+        this.$emit("input", val);
 
+      }
 
+    }
 
+  },
 
+  mounted() {
 
+    this.mutationObserver();
 
+  },
 
+  beforeDestroy() {
 
+    this.observer.disconnect();
 
+  },
 
+  methods: {
 
+    /**
 
+     * @description 监听tag变化
 
+     */
 
+    mutationObserver() {
 
+      const tagLIstDom = this.$refs.select.$el.querySelector(
 
+        ".el-select__tags"
 
+      );
 
+      const tagSpanDom = this.$refs.select.$el.querySelector(
 
+        ".el-select__tags > span"
 
+      );
 
+
 
+      const input = this.$refs.select.$el.querySelector(
 
+        ".el-select__tags > input"
 
+      );
 
+      // 创建隐藏的计数节点
 
+      this.hideDom = document.createElement("span");
 
+      this.hideDom.classList.add("count-node");
 
+      tagSpanDom.append(this.hideDom);
 
+
 
+      const config = { childList: true };
 
+
 
+      const callback = mutationsList => {
 
+        mutationsList.forEach(item => {
 
+          if (item.type === "childList") {
 
+            const tagList = item.target.childNodes;
 
+            let tagWidth = 0;
 
+            let tagNum = 0;
 
+            let availableTagWidth = 0;
 
+
 
+            for (let i = 0; i < tagList.length; i++) {
 
+              const e = tagList[i];
 
+              if (tagWidth > (tagLIstDom.offsetWidth - 30)) {
 
+                e.style.display = "none";
 
+              } else {
 
+                e.style.display = "inline-block";
 
+              }
 
+              tagWidth += e.offsetWidth + 5;
 
+
 
+              if (tagWidth > (tagLIstDom.offsetWidth - 30)) {
 
+                e.style.display = "none";
 
+              } else {
 
+                e.style.display = "inline-block";
 
+              }
 
+
 
+              if (e.style.display !== "none") {
 
+                tagNum++;
 
+                this.hideDom.style.display = "none";
 
+                const margin = tagNum === 1 ? 0 : 7;
 
+                availableTagWidth += e.offsetWidth + margin;
 
+              } else {
 
+                this.hideDom.style.display = "inline-block";
 
+                this.hideDom.style.left = `${availableTagWidth}px`;
 
+                this.hideDom.innerHTML = `+${tagList.length - tagNum}`;
 
+              }
 
+            }
 
+          }
 
+        });
 
+        if(this.hideDom.style.display != 'none'){
 
+          input.style.marginLeft = "40px"
 
+        }else{
 
+          input.style.marginLeft = "15px"
 
+        }
 
+      };
 
+
 
+      this.observer = new MutationObserver(callback);
 
+      this.observer.observe(tagSpanDom, config);
 
+    },
 
+    /**
 
+     * @description 选择框改变
 
+     */
 
+    handleChange(value) {
 
+      console.log(value);
 
+      console.log(this.value);
 
+      
+      this.$emit("change", value);
 
+    },
 
+    deleteTag(id, name){
 
+      this.$emit("deleteTag", id, name);
 
+    },
 
+    /**
 
+     *
 
+     * @param val 当前角色绑定的分校不允许删除
 
+     */
 
+    removeTag(val) {
 
+      this.$emit("remove-tag", val);
 
+    }
 
+  }
 
+};
 
+</script>
 
+<style scoped>
 
+.selectBox {
 
+  width: 100%;
 
+  height: 100%;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: space-between;
 
+}
 
+
 
+.controlsBox {
 
+  display: flex;
 
+  align-items: center;
 
+  width: auto;
 
+  height: 100%;
 
+  display: flex;
 
+}
 
+
 
+.delSelect {
 
+  width: 16px;
 
+  height: 16px;
 
+  /* display: none; */
 
+  align-items: center;
 
+  justify-content: center;
 
+  background: url("../../../../assets/icon/classroomObservation/del.svg") no-repeat;
 
+  background-size: 100% 100%;
 
+  box-sizing: border-box;
 
+  /* transform: translateY(7px); */
 
+}
 
+
 
+
 
+</style>

+ 8 - 2
src/components/pages/knowledge/fileBox.vue
View File 

@@ -36,9 +36,9 @@
 
             type="text"
 
             v-model="fileName"
 
             placeholder="请输入你需要搜索的文件名字"
 
-            @keyup.enter="serchFile"
 
+            @input="debouncedSearch"
 
           />
 
-          <div class="serch" @click="serchFile"></div>
 
+          <div class="serch"></div>
 
         </div>
 
       </div>
 
     </div>
 
@@ -317,6 +317,12 @@ export default {
 
         this.beforeUpload({target:{files}});
 
       }
 
     },
 
+    debouncedSearch() {
 
+      clearTimeout(this.debounceTimeout);
 
+      this.debounceTimeout = setTimeout(() => {
 
+        this.serchFile();
 
+      }, 300);
 
+    },
 
     serchFile() {
 
       this.page = 1;
 
       this.getData();

+ 8 - 2
src/components/pages/knowledge/folder.vue
View File 

@@ -57,9 +57,9 @@
 
             type="text"
 
             v-model="fileName"
 
             placeholder="请输入你需要搜索的文件夹名字"
 
-            @keyup.enter="serchFile"
 
+            @input="debouncedSearch"
 
           />
 
-          <div class="serch" @click="serchFile"></div>
 
+          <div class="serch"></div>
 
         </div>
 
       </div>
 
     </div>
 
@@ -415,6 +415,12 @@ export default {
 
           console.error(err);
 
         });
 
     },
 
+    debouncedSearch() {
 
+      clearTimeout(this.debounceTimeout);
 
+      this.debounceTimeout = setTimeout(() => {
 
+        this.serchFile();
 
+      }, 300);
 
+    },
 
     serchFile() {
 
       this.page = 1;
 
       this.getData();

+ 28 - 31
src/components/pages/knowledge/folderDetail.vue
View File 

@@ -39,43 +39,36 @@
 
         <div class="tag">
 
           <div class="tag_title">标签：</div>
 
           <div class="tag_check">
 
-            <el-select
 
+            <selectTag
 
               v-loading="tagLoading1"
 
               v-model="check1"
 
-              placeholder="前选择学科标签"
 
-              clearable
 
-              filterable
 
-              multiple
 
-              collapse-tags
 
+              :options="tagData1"
 
+              :placeholder="'前选择学科标签'"
 
               style="width: calc(100% / 2 - 10px / 2); margin-right: 10px;"
 
-              @change="updateFolder()"
 
-            >
 
-              <el-option
 
-                v-for="(item, index) in tagData1"
 
-                :key="index"
 
-                :label="item.name"
 
-                :value="item.id"
 
-              ></el-option>
 
-            </el-select>
 
-            <el-select
 
+                @change="updateFolder()"
 
+            />
 
+            <selectTag
 
               v-loading="tagLoading2"
 
               v-model="check2"
 
-              placeholder="前选择年级标签"
 
+              :options="tagData2"
 
+              :placeholder="'前选择年级标签'"
 
+              style="width: calc(100% / 2 - 10px / 2); margin-right: 10px;"
 
+              @change="updateFolder()"
 
               clearable
 
+            />
 
+             <selectTag2
 
+              v-loading="tagLoading3"
 
+              v-model="check3"
 
+              :options="tagData3"
 
+              :placeholder="'自定义标签'"
 
+              style="width: 100%; margin-top: 10px;"
 
+              @change="handleTagChange"
 
+              allow-create
 
               filterable
 
-              multiple
 
-              collapse-tags
 
-              style="width: calc(100% / 2 - 10px / 2);"
 
-              @change="updateFolder()"
 
-            >
 
-              <el-option
 
-                v-for="(item, index) in tagData2"
 
-                :key="index"
 
-                :label="item.name"
 
-                :value="item.id"
 
-              ></el-option>
 
-            </el-select>
 
-            <el-select
 
+              clearable
 
+              @deleteTag="deleteTag"
 
+            />
 
+            <!-- <el-select
 
               v-loading="tagLoading3"
 
               v-model="check3"
 
               placeholder="自定义标签"
 
@@ -103,7 +96,7 @@
 
                   </div>
 
                 </div>
 
               </el-option>
 
-            </el-select>
 
+            </el-select> -->
 
           </div>
 
         </div>
 
         <div class="tag">
 
@@ -139,6 +132,8 @@
 
 </template>
 
 
 <script>
 
+import selectTag from './components/selectTag.vue';
 
+import selectTag2 from './components/selectTag2.vue';
 
 import folderFileBoxVue from './folderFileBox.vue';
 
 
 export default {
 
@@ -161,6 +156,8 @@ export default {
 
   },
 
   components: {
 
     folderFileBoxVue,
 
+    selectTag,
 
+    selectTag2
 
   },
 
   data() {
 
     return {

+ 12 - 3
src/components/pages/knowledge/folderFileBox.vue
View File 

@@ -29,9 +29,10 @@
 
             type="text"
 
             v-model="fileName"
 
             placeholder="请输入你需要搜索的文件名字"
 
-            @keyup.enter="serchFile"
 
+            @input="debouncedSearch"
 
           />
 
-          <div class="serch" @click="serchFile"></div>
 
+          <div class="serch"></div>
 
+           <!-- @click="serchFile" -->
 
         </div>
 
       </div>
 
     </div>
 
@@ -194,6 +195,7 @@ export default {
 
       limit: 10,
 
       total: 0,
 
       page: 1,
 
+      debounceTimeout: null,
 
     };
 
   },
 
   computed: {
 
@@ -279,7 +281,14 @@ export default {
 
         this.beforeUpload({target:{files}});
 
       }
 
     },
 
+    debouncedSearch() {
 
+      clearTimeout(this.debounceTimeout);
 
+      this.debounceTimeout = setTimeout(() => {
 
+        this.serchFile();
 
+      }, 300);
 
+    },
 
     serchFile() {
 
+      this.page = 1;
 
       this.getData();
 
     },
 
     async beforeUpload(event) {
 
@@ -455,7 +464,7 @@ export default {
 
   },
 
   mounted() {
 
     // this.getData();
 
-    
+
 
     //  const script = document.createElement('script');
 
     // script.src = 'https://beta.cloud.cocorobo.cn/js/Common/uploadR2R.js';
 
     // script.type = 'text/javascript';

Some files were not shown because too many files changed in this diff