<template>
	<el-dialog
		title="加签设置"
		:visible.sync="addSignDialog"
		:close-on-click-modal="false"
	>
		<table cellspacing="0" cellpadding="0" border="0" class="form-table">
			<tbody>
				<tr>
					<th style="width: 100px;">
						<span class="xh-star">*</span>加签人员：
					</th>
					<td>
						<ht-user-selector v-model="users" :single="false" permission="w" />
					</td>
				</tr>
				<tr>
					<th style="width: 100px;">
						<span class="xh-star">*</span>加签说明：
					</th>
					<td colspan="3">
						<OpinionText ref="opinionText" />
					</td>
				</tr>
				<tr>
					<th style="width: 100px;">附件上传：</th>
					<td colspan="3">
						<FileUpload ref="fileUpload" />
					</td>
				</tr>
			</tbody>
		</table>
		<div slot="footer" class="dialog-footer">
			<el-button type="primary" @click="confirm" size="small">确 定</el-button>
			<el-button @click="cancel" size="small">取 消</el-button>
		</div>
	</el-dialog>
</template>

<script>
import { mapState, mapActions } from 'vuex';
import OpinionText from '@/components/common/opinionText.vue';
import FileUpload from '@/components/common/fileUpload.vue';
import HtUserSelector from '@/components/control/HtUserSelector.vue';
import { Message } from 'element-ui';
import utils from '@/utils.js';
import req from '@/request.js';
export default {
	name: 'taskToAddSign',
	props: ['taskId'],
	components: { OpinionText, FileUpload, HtUserSelector },
	data() {
		return {
			addSignDialog: false,
			users: '',
			nodeType: '',
			instId: '',
			flowThis: '', //flowAction的this
		};
	},
	methods: {
		//鼠标点击页面其他其他位置不关闭弹框
		handleClose(nodeType, instId, _this) {
			this.flowThis = _this;
			this.instId = instId;
			this.nodeType = nodeType;
			this.addSignDialog = true;
		},
		//执行前置脚本
		runBeforeScript() {
			let _this = this;
			let item = utils.indexOfList(
				_this.flowThis.rowsBtn,
				'alias',
				_this.flowThis.btnAlias
			);
			return _this.tempScript(item.beforeScript);
		},
		//执行前置脚本
		tempScript(script) {
			window._this = this;
			window._req = req;
			window.boData = _this.flowThis.$refs.formContent.data;
			console.debug(_req, boData);
			let tempScript =
				'var tempFunction = function(_req,data,_this){ ' + script + '};';
			let result = window.eval(tempScript + 'tempFunction(_req,boData,_this);');
			if (result && result.then && typeof result.then == 'function') {
				return result;
			}
			if (result === false) return false;
			return true;
		},
		//人员选择器
		selectUser() {
			this.$refs.selectUser.showDialog(); //父组件调用子组件方法
		},
		//取消
		cancel() {
			this.addSignDialog = false;
		},
		//确认
		confirm() {
			if (this.users == '' || this.users == null) {
				Message.warning('请选择加签人员');
				return;
			} else if (this.$refs.opinionText.getOpinion() == '') {
				Message.warning('请填写加签说明');
				return;
			}
			let userId = '';
			for (var i = 0; i < this.users.length; i++) {
				userId = userId + this.users[i].id + ',';
			}
			userId = userId.substring(0, userId.length - 1);
			let files = '';
			if (this.$refs.fileUpload.getFiles() != '') {
				files = JSON.stringify(this.$refs.fileUpload.getFiles());
			}

			if (this.nodeType == 'USERTASK') {
				//用户任务加签
				let data = {
					action: 'back',
					files: files,
					opinion: this.$refs.opinionText.getOpinion(),
					taskId: this.taskId,
					userIds: userId,
				};
				//获取表单数据
				utils
					.getOnlineFormData(true)
					.then(formDataStr => this.submitConfirm(formDataStr, data))
					.catch(reason =>
						utils
							.handleGetFormDataReject(reason)
							.then(() => this.submitConfirm('', data))
					);
			} else {
				//会签任务加签
				let data = {
					taskId: this.taskId,
					opinion: this.$refs.opinionText.getOpinion(),
					userId: userId,
					files: files,
				};
				this.$store.dispatch('storeProcess/taskSignUsers', data).then(() => {
					this.addSignDialog = false;
					utils.reload();
				});
			}
		},
		//用户任务加签
		submitConfirm(formDataStr, data) {
			let _this = this;
			let scriptResult = this.runBeforeScript();
			//执行前置脚本返回false时终止按钮操作
			if (scriptResult === false) return;
			//执行前置脚本返回的接口时先执行前置事件接口
			if (scriptResult.then && typeof scriptResult.then == 'function') {
				scriptResult.then(
					() => {
						//接口返回成功则正常执行按钮操作
						_this.funcDoNext(formDataStr, data);
					},
					fail => {
						//接口返回失败则终止按钮操作，并给与提示
						_this.$message.warning(fail);
						return;
					}
				);
			} else {
				//执行前置脚本返回true时正常执行按钮操作
				_this.funcDoNext(formDataStr, data);
			}
		},
		funcDoNext(formDataStr, data) {
			utils.closeAllNotification();
			if (formDataStr) {
				data.data = Base64.encode(formDataStr);
			}
			this.$store.dispatch('storeProcess/userTaskToSign', data).then(() => {
				this.addSignDialog = false;
				this.$router.push('/inst/' + this.instId + '/doneList');
			});
		},
	},
};
</script>

<style lang="stylus" scoped>
.el-dialog__footer {
  padding: 10px 20px;
  padding-top: 10px;
  text-align: right;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.form-table {
  width: 100%;
  border-top: 1px solid #ebeef5;
  border-left: 1px solid #ebeef5;
}

.form-table th {
  text-align: right;
  color: #666;
}

.form-table th > span {
  color: #f00;
}

.form-table th, .form-table td {
  border-right: 1px solid #ebeef5;
  border-bottom: 1px solid #ebeef5;
  padding: 10px;
  min-width: 0;
  box-sizing: border-box;
  text-overflow: ellipsis;
  vertical-align: middle;
  position: relative;
}

.xh-star {
  color: red;
}
</style>
