|
|
|
@ -1,58 +1,29 @@ |
|
|
|
<template> |
|
|
|
<div class="app-container"> |
|
|
|
<!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">--> |
|
|
|
<!-- <el-form-item>--> |
|
|
|
<!-- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>--> |
|
|
|
<!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>--> |
|
|
|
<!-- </el-form-item>--> |
|
|
|
<!-- </el-form>--> |
|
|
|
|
|
|
|
<!-- <el-row :gutter="10" class="mb8">--> |
|
|
|
<!-- <el-col :span="1.5">--> |
|
|
|
<!-- <el-button--> |
|
|
|
<!-- type="primary"--> |
|
|
|
<!-- plain--> |
|
|
|
<!-- icon="el-icon-plus"--> |
|
|
|
<!-- size="mini"--> |
|
|
|
<!-- @click="handleAdd"--> |
|
|
|
<!-- v-hasPermi="['vet:comments:add']"--> |
|
|
|
<!-- >新增</el-button>--> |
|
|
|
<!-- </el-col>--> |
|
|
|
<!-- <el-col :span="1.5">--> |
|
|
|
<!-- <el-button--> |
|
|
|
<!-- type="success"--> |
|
|
|
<!-- plain--> |
|
|
|
<!-- icon="el-icon-edit"--> |
|
|
|
<!-- size="mini"--> |
|
|
|
<!-- :disabled="single"--> |
|
|
|
<!-- @click="handleUpdate"--> |
|
|
|
<!-- v-hasPermi="['vet:comments:edit']"--> |
|
|
|
<!-- >修改</el-button>--> |
|
|
|
<!-- </el-col>--> |
|
|
|
<!-- <el-col :span="1.5">--> |
|
|
|
<!-- <el-button--> |
|
|
|
<!-- type="danger"--> |
|
|
|
<!-- plain--> |
|
|
|
<!-- icon="el-icon-delete"--> |
|
|
|
<!-- size="mini"--> |
|
|
|
<!-- :disabled="multiple"--> |
|
|
|
<!-- @click="handleDelete"--> |
|
|
|
<!-- v-hasPermi="['vet:comments:remove']"--> |
|
|
|
<!-- >删除</el-button>--> |
|
|
|
<!-- </el-col>--> |
|
|
|
<!-- <el-col :span="1.5">--> |
|
|
|
<!-- <el-button--> |
|
|
|
<!-- type="warning"--> |
|
|
|
<!-- plain--> |
|
|
|
<!-- icon="el-icon-download"--> |
|
|
|
<!-- size="mini"--> |
|
|
|
<!-- @click="handleExport"--> |
|
|
|
<!-- v-hasPermi="['vet:comments:export']"--> |
|
|
|
<!-- >导出</el-button>--> |
|
|
|
<!-- </el-col>--> |
|
|
|
<!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>--> |
|
|
|
<!-- </el-row>--> |
|
|
|
<!-- 搜索区域（可选，如果需要可以取消注释） --> |
|
|
|
<!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> |
|
|
|
<el-form-item> |
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
|
|
|
</el-form-item> |
|
|
|
</el-form> --> |
|
|
|
|
|
|
|
<!-- 工具栏 --> |
|
|
|
<el-row :gutter="10" class="mb8"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
plain |
|
|
|
icon="el-icon-plus" |
|
|
|
size="mini" |
|
|
|
@click="handleAdd" |
|
|
|
v-hasPermi="['vet:comments:add']" |
|
|
|
>新增回复</el-button> |
|
|
|
</el-col> |
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<!-- 表格 --> |
|
|
|
<el-table v-loading="loading" :data="commentsList" @selection-change="handleSelectionChange"> |
|
|
|
<el-table-column type="selection" width="55" align="center" /> |
|
|
|
<el-table-column label="头像" align="center" prop="avatar" width="100"> |
|
|
|
@ -70,13 +41,6 @@ |
|
|
|
<image-preview :src="scope.row.images" :width="50" :height="50" /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<!-- <el-table-column label="回复图片" align="center" prop="images" width="100">--> |
|
|
|
<!-- <template slot-scope="scope">--> |
|
|
|
<!-- <div v-for="(item,index) in JSON.parse(scope.row.images)">--> |
|
|
|
<!-- <image-preview :src="item" :width="50" :height="50" />--> |
|
|
|
<!-- </div>--> |
|
|
|
<!-- </template>--> |
|
|
|
<!-- </el-table-column>--> |
|
|
|
<el-table-column label="回复时间" align="center" prop="updatedAt" width="180"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span>{{ parseTime(scope.row.createdAt, '{y}-{m}-{d}') }}</span> |
|
|
|
@ -106,6 +70,7 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
<!-- 分页 --> |
|
|
|
<div class="pagestyle"> |
|
|
|
<pagination |
|
|
|
v-show="total>0" |
|
|
|
@ -120,7 +85,7 @@ |
|
|
|
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|
|
|
<el-form-item label="回复内容" prop="content"> |
|
|
|
<el-input v-model="form.content" placeholder="请输入回复内容" /> |
|
|
|
<el-input v-model="form.content" type="textarea" :rows="4" placeholder="请输入回复内容" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="回复图片" prop="images"> |
|
|
|
<image-upload v-model="form.images" /> |
|
|
|
@ -166,7 +131,6 @@ export default { |
|
|
|
title: "", |
|
|
|
// 是否显示弹出层 |
|
|
|
open: false, |
|
|
|
// imgUrl:[], |
|
|
|
// 查询参数 |
|
|
|
queryParams: { |
|
|
|
pageNum: 1, |
|
|
|
@ -187,28 +151,57 @@ export default { |
|
|
|
}, |
|
|
|
// 表单校验 |
|
|
|
rules: { |
|
|
|
content: [ |
|
|
|
{ required: true, message: "回复内容不能为空", trigger: "blur" } |
|
|
|
] |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.queryParams.consultationId = this.parseConsultationId(this.consultationId) |
|
|
|
this.getList() |
|
|
|
this.initQuery() |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
// 监听 consultationId 变化 |
|
|
|
consultationId: { |
|
|
|
handler(newVal) { |
|
|
|
this.initQuery() |
|
|
|
}, |
|
|
|
immediate: true |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 初始化查询参数 |
|
|
|
initQuery() { |
|
|
|
const id = this.parseConsultationId(this.consultationId) |
|
|
|
if (id) { |
|
|
|
this.queryParams.consultationId = id |
|
|
|
this.getList() |
|
|
|
} else { |
|
|
|
// 如果没有有效的consultationId，可以清空列表或查询所有 |
|
|
|
this.queryParams.consultationId = null |
|
|
|
this.getList() // 或者 this.commentsList = [] |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
/** 查询兽医回复列表 */ |
|
|
|
getList() { |
|
|
|
this.loading = true |
|
|
|
console.log('查询回复列表，参数:', this.queryParams) |
|
|
|
listComments(this.queryParams).then(response => { |
|
|
|
this.commentsList = response.rows |
|
|
|
this.total = response.total |
|
|
|
this.loading = false |
|
|
|
}).catch(() => { |
|
|
|
this.loading = false |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 取消按钮 |
|
|
|
cancel() { |
|
|
|
this.open = false |
|
|
|
this.reset() |
|
|
|
}, |
|
|
|
|
|
|
|
// 表单重置 |
|
|
|
reset() { |
|
|
|
this.form = { |
|
|
|
@ -225,42 +218,61 @@ export default { |
|
|
|
} |
|
|
|
this.resetForm("form") |
|
|
|
}, |
|
|
|
|
|
|
|
/** 搜索按钮操作 */ |
|
|
|
handleQuery() { |
|
|
|
this.queryParams.pageNum = 1 |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
|
|
|
|
/** 重置按钮操作 */ |
|
|
|
resetQuery() { |
|
|
|
this.resetForm("queryForm") |
|
|
|
// 重置查询参数，但保留 consultationId |
|
|
|
this.queryParams = { |
|
|
|
...this.queryParams, |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 10, |
|
|
|
replyName: null, |
|
|
|
content: null, |
|
|
|
images: null, |
|
|
|
isSensitive: null, |
|
|
|
sensitiveWords: null, |
|
|
|
createdAt: null, |
|
|
|
updatedAt: null, |
|
|
|
userId: null |
|
|
|
} |
|
|
|
this.handleQuery() |
|
|
|
}, |
|
|
|
|
|
|
|
// 多选框选中数据 |
|
|
|
handleSelectionChange(selection) { |
|
|
|
this.ids = selection.map(item => item.id) |
|
|
|
this.single = selection.length!==1 |
|
|
|
this.single = selection.length !== 1 |
|
|
|
this.multiple = !selection.length |
|
|
|
}, |
|
|
|
|
|
|
|
/** 新增按钮操作 */ |
|
|
|
handleAdd() { |
|
|
|
this.reset() |
|
|
|
this.open = true |
|
|
|
this.title = "添加兽医回复" |
|
|
|
this.form.consultationId = this.consultationId; |
|
|
|
this.form.consultationId = this.consultationId |
|
|
|
}, |
|
|
|
|
|
|
|
/** 修改按钮操作 */ |
|
|
|
handleUpdate(row) { |
|
|
|
this.reset() |
|
|
|
const id = row.id || this.ids |
|
|
|
getComments(id).then(response => { |
|
|
|
// console.log(1111,response) |
|
|
|
// const imgUrl = JSON.parse(response.data.images) |
|
|
|
// console.log(222,img) |
|
|
|
this.form = response.data |
|
|
|
// 确保 consultationId 正确 |
|
|
|
this.form.consultationId = this.consultationId |
|
|
|
this.open = true |
|
|
|
this.title = "修改兽医回复" |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** 提交按钮 */ |
|
|
|
submitForm() { |
|
|
|
this.$refs["form"].validate(valid => { |
|
|
|
@ -270,17 +282,22 @@ export default { |
|
|
|
this.$modal.msgSuccess("修改成功") |
|
|
|
this.open = false |
|
|
|
this.getList() |
|
|
|
}).catch(() => { |
|
|
|
this.$modal.msgError("修改失败") |
|
|
|
}) |
|
|
|
} else { |
|
|
|
addComments(this.form).then(response => { |
|
|
|
this.$modal.msgSuccess("新增成功") |
|
|
|
this.open = false |
|
|
|
this.getList() |
|
|
|
}).catch(() => { |
|
|
|
this.$modal.msgError("新增失败") |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** 删除按钮操作 */ |
|
|
|
handleDelete(row) { |
|
|
|
const ids = row.id || this.ids |
|
|
|
@ -291,6 +308,7 @@ export default { |
|
|
|
this.$modal.msgSuccess("删除成功") |
|
|
|
}).catch(() => {}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** 导出按钮操作 */ |
|
|
|
handleExport() { |
|
|
|
this.download('vet/comments/export', { |
|
|
|
@ -298,6 +316,7 @@ export default { |
|
|
|
}, `comments_${new Date().getTime()}.xlsx`) |
|
|
|
}, |
|
|
|
|
|
|
|
// 解析 consultationId |
|
|
|
parseConsultationId(id) { |
|
|
|
if (id == null || id === '' || id === undefined) { |
|
|
|
return null |
|
|
|
@ -320,18 +339,16 @@ export default { |
|
|
|
console.error('无效的consultationId:', id) |
|
|
|
return null |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
::v-deep .pagestyle .el-input{ |
|
|
|
::v-deep .pagestyle .el-input { |
|
|
|
width: auto !important; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .pagestyle .pagination-container{ |
|
|
|
::v-deep .pagestyle .pagination-container { |
|
|
|
background-color: #f8fafc; |
|
|
|
} |
|
|
|
</style> |
|
|
|
@ -345,7 +362,7 @@ export default { |
|
|
|
transition: all 0.3s ease; |
|
|
|
} |
|
|
|
|
|
|
|
.alter-btn:hover{ |
|
|
|
.alter-btn:hover { |
|
|
|
background-color: rgb(230, 255, 238); |
|
|
|
transform: translateY(-1px); |
|
|
|
} |
|
|
|
@ -434,4 +451,3 @@ export default { |
|
|
|
border-radius: 0 0 12px 12px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
