middle-admin-ant/src/components/zk/zkSelectSearch.vue

93 lines
2.1 KiB
Vue

<template>
<a-select
show-search
:value="value"
:placeholder="ListTitle"
style="width: 200px"
:default-active-first-option="false"
:show-arrow="false"
:filter-option="false"
:not-found-content="null"
@search="handleSearch"
@change="handleChange"
>
<a-select-option v-for="item in data" :key="item.id">
{{ item.name }} <span v-if="IsListShowCode">- {{ item.code }}</span>
</a-select-option>
</a-select>
</template>
<script>
import Mixin from "@/application/zk/mixins/ListComponents.js";
export default {
mixins: [Mixin],
data() {
return {
value: undefined,
};
},
methods: {
handleSearch(value) {
if (!value) {
this.initListData();
return;
}
let searchData = this.ListUrlData;
searchData.search_rules = [
{
column: "name",
mode: "like",
value: value
},
{
column: "code",
mode: "like",
value: value
},
];
this.$zk.getPagedData({
url: this.ListUrl,
listFieldName: this.ListFieldName,
data: searchData,
loading: "加载中...",
config: {
headers: {
'Content-Type': 'application/json'
}
}
}).then(a => {
if (a.total === 0) {
return
}
this.data = a[this.ListFieldName];
// this.list中的id字段转换为字符串
this.data.forEach(item => {
item.id = item.id.toString();
});
}).catch((a) => {
this.$mk.error(a.msg);
});
},
handleChange(value) {
console.log(`selected ${value}`);
this.value = value;
// 向父级传递数据 backFieldNames
this.data.forEach(item => {
if (item.id === value) {
// backFieldNames
let FieldNames = {}
this.BackFieldNames.forEach(backFieldName => {
if (item[backFieldName]) {
FieldNames[backFieldName] = item[backFieldName];
}
});
this.$emit('zkSelectSearch', FieldNames);
}
});
},
},
};
</script>