yangchunlong/orico-supplier-ts-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 🧩 修复打印条件表格row颜色渲染不正确

Browse Source
This commit is contained in:
yangchunlong
2025-08-11 17:42:58 +08:00
parent e23037fb23
commit 3185a66f8c
7 changed files with 143 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/api/index.ts
View File

@@ -161,7 +161,6 @@ class RequestHttp {
const { response } = error;
tryHideFullScreenLoading();
console.log("12323232323s ss");
// 请求超时 && 网络错误单独判断，没有 response
if (error.message.indexOf("timeout") !== -1) ElMessage.error("请求超时！请您稍后重试");
if (error.message.indexOf("Network Error") !== -1) ElMessage.error("网络错误！请您稍后重试");

65
src/api/modules/barCode.ts
View File

@@ -37,61 +37,18 @@ export const getListApi = (params: Record<string, any>) => {
};
//产品条码列表
export const getCodeListApi = (params: Record<string, any>) => {
// console.log(params);
// return {
// totalCount: 300,
// data: [
// {
// materialNumber: "G01-43-552867",
// materialName: "7口USB3.0集线器",
// specifications: "ORICO-H7013-U3-AD-EU-BK-BP",
// old_Specifications: "",
// barCode: "6936761881968",
// serialNumber: "10FC-616M3R",
// twoSerialNumber: "10FC-616M3R-two",
// numberCode: "241224000417",
// id: 202593401,
// number: 300,
// isUse: false,
// isUseStr: "否",
// box: "",
// creator: "admin",
// createTime: "2024-12-24 10:27:05",
// printNumber: 0,
// downLoadNumber: 1,
// printTime: "",
// downLoadTime: "2025-01-08 16:11:39",
// isEnablePrint: true
// },
// {
// materialNumber: "G01-43-552867",
// materialName: "7口USB3.0集线器",
// specifications: "ORICO-H7013-U3-AD-EU-BK-BP",
// old_Specifications: "",
// barCode: "6936761881968",
// serialNumber: "10FC-616M3Q",
// twoSerialNumber: "10FC-616M3R-two",
// numberCode: "241224000416",
// id: 202593400,
// number: 300,
// isUse: false,
// isUseStr: "否",
// box: "",
// creator: "admin",
// createTime: "2024-12-24 10:27:05",
// printNumber: 0,
// downLoadNumber: 1,
// printTime: "",
// downLoadTime: "2025-01-08 16:11:39",
// isEnablePrint: true
// }
// ],
// isSuccess: true,
// status: 200,
// message: "Success"
// };
return http.post<ResPage<any>>(`SerialNumber/GetList`, params);
const { isDownLoad } = params;
return http.post<ResPage<any>>(`SerialNumber/GetList`, params, {
noLoading: isDownLoad
});
};
// export const getCodeList1Api = (params: Record<string, any>) => {
// return http.post<ResPage<any>>(`SerialNumber/GetList`, params, {
// noLoading: true
// });
// };
//转换规格型号 SerialNumber/UpdateMaterial
export const getUpdateMaterialApi = (params: Record<string, any>) => {
return http.post<ResPage<any>>(`SerialNumber/UpdateMaterial`, params);

11
src/components/ListBtns/components/Convert.vue
View File

@@ -38,7 +38,15 @@ const getTransferSn = (ids: any) => {
})
.catch(() => {});
};
//防止xss攻击
// const escapeHtml = (unsafe: any) => {
// return unsafe
// .replace(/&/g, "&amp;")
// .replace(/</g, "&lt;")
// .replace(/>/g, "&gt;")
// .replace(/"/g, "&quot;")
// .replace(/'/g, "&#039;");
// };
// 提交事件
const handleBtnClick = async () => {
if (!props.selectionList.length) {
@@ -111,7 +119,6 @@ const handleBtnClick = async () => {
}
});
const result: any = await getTransferSnJCApi({ ids: ids });
console.log(result, "===result==");
if (result.status === 200) {
getTransferSn(ids);
} else {

9
src/hooks/useTable.ts
View File

@@ -62,6 +62,9 @@ export const useTable = (
try {
// 先把初始化参数和分页参数放到总参数里面 initParam
Object.assign(state.totalParam, isPageable ? pageParam.value : {});
// console.log(state.searchInitParam, "=========state.searchInitParam===");
// console.log(initParam, "=========initParam===");
let { data, totalCount } = await api({ ...state.searchInitParam, ...initParam, ...state.totalParam });
state.tableData = data;
@@ -91,6 +94,7 @@ export const useTable = (
// 处理查询参数，可以给查询参数加自定义前缀操作
let nowSearchParam: Table.StateProps["searchParam"] = {};
// 防止手动清空输入框携带参数（这里可以自定义查询参数前缀）
for (let key in state.searchParam) {
//剔除日期参数
if (key !== "Time" && key !== "Time1") {
@@ -120,6 +124,10 @@ export const useTable = (
const search = () => {
state.pageable.pageNo = 1;
state.pageable.pageSize = 50;
if (routeName === "barCode") {
$Bus.emit("searchBarCodeSsDownLoad");
}
updatedTotalParam();
getTableList();
};
@@ -146,7 +154,6 @@ export const useTable = (
$Bus.emit("clearBoxMarkIndexCreator");
}
if (routeName === "antiCode") {
console.log("走到了这里?");
$Bus.emit("clearBoxAntiCodeCreator");
}
updatedTotalParam();

3
src/views/supplier/code/barCode/constant/printCode/search.ts
View File

@@ -132,5 +132,6 @@ export const PRINT_CODE_FORM_DATA: FormItem[] = [
export const PRINT_CODE_RULE_FORM_DATA = {
pageNo: 1,
pageSize: 50
pageSize: 50,
isDownLoad: false
};

126
src/views/supplier/code/barCode/index.vue
View File

@@ -290,6 +290,7 @@ import { PRINT_CODE_FORM_DATA, PRINT_CODE_RULE_FORM_DATA, PRINT_CODE_FORM_COLUMN
// 接口
import {
getCodeListApi,
// getCodeList1Api,
getSerialNumberDownLoadApi,
getPrintListCodeApi,
getListApi,
@@ -351,6 +352,7 @@ const datas = reactive<any>({
printCodeColumns: cloneDeep(PRINT_CODE_FORM_COLUMNS), //打印条码弹窗表格配置项
remoteSelectItem: {}, //转换规格的选中的数据
isSave: false, //生成条码保存按钮状态
// isDownLoad: false,
generateComplete: "", //条码生成状态,生成中的不可打印
jsonData: [], //批产条码数据
generateRecordId: null, //生成记录id
@@ -384,6 +386,8 @@ const codePrintSelection = (selection: any) => {
// 点击打印条码按钮进行赋值
const handlerPrintBarCode = (row: any) => {
datas.codePrintSelectionList = [];
resetVisibleGroups();
datas.printCodeRuleFormData.isDownLoad = false;
if (row.id) {
datas.printCodeRuleFormData.orgCode = userStore.orgCode;
datas.printCodeRuleFormData.generateRecordId = row.id;
@@ -393,22 +397,101 @@ const handlerPrintBarCode = (row: any) => {
datas.allPrintBtn = row.isTwo > 1 ? cloneDeep(ALL_PRINT_BTN) : cloneDeep(ALL_PRINT_BTN1);
}
};
// 全局组ID注册表（在组件生命周期内持久化）
// 用于记录所有组的唯一ID，确保跨筛选/刷新保持一致
const globalGroupRegistry = new Map<string, number>();
let globalNextGroupId = 0;
const tableRowClassName = ({ row, rowIndex }: { row: any; rowIndex: number }) => {
if (row.isTwo == 1) {
return "";
}
// 计算当前行所在的组（每组2行）
let groupIndex = Math.floor(rowIndex / 2);
// 临时组跟踪（仅用于当前渲染批次，记录可见组的顺序）
let visibleGroupOrder: string[] = [];
// 根据组索引的奇偶性决定使用哪种颜色
if (groupIndex % 2 === 0) {
return "warning-row";
} else {
return "success-row";
}
return "";
// 重置临时跟踪（筛选/分页时调用，保留全局注册表）
const resetVisibleGroups = () => {
visibleGroupOrder = [];
};
// // 生成组标识（与之前相同）
const getGroupKey = (row: any) => {
return JSON.stringify([row.serialNumber, row.twoSerialNumber].sort());
};
// 关键改进：跨筛选/刷新保持颜色交替的行样式函数
const tableRowClassName = ({ row }: { row: any }) => {
// 排除不需要着色的行
if (row.isTwo === 1) return "";
// 验证必要字段
if (!row.serialNumber || !row.twoSerialNumber) return "";
const groupKey = getGroupKey(row);
// 1. 全局注册组ID（首次出现时分配，永久不变）
if (!globalGroupRegistry.has(groupKey)) {
globalGroupRegistry.set(groupKey, globalNextGroupId);
globalNextGroupId++;
}
globalGroupRegistry.get(groupKey)!;
// 2. 跟踪当前可见组的出现顺序
if (!visibleGroupOrder.includes(groupKey)) {
visibleGroupOrder.push(groupKey);
}
const visibleIndex = visibleGroupOrder.indexOf(groupKey);
// 3. 基于可见顺序的索引分配颜色（确保当前视图内严格交替）
return visibleIndex % 2 === 0 ? "warning-row" : "success-row";
};
// // 新增：分组缓存管理
// const groupCache = new Map<string, { groupIndex: number; colorClass: string }>();
// let groupCounter = 0;
// // // 重置分组缓存（在表格数据变化时调用）
// const resetGroupCache = () => {
// groupCache.clear();
// groupCounter = 0;
// };
// const tableRowClassName = ({ row }: { row: any }) => {
// // 当isTwo为1时不应用颜色
// if (row.isTwo === 1) {
// return "";
// }
// // 确保serialNumber和twoSerialNumber存在
// if (!row.serialNumber || !row.twoSerialNumber) {
// return "";
// }
// // 生成唯一组标识（排序后拼接，确保A-B和B-A属于同一组）
// const groupKey = [row.serialNumber, row.twoSerialNumber].sort().join("-");
// // 如果该组已处理过，直接使用缓存的颜色
// if (groupCache.has(groupKey)) {
// return groupCache.get(groupKey)!.colorClass;
// }
// // 新组：分配组索引并确定颜色（偶数组红色，奇数组绿色）
// const groupIndex = groupCounter++;
// const colorClass = groupIndex % 2 === 0 ? "warning-row" : "success-row";
// // // 缓存该组信息
// groupCache.set(groupKey, { groupIndex, colorClass });
// return colorClass;
// // if (row.isTwo == 1) {
// // return "";
// // }
// // console.log(row, "============>");
// // // 计算当前行所在的组（每组2行）
// // let groupIndex = Math.floor(rowIndex / 2);
// // // 根据组索引的奇偶性决定使用哪种颜色
// // if (groupIndex % 2 === 0) {
// // return "warning-row";
// // } else {
// // return "success-row";
// // }
// // return "";
// };
// 删除文件
const handleRemoveFiles = () => {
datas.uploadProgress = "";
@@ -650,6 +733,7 @@ const handleSpecificationConfirm = async () => {
if (result.status === 200) {
if (result.isSuccess) {
useMsg("success", "规格转换成功 ！");
resetVisibleGroups();
printCodeTable.value.getTableList();
datas.specificationVisible = false;
handleSpecificationClose();
@@ -668,6 +752,7 @@ const handleSpecificationClose = () => {
datas.specificationList = [];
datas.specificationValue = "";
datas.remoteSelectItem = {};
datas.isDownLoad = false;
};
// 生成条码弹窗远程操作赋值(规格型号点击选择)
@@ -747,10 +832,12 @@ const handleCloseGenerateCode = () => {
// 条码列表下载
const getSerialNumberDownLoad = async () => {
datas.printCodeRuleFormData.isDownLoad = true;
if (!datas.codePrintSelectionList.length) {
useMsg("warning", "请选择需要下载的数据 ！");
return;
}
let serialNumbers: any[] = [];
let isTwo = datas.codePrintSelectionList[0].isTwo;
datas.codePrintSelectionList.forEach((item: any) => {
@@ -766,9 +853,12 @@ const getSerialNumberDownLoad = async () => {
});
if (result.status === 200 && result.isSuccess) {
useMsg("success", "导出成功请前往导出列表中进行下载 ！");
resetVisibleGroups();
printCodeTable.value.getTableList();
datas.printCodeRuleFormData.isDownLoad = false;
} else {
useMsg("warning", "导出失败,请稍后重试 ！");
datas.printCodeRuleFormData.isDownLoad = false;
}
};
@@ -779,6 +869,7 @@ const handleDown = () => {
// 打印记录接口
const getPrintListCode = async (params: any) => {
datas.printCodeRuleFormData.isDownLoad = false;
const result = await getPrintListCodeApi(params);
if (result.status === 200) {
printCodeTable!.value.getTableList();
@@ -885,12 +976,19 @@ onMounted(() => {
$Bus.on("clearBarCodeCreateUser", () => {
datas.ruleForm.createUser = "";
datas.initParam.createUser = "";
datas.printCodeRuleFormData.isDownLoad = false;
resetVisibleGroups();
});
$Bus.on("setBarCodeInputCreateUser", (params: any) => {
const { createUser } = params;
datas.ruleForm.createUser = createUser;
datas.initParam.createUser = createUser;
console.log("执行了吗");
});
//searchBarCodeSsDownLoad
$Bus.on("searchBarCodeSsDownLoad", () => {
datas.printCodeRuleFormData.isDownLoad = false;
resetVisibleGroups();
});
});
</script>

1
src/views/supplier/code/barCode/init/list/index.ts
View File

@@ -96,6 +96,7 @@ export const initRuleForm = (datas: any) => {
//顶部按钮事件
export const handleBtnClick = (result: any, datas: any, proTable: any) => {
const { type } = result;
console.log(type, "============>");
//生成条码
if (type === "Generate") {
datas.generateCodeVisible = true;