Sports/pages/backlog/index.vue

<template>
	<view class="add">
		111
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabIndex: 1,
				cagetypeList: [],
				cagetypeIndex: -1,
				strainsList: [],
				strainsIndex: -1,
				groupList: [],
				groupIndex: -1,
				userList: [],
				userIndex: -1,
				info: {},
			};
		},
		onReady() {
			
		},
		methods: {
			bindDateChange(e){
				this.cagetypeIndex = e.detail.value
				this.info.type = e.detail.value
			},
			bindDateChange1(e){
				this.strainsIndex = e.detail.value
				this.info.strains = this.strainsList[e.detail.value].title
			},
			bindDateChange2(e){
				this.groupIndex = e.detail.value
				this.info.group = this.groupList[e.detail.value].title
			},
			bindDateChange3(e){
				this.userIndex = e.detail.value
				this.info.user_id = this.userList[e.detail.value].id
			},
			openPage() {
				uni.switchTab({
					url: "/pages/index/index"
				})
			},
			tabItem(e){
				this.tabIndex = e;
			},
			async get_api_cage_getCagetype() {
				const { errorcode, data } = await this.$api.api_cage_getCagetype({});
				if(errorcode == 200){
					this.cagetypeList = data;
				}
			},
			async get_api_basicinfo_strains() {
				const { errorcode, data } = await this.$api.api_basicinfo_strains({});
				if(errorcode == 200){
					this.strainsList = data;
				}
			},
			async get_api_basicinfo_group() {
				const { errorcode, data } = await this.$api.api_basicinfo_group({});
				if(errorcode == 200){
					this.groupList = data;
				}
			},
			async get_api_cage_getUser() {
				const { errorcode, data } = await this.$api.api_cage_getUser({uid: uni.getStorageSync("userInfo").uid});
				if(errorcode == 200){
					this.userList = data;
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
.add{
	padding-bottom: calc(env(safe-area-inset-bottom)+140rpx);
	overflow: hidden;
	&-bd{
		padding: 0 35rpx;
		overflow: hidden;
		.item{
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 40rpx 0;
			border-bottom: 1px solid #c0c2c2;
			.l{
				width: 150rpx;
				font-size: 28rpx;
				color: #000;
			}
			.r{
				flex: 1;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				.li{
					width: 60rpx;
					height: 60rpx;
					border-radius: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
					margin: 0 12rpx;
					.y{
						width: 50rpx;
						height: 50rpx;
						border-radius: 50%;
					}
					&:nth-child(1){
						.y{
							background-color: #8fc31f;
						}
					}
					&:nth-child(2){
						.y{
							background-color: #ea5514;
						}
					}
					&:nth-child(3){
						.y{
							background-color: #e4007f;
						}
					}
					&:nth-child(4){
						.y{
							background-color: #00913a;
						}
					}
					&:nth-child(5){
						.y{
							background-color: #c9a063;
						}
					}
					&:nth-child(6){
						.y{
							background-color: #727171;
						}
					}
					&-1{
						border: 1px solid #8fc31f;
					}
					&-2{
						border: 1px solid #ea5514;
					}
					&-3{
						border: 1px solid #e4007f;
					}
					&-4{
						border: 1px solid #00913a;
					}
					&-5{
						border: 1px solid #c9a063;
					}
					&-6{
						border: 1px solid #727171;
					}
				}
				input,picker{
					flex: 1;
					font-size: 28rpx;
					color: #000;
					height: 50rpx;
					line-height: 50rpx;
					text-align: right;
				}
				.arrow{
					width: 32rpx;
					height: 19rpx;
					margin-left: 20rpx;
					vertical-align: middle;
				}
				
				.date{
					width: 45rpx;
					height: 45rpx;
					margin-left: 20rpx;
					vertical-align: middle;
				}
			}
		}
	}
	&-fd{
		width: 100%;
		padding: 20rpx 35rpx;
		box-sizing: border-box;
		background-color: #f3f5f6;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 22;
		padding-bottom: calc(env(safe-area-inset-bottom));
		.btn{
			width: 100%;
			line-height: 90rpx;
			text-align: center;
			background-color: #009944;
			font-size: 32rpx;
			color: #ffffff;
			border-radius: 10rpx;
		}
	}
}
</style>