页面渲染 新页面添加
This commit is contained in:
commit
6e590cd865
|
|
@ -41,7 +41,9 @@ const install = (Vue, vm) => {
|
|||
// 方式四，如果token放在了Storage本地存储中，拦截是每次请求都执行的
|
||||
// 所以哪怕您重新登录修改了Storage，下一次的请求将会是最新值
|
||||
// const token = uni.getStorageSync('token');
|
||||
const token = " Bearer a75c44e23b7740c48740c95ae3b7b427"
|
||||
|
||||
const token = " Bearer 8dc2aff0225547d7b9698f8e126a8b10"
|
||||
|
||||
// console.log("我是token", token)
|
||||
config.header.Authorization = token;
|
||||
// config.header.Tenant-Id=1
|
||||
|
|
|
|||
31
pages.json
31
pages.json
|
|
@ -68,16 +68,7 @@
|
|||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/Mystudent/search",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#4473f6",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path" : "pages/Mystudent/classmate",
|
||||
"style" :
|
||||
|
|
@ -127,6 +118,26 @@
|
|||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/Mystudent/addstu",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#4473f6",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/Mystudent/formstu",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#4473f6",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [
|
||||
|
|
|
|||
|
|
@ -18,39 +18,14 @@
|
|||
placeholder-style="color:#C7CDD3 ">
|
||||
</view>
|
||||
<view class="teacher_card_box" >
|
||||
<view class="teacher_card" >
|
||||
|
||||
<view class="teacher_card" v-for="(item,index) in teacherlist" :key="index" >
|
||||
<view class="class_card_left">
|
||||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
张三三老师
|
||||
</view>
|
||||
<view class="class_card_right_bot">
|
||||
听力
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="teacher_card" >
|
||||
<view class="class_card_left">
|
||||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
张三三老师
|
||||
</view>
|
||||
<view class="class_card_right_bot">
|
||||
听力
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="teacher_card" >
|
||||
<view class="class_card_left">
|
||||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
张三三老师
|
||||
{{item.name}}
|
||||
</view>
|
||||
<view class="class_card_right_bot">
|
||||
听力
|
||||
|
|
@ -68,10 +43,28 @@ export default {
|
|||
bgc: {
|
||||
backgroundColor: "#transparent",
|
||||
},
|
||||
classid:0,
|
||||
teacherlist:[]
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
// this.classid=option.id
|
||||
this.classid=15
|
||||
this.getclassteacher()
|
||||
},
|
||||
methods: {
|
||||
|
||||
getclassteacher(){
|
||||
this.$u.get(`https://api.admin-v2.langsi.online/admin-api/classroom/teacher/list?id=${this.classid}`).then(res => {
|
||||
|
||||
|
||||
if (res.code == 0) {
|
||||
this.teacherlist=res.data.list
|
||||
// this.classlist = res.data.list
|
||||
// this.isloding = false
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,300 +0,0 @@
|
|||
<template>
|
||||
<view class="searchpage">
|
||||
<u-navbar title="搜索"
|
||||
:border-bottom="false"
|
||||
:background="bgc"
|
||||
title-color='#2E4975'
|
||||
title-size='36'
|
||||
height='36'></u-navbar>
|
||||
<view class="search_box">
|
||||
<view class="check_search">
|
||||
{{ checkindex == "0" ? "班级" : '学生' }}
|
||||
<view class="iconfont icon-arow_down"></view>
|
||||
</view>
|
||||
<view class="serchbox">
|
||||
<view class="serchimg">
|
||||
<image src="https://file.langsi.online/yasiimg/web/static/uVMACkynkipOxuTYDqm0"
|
||||
mode="scaleToFill">
|
||||
|
||||
</image>
|
||||
</view>
|
||||
<input type="text"
|
||||
placeholder="搜索相关内容..."
|
||||
class="input"
|
||||
placeholder-style="color:#C7CDD3 ">
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="class_box"
|
||||
v-if="checkindex == 1">
|
||||
|
||||
<view class="class_card">
|
||||
<view class="class_card_top">
|
||||
<view class="class_card_left">
|
||||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
雅思1班
|
||||
</view>
|
||||
<view class="class_card_right_bot">
|
||||
标签文字
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_infobox">
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
班级人数
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
21
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
平均成绩/分
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
21
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
作业完成度
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
80%
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_card">
|
||||
<view class="class_card_top">
|
||||
<view class="class_card_left">
|
||||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
雅思1班
|
||||
</view>
|
||||
<view class="class_card_right_bot">
|
||||
标签文字
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_infobox">
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
班级人数
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
21
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
平均成绩/分
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
21
|
||||
</view>
|
||||
</view>
|
||||
<view class="class_info">
|
||||
<view class="class_info_top">
|
||||
作业完成度
|
||||
</view>
|
||||
<view class="class_info_bot">
|
||||
80%
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
bgc: {
|
||||
backgroundColor: "#transparent",
|
||||
},
|
||||
checkindex: 1,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%);
|
||||
}
|
||||
|
||||
.searchpage {
|
||||
width: 750rpx;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.search_box {
|
||||
margin-top: 46rpx;
|
||||
width: 686rpx;
|
||||
height: 88rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.check_search {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 148rpx;
|
||||
height: 88rpx;
|
||||
background: #FFF2E4;
|
||||
border-radius: 20rpx 0rpx 0rpx 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-family:'PingFang','PingFang';
|
||||
font-weight: 500;
|
||||
color: #F39852;
|
||||
|
||||
.icon-arow_down {
|
||||
margin-left: 8rpx;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.serchbox {
|
||||
// padding: 0 32rpx;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
// margin-top: 30rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 538rpx;
|
||||
height: 88rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
|
||||
.serchimg {
|
||||
margin-left: 32rpx;
|
||||
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
|
||||
}
|
||||
|
||||
.input {
|
||||
// margin-left: 24rpx;
|
||||
width: 452rpx;
|
||||
height: 88rpx;
|
||||
// border-radius: 30rpx;
|
||||
// background-color: #f5f8fc;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-items: center;
|
||||
// text-align: center;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN-Light;
|
||||
font-weight: 300;
|
||||
text-align: left;
|
||||
color: #a7b9cd;
|
||||
letter-spacing: 1.2rpx;
|
||||
line-height: 36rpx;
|
||||
// padding: 0 100rpx;
|
||||
// padding-right: 135rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.class_box {
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.class_card {
|
||||
margin-top: 20rpx;
|
||||
width: 686rpx;
|
||||
height: 296rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
padding: 32rpx;
|
||||
|
||||
.class_card_top {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
|
||||
.class_card_left {
|
||||
width: 84rpx;
|
||||
height: 84rpx;
|
||||
}
|
||||
|
||||
.class_card_right {
|
||||
margin-left: 12rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.class_card_right_top {
|
||||
width: 100%;
|
||||
font-size: 32rpx;
|
||||
font-family:'PingFang','PingFang';
|
||||
font-weight: bold;
|
||||
color: #072F5A;
|
||||
}
|
||||
|
||||
.class_card_right_bot {
|
||||
margin-top: 8rpx;
|
||||
background: #EBF3FF;
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
font-size: 20rpx;
|
||||
font-family:'PingFang','PingFang';
|
||||
font-weight: 500;
|
||||
color: #2D7CE6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.class_infobox {
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 622rpx;
|
||||
height: 128rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
|
||||
.class_info {
|
||||
width: 110rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
.class_info_top {
|
||||
font-size: 20rpx;
|
||||
font-family:'PingFang','PingFang';
|
||||
font-weight: 500;
|
||||
color: rgba(7, 47, 90, 0.5);
|
||||
}
|
||||
|
||||
.class_info_bot {
|
||||
margin-top: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-family:'PingFang','PingFang';
|
||||
font-weight: 800;
|
||||
color: #2D7CE6;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}</style>
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
学生人数
|
||||
</view>
|
||||
<view class="info_cont_bot">
|
||||
21
|
||||
{{totalLastNum}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="info_cont">
|
||||
|
|
@ -60,7 +60,7 @@
|
|||
平均成绩/分
|
||||
</view>
|
||||
<view class="info_cont_bot">
|
||||
21
|
||||
{{totalAvgScore }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="info_cont">
|
||||
|
|
@ -68,7 +68,7 @@
|
|||
作业完成度
|
||||
</view>
|
||||
<view class="info_cont_bot">
|
||||
80%
|
||||
{{totalWorkCompletionDegre}}%
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -160,8 +160,8 @@
|
|||
<image src=" https://file.langsi.online/yasiimg/web/static/udWNTRG6GulmTtgPRQ49"></image>
|
||||
</view>
|
||||
<view class="class_card_right">
|
||||
<view class="class_card_right_top">
|
||||
{{ item.name }}
|
||||
<view class="class_card_right_top" v-html="highlightSearch(item.name)">
|
||||
<!-- {{ item.name }} -->
|
||||
</view>
|
||||
<view class="class_card_right_bot"
|
||||
v-show="item.classify == 1">
|
||||
|
|
@ -290,6 +290,9 @@ export default {
|
|||
showtext: false,
|
||||
textindex: 0,
|
||||
searchKeyword: '',
|
||||
totalLastNum:'',
|
||||
totalAvgScore:'',
|
||||
totalWorkCompletionDegre:0,
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
|
|
@ -297,14 +300,22 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
highlightSearch(name) {
|
||||
// 使用正则表达式替换匹配到的 searchKeyword 为带有颜色的文字
|
||||
if (this.searchKeyword) {
|
||||
const regex = new RegExp(this.searchKeyword, 'gi');
|
||||
return name.replace(regex, match => `<span style="color: #2D7CE6 ;">${match}</span>`);
|
||||
}
|
||||
return name;
|
||||
},
|
||||
toclassdetal(item) {
|
||||
console.log('点击了'); // 确保这一行输出
|
||||
|
||||
uni.navigateTo({
|
||||
url: "/pages_teacher/teacher_class/class_detail?id=" + item.id
|
||||
}).then(res => {
|
||||
console.log('跳转成功', res);
|
||||
|
||||
}).catch(err => {
|
||||
console.error('跳转失败', err);
|
||||
|
||||
});
|
||||
},
|
||||
search() {
|
||||
|
|
@ -320,7 +331,7 @@ export default {
|
|||
},
|
||||
calculatePercentage(value1, value2) {
|
||||
if (value2 === 0) {
|
||||
console.log("value2 is zero, cannot calculate percentage");
|
||||
|
||||
return '0%'; // 或者返回其他默认值
|
||||
}
|
||||
|
||||
|
|
@ -348,8 +359,7 @@ export default {
|
|||
|
||||
},
|
||||
fuwei() {
|
||||
console.log(this.classlist, 'this.classlist');
|
||||
console.log(this.changeclasslist, 'this.changeclasslist');
|
||||
|
||||
this.classlist = JSON.parse(JSON.stringify(this.changeclasslist));
|
||||
},
|
||||
changetext() {
|
||||
|
|
@ -378,7 +388,7 @@ export default {
|
|||
return 0; // 保持原有顺序
|
||||
});
|
||||
} else {
|
||||
console.log('调用了');
|
||||
|
||||
this.fuwei();
|
||||
}
|
||||
|
||||
|
|
@ -386,17 +396,40 @@ export default {
|
|||
},
|
||||
getclassList() {
|
||||
this.$u.get("https://api.admin-v2.langsi.online/admin-api/classroom/page").then(res => {
|
||||
console.log(res, '返回成功');
|
||||
|
||||
if (res.code === 0) {
|
||||
this.classlist = res.data.list;
|
||||
this.changeclasslist = JSON.parse(JSON.stringify(this.classlist));
|
||||
this.isloding = false;
|
||||
const list = res.data.list;
|
||||
|
||||
if (list.length > 0) {
|
||||
// 计算 totalMembers 总和
|
||||
const totalMembersSum = list.reduce((sum, item) => sum + item.totalMembers, 0);
|
||||
|
||||
// 计算 workCompletionDegree 平均值
|
||||
const workCompletionDegreeAvg = list.reduce((sum, item) => sum + item.workCompletionDegree, 0) / list.length;
|
||||
|
||||
// 计算 avgScore 平均值
|
||||
const avgScoreAvg = list.reduce((sum, item) => sum + item.avgScore, 0) / list.length;
|
||||
console.log(workCompletionDegreeAvg,'workCompletionDegreeworkCompletionDegree');
|
||||
// 将计算结果赋值给对应的变量
|
||||
this.totalLastNum = totalMembersSum;
|
||||
this.totalWorkCompletionDegre = workCompletionDegreeAvg;
|
||||
this.totalAvgScore = avgScoreAvg;
|
||||
// console.log(this.totalworkCompletionDegree,'totalworkCompletionDegreetotalworkCompletionDegree');
|
||||
} else {
|
||||
// 处理空数组的情况，例如设置默认值或者给出提示
|
||||
this.totalLastNum = 0;
|
||||
this.totalWorkCompletionDegre = 0;
|
||||
this.totalAvgScore = 0;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
getstuList() {
|
||||
this.$u.get("https://api.admin-v2.langsi.online/admin-api/classroom/page").then(res => {
|
||||
console.log(res, '返回成功');
|
||||
|
||||
|
||||
if (res.code == 0) {
|
||||
this.classlist = res.data.list
|
||||
|
|
|
|||
|
|
@ -8,8 +8,20 @@
|
|||
<image src="https://file.langsi.online/yasiimg/web/static/uXJ24nLEqmCb0FkFpmfy" mode=""></image>
|
||||
</view>
|
||||
<view class="view_span">
|
||||
<text>雅思1班</text>
|
||||
<view>基础班</view>
|
||||
<text>{{classinfo.name}}</text>
|
||||
<!-- <view>基础班</view> -->
|
||||
<view v-show="classinfo.classify == 1">
|
||||
听力
|
||||
</view>
|
||||
<view v-show="classinfo.classify == 2">
|
||||
阅读
|
||||
</view>
|
||||
<view v-show="classinfo.classify == 3">
|
||||
写作
|
||||
</view>
|
||||
<view v-show="classinfo.classify == 4">
|
||||
口语
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="view_yellowBotton">
|
||||
|
|
@ -19,10 +31,21 @@
|
|||
<view class="view_zy">
|
||||
|
||||
|
||||
<view class="view_left" v-for="(item,index) in clas" :key="index">
|
||||
<view class="view_left" @click="tostu()">
|
||||
<view class="veiw_left2">
|
||||
<view class="view_class">
|
||||
<text>{{item.title}}</text>
|
||||
<text>班级成员</text>
|
||||
<u-icon name="arrow-right" color="#646D7B" size="16"></u-icon>
|
||||
</view>
|
||||
<view class="view_images">
|
||||
<image :src="item1.url" mode="" v-for="(item1,index) in item.image"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="view_left" @click="toteacher()" >
|
||||
<view class="veiw_left2">
|
||||
<view class="view_class">
|
||||
<text>带班老师</text>
|
||||
<u-icon name="arrow-right" color="#646D7B" size="16"></u-icon>
|
||||
</view>
|
||||
<view class="view_images">
|
||||
|
|
@ -137,9 +160,55 @@
|
|||
title:'更多'
|
||||
}
|
||||
|
||||
]
|
||||
],
|
||||
classid:0,
|
||||
classinfo:{}
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
// this.classid=option.id
|
||||
this.classid=15
|
||||
this.getclassinfo()
|
||||
},
|
||||
onShow(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
getclassinfo() {
|
||||
this.$u.get(`https://api.admin-v2.langsi.online/admin-api/classroom/detail?id=${this.classid}`).then(res => {
|
||||
|
||||
|
||||
if (res.code == 0) {
|
||||
this.classinfo=res.data
|
||||
// this.classlist = res.data.list
|
||||
// this.isloding = false
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
toteacher(){
|
||||
|
||||
uni.redirectTo({
|
||||
url: "/pages/Mystudent/Formteacher?id=" + this.classinfo.id
|
||||
}).then(res => {
|
||||
|
||||
}).catch(err => {
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
tostu(){
|
||||
|
||||
uni.redirectTo({
|
||||
url: "/pages/Mystudent/formstu?id=" + this.classinfo.id
|
||||
}).then(res => {
|
||||
|
||||
}).catch(err => {
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
147
pages_teacher/teacher_teachers/components/compose.vue
Normal file
147
pages_teacher/teacher_teachers/components/compose.vue
Normal file
|
|
@ -0,0 +1,147 @@
|
|||
<template>
|
||||
<!-- 外层循环 -->
|
||||
<view>
|
||||
<view v-for="(item,index) in transformedData" :key="index">
|
||||
<!-- 剑18循环 -->
|
||||
<view>
|
||||
<view class="view_bages">
|
||||
<view>{{item.examName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 渲染Text -->
|
||||
<view class="substance">
|
||||
<text v-for="text in textArr" :key="text" @click="textClick(item,text)" :class="{active: item.active == text}">{{text}}</text>
|
||||
</view>
|
||||
<!-- 内容 -->
|
||||
<view class="compose_bodys">
|
||||
<view v-for="text in textArr" :key="text" class="zz">
|
||||
<view class="compose_body" v-for="Task in taskArr" :key="Task" v-if="item.active == text">
|
||||
<view class="compose_left">
|
||||
<view>{{Task}}</view>
|
||||
<view>
|
||||
<text class="fickle">{{item[text][Task].caption}}</text>
|
||||
<text class="fickle2">{{item[text][Task].themeCaption}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<u-checkbox @change="checkboxChange(item[text][Task].id)" v-model="subsets">{{item.name}}</u-checkbox>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
transformedData: [],
|
||||
// 复选框
|
||||
subsets:[],
|
||||
subsetArr:[],
|
||||
textArr:['test1','test2','test3','test4'],
|
||||
taskArr:['task1','task2'],
|
||||
// 接口参数
|
||||
comsapi: {
|
||||
"key": "",
|
||||
"mode": "home",
|
||||
"exam": "",
|
||||
"caption": "0",
|
||||
"themeCaption": "",
|
||||
"type": "",
|
||||
"isStudy": 0,
|
||||
"isEval": 0
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCompose()
|
||||
},
|
||||
methods: {
|
||||
//写作接口
|
||||
getCompose() {
|
||||
this.$u.post('https://api.admin-v2.langsi.online/admin-api/writing/all/search', this.comsapi).then(res => {
|
||||
let arr = res.data
|
||||
for(let a of arr) {
|
||||
a.active = 'test1'
|
||||
}
|
||||
this.transformedData =arr
|
||||
})
|
||||
},
|
||||
textClick(item, text) {
|
||||
item.active = text
|
||||
this.$forceUpdate()
|
||||
},
|
||||
checkboxChange(e){
|
||||
this.subsetArr.push(e)
|
||||
console.log((this.subsetArr))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.view_bages {
|
||||
font-size: 40rpx;
|
||||
font-weight: 400;
|
||||
color: #2E4975;
|
||||
}
|
||||
.substance {
|
||||
margin: 20rpx 0;
|
||||
text {
|
||||
padding: 10rpx 30rpx;
|
||||
margin-right: 20rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
}
|
||||
.compose_bodys{
|
||||
margin: 30rpx 0;
|
||||
}
|
||||
.compose_body {
|
||||
display: flex;
|
||||
background: #FFFFFF;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0rpx 20rpx;
|
||||
border-bottom: 2rpx solid #F2F2F2;
|
||||
}
|
||||
.compose_body:last-child {
|
||||
border: none;
|
||||
}
|
||||
.zz{
|
||||
background: #ffff;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
.compose_left {
|
||||
display: flex;
|
||||
padding: 24rpx 0;
|
||||
margin: 0 24rpx;
|
||||
}
|
||||
.fickle {
|
||||
padding: 4rpx 22rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #2D7CE6;
|
||||
margin-left: 12rpx;
|
||||
background: #E1EEFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
}
|
||||
.fickle2 {
|
||||
padding: 4rpx 32rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #FB9734;
|
||||
margin-left: 12rpx;
|
||||
background: #FFEBD7;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
}
|
||||
.active {
|
||||
color: #fff;
|
||||
background: #007AFF !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user