jiliangxiaochengxu/pages/assay/assayList.vue

<!-- @format -->

<template>
	<view class="container">
		<!-- <view style="margin: 15rpx 0">
			<view class="contentItems" @click="handleDetails" v-for="item of 2">
				<u-checkbox :customStyle="{ marginBottom: '8px' }"> 器具名称</u-checkbox>
				<view class="content">
					<view class="title">器具出厂编号
						<text style="margin-left: 50rpx"> 2024845782 </text>
					</view>
				</view>
				<view class="content">
					<view class="title">器具内部编号
						<text style="margin-left: 50rpx"> ygjpx-05 </text>
					</view>
				</view>
				<view class="content">
					<view class="title">制造单位</view>
					<view class="message">上海光正医疗有限公司</view>
				</view>
				<view class="content">
					<view class="title">规格型号</view>
					<view class="message">20kg*10</view>
				</view>
			</view>
		</view> -->
		<view style="margin: 15rpx 0">
			<view v-for="item in ledgerList" class="contentItems">
				<u-checkbox-group placement="column" @change="changeCheckBox(item)">
					<view>
						<view class="" style="display: flex;justify-content: space-between;">
							<view style="display: flex;" class="">
								<u-checkbox :name="item.id"></u-checkbox>
								<span style="font-weight: 700;font-size: 36rpx;">{{item.name}}</span>
							</view>
							<view style="padding-top: 5rpx;" :style="{
							  color: recordColor[recordStatus(item.fillingStatus)],
							}">{{ recordStatus(item.fillingStatus) }}</view>
						</view>
						<view style='margin:10rpx 30rpx;color: #606266;line-height: 50rpx;' class="">
							<view>唯一标识：<span>
									{{item.instrNo}}
								</span>
							</view>
							<span style="line-height: 50rpx;"> 制造单位：{{item.manufactoryName}}
							</span>
							<br />
							<view style="display: flex;justify-content: space-between;">
								<view>器具用途：{{item.purposeName}}</view>
								<view>
									规格型号：{{item.modelSpecific}}</view>
							</view>
							<span
								style="display: flex; justify-content: space-between;align-items: center;line-height: 50rpx;"
								class="">
								<span> 出厂编号： {{item.serialNumber}}</span>
								<span> 内部编号： {{item.internalNumber}}</span>
							</span>
						</view>


					</view>
				</u-checkbox-group>
			</view>
		</view>
		<view style="
        background: #fff;
        padding: 20rpx 0;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
		display: flex;
      ">
			<u-button @click="handleApplicat" style="width: 95%; margin: 0 auto" type="primary">确定</u-button>

		</view>
	</view>
</template>

<script>
	import {
		pageAudit
	} from "@/api/assay";
	import {
		useDict,
		paraseDict
	} from "@/utils/index";
	export default {
		data() {
			return {
				selectedItems: [],
				recordColor: {
					已撤回: "#fa3534",
					已接收: "#2979ff",
					待提交: "#2979ff",
					备案中: "#2979ff",
					已拒绝: "#fa3534",
					勿备案: "#fa3534",
					未备案: "#909399",
					免备案: "#909399",
					已退回: "#fa3534",
				},
				record: [], //备案字典
				activeContent: "我的申请",
				tabsList: [{
					name: "我的申请",
				}, ],
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					orderByColumn: 'createTime',
					isAsc: 'Desc'

				},
				ledgerList: [],
				total: 0,
				loading: false,
				finished: false,
			};
		},
		onLoad(options) {
			useDict("ejian_instrFillingStatus").then((res) => {
				this.record = res;
			});
			this.queryParams.excludeIds = options.ids
			this.getList()
		},
		computed: {
			// //检定状态
			// verificationStatus() {
			// 	return (row) => {
			// 		return paraseDict(this.verification, row);
			// 	};
			// },
			// //申请状态
			// applicationStatus() {
			// 	return (row) => {
			// 		return paraseDict(this.application, row);
			// 	};
			// },
			//备案状态
			recordStatus() {
				return (row) => {
					return paraseDict(this.record, row);
				};
			},
		},
		methods: {
			changeCheckBox(val) {
				console.log('val', val)
				console.log(this.selectedItems)
				if (this.selectedItems.indexOf(val) === -1) {
					this.selectedItems.push(val);
				} else {
					this.selectedItems.splice(this.selectedItems.indexOf(val), 1);
				}

				console.log('selectedItems', this.selectedItems)
			},
			getList() {
				pageAudit({
					...this.queryParams
				}).then(({
					rows,
					total
				}) => {
					this.ledgerList = rows;
					this.total = total;
				});
			},
			onReachBottom() {
				//触底事件
				if (this.queryParams.pageNum * this.queryParams.pageSize >= this.total) {
					uni.showToast({
						title: "没有更多数据了",
						icon: "none",
						duration: 1000,
					});
					setTimeout(() => {
						uni.hideLoading();
					}, 500);
				} else {
					if (this.queryParams.pageNum <= this.queryParams.pageNum - 1) {
						setTimeout(() => {
							uni.hideLoading();
						}, 500);
					} else {
						uni.showLoading({
							title: "加载中",
						});
						this.queryParams.pageNum++;

						pageAudit({
							...this.queryParams
						}).then(({
							rows,
							total
						}) => {
							this.ledgerList = [...this.ledgerList, ...rows];
							this.total = total;
						});
					}
					setTimeout(() => {
						uni.hideLoading();
					}, 500);
				}
			},
			handleDetails() {
				uni.navigateTo({
					url: "/pages/assay/assayDetails",
					success: (res) => {},
					fail: () => {},
					complete: () => {},
				});
			},
			handleApplicat() {
				getApp().globalData.deptListBeiAn = this.selectedItems
				console.log('getApp().globalData.deptListBeiAn ', getApp().globalData.deptListBeiAn)
				uni.$emit('query', {
					a: 'two'
				})
				uni.navigateBack()
			},
			handleChange(row) {
				this.activeContent = row.name;
			},
			handleCurrentForm() {},
		},
	};
</script>

<style lang="scss" scoped>
	.createFixed {
		background: #2979ff;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		position: fixed;
		right: 30rpx;
		bottom: 200rpx;
	}

	.createNew {
		font-size: 30rpx;
		margin: 20rpx 0 20rpx 20rpx;
		color: #3c9ff3;
	}

	.container {
		height: 100vh;
		background: rgb(243, 244, 249);

		.contentItems {
			width: 93%;
			border-radius: 6px;
			background: #fff;
			margin: 0rpx auto 20rpx;
			padding: 20rpx 30rpx 20rpx;

			.content {
				border-bottom: 1px solid rgb(242, 242, 242);
				padding: 24rpx 0;
				display: flex;
				justify-content: space-between;
			}

			.content:last-child {
				border-bottom: none;
			}

			.title {
				font-size: 26rpx;
				color: black;
				letter-spacing: 3rpx;
			}

			.message {
				font-size: 26rpx;
				color: rgb(146, 146, 146);
			}
		}
	}
</style>