supervise/supervise-uniapp/components/ProcessButtons/ProcessButtons.vue

<template>
	<view class="pages">

		<view style="flex: 1;"></view>
		<text class="btn-break" @click="btnClick('break')" v-show="showBreak">撤回</text>
		<text class="btn-stop" @click="btnClick('stop')" v-show="showOther">终止</text>
		<text class="btn-agree" @click="btnClick('agree')" v-show="showOther">同意</text>


	</view>
</template>

<script>
	export default {
		name: "ProcessButtons",
		props: {

			showBreak: {
				type: Boolean,
				default: false
			},
			showOther: {
				type: Boolean,
				default: true
			},
			linkByParameter: Object,
			
		},
		watch: {
			linkByParameter(newVal) {
				console.log('xxx', newVal);
			}
		},

		data() {
			return {};
		},
		methods: {


			btnClick(type) {
				var _that = this
				console.log('1111>>>>>>', _that.linkByParameter)
				switch (type) {
					case "break":

						wx.showModal({
							title: '请填写审批意见',
							editable: true,
							confirmText: "提交",
							content: '',
							success(res) {
								if (res.confirm) {
									console.log('用户点击确定', res)

									if (res.content) {

										_that.linkByParameter.comment = res.content
									} else {
										wx.showToast({
											title: '请填写审批意见',
											icon: 'error',
											duration: 3000
										})
										return
									}
									console.log('1111>>>>>>', _that.linkByParameter)
									_that.$api.revokeProcess(_that.linkByParameter).then((resp) => {
										console.log('1111>>>>>>', resp)
										
										_that.$emit("call-father");

									}).catch(e => {
										console.log('eeeee', e)
										
									})

								} else if (res.cancel) {
									console.log('用户点击取消', res)
								}
							}
						})

						break;
					case "stop":

						wx.showModal({
							title: '请填写审批意见',
							editable: true,
							confirmText: "提交",
							content: '',
							success(res) {
								if (res.confirm) {
									console.log('用户点击确定', res)

									if (res.content) {

										_that.linkByParameter.comment = res.content
									} else {
										wx.showToast({
											title: '请填写审批意见',
											icon: 'error',
											duration: 3000
										})
										return
									}
									console.log('1111>>>>>>', _that.linkByParameter)
									_that.$api.breakProcess(_that.linkByParameter).then((resp) => {
										console.log('1111>>>>>>', resp)
										_that.$emit("call-father");

									}).catch(e => {
										console.log('eeeee', e)
									})

								} else if (res.cancel) {
									console.log('用户点击取消', res)
								}
							}
						})


						break;

					case "agree":

						wx.showModal({
							title: '请填写审批意见',
							editable: true,
							confirmText: "提交",
							content: '',
							success(res) {
								if (res.confirm) {
									console.log('用户点击确定', res)

									_that.linkByParameter.comment = res.content == '' ? "同意" : res.content
									console.log('1111>>>>>>', _that.linkByParameter)
									_that.$api.completeProcess(_that.linkByParameter).then((resp) => {
										console.log('1111>>>>>>', resp)

										_that.$emit("call-father");
									}).catch(e => {
										console.log('eeeee', e)
									})

								} else if (res.cancel) {
									console.log('用户点击取消', res)
								}
							}
						})


						break;
					default:
						break;
				}
			}
		}
	}
</script>

<style lang="scss">
	.pages {
		width: 90%;
		background: #fff;
		display: flex;
		flex-direction: row;
		justify-content: end;
		padding: 10px 20px;

		.btn-break {
			margin-right: 10px;
			background: #fff;
			border-radius: 15px;
			border: 1px solid #999;
			font-size: 14px;
			text-align: center;
			padding: 5px 20px;
			color: #666;
		}

		.btn-stop {
			margin-right: 10px;
			background: #fff;
			border-radius: 15px;
			border: 1px solid #999;
			font-size: 14px;
			text-align: center;
			padding: 5px 20px;
			color: #666;
		}

		.btn-agree {
			background: #0A59F7;
			border-radius: 15px;
			font-size: 14px;
			text-align: center;
			padding: 5px 20px;
			color: #fff;
		}
	}
</style>