vant 组件重写

pages/check/MapView.vue

@@ -117,6 +117,6 @@
 <style scoped>
 	#container {
 		width: 100vw;
-		height: 50vh;
+		height: 40vh;
 	}
 </style>

pages/index/common/hcDetails.vue

@@ -1,73 +1,107 @@
 <template>
 	<view class="details">
 		<view class="search">
-			<van-icon name="wap-nav" @click="returnList" />
+			<uni-icons type="bars" size="30" @click="returnList"></uni-icons>
 		</view>
-		<van-sticky :offset-top="-10">
+		<scroll-view class="top-menu-view" scroll-x="true">
+			<view class="menu-topic-view" v-for="(item, key) in tabOptions" :key="key" @click="active=key">
+				<view :class="active==key ? 'menu-topic-act' : 'menu-topic'">
+					<text class="menu-topic-text">{{item}}</text>
+					<view class="menu-topic-bottom">
+						<view class="menu-topic-bottom-color"></view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+		<!-- <van-sticky :offset-top="-10">
 			<van-tabs sticky v-model="active" class="tabs">
 				<van-tab v-for="(item, key) in tabOptions" :key="key" :title="item">
-					<view class="hclist" v-if="key==0">
-						<van-cell v-for="(item, i) in jbxxs" :key="i" :title="item.name" :value="infoObj[item.prop]" />
-					</view>
-					<view class="hclist" v-if="active==1">
-						<van-tabs sticky v-if="sheets.length" v-model="ywyptab">
-							<van-tab v-for="ypitem in sheets" :key="ypitem.sheet" :title="ypitem.type"
-								:name="ypitem.sheet">
-								<view>
-									<img :src="ypitem.photo" width="100%" />
-									压占{{ ypitem.type }}面积共{{ ypitem.mjj }}平方米
-									<van-cell>
-										<van-row>
-											<van-col :span="8" v-for="(item, i) in tdxzTable"
-												:key="i">{{item.label}}</van-col>
-										</van-row>
-									</van-cell>
-									<van-cell>
-										<van-row v-for="(row, index) in ypitem.data_list" :key="index">
-											<van-col :span="8" v-for="(item, i) in tdxzTable" :key="i">
-												<div v-if="item.slot == 'ratio'">
-													{{ ((row.yzmj / ypitem.yzmj) * 100).toFixed(2) }}%
-												</div>
-												<span v-else>{{ row[item.prop] }}</span>
-											</van-col>
-										</van-row>
-									</van-cell>
-								</view>
-							</van-tab>
-						</van-tabs>
-
+				</van-tab>
+			</van-tabs>
+		</van-sticky> -->
+		<view>
+			<view class="hclist" v-if="active==0">
+				<view class="menu-list">
+					<view class="list-cell list-cell-arrow" v-for="(item, i) in jbxxs" :key="i">
+						<view class="menu-item-box">
+							<view>{{item.name}}</view>
+							<view class="text-right">{{infoObj[item.prop]}}</view>
+						</view>
 					</view>
-					<view class="hclist" v-if="key==2">
-						<van-uploader v-model="fileList" multiple :after-read="afterRead" />
+				</view>
+				<!-- <van-cell v-for="(item, i) in jbxxs" :key="i" :title="item.name" :value="infoObj[item.prop]" /> -->
+			</view>
+			<view class="hclist" v-if="active==1">
+				<scroll-view v-if="sheets.length" class="top-menu-view" scroll-x="true">
+					<view class="menu-topic-view" v-for="ypitem in sheets" :key="ypitem.sheet"
+						@click="ywyptab=ypitem.sheet">
+						<view :class="ywyptab==ypitem.sheet ? 'menu-topic-act' : 'menu-topic'">
+							<text class="menu-topic-text">{{ypitem.type}}</text>
+							<view class="menu-topic-bottom">
+								<view class="menu-topic-bottom-color"></view>
+							</view>
+						</view>
 					</view>
-					<view class="hclist" v-if="key==3">
-						<uni-forms ref="form" :model="checkform" labelWidth="80px">
-							<uni-forms-item label="实际地类" name="nickName">
-								<uni-data-select v-model="checkform.phonenumber" :localdata="range"></uni-data-select>
-							</uni-forms-item>
-							<uni-forms-item label="核查初判" name="phonenumber">
-								<uni-data-select v-model="checkform.phonenumber" :localdata="range"></uni-data-select>
-							</uni-forms-item>
-							<uni-forms-item label="其它材料" name="email">
-								<van-uploader v-model="checkform.fileList" multiple :after-read="afterRead" />
-							</uni-forms-item>
-							<uni-forms-item label="其它说明" name="sex" required>
-								<uni-easyinput v-model="checkform.phonenumber" type="textarea" placeholder="请输入其它说明" />
-							</uni-forms-item>
-						</uni-forms>
+				</scroll-view>
+				<!-- <van-tabs sticky v-if="sheets.length" v-model="ywyptab">
+					<van-tab v-for="ypitem in sheets" :key="ypitem.sheet" :title="ypitem.type" :name="ypitem.sheet">
+					</van-tab>
+				</van-tabs> -->
+				<view class="swiper-item" v-for="ypitem in sheets" :key="ypitem.sheet">
+					<view v-if="ywyptab==ypitem.sheet">
+						<img :src="ypitem.photo" width="100%" />
+						压占{{ ypitem.type }}面积共{{ ypitem.mjj }}平方米
+						<view class="list-cell">
+							<uni-row>
+								<uni-col :span="8" v-for="(item, i) in tdxzTable" :key="i">{{item.label}}</uni-col>
+							</uni-row>
+						</view>
+						<view class="list-cell">
+							<uni-row v-for="(row, index) in ypitem.data_list" :key="index">
+								<uni-col :span="8" v-for="(item, i) in tdxzTable" :key="i">
+									<div v-if="item.slot == 'ratio'">
+										{{ ((row.yzmj / ypitem.yzmj) * 100).toFixed(2) }}%
+									</div>
+									<span v-else>{{ row[item.prop] }}</span>
+								</uni-col>
+							</uni-row>
+						</view>
 					</view>
-				</van-tab>
-			</van-tabs>
-		</van-sticky>
+				</view>
+			</view>
+			<view class="hclist" v-if="active==2">
+				<view class="example-body">
+					<uni-file-picker v-model="fileList" limit="9" title="最多选择9张图片"></uni-file-picker>
+				</view>
+
+			</view>
+			<view class="hclist" v-if="active==3">
+				<uni-forms ref="form" :model="checkform" labelWidth="80px">
+					<uni-forms-item label="实际地类" name="nickName">
+						<uni-data-select v-model="checkform.phonenumber" :localdata="range"></uni-data-select>
+					</uni-forms-item>
+					<uni-forms-item label="核查初判" name="phonenumber">
+						<uni-data-select v-model="checkform.phonenumber" :localdata="range"></uni-data-select>
+					</uni-forms-item>
+					<uni-forms-item label="其它材料" name="email">
+						<uni-file-picker v-model="checkform.fileList" title="添加照片或文件"></uni-file-picker>
+
+					</uni-forms-item>
+					<uni-forms-item label="其它说明" name="sex" required>
+						<uni-easyinput v-model="checkform.phonenumber" type="textarea" placeholder="请输入其它说明" />
+					</uni-forms-item>
+				</uni-forms>
+			</view>
+		</view>
 		<div class="btns">
-			<button type="primary" @click="toggle">举证说明</button>
-			<button type="primary" @click="affirm(0)">确认</button>
-			<button type="primary" @click="affirm(1)">退回</button>
-			<button type="primary" @click="save">保存</button>
-			<button type="primary" @click="tj">提交</button>
+			<button type="primary" size="mini" @click=" toggle">举证说明</button>
+			<button type="primary" size="mini" :disabled=" !qrdis" @click="affirm(0)">确认</button>
+			<button type="primary" size="mini" :disabled=" !qrdis" @click="affirm(1)">退回</button>
+			<button type="primary" size="mini" @click="save">保存</button>
+			<button type="primary" size="mini" :disabled=" !tjdis" @click="tj">提交</button>
 		</div>
 		<uni-popup ref="popup" background-color="#fff">
-			<uni-popup-dialog :type="msgType" title="举证说明" :content="nowobj.notes"></uni-popup-dialog>
+			<uni-popup-dialog type="info" title="举证说明" :content="nowobj.notes"></uni-popup-dialog>
 		</uni-popup>
 	</view>
 
@@ -78,7 +112,6 @@
 		getDkjbxx,
 		getDkjbywy,
 		getStep,
-	
 		hcWork,
 		getHcInfo,
 		tjWork,
@@ -98,6 +131,8 @@
 				tabOptions: ['基本信息', '业务研判', '实地拍照', '核查信息'],
 				loading: false,
 				steps: [],
+				qrdis: false,
+				tjdis: false,
 				jbxxs: jbxxs,
 				tdxzTable: tdxzTable,
 				activeName: "jbxx",
@@ -140,10 +175,14 @@
 					}
 					console.log(this.sheets);
 				});
+				this.steps = [];
 				getStep({
 					dkjdxxId: id
 				}).then((res) => {
 					this.steps = res.data;
+					this.qrdis = this.steps.find((x) => x.auditflowStep.includes('WYQR'))
+					this.tjdis = this.steps.find((x) => x.auditflowStep.includes('TJ'))
+
 				});
 				getHcInfo({
 					dkid: id,
@@ -152,7 +191,7 @@
 					fieldworkId: ''
 
 				}).then((res) => {
-					this.checkform = res.data;
+					this.checkform = res.data || {};
 				});
 				getTjInfo({
 					dkid: id,
@@ -184,7 +223,11 @@
 				uni.$globalData = this.nowobj
 				this.$tab.navigateTo('/pages/index/common/edit?confirmState=' + confirmState)
 			},
-			
+			tj() {
+				uni.$globalData = this.nowobj
+				this.$tab.navigateTo('/pages/index/common/tjDialog')
+			},
+
 
 
 		},
@@ -195,13 +238,10 @@
 	.details {
 		width: 100%;
 
-		.van-icon {
+		.uni-icons {
 			position: absolute;
 			right: 20rpx;
 			top: 70rpx;
-			width: 70rpx;
-			line-height: 74rpx;
-			font-size: 60rpx;
 		}
 
 		// position: relative;
@@ -210,9 +250,11 @@
 		}
 
 		.hclist {
-			height: 30vh;
+			height: 40vh;
 			overflow-x: hidden;
 			overflow-y: auto;
+			background: #fff;
+			padding: 10rpx;
 
 
 		}
@@ -220,9 +262,25 @@
 		.btns {
 			width: 100%;
 			position: absolute;
-			bottom: 200rpx;
+			bottom: 20rpx;
 			display: flex;
 		}
 
 	}
+</style>
+<style scoped lang="scss">
+	@import "./tabs.scss";
+
+	.menu-list {
+		margin: 0;
+	}
+
+	.custom-image-box {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: space-between;
+		align-items: center;
+	}
 </style>

pages/index/common/hcList.vue

@@ -3,15 +3,26 @@
 		<view class="title">当前监测图斑外业举证</view>
 		<view class="search">
 			<uni-easyinput v-model="queryParams.dkbh" placeholder="请输入图斑编号查询" />
-			<van-icon name="wap-nav" @click="returnCount" />
+			<uni-icons type="bars" size="30" @click="returnCount"></uni-icons>
 		</view>
 		<view>
-			<van-sticky :offset-top="-10">
+			<scroll-view class="top-menu-view" scroll-x="true" >
+				<view class="menu-topic-view" v-for="(item, key) in tabOptions" :id="'tabNum'+key" :key="key"
+					@click="tabclick(item.stepState)">
+					<view :class="queryParams.stepState==item.stepState ? 'menu-topic-act' : 'menu-topic'">
+						<text class="menu-topic-text">{{item.name}}({{hccount[item.prop]}})</text>
+						<view class="menu-topic-bottom">
+							<view class="menu-topic-bottom-color"></view>
+						</view>
+					</view>
+				</view>
+			</scroll-view>
+			<!-- <van-sticky :offset-top="-10">
 				<van-tabs sticky v-model="queryParams.stepState" @click="tabclick" class="tabs">
 					<van-tab v-for="(item, key) in tabOptions" :key="key" :name="item.stepState"
 						:title="`${item.name}(${hccount[item.prop]})`"></van-tab>
 				</van-tabs>
-			</van-sticky>
+			</van-sticky> -->
 			<van-list class="hclist" v-model="loading" :finished="finished" :immediate-check="false" :error.sync="error"
 				error-text="请求失败，点击重新加载" finished-text="没有更多了~" @load="loadList" @refresh="onRefresh">
 				<view class="list-item" v-for="(item, key) in pcsjList" :key="key" @click="goDetail(item)">
@@ -67,7 +78,8 @@
 			returnCount() {
 				this.$emit('returnCount')
 			},
-			tabclick() {
+			tabclick(stepState) {
+				if (stepState != undefined) this.queryParams.stepState = stepState
 				this.queryParams.pageNum = 1;
 				this.pcsjList = [];
 				this.getList();
@@ -144,11 +156,6 @@
 				margin-right: 20rpx;
 			}
 
-			.van-icon {
-				display: inline-block;
-				line-height: 74rpx;
-				font-size: 60rpx;
-			}
 		}
 
 		.tabs {
@@ -174,4 +181,7 @@
 			}
 		}
 	}
+</style>
+<style scoped lang="scss">
+	@import "./tabs.scss"
 </style>