89 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
		
		
			
		
	
	
			89 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| 
								 | 
							
								<!-- 使用审批的UI -->
							 | 
						|||
| 
								 | 
							
								<template>
							 | 
						|||
| 
								 | 
							
									<view class="check-action">
							 | 
						|||
| 
								 | 
							
										<view class="btn-wrap">
							 | 
						|||
| 
								 | 
							
											<u-form-item label="参会情况" label-width="80px">
							 | 
						|||
| 
								 | 
							
												<u-radio-group v-model="joinTypeDef" @change="groupChange">
							 | 
						|||
| 
								 | 
							
													<u-radio :customStyle="{margin: ' 0 20px 0 0' }" v-for="(item, index) in joinType" :key="index"
							 | 
						|||
| 
								 | 
							
														:label="item.name" :name="item.name" @change="radioChange">
							 | 
						|||
| 
								 | 
							
													</u-radio>
							 | 
						|||
| 
								 | 
							
												</u-radio-group>
							 | 
						|||
| 
								 | 
							
											</u-form-item>
							 | 
						|||
| 
								 | 
							
								
							 | 
						|||
| 
								 | 
							
											<!-- 参会情况:-->
							 | 
						|||
| 
								 | 
							
											<!-- <view>
							 | 
						|||
| 
								 | 
							
												<u-radio-group v-model="joinTypeDef" @change="groupChange"> 
							 | 
						|||
| 
								 | 
							
													<u-radio :customStyle="{margin: ' 0 20px 6px 0' }" v-for="(item, index) in joinType" :key="index"
							 | 
						|||
| 
								 | 
							
														:label="item.name" :name="item.name" @change="radioChange">
							 | 
						|||
| 
								 | 
							
													</u-radio>
							 | 
						|||
| 
								 | 
							
												</u-radio-group>
							 | 
						|||
| 
								 | 
							
											</view> -->
							 | 
						|||
| 
								 | 
							
											<view v-if="!isJoin">
							 | 
						|||
| 
								 | 
							
												<u--textarea v-model="opinions" placeholder="请输入请假原因"></u--textarea>
							 | 
						|||
| 
								 | 
							
											</view>
							 | 
						|||
| 
								 | 
							
											<view class="buttons">
							 | 
						|||
| 
								 | 
							
												<u-button @click="handleCheck" class="btn first-btn" type="primary" text="确认"></u-button>
							 | 
						|||
| 
								 | 
							
											</view>
							 | 
						|||
| 
								 | 
							
										</view>
							 | 
						|||
| 
								 | 
							
									</view>
							 | 
						|||
| 
								 | 
							
								</template>
							 | 
						|||
| 
								 | 
							
								
							 | 
						|||
| 
								 | 
							
								<script>
							 | 
						|||
| 
								 | 
							
									export default {
							 | 
						|||
| 
								 | 
							
										props: {},
							 | 
						|||
| 
								 | 
							
										data() {
							 | 
						|||
| 
								 | 
							
											return {
							 | 
						|||
| 
								 | 
							
												opinions: '',
							 | 
						|||
| 
								 | 
							
												isJoin: true,
							 | 
						|||
| 
								 | 
							
												joinType: [{
							 | 
						|||
| 
								 | 
							
														name: '参加',
							 | 
						|||
| 
								 | 
							
														disabled: false
							 | 
						|||
| 
								 | 
							
													},
							 | 
						|||
| 
								 | 
							
													{
							 | 
						|||
| 
								 | 
							
														name: '请假',
							 | 
						|||
| 
								 | 
							
														disabled: false
							 | 
						|||
| 
								 | 
							
													}
							 | 
						|||
| 
								 | 
							
												],
							 | 
						|||
| 
								 | 
							
												// u-radio-group的v-model绑定的值如果设置为某个radio的name,就会被默认选中
							 | 
						|||
| 
								 | 
							
												joinTypeDef: '参加',
							 | 
						|||
| 
								 | 
							
											};
							 | 
						|||
| 
								 | 
							
										},
							 | 
						|||
| 
								 | 
							
										methods: {
							 | 
						|||
| 
								 | 
							
											radioChange() {
							 | 
						|||
| 
								 | 
							
												this.isJoin = !this.isJoin
							 | 
						|||
| 
								 | 
							
											},
							 | 
						|||
| 
								 | 
							
											handleCheck() {
							 | 
						|||
| 
								 | 
							
												if (!this.isJoin && this.opinions.length < 1) {
							 | 
						|||
| 
								 | 
							
													uni.$showErrorInfo('请输入请假原因!')
							 | 
						|||
| 
								 | 
							
													return false
							 | 
						|||
| 
								 | 
							
												} else if (this.isJoin && this.opinions.length > 1) {
							 | 
						|||
| 
								 | 
							
													this.opinions = ''
							 | 
						|||
| 
								 | 
							
												}
							 | 
						|||
| 
								 | 
							
												this.$emit('chilCheck', {
							 | 
						|||
| 
								 | 
							
													opinions: this.opinions,
							 | 
						|||
| 
								 | 
							
													isJoin: this.isJoin
							 | 
						|||
| 
								 | 
							
												}, function(res) {})
							 | 
						|||
| 
								 | 
							
											},
							 | 
						|||
| 
								 | 
							
										}
							 | 
						|||
| 
								 | 
							
									}
							 | 
						|||
| 
								 | 
							
								</script>
							 | 
						|||
| 
								 | 
							
								
							 | 
						|||
| 
								 | 
							
								<style scoped>
							 | 
						|||
| 
								 | 
							
									.btn-wrap {
							 | 
						|||
| 
								 | 
							
										position: fixed;
							 | 
						|||
| 
								 | 
							
										bottom: 0;
							 | 
						|||
| 
								 | 
							
										left: 0;
							 | 
						|||
| 
								 | 
							
										width: 100%;
							 | 
						|||
| 
								 | 
							
										box-sizing: border-box;
							 | 
						|||
| 
								 | 
							
										padding: 12px;
							 | 
						|||
| 
								 | 
							
										z-index: 1000;
							 | 
						|||
| 
								 | 
							
										background: #fff;
							 | 
						|||
| 
								 | 
							
										box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, .05);
							 | 
						|||
| 
								 | 
							
									}
							 | 
						|||
| 
								 | 
							
								
							 | 
						|||
| 
								 | 
							
									.buttons {
							 | 
						|||
| 
								 | 
							
										display: flex;
							 | 
						|||
| 
								 | 
							
										margin-top: 6px;
							 | 
						|||
| 
								 | 
							
										justify-content: space-between;
							 | 
						|||
| 
								 | 
							
									}
							 | 
						|||
| 
								 | 
							
								</style>
							 |