refactor(Design): 重构设计页面组件和逻辑
- 修改 QuestionAction 组件,优化题前隐藏和题后跳转的逻辑和界面 - 更新 ChooseQuestion 组件,改进选项索引的处理方式 - 调整 Design/Index 组件,替换 BaseSelect 为 Choice 组件 - 更新 components.d.ts,添加 VanButton 和 VanDialog 的类型声明
This commit is contained in:
@@ -35,12 +35,12 @@
|
||||
<van-divider></van-divider>
|
||||
<van-cell title="题前隐藏" :border="false" @click="questionSetting('before')">
|
||||
<template #right-icon>
|
||||
<span> {{ getSkipTypeText(0) }} <van-icon name="arrow"></van-icon></span>
|
||||
<span> {{ getSkipTypeText(1) }} <van-icon name="arrow"></van-icon></span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="题后跳转" :border="false" @click="questionSetting('after')">
|
||||
<template #right-icon>
|
||||
<span> {{ getSkipTypeText(1) }} <van-icon name="arrow"></van-icon></span>
|
||||
<span> {{ getSkipTypeText(0) }} <van-icon name="arrow"></van-icon></span>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-divider></van-divider>
|
||||
@@ -54,25 +54,52 @@
|
||||
<van-popup
|
||||
v-model:show="questionBeforeShow"
|
||||
title="题前隐藏逻辑"
|
||||
label="题前隐藏逻辑"
|
||||
position="bottom"
|
||||
:overlay="false"
|
||||
closeable
|
||||
close-icon="close"
|
||||
round
|
||||
:style="{ minHeight: '60%' }"
|
||||
:style="{ maxHeight: '75%' }"
|
||||
>
|
||||
<template v-for="(item, logicIndex) in logics" :key="logicIndex">
|
||||
<div
|
||||
v-if="item.skip_type === skipType && item.question_index === activeQuestion.question_index"
|
||||
class="mv10 question-setting"
|
||||
>
|
||||
<template v-for="(log, logIndex) in item.logic" :key="logIndex">
|
||||
<yl-select
|
||||
v-model="log.logic"
|
||||
:options="settingIfOption"
|
||||
class="question-setting-if"
|
||||
></yl-select>
|
||||
<yl-select v-model="log.logic" :options="settingIfOption"></yl-select>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
<div class="mv10">
|
||||
<header><strong>题前隐藏逻辑</strong></header>
|
||||
<question-before
|
||||
v-model="questionsInfo.logics"
|
||||
:skipType="skipType"
|
||||
:activeQuestion="activeQuestion"
|
||||
></question-before>
|
||||
<van-button>添加逻辑</van-button>
|
||||
</div>
|
||||
|
||||
<!-- <template v-for="(item, index) in logics" :key="index" class="flex">-->
|
||||
<!-- <div class="flex space-between mv10">-->
|
||||
<!-- <div-->
|
||||
<!-- v-if="-->
|
||||
<!-- item.skip_type === skipType && item.question_index === activeQuestion.question_index-->
|
||||
<!-- "-->
|
||||
<!-- class="question-setting"-->
|
||||
<!-- >-->
|
||||
<!-- <template v-for="(log, logIndex) in item.logic" :key="logIndex">-->
|
||||
<!-- <div>-->
|
||||
<!-- <yl-select-->
|
||||
<!-- v-model="log.logic"-->
|
||||
<!-- :options="settingIfOption"-->
|
||||
<!-- class="question-setting-if"-->
|
||||
<!-- ></yl-select>-->
|
||||
<!-- <yl-select v-model="log.logic" :options="settingIfOption"></yl-select>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div-->
|
||||
<!-- v-if="-->
|
||||
<!-- item.skip_type === skipType && item.question_index === activeQuestion.question_index-->
|
||||
<!-- "-->
|
||||
<!-- >-->
|
||||
<!-- del-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
</van-popup>
|
||||
</template>
|
||||
<script setup>
|
||||
@@ -80,18 +107,11 @@ import { showConfirmDialog } from 'vant';
|
||||
import { ref } from 'vue';
|
||||
import { useCounterStore } from '@/stores/counter';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
import YlSelect from '@/components/YLSelect.vue';
|
||||
|
||||
import QuestionBefore from '@/views/Design/components/ActionCompoents/components/QuestionBefore.vue';
|
||||
const store = useCounterStore();
|
||||
const { questionsInfo } = storeToRefs(store);
|
||||
const logics = questionsInfo.value.logics;
|
||||
|
||||
const settingIfOption = [
|
||||
{ label: 'if', value: 'if' },
|
||||
{ label: 'always', value: 'always' }
|
||||
];
|
||||
|
||||
const props = defineProps({
|
||||
index: {
|
||||
type: Number,
|
||||
@@ -187,7 +207,7 @@ const questionSetting = (type) => {
|
||||
questionBeforeShow.value = true;
|
||||
break;
|
||||
}
|
||||
skipType.value = type === 'before' ? 0 : 1;
|
||||
skipType.value = type === 'before' ? 1 : 0;
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@@ -205,10 +225,6 @@ const questionSetting = (type) => {
|
||||
//max-width: 90vw;
|
||||
}
|
||||
|
||||
.question-setting-if {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.question-action-container {
|
||||
font-size: 20px;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user