|
|
@@ -20,16 +20,54 @@
|
|
|
<div class="official_header">
|
|
|
<img src="../assets/icon_zixun.png" />
|
|
|
<span>官方答复</span>
|
|
|
+ <button @click="releaseGo" v-if="canReply">
|
|
|
+ <img src="../assets/icon_edit.png" alt="" />
|
|
|
+ <span>我要回复</span>
|
|
|
+ </button>
|
|
|
</div>
|
|
|
<div class="official_line"></div>
|
|
|
- <div class="official_main" v-for="n in commentList" :key="n.id">
|
|
|
+ <template v-if="commentList && commentList.length">
|
|
|
+ <div class="official_main" v-for="n in commentList" :key="n.id">
|
|
|
+ <img src="../assets/icon_hui.png" />
|
|
|
+ <div class="official_content" v-html="n.content">
|
|
|
+ {{ n.content }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="official_main" v-else>
|
|
|
<img src="../assets/icon_hui.png" />
|
|
|
- <div class="official_content" v-html="n.content">
|
|
|
- {{ n.content }}
|
|
|
+ <div class="official_content">
|
|
|
+ 暂无答复
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <el-dialog title="回复" :visible.sync="dialogVisible" width="760px" center>
|
|
|
+ <div style="padding-right:100px">
|
|
|
+ <el-form :model="formData" label-width="120px" label-position="right" ref="formData" :rules="rules">
|
|
|
+ <!-- <el-form-item v-show="false" prop="id">
|
|
|
+ <el-input v-model="formData.id"></el-input>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item prop="cont" label="回复内容">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.content"
|
|
|
+ placeholder="请输入您要回复的内容,1000字以内"
|
|
|
+ type="textarea"
|
|
|
+ :rows="10"
|
|
|
+ maxlength="1000"
|
|
|
+ style="width:526px;"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="pic" label="图片附件">
|
|
|
+ <multi-upload v-model="formData.pics"></multi-upload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false" class="back">返回</el-button>
|
|
|
+ <el-button type="primary" @click="add()" class="sub">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -42,23 +80,68 @@ export default {
|
|
|
name01: '标题',
|
|
|
list: [],
|
|
|
title: '咨询详情',
|
|
|
- commentList: {}
|
|
|
+ commentList: {},
|
|
|
+ dialogVisible: false,
|
|
|
+ rules: {
|
|
|
+ content: [{ required: true, message: '请输入内容', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ formData: {}
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- if (this.$route.query.id) {
|
|
|
- this.$http.get(`/post/getDTO/${this.$route.query.id}`).then(res => {
|
|
|
- this.list = res;
|
|
|
- });
|
|
|
- // this.$http.get(`/comment/allDTO`).then(res => {
|
|
|
- // this.commentList = res.content;
|
|
|
- // let a = [...this.commentList].find(item => item.postId == this.$route.query.id);
|
|
|
- // this.commentContent = a.content;
|
|
|
- // });
|
|
|
- this.$http.get('/comment/allDTO', { query: { postId: this.$route.query.id } }).then(res => {
|
|
|
- this.commentList = res.content;
|
|
|
- console.log(this.commentList);
|
|
|
- });
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ canReply() {
|
|
|
+ return (
|
|
|
+ this.$store.state.userInfo &&
|
|
|
+ this.$store.state.userInfo.authorities &&
|
|
|
+ this.$store.state.userInfo.authorities.find(i => i.name === 'ROLE_ADMIN' || i.name === 'ROLE_INTERACT')
|
|
|
+ );
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getData() {
|
|
|
+ if (this.$route.query.id) {
|
|
|
+ this.$http.get(`/post/getDTO/${this.$route.query.id}`).then(res => {
|
|
|
+ this.list = res;
|
|
|
+ this.formData.postId = res.id;
|
|
|
+ });
|
|
|
+ // this.$http.get(`/comment/allDTO`).then(res => {
|
|
|
+ // this.commentList = res.content;
|
|
|
+ // let a = [...this.commentList].find(item => item.postId == this.$route.query.id);
|
|
|
+ // this.commentContent = a.content;
|
|
|
+ // });
|
|
|
+ this.$http.get('/comment/allDTO', { query: { postId: this.$route.query.id } }).then(res => {
|
|
|
+ this.commentList = res.content;
|
|
|
+ console.log(this.commentList);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ releaseGo() {
|
|
|
+ if (this.$store.state.userInfo) {
|
|
|
+ this.dialogVisible = true;
|
|
|
+ } else {
|
|
|
+ this.$alert('用户未登录,请先进行登录', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ add() {
|
|
|
+ this.$refs['formData'].resetFields();
|
|
|
+ this.$http
|
|
|
+ .post('/comment/create', this.formData, { body: 'json' })
|
|
|
+ .then(res => {
|
|
|
+ this.$message.success('成功');
|
|
|
+ this.getData();
|
|
|
+ this.dialogVisible = false;
|
|
|
+ this.$refs['formData'].resetFields();
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ dialogVisible = false;
|
|
|
+ this.$message.error(e.error);
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
@@ -93,6 +176,26 @@ export default {
|
|
|
font-size: 16px;
|
|
|
font-weight: 500;
|
|
|
margin-left: 5px;
|
|
|
+ flex-grow: 1;
|
|
|
+ }
|
|
|
+ button {
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-left: 22px;
|
|
|
+ width: 130px;
|
|
|
+ height: 36px;
|
|
|
+ background: #bf1616;
|
|
|
+ border-radius: 4px;
|
|
|
+ img {
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+ margin-right: 6px;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ font-size: 13px;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.official_line {
|