style：详情页面高度统一

common/chart/circle_chart.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="charts-box" :style="[{width},{height},]">
-		<qiun-data-charts :canvas2d='isCanvas2d' :canvasId='canvasId' type="arcbar" :opts="opts"
-			:chartData="chartData" />
+		<qiun-data-charts :canvas2d='isCanvas2d' :canvasId='canvasId' type="arcbar" :errorMessage="errorMessage"
+			:errorReload="false" :opts="opts" :chartData="chartData" />
 
 	</view>
 </template>
@@ -23,13 +23,14 @@
 			},
 			bgColor: {
 				type: String,
-				default: ()=>{
-          return '#0FB160'
-        }
+				default: () => {
+					return '#0FB160'
+				}
 			},
 		},
 		data() {
 			return {
+				errorMessage: '',
 				isCanvas2d: process.uniEnv.isCanvas2d,
 				chartData: {},
 				//这里的 opts 是图表类型 type="arcbar" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['arcbar'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
@@ -110,14 +111,14 @@
 							data: data
 						}]
 					};
-					this.chartData = JSON.parse(JSON.stringify(res));
+					// this.chartData = JSON.parse(JSON.stringify(res));
+					this.chartData = {};
+					this.errorMessage = '暂无数据'
 				}, 100)
-
-			}
-
+			},
 		}
 	};
 </script>
 
 <style scoped>
-</style>
+</style>

common/chart/peak_chart.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="charts-box">
 		<qiun-data-charts :canvas2d='isCanvas2d' :canvasId='canvasId' type="mount" :ontouch="true" :opts="opts"
-			:chartData="chartData" />
+			:chartData="chartData" :errorMessage="errorMessage" :errorReload="false" />
 	</view>
 </template>
 
@@ -17,6 +17,7 @@
 			return {
 				isCanvas2d: process.uniEnv.isCanvas2d,
 				chartData: {},
+				errorMessage: '',
 				//这里的 opts 是图表类型 type="mount" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['mount'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
 				opts: {
 					timing: "easeIn",
@@ -184,9 +185,11 @@
 							data: data
 						}]
 					};
-					this.chartData = JSON.parse(JSON.stringify(res));
+					// this.chartData = JSON.parse(JSON.stringify(res));
+					this.chartData = {};
+					this.errorMessage = '暂无数据'
 				}, 100);
-			}
+			},
 		}
 	};
 </script>

common/task/task_ima_tab.vue

@@ -1,10 +1,10 @@
 <template>
-  <view class="m-lr20 r-20">
-    <k-tabs-swiper class="r-20" v-model="current" :tabs="navList" :field="'name'"   bgColor="#fff" color="#444444"
-                   activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"
-                   @change="changeTab" paddingItem="0 50rpx">
-    </k-tabs-swiper>
-  </view>
+	<view class="m-lr20 r-20">
+		<k-tabs-swiper class="r-20" v-model="current" :tabs="navList" :field="'name'" bgColor="#fff" color="#444444"
+			activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"
+			@change="changeTab" paddingItem="0 50rpx">
+		</k-tabs-swiper>
+	</view>
 </template>
 
 <script>
@@ -14,80 +14,83 @@
 
 	export default {
 		name: 'task-ima-tab',
-    props:{
-      listType:{
-        default:0
-      },
-      numType:{
-        default:0
-      }
-    },
+		props: {
+			listType: {
+				default: 0
+			},
+			numType: {
+				default: 0
+			}
+		},
 		data() {
 			return {
 				current: 0,
 
 				navList: [{
-          id: 0,
-          name: '全部',
-          product_name: '全部',
-          icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-all.png',
-          num:0
+					id: 0,
+					name: '全部',
+					product_name: '全部',
+					icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-all.png',
+					num: 0
 				}],
-        typeList:[
-          {
-            id: 2,
-            name: '垫资还款',
-            icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-refund.png'
-          },
-          {
-            id: 1,
-            name: '房抵业务',
-            icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-loan.png'
-          },
-          {
-            id: 3,
-            name: '消费金融',
-            icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-financial.png'
-          },
-          {
-            id: 4,
-            name: '其他服务',
-            icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-else.png'
-          }
-        ]
+				typeList: [{
+						id: 2,
+						name: '垫资还款',
+						icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-refund.png'
+					},
+					{
+						id: 1,
+						name: '房抵业务',
+						icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-loan.png'
+					},
+					{
+						id: 3,
+						name: '消费金融',
+						icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-financial.png'
+					},
+					{
+						id: 4,
+						name: '其他服务',
+						icon: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-else.png'
+					}
+				]
 			}
 		},
-    watch:{
+		watch: {
 
-    },
+		},
 		mounted() {
-      if(this.listType===1){
-        this.navList=this.typeList
-      }else {
-        this.getTaskType()
-      }
+			if (this.listType === 1) {
+				this.navList = this.typeList
+			} else {
+				this.getTaskType()
+			}
 
 		},
 		methods: {
-      getTaskType() {
-        getTaskType({'numType':this.numType,'listType':this.listType}).then(res => {
-          if (res.code === 1) {
-            res.data.forEach(item=>{
-              this.navList[0].num+=item.num
-              if(this.numType>0){
-                item.name=item.product_name+'('+item.num+')'
-                this.navList[0].name=this.navList[0].product_name+'('+ this.navList[0].num+')'
-              }else {
-                item.name=item.product_name
-              }
-              this.navList.push(item)
-            })
-          }
-        })
-      },
+			getTaskType() {
+				getTaskType({
+					'numType': this.numType,
+					'listType': this.listType
+				}).then(res => {
+					if (res.code === 1) {
+						res.data.forEach(item => {
+							this.navList[0].num += item.num
+							if (this.numType > 0) {
+								item.name = item.product_name + '(' + item.num + ')'
+								this.navList[0].name = this.navList[0].product_name + '(' + this.navList[0]
+									.num + ')'
+							} else {
+								item.name = item.product_name
+							}
+							this.navList.push(item)
+						})
+					}
+				})
+			},
 
-      changeTab(current) {
-        this.$emit('setProductId', this.navList[current].id)
+			changeTab(current) {
+				this.$emit('setProductId', this.navList[current].id)
 			},
 		}
 	}
@@ -95,4 +98,4 @@
 
 <style lang="scss" scoped>
 
-</style>
+</style>

components/en-utils/en-nav/en-nav.vue

@@ -2,11 +2,13 @@
 	<view class="top-nav-bg" :style="{'background-image':`url(${bgList[genre].bg_path})`}">
 		<view class="header" style="z-index: 3;" :style="[{color},{height},{paddingTop},{justifyContent:justify}]">
 			<view class="left" :style="[{color},{paddingTop}]" v-if="back" @click="onBack">
-				<image class="back" src="https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/tabBar/nav-back.png"></image>
+				<image class="back"
+					src="https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/tabBar/nav-back.png"></image>
 			</view>
 			<view class="title row center" :style="[{marginLeft:justify == 'left'?'30rpx':0},{fontSize}]">
-				<image class="wh-36 m-r20" src="https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/statistics/stat-calendar.png" mode="aspectFill"
-					v-if="is_icons">
+				<image class="wh-36 m-r20"
+					src="https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/statistics/stat-calendar.png"
+					mode="aspectFill" v-if="is_icons">
 				</image>
 				<text>{{title}}</text>
 			</view>
@@ -53,7 +55,7 @@
 					nav_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/statistics/statistics-bg2.png'
 				}, {
 					bg_path: '',
-					nav_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png'
+					nav_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/jb-bj.jpg'
 				}],
 			}
 		},
@@ -193,4 +195,4 @@
 	.nav-bg2 {
 		background-image: url("https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/index/index-bg.png?imageMogr2/quality/20");
 	}
-</style>
+</style>

page_task/credit/credit.vue

@@ -1,163 +1,163 @@
 <template>
-  <view class="text-color-333" style="position: relative;left: -15rpx;">
-    <view class="property content p-30 sys-background-fff r-30">
-      <view  class=" size-26">
-        <!-- 房产信息 -->
-        <view  class="">
-          <view class="row-c">
-            <view class="dot"></view>
-            <text class="sys-weight-600 m-l10">征信信息</text>
-          </view>
-          <view class="property-box-one r-20 m-t30 p-20">
-
-            <view class="sys-from-background-color m-t20 p-20 r-20">
-              <view class="m-b20">征信照片</view>
-              <view class="row-c">
-                <!--									<image class="picture m-r20 r-10" :src="property.data.certificate_img"-->
-                <!--										mode="aspectFill">-->
-                <!--									</image>-->
-                <en-image @onShowImg="onPreviewImage" :img="creditData.credit_img"></en-image>
-              </view>
-            </view>
-          </view>
-        </view>
-
-
-
-      </view>
-
-    </view>
-  </view>
+	<view class="text-color-333" style="position: relative;left: -15rpx;">
+		<view class="property content p-30 sys-background-fff r-30" :style="{height}">
+			<view class=" size-26">
+				<!-- 房产信息 -->
+				<view class="">
+					<view class="row-c">
+						<view class="dot"></view>
+						<text class="sys-weight-600 m-l10">征信信息</text>
+					</view>
+					<view class="property-box-one r-20 m-t30 p-20">
+
+						<view class="sys-from-background-color m-t20 p-20 r-20">
+							<view class="m-b20">征信照片</view>
+							<view class="row-c">
+								<!--									<image class="picture m-r20 r-10" :src="property.data.certificate_img"-->
+								<!--										mode="aspectFill">-->
+								<!--									</image>-->
+								<en-image @onShowImg="onPreviewImage" :img="creditData.credit_img"></en-image>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
 
 <script>
-import EnImage from "@/components/en-utils/en-image/en-image.vue";
-import EnBlank from "@/components/en-utils/en-blank/en-blank.vue";
-
-export default {
-  name:'credit-list',
-  components: {
-    EnBlank,
-    EnImage
-  },
-  props: {
-    creditData: {
-      default: {
-        'credit_img':[]
-      }
-    },
-    creditKey: {
-      default: []
-    }
-  },
-  data() {
-    return {}
-  },
-  methods: {
-    onPreviewImage(url) {
-      this.$emit('onShowImg', url)
-    },
-    verifyKey(key) {
-      return this.creditKey.indexOf(key) >= 0
-    }
-  },
-}
+	import EnImage from "@/components/en-utils/en-image/en-image.vue";
+	import EnBlank from "@/components/en-utils/en-blank/en-blank.vue";
+
+	export default {
+		name: 'credit-list',
+		components: {
+			EnBlank,
+			EnImage
+		},
+		props: {
+			height: {
+				type: String,
+				default: '100%'
+			},
+			creditData: {
+				default: {
+					'credit_img': []
+				}
+			},
+			creditKey: {
+				default: []
+			}
+		},
+		data() {
+			return {}
+		},
+		methods: {
+			onPreviewImage(url) {
+				this.$emit('onShowImg', url)
+			},
+			verifyKey(key) {
+				return this.creditKey.indexOf(key) >= 0
+			}
+		},
+	}
 </script>
 
 <style lang="scss" scoped>
-.property {
-  padding-top: 90rpx;
-  background-image: url('/page_task/static/img/task-details/bg-four.png');
-  background-repeat: no-repeat;
-  background-size: 100% auto;
-
-
-  .bg-box {
-    width: 710rpx;
-    height: 80rpx;
-  }
-
-  .dot {
-    width: 12rpx;
-    height: 12rpx;
-    border-radius: 50%;
-    background: #0FB160;
-  }
-}
-
-.property-box-one {
-  position: relative;
-  background: linear-gradient(161deg, #B0FDB3 0%, #5EDE9D 100%);
-
-}
-
-.property-box-two {
-  position: relative;
-  background: linear-gradient(161deg, #FFE2E2 0%, #FBCACA 100%);
-
-  .two-text {
-    background: #D06565;
-  }
-
-  .picture {
-    width: 160rpx;
-    height: 190rpx;
-    display: block;
-  }
-}
-
-.property-box-three {
-  position: relative;
-  background: linear-gradient(161deg, #CDE7FD 0%, #B6D2FB 100%);
-
-  .two-text {
-    background: #2E86F4;
-  }
-
-  .picture {
-    width: 160rpx;
-    height: 90rpx;
-    display: block;
-    border-radius: 10rpx;
-  }
-}
-
-.property-box-four {
-  position: relative;
-  background: linear-gradient(161deg, #F4DCBD 0%, #EEC398 100%);
-
-  .two-text {
-    background: #C37929;
-  }
-
-  .picture {
-    width: 160rpx;
-    height: 90rpx;
-    display: block;
-    border-radius: 10rpx;
-  }
-}
-
-.property-icon {
-  position: absolute;
-  right: 40rpx;
-  top: 12rpx;
-}
-
-.capsule {
-  color: #fff;
-  height: 50rpx;
-  line-height: 50rpx;
-  border-radius: 99rpx;
-  background: #0FB160;
-  text-align: center;
-  padding: 0 20rpx;
-  margin-right: 10rpx;
-}
-
-.card {
-  width: 160rpx;
-  height: 90rpx;
-  display: block;
-}
+	.property {
+		padding-top: 90rpx;
+		background-image: url('/page_task/static/img/task-details/bg-four.png');
+		background-repeat: no-repeat;
+		background-size: 100% auto;
+		overflow: hidden;
+
+		.bg-box {
+			width: 710rpx;
+			height: 80rpx;
+		}
+
+		.dot {
+			width: 12rpx;
+			height: 12rpx;
+			border-radius: 50%;
+			background: #0FB160;
+		}
+	}
+
+	.property-box-one {
+		position: relative;
+		background: linear-gradient(161deg, #B0FDB3 0%, #5EDE9D 100%);
+
+	}
+
+	.property-box-two {
+		position: relative;
+		background: linear-gradient(161deg, #FFE2E2 0%, #FBCACA 100%);
+
+		.two-text {
+			background: #D06565;
+		}
+
+		.picture {
+			width: 160rpx;
+			height: 190rpx;
+			display: block;
+		}
+	}
+
+	.property-box-three {
+		position: relative;
+		background: linear-gradient(161deg, #CDE7FD 0%, #B6D2FB 100%);
+
+		.two-text {
+			background: #2E86F4;
+		}
+
+		.picture {
+			width: 160rpx;
+			height: 90rpx;
+			display: block;
+			border-radius: 10rpx;
+		}
+	}
+
+	.property-box-four {
+		position: relative;
+		background: linear-gradient(161deg, #F4DCBD 0%, #EEC398 100%);
+
+		.two-text {
+			background: #C37929;
+		}
+
+		.picture {
+			width: 160rpx;
+			height: 90rpx;
+			display: block;
+			border-radius: 10rpx;
+		}
+	}
+
+	.property-icon {
+		position: absolute;
+		right: 40rpx;
+		top: 12rpx;
+	}
+
+	.capsule {
+		color: #fff;
+		height: 50rpx;
+		line-height: 50rpx;
+		border-radius: 99rpx;
+		background: #0FB160;
+		text-align: center;
+		padding: 0 20rpx;
+		margin-right: 10rpx;
+	}
+
+	.card {
+		width: 160rpx;
+		height: 90rpx;
+		display: block;
+	}
 </style>

page_task/task_details/module/apply.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="text-color-333" style="position: relative;left: -15rpx;">
-		<view class="content p-30 sys-background-fff r-30 size-26 apply">
+		<view class="content p-30 sys-background-fff r-30 size-26 apply" :style="{height}">
 			<view class="">
 				<view class="row-c">
 					<view class="dot"></view>
@@ -120,6 +120,10 @@
 <script>
 	export default {
 		props: {
+			height: {
+				type: String,
+				default: '100%'
+			},
 			applyFor: {
 				default: {}
 			},
@@ -158,6 +162,7 @@
 		background-image: url('/page_task/static/img/task-details/bg-two.png');
 		background-repeat: no-repeat;
 		background-size: 100% auto;
+		overflow: hidden;
 
 		.bg-box {
 			width: 710rpx;

page_task/task_details/module/identity.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="text-color-12 " style="position: relative;left: -15rpx;">
-		<view class="content p-30 sys-background-fff r-30 identity">
+		<view class="content p-30 sys-background-fff r-30 identity" :style="{height}">
 			<view class="row-c">
 				<view class="dot"></view>
 				<text class="size-26 sys-weight-600 m-l10">基本信息</text>
@@ -14,7 +14,8 @@
 					</view>
 				</view>
 				<view class="row-c m-t20" v-if="verifyKey('identity_one')">
-					<en-image @onShowImg="onPreviewImage" :img="[business.identity_one,business.identity_two]"></en-image>
+					<en-image @onShowImg="onPreviewImage"
+						:img="[business.identity_one,business.identity_two]"></en-image>
 				</view>
 				<view class="row-c m-b20" v-if="verifyKey('id_number')">
 					<image class="wh-30 m-r20" src="/page_task/static/img/task-details/number.png" mode="aspectFill">
@@ -78,13 +79,15 @@
 					<view class="size-24 text-color-333 m-b20" v-if="verifyKey('marriage_type')">
 						{{business.marriage_name}}
 					</view>
-					<en-image @onShowImg="onPreviewImage" v-if="business.marriage_type>1" :img=" business.marriage_img"></en-image>
+					<en-image @onShowImg="onPreviewImage" v-if="business.marriage_type>1"
+						:img=" business.marriage_img"></en-image>
 					<view v-if="business.marriage_type===2">
 						<view class="spouse p-l20">
 							<text class="size-24">配偶信息</text>
 						</view>
 						<view class="row-c m-t20" v-if="verifyKey('m_identity_one')">
-							<en-image @onShowImg="onPreviewImage" :img="[business.m_identity_one,business.m_identity_two]"></en-image>
+							<en-image @onShowImg="onPreviewImage"
+								:img="[business.m_identity_one,business.m_identity_two]"></en-image>
 						</view>
 						<view class="">
 							<text class="size-26 sys-weight-600"
@@ -154,6 +157,10 @@
 
 	export default {
 		props: {
+			height: {
+				type: String,
+				default: '100%'
+			},
 			business: {
 				default: {}
 			},
@@ -174,9 +181,9 @@
 			return {}
 		},
 		methods: {
-      onPreviewImage(url){
-        this.$emit('onShowImg',url)
-      },
+			onPreviewImage(url) {
+				this.$emit('onShowImg', url)
+			},
 			verifyKey(key, type) {
 				if (type !== 2) {
 					return this.clientKey.indexOf(key) >= 0
@@ -195,6 +202,7 @@
 		background-image: url('/page_task/static/img/task-details/bg-one.png');
 		background-repeat: no-repeat;
 		background-size: 100% auto;
+		overflow: hidden;
 
 		.bg-box {
 			width: 710rpx;

page_task/task_details/module/property.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="text-color-333" style="position: relative;left: -15rpx;">
-		<view class="property content p-30 sys-background-fff r-30">
+		<view class="property content p-30 sys-background-fff r-30" :style="{height}">
 			<view v-for="(property,propertyKey) in propertyList" class=" size-26">
 				<!-- 房产信息 -->
 				<view v-if="property.property_type===1" class="">
@@ -48,7 +48,8 @@
 									<!--									<image class="picture m-r20 r-10" :src="property.data.certificate_img"-->
 									<!--										mode="aspectFill">-->
 									<!--									</image>-->
-									<en-image @onShowImg="onPreviewImage" :img="property.data.certificate_img"></en-image>
+									<en-image @onShowImg="onPreviewImage"
+										:img="property.data.certificate_img"></en-image>
 								</view>
 							</view>
 							<view class="sys-from-background-color m-t20 p-20 r-20"
@@ -136,18 +137,21 @@
 								<view class="row-c" v-if="verifyKey('register_img')">
 									<view class="">
 										<text class="size-24">行驶证</text>
-										<en-image @onShowImg="onPreviewImage" :img="property.data.register_img"></en-image>
+										<en-image @onShowImg="onPreviewImage"
+											:img="property.data.register_img"></en-image>
 									</view>
 									<view class="m-l20" v-if="verifyKey('driving_img')">
 										<text class="size-24">车辆登记证</text>
-										<en-image  @onShowImg="onPreviewImage":img="property.data.driving_img"></en-image>
+										<en-image @onShowImg="onPreviewImage"
+											:img="property.data.driving_img"></en-image>
 									</view>
 								</view>
 								<view class="row-c" v-if="verifyKey('car_img')">
 									<view class="">
 										<view class="size-24 m-t20">车辆照片</view>
 										<view class="row-c m-t10" style="flex-wrap: wrap;">
-											<en-image @onShowImg="onPreviewImage" :img="property.data.car_img"></en-image>
+											<en-image @onShowImg="onPreviewImage"
+												:img="property.data.car_img"></en-image>
 										</view>
 									</view>
 								</view>
@@ -225,6 +229,10 @@
 			EnImage
 		},
 		props: {
+			height: {
+				type: String,
+				default: '100%'
+			},
 			propertyList: {
 				default: []
 			},
@@ -236,9 +244,9 @@
 			return {}
 		},
 		methods: {
-      onPreviewImage(url){
-        this.$emit('onShowImg',url)
-      },
+			onPreviewImage(url) {
+				this.$emit('onShowImg', url)
+			},
 			verifyKey(key) {
 				return this.propertyKey.indexOf(key) >= 0
 			}
@@ -252,7 +260,7 @@
 		background-image: url('/page_task/static/img/task-details/bg-four.png');
 		background-repeat: no-repeat;
 		background-size: 100% auto;
-
+		overflow: hidden;
 
 		.bg-box {
 			width: 710rpx;

page_task/task_details/module/third_party.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="text-color-333" style="position: relative;left: -15rpx;">
-		<view class="apply content p-30 sys-background-fff r-30">
+		<view class="apply content p-30 sys-background-fff r-30" :style="{height}">
 			<view class="size-26" v-for="(item,index) in tripartite">
 				<view class="">
 					<view class="row-c">
@@ -20,7 +20,8 @@
 							</view>
 						</view>
 						<view class="row-c m-t20" v-if="verifyKey('identity_one')">
-							<EnImage @onShowImg="onPreviewImage" :list="[item.identity_one,item.identity_two]"></EnImage>
+							<EnImage @onShowImg="onPreviewImage" :list="[item.identity_one,item.identity_two]">
+							</EnImage>
 						</view>
 					</view>
 					<!-- 担保类型 -->
@@ -37,7 +38,8 @@
 							<text class="text-color-666">营业执照编号</text>
 							<text class="m-l16">{{item.id_number}}</text>
 						</view>
-						<EnImage @onShowImg="onPreviewImage" v-if="verifyKey('identity_one')" :list="[item.identity_one]"></EnImage>
+						<EnImage @onShowImg="onPreviewImage" v-if="verifyKey('identity_one')"
+							:list="[item.identity_one]"></EnImage>
 					</view>
 				</view>
 				<view class="m-t20 color-4A2600">
@@ -69,6 +71,10 @@
 			EnImage
 		},
 		props: {
+			height: {
+				type: String,
+				default: '100%'
+			},
 			tripartite: {
 				default: []
 			},
@@ -80,9 +86,9 @@
 			return {}
 		},
 		methods: {
-      onPreviewImage(url){
-        this.$emit('onShowImg',url)
-      },
+			onPreviewImage(url) {
+				this.$emit('onShowImg', url)
+			},
 			verifyKey(key) {
 				return this.tripartiteKey.indexOf(key) >= 0
 			}
@@ -96,6 +102,7 @@
 		background-image: url('/page_task/static/img/task-details/bg-three.png');
 		background-repeat: no-repeat;
 		background-size: 100% auto;
+		overflow: hidden;
 
 		.bg-box {
 			width: 710rpx;

page_task/task_details/task_details.vue

@@ -7,7 +7,8 @@
 					</image>
 					<view class="detail-content">
 						<view class="row-c m-l10 m-t16 m-b20 text-color-fff">
-							<image class="wh-45 r-circle" src="/page_task/static/img/task-details/head.png" mode="aspectFill">
+							<image class="wh-45 r-circle" src="/page_task/static/img/task-details/head.png"
+								mode="aspectFill">
 							</image>
 							<text class="size-28 m-lr16">{{business.name}}</text>
 							<view class="size-24 row-c sys-bg-007038 r-100 p-lr16 p-tb6">
@@ -45,25 +46,33 @@
 		<view class="sys-list-background-color task-tabs-width page-env-160"
 			:style="{top:`${$tools.topHeight()+fixedHeight}px`}">
 			<view class="m-t20">
-				<z-swiper ref="zSwiper" v-model="list" :options="options" v-if="current === 1">
+				<z-swiper ref="zSwiper" v-model="list" :options="options" v-if="current === 1" @slideChange="onSwiper">
 					<z-swiper-item>
-						<Identity :business="business" :linkman="linkman" :client-key="clientKey" @onShowImg="onShowImg"
-							:linkman-key="linkmanKey"></Identity>
+						<Identity ref="identity" class="identity" :height="`${maxHeight-60}px`" :business="business"
+							:linkman="linkman" :client-key="clientKey" @onShowImg="onShowImg" :linkman-key="linkmanKey">
+						</Identity>
 					</z-swiper-item>
 					<z-swiper-item v-show="product.product_types.indexOf('3')>=0">
-						<Apply :apply-for="applyFor" :applies-key="appliesKey" @onShowImg="onShowImg"></Apply>
+						<Apply class="apply" :height="`${maxHeight-60}px`" :apply-for="applyFor"
+							:applies-key="appliesKey" @onShowImg="onShowImg">
+						</Apply>
 					</z-swiper-item>
 					<z-swiper-item v-show="product.product_types.indexOf('4')>=0">
-						<ThirdParty :tripartite="tripartite" :tripartite-key="tripartiteKey" @onShowImg="onShowImg"></ThirdParty>
+						<ThirdParty class="third_party" :height="`${maxHeight-60}px`" :tripartite="tripartite"
+							:tripartite-key="tripartiteKey" @onShowImg="onShowImg">
+						</ThirdParty>
 					</z-swiper-item>
 				</z-swiper>
 				<view class="" v-if="current === 2">
-					<z-swiper v-model="lists" :options="options">
+					<z-swiper v-model="lists" :options="options" @slideChange="onCreditSwiper">
 						<z-swiper-item>
-							<Property :property-list="propertyList" :property-key="propertyKey" @onShowImg="onShowImg"></Property>
+							<Property class="property" :height="`${creditHeight-60}px`" :property-list="propertyList"
+								:property-key="propertyKey" @onShowImg="onShowImg">
+							</Property>
 						</z-swiper-item>
 						<z-swiper-item>
-							<credit-list :credit-data="credit" :credit-key="creditKey" @onShowImg="onShowImg"></credit-list>
+							<credit-list class="credit_list" :height="`${creditHeight-60}px`" :credit-data="credit"
+								:credit-key="creditKey" @onShowImg="onShowImg"></credit-list>
 						</z-swiper-item>
 					</z-swiper>
 				</view>
@@ -122,11 +131,11 @@
 		takeTask
 	} from "@/api/task";
 	import EnSelect from "@/components/en-utils/en-select/en-select.vue";
-  import CreditList from "@/page_task/credit/credit.vue";
+	import CreditList from "@/page_task/credit/credit.vue";
 
 	export default {
 		components: {
-      CreditList,
+			CreditList,
 			EnSelect,
 			TaskTab,
 			Identity,
@@ -139,13 +148,13 @@
 		data() {
 			return {
 				current: 1,
-				fixedHeight: 195,
+				fixedHeight: 200,
 				options: {
-					autoHeight: true,
+					// autoHeight: true,
 					slidesPerView: 1.1,
 					centeredSlides: true,
 					spaceBetween: 10,
-          effect: 'cards'
+					effect: 'cards'
 				},
 				list: [1, 2, 3],
 				lists: [1, 2],
@@ -156,7 +165,7 @@
 					type_data: []
 				},
 				business: {
-          id:0,
+					id: 0,
 					status: 0,
 					phone: '',
 					identity_one: '',
@@ -199,6 +208,13 @@
 				tripartiteKey: [],
 				linkmanKey: [],
 				creditKey: [],
+				identityHeight: 0,
+				thirdPartHeight: 0,
+				applyHeight: 0,
+				propertyHeight: 0,
+				creditListHeight: 0,
+				maxHeight: '100%',
+				creditHeight: '100%',
 			}
 		},
 		onLoad(data) {
@@ -215,16 +231,16 @@
 			}
 		},
 		methods: {
-      onShowImg(item) {
-        if (this.businessFile.imgList.length < 0) {
-          this.businessFile.imgList.push(item)
-        }
-        // 预览图片
-        uni.previewImage({
-          current: item,
-          urls: this.businessFile.imgList,
-        });
-      },
+			onShowImg(item) {
+				if (this.businessFile.imgList.length < 0) {
+					this.businessFile.imgList.push(item)
+				}
+				// 预览图片
+				uni.previewImage({
+					current: item,
+					urls: this.businessFile.imgList,
+				});
+			},
 			auditTask(auditType) {
 				uni.navigateTo({
 					url: '/page_task/task_operate/task_operate?businessId=' + this.business.id +
@@ -365,6 +381,7 @@
 					this.businessFile = res.data.businessFile
 					this.$refs.recordObj.startData()
 					this.$refs.zSwiper.swiper
+					this.getDetailsHeight()
 					this.setShowKey()
 				} else {
 					tools.leftClick()
@@ -394,9 +411,116 @@
 					}
 				})
 			},
-
+			// 获取详情高度Swiper
+			getDetailsHeight() {
+				this.maxHeight = '100%'
+				this.$nextTick(() => {
+					const query = uni.createSelectorQuery().in(this);
+					setTimeout(() => {
+						query.select('.identity').boundingClientRect(data => {
+							if (data) {
+								this.maxHeight = data.height
+								console.log(this.maxHeight);
+								uni.pageScrollTo({
+									scrollTop: 0,
+									duration: 300
+								});
+							}
+						}).exec();
+					}, 200)
+				})
+			},
+			// 获取详情高度Swiper
+			onSwiper(swiper, index) {
+				this.maxHeight = '100%'
+				const query = uni.createSelectorQuery().in(this);
+				this.$nextTick(() => {
+					setTimeout(() => {
+						if (index == 0) {
+							query.select('.identity').boundingClientRect(data => {
+								if (data) {
+									this.maxHeight = data.height
+								}
+							}).exec();
+						}
+						if (index == 1) {
+							query.select('.apply').boundingClientRect(data => {
+								if (data) {
+									this.maxHeight = data.height
+								}
+							}).exec();
+						}
+						if (index == 2) {
+							query.select('.third_party').boundingClientRect(data => {
+								if (data) {
+									this.maxHeight = data.height
+								}
+							}).exec();
+						}
+						uni.pageScrollTo({
+							scrollTop: 0,
+							duration: 300
+						});
+					}, 200)
+				})
+			},
+			// 征信高度Swiper
+			onCreditHeight() {
+				this.creditHeight = '100%'
+				this.$nextTick(() => {
+					const query = uni.createSelectorQuery().in(this);
+					setTimeout(() => {
+						query.select('.property').boundingClientRect(data => {
+							if (data) {
+								this.creditHeight = data.height
+								uni.pageScrollTo({
+									scrollTop: 0,
+									duration: 300
+								});
+							}
+						}).exec();
+					}, 200)
+				})
+			},
+			// 征信高度Swiper
+			onCreditSwiper(swiper, index) {
+				this.creditHeight = '100%'
+				const query = uni.createSelectorQuery().in(this);
+				this.$nextTick(() => {
+					setTimeout(() => {
+						if (index == 0) {
+							query.select('.property').boundingClientRect(data => {
+								if (data) {
+									this.creditHeight = data.height
+								}
+							}).exec();
+						}
+						if (index == 1) {
+							query.select('.credit_list').boundingClientRect(data => {
+								if (data) {
+									this.creditHeight = data.height
+								}
+							}).exec();
+						}
+						uni.pageScrollTo({
+							scrollTop: 0,
+							duration: 300
+						});
+					}, 200)
+				})
+			},
 			onChange(current) {
+				if (current == 1) {
+					this.getDetailsHeight()
+				}
+				if (current == 2) {
+					this.onCreditHeight()
+				}
 				this.current = current
+				uni.pageScrollTo({
+					scrollTop: 0,
+					duration: 300
+				});
 			},
 			onSubmit() {
 				uni.navigateTo({