引入文件
这里是单选
<AssContractDialog ref="AssContract" :visible="contractOpen" @cancel="contractOpen = false " @confirm="projectConfirm" />
这里是多选
<AssContractDialog ref="AssContract" :visible="contractOpen" @cancel="contractOpen = false " @confirm="projectConfirm" :multiple="true"/>
选择时调用init
handleProject() {
this.contractOpen = true
将已选择的select数组放入进去,
这里是单选
this.$refs.AssContract.init(this.selectList)
},
这里是table
<el-table v-loading="loading" :data="list" border highlight-current-row @row-click="rowClick">
props: {
visible: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: false,
},
},
data(){
return{
idKey: "contract_id",
selectData: {},
selectList: [],
selectListData: [],
defaultQueryParams: {},
}
}
init(selectData, defaultQueryParams = {}) {
this.selectData = JSON.parse( JSON.stringify( this.multiple ? {} : (selectData ? selectData : {}) ) );
this.selectListData = JSON.parse( JSON.stringify( this.multiple ? (selectData ? selectData : []) : [] ) );
this.selectList = this.selectListData.map(item => item[this.idKey]);
this.defaultQueryParams = defaultQueryParams;
this.resetQuery();
},
async getList() {
this.loading = true;
const res = await integrProcureContractGetContractMasterList(this.queryParams);
this.list = res.rows;
this.total = res.total;
this.loading = false;
this.setSelectData();
},
setSelectData() {
if(this.multiple) {
this.selectList.forEach((id, index) => {
let cItem = this.list.filter(item => item[this.idKey] === id)[0];
if( cItem ) {
this.selectListData.splice(index, 1, cItem);
}
})
}else {
let cItem = this.list.filter(item => item[this.idKey] === this.selectData[this.idKey])[0];
if(cItem) {
this.selectData = cItem;
}
}
},
rowClick(row, column, event){
if(this.multiple) {
let cIndex = this.selectList.findIndex(id => id === row[this.idKey]);
if(cIndex === -1) {
this.selectListData.push(row);
this.selectList.push(row[this.idKey]);
}else {
this.selectListData.splice(cIndex, 1);
this.selectList.splice(cIndex, 1);
}
}else {
this.selectData = row;
}
},
confirm() {
if(this.multiple && this.selectList.length > 0) {
this.$emit("confirm", this.selectListData);
}
else if(!this.multiple && this.selectData[this.idKey]) {
this.$emit("confirm", this.selectData);
}
else {
this.msgError("请选择设备");
}
},