perf(process,process/detail):流程列表页，流程详情页适老化优化

components/ygoa/processList.vue

@@ -36,7 +36,7 @@
 								</template>
 								<view class="process_contant">
 									<uni-row>
-										<uni-col :xs="19" :sm="19">
+										<uni-col :xs="process.isCancel == '1'?18:24" :sm="process.isCancel == '1'?19:24">
 											<view v-if="process.tmodelName == undefined">
 												<uni-row>
 													<uni-col :xs="8" :sm="7">流程类型:</uni-col>
@@ -62,10 +62,12 @@
 												</uni-row>
 											</view>
 										</uni-col>
-										<uni-col :xs="5" :sm="5" v-if="process.isCancel == '1'">
+										<uni-col :xs="6" :sm="5" v-if="process.isCancel == '1'">
 											<uni-row>
-												<button type="warn" size="mini"
-													@click.stop.prevent="handleToCancel(process)">撤回</button>
+												<view class="button_container">
+													<button type="warn" size="mini"
+														@click.stop.prevent="handleToCancel(process)">撤回</button>
+												</view>
 											</uni-row>
 										</uni-col>
 									</uni-row>

pages/process/detail/index.vue

@@ -1,4 +1,5 @@
 <template>
+	<page-meta root-font-size="system"/>
 	<view class="process_detail_container">
 		<uni-card>
 			<view class="main_container">
@@ -18,14 +19,13 @@
 										v-model="elem.defaultValue" type="text"></uni-easyinput>
 									<!-- 审批签字板 -->
 									<view v-else-if="'13' == elem.type">
-										<button v-if="elem.defaultValue == ''" type="primary"
-											@click="handleSignature(index)">签名</button>
+										<button v-if="elem.defaultValue == ''" type="primary" @click="handleSignature(index)">签名</button>
 										<view v-else class="signature_img">
-											<img style="width: 100%;" mode="widthFix" @click="handleSignature(index)" :src="elem.defaultValueImg" :alt="elem.elementName + '签名'" />
+											<img style="width: 100%;" mode="widthFix" @click="handleSignature(index)" :src="config.baseUrlPre + elem.sealImgPath" :alt="elem.elementName + '签名'" />
 										</view>
 									</view>
 								</view>
-								<view v-else-if="typeof elem.defaultValue === 'string' && elem.defaultValue.substring(0, 7) == '/shares'" class="signature_img">
+								<view v-else-if="typeof elem.defaultValue === 'string' &&  elem.defaultValue.substring(0, 7) == '/shares'" class="signature_img">
 									<img style="width: 100%;" mode="widthFix" :src="config.baseUrlPre + elem.defaultValue" />
 								</view>
 								<text class="element_value" v-else>{{ elem.defaultValue }}</text>
@@ -70,6 +70,7 @@
 				<attachment-list :attachments="item.files"></attachment-list>
 			</uni-card>
 		</view>
+		<!-- 流转过程 -->
 		<view>
 			<uni-card>
 				<view class="flow_step_container">
@@ -140,6 +141,7 @@
 		</view>
 	</view>
 	<view style="height: 5px; margin-top: 20px;"></view>
+	<!-- 签字版弹出层 -->
 	<uni-popup ref="signaturePopup" @maskClick="closeSignaturePopup">
 		<view class="signature_container" :class="isLandscape ? ' signature_container_landscape' : ''">
 			<view class="signature_content">
@@ -302,6 +304,7 @@ function initSignature() {
 	}, 100)
 }
 function onclickSignatureButton(event) {
+	console.log('onclickSignatureButton: ',event);
 	switch (event) {
 		case 'undo':
 			signatureRef.value.undo()
@@ -317,24 +320,36 @@ function onclickSignatureButton(event) {
 						$modal.msgError('签名不能为空!')
 						return
 					}
-					wx.getFileSystemManager().readFile({
-						filePath: res.tempFilePath,
-						encoding: 'base64',
-						success: fileData => {
-							const _fileData = 'data:image/png;base64,' + fileData.data
-							uploadSignatureBoardImg(userStore.user.useId, _fileData, formElements.value[signatureItemIndex.value].tableField)
-							// uploadSignatureImg(res.tempFilePath)
-							.then(({returnParams}) => {
-								formElements.value[signatureItemIndex.value].defaultValue = returnParams.sealInsID
-								formElements.value[signatureItemIndex.value].defaultValueImg = returnParams.path
-								signatureItemIndex.value = -1
-								signaturePopupShow.value = false
-								signaturePopup.value.close()
-							})
-						}
-					})
+					// 判断上传文件是否是base64
+					if (res.tempFilePath.substring(0, 'data:image/png;base64,'.length) == 'data:image/png;base64,') {
+						const _fileData = res.tempFilePath
+						uploadSignatureBoardImg(userStore.user.useId, _fileData, formElements.value[signatureItemIndex.value].tableField)
+						.then(({returnParams}) => {
+							formElements.value[signatureItemIndex.value].defaultValue = returnParams.sealInsID
+							formElements.value[signatureItemIndex.value].sealImgPath = returnParams.path
+							signatureItemIndex.value = -1
+							signaturePopupShow.value = false
+							signaturePopup.value.close()
+						})
+					} else {
+						// 转 base64
+						wx.getFileSystemManager().readFile({
+							filePath: res.tempFilePath,
+							encoding: 'base64',
+							success: fileData => {
+								const _fileData = 'data:image/png;base64,' + fileData.data
+								uploadSignatureBoardImg(userStore.user.useId, _fileData, formElements.value[signatureItemIndex.value].tableField)
+								.then(({returnParams}) => {
+									formElements.value[signatureItemIndex.value].defaultValue = returnParams.sealInsID
+									formElements.value[signatureItemIndex.value].sealImgPath = returnParams.path
+									signatureItemIndex.value = -1
+									signaturePopupShow.value = false
+									signaturePopup.value.close()
+								})
+							}
+						})
+					}
 					console.log('formElements', formElements.value[signatureItemIndex.value]);
-					// formElements.value[signatureItemIndex.value].defaultValueImg = res.tempFilePath
 				}
 			} as LSignatureToTempFilePathOptions)
 			break;
@@ -426,8 +441,8 @@ function cancelProcess() {
 }
 </script>
 
-<style lang="scss">
-.uni-section {
+<style lang="scss" scoped>
+::v-deep .uni-section {
 	margin-left: -15px;
 	margin-bottom: 10px;
 }
@@ -480,9 +495,17 @@ function cancelProcess() {
 	.main_container {
 		min-height: 60vh;
 
-		.uni-forms-item__label {
-			font-size: 1rem;
-			font-weight: 600;
+		::v-deep .uni-forms {
+			.uni-forms-item__label {
+				font-size: 1rem !important;
+				font-weight: 600;
+			}
+			.uni-forms-item__content {
+				font-size: calc(14px + .5*(1rem - 16px)) !important;
+				.uni-easyinput__content-input {
+					font-size: calc(14px + .5*(1rem - 16px)) !important;
+				}
+			}
 		}
 
 		.element_value_container {
@@ -496,7 +519,7 @@ function cancelProcess() {
 		}
 	}
 
-	.repeating_table_container {
+	::v-deep .repeating_table_container {
 		width: 98vw;
 
 		.uni-table-scroll {
@@ -515,12 +538,15 @@ function cancelProcess() {
 		}
 	}
 
-	.flow_step_container {
+	::v-deep .flow_step_container {
 		min-height: 200px;
 		
 		.u-steps {
 			.u-steps-item {
 				padding-bottom: 11px;
+				.u-text__value--tips {
+					font-size: calc(12px + .5*(1rem - 16px)) !important;
+				}
 				.redcontent {
 					.u-text__value--content {
 						color: #ff4500;
@@ -559,11 +585,12 @@ function cancelProcess() {
 				margin-top: 0 !important;
 
 				.u-text__value--content {
-					font-size: 16px !important;
+					font-size: calc(16px + .5*(1rem - 16px)) !important;
 				}
 
 				.u-text__value--main {
-					font-size: 16px !important;
+					font-size: calc(16px + .5*(1rem - 16px)) !important;
+					font-weight: 500;
 				}
 			}
 		}
@@ -576,9 +603,11 @@ function cancelProcess() {
 		bottom: 10px;
 	}
 }
-
+::v-deep button {
+	font-size: calc(18px + .5*(1rem - 16px));
+}
 .reject_button {
-	.uni-card {
+	::v-deep .uni-card {
 		background-color: #f5f5f5;
 	}
 }
@@ -586,6 +615,11 @@ function cancelProcess() {
 .remark_container {
 	.remark_content {
 		margin-bottom: 10px;
+		::v-deep .uni-easyinput {
+			.uni-easyinput__content-textarea {
+				font-size:  calc(14px + .5*(1rem - 16px)) !important;
+			}
+		}
 	}
 }
 </style>

pages/process/index.vue

@@ -1,4 +1,5 @@
 <template>
+	<page-meta root-font-size="system"/>
 	<view class="index_container">
 		<view class="search_container">
 			<uni-row>
@@ -10,12 +11,9 @@
 				</uni-col>
 				<uni-col :xs="18" :sm="20">
 					<view class="search_bar">
-						<uni-search-bar placeholder="搜索栏" @confirm="search" @cancel="searchCancel" @blur="searchOnBlur">
+						<uni-search-bar @confirm="search" @cancel="searchCancel" @blur="searchOnBlur" clearButton="none" placeholder="搜索栏">
 							<template v-slot:searchIcon>
-								<uni-icons type="search" size="30"></uni-icons>
-							</template>
-							<template v-slot:clearIcon>
-								<uni-icons type="clear" size="30"></uni-icons>
+								<uni-icons type="search" size="calc(30px + .5*(1rem - 16px))"></uni-icons>
 							</template>
 						</uni-search-bar>
 					</view>
@@ -23,18 +21,15 @@
 			</uni-row>
 		</view>
 		<view class="segmented_control_container">
-			<uni-segmented-control :current="current" :values="items" @clickItem="clickSegmentItem" styleType="text"
-				activeColor="#409eff"></uni-segmented-control>
+			<uni-segmented-control :current="current" :values="items" @clickItem="clickSegmentItem" styleType="text" activeColor="#409eff"></uni-segmented-control>
 		</view>
 		<view class="process_list">
-			<process-list ref="processListRef" @clickCancel="handleToCancelProcess" @clickSegment="getProcessData" @clickItem="handleToProcessDetail" @scrollToBottom="getProcessPage" :current="current" :pSize="5"
-				:pageNo="1"></process-list>
+			<process-list ref="processListRef" @clickCancel="handleToCancelProcess" @clickSegment="getProcessData" @clickItem="handleToProcessDetail" @scrollToBottom="getProcessPage" :current="current" :pSize="5" :pageNo="1"></process-list>
 		</view>
 		<view class="popup_container">
 			<uni-popup ref="searchItemPopup" type="bottom">
 				<uni-list>
-					<uni-list-item @click="clickSearchItem(item)" v-for="(item, index) in candidates" :key="index"
-						clickable :title="item">
+					<uni-list-item @click="clickSearchItem(item)" v-for="(item, index) in candidates" :key="index" clickable :title="item">
 					</uni-list-item>
 				</uni-list>
 			</uni-popup>
@@ -192,19 +187,81 @@ function handleToCancelProcess(process) {
 
 <style lang="scss" scoped>
 @import url("@/static/font/ygoa/iconfont.css");
-.process_list {
-	::v-deep .flow_step_section {
+.search_container {
+	.popup_button_container {
+		display: flex;
+		justify-content: center;
+		margin-left: 5px;
+		height: 36px;
+		line-height: 36px;
+		width: 100%;
+		padding: 8px 10px;
+		background-color: #f5f5f5;
+		text-align: center;
+		font-size: calc(16px + .5*(1rem - 16px));
+		color: #333;
+		.ygoa-icon {
+			font-size: calc(16px + .5*(1rem - 16px));
+		}
+		.button_text {
+			width: 64px;
+			margin-left: 4px;
+		}
+	}
+
+	::v-deep .search_bar {
+		.uni-searchbar {
+			padding-left: 0;
+			.uni-searchbar__box-search-input {
+				font-size: calc(14px + .5*(1rem - 16px)) !important;
+			}
+			.uni-searchbar__cancel {
+				font-size: calc(14px + .5*(1rem - 16px)) !important;
+			}
+		}
+	}
+}
+::v-deep .segmented_control_container {
+	.segmented-control__text {
+		font-size: calc(14px + .5*(1rem - 16px));
+	}
+}
+::v-deep .process_list {
+	.process_contant {
+		font-size: calc(14px + .5*(1rem - 16px));
+		.button_container {
+			button {
+				font-size: calc(13px + .4*(1rem - 16px))
+			}
+		}
+	}
+	
+	.zp-l-text-rpx {
+		font-size: calc(30rpx + .5*(1rem - 16px));
+	}
+	
+	.flow_step_section {
 		 .uni-section .uni-section-header {
 			padding: 5px 10px;
 		}
 	}
 
-	::v-deep .flow_step_container {
+	.flow_step_container {
 		min-height: 60px;
 		margin: 10px 15px;
 		.u-steps {
 			.u-steps-item {
 				padding-bottom: 11px;
+				.u-text__value--content {
+					font-size: calc(13px + .5*(1rem - 16px)) !important;
+				}
+				.u-text__value--main {
+					font-size: calc(13px + .5*(1rem - 16px)) !important;
+					font-weight: 500 !important;
+				}
+				.u-text__value--tips {
+					font-size: calc(12px + .5*(1rem - 16px)) !important;
+				}
 				.redcontent {
 					.u-text__value--content {
 						color: #ff4500;
@@ -245,33 +302,4 @@ function handleToCancelProcess(process) {
 		}
 	}
 }
-
-.search_container {
-	.popup_button_container {
-		display: flex;
-		justify-content: center;
-		margin-left: 5px;
-		height: 36px;
-		line-height: 36px;
-		width: 100%;
-		padding-top: 10px;
-		background-color: #f5f5f5;
-		text-align: center;
-		font-size: 16px;
-		color: #333;
-
-		.button_text {
-			width: 64px;
-			margin-left: 4px;
-		}
-	}
-
-	.search_bar {
-		::v-deep .uni-searchbar {
-			padding-left: 0;
-		}
-	}
-}
-
-.segmented_control_container {}
 </style>