| | |
| | | <el-row> |
| | | <!-- 列表模块 --> |
| | | <el-table ref="table" v-loading="loading" :size="option.size" @selection-change="selectionChange" :data="data" |
| | | style="width: 100%" |
| | | :border="option.border"> |
| | | style="width: 100%" :border="option.border"> |
| | | <el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column> |
| | | <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column> |
| | | <el-table-column v-if="option.index" label="#" type="index" width="50" align="center"> |
| | | </el-table-column> |
| | | <template v-for="(item,index) in option.column"> |
| | | <!-- table字段 --> |
| | | <el-table-column v-if="item.hide!==true" |
| | | :prop="item.prop" |
| | | :label="item.label" |
| | | :width="item.width" |
| | | :key="index"> |
| | | <el-table-column v-if="item.hide!==true" :prop="item.prop" :label="item.label" :width="item.width" |
| | | :key="index"> |
| | | </el-table-column> |
| | | </template> |
| | | <!-- 操作栏模块 --> |
| | |
| | | </el-row> |
| | | <el-row> |
| | | <!-- 分页模块 --> |
| | | <el-pagination |
| | | align="right" background |
| | | @size-change="sizeChange" |
| | | @current-change="currentChange" |
| | | :current-page="page.currentPage" |
| | | :page-sizes="[10, 20, 30, 40, 50, 100]" |
| | | :page-size="page.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="page.total"> |
| | | <el-pagination align="right" background @size-change="sizeChange" @current-change="currentChange" |
| | | :current-page="page.currentPage" :page-sizes="[10, 20, 30, 40, 50, 100]" :page-size="page.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" :total="page.total"> |
| | | </el-pagination> |
| | | </el-row> |
| | | <!-- 表单模块 --> |
| | |
| | | </el-form> |
| | | <!-- 表单按钮 --> |
| | | <span v-if="!view" slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" icon="el-icon-circle-check" :size="option.size" @click="handleSubmit">提 交</el-button> |
| | | <el-button type="primary" icon="el-icon-circle-check" :size="option.size" @click="handleSubmit">提 |
| | | 交</el-button> |
| | | <el-button icon="el-icon-circle-close" :size="option.size" @click="box = false">取 消</el-button> |
| | | </span> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import {getList, getDetail, add, update, remove} from "@/api/discuss/publicDiscuss"; |
| | | import { |
| | | getList, |
| | | getDetail, |
| | | add, |
| | | // update, |
| | | // remove |
| | | } from "@/api/discuss/publicDiscuss"; |
| | | import option from "@/option/discuss/publicDiscuss"; |
| | | import {mapGetters} from "vuex"; |
| | | import {getDictionary} from '@/api/system/dict' |
| | | import { |
| | | mapGetters |
| | | } from "vuex"; |
| | | import { |
| | | getDictionary |
| | | } from '@/api/system/dict' |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | // 弹框标题 |
| | | title: '', |
| | | // 是否展示弹框 |
| | | box: false, |
| | | // 是否显示查询 |
| | | search: true, |
| | | // 加载中 |
| | | loading: true, |
| | | // 是否为查看模式 |
| | | view: false, |
| | | // 查询信息 |
| | | query: {}, |
| | | // 分页信息 |
| | | page: { |
| | | currentPage: 1, |
| | | pageSize: 10, |
| | | total: 40 |
| | | export default { |
| | | data() { |
| | | return { |
| | | // 弹框标题 |
| | | title: '', |
| | | // 是否展示弹框 |
| | | box: false, |
| | | // 是否显示查询 |
| | | search: true, |
| | | // 加载中 |
| | | loading: true, |
| | | // 是否为查看模式 |
| | | view: false, |
| | | // 查询信息 |
| | | query: {}, |
| | | // 分页信息 |
| | | page: { |
| | | currentPage: 1, |
| | | pageSize: 10, |
| | | total: 40 |
| | | }, |
| | | // 表单数据 |
| | | form: {}, |
| | | // 选择行 |
| | | selectionList: [], |
| | | // 表单配置 |
| | | option: option, |
| | | // 表单列表 |
| | | data: [], |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.init(); |
| | | this.onLoad(this.page); |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["permission"]), |
| | | ids() { |
| | | let ids = []; |
| | | this.selectionList.forEach(ele => { |
| | | ids.push(ele.id); |
| | | }); |
| | | return ids.join(","); |
| | | } |
| | | }, |
| | | methods: { |
| | | init() {}, |
| | | searchHide() { |
| | | this.search = !this.search; |
| | | }, |
| | | // 表单数据 |
| | | form: {}, |
| | | // 选择行 |
| | | selectionList: [], |
| | | // 表单配置 |
| | | option: option, |
| | | // 表单列表 |
| | | data: [], |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.init(); |
| | | this.onLoad(this.page); |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["permission"]), |
| | | ids() { |
| | | let ids = []; |
| | | this.selectionList.forEach(ele => { |
| | | ids.push(ele.id); |
| | | }); |
| | | return ids.join(","); |
| | | } |
| | | }, |
| | | methods: { |
| | | init() { |
| | | }, |
| | | searchHide() { |
| | | this.search = !this.search; |
| | | }, |
| | | searchChange() { |
| | | this.onLoad(this.page); |
| | | }, |
| | | searchReset() { |
| | | this.query = {}; |
| | | this.page.currentPage = 1; |
| | | this.onLoad(this.page); |
| | | }, |
| | | handleSubmit() { |
| | | if (!this.form.id) { |
| | | add(this.form).then(() => { |
| | | this.box = false; |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | searchChange() { |
| | | this.onLoad(this.page); |
| | | }, |
| | | searchReset() { |
| | | this.query = {}; |
| | | this.page.currentPage = 1; |
| | | this.onLoad(this.page); |
| | | }, |
| | | handleSubmit() { |
| | | if (!this.form.id) { |
| | | add(this.form).then(() => { |
| | | this.box = false; |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }); |
| | | }); |
| | | } else { |
| | | // update(this.form).then(() => { |
| | | // this.box = false; |
| | | // this.onLoad(this.page); |
| | | // this.$message({ |
| | | // type: "success", |
| | | // message: "操作成功!" |
| | | // }); |
| | | // }) |
| | | } |
| | | }, |
| | | handleAdd() { |
| | | this.title = '新增' |
| | | this.form = {} |
| | | this.box = true |
| | | }, |
| | | handleEdit(row) { |
| | | this.title = '编辑' |
| | | this.box = true |
| | | getDetail(row.id).then(res => { |
| | | this.form = res.data.data; |
| | | }); |
| | | } else { |
| | | update(this.form).then(() => { |
| | | this.box = false; |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }, |
| | | handleView(row) { |
| | | this.title = '查看' |
| | | this.view = true; |
| | | this.box = true; |
| | | getDetail(row.id).then(res => { |
| | | this.form = res.data.data; |
| | | }); |
| | | }, |
| | | handleDelete() { |
| | | if (this.selectionList.length === 0) { |
| | | this.$message.warning("请选择至少一条数据"); |
| | | return; |
| | | } |
| | | this.$confirm("确定将选择数据删除?", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | // return remove(this.ids); |
| | | }) |
| | | .then(() => { |
| | | this.selectionClear(); |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }); |
| | | }); |
| | | }) |
| | | } |
| | | }, |
| | | handleAdd() { |
| | | this.title = '新增' |
| | | this.form = {} |
| | | this.box = true |
| | | }, |
| | | handleEdit(row) { |
| | | this.title = '编辑' |
| | | this.box = true |
| | | getDetail(row.id).then(res => { |
| | | this.form = res.data.data; |
| | | }); |
| | | }, |
| | | handleView(row) { |
| | | this.title = '查看' |
| | | this.view = true; |
| | | this.box = true; |
| | | getDetail(row.id).then(res => { |
| | | this.form = res.data.data; |
| | | }); |
| | | }, |
| | | handleDelete() { |
| | | if (this.selectionList.length === 0) { |
| | | this.$message.warning("请选择至少一条数据"); |
| | | return; |
| | | } |
| | | this.$confirm("确定将选择数据删除?", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | return remove(this.ids); |
| | | }) |
| | | .then(() => { |
| | | }, |
| | | rowDel(row) { |
| | | this.$confirm("确定将选择数据删除?", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | // return remove(row.id); |
| | | }) |
| | | .then(() => { |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }); |
| | | }); |
| | | }, |
| | | beforeClose(done) { |
| | | done() |
| | | this.form = {}; |
| | | this.view = false; |
| | | }, |
| | | selectionChange(list) { |
| | | this.selectionList = list; |
| | | }, |
| | | selectionClear() { |
| | | this.selectionList = []; |
| | | this.$refs.table.clearSelection(); |
| | | }, |
| | | currentChange(currentPage) { |
| | | this.page.currentPage = currentPage; |
| | | this.onLoad(this.page); |
| | | }, |
| | | sizeChange(pageSize) { |
| | | this.page.pageSize = pageSize; |
| | | this.onLoad(this.page); |
| | | }, |
| | | onLoad(page, params = {}) { |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => { |
| | | const data = res.data.data; |
| | | this.page.total = data.total; |
| | | this.data = data.records; |
| | | this.loading = false; |
| | | this.selectionClear(); |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }); |
| | | }); |
| | | }, |
| | | rowDel(row) { |
| | | this.$confirm("确定将选择数据删除?", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | return remove(row.id); |
| | | }) |
| | | .then(() => { |
| | | this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | | message: "操作成功!" |
| | | }); |
| | | }); |
| | | }, |
| | | beforeClose(done) { |
| | | done() |
| | | this.form = {}; |
| | | this.view = false; |
| | | }, |
| | | selectionChange(list) { |
| | | this.selectionList = list; |
| | | }, |
| | | selectionClear() { |
| | | this.selectionList = []; |
| | | this.$refs.table.clearSelection(); |
| | | }, |
| | | currentChange(currentPage) { |
| | | this.page.currentPage = currentPage; |
| | | this.onLoad(this.page); |
| | | }, |
| | | sizeChange(pageSize) { |
| | | this.page.pageSize = pageSize; |
| | | this.onLoad(this.page); |
| | | }, |
| | | onLoad(page, params = {}) { |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => { |
| | | const data = res.data.data; |
| | | this.page.total = data.total; |
| | | this.data = data.records; |
| | | this.loading = false; |
| | | this.selectionClear(); |
| | | }); |
| | | } |
| | | } |
| | | } |
| | | }; |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .el-pagination { |
| | | margin-top: 20px; |
| | | } |
| | | </style> |
| | | .el-pagination { |
| | | margin-top: 20px; |
| | | } |
| | | </style> |