修改禅道已知bug
This commit is contained in:
qq787203167
@@ -10,7 +10,7 @@
|
||||
<a-select v-else-if="tagType=='select'" :getPopupContainer = "getPopupContainer" :placeholder="placeholder" :disabled="disabled" :value="getValueSting" @change="handleInput">
|
||||
<!-- <a-select-option :value="null">{{$t('pleaseSelect')}}</a-select-option>-->
|
||||
<a-select-option v-for="(item, key) in dictOptionsValue" :key="key" :value="item.value">
|
||||
<span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
|
||||
<span class="itemOption" :title=" item.text || item.label ">
|
||||
{{ item.text || item.label }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
@@ -118,4 +118,12 @@
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.itemOption {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-o-text-overflow:ellipsis;
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,7 @@
|
||||
<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">{{ item.text || item.label }}</a-checkbox>
|
||||
<a-checkbox v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text || item.label }}
|
||||
</a-checkbox>
|
||||
</a-checkbox-group>
|
||||
|
||||
<a-select
|
||||
@@ -13,14 +14,14 @@
|
||||
:maxTagTextLength="2"
|
||||
:placeholder="placeholder"
|
||||
:getPopupContainer="getParentContainer"
|
||||
:maxTagPlaceholder="content+'...'"
|
||||
:maxTagPlaceholder="content"
|
||||
optionFilterProp="children"
|
||||
:filterOption="filterOption">
|
||||
<a-select-option
|
||||
v-for="(item,index) in dictOptions"
|
||||
:key="index"
|
||||
:value="item.value">
|
||||
<span style="display: inline-block;width: 100%" :title="item.text || item.label">
|
||||
<span class="itemOption" :title="item.text || item.label">
|
||||
{{ item.text || item.label }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
@@ -29,7 +30,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {ajaxGetDictItems,getDictItemsFromCache} from '@/api/api'
|
||||
import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'JMultiSelectTag',
|
||||
props: {
|
||||
@@ -37,124 +39,124 @@
|
||||
placeholder: String,
|
||||
disabled: Boolean,
|
||||
value: String,
|
||||
db_field_name:String,
|
||||
db_field_name: String,
|
||||
type: String,
|
||||
options:Array,
|
||||
spliter:{
|
||||
options: Array,
|
||||
spliter: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ','
|
||||
},
|
||||
popContainer:{
|
||||
type:String,
|
||||
default:'',
|
||||
required:false
|
||||
},
|
||||
popContainer: {
|
||||
type: String,
|
||||
default: '',
|
||||
required: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dictOptions: [],
|
||||
tagType:"",
|
||||
arrayValue:!this.value?[]:this.value.split(this.spliter),
|
||||
content:''
|
||||
tagType: '',
|
||||
arrayValue: !this.value ? [] : this.value.split(this.spliter),
|
||||
content: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if(!this.type || this.type==="list_multi"){
|
||||
this.tagType = "select"
|
||||
}else{
|
||||
if (!this.type || this.type === 'list_multi') {
|
||||
this.tagType = 'select'
|
||||
} else {
|
||||
this.tagType = this.type
|
||||
}
|
||||
//获取字典数据
|
||||
//this.initDictData();
|
||||
},
|
||||
watch:{
|
||||
options: function(val){
|
||||
this.setCurrentDictOptions(val);
|
||||
watch: {
|
||||
options: function(val) {
|
||||
this.setCurrentDictOptions(val)
|
||||
},
|
||||
dictCode:{
|
||||
immediate:true,
|
||||
dictCode: {
|
||||
immediate: true,
|
||||
handler() {
|
||||
this.initDictData()
|
||||
},
|
||||
}
|
||||
},
|
||||
value (val) {
|
||||
if(!val){
|
||||
value(val) {
|
||||
if (!val) {
|
||||
this.arrayValue = []
|
||||
}else{
|
||||
} else {
|
||||
this.arrayValue = this.value.split(this.spliter)
|
||||
let arrayValue=JSON.parse(JSON.stringify(this.arrayValue))
|
||||
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.dictOptions.forEach(res => {
|
||||
arrayValue.forEach((val, index) => {
|
||||
if (res.value == val && index != 0) {
|
||||
item.push(res.text || res.label)
|
||||
}
|
||||
|
||||
})
|
||||
this.content=item.join(',')
|
||||
this.content = item.join(',')
|
||||
})
|
||||
let arrayLabel = []
|
||||
this.dictOptions.forEach((item) => {
|
||||
this.arrayValue.forEach((val) => {
|
||||
if(item.value === val) {
|
||||
arrayLabel.push(item)
|
||||
}
|
||||
if (item.value === val) {
|
||||
arrayLabel.push(item)
|
||||
}
|
||||
})
|
||||
})
|
||||
this.$emit('changelabel', arrayLabel);
|
||||
this.$emit('changelabel', arrayLabel)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initDictData() {
|
||||
if(this.options && this.options.length>0){
|
||||
if (this.options && this.options.length > 0) {
|
||||
this.dictOptions = [...this.options]
|
||||
}else{
|
||||
} else {
|
||||
//优先从缓存中读取字典配置
|
||||
let cacheOption = getDictItemsFromCache(this.dictCode)
|
||||
if(cacheOption && cacheOption.length>0){
|
||||
if (cacheOption && cacheOption.length > 0) {
|
||||
this.dictOptions = cacheOption
|
||||
return
|
||||
}
|
||||
//根据字典Code, 初始化字典数组
|
||||
ajaxGetDictItems(this.dictCode, null).then((res) => {
|
||||
if (res.success) {
|
||||
this.dictOptions = res.result;
|
||||
this.dictOptions = res.result
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
onChange (selectedValue) {
|
||||
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.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);
|
||||
})
|
||||
this.content = item.join(',')
|
||||
})
|
||||
this.$emit('change', selectedValue.join(this.spliter))
|
||||
this.$emit('changeQuery', content.join(this.spliter), this.db_field_name)
|
||||
},
|
||||
setCurrentDictOptions(dictOptions){
|
||||
setCurrentDictOptions(dictOptions) {
|
||||
this.dictOptions = dictOptions
|
||||
|
||||
},
|
||||
getCurrentDictOptions(){
|
||||
getCurrentDictOptions() {
|
||||
return this.dictOptions
|
||||
},
|
||||
getParentContainer(node){
|
||||
if(!this.popContainer){
|
||||
getParentContainer(node) {
|
||||
if (!this.popContainer) {
|
||||
return node.parentNode
|
||||
}else{
|
||||
} else {
|
||||
return document.querySelector(this.popContainer)
|
||||
}
|
||||
},
|
||||
@@ -170,8 +172,28 @@
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.itemOption {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-o-text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ant-select-selection__choice{
|
||||
max-width: 50% !important;
|
||||
/*.ant-select-selection__choice{*/
|
||||
/* max-width: 50% !important;*/
|
||||
/*}*/
|
||||
.ant-select-selection--multiple {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ant-select-selection__rendered ul {
|
||||
word-break: break-all;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user