This commit is contained in:
parent
283a00e305
commit
367ada1f7a
|
@ -1,17 +1,17 @@
|
|||
<template>
|
||||
<el-dialog title="新增大屏" :visible.sync="dialogVisible" width="30%" @close="close">
|
||||
<el-dialog :title="FormTitle" :visible.sync="dialogVisible" width="30%" @close="close">
|
||||
<el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="150px" class="form">
|
||||
<el-row :gutter="20" style="margin-top: 40px;margin-bottom: 60px;">
|
||||
<el-col :span="24" style="margin-bottom: 40px;">
|
||||
<el-col :span="24" style="margin-top: 40px;">
|
||||
<el-form-item label="大屏名称" prop="reportName">
|
||||
<el-input v-model="ruleForm.reportName" placeholder="请输入大屏名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item label="大屏编码" prop="reportCode">
|
||||
<el-input v-model="ruleForm.reportCode" placeholder="请输入唯一编码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-col> -->
|
||||
</el-row>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
|
@ -20,11 +20,26 @@
|
|||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import { addReport } from "@/api/report";
|
||||
import { addReport, editReport } from "@/api/report";
|
||||
export default {
|
||||
name: 'addReportPage',
|
||||
props: {
|
||||
item: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if(this.item.reportCode == undefined || this.item.reportCode == ''){
|
||||
this.FormTitle = '新增大屏'
|
||||
}else{
|
||||
this.FormTitle = '修改大屏'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
newProductName: '',
|
||||
|
@ -36,13 +51,14 @@ export default {
|
|||
protocolName: '',
|
||||
remark: ''
|
||||
},
|
||||
FormTitle: '',
|
||||
rules: {
|
||||
reportName: [
|
||||
{ required: true, message: '请输入大屏名称', trigger: 'blur' }
|
||||
],
|
||||
reportCode: [
|
||||
{ required: true, message: '请输入大屏编码', trigger: 'blur' }
|
||||
]
|
||||
// reportCode: [
|
||||
// { required: true, message: '请输入大屏编码', trigger: 'blur' }
|
||||
// ]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -54,31 +70,49 @@ export default {
|
|||
// 提交表单
|
||||
submitForm() {
|
||||
this.$refs['ruleForm'].validate(valid => {
|
||||
console.log(this.item.reportCode)
|
||||
if (valid) {
|
||||
let obj = {
|
||||
reportCode: this.ruleForm.reportCode,
|
||||
reportGroup: "default",
|
||||
reportName: this.ruleForm.reportName,
|
||||
reportType: "report_screen"
|
||||
}
|
||||
console.log(obj)
|
||||
addReport(obj).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '新增成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.close()
|
||||
if (this.item.reportCode == undefined || this.item.reportCode == '') {
|
||||
let obj = {
|
||||
reportCode: Math.random().toString(36).substr(2, 9) + Date.now(),
|
||||
reportGroup: "default",
|
||||
reportName: this.ruleForm.reportName,
|
||||
reportType: "report_screen"
|
||||
}
|
||||
})
|
||||
console.log(1, obj)
|
||||
addReport(obj).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '新增成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
else {
|
||||
console.log(this.item.reportCode)
|
||||
this.item.reportName = this.ruleForm.reportName
|
||||
console.log(2, this.item)
|
||||
editReport(this.item).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '修改成功!',
|
||||
type: 'success'
|
||||
})
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/deep/label {
|
||||
font-weight: 500;
|
||||
|
@ -95,5 +129,4 @@ export default {
|
|||
/deep/.el-dialog__body {
|
||||
padding-top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</style>
|
|
@ -15,11 +15,6 @@
|
|||
<el-input v-model="params.reportName" size="mini" clearable placeholder="名称" class="filter-item" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
|
||||
<el-form-item label="报表编码">
|
||||
<el-input v-model="params.reportCode" size="mini" clearable placeholder="报表编码" class="filter-item" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4">
|
||||
<el-button type="primary" size="mini" @click="search('form')">查询</el-button>
|
||||
<el-button type="danger" size="mini" @click="reset('form')">重置</el-button>
|
||||
|
@ -27,21 +22,28 @@
|
|||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<div class="center">
|
||||
<el-row :gutter="20">
|
||||
<el-col v-for="item in list" :key="item.id" :span="6">
|
||||
<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">
|
||||
<header>{{ item.reportName }}</header>
|
||||
<header>
|
||||
{{ item.reportName }}
|
||||
</header>
|
||||
<div style="text-align: center;">
|
||||
<el-button icon="el-icon-edit-outline" @click="addReport(item)" style="font-size: 15px;color:white;"
|
||||
type="text">修改</el-button>
|
||||
</div>
|
||||
<footer>
|
||||
<div class="operation">
|
||||
<el-button icon="el-icon-delete" class="delete" type="text" @click="deleteReport(item)" />
|
||||
<el-button icon="el-icon-view" class="view" type="text" @click="viewDesign(item)" />
|
||||
<el-button icon="el-icon-edit" class="edit" type="text" @click="openDesign(item)" />
|
||||
<el-button icon="el-icon-delete" class="delete" type="text" @click="deleteReport(item)">删除</el-button>
|
||||
<el-button icon="el-icon-view" class="view" type="text" @click="viewDesign(item)">查看</el-button>
|
||||
<el-button icon="el-icon-edit" class="edit" type="text" @click="openDesign(item)">编辑</el-button>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
@ -54,7 +56,7 @@
|
|||
@size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
||||
</div>
|
||||
</div>
|
||||
<addReportPage v-if="addVisible" @close="reportClose" />
|
||||
<addReportPage v-if="addVisible" :item="currentItem" @close="reportClose" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -83,6 +85,7 @@ export default {
|
|||
sort: "update_time"
|
||||
},
|
||||
addVisible: false,
|
||||
currentItem: null, // 用于保存当前的item数据
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
@ -102,7 +105,8 @@ export default {
|
|||
});
|
||||
},
|
||||
// 新增
|
||||
addReport() {
|
||||
addReport(item) {
|
||||
this.currentItem = item; // 保存当前的item数据
|
||||
this.addVisible = true;
|
||||
},
|
||||
// 关闭表单的回调
|
||||
|
@ -238,17 +242,17 @@ export default {
|
|||
header {
|
||||
font-size: 32px;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-top: 20px;
|
||||
margin-top: 10px;
|
||||
min-height: 400px;
|
||||
height: 100%;
|
||||
|
||||
.bg {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
height: 250px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin: 10px 0;
|
||||
|
@ -259,6 +263,7 @@ export default {
|
|||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-size: cover;
|
||||
filter: blur(6px);
|
||||
z-index: 2;
|
||||
}
|
||||
|
@ -297,7 +302,7 @@ export default {
|
|||
|
||||
.block {
|
||||
position: relative;
|
||||
bottom: 0;
|
||||
bottom: 0;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue