!213 1.下拉框支持tab模式 2.下拉框支持默认值
Merge pull request !213 from shuaiwu95/pr-5
This commit is contained in:
@@ -46,6 +46,26 @@ export const widgetSelect = {
|
|||||||
placeholder: '',
|
placeholder: '',
|
||||||
value: 'rgba(115,170,229,.5)',
|
value: 'rgba(115,170,229,.5)',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
type: 'el-input-text',
|
||||||
|
label: '默认值',
|
||||||
|
name: 'defaultValue',
|
||||||
|
required: false,
|
||||||
|
placeholder: '',
|
||||||
|
value: '',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'el-select',
|
||||||
|
label: '模式',
|
||||||
|
name: 'model',
|
||||||
|
required: false,
|
||||||
|
placeholder: '',
|
||||||
|
selectOptions: [
|
||||||
|
{ code: '1', name: '下拉框' },
|
||||||
|
{ code: '2', name: 'TAB按钮' }
|
||||||
|
],
|
||||||
|
value: '1'
|
||||||
|
},
|
||||||
/* {
|
/* {
|
||||||
type: 'el-select',
|
type: 'el-select',
|
||||||
label: '触发事件',
|
label: '触发事件',
|
||||||
|
|||||||
@@ -1,5 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<el-radio-group
|
||||||
|
class="el-radio-button-custom"
|
||||||
|
ref="select"
|
||||||
|
v-model="selectValue"
|
||||||
|
size="medium"
|
||||||
|
:style="styleObj"
|
||||||
|
@[eventChange]="(val) => change(val, options.find(item => item.value === val))"
|
||||||
|
v-if="model === '2'">
|
||||||
|
<el-radio-button v-for="item in options" :key="item.value" :label="item.value">{{ item.label }}</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
<anji-select
|
<anji-select
|
||||||
|
v-else
|
||||||
class="select"
|
class="select"
|
||||||
ref="select"
|
ref="select"
|
||||||
:style="styleObj"
|
:style="styleObj"
|
||||||
@@ -10,6 +21,7 @@
|
|||||||
option="value"
|
option="value"
|
||||||
@[eventChange]="(val, item) => change(val, item)"
|
@[eventChange]="(val, item) => change(val, item)"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import {
|
import {
|
||||||
@@ -33,6 +45,7 @@ export default {
|
|||||||
optionsData: {},
|
optionsData: {},
|
||||||
optionsSetup: {},
|
optionsSetup: {},
|
||||||
options: {},
|
options: {},
|
||||||
|
model: '1'
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@@ -84,6 +97,9 @@ export default {
|
|||||||
},
|
},
|
||||||
setOptions() {
|
setOptions() {
|
||||||
const optionsData = this.optionsData;
|
const optionsData = this.optionsData;
|
||||||
|
const optionsSetup = this.optionsSetup;
|
||||||
|
this.selectValue = optionsSetup.defaultValue;
|
||||||
|
this.model = optionsSetup.model;
|
||||||
return optionsData.dataType === "staticData"
|
return optionsData.dataType === "staticData"
|
||||||
? this.staticData(optionsData.staticData)
|
? this.staticData(optionsData.staticData)
|
||||||
: this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
|
: this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
|
||||||
@@ -137,4 +153,30 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::v-deep.el-radio-button-custom {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
.el-radio-button {
|
||||||
|
height: 100%!important;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.el-radio-button__inner {
|
||||||
|
padding: 0!important;
|
||||||
|
height: 100%!important;
|
||||||
|
width: 100%!important;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 16px;
|
||||||
|
background: inherit;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
.el-radio-button__orig-radio:checked+.el-radio-button__inner {
|
||||||
|
background-color: #40a0ffb3!important;
|
||||||
|
color: #ffffff!important;
|
||||||
|
border: 1px solid #ffffff!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user