<template>
	<div>
		<el-drawer class="edit-drawer" title="修改文章" size="1000px" :visible.sync="visible"
			direction="rtl" :modal="modal" :wrapper-closable="false" @close="close">
			<el-form ref="form" :rules="rules" size="small" :model="artDetail" label-width="120px">
				<el-form-item label="文章标题" prop="title">
					<el-input v-model="artDetail.title" placeholder="请输入文章标题"></el-input>
				</el-form-item>
        <el-form-item label="文章内容" prop="content">
        	<Tinymce  v-model="artDetail.content" :model='false' :height="300" />
        </el-form-item>
				<el-form-item style="text-align: right; padding-right: 10px">
					<el-button type="primary" @click="confirm">确 定</el-button>
					<el-button @click="close">取 消</el-button>
				</el-form-item>
			</el-form>
		</el-drawer>
	</div>
</template>

<script>
	import {
		getArtUpdate
	} from "@/api/info";
  import Tinymce from "@/component/Tinymce";
	export default {
		name: "InfoUpdate",
    components: {
      Tinymce,
    },
		filters: {
			startTimeConfig: function(value) {
				return {
					start: '08:00',
					step: '00:15',
					end: '20:30',
					minTime: value
				}
			},
			endTimeConfig: function(value) {
				return {
					start: '08:00',
					step: '00:15',
					end: '24:00',
					minTime: value
				};
			}
		},
		props: {
			visible: {
				type: Boolean,
				default: false,
			},
      artDetail: {
        type: Object,
        default: ()=> {
          return {}
        },
      },
			isEdit: {
				type: Boolean,
				default: false,
			},
			// 是否需要遮罩层
			modal: {
				type: Boolean,
				default: true,
			},
		},
		data() {
			return {
				form: {
          // 富文本
          title:'',
					//班次名字
					name: '',
					//签到单次奖励金额
					single_time: 0,
					// 签到时间范围
					// 整合签到数据
					sections: [{
						times: [{
							"check_type": "OnDuty", //类型(OnDuty上班，OffDuty下班)
							"across": 0, //是否跨天
							"end_min": -1, //允许的最玩打卡时间，分钟为单位（-1表示不限制）
							"check_time": "08:30", //check时间
							"free_check": false, //是否免打卡
							"begin_min": 0 //允许的最早提前打卡时间，分钟为单位}
						}, {
							"check_type": "OffDuty", //类型(OnDuty上班，OffDuty下班)
							"across": 0, //是否跨天
							"end_min": -1, //允许的最玩打卡时间，分钟为单位（-1表示不限制）
							"check_time": "11:30", //check时间
							"free_check": false, //是否免打卡
							"begin_min": 0 //允许的最早提前打卡时间，分钟为单位
						}],
					}],
				},
				rules: {
					title: [{
						required: true,
						message: "请输入文章标题",
						trigger: "blur"
					}],
					content: [{
						required: true,
						message: "请输入文章内容",
						trigger: "blur"
					}],
				}
			};
		},
		// created() {
		// 	if (this.id) {
		// 		this.postClassDetails();
		// 	}
		// },
		methods: {
			// 删除上下班
			delTime(ind) {
				this.form.sections.splice(ind, 1)
			},
			// 添加上下班
			addTime() {
				this.form.sections.push({
					times: [{
						"check_type": "OnDuty", //类型(OnDuty上班，OffDuty下班)
						"across": 0, //是否跨天
						"end_min": -1, //允许的最玩打卡时间，分钟为单位（-1表示不限制）
						"check_time": "", //check时间
						"free_check": false, //是否免打卡
						"begin_min": 0 //允许的最早提前打卡时间，分钟为单位}
					}, {
						"check_type": "OffDuty", //类型(OnDuty上班，OffDuty下班)
						"across": 0, //是否跨天
						"end_min": -1, //允许的最玩打卡时间，分钟为单位（-1表示不限制）
						"check_time": "", //check时间
						"free_check": false, //是否免打卡
						"begin_min": 0 //允许的最早提前打卡时间，分钟为单位
					}],
				})
			},

			close() {
				this.$emit("close");
			},

			async confirm() {
				this.$refs.form.validate(async (valid) => {
					if (valid) {
            console.log(this.artDetail,'artDetail')
            const data = await getArtUpdate(this.artDetail)
						// const data = await postAddClass(upData);
						this.$message({
							message: data.data,
							type: "success",
						});
						this.close();
						this.$emit("confirm");
					}
				});
			},
		},
	};
</script>

<style scoped>
	.btn-up {
		position: relative;
	}

	.btn-department {
		position: absolute;
		left: 270px;
		top: 4px;
	}

	.btn-role-up {
		position: relative;
	}

	.add-role {
		position: absolute;
		left: 270px;
		top: 4px;
	}

	.creat-shop {
		color: #1890ff;
		font-size: 12px;
	}
</style>
