update 基本完成报表“
This commit is contained in:
parent
a30e2e1ae2
commit
0b4433dd80
@ -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)
|
||||||
}
|
}
|
||||||
|
@ -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 }) {
|
||||||
|
@ -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 {
|
||||||
|
Loading…
Reference in New Issue
Block a user