<template>
	<div class="center">
		<div class="main_css">
			<div class="formData">
				<el-form ref="form" :model="form" label-width="80px">
					<el-form-item label="编写单位">
						<el-input v-model="form.compilationUnit" clearable placeholder="暂无" :disabled="type == 1"></el-input>
					</el-form-item>
					<el-form-item label="编撰人员">
						<el-input v-model="form.editor" clearable placeholder="暂无" :disabled="type == 1"></el-input>
					</el-form-item>
					<el-form-item label="版本号">
						<el-input v-model="form.versionNumber" clearable placeholder="暂无" :disabled="type == 1"></el-input>
					</el-form-item>
					<el-form-item label="提交人">
						<el-input v-model="form.submitter" clearable placeholder="暂无" disabled></el-input>
					</el-form-item>
					<el-form-item label="版本说明">
						<el-input v-model="form.versionDescription" clearable placeholder="暂无" :disabled="type == 1"></el-input>
					</el-form-item>
          <div>
            <quill-editor v-model="form.content" res="myQuillEditor" :options="editorOption" id="editor">
              <!-- @blur="onEditorBlur($event)" @focus="onEditorFocus($event)" @change="onEditorChange($event)" -->
            </quill-editor>
          </div>
				</el-form>
			</div>
			<div class="btn">
				<el-button @click="submit(1)" v-if="type == 3">通过</el-button>
				<el-button @click="submit(2)" v-if="type == 3">驳回</el-button>
				<el-button @click="revert">关闭</el-button>
				<el-button @click="edit" v-if="type == 2">修改</el-button>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		seeData,
		editFormData,
		auditFormData
	} from '@/api/platformManagement'
   import quillEditor from 'vue-quill-editor';
	export default {
		data() {
			return {
				form: {},
        editorOption: {
          // modules: {
          //   // toolbar: [
          //   //   ['bold', 'italic', 'underline', 'strike', 'background', 'color', 'font', 'size'],
          //   //   ['blockquote', 'code-block']
          //   // ]
          // }
        },
				id:"",
				type:"",
			}
		},
		mounted() {
			this.id = this.$route.query.id
			this.type = this.$route.query.type
			this.getList()
		},
		methods: {
			getList(){
				this.listLoading = true
				var _obj = {}
				_obj.id = this.id
				seeData(_obj).then(response => {
						this.form = response.data
						this.listLoading = false
					})
					.catch(() => {
						this.loading = false
					})
			},
			revert(){
				this.$router.go(-1)
			},
			submit(num){
				var _audit = {}
				_audit.id = this.form.id
				let title_name = ""
				if(num == 1){
					_audit.flag = 1
					title_name = "通过"
				}else if(num == 2){
					_audit.flag = 2
					title_name = "驳回"
				}
				this.$confirm("确定要" + title_name + "该记录吗？", '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning',
					})
					.then(() => {
						auditFormData( _audit).then(response => {
								this.$notify({
									title: '成功',
									message: title_name+'成功！',
									type: 'success'
								});
								this.listLoading = false
								this.$router.go(-1)
							})
							.catch(() => {
								this.loading = false
							})
					})

			},
			edit() {
				if (this.form.compilationUnit && (this.form.compilationUnit.length < 0 || this.form.compilationUnit.length > 25)) {
					this.$message.error("编写单位字数应在 0 - 25 之间")
					return
				}
				if (this.form.editor && (this.form.editor.length < 0 || this.form.editor.length > 10)) {
					this.$message.error("编撰人员字数应在 0 - 10 之间")
					return
				}
				if(!this.form.versionNumber){
					this.$message.error("请输入版本号")
					return
				}
				if (this.form.versionDescription && (this.form.versionDescription.length < 0 || this.form.versionDescription.length > 100)) {
					this.$message.error("版本说明字数应在 0 - 100 之间")
					return
				}
				var parameter = {}
				parameter.id = this.id
				parameter.compilationUnit = this.form.compilationUnit
				parameter.editor = this.form.editor
				parameter.versionNumber = this.form.versionNumber
				parameter.submitter = this.form.submitter
				parameter.versionDescription = this.form.versionDescription
				parameter.content = this.form.content
				this.listLoading = true
				editFormData(parameter).then(response => {
						this.$notify({
							title: '成功',
							message: '修改成功！',
							type: 'success'
						});
						var _obj = {}
						_obj.compilationUnit = this.form.compilationUnit
						_obj.editor = this.form.editor
						_obj.versionNumber = this.form.versionNumber
						localStorage.setItem("regulations", JSON.stringify(_obj))
						this.listLoading = false
						this.$router.go(-1)
					})
					.catch(() => {
						this.loading = false
					})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.center {
		background: #F5F6F7;
		height: calc(100vh - 4.5vh);
		padding-top: 20px;

	}

	.main_css {
		width: 96%;
		height: 90vh;
		background: #FFFFFF;
		margin: 20px auto;
		padding-top: 20px;
    overflow-y: scroll;
	}

	.formData {
		width: 50%;
		margin: 20px 0 0 140px;
	}
	.btn{
		text-align: right;
		position: absolute;
		right: 200px;
		bottom:100px;
	}
</style>
