zhangjy
4 years ago
18 changed files with 672 additions and 117 deletions
@ -0,0 +1,151 @@
|
||||
<template> |
||||
<div class="edit_container" v-loading="loading"> |
||||
<div class="btn"> |
||||
<el-input |
||||
style="width: 200px;margin-right: 10px;" |
||||
v-model="messageTitle" |
||||
placeholder="请输入消息标题" |
||||
></el-input> |
||||
<el-button @click="save" type="primary" |
||||
>保存</el-button |
||||
> |
||||
<el-button @click="back" |
||||
>返回</el-button |
||||
> |
||||
</div> |
||||
<!-- 新增时输入 --> |
||||
<quill-editor |
||||
v-model="content" |
||||
ref="myQuillEditor" |
||||
:options="editorOption" |
||||
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)" |
||||
@change="onEditorChange($event)"> |
||||
</quill-editor> |
||||
<!-- 从数据库读取展示 --> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import {newMessage,getMessage,editMessage} from "./api/api"; |
||||
import { quillEditor } from "vue-quill-editor"; //调用编辑器 |
||||
import 'quill/dist/quill.core.css'; |
||||
import 'quill/dist/quill.snow.css'; |
||||
import 'quill/dist/quill.bubble.css'; |
||||
export default { |
||||
components: { |
||||
quillEditor |
||||
}, |
||||
data() { |
||||
return { |
||||
loading:false, |
||||
content: ``, |
||||
messageTitle:'', |
||||
str: '', |
||||
isEdit:false, |
||||
myHtml:'', |
||||
editorOption: { |
||||
placeholder: "请在这里输入", |
||||
modules:{ |
||||
toolbar:[ |
||||
['bold', 'italic', 'underline', 'strike'], //加粗，斜体，下划线，删除线 |
||||
['blockquote', 'code-block'], //引用，代码块 |
||||
[{ 'header': 1 }, { 'header': 2 }], // 标题，键值对的形式；1、2表示字体大小 |
||||
[{ 'list': 'ordered'}, { 'list': 'bullet' }], //列表 |
||||
[{ 'script': 'sub'}, { 'script': 'super' }], // 上下标 |
||||
[{ 'indent': '-1'}, { 'indent': '+1' }], // 缩进 |
||||
[{ 'direction': 'rtl' }], // 文本方向 |
||||
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小 |
||||
[{ 'header': [1, 2, 3, 4, 5, 6, false] }], //几级标题 |
||||
[{ 'color': [] }, { 'background': [] }], // 字体颜色，字体背景颜色 |
||||
[{ 'align': [] }], //对齐方式 |
||||
['clean'], //清除字体样式 |
||||
] |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
created() { |
||||
this.$route.query.isEditOr=='true'?this.isEdit=true:this.isEdit=false; |
||||
if (this.isEdit){ |
||||
this.loading=true; |
||||
getMessage(this.$route.query.data).then(res=>{ |
||||
this.content=res.data.data.messageContent |
||||
this.myHtml=res.data.data.messageContent; |
||||
this.messageTitle=res.data.data.messageTitle; |
||||
this.id=res.data.data.messageId; |
||||
this.loading=false; |
||||
// this.escapeStringHTML(this.content) |
||||
}) |
||||
} |
||||
}, |
||||
methods: { |
||||
onEditorReady(editor) { // 准备编辑器 |
||||
|
||||
}, |
||||
onEditorBlur(){}, // 失去焦点事件 |
||||
onEditorFocus(){}, // 获得焦点事件 |
||||
onEditorChange(e){ |
||||
this.myHtml=e.html; |
||||
}, // 内容改变事件 |
||||
// 转码 |
||||
escapeStringHTML(str) { |
||||
str = str.replace(/<\/?.+?>/g, ""); |
||||
return str; |
||||
}, |
||||
back(){ |
||||
window.history.back() |
||||
}, |
||||
save(){ |
||||
if (!this.messageTitle){ |
||||
this.$message.error("请先输入消息标题"); |
||||
return false |
||||
} |
||||
let data={ |
||||
messageTitle:this.messageTitle, |
||||
messageContent:this.myHtml, |
||||
} |
||||
if (this.isEdit){ |
||||
this.$set(data,'messageId',this.id) |
||||
editMessage(data).then(res=>{ |
||||
if (res.data.success){ |
||||
this.$message("保存成功"); |
||||
window.history.back() |
||||
}else { |
||||
this.$message.error("保存失败"); |
||||
} |
||||
}) |
||||
}else { |
||||
newMessage(data).then(res=>{ |
||||
if (res.data.success){ |
||||
this.$message("保存成功"); |
||||
window.history.back() |
||||
}else { |
||||
this.$message.error("保存失败"); |
||||
} |
||||
}) |
||||
} |
||||
} |
||||
}, |
||||
computed: { |
||||
editor() { |
||||
return this.$refs.myQuillEditor.quill; |
||||
}, |
||||
}, |
||||
mounted() { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
<style scoped> |
||||
.edit_container{ |
||||
position: relative; |
||||
} |
||||
.btn{ |
||||
height: 80px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-end; |
||||
padding: 0 30px; |
||||
border-top: 1px solid #ccc; |
||||
background-color: white; |
||||
} |
||||
</style> |
||||
@ -1,15 +1,206 @@
|
||||
<template> |
||||
<div> |
||||
5555 |
||||
<div class="normal_page"> |
||||
<div class="page_search"> |
||||
<div> |
||||
<el-form :inline="true" :model="searchForm" class="demo-form-inline"> |
||||
<el-form-item label="联系人："> |
||||
<el-input |
||||
v-model="searchForm.contact" |
||||
placeholder="请输入" |
||||
></el-input> |
||||
</el-form-item> |
||||
<!-- <el-form-item label="联系方式：">--> |
||||
<!-- <el-input--> |
||||
<!-- v-model="searchForm.contactDetail"--> |
||||
<!-- placeholder="请输入"--> |
||||
<!-- ></el-input>--> |
||||
<!-- </el-form-item>--> |
||||
<el-form-item> |
||||
<el-button type="primary" @click="onSubmit">查询</el-button> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button @click="onReset">重置</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
</div> |
||||
<div class="page_content"> |
||||
<div class="page_content_head"> |
||||
<div style="display: flex; justify-content: space-between"> |
||||
<div class="page_content_head_left"> |
||||
<div>意见反馈</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="page_content_table"> |
||||
<el-table |
||||
:data="tableData" |
||||
border |
||||
style="width: 100%" |
||||
v-loading="loading" |
||||
> |
||||
<el-table-column |
||||
v-for="(item, index) in cols" |
||||
:key="index" |
||||
:prop="item.prop" |
||||
:label="item.label" |
||||
:width="item.width" |
||||
:fixed="item.fixed" |
||||
show-overflow-tooltip |
||||
> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="page_page"> |
||||
<el-pagination |
||||
@size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 20, 30, 40]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.total" |
||||
> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import {feedBackList} from "./api/api"; |
||||
|
||||
export default { |
||||
name: "feedBack" |
||||
} |
||||
</script> |
||||
name: "BigData", |
||||
data() { |
||||
return { |
||||
searchForm: { |
||||
// 公告序号 |
||||
contact: "", |
||||
// 地块编号 |
||||
contactDetail: "", |
||||
}, |
||||
tableData: [], |
||||
// 列 |
||||
cols: [ |
||||
{ |
||||
label: "序号", |
||||
prop: "feedbackId", |
||||
width: 150, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
label: "联系人", |
||||
prop: "contact", |
||||
width: 150, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
label: "联系方式", |
||||
prop: "contactDetail", |
||||
width: 150, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
label: "反馈意见", |
||||
prop: "suggestion", |
||||
}, |
||||
{ |
||||
label: "附件", |
||||
prop: "attachment", |
||||
width: 150, |
||||
}, |
||||
], |
||||
// 表格加载 |
||||
loading: true, |
||||
// 选中的数据 |
||||
selectedData: [], |
||||
page: { |
||||
total: 0, // 总页数 |
||||
currentPage: 1, // 当前页数 |
||||
pageSize: 10, // 每页显示多少条 |
||||
}, |
||||
// 只读 |
||||
readOnly: true, |
||||
// 有选中数据 |
||||
hasSelectData: false, |
||||
// 编辑或新增窗口 |
||||
dialogFormVisible: false, |
||||
dialogTitle: "新增数据", |
||||
// 编辑Form |
||||
editForm: {}, |
||||
}; |
||||
}, |
||||
methods: { |
||||
|
||||
// 查询 |
||||
onSubmit() { |
||||
this.loading = true; |
||||
let param = Object.assign( |
||||
{ |
||||
current: this.page.currentPage, |
||||
size: this.page.pageSize, |
||||
}, |
||||
this.searchForm |
||||
); |
||||
feedBackList(param).then((response) => { |
||||
this.tableData = response.data.data.records; |
||||
this.page.total = response.data.data.total; |
||||
this.loading = false; |
||||
}); |
||||
}, |
||||
|
||||
// 重置 |
||||
onReset() { |
||||
for (let item in this.searchForm) { |
||||
this.searchForm[item] = ""; |
||||
} |
||||
}, |
||||
|
||||
handleSizeChange(val) { |
||||
this.page.pageSize = val; |
||||
this.onSubmit() |
||||
}, |
||||
|
||||
<style scoped> |
||||
handleCurrentChange(val) { |
||||
this.page.currentPage = val; |
||||
this.onSubmit() |
||||
}, |
||||
|
||||
// 新建 |
||||
newItem() { |
||||
this.$router.push({path:'/company/auction/insert',query:{readOnly:'false',isEditOr:'false',}}); |
||||
}, |
||||
|
||||
// 编辑 |
||||
editItem(row) { |
||||
let data=JSON.stringify(row) |
||||
this.$router.push({path:'/company/auction/insert',query:{readOnly:'false',isEditOr:'true',data:data}}); |
||||
}, |
||||
|
||||
// 删除单个 |
||||
delItem(row) { |
||||
delData(row.data_id).then((res) => { |
||||
console.debug(res); |
||||
}); |
||||
}, |
||||
|
||||
// 查看 |
||||
viewItem(row) { |
||||
let data=JSON.stringify(row) |
||||
this.$router.push({path:'/company/auction/insert',query:{readOnly:'true',isEditOr:'false',data:data}}); |
||||
}, |
||||
|
||||
}, |
||||
mounted() { |
||||
this.onSubmit(); |
||||
}, |
||||
}; |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
// 公共样式 |
||||
@import "@/styles/public.scss"; |
||||
/deep/ .el-input { |
||||
width: 90%; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue