效果图
class="demo">
- v-for="(item, index) in questionList" :key="index" style="margin-top: 20px; padding: 20px; border: 1px solid #666">
style="display: flex; align-items: center">
题目类型:
v-model="item.questionType">
label="无" :value="0" />
label="输入" :value="1" />
label="单选" :value="2" />
label="多选" :value="3" />
style="margin-top: 10px">问题:{{ item.question }}
v-if="item.questionType === 2" @click="showDialog(index)">新增选项
v-for="(op, i) in item.options" :key="i" style="display: flex; align-items: center; margin-top: 10px; ">
style="margin-right: 10px; padding: 10px; width: 300px; background: #999; cursor: pointer" >
{{ op.id }}
style="margin-left: 10px">{{ op.text }}
style="margin-left: 50px; color:#CCC">
v-for="(child, childIndex) in op.children" :key="child.id">
style="display: inline-block; width: 150px">{{ child.text }}
type="danger" @click="delChildOptoin(index, i, childIndex)">删除
type="danger" @click="delOptoin(index, i)">删除
:visible.sync="showDialogVisible"
width="30%"
>
选项:
v-model="dialogText" placeholder="请输入选项内容" />
类型:
v-model="dialogOptionType">
v-for="(item, i) in optionsTypeList" :key="i" :label="item" :value="i" />
v-if="dialogOptionType === 2" @click="addOption">新增选项
v-for="(item, i) in dialogOptionChildren">
v-model="item.text" placeholder="请输入选项" />
slot="footer" class="dialog-footer">
@click="showDialogVisible = false">取 消
type="primary" @click="confirmOption">确 定