<template>
	<view>
		<view class="cu-form-group">
			<view class="title">题目</view>
			<view>{{workName}}</view>
		</view>
		<view class="cu-form-group">
			<view class="title">提交人</view>
			<view>{{createUserName}}</view>
		</view>
		<view class="margin-top">
			<radio-group class="block" @change="radioChange($event)">
				<view class="cu-form-group" v-for="(valueItem,valueIndex) in items" :key="valueIndex">
					<view class="title">{{valueItem.content}}</view>
					<radio :class="itemId==valueItem.itemId?'checked':''" v-if="valueItem.state == 'C'"
						:checked="itemId==valueItem.itemId?true:false" :value="valueItem.itemId">
					</radio>
					<view v-else>已处理</view>
				</view>
			</radio-group>
		</view>
		<view class="margin-top-xs" v-if="itemId">
			<view class="cu-form-group">
				<view class="title">处理人</view>
				<view>{{item.staffName}}</view>
			</view>
			<view class="cu-form-group">
				<view class="title">处理说明</view>
				<view>{{item.remark}}</view>
			</view>
			<view class="cu-form-group">
				<view class="title">完成时间</view>
				<view>{{item.finishTime}}</view>
			</view>
		</view>
		<view class="margin-top" v-if="itemId">
			<view class="cu-form-group ">
				<view class="title">扣款金额</view>
				<input v-model="deductionMoney" type="number" class="text-right" placeholder="请输入扣款金额"></input>
			</view>
			<view class="cu-form-group ">
				<textarea v-model="deductionReason" placeholder="必填,请输入内容"></textarea>
			</view>

			<view class="flex flex-direction margin-top-lg">
				<button class="cu-btn bg-blue margin-tb-sm lg" @click="submitWorkOrder">提交</button>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		finishWorkCopy,
		getWorkTaskItem,
		getWorkPool,
		getTaskWork
	} from '../../api/oa/workApi.js';
	export default {
		data() {
			return {
				deductionReason: '',
				copyId: '',
				workId: '',
				workName: '',
				itemId: '',
				createUserName: '',
				items: [],
				deductionMoney: 0,
				item: {
					staffName: '',
					remark: '',
					finishTime: ''
				}

			}
		},
		onLoad(options) {
			this.copyId = options.copyId;
			this.workId = options.workId;
			this._loadWorkTask();
			this._loadWorkTaskItem();
		},
		methods: {
			_loadWorkTask: function() {
				let _that = this;
				getWorkPool(this, {
					page: 1,
					row: 1,
					workId: this.workId,
				}).then(_data => {
					_that.workName = _data.data[0].workName;
					_that.createUserName = _data.data[0].createUserName;
				});
			},
			_loadWorkTaskItem: function() {
				let _that = this;
				getWorkTaskItem(this, {
					page: 1,
					row: 100,
					workId: this.workId,
				}).then(_data => {
					_that.items = _data.data;
				});
			},
			submitWorkOrder: function() {
				finishWorkCopy(this, {
					copyId: this.copyId,
					deductionReason: this.deductionReason,
					itemId: this.itemId,
					deductionMoney: this.deductionMoney,
				}).then(_data => {
					uni.navigateBack();
				})
			},
			radioChange: function(e) {
				this.itemId = e.detail.value;
				let _that = this;
				this.items.forEach(i => {
					if (_that.itemId == i.itemId) {
						_that.item = i;
					}
				})
			},
		}
	}
</script>

<style>

</style>