Commit b43bf446 authored by YuY's avatar YuY

意见反馈代码第一次提交

parent cc8ddf62
......@@ -66,3 +66,10 @@ export function exportCmsFeedback(query) {
responseType: 'blob'
})
}
export function listFeedbackTypes(query) {
return request({
url: '/cmsfeedback/queryFeedBackTypes',
method: 'get',
query
})
}
<template>
<div class="app-container">
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="反馈类型" prop="feedbackType">
<el-input
v-model="queryParams.feedbackType"
placeholder="请输入反馈类型"
clearable
:maxlength="64"
size="small"
style="width: 150px"
/>
<el-form-item prop="feedbackType">
<el-select v-model="queryParams.feedbackType" placeholder="反馈类型">
<el-option
v-for="item in feedbackTypes"
:key="item.businessId"
:label="item.dictLabel"
:value="item.businessId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="标题" prop="title">
<el-form-item prop="title">
<el-input
v-model="queryParams.title"
placeholder="请输入标题"
placeholder="标题"
clearable
:maxlength="255"
size="small"
style="width: 150px"
/>
</el-form-item>
<el-form-item label="联系方式" prop="contact">
<el-form-item prop="contact">
<el-input
v-model="queryParams.contact"
placeholder="请输入联系方式"
placeholder="联系方式"
clearable
:maxlength="255"
size="small"
style="width: 150px"
/>
</el-form-item>
<el-form-item label="状态" prop="flag">
<el-select v-model="queryParams.flag" placeholder="请选择状态" clearable size="small">
<el-option
v-for="dict in statusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
:class="commonField.queryClass"
:type="commonField.typePrimary"
:icon="commonField.queryIcon"
:size="commonField.smallSize"
@click="handleQuery">查询</el-button>
@click="handleQuery">查询
</el-button>
<el-button
:class="commonField.resetClass"
:icon="commonField.resetIcon"
:size="commonField.smallSize"
@click="resetQuery">重置</el-button>
@click="resetQuery">重置
</el-button>
</el-form-item>
<div style="float: right">
<el-form-item>
......@@ -61,27 +53,30 @@
:type="commonField.typePrimary"
:icon="commonField.addIcon"
:size="commonField.smallSize"
@click="handleAdd">新增</el-button>
<el-button
:class="commonField.exportClass"
:type="commonField.typeSuccess"
:icon="commonField.exportIcon"
:size="commonField.smallSize"
@click="handleExport">导出</el-button>
@click="handleAdd">新增
</el-button>
<!-- <el-button-->
<!-- :class="commonField.exportClass"-->
<!-- :type="commonField.typeSuccess"-->
<!-- :icon="commonField.exportIcon"-->
<!-- :size="commonField.smallSize"-->
<!-- @click="handleExport">导出-->
<!-- </el-button>-->
</el-form-item>
</div>
</el-form>
<div class="placeholder" />
<div class="placeholder"/>
<div style="padding:5px 10px">
<div class="mb12 font-small-bold">意见反馈列表</div>
<el-table v-loading="loading" border :data="cmsFeedbackList" >
<el-table-column type="index" label="序号" width="55" align="center" />
<el-table v-loading="loading" border :data="cmsFeedbackList">
<el-table-column type="index" label="序号" width="55" align="center"/>
<el-table-column label="反馈类型" prop="feedbackType" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.feedbackType || '-' }}
<!-- {{ scope.row.feedbackType || '-' }}-->
{{ feedbackTypeMap[scope.row.feedbackType] || '-' }}
</template>
</el-table-column>
<el-table-column label="标题" prop="title" :show-overflow-tooltip="true">
<el-table-column label="标题" prop="title" width="400" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.title || '-' }}
</template>
......@@ -91,27 +86,32 @@
{{ scope.row.contact || '-' }}
</template>
</el-table-column>
<el-table-column width="120" label="状态" prop="flag">
<template slot-scope="scope">
<el-switch
v-model="scope.row.flag"
class="switchDisabledStyle"
inactive-value="0"
active-value="1"
@click.native="handleStatusChange(scope.row)"
/>
</template>
</el-table-column>
<el-table-column label="备注" prop="remarks" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.remarks || '-' }}
</template>
</el-table-column>
<el-table-column label="创建时间" prop="createDate" :show-overflow-tooltip="true">
<el-table-column label="提交时间" prop="submissionTime" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
{{ scope.row.submissionTime || '-' }}
</template>
</el-table-column>
<!-- <el-table-column width="120" label="状态" prop="flag">-->
<!-- <template slot-scope="scope">-->
<!-- <el-switch-->
<!-- v-model="scope.row.flag"-->
<!-- class="switchDisabledStyle"-->
<!-- inactive-value="0"-->
<!-- active-value="1"-->
<!-- @click.native="handleStatusChange(scope.row)"-->
<!-- />-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="备注" prop="remarks" :show-overflow-tooltip="true">-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.remarks || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="创建时间" prop="createDate" :show-overflow-tooltip="true">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="操作" class-name="small-padding fixed-width" width="200px">
<template slot-scope="scope">
<el-button
......@@ -119,44 +119,56 @@
:type="commonField.typeParent"
:size="commonField.size"
@click="handleUpdate(scope.row)"
>修改</el-button>
>详情
</el-button>
<el-button
:class="commonField.delClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleDelete(scope.row)"
>删除</el-button>
>删除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
<!-- 添加或修改意见反馈配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="750px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="反馈类型" prop="feedbackType">
<el-input v-model.trim="form.feedbackType" show-word-limit :maxlength="64" placeholder="请输入反馈类型" />
<el-select v-model="form.feedbackType" :disabled="isDisable" style="width: 100%" placeholder="请选择反馈类型">
<el-option
v-for="item in feedbackTypes"
:key="item.businessId"
:label="item.dictLabel"
:value="item.businessId.toString()">
</el-option>
</el-select>
<!-- <el-input v-model.trim="form.feedbackType" show-word-limit :maxlength="64" placeholder="请输入反馈类型"/>-->
</el-form-item>
<el-form-item label="标题" prop="title">
<el-input v-model.trim="form.title" show-word-limit :maxlength="255" placeholder="请输入标题" />
<el-input v-model.trim="form.title" :disabled="isDisable" show-word-limit :maxlength="255" placeholder="请输入标题"/>
</el-form-item>
<el-form-item label="联系方式" prop="contact">
<el-input v-model.trim="form.contact" show-word-limit :maxlength="255" placeholder="请输入联系方式" />
<el-input v-model.trim="form.contact" :disabled="isDisable" show-word-limit placeholder="请输入联系方式"/>
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="form.flag" :disabled="isDisable">
<el-radio label="1">启用</el-radio>
<el-radio label="0">停用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="form.flag">
<el-radio label="1">启用</el-radio>
<el-radio label="0">停用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model.trim="form.remarks" maxlength="200" show-word-limit type="textarea" placeholder="请输入内容" />
<el-input v-model.trim="form.remarks" :disabled="isDisable" maxlength="200" show-word-limit type="textarea"
placeholder="请输入内容"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
......@@ -174,8 +186,11 @@ import {
delCmsFeedback,
addCmsFeedback,
updateCmsFeedback,
exportCmsFeedback } from '@/api/courseManagement/cmsFeedback'
exportCmsFeedback,
listFeedbackTypes
} from '@/api/courseManagement/cmsFeedback'
import commonField from '@/utils/commonField'
export default {
name: 'CmsFeedback',
data() {
......@@ -201,6 +216,8 @@ export default {
dictValue: '0'
}
],
//表单是否禁用
isDisable:false,
// 查询参数
queryParams: {
page: 1,
......@@ -210,18 +227,19 @@ export default {
contact: undefined,
flag: ''
},
feedbackTypes: [],
// 表单参数
form: {},
// 表单校验
rules: {
feedbackType: [
{ required: true, message: '请输入反馈类型', trigger: 'blur' }
{required: true, message: '请输入反馈类型', trigger: 'blur'}
],
title: [
{ required: true, message: '请输入标题', trigger: 'blur' }
{required: true, message: '请输入标题', trigger: 'blur'}
],
contact: [
{ required: true, message: '请输入联系方式', trigger: 'blur' }
{required: true, message: '请输入联系方式', trigger: 'blur'}
]
}
}
......@@ -229,21 +247,36 @@ export default {
computed: {
commonField() {
return commonField
}
},
// 创建一个映射对象,用于快速查找反馈类型的显示值
feedbackTypeMap() {
const map = {};
this.feedbackTypes.forEach(item => {
map[item.businessId] = item.dictLabel;
});
return map;
},
},
created() {
this.getList() // 列表查询
this.getFeedbackTypes()
},
methods: {
/** 查询意见反馈列表 */
getList() {
this.loading = true
listCmsFeedback(this.queryParams).then(
response => {
this.cmsFeedbackList = response.rows
this.total = response.total
this.loading = false
}
response => {
this.cmsFeedbackList = response.rows
this.total = response.total
this.loading = false
}
)
},
getFeedbackTypes() {
listFeedbackTypes().then(response => {
this.feedbackTypes = response.data
}
)
},
// 取消按钮
......@@ -282,19 +315,28 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
this.isDisable=false
this.reset()
this.open = true
this.title = '添加意见反馈'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.businessId
getCmsFeedback(id).then(response => {
this.form = response.data
this.open = true
this.title = '修改意见反馈'
this.$router.push({
path: '/courseInformation/feedback/info/index',
query: {
isOperation: '1',
bussinessId: row.businessId
}
})
// this.isDisable=true
// this.reset()
// const id = row.businessId
// getCmsFeedback(id).then(response => {
// this.form = response.data
// this.open = true
// this.title = '意见反馈详情'
// })
},
// 改变状态
handleStatusChange(row) {
......@@ -303,19 +345,21 @@ export default {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
}).then(function () {
return updateCmsFeedback(row)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
}).catch(function() {
}).catch(function () {
row.flag = row.flag === '0' ? '1' : '0'
})
},
/** 提交按钮 */
submitForm: function() {
submitForm: function () {
// this.open=falsethis.reset()
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
......@@ -341,7 +385,7 @@ export default {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
}).then(function () {
return delCmsFeedback(id)
}).then(() => {
this.getList()
......@@ -349,7 +393,7 @@ export default {
message: '删除成功',
type: 'success'
})
}).catch(function() {
}).catch(function () {
})
},
/** 导出按钮操作 */
......@@ -359,7 +403,7 @@ export default {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
}).then(function () {
return exportCmsFeedback(queryParams).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
......@@ -377,14 +421,14 @@ export default {
}
</script>
<style lang="scss" scoped>
.app-container {
font-size: 18px;
padding: 0;
.app-container {
font-size: 18px;
padding: 0;
.placeholder {
height: 1.3vh;
background-color: #F4F4F4;
margin-bottom: 10px
}
}
}
</style>
<template>
<div class="shiftInformation_update">
<div class="updateContainer">
<div class="updateBoby">
<el-form ref="deviceFormRef" :model="form" :rules="rules" label-position="right" label-width="auto">
<el-row>
<el-col :span="18">
<el-form-item
label="反馈类型:"
prop="title"
:rules="{ required: !(controls.isOperation === '3'), message: '请输入标题', trigger: 'blur' }"
>
<el-radio-group v-model="form.feedbackType" v-for="item in feedbackTypes">
<el-radio :label="item.businessId">item.dictLabel</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18">
<el-form-item
label="标题:"
prop="title"
:rules="{ required: !(controls.isOperation === '3'), message: '请输入标题', trigger: 'blur' }"
>
<el-input
v-model.trim="form.title"
:disabled="secondFromDisabled"
placeholder="请输入标题"
size="small"
class="normalInput"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18" >
<el-form-item label="详情描述:" prop="remarks">
<vue-editor id="editorsay" v-model="form.details" :editor-toolbar="customToolbar" @image-added="handleImageAdded" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18" >
<el-form-item label="上传附件:" prop="remarks">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">支持格式:.jpg .png .zip,文件大小不能超过10M</div>
</el-upload>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18" >
<el-form-item label="联系方式:" prop="remarks">
<el-input
v-model.trim="form.title"
:disabled="secondFromDisabled"
placeholder="手机号码/QQ/邮箱"
size="small"
class="normalInput"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18" >
<!-- 按钮区 -->
<div class="btn-box">
<el-form-item >
<el-button v-if="controls.isOperation !== '3'" type="primary" @click="submit">提交建议
</el-button>
<!-- <el-button @click="goBack">返回</el-button>-->
</el-form-item>
</div>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
</template>
<script >
import {
listCmsFeedback,
getCmsFeedback,
delCmsFeedback,
addCmsFeedback,
updateCmsFeedback,
exportCmsFeedback,
listFeedbackTypes
} from '@/api/courseManagement/cmsFeedback'
import { VueEditor } from 'vue2-editor'
import { uploadPublic } from '@/api/contentManagement/sysContest'
export default {
components: {
VueEditor
},
data() {
return {
imagePath: 'http://49.232.167.247:20020/eduServer/',
businessId: null,
// 变更字段存储数组
formChanges: [],
// 反馈类型
feedbackTypes:[],
customToolbar: [
['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线 -----['bold', 'italic', 'underline', 'strike']
['blockquote', 'code-block'], // 引用 代码块-----['blockquote', 'code-block']
[{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表-----[{ list: 'ordered' }, { list: 'bullet' }]
[{ header: 1 }, { header: 2 }],
[{ script: 'sub' }, { script: 'super' }], // 上标/下标-----[{ script: 'sub' }, { script: 'super' }]
[{ indent: '-1' }, { indent: '+1' }],
[{ size: [] }], // 配置字号
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题-----[{ header: [1, 2, 3, 4, 5, 6, false] }]
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色-----[{ color: [] }, { background: [] }]
[{ font: [] }], // 显示字体选择
[{ align: [] }], // 对齐方式-----[{ align: [] }]
['clean'], // 清除文本格式-----['clean']
['image'] // 链接、图片、视频-----['link', 'image', 'video']
],
imageUrl: '',
// 控制表单
controls: {
// 1:代表新增 2:代表编辑 3:代表查看
isOperation: '1'
},
fileUpload: '/dev-api/common/fileUpload?file=' + this.file + '&temp=' + 'newsInformation',
// 提交表单
form: {
// 主表id
businessId: undefined,
createBy: undefined,
createDate: undefined,
deptId: undefined,
deptTwoId: undefined,
equipmentName: undefined,
flag: undefined,
photoossId: undefined,
remarks: undefined,
weight: undefined
},
// 状态
statusOptions: [
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '0'
}
],
// 校验规则
rules: {
startDateS: [],
endDateS: []
}
}
},
computed: {
// 第一种禁用情况 1.查看的情况
secondFromDisabled() {
return (this.controls.isOperation === '3')
}
},
mounted() {
this.businessId = this.$route.query.bussinessId
},
created() {
this.getIsOperation()
this.getFeedbackTypes()
this.getDetail()
},
methods: {
getFeedbackTypes() {
listFeedbackTypes().then(response => {
this.feedbackTypes = response.data
}
)
},
/**
* @description: 处理上传接口
* @author: gaoyu
* @param:
* @return:
**/
handleUpload(file) {
const formData = new FormData()
formData.append('file', file.file)
formData.append('temp', 'newInformation')
uploadPublic(formData).then(res => {
this.form.pictureId = res.data.businessId
this.imageUrl = this.imagePath + res.data.path
})
},
handleImageAdded: function(file, Editor, cursorLocation, reseter) {
// var formData = new FormData()
// formData.append('image', file)
// $http.post(this.$common.baseUrl + 'upload/image', formData).then(res => {
// const data = res.body
// if (data.code == 200) {
// const url = data.data.url
// Editor.insertEmbed(cursorLocation, 'image', url)
// resetUploader()
// } else { }
// })
},
// 查询详情
getDetail() {
console.log('查询详情')
if (this.$route.query.bussinessId) {
getCmsFeedback(this.$route.query.bussinessId).then(res => {
console.log('res', res.data)
if (res.code === 200) {
this.form = res.data
// this.imageUrl = this.imagePath + res.data.path
}
})
}
},
handleAvatarSuccess(res, file) {
console.log('res', res)
this.imageUrl = URL.createObjectURL(file.raw)
this.form.pictureId = res.data.businessId
},
beforeAvatarUpload(file) {
// 判断文件是否为图片类型
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2
if (!isJPG) {
this.$message.error('只能上传图片格式的文件!')
return false
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 2MB!')
return false
}
this.file = file
},
goBack() {
this.$router.push({
path: '/contentManagement/newsInformation/index'
})
},
// 判断要进行什么操作 isOperation值 1:新增 2:编辑 3:查看
getIsOperation() {
if (this.$route.query.isOperation) {
this.controls.isOperation = this.$route.query.isOperation
}
},
// 保存方法
submit() {
// 拷贝form
const form = JSON.parse(JSON.stringify(this.form))
// 转换时间格式
form.releaseDate =
this.$refs.deviceFormRef.validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
// 编辑
updateSysContentNewsInformation(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.$router.push({
path: '/contentManagement/newsInformation/index'
})
}
})
} else {
// 新增
addSysContentNewsInformation(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.$router.push({
path: '/contentManagement/newsInformation/index'
})
}
})
}
}
})
}
}
}
</script>
<style scoped lang="scss">
::v-deep.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
::v-deep.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
::v-deep.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
::v-deep.avatar {
width: 178px;
height: 178px;
display: block;
}
.btn-box{
margin-top: 30px;
margin-bottom: 30px;
//position: absolute;
//bottom: 50px;
}
.shiftInformation_update {
background-color: rgba(243, 243, 255, 1);
width: 98%;
margin-left: 1%;
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-evenly;
.normalInput {
width: 100%;
background: #F9F9F9;
border-radius: 5px;
}
.topTitle {
margin-left: 1%;
}
.updateContainer {
width: 100%;
border-radius: 6px;
.updateBoby {
margin-left: 12%;
width: 100%;
}
}
.buttonArea {
justify-content: end;
align-items: end;
display: flex;
height: 500px;
width: 82%;
.alter {
border-radius: 6px;
background-color: rgba(52, 51, 153, 1);
color: rgba(255, 255, 255, 1);
font-size: 14px;
}
.Back {
border-radius: 6px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(52, 51, 153, 1);
color: rgba(52, 51, 153, 1)
}
}
.applicationDialog {
.right-section {
margin-left: 20px;
}
.left-scrollable-area{
overflow: auto;
height: 170px;
}
.scrollable-area{
overflow: auto;
height: 213px;
}
.left-section {
width: 98%;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment