From 1f09e30dfe3936653d7486d605769d729f6ae298 Mon Sep 17 00:00:00 2001
From: libowei <3423564950@qq.com>
Date: Thu, 7 Dec 2023 15:09:23 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E5=86=85=E5=AE=B9=E8=BF=9B=E8=A1=8C?=
=?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../teacher_teachers/components/audiology.vue | 17 +-
.../teacher_teachers/teacher_addOperation.vue | 314 ++++++++++++------
2 files changed, 211 insertions(+), 120 deletions(-)
diff --git a/pages_teacher/teacher_teachers/components/audiology.vue b/pages_teacher/teacher_teachers/components/audiology.vue
index 9ac4a7d..a9c3e90 100644
--- a/pages_teacher/teacher_teachers/components/audiology.vue
+++ b/pages_teacher/teacher_teachers/components/audiology.vue
@@ -9,14 +9,14 @@
</view>
<view class="substance">
<!-- 渲染Text -->
- <text :class="{ 'active': itemActive[item.id] === TextIndex }" v-for="(TextItem,TextIndex) in item.tests"
- :key="TextIndex" @click="Bages_addActive(TextIndex,item.id,TextItem) ">
+ <text :class="{ 'active': itemActive[item.id] === TextIndex || TextIndex ==0 }" v-for="(TextItem,TextIndex) in item.tests"
+ :key="TextIndex" @click="Bages_addActive(TextIndex,item.id) ">
{{TextItem.name}}
</text>
</view>
<!-- 渲染part -->
<view v-for="(TextItem,TextIndex) in item.tests" :key="TextIndex">
- <view v-for="(partitem,partindex) in TextItem.parts" :key="partindex" v-if="itemActive[item.id] === TextIndex || TextIndex==0">
+ <view v-for="(partitem,partindex) in TextItem.parts" :key="partindex" v-if="itemActive[item.id] === TextIndex || TextIndex===0">
<view>
<view class="Part1">
<view class="imaflex" @click="icon(partitem.id)">
@@ -57,7 +57,6 @@
data() {
return {
listHearing: [],
- itemActive: {}, // 存储每个项目的活动状态
checked: [],
subsets: [],
itemActive: {},
@@ -74,16 +73,12 @@
hearing() {
this.$u.get('https://api.admin-v2.langsi.online/admin-api/ielts/paper/list', {classify: 1}).then(res => {
this.listHearing = res.data
- let arr =res.data
- for(let a of arr){
- a.active = 'Test 1'
- }
- this.listHearing= arr
+
})
},
// 听力test点击事件
- Bages_addActive(idex, id,TextItem) {
- this.itemActive[id] = idex
+ Bages_addActive(TextIndex, id) {
+ this.itemActive[id] = TextIndex
this.$forceUpdate()
diff --git a/pages_teacher/teacher_teachers/teacher_addOperation.vue b/pages_teacher/teacher_teachers/teacher_addOperation.vue
index bc107fc..eefbc23 100644
--- a/pages_teacher/teacher_teachers/teacher_addOperation.vue
+++ b/pages_teacher/teacher_teachers/teacher_addOperation.vue
@@ -128,59 +128,138 @@
<!-- 作业安排 -->
<view>
<view>
- <view class="view_tubiao">
- <view class="view_title">作业安排</view>
- <view class="view_tb">
-
- <view class="view_add">
- <text>+</text>
- 添加
+ <view>
+ <view class="view_tubiao">
+ <view class="view_title">作业安排</view>
+ </view>
+ <view>
+ <view class="Ielts">IELTS 18</view>
+ <view style="background-color: #fff; padding: 32rpx 40rpx;">
+ <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>
+ </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>
+ <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>
+ </u-time-line>
</view>
</view>
</view>
- <view class="view_operation">
- <view>
- <view class="view_ap">
- <text>听力-IELTS 18-Test 2</text>
- <view class="view_qbs">
- <view class="view_qb">
- <image src="https://file.langsi.online/yasiimg/web/static/uUikvKyGaRLDLWE2KYjv" mode=""></image>
- </view>
- <view class="view_qb">
- <image src="https://file.langsi.online/yasiimg/web/static/uvmKnUiil91Tfpd570Ev" mode=""></image>
- </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>
- <view></view>
- </view>
- <view class="view_English">
- <view>Part 1：Questions1-10</view>
- <view>Complete the notes below.</view>
- </view>
</view>
- </view>
- <view>
- <view class="view_operation">
+ <view>
<view>
- <view class="view_ap">
- <text>听力-IELTS 18-Test 2</text>
- <view class="view_qbs">
- <view class="view_qb">
- <image src="https://file.langsi.online/yasiimg/web/static/uUikvKyGaRLDLWE2KYjv" mode=""></image>
- </view>
- <view class="view_qb">
- <image src="https://file.langsi.online/yasiimg/web/static/uvmKnUiil91Tfpd570Ev" mode=""></image>
- </view>
- </view>
+ <view class="Ielts">IELTS 18</view>
+ <view style="background-color: #fff; padding: 32rpx 40rpx;">
+ <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="erotic">听力</view>
+
+ </view>
+ <view class="u-order-desc">
+ <text>Part 1：多选题</text>
+ </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>
- <view class="view_English">
- <view>Part 1：Questions1-10</view>
- <view>Complete the notes below.</view>
</view>
</view>
+ <!--按钮 -->
+ <view style="display: flex; justify-content: center; margin-top: 32rpx;">
+ <view class="increase">
+ <u-icon name="plus"></u-icon>
+ 添加
+ </view>
+ </view>
</view>
+
</view>
<!-- 截止时间 -->
<view>
@@ -191,7 +270,7 @@
<view class="view_form">
<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" />
+ <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-form-item>
@@ -204,7 +283,7 @@
<view class="view_title">描述</view>
</view>
<view class="view_textrea">
- <textarea value="" placeholder="输入你的描述... " />
+ <textarea value="" placeholder="输入你的描述... "placeholder-style="color: rgba(46,73,117,0.4);font-size: 24rpx;"/>
</view>
</view>
</view>
@@ -253,6 +332,10 @@
}
</script>
<style lang="scss" scoped>
+ // 样式穿透
+ ::v-deep .u-dot {
+ background: #2D7CE6 !important;
+ }
.concent {
width: 100vw;
background: linear-gradient(183deg, #F0F6FF 0%, #FAFAFA 100%);
@@ -285,28 +368,6 @@
margin-top: 46rpx;
}
- .view_tb {
- display: flex;
- justify-content: center;
- align-items: center;
- height: 52rpx;
- background: #FFFFFF;
- border-radius: 26rpx 26rpx 26rpx 26rpx;
- opacity: 1;
- border: 2rpx solid #F1F1F1;
- }
-
- .view_add {
- font-size: 24rpx;
- font-family: 'PingFang';
- font-weight: 500;
- color: #F18F21;
- padding: 14rpx 24rpx;
- text {
- margin-right: 5rpx;
- }
- }
-
.class_bj {
margin-top: 16rpx;
}
@@ -322,6 +383,12 @@
height: 56rpx;
margin-right: 12rpx;
}
+ .Ielts{
+ font-size: 40rpx;
+ font-weight: 400;
+ color: #2E4975;
+ margin: 20rpx 0;
+ }
.class_ys {
width: 215rpx;
@@ -342,58 +409,18 @@
font-weight: 500;
color: #072F5A;
}
-
- .view_qb {
- width: 24rpx;
- height: 24rpx;
- margin-left: 40rpx;
- }
-
- .view_qbs {
- display: flex;
- }
-
- .view_ap {
- display: flex;
- justify-content: space-between;
-
- text {
- font-size: 28rpx;
- font-weight: 800;
- color: #2E4975;
- }
- }
-
- .view_operation {
- margin-top: 20rpx;
- background: #FFFFFF;
- border-radius: 20rpx 20rpx 20rpx 20rpx;
- padding: 34rpx 32rpx;
- }
-
- .view_English {
- margin-top: 24rpx;
- padding: 20rpx;
- background: #F9F9F9;
- border-radius: 20rpx 20rpx 20rpx 20rpx;
-
- view {
- font-size: 24rpx;
- font-weight: 500;
- color: #2E4975;
- }
- }
.view_form{
- padding: 26rpx 32rpx;
+ 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;;
- // padding: 26rpx 32rpx;
margin-top:16rpx;
+ padding: 28rpx 32rpx;
}
.view_button{
width: 93.1%;
@@ -414,4 +441,73 @@
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 {
+ 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>