blog/blog-facade.git

inleft

2022-03-03 5dfef883049e7f0670f6c6b1b225b233aee41eea

commit \| author \| age
2f9d3c	1	<template>
I	2	<div>
	3	<div class="visitInfo">
ec97e0	4	<a-form-model ref="myForm" layout="inline" :rules="rules" :model="form" :label-col="labelCol"
I	5	:wrapper-col="wrapperCol">
	6	<a-form-model-item label="昵称" prop="nickName">
	7	<a-input v-model="form.nickName" placeholder="需填..">
2f9d3c	8	</a-input>
I	9	</a-form-model-item>
ec97e0	10	<a-form-model-item label="邮箱" prop="eMail">
I	11	<a-input v-model="form.eMail" placeholder="..仅后台可见">
2f9d3c	12	</a-input>
I	13	</a-form-model-item>
ec97e0	14	<a-form-model-item label="主页" prop="homePage">
I	15	<a-input v-model="form.homePage" placeholder="https:// or http://">
2f9d3c	16	</a-input>
I	17	</a-form-model-item>
	18
	19	</a-form-model>
	20	</div>
	21	<div class="replyMsgInfo" v-if="showReplyMsgInfo">
ec97e0	22	<div>{{msgInfo.useName}} </div>
I	23	<div style="padding: 0px 3px;"> : </div>
	24	<div>
	25	<span v-html="msgInfo.userComment.replace(/\n/g, '<br>')"></span>
	26	</div>
2f9d3c	27	</div>
I	28	<a-comment>
	29	<div slot="content">
	30	<a-form-item>
ec97e0	31	<a-textarea :rows="4" v-model="form.visitorContent" :placeholder="replyHolder" />
2f9d3c	32	</a-form-item>
I	33	<div>
ec97e0	34	<a-button html-type="submit" type="primary" v-if="!showReplyMsgInfo" @click="send()"
I	35	:disabled="isSending">
2f9d3c	36	高低整两句
I	37	</a-button>
ec97e0	38	<a-button html-type="submit" type="primary" v-else @click="send()" :disabled="isSending">
2f9d3c	39	回复Ta
I	40	</a-button>
	41	</div>
	42
	43	<div>
ec97e0	44	<a-checkbox style="margin-left: 8px;" v-if="!showReplyMsgInfo" v-model="form.isSecretMsg">
I	45	悄悄说..<span class="myTip">(仅登录后可查看)</span>
2f9d3c	46	</a-checkbox>
ec97e0	47	<!-- <a-checkbox v-model="form.isReceiveMail">
2f9d3c	48	接收邮件回复通知
ec97e0	49	</a-checkbox> -->
2f9d3c	50	</div>
I	51	</div>
	52	</a-comment>
	53	</div>
	54	</template>
	55
	56	<script>
ec97e0	57	import {
I	58	blogCommentAdd
	59	} from '../../api/blogArticleComment.js'
	60
2f9d3c	61	export default {
I	62	methods: {
	63	getMsgInfo(param) {
	64	this.msgInfo = param;
	65	this.showReplyMsgInfo = true;
ec97e0	66	this.replyHolder = "@" + this.msgInfo.useName;
I	67	},
846bd0	68	send() {
5dfef8	69	console.log(11);
ec97e0	70	if (this.form.nickName === "") {
I	71	this.$message.info("怎么称呼..")
	72	return
	73	}
	74
	75	if (this.form.visitorContent === "") {
	76	this.$message.info("你可能需要说点什么..")
	77	return
	78	}
	79
	80	var res;
	81	this.$refs.myForm.validate(valid => {
	82	if (valid) {
	83	//this.$message.info("校验通过")
	84	res = true;
	85	} else {
	86	this.$message.info("校验失败")
	87	res = false;
	88	}
	89	});
5dfef8	90	var articleId=this.$attrs.articleId;
ec97e0	91	let commentType = (articleId == null \|\| articleId == undefined) ? 1 : 2;
I	92	this.isSending = true;
	93
	94	blogCommentAdd({
	95	parentId: this.msgInfo.parentId,
	96	replyId: this.msgInfo.replyId,
	97	"visitorId": "1",
	98	"isReceiveMail": 0,
	99	"articleId": articleId,
	100	"commentType": commentType,
	101	"authStatus": this.form.isSecretMsg ? 2 : 1,
	102	// "isReceiveMail": this.form.isReceiveMail ? 1 : 0,
	103	"visitorEmail": this.form.eMail,
	104	"visitorHomePage": this.form.homePage,
	105	"visitorNickName": this.form.nickName,
	106	"commentContent": this.form.visitorContent,
	107	}).then((res) => {
	108	this.isSending = false;
	109	if (res.code == 200) {
5dfef8	110	this.$emit("sendMsg");
I	111	this.$message.info("信息已送达..")
ec97e0	112	} else {
I	113	this.$notification.error({
	114	message: '好像哪里不对劲..',
	115	description: res.message,
	116	placement: 'bottomRight'
	117	});
	118	}
	119	}).catch((error) => {
	120	this.$message.error("请求失败")
	121	this.isSending = false;
	122	})
	123	// setTimeout(() => {
	124	// this.$message.info("发送成功")
	125	// this.isSending = false;
	126	// }, 3000);
	127
2f9d3c	128	}
I	129	},
ec97e0	130
2f9d3c	131	data() {
I	132	return {
ec97e0	133	isSending: false,
I	134	replyHolder: "",
2f9d3c	135	msgInfo: {
I	136	useName: "",
	137	userComment: "",
ec97e0	138	parentId: 0,
I	139	replyId: 0
2f9d3c	140	},
I	141	showReplyMsgInfo: false,
	142	labelCol: {
	143	span: 6,
	144	offset: 0,
	145	},
	146	wrapperCol: {
	147	span: 15,
	148	offset: 0
	149	},
	150	form: {
ec97e0	151	nickName: "",
I	152	eMail: "",
	153	homePage: "",
	154	isReceiveMail: false,
	155	isSecretMsg: false,
	156	visitorContent: "",
	157	parentId: 0,
	158	replyId: 0
2f9d3c	159	},
ec97e0	160	rules: {
I	161	"nickName": [{
	162	message: '怎么称呼?',
	163	}, {
	164	trigger: 'blur',
	165	max: 20,
	166	message: '你的名字也太长了..'
	167	}],
	168	"eMail": [{
	169	trigger: 'blur',
	170	pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,
	171	message: '邮箱格式不正确'
	172	}, {
	173	trigger: 'blur',
	174	max: 50,
	175	message: '邮箱不要超过50字符..'
	176	}],
	177	"homePage": [{
	178	trigger: 'blur',
	179	pattern: /^((https\|http)?:\/\/)[^\s]+/,
	180	message: '仅支持 https \| http'
	181	}, {
	182	trigger: 'blur',
	183	max: 50,
	184	message: '网址不要超过50字符..'
	185	}]
	186	},
2f9d3c	187	}
I	188	}
	189	}
	190	</script>
	191
	192	<style lang="less">
	193	.replyMsgInfo {
ec97e0	194	display: flex;
e33959	195	border-radius: 4px;
ec97e0	196	box-shadow: 0px 9px 10px 0 rgba(0, 0, 0, 0.24), 1px 3px 15px 0 rgba(0, 0, 0, 0.19);
e33959	197	padding: 20px 25px 20px;
ec97e0	198	margin-left: 15px;
I	199	margin-top: 10px;
2f9d3c	200	}
I	201	</style>