TSYWXT-CLOUD-APP/pages/check-order/ordercancel.vue

<!--
 * @Title: 
 * @Description: 工单取消
 * @Author: swp
 * @Date: 2022-08-24 10:49:21
 * @LastEditors: 
 * @LastEditTime: 2022-08-24 10:49:21
-->
<template>
	<view class="wrap">
		<uni-nav-bar dark :fixed="true" backgroundColor="#3F9EFF" statusBar="false" left-icon="left" left-text="返回"
			@clickLeft="toBack">
			<view class="nav-title">
				<text>{{title}}</text>
			</view>
		</uni-nav-bar>
		<view class="container">
			<uni-group>
				<uni-forms ref="baseForm" :model="formData">
					<uni-section title="取消说明" ftitleFontSize="0.8rem" style="width: 100%;">
						<template v-slot:decoration>
							<view class="decoration"></view>
						</template>
						<view style="padding-top: 10px;padding-bottom: 0px;padding-left: 15px;padding-right: 15px;">
							<uni-forms-item>
								<uni-easyinput :styles="styles" type="textarea" v-model="formData.orderDesc"
									placeholder="请录入工单取消说明" />
							</uni-forms-item>
						</view>
					</uni-section>
				</uni-forms>
				<view class="view-btn">
					<button style="background-color: lightcoral;" type="default"
						@click="onOrderCancelClick()">提交操作</button>
				</view>
			</uni-group>
		</view>
	</view>
</template>

<script>
	import http from '@/http/api.js';
	import {
		devUrl,
		prodUrl
	} from '@/common/setting';
	export default {
		components: {},
		data() {
			return {
				title: '工单取消',
				id: '',
				formData: {
					orderDesc: '',
				},
				styles: {
					color: '#333',
					borderColor: '#e5e5e5',
					disableColor: '#FFFFFF'
				},
				baseURL: '',
			}
		},
		computed: {},
		onLoad(option) {
			this.id = option.id;
			this.baseURL = process.env.NODE_ENV === 'development' ? devUrl : prodUrl;
		},
		onShow() {},
		methods: {
			toBack() {
				uni.navigateBack({
					delta: 2
				})
			},
			onOrderCancelClick() {
				let that = this;
				uni.showModal({
					content: '是否确定取消工单?',
					showCancel: true,
					success(res) {
						if (res.confirm) {
							that.cancelOrderSubmit();
						}
					}
				});
			},
			cancelOrderSubmit() {
				let that = this;
				this.formData['id'] = this.id;
				console.log("id "+JSON.stringify(this.formData))
				http.request({
					url: '/galaxy-business/order/cancel',
					method: 'POST',
					params: this.formData
				}).then(res => {
					if (res.success) {
						uni.showModal({
							content: '已成功提交',
							showCancel: false,
							success(res) {
								that.toBack();
							}
						});
					} else {
						uni.showModal({
							content: '' + res.msg,
							showCancel: false
						});
					}
				}).catch(err => {
					console.log(err)
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.view-btn {
		margin-top: 20px;
		margin-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.line-space {
		margin-top: 4px;
	}
</style>