xinyi/chuangte_bike_newxcx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

渲染 页面 数据处理 结构解析

Browse Source
This commit is contained in:
陶旭 2023-12-08 22:57:06 +08:00
parent 5b50cad2fc
commit f805ef513e
5 changed files with 1875 additions and 1093 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pages/Mystudent/addclassforwork.vue
View File

@ -5,7 +5,7 @@
:background="bgc" :background="bgc"
title-color='#2E4975' title-color='#2E4975'
title-size='36' title-size='36'
height='36'></u-navbar> height='36' :custom-back="addclassinfo"></u-navbar>
<view class="serchbox"> <view class="serchbox">
<view class="serchimg"> <view class="serchimg">
<image src="https://file.langsi.online/yasiimg/web/static/uVMACkynkipOxuTYDqm0"> <image src="https://file.langsi.online/yasiimg/web/static/uVMACkynkipOxuTYDqm0">

3
pages_teacher/pages_add/add_studentsforwork.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="searchpage"> <view class="searchpage">
<u-navbar title="添加学生" :border-bottom="false" :background="bgc" title-color='#2E4975' title-size='36' <u-navbar title="添加学生" :border-bottom="false" :background="bgc" title-color='#2E4975' title-size='36'
height='36'></u-navbar> height='36' :custom-back="addstu"></u-navbar>
<u-toast ref="uToast" /> <u-toast ref="uToast" />
<view class="serchbox"> <view class="serchbox">
<view class="serchimg"> <view class="serchimg">
@ -71,6 +71,7 @@
}, },
methods: { methods: {
addstu() { addstu() {
console.log('调用了');
uni.setStorageSync('selectedStuInfo', this.selectedIds); uni.setStorageSync('selectedStuInfo', this.selectedIds);
// Navigate back to the previous page // Navigate back to the previous page

143
pages_teacher/teacher_teachers/components/compose.vue
View File

@ -1,49 +1,58 @@
<template> <template>
<!-- 外层循环 --> <!-- 外层循环 -->
<view> <view>
<view v-for="(item,index) in transformedData" :key="index"> <view v-for="(item, index) in transformedData"
:key="index">
<!-- 剑18循环 --> <!-- 剑18循环 -->
<view> <view>
<view class="view_bages"> <view class="view_bages">
<view>{{item.examName}}</view> <view>{{ item.examName }}</view>
</view> </view>
</view> </view>
<!-- 渲染Text --> <!-- 渲染Text -->
<view class="substance"> <view class="substance">
<text v-for="text in textArr" :key="text" @click="textClick(item,text)" :class="{active: item.active == text}">{{text}}</text> <text v-for="text in textArr"
:key="text"
@click="textClick(item, text)"
:class="{ active: item.active == text }">{{ text }}</text>
</view> </view>
<!-- 内容 --> <!-- 内容 -->
<view class="compose_bodys"> <view class="compose_bodys">
<view v-for="text in textArr" :key="text" class="zz"> <view v-for="text in textArr"
<view class="compose_body" v-for="Task in taskArr" :key="Task" v-if="item.active == text"> :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 class="compose_left">
<view>{{Task}}</view> <view>{{ Task }}</view>
<view> <view>
<text class="fickle">{{item[text][Task].caption}}</text> <text class="fickle">{{ item[text][Task].caption }}</text>
<text class="fickle2">{{item[text][Task].themeCaption}}</text> <text class="fickle2">{{ item[text][Task].themeCaption }}</text>
</view> </view>
</view> </view>
<view> <view>
<u-checkbox @change="checkboxChange(item[text][Task].id,$event)" v-model="item[text][Task].subsetArr">{{item.name}}</u-checkbox> <u-checkbox @change="checkboxChange(item, text, Task, $event)"
v-model="item[text][Task].subsetArr">{{ item.name }}</u-checkbox>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
transformedData: [], transformedData: [],
// 复选框 // 复选框
subsetArr:[], subsetArr: [],
textArr:['test1','test2','test3','test4'], textArr: ['test1', 'test2', 'test3', 'test4'],
taskArr:['task1','task2'], taskArr: ['task1', 'task2'],
// 接口参数 // 接口参数
comsapi: { comsapi: {
"key": "", "key": "",
@ -55,6 +64,8 @@
"isStudy": 0, "isStudy": 0,
"isEval": 0 "isEval": 0
}, },
orgtransformedData: [],
selectwrite: [],
} }
}, },
created() { created() {
@ -65,70 +76,114 @@
getCompose() { getCompose() {
this.$u.post('https://api.admin-v2.langsi.online/admin-api/writing/all/search', this.comsapi).then(res => { this.$u.post('https://api.admin-v2.langsi.online/admin-api/writing/all/search', this.comsapi).then(res => {
let arr = res.data let arr = res.data
for(let a of arr) { for (let a of arr) {
a.active = 'test1' a.active = 'test1'
} }
this.transformedData =arr this.transformedData = arr
this.orgtransformedData = JSON.parse(JSON.stringify(arr));
// let json = JSON.stringify(this.transformedData)
console.log(this.transformedData, 'this.transformedData');
}) })
}, },
textClick(item, text) { textClick(item, text) {
item.active = text item.active = text
this.$forceUpdate() this.$forceUpdate()
}, },
checkboxChange(e,id){ checkboxChange(item, text, Task, event) {
if(id.value) { const examName = item.examName;
this.subsetArr.push(e) const test = text; // text 就是 test 字段的内容
}else { const taskId = Task; // Task 就是 task 字段的内容
let index=this.subsetArr.indexOf(e); const id = String(item[test][taskId].id);
if(e!==-1) {
this.subsetArr.splice(index, 1); // 构建对象
const newObject = {
examName: examName,
test: test,
task: taskId,
id: id,
};
// 查找数组中是否已存在相应的对象
const existingObjectIndex = this.findIndexByFields(this.selectwrite, newObject);
if (existingObjectIndex === -1) {
// 如果不存在，添加到数组
this.selectwrite.push(newObject);
} else {
// 如果存在，根据索引删除对象
this.selectwrite.splice(existingObjectIndex, 1);
}
this.$parent.updatawrite(this.selectwrite)
// 更新其他状态...
},
findIndexByFields(array, fields) {
// 根据指定字段值查找对象在数组中的索引
for (let i = 0; i < array.length; i++) {
let isEqual = true;
for (const key in fields) {
if (fields[key] !== array[i][key]) {
isEqual = false;
break;
} }
} }
console.log(this.subsetArr) if (isEqual) {
return i;
} }
} }
return -1;
},
} }
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.view_bages { .view_bages {
font-size: 40rpx; font-size: 40rpx;
font-weight: 400; font-weight: 400;
color: #2E4975; color: #2E4975;
} }
.substance {
.substance {
margin: 20rpx 0; margin: 20rpx 0;
text { text {
padding: 10rpx 30rpx; padding: 10rpx 30rpx;
margin-right: 20rpx; margin-right: 20rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;
} }
} }
.compose_bodys{
.compose_bodys {
margin: 30rpx 0; margin: 30rpx 0;
} }
.compose_body {
.compose_body {
display: flex; display: flex;
background: #FFFFFF; background: #FFFFFF;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin: 0rpx 20rpx; margin: 0rpx 20rpx;
border-bottom: 2rpx solid #F2F2F2; border-bottom: 2rpx solid #F2F2F2;
} }
.compose_body:last-child {
.compose_body:last-child {
border: none; border: none;
} }
.zz{
.zz {
background: #ffff; background: #ffff;
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;
} }
.compose_left {
.compose_left {
display: flex; display: flex;
padding: 24rpx 0; padding: 24rpx 0;
margin: 0 24rpx; margin: 0 24rpx;
} }
.fickle {
.fickle {
padding: 4rpx 22rpx; padding: 4rpx 22rpx;
font-size: 20rpx; font-size: 20rpx;
font-weight: 500; font-weight: 500;
@ -136,8 +191,9 @@
margin-left: 12rpx; margin-left: 12rpx;
background: #E1EEFF; background: #E1EEFF;
border-radius: 8rpx 8rpx 8rpx 8rpx; border-radius: 8rpx 8rpx 8rpx 8rpx;
} }
.fickle2 {
.fickle2 {
padding: 4rpx 32rpx; padding: 4rpx 32rpx;
font-size: 20rpx; font-size: 20rpx;
font-weight: 500; font-weight: 500;
@ -145,9 +201,10 @@
margin-left: 12rpx; margin-left: 12rpx;
background: #FFEBD7; background: #FFEBD7;
border-radius: 8rpx 8rpx 8rpx 8rpx; border-radius: 8rpx 8rpx 8rpx 8rpx;
} }
.active {
.active {
color: #fff; color: #fff;
background: #007AFF !important; background: #007AFF !important;
} }
</style> </style>

519
pages_teacher/teacher_teachers/teacher_addOperation.vue
View File

@ -1,13 +1,21 @@
<template> <template>
<view class="concent"> <view class="concent">
<view class="view_body"> <view class="view_body">
<u-navbar :is-back="true" title='添加作业' title-color="#000" :border-bottom="false" :background="bgc" id="navbar"> <u-navbar :is-back="true"
title='添加作业'
title-color="#000"
:border-bottom="false"
:background="bgc"
id="navbar">
</u-navbar> </u-navbar>
<view class="view_header"> <view class="view_header">
<view class="view_title">标题</view> <view class="view_title">标题</view>
<view class="view_input"> <view class="view_input">
<u-form-item prop="value"> <u-form-item prop="value">
<u-input v-model="worktit" :type="type" :border="border" placeholder="输入作业标题" /> <u-input v-model="worktit"
:type="type"
:border="border"
placeholder="输入作业标题" />
</u-form-item> </u-form-item>
</view> </view>
</view> </view>
@ -15,30 +23,42 @@
<view> <view>
<view class="view_tubiao"> <view class="view_tubiao">
<view class="view_title">班级安排</view> <view class="view_title">班级安排</view>
<view class="view_tb" @click="addclass()"> <view class="view_tb"
@click="addclass()">
+ +
</view> </view>
</view> </view>
<view class="noting" v-if="classinfo.length<=0"> <view class="noting"
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H" ></image> v-if="classinfo.length <= 0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H"></image>
<view class="text1"> <view class="text1">
暂未安排哦！ 暂未安排哦！
</view> </view>
<view class="text2" @click="addclass()"> <view class="text2"
@click="addclass()">
去安排 去安排
</view> </view>
</view> </view>
<view class="class_bj"> <view class="class_bj">
<view class="class_images" > <view class="class_images">
<view class="class_ys" v-for="(item,index) in classinfo" :key="index" style="position: relative;"> <view class="class_ys"
<view class="close" style="position: absolute;top: 0rpx;right: 8rpx;width: 20rpx;height: 20rpx;" @click="delcls(item.id)"> v-for="(item, index) in classinfo"
<image src="https://file.langsi.online/yasiimg/web/static/ueH3qwYazyVXmiYoVPJE" mode=""></image> :key="index"
style="position: relative;">
<view class="close"
style="position: absolute;top: 0rpx;right: 8rpx;width: 20rpx;height: 20rpx;"
@click="delcls(item.id)">
<image src="https://file.langsi.online/yasiimg/web/static/ueH3qwYazyVXmiYoVPJE"
mode="">
</image>
</view> </view>
<view class="class_tp"> <view class="class_tp">
<image src="https://file.langsi.online/yasiimg/web/static/u4T48EWFfk5p6yrV3gOw" mode=""></image> <image src="https://file.langsi.online/yasiimg/web/static/u4T48EWFfk5p6yrV3gOw"
mode="">
</image>
</view> </view>
<view class="class_wz">{{item.name}}</view> <view class="class_wz">{{ item.name }}</view>
</view> </view>
@ -49,30 +69,41 @@
<view> <view>
<view class="view_tubiao"> <view class="view_tubiao">
<view class="view_title">学员安排</view> <view class="view_title">学员安排</view>
<view class="view_tb" @click="toaddstu()"> <view class="view_tb"
@click="toaddstu()">
+ +
</view> </view>
</view> </view>
<view class="noting" v-if="stuinfo.length<=0"> <view class="noting"
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H" ></image> v-if="stuinfo.length <= 0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H"></image>
<view class="text1"> <view class="text1">
暂未安排哦！ 暂未安排哦！
</view> </view>
<view class="text2" @click="toaddstu()"> <view class="text2"
@click="toaddstu()">
去安排 去安排
</view> </view>
</view> </view>
<view class="class_bj" > <view class="class_bj">
<view class="class_images"> <view class="class_images">
<view class="class_ys" v-for="(item,index) in stuinfo" :key="index" style="position: relative;"> <view class="class_ys"
<view class="close" style="position: absolute;top: 0rpx;right: 8rpx;width: 20rpx;height: 20rpx;" @click="delstu(item.id)"> v-for="(item, index) in stuinfo"
<image src="https://file.langsi.online/yasiimg/web/static/ueH3qwYazyVXmiYoVPJE" mode=""></image> :key="index"
style="position: relative;">
<view class="close"
style="position: absolute;top: 0rpx;right: 8rpx;width: 20rpx;height: 20rpx;"
@click="delstu(item.id)">
<image src="https://file.langsi.online/yasiimg/web/static/ueH3qwYazyVXmiYoVPJE"
mode="">
</image>
</view> </view>
<view class="class_tp"> <view class="class_tp">
<image :src="item.avatar" mode=""></image> <image :src="item.avatar"
mode=""></image>
</view> </view>
<view class="class_wz">{{item.name}}</view> <view class="class_wz">{{ item.name }}</view>
</view> </view>
</view> </view>
@ -89,7 +120,8 @@
</view> </view>
<view> <view>
<view class="Ielts">IELTS 18</view> <view class="Ielts">IELTS 18</view>
<view style="background-color: #fff; padding: 32rpx 40rpx;"> <view
style="background-color: #fff; padding: 32rpx 40rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;">
<u-time-line> <u-time-line>
<u-time-line-item nodeTop="2"> <u-time-line-item nodeTop="2">
<template v-slot:content> <template v-slot:content>
@ -143,71 +175,62 @@
</view> </view>
</view> </view>
</view> </view>
<view> <view v-for="(item,index) in selectwritelist" :key="index">
<view class="Ielts">IELTS 18</view> <view class="Ielts">{{item.examName}}</view>
<view style="background-color: #fff; padding: 32rpx 40rpx;"> <view style="background-color: #fff; padding: 32rpx 40rpx;border-radius: 20rpx 20rpx 20rpx 20rpx;" v-for="(items,indexs) in item.message" :key="indexs">
<view style="display: flex; align-items: center;"> <view style="display: flex; align-items: center;">
<view class="yuandi"></view> <view class="yuandi"></view>
<view class="Test">Test 2</view> <view class="Test">{{items.test}}</view>
<view class="ellipses">听力</view> <view class="ellipses">写作</view>
</view> </view>
<view class="u-order-desc"> <view class="u-order-desc">
<text>Part 1：多选题</text> <text>{{items.task}}</text>
</view> </view>
</view> </view>
</view> </view>
<view> <view>
<view> <view>
<view class="Ielts">IELTS 18</view> <view class="Ielts"></view>
<view style="background-color: #fff; padding: 32rpx 40rpx;"> <view
style="background-color: #fff; padding: 32rpx 40rpx;border-radius: 20rpx 20rpx 20rpx 20rpx;">
<u-time-line> <u-time-line>
<u-time-line-item nodeTop="2"> <u-time-line-item nodeTop="2"
v-for="(item, index) in selectspeak"
:key="index">
<template v-slot:content> <template v-slot:content>
<view> <view>
<view style="display: flex;"> <view style="display: flex;flex-wrap: nowrap;">
<view class="Test">Test 2</view> <view class="Test"
style="width: 80%;">{{ item.part }}-{{ item.introduction }}</view>
<view class="erotic">听力</view> <view class="erotic">口语</view>
</view> </view>
<view class="u-order-desc"> <view class="u-order-desc">
<text>Part 1：多选题</text> <view style="display: inline;">
<view class="txt">{{ item.topicEn }}:</view>
<view v-for="(items, indexs) in item.speakingType"
:key="indexs"
class="type"
style="display: inline;">
<view v-if="items == 1">串题</view>
<view v-else-if="items == 2">跟读</view>
<view v-else-if="items == 3">模考</view>
</view>
</view>
</view> </view>
</view> </view>
</template> </template>
</u-time-line-item> </u-time-line-item>
<u-time-line-item nodeTop="2">
<template v-slot:content>
<view>
<view style="display: flex;">
<view class="Test">Test 2</view>
<view class="erotic">听力</view>
</view>
<view class="u-order-desc">
<text>Part 1：多选题</text>
</view>
</view>
</template>
</u-time-line-item>
</u-time-line> </u-time-line>
</view> </view>
</view> </view>
</view> </view>
<!--按钮 --> <!--按钮 -->
<view style="display: flex; justify-content: center; margin-top: 32rpx;"> <view style="display: flex; justify-content: center; margin-top: 32rpx;"
@click="addwork()">
<view class="increase"> <view class="increase">
<u-icon name="plus"></u-icon> <u-icon name="plus"></u-icon>
添加 添加
@ -223,9 +246,17 @@
</view> </view>
<view> <view>
<view class="view_form"> <view class="view_form">
<u-picker mode="time" v-model="show" :params="params" @confirm="printValue"></u-picker> <u-picker mode="time"
v-model="show"
:params="params"
@confirm="printValue"></u-picker>
<u-form-item prop="times"> <u-form-item prop="times">
<u-input v-model="form.times" :type="type" :border="border" placeholder="选择作业截止的时间" @click="show = true" placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;"/> <u-input v-model="times"
:type="type"
:border="border"
placeholder="选择作业截止的时间"
@click="show = true"
placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;" />
</u-form-item> </u-form-item>
@ -238,21 +269,29 @@
<view class="view_title">描述</view> <view class="view_title">描述</view>
</view> </view>
<view class="view_textrea"> <view class="view_textrea">
<textarea value="" placeholder="输入你的描述... "placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;"/> <textarea value=""
placeholder="输入你的描述... "
placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;" />
</view> </view>
</view> </view>
</view> </view>
<!-- 按钮 --> <!-- 按钮 -->
<view class="view_footer" @click="submit"> <view class="zhanwei"
<view class="view_button" >确认添加 </view> style="width: 100%;height: 230rpx;">
</view> </view>
<view class="botbtn">
<view class="btn"
@click="addclassinfo()">
确定添加
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
bgc: { bgc: {
@ -270,10 +309,15 @@
show: false, show: false,
radio: '', radio: '',
switchVal: false, switchVal: false,
classinfo:[], classinfo: [],
stuinfo:[], stuinfo: [],
worktit:'', worktit: '',
times:'', times: '',
selectspeak: [],
selectwrite: [],
selectlisten: [],
selectread: [],
selectwritelist: []
} }
}, },
@ -281,23 +325,21 @@
uni.removeStorageSync('selectedClassInfo'); uni.removeStorageSync('selectedClassInfo');
uni.removeStorageSync('selectedStuInfo'); uni.removeStorageSync('selectedStuInfo');
// this.classinfo=JSON.parse(decodeURIComponent(option.classinfo)) // this.classinfo=JSON.parse(decodeURIComponent(option.classinfo))
let classinofs=[ let classinofs = [{
{ name: '阅读5班',
name:'阅读5班', avatar: 'Excepteur',
avatar:'Excepteur', id: 15,
id:15,
} }]
] this.classinfo = classinofs
this.classinfo=classinofs
}, },
onShow() { onShow() {
// Read selectedClassInfo data // Read selectedClassInfo data
const selectedClassInfo = uni.getStorageSync('selectedClassInfo'); const selectedClassInfo = uni.getStorageSync('selectedClassInfo');
console.log(selectedClassInfo,'selectedClassInfoselectedClassInfo');
if (selectedClassInfo && selectedClassInfo.length > 0) { if (selectedClassInfo && selectedClassInfo.length > 0) {
this.classinfo=selectedClassInfo this.classinfo = selectedClassInfo
// Remove duplicates from this.classinfo // Remove duplicates from this.classinfo
// this.classinfo = this.classinfo.filter(item => !selectedClassInfo.some(selectedItem => selectedItem.id === item.id)); // this.classinfo = this.classinfo.filter(item => !selectedClassInfo.some(selectedItem => selectedItem.id === item.id));
@ -308,7 +350,7 @@
const selectedstuInfo = uni.getStorageSync('selectedStuInfo'); const selectedstuInfo = uni.getStorageSync('selectedStuInfo');
if (selectedstuInfo && selectedstuInfo.length > 0) { if (selectedstuInfo && selectedstuInfo.length > 0) {
this.stuinfo=selectedstuInfo this.stuinfo = selectedstuInfo
// Remove duplicates from this.classinfo // Remove duplicates from this.classinfo
// this.stuinfo = this.stuinfo.filter(item => !selectedstuInfo.some(selectedItem => selectedItem.id === item.id)); // this.stuinfo = this.stuinfo.filter(item => !selectedstuInfo.some(selectedItem => selectedItem.id === item.id));
@ -316,15 +358,107 @@
// this.stuinfo = this.stuinfo.concat(selectedstuInfo); // this.stuinfo = this.stuinfo.concat(selectedstuInfo);
} }
const selectforwork = uni.getStorageSync('selectforwork');
console.log(selectforwork, 'selectedClassInfoselectedClassInfo');
if (selectforwork) {
this.selectspeak = selectforwork.selectspeak
this.selectwrite = selectforwork.selectwrite
this.selectlisten = selectforwork.selectlisten
this.selectread = selectforwork.selectread
this.selectwrite = selectforwork.selectwrite;
const groupedItems = {};
this.selectwrite.forEach(item => {
const examName = item.examName;
if (!groupedItems[examName]) {
groupedItems[examName] = {
examName: examName,
message: []
};
}
groupedItems[examName].message.push({
test: item.test,
task: item.task,
id: item.id
});
});
// Convert groupedItems object to an array
this.selectwritelist = Object.values(groupedItems);
console.log(this.selectwritelist, 'selectwritelist');
// Remove duplicates from this.classinfo
// this.stuinfo = this.stuinfo.filter(item => !selectedstuInfo.some(selectedItem => selectedItem.id === item.id));
// // Add non-duplicate items from selectedClassInfo to this.classinfo
// this.stuinfo = this.stuinfo.concat(selectedstuInfo);
}
}, },
methods:{ methods: {
delcls(id){ mergeObjectsByExamName(existingArray, newArray) {
const mergedArray = [];
newArray.forEach(newObj => {
const existingObjIndex = existingArray.findIndex(existingObj => existingObj.examName === newObj.examName);
if (existingObjIndex !== -1) {
// 如果存在相同的 examName，则合并对象
const existingObj = existingArray[existingObjIndex];
existingObj.message.push({
test: newObj.test,
task: newObj.task,
id: newObj.id,
// 其他属性...
});
// 更新数组中的对象
existingArray[existingObjIndex] = existingObj;
} else {
// 如果不存在相同的 examName，则直接添加新对象
mergedArray.push({
examName: newObj.examName,
message: [{
test: newObj.test,
task: newObj.task,
id: newObj.id,
// 其他属性...
}],
// 其他属性...
});
}
});
// 添加 existingArray 中未处理的对象
existingArray.forEach(existingObj => {
const existingObjIndex = mergedArray.findIndex(obj => obj.examName === existingObj.examName);
if (existingObjIndex === -1) {
mergedArray.push(existingObj);
}
});
return mergedArray;
},
addwork() {
uni.navigateTo({
url: "/pages_teacher/teacher_teachers/teacher_writeadd?classinfo=" + encodeURIComponent(JSON.stringify(this.classinfo))
}).then(res => {
}).catch(err => {
});
},
delcls(id) {
this.classinfo = this.classinfo.filter(item => item.id !== id); this.classinfo = this.classinfo.filter(item => item.id !== id);
}, },
delstu(id){ delstu(id) {
this.stuinfo = this.stuinfo.filter(item => item.id !== id); this.stuinfo = this.stuinfo.filter(item => item.id !== id);
}, },
toaddstu(){ toaddstu() {
uni.navigateTo({ uni.navigateTo({
url: "/pages_teacher/pages_add/add_studentsforwork?stuinfo=" + encodeURIComponent(JSON.stringify(this.stuinfo)) url: "/pages_teacher/pages_add/add_studentsforwork?stuinfo=" + encodeURIComponent(JSON.stringify(this.stuinfo))
@ -334,9 +468,10 @@
}); });
}, },
addclass(){ addclass() {
uni.navigateTo({ uni.navigateTo({
url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this.classinfo)) url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this
.classinfo))
}).then(res => { }).then(res => {
}).catch(err => { }).catch(err => {
@ -345,51 +480,80 @@
}, },
// 获取截止时间 // 获取截止时间
printValue(e){ printValue(e) {
this.times=`${e.year}-${e.month}-${e.day}` this.times = `${e.year}-${e.month}-${e.day}`
}, },
submit() { submit() {
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
// 样式穿透 .botbtn {
::v-deep .u-dot { padding: 32rpx 32rpx 0 32rpx;
background: #2D7CE6 !important; // margin-left: -32rpx;
position: fixed;
bottom: 0;
width: 750rpx;
height: 200rpx;
background: #FFFFFF;
box-shadow: 0rpx -10rpx 16rpx 0rpx rgba(202, 202, 202, 0.25);
border-radius: 40rpx 40rpx 0rpx 0rpx;
z-index: 999;
.btn {
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
font-family: 'PingFang', 'PingFang';
font-weight: 800;
color: #FFFFFF;
width: 686rpx;
height: 80rpx;
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx;
} }
.concent { }
// 样式穿透
::v-deep .u-dot {
background: #2D7CE6 !important;
}
.concent {
width: 100vw; width: 100vw;
background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%); background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%);
} }
.view_body { .view_body {
width: 91.3%; width: 91.3%;
margin: 0 auto; margin: 0 auto;
} }
.view_title { .view_title {
font-size: 28rpx; font-size: 28rpx;
font-family: 'PingFang'; font-family: 'PingFang';
font-weight: 800; font-weight: 800;
color: #2E4975; color: #2E4975;
} }
.view_input { .view_input {
line-height: 70rpx; line-height: 70rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-top: 16rpx; margin-top: 16rpx;
padding: 0 24rpx; padding: 0 24rpx;
} }
.view_tubiao { .view_tubiao {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-top: 46rpx; margin-top: 46rpx;
.view_tb{
.view_tb {
display: flex; display: flex;
padding-left: 24rpx; padding-left: 24rpx;
// align-items: center; // align-items: center;
@ -401,11 +565,12 @@
border: 2rpx solid #F1F1F1; border: 2rpx solid #F1F1F1;
color: #F18F21 ; color: #F18F21;
font-size: 30rpx; font-size: 30rpx;
} }
} }
.noting{
.noting {
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
@ -415,18 +580,21 @@
height: 124rpx; height: 124rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
image{
image {
width: 58.19rpx; width: 58.19rpx;
height: 60rpx; height: 60rpx;
} }
.text1{
.text1 {
margin-left: 12rpx; margin-left: 12rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-weight: 500; font-weight: 500;
color: #627698; color: #627698;
} }
.text2{
.text2 {
margin-left: 12rpx; margin-left: 12rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
@ -434,33 +602,37 @@
color: #2D7CE6; color: #2D7CE6;
border-bottom: 2px solid #2D7CE6; border-bottom: 2px solid #2D7CE6;
} }
} }
.class_bj {
margin-top: 16rpx;
}
.class_images { .class_bj {
margin-top: 16rpx;
}
.class_images {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
// justify-content: space-between; // justify-content: space-between;
// margin-top: 20rpx; // margin-top: 20rpx;
} }
.class_tp { .class_tp {
width: 56rpx; width: 56rpx;
height: 56rpx; height: 56rpx;
margin-right: 12rpx; margin-right: 12rpx;
} }
.Ielts{
.Ielts {
font-size: 40rpx; font-size: 40rpx;
font-weight: 400; font-weight: 400;
color: #2E4975; color: #2E4975;
margin: 20rpx 0; margin: 20rpx 0;
} }
.class_ys:nth-child(3n) {
.class_ys:nth-child(3n) {
margin-right: 0; margin-right: 0;
} }
.class_ys {
.class_ys {
margin-top: 20rpx; margin-top: 20rpx;
margin-right: 20rpx; margin-right: 20rpx;
width: 215rpx; width: 215rpx;
@ -473,10 +645,10 @@
height: 96rpx; height: 96rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.class_wz { .class_wz {
width: 125rpx; width: 125rpx;
font-size: 28rpx; font-size: 28rpx;
font-family: 'PingFang'; font-family: 'PingFang';
@ -485,40 +657,46 @@
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.view_form{
.view_form {
padding: 0rpx 32rpx; padding: 0rpx 32rpx;
background: #FFFFFF; background: #FFFFFF;
margin-top: 16rpx; margin-top: 16rpx;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.view_textrea{
.view_textrea {
height: 260rpx; height: 260rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;; border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-top:16rpx; ;
margin-top: 16rpx;
padding: 28rpx 32rpx; padding: 28rpx 32rpx;
} }
.view_button{
.view_button {
width: 93.1%; width: 93.1%;
margin:auto; margin: auto;
text-align: center; text-align: center;
line-height: 80rpx; line-height: 80rpx;
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx; border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #FFFFFF; color: #FFFFFF;
} }
.view_footer{
.view_footer {
width: 100%; width: 100%;
padding: 0 16rpx; padding: 0 16rpx;
height: 144rpx; height: 144rpx;
border-radius: 40rpx 40rpx 0rpx 0rpx; border-radius: 40rpx 40rpx 0rpx 0rpx;
padding: 32rpx 0rpx; padding: 32rpx 0rpx;
background-color: #fff; background-color: #fff;
box-shadow: 0rpx -10rpx 16rpx 0rpx rgba(202,202,202,0.25); box-shadow: 0rpx -10rpx 16rpx 0rpx rgba(202, 202, 202, 0.25);
margin-top: 8rpx; margin-top: 8rpx;
} }
.u-node {
.u-node {
width: 44rpx; width: 44rpx;
height: 44rpx; height: 44rpx;
border-radius: 100rpx; border-radius: 100rpx;
@ -526,65 +704,80 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: #d0d0d0; background: #d0d0d0;
} }
.u-order-desc {
.u-order-desc {
display: block;
// flex-wrap: nowrap;
padding: 20rpx; padding: 20rpx;
background: #F9F9F9; background: #F9F9F9;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
margin: 12rpx 0rpx; margin: 12rpx 0rpx;
text {
.txt {
font-size: 24rpx; font-size: 24rpx;
font-weight: 500; font-weight: 500;
color: #2E4975; color: #2E4975;
} }
} }
.u-order-time { .u-order-time {
color: rgb(200, 200, 200); color: rgb(200, 200, 200);
font-size: 26rpx; font-size: 26rpx;
} }
.yuandi{
.yuandi {
width: 18rpx; width: 18rpx;
height: 18rpx; height: 18rpx;
background: #2D7CE6; background: #2D7CE6;
border-radius: 24rpx 24rpx 24rpx 24rpx; border-radius: 24rpx 24rpx 24rpx 24rpx;
} }
.Test{
.Test {
font-size: 28rpx; font-size: 28rpx;
font-weight: 800; font-weight: 800;
color: #2E4975; color: #2E4975;
margin-left: 12rpx; margin-left: 12rpx;
} }
.ellipses{
.ellipses {
font-size: 20rpx; font-size: 20rpx;
background: rgba(242,170,2,0.2); background: rgba(242, 170, 2, 0.2);
margin-left: 12rpx; margin-left: 12rpx;
padding: 8rpx 20rpx; padding: 8rpx 20rpx;
color: #F2AA02; color: #F2AA02;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.erotic{
.erotic {
display: flex;
justify-content: center;
align-items: center;
width: 80rpx;
height: 36rpx;
font-size: 20rpx; font-size: 20rpx;
background: rgba(242,63,170,0.1); background: rgba(242, 63, 170, 0.1);
margin-left: 12rpx; margin-left: 12rpx;
padding: 8rpx 20rpx; // padding: 8rpx 20rpx;
color: #F23FEB; color: #F23FEB;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.greener{
.greener {
font-size: 20rpx; font-size: 20rpx;
background: rgba(27,225,178,0.1); background: rgba(27, 225, 178, 0.1);
margin-left: 12rpx; margin-left: 12rpx;
padding: 8rpx 20rpx; padding: 8rpx 20rpx;
color: #1BE1B2; color: #1BE1B2;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.increase{
.increase {
padding: 26rpx 125rpx; padding: 26rpx 125rpx;
color: #FFFFFF; color: #FFFFFF;
background-color: #F39852; background-color: #F39852;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
text-align: center; text-align: center;
} }
</style> </style>

727
pages_teacher/teacher_teachers/teacher_writeadd.vue
View File

@ -1,69 +1,228 @@
<template> <template>
<view class="view_template"> <view class="view_template">
<view class="view_body"> <view class="view_body">
<u-navbar :is-back="true" title='添加作业' title-color="#000" :border-bottom="false" :background="true" id="navbar"> <u-navbar :is-back="true"
title='添加作业'
title-color="#000"
:border-bottom="false"
:background="true"
id="navbar">
</u-navbar> </u-navbar>
<!-- 搜索 --> <!-- 搜索 -->
<view class="view_search" v-if="search"> <view class="view_search"
<u-search :show-action="false" :animation="true" bg-color="#fff" placeholder="搜索相关内容..." color="#3E97FF"></u-search> v-if="search">
<u-search v-model="searchKeyword"
:show-action="false"
:animation="true"
bg-color="#fff"
placeholder="搜索相关内容..."
color="#3E97FF"
@input="searchs()"></u-search>
</view> </view>
<!-- <view class="serchbox">
<view class="serchimg">
<image src="https://file.langsi.online/yasiimg/web/static/uVMACkynkipOxuTYDqm0">
</image>
</view>
<input type="text"
v-model="searchKeyword"
placeholder="搜索相关内容..."
class="input"
placeholder-style="color:#C7CDD3"
@input="search()">
</view> -->
<!--导航栏 --> <!--导航栏 -->
<view class="view_tabs"> <view class="view_tabs">
<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" active-color="#2D7CE6" bg-color="0"></u-tabs> <u-tabs :list="list"
:is-scroll="false"
:current="current"
@change="change"
active-color="#2D7CE6"
bg-color="0"></u-tabs>
</view> </view>
<!-- 轮播图 --> <!-- 轮播图 -->
<swiper :interval="5000" :duration="1000" is-scroll="true" :current="current" @change="updateCurrent" class="swiper"> <swiper :interval="5000"
:duration="1000"
is-scroll="true"
:current="current"
@change="updateCurrent"
class="swiper">
<!-- 口语 --> <!-- 口语 -->
<swiper-item style="height: 300rpx;"> <swiper-item style="height: 300rpx;">
<view> <view>
<view class="view_left"> <view class="view_left">
<view class="view_left_pd" @click="arrow_xl"> <view class="view_left_pd"
@click="arrow_xl">
<view class="pull_down"> <view class="pull_down">
<view>{{selectedOption}}</view> <view>{{ selectedOption }}</view>
<u-icon name="arrow-down" size="22"></u-icon> <u-icon name="arrow-down"
size="22"></u-icon>
</view> </view>
<view class="pull_Down" v-if="arrow"> <view class="pull_Down"
<view v-for="(item,index) in options" :key="index" @click="arrow_options(item.id)">{{item.name}}</view> v-if="arrow">
<view v-for="(item, index) in options"
:key="index"
@click="arrow_options(item.id)">{{ item.name }}</view>
</view> </view>
</view> </view>
</view> </view>
<!-- 口语主体 --> <!-- 口语主体 -->
<view v-for="(item,index) in slander" :key="index"> <view v-for="(item, index) in slanderpart1" v-if="selectedOption=='Part1'"
:key="index">
<view class="view_inuygs"> <view class="view_inuygs">
<view class="header_part"> <view class="header_part">
<view class="unite">{{item.label}}</view> <view class="unite">{{ item.label }}</view>
</view> </view>
<view class="bottom_one" v-if="part2"> <view class="bottom_one"
<view :class="{'active': item.active === '串题'}" @click="clicking(item, '串题')">串题</view> v-if="item.list.length <= 1"
<view :class="{'active': item.active === '跟读'}" @click="clicking(item, '跟读')">跟读</view> v-for="(items, indexs) in item.list"
<view :class="{'active': item.active === '模考'}" @click="clicking(item, '模考')">模考</view> :key='indexs'>
<view :class="{ 'active': items.ischuanti === true }"
@click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view> </view>
</view> </view>
<!-- part1--> <!-- part1-->
<view class="slander_for" v-if="grizzly"> <view class="slander_for"
<view class="slander_of" v-for="(items,indexs) in item.list" :key='indexs'> v-if="item.list.length > 1">
<view class="textual"> <view class="slander_of"
{{items.topicEn}} v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual" v-html="highlightSearch( items.topicEn)">
</view> </view>
<view class="bottom_one"> <view class="bottom_one">
<view :class="{'active': items.active === '串题'}" @click="clicking(items, '串题')">串题</view> <view :class="{ 'active': items.ischuanti === true }"
<view :class="{'active': items.active === '跟读'}" @click="clicking(items, '跟读')">跟读</view> @click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{'active': items.active === '模考'}" @click="clicking(items, '模考')">模考</view> <view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view> </view>
</view> </view>
</view> </view>
<!-- part2--> <!-- part2-->
<view class="slander_for" v-if="part2"> <view class="slander_for"
<view class="slander_of" v-for="(items,indexs) in item.list" :key='indexs'> v-if="item.list.length <= 1">
<view class="textual2"> <view class="slander_of"
{{items.topicEn}} v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual2" v-html="highlightSearch( items.topicEn)">
</view>
</view>
</view>
</view>
<!-- part2 -->
<view v-for="(item, index) in slanderpart2" v-if="selectedOption=='Part2'"
:key="index">
<view class="view_inuygs">
<view class="header_part">
<view class="unite">{{ item.label }}</view>
</view>
<view class="bottom_one"
v-if="item.list.length <= 1"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view :class="{ 'active': items.ischuanti === true }"
@click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view>
</view>
<!-- part1-->
<view class="slander_for"
v-if="item.list.length > 1">
<view class="slander_of"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual" v-html="highlightSearch( items.topicEn)">
</view>
<view class="bottom_one">
<view :class="{ 'active': items.ischuanti === true }"
@click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view>
</view>
</view>
<!-- part2-->
<view class="slander_for"
v-if="item.list.length <= 1">
<view class="slander_of"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual2" v-html="highlightSearch( items.topicEn)">
</view>
</view>
</view>
</view>
<!-- part3 -->
<view v-for="(item, index) in slanderpart3" v-if="selectedOption=='Part3'"
:key="index">
<view class="view_inuygs">
<view class="header_part">
<view class="unite">{{ item.label }}</view>
</view>
<view class="bottom_one"
v-if="item.list.length <= 1"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view :class="{ 'active': items.ischuanti === true }"
@click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view>
</view>
<!-- part1-->
<view class="slander_for"
v-if="item.list.length > 1">
<view class="slander_of"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual" v-html="highlightSearch( items.topicEn)">
</view>
<view class="bottom_one">
<view :class="{ 'active': items.ischuanti === true }"
@click="updateSelectspeak(items, 'ischuanti', indexs)">串题</view>
<view :class="{ 'active': items.isgendu === true }"
@click="updateSelectspeak(items, 'isgendu', indexs)">跟读</view>
<view :class="{ 'active': items.ismk === true }"
@click="updateSelectspeak(items, 'ismk', indexs)">模考</view>
</view>
</view>
</view>
<!-- part2-->
<view class="slander_for"
v-if="item.list.length <= 1">
<view class="slander_of"
v-for="(items, indexs) in item.list"
:key='indexs'>
<view class="textual2" v-html="highlightSearch( items.topicEn)">
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</swiper-item> </swiper-item>
<!-- 写作 --> <!-- 写作 -->
<swiper-item> <swiper-item>
@ -80,22 +239,23 @@
</swiper> </swiper>
</view> </view>
<!-- 底部按钮 --> <!-- 底部按钮 -->
<view :class="search== true ? 'footer2' : 'footer'"> <view :class="search == true ? 'footer2' : 'footer'"
<view class="footer_button"> v-if="totalLength != 0">
<view :class="search==true ? 'button_andadd' :'button_show'">确定添加（4）</view> <view class="footer_button" @click="submessage()">
<view class="footer_button_right" v-if="search">口语模考</view> <view :class="search == true ? 'button_andadd' : 'button_show'">确定添加（{{ totalLength }}）</view>
<view class="footer_button_right"
v-if="search">口语模考</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view></template>
</template>
<script> <script>
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' import compose from './components/compose.vue'
export default { export default {
data() { data() {
return { return {
// 导航栏 // 导航栏
@ -118,11 +278,11 @@
}], }],
// 写作 // 写作
Compose: [], Compose: [],
num:0, num: 0,
// 下拉框的v-if布尔值 // 下拉框的v-if布尔值
radioValue: '', radioValue: '',
part1: true, part1: true,
current: 0, current: 1,
search: true, search: true,
listType: [], listType: [],
idList: [], idList: [],
@ -141,9 +301,14 @@
"level": 0, "level": 0,
"isNew": 0 "isNew": 0
}, },
slander: [], slanderpart1: [],
part2:false, originslanderpart1: [],
grizzly:true, slanderpart2: [],
originslanderpart2: [],
slanderpart3: [],
originslanderpart3: [],
part2: false,
grizzly: true,
categorize: '分类', categorize: '分类',
// 下拉框的v-if布尔值 // 下拉框的v-if布尔值
selectedOption: 'Part1', selectedOption: 'Part1',
@ -162,10 +327,16 @@
name: 'Part3' name: 'Part3'
} }
], ],
userId:null totalLength: 0,
searchKeyword: '',
userId: null,
selectspeak: [],
selectwrite: [],
selectlisten: [],
selectread: []
} }
}, },
components:{ components: {
audiology, audiology,
reading, reading,
compose compose
@ -173,7 +344,216 @@
created() { created() {
this.getList() this.getList()
}, },
methods: { methods: {
updatawrite(data){
this.selectwrite=data
console.log(this.selectwrite, ' this.selectwrite this.selectwrite');
this.calculateTotalLength()
},
submessage(){
const dataToSave = {
selectspeak: this.selectspeak,
selectwrite: this.selectwrite,
selectlisten: this.selectlisten,
selectread: this.selectread
};
// 将数据保存在本地缓存中
uni.setStorageSync('selectforwork', dataToSave);
uni.navigateBack({
delta: 1, // Number of pages to go back
success(res) {
console.log(res);
},
fail(err) {
console.error(err);
}
});
},
fuwei() {
// this.slander = JSON.parse(JSON.stringify(this.originslanderpart1));
// this.selectedIds.forEach(selectedItem => {
// const index = this.stulist.findIndex(item => item.id === selectedItem.id);
// if (index !== -1) {
// this.$set(this.stulist, index, { ...this.stulist[index], isSelected: true });
// }
// });
},
searchs() {
if(this.selectedOption=='Part1'){
const filteredSlander = [];
// 将搜索关键字转换为小写，使搜索不区分大小写
const searchKeywordLowerCase = this.searchKeyword.toLowerCase();
// 遍历原始数据
for (const item of this.originslanderpart1) {
const filteredList = item.list.filter(subItem => {
// 将目标字符串转换为小写，使匹配不区分大小写
const introductionLowerCase = subItem.introduction.toLowerCase();
const topicEnLowerCase = subItem.topicEn.toLowerCase();
// 检查 introduction 或 topicEn 是否包含小写的 searchKeyword
return (
introductionLowerCase.includes(searchKeywordLowerCase) ||
topicEnLowerCase.includes(searchKeywordLowerCase)
);
});
// 如果有匹配项，添加到 filteredSlander 中
if (filteredList.length > 0) {
filteredSlander.push({
label: item.label,
list: filteredList
});
}
}
// 更新 this.slander
this.slanderpart1 = filteredSlander;
}else if(this.selectedOption=='Part2'){
const filteredSlander = [];
// 将搜索关键字转换为小写，使搜索不区分大小写
const searchKeywordLowerCase = this.searchKeyword.toLowerCase();
// 遍历原始数据
for (const item of this.originslanderpart2) {
const filteredList = item.list.filter(subItem => {
// 将目标字符串转换为小写，使匹配不区分大小写
const introductionLowerCase = subItem.introduction.toLowerCase();
const topicEnLowerCase = subItem.topicEn.toLowerCase();
// 检查 introduction 或 topicEn 是否包含小写的 searchKeyword
return (
introductionLowerCase.includes(searchKeywordLowerCase) ||
topicEnLowerCase.includes(searchKeywordLowerCase)
);
});
// 如果有匹配项，添加到 filteredSlander 中
if (filteredList.length > 0) {
filteredSlander.push({
label: item.label,
list: filteredList
});
}
}
// 更新 this.slander
this.slanderpart2 = filteredSlander;
}else if(this.selectedOption=='Part3'){
const filteredSlander = [];
// 将搜索关键字转换为小写，使搜索不区分大小写
const searchKeywordLowerCase = this.searchKeyword.toLowerCase();
// 遍历原始数据
for (const item of this.originslanderpart3) {
const filteredList = item.list.filter(subItem => {
// 将目标字符串转换为小写，使匹配不区分大小写
const introductionLowerCase = subItem.introduction.toLowerCase();
const topicEnLowerCase = subItem.topicEn.toLowerCase();
// 检查 introduction 或 topicEn 是否包含小写的 searchKeyword
return (
introductionLowerCase.includes(searchKeywordLowerCase) ||
topicEnLowerCase.includes(searchKeywordLowerCase)
);
});
// 如果有匹配项，添加到 filteredSlander 中
if (filteredList.length > 0) {
filteredSlander.push({
label: item.label,
list: filteredList
});
}
}
// 更新 this.slander
this.slanderpart3 = filteredSlander;
}
},
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;
},
calculateTotalLength() {
this.totalLength = this.selectspeak.length + this.selectwrite.length + this.selectlisten.length + this.selectread.length;
},
calculateTotal(array) {
return array.reduce((total, item) => {
// 假设每个元素都有一个名为value的属性
return total + (item.value || 0); // 如果value为undefined，将其视为0
}, 0);
},
updateSelectspeak(items, type, indexs) {
// 切换slander数组中的值
items[type] = !items[type];
// 获取对应的speakingType值
const speakingTypeValue = this.getSpeakingTypeValue(type);
// 检查selectspeak数组中是否已存在对应的对象
const existingSelectspeak = this.selectspeak.find(select => select.id === items.id);
if (existingSelectspeak) {
// 如果已存在，在speakingType中添加新的值或移除对应的值
if (items[type]) {
// 如果选中了该项，请添加speakingType
if (!existingSelectspeak.speakingType.includes(speakingTypeValue)) {
existingSelectspeak.speakingType.push(speakingTypeValue);
}
} else {
// 如果取消选中该项，请删除speakingType
existingSelectspeak.speakingType = existingSelectspeak.speakingType
.filter(value => value !== speakingTypeValue);
// 如果speakingType为空，则清除selectspeak项
if (existingSelectspeak.speakingType.length === 0) {
const indexToRemove = this.selectspeak.indexOf(existingSelectspeak);
this.selectspeak.splice(indexToRemove, 1);
}
}
} else {
// 如果不存在，创建新的对象并添加到selectspeak数组中
if (items[type]) {
this.selectspeak.push({
// part: indexs,
part: items.part,
topicEn: items.topicEn,
id: items.id,
introduction: items.introduction,
speakingType: [speakingTypeValue]
});
}
}
this.calculateTotalLength()
console.log(this.selectspeak, 'selectspeakselectspeak');
},
getSpeakingTypeValue(type) {
// 返回对应的数字值
switch (type) {
case 'ischuanti':
return '1';
case 'isgendu':
return '2';
case 'ismk':
return '3';
default:
return '';
}
},
upType(index, num) { upType(index, num) {
this.listType.splice(index, 1, num) this.listType.splice(index, 1, num)
}, },
@ -198,15 +578,118 @@
} }
}, },
getList() { getList() {
this.$u.post('https://api.admin-v2.langsi.online/admin-api/speaking/topic/home/list', this.postdata).then(res => { let postdata= {
"key": "",
"pageNum": 0,
"mode": "home",
"part": "part1",
"order": "0",
"type": "",
"isStudy": 0,
"isFavorite": 0,
"isEvlua": 0,
"isFun": 0,
"level": 0,
"isNew": 0
}
this.$u.post('https://api.admin-v2.langsi.online/admin-api/speaking/topic/home/list', postdata).then(res => {
if(res.code==0){
this.getpart2()
}
let keyArr = Object.keys(res.data) let keyArr = Object.keys(res.data)
let valueArr = Object.values(res.data) let valueArr = Object.values(res.data)
this.slander = keyArr.map((item, index) => { this.slanderpart1 = keyArr.map((item, index) => {
return { return {
label: item, label: item,
list: valueArr[index] list: valueArr[index]
} }
}) })
this.originslanderpart1 = keyArr.map((item, index) => {
return {
label: item,
list: valueArr[index]
}
})
this.originslanderpart1part1 = JSON.parse(JSON.stringify(this.originslanderpart1part1));
let json = JSON.stringify(res.data)
// console.log(json);
})
},
getpart2(){
let postdata1= {
"key": "",
"pageNum": 0,
"mode": "home",
"part": "part2",
"order": "0",
"type": "",
"isStudy": 0,
"isFavorite": 0,
"isEvlua": 0,
"isFun": 0,
"level": 0,
"isNew": 0
}
this.$u.post('https://api.admin-v2.langsi.online/admin-api/speaking/topic/home/list', postdata1).then(res => {
if(res.code==0){
this.getpart3()
}
let keyArr = Object.keys(res.data)
let valueArr = Object.values(res.data)
this.slanderpart2 = keyArr.map((item, index) => {
return {
label: item,
list: valueArr[index]
}
})
this.originslanderpart2 = keyArr.map((item, index) => {
return {
label: item,
list: valueArr[index]
}
})
this.originslanderpart2 = JSON.parse(JSON.stringify(this.originslanderpart2));
// let json = JSON.stringify(res.data)
})
},
getpart3(){
let postdata2= {
"key": "",
"pageNum": 0,
"mode": "home",
"part": "part3",
"order": "0",
"type": "",
"isStudy": 0,
"isFavorite": 0,
"isEvlua": 0,
"isFun": 0,
"level": 0,
"isNew": 0
}
this.$u.post('https://api.admin-v2.langsi.online/admin-api/speaking/topic/home/list', postdata2).then(res => {
let keyArr = Object.keys(res.data)
let valueArr = Object.values(res.data)
this.slanderpart3 = keyArr.map((item, index) => {
return {
label: item,
list: valueArr[index]
}
})
this.originslanderpart3 = keyArr.map((item, index) => {
return {
label: item,
list: valueArr[index]
}
})
this.originslanderpart3 = JSON.parse(JSON.stringify(this.originslanderpart3));
let json = JSON.stringify(res.data)
// console.log(json);
}) })
}, },
//下拉显示下拉框 //下拉显示下拉框
@ -223,44 +706,81 @@
} else if (id == 2) { } else if (id == 2) {
this.postdata.part = "part2" this.postdata.part = "part2"
this.part2=true this.part2 = true
this.grizzly = false this.grizzly = false
this.getList()
} }
else if (id == 3) { else if (id == 3) {
this.postdata.part = "part3" this.postdata.part = "part3"
this.part2=true this.part2 = true
this.grizzly = false this.grizzly = false
this.getList()
}else { } else {
this.postdata.part = "part1" this.postdata.part = "part1"
this.part2= false this.part2 = false
this.grizzly = true this.grizzly = true
this.getList()
} }
}) })
}, },
clicking(target, type) { clicking(target, type) {
if (target.active === type) {
this.$set(target, 'active', null);
} else {
this.$set(target, 'active', type);
}
}, },
radioGroupChange() { radioGroupChange() {
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.view_template { .view_template {
width: 100%; width: 100%;
background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%); background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%);
}
.serchbox {
padding: 0 32rpx;
display: flex;
flex-wrap: nowrap;
margin-top: 30rpx;
align-items: center;
width: 686rpx;
height: 88rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
.serchimg {
width: 30.51rpx;
height: 32rpx;
margin-right: 24rpx;
} }
.view_body { .input {
margin: 0 auto;
width: 568rpx;
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;
}
}
.view_body {
height: 89vh; height: 89vh;
width: 91.3%; width: 91.3%;
margin: 0 auto; margin: 0 auto;
@ -275,6 +795,7 @@
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
} }
.view_button { .view_button {
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;
padding: 12rpx 24rpx; padding: 12rpx 24rpx;
@ -338,7 +859,7 @@
.active { .active {
z-index: 9; z-index: 9;
background:#2D7CE6; background: #2D7CE6;
color: #fff; color: #fff;
} }
@ -416,12 +937,14 @@
swiper-item { swiper-item {
overflow: scroll; overflow: scroll;
} }
.slander_left { .slander_left {
width: 328rpx; width: 328rpx;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
overflow: hidden overflow: hidden
} }
.view_left { .view_left {
display: flex; display: flex;
justify-content: left; justify-content: left;
@ -518,21 +1041,24 @@
.bottom_one { .bottom_one {
display: flex; display: flex;
view { view {
padding: 6rpx 18rpx; padding: 6rpx 18rpx;
background: #F4F4F4; background: #F4F4F4;
border-radius: 12rpx 12rpx 12rpx 12rpx; border-radius: 12rpx 12rpx 12rpx 12rpx;
font-size: 20rpx; font-size: 20rpx;
font-weight: 500; font-weight: 500;
color: rgba(101,116,140,0.8); color: rgba(101, 116, 140, 0.8);
margin-left: 15rpx; margin-left: 15rpx;
} }
.active { .active {
background: rgba(45, 124, 230, 0.1); background: rgba(45, 124, 230, 0.1);
color: #2D7CE6; color: #2D7CE6;
} }
} }
.pull_down{
.pull_down {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
width: 100rpx; width: 100rpx;
@ -541,17 +1067,18 @@
} }
.footer { .footer {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25); box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25);
padding: 30rpx 32rpx; padding: 30rpx 32rpx;
} }
.footer2{
.footer2 {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
@ -559,104 +1086,108 @@
box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25); box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25);
padding: 30rpx 32rpx; padding: 30rpx 32rpx;
margin-top: 25rpx; margin-top: 25rpx;
} }
.footer_button { .footer_button {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.button_ky { .button_ky {
padding: 24rpx 52rpx; padding: 24rpx 52rpx;
border-radius: 104rpx 104rpx 104rpx 104rpx; border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #2E4975; color: #2E4975;
background-color: #FAFAFA; background-color: #FAFAFA;
} }
.button_andadd { .button_andadd {
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx; border-radius: 104rpx 104rpx 104rpx 104rpx;
padding: 26rpx 125rpx; padding: 26rpx 125rpx;
color: #fff; color: #fff;
} }
.button_show { .button_show {
width: 100%; width: 100%;
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx; border-radius: 104rpx 104rpx 104rpx 104rpx;
padding: 26rpx 125rpx; padding: 26rpx 125rpx;
color: #fff; color: #fff;
text-align: center; text-align: center;
} }
.view_fff_bottom { .view_fff_bottom {
margin-bottom: 54rpx; margin-bottom: 54rpx;
} }
.Task { .Task {
font-size: 24rpx; font-size: 24rpx;
font-weight: 500; font-weight: 500;
color: #2E4975; color: #2E4975;
} }
.view_left { .view_left {
display: flex; display: flex;
justify-content: left; justify-content: left;
margin-top: 20rpx; margin-top: 20rpx;
} }
.view_left_pd { .view_left_pd {
position: relative; position: relative;
padding: 12rpx 32rpx; padding: 12rpx 32rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-right: 15rpx; margin-right: 15rpx;
font-size: 24rpx; font-size: 24rpx;
} }
.pull_Down { .pull_Down {
position: absolute; position: absolute;
bottom: -130rpx; bottom: -130rpx;
left: 50%; left: 50%;
margin-left: -79rpx; margin-left: -79rpx;
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0,0,0,0.25); box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.25);
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
background: #FFFFFF; background: #FFFFFF;
border-bottom: 2rpx solid #F2F2F2; border-bottom: 2rpx solid #F2F2F2;
view { view {
padding: 15rpx 50rpx; padding: 15rpx 50rpx;
border-bottom: 2rpx solid #F2F2F2; border-bottom: 2rpx solid #F2F2F2;
} }
} }
.pull_DownTow{
.pull_DownTow {
width: 150rpx; width: 150rpx;
position: absolute; position: absolute;
bottom: -133rpx; bottom: -133rpx;
left: 50%; left: 50%;
margin-left: -72rpx; margin-left: -72rpx;
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0,0,0,0.25); box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.25);
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
background: #FFFFFF; background: #FFFFFF;
border-bottom: 2rpx solid #F2F2F2; border-bottom: 2rpx solid #F2F2F2;
text-align: center; text-align: center;
view { view {
padding: 15rpx 0rpx; padding: 15rpx 0rpx;
border-bottom: 2rpx solid #F2F2F2; border-bottom: 2rpx solid #F2F2F2;
} }
} }
.pull_Down view:last-child {
.pull_Down view:last-child {
border: none; border: none;
} }
.sl_body { .sl_body {
background-color: #fff; background-color: #fff;
} }
.footer_button_right { .footer_button_right {
padding: 24rpx 62rpx; padding: 24rpx 62rpx;
border: 1px solid #2D7CE6; border: 1px solid #2D7CE6;
border-radius: 104rpx 104rpx 104rpx 104rpx; border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #2D7CE6; color: #2D7CE6;
} }
</style> </style>