update 基本完成报表“

src/views/modules/monitoring/reportDetail.vue

@@ -120,12 +120,20 @@ export default {
 						{ prop: 'createTime', name: '创建时间', width: 200 },
 						{ prop: 'fileName', name: '报表名称' },
 						{ 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 }) {
+			console.log('operation data: ', data)
 			let id = data
 			switch (type) {
 				case 'change-category':
@@ -134,6 +142,21 @@ export default {
 					return this.addOrUpdateHandle(id)
 				case 'delete':
 					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 }) {

src/views/modules/monitoring/reportPreview.vue

@@ -7,14 +7,16 @@
 -->
 <template>
 	<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" />
 	</div>
 </template>
 <script>
+import SmallTitle from '@/components/small-title'
+
 export default {
-	components: {},
+	components: { SmallTitle },
 	props: {},
 	data() {
 		return {