From 44cf4d52899d1211b91fba283a0b6e0a607af9af Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期二, 28 五月 2024 18:28:25 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
h5/pages/answer/answer.vue | 768 +++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 462 insertions(+), 306 deletions(-)
diff --git a/h5/pages/answer/answer.vue b/h5/pages/answer/answer.vue
index 89aaf04..318242c 100644
--- a/h5/pages/answer/answer.vue
+++ b/h5/pages/answer/answer.vue
@@ -1,50 +1,192 @@
<template>
- <view class="box">
- <view class="box_bgimage" :style="{backgroundImage: 'url(' + bg + ')'}">
- <text class="box_bgimage_a">{{ title }}</text>
- <text class="box_bgimage_b">{{ content }}</text>
- </view>
- <view class="box_list">
- <view class="box_list_answer" v-if="list && list.length > 0">
- <!-- 鍒ゆ柇 -->
-<!-- <template v-if="list[i].type === 0">
- <view class="box_list_answer_item" v-for="(item, index) in list[i].options" :key="index" @click="select(index)">
- <image src="@/static/video_error@2x.png" v-if="success && problemIndex === index" />
- <image src="@/static/video@2x.png" v-else-if="!String(problemIndex) || problemIndex !== index" />
- <image src="@/static/video_sel@2x.png" v-else-if="problemIndex === index" />
- <text style="color: rgba(237, 69, 69, 1)" v-if="success && problemIndex === index">{{item.code}}</text>
- <text v-else-if="!String(problemIndex) || problemIndex !== index">{{item.code}}</text>
- <text style="color: rgba(2, 94, 239, 1)" v-else-if="problemIndex === index">{{item.code}}</text>
- </view>
- </template> -->
- <!-- 鍗曢�� -->
- <view v-for="(item,index) in list" :key="index" class="list_item">
- <template v-if="item.type == 1">
- <view class="box_list_answer_name">
- {{index + 1}}銆亄{item.title}}<text style="color:#ED4545;">*</text>
- </view>
- <view class="box_list_answer_item" v-for="(line, lIndex) in item.options" :key="lIndex" @click="select(line, index)">
- <image src="@/static/video@2x.png" v-if="!item.selAnswer || item.selAnswer !== line.code" />
- <image src="@/static/video_sel@2x.png" v-if="item.selAnswer && item.selAnswer == line.code && item.answer === item.selAnswer" />
- <image src="@/static/video_error@2x.png" v-if="item.selAnswer && item.selAnswer == line.code && item.answer !== item.selAnswer" />
- <text v-if="!item.selAnswer"><text class="mr24">{{line.code}}</text> {{line.value}}</text>
- <text v-if="item.selAnswer && item.answer === item.selAnswer" style="color: rgba(2, 94, 239, 1)" ><text class="mr24" style="color: rgba(2, 94, 239, 1)">{{line.code}}</text> {{line.value}}</text>
- <text v-if="item.selAnswer && item.answer !== item.selAnswer" style="color: rgba(237, 69, 69, 1)" ><text class="mr24" style="color: rgba(237, 69, 69, 1)">{{line.code}}</text> {{line.value}}</text>
- </view>
- <view class="box_list_answer_tips" v-if="item.selAnswer && item.answer !== item.selAnswer">
- <image src="@/static/ic_wrong@2x.png" />
- <text>鍥炵瓟閿欒</text>
- </view>
- <view class="box_list_answer_tips" v-if="item.selAnswer && item.answer === item.selAnswer">
- <image src="@/static/meeting/icon/ic_choose_sel@2x.png" />
- <text>鍥炵瓟姝ｇ‘</text>
- </view>
- </template>
- </view>
- <view class="empty"></view>
- <view class="box_list_answer_btn" @click="next()">鎻愪氦</view>
- <!-- 澶氶�� -->
-<!-- <template v-else-if="list[i].type === 2">
+ <view class="box">
+ <view class="box_bgimage" :style="{ backgroundImage: 'url(' + bg + ')' }">
+ <text class="box_bgimage_a">{{ title }}</text>
+ <text class="box_bgimage_b">{{ content }}</text>
+ </view>
+ <view class="box_list">
+ <view class="box_list_answer" v-if="list && list.length > 0">
+ <!-- 鍗曢��/鍒ゆ柇 -->
+ <view v-for="(item, index) in list" :key="index" class="list_item">
+ <view class="box_list_answer_name">
+ {{ index + 1 }}銆亄{ item.title
+ }}<text style="color: #ed4545">*</text>
+ </view>
+ <template v-if="item.type == 1 || item.type == 0">
+ <view
+ class="box_list_answer_item"
+ v-for="(line, lIndex) in item.options"
+ :key="lIndex"
+ @click="select(line, index)"
+ >
+ <image
+ src="@/static/video@2x.png"
+ v-if="!item.selAnswer || item.selAnswer !== line.code"
+ />
+ <image
+ src="@/static/video_sel@2x.png"
+ v-if="
+ (item.selAnswer &&
+ item.answer === item.selAnswer &&
+ item.selAnswer == line.code) ||
+ item.selAnswer == line.code
+ "
+ />
+ <image
+ src="@/static/video_error@2x.png"
+ v-if="
+ item.selAnswer &&
+ item.selAnswer == line.code &&
+ item.answer !== item.selAnswer &&
+ status == '2'
+ "
+ />
+ <text v-if="!item.selAnswer || item.selAnswer !== line.code"
+ ><text class="mr24">{{ line.code }}</text>
+ {{ line.value }}</text
+ >
+ <text
+ v-if="
+ (item.selAnswer &&
+ item.answer === item.selAnswer &&
+ item.selAnswer == line.code) ||
+ item.selAnswer == line.code
+ "
+ style="color: rgba(2, 94, 239, 1)"
+ ><text class="mr24" style="color: rgba(2, 94, 239, 1)">{{
+ line.code
+ }}</text>
+ {{ line.value }}</text
+ >
+ <text
+ v-if="
+ item.selAnswer &&
+ item.answer !== item.selAnswer &&
+ status == '2'
+ "
+ style="color: rgba(237, 69, 69, 1)"
+ ><text class="mr24" style="color: rgba(237, 69, 69, 1)">{{
+ line.code
+ }}</text>
+ {{ line.value }}</text
+ >
+ </view>
+ <view
+ class="box_list_answer_tips"
+ v-if="
+ item.selAnswer &&
+ item.answer !== item.selAnswer &&
+ status != '0'
+ "
+ >
+ <image src="@/static/ic_wrong@2x.png" />
+ <text>鍥炵瓟閿欒</text>
+ </view>
+ <view
+ class="box_list_answer_tips"
+ v-if="
+ item.selAnswer &&
+ item.answer === item.selAnswer &&
+ status != '0'
+ "
+ >
+ <image src="@/static/meeting/icon/ic_choose_sel@2x.png" />
+ <text>鍥炵瓟姝ｇ‘</text>
+ </view>
+ </template>
+ <template v-if="item.type == 2">
+ <view
+ class="box_list_answer_item"
+ v-for="(line, lIndex) in item.options"
+ :key="lIndex"
+ @click="changeBox(index, lIndex)"
+ >
+ <image src="@/static/checkbox@2x.png" v-if="!line.checked" />
+ <image
+ src="@/static/checkbo1x_sel@2x.png"
+ v-if="line.checked || (item.selAnswer === item.answer && line.checked)"
+ />
+ <image
+ src="@/static/checkbox_wrong@2x.png"
+ v-if="
+ line.checked &&
+ item.selAnswer !== item.answer &&
+ status == '2'
+ "
+ />
+ <text v-if="!item.selAnswer || item.selAnswer !== line.code"
+ ><text class="mr24">{{ line.code }}</text>
+ {{ line.value }}</text
+ >
+ <text
+ v-if="
+ (item.selAnswer &&
+ item.answer === item.selAnswer &&
+ item.selAnswer == line.code) ||
+ item.selAnswer == line.code
+ "
+ style="color: rgba(2, 94, 239, 1)"
+ ><text class="mr24" style="color: rgba(2, 94, 239, 1)">{{
+ line.code
+ }}</text>
+ {{ line.value }}</text
+ >
+ <text
+ v-if="
+ item.selAnswer &&
+ item.answer !== item.selAnswer &&
+ status == '2'
+ "
+ style="color: rgba(237, 69, 69, 1)"
+ ><text class="mr24" style="color: rgba(237, 69, 69, 1)">{{
+ line.code
+ }}</text>
+ {{ line.value }}</text
+ >
+ </view>
+ <view
+ class="box_list_answer_tips"
+ v-if="
+ item.selAnswer &&
+ item.answer !== item.selAnswer &&
+ status != '0'
+ "
+ >
+ <image src="@/static/ic_wrong@2x.png" />
+ <text>鍥炵瓟閿欒</text>
+ </view>
+ <view
+ class="box_list_answer_tips"
+ v-if="
+ item.selAnswer &&
+ item.answer === item.selAnswer &&
+ status != '0'
+ "
+ >
+ <image src="@/static/meeting/icon/ic_choose_sel@2x.png" />
+ <text>鍥炵瓟姝ｇ‘</text>
+ </view>
+ </template>
+ </view>
+ <view class="empty"></view>
+ <view
+ v-if="status == '0'"
+ class="box_list_answer_btn"
+ @click="onSubmit()"
+ >鎻愪氦</view
+ >
+ <view v-if="status == '1'" class="box_list_answer_btn" @click="next()"
+ >鎭枩浣犵瓟棰樻垚鍔燂紝鍘荤敵璇�</view
+ >
+ <view
+ v-if="status == '2'"
+ style="background-color: #db534c"
+ class="box_list_answer_btn"
+ @click="status = '0'"
+ >绛旈澶辫触锛屽啀鏉ヤ竴娆�</view
+ >
+ <!-- 澶氶�� -->
+ <!-- <template v-else-if="list[i].type === 2">
<view class="box_list_answer_item" v-for="(item, index) in list[i].options" :key="index"
@click="selectMultiple(item.code)">
<image src="@/static/checkbox_wrong@2x.png"
@@ -60,272 +202,286 @@
v-else-if="multiple.toString().indexOf(item.code) !== -1">{{item.code}} {{item.value}}</text>
</view>
</template> -->
- </view>
- </view>
- </view>
+ </view>
+ </view>
+ </view>
</template>
<script>
- import { getProblemsVO, getSystemDictData } from '@/api'
- export default {
- name: 'answer',
+import { getProblemsVO, getSystemDictData } from '@/api'
+export default {
+ name: 'answer',
- data() {
- return {
- list: [],
- bg: require("@/static/banner_dati.jpg"),
- title: '',
- content: ''
- }
- },
-
- onLoad() {
- this.getProblems()
- this.getInfo()
- },
+ data() {
+ return {
+ list: [],
+ bg: require("@/static/banner_dati.jpg"),
+ title: '',
+ content: '',
- methods: {
- getInfo() {
- // title
- getSystemDictData({
- dictCode: 'SYSTEM',
- label: 'THEME'
- }).then(res => {
- if (res.code === 200) {
- this.title = res.data.code
- }
- })
- // this.$u.api.getSystemDictData({
- getSystemDictData({
- dictCode: 'SYSTEM',
- label: 'DESCRIPTION'
- }).then(res => {
- if (res.code === 200) {
- this.content = res.data.code
- }
- })
- },
- getProblems() {
- getProblemsVO({ useType: 1 })
- .then(res => {
- if (res.code === 200) {
- res.data.forEach(item => {
- // 鍒ゆ柇
- if (item.type === 0) {
- item.options = [{ code: '姝ｇ‘', value: '姝ｇ‘' },{ code: '閿欒', value: '閿欒' }]
- }
- // 鍗曢��/澶氶��
- if (item.type === 1 || item.type === 2) {
- item.options = JSON.parse(item.options)
- }
- item.status = '0'
- item.selAnswer = null
- })
- console.log('options', res.data);
- this.list = res.data
- }
- // res.param.problemsDOList.forEach(item => {
- // item.options = JSON.parse(item.options)
- // })
- // this.list = res.param.problemsDOList
- // console.log(this.list)
- })
- },
- // 鍗曢�夐�夋嫨涓鐩�
- select(line, i) {
- this.list.forEach((item,index)=>{
- if(index === i){
- item.selAnswer = line.code
- }
- })
- // this.problemIndex = index
- },
- sort(arr) {
- arr.sort(function(a, b) {
- return a.localeCompare(b)
- })
- },
- // 澶氶��
- selectMultiple(key) {
- if (!this.multiple) {
- this.multiple = key
- return
- }
- let arr = this.multiple.split(',')
- if (this.multiple.indexOf(key) !== -1) {
- arr.forEach((item, index) => {
- if (key === item) {
- arr.splice(index, 1)
- }
- })
- this.sort(arr)
- this.multiple = arr.join(',')
- } else {
- arr.push(key)
- this.sort(arr)
- this.multiple = arr.join(',')
- }
- },
- // 涓嬩竴棰�
- next() {
- uni.navigateTo({
- url: `/pages/userinfo/userinfo?userAnswerId=${1}`
- })
- return
- if (this.list[this.i].type === 0 || this.list[this.i].type === 1) {
- if (!String(this.problemIndex)) return
- if (this.list[this.i].answer === this.list[this.i].options[this.problemIndex].code) {
- this.success = false
- this.problemIndex = null
- this.i += 1
- } else {
- this.success = true
- }
- } else {
- if (!this.multiple) return
- if (this.list[this.i].answer === this.multiple) {
- this.success = false
- this.multiple = null
- this.i += 1
- } else {
- this.success = true
- }
- }
- if (this.i + 1 > this.list.length) {
- let arr = []
- this.list.forEach(item => {
- arr.push({ id: item.id, answer: item.answer })
- })
- this.$u.api.finishAnswer({
- content: JSON.stringify(arr),
- openId: this.$store.state.openId,
- useType: 1
- }).then(res => {
- if (res.code === 200) {
- uni.navigateTo({
- url: `/pages/userinfo/userinfo?userAnswerId=${res.data}`
- })
- }
- })
- }
- }
- }
- }
+ status: '0'
+ }
+ },
+
+ onLoad() {
+ this.getProblems()
+ this.getInfo()
+ },
+
+ methods: {
+ getInfo() {
+ // title
+ getSystemDictData({
+ dictCode: 'SYSTEM',
+ label: 'THEME'
+ }).then(res => {
+ if (res.code === 200) {
+ this.title = res.data.code
+ }
+ })
+ // this.$u.api.getSystemDictData({
+ getSystemDictData({
+ dictCode: 'SYSTEM',
+ label: 'DESCRIPTION'
+ }).then(res => {
+ if (res.code === 200) {
+ this.content = res.data.code
+ }
+ })
+ },
+ getProblems() {
+ getProblemsVO({ useType: 1 })
+ .then(res => {
+ if (res.code === 200) {
+ res.data.forEach(item => {
+ // 鍒ゆ柇
+ if (item.type === 0) {
+ item.options = [{ code: '姝ｇ‘' }, { code: '閿欒' }]
+ }
+ // 鍗曢��/澶氶��
+ if (item.type === 1 || item.type === 2) {
+ item.options = JSON.parse(item.options)
+ }
+ if (item.type === 2) {
+ item.options.forEach(i => {
+ i.checked = false
+ })
+ }
+ item.status = '0'
+ item.selAnswer = null
+ })
+ console.log(res.data)
+ this.list = res.data
+ }
+ // res.param.problemsDOList.forEach(item => {
+ // item.options = JSON.parse(item.options)
+ // })
+ // this.list = res.param.problemsDOList
+ // console.log(this.list)
+ })
+ },
+ // 鍗曢�夐�夋嫨涓鐩�
+ select(line, i) {
+ this.list.forEach((item, index) => {
+ if (index === i) {
+ item.selAnswer = line.code
+ }
+ })
+ // this.problemIndex = index
+ },
+ changeBox(index, jeck) {
+ this.list.forEach((item, i) => {
+ if (index === i) {
+ item.options.forEach((item2, j) => {
+ if(j === jeck){
+ item2.checked = !item2.checked
+ }
+ })
+ item.selAnswer = item.options.filter(a => a.checked).map(b => b.code).sort().join(',')
+ }
+ })
+ },
+ sort(arr) {
+ arr.sort(function (a, b) {
+ return a.localeCompare(b)
+ })
+ },
+ // 澶氶��
+ selectMultiple(key) {
+ if (!this.multiple) {
+ this.multiple = key
+ return
+ }
+ let arr = this.multiple.split(',')
+ if (this.multiple.indexOf(key) !== -1) {
+ arr.forEach((item, index) => {
+ if (key === item) {
+ arr.splice(index, 1)
+ }
+ })
+ this.sort(arr)
+ this.multiple = arr.join(',')
+ } else {
+ arr.push(key)
+ this.sort(arr)
+ this.multiple = arr.join(',')
+ }
+ },
+ // 涓嬩竴棰�
+ onSubmit() {
+ const { list } = this
+ // 楠岃瘉鎵�鏈夐鐩兘鏈夐�夐」
+ let count = 0
+ list.forEach(item => {
+ if (!item.selAnswer) {
+ count++
+ }
+ })
+ if (count > 0) {
+ return uni.showToast({
+ title: '璇峰厛瀹屾垚鎵�鏈夌瓟棰樺湪鎻愪氦',
+ icon: 'none'
+ })
+ }
+ // 鍒ゆ柇瀵归敊
+ let flag = 0
+ list.forEach(item => {
+ if (item.selAnswer !== item.answer) {
+ flag++
+ }
+ })
+ if (flag > 0) {
+ this.status = '2'
+ return uni.showToast({
+ title: '绛旈澶辫触锛屽啀鏉ヤ竴娆�',
+ icon: 'none'
+ })
+ } else {
+ this.status = '1'
+ }
+ },
+ next() {
+ uni.navigateTo({
+ url: `/pages/userinfo/userinfo`
+ })
+ }
+ }
+}
</script>
<style lang="scss" scoped>
- .box {
- width: 100%;
- height: 100vh;
- background: #025EEF;
- .box_bgimage {
- width: 100%;
- padding: 0 40rpx;
- box-sizing: border-box;
- height: 223rpx;
- display: flex;
- flex-direction: column;
- align-items: flex-start;
- justify-content: center;
- background-repeat: no-repeat;
- background-size: cover;
- .box_bgimage_a {
- font-size: 54rpx;
- font-weight: bold;
- color: #FFFFFF;
- text-shadow: 0rpx 4rpx 8rpx rgba(0, 0, 0, 0.19);
- }
- .box_bgimage_b {
- font-size: 26rpx;
- font-weight: 400;
- color: #FFFFFF;
- text-shadow: 0rpx 2rpx 4rpx rgba(0, 0, 0, 0.24);
- margin-top: 18rpx;
- }
- }
- .box_list {
- width: 100%;
- height: calc(100vh - 253rpx);
- padding: 0 30rpx 30rpx 30rpx;
- box-sizing: border-box;
- .box_list_answer {
- width: 100%;
- height: 100%;
- overflow-y: auto;
- background: #FFFFFF;
- border-radius: 16rpx;
- padding: 30rpx;
- box-sizing: border-box;
- position: relative;
- .box_list_answer_name {
- font-size: 30rpx;
- font-weight: 400;
- color: #222222;
- margin-bottom: 32rpx;
- }
- .box_list_answer_tips {
- width: 100%;
- padding: 22rpx 30rpx;
- box-sizing: border-box;
- background: #F7F7F7;
- border-radius: 8rpx;
- display: flex;
- align-items: center;
- margin-bottom: 24rpx;
- image {
- width: 28rpx;
- height: 28rpx;
- }
- text {
- font-size: 28rpx;
- font-weight: 400;
- color: #E42D2D;
- margin-left: 16rpx;
- }
- }
- }
- .list_item{
- margin-bottom: 24rpx;
- }
- .box_list_answer_item {
- width: 100%;
- display: flex;
- align-items: center;
- margin-bottom: 30rpx;
- image {
- width: 36rpx;
- height: 36rpx;
- margin-right: 20rpx;
- }
- text {
- font-size: 28rpx;
- font-weight: 400;
- color: #333333;
- }
- }
- .des {
- background: #CCCCCC !important;
- border: none !important;
- }
- .empty{
- height: 160rpx;
- width: 100%;
- }
- .box_list_answer_btn {
- position: fixed;
- bottom: 140rpx;
- left: 60rpx;
- width: 630rpx;
- height: 88rpx;
- line-height: 88rpx;
- text-align: center;
- background: #025EEF;
- box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(2, 94, 239, 0.3);
- border-radius: 44rpx;
- font-size: 30rpx;
- font-weight: 500;
- color: #FFFFFF;
- }
- }
- }
+.box {
+ width: 100%;
+ height: 100vh;
+ background: #025eef;
+ .box_bgimage {
+ width: 100%;
+ padding: 0 40rpx;
+ box-sizing: border-box;
+ height: 223rpx;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+ .box_bgimage_a {
+ font-size: 54rpx;
+ font-weight: bold;
+ color: #ffffff;
+ text-shadow: 0rpx 4rpx 8rpx rgba(0, 0, 0, 0.19);
+ }
+ .box_bgimage_b {
+ font-size: 26rpx;
+ font-weight: 400;
+ color: #ffffff;
+ text-shadow: 0rpx 2rpx 4rpx rgba(0, 0, 0, 0.24);
+ margin-top: 18rpx;
+ }
+ }
+ .box_list {
+ width: 100%;
+ height: calc(100vh - 253rpx);
+ padding: 0 30rpx 30rpx 30rpx;
+ box-sizing: border-box;
+ .box_list_answer {
+ width: 100%;
+ height: 100%;
+ overflow-y: auto;
+ background: #ffffff;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ box-sizing: border-box;
+ position: relative;
+ .box_list_answer_name {
+ font-size: 30rpx;
+ font-weight: 400;
+ color: #222222;
+ margin-bottom: 32rpx;
+ }
+ .box_list_answer_tips {
+ width: 100%;
+ padding: 22rpx 30rpx;
+ box-sizing: border-box;
+ background: #f7f7f7;
+ border-radius: 8rpx;
+ display: flex;
+ align-items: center;
+ margin-bottom: 24rpx;
+ image {
+ width: 28rpx;
+ height: 28rpx;
+ }
+ text {
+ font-size: 28rpx;
+ font-weight: 400;
+ color: #e42d2d;
+ margin-left: 16rpx;
+ }
+ }
+ }
+ .list_item {
+ margin-bottom: 46rpx;
+ }
+ .box_list_answer_item {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ margin-bottom: 30rpx;
+ image {
+ width: 36rpx;
+ height: 36rpx;
+ margin-right: 20rpx;
+ }
+ text {
+ font-size: 28rpx;
+ font-weight: 400;
+ color: #333333;
+ }
+ }
+ .des {
+ background: #cccccc !important;
+ border: none !important;
+ }
+ .empty {
+ height: 160rpx;
+ width: 100%;
+ }
+ .box_list_answer_btn {
+ position: fixed;
+ bottom: 140rpx;
+ left: 60rpx;
+ width: 630rpx;
+ height: 88rpx;
+ line-height: 88rpx;
+ text-align: center;
+ background: #025eef;
+ box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(2, 94, 239, 0.3);
+ border-radius: 44rpx;
+ font-size: 30rpx;
+ font-weight: 500;
+ color: #ffffff;
+ }
+ }
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3