hookehuyr

处理同一字段多个规则情况

1 <!-- 1 <!--
2 * @Date: 2022-07-18 10:22:22 2 * @Date: 2022-07-18 10:22:22
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-02-22 16:32:46 4 + * @LastEditTime: 2024-03-13 10:06:21
5 * @FilePath: /data-table/src/views/index.vue 5 * @FilePath: /data-table/src/views/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -382,33 +382,84 @@ const checkUserPassword = () => { ...@@ -382,33 +382,84 @@ const checkUserPassword = () => {
382 } 382 }
383 } 383 }
384 384
385 +function mergeAndDeduplicate(data) {
386 + return data.reduce((acc, current) => {
387 + const existingItemIndex = acc.findIndex(item =>
388 + item.mode === current.mode && item.logical_op === current.logical_op
389 + );
390 +
391 + if (existingItemIndex !== -1) {
392 + // Merge expr_list values
393 + acc[existingItemIndex].expr_list = acc[existingItemIndex].expr_list.concat(current.expr_list);
394 + } else {
395 + // Push new item to the accumulator
396 + acc.push(current);
397 + }
398 +
399 + return acc;
400 + }, []).map(item => {
401 + // Remove duplicates from expr_list
402 + item.expr_list = item.expr_list.filter((expr, index, self) =>
403 + index === self.findIndex(e => (
404 + e.op === expr.op && JSON.stringify(e.values) === JSON.stringify(expr.values) && e.field_name === expr.field_name
405 + ))
406 + );
407 + return item;
408 + });
409 +}
410 +
385 // 根据规则隐藏相应字段 411 // 根据规则隐藏相应字段
386 const checkRules = () => { 412 const checkRules = () => {
387 const rule_list = formInfo.value['rule_list'] ? [...formInfo.value['rule_list']] : []; 413 const rule_list = formInfo.value['rule_list'] ? [...formInfo.value['rule_list']] : [];
414 + // TAG:处理同一字段多个规则情况
388 formData.value.forEach(item => { 415 formData.value.forEach(item => {
389 - // 给受作用的字段绑定判断规则 416 + item.x_rules = []; // 字段的规则
390 - // 规则失效需要踢出 417 + });
391 - rule_list.forEach(rule => { 418 +
419 + rule_list.forEach(rule => {
420 + formData.value.forEach(item => {
392 if (rule.field_names?.includes(item.key) && !rule.is_invalid) { 421 if (rule.field_names?.includes(item.key) && !rule.is_invalid) {
393 - item.field_rules = { 422 + // 匹配字段的规则集合
423 + item.x_rules.push({
394 mode: rule.mode, 424 mode: rule.mode,
395 logical_op: rule.logical_op, 425 logical_op: rule.logical_op,
396 expr_list: rule.expr_list, 426 expr_list: rule.expr_list,
397 - } 427 + })
398 } 428 }
399 - }); 429 + })
430 + });
431 +
432 + formData.value.forEach(item => {
433 + // 把规则合并,同一字段下的mode/logical_op必须一致
434 + item.field_rules = mergeAndDeduplicate(item.x_rules)[0];
435 + });
436 +
437 + formData.value.forEach(item => {
438 + // 给受作用的字段绑定判断规则
439 + // 规则失效需要踢出
440 + // rule_list.forEach(rule => {
441 + // if (rule.field_names?.includes(item.key) && !rule.is_invalid) {
442 + // item.field_rules = {
443 + // mode: rule.mode,
444 + // logical_op: rule.logical_op,
445 + // expr_list: rule.expr_list,
446 + // }
447 + // }
448 + // });
400 // 只检查存在规则的字段 449 // 只检查存在规则的字段
401 if (item.field_rules) { 450 if (item.field_rules) {
402 let condition = ''; 451 let condition = '';
403 // 多个规则的满足条件,为全且或者全或 452 // 多个规则的满足条件,为全且或者全或
404 const op = item.field_rules?.logical_op === 'AND' ? '&&' : '||'; 453 const op = item.field_rules?.logical_op === 'AND' ? '&&' : '||';
405 item.field_rules?.expr_list.forEach(expr => { 454 item.field_rules?.expr_list.forEach(expr => {
406 - if (typeof postData.value[expr['field_name']] === 'string') { // 表单值为字符串(单选,下拉) 455 + let form_submission_value = postData.value[expr['field_name']]; // 表单提交值, field_12 : "" || field_13 : []
407 - const k = !!expr['values'].includes(postData.value[expr['field_name']]) 456 + let rule_matching_value = expr['values']; // 规则匹配值 values : ['x']
408 - condition += `${k}${op}` 457 + if (typeof form_submission_value === 'string') { // 表单值为字符串(单选,下拉)
458 + const k = !!rule_matching_value.includes(form_submission_value); // 转换为布尔值
459 + condition += `${k}${op}`;
409 } 460 }
410 - if (typeof postData.value[expr['field_name']] === 'object') { // 表单值为数组(多选) 461 + if (typeof form_submission_value === 'object') { // 表单值为数组(多选)
411 - const k = !!(_.intersection(expr['values'], postData.value[expr['field_name']])).length; 462 + const k = !!(_.intersection(rule_matching_value, form_submission_value)).length; // 转换为布尔值
412 condition += `${k}${op}` 463 condition += `${k}${op}`
413 } 464 }
414 }); 465 });
...@@ -429,7 +480,7 @@ const checkRules = () => { ...@@ -429,7 +480,7 @@ const checkRules = () => {
429 } 480 }
430 item['component_props']['disabled'] = item.field_rules?.mode === 'SHOW' ? !condition : condition; 481 item['component_props']['disabled'] = item.field_rules?.mode === 'SHOW' ? !condition : condition;
431 } 482 }
432 - }) 483 + });
433 } 484 }
434 485
435 // 操作绑定自定义字段回调 486 // 操作绑定自定义字段回调
......