jiliangxiaochengxu/pages/assay/index.vue

<!-- @format -->

<template>
	<view class="container">
		<view @click="handleApplicat" class="createFixed">
			<u-icon name="plus" color="#fff" size="23"></u-icon>
		</view>

		<view style="margin: 15rpx 0" v-if="activeContent == '我的申请'">
			<view style="background: #fff; padding: 10rpx 0; margin-bottom: 15rpx">
				<u-search @custom='sousuo' shape="square" placeholder="请输入备案单编号"
					style="width: 95%; margin: 0rpx auto"></u-search>
			</view>
			<view class="contentItems" @click="handleDetails(item)" v-for="item in ledgerList">
				<view class="content">
					<!-- <view class="title">器具名称</view> -->
					<view style="color:black;font-size: 36rpx;font-weight:700;" class="message">{{item.instrName}}
					</view>
				</view>
				<view class="content">
					<view class="title">备案单编号：
						<text class="message" style="margin-left: 10rpx;color: red;font-weight: 700;font-size: 30rpx;">
							{{item.filingNo}}
						</text>
					</view>
				</view>

				<!-- <view class="content">
					<view class="title">备案状态</view>
					<view :style="{
			    color: recordColor[recordStatus(item)],
			  }">{{ recordStatus(item) }}</view>
				</view> -->
				<!-- 		<view class="content">
					<view class="title">行政部门</view>
					<view style="font-weight: 700;color: black;" class="message">{{item.useOrgName}}</view>
				</view> -->
				<view style="display: flex;justify-content: space-between;" class="">
					<view class="content">
						<view class="title">发起人：
						</view>
						<view style="width: 120rpx;" class="message">{{item.userName}}</view>
					</view>
					<view class="content">
						<view class="title">发起时间：</view>
						<view style="padding-top:5rpx;" class="message">{{item.createTime}}</view>
					</view>

				</view>
				<view style="display: flex;justify-content: space-between;" class="">
					<view style="display: flex;" class="content">
						<view class="title">联系电话：</view>
						<view style="padding-top:5rpx;" class="message">{{item.userMobile}}</view>
					</view>
					<view style="display: flex; align-items: center; " class="content">
						<view class="title">器具数量：</view>
						<view style="padding-top: 5rpx; " class="message">{{item.instrCount}}</view>
					</view>
				</view>

			</view>
		</view>

		<!-- 	<view v-else>
			<view>
				<view class="createNew">选择器具进行申请</view>
				<view class="contentItems" @click="handleCurrentForm">
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</view>
					</view>
					<view class="content">
						<view class="title">器具名称</view>
						<view class="message">血压计和血压表</view>
					</view>
					<view class="content">
						<view class="title">规格型号</view>
						<view class="message">153430587834</view>
					</view>
				</view>
				<view class="contentItems">
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</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 class="contentItems">
					<view></view>
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</view>
					</view>
					<view class="content">
						<view class="title">器具名称</view>
						<view class="message">汽车发动机检测仪</view>
					</view>
					<view class="content">
						<view class="title">规格型号</view>
						<view class="message">BJL</view>
					</view>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	import {
		getMiAuditApplyList
	} from "@/api/assay";
	import {
		useDict,
		paraseDict
	} from "@/utils/index";
	export default {
		data() {
			return {
				recordColor: {
					已撤回: "#fa3534",
					已接收: "#2979ff",
					待提交: "#2979ff",
					备案中: "#2979ff",
					已拒绝: "#fa3534",
					勿备案: "#fa3534",
					未备案: "#909399",
					免备案: "#909399",
					已退回: "#fa3534",
				},
				record: [], //备案字典
				activeContent: "我的申请",
				tabsList: [{
					name: "我的申请",
				}, ],
				ledgerList: [],
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					filingNo: '',
					orderByColumn: 'createTime',
					isAsc: 'Desc'
				},
				total: 0,
			};
		},
		async onLoad() {
			// useDict("ejian_instrCheckStatus").then((res) => {
			//   this.verification = res;
			// });
			// useDict("ejian_instrCheckRecordStatusV2").then((res) => {
			//   this.application = res;
			// });
			useDict("ejian_instrFillingStatus").then((res) => {
				this.record = res;
			});
			this.getList();
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			this.getList()
			console.log('refresh');
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 800);
		},
		onShow() {
			uni.$on('query', (query) => {
				if (query.a == 'one') {
					console.log('query', query)
					console.log('11111111111111111111111')
					uni.startPullDownRefresh();
					setTimeout(() => {
						this.queryParams.pageNum = 1
						this.queryParams.pageSize = 10
						this.getList()
					}, 1500)

				}
			})

		},
		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: {
			sousuo(val) {
				console.log(val)
				this.queryParams.filingNo = val
				this.getList()
			},
			getList() {
				getMiAuditApplyList({
					...this.queryParams
				}).then((res) => {
					this.ledgerList = res.rows;
					this.total = res.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++;

						getMiAuditApplyList({
							...this.queryParams
						}).then(({
							rows,
							total
						}) => {
							this.ledgerList = [...this.ledgerList, ...rows];
							this.total = total;
						});
					}
					setTimeout(() => {
						uni.hideLoading();
					}, 500);
				}
			},
			//备案申请
			handleApplicat() {
				uni.navigateTo({
					// url: "/pages/assay/assayList",
					url: '/pages/assay/deptList',
					success: (res) => {},
					fail: () => {},
					complete: () => {},
				});
			},
			handleChange(row) {
				this.activeContent = row.name;
			},
			handleCurrentForm() {},
			handleDetails(item) {
				uni.navigateTo({
					url: "/pages/assay/details?id=" + item.id + '&danwei=' + item.useOrgName +
						'&applypeople=' +
						item.userName + '&userMobile=' + item.userMobile + '&createTime=' + item
						.createTime,
					success: (res) => {},
					fail: () => {},
					complete: () => {},
				});
			},
		},
	};
</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: 10rpx 0 10rpx 10rpx;
		color: #3c9ff3;
	}

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

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

			.content {
				// border-bottom: 1px solid rgb(242, 242, 242);
				padding: 10rpx 0;
				display: flex;

				// justify-content: space-between;
			}

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

			.title {
				font-size: 28rpx;
				color: rgb(146, 146, 146);
				letter-spacing: 3rpx;
			}

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