学生评价

src/api/eva.js

@@ -0,0 +1,132 @@
+// axios
+import request from '@/utils/request'
+
+// 获取老师所带班级
+export function select_techerAllClass(params) {
+  return request({
+    url: '/select_techerAllClass',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取班级学生
+export function selectClassStudent(params) {
+  return request({
+    url: '/selectClassStudent',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取学生详情
+export function selectStudentDetail(params) {
+  return request({
+    url: '/selectStudentDetail',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取筛选选项（纬度）
+export function selectVeiDoo(params) {
+  return request({
+    url: '/selectVeiDoo',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 添加学生评价
+export function insertRecord(data) {
+  return request({
+    url: '/insertRecord',
+    method: 'post',
+    data,
+    hideloading: false
+  })
+}
+
+// 获取所有学生记录
+export function selectRecord(params) {
+  return request({
+    url: '/selectRecord',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取单个学生记录详情
+export function selectRecordDetail(params) {
+  return request({
+    url: '/selectRecordDetail',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 删除学生评价
+export function updateRecord(data) {
+  return request({
+    url: '/updateRecord',
+    method: 'post',
+    data,
+    hideloading: false
+  })
+}
+
+// 删除学生评价
+export function updateRecordData(data) {
+  return request({
+    url: '/updateRecordData',
+    method: 'post',
+    data,
+    hideloading: false
+  })
+}
+
+// 模糊搜索学生
+export function selectSerStudent(params) {
+  return request({
+    url: '/selectSerStudent',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取学期选项
+export function selectTerm(params) {
+  return request({
+    url: '/selectTerm',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取学期选项
+export function selectManyClassStudent(params) {
+  return request({
+    url: '/selectManyClassStudent',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}
+
+// 获取学期选项
+// export function selectTermRecord(params) {
+//   return request({
+//     url: '/selectTermRecord',
+//     method: 'get',
+//     params,
+//     hideloading: false
+//   })
+// }

src/api/testStudent.js

@@ -2,29 +2,29 @@
 import request from '@/utils/request'
 // 获取问卷类型
 export function selectTestType(params) {
-    return request({
-        url: '/selectTestType',
-        method: 'get',
-        params,
-        hideloading: false
-    })
+  return request({
+    url: '/selectTestType',
+    method: 'get',
+    params,
+    hideloading: false
+  })
 }
 // 查询问卷列表
 export function selectTesttCourseCenter(params) {
-    return request({
-        url: '/selectTesttCourseCenter',
-        method: 'get',
-        params,
-        hideloading: false
-    })
+  return request({
+    url: '/selectTesttCourseCenter',
+    method: 'get',
+    params,
+    hideloading: false
+  })
 }
 
-//查询问卷列表及作业
+// 查询问卷列表及作业
 export function selectTesttCourseCenter1(params) {
-    return request({
-        url: '/selectTesttCourseCenter1',
-        method: 'get',
-        params,
-        hideloading: false
-    })
-}
+  return request({
+    url: '/selectTesttCourseCenter1',
+    method: 'get',
+    params,
+    hideloading: false
+  })
+}

src/plugins/vant.js

@@ -14,7 +14,15 @@ import {
   PullRefresh,
   Empty,
   Overlay,
-  Image
+  Image,
+  Icon,
+  Uploader,
+  DatetimePicker,
+  Popup,
+  SwipeCell,
+  Search,
+  Tab,
+  Tabs
 } from 'vant'
 Vue.use(Button)
   .use(Cell)
@@ -30,3 +38,11 @@ Vue.use(Button)
   .use(Empty)
   .use(Overlay)
   .use(Image)
+  .use(Icon)
+  .use(Uploader)
+  .use(DatetimePicker)
+  .use(Popup)
+  .use(SwipeCell)
+  .use(Search)
+  .use(Tabs)
+  .use(Tab)

src/router/router.config.js

@@ -2,99 +2,180 @@
  * 基础路由
  * @type { *[] }
  */
-export const constantRouterMap = [{
-        path: '/',
-        redirect: '/home'
-    },
-    {
-        path: '/login',
-        component: () =>
-            import ('@/views/login/index'),
-        meta: {
-            title: '登录',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/course',
-        component: () =>
-            import ('@/views/course/index'),
-        meta: {
-            title: '课程',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/',
-        component: () =>
-            import ('@/views/layouts'),
-        meta: { title: '课程中心', keepAlive: false },
-        children: [{
-                path: 'home',
-                name: 'home',
-                component: () =>
-                    import ('@/views/home/index'),
-                meta: { title: '课程中心', keepAlive: false }
-            },
-            {
-                path: 'test',
-                name: 'Test',
-                component: () =>
-                    import ('@/views/test/index'),
-                meta: { title: '评测中心', keepAlive: false }
-            },
-            {
-                path: 'eva',
-                name: 'eva',
-                component: () =>
-                    import ('@/views/eva/index'),
-                meta: { title: '学生评价', keepAlive: false }
-            }
-        ]
-    },
-    {
-        path: '/courseDetail',
-        component: () =>
-            import ('@/views/courseDetail/index'),
-        meta: {
-            title: '课程详情',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/testDetail',
-        component: () =>
-            import ('@/views/testDetail/index'),
-        meta: {
-            title: '填写问卷',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/preview',
-        component: () =>
-            import ('@/views/testDetail/preview'),
-        meta: {
-            title: '修改问卷',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/check',
-        component: () =>
-            import ('@/views/testDetail/check'),
-        meta: {
-            title: '查看问卷',
-            keepAlive: false
-        }
-    },
-    {
-        path: '/cocoai',
-        component: () =>
-            import ('@/views/aigpt/index'),
-        meta: {
-            title: 'CocoAI',
-            keepAlive: false
-        }
+export const constantRouterMap = [
+  {
+    path: '/',
+    redirect: '/home'
+  },
+  {
+    path: '/login',
+    component: () => import('@/views/login/index'),
+    meta: {
+      title: '登录',
+      keepAlive: false
     }
-]
+  },
+  {
+    path: '/course',
+    component: () => import('@/views/course/index'),
+    meta: {
+      title: '课程',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/',
+    component: () => import('@/views/layouts'),
+    meta: { title: '课程中心', keepAlive: false },
+    children: [
+      {
+        path: 'home',
+        name: 'home',
+        component: () => import('@/views/home/index'),
+        meta: { title: '课程中心', keepAlive: false }
+      },
+      {
+        path: 'test',
+        name: 'Test',
+        component: () => import('@/views/test/index'),
+        meta: { title: '评测中心', keepAlive: false }
+      },
+      {
+        path: 'eva',
+        name: 'eva',
+        component: () => import('@/views/eva/index'),
+        meta: { title: '学生评价', keepAlive: false }
+      }
+    ]
+  },
+  {
+    path: '/courseDetail',
+    component: () => import('@/views/courseDetail/index'),
+    meta: {
+      title: '课程详情',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/testDetail',
+    component: () => import('@/views/testDetail/index'),
+    meta: {
+      title: '填写问卷',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/preview',
+    component: () => import('@/views/testDetail/preview'),
+    meta: {
+      title: '修改问卷',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/check',
+    component: () => import('@/views/testDetail/check'),
+    meta: {
+      title: '查看问卷',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/cocoai',
+    component: () => import('@/views/aigpt/index'),
+    meta: {
+      title: 'CocoAI',
+      keepAlive: false
+    }
+  },
+
+  {
+    path: '/course',
+    component: () => import('@/views/course/index'),
+    meta: {
+      title: '课程',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/',
+    component: () => import('@/views/layouts'),
+    meta: { title: '课程中心', keepAlive: false },
+    children: [
+      {
+        path: 'home',
+        name: 'home',
+        component: () => import('@/views/home/index'),
+        meta: { title: '课程中心', keepAlive: false }
+      },
+      {
+        path: 'test',
+        name: 'Test',
+        component: () => import('@/views/test/index'),
+        meta: { title: '评测中心', keepAlive: false }
+      },
+      {
+        path: 'eva',
+        name: 'eva',
+        component: () => import('@/views/eva/index'),
+        meta: { title: '学生评价', keepAlive: false }
+      }
+    ]
+  },
+  {
+    path: '/courseDetail',
+    component: () => import('@/views/courseDetail/index'),
+    meta: {
+      title: '课程详情',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/studentDetail',
+    component: () => import('@/views/eva/studentDetail'),
+    meta: {
+      title: '学生记录',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/searchstuDetail',
+    component: () => import('@/views/eva/searchstuDetail'),
+    meta: {
+      title: '学生记录2',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/studentEvaluate',
+    component: () => import('@/views/eva/studentEvaluate'),
+    meta: {
+      title: '学生评价',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/searchStudentEva',
+    component: () => import('@/views/eva/searchStudentEva'),
+    meta: {
+      title: '学生评价',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/testDetail',
+    component: () => import('@/views/testDetail/index'),
+    meta: {
+      title: '填写问卷',
+      keepAlive: false
+    }
+  },
+  {
+    path: '/cocoai',
+    component: () => import('@/views/aigpt/index'),
+    meta: {
+      title: 'CocoAI',
+      keepAlive: false
+    }
+  }
+]

src/views/eva/components/ImageComponent.vue

@@ -0,0 +1,216 @@
+<template>
+  <div class="imgBox">
+    <div @click="addImg($event)" class="imgItem">
+      <img src="@/assets/images/eva/camera.png" alt="" />
+      <input type="file" accept="image/*" style="display: none" @change="beforeUpload($event)" />
+    </div>
+
+    <!-- <div class="imgList"> -->
+    <div v-for="(item, index) in imgList" :key="index" class="imgItem">
+      <div class="itemImg" @click="previewImg(item)">
+        <img :src="item" alt="" />
+      </div>
+      <div class="deleteImg" @click="deleteItem(item)">
+        <img src="../../../assets/images/course/delete.png" alt="" />
+      </div>
+    </div>
+    <!-- </div> -->
+
+    <div v-if="proVisible" class="mask">
+      <div class="progressBox">
+        <div class="lbox"><img :src="require('../../../assets/images/loading.gif')" />上传中，请稍后</div>
+        <el-progress :text-inside="true" :stroke-width="20" :percentage="progress" style="width: 80%"></el-progress>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    imgList: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    }
+  },
+  data() {
+    return {
+      // imgList: []
+      proVisible: false,
+      progress: 0
+    }
+  },
+  methods: {
+    previewImg(url) {
+      this.$hevueImgPreview(url)
+    },
+    addImg(e) {
+      var el = e.currentTarget
+      el.getElementsByTagName('input')[0].click()
+      e.target.value = ''
+    },
+    deleteItem(i) {
+      const a = JSON.parse(JSON.stringify(this.imgList))
+      a.splice(a.indexOf(i), 1)
+      // this.imgList.splice(this.imgList.indexOf(i), 1)
+      this.$emit('update:imgList', a)
+      this.$forceUpdate()
+    },
+    beforeUpload(event) {
+      var file = event.target.files[0]
+      var credentials = {
+        accessKeyId: 'AKIATLPEDU37QV5CHLMH',
+        secretAccessKey: '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'
+      } // 秘钥形式的登录上传
+      window.AWS.config.update(credentials)
+      window.AWS.config.region = 'cn-northwest-1' // 设置区域
+      var bucket = new window.AWS.S3({ params: { Bucket: 'ccrb' } }) // 选择桶
+      var _this = this
+      _this.progress = 0
+      _this.proVisible = true
+      if (file) {
+        var params = {
+          Key:
+            file.name.split('.')[0] +
+            new Date().getTime() +
+            '.' +
+            file.name.split('.')[file.name.split('.').length - 1],
+          ContentType: file.type,
+          Body: file,
+          'Access-Control-Allow-Credentials': '*',
+          ACL: 'public-read'
+        } // key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
+        var options = {
+          partSize: 2048 * 1024 * 1024,
+          queueSize: 2,
+          leavePartsOnError: true
+        }
+        bucket
+          .upload(params, options)
+          .on('httpUploadProgress', function(evt) {
+            // 这里可以写进度条
+            _this.progress = parseInt((evt.loaded * 80) / evt.total)
+          })
+          .send(function(err, data) {
+            _this.progress = 100
+            _this.mediaLoading = false
+            setTimeout(() => {
+              _this.proVisible = false
+            }, 1000)
+            if (err) {
+              // _this.$message.error('上传失败')
+            } else {
+              _this.$toast({
+                message: '上传成功',
+                type: 'success'
+              })
+              // console.log(_this.imgList)
+              const a = JSON.parse(JSON.stringify(_this.imgList))
+              a.push(data.Location)
+              // console.log('aaaaaaaaaaaaaaaaa', a)
+              _this.$emit('update:imgList', a)
+
+              // _this.getImage(_this.imgList)
+            }
+          })
+      }
+    },
+    getImage(imageList) {
+      console.log('e', imageList)
+
+      this.$emit('getImage', imageList)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.imgBox {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  .imgItem {
+    position: relative;
+    width: 74px;
+    height: 66px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 10px 0;
+    margin-right: 10px;
+
+    border: 1px solid rgba(217, 217, 217, 1);
+
+    .itemImg {
+      height: 100%;
+
+      // height: 66px;
+      z-index: 1;
+      > img {
+        width: 100%;
+        height: 100%;
+        border-radius: 5px;
+        // object-fit: cover;
+      }
+    }
+    .deleteImg {
+      width: 20px;
+      height: 20px;
+      position: absolute;
+      right: 0;
+      top: 0;
+      z-index: 9;
+      > img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  // }
+
+  .mask {
+    background-color: rgba(0, 0, 0, 0);
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 20000;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  .progressBox {
+    width: 85%;
+    max-width: 300px;
+    height: 100px;
+    background: #fff;
+    border-radius: 10px;
+    box-shadow: 0 0 6px 1px #bfbfbf;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+  }
+  .progressBox .lbox {
+    height: 50px;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+  }
+
+  .progressBox .lbox img {
+    width: 25x;
+    margin-right: 10px;
+  }
+
+  /deep/ .progressBox {
+    .el-progress-bar__outer {
+      background-color: #d1dfff !important;
+      height: 20px !important;
+    }
+  }
+}
+</style>

src/views/eva/components/bar.vue

@@ -0,0 +1,67 @@
+<template>
+  <!-- 导航条 -->
+  <div class="bar" :style="{ background: num ? '#005CCD' : '#f9f9f9', color: num ? '#fff' : 'rgba(0, 0, 0, 0.90)' }">
+    <van-icon @click="back" name="arrow-left" />
+    <div>
+      {{ tit }}
+    </div>
+    <div>
+      <div style="font-size: 14px;" v-if="num">
+        <slot name="btn"></slot>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    tit: {
+      type: String,
+      default: ''
+    },
+    num: {
+      type: Number,
+      default: 0
+    },
+    backPage: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {
+      barBackColor: 'barBackColor'
+    }
+  },
+  methods: {
+    back() {
+      if (this.backPage) {
+        this.$router.push('/eva')
+      } else {
+        this.$router.go(-1)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.bar {
+  width: 100%;
+  height: 50px;
+  z-index: 10;
+  font-weight: 550;
+  // background-color: #f9f9f9;
+  display: flex;
+  box-sizing: border-box;
+  padding: 0 10px;
+  // justify-content: center;
+  justify-content: space-between;
+  align-items: center;
+  position: fixed;
+  top: 0;
+  left: 0;
+  font-size: 17px;
+}
+</style>

src/views/eva/components/classList.vue

@@ -0,0 +1,117 @@
+<template>
+  <div class="classList">
+    <!-- 班级名称开始 -->
+    <div class="classListTop" @click="spread(claName.id)">
+      <div class="claTit">
+        <!-- <van-icon size="14px" v-if="claName.count" :name="ico ? 'arrow-left' : 'arrow-down'" /> -->
+        <!-- <img v-if="ico" src="../../../assets/images/eva/up.png" />
+        <img v-else src="../../../assets/images/eva/down (2).png" /> -->
+
+        <!-- <van-icon size="18px" top="2px" style="margin-right:10px" name="friends" /> -->
+        {{ claName.name }}
+        <div style="margin-left:10px">({{ claName.count }})</div>
+      </div>
+      <!-- <div class="moreIcon">
+        <van-icon size="14px" v-if="claName.count" :name="ico ? 'arrow-left' : 'arrow-down'" />
+      </div> -->
+    </div>
+    <!-- 班级名称结束 -->
+
+    <!-- 班级同学列表 -->
+    <!-- <div v-if="!ico"> -->
+    <div class="schoolmates" v-for="(i, index) in stuList" :key="index + 'a'" @click="gotoStudentDetail(i.id)">
+      <div class="schoolmateName">{{ i.name }}</div>
+    </div>
+    <!-- </div> -->
+    <!-- 班级同学列表 -->
+  </div>
+</template>
+
+<script>
+import { selectClassStudent } from '@/api/eva'
+
+export default {
+  props: {
+    claName: {
+      type: Object,
+      default() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      ico: 1,
+      stuList: [],
+      classId: ''
+    }
+  },
+  methods: {
+    // 班级折叠与展开
+    spread(e) {
+      console.log(e)
+      if (this.ico) {
+        selectClassStudent({ cid: e }).then(res => {
+          console.log('res', res)
+          this.stuList = res[0]
+        })
+      }
+      this.ico = !this.ico
+    },
+    // 跳转详情页
+    gotoStudentDetail(e) {
+      // return console.log(e);
+      localStorage.setItem('userId', e)
+      this.$router.push(`/studentDetail?uid=${e}&cid=${this.claName.id}&cName=${this.claName.name}`)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.classList {
+  box-sizing: border-box;
+  // 班级名称
+  .classListTop {
+    width: 100%;
+    height: 40px;
+    display: flex;
+    box-sizing: border-box;
+    justify-content: space-between;
+    padding: 0 10px;
+    align-items: center;
+
+    .claTit {
+      font-size: 14px;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      img {
+        width: 15px;
+        margin-right: 5px;
+      }
+    }
+    .moreIcon {
+      width: 40px;
+      text-align: center;
+    }
+  }
+
+  // 同学列表
+  .schoolmates {
+    // width: 100%;
+    height: 45px;
+    background-color: #f7f7f7;
+    display: flex;
+    // justify-content: space-between;
+    // align-items: center;
+    // box-sizing: border-box;
+    // padding: 0 38px;
+
+    .schoolmateName {
+      font-size: 14px;
+      display: flex;
+    }
+  }
+}
+</style>

src/views/eva/components/pop.vue

@@ -0,0 +1,74 @@
+<template>
+  <div class="pop">
+    <div
+      style="width: 100%;height: 100vh;background-color: rgba(0,0,0,0.76);position: fixed;z-index: 11; left: 0;top: 0;"
+    >
+      <div class="mask">
+        <div class="maskTit">
+          <slot name="tit"></slot>
+        </div>
+        <div class="maskCon">
+          <slot name="con"></slot>
+        </div>
+        <div class="maskBtn">
+          <slot name="btn1"></slot>
+          <slot name="btn2"></slot>
+
+          <!-- <div class="btn" style="color: rgba(136,136,136,1);" @click="isShowMask = false">取消</div> -->
+          <!-- <div class="btn" style="color: rgba(251,67,25,1);">确认</div> -->
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.mask {
+  position: absolute;
+  top: 45%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 80%;
+  height: 170px;
+  border-radius: 8px;
+  background-color: rgba(255, 255, 255, 1);
+  color: rgba(16, 16, 16, 1);
+  font-size: 14px;
+  text-align: center;
+  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
+  font-family: Roboto;
+  display: flex;
+  flex-direction: column;
+  .maskTit {
+    flex: 0.5;
+    display: flex;
+    align-items: flex-end;
+    font-weight: bold;
+    font-size: 18px;
+  }
+  .maskCon {
+    flex: 0.6;
+    display: flex;
+    align-items: center;
+  }
+  .maskBtn {
+    width: 100%;
+    height: 50px;
+    display: flex;
+    .btn {
+      width: 50%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+  }
+}
+</style>

src/views/eva/components/radioSelect.vue

@@ -0,0 +1,155 @@
+<template>
+  <div class="selcts" @click.stop="icoIsShow">
+    <!-- <div class="backPage" v-if="!ico" @click="fuClick1"></div> -->
+    <div style="flex: 1;">
+      <div v-if="!choose.length" style="color: rgba(0, 0, 0, 0.40);">{{ tit }}</div>
+      <div class="choosePerCon">
+        <div v-for="(i, index) in listCont" :key="index + 'p'">
+          <div v-if="i.id === choose[0]" class="choosePerTxt">
+            {{ i.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="ico">
+      <van-icon size="14px" :name="ico ? 'arrow-left' : 'arrow-down'" />
+    </div>
+
+    <div class="list" v-if="!ico">
+      <div class="ol" v-for="(i, index) in listCont" :key="index + 'w'" @click="cho(i)">
+        <div>
+          {{ i.name }}
+        </div>
+        <div>
+          <img :style="{ display: choose.includes(i.id) ? '' : 'none' }" src="@/assets/images/eva/dui.png" alt="" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    tit: {
+      type: String,
+      default: ''
+    },
+    listCont: {
+      type: Array,
+      default: () => []
+    },
+    choose: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      ico: 1,
+      txtColor: 'txtColor'
+    }
+  },
+
+  methods: {
+    // 判断弹出选项列表
+    icoIsShow() {
+      this.ico = !this.ico
+    },
+    // 判断学生是否被选中
+    cho(e) {
+      this.choose[0] = e.id
+    },
+    // 删除学生
+    // delStu() {
+    //   this.choose = ''
+    // },
+
+    // 此方法在父元素中被调用
+    fuClick() {
+      this.ico = 'false'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.txtColor {
+  color: blue;
+}
+.backPage {
+  background-color: aquamarine;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  // z-index: 200;
+}
+.selcts {
+  position: relative;
+  display: flex;
+  box-sizing: border-box;
+  // padding: 0px 15px;
+  padding-right: 15px;
+  font-size: 12px;
+  .ico {
+    width: 10px;
+    position: absolute;
+    right: 10px;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+  .list {
+    position: absolute;
+    left: 0;
+    top: 100%;
+    max-height: 220px;
+    overflow-y: scroll;
+    background-color: #fff;
+    width: 100%;
+    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.1);
+    z-index: 10;
+    border-radius: 8px;
+    .ol {
+      height: 40px;
+      line-height: 40px;
+      width: 100%;
+      background-color: #fff;
+      box-sizing: border-box;
+      padding: 0px 10px;
+      display: flex;
+      justify-content: space-between;
+    }
+    // .ol:hover {
+    //   background-color: #f3f6f9;
+    // }
+  }
+  .choosePerCon {
+    height: 100%;
+    flex: 1;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    overflow-y: scroll;
+    .choosePerTxt {
+      height: 30px;
+      flex-shrink: 0;
+      background-color: #eef0f3;
+      margin: 2px 3px;
+      box-sizing: border-box;
+      padding: 0px 10px;
+      display: inline-flex;
+      align-items: center;
+      border-radius: 15px;
+      img {
+        flex-shrink: 0;
+        width: 13px;
+        // height: 15px;
+        margin-left: 5px;
+      }
+    }
+  }
+}
+</style>

src/views/eva/components/selectStyle.vue

@@ -0,0 +1,163 @@
+<template>
+  <div class="selcts" @click.stop="icoIsShow">
+    <!-- <div class="backPage" v-if="!ico" @click="fuClick1"></div> -->
+    <div style="flex: 1;">
+      <div v-if="!choose.length" style="color: rgba(0, 0, 0, 0.40);">{{ tit }}</div>
+      <div class="choosePerCon">
+        <div v-for="(i, index) in listCont" :key="index + 'p'">
+          <div v-if="i.id === choose[0]" class="choosePerTxt">
+            {{ i.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="ico">
+      <van-icon size="14px" :name="ico ? 'arrow-left' : 'arrow-down'" />
+    </div>
+
+    <div class="list" v-if="!ico">
+      <div class="ol" v-for="(i, index) in listCont" :key="index + 'w'" @click="cho(i)">
+        <div>
+          {{ i.name }}
+        </div>
+        <div>
+          <img :style="{ display: choose.includes(i.id) ? '' : 'none' }" src="@/assets/images/eva/dui.png" alt="" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    tit: {
+      type: String,
+      default: ''
+    },
+    listCont: {
+      type: Array,
+      default: () => []
+    },
+    choose: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      ico: 1,
+      txtColor: 'txtColor'
+    }
+  },
+
+  methods: {
+    // 判断弹出选项列表
+    icoIsShow() {
+      this.ico = !this.ico
+    },
+    // 判断学生是否被选中
+    cho(e) {
+      this.choose[0] = e.id
+      this.ico = 0
+      this.$emit('update-search', 'aaa')
+    },
+    // 删除学生
+    // delStu() {
+    //   this.choose = ''
+    // },
+
+    // 此方法在父元素中被调用
+    fuClick() {
+      // this.ico = 'false'
+      this.ico = !this.ico
+    }
+    // fuClick1() {
+    //   this.ico = !this.ico
+    // }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.txtColor {
+  color: blue;
+}
+.backPage {
+  background-color: aquamarine;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  // z-index: 200;
+}
+.selcts {
+  position: relative;
+  display: flex;
+  box-sizing: border-box;
+  padding-right: 15px;
+  font-size: 12px;
+  width: 120px;
+  .ico {
+    width: 10px;
+    position: absolute;
+    right: 10px;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+  .list {
+    position: absolute;
+    left: 0;
+    top: 100%;
+    max-height: 220px;
+    overflow-y: scroll;
+    background-color: #fff;
+    width: 100%;
+    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.1);
+    z-index: 10;
+    border-radius: 8px;
+    .ol {
+      height: 40px;
+      line-height: 40px;
+      width: 100%;
+      color: black;
+      // background-color: #fff;
+      box-sizing: border-box;
+      padding: 0px 10px;
+      display: flex;
+      justify-content: space-between;
+    }
+    // .ol:hover {
+    //   background-color: #f3f6f9;
+    // }
+  }
+  .choosePerCon {
+    height: 100%;
+    // flex: 1;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    overflow-y: scroll;
+    // width: 80px;
+    .choosePerTxt {
+      height: 30px;
+      flex-shrink: 0;
+      // background-color: #eef0f3;
+      margin: 2px 0px;
+      box-sizing: border-box;
+      // padding: 0px 10px;
+      display: inline-flex;
+      align-items: center;
+      border-radius: 15px;
+      img {
+        flex-shrink: 0;
+        width: 13px;
+        // height: 15px;
+        margin-left: 5px;
+      }
+    }
+  }
+}
+</style>

src/views/eva/components/selects.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="selcts" @click.stop="icoIsShow">
+    <!-- <div class="backPage" v-if="!ico" @click="fuClick1"></div> -->
+    <div style="flex: 1;">
+      <div style="color: rgba(0, 0, 0, 0.40);" v-if="!choosePer.length">
+        {{ tit }}
+      </div>
+      <div class="choosePerCon" v-if="choosePer.length">
+        <div v-for="(i, index) in listContent" :key="index + 'q'">
+          <div class="choosePerTxt" :style="{ display: choosePer.includes(i.id) ? '' : 'none' }">
+            {{ i.name }}
+            <img @click="delStu(i.id)" src="@/assets/images/eva/cha.png" alt="" />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="ico">
+      <van-icon size="14px" :name="ico ? 'arrow-left' : 'arrow-down'" />
+    </div>
+
+    <div class="list" v-if="!ico">
+      <div class="ol" v-for="(i, index) in listContent" :key="index + 'w'" @click.stop="choose(i)">
+        <div :style="{ color: choosePer.includes(i.id) ? 'blue' : '' }">
+          {{ i.name }}
+        </div>
+        <div>
+          <img :style="{ display: choosePer.includes(i.id) ? '' : 'none' }" src="@/assets/images/eva/dui.png" alt="" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    tit: {
+      type: String,
+      default: ''
+    },
+    listContent: {
+      type: Array,
+      default: () => []
+    },
+    choosePer: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      ico: 1,
+      txtColor: 'txtColor'
+    }
+  },
+  methods: {
+    // 判断弹出选项列表
+    icoIsShow() {
+      this.ico = !this.ico
+    },
+    // 判断学生是否被选中
+    choose(e) {
+      console.log(this.listContent)
+      console.log('判断学生是否被选中', e)
+      if (this.choosePer.includes(e.id)) return
+      this.choosePer.push(e.id)
+      // console.log(this.choosePer)
+    },
+    // 删除学生
+    delStu(e) {
+      console.log('删除学生', e)
+      console.log(this.choosePer)
+      const iii = this.choosePer.indexOf(e)
+      this.choosePer.splice(iii, 1)
+      //   console.log()
+    },
+
+    // 此方法在父元素中被调用
+    fuClick() {
+      // console.log(111)
+      // this.ico = !this.ico
+      this.ico = 'false'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.txtColor {
+  color: blue;
+}
+.backPage {
+  background-color: aquamarine;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+  // z-index: 200;
+}
+.selcts {
+  position: relative;
+  display: flex;
+  box-sizing: border-box;
+  // padding: 0px 15px;
+  padding-right: 15px;
+  font-size: 12px;
+  .ico {
+    width: 10px;
+    position: absolute;
+    right: 10px;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+  .list {
+    position: absolute;
+    left: 0;
+    top: 100%;
+    max-height: 220px;
+    overflow-y: scroll;
+    background-color: #fff;
+    width: 100%;
+    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.1);
+    z-index: 10;
+    border-radius: 8px;
+    .ol {
+      height: 40px;
+      line-height: 40px;
+      width: 100%;
+      background-color: #fff;
+      box-sizing: border-box;
+      padding: 0px 10px;
+      display: flex;
+      justify-content: space-between;
+    }
+    // .ol:hover {
+    //   background-color: #f3f6f9;
+    // }
+  }
+  .choosePerCon {
+    height: 100%;
+    flex: 1;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    overflow-y: scroll;
+    .choosePerTxt {
+      height: 30px;
+
+      flex-shrink: 0;
+      background-color: #eef0f3;
+      margin: 2px 3px;
+      box-sizing: border-box;
+      padding: 0px 10px;
+      display: inline-flex;
+      align-items: center;
+      border-radius: 15px;
+      img {
+        flex-shrink: 0;
+        width: 13px;
+        // height: 15px;
+        margin-left: 5px;
+      }
+    }
+  }
+}
+</style>

src/views/eva/index.vue

@@ -1,11 +1,208 @@
 <template>
+  <!-- 学生评价 -->
   <div>
-    学生评价
+    <!-- 搜索框开始 -->
+    <div class="search">
+      <van-search v-model.trim="userName" placeholder="学生姓名" />
+    </div>
+    <div style="height: 54px;width: 100%;"></div>
+
+    <!-- 模糊搜索页面 -->
+    <div class="searchPage" v-if="searchList.length">
+      <!-- <selects :listContent="classLists" :tit="'请选择班级'"></selects> -->
+      <div class="students">
+        <div class="stuBlock" v-for="(i, index) in searchList" :key="index + 'p'" @click="gotoStudentDetail2(i)">
+          {{ i.username }}
+        </div>
+      </div>
+    </div>
+
+    <div>
+      <van-tabs @change="ggg" v-if="!searchList.length" swipeable @click="spread">
+        <van-tab v-for="(e, index) in classLists" :key="index + 't'" :name="e.id" :title="e.name">
+          <!-- <classList :claName="i"></classList> -->
+          <div class="students">
+            <div class="stuBlock" v-for="(i, index) in stuList" :key="index + 'p'" @click="gotoStudentDetail(i.id, e)">
+              {{ i.name }}
+            </div>
+          </div>
+        </van-tab>
+      </van-tabs>
+    </div>
   </div>
 </template>
 
 <script>
-export default {}
+import { selectClassStudent } from '@/api/eva'
+import { selectSerStudent } from '@/api/eva'
+import { select_techerAllClass } from '@/api/eva'
+// import classList from './components/classList.vue'
+// 多选框组件
+// import selects from './components/selects.vue'
+
+export default {
+  // components: { selects },
+  data() {
+    return {
+      // 搜索栏数据
+      userName: '',
+      // 班级名称数组
+      classLists: [],
+
+      // 班级学生数组
+      stuList: [],
+      // 搜索结果数组
+      searchList: []
+    }
+  },
+  mounted() {
+    // this.$nextTick(() => {
+    //   this.$refs.myButton.click()
+    // })
+  },
+  watch: {
+    userName(val) {
+      console.log(val)
+      if (val !== '') {
+        this.likeSearch(val)
+      } else {
+        this.searchList = []
+      }
+    }
+  },
+  methods: {
+    likeSearch(e) {
+      console.log(e)
+      const data = {
+        id: this.$store.state.user.userinfo.organizeid,
+        txt: e
+      }
+      selectSerStudent(data).then(res => {
+        console.log('res', res)
+        this.searchList = res[0]
+        if (!res[0].length) {
+          this.searchList = [{ username: '展示没有您想要查询的学生' }]
+        }
+      })
+    },
+    // 切换导航栏获取数据
+    ggg(e) {
+      // console.log('ggg', e, i)
+      // this.claName.id = e
+      selectClassStudent({ cid: e }).then(res => {
+        console.log('res', res)
+        this.stuList = res[0]
+      })
+    },
+    // 班级入口跳转详情页
+    gotoStudentDetail(e, i) {
+      // e学生id，i班级id
+      // return console.log(e, i)
+      localStorage.setItem('userId', e)
+      this.$router.push(`/studentDetail?cid=${i.id}&cName=${i.name}`)
+      // this.$router.push('/studentDetail')
+    },
+    // 搜索按钮跳转详情页
+    gotoStudentDetail2(i) {
+      localStorage.setItem('userId', i.userid)
+      this.$router.push('/searchstuDetail')
+    },
+    spread(name, tit) {
+      // console.log(5555);
+      // return console.log('spread', name)
+      // selectClassStudent({ cid: name }).then(res => {
+      //   console.log('res', res)
+      //   this.stuList = res[0]
+      // })
+    },
+    // 获取老师所管理班级
+    getData() {
+      const id = this.$store.state.user.userinfo.organizeid
+      select_techerAllClass({ cid: id }).then(res => {
+        console.log('获取老师所管理班级学生', res)
+        this.classLists = res[0]
+        // 调用一次，将导航栏数据展示出来
+        this.ggg(this.classLists[0].id)
+      })
+    }
+  },
+  created() {
+    this.getData()
+    console.log('state', this.$store.state)
+  }
+}
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+/deep/ .van-tab {
+  width: 100px;
+  text-align: center;
+}
+/deep/ .van-tabs__line {
+  width: 90px;
+  height: 2px;
+  flex-shrink: 0;
+  background: #4a8efc;
+}
+/deep/ .van-tab__pane {
+  min-height: 300px;
+}
+.searchPage {
+  width: 100%;
+  box-sizing: border-box;
+  margin-top: 20px;
+  min-height: 300px;
+}
+
+.search {
+  position: fixed;
+  top: 0;
+  width: 100%;
+  // height: 54px;
+}
+.students {
+  width: 85%;
+  display: flex;
+  // justify-content: space-between;
+  flex-wrap: wrap;
+  margin: 10px;
+  .stuBlock {
+    margin-top: 10px;
+    margin-right: 15px;
+    display: flex;
+    box-sizing: border-box;
+    padding: 4px 18px;
+    justify-content: center;
+    align-items: center;
+    border-radius: 8px;
+    background: #f6fafb;
+    color: rgba(0, 0, 0, 0.9);
+    font-family: Microsoft YaHei;
+    font-size: 14px;
+    font-style: normal;
+  }
+}
+
+// 搜索框开始
+.searchBlock {
+  width: 100%;
+  height: 45px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba(232, 232, 235, 1);
+
+  // 搜索框结束
+}
+.claTit {
+  margin-top: 20px;
+  margin-left: 10px;
+  width: 130px;
+  height: 30px;
+  line-height: 20px;
+  color: rgba(16, 16, 16, 1);
+  font-size: 14px;
+  text-align: left;
+  font-family: PingFangSC-regular;
+}
+</style>

src/views/eva/searchStudentEva.vue

@@ -0,0 +1,747 @@
+<template>
+  <!-- 学生评价 -->
+  <div class="studentEvaluate" @click="col">
+    <bar :tit="'学生评价'" :num="1">
+      <template v-slot:btn>
+        <div v-if="!shareShow" @click="save">保存</div>
+        <div v-else @click="amend">修改</div>
+      </template>
+    </bar>
+
+    <div style="height: 50px;z-index: 30;overflow: hidden;"></div>
+
+    <!-- <div class="bigBlock"> -->
+    <div class="bigBlock" style="">
+      <div class="claName">
+        <div class="tit">学生</div>
+        <div class="studentName">{{ studentInfo.name }}</div>
+      </div>
+      <div class="claName">
+        <div class="tit">班级</div>
+        <div class="studentName">{{ studentInfo.cname }}</div>
+      </div>
+
+      <div class="claName">
+        <!-- <div class="relevanceStudent"> -->
+        <div class="tit">关联</div>
+        <div class="studentName">
+          <selects ref="StuSel" :listContent="studentList" :tit="'请选择关联学生'" :choosePer="selectSData"></selects>
+        </div>
+        <!-- </div> -->
+      </div>
+      <div class="claName">
+        <div class="tit">学期</div>
+        <div class="studentName" style="position: relative;">
+          <radioSelect ref="claSel" :listCont="termList" :tit="'请选择学期'" :choose="termData"></radioSelect>
+          <div v-show="term" style="position: absolute;bottom: -100%; color: red;font-size: 10px;">请选择学期</div>
+        </div>
+      </div>
+      <div v-show="term" style="height: 10px;"></div>
+
+      <div class="claName">
+        <div class="tit">纬度</div>
+        <div class="studentName" style="position: relative;">
+          <selects ref="WeiSel" :listContent="weiList" :tit="'请选择评价纬度'" :choosePer="selectWData"></selects>
+          <div v-show="wei" style="position: absolute;bottom: -100%; color: red;font-size: 10px;">请选择评价纬度</div>
+        </div>
+      </div>
+      <div v-show="wei" style="height: 10px;"></div>
+
+      <div class="claName" style="position: relative;">
+        <div class="tit">时间</div>
+
+        <div class="studentName2">
+          <van-field
+            class="xx"
+            clickable
+            name="datetimePicker"
+            label=""
+            placeholder="请选择时间"
+            @click="choseTime"
+            input-align="left"
+            :value="visitTime"
+            :rules="[{ required: true, message: '' }]"
+            readonly
+          >
+          </van-field>
+          <van-popup v-model="showPicker" position="bottom">
+            <van-datetime-picker
+              @cancel="cancel"
+              @confirm="onConfirm"
+              v-model="currentDate"
+              type="datetime"
+              :min-date="minDate"
+              :max-date="maxDate"
+            />
+          </van-popup>
+        </div>
+        <img class="rl" src="../../assets/images/eva/rl.png" alt="" />
+        <div
+          v-show="tim"
+          style="position: absolute;bottom: 0%;transform: translate(0,100%); left: 40px; color: red;font-size: 10px;"
+        >
+          请设置时间
+        </div>
+      </div>
+      <div v-show="tim" style="height: 10px;"></div>
+
+      <div class="claName">
+        <div class="tit">地点</div>
+        <div class="inpBlock studentName">
+          <input type="text" v-model="place" class="inp" placeholder="请输入" />
+        </div>
+      </div>
+      <div class="claName">
+        <div style="width: 70px;">观察内容</div>
+        <div class="inpBlock studentName">
+          <input type="text" v-model="observeCon" class="inp" placeholder="请输入" />
+        </div>
+      </div>
+      <div class="claName">
+        观察记录
+      </div>
+      <div class="EvaluateTxt">
+        <textarea name="" id="" style="width: 100%;height: 100%;border: none;" v-model="recordCon"></textarea>
+      </div>
+
+      <!-- 上传图片开始 -->
+      <div class="uploadImgTit">
+        <div>图片上传</div>
+        <div>{{ imgList.length }}/10</div>
+      </div>
+      <div class="uploadImg">
+        <image-component @getImage="getImage" :imgList.sync="imgList"></image-component>
+      </div>
+      <!-- 上传图片结束 -->
+    </div>
+    <!-- </div> -->
+    <!-- 按钮 -->
+    <div class="submitBtn">
+      <!-- <div class="btn" @click="isShowMask = true">删除</div> -->
+      <div class="btn" @click="isShowMask = true">重复添加</div>
+      <div class="btn">添加新记录</div>
+      <div class="btn" v-if="!shareShow" @click="save">保存并返回</div>
+      <div class="btn" v-else @click="amend">修改并返回</div>
+    </div>
+
+    <pop v-show="isShowMask">
+      <template v-slot:tit>确定</template>
+      <template v-slot:con>确定{{ shareShow ? '修改' : '保存' }}吗</template>
+      <template v-slot:btn1>
+        <div class="btn" style="color: rgba(136,136,136,1);" @click="isShowMask = false">取消</div>
+      </template>
+      <template v-slot:btn2>
+        <div class="btn" v-if="!shareShow" style="color: rgba(251,67,25,1);" @click="uploadRecord">确认</div>
+        <div class="btn" v-else style="color: rgba(251,67,25,1);" @click="updateRecord">确认</div>
+      </template>
+    </pop>
+  </div>
+</template>
+
+<script>
+// 导航栏组件
+import bar from './components/bar.vue'
+// 多选框组件
+import selects from './components/selects.vue'
+// 单选
+import radioSelect from './components/radioSelect.vue'
+
+// 上传图片组件
+import imageComponent from './components/ImageComponent.vue'
+// 弹窗组件
+import pop from './components/pop.vue'
+
+import { insertRecord } from '@/api/eva'
+import { selectManyClassStudent } from '@/api/eva'
+import { selectVeiDoo } from '@/api/eva'
+import { selectRecordDetail } from '@/api/eva'
+import { updateRecordData } from '@/api/eva'
+import { selectTerm } from '@/api/eva'
+import { selectStudentDetail } from '@/api/eva'
+
+import '@/utils/aws-sdk-2.235.1.min.js'
+
+export default {
+  components: {
+    bar,
+    selects,
+    imageComponent,
+    pop,
+    radioSelect
+  },
+
+  data() {
+    return {
+      studentInfo: {},
+      // 学生信息
+      stuName: {},
+      // 关联选项
+      studentList: [],
+      // 纬度选项
+      weiList: [],
+      termList: [],
+      // 所选数据
+      // 学生
+      selectSData: [],
+      // 纬度
+      selectWData: [],
+      // 学期
+      termData: [],
+      // 格式化后记录时间
+      visitTime: '',
+      // 地点
+      place: '',
+      // 观察内容
+      observeCon: '',
+      // 观察记录
+      recordCon: '',
+      // 图片列表
+      imgList: [],
+
+      isShowMask: false, // 控制删除弹框的显示与隐藏
+      isShowMask2: false, // 控制保存弹框的显示与隐藏
+      // 是否显示分享和继续记录按钮
+      shareShow: 0,
+      // 未格式化的时间
+      currentDate: new Date(),
+      // 时间弹出框
+      showPicker: false,
+      minDate: '',
+      maxDate: '',
+
+      wei: false,
+      tim: false,
+      term: false
+    }
+  },
+
+  methods: {
+    getData() {
+      // 获取学生信息
+      const stuData = {
+        uid: localStorage.getItem('userId')
+      }
+
+      selectStudentDetail(stuData).then(res => {
+        this.studentInfo = res[0][0]
+        console.log('获取学生信息', this.studentInfo)
+
+        // 获取班学生列表
+        const data2 = {
+          cid: this.studentInfo.classid,
+          uid: localStorage.getItem('userId')
+        }
+        console.log('获取班学生列表', data2)
+        selectManyClassStudent(data2).then(res => {
+          res[0].forEach(e => {
+            if (e.id === this.$route.query.uid) {
+              this.stuName = e
+            } else {
+              this.studentList.push(e)
+            }
+          })
+          console.log('this.studentList', this.studentList)
+        })
+      })
+      // 获取纬度筛选框
+      const data = {
+        oid: this.$store.state.user.userinfo.organizeid,
+        cla: 0
+      }
+      selectVeiDoo(data).then(res => {
+        this.weiList = res[0]
+        console.log('this.weiList', this.weiList)
+      })
+
+      // 获取学期筛选框
+      selectTerm().then(res => {
+        console.log('获取学期筛选框', res)
+        res[0].forEach(e => {
+          //   console.log(e)
+          if (e.defaultC === 1) {
+            this.termData.push(e.id)
+          }
+        })
+        // console.log('this.termData', this.termData)
+        this.termList = res[0]
+        // console.log('this.termList', this.termList)
+      })
+    },
+    // 调用子元素selects中的方法隐藏选项列表
+    col() {
+      this.$refs.StuSel.fuClick()
+      this.$refs.WeiSel.fuClick()
+      this.$refs.claSel.fuClick()
+    },
+    // 选择照片
+    getImage(imgList) {
+      // console.log('哒哒哒啊啊的', imgList)
+
+      this.imgList = imgList
+      this.$forceUpdate()
+    },
+    save() {
+      // console.log(this.$store.state);
+      if (this.termData[0] === '') {
+        return (this.term = true)
+      }
+      if (this.selectWData.length === 0) {
+        return (this.wei = true)
+      }
+      if (this.visitTime === '') {
+        return (this.tim = true)
+      }
+
+      this.isShowMask = true
+    },
+    amend() {
+      // console.log(this.$store.state);
+      if (this.termData === '') {
+        this.term = true
+      }
+      if (this.selectWData.length === 0) {
+        this.wei = true
+      }
+      if (this.visitTime === '') {
+        return (this.tim = true)
+      }
+
+      this.isShowMask = true
+    },
+    // 上传评价
+    uploadRecord() {
+      const data = [
+        {
+          uid: localStorage.getItem('userId'),
+          tid: this.$store.state.user.userinfo.userid,
+          contact: this.selectSData.join(','),
+          type: this.selectWData.join(','),
+          timing: this.visitTime,
+          place: this.place,
+          observeCon: this.observeCon,
+          recordCon: this.recordCon,
+          imgList: this.imgList.join(','),
+          term: this.termData[0]
+        }
+      ]
+      this.isShowMask = false
+
+      // return console.log(data)
+
+      insertRecord(data).then(res => {
+        console.log(res)
+        if (res === 1) {
+          this.$toast({
+            message: '保存成功',
+            type: 'success'
+          })
+          setTimeout(() => {
+            if (this.$route.query.ser || 0) {
+              this.$router.replace(`/searchstuDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            } else {
+              this.$router.replace(`/studentDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            }
+          }, 1000)
+        }
+      })
+      // console.log('上传评价', data)
+    },
+    // 修改评价
+    updateRecord() {
+      const data = [
+        {
+          rid: this.$route.query.rid,
+          tid: this.$store.state.user.userinfo.userid,
+          contact: this.selectSData.join(','),
+          type: this.selectWData.join(','),
+          timing: this.visitTime,
+          place: this.place,
+          observeCon: this.observeCon,
+          recordCon: this.recordCon,
+          imgList: this.imgList.join(','),
+          term: this.termData[0]
+        }
+      ]
+      updateRecordData(data).then(res => {
+        console.log(res)
+        if (res === 1) {
+          this.$toast({
+            message: '修改成功',
+            type: 'success'
+          })
+          setTimeout(() => {
+            if (this.$route.query.ser || 0) {
+              this.$router.replace(`/searchstuDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            } else {
+              this.$router.replace(`/studentDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            }
+          }, 1000)
+        }
+      })
+    },
+    // 填写页面数据
+    getRecord() {
+      const data = {
+        id: this.$route.query.rid
+      }
+      console.log('getRecord', this.$route.query.rid)
+      selectRecordDetail(data).then(res => {
+        console.log('获取单个学生记录详情', res[0][0])
+        const allData = res[0][0]
+        if (allData.recordImg !== '' && !allData.contact) {
+          this.selectSData = allData.contact.split(',')
+        }
+        this.selectWData = allData.type.split(',')
+        this.visitTime = allData.recordDate
+        this.place = allData.place
+        this.recordCon = allData.recordCon
+        this.observeCon = allData.recordTit
+        this.recordCon = allData.recordContent
+        if (allData.recordImg !== '' && !allData.recordImg) {
+          this.imgList = allData.recordImg.split(',')
+        }
+        this.termData = [allData.term]
+        // console.log('selectWData', this.selectWData)
+      })
+    },
+
+    onConfirm() {
+      this.showPicker = false
+
+      // this.currentDate是选中的时间，赋值给date
+      var date = this.currentDate
+      var seperator1 = '-'
+      var seperator2 = ':'
+      var month = date.getMonth() + 1
+      var strDate = date.getDate()
+      if (month >= 1 && month <= 9) {
+        month = '0' + month
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = '0' + strDate
+      }
+      var h = date
+        .getHours()
+        .toString()
+        .padStart(2, '0')
+      var m = date
+        .getMinutes()
+        .toString()
+        .padStart(2, '0')
+
+      this.currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + ' ' + h + seperator2 + m
+
+      // 把格式化后的日期赋值给visitTime，就会显示到页面
+      this.visitTime = this.currentdate
+    },
+    cancel() {
+      this.showPicker = false
+      this.currentDate = new Date()
+    },
+    choseTime() {
+      this.showPicker = true
+      // 日期选择的最小日期
+      this.minDate = new Date(2020, 0, 1)
+      // 日期选择的最大日期
+      this.maxDate = new Date(2099, 11, 1)
+    }
+  },
+  watch: {
+    selectWData(val) {
+      // console.log('val', val)
+      if (val.length === 0) {
+        this.wei = true
+      } else {
+        this.wei = false
+      }
+    },
+    termData(val) {
+      if (val === '') {
+        this.term = true
+      } else {
+        this.term = false
+      }
+    },
+    visitTime(val) {
+      console.log('val', val)
+      if (val === '') {
+        this.tim = true
+      } else {
+        this.tim = false
+      }
+    }
+  },
+
+  created() {
+    // 是否显示分享和继续记录按钮。添加按钮进来不显示
+    this.shareShow = this.$route.query.shareShow * 1
+    console.log(this.shareShow)
+    if (this.$route.query.shareShow * 1 === 1) {
+      // console.log('aaaaaaaaaaaaaaaaaaaaa')
+      this.getRecord()
+    }
+    this.getData()
+    // console.log(this.$route.query)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.studentEvaluate {
+  font-size: 14px;
+  z-index: 1;
+  // min-height: 100vh;
+  background-image: linear-gradient(to bottom, #005ccd 1%, #005ccd 12%, #f6f5f8 35%, #f6f5f8 100%);
+  .rl {
+    position: absolute;
+    top: 50%;
+    transform: translate(0, -50%);
+    right: 0px;
+    width: 25px;
+    height: 25px;
+  }
+  .bigBlock {
+    width: 90%;
+    margin: 0 auto;
+    margin-top: 10px;
+    background-color: #fff;
+    border-radius: 15px;
+    position: relative;
+    z-index: 1;
+    // scroll-behavior: auto;
+    overflow-y: scroll;
+    box-sizing: border-box;
+    padding: 10px;
+  }
+  // 弹窗样式
+  .mask {
+    position: absolute;
+    top: 45%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 80%;
+    height: 169.42px;
+    border-radius: 8px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: center;
+    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
+    font-family: Roboto;
+    display: flex;
+    flex-direction: column;
+    .maskTit {
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+    .maskCon {
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+    .maskBtn {
+      width: 100%;
+      height: 50px;
+      display: flex;
+      .btn {
+        width: 50%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+  .claName {
+    width: 100%;
+    min-height: 40px;
+    margin: 7px auto;
+    color: #101010;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .tit {
+      width: 40px;
+      min-height: 40px;
+      display: flex;
+      align-items: center;
+    }
+    .studentName {
+      flex: 1;
+      width: 100%;
+      min-height: 40px;
+      line-height: 40px;
+      // display: flex;
+      // align-items: center;
+      border-bottom: 1px solid #e7e7e7;
+    }
+    .studentName2 {
+      flex: 1;
+      width: 100%;
+      min-height: 40px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid #e7e7e7;
+    }
+    /deep/ .van-cell {
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      border: none;
+      flex: 1;
+    }
+    .shareBtn {
+      width: 80px;
+      height: 30px;
+      line-height: 30px;
+      border-radius: 4px;
+      background-color: rgba(164, 173, 179, 1);
+      color: rgba(255, 255, 255, 1);
+      font-size: 14px;
+      text-align: center;
+      font-family: Microsoft Yahei;
+    }
+    .inpBlock {
+      // border: 1px solid rgba(187, 187, 187, 1);
+      height: 100%;
+      flex: 1;
+      .inp {
+        box-sizing: border-box;
+        height: 100%;
+        border: none;
+        margin: 0;
+        padding: 0 5px;
+        outline: none;
+        width: 100%;
+      }
+    }
+  }
+  .student {
+    height: 30px;
+    line-height: 30px;
+    display: flex;
+    justify-content: space-between;
+    .studentName {
+      width: 35%;
+      flex-shrink: 0;
+      color: rgba(0, 0, 0, 0.9);
+      font-family: Microsoft YaHei;
+      font-size: 28px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 40px; /* 142.857% */
+      border-bottom: 1px solid #e7e7e7;
+    }
+    .relevanceStudent {
+      flex: 1;
+      display: flex;
+      .relevanceName {
+        width: 70px;
+      }
+    }
+  }
+  //   观察记录
+  .EvaluateTxt {
+    box-sizing: border-box;
+    padding: 10px;
+    height: 137px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    font-family: Roboto;
+    border-radius: 10px;
+    border: 1px solid #dcdcdc;
+  }
+  //   上传图片
+  .uploadImgTit {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    box-sizing: border-box;
+    align-items: center;
+    padding: 15px 0px;
+    padding-bottom: 0;
+    color: rgba(0, 0, 0, 0.7);
+    font-family: Microsoft YaHei;
+  }
+  .uploadImg {
+    width: 100%;
+    // border-bottom: 1px solid rgba(245, 245, 245, 1);
+    .imgCon {
+      margin: 10px 0px;
+      margin-right: 3%;
+      width: 74.46px;
+      height: 66.13px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: 3px;
+      background-color: rgba(255, 255, 255, 1);
+      color: rgba(16, 16, 16, 1);
+      font-size: 14px;
+      text-align: center;
+      font-family: Roboto;
+      border: 2px solid rgba(242, 241, 242, 1);
+    }
+  }
+
+  //   按钮
+  .submitBtn {
+    width: 100%;
+    height: 70px;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0px 20px;
+    .btn {
+      display: inline-flex;
+      padding: 4px 5px;
+      margin-left: 5px;
+      border-radius: 6px;
+      background: #0061ff;
+      color: rgba(255, 255, 255, 1);
+    }
+  }
+  //继续记录
+  .continueXie {
+    width: 345px;
+    height: 47px;
+    line-height: 47px;
+    border-radius: 4px;
+    background-color: rgba(164, 173, 179, 1);
+    color: rgba(255, 255, 255, 1);
+    font-size: 14px;
+    text-align: center;
+    font-family: Microsoft Yahei;
+  }
+  .recordTime {
+    display: flex;
+    height: 30px;
+    align-items: center;
+    /deep/ .van-cell {
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      align-items: center;
+      border: none;
+      // width: 200px;
+      flex: 1;
+      // background-color: aqua;
+    }
+    /deep/.van-field__label {
+      width: 32px;
+    }
+    .tit {
+      width: 43.2px;
+    }
+    .cell {
+      flex: 1;
+      height: 30px;
+      border: 1px solid rgba(187, 187, 187, 1);
+    }
+  }
+}
+</style>

src/views/eva/searchstuDetail.vue

@@ -0,0 +1,579 @@
+<template>
+  <!-- 学生详情 -->
+  <div class="studentDetail">
+    <bar :tit="'学生记录'" :backPage="1"></bar>
+    <div style="height: 50px;"></div>
+    <!-- 顶部学生信息开始 -->
+    <div class="top">
+      <div class="UserInfo" style="flex: 1;">
+        <div class="sInfo">
+          <div class="userName">{{ studentInfo.name }}</div>
+          <div class="cla">{{ studentInfo.cname }}</div>
+        </div>
+        <selectStyle
+          ref="claSel"
+          @update-search="handleUpdateSearch"
+          :listCont="termList"
+          :tit="'请选择学期'"
+          :choose="termData"
+        ></selectStyle>
+
+        <div class="dataNum">本学期共计{{ TermRecord.length }} 条记录</div>
+      </div>
+
+      <div class="rig">
+        <div class="topBtnS">
+          <div></div>
+          <div></div>
+        </div>
+      </div>
+    </div>
+    <!-- 顶部学生信息结束 -->
+
+    <!-- 观察记录开始 -->
+    <div style="position: relative;top: -15px;">
+      <div class="observe_tit">
+        <div class="left">
+          <img class="img" src="../../assets/images/eva/Frame (4).png" alt="" />
+          <div>观察记录</div>
+        </div>
+        <img class="img" src="../../assets/images/eva/Frame (5).png" alt="" />
+      </div>
+      <div class="observe_box">
+        <!-- <div class="observe_boxTit">筛选框</div> -->
+        <div class="observe_boxSelect">
+          <!-- <div class="observe_boxCon" style="display: inline-block;" @click="addFil('')">全部</div> -->
+          <div
+            class="observe_boxCon"
+            v-for="(i, index) in filtrate"
+            @click="addFil(i.id, index)"
+            :class="{ active: activeItem === index }"
+            :key="index"
+          >
+            {{ i.name }}
+          </div>
+        </div>
+      </div>
+      <!-- 观察内容开始 -->
+      <van-swipe-cell v-show="conList.length" v-for="(i, index) in conList" :key="index">
+        <div class="observe_content" @click="recordContinue(i.rid)">
+          <div class="observe_contentTit">
+            <!-- {{ i.recordTit }} -->
+            观察内容
+          </div>
+          <div class="observe_contentBir">
+            <div>{{ i.username }}</div>
+            <div>{{ i.recordDate }}</div>
+          </div>
+          <div class="observe_contentTxt">
+            {{ i.recordContent }}
+          </div>
+        </div>
+        <template #right>
+          <div class="observe_contentDel" @click="delPop(i.rid)">
+            <img src="../../assets/images/eva/del.png" style="width: 20px;height: 20px;" alt="" />
+          </div>
+          <!-- <van-button square text="删除" type="danger" class="delete-button" /> -->
+        </template>
+      </van-swipe-cell>
+      <div v-show="!conList.length" style="width: 100%;height: 10px;background-color: #F0F2F5;"></div>
+      <div v-show="!conList.length" class="observe_content observe_content2">
+        <img src="../../assets//images/eva/rqq.png" alt="" />
+        <div class="tit">暂无内容</div>
+        <div class="tit2" @click="addRecord">快去添加新记录吧 ></div>
+      </div>
+
+      <!-- 观察内容结束 -->
+    </div>
+
+    <!-- 观察记录结束 -->
+
+    <pop v-show="isShowMask">
+      <template v-slot:tit>确定</template>
+      <template v-slot:con>确定删除吗</template>
+      <template v-slot:btn1>
+        <div class="btn" style="color: rgba(136,136,136,1);" @click="isShowMask = false">取消</div>
+      </template>
+      <template v-slot:btn2>
+        <div class="btn" style="color: rgba(251,67,25,1);" @click="delCon">确认</div>
+      </template>
+    </pop>
+
+    <!-- 添加记录按钮开始 -->
+    <div class="addRecord" @click="addRecord">
+      <img src="../../assets/images/eva/add.png" alt="" />
+    </div>
+    <!-- 添加记录按钮结束 -->
+  </div>
+</template>
+
+<script>
+import { selectStudentDetail } from '@/api/eva'
+// import { selectClassStudent } from '@/api/eva'
+import { selectVeiDoo } from '@/api/eva'
+import { selectRecord } from '@/api/eva'
+import { selectTerm } from '@/api/eva'
+// import { selectStuClass } from '@/api/eva'
+
+import { updateRecord } from '@/api/eva'
+// 单选
+import selectStyle from './components/selectStyle.vue'
+import bar from './components/bar.vue'
+// 弹窗组件
+import pop from './components/pop.vue'
+export default {
+  components: {
+    bar,
+    pop,
+    selectStyle
+  },
+  data() {
+    return {
+      activeItem: null,
+      // 观察记录数组
+      conList: [],
+      // 筛选项
+      filtrate: [],
+      // 学生信息
+      studentInfo: {},
+
+      // 请求筛选条件
+      fil: [],
+
+      // 班级学生列表
+      stuList: [],
+      // 学生id
+      stuId: '',
+      // 传参班级数据
+      classInfo: this.$route.query,
+      num: null,
+
+      // 弹窗的
+      isShowMask: false,
+      delRid: '',
+
+      termList: [],
+      termData: [],
+
+      TermRecord: []
+    }
+  },
+  methods: {
+    // 获取基础数据
+    getData() {
+      // 获取学生信息
+      const data = {
+        uid: this.stuId,
+        trm: this.termData[0]
+      }
+      selectStudentDetail(data).then(res => {
+        this.studentInfo = res[0][0]
+        console.log('获取学生信息', this.studentInfo)
+      })
+
+      // 获取所有学生记录
+      const data4 = {
+        uid: this.stuId,
+        trm: this.termData[0],
+        txt: ''
+      }
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res[0])
+        this.conList = res[0]
+      })
+
+      // 获取筛选框
+      const data3 = {
+        oid: this.$store.state.user.userinfo.organizeid
+      }
+      selectVeiDoo(data3).then(res => {
+        this.filtrate = res[0]
+      })
+    },
+    selTerm() {
+      // 获取学期筛选框
+      selectTerm().then(res => {
+        console.log('获取学期筛选框', res)
+        res[0].forEach(e => {
+          if (e.defaultC === 1) {
+            this.termData.push(e.id)
+          }
+        })
+        // console.log('this.termData', this.termData)
+        this.termList = res[0]
+        this.getData()
+        this.getTermRecord()
+
+        // console.log('this.termList', this.termList)
+      })
+    },
+    // 删除弹框显示
+    delPop(e) {
+      this.delRid = e
+      this.isShowMask = true
+    },
+    // 删除数据
+    delCon() {
+      const data = [{ rid: this.delRid }]
+      updateRecord(data).then(res => {
+        if (res === 1) {
+          this.$toast({
+            message: '删除成功',
+            type: 'success'
+          })
+          this.isShowMask = false
+
+          setTimeout(() => {
+            this.getData()
+          }, 500)
+        } else {
+          this.$toast({
+            message: '删除失败',
+            type: 'fail'
+          })
+        }
+      })
+    },
+    // 筛选按钮
+    addFil(e, index) {
+      // 同一个点击第二次时取消选择
+      if (this.activeItem === index) {
+        this.activeItem = null
+        e = ''
+      } else {
+        this.activeItem = index
+      }
+
+      // this.fil.push(e)
+      const data4 = {
+        uid: localStorage.getItem('userId'),
+        trm: this.termData[0],
+        txt: e
+      }
+      // console.log(data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res)
+        this.conList = res[0]
+      })
+    },
+    // 获取学期学生记录
+    getTermRecord() {
+      const data4 = {
+        uid: localStorage.getItem('userId'),
+        trm: this.termData[0],
+        txt: ''
+      }
+      console.log(' 获取所有学生记录aaaaaaaaaaaaaaaaaaaaaaa', data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res)
+        this.TermRecord = res[0]
+      })
+    },
+    // 子组件调用父组件方法
+    handleUpdateSearch(e) {
+      console.log(e)
+      // 获取筛选学期所有学生记录
+      const data4 = {
+        uid: this.stuId,
+        trm: this.termData[0],
+        txt: ''
+      }
+      // console.log('data4', data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res[0])
+        this.conList = res[0]
+      })
+    },
+    // 添加记录按钮跳转
+    addRecord() {
+      this.$router.push(`/searchStudentEva?shareShow=${0}&cid=${this.classInfo.cid}&CName=${this.classInfo.cName}`)
+    },
+    // 已经写过的记录卡片点击跳转
+    recordContinue(e) {
+      this.$router.push(
+        `/searchStudentEva?shareShow=${1}&cid=${this.classInfo.cid}&CName=${this.classInfo.cName}&rid=${e}`
+      )
+    }
+  },
+  created() {
+    this.stuId = localStorage.getItem('userId')
+    this.selTerm()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.goods-card {
+  margin: 0;
+  background-color: #fff;
+}
+
+.delete-button {
+  height: 100%;
+}
+.observe_contentDel {
+  width: 50px;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: red;
+}
+
+.observe_content {
+  // margin: 0 10px;
+  width: 100%;
+  min-height: 95px;
+  // max-height: 95px;
+  border-bottom: 1px solid #e7e7e7;
+  box-sizing: border-box;
+  padding: 0 10px;
+  overflow: hidden;
+  background-color: #fff;
+
+  .observe_contentTit {
+    //   line-height: 20px;
+    box-sizing: border-box;
+    padding: 8px 0;
+    font-weight: 550;
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+  }
+  .observe_contentBir {
+    display: flex;
+    // color: rgba(79, 79, 79, 1);
+    color: rgba(0, 0, 0, 0.4);
+    font-size: 10px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+  }
+  .observe_contentBir :first-child {
+    margin-right: 10px;
+  }
+  .observe_contentTxt {
+    margin-top: 5px;
+    // color: rgba(16, 16, 16, 1);
+    color: rgba(0, 0, 0, 0.6);
+    font-size: 12px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+.studentDetail {
+  width: 100%;
+  min-height: 100vh;
+  background-color: #f0f2f5;
+  //   顶部学生信息开始
+  .top {
+    margin: auto;
+    width: 100vw;
+    height: 150px;
+    background-color: #005ccd;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 10px;
+    color: #fff;
+    .rig {
+      display: flex;
+      width: 40%;
+      height: 100%;
+      justify-content: space-around;
+
+      .topBtnS {
+        // flex: 1;
+        width: 90px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .img {
+          width: 30px;
+          height: 30px;
+        }
+      }
+    }
+
+    .UserInfo {
+      display: flex;
+      flex-direction: column;
+      // height: 55px;
+      justify-content: space-between;
+      .sInfo {
+        display: flex;
+        .userName {
+          width: 120px;
+          text-overflow: ellipsis;
+          overflow: hidden;
+          margin-right: 5px;
+          height: 20px;
+          line-height: 20px;
+          color: #ffffff;
+          font-size: 20px;
+          text-align: left;
+          font-family: PingFangSC-regular;
+        }
+        .cla {
+          height: 20px;
+          line-height: 30px;
+          font-size: 10px;
+          color: #ffffff;
+        }
+      }
+
+      .dataNum {
+        width: 150px;
+        height: 20px;
+        line-height: 20px;
+        color: #fff;
+        font-size: 16px;
+        text-align: left;
+        font-family: PingFangSC-regular;
+      }
+    }
+  }
+  //   顶部学生信息结束
+
+  //   观察记录开始
+  .observe_tit {
+    // position: relative;
+    // top: -15px;
+    width: 100%;
+    box-sizing: border-box;
+    padding: 10px;
+    display: flex;
+    line-height: 20px;
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+    align-items: center;
+    border-radius: 15px 15px 0 0;
+    // transform: translate(0, -10px);
+    background-color: #fff;
+    justify-content: space-between;
+    font-weight: bold;
+    .left {
+      display: flex;
+      align-items: center;
+    }
+    .img {
+      width: 26px;
+    }
+  }
+  .observe_box {
+    width: 100%;
+    // margin: 0 10px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: center;
+    font-family: Roboto;
+    // border: 1px solid rgba(187, 187, 187, 1);
+    box-sizing: border-box;
+    padding: 0 10px;
+    .observe_boxTit {
+      width: 84px;
+      height: 29px;
+      line-height: 29px;
+      color: rgba(51, 51, 51, 1);
+      font-size: 12px;
+      text-align: left;
+      font-family: PingFangSC-regular;
+      margin-bottom: 5px;
+    }
+    .observe_boxSelect {
+      width: 100%;
+      display: flex;
+      // justify-content: space-between;
+      align-items: center;
+      flex-wrap: wrap;
+      .observe_boxCon {
+        width: 74.46px;
+        height: 30px;
+        line-height: 30px;
+        border-radius: 4px;
+        background-color: #fff;
+        color: rgba(153, 152, 152, 1);
+        font-size: 12px;
+        text-align: center;
+        font-family: Roboto;
+        border: 1px solid rgba(231, 231, 231, 1);
+        margin-bottom: 8px;
+        margin-right: 10px;
+      }
+      .active {
+        background-color: #e0eafb;
+        color: #0061ff;
+      }
+      //   height: 100%;
+    }
+  }
+  //   观察记录结束
+
+  //    观察内容开始
+
+  .observe_content2 {
+    margin-top: 10px;
+    border: none;
+    height: 250px;
+    text-align: center;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    background-color: #fff;
+    .tit {
+      margin: 5px 0;
+      color: rgba(0, 0, 0, 0.4);
+      font-family: Microsoft YaHei;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 700;
+    }
+    .tit2 {
+      color: #3681fc;
+      font-family: Microsoft YaHei;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+    }
+
+    img {
+      width: 80px;
+      height: 80px;
+    }
+  }
+  // 观察内容结束
+
+  // 添加记录按钮开始
+  .addRecord {
+    position: fixed;
+    bottom: 20px;
+    right: 10px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    background-color: #fff;
+    font-size: 14px;
+    font-family: Microsoft Yahei;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+    img {
+      width: 16px;
+      height: 16px;
+    }
+  }
+  //  添加记录按钮结束
+}
+</style>

src/views/eva/studentDetail.vue

@@ -0,0 +1,668 @@
+<template>
+  <!-- 学生详情 -->
+  <div class="studentDetail">
+    <bar :tit="'学生记录'" :backPage="1"></bar>
+    <div style="height: 50px;"></div>
+    <!-- 顶部学生信息开始 -->
+    <div class="top">
+      <div class="UserInfo" style="flex: 1;">
+        <div class="sInfo">
+          <div class="userName">{{ studentInfo.name }}</div>
+          <div class="cla">{{ $route.query.cName }}</div>
+        </div>
+        <selectStyle
+          ref="claSel"
+          @update-search="handleUpdateSearch"
+          :listCont="termList"
+          :tit="'请选择学期'"
+          :choose="termData"
+        ></selectStyle>
+
+        <div class="dataNum">本学期共计{{ TermRecord.length }} 条记录</div>
+      </div>
+
+      <div class="rig">
+        <div class="topBtnS">
+          <div>
+            <img class="img" v-if="num" @click="upStu" src="../../assets/images/eva/Frame (3).png" alt="" />
+          </div>
+          <div>
+            <img
+              class="img"
+              v-if="num != stuList.length - 1"
+              @click="nextStu"
+              src="../../assets/images/eva/Frame (2).png"
+              alt=""
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 顶部学生信息结束 -->
+
+    <!-- 观察记录开始 -->
+    <div style="position: relative;top: -15px;">
+      <div class="observe_tit">
+        <div class="left">
+          <img class="img" src="../../assets/images/eva/Frame (4).png" alt="" />
+          <div>观察记录</div>
+        </div>
+        <img class="img" src="../../assets/images/eva/Frame (5).png" alt="" />
+      </div>
+      <div class="observe_box">
+        <!-- <div class="observe_boxTit">筛选框</div> -->
+        <div class="observe_boxSelect">
+          <!-- <div class="observe_boxCon" style="display: inline-block;" @click="addFil('')">全部</div> -->
+          <div
+            class="observe_boxCon"
+            v-for="(i, index) in filtrate"
+            @click="addFil(i.id, index)"
+            :class="{ active: activeItem === index }"
+            :key="index"
+          >
+            {{ i.name }}
+          </div>
+        </div>
+      </div>
+      <!-- 观察内容开始 -->
+      <van-swipe-cell v-show="conList.length" v-for="(i, index) in conList" :key="index">
+        <div class="observe_content" @click="recordContinue(i.rid)">
+          <div class="observe_contentTit">
+            <!-- {{ i.recordTit }} -->
+            观察内容
+          </div>
+          <div class="observe_contentBir">
+            <div>{{ i.username }}</div>
+            <div>{{ i.recordDate }}</div>
+          </div>
+          <div class="observe_contentTxt">
+            {{ i.recordContent }}
+          </div>
+        </div>
+        <template #right>
+          <div class="observe_contentDel" @click="delPop(i.rid)">
+            <img src="../../assets/images/eva/del.png" style="width: 20px;height: 20px;" alt="" />
+          </div>
+          <!-- <van-button square text="删除" type="danger" class="delete-button" /> -->
+        </template>
+      </van-swipe-cell>
+      <div v-show="!conList.length" style="width: 100%;height: 10px;background-color: #F0F2F5;"></div>
+      <div v-show="!conList.length" class="observe_content observe_content2">
+        <img src="../../assets//images/eva/rqq.png" alt="" />
+        <div class="tit">暂无内容</div>
+        <div class="tit2" @click="addRecord">快去添加新记录吧 ></div>
+      </div>
+
+      <!-- 观察内容结束 -->
+    </div>
+
+    <!-- 观察记录结束 -->
+
+    <pop v-show="isShowMask">
+      <template v-slot:tit>确定</template>
+      <template v-slot:con>确定删除吗</template>
+      <template v-slot:btn1>
+        <div class="btn" style="color: rgba(136,136,136,1);" @click="isShowMask = false">取消</div>
+      </template>
+      <template v-slot:btn2>
+        <div class="btn" style="color: rgba(251,67,25,1);" @click="delCon">确认</div>
+      </template>
+    </pop>
+
+    <!-- 添加记录按钮开始 -->
+    <div class="addRecord" @click="addRecord">
+      <img src="../../assets/images/eva/add.png" alt="" />
+    </div>
+    <!-- 添加记录按钮结束 -->
+  </div>
+</template>
+
+<script>
+import { selectStudentDetail } from '@/api/eva'
+import { selectClassStudent } from '@/api/eva'
+import { selectVeiDoo } from '@/api/eva'
+import { selectRecord } from '@/api/eva'
+import { selectTerm } from '@/api/eva'
+
+import { updateRecord } from '@/api/eva'
+// 单选
+import selectStyle from './components/selectStyle.vue'
+import bar from './components/bar.vue'
+// 弹窗组件
+import pop from './components/pop.vue'
+export default {
+  components: {
+    bar,
+    pop,
+    selectStyle
+  },
+  data() {
+    return {
+      activeItem: null,
+      // 观察记录数组
+      conList: [],
+      // 筛选项
+      filtrate: [],
+      // 学生信息
+      studentInfo: {},
+
+      // 请求筛选条件
+      fil: [],
+
+      // 班级学生列表
+      stuList: [],
+      // 学生id
+      stuId: '',
+      // 传参班级数据
+      classInfo: this.$route.query,
+      num: null,
+
+      // 弹窗的
+      isShowMask: false,
+      delRid: '',
+
+      termList: [],
+      termData: [],
+
+      // 学期记录条数
+      TermRecord: []
+    }
+  },
+  methods: {
+    // 获取基础数据
+    getData() {
+      // 获取班学生列表
+      const data2 = {
+        cid: this.$route.query.cid
+      }
+      selectClassStudent(data2).then(res => {
+        res[0].forEach(e => {
+          this.stuList.push(e.id)
+        })
+        // console.log('获取班学生列表', this.stuList)
+        // 查询学生在数组中的位置
+        this.num = this.stuList.indexOf(this.stuId)
+      })
+      // 获取学生信息
+      const data = {
+        uid: this.stuId
+      }
+
+      selectStudentDetail(data).then(res => {
+        this.studentInfo = res[0][0]
+        console.log('获取学生信息', this.studentInfo)
+      })
+      // 获取所有学生记录
+      const data4 = {
+        uid: this.stuId,
+        trm: this.termData[0],
+        txt: ''
+      }
+      // console.log('data4', data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res[0])
+        this.conList = res[0]
+      })
+
+      // 获取筛选框
+      const data3 = {
+        oid: this.$store.state.user.userinfo.organizeid
+      }
+      selectVeiDoo(data3).then(res => {
+        this.filtrate = res[0]
+      })
+    },
+    selTerm() {
+      // 获取学期筛选框
+      selectTerm().then(res => {
+        console.log('获取学期筛选框', res)
+        res[0].forEach(e => {
+          if (e.defaultC === 1) {
+            this.termData.push(e.id)
+          }
+        })
+        // console.log('this.termData', this.termData)
+        this.termList = res[0]
+        this.getData()
+        this.getTermRecord()
+
+        // console.log('this.termList', this.termList)
+      })
+    },
+    // 上一个
+    upStu() {
+      // 判断学生在数组中的位置，获取班学生列表有初始值
+      this.activeItem = null
+
+      this.num = this.num - 1
+      if (this.num >= 0) {
+        this.stuId = this.stuList[this.num]
+        localStorage.setItem('userId', this.stuList[this.num])
+
+        // 获取所有学生记录
+        const data4 = {
+          uid: this.stuList[this.num],
+          trm: this.termData[0],
+          txt: ''
+        }
+        selectRecord(data4).then(res => {
+          console.log('获取所有学生记录', res)
+          this.conList = res[0]
+        })
+        // 更新学生信息
+        selectStudentDetail({ uid: this.stuId }).then(res => {
+          this.studentInfo = res[0][0]
+        })
+        this.getTermRecord()
+      }
+    },
+    // 下一个
+    nextStu() {
+      this.activeItem = null
+
+      this.num = this.num + 1
+      if (this.num <= this.stuList.length - 1) {
+        this.stuId = this.stuList[this.num]
+        localStorage.setItem('userId', this.stuList[this.num])
+        // 获取所有学生记录
+        const data4 = {
+          uid: this.stuList[this.num],
+          trm: this.termData[0],
+          txt: ''
+        }
+        selectRecord(data4).then(res => {
+          console.log('获取所有学生记录', res)
+          this.conList = res[0]
+        })
+
+        selectStudentDetail({ uid: this.stuId }).then(res => {
+          this.studentInfo = res[0][0]
+          console.log(this.studentInfo)
+        })
+        this.getTermRecord()
+      }
+    },
+    // 删除弹框显示
+    delPop(e) {
+      this.delRid = e
+      this.isShowMask = true
+    },
+    // 删除数据
+    delCon() {
+      // return console.log(this.delRid)
+      const data = [{ rid: this.delRid }]
+      updateRecord(data).then(res => {
+        // console.log('删除数据', res)
+
+        if (res === 1) {
+          this.$toast({
+            message: '删除成功',
+            type: 'success'
+          })
+          this.isShowMask = false
+
+          setTimeout(() => {
+            this.getData()
+          }, 500)
+        } else {
+          this.$toast({
+            message: '删除失败',
+            type: 'fail'
+          })
+        }
+      })
+    },
+    // 筛选按钮
+    addFil(e, index) {
+      // 同一个点击第二次时取消选择
+      if (this.activeItem === index) {
+        this.activeItem = null
+        e = ''
+      } else {
+        this.activeItem = index
+      }
+
+      // this.fil.push(e)
+      const data4 = {
+        uid: localStorage.getItem('userId'),
+        trm: this.termData[0],
+        txt: e
+      }
+      console.log(data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res)
+        this.conList = res[0]
+      })
+    },
+
+    getTermRecord() {
+      // 获取所有学生记录
+      const data4 = {
+        uid: localStorage.getItem('userId'),
+        trm: this.termData[0],
+        txt: ''
+      }
+      console.log(' 获取所有学生记录aaaaaaaaaaaaaaaaaaaaaaa', data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res)
+        this.TermRecord = res[0]
+      })
+    },
+    handleUpdateSearch(e) {
+      console.log(e)
+      // 获取筛选学期所有学生记录
+      const data4 = {
+        uid: this.stuId,
+        trm: this.termData[0],
+        txt: ''
+      }
+      // console.log('data4', data4)
+      selectRecord(data4).then(res => {
+        console.log('获取所有学生记录', res[0])
+        this.conList = res[0]
+      })
+      this.getTermRecord()
+    },
+    // 添加记录按钮跳转
+    addRecord() {
+      this.$router.push(
+        `/studentEvaluate?shareShow=${0}&uid=${this.stuId}&cid=${this.classInfo.cid}&CName=${this.classInfo.cName}`
+      )
+    },
+    // 已经写过的记录卡片点击跳转
+    recordContinue(e) {
+      this.$router.push(
+        `/studentEvaluate?shareShow=${1}&uid=${this.stuId}&cid=${this.classInfo.cid}&CName=${
+          this.classInfo.cName
+        }&rid=${e}`
+      )
+    }
+  },
+  created() {
+    // this.getStuList()
+    this.stuId = localStorage.getItem('userId')
+    // console.log('localStorage', localStorage.getItem('userId'))
+    this.selTerm()
+
+    // console.log(this.$route.query)
+    // console.log('state', this.$store.state)
+    // console.log(this.$route.query.cid)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.goods-card {
+  margin: 0;
+  background-color: #fff;
+}
+
+.delete-button {
+  height: 100%;
+}
+.observe_contentDel {
+  width: 50px;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: red;
+}
+
+.observe_content {
+  // margin: 0 10px;
+  width: 100%;
+  min-height: 95px;
+  // max-height: 95px;
+  border-bottom: 1px solid #e7e7e7;
+  box-sizing: border-box;
+  padding: 0 10px;
+  overflow: hidden;
+  background-color: #fff;
+
+  .observe_contentTit {
+    //   line-height: 20px;
+    box-sizing: border-box;
+    padding: 8px 0;
+    font-weight: 550;
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+  }
+  .observe_contentBir {
+    display: flex;
+    // color: rgba(79, 79, 79, 1);
+    color: rgba(0, 0, 0, 0.4);
+    font-size: 10px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+  }
+  .observe_contentBir :first-child {
+    margin-right: 10px;
+  }
+  .observe_contentTxt {
+    margin-top: 5px;
+    // color: rgba(16, 16, 16, 1);
+    color: rgba(0, 0, 0, 0.6);
+    font-size: 12px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+.studentDetail {
+  width: 100%;
+  min-height: 100vh;
+  background-color: #f0f2f5;
+  //   顶部学生信息开始
+  .top {
+    margin: auto;
+    width: 100vw;
+    height: 150px;
+    background-color: #005ccd;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 10px;
+    color: #fff;
+    .rig {
+      display: flex;
+      width: 40%;
+      height: 100%;
+      justify-content: space-around;
+
+      .topBtnS {
+        // flex: 1;
+        width: 90px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .img {
+          width: 30px;
+          height: 30px;
+        }
+      }
+    }
+
+    .UserInfo {
+      display: flex;
+      flex-direction: column;
+      // height: 55px;
+      justify-content: space-between;
+      .sInfo {
+        display: flex;
+        .userName {
+          width: 120px;
+          text-overflow: ellipsis;
+          overflow: hidden;
+          margin-right: 5px;
+          height: 20px;
+          line-height: 20px;
+          color: #ffffff;
+          font-size: 20px;
+          text-align: left;
+          font-family: PingFangSC-regular;
+        }
+        .cla {
+          height: 20px;
+          line-height: 30px;
+          font-size: 10px;
+          color: #ffffff;
+        }
+      }
+
+      .dataNum {
+        width: 150px;
+        height: 20px;
+        line-height: 20px;
+        color: #fff;
+        font-size: 16px;
+        text-align: left;
+        font-family: PingFangSC-regular;
+      }
+    }
+  }
+  //   顶部学生信息结束
+
+  //   观察记录开始
+  .observe_tit {
+    // position: relative;
+    // top: -15px;
+    width: 100%;
+    box-sizing: border-box;
+    padding: 10px;
+    display: flex;
+    line-height: 20px;
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: left;
+    font-family: PingFangSC-regular;
+    align-items: center;
+    border-radius: 15px 15px 0 0;
+    // transform: translate(0, -10px);
+    background-color: #fff;
+    justify-content: space-between;
+    font-weight: bold;
+    .left {
+      display: flex;
+      align-items: center;
+    }
+    .img {
+      width: 26px;
+    }
+  }
+  .observe_box {
+    width: 100%;
+    // margin: 0 10px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: center;
+    font-family: Roboto;
+    // border: 1px solid rgba(187, 187, 187, 1);
+    box-sizing: border-box;
+    padding: 0 10px;
+    .observe_boxTit {
+      width: 84px;
+      height: 29px;
+      line-height: 29px;
+      color: rgba(51, 51, 51, 1);
+      font-size: 12px;
+      text-align: left;
+      font-family: PingFangSC-regular;
+      margin-bottom: 5px;
+    }
+    .observe_boxSelect {
+      width: 100%;
+      display: flex;
+      // justify-content: space-between;
+      align-items: center;
+      flex-wrap: wrap;
+      .observe_boxCon {
+        width: 74.46px;
+        height: 30px;
+        line-height: 30px;
+        border-radius: 4px;
+        background-color: #fff;
+        color: rgba(153, 152, 152, 1);
+        font-size: 12px;
+        text-align: center;
+        font-family: Roboto;
+        border: 1px solid rgba(231, 231, 231, 1);
+        margin-bottom: 8px;
+        margin-right: 10px;
+      }
+      .active {
+        background-color: #e0eafb;
+        color: #0061ff;
+      }
+      //   height: 100%;
+    }
+  }
+  //   观察记录结束
+
+  //    观察内容开始
+
+  .observe_content2 {
+    margin-top: 10px;
+    border: none;
+    height: 250px;
+    text-align: center;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    background-color: #fff;
+    .tit {
+      margin: 5px 0;
+      color: rgba(0, 0, 0, 0.4);
+      font-family: Microsoft YaHei;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 700;
+    }
+    .tit2 {
+      color: #3681fc;
+      font-family: Microsoft YaHei;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+    }
+
+    img {
+      width: 80px;
+      height: 80px;
+    }
+  }
+  // 观察内容结束
+
+  // 添加记录按钮开始
+  .addRecord {
+    position: fixed;
+    bottom: 20px;
+    right: 10px;
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    background-color: #fff;
+    font-size: 14px;
+    font-family: Microsoft Yahei;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+    img {
+      width: 16px;
+      height: 16px;
+    }
+  }
+  //  添加记录按钮结束
+}
+</style>

src/views/eva/studentEvaluate.vue

@@ -0,0 +1,731 @@
+<template>
+  <!-- 学生评价 -->
+  <div class="studentEvaluate" @click="col">
+    <bar :tit="'学生评价'" :num="1">
+      <template v-slot:btn>
+        <div v-if="!shareShow" @click="save">保存</div>
+        <div v-else @click="amend">修改</div>
+      </template>
+    </bar>
+
+    <div style="height: 50px;z-index: 30;overflow: hidden;"></div>
+
+    <!-- <div class="bigBlock"> -->
+    <div class="bigBlock" style="">
+      <div class="claName">
+        <div class="tit">学生</div>
+        <div class="studentName">{{ stuName.name }}</div>
+      </div>
+      <div class="claName">
+        <div class="tit">班级</div>
+        <div class="studentName">{{ $route.query.CName }}</div>
+      </div>
+
+      <div class="claName">
+        <!-- <div class="relevanceStudent"> -->
+        <div class="tit">关联</div>
+        <div class="studentName">
+          <selects ref="StuSel" :listContent="studentList" :tit="'请选择关联学生'" :choosePer="selectSData"></selects>
+        </div>
+        <!-- </div> -->
+      </div>
+      <div class="claName">
+        <div class="tit">学期</div>
+        <div class="studentName" style="position: relative;">
+          <radioSelect ref="claSel" :listCont="termList" :tit="'请选择学期'" :choose="termData"></radioSelect>
+          <div v-show="term" style="position: absolute;bottom: -100%; color: red;font-size: 10px;">请选择学期</div>
+        </div>
+      </div>
+      <div v-show="term" style="height: 10px;"></div>
+
+      <div class="claName">
+        <div class="tit">纬度</div>
+        <div class="studentName" style="position: relative;">
+          <selects ref="WeiSel" :listContent="weiList" :tit="'请选择评价纬度'" :choosePer="selectWData"></selects>
+          <div v-show="wei" style="position: absolute;bottom: -100%; color: red;font-size: 10px;">请选择评价纬度</div>
+        </div>
+      </div>
+      <div v-show="wei" style="height: 10px;"></div>
+
+      <div class="claName" style="position: relative;">
+        <div class="tit">时间</div>
+
+        <div class="studentName2">
+          <van-field
+            class="xx"
+            clickable
+            name="datetimePicker"
+            label=""
+            placeholder="请选择时间"
+            @click="choseTime"
+            input-align="left"
+            :value="visitTime"
+            :rules="[{ required: true, message: '' }]"
+            readonly
+          >
+          </van-field>
+          <van-popup v-model="showPicker" position="bottom">
+            <van-datetime-picker
+              @cancel="cancel"
+              @confirm="onConfirm"
+              v-model="currentDate"
+              type="datetime"
+              :min-date="minDate"
+              :max-date="maxDate"
+            />
+          </van-popup>
+        </div>
+        <img class="rl" src="../../assets/images/eva/rl.png" alt="" />
+        <div
+          v-show="tim"
+          style="position: absolute;bottom: 0;transform: translate(0,100%); left: 40px; color: red;font-size: 10px;"
+        >
+          请设置时间
+        </div>
+      </div>
+      <div v-show="tim" style="height: 10px;"></div>
+
+      <div class="claName">
+        <div class="tit">地点</div>
+        <div class="inpBlock studentName">
+          <input type="text" v-model="place" class="inp" placeholder="请输入" />
+        </div>
+      </div>
+      <div class="claName">
+        <div style="width: 70px;">观察内容</div>
+        <div class="inpBlock studentName">
+          <input type="text" v-model="observeCon" class="inp" placeholder="请输入" />
+        </div>
+      </div>
+      <div class="claName">
+        观察记录
+      </div>
+      <div class="EvaluateTxt">
+        <textarea name="" id="" style="width: 100%;height: 100%;border: none;" v-model="recordCon"></textarea>
+      </div>
+
+      <!-- 上传图片开始 -->
+      <div class="uploadImgTit">
+        <div>图片上传</div>
+        <div>{{ imgList.length }}/10</div>
+      </div>
+      <div class="uploadImg">
+        <image-component @getImage="getImage" :imgList.sync="imgList"></image-component>
+      </div>
+      <!-- 上传图片结束 -->
+    </div>
+    <!-- </div> -->
+    <!-- 按钮 -->
+    <div class="submitBtn">
+      <!-- <div class="btn" @click="isShowMask = true">删除</div> -->
+      <div class="btn" @click="isShowMask = true">重复添加</div>
+      <div class="btn">添加新记录</div>
+      <div class="btn" v-if="!shareShow" @click="save">保存并返回</div>
+      <div class="btn" v-else @click="amend">修改并返回</div>
+    </div>
+
+    <pop v-show="isShowMask">
+      <template v-slot:tit>确定</template>
+      <template v-slot:con>确定{{ shareShow ? '修改' : '保存' }}吗</template>
+      <template v-slot:btn1>
+        <div class="btn" style="color: rgba(136,136,136,1);" @click="isShowMask = false">取消</div>
+      </template>
+      <template v-slot:btn2>
+        <div class="btn" v-if="!shareShow" style="color: rgba(251,67,25,1);" @click="uploadRecord">确认</div>
+        <div class="btn" v-else style="color: rgba(251,67,25,1);" @click="updateRecord">确认</div>
+      </template>
+    </pop>
+  </div>
+</template>
+
+<script>
+// 导航栏组件
+import bar from './components/bar.vue'
+// 多选框组件
+import selects from './components/selects.vue'
+// 单选
+import radioSelect from './components/radioSelect.vue'
+
+// 上传图片组件
+import imageComponent from './components/ImageComponent.vue'
+// 弹窗组件
+import pop from './components/pop.vue'
+
+import { insertRecord } from '@/api/eva'
+import { selectClassStudent } from '@/api/eva'
+import { selectVeiDoo } from '@/api/eva'
+import { selectRecordDetail } from '@/api/eva'
+import { updateRecordData } from '@/api/eva'
+import { selectTerm } from '@/api/eva'
+
+import '@/utils/aws-sdk-2.235.1.min.js'
+
+export default {
+  components: {
+    bar,
+    selects,
+    imageComponent,
+    pop,
+    radioSelect
+  },
+
+  data() {
+    return {
+      // 学生信息
+      stuName: {},
+      // 关联选项
+      studentList: [],
+      // 纬度选项
+      weiList: [],
+      termList: [],
+      // 所选数据
+      // 学生
+      selectSData: [],
+      // 纬度
+      selectWData: [],
+      // 学期
+      termData: [],
+      // 格式化后记录时间
+      visitTime: '',
+      // 地点
+      place: '',
+      // 观察内容
+      observeCon: '',
+      // 观察记录
+      recordCon: '',
+      // 图片列表
+      imgList: [],
+
+      isShowMask: false, // 控制删除弹框的显示与隐藏
+      isShowMask2: false, // 控制保存弹框的显示与隐藏
+      // 是否显示分享和继续记录按钮
+      shareShow: 0,
+      // 未格式化的时间
+      currentDate: new Date(),
+      // 时间弹出框
+      showPicker: false,
+      minDate: '',
+      maxDate: '',
+
+      wei: false,
+      tim: false,
+      term: false
+    }
+  },
+
+  methods: {
+    getData() {
+      // 获取纬度筛选框
+      selectVeiDoo().then(res => {
+        this.weiList = res[0]
+        console.log('this.weiList', this.weiList)
+      })
+
+      // 获取学期筛选框
+      selectTerm().then(res => {
+        console.log('获取学期筛选框', res)
+        res[0].forEach(e => {
+          console.log(e)
+          if (e.defaultC === 1) {
+            this.termData.push(e.id)
+          }
+        })
+        this.termList = res[0]
+      })
+
+      // 获取班学生列表
+      const data2 = {
+        cid: this.$route.query.cid
+      }
+      selectClassStudent(data2).then(res => {
+        res[0].forEach(e => {
+          if (e.id === this.$route.query.uid) {
+            this.stuName = e
+          } else {
+            this.studentList.push(e)
+          }
+        })
+        console.log('this.studentList', this.studentList)
+      })
+    },
+    // 调用子元素selects中的方法隐藏选项列表
+    col() {
+      this.$refs.StuSel.fuClick()
+      this.$refs.WeiSel.fuClick()
+      this.$refs.claSel.fuClick()
+    },
+    // 选择照片
+    getImage(imgList) {
+      // console.log('哒哒哒啊啊的', imgList)
+
+      this.imgList = imgList
+      this.$forceUpdate()
+    },
+    save() {
+      // console.log(this.$store.state);
+      if (this.termData[0] === '') {
+        return (this.term = true)
+      }
+      if (this.selectWData.length === 0) {
+        return (this.wei = true)
+      }
+      if (this.visitTime === '') {
+        return (this.tim = true)
+      }
+
+      this.isShowMask = true
+    },
+    amend() {
+      // console.log(this.$store.state);
+      if (this.termData === '') {
+        this.term = true
+      }
+      if (this.selectWData.length === 0) {
+        this.wei = true
+      }
+      if (this.visitTime === '') {
+        return (this.tim = true)
+      }
+
+      this.isShowMask = true
+    },
+    // 上传评价
+    uploadRecord() {
+      const data = [
+        {
+          uid: localStorage.getItem('userId'),
+          tid: this.$store.state.user.userinfo.userid,
+          contact: this.selectSData.join(','),
+          type: this.selectWData.join(','),
+          timing: this.visitTime,
+          place: this.place,
+          observeCon: this.observeCon,
+          recordCon: this.recordCon,
+          imgList: this.imgList.join(','),
+          term: this.termData[0]
+        }
+      ]
+      // return console.log(data)
+      this.isShowMask = false
+
+      // return console.log(data)
+
+      insertRecord(data).then(res => {
+        console.log(res)
+        if (res === 1) {
+          this.$toast({
+            message: '保存成功',
+            type: 'success'
+          })
+          setTimeout(() => {
+            if (this.$route.query.ser || 0) {
+              this.$router.replace(`/searchstuDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            } else {
+              this.$router.replace(`/studentDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            }
+          }, 1000)
+        }
+      })
+      // console.log('上传评价', data)
+    },
+    // 修改评价
+    updateRecord() {
+      const data = [
+        {
+          rid: this.$route.query.rid,
+          tid: this.$store.state.user.userinfo.userid,
+          contact: this.selectSData.join(','),
+          type: this.selectWData.join(','),
+          timing: this.visitTime,
+          place: this.place,
+          observeCon: this.observeCon,
+          recordCon: this.recordCon,
+          imgList: this.imgList.join(','),
+          term: this.termData[0]
+        }
+      ]
+      // return console.log(data);
+      updateRecordData(data).then(res => {
+        console.log(res)
+        if (res === 1) {
+          this.$toast({
+            message: '修改成功',
+            type: 'success'
+          })
+          setTimeout(() => {
+            if (this.$route.query.ser || 0) {
+              this.$router.replace(`/searchstuDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            } else {
+              this.$router.replace(`/studentDetail?cid=${this.$route.query.cid}&cName=${this.$route.query.CName}`)
+            }
+          }, 1000)
+        }
+      })
+    },
+    // 填写页面数据
+    getRecord() {
+      const data = {
+        id: this.$route.query.rid
+      }
+      // console.log('getRecord', this.$route.query.rid)
+      selectRecordDetail(data).then(res => {
+        console.log('获取单个学生记录详情', res[0][0])
+        const allData = res[0][0]
+        if (allData.recordImg !== '' && !allData.contact) {
+          this.selectSData = allData.contact.split(',')
+        }
+        this.selectWData = allData.type.split(',')
+        this.visitTime = allData.recordDate
+        this.place = allData.place
+        this.recordCon = allData.recordCon
+        this.observeCon = allData.recordTit
+        this.recordCon = allData.recordContent
+        if (allData.recordImg !== '' && !allData.recordImg) {
+          this.imgList = allData.recordImg.split(',')
+        }
+        this.termData = [allData.term]
+
+        console.log('selectWData', this.selectWData)
+      })
+    },
+
+    onConfirm() {
+      this.showPicker = false
+
+      // this.currentDate是选中的时间，赋值给date
+      var date = this.currentDate
+      var seperator1 = '-'
+      var seperator2 = ':'
+      var month = date.getMonth() + 1
+      var strDate = date.getDate()
+      if (month >= 1 && month <= 9) {
+        month = '0' + month
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = '0' + strDate
+      }
+      var h = date
+        .getHours()
+        .toString()
+        .padStart(2, '0')
+      var m = date
+        .getMinutes()
+        .toString()
+        .padStart(2, '0')
+
+      this.currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + ' ' + h + seperator2 + m
+
+      // 把格式化后的日期赋值给visitTime，就会显示到页面
+      this.visitTime = this.currentdate
+    },
+    cancel() {
+      this.showPicker = false
+      this.currentDate = new Date()
+    },
+    choseTime() {
+      this.showPicker = true
+      // 日期选择的最小日期
+      this.minDate = new Date(2020, 0, 1)
+      // 日期选择的最大日期
+      this.maxDate = new Date(2099, 11, 1)
+    }
+  },
+  watch: {
+    selectWData(val) {
+      // console.log('val', val)
+      if (val.length === 0) {
+        this.wei = true
+      } else {
+        this.wei = false
+      }
+    },
+    termData(val) {
+      if (val === '') {
+        this.term = true
+      } else {
+        this.term = false
+      }
+    },
+    visitTime(val) {
+      console.log('val', val)
+      if (val === '') {
+        this.tim = true
+      } else {
+        this.tim = false
+      }
+    }
+  },
+
+  created() {
+    // 是否显示分享和继续记录按钮。添加按钮进来不显示
+    this.shareShow = this.$route.query.shareShow * 1
+    console.log(this.shareShow)
+    if (this.$route.query.shareShow * 1 === 1) {
+      // console.log('aaaaaaaaaaaaaaaaaaaaa')
+      this.getRecord()
+    }
+    this.getData()
+    // console.log(this.$route.query)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.studentEvaluate {
+  font-size: 14px;
+  z-index: 1;
+  // min-height: 100vh;
+  background-image: linear-gradient(to bottom, #005ccd 1%, #005ccd 12%, #f6f5f8 35%, #f6f5f8 100%);
+  .rl {
+    position: absolute;
+    top: 50%;
+    transform: translate(0, -50%);
+    right: 0px;
+    width: 25px;
+    height: 25px;
+  }
+  .bigBlock {
+    width: 90%;
+    margin: 0 auto;
+    margin-top: 10px;
+    background-color: #fff;
+    border-radius: 15px;
+    position: relative;
+    z-index: 1;
+    // scroll-behavior: auto;
+    overflow-y: scroll;
+    box-sizing: border-box;
+    padding: 10px;
+  }
+  // 弹窗样式
+  .mask {
+    position: absolute;
+    top: 45%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 80%;
+    height: 169.42px;
+    border-radius: 8px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    text-align: center;
+    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
+    font-family: Roboto;
+    display: flex;
+    flex-direction: column;
+    .maskTit {
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+    .maskCon {
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+    .maskBtn {
+      width: 100%;
+      height: 50px;
+      display: flex;
+      .btn {
+        width: 50%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+  .claName {
+    width: 100%;
+    min-height: 40px;
+    margin: 7px auto;
+    color: #101010;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .tit {
+      width: 40px;
+      min-height: 40px;
+      display: flex;
+      align-items: center;
+    }
+    .studentName {
+      flex: 1;
+      width: 100%;
+      min-height: 40px;
+      line-height: 40px;
+      // display: flex;
+      // align-items: center;
+      border-bottom: 1px solid #e7e7e7;
+    }
+    .studentName2 {
+      flex: 1;
+      width: 100%;
+      min-height: 40px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid #e7e7e7;
+    }
+    /deep/ .van-cell {
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      border: none;
+      flex: 1;
+    }
+    .shareBtn {
+      width: 80px;
+      height: 30px;
+      line-height: 30px;
+      border-radius: 4px;
+      background-color: rgba(164, 173, 179, 1);
+      color: rgba(255, 255, 255, 1);
+      font-size: 14px;
+      text-align: center;
+      font-family: Microsoft Yahei;
+    }
+    .inpBlock {
+      // border: 1px solid rgba(187, 187, 187, 1);
+      height: 100%;
+      flex: 1;
+      .inp {
+        box-sizing: border-box;
+        height: 100%;
+        border: none;
+        margin: 0;
+        padding: 0 5px;
+        outline: none;
+        width: 100%;
+      }
+    }
+  }
+  .student {
+    height: 30px;
+    line-height: 30px;
+    display: flex;
+    justify-content: space-between;
+    .studentName {
+      width: 35%;
+      flex-shrink: 0;
+      color: rgba(0, 0, 0, 0.9);
+      font-family: Microsoft YaHei;
+      font-size: 28px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 40px; /* 142.857% */
+      border-bottom: 1px solid #e7e7e7;
+    }
+    .relevanceStudent {
+      flex: 1;
+      display: flex;
+      .relevanceName {
+        width: 70px;
+      }
+    }
+  }
+  //   观察记录
+  .EvaluateTxt {
+    box-sizing: border-box;
+    padding: 10px;
+    height: 137px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    color: rgba(16, 16, 16, 1);
+    font-size: 14px;
+    font-family: Roboto;
+    border-radius: 10px;
+    border: 1px solid #dcdcdc;
+  }
+  //   上传图片
+  .uploadImgTit {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    box-sizing: border-box;
+    align-items: center;
+    padding: 15px 0px;
+    padding-bottom: 0;
+    color: rgba(0, 0, 0, 0.7);
+    font-family: Microsoft YaHei;
+  }
+  .uploadImg {
+    width: 100%;
+    // border-bottom: 1px solid rgba(245, 245, 245, 1);
+    .imgCon {
+      margin: 10px 0px;
+      margin-right: 3%;
+      width: 74.46px;
+      height: 66.13px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: 3px;
+      background-color: rgba(255, 255, 255, 1);
+      color: rgba(16, 16, 16, 1);
+      font-size: 14px;
+      text-align: center;
+      font-family: Roboto;
+      border: 2px solid rgba(242, 241, 242, 1);
+    }
+  }
+
+  //   按钮
+  .submitBtn {
+    width: 100%;
+    height: 70px;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0px 20px;
+    .btn {
+      display: inline-flex;
+      padding: 4px 5px;
+      margin-left: 5px;
+      border-radius: 6px;
+      background: #0061ff;
+      color: rgba(255, 255, 255, 1);
+    }
+  }
+  //继续记录
+  .continueXie {
+    width: 345px;
+    height: 47px;
+    line-height: 47px;
+    border-radius: 4px;
+    background-color: rgba(164, 173, 179, 1);
+    color: rgba(255, 255, 255, 1);
+    font-size: 14px;
+    text-align: center;
+    font-family: Microsoft Yahei;
+  }
+  .recordTime {
+    display: flex;
+    height: 30px;
+    align-items: center;
+    /deep/ .van-cell {
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      align-items: center;
+      border: none;
+      // width: 200px;
+      flex: 1;
+      // background-color: aqua;
+    }
+    /deep/.van-field__label {
+      width: 32px;
+    }
+    .tit {
+      width: 43.2px;
+    }
+    .cell {
+      flex: 1;
+      height: 30px;
+      border: 1px solid rgba(187, 187, 187, 1);
+    }
+  }
+}
+</style>