业务需求:
表单里有一个数组,数组可以添加规则,每个规则都有一个有效期,结束时间可以不选,即长期有效。
多条规则时, 有时间冲突的时间要设置对应的优先级,没有冲突的不能设置
情况1:都选择结束时间,有冲突的就设置优先级,无则不设置
情况2:有的不选择结束时间,有冲突设置优先级,无则不设置
逻辑:用一个全新拷贝出来的数据----全部转标准时间----排序----比较(前一个的开始时间 <= 后一个结束时间:有冲突 )----- 添加到新数组里/不重叠创建新数组并添加进去---遍历总数组----只有一个数的添加到result2(时间无冲突)里,否则添加到result(时间有冲突的)里并返回----拿到这两个数组,对result添加组号和其他操作----转成组件识别的时间格式-----把相关的值赋值给表单数据-----校验是否填写优先级---设置一个变量值,控制true/false-----是否发送请求
// 处理时间的方法, 返回两个数组
// 将日期冲突数据抽出并组成新的数组 const checkTableData = () => {
// 拿到表单里绑定的时间对象的数据 let tableList = formData.value.calculationMethodList // 深拷贝,使用一个全新对象,避免双向绑定修改原数据 let newList = JSON.parse(JSON.stringify(tableList)) newList.forEach((item: any) => { item.effectiveDate = new Date(item.effectiveDate) // 是否是长期 if (item.expirationDate) { item.expirationDate = new Date(item.expirationDate) } else { item.expirationDate = new Date('9999-01-01') } }) // 根据起始时间对时间段进行排序 newList.sort((tr1: any, tr2: any) => tr1.effectiveDate - tr2.effectiveDate); const overlappingGroups = []; // 排序完后的第一条数据,即起始时间最小的 let currentGroup = [newList[0]]; // 从第二项开始遍历 for (let i = 1; i < newList.length; i++) { // item const currentRange = newList[i]; let isOverlapping = false; for (let j = 0; j < currentGroup.length; j++) { const previousRange = currentGroup[j]; if (currentRange.effectiveDate <= previousRange.expirationDate) { // 检测到重叠时间段,将其添加到结果列表中 isOverlapping = true; break; } } if (isOverlapping) { // 时间段重叠,将当前时间段添加到当前分组 currentGroup.push(currentRange); } else { // 时间段不重叠,将当前分组添加到结果数组,并创建新的分组 overlappingGroups.push([...currentGroup]); currentGroup = [currentRange]; } } // 添加最后一个分组到结果数组 overlappingGroups.push(currentGroup); let result = []; let result2 = [] for (let i = 0; i < overlappingGroups.length; i++) { if (overlappingGroups[i].length > 1) { result.push(overlappingGroups[i]); } else { result2.push(overlappingGroups[i]) } } return {result, result2}; }
// 对时间进行分组
const conduct = () => { // 整理分组,未包含无冲突的数据 const {result, result2} = checkTableData() const overlappingGroups = result; const allRightGroup = result2 canSubmit.value = true if (overlappingGroups.length > 0) { overlappingGroups.forEach((group, index) => { // 添加分组标识 group.forEach(range => { // 遍历每个组 range.group = index + 1 range.effectiveDate = dayjs(range.effectiveDate).format('YYYY-MM-DD') range.expirationDate = dayjs(range.expirationDate).format('YYYY-MM-DD').includes('9999') ? null : dayjs(range.expirationDate).format('YYYY-MM-DD') formData.value.calculationMethodList.forEach((formItem: any) => { if (range.expirationDate === formItem.expirationDate && range.effectiveDate === formItem.effectiveDate) { // 设置组号 formItem.group = range.group // 设置优先级最大值 formItem.maxPriority = group.length formItem.editPriority = false } }) }); if (index) { // 检验是否都填写优先级 if (!group.every(range => range.priority)) { canSubmit.value = false ElMessage.error(`第${index + 1}组有时间冲突,未设置设置优先级`) } else { // 都填写优先级,但最大值有误 if (group.every(range => range.priority > group.length + 1)) { canSubmit.value = false ElMessage.error(`第${index + 1}组优先级最大值有误,请重新配置`) } else { canSubmit.value = true } } } }); } else { formData.value.calculationMethodList.forEach(item => { item.group = null item.editPriority = true }) } if (allRightGroup.length > 0) { allRightGroup.forEach((group, index) => { group.forEach(range => { range.effectiveDate = dayjs(range.effectiveDate).format('YYYY-MM-DD') range.expirationDate = dayjs(range.expirationDate).format('YYYY-MM-DD').includes('9999') ? null : dayjs(range.expirationDate).format('YYYY-MM-DD') formData.value.calculationMethodList.forEach((formItem: any) => { if (range.expirationDate === formItem.expirationDate && range.effectiveDate === formItem.effectiveDate) { // 设置组号 formItem.group = null // 设置优先级最大值 formItem.maxPriority = null formItem.editPriority = true } }) }) }) } formData.value.calculationMethodList.forEach(item => { if (!item.group) { item.priority = null item.editPriority = true } }) }