关于自己操作cool-admin的一些记录，持续更新

使用cool-admin版本。vue3 和 node 版本。

excel导入导出

导出

<!-- 导出 -->
<cl-export-btn :columns="Table?.columns" />

导入

// -----------------vue3---------------------------------------

<!-- 导入   /用户导入模版.xlsx  在public文件夹中，有其他的导入模板放在里边就可以-->
<cl-import-btn template="/用户导入模版.xlsx" :on-submit="onSubmit" />


import { ref } from "vue";
import { ElMessage } from "element-plus";
const { service, refs, setRefs } = useCool();


function onSubmit(data: any, { done, close }) {

		let { file, filename, list } = data;
		const formattedData = mapExcelData(list);
		service.base.user.importData({
			"plats": formattedData
		},{
			headers: {
				'Content-Type': 'application/json'
			}
		}).then(() => {
			ElMessage.success("导入成功");
			close();
			Crud.value?.refresh();
		}).catch((err) => {
			ElMessage.error(err.message);
			done();
		})
	}
// 定义字段映射关系
	const fieldMap = {
		'平台名称': 'name',
		'备注': 'mark'
	};

	// 创建一个函数来转换 Excel 数据
	function mapExcelData(data) {
		return data.map(item => {
			const mappedItem = {};
			for (const key in item) {
				// 使用映射关系替换 key
				const mappedKey = fieldMap[key];
				if (mappedKey) {
					mappedItem[mappedKey] = item[key];
				}
			}
			return mappedItem;
		});
	}
	
// -----------------node---------------------------------------

//  service 自己导入
@Post('/importData', { summary: '批量导入' })
  async importData(@Body('users') users: any[]) {
    const resultStr = await this.*****Service.addUsers(plats);
    return this.ok(resultStr);
  }

 async addUsers(plats: any[]){

    var totalNum = plats.length;
    var successNum = 0;
    var failNum = 0;

   const results = await Promise.all(plats.map(async (element) => {
      const addResult = await this.BaseEntity.save(element);
      
      if (addResult.id) {
          successNum++;
      } else {
          failNum++;
      }
    }))
    
    return `导入数据共${totalNum}条数据，成功${successNum}条，失败${failNum}条`;
  }

表格中图片展示不全

{
	prop: "platImg",
	label: "LOGO",
	// 格子宽度
	width: 300,
	component: {
		name: "cl-image",
		props: {
			//图片展示  value值可参考 https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
			fit: "contain",
			lazy: true
		}
	}
}

导入带时间

cool自带的导入时间显示的都是 距离1900年1月1日的天数。不是很友好。所以需要优化。以下是优化的代码：

页面上：
<cl-import-btn  
         :on-submit="transferImport"  
          :size="bizTopInputSize" 
          template="/账户模板.xlsx" 
          :dateFields="['退币时间']"
      />
      //其中  :dateFields="['退币时间']"  是新加入的。 把是时间的标题写进去。当遇到这个标题的所有列数据都会重新计算

组件上：
//  组件位置：cool-admin-vue\src\plugins\excel\components\import-btn.vue
//找到  const props = defineProps({   这一行，在里边加入 
const props = defineProps({
	...cool自带的,
	dateFields: {
		type: Array as PropType<string[]>,
		default: () => []
	}
})
	
// 找到 reader.onload = (event: any)  大约在275行左右
方法中的 ：for (const sheet in workbook.Sheets) {  只修改这个for循环里边的内容

let json: any[] = [];  //自带
for (const sheet in workbook.Sheets) { //自带
	if (has(workbook.Sheets, sheet)) {
		let sheetData = XLSX.utils.sheet_to_json(workbook.Sheets[sheet]);
		if(props.dateFields.length > 0){
			sheetData.map(item => {
				Object.keys(item).forEach(key => {
					if (props.dateFields.includes(key)) {
						item[key] =  formattedDate(item[key]);
					}
				})
			})
		}
		 //自带的应该是 json = json.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
		json = json.concat(sheetData);
	}
}

其他的不用动