前端给所有数据批量加不重复id

这个名字很奇怪,因为是根据需求来的,讲实话,我遇到的这种需求也不常见。下面我来说是具体需求:领导要求我写一个问卷调查的页面,不过没有后台,所有的数据要前端自己写,页面如下:

90%以上都是这种单选题,其他也有一些下拉框、输入框、文本域等题目,本文主要针对这种单选题,我要手动把模块、题目、选项作为数据录入进来,我数了一下85题,这工作量。。。。。。

不管咋样,活安排了,就得干。。。。

首先分析了一下需要的数据结构,这个循环遍历的时候好用,要一个三维数组,结构根部节点的是模块,一共14个模块,接着下面一个节点是题目,最后一个节点是选项。分析完就开始录入数据,因为没有原始数据,只能一个一个复制粘贴,模块和题目都不一样,只能手动写,选项是一样的,只要写一个对象,留着备用就行:

1.按照三维数组的格式录入数据,这个是必须要录入的,因为每条数据都不一样:

// 需求:给所有数据批量加不重复id
      // 数据录入,要按照模板的格式录入
      var numArr = [
        {
          modularTitle: '一、流程设计:目标',
          modularList: [
            {
              title:
                '6.部门负责人能根据业务环境变化,及时进行流程的调整,使流程与实际业务/管理活动不脱节。'
              , radioList: []            }
            ,
            {
              title:
                '7.部门负责人关注所在部门的绩效改善,并在流程设计过程中与其他部门经理积极沟通。'
              , radioList: []            }
            ,
            {
              title:
                '8.设计流程的时候是否跟流程中涉及的其他部门进行充分的沟通协商,共同完成流程设计与优化。'
              , radioList: []            }
            ,
            {
              title:
                '9.流程是以提升业务流程的整体绩效,而非其中的局部绩效为原则进行设计和优化。'
              , radioList: []            }
            ,
            {
              title:
                '10.公司内部的所有流程之间能够保持很好的衔接,不存在重叠和冲突的情况。(不存在两个流程针对同一个事情,也不存在做事情没有流程或作业标准)'
              , radioList: []            }
            ,
            {
              title:
                '11.流程能够有效的用于指导相关IT系统的设计、并始终与IT系统的业务逻辑保持一致。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '二、流程设计:关联性',
          modularList: [
            {
              title: '12.作为流程的使用者,你获知流程的输入和输入。'
              , radioList: []
            },
            {
              title: '13.作为流程的使用者,你清楚流程的上下游流程。'
              , radioList: []
            },
            {
              title: '14.作为流程的使用者,你清楚流程的客户。'
              , radioList: []
            },
            {
              title:
                '15.有关联、存在对接的不同流程之间,多个流程责任人在跨流程的整体绩效上达成了共识。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '三、流程设计:文件',
          modularList: [
            {
              title: '16.流程文件主要按业务来进行组织和设计,并有流程架构。'
              , radioList: []
            },
            {
              title:
                '17.流程文件明确定义了公司内部执行该流程的各个部门之间的相互联系。'
              , radioList: []            }
            ,
            {
              title:
                '18.流程文件以业务或管理为主线,按照业务逐层细化和分解,进行组织和设计。'
              , radioList: []            }
            ,
            {
              title:
                '19.流程以需求的产生作为起点,以需求的满足作为终点进行设计。(例如:物料采购流程,以物料需求的产生为起点,以物料验收合格入库可用即物料需求的满足为终点)'
              , radioList: []            }
            ,
            {
              title:
                '20.采用了信息化手段来固化流程,以支持流程绩效监测,并便于流程管理。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '四、流程执行人:知识',
          modularList: [
            {
              title: '21.流程的执行人清楚的知道其参与的相关流程的名称。'
              , radioList: []
            },
            {
              title: '22.流程的执行人清楚的知道其参与的相关流程的流程绩效指标。'
              , radioList: []
            },
            {
              title: '23.流程的执行人能全面、完整的描述流程。'
              , radioList: []
            },
            {
              title:
                '24.流程的执行人清楚的知道自己的工作对客户以及流程中其他人员的影响。(你知道你的工作结果对其他部门的同事的影响)'
              , radioList: []            }
            ,
            {
              title: '25.流程的执行人清楚的知道其参与的相关流程的流程绩效水平。'
              , radioList: []
            },
            {
              title:
                '26.流程的执行人熟悉公司绩效的主要内容和驱动因素。(例如:公司的战略、目标和年度经营计划)'
              , radioList: []            }
            ,
            {
              title:
                '27.流程的执行人能够描述自身工作对公司绩效或其他流程绩效的影响。(你清楚自己的工作对公司整体绩效或者其他流程绩效的影响)'
              , radioList: []            }
            ,
            {
              title:
                '28.流程的执行人能够描述自身工作对公司与供应商或客户之间整体绩效的影响。(公司与客户、公司与供应商合作)'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '五、流程执行人:技能',
          modularList: [
            {
              title: '29.流程执行人具备问题解决的技巧。'
              , radioList: []
            },
            {
              title:
                '30.流程的执行人具备改善流程的技能,知晓如何去优化改进业务流程。'
              , radioList: []            }
            ,
            {
              title: '31.流程的执行人具备团队协作精神。'
              , radioList: []
            },
            {
              title: '32.流程执行人具备授权范围内的业务决策能力。'
              , radioList: []
            },
            {
              title:
                '33.流程的执行人具备变革管理的能力。(具备组织和领导业务流程提升和改变的能力)'
              , radioList: []            }
            ,
            {
              title: '34.流程的执行人具备有效实施变革的能力。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '六、流程执行人:行为',
          modularList: [
            {
              title: '35.流程的执行人对流程的执行效果/结果负责。'
              , radioList: []
            },
            {
              title:
                '36.流程的执行人会努力遵循流程的设计,正确地执行流程,按流程要求开展工作。'
              , radioList: []            }
            ,
            {
              title: '37.流程的执行人能尽力配合流程中的其他人有效开展工作。'
              , radioList: []
            },
            {
              title:
                '38.流程的执行人会努力达成流程结果,确保企业目标(公司目标)的实现。'
              , radioList: []            }
            ,
            {
              title:
                '39.流程的执行人善于发现流程变革的迹象。(你善于发现工作流程需要改进的地方)'
              , radioList: []            }
            ,
            {
              title: '40.流程的执行人能够根据流程变革的要求,提出改进方案。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '七、流程责任人:身份',
          modularList: [
            {
              title: '41.公司有专门的流程管理机构人员。'
              , radioList: []
            },
            {
              title: '42.流程责任人是正式的,常态化的角色,非临时指定。'
              , radioList: []
            },
            {
              title: '43.流程责任人的角色在公司层面得到了明确和详细的定义。'
              , radioList: []
            },
            {
              title:
                '44.流程责任人在时间分配、精力投入和个人绩效目标方面,将流程管理工作作为优先考虑对象。'
              , radioList: []            }
            ,
            {
              title:
                '45.公司最高级别流程(通常为L1级)的责任人来自于公司的核心决策团队。(公司业务流程架构拟定的责任来自于公司的核心决策团队)'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '八、流程责任人:活动',
          modularList: [
            {
              title: '46.公司每个流程皆有归口的流程责任人。'
              , radioList: []
            },
            {
              title: '47.流程责任人负责流程的定义,并以文件形式对流程进行规范。'
              , radioList: []
            },
            {
              title:
                '48.流程责任人能就流程内容和执行情况与流程涉及的所有执行人员保持常态化的沟通。'
              , radioList: []            }
            ,
            {
              title:
                '49.流程责任人能够发起责任范围内的小型流程变革活动。(有权限和能力发起部门内部流程的调整)'
              , radioList: []            }
            ,
            {
              title: '50.流程责任人能清晰的表达流程绩效目的和未来远景。'
              , radioList: []
            },
            {
              title:
                '52.流程责任人能为流程制定完善的实施方案,并确保流程按照设计要求执行。'
              , radioList: []            }
            ,
            {
              title:
                '53.不同的流程责任人之间能形成有效协作,并围绕公司目标的达成促进公司流程之间的整合和集成。'
              , radioList: []            }
            ,
            {
              title:
                '54.流程责任人能为责任范围内的流程制定滚动式规划以推动流程管理工作。'
              , radioList: []            }
            ,
            {
              title:
                '55.流程责任人参加公司级别的战略规划活动,或者部门级别的中长期计划活动。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '九、流程责任人:权利',
          modularList: [
            {
              title:
                '56.流程责任人对(新)流程的推广应用有足够的主导权,无需借助部门负责人来实施变革。'
              , radioList: []            }
            ,
            {
              title:
                '57.流程责任人能够召集和组建流程再造小组,实施新流程的设计。'
              , radioList: []            }
            ,
            {
              title: '58.流程责任人能一定程度上控制与流程技术开发相关的投入。'
              , radioList: []
            },
            {
              title:
                '59.流程责任人对支撑流程运作的IT系统,以及任何可能涉及流程变更的项目拥有一定程度的控制权。'
              , radioList: []            }
            ,
            {
              title: '60.流程责任人对该流程相关的人员任命、人员评价拥有建议权。'
              , radioList: []
            },
            {
              title: '61.流程责任人对该流程相关的人员任命、人员评价拥有控制权。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '十、基础设施:信息系统',
          modularList: [
            {
              title:
                '62.公司有集成的IT系统来支持流程的运行,信息是连通的,而不是孤立的。'
              , radioList: []            }
            ,
            {
              title:
                '63.各部门分别建设的IT系统,进行适度二次开发,以实现系统间的整合来支持流程的运行。'
              , radioList: []            }
            ,
            {
              title:
                '64.支持流程运作的IT系统,完全实现了模块化,可以快速、安全的实现部分功能的插入或移除。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '十一、基础设施:人力资源',
          modularList: [
            {
              title:
                '65.部门负责人对流程工作中有助于优化部门业绩和解决部门问题的行为进行奖励。'
              , radioList: []            }
            ,
            {
              title:
                '66.职位/岗位的职责范围、工作描述和能力要求,能够匹配其参与的流程的工作要求。'
              , radioList: []            }
            ,
            {
              title: '67.能基于流程设计文档的要求,来组织岗位培训。'
              , radioList: []
            },
            {
              title:
                '68.公司招聘体系的设计,能够同时匹配流程的需求并平衡企业的需求。'
              , radioList: []            }
            ,
            {
              title:
                '69.公司的培训/培养体系的设计,能够同时满足流程的需求并平衡企业的需求。'
              , radioList: []            }
            ,
            {
              title:
                '70.公司的报酬和奖惩体系的设计,能够同时满足流程的需求并平衡企业的需求。(报酬和奖惩体系与流程KPI体系/结果相挂钩,相匹配)'
              , radioList: []            }
            ,
            {
              title:
                '71.公司的招聘、培训/培养、报酬、奖惩体系都注重强化企业内部的协同合作。'
              , radioList: []            }
            ,
            {
              title:
                '72.公司的招聘、培训/培养、报酬、奖惩体系能根据组织架构变化进行动态调整。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '十二、测量:定义',
          modularList: [
            {
              title: '73.流程有一些基本的绩效。'
              , radioList: []
            },
            {
              title: '74.能依据客户需求,从客户角度来制定流程的绩效。'
              , radioList: []
            },
            {
              title: '75.能基于公司的战略目标,来制定流程的绩效。'
              , radioList: []
            },
            {
              title:
                '76.组成业务的多个流程之间,能基于战略目标制定共享的绩效。(例如客户满意度绩效指标应该由多个业务流程共同承担)'
              , radioList: []            }
            ,
            {
              title: '77.能从提升业务运营效率的角度,来制定流程的绩效。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '十三、测量:应用',
          modularList: [
            {
              title:
                '78.管理者能够根据流程重点关注的业务目标来管理流程的执行情况。'
              , radioList: []            }
            ,
            {
              title:
                '79.管理者能够根据流程的执行不理想情况来查找根源,并推动执行情况改善。'
              , radioList: []            }
            ,
            {
              title:
                '80.管理者能够利用流程执行情况,将其和行业头部企业、业界平均水准进行比较,并设定和更新流程执行情况目标。'
              , radioList: []            }
            ,
            {
              title: '81.管理者能利用流程执行情况来引导和激励执行流程的员工。'
              , radioList: []
            },
            {
              title:
                '82.管理者能根据流程执行情况和目标制定管理规则,推动流程的日常管理。'
              , radioList: []            }
            ,
            {
              title:
                '83.管理者能定期评估和更新流程执行目标,并用于相关的管理规划。'
              , radioList: []            }
            ,
            {
              title:
                '84.管理者能定期结合流程执行过程中总结的经验教训,推动组织内部培训和经验分享。'
              , radioList: []
            }
          ]
        },
        {
         modularTitle: '十四、综合',
          modularList: [
            {
              title: '85.各部门间的责任有明确界定。'
              , radioList: []
            },
            {
              title: '86.当工作需要其他部门协助时,通常情况下他们的配合会很好。'
              , radioList: []
            },
            {
              title: '87.部门间不存在推诿和扯皮现象。'
              , radioList: []
            },
            {
              title:
                '88.您对本部门的工作流程,以及和其他部门间的协作关系能很清晰的理解。'
              , radioList: []            }
            ,
            {
              title: '89.您认为公司的管理制度能得到严格的执行。'
              , radioList: []
            },
            {
              title: '90.您十分清楚公司的战略目标和规划。'
              , radioList: []
            }
          ]
        }
      ];

2.准备选项数组,每题都是一样的,一个就够了,后期用代码处理一下,每题就有了选项:

 var optionList = [
        {
          optionText: '1分 完全不符合',
          pcStatus: null,
          id: 17
        },
        {
          optionText: '2分基本不符合',
          pcStatus: null,
          id: 18
        },
        {
          optionText: '3分基本符合',
          pcStatus: null,
          id: 19
        },
        {
          optionText: '4分 比较符合',
          pcStatus: null,
          id: 20
        },
        {
          optionText: '5分 完全符合',
          pcStatus: null,
          id: 21
        }
      ];

3.需求就是,数据有了,不过都没id,如果要手动录入,工作量太大了,也很累,耗时很长。给每个模块加id,每个题目加id,每个选项加id,而且不能重复。

      // 需求:给每个modularList的题目modularTitle加id,给题目的每个选项加id
      for (let index = 0; index < numArr.length; index++) {
        // 给模块加id
        numArr[index].id = parseInt(Math.random() * 10000000000)
        for (let i = 0; i < numArr[index].modularList.length; i++) {
          //  给每个题目加id
          numArr[index].modularList[i].id = parseInt(Math.random() * 10000000000)
          numArr[index].modularList[i].radioList = optionList
          for (let j = 0; j < numArr[index].modularList[i].radioList.length; j++) {
            //给每个选项加id  
            numArr[index].modularList[i].radioList[j].id = parseInt(Math.random() * 10000000000)
          }

        }
      }

      // 这样numArr就好了,里面都加了id,实现了需求

这样就得到了我们想要的数组了,numArr。

4.补充一点:数组是前端写死的,为啥非要id呢,原因是单选用了,`el-radio-group`这个组件,组件要求model绑定的数据不能重复,选项id也不能重复,如果重复了,选择时,就是把id相同的题目一起选了,所以要加id,并且不能重复。

如果想解决:vue项目中循环多个`el-radio-group`组件,选中直接互不影响,取值与赋值的问题,可以参考:element 循环多个el-radio-group 如何取值赋值,element循环多组el-radio-group设置校验_★花落若轻尘的博客-CSDN博客

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值