fix: el-seleect 可创建条目 以及 el-autocomplete 添加最大长度为64的限制

This commit is contained in:
zhangyu
2023-06-25 14:52:20 +08:00
parent d3f2fa2767
commit 0328db0491
12 changed files with 25 additions and 13 deletions

View File

@@ -48,6 +48,7 @@
:class="[selectSize ? `is-${ selectSize }` : '']" :class="[selectSize ? `is-${ selectSize }` : '']"
:disabled="selectDisabled" :disabled="selectDisabled"
:autocomplete="autoComplete || autocomplete" :autocomplete="autoComplete || autocomplete"
:maxlength = "maxlength"
@focus="handleFocus" @focus="handleFocus"
@blur="softFocus = false" @blur="softFocus = false"
@click.stop @click.stop
@@ -72,6 +73,7 @@
v-model="selectedLabel" v-model="selectedLabel"
type="text" type="text"
:placeholder="currentPlaceholder" :placeholder="currentPlaceholder"
:maxlength = "maxlength"
:name="name" :name="name"
:id="id" :id="id"
:autocomplete="autoComplete || autocomplete" :autocomplete="autoComplete || autocomplete"
@@ -301,6 +303,9 @@ export default {
popperAppendToBody: { popperAppendToBody: {
type: Boolean, type: Boolean,
default: true default: true
},
maxlength: {
type: Number
} }
}, },
@@ -332,6 +337,9 @@ export default {
}, },
watch: { watch: {
maxlength (n) {
console.log(n)
},
selectDisabled () { selectDisabled () {
this.$nextTick(() => { this.$nextTick(() => {
this.resetInputHeight() this.resetInputHeight()

View File

@@ -12,7 +12,7 @@
<div class="condition__column"> <div class="condition__column">
<div v-if="meta.nameIsEditing"> <div v-if="meta.nameIsEditing">
<el-select <el-select
allow-create allow-create :maxlength="64"
filterable filterable
size="mini" size="mini"
v-model="meta.name" v-model="meta.name"
@@ -35,7 +35,7 @@
<div class="condition__column"> <div class="condition__column">
<div v-if="meta.operIsEditing"> <div v-if="meta.operIsEditing">
<el-select <el-select
allow-create allow-create :maxlength="64"
filterable filterable
size="mini" size="mini"
v-model="meta.oper" v-model="meta.oper"

View File

@@ -466,7 +466,7 @@
</el-select> </el-select>
</div> </div>
<div style="display: inline-block;width: calc(70% - 13px);margin-left: 10px"> <div style="display: inline-block;width: calc(70% - 13px);margin-left: 10px">
<el-select v-model="pen.data.textLegend" size="small" filterable allow-create clearable default-first-option> <el-select v-model="pen.data.textLegend" size="small" filterable allow-create :maxlength="64" clearable default-first-option>
<el-option v-for="item in queryValues.filter(query => (query.parent === pen.data.textParent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title="item.name" style="width: 302px"> </el-option> <el-option v-for="item in queryValues.filter(query => (query.parent === pen.data.textParent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title="item.name" style="width: 302px"> </el-option>
</el-select> </el-select>
</div> </div>
@@ -806,7 +806,7 @@
</el-select> </el-select>
</div> </div>
<div style="display: inline-block;width: calc(70% - 13px);margin-left: 10px"> <div style="display: inline-block;width: calc(70% - 13px);margin-left: 10px">
<el-select v-model="pen.data.legend" size="small" filterable allow-create clearable default-first-option> <el-select v-model="pen.data.legend" size="small" filterable allow-create :maxlength="64" clearable default-first-option>
<el-option class="text-ellipsis" v-for="item in queryValues.filter(query => (query.parent === pen.data.parent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title="item.name" style="width: 302px;"></el-option> <el-option class="text-ellipsis" v-for="item in queryValues.filter(query => (query.parent === pen.data.parent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title="item.name" style="width: 302px;"></el-option>
</el-select> </el-select>
</div> </div>
@@ -1087,7 +1087,7 @@
:title="legend.legend" :title="legend.legend"
style="width: 100%" style="width: 100%"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
clearable> clearable>
<el-option class="text-ellipsis" v-for="item in queryValues.filter(query => (query.parent === legend.parent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title='item.name' style="width: 300px"></el-option> <el-option class="text-ellipsis" v-for="item in queryValues.filter(query => (query.parent === legend.parent) && query.type === 'item')" :key="item.id" :value="item.name" :label='item.name' :title='item.name' style="width: 300px"></el-option>

View File

@@ -15,7 +15,7 @@
</el-form-item> </el-form-item>
<!--brand--> <!--brand-->
<el-form-item :label='$t("asset.brand")' prop="brandId"> <el-form-item :label='$t("asset.brand")' prop="brandId">
<el-select value-key="id" allow-create class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" :filterable="true" v-model="editModel.brandId" placeholder="" size="small" id="module-box-input-project"> <el-select value-key="id" allow-create :maxlength="64" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" :filterable="true" v-model="editModel.brandId" placeholder="" size="small" id="module-box-input-project">
<el-option :id="'module-project-'+item.id" v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-option :id="'module-project-'+item.id" v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>

View File

@@ -75,6 +75,7 @@
popper-class="right-box-select-top right-public-box-dropdown-top" popper-class="right-box-select-top right-public-box-dropdown-top"
placeholder="key" placeholder="key"
size="mini" size="mini"
:maxlength="64"
@select="handleSelect" @select="handleSelect"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>

View File

@@ -940,7 +940,7 @@
style="margin-right: 10px" style="margin-right: 10px"
@change="change('valueMapping', index)" @change="change('valueMapping', index)"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option
@@ -1018,7 +1018,7 @@
size="small" size="small"
@change="change" @change="change"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option

View File

@@ -195,7 +195,7 @@
size="small" size="small"
@change="change" @change="change"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option

View File

@@ -690,7 +690,7 @@
style="margin-right: 10px" style="margin-right: 10px"
@change="change('valueMapping', index)" @change="change('valueMapping', index)"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option
@@ -769,7 +769,7 @@
size="small" size="small"
@change="change" @change="change"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option

View File

@@ -33,7 +33,7 @@
:placeholder="editIssue.type" :placeholder="editIssue.type"
style="margin-right: 10px" style="margin-right: 10px"
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option

View File

@@ -52,6 +52,7 @@
<!-- <el-input placeholder="" v-model=""></el-input>--> <!-- <el-input placeholder="" v-model=""></el-input>-->
<el-autocomplete <el-autocomplete
id="module-box-input-pattern" id="module-box-input-pattern"
:maxlength="64"
v-model="editModule.endpointNameTmpl" v-model="editModule.endpointNameTmpl"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
:placeholder="$t('overall.placeHolder')" :placeholder="$t('overall.placeHolder')"

View File

@@ -16,6 +16,7 @@
id="traffic-setting-asset" id="traffic-setting-asset"
popper-class="no-style-class" popper-class="no-style-class"
size="small" size="small"
:maxlength="64"
v-model="assetSetting.host" v-model="assetSetting.host"
></el-autocomplete> ></el-autocomplete>
<el-popover @hide="popHide" @show="popShow" placement="bottom" popper-class="no-style-class" trigger="hover"> <el-popover @hide="popHide" @show="popShow" placement="bottom" popper-class="no-style-class" trigger="hover">
@@ -177,6 +178,7 @@
:trigger-on-focus="true" :trigger-on-focus="true"
popper-class="no-style-class" popper-class="no-style-class"
size="mini" size="mini"
:maxlength="64"
:highlight-first-item="true" :highlight-first-item="true"
@input="ifIndexInputChange(scope.row[item.prop],scope.row,scope.$index)" @input="ifIndexInputChange(scope.row[item.prop],scope.row,scope.$index)"
></el-autocomplete> ></el-autocomplete>

View File

@@ -78,7 +78,7 @@
v-model="editDialogObj.value" v-model="editDialogObj.value"
multiple multiple
filterable filterable
allow-create allow-create :maxlength="64"
default-first-option default-first-option
> >
<el-option <el-option