hz/ylst-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Default Changelist

Browse Source
This commit is contained in:
陈昱达
2025-03-21 14:28:52 +08:00
parent ac0d56b2ce
commit 7c731abb8d
6 changed files with 149 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
src/views/Design/Index.vue
View File

@@ -1,52 +1,114 @@
<template> <template>
<div class="design-create"> <div class="design-create">
<draggable v-if="questionInfo.questions.length > 0" v-model:data="questionInfo.questions" item-key="id" <draggable
handle=".moveQuestion" chosenClass="chosen" animation="300" :scroll="true"> v-if="questionInfo.questions.length > 0"
v-model:data="questionInfo.questions"
item-key="id"
handle=".moveQuestion"
chosenClass="chosen"
animation="300"
:scroll="true"
>
<template #item="{ element, index }"> <template #item="{ element, index }">
<choose-question :element="element" :questions="questionInfo.questions" :index="index" <choose-question
:chooseQuestionId="chooseQuestionId" :questionsInfo="questionInfo" :element="element"
@get-choose-question-id="getChooseQuestionId" @move="emitFun.move" @copy="emitFun.copy" :questions="questionInfo.questions"
@delete="emitFun.delete" @setting="emitFun.setting" @logics="emitFun.logics"> :index="index"
:chooseQuestionId="chooseQuestionId"
:questionsInfo="questionInfo"
@get-choose-question-id="getChooseQuestionId"
@move="emitFun.move"
@copy="emitFun.copy"
@delete="emitFun.delete"
@setting="emitFun.setting"
@logics="emitFun.logics"
>
<!-- 打分题 --> <!-- 打分题 -->
<Rate v-if="element.question_type === 5" :element="computedElement(element)" :index="index" <Rate
:active="chooseQuestionId === element.id" @update:element="updateElement" /> v-if="element.question_type === 5"
:element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!-- 选择题 --> <!-- 选择题 -->
<Choice v-if="element.question_type === 1 || element.question_type === 2" :index="index" <Choice
:active="chooseQuestionId === element.id" :element="computedElement(element)" v-if="element.question_type === 1 || element.question_type === 2"
@update:element="updateElement"></Choice> :index="index"
:active="chooseQuestionId === element.id"
:element="computedElement(element)"
@update:element="updateElement"
></Choice>
<!-- 填空题 --> <!-- 填空题 -->
<Completion v-if="element.question_type === 4" :index="index" :element="computedElement(element)" <Completion
:active="chooseQuestionId === element.id" @update:element="updateElement"></Completion> v-if="element.question_type === 4"
:index="index"
:element="computedElement(element)"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
></Completion>
<!-- 矩阵题 --> <!-- 矩阵题 -->
<martrix-question v-if=" <martrix-question
v-if="
element.question_type === 8 || element.question_type === 8 ||
element.question_type === 9 || element.question_type === 9 ||
element.question_type === 10 element.question_type === 10
" :element="computedElement(element)" :index="index" :active="chooseQuestionId === element.id" "
@update:element="updateElement" /> :element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!-- 签名题 --> <!-- 签名题 -->
<sign-question v-if="[22].includes(element.question_type)" :element="computedElement(element)" :index="index" <sign-question
:active="chooseQuestionId === element.id" @update:element="updateElement" /> v-if="[22].includes(element.question_type)"
:element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!-- 文件上传题 --> <!-- 文件上传题 -->
<file-upload v-if="element.question_type === 18" :element="computedElement(element)" :index="index" <file-upload
:active="chooseQuestionId === element.id" @update:element="updateElement" /> v-if="element.question_type === 18"
:element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!--图文--> <!--图文-->
<TextWithImages v-if="element.question_type === 6" :element="computedElement(element)" :index="index" <TextWithImages
:active="chooseQuestionId === element.id" @update:element="updateElement" /> v-if="element.question_type === 6"
:element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!--NPS--> <!--NPS-->
<NPS v-if="element.question_type === 106" :element="computedElement(element)" :index="index" <NPS
:active="chooseQuestionId === element.id" @update:element="updateElement" /> v-if="element.question_type === 106"
:element="computedElement(element)"
:index="index"
:active="chooseQuestionId === element.id"
@update:element="updateElement"
/>
<!--组件底部左侧操作--> <!--组件底部左侧操作-->
<template #action="{ element: el }"> <template #action="{ element: el }">
<div v-if="el.id === chooseQuestionId" class="flex slot-actions"> <div v-if="el.id === chooseQuestionId" class="flex slot-actions">
<template v-for="(item, optionIndex) in actionOptions"> <template v-for="(item, optionIndex) in actionOptions">
<div v-if="item.question_type.includes(el.question_type)" :key="optionIndex" class="flex"> <div
v-if="item.question_type.includes(el.question_type)"
:key="optionIndex"
class="flex"
>
<template v-for="(act, actIndex) in item.actions" :key="actIndex"> <template v-for="(act, actIndex) in item.actions" :key="actIndex">
<div class="flex align-center action-item theme-color" @click="actionEvent(act, el)"> <div
class="flex align-center action-item theme-color"
@click="actionEvent(act, el)"
>
<van-icon :name="act.icon" class="icons"></van-icon> <van-icon :name="act.icon" class="icons"></van-icon>
<span class="ml10">{{ act.label }}</span> <span class="ml10">{{ act.label }}</span>
</div> </div>
@@ -59,8 +121,13 @@
<!-- 增加控制按钮--> <!-- 增加控制按钮-->
<slot name="button" :item="element"></slot> <slot name="button" :item="element"></slot>
<div v-if="!filterGap"> <div v-if="!filterGap">
<paging v-if="!element.question_type && questionInfo.survey.pages.length > 1" :info="element" :index="index" <paging
:active="pageIsActive(activeIndex, questionInfo.questions, element.page)" @click.stop="" /> v-if="!element.question_type && questionInfo.survey.pages.length > 1"
:info="element"
:index="index"
:active="pageIsActive(activeIndex, questionInfo.questions, element.page)"
@click.stop=""
/>
</div> </div>
</template> </template>
</draggable> </draggable>
@@ -128,7 +195,7 @@ watch(
/** /**
* 工具函数 * 工具函数
*/ */
function util () { function util() {
/** 通过id找到数组中对应的下标 */ /** 通过id找到数组中对应的下标 */
const getIndexById = (arr, id) => arr.findIndex((i) => i.id === id); const getIndexById = (arr, id) => arr.findIndex((i) => i.id === id);
/** 通过分页找到数组中对应的下标 */ /** 通过分页找到数组中对应的下标 */
@@ -265,7 +332,7 @@ const actionFun = {
}, },
option_index: element.last_option_index + 1, option_index: element.last_option_index + 1,
parent_id: 0, parent_id: 0,
type: 0, type: 1,
cascade: [], cascade: [],
config: [] config: []
}); });
@@ -293,6 +360,7 @@ const actionFun = {
title: '', title: '',
instructions: [], instructions: [],
option_type: 0, option_type: 0,
type: 1,
limit_right_content: '<p>右极文字1</p>' limit_right_content: '<p>右极文字1</p>'
}, },
parent_id: 0, parent_id: 0,
@@ -323,6 +391,7 @@ const actionFun = {
title: '', title: '',
instructions: [], instructions: [],
option_type: 0, option_type: 0,
type: 2,
limit_right_content: '<p>右极文字1</p>' limit_right_content: '<p>右极文字1</p>'
}, },
parent_id: 0, parent_id: 0,
@@ -404,7 +473,7 @@ const updateElement = (newElement) => {
font-size: 15px; font-size: 15px;
} }
& .action-item+.action-item { & .action-item + .action-item {
margin-left: 10px; margin-left: 10px;
} }
} }

2
src/views/Design/Preview.vue
View File

@@ -44,7 +44,7 @@ const pastTemplate = () => {
if (res.data) { if (res.data) {
snQuestions({ sn: res.data.data.sn }).then((ques) => { snQuestions({ sn: res.data.data.sn }).then((ques) => {
if (ques.data) { if (ques.data) {
ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！（此提示语为默认提示语，您可选择自行输入本问卷的提示语）</p>`; ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！</p>`;
store.questionsInfo.value = ques.data.data; store.questionsInfo.value = ques.data.data;
saveQuestions({ saveQuestions({
sn: res.data.data.sn, sn: res.data.data.sn,

2
src/views/Home/components/CreateSurvey/CreateQuestion.vue
View File

@@ -63,7 +63,7 @@ const createdQuestion = (item) => {
const createdApx = (res) => { const createdApx = (res) => {
snQuestions({ sn: res.data.data.sn }).then((ques) => { snQuestions({ sn: res.data.data.sn }).then((ques) => {
if (ques.data) { if (ques.data) {
ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！（此提示语为默认提示语，您可选择自行输入本问卷的提示语）</p>`; ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！</p>`;
store.questionsInfo.value = ques.data.data; store.questionsInfo.value = ques.data.data;
saveQuestions({ saveQuestions({
sn: res.data.data.sn, sn: res.data.data.sn,

2
src/views/Home/components/CreateSurvey/Index.vue
View File

@@ -64,7 +64,7 @@ const createdQuestion = (item) => {
const createdApx = (res) => { const createdApx = (res) => {
snQuestions({ sn: res.data.data.sn }).then((ques) => { snQuestions({ sn: res.data.data.sn }).then((ques) => {
if (ques.data) { if (ques.data) {
ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！（此提示语为默认提示语，您可选择自行输入本问卷的提示语）</p>`; ques.data.data.survey.introduction = `<p>为优化活动服务品质，烦请完成问卷，感谢配合！您的反馈至关重要！</p>`;
store.questionsInfo.value = ques.data.data; store.questionsInfo.value = ques.data.data;
saveQuestions({ saveQuestions({
sn: res.data.data.sn, sn: res.data.data.sn,

6
src/views/Survey/views/Create/Index.vue
View File

@@ -610,13 +610,19 @@ onMounted(async () => {
height: 30px; height: 30px;
margin-top: 5px; margin-top: 5px;
margin-bottom: 5px; margin-bottom: 5px;
div {
font-size: 18px; font-size: 18px;
} }
}
:deep(.introduction) { :deep(.introduction) {
overflow: auto; overflow: auto;
width: 230px; width: 230px;
height: 45px; height: 45px;
& div {
font-size: 13px;
}
} }
} }

62
src/views/Survey/views/Preview/Index.vue
View File

@@ -14,16 +14,14 @@
<!-- LOGO --> <!-- LOGO -->
<div v-if="page !== 0 && page !== pages.length + 1" class="preview-info"> <div v-if="page !== 0 && page !== pages.length + 1" class="preview-info">
<van-field label-align="top"> <div>
<template #label>
<div class="preview-info-header" v-html="questionsData?.survey?.title"></div> <div class="preview-info-header" v-html="questionsData?.survey?.title"></div>
</template>
<template #input>
<div class="preview-info-header-intro" v-html="questionsData?.survey?.introduction"></div> <div class="preview-info-header-intro" v-html="questionsData?.survey?.introduction"></div>
</template> </div>
</van-field>
<div class="preview-icon"> <div class="preview-icon">
<img :src="icon" alt="icon" /> <div class="right-icon"></div>
<!-- <img :src="icon" alt="icon" />-->
</div> </div>
</div> </div>
<div <div
@@ -1465,17 +1463,23 @@ function toUrl(url) {
.preview-icon { .preview-icon {
position: relative; position: relative;
grid-row: 1/3; flex: 1;
grid-column: 2/3; width: 65px; /* 根据实际图片大小调整 */
height: 50px;
margin-right: 40px;
margin-left: 30px;
padding-top: 30px;
//width: 40%; /* 根据实际图片大小调整 */ //width: 40%; /* 根据实际图片大小调整 */
//height: 85px; /* 根据实际图片大小调整 */ //height: 85px; /* 根据实际图片大小调整 */
img { & .right-icon {
position: absolute; position: absolute;
top: 0; bottom: -70px;
left: 0; left: -10px;
width: 64px; width: 65px; /* 根据实际图片大小调整 */
height: 139px; height: 140px; /* 根据实际图片大小调整 */
background: url('@/assets/img/create-right-back.png') no-repeat center center;
background-size: cover;
//transform: translate(-50% -50%); //transform: translate(-50% -50%);
} }
@@ -1485,18 +1489,18 @@ function toUrl(url) {
overflow: hidden; overflow: hidden;
//min-height: calc(100vh - 100px); //min-height: calc(100vh - 100px);
padding: 10px; //padding: 0px 10px 10px 10px;
//background: linear-gradient(to bottom, #71b73c 200px, #f2f2f2 300px); //background: linear-gradient(to bottom, #71b73c 200px, #f2f2f2 300px);
.questions { .questions {
overflow: hidden; overflow: hidden;
padding-bottom: 50px; padding: 10px 10px 50px 10px;
.question { .question {
overflow: hidden; overflow: hidden;
margin-top: 10px; //margin-top: 10px;
padding: 10px; //padding: 10px;
border: 1px solid #e5e5e5; border: 1px solid #e5e5e5;
border-radius: 16px; border-radius: 16px;
background-color: white; background-color: white;
@@ -1505,10 +1509,11 @@ function toUrl(url) {
} }
.preview-info { .preview-info {
display: grid; display: flex;
grid-template-columns: 1fr 80px; grid-template-columns: 1fr 80px;
max-height: 75px; max-height: 75px;
margin-bottom: 10px; margin-bottom: 10px;
padding: 0 20px;
//margin: 0; //margin: 0;
background-color: transparent; background-color: transparent;
@@ -1526,24 +1531,25 @@ function toUrl(url) {
} }
.preview-info-header { .preview-info-header {
margin-top: 5px;
margin-bottom: 5px;
//@include preview-info-header; //@include preview-info-header;
color: white; color: white;
font-size: 16px; font-size: 18px;
width: 230px;
& > :first-child { height: 30px;
max-width: 70%;
}
} }
.preview-info-header-intro { .preview-info-header-intro {
overflow: scroll; overflow: scroll;
max-height: 45px; width: 210px;
height: 45px;
color: white; color: white;
font-size: 12px; font-size: 13px;
line-height: 18px;
@include preview-info-header; //@include preview-info-header;
} }
} }
</style> </style>