feat bmi

pages/classes/select.vue

@@ -36,133 +36,143 @@
   </view>
 </template>
 
-<script>
+<script setup>
+import { onActivated, onMounted, reactive, ref, computed } from "vue";
+import { onLoad } from '@dcloudio/uni-app';
 import { navTo, showToast } from "@/utils/app";
-export default {
-  data() {
-    return {
-      title: '学生未激活',
-      select: 0,
-      selectMax: 1,
-      queryForm: {
-        student_id: 0,
-      },
-      totalList: [],
-      activeTab: 'grade',
-      tabs: [
-        { title: '选择年级', type: 'grade', img: '/static/image/bmi/manual_icon_grade.png', actImg: '/static/image/bmi/manual_icon_grade_selected.png' },
-        { title: '选择班级', type: 'class', img: '/static/image/bmi/manual_icon_class.png', actImg: '/static/image/bmi/manual_icon_class_selected.png' },
-        { title: '选择学生', type: 'student', img: '/static/image/bmi/manual_icon_student.png', actImg: '/static/image/bmi/manual_icon_student_selected.png' }
-      ],
-      countdown: 60,
-      selectedArr: [
-        { name: '三年级', id: 1 },
-        { name: '1班', id: 2 },
-        { name: '11', id: 3 },
-      ]
+
+const title = ref('学生未激活')
+const select = ref(0)
+const selectMax = ref(1)
+const totalList = ref([])
+const activeTab = ref('grade')
+const countdown = ref(60)
+const queryForm = ref({
+  student_id: 0,
+})
+const tabs = ref([
+  { title: '选择年级', type: 'grade', img: '/static/image/bmi/manual_icon_grade.png', actImg: '/static/image/bmi/manual_icon_grade_selected.png' },
+  { title: '选择班级', type: 'class', img: '/static/image/bmi/manual_icon_class.png', actImg: '/static/image/bmi/manual_icon_class_selected.png' },
+  { title: '选择学生', type: 'student', img: '/static/image/bmi/manual_icon_student.png', actImg: '/static/image/bmi/manual_icon_student_selected.png' }
+])
+const selectedArr = ref([
+  { name: '三年级', id: 1 },
+  { name: '1班', id: 2 },
+  { name: '11', id: 3 },
+])
+
+const classList = computed(() => {
+  let activeGrade = totalList.value.find(item => item.active == true)
+  return activeGrade ? activeGrade.class : null
+})
+
+const studentList = computed(() => {
+  let activeGrade = totalList.value.find(item => item.active == true)
+  if (activeGrade && activeGrade.class) {
+    let activeClass = activeGrade.class.find(item => item.active == true)
+    return activeClass ? activeClass.student : null
+  }
+  return null
+})
+
+const curSelected = computed(() => {
+  let arr = []
+  let activeGrade = totalList.value.find(item => item.active == true)
+  if (activeGrade) {
+    arr.push(activeGrade)
+    let activeClass = classList.value.find(item => item.active == true)
+    if (activeClass) {
+      arr.push(activeClass)
+      let activeStudent = studentList.value.find(item => item.active == true)
+      if (activeStudent) arr.push(activeStudent)
     }
-  },
-  computed: {
-    classList() {
-      let activeGrade = this.totalList.find(item => item.active == true)
-      return activeGrade ? activeGrade.class : null
-    },
-    studentList() {
-      let activeGrade = this.totalList.find(item => item.active == true)
-      if (activeGrade && activeGrade.class) {
-        let activeClass = activeGrade.class.find(item => item.active == true)
-        return activeClass ? activeClass.student : null
-      }
-      return null
-    },
-    curSelected() {
-      let arr = []
-      let activeGrade = this.totalList.find(item => item.active == true)
-      if (activeGrade) {
-        arr.push(activeGrade)
-        let activeClass = this.classList.find(item => item.active == true)
-        if (activeClass) {
-          arr.push(activeClass)
-          let activeStudent = this.studentList.find(item => item.active == true)
-          if (activeStudent) arr.push(activeStudent)
-        }
-      }
-      return arr
-    },
-  },
-  onLoad() {
-    this.getGradeList()
-  },
-  methods: {
-    getGradeList() {
-      this.totalList = [
-        { name: '一年级', id: 1 },
-        { name: '二年级', id: 2 },
-        { name: '二年级', id: 3 },
-        { name: '二年级', id: 4 },
-        { name: '二年级', id: 5 },
-        { name: '二年级', id: 6 },
-        { name: '二年级', id: 7 },
-      ]
-      console.log(this.totalList[0])
-    },
-    getClassList() {
-      this.totalList.find(item => item.active == true).class = [
-        { name: '一班', id: 1 },
-        { name: '二班', id: 3 },
-        { name: '三班', id: 4 },
-        { name: '四班', id: 5 },
-        { name: '五班', id: 6 },
-        { name: '六班', id: 7 },
-      ]
-    },
-    getStudent() {
-      this.totalList.find(item => item.active == true).class
-        .find(item => item.active == true).student = [
-          { name: '11', id: 1 },
-          { name: '22', id: 3 },
-          { name: '33', id: 4 },
-          { name: '44', id: 5 },
-          { name: '55', id: 6 },
-          { name: '66', id: 7 },
-        ]
-    },
-    changeTab(item) {
-      this.activeTab = item.type
-    },
-    changeGrade(item) {
-      this.activeTab = 'class'
-      for (let i of this.totalList) { i.active = false }
-      item.active = true
-      this.getClassList()
-    },
-    changeClass(item) {
-      this.activeTab = 'student'
-      let classList = this.totalList.find(i => i.active == true).class
-      for (let i of classList) { i.active = false }
-      item.active = true
-      this.getStudent()
-    },
-    changeStudent(item) {
-      let classList = this.totalList.find(i => i.active == true).class
-      let studentList = classList.find(i => i.active == true).student
-      for (let i of studentList) { i.active = false }
-      item.active = true
-    },
-    goBcak() {
-      navTo('pages/index/index', {
-
-      })
-    },
-    navToTest() {
-      if (this.curSelected.length == 3) {
-        navTo('pages/test/bmi', {
-
-        })
-      }
-    },
+  }
+  return arr
+})
+
+const getGradeList = () => {
+  totalList.value = [
+    { name: '一年级', id: 1 },
+    { name: '二年级', id: 2 },
+    { name: '二年级', id: 3 },
+    { name: '二年级', id: 4 },
+    { name: '二年级', id: 5 },
+    { name: '二年级', id: 6 },
+    { name: '二年级', id: 7 },
+  ]
+}
+
+const getClassList = () => {
+  totalList.value.find(item => item.active == true).class = [
+    { name: '一班', id: 1 },
+    { name: '二班', id: 3 },
+    { name: '三班', id: 4 },
+    { name: '四班', id: 5 },
+    { name: '五班', id: 6 },
+    { name: '六班', id: 7 },
+  ]
+}
+
+const getStudent = () => {
+  totalList.value.find(item => item.active == true).class
+    .find(item => item.active == true).student = [
+      { name: '11', id: 1 },
+      { name: '22', id: 3 },
+      { name: '33', id: 4 },
+      { name: '44', id: 5 },
+      { name: '55', id: 6 },
+      { name: '66', id: 7 },
+    ]
+}
+
+const changeTab = (item) => {
+  activeTab.value = item.type
+}
+
+const changeGrade = (item) => {
+  activeTab.value = 'class'
+  for (let i of totalList.value) { i.active = false }
+  item.active = true
+  getClassList()
+}
+
+const changeClass = (item) => {
+  activeTab.value = 'student'
+  let classList = totalList.value.find(i => i.active == true).class
+  for (let i of classList) { i.active = false }
+  item.active = true
+  getStudent()
+}
+
+const changeStudent = (item) => {
+  let classList = totalList.value.find(i => i.active == true).class
+  let studentList = classList.find(i => i.active == true).student
+  for (let i of studentList) { i.active = false }
+  item.active = true
+}
+
+const goBcak = () => {
+  navTo('pages/index/index', {
+
+  })
+}
+
+const navToTest = () => {
+  if (curSelected.value.length == 3) {
+    navTo('pages/test/bmi', {
+
+    })
   }
 }
+
+
+onLoad(() => {
+  getGradeList()
+})
+
+// 挂载完成之后
+onMounted(() => {
+})
 </script>
 
 <style scoped>

pages/test/bmi.vue

@@ -4,13 +4,16 @@
         <view class="info-box">
             <view class="student-card">
                 <view class="student-box1">
-                    <image class="head-img" :src="student_info.sex == 1 ? '/static/image/bmi/test_img_head_boy.png' : '/static/image/bmi/test_img_head_gril.png'">
+                    <image class="head-img"
+                        :src="student_info.sex == 1 ? '/static/image/bmi/test_img_head_boy.png' : '/static/image/bmi/test_img_head_gril.png'">
                     </image>
                     <view class="student-info1">
                         <view class="student-info11">
                             <view class="student-info111">
-                                <view>{{student_info.name}}</view>
-                                <image class="sex-img" :src="student_info.sex == 1 ? '/static/image/bmi/test_icon_boy.png' : '/static/image/bmi/test_icon_gril.png'"></image>
+                                <view>{{ student_info.name }}</view>
+                                <image class="sex-img"
+                                    :src="student_info.sex == 1 ? '/static/image/bmi/test_icon_boy.png' : '/static/image/bmi/test_icon_gril.png'">
+                                </image>
                             </view>
                             <view class="student-num">编号：{{ student_info.number }}</view>
                         </view>
@@ -70,32 +73,30 @@
     </view>
 </template>
 
-<script>
+<script setup>
+import { onActivated, onMounted, reactive, ref } from "vue";
 import { navTo, showToast } from "@/utils/app";
 
-export default {
-    name: "bmi",
-    data() {
-        return {
-            student_info:{
-                name: '张珊珊',
-                sex: 2,
-                number: 123456,
-                class: '一年三班'
-            },
-            isFinish: false
-        }
-    },
-    methods: {
-        goBcak() {
-            navTo('pages/classes/select', {
-
-            })
-        },
-    }
+const isFinish = ref(false)
+const student_info = ref({
+    name: '张珊珊',
+    sex: 2,
+    number: 123456,
+    class: '一年三班'
+})
+
+const goBcak = () => {
+    navTo('pages/classes/select', {
+
+    })
 }
+
+// 挂载完成之后
+onMounted(() => {
+})
 </script>
 
+
 <style scoped>
 .container-box {
     height: 100vh;
@@ -282,7 +283,7 @@ export default {
     color: #4D5652;
 }
 
-.wait-test-item2{
+.wait-test-item2 {
     font-weight: bold;
     font-size: 63upx;
     color: #EA6433;