feat: 单选题增加隐藏功能
- 通过添加 filterOptions 来管理隐藏的 options.组件挂载时重置options 列表 - 添加对应的注释内容. - 修复错误的类型.
This commit is contained in:
80
src/types/question.d.ts
vendored
80
src/types/question.d.ts
vendored
@@ -11,21 +11,22 @@ export declare interface OptionConfigType {
|
|||||||
limit_right_content?: string;
|
limit_right_content?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export declare interface questionOptionType {
|
// 矩阵的 options 选项
|
||||||
|
export declare interface IMatrixListOption {
|
||||||
// 包含 HTML 标签的字符串,例如 "<p>选项1</p>"
|
// 包含 HTML 标签的字符串,例如 "<p>选项1</p>"
|
||||||
option?: string;
|
option: string;
|
||||||
is_other?: number;
|
is_other: number;
|
||||||
is_fixed?: number;
|
is_fixed: number;
|
||||||
is_remove_other?: number;
|
is_remove_other: number;
|
||||||
level?: number;
|
level: number;
|
||||||
option_key?: string;
|
option_key: string;
|
||||||
option_index?: string;
|
option_index: string;
|
||||||
option_code?: string;
|
option_code: string;
|
||||||
option_config?: OptionConfigType;
|
option_config: OptionConfigType;
|
||||||
parent_option_index?: number;
|
parent_option_index: number;
|
||||||
children?: null;
|
children: null;
|
||||||
}
|
}
|
||||||
|
// List/questions/options
|
||||||
declare interface IQuestionOption {
|
declare interface IQuestionOption {
|
||||||
type: number;
|
type: number;
|
||||||
cite_type: number;
|
cite_type: number;
|
||||||
@@ -34,50 +35,7 @@ declare interface IQuestionOption {
|
|||||||
relation_last_scope: number;
|
relation_last_scope: number;
|
||||||
relation_first_scope: number;
|
relation_first_scope: number;
|
||||||
relation_question_index: number;
|
relation_question_index: number;
|
||||||
options: IMatrixCheckboxOption[];
|
options: IMatrixListOption[];
|
||||||
}
|
|
||||||
|
|
||||||
// 答案 config 类型
|
|
||||||
export declare interface IQuestionConfig {
|
|
||||||
text_type?: number;
|
|
||||||
include_mark;
|
|
||||||
disabled?: string[];
|
|
||||||
version?: string;
|
|
||||||
scene?: string | null;
|
|
||||||
shelf?: string | null;
|
|
||||||
ware?: string | null;
|
|
||||||
row_option_groups?: string | null;
|
|
||||||
cell_option_groups?: string | null;
|
|
||||||
is_repeat?: number;
|
|
||||||
allow_repeat_num?: number;
|
|
||||||
repeat_type?: number;
|
|
||||||
alert_text?: string;
|
|
||||||
is_required?: number;
|
|
||||||
is_change_row_cell?: number;
|
|
||||||
select_random?: number;
|
|
||||||
row_random?: number;
|
|
||||||
cell_random?: number;
|
|
||||||
is_three_dimensions?: number;
|
|
||||||
material_sn?: string;
|
|
||||||
scene_information?: string | null;
|
|
||||||
simple_scene_information?: string | null;
|
|
||||||
is_behavior?: number;
|
|
||||||
is_price_tag?: number;
|
|
||||||
is_brand?: number;
|
|
||||||
is_initialize?: number;
|
|
||||||
is_default_perspective?: number;
|
|
||||||
is_disable_lines_same?: number;
|
|
||||||
disable_lines_same?: number;
|
|
||||||
float_window?: number;
|
|
||||||
is_disable?: number;
|
|
||||||
float_window_content?: string;
|
|
||||||
popup_window?: number;
|
|
||||||
popup_window_content?: string;
|
|
||||||
is_show?: string[];
|
|
||||||
quick_type?: number;
|
|
||||||
is_limit_right_content?: number;
|
|
||||||
option_group_random_inside?: string | null;
|
|
||||||
option_group_random_outside?: string | null;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 答案 question
|
// 答案 question
|
||||||
@@ -88,8 +46,10 @@ export declare interface IQuestion<QuestionConfig = IBaseConfig> {
|
|||||||
title?: string;
|
title?: string;
|
||||||
stem?: string;
|
stem?: string;
|
||||||
other?: string;
|
other?: string;
|
||||||
|
// 隐藏的选项
|
||||||
|
hideOptions: string[];
|
||||||
// options 列表项,第一个是默认
|
// options 列表项,第一个是默认
|
||||||
list: questionOptionType[] | IQuestionOption[];
|
list: IQuestionOption[];
|
||||||
question_index?: number;
|
question_index?: number;
|
||||||
question_type?: number;
|
question_type?: number;
|
||||||
// 如果没有自定义类型,那么就直接用基础 config 类型
|
// 如果没有自定义类型,那么就直接用基础 config 类型
|
||||||
@@ -99,8 +59,8 @@ export declare interface IQuestion<QuestionConfig = IBaseConfig> {
|
|||||||
updated_user_id?: number | null;
|
updated_user_id?: number | null;
|
||||||
survey_id?: number;
|
survey_id?: number;
|
||||||
logic_config?: LogicConfig;
|
logic_config?: LogicConfig;
|
||||||
options: questionOptionType[];
|
options: IQuestionOption[];
|
||||||
questions: questionOptionType[];
|
questions: IQuestionOption[];
|
||||||
associate?: any[];
|
associate?: any[];
|
||||||
logics_has?: string | null;
|
logics_has?: string | null;
|
||||||
last_option_index?: number;
|
last_option_index?: number;
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ declare interface IBaseConfig {
|
|||||||
popup_window_content: string;
|
popup_window_content: string;
|
||||||
|
|
||||||
scene?: string | null;
|
scene?: string | null;
|
||||||
|
// 选项随机
|
||||||
select_random: number;
|
select_random: number;
|
||||||
simple_scene_information?: string | null;
|
simple_scene_information?: string | null;
|
||||||
shelf?: string | null;
|
shelf?: string | null;
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
declare interface IChoiceConfig extends IBaseConfig {
|
declare interface IChoiceConfig extends IBaseConfig {
|
||||||
max_select: number | '';
|
max_select: number | '';
|
||||||
min_select: number | '';
|
min_select: number | '';
|
||||||
|
// 每行列数
|
||||||
each_number: number;
|
each_number: number;
|
||||||
option_groups: null;
|
option_groups: null;
|
||||||
is_binding_goods: number;
|
is_binding_goods: number;
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ interface _questionOptionType extends questionOptionType {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 题目
|
// 题目
|
||||||
const element = defineModel<IQuestion<IMatrixCheckboxConfig>>('element', {
|
const element = defineModel<IQuestion>('element', {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {
|
default: () => {
|
||||||
return {};
|
return {};
|
||||||
|
|||||||
@@ -644,7 +644,7 @@ async function answer(callback, callbackBeforePage) {
|
|||||||
let isError = false;
|
let isError = false;
|
||||||
// 如果问题没有答案还有是必须填空的,就往下处理
|
// 如果问题没有答案还有是必须填空的,就往下处理
|
||||||
// 2025/4/1新增 : 如果有 error 内容, 同样视为有错误
|
// 2025/4/1新增 : 如果有 error 内容, 同样视为有错误
|
||||||
if (!answer || error.length) {
|
if (!answer || error) {
|
||||||
isError = true;
|
isError = true;
|
||||||
// 各个问题单独处理
|
// 各个问题单独处理
|
||||||
if (questionType === 10) {
|
if (questionType === 10) {
|
||||||
@@ -893,6 +893,7 @@ async function answer(callback, callbackBeforePage) {
|
|||||||
updateAnswer(data.answer_info_autofill);
|
updateAnswer(data.answer_info_autofill);
|
||||||
// 更新分页数组
|
// 更新分页数组
|
||||||
questionsData.value.answer.pages = data.pages;
|
questionsData.value.answer.pages = data.pages;
|
||||||
|
console.log(`preview/index question value`, question);
|
||||||
// 选项隐藏
|
// 选项隐藏
|
||||||
hideOptions(data.hide_options);
|
hideOptions(data.hide_options);
|
||||||
// 更新action
|
// 更新action
|
||||||
|
|||||||
@@ -9,8 +9,9 @@
|
|||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref, watch } from 'vue';
|
import { computed, onUnmounted, ref, watch } from 'vue';
|
||||||
import Choice from '@/views/Design/components/Questions/Choice.vue';
|
import Choice from '@/views/Design/components/Questions/Choice.vue';
|
||||||
|
import type { IMatrixListOption, IQuestion } from '@/types/question';
|
||||||
|
|
||||||
type answerType = {
|
type answerType = {
|
||||||
options?: any[];
|
options?: any[];
|
||||||
@@ -21,18 +22,37 @@ type answerType = {
|
|||||||
const answer = defineModel<answerType>('answer', { default: undefined });
|
const answer = defineModel<answerType>('answer', { default: undefined });
|
||||||
const answerIndex = computed(() => question.value.title);
|
const answerIndex = computed(() => question.value.title);
|
||||||
// const stem = defineModel<string>('stem', { default: '' });
|
// const stem = defineModel<string>('stem', { default: '' });
|
||||||
const question = defineModel<question>('question', { default: { config: { is_required: false } } });
|
const question = defineModel<IQuestion>('question', {
|
||||||
const list = defineModel<questionsList[]>('list', { default: [[]] });
|
default: { config: { is_required: false } }
|
||||||
|
});
|
||||||
|
|
||||||
const choiceValue = ref<string>('0');
|
const filterOptions = <IMatrixListOption[]>[];
|
||||||
|
|
||||||
// 初始化数据,因为 preview 的数据源和 element 的数据源不相同, 所以需要配置一遍数据
|
const list = computed(() => {
|
||||||
initData();
|
// 有意外情况,可能存在 hideOptions
|
||||||
|
if (question.value.hideOptions?.length) {
|
||||||
|
const [_list] = question.value.list;
|
||||||
|
const options = _list.options;
|
||||||
|
|
||||||
function initData() {
|
// 取出 hideOptions,然后提出相应的元素,需要重置 hideOptions。
|
||||||
console.log(`question`, question.value);
|
// 不然会出现再次进入无法得到原来所有的选项
|
||||||
// question.value.options = list.value;
|
const hideOptions = question.value.hideOptions;
|
||||||
|
_list.options = options.filter((option) => {
|
||||||
|
const res = hideOptions.includes(option.option_key);
|
||||||
|
if (res) {
|
||||||
|
// 如果有相应的选项, 需要把它 push 到 filterOptions
|
||||||
|
filterOptions.push(option);
|
||||||
}
|
}
|
||||||
|
return !res;
|
||||||
|
});
|
||||||
|
question.value.hideOptions = [];
|
||||||
|
} else {
|
||||||
|
return question.value.list;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`list`, list.value);
|
||||||
|
const choiceValue = ref<string>('0');
|
||||||
|
|
||||||
// // 预览新增 emit ['changeAnswer', 'previous', 'next']
|
// // 预览新增 emit ['changeAnswer', 'previous', 'next']
|
||||||
const emit = defineEmits(['update:element', 'changeAnswer', 'previous', 'next', 'update:element']);
|
const emit = defineEmits(['update:element', 'changeAnswer', 'previous', 'next', 'update:element']);
|
||||||
@@ -69,4 +89,17 @@ watch(
|
|||||||
emit('changeAnswer', res);
|
emit('changeAnswer', res);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (!filterOptions.length) return;
|
||||||
|
let options = question.value.list[0].options;
|
||||||
|
// 把 filterOptions 里面的选项加上
|
||||||
|
options = [...options, ...filterOptions];
|
||||||
|
question.value.list[0].options = options;
|
||||||
|
|
||||||
|
// 如果已经有随机的配置,不需要重新进行排序
|
||||||
|
if (question.value.config.select_random) return;
|
||||||
|
// 重新进行排序
|
||||||
|
options.sort((optionA, optionB) => Number(optionA.option_key) - Number(optionB.option_key));
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user