在线个人资料制作网站,智能logo设计网站,揭东建设局网站,重庆网上房地产备案价需求#xff1a; 输入连号事件#xff0c;需要在表格中输入物流单号#xff0c;物流号码#xff0c;生成的数量#xff0c;名称#xff0c;点击确定自动生成固定数量的连号物流单号 1.页面布局 divel-button typeprimary sizedefault 输入连号事件需要在表格中输入物流单号物流号码生成的数量名称点击确定自动生成固定数量的连号物流单号 1.页面布局 divel-button typeprimary sizedefault clickhandleDialog输入连号/el-button/divbr/br/el-table:datatableDatastylewidth: 80vw; margin-bottom: 20pxborderel-table-column propcode label快递代码 width200/el-table-columnel-table-column propno label快递单号/el-table-columnel-table-column propname label名称/el-table-column!-- el-table-column propoptes label操作/el-table-column --/el-table弹出层代码 el-dialog v-modelshowDialogel-table:datatableDataDialogstylewidth: 80vw; margin-bottom: 20pxborderel-table-column propcode label快递代码 width200template #default{row}el-input v-modelrow.code maxlength10/el-input/template/el-table-columnel-table-column propno label快递单号template #default{row}el-input v-modelrow.no maxlength8/el-input/template/el-table-columnel-table-column propname label名称template #default{row}el-input v-modelrow.name/el-input/template/el-table-columnel-table-column propnum label张数template #default{row}el-input v-modelrow.num minlength1/el-input/template/el-table-column/el-tableel-button typeinfo sizedefault clicksave确定/el-button/el-dialog定义变量 const tableData reactive([])//生成之后的table表格 const tableDataDialog ref([])//弹出层的表格 const showDialog ref(false)//控制弹出层显隐点击输入连号自动先插入一条空数据用于输入相应地内容 const handleDialog (){showDialog.value truelet obj {code: ,no: ,name: ,num: }tableDataDialog.value.push(obj) }点击保存时将弹出层输入的单号号码和数量进行数据组装然后放入到tableData中关闭弹出层 const save (){let length tableDataDialog.value.lengthlet size new Set(tableDataDialog.value.map(itemitem.code)).sizeif(size ! length){ElMessage(物流号码不能重复)return}let obj {}let len tableDataDialog.value[0].code.toString().lengthtableData.value []tableDataDialog.value.forEach((item){for(var i0;iitem.num;i){obj {code: item.code,no: item.no,name: item.name}item.noitem.no item.no.toString()for(var j0;jlen;j){let noLen item.no.toString().lengthif(noLen len){item.no 0 item.no//如果输入的为带00xx前缀的号码自动生成要做补0操作不然会把0自动去掉noLen}}tableData.push(obj)showDialog.value false}}) }