修改页面
This commit is contained in:
libowei
parent
af0a8ee6ea
commit
78f5e329b9
|
|
@ -26,7 +26,7 @@
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="addclass">
|
<view class="addclass" @click="create()">
|
||||||
+ {{ checkindex == "0" ? "创建班级" : '添加学生' }}
|
+ {{ checkindex == "0" ? "创建班级" : '添加学生' }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -181,6 +181,53 @@
|
||||||
确定添加（1）
|
确定添加（1）
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<!-- 弹出层 -->
|
||||||
|
<u-popup v-model="show" mode="bottom" length="75%" :safe-area-inset-bottom='true' :closeable="true" :duration="300">
|
||||||
|
<view class="pop-up">
|
||||||
|
<view class="caption">创建班级</view>
|
||||||
|
<!-- 班级图像 -->
|
||||||
|
<view style="margin-top: 16rpx;">
|
||||||
|
<view class="caption_top">班级头像</view>
|
||||||
|
<view style="width: 112rpx; height: 112rpx; position: relative;">
|
||||||
|
<image src="http://tmp/8D3SdarqBJPA14a79bffdaa7e81aa0b93c1ef2173bcd.png" mode=""></image>
|
||||||
|
<view class="dashboard">
|
||||||
|
<image src="http://tmp/GqjTUH3Ahh770a1353bd35d1ebfdd80316b5cf6136ff.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 班级名称 -->
|
||||||
|
<view>
|
||||||
|
<view class="caption_top">班级名称</view>
|
||||||
|
<view class="caption_input">
|
||||||
|
<u-input v-model="designation" :type="type" :border="border" placeholder="请输入班级名称"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 班级标签 -->
|
||||||
|
<view>
|
||||||
|
<view class="caption_top">班级标签</view>
|
||||||
|
<view class="caption_input">
|
||||||
|
<u-input v-model="labels" :type="type" :border="border" placeholder="请输入班级名称"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 班级学生 -->
|
||||||
|
<view class="caption_class">
|
||||||
|
<view style="display: flex; align-items: center;">
|
||||||
|
<view>班级学生</view>
|
||||||
|
<view class="caption_top_links">点击头像选择班级学员</view>
|
||||||
|
</view>
|
||||||
|
<u-upload del-icon="close" deletable="false"></u-upload>
|
||||||
|
</view>
|
||||||
|
<!-- 班级老师 -->
|
||||||
|
<view class="caption_class">
|
||||||
|
<view style="display: flex; align-items: center;">
|
||||||
|
<view>班级老师</view>
|
||||||
|
<view class="caption_top_links">点击头像选择班级老师</view>
|
||||||
|
</view>
|
||||||
|
<u-upload del-icon="close" deletable="false"></u-upload>
|
||||||
|
</view>
|
||||||
|
<view class="caption_add">添加</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -189,6 +236,12 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
title: '添加班级',
|
title: '添加班级',
|
||||||
|
// 班级名称数据绑定
|
||||||
|
designation:'',
|
||||||
|
// 班级标签数据绑定
|
||||||
|
labels:'',
|
||||||
|
// 弹出层的变量
|
||||||
|
show: false,
|
||||||
bgc: {
|
bgc: {
|
||||||
backgroundColor: "#F6F9FC",
|
backgroundColor: "#F6F9FC",
|
||||||
},
|
},
|
||||||
|
|
@ -196,12 +249,28 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 创建班级点击事件
|
||||||
|
create(){
|
||||||
|
this.show = !this.show
|
||||||
|
console.log('111')
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .u-add-wrap {
|
||||||
|
width: 96rpx !important;
|
||||||
|
height: 96rpx !important;
|
||||||
|
background: #FFFFFF !important;
|
||||||
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||||
|
border: 2rpx solid #DDE2EE;
|
||||||
|
.u-add-tips{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
page {
|
page {
|
||||||
background: #F6F9FC;
|
background: #F6F9FC;
|
||||||
}
|
}
|
||||||
|
|
@ -496,4 +565,59 @@ page {
|
||||||
border-radius: 104rpx 104rpx 104rpx 104rpx;
|
border-radius: 104rpx 104rpx 104rpx 104rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}</style>
|
}
|
||||||
|
.pop-up{
|
||||||
|
padding: 30rpx 32rpx;
|
||||||
|
.caption{
|
||||||
|
font-size: 36rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 800;
|
||||||
|
color: #2E4975;
|
||||||
|
padding-top: 20rpx;
|
||||||
|
}
|
||||||
|
.caption_top{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: 'PingFang';
|
||||||
|
color: #2E4975;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
}
|
||||||
|
.dashboard{
|
||||||
|
position: absolute;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
.caption_input{
|
||||||
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||||
|
border: 2rpx solid #DDE2EE;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
}
|
||||||
|
.caption_top_links{
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-family: 'PingFang';
|
||||||
|
font-weight: 500;
|
||||||
|
color: #2D7CE6;
|
||||||
|
}
|
||||||
|
.element.style{
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
.u-list-item u-add-wrap {
|
||||||
|
width: 62rpx !important;
|
||||||
|
}
|
||||||
|
.caption_add{
|
||||||
|
width: 93.1%;
|
||||||
|
background: #2D7CE6;
|
||||||
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 24rpx 0;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
}
|
||||||
|
.caption_class{
|
||||||
|
margin-top: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -9,14 +9,14 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="substance">
|
<view class="substance">
|
||||||
<!-- 渲染Text -->
|
<!-- 渲染Text -->
|
||||||
<text :class="{ 'active': itemActive[item.id] === TextIndex || TextIndex ==0 }" v-for="(TextItem,TextIndex) in item.tests"
|
<text :class="{ 'active': itemActive[item.id] === TextIndex }" v-for="(TextItem,TextIndex) in item.tests" :key="TextIndex"
|
||||||
:key="TextIndex" @click="Bages_addActive(TextIndex,item.id) ">
|
@click="Bages_addActive(TextIndex,item.id) ">
|
||||||
{{TextItem.name}}
|
{{TextItem.name}}
|
||||||
</text>
|
</text>
|
||||||
</view>
|
</view>
|
||||||
<!-- 渲染part -->
|
<!-- 渲染part -->
|
||||||
<view v-for="(TextItem,TextIndex) in item.tests" :key="TextIndex">
|
<view v-for="(TextItem,TextIndex) in item.tests" :key="TextIndex">
|
||||||
<view v-for="(partitem,partindex) in TextItem.parts" :key="partindex" v-if="itemActive[item.id] === TextIndex || TextIndex===0">
|
<view v-for="(partitem,partindex) in TextItem.parts" :key="partindex" v-if="itemActive[item.id] === TextIndex">
|
||||||
<view>
|
<view>
|
||||||
<view class="Part1">
|
<view class="Part1">
|
||||||
<view class="imaflex" @click="icon(partitem.id)">
|
<view class="imaflex" @click="icon(partitem.id)">
|
||||||
|
|
@ -71,16 +71,23 @@
|
||||||
methods: {
|
methods: {
|
||||||
// 听力调取接口渲染
|
// 听力调取接口渲染
|
||||||
hearing() {
|
hearing() {
|
||||||
this.$u.get('https://api.admin-v2.langsi.online/admin-api/ielts/paper/list', {classify: 1}).then(res => {
|
this.$u.get('https://api.admin-v2.langsi.online/admin-api/ielts/paper/list', {
|
||||||
|
classify: 1
|
||||||
|
}).then(res => {
|
||||||
this.listHearing = res.data
|
this.listHearing = res.data
|
||||||
|
let activeindex = {}
|
||||||
|
let arr = res.data
|
||||||
|
for (let parper of arr) {
|
||||||
|
let test = parper.tests[0]
|
||||||
|
activeindex[parper.id] = 0
|
||||||
|
}
|
||||||
|
this.itemActive = activeindex
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
// 听力test点击事件
|
// 听力test点击事件
|
||||||
Bages_addActive(TextIndex, id) {
|
Bages_addActive(TextIndex, id) {
|
||||||
this.itemActive[id] = TextIndex
|
this.itemActive[id] = TextIndex
|
||||||
this.$forceUpdate()
|
this.$forceUpdate()
|
||||||
|
|
||||||
},
|
},
|
||||||
// 点击变化图表
|
// 点击变化图表
|
||||||
icon(id) {
|
icon(id) {
|
||||||
|
|
@ -98,7 +105,6 @@
|
||||||
if (index !== -1) {
|
if (index !== -1) {
|
||||||
this.checked.splice(index, 1);
|
this.checked.splice(index, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
console.log(this.checked)
|
console.log(this.checked)
|
||||||
this.$forceUpdate()
|
this.$forceUpdate()
|
||||||
|
|
|
||||||
|
|
@ -9,31 +9,27 @@
|
||||||
<view v-for="(item,index) in options" :key="index" @click="arrow_options(item.id)">{{item.name}}</view>
|
<view v-for="(item,index) in options" :key="index" @click="arrow_options(item.id)">{{item.name}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="view_left_pd" @click="arrow_xl2">
|
|
||||||
{{categorize}}
|
|
||||||
<u-icon name="arrow-down" size="22" class="pd_icon"></u-icon>
|
|
||||||
<view class="pull_DownTow" v-if="arrowDown">
|
|
||||||
<view v-for="(item,index) in options2 " :key="index" @click="Classification(item.id)">{{item.name}}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
<!-- 口语主体 -->
|
<!-- 口语主体 -->
|
||||||
<view v-for="(item,index) in slander" :key="index">
|
<view v-for="(item,index) in slander" :key="index">
|
||||||
<view class="view_inuygs">
|
<view class="view_inuygs">
|
||||||
<view class="header_part">
|
<view class="header_part">
|
||||||
<view class="unite">{{selectedOption}}</view>
|
|
||||||
<view class="unite">{{item.label}}</view>
|
<view class="unite">{{item.label}}</view>
|
||||||
</view>
|
</view>
|
||||||
<view style="display: flex;">
|
|
||||||
<view class="slander_an">串题</view>
|
|
||||||
<view class="slander_an blue">跟读</view>
|
|
||||||
<view class="slander_an blue">模考</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
<view v-for="(items,indexs) in item.list" :key='indexs'>
|
||||||
|
<!-- 白色大背景边框 -->
|
||||||
<view class="slander_for">
|
<view class="slander_for">
|
||||||
<view class="slander_behavior" v-for="(items,indexs) in item.list" :key='indexs'>
|
<view class="textual">
|
||||||
<view class="slander_left">{{items.topicEn}}</view>
|
{{items.topicEn}}
|
||||||
</view>
|
</view>
|
||||||
|
<view class="bottom_one">
|
||||||
|
<view>串题</view>
|
||||||
|
<view>跟读</view>
|
||||||
|
<view>模考</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -74,16 +70,6 @@
|
||||||
name:'Part2'
|
name:'Part2'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
options2:[
|
|
||||||
{
|
|
||||||
id:1,
|
|
||||||
name:'环境类'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id:2,
|
|
||||||
name:'学习类'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|
@ -123,15 +109,7 @@
|
||||||
this.getList()
|
this.getList()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
}
|
||||||
// 下拉然后更新里面的值
|
|
||||||
Classification(id){
|
|
||||||
this.options2.forEach(item=>{
|
|
||||||
if(item.id == id){
|
|
||||||
this.categorize =item.name
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -165,36 +143,6 @@
|
||||||
color: #2E4975;
|
color: #2E4975;
|
||||||
|
|
||||||
margin-right: 20rpx;
|
margin-right: 20rpx;
|
||||||
}
|
|
||||||
.slander_for {
|
|
||||||
background: #FFFFFF;
|
|
||||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
||||||
padding: 0 30rpx;
|
|
||||||
}
|
|
||||||
.slander_behavior {
|
|
||||||
|
|
||||||
padding: 20rpx 0rpx;
|
|
||||||
border-bottom: 2rpx solid #F2F2F2;
|
|
||||||
}
|
|
||||||
.slander_left {
|
|
||||||
|
|
||||||
}
|
|
||||||
.pull_DownTow{
|
|
||||||
width: 150rpx;
|
|
||||||
position: absolute;
|
|
||||||
bottom: -133rpx;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -72rpx;
|
|
||||||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0,0,0,0.25);
|
|
||||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
||||||
background: #FFFFFF;
|
|
||||||
border-bottom: 2rpx solid #F2F2F2;
|
|
||||||
text-align: center;
|
|
||||||
view {
|
|
||||||
padding: 15rpx 0rpx;
|
|
||||||
border-bottom: 2rpx solid #F2F2F2;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
.pull_Down {
|
.pull_Down {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -233,4 +181,23 @@
|
||||||
background: rgba(45,124,230,0.1);
|
background: rgba(45,124,230,0.1);
|
||||||
color: #2D7CE6;
|
color: #2D7CE6;
|
||||||
}
|
}
|
||||||
|
.slander_for{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
.textual{
|
||||||
|
width: 290rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
|
||||||
|
}
|
||||||
|
.bottom_one{
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -19,127 +19,8 @@
|
||||||
</swiper-item>
|
</swiper-item>
|
||||||
<!-- 写作 -->
|
<!-- 写作 -->
|
||||||
<swiper-item>
|
<swiper-item>
|
||||||
<view v-for="(item,index) in Compose" :key="item.id">
|
|
||||||
<view class="view_bages">
|
|
||||||
<view class="lelts">{{item.examName}}</view>
|
|
||||||
<text class="Bags active" @click="upType(index,1)">test1</text>
|
|
||||||
<text class="Bags" @click="upType(index,2)">test2</text>
|
|
||||||
<text class="Bags" @click="upType(index,3)">test3</text>
|
|
||||||
<text class="Bags" @click="upType(index,4)">test4</text>
|
|
||||||
</view>
|
|
||||||
<view class="view_fff" v-if="listType[index]===1">
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 1
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
<compose></compose>
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 1
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton" @click="addIdList()">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_fff" v-else-if="listType[index]===2">
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 2
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 2
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_fff" v-else-if="listType[index]===3">
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 3
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 3
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_fff" v-else-if="listType[index]===4">
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 4
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="view_Do">
|
|
||||||
<view class="view_English">
|
|
||||||
<view class="Task">
|
|
||||||
Test 4
|
|
||||||
</view>
|
|
||||||
<view class="grizzly">曲线图</view>
|
|
||||||
<view class="yellow">政府</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="view_pushbutton">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</swiper-item>
|
</swiper-item>
|
||||||
<!--听力 -->
|
<!--听力 -->
|
||||||
<swiper-item>
|
<swiper-item>
|
||||||
|
|
@ -166,6 +47,7 @@
|
||||||
import audiology from './components/audiology.vue'
|
import audiology from './components/audiology.vue'
|
||||||
import reading from './components/reading.vue'
|
import reading from './components/reading.vue'
|
||||||
import slander from './components/slander.vue'
|
import slander from './components/slander.vue'
|
||||||
|
import compose from './components/compose.vue'
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|
@ -202,7 +84,8 @@
|
||||||
components:{
|
components:{
|
||||||
audiology,
|
audiology,
|
||||||
reading,
|
reading,
|
||||||
slander
|
slander,
|
||||||
|
compose
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
upType(index, num) {
|
upType(index, num) {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user