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

This commit is contained in:
taoxu 2023-12-08 22:57:06 +08:00
parent 5b50cad2fc
commit f805ef513e
5 changed files with 1875 additions and 1093 deletions

View File

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

View File

@ -1,7 +1,7 @@
<template>
<view class="searchpage">
<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" />
<view class="serchbox">
<view class="serchimg">
@ -71,6 +71,7 @@
},
methods: {
addstu() {
console.log('调用了');
uni.setStorageSync('selectedStuInfo', this.selectedIds);
// Navigate back to the previous page

View File

@ -1,49 +1,58 @@
<template>
<!-- 外层循环 -->
<view>
<view v-for="(item,index) in transformedData" :key="index">
<view v-for="(item, index) in transformedData"
:key="index">
<!-- 剑18循环 -->
<view>
<view class="view_bages">
<view>{{item.examName}}</view>
<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>
<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 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>{{ Task }}</view>
<view>
<text class="fickle">{{item[text][Task].caption}}</text>
<text class="fickle2">{{item[text][Task].themeCaption}}</text>
<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,$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>
</template>
<script>
export default {
export default {
data() {
return {
transformedData: [],
//
subsetArr:[],
textArr:['test1','test2','test3','test4'],
taskArr:['task1','task2'],
subsetArr: [],
textArr: ['test1', 'test2', 'test3', 'test4'],
taskArr: ['task1', 'task2'],
//
comsapi: {
"key": "",
@ -55,6 +64,8 @@
"isStudy": 0,
"isEval": 0
},
orgtransformedData: [],
selectwrite: [],
}
},
created() {
@ -65,70 +76,114 @@
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) {
for (let a of arr) {
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) {
item.active = text
this.$forceUpdate()
},
checkboxChange(e,id){
if(id.value) {
this.subsetArr.push(e)
}else {
let index=this.subsetArr.indexOf(e);
if(e!==-1) {
this.subsetArr.splice(index, 1);
checkboxChange(item, text, Task, event) {
const examName = item.examName;
const test = text; // text test
const taskId = Task; // Task task
const id = String(item[test][taskId].id);
//
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>
<style lang="scss" scoped>
.view_bages {
.view_bages {
font-size: 40rpx;
font-weight: 400;
color: #2E4975;
}
.substance {
}
.substance {
margin: 20rpx 0;
text {
padding: 10rpx 30rpx;
margin-right: 20rpx;
background: #FFFFFF;
border-radius: 12rpx 12rpx 12rpx 12rpx;
}
}
.compose_bodys{
}
.compose_bodys {
margin: 30rpx 0;
}
.compose_body {
.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 {
}
.compose_body:last-child {
border: none;
}
.zz{
}
.zz {
background: #ffff;
border-radius: 12rpx 12rpx 12rpx 12rpx;
}
.compose_left {
}
.compose_left {
display: flex;
padding: 24rpx 0;
margin: 0 24rpx;
}
.fickle {
}
.fickle {
padding: 4rpx 22rpx;
font-size: 20rpx;
font-weight: 500;
@ -136,8 +191,9 @@
margin-left: 12rpx;
background: #E1EEFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.fickle2 {
}
.fickle2 {
padding: 4rpx 32rpx;
font-size: 20rpx;
font-weight: 500;
@ -145,9 +201,10 @@
margin-left: 12rpx;
background: #FFEBD7;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.active {
}
.active {
color: #fff;
background: #007AFF !important;
}
}
</style>

View File

@ -1,13 +1,21 @@
<template>
<view class="concent">
<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>
<view class="view_header">
<view class="view_title">标题</view>
<view class="view_input">
<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>
</view>
</view>
@ -15,30 +23,42 @@
<view>
<view class="view_tubiao">
<view class="view_title">班级安排</view>
<view class="view_tb" @click="addclass()">
<view class="view_tb"
@click="addclass()">
+
</view>
</view>
<view class="noting" v-if="classinfo.length<=0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H" ></image>
<view class="noting"
v-if="classinfo.length <= 0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H"></image>
<view class="text1">
暂未安排哦
</view>
<view class="text2" @click="addclass()">
<view class="text2"
@click="addclass()">
去安排
</view>
</view>
<view class="class_bj">
<view class="class_images" >
<view class="class_ys" v-for="(item,index) in classinfo" :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 class="class_images">
<view class="class_ys"
v-for="(item, index) in classinfo"
: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 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 class="class_wz">{{item.name}}</view>
<view class="class_wz">{{ item.name }}</view>
</view>
@ -49,30 +69,41 @@
<view>
<view class="view_tubiao">
<view class="view_title">学员安排</view>
<view class="view_tb" @click="toaddstu()">
<view class="view_tb"
@click="toaddstu()">
+
</view>
</view>
<view class="noting" v-if="stuinfo.length<=0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H" ></image>
<view class="noting"
v-if="stuinfo.length <= 0">
<image src="https://file.langsi.online/yasiimg/web/static/ulqScWZvBYd22CW5uV0H"></image>
<view class="text1">
暂未安排哦
</view>
<view class="text2" @click="toaddstu()">
<view class="text2"
@click="toaddstu()">
去安排
</view>
</view>
<view class="class_bj" >
<view class="class_bj">
<view class="class_images">
<view class="class_ys" v-for="(item,index) in stuinfo" :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 class="class_ys"
v-for="(item, index) in stuinfo"
: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 class="class_tp">
<image :src="item.avatar" mode=""></image>
<image :src="item.avatar"
mode=""></image>
</view>
<view class="class_wz">{{item.name}}</view>
<view class="class_wz">{{ item.name }}</view>
</view>
</view>
@ -89,7 +120,8 @@
</view>
<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-item nodeTop="2">
<template v-slot:content>
@ -143,71 +175,62 @@
</view>
</view>
</view>
<view>
<view class="Ielts">IELTS 18</view>
<view style="background-color: #fff; padding: 32rpx 40rpx;">
<view v-for="(item,index) in selectwritelist" :key="index">
<view class="Ielts">{{item.examName}}</view>
<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 class="yuandi"></view>
<view class="Test">Test 2</view>
<view class="ellipses">听力</view>
<view class="Test">{{items.test}}</view>
<view class="ellipses">写作</view>
</view>
<view class="u-order-desc">
<text>Part 1多选题</text>
<text>{{items.task}}</text>
</view>
</view>
</view>
<view>
<view>
<view class="Ielts">IELTS 18</view>
<view style="background-color: #fff; padding: 32rpx 40rpx;">
<view class="Ielts"></view>
<view
style="background-color: #fff; padding: 32rpx 40rpx;border-radius: 20rpx 20rpx 20rpx 20rpx;">
<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>
<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 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>
</template>
</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>
</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">
<u-icon name="plus"></u-icon>
添加
@ -223,9 +246,17 @@
</view>
<view>
<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-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>
@ -238,21 +269,29 @@
<view class="view_title">描述</view>
</view>
<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 class="view_footer" @click="submit">
<view class="view_button" >确认添加 </view>
<!-- 按钮 -->
<view class="zhanwei"
style="width: 100%;height: 230rpx;">
</view>
<view class="botbtn">
<view class="btn"
@click="addclassinfo()">
确定添加
</view>
</view>
</view>
</template>
<script>
export default {
export default {
data() {
return {
bgc: {
@ -270,10 +309,15 @@
show: false,
radio: '',
switchVal: false,
classinfo:[],
stuinfo:[],
worktit:'',
times:'',
classinfo: [],
stuinfo: [],
worktit: '',
times: '',
selectspeak: [],
selectwrite: [],
selectlisten: [],
selectread: [],
selectwritelist: []
}
},
@ -281,23 +325,21 @@
uni.removeStorageSync('selectedClassInfo');
uni.removeStorageSync('selectedStuInfo');
// this.classinfo=JSON.parse(decodeURIComponent(option.classinfo))
let classinofs=[
{
name:'阅读5班',
avatar:'Excepteur',
id:15,
let classinofs = [{
name: '阅读5班',
avatar: 'Excepteur',
id: 15,
}
]
this.classinfo=classinofs
}]
this.classinfo = classinofs
},
onShow() {
// Read selectedClassInfo data
const selectedClassInfo = uni.getStorageSync('selectedClassInfo');
console.log(selectedClassInfo,'selectedClassInfoselectedClassInfo');
if (selectedClassInfo && selectedClassInfo.length > 0) {
this.classinfo=selectedClassInfo
this.classinfo = selectedClassInfo
// Remove duplicates from this.classinfo
// this.classinfo = this.classinfo.filter(item => !selectedClassInfo.some(selectedItem => selectedItem.id === item.id));
@ -308,7 +350,7 @@
const selectedstuInfo = uni.getStorageSync('selectedStuInfo');
if (selectedstuInfo && selectedstuInfo.length > 0) {
this.stuinfo=selectedstuInfo
this.stuinfo = selectedstuInfo
// Remove duplicates from this.classinfo
// this.stuinfo = this.stuinfo.filter(item => !selectedstuInfo.some(selectedItem => selectedItem.id === item.id));
@ -316,15 +358,107 @@
// 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:{
delcls(id){
methods: {
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);
},
delstu(id){
delstu(id) {
this.stuinfo = this.stuinfo.filter(item => item.id !== id);
},
toaddstu(){
toaddstu() {
uni.navigateTo({
url: "/pages_teacher/pages_add/add_studentsforwork?stuinfo=" + encodeURIComponent(JSON.stringify(this.stuinfo))
@ -334,9 +468,10 @@
});
},
addclass(){
addclass() {
uni.navigateTo({
url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this.classinfo))
url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this
.classinfo))
}).then(res => {
}).catch(err => {
@ -345,51 +480,80 @@
},
//
printValue(e){
this.times=`${e.year}-${e.month}-${e.day}`
printValue(e) {
this.times = `${e.year}-${e.month}-${e.day}`
},
submit() {
}
}
}
}
</script>
<style lang="scss" scoped>
// 穿
::v-deep .u-dot {
background: #2D7CE6 !important;
.botbtn {
padding: 32rpx 32rpx 0 32rpx;
// 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;
background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%);
}
}
.view_body {
.view_body {
width: 91.3%;
margin: 0 auto;
}
}
.view_title {
.view_title {
font-size: 28rpx;
font-family: 'PingFang';
font-weight: 800;
color: #2E4975;
}
}
.view_input {
.view_input {
line-height: 70rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-top: 16rpx;
padding: 0 24rpx;
}
}
.view_tubiao {
.view_tubiao {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 46rpx;
.view_tb{
.view_tb {
display: flex;
padding-left: 24rpx;
// align-items: center;
@ -401,11 +565,12 @@
border: 2rpx solid #F1F1F1;
color: #F18F21 ;
color: #F18F21;
font-size: 30rpx;
}
}
.noting{
}
.noting {
display: flex;
flex-wrap: nowrap;
align-items: center;
@ -415,18 +580,21 @@
height: 124rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
image{
image {
width: 58.19rpx;
height: 60rpx;
}
.text1{
.text1 {
margin-left: 12rpx;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #627698;
}
.text2{
.text2 {
margin-left: 12rpx;
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
@ -434,33 +602,37 @@
color: #2D7CE6;
border-bottom: 2px solid #2D7CE6;
}
}
.class_bj {
margin-top: 16rpx;
}
}
.class_images {
.class_bj {
margin-top: 16rpx;
}
.class_images {
display: flex;
flex-wrap: wrap;
// justify-content: space-between;
// margin-top: 20rpx;
}
}
.class_tp {
.class_tp {
width: 56rpx;
height: 56rpx;
margin-right: 12rpx;
}
.Ielts{
}
.Ielts {
font-size: 40rpx;
font-weight: 400;
color: #2E4975;
margin: 20rpx 0;
}
.class_ys:nth-child(3n) {
}
.class_ys:nth-child(3n) {
margin-right: 0;
}
.class_ys {
}
.class_ys {
margin-top: 20rpx;
margin-right: 20rpx;
width: 215rpx;
@ -473,10 +645,10 @@
height: 96rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
}
.class_wz {
.class_wz {
width: 125rpx;
font-size: 28rpx;
font-family: 'PingFang';
@ -485,40 +657,46 @@
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.view_form{
}
.view_form {
padding: 0rpx 32rpx;
background: #FFFFFF;
margin-top: 16rpx;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
.view_textrea{
}
.view_textrea {
height: 260rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;;
margin-top:16rpx;
border-radius: 20rpx 20rpx 20rpx 20rpx;
;
margin-top: 16rpx;
padding: 28rpx 32rpx;
}
.view_button{
}
.view_button {
width: 93.1%;
margin:auto;
margin: auto;
text-align: center;
line-height: 80rpx;
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #FFFFFF;
}
.view_footer{
}
.view_footer {
width: 100%;
padding: 0 16rpx;
height: 144rpx;
border-radius: 40rpx 40rpx 0rpx 0rpx;
padding: 32rpx 0rpx;
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;
}
.u-node {
}
.u-node {
width: 44rpx;
height: 44rpx;
border-radius: 100rpx;
@ -526,65 +704,80 @@
justify-content: center;
align-items: center;
background: #d0d0d0;
}
.u-order-desc {
}
.u-order-desc {
display: block;
// flex-wrap: nowrap;
padding: 20rpx;
background: #F9F9F9;
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin: 12rpx 0rpx;
text {
.txt {
font-size: 24rpx;
font-weight: 500;
color: #2E4975;
}
}
}
.u-order-time {
.u-order-time {
color: rgb(200, 200, 200);
font-size: 26rpx;
}
.yuandi{
}
.yuandi {
width: 18rpx;
height: 18rpx;
background: #2D7CE6;
border-radius: 24rpx 24rpx 24rpx 24rpx;
}
.Test{
}
.Test {
font-size: 28rpx;
font-weight: 800;
color: #2E4975;
margin-left: 12rpx;
}
.ellipses{
}
.ellipses {
font-size: 20rpx;
background: rgba(242,170,2,0.2);
background: rgba(242, 170, 2, 0.2);
margin-left: 12rpx;
padding: 8rpx 20rpx;
color: #F2AA02;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
.erotic{
}
.erotic {
display: flex;
justify-content: center;
align-items: center;
width: 80rpx;
height: 36rpx;
font-size: 20rpx;
background: rgba(242,63,170,0.1);
background: rgba(242, 63, 170, 0.1);
margin-left: 12rpx;
padding: 8rpx 20rpx;
// padding: 8rpx 20rpx;
color: #F23FEB;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
.greener{
}
.greener {
font-size: 20rpx;
background: rgba(27,225,178,0.1);
background: rgba(27, 225, 178, 0.1);
margin-left: 12rpx;
padding: 8rpx 20rpx;
color: #1BE1B2;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
.increase{
}
.increase {
padding: 26rpx 125rpx;
color: #FFFFFF;
background-color: #F39852;
border-radius: 20rpx 20rpx 20rpx 20rpx;
text-align: center;
}
}
</style>

View File

@ -1,69 +1,228 @@
<template>
<view class="view_template">
<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>
<!-- 搜索 -->
<view class="view_search" v-if="search">
<u-search :show-action="false" :animation="true" bg-color="#fff" placeholder="搜索相关内容..." color="#3E97FF"></u-search>
<view class="view_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 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">
<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>
<!-- 轮播图 -->
<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;">
<view>
<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>{{selectedOption}}</view>
<u-icon name="arrow-down" size="22"></u-icon>
<view>{{ selectedOption }}</view>
<u-icon name="arrow-down"
size="22"></u-icon>
</view>
<view class="pull_Down" v-if="arrow">
<view v-for="(item,index) in options" :key="index" @click="arrow_options(item.id)">{{item.name}}</view>
<view class="pull_Down"
v-if="arrow">
<view v-for="(item, index) in options"
:key="index"
@click="arrow_options(item.id)">{{ item.name }}</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="header_part">
<view class="unite">{{item.label}}</view>
<view class="unite">{{ item.label }}</view>
</view>
<view class="bottom_one" v-if="part2">
<view :class="{'active': item.active === '串题'}" @click="clicking(item, '串题')">串题</view>
<view :class="{'active': item.active === '跟读'}" @click="clicking(item, '跟读')">跟读</view>
<view :class="{'active': item.active === '模考'}" @click="clicking(item, '模考')">模考</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="grizzly">
<view class="slander_of" v-for="(items,indexs) in item.list" :key='indexs'>
<view class="textual">
{{items.topicEn}}
<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.active === '串题'}" @click="clicking(items, '串题')">串题</view>
<view :class="{'active': items.active === '跟读'}" @click="clicking(items, '跟读')">跟读</view>
<view :class="{'active': items.active === '模考'}" @click="clicking(items, '模考')">模考</view>
<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="part2">
<view class="slander_of" v-for="(items,indexs) in item.list" :key='indexs'>
<view class="textual2">
{{items.topicEn}}
<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>
<!-- 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>
</swiper-item>
<!-- 写作 -->
<swiper-item>
@ -80,22 +239,23 @@
</swiper>
</view>
<!-- 底部按钮 -->
<view :class="search== true ? 'footer2' : 'footer'">
<view class="footer_button">
<view :class="search==true ? 'button_andadd' :'button_show'">确定添加4</view>
<view class="footer_button_right" v-if="search">口语模考</view>
<view :class="search == true ? 'footer2' : 'footer'"
v-if="totalLength != 0">
<view class="footer_button" @click="submessage()">
<view :class="search == true ? 'button_andadd' : 'button_show'">确定添加{{ totalLength }}</view>
<view class="footer_button_right"
v-if="search">口语模考</view>
</view>
</view>
</view>
</view>
</template>
</view></template>
<script>
import audiology from './components/audiology.vue'
import reading from './components/reading.vue'
import slander from './components/slander.vue'
import compose from './components/compose.vue'
export default {
import audiology from './components/audiology.vue'
import reading from './components/reading.vue'
import slander from './components/slander.vue'
import compose from './components/compose.vue'
export default {
data() {
return {
//
@ -118,11 +278,11 @@
}],
//
Compose: [],
num:0,
num: 0,
// v-if
radioValue: '',
part1: true,
current: 0,
current: 1,
search: true,
listType: [],
idList: [],
@ -141,9 +301,14 @@
"level": 0,
"isNew": 0
},
slander: [],
part2:false,
grizzly:true,
slanderpart1: [],
originslanderpart1: [],
slanderpart2: [],
originslanderpart2: [],
slanderpart3: [],
originslanderpart3: [],
part2: false,
grizzly: true,
categorize: '分类',
// v-if
selectedOption: 'Part1',
@ -162,10 +327,16 @@
name: 'Part3'
}
],
userId:null
totalLength: 0,
searchKeyword: '',
userId: null,
selectspeak: [],
selectwrite: [],
selectlisten: [],
selectread: []
}
},
components:{
components: {
audiology,
reading,
compose
@ -173,7 +344,216 @@
created() {
this.getList()
},
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); // valueundefined0
}, 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);
// speakingTypeselectspeak
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) {
this.listType.splice(index, 1, num)
},
@ -198,15 +578,118 @@
}
},
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 valueArr = Object.values(res.data)
this.slander = keyArr.map((item, index) => {
this.slanderpart1 = keyArr.map((item, index) => {
return {
label: item,
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) {
this.postdata.part = "part2"
this.part2=true
this.part2 = true
this.grizzly = false
this.getList()
}
else if (id == 3) {
this.postdata.part = "part3"
this.part2=true
this.part2 = true
this.grizzly = false
this.getList()
}else {
} else {
this.postdata.part = "part1"
this.part2= false
this.part2 = false
this.grizzly = true
this.getList()
}
})
},
clicking(target, type) {
if (target.active === type) {
this.$set(target, 'active', null);
} else {
this.$set(target, 'active', type);
}
},
radioGroupChange() {
}
}
}
}
</script>
<style lang="scss" scoped>
.view_template {
.view_template {
width: 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;
width: 91.3%;
margin: 0 auto;
@ -275,6 +795,7 @@
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
.view_button {
border-radius: 12rpx 12rpx 12rpx 12rpx;
padding: 12rpx 24rpx;
@ -338,7 +859,7 @@
.active {
z-index: 9;
background:#2D7CE6;
background: #2D7CE6;
color: #fff;
}
@ -416,12 +937,14 @@
swiper-item {
overflow: scroll;
}
.slander_left {
width: 328rpx;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden
}
.view_left {
display: flex;
justify-content: left;
@ -518,21 +1041,24 @@
.bottom_one {
display: flex;
view {
padding: 6rpx 18rpx;
background: #F4F4F4;
border-radius: 12rpx 12rpx 12rpx 12rpx;
font-size: 20rpx;
font-weight: 500;
color: rgba(101,116,140,0.8);
color: rgba(101, 116, 140, 0.8);
margin-left: 15rpx;
}
.active {
background: rgba(45, 124, 230, 0.1);
color: #2D7CE6;
}
}
.pull_down{
.pull_down {
display: flex;
justify-content: space-between;
width: 100rpx;
@ -541,17 +1067,18 @@
}
}
.footer {
.footer {
position: fixed;
bottom: 0;
width: 100%;
background: #FFFFFF;
box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25);
padding: 30rpx 32rpx;
}
.footer2{
}
.footer2 {
position: fixed;
bottom: 0;
width: 100%;
@ -559,104 +1086,108 @@
box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25);
padding: 30rpx 32rpx;
margin-top: 25rpx;
}
}
.footer_button {
.footer_button {
display: flex;
justify-content: space-between;
}
}
.button_ky {
.button_ky {
padding: 24rpx 52rpx;
border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #2E4975;
background-color: #FAFAFA;
}
}
.button_andadd {
.button_andadd {
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx;
padding: 26rpx 125rpx;
color: #fff;
}
}
.button_show {
.button_show {
width: 100%;
background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%);
border-radius: 104rpx 104rpx 104rpx 104rpx;
padding: 26rpx 125rpx;
color: #fff;
text-align: center;
}
}
.view_fff_bottom {
.view_fff_bottom {
margin-bottom: 54rpx;
}
}
.Task {
.Task {
font-size: 24rpx;
font-weight: 500;
color: #2E4975;
}
}
.view_left {
.view_left {
display: flex;
justify-content: left;
margin-top: 20rpx;
}
}
.view_left_pd {
.view_left_pd {
position: relative;
padding: 12rpx 32rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-right: 15rpx;
font-size: 24rpx;
}
}
.pull_Down {
.pull_Down {
position: absolute;
bottom: -130rpx;
left: 50%;
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;
background: #FFFFFF;
border-bottom: 2rpx solid #F2F2F2;
view {
padding: 15rpx 50rpx;
border-bottom: 2rpx solid #F2F2F2;
}
}
.pull_DownTow{
}
.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);
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 view:last-child {
}
.pull_Down view:last-child {
border: none;
}
}
.sl_body {
.sl_body {
background-color: #fff;
}
}
.footer_button_right {
.footer_button_right {
padding: 24rpx 62rpx;
border: 1px solid #2D7CE6;
border-radius: 104rpx 104rpx 104rpx 104rpx;
color: #2D7CE6;
}
}
</style>