对口语进行列表渲染
This commit is contained in:
		
							parent
							
								
									4ac7184bd5
								
							
						
					
					
						commit
						1ae42a3c2a
					
				| 
						 | 
				
			
			@ -41,7 +41,7 @@ const install = (Vue, vm) => {
 | 
			
		|||
		// 方式四,如果token放在了Storage本地存储中,拦截是每次请求都执行的
 | 
			
		||||
		// 所以哪怕您重新登录修改了Storage,下一次的请求将会是最新值
 | 
			
		||||
		// const token = uni.getStorageSync('token');
 | 
			
		||||
		const token = "Bearer aca170b01b4b4c88b3629fde91a3b2b7"
 | 
			
		||||
		const token = "Bearer e33c7c66dd374ea3a07312503d548978"
 | 
			
		||||
		// console.log("我是token", token)
 | 
			
		||||
		config.header.Authorization = token; 
 | 
			
		||||
		// #ifdef H5
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,37 +1,42 @@
 | 
			
		|||
<template>
 | 
			
		||||
	<!-- 口语下拉 -->
 | 
			
		||||
			<view>
 | 
			
		||||
				<view class="view_left">
 | 
			
		||||
					<view class="view_left_pd" @click="arrow_xl">
 | 
			
		||||
						{{selectedOption}}
 | 
			
		||||
						<u-icon name="arrow-down" size="22" class="pd_icon"></u-icon>
 | 
			
		||||
						<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 class="view_left">
 | 
			
		||||
						<view class="view_left_pd" @click="arrow_xl">
 | 
			
		||||
							{{selectedOption}}
 | 
			
		||||
							<u-icon name="arrow-down" size="22" class="pd_icon"></u-icon>
 | 
			
		||||
							<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 class="view_left_pd" @click="arrow_xl2">
 | 
			
		||||
						{{categorize}}
 | 
			
		||||
						<u-icon name="arrow-down" size="22" class="pd_icon"></u-icon>
 | 
			
		||||
						<view class="pull_DownTow" v-if="arrowDown">
 | 
			
		||||
							<view v-for="(item,index) in options2 " :key="index" @click="Classification(item.id)">{{item.name}}</view>
 | 
			
		||||
						</view>
 | 
			
		||||
					</view>
 | 
			
		||||
				</view>
 | 
			
		||||
				<!-- 口语主体 -->
 | 
			
		||||
				<view v-for="(item,index) in slander" :key="index">
 | 
			
		||||
					<view class="unite">{{item.label}}</view>
 | 
			
		||||
					<view class="slander_for">
 | 
			
		||||
						<view class="slander_behavior" v-for="(items,indexs) in item.list" :key='indexs'>
 | 
			
		||||
							<view class="slander_left">{{items.topicEn}}</view>
 | 
			
		||||
							<view style="display: flex;">
 | 
			
		||||
								<view class="slander_an">串题</view>
 | 
			
		||||
								<view class="slander_an blue">跟读</view>
 | 
			
		||||
								<view class="slander_an blue">模考</view>
 | 
			
		||||
						<view class="view_left_pd" @click="arrow_xl2">
 | 
			
		||||
							{{categorize}}
 | 
			
		||||
							<u-icon name="arrow-down" size="22" class="pd_icon"></u-icon>
 | 
			
		||||
							<view class="pull_DownTow" v-if="arrowDown">
 | 
			
		||||
								<view v-for="(item,index) in options2 " :key="index" @click="Classification(item.id)">{{item.name}}</view>
 | 
			
		||||
							</view>
 | 
			
		||||
						</view>
 | 
			
		||||
					</view>
 | 
			
		||||
				</view>
 | 
			
		||||
			</view>
 | 
			
		||||
					<!-- 口语主体 -->
 | 
			
		||||
					<view v-for="(item,index) in slander" :key="index">
 | 
			
		||||
						<view class="view_inuygs">
 | 
			
		||||
						<view class="header_part">
 | 
			
		||||
							<view class="unite">{{selectedOption}}</view>
 | 
			
		||||
							<view class="unite">{{item.label}}</view>
 | 
			
		||||
						</view>
 | 
			
		||||
						<view style="display: flex;">
 | 
			
		||||
							<view class="slander_an">串题</view>
 | 
			
		||||
							<view class="slander_an blue">跟读</view>
 | 
			
		||||
							<view class="slander_an blue">模考</view>
 | 
			
		||||
						</view>
 | 
			
		||||
						</view>
 | 
			
		||||
						<view class="slander_for">
 | 
			
		||||
							<view class="slander_behavior" v-for="(items,indexs) in item.list" :key='indexs'>
 | 
			
		||||
								<view class="slander_left">{{items.topicEn}}</view>
 | 
			
		||||
							</view>
 | 
			
		||||
						</view>
 | 
			
		||||
					</view>
 | 
			
		||||
					</view>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
| 
						 | 
				
			
			@ -81,7 +86,7 @@
 | 
			
		|||
				],
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		onLoad() {
 | 
			
		||||
		created() {
 | 
			
		||||
			this.getList()
 | 
			
		||||
		},
 | 
			
		||||
		methods:{
 | 
			
		||||
| 
						 | 
				
			
			@ -109,6 +114,7 @@
 | 
			
		|||
				 this.options.forEach(item=>{
 | 
			
		||||
					 if(item.id== id){
 | 
			
		||||
						 this.selectedOption=item.name
 | 
			
		||||
						 
 | 
			
		||||
					 }else if(id==2){
 | 
			
		||||
						 this.postdata.part="part2"
 | 
			
		||||
						 this.getList()
 | 
			
		||||
| 
						 | 
				
			
			@ -137,6 +143,11 @@
 | 
			
		|||
		justify-content: left;
 | 
			
		||||
		margin-top: 20rpx;
 | 
			
		||||
	}
 | 
			
		||||
	.view_inuygs{
 | 
			
		||||
		display: flex;
 | 
			
		||||
		justify-content: space-between;
 | 
			
		||||
		align-items: center;
 | 
			
		||||
	}
 | 
			
		||||
	
 | 
			
		||||
	.view_left_pd {
 | 
			
		||||
		position: relative;
 | 
			
		||||
| 
						 | 
				
			
			@ -145,13 +156,15 @@
 | 
			
		|||
		border-radius: 20rpx 20rpx 20rpx 20rpx;
 | 
			
		||||
		margin-right: 15rpx;
 | 
			
		||||
		font-size: 24rpx;
 | 
			
		||||
		color: #072F5A;
 | 
			
		||||
	}
 | 
			
		||||
	.unite {
 | 
			
		||||
		font-size: 28rpx;
 | 
			
		||||
		font-family: 'PingFang';
 | 
			
		||||
		font-weight: 800;
 | 
			
		||||
		color: #2E4975;
 | 
			
		||||
		margin: 26rpx 0rpx;
 | 
			
		||||
 | 
			
		||||
		margin-right: 20rpx;
 | 
			
		||||
	}
 | 
			
		||||
	.slander_for {
 | 
			
		||||
		background: #FFFFFF;
 | 
			
		||||
| 
						 | 
				
			
			@ -159,16 +172,12 @@
 | 
			
		|||
		padding: 0 30rpx;
 | 
			
		||||
	}
 | 
			
		||||
	.slander_behavior {
 | 
			
		||||
		display: flex;
 | 
			
		||||
		justify-content: space-between;
 | 
			
		||||
		
 | 
			
		||||
		padding: 20rpx 0rpx;
 | 
			
		||||
		border-bottom: 2rpx solid #F2F2F2;
 | 
			
		||||
	}
 | 
			
		||||
	.slander_left {
 | 
			
		||||
		width: 328rpx;
 | 
			
		||||
		text-overflow: ellipsis;
 | 
			
		||||
		white-space: nowrap;
 | 
			
		||||
		overflow: hidden
 | 
			
		||||
		
 | 
			
		||||
	}
 | 
			
		||||
	.pull_DownTow{
 | 
			
		||||
	width: 150rpx;
 | 
			
		||||
| 
						 | 
				
			
			@ -206,5 +215,22 @@
 | 
			
		|||
	}
 | 
			
		||||
	.pd_icon {
 | 
			
		||||
		margin-left: 8rpx;
 | 
			
		||||
		
 | 
			
		||||
	}
 | 
			
		||||
	.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;
 | 
			
		||||
	}
 | 
			
		||||
	.blue {
 | 
			
		||||
		background: rgba(45,124,230,0.1);
 | 
			
		||||
		color: #2D7CE6;
 | 
			
		||||
	}
 | 
			
		||||
</style>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -5,7 +5,7 @@
 | 
			
		|||
			</u-navbar>
 | 
			
		||||
			<!-- 搜索 -->
 | 
			
		||||
			<view class="view_search" v-if="search">
 | 
			
		||||
				<u-search :show-action="false" :animation="true" bg-color="#fff" placeholder="搜索相关内容..."></u-search>
 | 
			
		||||
				<u-search :show-action="false" :animation="true" bg-color="#fff" placeholder="搜索相关内容..." color="#3E97FF"></u-search>
 | 
			
		||||
			</view>
 | 
			
		||||
			<!--导航栏 -->
 | 
			
		||||
			<view class="view_tabs">
 | 
			
		||||
| 
						 | 
				
			
			@ -14,7 +14,7 @@
 | 
			
		|||
			<!-- 轮播图 -->
 | 
			
		||||
			<swiper :interval="5000" :duration="1000" is-scroll="true" :current="current" @change="updateCurrent" class="swiper">
 | 
			
		||||
				<!-- 口语 -->
 | 
			
		||||
				<swiper-item>
 | 
			
		||||
				<swiper-item style="height: 300rpx;">
 | 
			
		||||
					<slander></slander>
 | 
			
		||||
				</swiper-item>
 | 
			
		||||
				<!-- 写作 -->
 | 
			
		||||
| 
						 | 
				
			
			@ -149,12 +149,10 @@
 | 
			
		|||
				<swiper-item>
 | 
			
		||||
					<reading></reading>
 | 
			
		||||
				</swiper-item>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
			</swiper>
 | 
			
		||||
		</view>
 | 
			
		||||
		<!-- 底部按钮 -->
 | 
			
		||||
		<view class="footer">
 | 
			
		||||
		<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>
 | 
			
		||||
| 
						 | 
				
			
			@ -206,9 +204,6 @@
 | 
			
		|||
			reading,
 | 
			
		||||
			slander
 | 
			
		||||
		},
 | 
			
		||||
		onLoad() {
 | 
			
		||||
			// this.getCompose()
 | 
			
		||||
		},
 | 
			
		||||
		methods: {
 | 
			
		||||
			upType(index, num) {
 | 
			
		||||
				this.listType.splice(index, 1, num)
 | 
			
		||||
| 
						 | 
				
			
			@ -405,7 +400,7 @@
 | 
			
		|||
		}
 | 
			
		||||
 | 
			
		||||
		.swiper {
 | 
			
		||||
			height: 62vh;
 | 
			
		||||
			height: 80%;
 | 
			
		||||
		}
 | 
			
		||||
 | 
			
		||||
		swiper-item {
 | 
			
		||||
| 
						 | 
				
			
			@ -427,6 +422,13 @@
 | 
			
		|||
		box-shadow: 0rpx -6rpx 14rpx 0rpx rgba(177, 177, 177, 0.25);
 | 
			
		||||
		padding: 30rpx 32rpx;
 | 
			
		||||
	}
 | 
			
		||||
	.footer2{
 | 
			
		||||
		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;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue
	
	Block a user