班级详情的下拉增加

pages/Mystudent/addclass.vue

@@ -205,9 +205,18 @@
 						<!-- 班级标签 -->
 						<view>
 							<view class="caption_top">班级标签</view>
+						<!-- 弹出层 -->
+						<u-select v-model="show2" :list="list" @confirm="confirm"></u-select>
+						
 						<view class="caption_input">
-								<u-input v-model="labels" :type="type" :border="border"  placeholder="请输入班级名称"/>
+								<u-form-item :border-bottom="false" :right-icon="icons" class="no-padding">
+							<u-input v-model="form.name"  @click="showPopup" placeholder="请输入班级标签"/>
+								</u-form-item>
 						</view>
+							
+						
+						
+						
 						</view>
 						<!-- 班级学生 -->
 						<view class="class_body">
@@ -246,25 +255,66 @@ export default {
 			labels:'',
 			// 弹出层的变量
 			show: false,
+			// 下拉框
+			show2:false,
+			form:{
+				name: ''
+			},
+					list: [
+								{
+									value: '1',
+									label: '听力'
+								},
+								{
+									value: '2',
+									label: '阅读'
+								},
+								{
+									value: '3',
+									label: '写作'
+								},
+								{
+									value: '4',
+									label: '口语'
+								}
+							],
+							icons:'arrow-down-fill',
+							icons_rigth:'arrow-down-fill',
+							icons_top:'arrow-up-fill',
+							
 			bgc: {
 				backgroundColor: "#F6F9FC",
 			},
 			checkindex: 0,
+		
+
 		}
 	},
 	methods: {
 		// 创建班级点击事件
 		create(){
 			this.show = !this.show
-			console.log('111')
+		},
+		showPopup(){
+			this.show2 =!this.show2
+			this.icons= this.icons_top
+		},
+		confirm(e){
+				this.icons= this.icons_rigth
+			e.forEach(item=>{
+				this.form.name=item.label
+			})
 		}
 		
+
 	}
 }
 </script>
 
 <style lang="scss" scoped>
-
+.no-padding /deep/ .u-form-item {
+  padding: 0;
+}
 page {
 	background: #F6F9FC;
 }