10.22提交
This commit is contained in:
@@ -52,18 +52,29 @@
|
||||
}
|
||||
const single = ref('')
|
||||
function maskClick(e){
|
||||
console.log('maskClick事件:', e);
|
||||
// console.log('maskClick事件:', e);
|
||||
}
|
||||
const hValue = ref('') // 医院
|
||||
const hValueId = ref('') // 医院id
|
||||
function onClickH(e) {
|
||||
console.log(hValue.value)
|
||||
// console.log(hValue.value)
|
||||
}
|
||||
function toExam() { // 视力测试
|
||||
uni.navigateTo({
|
||||
url:"/pages/index/visionTest"
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="content page-box">
|
||||
<!-- 轮播图 -->
|
||||
<mySwiper :indicatorDots="true" :isRadius="true" height="160" class="index-siwper margin-b-card" :lbt_list="lbt_list" style="width: 100%;" />
|
||||
<view class="main-cards" @tap="toExam">
|
||||
<view class="mc-row">
|
||||
<view>视力测试</view>
|
||||
<uni-icons type="forward" color="#9bc027" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="main-cards">
|
||||
<view class="mc-part" style="margin-left: 0;">
|
||||
<view class="mc-part-text">已完成事项</view>
|
||||
@@ -130,6 +141,19 @@
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.mc-row{
|
||||
display:flex;
|
||||
// width: 100%;
|
||||
// justify-content: space-between;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
border: 1px solid #9bc027;
|
||||
padding: 20px 10px;
|
||||
border-radius: 10px;
|
||||
color: #9bc027;
|
||||
font-size: 16px;
|
||||
font-weight: 900;
|
||||
}
|
||||
.radio{
|
||||
margin-right:20rpx;
|
||||
}
|
||||
|
254
pages/index/visionTest.vue
Normal file
254
pages/index/visionTest.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<script setup>
|
||||
// 引入依赖
|
||||
import uniDatetimePicker from '@/uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue'
|
||||
import uniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue'
|
||||
import { onLoad } from "@dcloudio/uni-app"
|
||||
// import mySwiper from "@/components/mySwiper.vue"
|
||||
import {ref,onMounted,nextTick} from "vue"
|
||||
import {useStore} from '@/store/index.js'
|
||||
const store = useStore()
|
||||
onLoad((e) => {
|
||||
if(!store.userInfo?.has_operation) { // 未填写手术信息
|
||||
setTimeout(()=>{
|
||||
// console.log(inputDialog.value)
|
||||
inputDialog.value.open()
|
||||
},0)
|
||||
}
|
||||
})
|
||||
// 变量
|
||||
const inputDialog = ref()
|
||||
const inputDialog2 = ref()
|
||||
const inputDialog3 = ref()
|
||||
const step1 = ref('先测右眼,请遮住左眼')
|
||||
const step2 = ref('请遮住右眼')
|
||||
const countDown = ref(5)
|
||||
const scale_ = ref(1)
|
||||
const current_img = ref("") // 当前图片
|
||||
const current_img_index = ref(null)
|
||||
const sizes = ref([{
|
||||
size:23,
|
||||
vision:4.2
|
||||
},{
|
||||
size:19,
|
||||
vision:4.2
|
||||
},
|
||||
{
|
||||
size:15,
|
||||
vision:4.2
|
||||
},{
|
||||
size:11,
|
||||
vision:4.2
|
||||
},{
|
||||
size:9,
|
||||
vision:4.2
|
||||
},{
|
||||
size:7,
|
||||
vision:4.2
|
||||
},{
|
||||
size:6,
|
||||
vision:4.2
|
||||
},{
|
||||
size:4,
|
||||
vision:4.2
|
||||
},{
|
||||
size:3,
|
||||
vision:4.2
|
||||
},
|
||||
])
|
||||
const show_size = ref({
|
||||
width:'29px'
|
||||
})
|
||||
const num = ref(0)
|
||||
const now = ref(1)
|
||||
const vision_info = ref({
|
||||
left:4,
|
||||
right:4.1
|
||||
})
|
||||
// 函数
|
||||
function toStart() { // 开始测试
|
||||
inputDialog.value.close()
|
||||
inputDialog2.value.open()
|
||||
let s = setInterval(() => {
|
||||
countDown.value--
|
||||
if(countDown.value == 0) {
|
||||
clearInterval(s)
|
||||
inputDialog2.value.close()
|
||||
}
|
||||
},1000)
|
||||
randomFunc()
|
||||
}
|
||||
function toClose() {
|
||||
inputDialog.value.close()
|
||||
}
|
||||
function randomFunc() {
|
||||
let ran = Math.ceil(Math.random()*4)
|
||||
if(current_img_index.value == ran) {
|
||||
randomFunc()
|
||||
}
|
||||
else{
|
||||
current_img.value = "../../static/"+ran+".png"
|
||||
current_img_index.value = ran
|
||||
}
|
||||
// console.log(current_img.value)
|
||||
}
|
||||
function chooseFunc(index) {
|
||||
// 先执行加减分
|
||||
if(!index){ // 扣分
|
||||
|
||||
}
|
||||
// 换图片
|
||||
randomFunc()
|
||||
|
||||
// 判断是否结束,换眼
|
||||
if(num.value>8) { // 结束换眼
|
||||
if(now.value == 2) { // 结束测试
|
||||
|
||||
return
|
||||
}
|
||||
show_size.value.width = '29px'
|
||||
countDown.value = 5
|
||||
step1.value = '测左眼,请遮住右眼'
|
||||
num.value = 8
|
||||
now.value = 2
|
||||
toStart()
|
||||
}
|
||||
else{ // 改变尺寸
|
||||
show_size.value.width = sizes.value[num.value].size+'px'
|
||||
num.value++
|
||||
}
|
||||
}
|
||||
function okFunc() { // 结束测试
|
||||
inputDialog3.value.open()
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="visionTestBox page-box">
|
||||
<view class="actionBox">
|
||||
<!-- 测试区域 -->
|
||||
<view class="ab-show-box">
|
||||
<image :src="current_img" :style="show_size" mode="widthFix"></image>
|
||||
</view>
|
||||
<!-- 操作区域 -->
|
||||
<view class="ab-action-box">
|
||||
<view class="ac-row">
|
||||
<image @tap="chooseFunc(1)" class="ac-row-card" src="../../static/1.png" mode=""></image>
|
||||
</view>
|
||||
<view class="ac-row">
|
||||
<image @tap="chooseFunc(3)" class="ac-row-card" src="../../static/3.png" mode=""></image>
|
||||
<view @tap="chooseFunc(0)" class="ac-row-card ac-row-card-text">看不清</view>
|
||||
<image @tap="chooseFunc(4)" class="ac-row-card" src="../../static/4.png" mode=""></image>
|
||||
</view>
|
||||
<view class="ac-row">
|
||||
<image @tap="chooseFunc(2)" class="ac-row-card" src="../../static/2.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<uni-popup ref="inputDialog" :is-mask-click='true'>
|
||||
<view class="pop-box">
|
||||
<view class="pb-title">测试须知</view>
|
||||
<view class="pb-content">
|
||||
<view class="content-text">
|
||||
使用uni-app自带的editor组件,该组件支持App、H5、微信小程序,其他家小程序自身未提供这类解决方案。
|
||||
</view>
|
||||
<view class="okBtn" @tap="toStart">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="inputDialog2" :is-mask-click='false' style="width: 100%;">
|
||||
<view class="pop-box">
|
||||
<view class="pb-title">测试须知</view>
|
||||
<view class="pb-content">
|
||||
<view class="content-text">
|
||||
<view class="ct-title">{{countDown}}</view>
|
||||
<view>{{step1}}</view>
|
||||
</view>
|
||||
<!-- <view class="okBtn" @tap="toStart">确定</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup ref="inputDialog3" :is-mask-click='true'>
|
||||
<view class="pop-box">
|
||||
<view class="pb-title">测试结束</view>
|
||||
<view class="pb-content">
|
||||
<view class="content-text">
|
||||
测试结束,当前视力为{{vision_info.left}}(左),{{vision_info.right}}(右)。
|
||||
</view>
|
||||
<view class="okBtn" @tap="okFunc">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.visionTestBox,.actionBox{
|
||||
height: 100%;
|
||||
}
|
||||
.actionBox{
|
||||
.ab-show-box{
|
||||
// width: 100%;
|
||||
height: 50%;
|
||||
border: 2rpx solid #d0d0d0;
|
||||
margin: 10rpx;
|
||||
margin-top: 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
image{
|
||||
// width: 29px;
|
||||
}
|
||||
}
|
||||
.ab-action-box{
|
||||
.ac-row{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.ac-row-card-text{
|
||||
padding: 10rpx !important;
|
||||
width: 80rpx !important;
|
||||
height: 80rpx !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.ac-row-card{
|
||||
// white-space: nowrap;
|
||||
margin: 20rpx;
|
||||
font-size: 24rpx;
|
||||
border-radius: 50%;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
padding: 30rpx;
|
||||
box-shadow: 2rpx 20rpx 40rpx #dfdfdf;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content-text{
|
||||
margin-bottom: 20rpx;
|
||||
.ct-title{
|
||||
text-align: center;
|
||||
font-size: 34px;
|
||||
color: #26758d;
|
||||
}
|
||||
}
|
||||
.okBtn{
|
||||
width: 100%;
|
||||
color: white;
|
||||
background-color: #26758d;
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.pop-box{
|
||||
.pb-title{
|
||||
text-align: center;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
background-color: white;
|
||||
padding: 20rpx;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user