猫妈狗爸伴宠师小程序前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

198 lines
4.8 KiB

<template>
<!-- <view>伴宠师认证</view> -->
<view class="page">
<view class="box">
<view class="content bg-fff">
<view class="group" v-for="(group, gIdx) in list" :key="`group-${gIdx}`">
<view class="label size-22 level" :style="{borderRadius:'10rpx'}">
{{ group.title }}
</view>
<view class="">
<questionCard
v-for="(item, qIdx) in group.children"
:key="`${gIdx}-question-${qIdx}`"
:index="qIdx"
:data="item"
mode="display"
></questionCard>
</view>
</view>
</view>
</view>
<view class="footer-btn flex-colc">
<view class="size-22 color-777 tips-rest">
<!-- todo -->
剩余考试机会:<text class="highlight">{{ restTimes }}</text>次
</view>
<view class="btn" @click="onClick">
重新考试
</view>
</view>
</view>
</template>
<script setup>
import { ref } from 'vue'
import { onShow } from '@dcloudio/uni-app'
import { usePageList } from "@/utils/pageList";
import questionCard from '../components/questionCard.vue';
const { list, getData } = usePageList()
const restTimes = ref()
onShow(() => {
// todo: fetch
restTimes.value = 3
list.value = [
{
title: '选择题',
children: [
{
question: '猫咪每天在地上走路,时不时还会打滚,身上是很不干净的,最好每个星期洗次澡',
options: [
{
label: '对',
value: 0,
},
{
label: '错',
value: 1,
},
],
answer: 0,
value: 1,
},
{
question: '当狗狗出现乱拉乱尿或者捣乱拆家等反映时,您会如何处理?',
options: [
{
label: '暴力制止,根据情况是否严重来判断下手轻重,让狗狗知道这样做会受到惩罚',
value: 0,
},
{
label: '奖罚分明,制止后耐心引导,直到狗狗做出正确的行为,并立马给出奖励',
value: 1,
},
{
label: '狗狗也不是故意的,也不会造成什么很大的影响,默默打扫好就算了吧',
value: 2,
},
],
answer: 1,
value: 2,
},
{
question: '狗狗和猫咪一样是肉食性动物,最好可以纯肉喂养,对狗狗的身心健康有很大好处',
options: [
{
label: '对',
value: 0,
},
{
label: '错',
value: 1,
},
],
answer: 1,
value: 0,
},
]
},
{
title: '主观题',
children: [
{
question: '喂养服务流程:如果您收到一笔喂养猫咪的订单,备注猫咪性格活泼,请问您会如何进行服务?请详细描述和上一题服务过程的不同之处(若服务宠物不包含猫咪可回答“略”)',
reason: '字数低于700字,不予合格',
value: '猫咪性格怕生,我耐心的与猫咪接触,和它玩耍 先建立良好的关系,再进行喂养。',
},
{
question: '喂养服务流程:如果您收到一笔喂养猫咪的订单,备注猫咪性格活泼,请问您会如何进行服务?请详细描述和上一题服务过程的不同之处(若服务宠物不包含猫咪可回答“略”)',
reason: '字数低于700字,不予合格',
value: '猫咪性格怕生,我耐心的与猫咪接触,和它玩耍 先建立良好的关系,再进行喂养。',
},
{
question: '喂养服务流程:如果您收到一笔喂养猫咪的订单,备注猫咪性格活泼,请问您会如何进行服务?请详细描述和上一题服务过程的不同之处(若服务宠物不包含猫咪可回答“略”)',
reason: '字数低于700字,不予合格',
value: '猫咪性格怕生,我耐心的与猫咪接触,和它玩耍 先建立良好的关系,再进行喂养。',
},
]
}
]
})
const onClick = () => {
uni.reLaunch({
url: "/otherPages/authentication/examination/start"
// todo: check
// url: "/otherPages/authentication/list/index"
})
}
</script>
<style lang="scss" scoped>
$bar-height: 163rpx;
.page {
padding-bottom: $bar-height;
}
.box {
// background-image: linear-gradient(to bottom, #ffbf60, #f2f2f2);
padding: 16rpx;
.step {
width: 720rpx;
height: 32rpx;
border-radius: 32rpx;
background-color: #D9D9D9;
.in {
width: 50%;
height: 32rpx;
background-color: #ffbf60;
border-radius: 32rpx;
}
}
}
.content {
border-radius: 20rpx;
padding: 15rpx 20rpx;
.label {
width: 86rpx;
padding: 5rpx 15rpx;
color: #fff;
background-color: #FFBF60;
justify-content: center;
}
}
.group + .group {
margin-top: 68rpx;
}
.level {
display: flex;
}
.footer-btn {
height: $bar-height;
}
.tips {
&-rest {
color: #707070;
font-size: 22rpx;
margin: 9rpx 0 13rpx 0;
.highlight {
color: #FF8DC6;
}
}
}
</style>