no message

src/pages/myStudents/myStudents.vue

@@ -18,29 +18,36 @@
             <view class="text-lg">学生列表</view>
             <view class="text-xs text-grey">
               <text class="text-red">点击选择，左滑删除，右侧添加</text>
-              <text class="cuIcon-roundaddfill text-cyan margin-left-xl add-icon" @tap="showModal"
-                data-target="ChooseModal"></text>
+              <text class="cuIcon-roundaddfill text-cyan margin-left-xl add-icon" @tap="showModal" data-target="ChooseModal"></text>
             </view>
           </view>
           <view class="padding-lr text-right" v-if="!phone">
             <text class="text-red text-xs">右侧点击绑定手机号，直接获取绑定学生列表</text>
             <text class="cuIcon-mobile text-cyan add-icon margin-left-xl" @tap="globalNavigateTo('bindPhone')"></text>
           </view>
-          <scroll-view scroll-y :style="[{height:'calc(100vh - 230px - '+ topHeader+'px)'}]">
+          <scroll-view scroll-y :style="[{ height: 'calc(100vh - 230px - ' + topHeader + 'px)' }]">
             <view class="cu-list menu-avatar">
-              <view class="cu-item" :class="moveModel=='move-box-'+ index?'move-cur':''"
-                v-for="(item,index) in result.student_data" :key="index" @touchstart="ListTouchStart"
-                @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index"
-                @tap="chooseKid(item.id)">
+              <view
+                class="cu-item"
+                :class="moveModel == 'move-box-' + index ? 'move-cur' : ''"
+                v-for="(item, index) in result.student_data"
+                :key="index"
+                @touchstart="ListTouchStart"
+                @touchmove="ListTouchMove"
+                @touchend="ListTouchEnd"
+                :data-target="'move-box-' + index"
+                @tap="chooseKid(item.id)"
+              >
                 <image mode="scaleToFill" :src="defaultAvatar" class="avatar md left"></image>
                 <view class="content">
-                  <view>{{item.name}}</view>
-                  <view class="text-gray">{{item.school_name}}-{{item.grade_name}}-{{item.class_name}}</view>
+                  <view>{{ item.name }}</view>
+                  <view class="text-gray">{{ item.school_name }}-{{ item.grade_name }}-{{ item.class_name }}</view>
                 </view>
                 <view class="action">
-                  <text class="cuIcon-check text-student font-check" v-if="item.id===kid"></text>
+                  <text class="cuIcon-check text-student font-check" v-if="item.id === kid"></text>
                 </view>
                 <view class="move student-move">
+                  <view class="bg-cyan" @tap.stop="fixStudent(item.id)">修改</view>
                   <view class="bg-red" @tap.stop="unbind(item.id)">删除</view>
                 </view>
               </view>
@@ -50,16 +57,16 @@
       </view>
     </view>
     <!-- 选择学生列表 -->
-    <view class="cu-modal" :class="modalName=='showStudents'?'show':''" @tap="hideModal">
-      <view class="cu-dialog bg-student" @tap.stop=''>
+    <view class="cu-modal" :class="modalName == 'showStudents' ? 'show' : ''" @tap="hideModal">
+      <view class="cu-dialog bg-student" @tap.stop="">
         <view class="padding text-left modal-body radius-student">
           <view class="cu-list menu-avatar">
-            <view class="cu-item" v-for="(item,index) in chooseList" :key="index" @tap="save(item.id)">
-              <view class="cu-inner" :class="{'checked':item.id===selectKid}">
+            <view class="cu-item" v-for="(item, index) in chooseList" :key="index" @tap="save(item.id)">
+              <view class="cu-inner" :class="{ checked: item.id === selectKid }">
                 <image mode="scaleToFill" :src="defaultAvatar" class="avatar md left"></image>
                 <view class="content">
-                  <view>{{item.name}}</view>
-                  <view class="text-gray">{{item.school_name}}-{{item.grade_name}}-{{item.class_name}}</view>
+                  <view>{{ item.name }}</view>
+                  <view class="text-gray">{{ item.school_name }}-{{ item.grade_name }}-{{ item.class_name }}</view>
                 </view>
               </view>
             </view>
@@ -68,19 +75,17 @@
       </view>
     </view>
     <!--添加学生-->
-    <view class="cu-modal" :class="modalName=='ChooseModal'?'show':''" @tap="hideModal">
-      <view class="cu-dialog bg-student" @tap.stop=''>
+    <view class="cu-modal" :class="modalName == 'ChooseModal' ? 'show' : ''" @tap="hideModal">
+      <view class="cu-dialog bg-student" @tap.stop="">
         <view class="cu-bar justify-around">
           <view class="content modal-title">添加学生</view>
         </view>
         <view class="padding-xl text-left modal-body">
           <view>
-            <input type="text" v-model.trim="student.student_name" placeholder="请输入学生名字"
-              class="student-input text-black text-lg">
+            <input type="text" v-model.trim="student.student_name" placeholder="请输入学生名字" class="student-input text-black text-lg" />
           </view>
           <view class="margin-top" v-if="student.student_name">
-            <input type="text" v-model.trim="student.school_name" placeholder="请输入学校名称"
-              class="student-input text-black text-lg">
+            <input type="text" v-model.trim="student.school_name" placeholder="请输入学校名称" class="student-input text-black text-lg" />
           </view>
           <view class="margin-top">
             <button class="student-input text-student text-left" @tap="get_students">获取学生</button>
@@ -91,6 +96,38 @@
         </view>
       </view>
     </view>
+    <!-- 修改学生 -->
+    <view class="cu-modal" :class="modalName == 'FixModal' ? 'show' : ''" @tap="hideModal">
+      <view class="cu-dialog bg-student" @tap.stop="">
+        <view class="cu-bar justify-around">
+          <view class="content modal-title">修改学生</view>
+        </view>
+        <view class="padding-xl text-left modal-body">
+          <view>{{ info.name }}</view>
+          <view class="margin-top">
+            <picker class="student-input" @change="gradeChange" :value="gradeIndex" :range="grades" range-key="name">
+              <view class="picker text-lg text-black">
+                {{ gradeIndex > -1 ? grades[gradeIndex].name : '请选择年级' }}
+              </view>
+            </picker>
+          </view>
+          <view class="margin-top">
+            <picker class="student-input" @change="classChange" :value="classIndex" :range="classes" range-key="name">
+              <view class="picker text-lg text-black">
+                {{ classIndex > -1 ? classes[classIndex].name : '请选择班级' }}
+              </view>
+            </picker>
+            <!-- <input type="text" v-model.trim="info.class_name" placeholder="修改班级" class="student-input text-black text-lg" /> -->
+          </view>
+        </view>
+        <view class="cu-bar modal-footer justify-center">
+          <view class="action">
+            <button class="cu-btn btn-lg round bg-cyan margin-right-sm" @tap="confirmFix">确定</button>
+            <button class="cu-btn btn-lg round bg-grey" @tap="hideModal">取消</button>
+          </view>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -99,7 +136,7 @@ import { _getStudents, _bindStudent, _unbindStudent } from '@/api/auth'
 import { _shopList } from '@/api/course'
 import { mapGetters } from 'vuex'
 export default {
-  data () {
+  data() {
     return {
       showAdd: false,
       topHeader: this.globalCustomBarHeight,
@@ -109,6 +146,26 @@ export default {
         student_name: '',
         school_name: ''
       },
+      info: {
+        id: '',
+        name: '',
+        grade_id: '',
+        class_id: ''
+      },
+      gradeIndex: -1, //年级index
+      classIndex: -1, //班级index
+      grades: [
+        { name: '一年级', id: 1 },
+        { name: '二年级', id: 2 },
+        { name: '三年级', id: 3 },
+        { name: '四年级', id: 4 },
+        { name: '五年级', id: 5 }
+      ], //年级列表
+      classes: [
+        { name: '一班', id: 1 },
+        { name: '二班', id: 2 },
+        { name: '三班', id: 3 }
+      ], //班级列表
       result: null,
       chooseList: [],
       moveModel: null,
@@ -118,13 +175,10 @@ export default {
     }
   },
   computed: {
-    ...mapGetters([
-      'kid', 'phone'
-    ])
-  },
-  onLoad () {
+    ...mapGetters(['kid', 'phone'])
   },
-  onShow () {
+  onLoad(options) {},
+  onShow() {
     this.get_list()
     const kid = this.kid
     if (kid) {
@@ -134,25 +188,23 @@ export default {
         title: '请选择学生',
         content: '请先选择一个学生',
         showCancel: false,
-        success: res => {
-
-        }
+        success: res => {}
       })
     }
   },
   methods: {
-    showModal (e) {
+    showModal(e) {
       this.modalName = e.currentTarget.dataset.target
     },
-    hideModal (e) {
+    hideModal(e) {
       this.modalName = null
     },
-    get_list () {
+    get_list() {
       _getStudents().then(res => {
         this.result = res.data
       })
     },
-    get_students () {
+    get_students() {
       if (!this.student.student_name) return uni.showToast({ title: '请输入学生姓名', icon: 'none' })
       if (!this.student.school_name) return uni.showToast({ title: '请输入学校名称', icon: 'none' })
       _getStudents(this.student).then(res => {
@@ -165,7 +217,7 @@ export default {
         }
       })
     },
-    save (id) {
+    save(id) {
       this.selectKid = id
       uni.showModal({
         title: '确定绑定？',
@@ -182,7 +234,30 @@ export default {
         }
       })
     },
-    unbind (id) {
+    fixStudent(id) {
+      const item = this.result.student_data.find(item => item.id === id)
+      this.info.id = id
+      this.info.name = item.name
+      this.gradeIndex = this.grades.findIndex(e => e.name === item.grade_name)
+      this.info.grade_id = this.grades[this.gradeIndex]['id']
+      this.classIndex = this.classes.findIndex(e => e.name === item.class_name)
+      this.info.class_id = this.classes[this.classIndex]['id']
+      this.modalName = 'FixModal'
+    },
+    get_grades() {},
+    get_classes() {},
+    gradeChange(e) {
+      this.gradeIndex = e.detail.value
+      this.studentForm.grade_id = this.grades[this.gradeIndex].id
+      this.classIndex = -1
+      this.get_classes()
+    },
+    classChange(e) {
+      this.classIndex = e.detail.value
+      this.studentForm.class_id = this.classes[this.classIndex].id
+    },
+    confirmFix() {},
+    unbind(id) {
       const _self = this
       uni.showModal({
         title: '确定解绑？',
@@ -192,7 +267,9 @@ export default {
             _unbindStudent({ student: id }).then(res => {
               if (res.code === 1) {
                 uni.showToast({ title: '解绑成功！' })
-                if (_self.kid === id) { _self.$store.dispatch('setKid', 0) }// 解绑选中学生
+                if (_self.kid === id) {
+                  _self.$store.dispatch('setKid', 0)
+                } // 解绑选中学生
                 this.get_list()
               }
             })
@@ -200,7 +277,7 @@ export default {
         }
       })
     },
-    chooseKid (id) {
+    chooseKid(id) {
       uni.showModal({
         title: '确定选择学生',
         message: '确定选择该学生?',
@@ -214,19 +291,20 @@ export default {
         }
       })
     },
-    setCarts () { // 刷新购物车
+    setCarts() {
+      // 刷新购物车
       _shopList().then(res => {
         const carts = res.data.map(item => item.class_attend_id)
         this.$store.dispatch('setCarts', carts)
       })
     },
-    ListTouchStart (e) {
+    ListTouchStart(e) {
       this.listTouchStart = e.touches[0].pageX
     },
-    ListTouchMove (e) {
+    ListTouchMove(e) {
       this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
     },
-    ListTouchEnd (e) {
+    ListTouchEnd(e) {
       if (this.listTouchDirection === 'left') {
         this.moveModel = e.currentTarget.dataset.target
       } else {
@@ -265,6 +343,7 @@ export default {
   font-size: 22px;
 }
 .student-input {
+  padding-left: 20rpx;
   height: 40px;
   line-height: 40px;
   border-radius: 20px;
@@ -295,11 +374,11 @@ export default {
 .font-check {
   font-size: 22px;
 }
-.cu-list > .cu-item .move.student-move {
-  width: 130rpx;
-  text-align: center;
-}
-.cu-list > .cu-item.move-cur {
-  transform: translateX(-130rpx);
-}
+// .cu-list > .cu-item .move.student-move {
+//   width: 130rpx;
+//   text-align: center;
+// }
+// .cu-list > .cu-item.move-cur {
+//   transform: translateX(-130rpx);
+// }
 </style>