feat(选项设置扩展)：选择类题型增加选项排列配置 (#403)
* build: add optimizeDeps packages * feat(选项设置扩展)：选择类题型增加选项排列配置 * feat(选项设置扩展): 验收问题修复 --------- Co-authored-by: jiangchunfu <jiangchunfu@kaike.la>
This commit is contained in:
Jiangchunfu
GitHub
parent
9427e0efe5
commit
949a989dcf
@ -97,7 +97,7 @@ export default defineComponent({
|
||||
|
||||
return (
|
||||
<div class="choice-wrapper">
|
||||
<div class={[isMatrix ? 'nest-box' : '', 'choice-box']}>
|
||||
<div class={[isMatrix ? 'nest-box' : '', 'choice-box', this.layout || 'vertical']}>
|
||||
{getOptions.map((item, index) => {
|
||||
return (
|
||||
!item.hide && (
|
||||
@ -106,11 +106,10 @@ export default defineComponent({
|
||||
style={this.choiceStyle}
|
||||
class={['choice-outer']}
|
||||
>
|
||||
<div style="position: relative">
|
||||
<div style="position: relative" class="choice-content">
|
||||
{!/^\s*$/.test(item.text) && (
|
||||
<div
|
||||
class={[
|
||||
this.layout === 'vertical' ? 'vertical' : '',
|
||||
isChecked(item) ? 'is-checked' : '',
|
||||
index === getOptions.length - 1 ? 'lastchild' : '',
|
||||
index === getOptions.length - 2 ? 'last2child' : '',
|
||||
|
||||
@ -25,11 +25,41 @@
|
||||
padding: 0 0.2rem !important;
|
||||
box-sizing: border-box;
|
||||
|
||||
|
||||
|
||||
// .choice-content, .choice-item {
|
||||
// width: 100%;
|
||||
// }
|
||||
|
||||
&.vertical {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.choice-outer {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&.horizontal {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.choice-outer {
|
||||
width: 50%;
|
||||
|
||||
.question {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.choice-item {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
vertical-align: top;
|
||||
// height: .88rem;
|
||||
|
||||
@ -71,9 +71,37 @@ const meta = {
|
||||
hash: '115020'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'layout',
|
||||
propType: String,
|
||||
description: '排列方式',
|
||||
defaultValue: 'vertical'
|
||||
}
|
||||
],
|
||||
formConfig: [basicConfig],
|
||||
formConfig: [basicConfig, {
|
||||
name: 'optionConfig',
|
||||
title: '选项配置',
|
||||
type: 'Customed',
|
||||
content: [
|
||||
{
|
||||
label: '排列方式',
|
||||
type: 'RadioGroup',
|
||||
key: 'layout',
|
||||
value: 'vertical',
|
||||
options: [
|
||||
{
|
||||
label: '竖排',
|
||||
value: 'vertical'
|
||||
},
|
||||
{
|
||||
label: '横排',
|
||||
value: 'horizontal'
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
}],
|
||||
editConfigure: {
|
||||
optionEdit: {
|
||||
show: false
|
||||
|
||||
@ -107,6 +107,7 @@ export default defineComponent({
|
||||
options={myOptions}
|
||||
onChange={onChange}
|
||||
value={value}
|
||||
layout={this.layout}
|
||||
>
|
||||
{{
|
||||
selectMore: (scoped) => {
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
import basicConfig from '@materials/questions/common/config/basicConfig'
|
||||
|
||||
const meta = {
|
||||
title: '多选',
|
||||
type: 'checkbox',
|
||||
@ -83,6 +82,12 @@ const meta = {
|
||||
propType: Number,
|
||||
description: '最多选择数',
|
||||
defaultValue: 0
|
||||
},
|
||||
{
|
||||
name: 'layout',
|
||||
propType: String,
|
||||
description: '排列方式',
|
||||
defaultValue: 'vertical'
|
||||
}
|
||||
],
|
||||
formConfig: [
|
||||
@ -92,6 +97,22 @@ const meta = {
|
||||
title: '选项配置',
|
||||
type: 'Customed',
|
||||
content: [
|
||||
{
|
||||
label: '排列方式',
|
||||
type: 'RadioGroup',
|
||||
key: 'layout',
|
||||
value: 'vertical',
|
||||
options: [
|
||||
{
|
||||
label: '竖排',
|
||||
value: 'vertical'
|
||||
},
|
||||
{
|
||||
label: '横排',
|
||||
value: 'horizontal'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label: '至少选择数',
|
||||
type: 'InputNumber',
|
||||
|
||||
@ -71,9 +71,37 @@ const meta = {
|
||||
hash: '115020'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'layout',
|
||||
propType: String,
|
||||
description: '排列方式',
|
||||
defaultValue: 'vertical'
|
||||
}
|
||||
],
|
||||
formConfig: [basicConfig],
|
||||
formConfig: [basicConfig, {
|
||||
name: 'optionConfig',
|
||||
title: '选项配置',
|
||||
type: 'Customed',
|
||||
content: [
|
||||
{
|
||||
label: '排列方式',
|
||||
type: 'RadioGroup',
|
||||
key: 'layout',
|
||||
value: 'vertical',
|
||||
options: [
|
||||
{
|
||||
label: '竖排',
|
||||
value: 'vertical'
|
||||
},
|
||||
{
|
||||
label: '横排',
|
||||
value: 'horizontal'
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
}],
|
||||
editConfigure: {
|
||||
optionEdit: {
|
||||
show: true
|
||||
|
||||
@ -103,7 +103,7 @@ export default defineComponent({
|
||||
return (
|
||||
<BaseChoice
|
||||
uiTarget={innerType}
|
||||
layout={'vertical'}
|
||||
layout={this.layout}
|
||||
name={this.field}
|
||||
innerType={this.innerType}
|
||||
value={this.value}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import basicConfig from '@materials/questions/common/config/basicConfig'
|
||||
import * as optionConfig from '@materials/questions/common/config/optionsConfig';
|
||||
|
||||
const meta = {
|
||||
title: '投票',
|
||||
@ -93,6 +94,7 @@ const meta = {
|
||||
type: 'Customed',
|
||||
key: 'optionConfig',
|
||||
content: [
|
||||
optionConfig.layout,
|
||||
{
|
||||
label: '设置为多选题',
|
||||
type: 'CheckBox',
|
||||
|
||||
@ -67,7 +67,9 @@ export default defineConfig({
|
||||
'yup',
|
||||
'crypto-js/sha256',
|
||||
'element-plus/es/locale/lang/zh-cn',
|
||||
'node-forge'
|
||||
'node-forge',
|
||||
'@logicflow/core',
|
||||
'@logicflow/extension'
|
||||
]
|
||||
},
|
||||
plugins: [
|
||||
|
||||
Loading…
Reference in New Issue
Block a user