table vue 禁用全选_vue+element 全选方法

批量操作功能

html

商品缩略图商品ID商品名称品牌所属类目所属店铺上架状态活动状态活动名称店铺名称企业名称预警值操作

{{val.productId}}

{{val.productName}}

{{val.brandName}} {{val.categoryName}} {{val.storeName}}{{val.productUpStatus==0?'未上架':'已上架'}}

活动报名中

活动中

{{val.activityName}}{{val.storeName}}{{val.entName}}

{{val.secondEarlyWarning}}

{{val.minuteEarlyWarning}}

{{val.hourEarlyWarning}}

预警设置

预警设置

暂无数据暂无数据

:page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="totalRecord">

js

data(){

return{

dataList: [],

currentPage: 1,

pageSize: 10,

totalRecord: 0,

//全选

multiOperationAll: false,

isIndeterminate: false,

multiGoodsStatus: getMultiStatus(10),

}

},

watch: {

multiGoodsStatus: function (val) {

if (val.every(x => x === true)) {

this.multiOperationAll = true;

this.isIndeterminate = false;

} else if (val.every(x => x === false)) {

this.multiOperationAll = false;

this.isIndeterminate = false;

} else {

this.isIndeterminate = true;

this.multiOperationAll = false;

}

}

},

methods: {

//全选

selectAll(val) {

this.multiGoodsStatus = getMultiStatus(this.dataList.length, val);

},

handleSizeChange(val) {

this.multiGoodsStatus = getMultiStatus(this.dataList.length, false);

this.isIndeterminate = false;

this.currentPage = 1;

this.pageSize = val;

this.getList();

},

handleCurrentChange(val) {

this.multiGoodsStatus = getMultiStatus(this.dataList.length, false);

this.isIndeterminate = false;

this.currentPage = val;

this.getList();

},

earlySetting(id,item){

//获取选中的当前ID

let selectedItems = []

this.multiGoodsStatus.forEach((x, index) => {

if (x) {

selectedItems.push(this.dataList[index].productId);

}

});

let ids = selectedItems.join(',');

if (selectedItems.length === 0 ) {

this.$message('请选择商品');

return !1;

}

this.warningSettings = true

this.ids = ids

},

},