qianlishi 3 years ago
parent 9c4a21017b
commit 539dcd2635

@ -90,6 +90,7 @@ a:hover {
.app-container { .app-container {
padding: 20px; padding: 20px;
background: #fff;
} }
.filter-container { .filter-container {
@ -317,34 +318,38 @@ a:hover {
// 'waterway': 'table-info', // 'waterway': 'table-info',
// 'airtransport': 'table-warning', // 'airtransport': 'table-warning',
// 'multimodal': 'table-danger' // 'multimodal': 'table-danger'
.table-primary,.table-success,.table-info,.table-warning,.table-danger{ .table-primary,
.table-success,
.table-info,
.table-warning,
.table-danger {
border-radius: 3px; border-radius: 3px;
padding: 2px 5px; padding: 2px 5px;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
} }
.table-primary { .table-primary {
background: rgba(32, 182, 249, .1); background: rgba(32, 182, 249, 0.1);
border-color: rgba(32, 182, 249, .2); border-color: rgba(32, 182, 249, 0.2);
color: rgb(32, 182, 249); color: rgb(32, 182, 249);
} }
.table-success { .table-success {
background: rgba(0, 226, 68, .1); background: rgba(0, 226, 68, 0.1);
border-color: rgba(0, 226, 68, 0.2); border-color: rgba(0, 226, 68, 0.2);
color: rgb(0, 226, 68); color: rgb(0, 226, 68);
} }
.table-info { .table-info {
background: rgba(216, 216, 216, .1); background: rgba(216, 216, 216, 0.1);
border-color: rgba(216, 216, 216, .2); border-color: rgba(216, 216, 216, 0.2);
color: rgb(216, 216, 216); color: rgb(216, 216, 216);
} }
.table-warning { .table-warning {
background: rgba(255, 216, 40, .1); background: rgba(255, 216, 40, 0.1);
border-color: rgba(255, 216, 40, .2); border-color: rgba(255, 216, 40, 0.2);
color: rgb(241, 185, 0); color: rgb(241, 185, 0);
} }
.table-danger { .table-danger {
background: rgba(249, 32, 32, .1); background: rgba(249, 32, 32, 0.1);
border-color: rgba(249, 32, 32, .2); border-color: rgba(249, 32, 32, 0.2);
color: rgb(249, 32, 32); color: rgb(249, 32, 32);
} }

@ -11,32 +11,81 @@
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4"> <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
<el-form-item label="名称"> <el-form-item label="名称">
<el-input v-model="params.reportName" size="mini" clearable placeholder="名称" class="filter-item" /> <el-input
v-model="params.reportName"
size="mini"
clearable
placeholder="名称"
class="filter-item"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4"> <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
<el-form-item label="报表编码"> <el-form-item label="报表编码">
<el-input v-model="params.reportCode" size="mini" clearable placeholder="报表编码" class="filter-item" /> <el-input
v-model="params.reportCode"
size="mini"
clearable
placeholder="报表编码"
class="filter-item"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4"> <el-col
<el-button type="primary" size="mini" @click="search('form')"></el-button> :xs="24"
<el-button type="danger" size="mini" @click="reset('form')"></el-button> :sm="20"
:md="4"
:lg="4"
:xl="4"
style="margin-top: 5px"
>
<el-button type="primary" size="mini" @click="search('form')"
>查询</el-button
>
<el-button type="danger" size="mini" @click="reset('form')"
>重置</el-button
>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col v-for="item in list" :key="item.id" :span="6"> <el-col v-for="item in list" :key="item.id" :span="6">
<div class="bg"> <div class="bg">
<img class="bg-img" :src="(item.reportImage == null || item.reportImage == '') ? require('../../../assets/images/charts.jpg') : item.reportImage" alt="" /> <img
class="bg-img"
:src="
item.reportImage == null || item.reportImage == ''
? require('../../../assets/images/charts.jpg')
: item.reportImage
"
alt=""
/>
<div class="content"> <div class="content">
<header>{{ item.reportName }}</header> <header>{{ item.reportName }}</header>
<footer> <footer>
{{ item.updateTime }} {{ item.updateTime }}
<div class="operation"> <div class="operation">
<el-button icon="el-icon-share" class="view" type="text" @click="share(item)" v-permission="'bigScreenManage:share'"/> <el-button
<el-button icon="el-icon-view" class="view" type="text" @click="viewDesign(item)" v-permission="'bigScreenManage:view'"/> icon="el-icon-share"
<el-button icon="el-icon-edit" class="edit" type="text" @click="openDesign(item)" v-permission="'bigScreenManage:design'"/> class="view"
type="text"
@click="share(item)"
v-permission="'bigScreenManage:share'"
/>
<el-button
icon="el-icon-view"
class="view"
type="text"
@click="viewDesign(item)"
v-permission="'bigScreenManage:view'"
/>
<el-button
icon="el-icon-edit"
class="edit"
type="text"
@click="openDesign(item)"
v-permission="'bigScreenManage:design'"
/>
</div> </div>
</footer> </footer>
</div> </div>
@ -44,17 +93,29 @@
</el-col> </el-col>
</el-row> </el-row>
<div class="block"> <div class="block">
<el-pagination :total="totalCount" :page-sizes="[8, 20, 50, 100]" :page-size="params.pageSize" :current-page="params.pageNumber" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> <el-pagination
:total="totalCount"
:page-sizes="[8, 20, 50, 100]"
:page-size="params.pageSize"
:current-page="params.pageNumber"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div> </div>
<Share :visib="visibleForShareDialog" :reportCode="reportCodeForShareDialog" @handleClose="visibleForShareDialog = false" /> <Share
:visib="visibleForShareDialog"
:reportCode="reportCodeForShareDialog"
@handleClose="visibleForShareDialog = false"
/>
</div> </div>
</template> </template>
<script> <script>
import Share from '@/views/report/report/components/share' import Share from "@/views/report/report/components/share";
import { reportPageList } from '@/api/report' import { reportPageList } from "@/api/report";
export default { export default {
name: 'Login', name: "Login",
components: { Share }, components: { Share },
data() { data() {
return { return {
@ -63,83 +124,83 @@ export default {
totalCount: 0, totalCount: 0,
totalPage: 0, totalPage: 0,
params: { params: {
reportCode: '', reportCode: "",
reportName: '', reportName: "",
// reportType: '', // reportType: '',
pageNumber: 1, pageNumber: 1,
pageSize: 8, pageSize: 8,
order: 'DESC', order: "DESC",
sort: 'update_time', sort: "update_time"
}, },
// //
visibleForShareDialog: false, visibleForShareDialog: false,
reportCodeForShareDialog: '', reportCodeForShareDialog: ""
} };
}, },
mounted() {}, mounted() {},
created() { created() {
this.queryByPage() this.queryByPage();
}, },
methods: { methods: {
// //
search() { search() {
this.params.pageNumber = 1 this.params.pageNumber = 1;
this.queryByPage() this.queryByPage();
}, },
// //
reset(formName) { reset(formName) {
this.$refs[formName].resetFields() this.$refs[formName].resetFields();
this.params.reportName = '' this.params.reportName = "";
this.params.reportCode = '' this.params.reportCode = "";
this.params.pageNumber = 1 this.params.pageNumber = 1;
this.queryByPage() this.queryByPage();
}, },
async queryByPage() { async queryByPage() {
const res = await reportPageList(this.params) const res = await reportPageList(this.params);
if (res.code != '200') return if (res.code != "200") return;
this.listLoading = true this.listLoading = true;
this.list = res.data.records this.list = res.data.records;
this.list.forEach((value) => { this.list.forEach(value => {
value['reportNameCode'] = value["reportNameCode"] =
value.reportName + '[' + value.reportCode + ']' value.reportName + "[" + value.reportCode + "]";
}) });
this.totalCount = res.data.total this.totalCount = res.data.total;
this.totalPage = res.data.pages this.totalPage = res.data.pages;
this.listLoading = false this.listLoading = false;
}, },
handleSizeChange(val) { handleSizeChange(val) {
this.params.pageSize = val this.params.pageSize = val;
this.queryByPage() this.queryByPage();
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.params.pageNumber = val this.params.pageNumber = val;
this.queryByPage() this.queryByPage();
}, },
// //
share(val) { share(val) {
this.reportCodeForShareDialog = val.reportCode this.reportCodeForShareDialog = val.reportCode;
this.visibleForShareDialog = true this.visibleForShareDialog = true;
}, },
openDesign(val) { openDesign(val) {
var routeUrl = this.$router.resolve({ var routeUrl = this.$router.resolve({
path: '/bigscreen/designer', path: "/bigscreen/designer",
query: { query: {
reportCode: val.reportCode, reportCode: val.reportCode,
reportId: val.id, reportId: val.id,
accessKey: val.accessKey, accessKey: val.accessKey
}, }
}) });
window.open(routeUrl.href, '_blank') window.open(routeUrl.href, "_blank");
}, },
viewDesign(val) { viewDesign(val) {
var routeUrl = this.$router.resolve({ var routeUrl = this.$router.resolve({
path: '/bigscreen/viewer', path: "/bigscreen/viewer",
query: { reportCode: val.reportCode }, query: { reportCode: val.reportCode }
}) });
window.open(routeUrl.href, '_blank') window.open(routeUrl.href, "_blank");
}, }
},
} }
};
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@ -147,6 +208,7 @@ export default {
padding: 20px; padding: 20px;
position: relative; position: relative;
height: auto; height: auto;
background: #fff;
header { header {
font-size: 24px; font-size: 24px;
text-align: center; text-align: center;

Loading…
Cancel
Save