update 基本完成报表“

This commit is contained in:
g7hoo 2022-08-22 11:26:57 +08:00
parent a30e2e1ae2
commit 0b4433dd80
3 changed files with 47 additions and 7 deletions

View File

@ -24,6 +24,8 @@ export default {
}, },
colors: { colors: {
delete: '#FF5454', delete: '#FF5454',
preview: '#f09843',
design: '#99089f'
// add more... // add more...
}, },
text: { text: {
@ -31,22 +33,35 @@ export default {
edit: '编辑', edit: '编辑',
detail: '详情', detail: '详情',
delete: '删除', delete: '删除',
viewAttr: '查看属性' viewAttr: '查看属性',
preview: '预览',
design: '设计'
// add more... // add more...
} }
} }
}, },
methods: { methods: {
// 发射事件 // 发射事件
emit(eventType) { emit(opt) {
this.$emit('emit-data', { type: eventType, data: this.injectData.head?.emitFullData ? this.injectData : this.injectData.id }) let emitFull = false
let eventType = 'default'
let customField
if (typeof opt === 'object') {
eventType = opt.name
customField = opt.emitField || 'id'
emitFull = opt.emitFull || false
} else {
eventType = opt
}
this.$emit('emit-data', { type: eventType, data: emitFull ? this.injectData : customField ? this.injectData[customField] : this.injectData.id })
} }
}, },
render: function (h) { render: function (h) {
let btns = [] let btns = []
for (const optionStr of this.injectData.head?.options) { for (const optionStr of this.injectData.head?.options) {
const optObj = typeof optionStr === 'object'
// btns.push(h('el-button', { props: { type: this.btnTypes[optionStr] } }, optionStr)) // btns.push(h('el-button', { props: { type: this.btnTypes[optionStr] } }, optionStr))
btns.push(h('el-button', { props: { type: 'text' }, style: { color: this.colors[optionStr] || '#409EFF' }, on: { click: this.emit.bind(null, optionStr) } }, this.text[optionStr])) btns.push(h('el-button', { props: { type: 'text' }, style: { color: optObj ? this.colors[optionStr.name] : this.colors[optionStr] || '#409EFF' }, on: { click: this.emit.bind(null, optionStr) } }, typeof optionStr === 'object' ? this.text[optionStr.name] : this.text[optionStr]))
} }
return h('span', null, btns) return h('span', null, btns)
} }

View File

@ -120,12 +120,20 @@ export default {
{ prop: 'createTime', name: '创建时间', width: 200 }, { prop: 'createTime', name: '创建时间', width: 200 },
{ prop: 'fileName', name: '报表名称' }, { prop: 'fileName', name: '报表名称' },
{ prop: 'category', name: '报表分类', subcomponent: CategoryList, options: categories }, { prop: 'category', name: '报表分类', subcomponent: CategoryList, options: categories },
{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['preview', 'design', 'edit', 'delete'] } {
prop: 'operations',
name: '操作',
fixed: 'right',
width: 180,
subcomponent: TableOperateComponent,
options: [{ name: 'preview', emitField: 'fileName' }, { name: 'design', emitField: 'name' }, 'edit', 'delete']
}
] ]
} }
}) })
}, },
handleOperations({ type, data }) { handleOperations({ type, data }) {
console.log('operation data: ', data)
let id = data let id = data
switch (type) { switch (type) {
case 'change-category': case 'change-category':
@ -134,6 +142,21 @@ export default {
return this.addOrUpdateHandle(id) return this.addOrUpdateHandle(id)
case 'delete': case 'delete':
return this.deleteHandle(id) return this.deleteHandle(id)
case 'design':
return this.$router.push({
name: 'monitoring-reportDesign',
query: {
// data emitField
name: data
}
})
case 'preview':
return this.$router.push({
name: 'monitoring-reportPreview',
query: {
name: data
}
})
} }
}, },
updateCategory({ id, fileName, categoryId }) { updateCategory({ id, fileName, categoryId }) {

View File

@ -7,14 +7,16 @@
--> -->
<template> <template>
<div v-loading="loading" :class="$style.container"> <div v-loading="loading" :class="$style.container">
<h1 >{{ $route.query.name }}</h1> <small-title :size="'md'" style="margin-bottom: 10px">报表名称{{ $route.query.name }}</small-title>
<iframe id="reportView" :class="$style.mainIframe" name="mainIframe" :src="url" frameborder="0" scrolling="auto" /> <iframe id="reportView" :class="$style.mainIframe" name="mainIframe" :src="url" frameborder="0" scrolling="auto" />
</div> </div>
</template> </template>
<script> <script>
import SmallTitle from '@/components/small-title'
export default { export default {
components: {}, components: { SmallTitle },
props: {}, props: {},
data() { data() {
return { return {