feat:合并

This commit is contained in:
lixg
2023-02-25 11:02:57 +08:00
parent b752524308
commit 01d7849da7
3 changed files with 224 additions and 154 deletions

View File

@@ -8,20 +8,26 @@
<div style="margin-left: 6px; margin-right: 6px">/</div> <div style="margin-left: 6px; margin-right: 6px">/</div>
<div style="font-weight: 700; font-size: 16px">投票详情</div> <div style="font-weight: 700; font-size: 16px">投票详情</div>
<div class="preNext"> <div class="preNext">
<span @click="prevPage" v-if="hasPrev"> <span @click="prevPage" v-if="hasPrev">
<button class="btn btn01"></button> <button class="btn btn01"></button>
<span class="content" style="margin-left: 6px">上一个</span> <span class="content" style="margin-left: 6px">上一个</span>
</span> </span>
<span @click="nextPage" v-if="hasNext"> <span @click="nextPage" v-if="hasNext">
<span class="content" style="margin-left: 31px">下一个</span> <span class="content" style="margin-left: 31px">下一个</span>
<button class="btn btn02" style="margin-left: 6px"></button> <button class="btn btn02" style="margin-left: 6px"></button>
</span> </span>
</div> </div>
<div class="return"> <div class="return">
<div style="display: flex" @click="returnclick"> <div style="display: flex" @click="returnclick">
<el-button style="color:#0073FB"> <img class="img2" style="margin-right:11px;cursor: pointer;" src="../../assets/image/return.png" />返回</el-button> <el-button style="color: #0073fb">
</div> <img
</div> class="img2"
style="margin-right: 11px; cursor: pointer"
src="../../assets/image/return.png"
/>返回</el-button
>
</div>
</div>
</div> </div>
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div class="debateTitle">投票{{ state.dataInfo?.voteName }}</div> <div class="debateTitle">投票{{ state.dataInfo?.voteName }}</div>
@@ -32,8 +38,8 @@
<div class="left"> <div class="left">
<div class="title"> <div class="title">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">参与情况</div> <div class="text">参与情况</div>
<div class="box"></div> <div class="box"></div>
@@ -43,9 +49,10 @@
<div class="item allbox1"> <div class="item allbox1">
<div class="item1" style="color: #089dff"> <div class="item1" style="color: #089dff">
{{ {{
state.dataInfo.numberOfInvolved || state.dataInfo.numberOfInvolved == 0 state.dataInfo.numberOfInvolved ||
? state.dataInfo.numberOfInvolved state.dataInfo.numberOfInvolved == 0
: "-" ? state.dataInfo.numberOfInvolved
: "-"
}} }}
</div> </div>
<div class="item2">参与数</div> <div class="item2">参与数</div>
@@ -54,8 +61,8 @@
<div class="item1" style="color: #387df7"> <div class="item1" style="color: #387df7">
{{ {{
state.dataInfo.votesTotal || state.dataInfo.votesTotal == 0 state.dataInfo.votesTotal || state.dataInfo.votesTotal == 0
? state.dataInfo.votesTotal ? state.dataInfo.votesTotal
: "-" : "-"
}} }}
</div> </div>
<div class="item2">总票数</div> <div class="item2">总票数</div>
@@ -63,9 +70,10 @@
<div class="item allbox3"> <div class="item allbox3">
<div class="item1" style="color: #00c6ff"> <div class="item1" style="color: #00c6ff">
{{ {{
state.dataInfo.numberOfBrowse || state.dataInfo.numberOfBrowse == 0 state.dataInfo.numberOfBrowse ||
? state.dataInfo.numberOfBrowse state.dataInfo.numberOfBrowse == 0
: "-" ? state.dataInfo.numberOfBrowse
: "-"
}} }}
</div> </div>
<div class="item2">浏览数</div> <div class="item2">浏览数</div>
@@ -74,8 +82,8 @@
<div class="title"> <div class="title">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">参与投票</div> <div class="text">参与投票</div>
<div class="box"></div> <div class="box"></div>
@@ -83,31 +91,58 @@
<div class="join"> <div class="join">
<div <div
v-for="(item, index) in state.dataInfo.voteStemDtoList" v-for="(item, index) in state.dataInfo?.voteStemDtoList"
:key="index" :key="index"
style="margin-bottom: 41px" style="margin-bottom: 41px"
> >
<div class="stem"> <div class="stem">
<div>{{ item.orderNumber }}</div> <div>{{ index + 1 }}</div>
<div>{{ item.voteStemName }}</div> <div>{{ item.voteStemName }}</div>
</div> </div>
<div class="options"> <div class="options">
<div <div
v-for="(value, key) in item.optionDetailList" v-for="(value, key) in item.optionDetailList"
:key="key" :key="key"
style=" style="
width: 140px; width: 140px;
margin-right: 114px; margin-right: 114px;
margin-bottom: 25px;"> margin-bottom: 25px;
<!-- <img "
style="width: 140px; height: 140px; border-radius: 8px" >
:src="value.optionPictureAddress" <img
/> --> v-if="value.optionPictureAddress"
style="width: 140px; height: 140px; border-radius: 8px"
:src="value.optionPictureAddress"
/>
<div class="radio"> <div class="radio">
<label @click="choiceQuestion(key,value.optionId,state.dataInfo,index)"> <label
@click="
choiceQuestion(key, value.id, state.dataInfo, index)
"
>
<!-- <input type="radio" name="one" value="right"/> --> <!-- <input type="radio" name="one" value="right"/> -->
<div v-if="value.isAnswer" style="width:10px;height:10px;background:#4a9cf8;position:relative;left:15px;border-radius:10px;"></div> <div
<div v-else style="width:10px;height:10px;background:#fff;position:relative;left:15px;border-radius:10px;"></div> v-if="value.isAnswer"
style="
width: 10px;
height: 10px;
background: #4a9cf8;
position: relative;
left: 15px;
border-radius: 10px;
"
></div>
<div
v-else
style="
width: 10px;
height: 10px;
background: #fff;
position: relative;
left: 15px;
border-radius: 10px;
"
></div>
<div class="option"></div> <div class="option"></div>
<div class="opt-text">{{ value.optionName }}</div> <div class="opt-text">{{ value.optionName }}</div>
</label> </label>
@@ -117,23 +152,37 @@
</div> </div>
</div> </div>
<div <div
style="width: 100%; style="
width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
margin-top: 30px;"> margin-top: 30px;
<button "
class="submitbtn btn01" >
:style="{background: (new Date().getTime() > new Date(state.dataInfo.voteEndTime).getTime() || new Date().getTime() < new Date(state.dataInfo.voteStartTime).getTime() )? '#ccc' : state.dataInfo.isSubmit?'#ccc':'' }" <button
@click="submitVote(state.dataInfo)"> class="submitbtn btn01"
{{state.dataInfo.isSubmit?'已提交':'提交'}} :style="{
background:
new Date().getTime() >
new Date(state.dataInfo.voteEndTime).getTime() ||
new Date().getTime() <
new Date(state.dataInfo.voteStartTime).getTime()
? '#ccc'
: state.dataInfo.isSubmit
? '#ccc'
: '',
}"
@click="submitVote(state.dataInfo)"
>
{{ state.dataInfo.isSubmit ? "已提交" : "提交" }}
</button> </button>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<div class="righttitle"> <div class="righttitle">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">投票时间</div> <div class="text">投票时间</div>
<div class="box"></div> <div class="box"></div>
@@ -150,21 +199,25 @@
<div class="endtimetext"> <div class="endtimetext">
距离结束还有&nbsp;&nbsp; 距离结束还有&nbsp;&nbsp;
<span class="te">{{ <span class="te">{{
parseInt( parseInt(
dayjs(state.dataInfo?.voteEndTime).diff(dayjs(), "minute") / 60 dayjs(state.dataInfo?.voteEndTime).diff(
) dayjs(),
}}</span "minute"
>&nbsp;&nbsp; 小时&nbsp;&nbsp;<span class="te">{{ ) / 60
dayjs(state.dataInfo?.voteEndTime).diff(dayjs(), "minute") % 60 )
}}</span }}</span
>&nbsp;&nbsp;分钟 >&nbsp;&nbsp; 小时&nbsp;&nbsp;<span class="te">{{
dayjs(state.dataInfo?.voteEndTime).diff(dayjs(), "minute") %
60
}}</span
>&nbsp;&nbsp;分钟
</div> </div>
</div> </div>
</div> </div>
<div class="righttitle"> <div class="righttitle">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">投票说明</div> <div class="text">投票说明</div>
@@ -172,9 +225,11 @@
</div> </div>
<div class="explain clearfix"> <div class="explain clearfix">
<div <div
class="explaincontent" class="explaincontent"
v-html=" v-html="
state.dataInfo?.voteExplain ? state.dataInfo?.voteExplain : '暂无说明' state.dataInfo?.voteExplain
? state.dataInfo?.voteExplain
: '暂无说明'
" "
></div> ></div>
</div> </div>
@@ -187,18 +242,14 @@
</template> </template>
<script setup> <script setup>
import {useRequest,request} from "@/api/request"; import { useRequest, request } from "@/api/request";
import { import { VOTE_DETAIL2, VOTE_DETAIL3, VOTE_DETAIL_SUBMIT } from "@/api/api";
VOTE_DETAIL2,
VOTE_DETAIL3,
VOTE_DETAIL_SUBMIT
} from "@/api/api";
import dayjs from "dayjs"; import dayjs from "dayjs";
import store from "@/store"; import store from "@/store";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import {useRoute,useRouter} from "vue-router/dist/vue-router"; import { useRoute, useRouter } from "vue-router/dist/vue-router";
import {computed, reactive, toRefs} from "vue"; import { computed, reactive, toRefs } from "vue";
import {useTaskPage} from "@/api/useCommon"; import { useTaskPage } from "@/api/useCommon";
// const { data } = useRequest(TASK_VOTE_DETAIL, {}); // const { data } = useRequest(TASK_VOTE_DETAIL, {});
// console.log("datadatadata", data); // console.log("datadatadata", data);
// const state = reactive({ // const state = reactive({
@@ -206,12 +257,12 @@ import {useTaskPage} from "@/api/useCommon";
// }); // });
// let { votedetail } = toRefs(state); // let { votedetail } = toRefs(state);
const { const {
query: {courseId, pName, sName, chapterOrStageId, infoId, id, btype}, query: { courseId, pName, sName, chapterOrStageId, infoId, id, btype },
} = useRoute(); } = useRoute();
const {nextPage,prevPage,hasPrev, hasNext} = useTaskPage() const { nextPage, prevPage, hasPrev, hasNext } = useTaskPage();
const router = useRouter(); const router = useRouter();
const returnclick = () => { const returnclick = () => {
router.back(); router.back();
}; };
const state = reactive({ const state = reactive({
dataInfo: {}, dataInfo: {},
@@ -222,107 +273,124 @@ const state = reactive({
const userInfo = computed(() => store.state.userInfo); const userInfo = computed(() => store.state.userInfo);
let timer = setInterval(() => { let timer = setInterval(() => {
if(userInfo.value.id){ if (userInfo.value.id) {
clearInterval(timer) clearInterval(timer);
console.log('获取信息传递参数',{ console.log("获取信息传递参数", {
"chapterOrStageId": chapterOrStageId ? chapterOrStageId : 0, chapterOrStageId: chapterOrStageId ? chapterOrStageId : 0,
"courseId": courseId, courseId: courseId,
"studentId": userInfo.value.id, studentId: userInfo.value.id,
"targetId": infoId, targetId: infoId,
"type": btype type: btype,
})
request(VOTE_DETAIL3(courseId), {}).then(res=>{
console.log(res)
state.dataInfo = res.data
}).catch(err=>{
console.log(err)
}); });
request(VOTE_DETAIL3(courseId), {})
.then((res) => {
console.log(res);
state.dataInfo = res.data;
})
.catch((err) => {
console.log(err);
});
} }
}, 500); }, 500);
console.log('我是获取的投票基本信息', state.dataInfo) console.log("我是获取的投票基本信息", state.dataInfo);
// 答题时间 // 答题时间
const answerTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss'); const answerTime = dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss");
// 选择题目 // 选择题目
const choiceQuestion = (order, id, dates, torder) => { const choiceQuestion = (order, id, dates, torder) => {
// 当已经提交过时候 不让选择题目 // 当已经提交过时候 不让选择题目
if(state.dataInfo.isSubmit){ if (state.dataInfo.isSubmit) {
return return;
} }
console.log('当前选择题目的id及序号', order, id, dates,torder) console.log("当前选择题目的id及序号", order, id, dates, torder);
for(let i=0;i<dates.ballotVo.voteStemVoList[torder].optionDetailList.length;i++){ for (
dates.ballotVo.voteStemVoList[torder].optionDetailList[i].isAnswer = false; let i = 0;
i < dates.voteStemDtoList[torder].optionDetailList.length;
i++
) {
dates.voteStemDtoList[torder].optionDetailList[i].isAnswer = false;
} }
dates.ballotVo.voteStemVoList[torder].optionDetailList[order].isAnswer = true; dates.voteStemDtoList[torder].optionDetailList[order].isAnswer = true;
console.log(state.dataInfo) console.log(state.dataInfo);
} };
// 提交投票 // 提交投票
const submitVote = () => { const submitVote = () => {
console.log(state.dataInfo) console.log(state.dataInfo);
let nowTime = new Date().getTime() let nowTime = new Date().getTime();
let maxTime = new Date(state.dataInfo.voteEndTime).getTime() let maxTime = new Date(state.dataInfo.voteEndTime).getTime();
let minTime = new Date(state.dataInfo.voteStartTime).getTime() let minTime = new Date(state.dataInfo.voteStartTime).getTime();
console.log(nowTime, maxTime, minTime) console.log(nowTime, maxTime, minTime);
// 当未到开始时间 // 当未到开始时间
if(nowTime < minTime || nowTime > maxTime) { if (nowTime < minTime || nowTime > maxTime) {
ElMessage.error("未到投票开始时间") ElMessage.error("未到投票开始时间");
return return;
} }
// 当已经提交过时候 不让提交即可 // 当已经提交过时候 不让提交即可
if(state.dataInfo.isSubmit){ if (state.dataInfo.isSubmit) {
return return;
} }
let isSubmit = true; let isSubmit = true;
let isSubArr = [] let isSubArr = [];
for(let i=0;i<state.dataInfo.voteStemDtoList.length;i++){ console.log("state.dataInfo", state.dataInfo);
for(let j=0; j<state.dataInfo.voteStemDtoList[i].optionDetailList.length;j++){ if (state.dataInfo) {
if(state.dataInfo.voteStemDtoList[i].optionDetailList[j].isAnswer){ for (let i = 0; i < state.dataInfo.voteStemDtoList.length; i++) {
isSubArr[i] = state.dataInfo.voteStemDtoList[i].optionDetailList[j].isAnswer for (
break let j = 0;
}else{ j < state.dataInfo.voteStemDtoList[i].optionDetailList.length;
isSubArr[i] = false j++
) {
if (state.dataInfo.voteStemDtoList[i].optionDetailList[j].isAnswer) {
isSubArr[i] =
state.dataInfo.voteStemDtoList[i].optionDetailList[j].isAnswer;
break;
} else {
isSubArr[i] = false;
}
} }
} }
} }
for(let i=0; i<isSubArr.length;i++){
if(isSubArr[i]==false){ for (let i = 0; i < isSubArr.length; i++) {
isSubmit = false if (isSubArr[i] == false) {
isSubmit = false;
} }
} }
if(isSubmit==false){ if (isSubmit == false) {
ElMessage.error("请选择投票问题后进行提交") ElMessage.error("请选择投票问题后进行提交");
return return;
} }
let obj = { let obj = {
"beginTime": answerTime, beginTime: answerTime,
"chapterOrStageId": chapterOrStageId ? chapterOrStageId : 0, chapterOrStageId: chapterOrStageId ? chapterOrStageId : 0,
"result": JSON.stringify(state.dataInfo), result: JSON.stringify(state.dataInfo),
"targetId": infoId, // 项目 路径图 id targetId: infoId, // 项目 路径图 id
"taskId": id, taskId: id,
"type": btype, // 1 项目 2 路径图 type: btype, // 1 项目 2 路径图
"voteId": state.dataInfo.voteId voteId: state.dataInfo.voteId,
} };
console.log('我是投票提交的信息', obj)
useRequest(VOTE_DETAIL_SUBMIT,obj,(e)=>{ console.log("我是投票提交的信息", obj);
console.log(e)
request(VOTE_DETAIL3(courseId), {}).then(res=>{ useRequest(VOTE_DETAIL_SUBMIT, obj, (e) => {
console.log(res) console.log(e);
ElMessage.success("投票成功") request(VOTE_DETAIL3(courseId), {})
state.dataInfo = res.data .then((res) => {
}).catch(err=>{ console.log(res);
console.log(err) ElMessage.success("投票成功");
}); state.dataInfo = res.data;
// request(VOTE_DETAIL2, { })
.catch((err) => {
console.log(err);
});
// request(VOTE_DETAIL2, {
// "chapterOrStageId": chapterOrStageId ? chapterOrStageId : 0, // "chapterOrStageId": chapterOrStageId ? chapterOrStageId : 0,
// "courseId": courseId, // "courseId": courseId,
// "studentId": userInfo.value.id, // "studentId": userInfo.value.id,
@@ -336,7 +404,7 @@ const submitVote = () => {
// }).catch(err=>{ // }).catch(err=>{
// console.log(err) // console.log(err)
// }); // });
}) });
}; };
</script> </script>
@@ -357,14 +425,14 @@ const submitVote = () => {
line-height: 24px; line-height: 24px;
position: relative; position: relative;
} }
.return{ .return {
position: absolute; position: absolute;
right: 10%; right: 10%;
.text{ .text {
text-align: center; text-align: center;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
} }
} }
.preNext { .preNext {
@@ -546,26 +614,26 @@ const submitVote = () => {
.allbox1 { .allbox1 {
margin-right: 22px; margin-right: 22px;
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(160, 193, 230, 0) 0%, rgba(160, 193, 230, 0) 0%,
rgba(161, 195, 231, 0.2) 100% rgba(161, 195, 231, 0.2) 100%
); );
} }
.allbox2 { .allbox2 {
margin-right: 22px; margin-right: 22px;
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(177, 219, 229, 0) 0%, rgba(177, 219, 229, 0) 0%,
rgba(172, 216, 227, 0.2) 100% rgba(172, 216, 227, 0.2) 100%
); );
} }
.allbox3 { .allbox3 {
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(195, 209, 234, 0) 0%, rgba(195, 209, 234, 0) 0%,
rgba(191, 206, 231, 0.2) 100% rgba(191, 206, 231, 0.2) 100%
); );
} }

View File

@@ -157,7 +157,8 @@ const handleClick = (tab, event) => {
console.log("附件", tab, event); console.log("附件", tab, event);
}; };
const download = (url) => { const download = (url) => {
window.open(url); console.log('下载url',url)
// window.open(url);
}; };
const downloads = (url) => { const downloads = (url) => {
ElMessage.warning("未在有效时间范围内,请耐心等待!"); ElMessage.warning("未在有效时间范围内,请耐心等待!");

View File

@@ -157,6 +157,7 @@ const handleClick = (tab, event) => {
console.log("附件", tab, event); console.log("附件", tab, event);
}; };
const download = (url) => { const download = (url) => {
// console.log('下载url',url)
window.open(url); window.open(url);
}; };
const downloads = (url) => { const downloads = (url) => {