| | |
| | | import {changeFilterEvent} from "@/hook" |
| | | import request from "@/utils/request" |
| | | import exportExcel from "@/hook/exportExcel" |
| | | import {addListener,exportData} from "@/hook/mouseMove" |
| | | import deepClone from "@/utils/deepClone"; |
| | | import {ElMessage} from "element-plus"; |
| | | import * as XLSX from "xlsx"; |
| | | const xGrid = ref() |
| | | let filterData = ref({}) |
| | | const gridOptions = reactive({ |
| | |
| | | mode: 'row', |
| | | showStatus: true |
| | | },//表头参数 |
| | | columns:[ |
| | | menuConfig: { |
| | | body: { |
| | | options: [ |
| | | [ |
| | | |
| | | { code: 'exportExcelChecked', name: '导出选中', prefixIcon: 'vxe-icon-download', visible: true } |
| | | ] |
| | | ] |
| | | } |
| | | }, |
| | | columns:[ |
| | | |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | |
| | | } |
| | | |
| | | }) |
| | | const gridEvents = { |
| | | menuClick ({ menu, row, column }) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (menu.code) { |
| | | case 'exportExcelChecked': { |
| | | let result = exportData() |
| | | if(result){ |
| | | // 将数据转换为 worksheet 对象 |
| | | const worksheet = XLSX.utils.aoa_to_sheet(result); |
| | | const workbook = XLSX.utils.book_new(); |
| | | XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1'); |
| | | XLSX.writeFile(workbook, 'data.xlsx'); |
| | | } |
| | | break |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | const props = defineProps({ |
| | |
| | | onMounted(() => { |
| | | gridOptions.columns = props.childrenData.columns |
| | | getReportData() |
| | | addListener(xGrid.value,gridOptions) |
| | | |
| | | |
| | | }) |
| | |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | > |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row }"> |
| | |
| | | height: calc(100% - 30px); |
| | | |
| | | } |
| | | |
| | | .vxe-grid { |
| | | /* 禁用浏览器默认选中 */ |
| | | -webkit-user-select: none; |
| | | -moz-user-select: none; |
| | | -ms-user-select: none; |
| | | user-select: none; |
| | | } |
| | | :deep(#product .el-dialog__body){ |
| | | height: 90%; |
| | | width: 100%; |
| | | } |
| | | </style> |