pad-ndxy-uni/pages/management/order-detail.vue

<template>
	<view class="contianer">
		<nav-bar type="2" title="工单明细"></nav-bar>
		<view class="contianer content">
			<view class="contianer content_wraper">
				<view class="contianer mgt2 grid_wraper">
					<table>
						<tr>
							<th>工单编码</th>
							<th>产品编号</th>
							<th>产品名称</th>
							<th>计划重量</th>
							<th>产线</th>
							<th>开工时间</th>
							<th><div style="width: 3.1rem">起点编码</div></th>
							<th><div style="width: 3.1rem">终点编码</div></th>
							<th>工单状态</th>
							<th style="text-align: center">操作</th>
						</tr>
						<tr v-for="(e, i) in dataList" :key="i">
							<td>{{ e.mfg_order_name }}</td>
							<td>{{ e.product_name }}</td>
							<td>{{ e.description }}</td>
							<td>{{ e.total_qty }}</td>
							<td>{{ e.resource_name }}</td>
							<td>{{ e.realstart_time }}</td>
							<td>
								<div class="filter-select">
									<uni-data-select v-model="e.start_device_code" :localdata="options"></uni-data-select>
								</div>
							</td>
							<td>
								<div class="filter-select">
									<uni-data-select v-model="e.next_device_code" :localdata="options"></uni-data-select>
								</div>
							</td>
							<td>{{ e.status }}</td>
							<td>
								<div class="zd-row btn_wraper">
									<button class="grid_button" :class="{'grid_button_disabled': e.checked && disabled3}" :disabled="disabled3" @click="_updateOrder(e)">修改</button>
									<button v-if="e.status === '执行中'" class="grid_button" @click="toJump(e)">执行中</button>
									<button v-else class="grid_button" :class="{'grid_button_disabled': e.checked && disabled1}" :disabled="disabled1" @click="_startOrder(e)">开始</button>
									<button class="grid_button" :class="{'grid_button_disabled': e.checked && disabled2}" :disabled="disabled2" @click="_forceFinish(e)">强制完成</button>
								</div>
							</td>
						</tr>
					</table>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import NavBar from '@/components/NavBar.vue'
	// import {queryDevices, queryOrders, updateOrder, startOrder} from '@/utils/mork2.js'
	// import {forceFinish} from '@/utils/getData2.js'
	import {queryDevices, queryOrders, updateOrder, startOrder, forceFinish} from '@/utils/getData2.js'
	export default {
		components: {
			NavBar
		},
		data() {
			return {
				value: '',
				options: [],
				dataList: [],
				disabled1: false,
				disabled2: false,
				disabled3: false
			};
		},
		mounted () {
			this._queryDevices()
		},
		onShow () {
			this._queryOrders()
		},
		methods: {
			async _queryDevices () {
				let res = await queryDevices()
				this.options = [...res]
				this.options.map(el => {
					this.$set(el, 'text', el.device_name)
					this.$set(el, 'value', el.device_code)
				})
			},
			async _queryOrders () {
				let res = await queryOrders()
				this.dataList = [...res]
				this.dataList.map(el => {
					this.$set(el, 'checked', false)
				})
			},
			async _updateOrder (e) {
				this.disabled3 = true
				e.checked = true
				try {
					let res = await updateOrder(e.start_device_code, e.next_device_code, e.mfg_order_name)
					this._queryOrders()
					uni.showToast({
						title: res.message,
						icon: 'success'
					})
					this.disabled3 = false
					e.checked = false
				} catch (e) {
					this.disabled3 = false
					e.checked = false
				}
			},
			async _startOrder (e) {
				this.disabled1 = true
				e.checked = true
				try {
					let res = await startOrder(e.mfg_order_name)
					if (res.message) {
						this.disabled1 = false
						e.checked = false
						uni.navigateTo({
							url: '/pages/management/task?order=' + e.mfg_order_name
						})
					}
				} catch (e) {
					this.disabled1 = false
					e.checked = false
				}
			},
			toJump (e) {
				uni.navigateTo({
					url: '/pages/management/task?order=' + e.mfg_order_name
				})
			},
			async _forceFinish (e) {
				this.disabled2 = true
				e.checked = true
				try {
					let res = await forceFinish(e.mfg_order_name)
					this._queryOrders(this.value)
					uni.showToast({
						title: res.message,
						icon: 'success'
					})
					this.disabled2 = false
					e.checked = false
				} catch (e) {
					this.disabled2 = false
					e.checked = false
				}
			}
		}
	}
</script>

<style lang="stylus" scoped>
.btn_wraper
  width 170px
.filter-select
  width 155px
</style>