heyang

pages_safetyCheck/views/snapshotManage/snapshotItems.vue

@@ -0,0 +1,513 @@
+<!-- 隐患项 -->
+<template>
+	<view class="hiddenDangerItems">
+		<view class="header">
+			<view class="line"></view>
+			<view class="tabTitle_tow">
+				<view class="tabTitle_tow_li" @tap="tabClickTow(item.value)" :key="index"
+					v-for="(item,index) in tabTextTow">
+					<view :class="{on:curTabTow==item.value}" class="tabTitle_tow_text">{{item.label}}</view>
+					<view :class="{on:curTabTow==item.value}" class="tabTitle_tow_across"></view>
+				</view>
+			</view>
+			<view class="line"></view>
+			<view class="search">
+				<view class="search-r" :class="(pageType == 0 && curTabTow == 0)||(pageType != 0) ?'search-r-margin':''"
+					@click="checkItemModuleButton('open')">
+					<img src="@/pages_safetyCheck/images/icon_aqjc_ss.png">
+					{{newData.hazardCheckCode?newData.hazardCheckCode:''}}{{newData.hazardCheckName?newData.hazardCheckName:'搜索检查项'}}
+				</view>
+			</view>
+			<view class="line"></view>
+		</view>
+		<scroll-view scroll-y style="overflow-y: scroll;flex:1;" @scrolltolower="scrollGet" class="info-max-box">
+			<view class="list">
+				<view class="total"
+					:class="curTabTow == 0?'total-color-1':(curTabTow == 1?'total-color-2':(curTabTow == 2?'total-color-3':''))"
+					v-if="pageType == 2">
+					{{curTabTow == 0?'待整改共'+total+'项':(curTabTow == 1?'已整改共'+total+'项':(curTabTow == 2?'暂无法整改共'+total+'项':''))}}
+				</view>
+				<view class="list-li" v-for="(item,index) in dataList" :key="index">
+					<view class="list-li-t" @click="itemsClick(item)">
+						<view v-if="pageType == 2">
+							<img v-if="curTabTow==2" src="@/pages_safetyCheck/images/icon_zg_zh@1x.png">
+							<img v-if="curTabTow==1" src="@/pages_safetyCheck/images/icon_xz_zg@1x.png">
+							<img v-if="curTabTow==4" src="@/pages_safetyCheck/images/icon_xz_fc@1x.png">
+						</view>
+						<view>{{item.hazardCheckCode}}{{item.hazardCheckName}}</view>
+					</view>
+					<view v-if="pageType == 2 && item.dangerNum" class="list-li-b" @click="hiddenDangerClick(item)">
+						此检查项在当前实验室累计出现<text>{{item.dangerNum}}</text>次隐患
+					</view>
+				</view>
+			</view>
+			<view class="get-data-p" v-if="!getDataType">
+				<img class="get-data-img" src="@/pages_safetyCheck/images/icon_aqjc_sl.png">
+				<view class="get-data-text">上拉加载</view>
+			</view>
+			<view class="get-data-null-p" v-if="getDataType">- 没有更多数据 -</view>
+		</scroll-view>
+		<checkItemModule :propsData="propsData" v-if="checkItemModuleType"></checkItemModule>
+	</view>
+
+</template>
+
+<script>
+	import {
+		config
+	} from '@/api/request/config.js'
+	import {
+		securityAppCheckPhotoList,
+	} from '@/pages_safetyCheck/api/index.js'
+	import {
+		checkItemModule
+	} from '@/pages_safetyCheck/component/checkItemModule.vue'
+	export default {
+		name: "hiddenDangerItems",
+		components: {
+			checkItemModule
+		},
+		data() {
+			return {
+				baseUrl: config.base_url,
+				pageType: 1,
+				tabTextTow: [],
+				curTabTow: 0,
+				form: {
+					imgDtoList: [],
+				},
+				lotName: null,
+				newData: {
+
+				},
+				dialogVisible: false,
+				// 查询参数
+				queryParams: {
+					page: 1,
+					pageSize: 10,
+				},
+				//符合/不符合
+				checkFlag: null,
+				total: 0,
+				dataList: [],
+				getDataType: false,
+				searchIndex: 0,
+				//检查项组件数据
+				checkItemModuleType: false,
+				propsData: {},
+			}
+		},
+		onLoad(option) {
+			let optionData = JSON.parse(decodeURIComponent(option.infoData));
+			console.log(optionData)
+			uni.setNavigationBarTitle({
+				title: optionData.subName + '(' + optionData.subRoom + ')'
+			})
+			this.$set(this, 'pageType', optionData.pageType);
+			this.$set(this, 'tabTextTow',[{
+							value: '0',
+							label: '待整改'
+						}, {
+							value: '1',
+							label: '已整改'
+						}, {
+							value: '2',
+							label: '暂无法整改'
+						}])
+			this.$set(this, 'newData', optionData);
+			this.$nextTick(() => {
+				this.getList()
+			})
+		},
+		onShow() {
+
+		},
+		mounted() {
+
+		},
+		methods: {
+			//滚动事件
+			scrollGet() {
+				let self = this;
+				if (self.total / self.queryParams.pageSize <= self.queryParams.page) {
+					this.$set(this, 'getDataType', true);
+				} else {
+					this.queryParams.page += 1;
+					this.$nextTick(() => {
+						this.getList();
+					})
+				}
+			},
+			//顶部tab点击
+			tabClickTow(value) {
+				this.$set(this, 'checkFlag', null);
+				this.$set(this.queryParams, 'page', 1);
+				this.$set(this, 'curTabTow', value);
+				this.$set(this, 'total', 0);
+				this.$set(this, 'dataList', []);
+				this.$nextTick(()=>{
+					this.getList();
+				})
+			},
+			dialogOpen() {
+				this.dialogVisible = true;
+			},
+			dialogClose() {
+				this.dialogVisible = false;
+			},
+			
+			checkItemModuleButton(type, item) {
+				if (type == 'open') {
+					let obj = {
+						infoType: this.pageType,
+						checkType: this.curTabTow,
+					}
+					if (this.pageType == 0) {
+						//检查
+						obj.manageId = this.newData.manageId
+					} else if (this.pageType != 0) {
+						//复查/整改
+						obj.planId = this.newData.checkPlanSetVoList.planId;
+						obj.planSetId = this.newData.checkPlanSetVoList.planSetId;
+						obj.subId = this.newData.subId;
+					}
+					this.$set(this, 'propsData', obj);
+					this.$set(this, 'checkItemModuleType', true);
+				} else if (type == 'out') {
+					this.$set(this, 'checkItemModuleType', false);
+					this.$set(this, 'propsData', {});
+				} else if (type == 'submit') {
+					this.itemsClick(item);
+				}
+			},
+			//检查项选中
+			itemsClick(row) {
+				let infoData = row;
+				infoData.pageType = this.pageType;
+				uni.navigateTo({
+					url: '/pages_safetyCheck/views/snapshotManage/snapshotRectification?infoData=' + encodeURIComponent(JSON.stringify(infoData))
+				});
+			},
+			hiddenDangerClick(row) {
+				let infoData = row;
+				infoData.pageType = this.pageType;
+				uni.redirectTo({
+					url: '/pages_safetyCheck/views/inspectManage/hiddenDangerRecord?infoData=' +
+						encodeURIComponent(JSON.stringify(infoData))
+				});
+			},
+			//
+			async getList() {
+				let self = this;
+				let obj = JSON.parse(JSON.stringify(this.queryParams))
+				//隐患整改
+				obj.hazardCheckId = '';
+				obj.searchValue = '';
+				obj.subId = this.newData.subId;
+				obj.rectifyStatus = this.curTabTow;
+				const {
+					data
+				} = await securityAppCheckPhotoList(obj);
+				if (data.code == 200) {
+					if (self.queryParams.page == 1) {
+						this.dataList = data.data.records;
+						this.total = data.data.total;
+						if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
+							this.$set(this, 'getDataType', true);
+						}
+					} else {
+						this.dataList = [...this.dataList, ...data.data.records]
+						this.total = data.data.total;
+						if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
+							this.$set(this, 'getDataType', true);
+						}
+					}
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="stylus" scoped>
+	.hiddenDangerItems {
+		height: 100%;
+		display flex;
+		flex-direction: column;
+		overflow: hidden;
+		box-sizing: border-box;
+
+		#totalColor-A {
+			color: #0183FA;
+			background: rgba(1, 131, 250, 0.2);
+		}
+
+		#totalColor-B {
+			color: #16B531;
+			background: rgba(22, 181, 49, 0.2);
+		}
+
+		#totalColor-C {
+			color: #FF8C00;
+			background: rgba(255, 140, 0, 0.2);
+		}
+
+		.header {
+			width: 100%;
+			height: 198rpx;
+			overflow: hidden;
+			background: #fff;
+
+			.lotName {
+				height: 70rpx;
+				line-height: 70rpx;
+				font-size: 28rpx;
+				background: rgba(1, 131, 250, 0.2);
+				color: #0183FA;
+				text-align: center;
+			}
+
+			.lotNameOne {
+				background: #F7E0C4;
+				color: #FF8C00;
+			}
+
+			.tabTitle_tow {
+				width: 520rpx;
+				height: 80rpx;
+
+				display flex;
+				justify-content: flex-start;
+				align-items: center;
+
+				.tabTitle_tow_li {
+					flex: 1;
+					position: relative;
+					text-align center;
+
+					.tabTitle_tow_text {
+						display: inline-block;
+						font-size: 30rpx;
+						font-family: PingFang SC;
+						font-weight: 500;
+						color: #333333;
+						line-height: 46rpx;
+						position: relative;
+
+						&.on {
+							color: #0183FA;
+						}
+					}
+
+					.tabTitle_tow_across {
+						width: 50rpx;
+						height: 4rpx;
+						background: #0183FA;
+						border-radius: 2rpx;
+						margin-left: 38%;
+						display none;
+
+						&.on {
+							display block;
+						}
+					}
+
+				}
+			}
+
+			.line {
+				width: 100%;
+				height: 13rpx;
+				background: #F5F5F5;
+			}
+
+			.search {
+				width: 750rpx;
+				height: 80rpx;
+				background: #FFFFFF;
+				border-radius: 0rpx 0rpx 0rpx 0rpx;
+				display: flex;
+				justify-content: flex-start;
+				align-items: center;
+
+				.search-l {
+					display: flex;
+					justify-content: flex-start;
+					align-items: center;
+					margin: 0 20rpx 0 30rpx;
+
+					.search-A {
+						border-radius: 50rpx 50rpx 50rpx 50rpx;
+						border: 1rpx solid #E0E0E0;
+						width: 100rpx;
+						height: 60rpx;
+						background: #E0E0E0;
+						font-weight: normal;
+						font-size: 24rpx;
+						color: #333333;
+						line-height: 60rpx;
+						text-align: center;
+						margin-right: 10rpx;
+					}
+
+					.search-B {
+						border-radius: 50rpx 50rpx 50rpx 50rpx;
+						border: 1rpx solid #0183FA;
+						width: 100rpx;
+						height: 60rpx;
+						background: #0183FA;
+						font-weight: normal;
+						font-size: 24rpx;
+						color: #FFFFFF;
+						line-height: 60rpx;
+						text-align: center;
+						margin-right: 10rpx;
+					}
+				}
+
+				.search-r-margin {
+					width: 700rpx !important;
+					margin: 0 auto;
+				}
+
+				.search-r {
+					width: 440rpx;
+					height: 60rpx;
+					background: #FFFFFF;
+					border-radius: 50rpx 50rpx 50rpx 50rpx;
+					border: 1rpx solid #E0E0E0;
+					font-size: 24rpx;
+					color: #999999;
+					line-height: 60rpx;
+					text-align: left;
+					display: flex;
+					justify-content: flex-start;
+					align-items: center;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+
+					>img {
+						width: 30rpx;
+						height: 30rpx;
+						margin-right: 20rpx;
+					}
+				}
+			}
+		}
+
+		.list {
+			width: 750rpx;
+			background: #FFFFFF;
+			padding-bottom: 20rpx;
+			box-sizing: border-box;
+
+			.total {
+				display: inline-block;
+				height: 50rpx;
+				background: rgba(1, 131, 250, 0.2);
+				border-radius: 0rpx 0rpx 20rpx 0rpx;
+				font-size: 24rpx;
+				color: #0183FA;
+				line-height: 50rpx;
+				text-align: left;
+				padding: 0rpx 22rpx;
+				box-sizing: border-box;
+				margin-bottom: 20rpx;
+			}
+
+			.total-color-1 {
+				background: rgba(1, 131, 250, 0.2);
+				color: #0183FA;
+			}
+
+			.total-color-2 {
+				background: rgba(22, 181, 49, 0.2);
+				color: #16B531;
+			}
+
+			.total-color-3 {
+				background: #F7E0C4;
+				color: #FF8C00;
+			}
+
+			.list-li {
+				margin: 0 30rpx;
+
+				.list-li-t {
+					width: 690rpx;
+					background: #F5F5F5;
+					border-radius: 10rpx 10rpx 10rpx 10rpx;
+					display: flex;
+					justify-content: flex-start;
+					padding: 12rpx 20rpx 14rpx 14rpx;
+					box-sizing: border-box;
+					margin: 20rpx 0;
+
+					>view:nth-of-type(1) {
+						>img {
+							width: 24rpx;
+							height: 24rpx;
+							margin-right: 30rpx;
+						}
+					}
+
+					>view:nth-of-type(2) {
+						flex: 1;
+						font-size: 24rpx;
+						color: #3D3D3D;
+						line-height: 34rpx;
+						text-align: left;
+					}
+				}
+
+				.list-li-b {
+					font-size: 24rpx;
+					color: #3D3D3D;
+					line-height: 24rpx;
+					text-align: right;
+
+					>text {
+						color: #FF0000;
+					}
+				}
+
+			}
+		}
+
+		.get-data-p {
+			height: 100rpx;
+			text-align: center;
+
+			.get-data-img {
+				width: 30rpx;
+				height: 30rpx;
+				margin: 0 auto;
+				margin-top: 15rpx;
+			}
+
+			.get-data-text {
+				text-align: center;
+			}
+		}
+
+		.get-data-null-p {
+			height: 100rpx;
+			line-height: 100rpx;
+			text-align: center;
+		}
+
+		.sub-btn {
+			width: 686rpx;
+			height: 100rpx;
+			background: #0183FA;
+			border-radius: 50rpx 50rpx 50rpx 50rpx;
+			position: fixed;
+			left: 30rpx;
+			bottom: 30rpx;
+			font-weight: 400;
+			font-size: 30rpx;
+			color: #FFFFFF;
+			line-height: 100rpx;
+			text-align: center;
+		}
+	}
+</style>

pages_safetyCheck/views/snapshotManage/snapshotRectification.vue

@@ -0,0 +1,630 @@
+<!-- 随手拍隐患项整改 -->
+<template>
+	<view class="snapshotDetail">
+		<scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
+			<view class="tip">整改期限2024-10-06（逾期未完成整改关闭实验室）</view>
+			<view class="items" v-if="newData.hazardCheckName!=''">
+				<view class="items-t" >
+					<view class="items-t-r">{{newData.hazardCheckCode}} {{newData.hazardCheckName}}</view>
+				</view>
+				<view class="items-b" >＜ {{newData.hazardCheckCode2}}
+					{{newData.hazardCheckName2}} ＜ {{newData.hazardCheckCode1}} {{newData.hazardCheckName1}}</view>
+			</view>
+			<view class="items-number" v-if="newData.hazardCheckName!=''">此检查项在当前实验室累计出现<text>{{newData.hazardCheckNum}}</text>次隐患</view>
+			<view class="list">
+				<view class="list-li" v-if="newData.hazardCheckName!=''">
+					<view>检查要点</view>
+					<view>
+						<img src="@/pages_safetyCheck/images/icon_06.png">
+					</view>
+				</view>
+				<view v-if="newData.hazardCheckName!=''" class="hidden-content">{{newData.hazardCheckPoint}}
+				</view>
+				<view class="list-li">
+					<view>检查隐患</view>
+					<view style="color: #FF8C00;">
+						<img src="@/pages_safetyCheck/images/icon_06.png">
+					</view>
+				</view>
+				<view class="hidden-content">{{newData.hazardDescribe}}
+				</view>
+				<view class="photo">
+					<img v-for="(item,index) in newData.yhDtoList" :src="baseUrl+item.fileUrl">
+				</view>
+				<view class="list-li">
+					<view>姓名：</view>
+					<view>{{newData.createName}}</view>
+				</view>
+				<view class="list-li">
+					<view>时间：</view>
+					<view>{{newData.createTime}}</view>
+				</view>
+				<view class="list-li">
+					<view>隐患整改</view>
+					<view>
+						<img src="@/pages_safetyCheck/images/icon_06.png">
+					</view>
+				</view>
+				<textarea class="describe" type="text" v-model="form.rectifyDescribe" maxlength="200"
+					placeholder="请填写整改措施" placeholder-style="font-size:24rpx;color:#999;"></textarea>
+				<view class="check-for-img-max-box">
+					<view class="left-title-p"></view>
+					<view class="right-img-box">
+						<view class="img-box" v-for="(imgUrl,imgIndex) in form.imgDtoList" :key="imgIndex">
+							<img class="img-data" :src="baseUrl+imgUrl.fileUrl">
+							<img class="position-img" src="@/pages_safetyCheck/images/icon_ssp_closure.png"
+								@click="delImg(imgIndex)">
+						</view>
+						<img class="add-button" src="@/pages_safetyCheck/images/img_ssp_pz@1x.png"
+							@click="selectImage()" v-if="form.imgDtoList.length<5">
+					</view>
+				</view>
+				<!-- <view class="list-li-tow">
+					<view>整改方案（上传文件）</view>
+					<view @click="selectFile()">
+						<img src="@/pages_safetyCheck/images/icon_aqjc_sc.png">
+					</view>
+				</view>
+				<view class="file-li" v-if="form.rectifyProjectName">
+					<img src="@/pages_safetyCheck/images/icon_djc_wj.png">
+					<view>{{form.rectifyProjectName}}</view>
+					<img src="@/pages_safetyCheck/images/icon_yybz_sc.png">
+				</view> -->
+			</view>
+		</scroll-view>
+		<view class="sub-btn">
+			<view @click="submitForm(2)">暂无法整改</view>
+			<view @click="submitForm(1)">完成整改</view>
+		</view>
+	</view>
+
+</template>
+
+<script>
+	import {
+		config
+	} from '@/api/request/config.js'
+	import {
+		securityAppCheckPhotoUpdate,
+	} from '@/pages_safetyCheck/api/index.js'
+	export default {
+		name: "snapshotDetail",
+		components: {
+
+		},
+		data() {
+			return {
+				baseUrl: config.base_url,
+				inspectionItems: 0, //0有检查项 1无检查项
+				form: {
+					imgDtoList: [],
+					rectifyProjectName:'',
+					rectifyProjectUrl:'',
+				},
+				newData: {},
+			}
+		},
+		onLoad(option) {
+			console.log(option.infoData)
+			this.$set(this, 'newData', JSON.parse(decodeURIComponent(option.infoData)));
+			console.log(this.newData)
+		},
+		onShow() {
+
+		},
+		mounted() {
+
+		},
+		methods: {
+			//滚动事件
+			scrollGet() {},
+			/******文件上传******/
+			selectFile() {
+				let self = this;
+				wx.chooseMessageFile({
+				  count: 1,
+				  type: 'file',
+				  success (res) {
+					  console.log(res)
+				    // tempFilePath可以作为img标签的src属性显示图片
+				    const tempFilePaths = res.tempFiles[0].path
+					self.form.rectifyProjectName=res.tempFiles[0].name
+					self.uploadFile(tempFilePaths);
+				  }
+				})
+			},
+			async uploadFile(tempFilePaths) {
+				var self = this;
+				uni.showLoading({
+					title: '上传中',
+					mask: true
+				});
+				uni.uploadFile({
+					url: config.base_url + '/system/file/upload', //仅为示例，非真实的接口地址
+					header: {
+						'Authorization': uni.getStorageSync('token')
+					},
+					filePath: tempFilePaths,
+					name: 'file',
+					formData: {
+						'user': 'test'
+					},
+					success: (uploadFileRes) => {
+						let res = JSON.parse(uploadFileRes.data);
+						console.log(res)
+						if (res.code == 200) {
+							self.form.rectifyProjectUrl=res.data.url;
+						} else {
+							uni.showToast({
+								title: res.msg,
+								icon: "none",
+								mask: true,
+								duration: 2000
+							});
+						}
+					},
+					fail: err => {},
+					complete: () => {
+						uni.hideLoading()
+					}
+				});
+			},
+			/******图片上传******/
+			selectImage() {
+				let self = this;
+				if (this.form.imgDtoList.length > 4) {
+					uni.showToast({
+						title: '最多上传5张图片',
+						icon: "none",
+						mask: true,
+						duration: 2000
+					});
+					return
+				}
+				wx.chooseImage({
+					count: 1,
+					sizeType: ["original", "compressed"],
+					sourceType: ["album", "camera"],
+					success: function(res) {
+						let tempFilePaths = res.tempFilePaths[0];
+						console.log(tempFilePaths)
+						self.uploadImg(tempFilePaths);
+					}
+				});
+			},
+			async uploadImg(tempFilePaths) {
+				var self = this;
+				uni.showLoading({
+					title: '上传中',
+					mask: true
+				});
+				uni.uploadFile({
+					url: config.base_url + '/system/file/upload', //仅为示例，非真实的接口地址
+					header: {
+						'Authorization': uni.getStorageSync('token')
+					},
+					filePath: tempFilePaths,
+					name: 'file',
+					formData: {
+						'user': 'test'
+					},
+					success: (uploadFileRes) => {
+						let res = JSON.parse(uploadFileRes.data);
+						if (res.code == 200) {
+							this.form.imgDtoList.push({
+								'fileUrl': res.data.url,
+								'fileName': res.data.name
+							});
+							console.log(res.data.url)
+						} else {
+							uni.showToast({
+								title: res.msg,
+								icon: "none",
+								mask: true,
+								duration: 2000
+							});
+						}
+					},
+					fail: err => {},
+					complete: () => {
+						uni.hideLoading()
+					}
+				});
+			},
+			//删除图片
+			delImg(minIndex) {
+				this.form.imgDtoList.splice(minIndex, 1);
+				this.$forceUpdate();
+			},
+			//整改/暂无法整改
+			async submitForm(status) {
+				let self = this;
+				if (status ==2 && this.form.rectifyProjectUrl=='') {
+					uni.showToast({
+						title: '请上传整改方案!',
+						icon: "none",
+						mask: true,
+						duration: 2000
+					});
+					return
+				}
+				let obj={
+					photoId:this.newData.photoId,
+					rectifyStatus:status,//1已整改2暂无法整改
+					rectifyDescribe:this.form.rectifyDescribe,
+					imgDtoList:this.form.imgDtoList,
+					rectifyProjectName:this.form.rectifyProjectName,
+					rectifyProjectUrl:this.form.rectifyProjectUrl,
+				}
+				const {
+					data
+				} = await securityAppCheckPhotoUpdate(obj);
+				if (data.code == 200) {
+					uni.showToast({
+						title: '提交成功',
+						icon: "none",
+						mask: true,
+						duration: 2000
+					});
+					let infoData=this.newData;
+					uni.navigateTo({
+						url: '/pages_safetyCheck/views/snapshotManage/snapshotDetail?infoData=' + encodeURIComponent(JSON.stringify(infoData))
+					});
+					
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="stylus" scoped>
+	.snapshotDetail {
+		height: 100%;
+		display flex;
+		box-sizing: border-box;
+		padding-bottom: 160rpx;
+		box-sizing: border-box;
+
+		#bgColor-A {
+			color: #FFD400;
+		}
+
+		#bgColor-B {
+			color: #FF8C00;
+		}
+
+		#bgColor-C {
+			color: #E11608;
+		}
+
+		.tip {
+			width: 750rpx;
+			height: 80rpx;
+			background: rgba(255, 140, 0, 0.2);
+			font-weight: normal;
+			font-size: 28rpx;
+			color: #FF8C00;
+			line-height: 80rpx;
+			text-align: center;
+		}
+
+		.items {
+			width: 690rpx;
+			min-height: 165rpx;
+			background: #FFFFFF;
+			border-radius: 20rpx 20rpx 20rpx 20rpx;
+			margin: 20rpx 0 0 30rpx;
+
+			.items-li {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+				border-bottom: 1rpx solid #E0E0E0;
+
+				>view:nth-of-type(1) {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 80rpx;
+					text-align: left;
+				}
+
+				>view:nth-of-type(2) {
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 80rpx;
+					text-align: left;
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+				}
+			}
+
+			.items-t {
+				border-bottom: 1rpx solid #E0E0E0;
+				height: 80rpx;
+				display: flex;
+				justify-content: flex-start;
+				align-items: center;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+
+				.items-t-l {
+					width: 175rpx;
+					height: 50rpx;
+					background: #E11608;
+					border-radius: 50rpx 50rpx 50rpx 50rpx;
+					font-size: 30rpx;
+					color: #FFFFFF;
+					line-height: 50rpx;
+					text-align: center;
+					margin-right: 14rpx;
+				}
+
+				.items-t-r {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 42rpx;
+					text-align: left;
+				}
+			}
+
+			.items-b {
+				padding: 0 30rpx;
+				box-sizing: border-box;
+				height: 80rpx;
+				font-size: 28rpx;
+				color: #666666;
+				line-height: 80rpx;
+				text-align: left;
+			}
+		}
+
+		.items-number {
+			font-size: 24rpx;
+			color: #3D3D3D;
+			line-height: 34rpx;
+			text-align: right;
+			margin: 20rpx 60rpx 0 0;
+
+			>text {
+				font-size: 24rpx;
+				color: #FF0000;
+				line-height: 34rpx;
+				text-align: right;
+			}
+		}
+
+		.list {
+			width: 690rpx;
+			margin: 20rpx 30rpx 0;
+			background: #FFFFFF;
+			border-radius: 20rpx 20rpx 20rpx 20rpx;
+
+			.list-li {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+				border-bottom: 1rpx solid #E0E0E0;
+
+				>view:nth-of-type(1) {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 80rpx;
+					text-align: left;
+				}
+
+				>view:nth-of-type(2) {
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 80rpx;
+					text-align: left;
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+
+					>img {
+						width: 24rpx;
+						height: 12rpx;
+						margin-left: 10rpx;
+					}
+				}
+
+			}
+
+			.list-li-tow {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+				border-top: 1rpx solid #E0E0E0;
+				border-bottom: 1rpx solid #E0E0E0;
+
+				>view:nth-of-type(1) {
+					font-size: 30rpx;
+					color: #333333;
+					line-height: 80rpx;
+					text-align: left;
+				}
+
+				>view:nth-of-type(2) {
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 80rpx;
+					text-align: left;
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+
+					>img {
+						width: 30rpx;
+						height: 28rpx;
+						margin-left: 10rpx;
+					}
+				}
+
+			}
+
+			.file-li {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+
+				>img:nth-of-type(1) {
+					width: 30rpx;
+					height: 30rpx;
+				}
+
+				>view {
+					flex: 1;
+					font-size: 28rpx;
+					color: #333333;
+					line-height: 80rpx;
+					text-align: left;
+					margin: 0 92rpx 0 16rpx;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+				}
+
+				>img:nth-of-type(2) {
+					width: 30rpx;
+					height: 30rpx;
+				}
+			}
+
+			.hidden-content {
+				width: 630rpx;
+				min-height: 200rpx;
+				background: #F5F5F5;
+				border-radius: 20rpx 20rpx 20rpx 20rpx;
+				margin: 20rpx 30rpx 0;
+				padding: 20rpx;
+				box-sizing: border-box;
+				font-size: 28rpx;
+				color: #666666;
+				line-height: 39rpx;
+				text-align: left;
+			}
+
+			.photo {
+				display: flex;
+				justify-content: flex-start;
+				flex-wrap: wrap;
+				margin-top: 20rpx;
+				padding: 0 30rpx;
+				box-sizing: border-box;
+
+				>img {
+					width: 150rpx;
+					height: 150rpx;
+					border-radius: 10rpx 10rpx 10rpx 10rpx;
+					margin: 0 10rpx 10rpx 0;
+				}
+			}
+
+			.describe {
+				width: 636rpx;
+				height: 120rpx;
+				border-radius: 10rpx 10rpx 10rpx 10rpx;
+				border: 1rpx solid #E0E0E0;
+				margin: 20rpx 0 0 28rpx;
+				padding: 12rpx 16rpx;
+				box-sizing: border-box;
+			}
+
+			.check-for-img-max-box {
+				margin: 20px 28rpx;
+
+				.left-title-p {
+					width: 100%;
+					text-align: left;
+					font-size: 30rpx;
+					font-family: PingFang SC-Medium, PingFang SC;
+					font-weight: 400;
+					color: #333333;
+					line-height: 80rpx;
+				}
+
+				.right-img-box {
+					.img-box {
+						display inline-block;
+						height: 150rpx;
+						width: 150rpx;
+						position relative;
+						margin: 0 14rpx 20rpx 0;
+						border-radius 10rpx;
+						overflow hidden;
+
+						.img-data {
+							height: 150rpx;
+							width: 150rpx;
+						}
+
+						.position-img {
+							position absolute;
+							right: 0;
+							top: 0;
+							width: 36rpx;
+							height: 36rpx;
+						}
+					}
+
+					.img-box:nth-of-type(3n+3) {
+						margin-right: 0rpx;
+					}
+
+					.add-button {
+						margin: 0 0rpx 20rpx 0;
+						border-radius 10rpx;
+						overflow hidden;
+						display inline-block;
+						height: 150rpx;
+						width: 150rpx;
+					}
+				}
+			}
+
+			.list-li:last-of-type {
+				border: none;
+			}
+		}
+
+	}
+
+	.sub-btn {
+		display: flex;
+		justify-content: center;
+		position: fixed;
+		left: 30rpx;
+		bottom: 30rpx;
+
+		>view:nth-of-type(1) {
+			width: 345rpx;
+			height: 100rpx;
+			background: #FF8C00;
+			border-radius: 50rpx 0rpx 0rpx 50rpx;
+			font-size: 30rpx;
+			color: #FFFFFF;
+			line-height: 100rpx;
+			text-align: center;
+		}
+
+		>view:nth-of-type(2) {
+			width: 345rpx;
+			height: 100rpx;
+			background: #0183FA;
+			border-radius: 0rpx 50rpx 50rpx 0rpx;
+			font-size: 30rpx;
+			color: #FFFFFF;
+			line-height: 100rpx;
+			text-align: center;
+		}
+	}
+</style>