feat(Design): 新增矩阵题型支持
- 添加 BeforeMartrixRadio、BeforeMartrixCheckbox 和 BeforeMartrixComplation 组件 - 更新 QuestionBefore组件以支持矩阵题型 - 优化逻辑配置的添加和删除功能 - 调整样式,包括图标和渐变效果
This commit is contained in:
4
auto-imports.d.ts
vendored
4
auto-imports.d.ts
vendored
@@ -5,4 +5,6 @@
|
|||||||
// Generated by unplugin-auto-import
|
// Generated by unplugin-auto-import
|
||||||
// biome-ignore lint: disable
|
// biome-ignore lint: disable
|
||||||
export {}
|
export {}
|
||||||
declare global {}
|
declare global {
|
||||||
|
|
||||||
|
}
|
||||||
|
|||||||
2
components.d.ts
vendored
2
components.d.ts
vendored
@@ -35,8 +35,10 @@ declare module 'vue' {
|
|||||||
VanSearch: typeof import('vant/es')['Search']
|
VanSearch: typeof import('vant/es')['Search']
|
||||||
VanStepper: typeof import('vant/es')['Stepper']
|
VanStepper: typeof import('vant/es')['Stepper']
|
||||||
VanSwitch: typeof import('vant/es')['Switch']
|
VanSwitch: typeof import('vant/es')['Switch']
|
||||||
|
VanTab: typeof import('vant/es')['Tab']
|
||||||
VanTabbar: typeof import('vant/es')['Tabbar']
|
VanTabbar: typeof import('vant/es')['Tabbar']
|
||||||
VanTabbarItem: typeof import('vant/es')['TabbarItem']
|
VanTabbarItem: typeof import('vant/es')['TabbarItem']
|
||||||
|
VanTabs: typeof import('vant/es')['Tabs']
|
||||||
YLCascader: typeof import('./src/components/YLCascader.vue')['default']
|
YLCascader: typeof import('./src/components/YLCascader.vue')['default']
|
||||||
YLInput: typeof import('./src/components/YLInput.vue')['default']
|
YLInput: typeof import('./src/components/YLInput.vue')['default']
|
||||||
YLPicker: typeof import('./src/components/YLPicker.vue')['default']
|
YLPicker: typeof import('./src/components/YLPicker.vue')['default']
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import { onMounted } from 'vue';
|
|||||||
import appBridge from '@/assets/js/appBridge';
|
import appBridge from '@/assets/js/appBridge';
|
||||||
import utils from '@/assets/js/common';
|
import utils from '@/assets/js/common';
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async() => {
|
||||||
if (utils.getParameter('digitalYiliToken')) {
|
if (utils.getParameter('digitalYiliToken')) {
|
||||||
// 隐藏/显示 header
|
// 隐藏/显示 header
|
||||||
appBridge.setHeaderShown(false);
|
appBridge.setHeaderShown(false);
|
||||||
|
|||||||
@@ -40,7 +40,6 @@ export default defineComponent({
|
|||||||
);
|
);
|
||||||
|
|
||||||
const handleChange = (event) => {
|
const handleChange = (event) => {
|
||||||
console.log(event);
|
|
||||||
emit('update:modelValue', event);
|
emit('update:modelValue', event);
|
||||||
emit('change', event);
|
emit('change', event);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -2,14 +2,29 @@
|
|||||||
<div class="common-layout">
|
<div class="common-layout">
|
||||||
<!-- title 标题和搜索栏 -->
|
<!-- title 标题和搜索栏 -->
|
||||||
<header class="header">
|
<header class="header">
|
||||||
<van-nav-bar class="header-nav" :title="$route.meta.title" left-arrow @click-left="$router.go(-1)" />
|
<van-nav-bar
|
||||||
<van-search shape="round" class="header-search" placeholder="请输入搜索关键词" background="#6fb937" />
|
class="header-nav"
|
||||||
|
:title="$route.meta.title"
|
||||||
|
left-arrow
|
||||||
|
@click-left="$router.go(-1)"
|
||||||
|
/>
|
||||||
|
<van-search
|
||||||
|
shape="round"
|
||||||
|
class="header-search"
|
||||||
|
placeholder="请输入搜索关键词"
|
||||||
|
background="#6fb937"
|
||||||
|
/>
|
||||||
</header>
|
</header>
|
||||||
<!-- content -->
|
<!-- content -->
|
||||||
<RouterView />
|
<RouterView />
|
||||||
<!-- tabbar -->
|
<!-- tabbar -->
|
||||||
<van-tabbar v-model="active">
|
<van-tabbar v-model="active">
|
||||||
<van-tabbar-item v-for="tab in table" :key="tab.title" :name="tab.title" @click="tabPath(tab.path)">
|
<van-tabbar-item
|
||||||
|
v-for="tab in table"
|
||||||
|
:key="tab.title"
|
||||||
|
:name="tab.title"
|
||||||
|
@click="tabPath(tab.path)"
|
||||||
|
>
|
||||||
<!-- <van-tabbar-item v-for="tab in table" :key="tab.title" :name="tab.title" :to="tab.path"> -->
|
<!-- <van-tabbar-item v-for="tab in table" :key="tab.title" :name="tab.title" :to="tab.path"> -->
|
||||||
<span>{{ tab.title }}</span>
|
<span>{{ tab.title }}</span>
|
||||||
<!-- <template #icon="props"> -->
|
<!-- <template #icon="props"> -->
|
||||||
@@ -25,9 +40,9 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { RouterView, useRouter } from 'vue-router';
|
import { RouterView, useRouter } from 'vue-router';
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
import utils from '@/assets/js/common';
|
// import utils from '@/assets/js/common';
|
||||||
import { getUserInfo } from '@/api/common/index.js';
|
// import { getUserInfo } from '@/api/common/index.js';
|
||||||
import { showFailToast } from 'vant';
|
// import { showFailToast } from 'vant';
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
const active = ref();
|
const active = ref();
|
||||||
|
|||||||
@@ -418,8 +418,6 @@ const emitFun = {
|
|||||||
saveQueItem(null, [item]);
|
saveQueItem(null, [item]);
|
||||||
},
|
},
|
||||||
logics: (item) => {
|
logics: (item) => {
|
||||||
// console.log(questionInfo.value.logics[);
|
|
||||||
// return false;
|
|
||||||
saveQueItem(questionInfo.value.logics, [item]);
|
saveQueItem(questionInfo.value.logics, [item]);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -124,7 +124,6 @@
|
|||||||
</header>
|
</header>
|
||||||
<!-- 题前 题后逻辑 本来打算拆成两个 但是 只有最后的处理不一样-->
|
<!-- 题前 题后逻辑 本来打算拆成两个 但是 只有最后的处理不一样-->
|
||||||
<div class="before-or-after">
|
<div class="before-or-after">
|
||||||
{{ questionsInfo.logics[2].logic }}
|
|
||||||
<question-before
|
<question-before
|
||||||
:skipType="skipType"
|
:skipType="skipType"
|
||||||
:activeQuestion="activeQuestion"
|
:activeQuestion="activeQuestion"
|
||||||
@@ -180,7 +179,7 @@ const saveSettings = () => {
|
|||||||
emit('setting', activeQuestion.value);
|
emit('setting', activeQuestion.value);
|
||||||
};
|
};
|
||||||
const saveLogics = () => {
|
const saveLogics = () => {
|
||||||
emit('logics', questionsInfo.value); // 将更新后的 questionsInfo 传递给父组件
|
emit('logics', activeQuestion.value); // 将更新后的 questionsInfo 传递给父组件
|
||||||
};
|
};
|
||||||
|
|
||||||
// 当前题目
|
// 当前题目
|
||||||
|
|||||||
@@ -19,9 +19,7 @@
|
|||||||
<yl-select v-model="logic.is_select" class="ml10" :options="chooseOptions"></yl-select>
|
<yl-select v-model="logic.is_select" class="ml10" :options="chooseOptions"></yl-select>
|
||||||
|
|
||||||
<div class="action-setting flex ml10">
|
<div class="action-setting flex ml10">
|
||||||
<van-icon name="clear" size="0.5rem" class="ml10 theme-color" />
|
<slot name="button"></slot>
|
||||||
<van-icon name="add" size="0.5rem" class="ml10 theme-color" />
|
|
||||||
<van-icon name="delete" size="0.5rem" class="ml10" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -80,7 +78,6 @@ const { logic, beforeQuesOptions } = toRefs(props);
|
|||||||
watch(
|
watch(
|
||||||
() => logic.value,
|
() => logic.value,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
console.log(newVal);
|
|
||||||
if (newVal !== oldVal) {
|
if (newVal !== oldVal) {
|
||||||
changeQuestionIndex();
|
changeQuestionIndex();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,9 +5,7 @@
|
|||||||
<yl-input v-model="logic.value" class="ml10" />
|
<yl-input v-model="logic.value" class="ml10" />
|
||||||
|
|
||||||
<div class="action-setting flex ml10">
|
<div class="action-setting flex ml10">
|
||||||
<van-icon name="clear" size="0.5rem" class="ml10 theme-color" />
|
<slot name="button"></slot>
|
||||||
<van-icon name="add" size="0.5rem" class="ml10 theme-color" />
|
|
||||||
<van-icon name="delete" size="0.5rem" class="ml10" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -0,0 +1,48 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex mt10 align-center space-between">
|
||||||
|
<!-- 行标签 -->
|
||||||
|
<yl-select v-model="logic.row_index" :options="getOptions('row')" class="group"></yl-select>
|
||||||
|
|
||||||
|
<!-- 选项 or 分组 -->
|
||||||
|
<yl-select
|
||||||
|
v-model="logic.is_option_group"
|
||||||
|
:options="groupOptions"
|
||||||
|
class="ml10 group"
|
||||||
|
></yl-select>
|
||||||
|
<!-- <yl-select v-model="logic.operator" :options="symbolOptions" class="ml10 symbol"></yl-select>-->
|
||||||
|
<yl-select v-model="logic.cell_index" :options="getOptions('col')" class="ml10"></yl-select>
|
||||||
|
<yl-select v-model="logic.is_select" class="ml10" :options="chooseOptions"></yl-select>
|
||||||
|
|
||||||
|
<div class="action-setting flex ml10">
|
||||||
|
<slot name="button"></slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { chooseOptions, groupOptions } from '@/utils/questionSteeingList.js';
|
||||||
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
|
const logic = defineModel('logic');
|
||||||
|
const beforeQuesOptions = defineModel('beforeQuesOptions');
|
||||||
|
|
||||||
|
const getOptions = (type) => {
|
||||||
|
let options = [];
|
||||||
|
beforeQuesOptions.value.forEach((item) => {
|
||||||
|
if (item.question_index === logic.value.question_index) {
|
||||||
|
if (item.question_type === 10) {
|
||||||
|
// 不是分组
|
||||||
|
if (logic.value.is_option_group === 0) {
|
||||||
|
options = item.options[type === 'row' ? 0 : 1].map((optItem) => {
|
||||||
|
return {
|
||||||
|
...optItem,
|
||||||
|
label: optItem.option,
|
||||||
|
value: optItem.option_index
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return options;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss"></style>
|
||||||
@@ -0,0 +1,43 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex mt10 align-center space-between">
|
||||||
|
<!-- 行标签 -->
|
||||||
|
<yl-select v-model="logic.row_index" :options="getOptions('row')" class="group"></yl-select>
|
||||||
|
<yl-select v-model="logic.cell_index" :options="getOptions('col')" class="ml10"></yl-select>
|
||||||
|
|
||||||
|
<!--是否被选中-->
|
||||||
|
<yl-select v-model="logic.operator" :options="completionOptions" class="ml10"></yl-select>
|
||||||
|
<yl-input v-model="logic.value" class="ml10" />
|
||||||
|
<div class="action-setting flex ml10">
|
||||||
|
<slot name="button"></slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { completionOptions } from '@/utils/questionSteeingList.js';
|
||||||
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
|
import YlInput from '@/components/YLInput.vue';
|
||||||
|
const logic = defineModel('logic', {});
|
||||||
|
const beforeQuesOptions = defineModel('beforeQuesOptions', {});
|
||||||
|
|
||||||
|
const getOptions = (type) => {
|
||||||
|
let options = [];
|
||||||
|
beforeQuesOptions.value.forEach((item) => {
|
||||||
|
if (item.question_index === logic.value.question_index) {
|
||||||
|
if (item.question_type === 8) {
|
||||||
|
// 不是分组
|
||||||
|
if (logic.value.is_option_group === 0) {
|
||||||
|
options = item.options[type === 'row' ? 0 : 1].map((optItem) => {
|
||||||
|
return {
|
||||||
|
...optItem,
|
||||||
|
label: optItem.option,
|
||||||
|
value: optItem.option_index
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return options;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss"></style>
|
||||||
@@ -0,0 +1,49 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex mt10 align-center space-between">
|
||||||
|
<!-- 行标签 -->
|
||||||
|
<yl-select v-model="logic.row_index" :options="getOptions('row')" class="group"></yl-select>
|
||||||
|
|
||||||
|
<!-- 选项 or 分组 -->
|
||||||
|
<yl-select
|
||||||
|
v-model="logic.is_option_group"
|
||||||
|
:options="groupOptions"
|
||||||
|
class="ml10 group"
|
||||||
|
></yl-select>
|
||||||
|
<yl-select v-model="logic.operator" :options="symbolOptions" class="ml10 symbol"></yl-select>
|
||||||
|
<yl-select v-model="logic.cell_index" :options="getOptions('col')" class="ml10"></yl-select>
|
||||||
|
|
||||||
|
<div class="action-setting flex ml10">
|
||||||
|
<slot name="button"></slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { groupOptions, symbolOptions } from '@/utils/questionSteeingList.js';
|
||||||
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
|
const logic = defineModel('logic');
|
||||||
|
const beforeQuesOptions = defineModel('beforeQuesOptions');
|
||||||
|
|
||||||
|
const getOptions = (type) => {
|
||||||
|
console.log(beforeQuesOptions);
|
||||||
|
let options = [];
|
||||||
|
|
||||||
|
beforeQuesOptions.value.forEach((item) => {
|
||||||
|
if (item.question_index === logic.value.question_index) {
|
||||||
|
if (item.question_type === 9) {
|
||||||
|
// 不是分组
|
||||||
|
if (logic.value.is_option_group === 0) {
|
||||||
|
options = item.options[type === 'row' ? 0 : 1].map((optItem) => {
|
||||||
|
return {
|
||||||
|
...optItem,
|
||||||
|
label: optItem.option,
|
||||||
|
value: optItem.option_index
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return options;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss"></style>
|
||||||
@@ -16,51 +16,24 @@
|
|||||||
v-if="logic.is_option_group === 0"
|
v-if="logic.is_option_group === 0"
|
||||||
v-model="logic.option_index"
|
v-model="logic.option_index"
|
||||||
class="ml10"
|
class="ml10"
|
||||||
:options="changeQuestionIndex(logic.question_index, logic)"
|
:options="changeQuestionIndex()"
|
||||||
></yl-select>
|
></yl-select>
|
||||||
<yl-select
|
<yl-select
|
||||||
v-else
|
v-else
|
||||||
v-model="logic.group_index"
|
v-model="logic.group_index"
|
||||||
class="ml10"
|
class="ml10"
|
||||||
:options="changeQuestionIndex(logic.question_index, logic)"
|
:options="changeQuestionIndex()"
|
||||||
></yl-select>
|
></yl-select>
|
||||||
|
|
||||||
<div class="action-setting flex ml10">
|
<div class="action-setting flex ml10">
|
||||||
<van-icon name="clear" size="0.5rem" class="ml10 theme-color" />
|
<slot name="button"></slot>
|
||||||
<van-icon name="add" size="0.5rem" class="ml10 theme-color" />
|
|
||||||
<van-icon name="delete" size="0.5rem" class="ml10" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { groupOptions, symbolOptions } from '@/utils/questionSteeingList.js';
|
import { groupOptions, symbolOptions } from '@/utils/questionSteeingList.js';
|
||||||
import YlSelect from '@/components/YLSelect.vue';
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
import { toRefs, watch } from 'vue';
|
import { watch } from 'vue';
|
||||||
const props = defineProps({
|
|
||||||
// logic: {
|
|
||||||
// type: Object,
|
|
||||||
// default: () => {
|
|
||||||
// return {};
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
logIndex: {
|
|
||||||
type: Number,
|
|
||||||
default: 0
|
|
||||||
},
|
|
||||||
beforeQuesOptions: {
|
|
||||||
type: Array,
|
|
||||||
default: () => {
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
},
|
|
||||||
activeQuestion: {
|
|
||||||
type: Object,
|
|
||||||
default: () => {
|
|
||||||
return {};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const changeQuestionIndex = () => {
|
const changeQuestionIndex = () => {
|
||||||
let options = [];
|
let options = [];
|
||||||
beforeQuesOptions.value.forEach((item) => {
|
beforeQuesOptions.value.forEach((item) => {
|
||||||
@@ -76,19 +49,17 @@ const changeQuestionIndex = () => {
|
|||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
// 分组
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return options;
|
return options;
|
||||||
};
|
};
|
||||||
const { beforeQuesOptions } = toRefs(props);
|
const beforeQuesOptions = defineModel('beforeQuesOptions');
|
||||||
const logic = defineModel('logic', {});
|
const logic = defineModel('logic', {});
|
||||||
watch(
|
watch(
|
||||||
() => logic.value,
|
() => logic.value,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
console.log(newVal);
|
|
||||||
if (newVal !== oldVal) {
|
if (newVal !== oldVal) {
|
||||||
changeQuestionIndex();
|
changeQuestionIndex();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,17 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex mt10 align-center space-between">
|
||||||
|
<yl-select v-model="logic.operator" :options="symbolOptions" class="mr10 symbol"></yl-select>
|
||||||
|
<yl-input v-model="logic.value" class="ml10" />
|
||||||
|
|
||||||
|
<div class="action-setting flex ml10">
|
||||||
|
<slot name="button"></slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { symbolOptions } from '@/utils/questionSteeingList.js';
|
||||||
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
|
import YlInput from '@/components/YLInput.vue';
|
||||||
|
const logic = defineModel('logic');
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss"></style>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<template v-for="(item, index) in logics" :key="index">
|
<template v-for="(item, index) in questionsInfo.logics" :key="index">
|
||||||
<div
|
<div
|
||||||
v-if="item.skip_type === skipType && item.question_index === activeQuestion.question_index"
|
v-if="item.skip_type === skipType && item.question_index === activeQuestion.question_index"
|
||||||
>
|
>
|
||||||
@@ -43,8 +43,32 @@
|
|||||||
:activeQuestion="activeQuestion"
|
:activeQuestion="activeQuestion"
|
||||||
:logic="log"
|
:logic="log"
|
||||||
:logIndex="logIndex"
|
:logIndex="logIndex"
|
||||||
|
:parentLogic="logics"
|
||||||
:beforeQuesOptions="beforeQuesOptions"
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
></BeforeRadio>
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeRadio>
|
||||||
<!-- 多选-->
|
<!-- 多选-->
|
||||||
<BeforeCkeckbox
|
<BeforeCkeckbox
|
||||||
v-if="
|
v-if="
|
||||||
@@ -52,9 +76,33 @@
|
|||||||
"
|
"
|
||||||
:activeQuestion="activeQuestion"
|
:activeQuestion="activeQuestion"
|
||||||
:logic="log"
|
:logic="log"
|
||||||
|
:parentLogic="logics"
|
||||||
:logIndex="logIndex"
|
:logIndex="logIndex"
|
||||||
:beforeQuesOptions="beforeQuesOptions"
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
></BeforeCkeckbox>
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeCkeckbox>
|
||||||
<!-- 填空-->
|
<!-- 填空-->
|
||||||
<!-- {{ questionsInfo.logics[index].logic }}-->
|
<!-- {{ questionsInfo.logics[index].logic }}-->
|
||||||
<BeforeCompletion
|
<BeforeCompletion
|
||||||
@@ -62,12 +110,177 @@
|
|||||||
log.logic !== 'always' && log.is_answer !== 0 && [4].includes(log.question_type)
|
log.logic !== 'always' && log.is_answer !== 0 && [4].includes(log.question_type)
|
||||||
"
|
"
|
||||||
:activeQuestion="activeQuestion"
|
:activeQuestion="activeQuestion"
|
||||||
|
:parentLogic="logics"
|
||||||
:logic="log"
|
:logic="log"
|
||||||
:logIndex="logIndex"
|
:logIndex="logIndex"
|
||||||
:index="index"
|
:index="index"
|
||||||
:beforeQuesOptions="beforeQuesOptions"
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
@update-logic="updateLogic"
|
@update-logic="updateLogic"
|
||||||
></BeforeCompletion>
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeCompletion>
|
||||||
|
|
||||||
|
<BeforeRate
|
||||||
|
v-if="
|
||||||
|
log.logic !== 'always' &&
|
||||||
|
log.is_answer !== 0 &&
|
||||||
|
[5, 106].includes(log.question_type)
|
||||||
|
"
|
||||||
|
:activeQuestion="activeQuestion"
|
||||||
|
:logic="log"
|
||||||
|
:parentLogic="logics"
|
||||||
|
:logIndex="logIndex"
|
||||||
|
:index="index"
|
||||||
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeRate>
|
||||||
|
|
||||||
|
<BeforeMartrixRadio
|
||||||
|
v-if="
|
||||||
|
log.logic !== 'always' && log.is_answer !== 0 && [9].includes(log.question_type)
|
||||||
|
"
|
||||||
|
:activeQuestion="activeQuestion"
|
||||||
|
:parentLogic="logics"
|
||||||
|
:logic="log"
|
||||||
|
:logIndex="logIndex"
|
||||||
|
:index="index"
|
||||||
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeMartrixRadio>
|
||||||
|
<BeforeMartrixCheckbox
|
||||||
|
v-if="
|
||||||
|
log.logic !== 'always' && log.is_answer !== 0 && [10].includes(log.question_type)
|
||||||
|
"
|
||||||
|
:activeQuestion="activeQuestion"
|
||||||
|
:logic="log"
|
||||||
|
:parentLogic="logics"
|
||||||
|
:logIndex="logIndex"
|
||||||
|
:index="index"
|
||||||
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeMartrixCheckbox>
|
||||||
|
|
||||||
|
<BeforeMartrixComplation
|
||||||
|
v-if="
|
||||||
|
log.logic !== 'always' && log.is_answer !== 0 && [8].includes(log.question_type)
|
||||||
|
"
|
||||||
|
:parentLogic="logics"
|
||||||
|
:activeQuestion="activeQuestion"
|
||||||
|
:logic="log"
|
||||||
|
:logIndex="logIndex"
|
||||||
|
:index="index"
|
||||||
|
:beforeQuesOptions="beforeQuesOptions"
|
||||||
|
>
|
||||||
|
<template #button>
|
||||||
|
<van-icon
|
||||||
|
name="add"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="addLogicItem(logIndex, item.logic)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-if="logIndex !== 0"
|
||||||
|
name="clear"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10 theme-color"
|
||||||
|
@click="deleteLogic(logIndex, item.logic, index)"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
v-else
|
||||||
|
name="delete"
|
||||||
|
size="0.5rem"
|
||||||
|
class="ml10"
|
||||||
|
@click="remoteLogic(index)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</BeforeMartrixComplation>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <div class="action">-->
|
<!-- <div class="action">-->
|
||||||
@@ -118,12 +331,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import { v4 as uuidv4 } from 'uuid';
|
||||||
import { settingIfOptions, settingAndOptions, answerOptions } from '@/utils/questionSteeingList.js';
|
import { settingIfOptions, settingAndOptions, answerOptions } from '@/utils/questionSteeingList.js';
|
||||||
import YlSelect from '@/components/YLSelect.vue';
|
import YlSelect from '@/components/YLSelect.vue';
|
||||||
import BeforeRadio from './BeforComponent/BeforeRadio.vue';
|
import BeforeRadio from './BeforComponent/BeforeRadio.vue';
|
||||||
import BeforeCkeckbox from './BeforComponent/BeforeCheckbox.vue';
|
import BeforeCkeckbox from './BeforComponent/BeforeCheckbox.vue';
|
||||||
import BeforeCompletion from './BeforComponent/BeforeCompletion.vue';
|
import BeforeCompletion from './BeforComponent/BeforeCompletion.vue';
|
||||||
import { ref, toRefs } from 'vue';
|
import BeforeRate from './BeforComponent/BeforeRate.vue';
|
||||||
|
import BeforeMartrixRadio from './BeforComponent/BeforeMartrixRadio.vue';
|
||||||
|
import BeforeMartrixCheckbox from './BeforComponent/BeforeMartrixCheckbox.vue';
|
||||||
|
import BeforeMartrixComplation from './BeforComponent/BeforeMartrixComplation.vue';
|
||||||
|
import { ref } from 'vue';
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
activeQuestion: {
|
activeQuestion: {
|
||||||
type: Object,
|
type: Object,
|
||||||
@@ -131,20 +349,14 @@ const props = defineProps({
|
|||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
questionsInfo: {
|
|
||||||
type: Object,
|
|
||||||
default: () => {
|
|
||||||
return {};
|
|
||||||
}
|
|
||||||
},
|
|
||||||
skipType: {
|
skipType: {
|
||||||
type: [Number, String],
|
type: [Number, String],
|
||||||
default: ''
|
default: ''
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const { questionsInfo } = toRefs(props);
|
const questionsInfo = defineModel('questionsInfo');
|
||||||
console.log(questionsInfo, 32);
|
|
||||||
const logics = ref(questionsInfo.value.logics);
|
const logics = ref(questionsInfo.value.logics);
|
||||||
const questions = questionsInfo.value.questions;
|
const questions = questionsInfo.value.questions;
|
||||||
|
|
||||||
@@ -184,13 +396,14 @@ const skipOption = [
|
|||||||
|
|
||||||
const emit = defineEmits(['update-logic']);
|
const emit = defineEmits(['update-logic']);
|
||||||
const updateLogic = (ev) => {
|
const updateLogic = (ev) => {
|
||||||
const newLogics = [...questionsInfo.value.logics]; // 创建 logics 的副本
|
// 创建 logics 的副本
|
||||||
newLogics[ev.index.value].logic.splice(ev.logIndex.value, 1, ev.newVal); // 更新逻辑项
|
const newLogics = [...questionsInfo.value.logics];
|
||||||
|
// 更新逻辑项
|
||||||
|
newLogics[ev.index.value].logic.splice(ev.logIndex.value, 1, ev.newVal);
|
||||||
// 确保触发响应式更新
|
// 确保触发响应式更新
|
||||||
questionsInfo.value.logics = []; // 通过重新赋值触发 Vue 的响应式系统
|
questionsInfo.value.logics = [];
|
||||||
questionsInfo.value.logics = newLogics; // 通过重新赋值触发 Vue 的响应式系统
|
questionsInfo.value.logics = newLogics;
|
||||||
emit('update-logic', questionsInfo.value.logics); // 向上触发事件
|
emit('update-logic', questionsInfo.value.logics);
|
||||||
};
|
};
|
||||||
|
|
||||||
skipOption.push(
|
skipOption.push(
|
||||||
@@ -210,37 +423,59 @@ skipOption.push(
|
|||||||
// todo 不同题型逻辑对应不同 需要开发
|
// todo 不同题型逻辑对应不同 需要开发
|
||||||
|
|
||||||
// 删除 题目设置
|
// 删除 题目设置
|
||||||
// const deleteLogic = (logIndex, item, index) => {
|
const deleteLogic = (logIndex, item) => {
|
||||||
// item.splice(logIndex, 1);
|
item.splice(logIndex, 1);
|
||||||
// // 如果小删除 删除后一个都没有了 就删除掉整个数组
|
// 如果小删除 删除后一个都没有了 就删除掉整个数组
|
||||||
// if (item.length === 0) {
|
if (item.length === 0) {
|
||||||
// // logics.value.splice(index, 1);
|
// logics.value.splice(index, 1);
|
||||||
// }
|
}
|
||||||
// };
|
};
|
||||||
// 删除 一个 逻辑
|
// 删除 一个 逻辑
|
||||||
// const remoteLogic = (index) => {
|
const remoteLogic = (index) => {
|
||||||
// // logics.value.splice(index, 1);
|
logics.value.splice(index, 1);
|
||||||
// };
|
};
|
||||||
|
|
||||||
// 添加题目
|
// 添加题目
|
||||||
// const addLogicItem = (logIndex, item) => {
|
const addLogicItem = (logIndex, item) => {
|
||||||
// item.splice(logIndex + 1, 0, {
|
item.splice(logIndex + 1, 0, {
|
||||||
// logic: 'and',
|
logic: 'and',
|
||||||
// question_index: '',
|
question_index: '',
|
||||||
// question_type: 0,
|
question_type: 0,
|
||||||
// is_answer: 1,
|
is_answer: 1,
|
||||||
// operator: '=',
|
operator: '=',
|
||||||
// option_index: '',
|
option_index: '',
|
||||||
// relation_question_index: 0,
|
relation_question_index: 0,
|
||||||
// type: 0,
|
type: 0,
|
||||||
// is_option_group: '',
|
is_option_group: '',
|
||||||
// group_index: null
|
group_index: null
|
||||||
// });
|
});
|
||||||
// };
|
};
|
||||||
|
|
||||||
// 增加逻辑配置
|
// 增加逻辑配置
|
||||||
const addLogic = () => {
|
const addLogic = () => {
|
||||||
// 增加逻辑配置
|
logics.value.push({
|
||||||
|
skip_type: props.skipType,
|
||||||
|
question_index: props.activeQuestion.question_index,
|
||||||
|
question_id: props.activeQuestion.id,
|
||||||
|
skip_question_index: 0,
|
||||||
|
id: uuidv4(),
|
||||||
|
logic: [
|
||||||
|
{
|
||||||
|
location: 0,
|
||||||
|
type: 0,
|
||||||
|
logic: 'if',
|
||||||
|
operator: '=',
|
||||||
|
is_answer: 1,
|
||||||
|
question_type: props.activeQuestion.question_type,
|
||||||
|
relation_question_index: 0,
|
||||||
|
relation_question_row_index: 0,
|
||||||
|
relation_question_cell_index: 0,
|
||||||
|
is_option_group: 0,
|
||||||
|
option_index: null,
|
||||||
|
question_id: null
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
};
|
};
|
||||||
// 获取题目类型
|
// 获取题目类型
|
||||||
const getQuestionType = (value, log) => {
|
const getQuestionType = (value, log) => {
|
||||||
|
|||||||
@@ -110,7 +110,7 @@ const chooseItem = () => {
|
|||||||
|
|
||||||
& .title {
|
& .title {
|
||||||
position: relative;
|
position: relative;
|
||||||
font-weight: 700;
|
font-weight: 800;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
@@ -118,12 +118,13 @@ const chooseItem = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
//padding: 0 5px;
|
//padding: 0 5px;
|
||||||
bottom: -4px;
|
bottom: -2px;
|
||||||
left: -1px;
|
left: -1px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 7px;
|
height: 7px;
|
||||||
border-radius: 5px;
|
border-radius: 4px;
|
||||||
background: linear-gradient(to right, $theme-color 10%, #f2f2f2 100%);
|
background: linear-gradient(90deg, #70b937 0%, rgba(112, 185, 55, 0) 100%);
|
||||||
|
opacity: 0.4;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ const marketList = ref([]);
|
|||||||
const active = ref(null);
|
const active = ref(null);
|
||||||
const marketInfo = ref([]);
|
const marketInfo = ref([]);
|
||||||
|
|
||||||
const getTableList = async() => {
|
const getTableList = async () => {
|
||||||
const res = await getListScene();
|
const res = await getListScene();
|
||||||
if (res.data.code === 0) {
|
if (res.data.code === 0) {
|
||||||
res.data.data.forEach((item) => {
|
res.data.data.forEach((item) => {
|
||||||
@@ -32,10 +32,8 @@ const getTableList = async() => {
|
|||||||
getMarketInfo(marketList.value[0]);
|
getMarketInfo(marketList.value[0]);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const getMarketInfo = async(item) => {
|
const getMarketInfo = async (item) => {
|
||||||
console.log(item);
|
|
||||||
const code = marketList.value.filter((market, index) => item === index)[0].code;
|
const code = marketList.value.filter((market, index) => item === index)[0].code;
|
||||||
console.log(code);
|
|
||||||
const params = {
|
const params = {
|
||||||
page: 1,
|
page: 1,
|
||||||
per_page: 10,
|
per_page: 10,
|
||||||
|
|||||||
@@ -111,8 +111,8 @@ type OperateItem = (typeof operateList)[0];
|
|||||||
// }
|
// }
|
||||||
|
|
||||||
function getCode() {
|
function getCode() {
|
||||||
publishInfo.value.img_url
|
publishInfo.value.img_url =
|
||||||
= 'https://test-cxp-pubcos.yili.com/uat-yls//survey-api/publish/202503130938138261340.png';
|
'https://test-cxp-pubcos.yili.com/uat-yls//survey-api/publish/202503130938138261340.png';
|
||||||
publishInfo.value.url = `${configUrl.proxyDomain}/publish?sn=${sn && sn !== undefined ? sn : ''}`;
|
publishInfo.value.url = `${configUrl.proxyDomain}/publish?sn=${sn && sn !== undefined ? sn : ''}`;
|
||||||
publishInfo.value.download_url = {
|
publishInfo.value.download_url = {
|
||||||
title: '问卷下载',
|
title: '问卷下载',
|
||||||
@@ -142,23 +142,23 @@ watch(status, (val) => {
|
|||||||
getCode();
|
getCode();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
onMounted(async() => {
|
onMounted(async () => {
|
||||||
// fetchInfo();
|
// fetchInfo();
|
||||||
getCode();
|
getCode();
|
||||||
});
|
});
|
||||||
const operateBtn = (item: OperateItem) => {
|
const operateBtn = (item: OperateItem) => {
|
||||||
switch (item.type) {
|
switch (item.type) {
|
||||||
case 'shareLink':
|
case 'shareLink':
|
||||||
shareLink();
|
shareLink();
|
||||||
break;
|
break;
|
||||||
case 'copyLink':
|
case 'copyLink':
|
||||||
copyLink();
|
copyLink();
|
||||||
break;
|
break;
|
||||||
case 'qrCode':
|
case 'qrCode':
|
||||||
downLoadImg();
|
downLoadImg();
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 复制链接
|
// 复制链接
|
||||||
@@ -182,7 +182,9 @@ function shareLink() {
|
|||||||
scene: 0 // 朋友圈1 微信好友0
|
scene: 0 // 朋友圈1 微信好友0
|
||||||
};
|
};
|
||||||
console.log('shareUrl', publishInfo.value.url);
|
console.log('shareUrl', publishInfo.value.url);
|
||||||
appBridge.shareToWeChat(params, () => { });
|
appBridge.shareToWeChat(params, () => {
|
||||||
|
// 后续扩展
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 下载二维码
|
// 下载二维码
|
||||||
|
|||||||
Reference in New Issue
Block a user