Skip to content

V
vue-gjjs
Commit 3d8c0c99 by fukai
Options

Select支持传入后台码表，全局搜索支持搜索

parent f5e4295f
Showing with 162 additions and 49 deletions
src/components/SearchInput.vue
......@@ -4,6 +4,8 @@
prefix-icon="el-icon-search"
placeholder="全局搜索"
v-model="searchContent"
:clearable="true"
@keyup.enter.native="searchEvent"
@keydown.up.native="preDownEvent"
@keyup.up.native="preUpEvent"
......@@ -21,12 +23,16 @@
<ul>
<li
:class="{ 'sug-selected': item.selected }"
v-for="(item, idx) in searchResultForLis"
v-for="(item, idx) in searchResult"
:key="idx"
@mouseover="liOverEvent(idx)"
@mouseup.left="searchEvent(item.text)"
v-html="item.text"
></li>
@mouseup.left="searchEvent(item)"
>
<span style="width:8rem;display:inline-block">{{item.OWNREF}}</span>
<el-divider direction="vertical"></el-divider>
<span>{{item.OBJNAM}}</span>
</li>
</ul>
</div>
</div>
......@@ -34,9 +40,10 @@
<script>
import debounce from "lodash/debounce";
import commonReport from "~/mixin/commonReport"
export default {
name: "SearchInput",
mixins:[commonReport],
data() {
return {
searchContent: "",
......@@ -58,56 +65,71 @@ export default {
this.resultDisplay = false;
return;
}
if (this.searchResult.map((r) => r.text).includes(val)) {
if (this.searchResult.map((r) => r.OWNREF).includes(val)) {
return;
}
this.debounceWrapper();
},
},
methods: {
queryData() {
const testData = [
{ text: "DD3500210260AA01", url: "" },
{ text: "OC3500190001AA", url: "" },
{ text: "KZ3500210313AA", url: "" },
{ text: "KZ3500210312AA", url: "" },
{ text: "DD3500210311AA01", url: "" },
{ text: "DD3500210311AA01", url: "" },
{ text: "KZ3500210311AA", url: "" },
{ text: "CH3500200001AA", url: "" },
{ text: "CH3323200001AB", url: "" },
{ text: "DV453500210260AA01", url: "" },
{ text: "KZ3500210313AA", url: "" },
{ text: "DD45350029760AA01", url: "" },
{ text: "CH3500343657001AA", url: "" },
{ text: "CH35987567001AA", url: "" },
{ text: "CH243534200001AA", url: "" },
{ text: "CH350086786001AA", url: "" },
{ text: "CH53454001AA", url: "" },
{ text: "CH65645FG4545AA", url: "" },
];
async queryData() {
// const testData = [
// { text: "DD3500210260AA01", url: "" },
// { text: "OC3500190001AA", url: "" },
// { text: "KZ3500210313AA", url: "" },
// { text: "KZ3500210312AA", url: "" },
// { text: "DD3500210311AA01", url: "" },
// { text: "DD3500210311AA01", url: "" },
// { text: "KZ3500210311AA", url: "" },
// { text: "CH3500200001AA", url: "" },
// { text: "CH3323200001AB", url: "" },
// { text: "DV453500210260AA01", url: "" },
// { text: "KZ3500210313AA", url: "" },
// { text: "DD45350029760AA01", url: "" },
// { text: "CH3500343657001AA", url: "" },
// { text: "CH35987567001AA", url: "" },
// { text: "CH243534200001AA", url: "" },
// { text: "CH350086786001AA", url: "" },
// { text: "CH53454001AA", url: "" },
// { text: "CH65645FG4545AA", url: "" },
// ];
console.log("query data ..." + new Date().toLocaleString());
// this.shuffle(testData);
// const res = testData;
const res = testData.filter(
(d) => d.text.indexOf(this.searchContent) > -1
);
if (res && res.length > 0) {
this.searchResultForLis = res.map((d) => {
const o = Object.assign({}, d);
o.text = d.text.replace(
this.searchContent,
"<em>" + this.searchContent + "</em>"
);
return o;
});
this.searchResult = res;
let rtnmsg = await this.globalSearch(this.searchContent);
if(rtnmsg.respCode == SUCCESS && rtnmsg.data && rtnmsg.data.length >0){
let srcData = rtnmsg.data;
let searchResult = srcData.map(item=>{
return item;
})
this.searchResult = searchResult;
this.resultDisplay = true;
} else {
}
else{
this.searchResult = [];
this.searchResultForLis = [];
this.resultDisplay = false;
}
// this.shuffle(testData);
// const res = testData;
// const res = testData.filter(
// (d) => d.text.indexOf(this.searchContent) > -1
// );
// if (res && res.length > 0) {
// this.searchResultForLis = res.map((d) => {
// const o = Object.assign({}, d);
// o.text = d.text.replace(
// this.searchContent,
// "<em>" + this.searchContent + "</em>"
// );
// return o;
// });
// this.searchResult = res;
// this.resultDisplay = true;
// } else {
// this.searchResult = [];
// this.searchResultForLis = [];
// this.resultDisplay = false;
// }
},
shuffle(arr) {
let i = arr.length - 1;
......@@ -117,13 +139,55 @@ export default {
i--;
}
},
searchEvent(val) {
if (typeof val === "string") {
this.searchContent = val;
searchEvent(row) {
if (typeof row.OWNREF === "string") {
this.searchContent = row.OWNREF;
}
this.resultDisplay = false;
// TODO
console.log("go to ...");
let link = "";
switch(row.OBJTYP.trim()){
case "DID":
link = "ditsel"
break
case "LID":
link = "litsel"
break;
case "CPD":
link = "cptsel"
break;
case "DED":
link = "detsel"
break;
case "LED":
link = "letsel"
break;
case "BPD":
link = "bptsel"
break;
case "CCD":
link = "cctsel"
break;
case "GED":
link = "getsel"
break;
case "GID":
link = "gitsel"
break;
case "MCD":
link = "mctsel"
break;
case "TRD":
link = "trtsel"
break;
}
console.log("go to ..."+link);
if(!link){
this.$notify.error({title: '错误',message: '未知的objtyp:'+row.OBJTYP+"!"})
return
}
this.$router.push({name:link.toUpperCase().substring(0,1)+link.substring(1),query:{ownref:row.OWNREF.trim()}})
},
focusInput() {
if (this.searchResult.length > 0) {
......@@ -223,6 +287,8 @@ export default {
position: absolute;
width: 590px;
top: 28px;
height: 40rem;
overflow: auto;
border-radius: 0 0 10px 10px;
border: 2px solid #4e71f2;
box-shadow: none;
......
src/components/Select.vue
......@@ -8,7 +8,16 @@
:clearable="clearable"
@click.native="handleClick"
>
<template v-if="code.length > 0">
<template v-if="dbCodeList.length > 0">
<el-option
v-for="item in dbCodeList"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</template>
<template v-else-if="code.length > 0">
<el-option
v-for="item in code"
:key="item.value"
......@@ -22,6 +31,7 @@
</template>
<script>
import Api from "~/service/Api"
export default {
props: {
value: {
......@@ -46,6 +56,27 @@ export default {
return [];
},
},
dbCode: {
type: String,
default: undefined,
},
},
data(){
return {
dbCodeList:[],
}
},
watch:{
//动态从服务器上渲染码表
dbCode(){
if(!this.dbCode){
this.dbCodeList=[]
//清理数据
this.model = undefined;
return
}
getDBCode()
}
},
computed: {
model: {
......@@ -84,7 +115,23 @@ export default {
node.parentElement.dispatchEvent(ev);
}
},
getDBCode(){
let args = {tbl:this.dbCode,lang:this.$store.state.I18n.lang.toUpperCase()}
if(args.lang == "ZH"){
args.lang = "CN";
}
Api.post("/getCodetable",args).then(rtnmsg=>{
if(rtnmsg.respCode==SUCCESS){
this.dbCodeList=rtnmsg.data
}
})
}
},
mounted(){
if(this.dbCode){
this.getDBCode()
}
}
};
</script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment