179crm_user_app/pages_user/user/addSchedule.vue

<template>
	<view class="content">
		<view class="inner">
			<view class="time-box">
				<view class="time">
					{{toDay}}
				</view>
				<view class="txt">今日待办</view>
				<view class="num">{{num}}</view>
			</view>
			<view class="form-box">
				<text class="form-title">开始时间</text>
				<view class="form-item">
					<view class="birth-picker" >
						<view class="right-box" @click="open()">
							<!-- <input type="text" :value="form.itineraryDate+' '+form.itineraryTime" placeholder="请选择日程开始时间"
								placeholder-class="form-input" disabled="disabled" /> -->
								
								<text v-if="form.itineraryDate" class="color222" >{{ form.itineraryDate+' '+form.itineraryTime }}</text>
								<text v-else >请选择日程开始时间</text>
							<image class="w48 h48" src="/static/images/health/right_arrow_right_icon24.png"></image>
						</view>
						<u-datetime-picker :show="show" v-model="newData" mode="datetime"
							@confirm="bindDateChange"></u-datetime-picker>

					</view>
					<!-- <picker class="birth-picker" mode="date"   @change="bindDateChange">
						<view class="right-box">
							<view class="input-box">
						<input type="text" :value="form.itineraryDate" placeholder="请选择日程开始时间" placeholder-class="form-input" disabled="disabled" />
						</view>
						
					</view>
					</picker> -->
				</view>
				<text class="form-title">日程安排</text>
				<view class="form-item">
					<textarea maxlength="200" class="form-textarea" v-model="form.itinerary" placeholder="请输入您的日程安排"
						placeholder-class="form-input" />
				</view>
			</view>
		</view>
		<view class="btn-box">
			<view class="sub-btn" @click="submit()">
				保存
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getItineraryInfo,
		addItinerary,
		updateItinerary
	} from '@/api/companyUser.js'
	export default {
		data() {
			return {
				newData:new Date(),
				toDay: this.utils.timeFormat(new Date(), 'yyyy年mm月dd日'),
				type: null,
				show: false,
				patientId: null,
				famaleurl: "/static/images/health/female_profile.png",
				maleurl: "/static/images/health/my_heads.png",
				checked: 1,
				array: ['是', '否'],
				tags: [{
						name: '心脏病',
						checked: true,
						id: 1
					},
					{
						name: '脑梗死',
						checked: false,
						id: 2
					}, {
						name: '肾病',
						checked: false,
						id: 3
					}, {
						name: '脂肪肝',
						checked: false,
						id: 4
					}
				],
				num: 0,
				form: {}
			};
		},
		onLoad(option) {
			this.type = option.type;
			this.form.userId = option.userId
			console.log(this.type)
			if (this.type == 'edit') {
				uni.setNavigationBarTitle({
				title: '编辑日程' // Replace with your desired title
				});
				this.id = option.id
				this.form.id = option.id
				this.userId = option.userId;
				this.getItineraryInfo();
			}
		},
		methods: {
			sexChange(type) {
				this.form.sex = type
			},
			open() {
				this.show =!this.show
			},
			close(){
				this.show=false
			},
			radioClick(item) {
				this.checked = item.id
			},
			getItineraryInfo() {
				var data = {
					id: this.id
				};
				getItineraryInfo(data).then(
					res => {
						if (res.code == 200) {
							this.form = res.data;

						} else {
							uni.showToast({
								title: res.msg,
							});
						}
					},
					rej => {}
				);
			},
			onChooseAvatar(e) {
				let {
					avatarUrl
				} = e.detail;
				uni.uploadFile({
					url: uni.getStorageSync('requestPath') + '/app/common/uploadOSS', //仅为示例，非真实的接口地址
					filePath: avatarUrl,
					name: 'file',
					formData: {
						'user': 'test' // 上传附带参数
					},
					success: (uploadFileRes) => {
						this.user.avatar = JSON.parse(uploadFileRes.data).url
					}
				});
			},
			submit() {
				if (this.form.itineraryDate == null || this.form.itineraryDate =='') {
					uni.showToast({
						icon: 'none',
						title: "行程日期不能为空",
					});
					return;
				}
				if (this.form.itineraryTime == null|| this.form.itineraryTime =='') {
					uni.showToast({
						icon: 'none',
						title: "行程时间不能为空",
					});
					return;
				}
				if (this.form.itinerary == null || this.form.itinerary =='') {
					uni.showToast({
						icon: 'none',
						title: "行程内容不能为空",
					});
					return;
				}
				// if (this.form.birthday == null) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: "出生年月不能为空",
				// 	});
				// 	return;
				// }
				if (this.type == "add") {
					this.addItinerary()
				} else if (this.type == "edit") {
					this.updateItinerary()
				}
			},
			updateItinerary() {
				updateItinerary(this.form).then(
					res => {
						if (res.code == 200) {
							uni.showToast({
								icon: 'success',
								title: "更新成功",
							});
							setTimeout(function() {
								uni.$emit('refreshSchedule');
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						} else {
							uni.showToast({
								icon: 'none',
								title: res.msg,
							});
						}
					},
					rej => {}
				);
			},
			addItinerary() {
				addItinerary(this.form).then(
					res => {
						if (res.code == 200) {
							uni.showToast({
								icon: 'success',
								title: "操作成功",
							});
							setTimeout(function() {
								uni.$emit('refreshSchedule');
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						} else {
							uni.showToast({
								icon: 'none',
								title: res.msg,
							});
						}
					},
					rej => {}
				);
			},
			// 出生日期选择
			bindDateChange: function(e) {
				this.form.itineraryDate = this.utils.timeFormat(e.value,'yyyy-mm-dd')
				this.form.itineraryTime = this.utils.timeFormat(e.value,'hh:MM:ss')
				this.show=false
			},
		}
	}
</script>

<style lang="scss">
	page {
		height: 100%;
	}

	.content {
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

		.inner {
			// height: calc(100% - 120upx);
			// padding: 20upx;
			background: #008FD3;

			.time-box {
				padding: 30rpx;
				text-align: left;

				.time {
					font-family: PingFang SC;
					font-weight: 500;
					font-size: 28rpx;
					color: #FFFFFF;
					padding-bottom: 25rpx;
				}

				.txt {
					font-weight: 500;
					font-size: 24rpx;
					color: rgba(255, 255, 255, 0.5);
					padding-bottom: 12rpx;
				}

				.num {
					font-family: Roboto, Roboto;
					font-weight: 500;
					font-size: 64rpx;
					color: #FFFFFF;
				}
			}

			.form-box {
				padding: 0 30upx;
				background: #FFFFFF;
				border-radius: 32upx;
				margin-bottom: -40upx;

				.form-title {
					font-family: PingFang SC;
					font-weight: 600;
					font-size: 36rpx;
					color: #222426;
					text-align: left;
					padding: 30rpx 0;
					display: block;
				}

				.form-item {
					padding: 30upx 0;
					display: flex;
					align-items: flex-start;
					border-bottom: 1px solid #F1F1F1;

					&:last-child {
						border-bottom: none;
					}

					.label {
						width: 300upx;
						text-align: left;
						font-size: 32upx;
						line-height: 44upx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #222222;
						flex-shrink: 0;
					}

					input {
						text-align: left;
					}

					.form-input {
						font-size: 30upx;
						font-family: PingFang SC;
						// font-weight: 500;
						color: #B2B2B2;
						text-align: left;
					}

					.form-item-tag {
						margin-right: 16rpx;

						.tag {
							border-radius: 8rpx 8rpx 8rpx 8rpx;
							border: 2rpx solid #ECECEC;
							display: flex;
							align-items: center;
							padding: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							font-size: 24rpx;

							&.active {
								background: #F0FAFF;
								border: 2rpx solid #008FD3;
								color: #008FD3;
							}
						}



					}

					.right {
						display: flex;
						align-items: center;
					}

					.sex-box {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: flex-end;

						.sex-item {
							width: 146rpx;
							height: 64rpx;
							display: flex;
							align-items: center;
							justify-content: center;
							background: #F5F7FA;
							border-radius: 32rpx 32rpx 32rpx 32rpx;
							margin-left: 16rpx;

							.u-icon__icon {
								margin: 0;
							}

							text {
								// font-family: PingFang SC, PingFang SC;
								font-weight: 400;
								font-size: 28rpx;
								color: #898E91;
								margin-left: 12rpx;
							}

							&.active {
								background: #FCF0E7;

								text {
									color: #FF5030
								}
							}
						}
					}

					.form-textarea {
						font-size: 30upx;
						color: #999999;
						height: 100upx;
						padding: 4upx 0;
					}

					.birth-picker {
						width: 100%;

						.right-box {
							width: 100%;
							display: flex;
							align-items: center;
							justify-content: space-between;

							.input-box {
								flex: 1;
								// width: 470upx;
							}
                            text{
								font-size: 30upx;
								color: #999999;
							}
							.arrow {
								width: 13upx;
								height: 23upx;
								margin-left: 20upx;
							}
						}
					}
				}
			}
		}

		.btn-box {
			height: 120upx;
			padding: 0 30upx;
			display: flex;
			align-items: center;
			justify-content: center;

			.sub-btn {
				width: 100%;
				height: 88upx;
				line-height: 88upx;
				text-align: center;
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				background: #008FD3;
				border-radius: 44upx;
				margin-bottom: 40upx;
				display: flex;
				align-items: center;
				justify-content: center;

				image {
					margin-right: 16rpx;
				}
			}
		}
	}
</style>