feat:新增打分题
This commit is contained in:
2
.vscode/settings.json
vendored
2
.vscode/settings.json
vendored
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"explorer.confirmDelete": false,
|
||||
"editor.fontSize": 18,
|
||||
"editor.fontSize": 16,
|
||||
"workbench.editorAssociations": {
|
||||
"*.ipynb": "jupyter.notebook.ipynb"
|
||||
},
|
||||
|
||||
2
components.d.ts
vendored
2
components.d.ts
vendored
@@ -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']
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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',
|
||||
|
||||
@@ -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);
|
||||
/**
|
||||
|
||||
@@ -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;
|
||||
};
|
||||
|
||||
@@ -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>
|
||||
|
||||
150
src/views/Design/components/Questions/Rate.vue
Normal file
150
src/views/Design/components/Questions/Rate.vue
Normal 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>
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user