Merge remote-tracking branch 'origin/dev_third_stage' into dev_third_stage
This commit is contained in:
@@ -0,0 +1,200 @@
|
|||||||
|
<template>
|
||||||
|
<a-checkbox-group v-if="tagType=='checkbox'" @change="onChange" :value="arrayValue" :disabled="disabled">
|
||||||
|
<a-checkbox v-for="(item, key) in dictOptions" :key="key" :value="item.value">
|
||||||
|
<span :title='item.text||item.label'>
|
||||||
|
{{ (item.text && item.text.length > 6 ? item.text.slice(0, 5) + '...' : item.text) || (item.label && item.label.length > 6 ? item.label.slice(0, 5) + '...' : item.label) }}
|
||||||
|
</span>
|
||||||
|
</a-checkbox>
|
||||||
|
</a-checkbox-group>
|
||||||
|
|
||||||
|
<a-select
|
||||||
|
v-else-if="tagType=='select'"
|
||||||
|
:value="arrayValue"
|
||||||
|
@change="onChange"
|
||||||
|
:disabled="disabled"
|
||||||
|
mode="multiple"
|
||||||
|
:placeholder="placeholder"
|
||||||
|
:getPopupContainer="getParentContainer"
|
||||||
|
optionFilterProp="children"
|
||||||
|
:filterOption="filterOption">
|
||||||
|
<a-select-option
|
||||||
|
v-for="(item,index) in dictOptions"
|
||||||
|
:key="index"
|
||||||
|
:value="item.value">
|
||||||
|
<span class="itemOption" :title="item.text || item.label">
|
||||||
|
{{ item.text || item.label }}
|
||||||
|
</span>
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'JMultiSelectTag',
|
||||||
|
props: {
|
||||||
|
dictCode: String,
|
||||||
|
placeholder: String,
|
||||||
|
disabled: Boolean,
|
||||||
|
value: String,
|
||||||
|
db_field_name: String,
|
||||||
|
type: String,
|
||||||
|
options: Array,
|
||||||
|
spliter: {
|
||||||
|
type: String,
|
||||||
|
required: false,
|
||||||
|
default: ','
|
||||||
|
},
|
||||||
|
popContainer: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
required: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dictOptions: [],
|
||||||
|
tagType: '',
|
||||||
|
arrayValue: !this.value ? [] : this.value.split(this.spliter),
|
||||||
|
content: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
if (!this.type || this.type === 'list_multi') {
|
||||||
|
this.tagType = 'select'
|
||||||
|
} else {
|
||||||
|
this.tagType = this.type
|
||||||
|
}
|
||||||
|
//获取字典数据
|
||||||
|
//this.initDictData();
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
options: function(val) {
|
||||||
|
this.setCurrentDictOptions(val)
|
||||||
|
},
|
||||||
|
dictCode: {
|
||||||
|
immediate: true,
|
||||||
|
handler() {
|
||||||
|
this.initDictData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
value(val) {
|
||||||
|
if (!val) {
|
||||||
|
this.arrayValue = []
|
||||||
|
} else {
|
||||||
|
this.arrayValue = this.value.split(this.spliter)
|
||||||
|
let arrayValue = JSON.parse(JSON.stringify(this.arrayValue))
|
||||||
|
let item = []
|
||||||
|
this.dictOptions.forEach(res => {
|
||||||
|
arrayValue.forEach((val, index) => {
|
||||||
|
if (res.value == val && index != 0) {
|
||||||
|
item.push(res.text || res.label)
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
this.content = item.join(',')
|
||||||
|
})
|
||||||
|
let arrayLabel = []
|
||||||
|
this.dictOptions.forEach((item) => {
|
||||||
|
this.arrayValue.forEach((val) => {
|
||||||
|
if (item.value === val) {
|
||||||
|
arrayLabel.push(item)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
this.$emit('changelabel', arrayLabel)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initDictData() {
|
||||||
|
if (this.options && this.options.length > 0) {
|
||||||
|
this.dictOptions = [...this.options]
|
||||||
|
} else {
|
||||||
|
//优先从缓存中读取字典配置
|
||||||
|
let cacheOption = getDictItemsFromCache(this.dictCode)
|
||||||
|
if (cacheOption && cacheOption.length > 0) {
|
||||||
|
this.dictOptions = cacheOption
|
||||||
|
return
|
||||||
|
}
|
||||||
|
//根据字典Code, 初始化字典数组
|
||||||
|
ajaxGetDictItems(this.dictCode, null).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.dictOptions = res.result
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
onChange(selectedValue) {
|
||||||
|
let content = []
|
||||||
|
let item = []
|
||||||
|
this.dictOptions.forEach(res => {
|
||||||
|
selectedValue.forEach((val, index) => {
|
||||||
|
if (res.value == val) {
|
||||||
|
content.push(res.text || res.label)
|
||||||
|
if (index != 0) {
|
||||||
|
item.push(res.text || res.label)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
this.content = item.join(',')
|
||||||
|
})
|
||||||
|
this.$emit('change', selectedValue.join(this.spliter))
|
||||||
|
this.$emit('changeQuery', content.join(this.spliter), this.db_field_name)
|
||||||
|
},
|
||||||
|
setCurrentDictOptions(dictOptions) {
|
||||||
|
this.dictOptions = dictOptions
|
||||||
|
|
||||||
|
},
|
||||||
|
getCurrentDictOptions() {
|
||||||
|
return this.dictOptions
|
||||||
|
},
|
||||||
|
getParentContainer(node) {
|
||||||
|
if (!this.popContainer) {
|
||||||
|
return node.parentNode
|
||||||
|
} else {
|
||||||
|
return document.querySelector(this.popContainer)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// update--begin--autor:lvdandan-----date:20201120------for:LOWCOD-1086 下拉多选框,搜索时只字典code进行搜索不能通过字典text搜索
|
||||||
|
filterOption(input, option) {
|
||||||
|
return option.componentOptions.children[0].children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
// update--end--autor:lvdandan-----date:20201120------for:LOWCOD-1086 下拉多选框,搜索时只字典code进行搜索不能通过字典text搜索
|
||||||
|
},
|
||||||
|
model: {
|
||||||
|
prop: 'value',
|
||||||
|
event: 'change'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.itemOption {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-o-text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
/deep/.ant-checkbox-wrapper + .ant-checkbox-wrapper {
|
||||||
|
margin-left: 0px !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style>
|
||||||
|
/*.ant-select-selection__choice{*/
|
||||||
|
/* max-width: 50% !important;*/
|
||||||
|
/*}*/
|
||||||
|
.ant-select-selection--multiple {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-select-selection--multiple::-webkit-scrollbar {
|
||||||
|
display: none; /* Chrome Safari */
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
import JDictSelectTag from './JDictSelectTag.vue'
|
import JDictSelectTag from './JDictSelectTag.vue'
|
||||||
import JMultiSelectTag from './JMultiSelectTag.vue'
|
import JMultiSelectTag from './JMultiSelectTag.vue'
|
||||||
|
import JMultiSelectTagOnlyRz from './JMultiSelectTagOnlyRz.vue'
|
||||||
import JSearchSelectTag from './JSearchSelectTag.vue'
|
import JSearchSelectTag from './JSearchSelectTag.vue'
|
||||||
import { filterMultiDictText,filterDictText,initDictOptions,filterDictTextByCache } from './JDictSelectUtil'
|
import { filterMultiDictText,filterDictText,initDictOptions,filterDictTextByCache } from './JDictSelectUtil'
|
||||||
|
|
||||||
@@ -7,6 +8,7 @@ export default {
|
|||||||
install: function (Vue) {
|
install: function (Vue) {
|
||||||
Vue.component('JDictSelectTag',JDictSelectTag);
|
Vue.component('JDictSelectTag',JDictSelectTag);
|
||||||
Vue.component('JMultiSelectTag',JMultiSelectTag);
|
Vue.component('JMultiSelectTag',JMultiSelectTag);
|
||||||
|
Vue.component('JMultiSelectTagOnlyRz',JMultiSelectTagOnlyRz);
|
||||||
Vue.component('JSearchSelectTag',JSearchSelectTag);
|
Vue.component('JSearchSelectTag',JSearchSelectTag);
|
||||||
Vue.prototype.$initDictOptions = (dictCode) => initDictOptions(dictCode)
|
Vue.prototype.$initDictOptions = (dictCode) => initDictOptions(dictCode)
|
||||||
Vue.prototype.$filterMultiDictText = (dictOptions, text) => filterMultiDictText(dictOptions, text)
|
Vue.prototype.$filterMultiDictText = (dictOptions, text) => filterMultiDictText(dictOptions, text)
|
||||||
|
|||||||
@@ -142,7 +142,7 @@
|
|||||||
:title="$t('ParameterName')">{{$t('certificationCategory')}}</span>
|
:title="$t('ParameterName')">{{$t('certificationCategory')}}</span>
|
||||||
</div>
|
</div>
|
||||||
<a-form-model-item class="itemModel-multi" prop="certCategory">
|
<a-form-model-item class="itemModel-multi" prop="certCategory">
|
||||||
<j-multi-select-tag class="box-input" v-model="formInline.certCategory"
|
<j-multi-select-tag-only-rz class="box-input" v-model="formInline.certCategory"
|
||||||
@change='Onchange'
|
@change='Onchange'
|
||||||
v-on:changelabel='Onchangelabel'
|
v-on:changelabel='Onchangelabel'
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
|||||||
Reference in New Issue
Block a user