This commit is contained in:
yuping
2022-12-12 16:26:57 +08:00
parent cd68647ace
commit f865244041
3 changed files with 144 additions and 123 deletions

View File

@@ -44,3 +44,5 @@ export const VOTE_DETAIL2 = voteId => `/vote/queryVoteAndVoteStemDetailByVoteId?
export const COMMENT_ADD = '/comment post' export const COMMENT_ADD = '/comment post'
export const COMMENT_PRAISE = '/comment/praise post' export const COMMENT_PRAISE = '/comment/praise post'
export const COMMENT_COLLECTION = '/comment/collection post' export const COMMENT_COLLECTION = '/comment/collection post'
export const ASSESSMENT_QUERY = assessmentId => `/assessment/queryAssessmentDetailById?assessmentId=${assessmentId} post`

View File

@@ -2,7 +2,7 @@
<div class="surveydetail"> <div class="surveydetail">
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div <div
style="display: flex; align-items: center; justify-content: space-between" style="display: flex; align-items: center; justify-content: space-between"
> >
<div class="crumb"> <div class="crumb">
<div>混合制项目</div> <div>混合制项目</div>
@@ -14,16 +14,16 @@
<div class="prevnext"> <div class="prevnext">
<div class="prev"> <div class="prev">
<img <img
style="width: 23px; height: 23px" style="width: 23px; height: 23px"
src="../../assets/image/prev.png" src="../../assets/image/prev.png"
/> />
<div style="margin-left: 7px">上一个</div> <div style="margin-left: 7px">上一个</div>
</div> </div>
<div class="prev" style="margin-left: 31px"> <div class="prev" style="margin-left: 31px">
<div style="margin-right: 7px">下一个</div> <div style="margin-right: 7px">下一个</div>
<img <img
style="width: 23px; height: 23px" style="width: 23px; height: 23px"
src="../../assets/image/next.png" src="../../assets/image/next.png"
/> />
</div> </div>
</div> </div>
@@ -36,20 +36,20 @@
<div class="bascinfo"> <div class="bascinfo">
<div> <div>
<div <div
class="question" class="question"
v-for="(value, index) in question" v-for="(value, index) in data.scoringQuestionVoList"
:key="index" :key="index"
:style="{ 'margin-top': index === 0 ? '57px' : '41px' }" :style="{ 'margin-top': index === 0 ? '57px' : '41px' }"
> >
<div class="text">{{ value.text }}</div> <div class="text">{{ value.assessmentScTitle }}</div>
<div class="answer"> <div class="answer">
<div class="answerL">完全没用</div> <div class="answerL">完全没用</div>
<div class="answerC"> <div class="answerC">
<div <div
class="answerCitem" class="answerCitem"
v-for="(item, key) in select" v-for="(item, key) in Array.from({length:value.assessmentMaxScore},(k,i)=>i)"
:key="key" :key="key"
:style="{ :style="{
'margin-left': key === 0 ? '15px' : '10px', 'margin-left': key === 0 ? '15px' : '10px',
background: background:
value.selectAnswer === item value.selectAnswer === item
@@ -60,46 +60,55 @@
? '#fff' ? '#fff'
: 'rgba(86, 163, 249, 1)', : 'rgba(86, 163, 249, 1)',
}" }"
@click="score(value, item)" @click="()=>{value.selectAnswer=item}"
> >
<div>{{ item }}</div> <div>{{ item+1 }}</div>
</div> </div>
</div> </div>
<div class="answerR">非常有帮助/启发</div> <div class="answerR">非常有帮助/启发</div>
</div> </div>
</div> </div>
<div class="question" style="margin-top: 41px"> <div class="question" style="margin-top: 41px" v-for="(item,i) in data.singleStemVoList" :key="i">
<div class="text">4.类似相应的课程您认为适合哪些人观看</div> <div class="text">{{ item.singleStemName }}</div>
<div <div
v-for="(value, index) in viewpeople" v-for="(value, index) in item.assessmentSingleChoiceVoList"
:key="index" :key="index"
style="display: flex; align-items: center" style="display: flex; align-items: center"
:style="{ 'margin-top': index === 0 ? '29px' : '22px' }" :style="{ 'margin-top': index === 0 ? '29px' : '22px' ,cursor:'pointer'}"
@click="selectPeople(value)" @click="()=>{
item.assessmentSingleChoiceVoList.forEach(e=>{e.select = false});
value.select=true;
}"
> >
<img <img style="width: 19px; height: 18px; cursor: pointer" :src=" value.select? checkbox: checkbox2"/>
style="width: 19px; height: 18px; cursor: pointer" <div class="people">{{ value.singleOptionName }}</div>
:src="
value.select
? checkbox
: checkbox2
"
/>
<div class="people">{{ value.text }}</div>
</div> </div>
</div> </div>
<div class="question" style="margin-top: 41px">
<div class="text">5.您的其他意见</div> <div class="question" style="margin-top: 41px" v-for="(item,i) in data.multipleStemVoList" :key="i">
<div class="text">{{ item.multipleStemName }}</div>
<div
v-for="(value, index) in item.multipleChoiceVoList"
:key="index"
style="display: flex; align-items: center"
:style="{ 'margin-top': index === 0 ? '29px' : '22px' ,cursor:'pointer'}"
@click="()=>value.select=!value.select"
>
<img style="width: 19px; height: 18px; cursor: pointer" :src="value.select? checkbox: checkbox2"/>
<div class="people">{{ value.multipleOptionName }}</div>
</div>
</div>
<div class="question" style="margin-top: 41px" v-for="(item,i) in data.essayQuestionVoList">
<div class="text">{{ item.assessmentQaTitle }}</div>
<div style="width: 713px; margin-top: 31px; position: relative"> <div style="width: 713px; margin-top: 31px; position: relative">
<el-input <el-input
v-model="textarea1" v-model="item.content"
:autosize="{ minRows: 5, maxRows: 5 }" :autosize="{ minRows: 5, maxRows: 5 }"
resize="none" resize="none"
maxlength="200" maxlength="200"
type="textarea" type="textarea"
@input="textareaInput"
/> />
<div class="words">{{ textarealength }}/200</div> <div class="words">{{ item.content?.length || 0 }}/200</div>
</div> </div>
</div> </div>
<div style="display: flex; justify-content: center"> <div style="display: flex; justify-content: center">
@@ -108,93 +117,90 @@
</div> </div>
</div> </div>
<!-- 基本信息 --> <!-- 基本信息 -->
<!-- todo 测评页面 没有接口--> <!-- todo 测评页面 没有接口-->
</div> </div>
</template> </template>
<script> <script setup>
import { reactive, toRefs } from "vue"; import {reactive, toRefs} from "vue";
import checkbox from '@/assets/image/checkbox.png' import checkbox from '@/assets/image/checkbox.png'
import checkbox2 from '@/assets/image/checkbox2.png' import checkbox2 from '@/assets/image/checkbox2.png'
export default { import {useRoute} from "vue-router/dist/vue-router";
name: "SurveyDetail", import {usePage, useRequest} from "@/api/request";
setup() { import {ASSESSMENT_QUERY, COMMENT_LIST, DISCUSS_DETAIL} from "@/api/api";
const state = reactive({
question: [ const {query: {id, discussSubmitId}} = useRoute()
{
id: 1,
text: "1.您觉得课程对您是否有用?", const {data} = useRequest(ASSESSMENT_QUERY(112), {})
selectAnswer: 0,
}, const state = reactive({
{ question: [
id: 2, {
text: "2.您是否会推荐课程给其他同事?", id: 1,
selectAnswer: 0, text: "1.您觉得课程对您是否有用?",
}, selectAnswer: 0,
{ },
id: 3, {
text: "3.后续该讲师有其他课程是否会参与?", id: 2,
selectAnswer: 0, text: "2.您是否会推荐课程给其他同事?",
}, selectAnswer: 0,
], },
select: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], {
viewpeople: [ id: 3,
{ text: "3.后续该讲师有其他课程是否会参与?",
id: 1, selectAnswer: 0,
text: "基础员工", },
select: false, ],
}, select: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
{ viewpeople: [
id: 2, {
text: "中层管理", id: 1,
select: false, text: "基础员工",
}, select: false,
{ },
id: 3, {
text: "专业人员", id: 2,
select: false, text: "中层管理",
}, select: false,
{ },
id: 4, {
text: "高级管理", id: 3,
select: false, text: "专业人员",
}, select: false,
], },
textarea1: "", {
textarealength: 0, id: 4,
}); text: "高级管理",
const score = (value, item) => { select: false,
let arr = state.question; },
arr.map((i) => { ],
if (i.id === value.id) { textarea1: "",
i.selectAnswer = item; textarealength: 0,
} });
}); const score = (value, item) => {
state.question = arr; let arr = state.question;
}; arr.map((i) => {
const selectPeople = (value) => { if (i.id === value.id) {
let arr = state.viewpeople; i.selectAnswer = item;
arr.map((i) => { }
if (i.id === value.id) { });
i.select = !i.select; state.question = arr;
}
});
state.viewpeople = arr;
};
const textareaInput = (e) => {
// console.log("eee", e);
state.textarea1 = e;
state.textarealength = e.length;
};
return {
...toRefs(state),
score,
selectPeople,
textareaInput,
checkbox,
checkbox2
};
},
}; };
const selectPeople = (value) => {
let arr = state.viewpeople;
arr.map((i) => {
if (i.id === value.id) {
i.select = !i.select;
}
});
state.viewpeople = arr;
};
const textareaInput = (e) => {
// console.log("eee", e);
state.textarea1 = e;
state.textarealength = e.length;
};
</script> </script>
<style lang="scss"> <style lang="scss">
.surveydetail { .surveydetail {
@@ -204,18 +210,21 @@ export default {
font-size: 14px; font-size: 14px;
line-height: 24px; line-height: 24px;
} }
.prevnext { .prevnext {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
.prev { .prev {
display: flex; display: flex;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
} }
} }
.title { .title {
font-size: 20px; font-size: 20px;
font-weight: 800; font-weight: 800;
@@ -224,6 +233,7 @@ export default {
margin-top: 17px; margin-top: 17px;
margin-left: -11px; margin-left: -11px;
} }
.bascinfo { .bascinfo {
width: 100%; width: 100%;
min-height: 1032px; min-height: 1032px;
@@ -239,6 +249,7 @@ export default {
font-weight: 500; font-weight: 500;
color: #333330; color: #333330;
} }
.question .answer { .question .answer {
margin-top: 30px; margin-top: 30px;
display: flex; display: flex;
@@ -247,6 +258,7 @@ export default {
font-weight: 500; font-weight: 500;
color: #56a3f9; color: #56a3f9;
} }
.question .answer .answerC { .question .answer .answerC {
width: 540px; width: 540px;
height: 73px; height: 73px;
@@ -272,12 +284,14 @@ export default {
cursor: pointer; cursor: pointer;
} }
} }
.question .people { .question .people {
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: #333330; color: #333330;
margin-left: 15px; margin-left: 15px;
} }
.question .words { .question .words {
position: absolute; position: absolute;
right: 15px; right: 15px;
@@ -286,10 +300,12 @@ export default {
font-weight: 500; font-weight: 500;
color: #333330; color: #333330;
} }
.question .el-textarea__inner { .question .el-textarea__inner {
border-radius: 8px; border-radius: 8px;
background-color: rgba(245, 246, 247, 1); background-color: rgba(245, 246, 247, 1);
} }
.submit { .submit {
width: 126px; width: 126px;
height: 46px; height: 46px;

View File

@@ -80,6 +80,9 @@ export default defineConfig(({command}) =>
},'/examination': { },'/examination': {
target: 'http://localhost:30001', target: 'http://localhost:30001',
changeOrigin: true, changeOrigin: true,
},'/assessment': {
target: 'http://localhost:30001',
changeOrigin: true,
}, },
} }
} }