|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div class="address-placeholder" v-show="!onshow && items.length == 0"> 请输入</div>
|
|
|
+ <div class="address-placeholder" v-show="!onshow && items.length == 0" @click="getfouce">请输入</div>
|
|
|
<div class="source" @click="getfouce">
|
|
|
<div class="select">
|
|
|
<transition-group name="flip-list">
|
|
|
@@ -21,6 +21,7 @@
|
|
|
class="inp"
|
|
|
@mousedown.stop
|
|
|
ref="inputVal"
|
|
|
+ v-html="innerText"
|
|
|
@blur="unblur"
|
|
|
v-model="value"
|
|
|
@input="handleInput"
|
|
|
@@ -30,7 +31,7 @@
|
|
|
<li
|
|
|
@mousedown.prevent
|
|
|
class="item"
|
|
|
- @click="getTag(item)"
|
|
|
+ @click="getTag(item,index)"
|
|
|
v-for="(item,index) in conceptList"
|
|
|
:key="index"
|
|
|
>
|
|
|
@@ -46,9 +47,10 @@
|
|
|
import api from '@api/knowledgeTree.js';
|
|
|
export default {
|
|
|
name: 'searchTerm',
|
|
|
- props: ['type','refbool'],
|
|
|
+ props: ['type', 'refbool'],
|
|
|
data() {
|
|
|
return {
|
|
|
+ innerText:'',
|
|
|
conceptList: [],
|
|
|
oldNum: 0,
|
|
|
newNum: 0,
|
|
|
@@ -57,8 +59,8 @@ export default {
|
|
|
onshow: false
|
|
|
};
|
|
|
},
|
|
|
- created(){
|
|
|
- this.items = this.formatData(this.refbool)
|
|
|
+ created() {
|
|
|
+ this.items = this.formatData(this.refbool);
|
|
|
},
|
|
|
watch: {
|
|
|
items(newVal, oldVal) {
|
|
|
@@ -67,11 +69,14 @@ export default {
|
|
|
newVal.forEach(item => {
|
|
|
arr.push(item.conceptId);
|
|
|
});
|
|
|
- this.$emit('update:refbool',arr)
|
|
|
- },
|
|
|
+ this.$emit('update:refbool', arr);
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
handleInput(event) {
|
|
|
+ let text = event.data?event.data:'';
|
|
|
+ let len = text.length;
|
|
|
+ this.onshow = len > 0 ? true : false;
|
|
|
const param = {
|
|
|
excludedConceptIds: [],
|
|
|
libType: this.type,
|
|
|
@@ -84,6 +89,10 @@ export default {
|
|
|
const data = res.data.data;
|
|
|
this.conceptList = data;
|
|
|
this.onshow = true;
|
|
|
+
|
|
|
+ this.items.forEach(item=>{
|
|
|
+ this.conceptList = this.conceptList.filter(it => it.conceptId !== item.conceptId)
|
|
|
+ })
|
|
|
}
|
|
|
})
|
|
|
.catch(error => {
|
|
|
@@ -93,13 +102,14 @@ export default {
|
|
|
getfouce() {
|
|
|
this.$refs.inputVal.focus();
|
|
|
},
|
|
|
- getTag(item) {
|
|
|
+ getTag(item,index) {
|
|
|
var v = this.items.some(el => {
|
|
|
return el.conceptName == item.conceptName;
|
|
|
});
|
|
|
if (v) {
|
|
|
return;
|
|
|
}
|
|
|
+ this.conceptList.splice(index,1)
|
|
|
this.items.push(item);
|
|
|
this.onshow = true;
|
|
|
},
|
|
|
@@ -108,8 +118,8 @@ export default {
|
|
|
},
|
|
|
unblur() {
|
|
|
this.onshow = false;
|
|
|
+ this.conceptList = []
|
|
|
this.value = '';
|
|
|
-
|
|
|
},
|
|
|
shuffle() {
|
|
|
this.items = _.shuffle(this.items);
|
|
|
@@ -144,7 +154,7 @@ export default {
|
|
|
.replace(/libName/g, 'conceptName');
|
|
|
//console.log(JSON.parse(str))
|
|
|
return JSON.parse(str);
|
|
|
- },
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
@@ -158,22 +168,7 @@ export default {
|
|
|
left: 16px;
|
|
|
top: 6px;
|
|
|
opacity: 0.7;
|
|
|
- font-size: 12px;
|
|
|
-}
|
|
|
-.test_box {
|
|
|
- width: 300px;
|
|
|
- min-height: 40px;
|
|
|
- max-height: 300px;
|
|
|
- outline: 0;
|
|
|
- border: 1px solid #dcdfe6;
|
|
|
font-size: 14px;
|
|
|
- line-height: 40px;
|
|
|
- padding: 0 16px;
|
|
|
- word-wrap: break-word;
|
|
|
- overflow-x: hidden;
|
|
|
- overflow-y: auto;
|
|
|
- border-radius: 4px;
|
|
|
- margin-top: 6px;
|
|
|
}
|
|
|
.list {
|
|
|
width: 318px;
|
|
|
@@ -198,7 +193,6 @@ export default {
|
|
|
}
|
|
|
|
|
|
.source {
|
|
|
- width: 300px;
|
|
|
min-height: 40px;
|
|
|
outline: 0;
|
|
|
border: 1px solid #dcdfe6;
|
|
|
@@ -210,7 +204,6 @@ export default {
|
|
|
overflow-y: auto;
|
|
|
border-radius: 4px;
|
|
|
margin-top: 6px;
|
|
|
-
|
|
|
.select {
|
|
|
.items {
|
|
|
height: 30px;
|
wyq