diff --git a/pages/Mystudent/addclassforwork.vue b/pages/Mystudent/addclassforwork.vue index 50e8a14..24c840f 100644 --- a/pages/Mystudent/addclassforwork.vue +++ b/pages/Mystudent/addclassforwork.vue @@ -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"> diff --git a/pages_teacher/pages_add/add_studentsforwork.vue b/pages_teacher/pages_add/add_studentsforwork.vue index 6ced2bc..43e338f 100644 --- a/pages_teacher/pages_add/add_studentsforwork.vue +++ b/pages_teacher/pages_add/add_studentsforwork.vue @@ -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 diff --git a/pages_teacher/teacher_teachers/components/compose.vue b/pages_teacher/teacher_teachers/components/compose.vue index 4e33ba1..0bcbe65 100644 --- a/pages_teacher/teacher_teachers/components/compose.vue +++ b/pages_teacher/teacher_teachers/components/compose.vue @@ -1,153 +1,210 @@ <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 { - data() { - return { - transformedData: [], - // 复选框 - subsetArr:[], - textArr:['test1','test2','test3','test4'], - taskArr:['task1','task2'], - // 接口参数 - comsapi: { - "key": "", - "mode": "home", - "exam": "", - "caption": "0", - "themeCaption": "", - "type": "", - "isStudy": 0, - "isEval": 0 - }, +export default { + data() { + return { + transformedData: [], + // 复选框 + subsetArr: [], + textArr: ['test1', 'test2', 'test3', 'test4'], + taskArr: ['task1', 'task2'], + // 接口参数 + comsapi: { + "key": "", + "mode": "home", + "exam": "", + "caption": "0", + "themeCaption": "", + "type": "", + "isStudy": 0, + "isEval": 0 + }, + orgtransformedData: [], + selectwrite: [], + } + }, + created() { + this.getCompose() + }, + methods: { + //写作接口 + getCompose() { + this.$u.post('https://api.admin-v2.langsi.online/admin-api/writing/all/search', this.comsapi).then(res => { + let arr = res.data + for (let a of arr) { + a.active = 'test1' + } + this.transformedData = arr + 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(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) + // 更新其他状态... }, - created() { - this.getCompose() - }, - methods: { - //写作接口 - getCompose() { - this.$u.post('https://api.admin-v2.langsi.online/admin-api/writing/all/search', this.comsapi).then(res => { - let arr = res.data - for(let a of arr) { - a.active = 'test1' - } - this.transformedData =arr - }) - }, - textClick(item, text) { - item.active = text - this.$forceUpdate() - }, - checkboxChange(e,id){ - if(id.value) { - this.subsetArr.push(e) - }else { - let index=this.subsetArr.indexOf(e); - if(e!==-1) { - this.subsetArr.splice(index, 1); + 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 { - font-size: 40rpx; - font-weight: 400; - color: #2E4975; - } - .substance { - margin: 20rpx 0; - text { - padding: 10rpx 30rpx; - margin-right: 20rpx; - background: #FFFFFF; - border-radius: 12rpx 12rpx 12rpx 12rpx; - } - } -.compose_bodys{ - margin: 30rpx 0; +.view_bages { + font-size: 40rpx; + font-weight: 400; + color: #2E4975; } - .compose_body { - display: flex; + +.substance { + margin: 20rpx 0; + + text { + padding: 10rpx 30rpx; + margin-right: 20rpx; background: #FFFFFF; - align-items: center; - justify-content: space-between; - margin: 0rpx 20rpx; - border-bottom: 2rpx solid #F2F2F2; - } - .compose_body:last-child { - border: none; - } - .zz{ - background: #ffff; border-radius: 12rpx 12rpx 12rpx 12rpx; } - .compose_left { - display: flex; - padding: 24rpx 0; - margin: 0 24rpx; - } - .fickle { - padding: 4rpx 22rpx; - font-size: 20rpx; - font-weight: 500; - color: #2D7CE6; - margin-left: 12rpx; - background: #E1EEFF; - border-radius: 8rpx 8rpx 8rpx 8rpx; - } - .fickle2 { - padding: 4rpx 32rpx; - font-size: 20rpx; - font-weight: 500; - color: #FB9734; - margin-left: 12rpx; - background: #FFEBD7; - border-radius: 8rpx 8rpx 8rpx 8rpx; - } - .active { - color: #fff; - background: #007AFF !important; - } +} + +.compose_bodys { + margin: 30rpx 0; +} + +.compose_body { + display: flex; + background: #FFFFFF; + align-items: center; + justify-content: space-between; + margin: 0rpx 20rpx; + border-bottom: 2rpx solid #F2F2F2; +} + +.compose_body:last-child { + border: none; +} + +.zz { + background: #ffff; + border-radius: 12rpx 12rpx 12rpx 12rpx; +} + +.compose_left { + display: flex; + padding: 24rpx 0; + margin: 0 24rpx; +} + +.fickle { + padding: 4rpx 22rpx; + font-size: 20rpx; + font-weight: 500; + color: #2D7CE6; + margin-left: 12rpx; + background: #E1EEFF; + border-radius: 8rpx 8rpx 8rpx 8rpx; +} + +.fickle2 { + padding: 4rpx 32rpx; + font-size: 20rpx; + font-weight: 500; + color: #FB9734; + margin-left: 12rpx; + background: #FFEBD7; + border-radius: 8rpx 8rpx 8rpx 8rpx; +} + +.active { + color: #fff; + background: #007AFF !important; +} </style> diff --git a/pages_teacher/teacher_teachers/teacher_addOperation.vue b/pages_teacher/teacher_teachers/teacher_addOperation.vue index 69e9398..8ed530b 100644 --- a/pages_teacher/teacher_teachers/teacher_addOperation.vue +++ b/pages_teacher/teacher_teachers/teacher_addOperation.vue @@ -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,33 +23,45 @@ <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> - - + + </view> </view> </view> @@ -49,35 +69,46 @@ <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> - - + + </view> </view> <!-- 作业安排 --> @@ -89,17 +120,18 @@ </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> <view> <view style="display: flex;"> - + <view class="Test">Test 2</view> - + <view class="greener">听力</view> - + </view> <view class="u-order-desc"> <text>Part 1:多选题</text> @@ -107,114 +139,105 @@ </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="greener">听力</view> - + <u-time-line-item nodeTop="2"> + <template v-slot:content> + <view> + <view style="display: flex;"> + + <view class="Test">Test 2</view> + + <view class="greener">听力</view> + + </view> + <view class="u-order-desc"> + <text>Part 1:多选题</text> + </view> </view> - <view class="u-order-desc"> - <text>Part 1:多选题</text> + </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="greener">听力</view> + + </view> + <view class="u-order-desc"> + <text>Part 1:多选题</text> + </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="greener">听力</view> - - </view> - <view class="u-order-desc"> - <text>Part 1:多选题</text> - </view> - </view> - </template> - </u-time-line-item> + </template> + </u-time-line-item> </u-time-line> </view> </view> </view> - <view> - <view class="Ielts">IELTS 18</view> - <view style="background-color: #fff; padding: 32rpx 40rpx;"> - <view style="display: flex; align-items: center;"> - <view class="yuandi"></view> - <view class="Test">Test 2</view> - <view class="ellipses">听力</view> - </view> - <view class="u-order-desc"> - <text>Part 1:多选题</text> - </view> + <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">{{items.test}}</view> + <view class="ellipses">写作</view> </view> + <view class="u-order-desc"> + <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 class="Test">Test 2</view> - - <view class="erotic">听力</view> - + <view style="display: flex;flex-wrap: nowrap;"> + + <view class="Test" + style="width: 80%;">{{ item.part }}-{{ item.introduction }}</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 class="increase"> - <u-icon name="plus"></u-icon> - 添加 - </view> + <!--按钮 --> + <view style="display: flex; justify-content: center; margin-top: 32rpx;" + @click="addwork()"> + <view class="increase"> + <u-icon name="plus"></u-icon> + 添加 + </view> </view> </view> - + </view> <!-- 截止时间 --> <view> @@ -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,353 +269,515 @@ <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;"/> - </view> - </view> - </view> - -<!-- 按钮 --> - <view class="view_footer" @click="submit"> - <view class="view_button" >确认添加 </view> - + <textarea value="" + placeholder="输入你的描述... " + placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;" /> + </view> </view> + </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 { - data() { - return { - bgc: { - backgroundColor: "#F6F9FC", - }, - // prick 时间选择框数据 - params: { - year: true, - month: true, - day: true, - hour: true, - minute: false, - second: false - }, - show: false, - radio: '', - switchVal: false, - classinfo:[], - stuinfo:[], - worktit:'', - times:'', - - } - }, - onLoad(option) { - uni.removeStorageSync('selectedClassInfo'); - uni.removeStorageSync('selectedStuInfo'); - // this.classinfo=JSON.parse(decodeURIComponent(option.classinfo)) - let classinofs=[ - { - name:'阅读5班', - avatar:'Excepteur', - id:15, - +export default { + data() { + return { + bgc: { + backgroundColor: "#F6F9FC", + }, + // prick 时间选择框数据 + params: { + year: true, + month: true, + day: true, + hour: true, + minute: false, + second: false + }, + show: false, + radio: '', + switchVal: false, + classinfo: [], + stuinfo: [], + worktit: '', + times: '', + selectspeak: [], + selectwrite: [], + selectlisten: [], + selectread: [], + selectwritelist: [] + + } + }, + onLoad(option) { + uni.removeStorageSync('selectedClassInfo'); + uni.removeStorageSync('selectedStuInfo'); + // this.classinfo=JSON.parse(decodeURIComponent(option.classinfo)) + let classinofs = [{ + name: '阅读5班', + avatar: 'Excepteur', + id: 15, + + }] + this.classinfo = classinofs + + }, + onShow() { + // Read selectedClassInfo data + const selectedClassInfo = uni.getStorageSync('selectedClassInfo'); + + if (selectedClassInfo && selectedClassInfo.length > 0) { + this.classinfo = selectedClassInfo + // Remove duplicates from this.classinfo + // this.classinfo = this.classinfo.filter(item => !selectedClassInfo.some(selectedItem => selectedItem.id === item.id)); + + // // Add non-duplicate items from selectedClassInfo to this.classinfo + // this.classinfo = this.classinfo.concat(selectedClassInfo); + + } + const selectedstuInfo = uni.getStorageSync('selectedStuInfo'); + + if (selectedstuInfo && selectedstuInfo.length > 0) { + this.stuinfo = selectedstuInfo + // 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); + + } + 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: [] + }; } - ] - this.classinfo=classinofs - - }, - onShow() { - // Read selectedClassInfo data - const selectedClassInfo = uni.getStorageSync('selectedClassInfo'); - console.log(selectedClassInfo,'selectedClassInfoselectedClassInfo'); - if (selectedClassInfo && selectedClassInfo.length > 0) { - this.classinfo=selectedClassInfo - // Remove duplicates from this.classinfo - // this.classinfo = this.classinfo.filter(item => !selectedClassInfo.some(selectedItem => selectedItem.id === item.id)); - - // // Add non-duplicate items from selectedClassInfo to this.classinfo - // this.classinfo = this.classinfo.concat(selectedClassInfo); - - } - const selectedstuInfo = uni.getStorageSync('selectedStuInfo'); - - if (selectedstuInfo && selectedstuInfo.length > 0) { - this.stuinfo=selectedstuInfo - // 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){ - this.classinfo = this.classinfo.filter(item => item.id !== id); - }, - delstu(id){ - this.stuinfo = this.stuinfo.filter(item => item.id !== id); - }, - toaddstu(){ - uni.navigateTo({ - url: "/pages_teacher/pages_add/add_studentsforwork?stuinfo=" + encodeURIComponent(JSON.stringify(this.stuinfo)) - - }).then(res => { - - }).catch(err => { - + + groupedItems[examName].message.push({ + test: item.test, + task: item.task, + id: item.id }); - }, - addclass(){ - uni.navigateTo({ - url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this.classinfo)) - }).then(res => { - - }).catch(err => { - - }); - }, - - // 获取截止时间 - printValue(e){ - this.times=`${e.year}-${e.month}-${e.day}` - }, - submit() { - - } + }); + + // 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: { + 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) { + this.stuinfo = this.stuinfo.filter(item => item.id !== id); + }, + toaddstu() { + uni.navigateTo({ + url: "/pages_teacher/pages_add/add_studentsforwork?stuinfo=" + encodeURIComponent(JSON.stringify(this.stuinfo)) + + }).then(res => { + + }).catch(err => { + + }); + }, + addclass() { + uni.navigateTo({ + url: "/pages/Mystudent/addclassforwork?classinfo=" + encodeURIComponent(JSON.stringify(this + .classinfo)) + }).then(res => { + + }).catch(err => { + + }); + }, + + // 获取截止时间 + printValue(e) { + this.times = `${e.year}-${e.month}-${e.day}` + }, + submit() { + } } +} </script> <style lang="scss" scoped> - // 样式穿透 - ::v-deep .u-dot { - background: #2D7CE6 !important; - } - .concent { - width: 100vw; - background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%); - } +.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; - .view_body { - width: 91.3%; - margin: 0 auto; - } - - .view_title { + .btn { + display: flex; + align-items: center; + justify-content: center; font-size: 28rpx; - font-family: 'PingFang'; + font-family: 'PingFang', 'PingFang'; font-weight: 800; - color: #2E4975; - } - - .view_input { - line-height: 70rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - margin-top: 16rpx; - padding: 0 24rpx; - } - - .view_tubiao { - display: flex; - justify-content: space-between; - align-items: center; - margin-top: 46rpx; - .view_tb{ - display: flex; - padding-left: 24rpx; - // align-items: center; - // padding: 11rpx 24rpx 11rpx 24rpx; - width: 120rpx; - height: 52rpx; - background: #FFFFFF; - border-radius: 26rpx 26rpx 26rpx 26rpx; - - border: 2rpx solid #F1F1F1; - - color: #F18F21 ; - font-size: 30rpx; - } - } - .noting{ - display: flex; - flex-wrap: nowrap; - align-items: center; - justify-content: center; - margin-top: 16rpx; + color: #FFFFFF; width: 686rpx; - height: 124rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - image{ - width: 58.19rpx; - height: 60rpx; - } - .text1{ - margin-left: 12rpx; - font-size: 24rpx; - font-family: PingFang SC, PingFang SC; - font-weight: 500; - color: #627698; - } - .text2{ - margin-left: 12rpx; - font-size: 24rpx; - font-family: PingFang SC, PingFang SC; - font-weight: 500; - color: #2D7CE6; - border-bottom: 2px solid #2D7CE6; - } - } - .class_bj { - margin-top: 16rpx; - } - - .class_images { - display: flex; - flex-wrap: wrap; - // justify-content: space-between; - // margin-top: 20rpx; - } - - .class_tp { - width: 56rpx; - height: 56rpx; - margin-right: 12rpx; - } - .Ielts{ - font-size: 40rpx; - font-weight: 400; - color: #2E4975; - margin: 20rpx 0; - } - .class_ys:nth-child(3n) { - margin-right: 0; - } - .class_ys { - margin-top: 20rpx; - margin-right: 20rpx; - width: 215rpx; - height: 96rpx; - display: flex; - justify-content: center; - align-items: center; - padding: 20rpx; - // width: 215rpx; - height: 96rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - - - .class_wz { - width: 125rpx; - font-size: 28rpx; - font-family: 'PingFang'; - font-weight: 500; - color: #072F5A; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - .view_form{ - padding: 0rpx 32rpx; - background: #FFFFFF; - margin-top: 16rpx; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - .view_textrea{ - height: 260rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx;; - margin-top:16rpx; - padding: 28rpx 32rpx; - } - .view_button{ - width: 93.1%; - margin:auto; - text-align: center; - line-height: 80rpx; + height: 80rpx; background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); border-radius: 104rpx 104rpx 104rpx 104rpx; - color: #FFFFFF; } - .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); - margin-top: 8rpx; +} + +// 样式穿透 +::v-deep .u-dot { + background: #2D7CE6 !important; +} + +.concent { + width: 100vw; + background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%); +} + +.view_body { + width: 91.3%; + margin: 0 auto; +} + +.view_title { + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 800; + color: #2E4975; +} + +.view_input { + line-height: 70rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + margin-top: 16rpx; + padding: 0 24rpx; +} + +.view_tubiao { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 46rpx; + + .view_tb { + display: flex; + padding-left: 24rpx; + // align-items: center; + // padding: 11rpx 24rpx 11rpx 24rpx; + width: 120rpx; + height: 52rpx; + background: #FFFFFF; + border-radius: 26rpx 26rpx 26rpx 26rpx; + + border: 2rpx solid #F1F1F1; + + color: #F18F21; + font-size: 30rpx; } - .u-node { - width: 44rpx; - height: 44rpx; - border-radius: 100rpx; - display: flex; - justify-content: center; - align-items: center; - background: #d0d0d0; - } - .u-order-desc { - padding: 20rpx; - background: #F9F9F9; - border-radius: 20rpx 20rpx 20rpx 20rpx; - margin: 12rpx 0rpx; - text { - font-size: 24rpx; - font-weight: 500; - color: #2E4975; - } - } - - .u-order-time { - color: rgb(200, 200, 200); - font-size: 26rpx; - } - .yuandi{ - width: 18rpx; - height: 18rpx; - background: #2D7CE6; - border-radius: 24rpx 24rpx 24rpx 24rpx; - } - .Test{ - font-size: 28rpx; - font-weight: 800; - color: #2E4975; - margin-left: 12rpx; - } - .ellipses{ - font-size: 20rpx; - background: rgba(242,170,2,0.2); - margin-left: 12rpx; - padding: 8rpx 20rpx; - color: #F2AA02; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - .erotic{ - font-size: 20rpx; - background: rgba(242,63,170,0.1); - margin-left: 12rpx; - padding: 8rpx 20rpx; - color: #F23FEB; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - .greener{ - font-size: 20rpx; - background: rgba(27,225,178,0.1); - margin-left: 12rpx; - padding: 8rpx 20rpx; - color: #1BE1B2; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - .increase{ - padding: 26rpx 125rpx; - color: #FFFFFF; - background-color: #F39852; - border-radius: 20rpx 20rpx 20rpx 20rpx; - text-align: center; - } - -</style> +} + +.noting { + display: flex; + flex-wrap: nowrap; + align-items: center; + justify-content: center; + margin-top: 16rpx; + width: 686rpx; + height: 124rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + + image { + width: 58.19rpx; + height: 60rpx; + } + + .text1 { + margin-left: 12rpx; + font-size: 24rpx; + font-family: PingFang SC, PingFang SC; + font-weight: 500; + color: #627698; + } + + .text2 { + margin-left: 12rpx; + font-size: 24rpx; + font-family: PingFang SC, PingFang SC; + font-weight: 500; + color: #2D7CE6; + border-bottom: 2px solid #2D7CE6; + } +} + +.class_bj { + margin-top: 16rpx; +} + +.class_images { + display: flex; + flex-wrap: wrap; + // justify-content: space-between; + // margin-top: 20rpx; +} + +.class_tp { + width: 56rpx; + height: 56rpx; + margin-right: 12rpx; +} + +.Ielts { + font-size: 40rpx; + font-weight: 400; + color: #2E4975; + margin: 20rpx 0; +} + +.class_ys:nth-child(3n) { + margin-right: 0; +} + +.class_ys { + margin-top: 20rpx; + margin-right: 20rpx; + width: 215rpx; + height: 96rpx; + display: flex; + justify-content: center; + align-items: center; + padding: 20rpx; + // width: 215rpx; + height: 96rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + + +.class_wz { + width: 125rpx; + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 500; + color: #072F5A; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.view_form { + padding: 0rpx 32rpx; + background: #FFFFFF; + margin-top: 16rpx; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + +.view_textrea { + height: 260rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + ; + margin-top: 16rpx; + padding: 28rpx 32rpx; +} + +.view_button { + width: 93.1%; + 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 { + 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); + margin-top: 8rpx; +} + +.u-node { + width: 44rpx; + height: 44rpx; + border-radius: 100rpx; + display: flex; + justify-content: center; + align-items: center; + background: #d0d0d0; +} + +.u-order-desc { + display: block; + // flex-wrap: nowrap; + padding: 20rpx; + background: #F9F9F9; + border-radius: 20rpx 20rpx 20rpx 20rpx; + margin: 12rpx 0rpx; + + .txt { + + font-size: 24rpx; + font-weight: 500; + color: #2E4975; + } +} + +.u-order-time { + color: rgb(200, 200, 200); + font-size: 26rpx; +} + +.yuandi { + width: 18rpx; + height: 18rpx; + background: #2D7CE6; + border-radius: 24rpx 24rpx 24rpx 24rpx; +} + +.Test { + font-size: 28rpx; + font-weight: 800; + color: #2E4975; + margin-left: 12rpx; +} + +.ellipses { + font-size: 20rpx; + background: rgba(242, 170, 2, 0.2); + margin-left: 12rpx; + padding: 8rpx 20rpx; + color: #F2AA02; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + +.erotic { + display: flex; + justify-content: center; + align-items: center; + width: 80rpx; + height: 36rpx; + font-size: 20rpx; + background: rgba(242, 63, 170, 0.1); + margin-left: 12rpx; + // padding: 8rpx 20rpx; + color: #F23FEB; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + +.greener { + font-size: 20rpx; + background: rgba(27, 225, 178, 0.1); + margin-left: 12rpx; + padding: 8rpx 20rpx; + color: #1BE1B2; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + +.increase { + padding: 26rpx 125rpx; + color: #FFFFFF; + background-color: #F39852; + border-radius: 20rpx 20rpx 20rpx 20rpx; + text-align: center; +} +</style> \ No newline at end of file diff --git a/pages_teacher/teacher_teachers/teacher_writeadd.vue b/pages_teacher/teacher_teachers/teacher_writeadd.vue index eef2e3e..95eb75c 100644 --- a/pages_teacher/teacher_teachers/teacher_writeadd.vue +++ b/pages_teacher/teacher_teachers/teacher_writeadd.vue @@ -1,72 +1,231 @@ <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> - <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> + + <!-- 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> - <!-- 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> + </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> + <!-- 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> - + <compose></compose> </swiper-item> <!--听力 --> @@ -80,531 +239,724 @@ </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 { - data() { - return { - // 导航栏 - list: [{ - name: '口语' - }, - { - name: '写作' - }, - { - name: '听力' - }, - { - name: '阅读' - } - ], - radio: [{ - name: '1', - disabled: false - }], - // 写作 - Compose: [], - num:0, - // 下拉框的v-if布尔值 - radioValue: '', - part1: true, - current: 0, - search: true, - listType: [], - idList: [], - // 口语 - postdata: { - "key": "", - "pageNum": 0, - "mode": "home", - "part": "part1", - "order": "0", - "type": "", - "isStudy": 0, - "isFavorite": 0, - "isEvlua": 0, - "isFun": 0, - "level": 0, - "isNew": 0 - }, - slander: [], - part2:false, - grizzly:true, - categorize: '分类', - // 下拉框的v-if布尔值 - selectedOption: 'Part1', - arrow: false, - arrowDown: false, - options: [{ - id: 1, - name: 'Part1' - }, - { - id: 2, - name: 'Part2' - }, - { - id: 3, - name: 'Part3' - } - ], - userId:null +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 { + // 导航栏 + list: [{ + name: '口语' + }, + { + name: '写作' + }, + { + name: '听力' + }, + { + name: '阅读' } - }, - components:{ - audiology, - reading, - compose - }, - created() { - this.getList() - }, - methods: { - upType(index, num) { - this.listType.splice(index, 1, num) + ], + radio: [{ + name: '1', + disabled: false + }], + // 写作 + Compose: [], + num: 0, + // 下拉框的v-if布尔值 + radioValue: '', + part1: true, + current: 1, + search: true, + listType: [], + idList: [], + // 口语 + postdata: { + "key": "", + "pageNum": 0, + "mode": "home", + "part": "part1", + "order": "0", + "type": "", + "isStudy": 0, + "isFavorite": 0, + "isEvlua": 0, + "isFun": 0, + "level": 0, + "isNew": 0 }, - change(index) { - this.current = index; + slanderpart1: [], + originslanderpart1: [], + slanderpart2: [], + originslanderpart2: [], + slanderpart3: [], + originslanderpart3: [], + part2: false, + grizzly: true, + categorize: '分类', + // 下拉框的v-if布尔值 + selectedOption: 'Part1', + arrow: false, + arrowDown: false, + options: [{ + id: 1, + name: 'Part1' }, - // 选中某个单选框时,由radio时触发 - radioCheck(index) { - if (this.radioValue == this.list2[index].id) { - this.radioValue = null - } else { - this.radioValue = this.list2[index].id - } + { + id: 2, + name: 'Part2' }, - //轮播图滑动和tabs保持一致 - updateCurrent(current, source) { - this.current = current.detail.current - if (this.current == 0) { - this.search = true - } else { - this.search = false - } - }, - getList() { - this.$u.post('https://api.admin-v2.langsi.online/admin-api/speaking/topic/home/list', this.postdata).then(res => { - let keyArr = Object.keys(res.data) - let valueArr = Object.values(res.data) - this.slander = keyArr.map((item, index) => { - return { - label: item, - list: valueArr[index] - } - }) - }) - }, - //下拉显示下拉框 - arrow_xl() { - this.arrow = !this.arrow - }, - arrow_xl2() { - this.arrowDown = !this.arrowDown - }, - arrow_options(id) { - this.options.forEach(item => { - if (item.id == id) { - this.selectedOption = item.name - - } else if (id == 2) { - this.postdata.part = "part2" - this.part2=true - this.grizzly = false - this.getList() - } - else if (id == 3) { - this.postdata.part = "part3" - this.part2=true - this.grizzly = false - this.getList() - }else { - this.postdata.part = "part1" - 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() { + { + id: 3, + name: 'Part3' + } + ], + totalLength: 0, + searchKeyword: '', + userId: null, + selectspeak: [], + selectwrite: [], + selectlisten: [], + selectread: [] + } + }, + components: { + audiology, + reading, + compose + }, + 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); // 如果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) { + this.listType.splice(index, 1, num) + }, + change(index) { + this.current = index; + }, + // 选中某个单选框时,由radio时触发 + radioCheck(index) { + if (this.radioValue == this.list2[index].id) { + this.radioValue = null + } else { + this.radioValue = this.list2[index].id + } + }, + //轮播图滑动和tabs保持一致 + updateCurrent(current, source) { + this.current = current.detail.current + if (this.current == 0) { + this.search = true + } else { + this.search = false + } + }, + getList() { + 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.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); + }) + }, + //下拉显示下拉框 + arrow_xl() { + this.arrow = !this.arrow + }, + arrow_xl2() { + this.arrowDown = !this.arrowDown + }, + arrow_options(id) { + this.options.forEach(item => { + if (item.id == id) { + this.selectedOption = item.name + + } else if (id == 2) { + this.postdata.part = "part2" + this.part2 = true + this.grizzly = false + + } + else if (id == 3) { + this.postdata.part = "part3" + this.part2 = true + this.grizzly = false + + } else { + this.postdata.part = "part1" + this.part2 = false + this.grizzly = true + + } + }) + }, + clicking(target, type) { + + }, + radioGroupChange() { + } } +} </script> <style lang="scss" scoped> - .view_template { - width: 100%; - background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%); +.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 { - height: 89vh; - width: 91.3%; + .input { margin: 0 auto; - border-radius: 0rpx 0rpx 0rpx 0rpx; - - // padding: 32rpx; - .view_search { - height: 88rpx; - margin: 0 auto; - line-height: 88rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - - } - .view_button { - border-radius: 12rpx 12rpx 12rpx 12rpx; - padding: 12rpx 24rpx; - font-size: 20rpx; - font-weight: 500; - color: rgba(101, 116, 140, 0.8); - } - - .view_buttons { - background: #2D7CE6; - border-radius: 12rpx 12rpx 12rpx 12rpx; - padding: 12rpx 24rpx; - font-size: 20rpx; - font-weight: 500; - color: #FFFFFF; - } - - .view_fff { - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - - .view_Do { - display: flex; - justify-content: space-between; - padding: 28rpx 0rpx; - margin: 0 28rpx; - border-bottom: 2rpx solid #F2F2F2; - } - - .view_pushbutton { - display: flex; - } - - .grizzly { - background: #E1EEFF; - border-radius: 8rpx 8rpx 8rpx 8rpx; - font-size: 20rpx; - font-weight: 500; - color: #2D7CE6; - padding: 6rpx 18rpx; - margin-left: 12rpx; - } - - .yellow { - background: #FFEBD7; - border-radius: 8rpx 8rpx 8rpx 8rpx; - font-size: 20rpx; - font-weight: 500; - color: #FB9734; - padding: 6rpx 18rpx; - margin-left: 12rpx; - } - - .view_English { - display: flex; - font-size: 24rpx; - font-weight: 500; - color: #2E4975; - } - - .active { - z-index: 9; - background:#2D7CE6; - color: #fff; - } - - .slander { - height: 352rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - } - - .slander_behavior { - display: flex; - justify-content: space-between; - padding: 20rpx 0rpx; - border-bottom: 2rpx solid #F2F2F2; - } - - .slander_for { - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - padding: 0 30rpx; - } - - .unite { - width: 270rpx; - font-size: 28rpx; - font-family: 'PingFang'; - font-weight: 800; - color: #2E4975; - margin: 26rpx 0rpx; - } - - .slander_an { - background: #F4F4F4; - border-radius: 12rpx 12rpx 12rpx 12rpx; - font-size: 20rpx; - font-family: 'PingFang'; - font-weight: 500; - color: rgba(101, 116, 140, 0.8); - padding: 10rpx; - margin-right: 15rpx; - } - - .pd_icon { - margin-left: 8rpx; - } - - .highlighted { - - background: rgba(45, 124, 230, 0.1); - border-radius: 12rpx 12rpx 12rpx 12rpx; - color: #2D7CE6; - } - - .part { - font-size: 28rpx; - font-family: 'PingFang'; - font-weight: 500; - color: #2E4975; - - } - - .part2 { - font-size: 28rpx; - font-family: 'PingFang'; - font-weight: 500; - color: #2E4975; - margin-left: 20rpx; - - } - - .swiper { - height: 80%; - } - - swiper-item { - overflow: scroll; - } - .slander_left { - width: 328rpx; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden - } - .view_left { - display: flex; - justify-content: left; - margin-top: 20rpx; - } - - .view_inuygs { - display: flex; - justify-content: space-between; - align-items: center; - } - - .view_left_pd { - position: relative; - padding: 12rpx 32rpx; - background: #FFFFFF; - border-radius: 20rpx 20rpx 20rpx 20rpx; - margin-right: 15rpx; - font-size: 24rpx; - color: #072F5A; - } - - .unite { - width: 290rpx; - display: -webkit-box; - -webkit-box-orient: vertical; - overflow: hidden; - -webkit-line-clamp: 1; - font-size: 28rpx; - font-family: 'PingFang'; - font-weight: 800; - color: #2E4975; - - margin-right: 20rpx; - } - - .pull_Down { - position: absolute; - bottom: -184rpx; - left: 50%; - margin-left: -79rpx; - 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_Down view:last-child { - border: none; - } - - .header_part { - display: flex; - align-items: center; - margin: 26rpx 0rpx; - } - - .slander_an { - padding: 6rpx 18rpx; - background: #fff; - border-radius: 12rpx 12rpx 12rpx 12rpx; - margin-left: 12rpx; - color: #65748C; - } - - .slander_for { - background-color: #fff; - border-radius: 20rpx 20rpx 20rpx 20rpx; - - } - - .slander_of { - display: flex; - align-items: center; - justify-content: space-between; - padding: 24rpx 0; - margin: 0 20rpx; - border-bottom: 2rpx solid #F2F2F2; - - } - - .textual { - width: 290rpx; - display: -webkit-box; - -webkit-box-orient: vertical; - overflow: hidden; - -webkit-line-clamp: 2; - } - - .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); - margin-left: 15rpx; - } - .active { - background: rgba(45, 124, 230, 0.1); - color: #2D7CE6; - } - } - .pull_down{ - display: flex; - justify-content: space-between; - width: 100rpx; - font-size: 24rpx; - } - - + 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; } +} - .footer { - position: fixed; - bottom: 0; - width: 100%; +.view_body { + height: 89vh; + width: 91.3%; + margin: 0 auto; + border-radius: 0rpx 0rpx 0rpx 0rpx; + + // padding: 32rpx; + .view_search { + height: 88rpx; + margin: 0 auto; + line-height: 88rpx; background: #FFFFFF; - box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25); - padding: 30rpx 32rpx; - } - .footer2{ - position: fixed; - bottom: 0; - width: 100%; - background: #FFFFFF; - box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25); - padding: 30rpx 32rpx; - margin-top: 25rpx; + border-radius: 20rpx 20rpx 20rpx 20rpx; + } - .footer_button { + .view_button { + border-radius: 12rpx 12rpx 12rpx 12rpx; + padding: 12rpx 24rpx; + font-size: 20rpx; + font-weight: 500; + color: rgba(101, 116, 140, 0.8); + } + + .view_buttons { + background: #2D7CE6; + border-radius: 12rpx 12rpx 12rpx 12rpx; + padding: 12rpx 24rpx; + font-size: 20rpx; + font-weight: 500; + color: #FFFFFF; + } + + .view_fff { + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + } + + .view_Do { display: flex; justify-content: space-between; + padding: 28rpx 0rpx; + margin: 0 28rpx; + border-bottom: 2rpx solid #F2F2F2; } - .button_ky { - padding: 24rpx 52rpx; - border-radius: 104rpx 104rpx 104rpx 104rpx; - color: #2E4975; - background-color: #FAFAFA; + .view_pushbutton { + display: flex; } - .button_andadd { - background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); - border-radius: 104rpx 104rpx 104rpx 104rpx; - padding: 26rpx 125rpx; - color: #fff; + .grizzly { + background: #E1EEFF; + border-radius: 8rpx 8rpx 8rpx 8rpx; + font-size: 20rpx; + font-weight: 500; + color: #2D7CE6; + padding: 6rpx 18rpx; + margin-left: 12rpx; } - .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; + .yellow { + background: #FFEBD7; + border-radius: 8rpx 8rpx 8rpx 8rpx; + font-size: 20rpx; + font-weight: 500; + color: #FB9734; + padding: 6rpx 18rpx; + margin-left: 12rpx; } - .view_fff_bottom { - margin-bottom: 54rpx; - } - - .Task { + .view_English { + display: flex; font-size: 24rpx; font-weight: 500; color: #2E4975; } + .active { + z-index: 9; + background: #2D7CE6; + color: #fff; + } + + .slander { + height: 352rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + } + + .slander_behavior { + display: flex; + justify-content: space-between; + padding: 20rpx 0rpx; + border-bottom: 2rpx solid #F2F2F2; + } + + .slander_for { + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + padding: 0 30rpx; + } + + .unite { + width: 270rpx; + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 800; + color: #2E4975; + margin: 26rpx 0rpx; + } + + .slander_an { + background: #F4F4F4; + border-radius: 12rpx 12rpx 12rpx 12rpx; + font-size: 20rpx; + font-family: 'PingFang'; + font-weight: 500; + color: rgba(101, 116, 140, 0.8); + padding: 10rpx; + margin-right: 15rpx; + } + + .pd_icon { + margin-left: 8rpx; + } + + .highlighted { + + background: rgba(45, 124, 230, 0.1); + border-radius: 12rpx 12rpx 12rpx 12rpx; + color: #2D7CE6; + } + + .part { + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 500; + color: #2E4975; + + } + + .part2 { + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 500; + color: #2E4975; + margin-left: 20rpx; + + } + + .swiper { + height: 80%; + } + + swiper-item { + overflow: scroll; + } + + .slander_left { + width: 328rpx; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden + } + .view_left { display: flex; justify-content: left; margin-top: 20rpx; } + .view_inuygs { + display: flex; + justify-content: space-between; + align-items: center; + } + .view_left_pd { position: relative; padding: 12rpx 32rpx; @@ -612,51 +964,230 @@ border-radius: 20rpx 20rpx 20rpx 20rpx; margin-right: 15rpx; font-size: 24rpx; + color: #072F5A; + } + + .unite { + width: 290rpx; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; + font-size: 28rpx; + font-family: 'PingFang'; + font-weight: 800; + color: #2E4975; + + margin-right: 20rpx; } .pull_Down { position: absolute; - bottom: -130rpx; + bottom: -184rpx; 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_Down view:last-child { + border: none; + } + + .header_part { + display: flex; + align-items: center; + margin: 26rpx 0rpx; + } + + .slander_an { + padding: 6rpx 18rpx; + background: #fff; + border-radius: 12rpx 12rpx 12rpx 12rpx; + margin-left: 12rpx; + color: #65748C; + } + + .slander_for { + background-color: #fff; + border-radius: 20rpx 20rpx 20rpx 20rpx; + + } + + .slander_of { + display: flex; + align-items: center; + justify-content: space-between; + padding: 24rpx 0; + margin: 0 20rpx; + border-bottom: 2rpx solid #F2F2F2; + + } + + .textual { + width: 290rpx; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; + } + + .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); + margin-left: 15rpx; + } + + .active { + background: rgba(45, 124, 230, 0.1); + color: #2D7CE6; + } + } + + .pull_down { + display: flex; + justify-content: space-between; + width: 100rpx; + font-size: 24rpx; + } + + + +} + +.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 { + position: fixed; + bottom: 0; + width: 100%; + background: #FFFFFF; + box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25); + padding: 30rpx 32rpx; + margin-top: 25rpx; +} + +.footer_button { + display: flex; + justify-content: space-between; +} + +.button_ky { + padding: 24rpx 52rpx; + border-radius: 104rpx 104rpx 104rpx 104rpx; + color: #2E4975; + background-color: #FAFAFA; +} + +.button_andadd { + background: linear-gradient(180deg, #74AFFF 0%, #2D7CE6 100%); + border-radius: 104rpx 104rpx 104rpx 104rpx; + padding: 26rpx 125rpx; + color: #fff; +} + +.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 { + margin-bottom: 54rpx; +} + +.Task { + font-size: 24rpx; + font-weight: 500; + color: #2E4975; +} + +.view_left { + display: flex; + justify-content: left; + margin-top: 20rpx; +} + +.view_left_pd { + position: relative; + padding: 12rpx 32rpx; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; + margin-right: 15rpx; + font-size: 24rpx; +} + +.pull_Down { + position: absolute; + bottom: -130rpx; + left: 50%; + margin-left: -79rpx; + 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 { 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 { - border: none; - } - .sl_body { - background-color: #fff; - } +} - .footer_button_right { - padding: 24rpx 62rpx; - border: 1px solid #2D7CE6; - border-radius: 104rpx 104rpx 104rpx 104rpx; - color: #2D7CE6; - } +.pull_Down view:last-child { + border: none; +} + +.sl_body { + background-color: #fff; +} + +.footer_button_right { + padding: 24rpx 62rpx; + border: 1px solid #2D7CE6; + border-radius: 104rpx 104rpx 104rpx 104rpx; + color: #2D7CE6; +} </style>