电子结算单

packageElectron/reconciliationDetails/index.vue

@@ -1,8 +1,198 @@
 <template>
+	<view class="container">
+		<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil">
+			<block slot="backText">返回</block>
+			<block slot="content">对账单详情</block>
+		</cu-custom>
+		<view class="body">
+			<view class="borderItem">
+				<text>结算周期：</text>
+				<view>{{detailsData.beginReconciliationTime}}至 {{detailsData.endReconciliationTime}}</view>
+				</view>
+			<view class="borderItem">
+				<text>上期结转金额：</text>{{detailsData.lastBalance}}
+				</view>
+			<view class="borderItem">
+				<text>打款金额：</text>{{detailsData.amount}}
+				</view>
+			<view class="borderItem">
+				<text>消耗体积：</text>{{detailsData.volume}}
+				</view>
+			<view class="borderItem">
+				<text>结算金额：</text>{{detailsData.statementAmount}}
+				</view>
+			<view class="borderItem">
+				<text>余额：</text>{{detailsData.balance}}
+				</view>
+			<view class="borderItem">
+				<text>充值应返返利金额：</text>{{detailsData.rechargeRebateAmount?detailsData.rechargeRebateAmount:0}}
+				</view>
+			<view class="borderItem">
+				<text>充值已返返利金额：</text>{{detailsData.realRechargeRebateAmount?detailsData.realRechargeRebateAmount:0}}
+				</view>
+			<view class="borderItem">
+				<text>消费应返返利金额：</text>{{detailsData.consumeRebateAmount?detailsData.consumeRebateAmount:0}}
+				</view>
+			<view class="borderItem">
+				<text>消费已返返利金额：</text>{{detailsData.realConsumeRebateAmount?detailsData.realConsumeRebateAmount:0}}
+				</view>
+			<view class="borderarea">
+				<view>备注：</view>
+				<view class="uni-textarea" style="height: 100rpx;">
+					<textarea style="height: 100rpx;" v-model="detailsData.remark"  />
+				</view>
+			</view>
+			<view v-if="detailsData.signatureUrl">
+				<image :src="detailsData.signatureUrl" style="height: 240rpx;"></image>
+			</view>
+			<view>
+				<view class="footer">
+					<view v-if="detailsData.status==1" class="button" @click="updateStatus(3)">金额有误</view>
+					<view v-if="!detailsData.signatureUrl&&detailsData.status==1" class="button" @click="toAutograph">确认无误并签字</view>
+					<view v-if="detailsData.signatureUrl&&detailsData.status==1" class="button"  @click="updateStatus(2)">保存并提交</view>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
 
 <script>
+	import serve from '@/api/packageElectron/packageElectron.js'
+
+	export default {
+		data() {
+			return {
+				detailsData:{}
+			}
+		},
+
+		onLoad(option) {
+			if(option!='{}'){
+				let stationData = JSON.parse(option.data)
+				this.detailsData = stationData
+			}
+			
+		},
+
+		methods: {
+			toAutograph(){
+				let stationInfo = JSON.stringify(this.detailsData)
+				uni.redirectTo({
+					url: `../components/autograph?data=${stationInfo}`
+				})
+			},
+			updateStatus(val){
+				if(val==3){
+					this.detailsData.signatureUrl = ''
+					delete this.detailsData.signatureUrl
+				}
+				this.detailsData.status = val
+				serve.update(this.detailsData).then(res=>{
+					if (res.code === 20000) {
+							uni.showToast({
+								title: res.msg,
+								icon: 'none'
+							})
+							wx.redirectTo({
+								url: `../index`
+							})
+					}
+				})
+			}
+
+
+		}
+	}
 </script>
 
-<style>
+<style lang="scss" scoped>
+	.container {
+		height: 100vh;
+		display: flex;
+		flex-direction: column;
+		background: #f1f2f7 !important;
+
+		.body {
+			height: calc(100vh - 48rpx);
+			margin: 24rpx;
+			background: #ffffff;
+			padding: 30rpx;
+			border-radius: 20rpx;
+
+			.borderItem {
+				border-bottom: 1px solid #aaaaaa;
+				margin: 15rpx 0;
+				>text{
+					display: inline-block;
+					width: 300rpx;
+				}
+			}
+
+			>view:nth-child(1) {
+				margin: 0;
+				padding: 0 0 30rpx 0;
+				font-size: 32rpx;
+			}
+
+			.borderarea {
+				display: flex;
+
+				>view:nth-child(1) {
+
+					width: 100rpx;
+				}
+
+				>view:nth-child(2) {
+
+					width: 550rpx;
+
+					>textarea {
+						width: 550rpx;
+						height: 300rpx;
+						border: 1px solid #aaaaaa;
+					}
+				}
+			}
+			.footer {
+				position: relative;
+				height: 58rpx;
+				line-height: 58rpx;
+				padding: 0 34rpx 40rpx;
+				font-size: 32rpx;
+				color: #000;
+				font-weight: 550;
+				margin-top: 40rpx;
+			
+				.button {
+					position: absolute;
+					top: 0;
+					width: 220rpx;
+					height: 58rpx;
+					line-height: 58rpx;
+					text-align: center;
+					font-size: 28rpx;
+					color: #fff;
+					border-radius: 10rpx;
+				}
+			
+				>.button {
+					&:nth-of-type(1) {
+						right: 260rpx;
+						background: #d9001b;
+					}
+			
+					&:nth-of-type(2) {
+						right: 0rpx;
+						background: #169bd5;
+					}
+		
+			
+				}
+			}
+			
+			
+		}
+
+
+	}
 </style>