|
|
@@ -12,6 +12,7 @@
|
|
|
</div>
|
|
|
<div class="cla">{{ studentInfo.cname }}</div>
|
|
|
<!-- <div class="shade"></div> -->
|
|
|
+ <!-- 遮罩层 -->
|
|
|
<div class="backPage" v-if="isSelectShow" @click="fuClick1"></div>
|
|
|
|
|
|
<selectStyle
|
|
|
@@ -23,11 +24,11 @@
|
|
|
:choose="termData"
|
|
|
></selectStyle>
|
|
|
|
|
|
- <div class="dataNum">本学期共计{{ TermRecord.length }} 条记录</div>
|
|
|
+ <div class="dataNum">本学期共计{{ conList.length }} 条记录</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="rig">
|
|
|
- <div class="topBtnS">
|
|
|
+ <div class="topBtnS" v-if="this.stuList.length">
|
|
|
<div>
|
|
|
<img class="img" v-if="num" @click="upStu" src="../../assets/images/eva/lefttt.png" alt="" />
|
|
|
</div>
|
|
|
@@ -61,25 +62,19 @@
|
|
|
@click="addFil(i.id, index)"
|
|
|
:class="{ active: activeItem === index }"
|
|
|
:key="index"
|
|
|
- @touchstart="touchStart(index)"
|
|
|
- @touchend="touchend(index)"
|
|
|
- @touchmove="gtouchmove()"
|
|
|
>
|
|
|
+ <!-- @touchstart="touchStart(index)" -->
|
|
|
+ <!-- @touchend="touchend(index)" -->
|
|
|
+ <!-- @touchmove="gtouchmove()" -->
|
|
|
<div class="txt">{{ i.name }}</div>
|
|
|
- <div ref="loop" class="loopList">
|
|
|
+ <!-- <div ref="loop" class="loopList">
|
|
|
{{ i.name }}
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
<!-- </div> -->
|
|
|
</div>
|
|
|
<!-- 观察内容开始 -->
|
|
|
- <van-swipe-cell
|
|
|
- :swipeable="true"
|
|
|
- v-show="conList.length"
|
|
|
- v-for="(i, index) in conList"
|
|
|
- :key="index"
|
|
|
- @touchmove.stop="handleTouchMove"
|
|
|
- >
|
|
|
+ <van-swipe-cell :swipeable="true" v-show="TermRecord.length" v-for="(i, index) in TermRecord" :key="index">
|
|
|
<div class="observe_content" @click.stop="recordContinue(i.rid)">
|
|
|
<div class="observe_contentTit">
|
|
|
<!-- {{ i.recordTit }} -->
|
|
|
@@ -100,8 +95,8 @@
|
|
|
<!-- <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">
|
|
|
+ <div v-show="!TermRecord.length" style="width: 100%;height: 10px;background-color: #F0F2F5;"></div>
|
|
|
+ <div v-show="!TermRecord.length" class="observe_content observe_content2">
|
|
|
<img src="../../assets//images/eva/rqq.png" alt="" />
|
|
|
<div class="tit">暂无内容</div>
|
|
|
<div class="tit2" @click="addRecord">快去添加新记录吧 ></div>
|
|
|
@@ -155,8 +150,10 @@ export default {
|
|
|
// 遮罩层
|
|
|
isSelectShow: false,
|
|
|
|
|
|
+ termId: '',
|
|
|
+
|
|
|
activeItem: null,
|
|
|
- // 观察记录数组
|
|
|
+ // 这个是本学期总条数,单独写一个是因为他不因为观察记录的选择而改变
|
|
|
conList: [],
|
|
|
// 筛选项
|
|
|
filtrate: [],
|
|
|
@@ -170,6 +167,8 @@ export default {
|
|
|
stuList: [],
|
|
|
// 学生id
|
|
|
stuId: '',
|
|
|
+ classId: '',
|
|
|
+
|
|
|
// 传参班级数据
|
|
|
classInfo: this.$route.query,
|
|
|
num: null,
|
|
|
@@ -181,7 +180,7 @@ export default {
|
|
|
termList: [],
|
|
|
termData: [],
|
|
|
|
|
|
- // 学期记录条数
|
|
|
+ // 记录渲染数据
|
|
|
TermRecord: [],
|
|
|
|
|
|
timeOutEvent: 0,
|
|
|
@@ -189,58 +188,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- handleTouchMove(event) {
|
|
|
- event.preventDefault()
|
|
|
- },
|
|
|
- touchStart(e) {
|
|
|
- this.timeOutEvent = setTimeout(() => {
|
|
|
- this.timeOutEvent = 0
|
|
|
- const target = this.$refs.loop[e]
|
|
|
- target.style.display = 'block'
|
|
|
- if (e % 4 !== 0) {
|
|
|
- console.log(0)
|
|
|
- target.style.right = '0'
|
|
|
- }
|
|
|
- }, 500)
|
|
|
- return false
|
|
|
- },
|
|
|
- // 如果手指有移动,则取消所有事件,此时说明用户只是要移动而不是长按
|
|
|
- gtouchmove() {
|
|
|
- clearTimeout(this.timeOutEvent) // 清除定时器
|
|
|
- this.timeOutEvent = 0
|
|
|
- // alert('取消了')
|
|
|
- },
|
|
|
- touchend(e) {
|
|
|
- // 清除定时器
|
|
|
-
|
|
|
- clearTimeout(this.timeOutEvent)
|
|
|
- console.log(this.timeOutEvent)
|
|
|
- if (this.timeOutEvent !== 0) {
|
|
|
- // 这里写要执行的内容(尤如onclick事件)
|
|
|
- console.log('你这是点击,不是长按')
|
|
|
- } else {
|
|
|
- setTimeout(() => {
|
|
|
- const target = this.$refs.loop[e]
|
|
|
- target.style.display = 'none'
|
|
|
- }, 1000)
|
|
|
- }
|
|
|
- },
|
|
|
- // 获取基础数据
|
|
|
+ // 获取学生信息
|
|
|
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
|
|
|
}
|
|
|
@@ -249,7 +198,13 @@ export default {
|
|
|
this.studentInfo = res[0][0]
|
|
|
console.log('获取学生信息', this.studentInfo)
|
|
|
})
|
|
|
- // 获取所有学生记录
|
|
|
+
|
|
|
+ // 获取所有学生记录总条数
|
|
|
+ this.selectCordS()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取学期记录总条数
|
|
|
+ selectCordS() {
|
|
|
const data4 = {
|
|
|
uid: this.stuId,
|
|
|
trm: this.termData[0],
|
|
|
@@ -260,8 +215,10 @@ export default {
|
|
|
console.log('获取所有学生记录', res[0])
|
|
|
this.conList = res[0]
|
|
|
})
|
|
|
+ },
|
|
|
|
|
|
- // 获取筛选框
|
|
|
+ // 获取筛选框
|
|
|
+ selectVei() {
|
|
|
const data3 = {
|
|
|
oid: this.$store.state.user.userinfo.organizeid
|
|
|
}
|
|
|
@@ -269,13 +226,31 @@ export default {
|
|
|
this.filtrate = res[0]
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
+ // 获取班学生列表
|
|
|
+ getStuList() {
|
|
|
+ this.stuList = []
|
|
|
+ const data2 = {
|
|
|
+ cid: this.classId
|
|
|
+ }
|
|
|
+ selectClassStudent(data2).then(res => {
|
|
|
+ res[0].forEach(e => {
|
|
|
+ this.stuList.push(e.id)
|
|
|
+ })
|
|
|
+ console.log('获取班学生列表', this.stuList)
|
|
|
+ // 查询学生在数组中的位置
|
|
|
+ this.num = this.stuList.indexOf(this.stuId)
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取学期筛选框
|
|
|
selTerm() {
|
|
|
- // 获取学期筛选框
|
|
|
selectTerm().then(res => {
|
|
|
- console.log('获取学期筛选框', res)
|
|
|
+ // console.log('获取学期筛选框', res)
|
|
|
res[0].forEach(e => {
|
|
|
if (e.defaultC === 1) {
|
|
|
this.termData.push(e.id)
|
|
|
+ this.termId = e.id
|
|
|
}
|
|
|
})
|
|
|
// console.log('this.termData', this.termData)
|
|
|
@@ -283,6 +258,12 @@ export default {
|
|
|
this.getData()
|
|
|
this.getTermRecord()
|
|
|
|
|
|
+ // 获取左右切换的学生列表
|
|
|
+ // console.log('this.classId', this.classId)
|
|
|
+ if (this.classId) {
|
|
|
+ this.getStuList()
|
|
|
+ }
|
|
|
+
|
|
|
// console.log('this.termList', this.termList)
|
|
|
})
|
|
|
},
|
|
|
@@ -290,56 +271,44 @@ export default {
|
|
|
upStu() {
|
|
|
// 判断学生在数组中的位置,获取班学生列表有初始值
|
|
|
this.activeItem = null
|
|
|
+ // 刷新学期
|
|
|
+ this.termData.splice(0, 1, this.termId)
|
|
|
|
|
|
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]
|
|
|
- })
|
|
|
+ this.getTermRecord()
|
|
|
// 更新学生信息
|
|
|
selectStudentDetail({ uid: this.stuId }).then(res => {
|
|
|
this.studentInfo = res[0][0]
|
|
|
})
|
|
|
- this.getTermRecord()
|
|
|
}
|
|
|
+ this.selectCordS()
|
|
|
},
|
|
|
// 下一个
|
|
|
nextStu() {
|
|
|
this.activeItem = null
|
|
|
+ // 刷新学期
|
|
|
+ this.termData.splice(0, 1, this.termId)
|
|
|
|
|
|
this.num = this.num + 1
|
|
|
if (this.num <= this.stuList.length - 1) {
|
|
|
this.stuId = this.stuList[this.num]
|
|
|
+ // console.log(this.stuId)
|
|
|
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]
|
|
|
- })
|
|
|
+
|
|
|
+ this.getTermRecord()
|
|
|
|
|
|
selectStudentDetail({ uid: this.stuId }).then(res => {
|
|
|
this.studentInfo = res[0][0]
|
|
|
console.log(this.studentInfo)
|
|
|
})
|
|
|
- this.getTermRecord()
|
|
|
}
|
|
|
+ this.selectCordS()
|
|
|
},
|
|
|
- // 删除弹框显示
|
|
|
+ // 左滑动删除弹框显示
|
|
|
delPop(e) {
|
|
|
this.delRid = e
|
|
|
this.isShowMask = true
|
|
|
@@ -380,65 +349,97 @@ export default {
|
|
|
this.activeItem = index
|
|
|
}
|
|
|
|
|
|
- // this.fil.push(e)
|
|
|
const data4 = {
|
|
|
- uid: localStorage.getItem('userId'),
|
|
|
+ uid: this.stuId,
|
|
|
trm: this.termData[0],
|
|
|
txt: e
|
|
|
}
|
|
|
- console.log(data4)
|
|
|
+ // console.log(data4)
|
|
|
selectRecord(data4).then(res => {
|
|
|
console.log('获取所有学生记录', res)
|
|
|
- this.conList = res[0]
|
|
|
+ this.TermRecord = res[0]
|
|
|
})
|
|
|
},
|
|
|
+ // 父组件调用子组件方法,选择学期后关闭select框
|
|
|
fuClick1() {
|
|
|
this.isSelectShow = false
|
|
|
+ this.selectCordS()
|
|
|
this.$refs.claSel.close()
|
|
|
},
|
|
|
|
|
|
- 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]
|
|
|
- })
|
|
|
- },
|
|
|
+ // 子组件调用父组件方法显示遮罩层
|
|
|
shadeIsShow() {
|
|
|
this.isSelectShow = true
|
|
|
},
|
|
|
- handleUpdateSearch(e) {
|
|
|
- // console.log('前', this.isSelectShow)
|
|
|
+ // 子组件调用父组件,进行学期查询
|
|
|
+ handleUpdateSearch() {
|
|
|
this.isSelectShow = false
|
|
|
- // console.log('后', this.isSelectShow)
|
|
|
- // console.log(e)
|
|
|
- // 获取筛选学期所有学生记录
|
|
|
+ this.getTermRecord()
|
|
|
+ this.selectCordS()
|
|
|
+ },
|
|
|
+ // 获取所有学生记录
|
|
|
+ getTermRecord() {
|
|
|
const data4 = {
|
|
|
uid: this.stuId,
|
|
|
trm: this.termData[0],
|
|
|
txt: ''
|
|
|
}
|
|
|
- // console.log('data4', data4)
|
|
|
+ console.log(' 获取所有学生记录aaaaaaaaaaaaaaaaaaaaaaa', data4)
|
|
|
selectRecord(data4).then(res => {
|
|
|
- console.log('获取所有学生记录', res[0])
|
|
|
- this.conList = res[0]
|
|
|
+ console.log('获取所有学生记录', res)
|
|
|
+ this.TermRecord = res[0]
|
|
|
})
|
|
|
- this.getTermRecord()
|
|
|
},
|
|
|
// 添加记录按钮跳转
|
|
|
addRecord() {
|
|
|
- this.$router.push(`/studentEvaluate?shareShow=${0}&cid=${this.$route.query.cid}`)
|
|
|
+ // this.$router.push(`/studentEvaluate?shareShow=${0}&cid=${this.$route.query.cid}`)
|
|
|
+ this.$router.push(`/studentEvaluate?shareShow=${0}`)
|
|
|
},
|
|
|
// 已经写过的记录卡片点击跳转
|
|
|
recordContinue(e) {
|
|
|
- this.$router.push(`/studentEvaluate?shareShow=${1}&rid=${e}&cid=${this.$route.query.cid}`)
|
|
|
+ // this.$router.push(`/studentEvaluate?shareShow=${1}&rid=${e}&cid=${this.$route.query.cid}`)
|
|
|
+ this.$router.push(`/studentEvaluate?shareShow=${1}&rid=${e}`)
|
|
|
}
|
|
|
+ // touchStart(e) {
|
|
|
+ // this.timeOutEvent = setTimeout(() => {
|
|
|
+ // this.timeOutEvent = 0
|
|
|
+ // const target = this.$refs.loop[e]
|
|
|
+ // target.style.display = 'block'
|
|
|
+ // if (e % 4 !== 0) {
|
|
|
+ // console.log(0)
|
|
|
+ // target.style.right = '0'
|
|
|
+ // }
|
|
|
+ // }, 500)
|
|
|
+ // return false
|
|
|
+ // },
|
|
|
+ // // 如果手指有移动,则取消所有事件,此时说明用户只是要移动而不是长按
|
|
|
+ // gtouchmove() {
|
|
|
+ // clearTimeout(this.timeOutEvent) // 清除定时器
|
|
|
+ // this.timeOutEvent = 0
|
|
|
+ // // alert('取消了')
|
|
|
+ // },
|
|
|
+ // touchend(e) {
|
|
|
+ // // 清除定时器
|
|
|
+
|
|
|
+ // clearTimeout(this.timeOutEvent)
|
|
|
+ // console.log(this.timeOutEvent)
|
|
|
+ // if (this.timeOutEvent !== 0) {
|
|
|
+ // // 这里写要执行的内容(尤如onclick事件)
|
|
|
+ // console.log('你这是点击,不是长按')
|
|
|
+ // } else {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // const target = this.$refs.loop[e]
|
|
|
+ // target.style.display = 'none'
|
|
|
+ // }, 1000)
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+
|
|
|
+ // selectRecord(data4).then(res => {
|
|
|
+ // console.log('获取所有学生记录', res[0])
|
|
|
+ // this.conList = res[0]
|
|
|
+ // })
|
|
|
+ // // this.getTermRecord()
|
|
|
+ // },
|
|
|
},
|
|
|
beforeRouteEnter(to, from, next) {
|
|
|
document.addEventListener(
|
|
|
@@ -453,7 +454,11 @@ export default {
|
|
|
mounted() {},
|
|
|
created() {
|
|
|
this.stuId = localStorage.getItem('userId')
|
|
|
+ this.classId = localStorage.getItem('classId')
|
|
|
+ console.log(this.classId)
|
|
|
this.selTerm()
|
|
|
+ // 获取筛选框
|
|
|
+ this.selectVei()
|
|
|
// console.log('this.$route.query', this.$route.query)
|
|
|
}
|
|
|
}
|
|
|
@@ -675,29 +680,32 @@ export default {
|
|
|
|
|
|
.observe_boxCon {
|
|
|
position: relative;
|
|
|
- width: calc(100% / 4 - (5px * 3));
|
|
|
+ // width: calc(100% / 4 - (5px * 3));
|
|
|
// width: calc(100% / 5);
|
|
|
+ width: auto;
|
|
|
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;
|
|
|
- box-sizing: border-box;
|
|
|
border: 1px solid rgba(231, 231, 231, 1);
|
|
|
margin-bottom: 8px;
|
|
|
- margin-right: 20px;
|
|
|
+ margin-right: 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 5px 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
.txt {
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
}
|
|
|
- .observe_boxCon:nth-child(4n) {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
+ // .observe_boxCon:nth-child(4n) {
|
|
|
+ // margin-right: 0;
|
|
|
+ // }
|
|
|
.active {
|
|
|
background-color: #e0eafb;
|
|
|
color: #0061ff;
|