hjt_erdao_WeChatApplet/pages/merchant/home/account.vue

<template>
	<view class="main main-bg">
		<u-form :model="form" ref="uForm" :rules="rules">
			<u-form-item 
				label="商品金额"
				label-width="180" 
				:label-position="labelPosition"
				prop="orderPriceOld">
				<u-input 
					v-model="form.orderPriceOld" 
					placeholder-style="color: #2E4F1C;"
					placeholder="请输入商品金额" />
			</u-form-item>
			<u-form-item
				label="商品折扣"
				label-width="180" 
				:label-position="labelPosition"
				prop="shopsTel">
				<view class="form-item">
					<u-input 
						v-model="form.shopsTel" 
						placeholder-style="color: #2E4F1C;"
						placeholder="请输入商品折扣" />
				</view>
			</u-form-item>
			</u-form-item>
			<u-upload
				width="160"
				height="160"
				:action="action"
				max-count="3" 
				@on-success="onSuccess">
			</u-upload>
		</u-form>
		<view @click="submit" class="form-submit">结算</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import http from '@/common/http.js'
	import server from "@/api/index";
	export default {
		data() {
			return {
				action: http.webUrl+`/wx/common/upload`,
				picUrlList: [],
				labelPosition: 'left',
				form: {
					orderPriceOld: null,
					shopsTel: 1.00,
				},
				rules: {
					orderPriceOld: [
						{ 
							required: true, 
							message: '请输入商品金额!',
							trigger: ['change','blur'],
						},
						{
							validator: (rule, value, callback) => {
								return this.$u.test.amount(value);
							},
							message: '商品金额必须是数字!',
							trigger: ['change','blur'],
						}
					],
					shopsTel: [
						{ 
							validator: (rule, value, callback) => {
								return this.$u.test.range(value, [0, 1]);
							},
							message: '商品折扣必须是0-1之间!',
							trigger: ['change','blur'],
						}
					],
				},
				userInfo:{},
				veteransId: 0,
				remark: '',
				veteransName: '',
				picUrlList: []
			}
		},
		onLoad(e) {
			console.log(e)
			if(e.veteransId){
				this.veteransId = parseInt(e.veteransId);
				this.remark = e.remark;
				this.veteransName = e.veteransName
			}
			this.userInfo = uni.getStorageSync('userInfo');
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods:{
			onSuccess(data, index, lists, name){
				this.picUrlList = [];
				lists.forEach(item =>{
					this.picUrlList.push(item.response.fileName)
				})
			},
			submit() {
				console.log(this.form.shopsTel.toString().substr(0,1))
				let that= this;
				this.$refs.uForm.validate(valid => {
					if (valid) {
						if(this.form.shopsTel.toString().substr(0,1) === '.'){
							this.form.shopsTel = '0'+ this.form.shopsTel
						}
						let money = this.form.shopsTel*this.form.orderPriceOld;
						uni.showModal({
							title: '提示',
							content: '确认结算吗?',
							success: function (res) {
								if (res.confirm) {
									let params = {
										shopsId: that.userInfo.nickName,
										goodsName: that.userInfo.userName,
										veteransName: that.veteransName,
										veteransId: that.veteransId,
										remark: that.remark,
										orderPriceOld: that.form.orderPriceOld,
										orderPriceVip: money,
										picUrlList: that.picUrlList,
										detailedlist: []
									}
									server.addOrderInfo(params).then(res =>{
										that.$refs.uToast.show({
											title: '操作成功!',
											type: 'default',
										})
										setTimeout(function()  {
											uni.switchTab({
												url: '/pages/index/index'
											})
										}, 2000);
									})
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});
					}
				})
				console.log('this.form', this.form)
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .u-list-item{
		margin: 0rpx 0rpx 0rpx 16rpx!important;
	}
	/deep/ .u-icon__icon{
		position: relative;
		color: #2E4F1C!important;
	}
	/deep/ .u-form-item__message{
		padding-right: 0rpx!important;
		text-align: right;
	}
	/deep/ .u-input__input{
		color: #2E4F1C!important;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		text-align: right;
	}
	/deep/ .u-border, .u-border-bottom, .u-border-left, .u-border-right, .u-border-top, .u-border-top-bottom{
		
	}
	/deep/ .u-form-item{
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-webkit-flex-direction: row;
		flex-direction: row;
		box-sizing: border-box;
		line-height: 96rpx;
		-webkit-flex-direction: column;
		flex-direction: column;
		background: rgba(46, 79, 28, 0.13);
		border-radius: 24rpx;
		margin-bottom: 40rpx;
		padding-left: 30rpx!important;
		padding-right: 30rpx!important;
	}
	.main{
		width: 100%;
		height: auto;
		min-height: 100vh;
		padding: 60rpx 30rpx 30rpx;
	
		.form-submit{
			margin: 60rpx auto;
			width: 570rpx;
			height: 96rpx;
			line-height: 96rpx;
			background: #2E4F1C;
			border-radius: 49rpx;
			font-size: 36rpx;
			text-align: center;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #fff;
		}
	}
</style>