|
@@ -0,0 +1,125 @@
|
|
|
|
+<template>
|
|
|
|
+ <div id="reportData">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" class="reportData">
|
|
|
|
+ <el-table :data="tableData" style="width: 100%" border>
|
|
|
|
+ <el-table-column label="序号" type="index" width="50" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="title" label="名称" width="80" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="url" label="相关链接" width="130" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="startDate" label="开始时间" width="" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="endDate" label="结束时间" width="" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="content" label="简述" width="" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column prop="state" label="目前状态" width="" align="left"> </el-table-column>
|
|
|
|
+ <el-table-column label="状态操作" width="" align="left">
|
|
|
|
+ <template slot-scope=""> <el-link :underline="false">开启</el-link> <el-link :underline="false">结束</el-link> </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column label="操作" width="200" align="left">
|
|
|
|
+ <template slot-scope="scoped">
|
|
|
|
+ <el-button size="mini" type="primary" icon="el-icon-view" @click="openDialog(scoped.$index)"></el-button>
|
|
|
|
+ <el-button size="mini" type="primary" icon="el-icon-edit" @click="addData(scoped.$index)"></el-button>
|
|
|
|
+ <el-button size="mini" type="danger" icon="el-icon-delete" @click.native.prevent="deleteRow(scoped.$index, tableData)"></el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ <el-col :span="24" class="page">
|
|
|
|
+ <el-pagination
|
|
|
|
+ @size-change="handleSizeChange"
|
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
|
+ :current-page="currentPage"
|
|
|
|
+ layout="total, prev, pager, next, jumper"
|
|
|
|
+ :total="1"
|
|
|
|
+ >
|
|
|
|
+ </el-pagination>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-dialog title="详细信息" :visible.sync="dialog">
|
|
|
|
+ <p class="text">名称:{{ info.title }}</p>
|
|
|
|
+ <p class="text">开始时间:{{ info.startDate }}</p>
|
|
|
|
+ <p class="text">结束时间:{{ info.endDate }}</p>
|
|
|
|
+ <p class="text">相关链接:{{ info.url }}</p>
|
|
|
|
+ <p class="text">
|
|
|
|
+ 简述:
|
|
|
|
+ <span>{{ info.content }}</span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="text">状态:{{ info.state }}</p>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+export default {
|
|
|
|
+ name: 'reportData',
|
|
|
|
+ props: {
|
|
|
|
+ tableData: null,
|
|
|
|
+ },
|
|
|
|
+ components: {},
|
|
|
|
+ data: () => ({
|
|
|
|
+ currentPage: 1,
|
|
|
|
+ dialog: false,
|
|
|
|
+ info: {},
|
|
|
|
+ pic: require('@/assets/logo.png'),
|
|
|
|
+ }),
|
|
|
|
+ created() {},
|
|
|
|
+ computed: {},
|
|
|
|
+ methods: {
|
|
|
|
+ handleSizeChange(val) {
|
|
|
|
+ console.log(`每页 ${val} 条`);
|
|
|
|
+ },
|
|
|
|
+ handleCurrentChange(val) {
|
|
|
|
+ console.log(`当前页: ${val}`);
|
|
|
|
+ },
|
|
|
|
+ addData(index) {
|
|
|
|
+ if (index !== undefined) {
|
|
|
|
+ let data = this.tableData[index];
|
|
|
|
+ } else {
|
|
|
|
+ this.form = {};
|
|
|
|
+ }
|
|
|
|
+ this.$router.push({ path: './detail' });
|
|
|
|
+ },
|
|
|
|
+ deleteRow(index, rows) {
|
|
|
|
+ rows.splice(index, 1);
|
|
|
|
+ },
|
|
|
|
+ openDialog(index) {
|
|
|
|
+ if (index !== undefined) {
|
|
|
|
+ let data = JSON.parse(JSON.stringify(this.tableData[index]));
|
|
|
|
+ data[`index`] = index;
|
|
|
|
+ this.$set(this, `info`, data);
|
|
|
|
+ }
|
|
|
|
+ this.dialog = true;
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less" scoped>
|
|
|
|
+p {
|
|
|
|
+ padding: 0;
|
|
|
|
+ margin: 0;
|
|
|
|
+}
|
|
|
|
+/deep/.el-table th {
|
|
|
|
+ padding: 5px 0;
|
|
|
|
+ background: #f2f2f2;
|
|
|
|
+}
|
|
|
|
+/deep/.el-table td {
|
|
|
|
+ padding: 5px 0;
|
|
|
|
+}
|
|
|
|
+/deep/.el-table tr {
|
|
|
|
+ background: #f9f9f9;
|
|
|
|
+}
|
|
|
|
+/deep/.el-table tr:nth-child(2n) {
|
|
|
|
+ background: #fff;
|
|
|
|
+}
|
|
|
|
+.page {
|
|
|
|
+ text-align: center;
|
|
|
|
+ padding: 30px 0;
|
|
|
|
+}
|
|
|
|
+.text {
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ padding: 0 0 10px 0;
|
|
|
|
+}
|
|
|
|
+.text span {
|
|
|
|
+ display: inherit;
|
|
|
|
+ text-indent: 1rem;
|
|
|
|
+}
|
|
|
|
+</style>
|