feat:新增打分题

This commit is contained in:
du.meimei
2025-03-05 16:03:00 +08:00
parent 6df0b0d320
commit 5f32c9eeee
10 changed files with 352 additions and 23 deletions

View File

@@ -1,6 +1,6 @@
{
"explorer.confirmDelete": false,
"editor.fontSize": 18,
"editor.fontSize": 16,
"workbench.editorAssociations": {
"*.ipynb": "jupyter.notebook.ipynb"
},

2
components.d.ts vendored
View File

@@ -14,11 +14,11 @@ declare module 'vue' {
VanCellGroup: typeof import('vant/es')['CellGroup']
VanCheckbox: typeof import('vant/es')['Checkbox']
VanCheckboxGroup: typeof import('vant/es')['CheckboxGroup']
VanDialog: typeof import('vant/es')['Dialog']
VanDivider: typeof import('vant/es')['Divider']
VanField: typeof import('vant/es')['Field']
VanIcon: typeof import('vant/es')['Icon']
VanPopup: typeof import('vant/es')['Popup']
VanRate: typeof import('vant/es')['Rate']
VanSearch: typeof import('vant/es')['Search']
VanSwitch: typeof import('vant/es')['Switch']
VanTabbar: typeof import('vant/es')['Tabbar']

View File

@@ -4,11 +4,11 @@
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src:
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix')
format('embedded-opentype'),
format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont')
format('svg');
format('svg');
}
.logo {

View File

@@ -469,6 +469,167 @@ export const useCommonStore = defineStore('common', {
planet_id: '',
permissions: null
},
{
id: '17852489',
title: 'Q3',
stem: '<p>请打分</p>',
other: '',
question_index: 3,
question_type: 5,
config: {
min: 1.0,
max: 5.0,
is_required: 1,
score_type: 0,
score_way: 0,
score_interval: 1.0,
prompt_score: 2,
prompt_array: null,
prompt_left: '',
prompt_right: '',
prompt_center: '',
select_random: 0,
float_window: 0,
float_window_content: '',
popup_window: 0,
popup_window_content: '',
is_show: [],
quick_type: 0
},
created_at: '2025-03-05T09:47:02',
created_user_id: 1281,
updated_user_id: null,
survey_id: 9482,
logic_config: {
expect: '',
order: 0,
type: 0,
stay_time: ''
},
options: [
[{
option: '<p>选项1</p>',
id: '1049106',
type: 0,
is_other: 0,
is_fixed: 0,
is_remove_other: 0,
created_at: null,
created_user_id: null,
parent_id: null,
option_index: 1,
list_id: 74455,
option_code: '',
option_config: {
title: '',
instructions: [],
price: 0.0,
gradient: '',
image_url: [],
option_type: 0,
type: 0,
limit_right_content: '',
child_area: null,
binding_goods_id: ''
},
disable_option_update: null,
cascade: []
},
{
option: '<p>选项2</p>',
id: '1049107',
type: 0,
is_other: 0,
is_fixed: 0,
is_remove_other: 0,
created_at: null,
created_user_id: null,
parent_id: null,
option_index: 2,
list_id: 74455,
option_code: '',
option_config: {
title: '',
instructions: [],
price: 0.0,
gradient: '',
image_url: [],
option_type: 0,
type: 0,
limit_right_content: '',
child_area: null,
binding_goods_id: ''
},
disable_option_update: null,
cascade: []
},
{
option: '<p>选项3</p>',
id: '1049108',
type: 0,
is_other: 0,
is_fixed: 0,
is_remove_other: 0,
created_at: null,
created_user_id: null,
parent_id: null,
option_index: 3,
list_id: 74455,
option_code: '',
option_config: {
title: '',
instructions: [],
price: 0.0,
gradient: '',
image_url: [],
option_type: 0,
type: 0,
limit_right_content: '',
child_area: null,
binding_goods_id: ''
},
disable_option_update: null,
cascade: []
},
{
option: '<p>选项4</p>',
id: '1049171',
type: 0,
is_other: 0,
is_fixed: 0,
is_remove_other: 0,
created_at: null,
created_user_id: null,
parent_id: null,
option_index: 4,
list_id: 74455,
option_code: '',
option_config: {
title: '',
instructions: [],
price: 0.0,
gradient: '',
image_url: [],
option_type: 0,
type: 0,
limit_right_content: '',
child_area: null,
binding_goods_id: ''
},
disable_option_update: null,
cascade: []
}
]
],
associate: [],
logics_has: null,
last_option_index: 4,
question_code: '',
question_value: '',
question_tag: '',
planet_id: '',
permissions: null
},
{
id: '17852298',
title: 'Q4',

View File

@@ -16,17 +16,27 @@
:chooseQuestionId="chooseQuestionId"
@get-choose-question-id="getChooseQuestionId"
>
<!-- 选择题 -->
<base-select
v-if="element.question_type === 1"
:element="element"
:active="chooseQuestionId === element.id"
></base-select>
<!-- 填空题 -->
<Completion
v-if="element.question_type === 4"
:element="element"
:active="chooseQuestionId === element.id"
sn="lXEBBpE2"
></Completion>
<!-- 打分题 -->
<Rate
v-if="element.question_type === 5"
:element="element"
:active="chooseQuestionId === element.id"
sn="lXEBBpE2"
/>
<!-- @update="updateHandle" -->
</choose-question>
<!-- {{ element.question_type }}-->
@@ -51,6 +61,7 @@ import BaseSelect from './components/Questions/BaseSelect.vue';
import ChooseQuestion from './components/ChooseQuestion.vue';
import Paging from './components/Questions/paging/Paging.vue';
import Completion from './components/Questions/Completion.vue';
import Rate from './components/Questions/Rate.vue';
const activeIndex = ref(-1);
/**

View File

@@ -58,7 +58,7 @@
round
:style="{ minHeight: '60%' }"
>
<template v-for="(item, index) in logics" :key="index">
<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"
@@ -162,8 +162,8 @@ const getSkipTypeText = (skipType) => {
const ls = [];
logics.map((item) => {
if (
item.skip_type === skipType
&& item.question_index === activeQuestion.value.question_index
item.skip_type === skipType &&
item.question_index === activeQuestion.value.question_index
) {
ls.push(item);
}
@@ -179,13 +179,13 @@ const getSkipTypeText = (skipType) => {
const questionSetting = (type) => {
switch (type) {
case 'before':
questionBeforeShow.value = true;
case 'before':
questionBeforeShow.value = true;
break;
case 'after':
questionBeforeShow.value = true;
break;
break;
case 'after':
questionBeforeShow.value = true;
break;
}
skipType.value = type === 'before' ? 0 : 1;
};

View File

@@ -8,7 +8,7 @@
<slot></slot>
<!-- 题目操作-->
<van-cell v-if="chooseQuestionId === element.id" class="choose-question-active-container">
<template v-if="element.question_type === 1" #icon>
<template v-if="element.question_type === 1 || element.question_type === 5" #icon>
<div class="flex align-center" @click="radioAddOption">
<van-icon name="add" class="fs20"></van-icon>
<span class="ml10">添加选项</span>

View File

@@ -0,0 +1,150 @@
<template>
<div class="content">
<van-field
v-model="element.stem"
:label="element.stem"
:required="element.config.is_required === 1"
label-align="top"
>
<template #label>
<div
:contenteditable="active"
class="van-field"
@blur="saveStem($event, element)"
v-html="element.stem"
></div>
</template>
<template #input>
<div v-for="(optionItem, optionItemIndex) in element.options" :key="optionItemIndex">
<div v-for="(item, index) in optionItem" :key="index" @click="chooseOption(item)">
<div
:contenteditable="item.id === chooseId"
class="van-field"
v-html="item.option"
></div>
<ul>
<li
v-for="(rate, rateIndex) in rateItem"
:key="rateIndex"
class="rate_item"
:class="{ active_item: rate.active }"
@click="getItem(rate)"
>
{{ rate.label }}
</li>
</ul>
</div>
</div>
</template>
</van-field>
</div>
</template>
<script setup>
import { ref } from 'vue';
const rateItem = ref([
{
label: 1,
active: false
},
{
label: 2,
active: false
},
{
label: 3,
active: false
},
{
label: 4,
active: false
},
{
label: 5,
active: false
},
{
label: 6,
active: false
},
{
label: 7,
active: false
},
{
label: 8,
active: false
},
{
label: 9,
active: false
},
{
label: 10,
active: false
}
]);
const props = defineProps({
element: {
type: Object,
default: () => {
// 补充
}
},
active: {
type: Boolean,
default: false
},
sn: { type: String, default: '' },
questionType: { type: [String, Number], default: 4 }
});
const element = ref(props.element);
const chooseId = ref('');
// 创建一个本地副本以保存更改
const localElement = ref({ ...props.element });
const saveStem = (e) => {
localElement.value.stem = e.target.innerHTML;
// 如果需要,可以在这里发出事件以通知父组件
// this.$emit('update:element', localElement.value);
};
const chooseOption = (item) => {
console.log(item);
chooseId.value = item.id;
};
const getItem = (value) => {
chooseId.value = value.id;
rateItem.value.forEach((item, index) => {
rateItem.value[index].active = item.label <= value.label;
});
};
</script>
<style scoped lang="scss">
.content {
background-color: #fff;
ul {
// border: 1px solid red;
display: flex;
margin-bottom: 10px;
}
.rate_item {
margin: 0 3px;
margin-top: 5px;
padding: 0 8px;
border: 1px solid #ddd;
border-radius: 4px;
color: #666;
// border: 1px solid red;
}
.active_item {
background-color: #70b936;
color: #fff;
}
}
</style>

View File

@@ -39,7 +39,8 @@
</van-cell-group>
<!-- 底部功能性按钮 -->
<div style="
<div
style="
position: fixed;
bottom: 0;
display: flex;
@@ -49,7 +50,8 @@
width: 100%;
height: 50px;
background-color: white;
">
"
>
<div>设置</div>
<div style="display: flex; flex-direction: row; justify-content: space-around; width: 60%">
<button size="small">预览</button>

View File

@@ -8,9 +8,11 @@
<van-cell-group inset style="margin-top: 20px;padding: 30px;">
<div>
<img width="100%"
<img
width="100%"
src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u14.jpg?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
alt="" />
alt=""
/>
</div>
<div class="qrcode">
<img src="" alt="" width="100px" height="100px" />
@@ -22,16 +24,18 @@
<div>移动端仅做数据回收问卷数据分析请前往PC端浏览</div>
<div class="operation">
<span v-for="item in 2" :key="item">
<img width="30px"
src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333" />
<img
width="30px"
src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
/>
复制链接
</span>
</div>
</van-cell-group>
<!-- 底部功能性按钮 -->
<div style="
<div
style="
position: fixed;
bottom: 0;
display: flex;
@@ -41,7 +45,8 @@
width: 100%;
height: 50px;
background-color: white;
">
"
>
<van-button block>取消</van-button>
</div>
</div>