@unicom-blockchain/useful-tools v1.5.0

生成excel用法

<template>
  <el-table ref="tableRef" :data="tableData" style="width: 100%" border>
    <el-table-column prop="date" label="Date" width="180" />
    <el-table-column prop="name" label="Name" width="180" />
    <el-table-column prop="address" label="Address" />
  </el-table>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { useDownLoadExcel } from '@unicom-blockchain/useful-tools';
const tableRef = ref();
const tableData = [
  {
    date: '2016-05-03',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-02',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-04',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-01',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
];
const { downloadExcelFile } = useDownLoadExcel(tableRef);
setTimeout(() => {
  downloadExcelFile('test.xlsx', ['Address']);
}, 1000);
</script>

打印页面区域

<template>
  <el-table ref="tableRef" :data="tableData" style="width: 50%" border>
    <el-table-column prop="date" label="Date" width="180" />
    <el-table-column prop="name" label="Name" width="180" />
    <el-table-column prop="address" label="Address" />
  </el-table>
  <el-button @click="handlePrint">打印</el-button>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { printElement } from '@unicom-blockchain/useful-tools';
const src = ref();
const tableRef = ref();
const tableData = [
  {
    date: '2016-05-03',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-02',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-04',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-01',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
];
const { downloadExcelFile } = useDownLoadExcel(tableRef);
async function handlePrint() {
  const srcD = await printElement(tableRef, 'test', {
    color: 'red',
    width: '100vw',
    height: '100wh',
  });
  src.value = srcD;
}
</script>

超长自动显示tooltip组件用法

<template>
  <div style="display: flex; width: 100px">
    <overflowTip content="你好你好你你好">你好你好你</overflowTip>
  </div>
</template>

<script lang="ts" setup>
import { AutoOverflowTip } from '@unicom-blockchain/useful-tools';
</script>