element文本域选择框_vue结合ElementUI实现的多选框和输入框分配

功能就是给定一个数字,多选框循环生成,多选框后面都有一个输入框,选中的多选框对应的输入框在平均分配状态下平均分配给定的数字且不可更改,在自由分配状态下才可以更改输入框中的值.未选中时不管是平均分配还是自由分配都不可在输入框中输入值.

效果图.png

可分配客户数1000(人)

平均分配

自由分配

{ {items.content}}

arr:[],

//分配方式

radio: "1",

//多选框选中

checkedCities: [],

//多选框列表

cities:[ {id:0,content:"选项一",disabled:true,value:null},

{id:1,content:"选项二",disabled:true,value:null},

{id:2,content:"选项3",disabled:true,value:null},

{id:3,content:"选项4",disabled:true,value:null},

{id:4,content:"选项5",disabled:true,value:null},

{id:5,content:"选项6",disabled:true,value:null},

{id:6,content:"选项7",disabled:true,value:nu