jkzdzx_wjwapp/pages/kqdetail/kqdetail.vue

<template>
	<view style="padding-bottom: 140rpx;background-color: #fff;overflow: hidden;">
		<uni-table ref="table" border stripe emptyText="暂无更多数据" style="display: static;
		overflow: visible;">
			<uni-tr>
				<uni-th width="300rpx" align="center">日期</uni-th>
				<uni-th align="center">考勤</uni-th>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期一
						</view>
						<view>
							{{weekList[0]}}
						</view>

					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select v-model="list.mondayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select v-model="list.mondayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期二
						</view>
						<view>
							{{weekList[1]}}
						</view>

					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select v-model="list.tuesdayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select v-model="list.tuesdayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期三
						</view>
						<view>
							{{weekList[2]}}
						</view>
					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select v-model="list.wednesdayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select v-model="list.wednesdayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期四
						</view>
						<view>
							{{weekList[3]}}
						</view>
					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select v-model="list.thursdayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select v-model="list.thursdayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期五
						</view>
						<view>
							{{weekList[4]}}
						</view>
					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select v-model="list.fridayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select v-model="list.fridayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期六
						</view>
						<view>
							{{weekList[5]}}
						</view>
					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select :position="position" v-model="list.saturdayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select :position="position" v-model="list.saturdayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
			<uni-tr>
				<uni-td align="center">
					<view class="name">
						<view>
							星期日
						</view>
						<view>
							{{weekList[6]}}
						</view>
					</view>
				</uni-td>
				<uni-td align="center" width="200rpx">
					<view class="select">
						上午：
						<uni-data-select :position="position" v-model="list.sundayMorning" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
					<view class="select" style="margin-top: 40rpx;">
						下午：
						<uni-data-select :position="position" v-model="list.sundayAfternoon" :disabled="type" :localdata="range" @change="change"
							:clear="false"></uni-data-select>
					</view>
				</uni-td>
			</uni-tr>
		</uni-table>
		<view style="width: 100vw;position: fixed;bottom: 0;left: 0;padding: 20rpx;background-color: #fff;box-sizing: border-box;z-index: 999;" v-if="!type==true">
			<u-button type="primary" text="保存" @click="save"></u-button>
		</view>
	</view>
</template>

<script>
	import {
		getNowWeekList
	} from "@/utils/wjw.js"
	export default {
		data() {
			return {
				list: {
					beginTime: null,
					createBy: null,
					createTime: null,
					deptId: null,
					endTime: null,
					fridayAfternoon: "0",
					fridayMorning: "0",
					fullName: null,
					id: null,
					isSave: null,
					loginDeptId: null,
					mondayAfternoon: "0",
					mondayMorning: "0",
					remark: null,
					saturdayAfternoon: "11",
					saturdayMorning: "11",
					sumTableDate: null,
					sundayAfternoon: "11",
					sundayMorning: "11",
					thursdayAfternoon: "0",
					thursdayMorning: "0",
					tuesdayAfternoon: "0",
					tuesdayMorning: "0",
					updateBy: null,
					updateTime: null,
					userId: null,
					wednesdayAfternoon: "0",
					wednesdayMorning: "0",
					weekEnd: null,
					weekNumber: null,
					weekStart: null,
				},
				//本周日期列表
				weekList: [],
				//下拉框
				range: [],
				type:true,//能否修改
				position:'bottom'

			}
		},
		onLoad(options) {
			if(options.type == 'false'){
				this.type = true
			}else{
				this.type = false
			}
			this.list.userId = options.id
			this.list.deptId = options.deptId
			this.list.fullName = options.name
			this.list.weekNumber = options.weekNumber
			uni.setNavigationBarTitle({
				title:options.name+'本周考勤列表',
				color:'#fff'
			})
			this.getDay()
			this.getDicts('info_kq')
			// setTimeout(() => {
				this.getDk(options.id, options.weekNumber)
			// }, 1500)
		},
		methods: {
			getDay() {
				let day = uni.$u.timeFormat(new Date().toLocaleDateString(), 'yyyy-mm-dd')
				this.weekList = getNowWeekList(day)
			},
			// 查询字典数据详细
			getDicts(dictType) {
				uni.$u.http.get('/system/dict/data/type/' + dictType).then(res => {
					// console.log(res)
					this.range = res.data.map(item => {
						let obj = {
							value: item.dictValue,
							text: item.dictLabel
						}
						return obj
					})
				})
			},
			//查询打卡记录
			getDk(id, num) {
				uni.$u.http.post('/oa/attendance/selectOnePerson', {
					userId: id,
					weekNumber: num
				}).then(res => {
					if (res == '') {
						this.$forceUpdate()
					} else {
						this.list = res
						this.$forceUpdate()
					}
				})
			},
			//选择打卡
			change(e) {
				
			},
			//提交保存打卡
			save(){
				uni.showLoading({
					title:"保存中...",
					mask:true
				})
				this.list.weekStart = this.weekList[0]
				this.list.weekEnd = this.weekList[6]
				uni.$u.http.post('/oa/attendance/dtkq',this.list).then(res=>{
					uni.hideLoading()
					uni.showToast({
						title:"保存成功",
						mask:true
					})
					setTimeout(()=>{
						uni.$emit('query' , {a : 1});
						uni.navigateBack()
					},1800)
				}).catch(res=>{
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style lang="scss">
	.select {
		display: flex;
		align-items: center;
	}
	// ::v-deep .uni-select__selector{
	// 	height: 200px;
	// 	overflow: auto;
	// }
</style>