feat(invoiceModal): 发票弹窗组件新增 change 事件

- 在发票弹窗中增加 change 事件 emit,便于父组件监听数据变化
- 优化 coupon-publish 组件的 selectedMember、selectedList 绑定,完善会员选择功能
This commit is contained in:
田香琪
2026-07-21 17:01:38 +08:00
parent 829d3e65e7
commit 12291ad4d5
3 changed files with 57 additions and 21 deletions

View File

@@ -92,6 +92,7 @@ import { mobile, email } from '@/plugins/RegExp.js';
export default {
name: 'invoiceModal',
emits: ['change'],
data () {
return {
invoice: 1, // 1 电子普通发票 2 增值税专用发票

View File

@@ -68,7 +68,13 @@
row-key="id"
@selection-change="onSelectionChange"
>
<el-table-column v-if="!selectedMember" type="selection" width="60" align="center" />
<el-table-column
v-if="!selectedMember || checkboxSelect"
type="selection"
width="60"
align="center"
:reserve-selection="checkboxSelect"
/>
<el-table-column prop="id" label="会员ID" min-width="120" show-overflow-tooltip />
<el-table-column label="头像" min-width="80" align="center">
<template #default="{ row }">
@@ -109,10 +115,16 @@
<priceColorScheme v-if="row" :value="row.memberWallet" :color="$mainColor" />
</template>
</el-table-column>
<el-table-column label="操作" width="200" align="center" fixed="right">
<el-table-column
v-if="!selectedMember || !checkboxSelect"
label="操作"
width="200"
align="center"
fixed="right"
>
<template #default="{ row }">
<div v-if="row" style="display: flex; justify-content: center; align-items: center">
<template v-if="selectedMember">
<template v-if="selectedMember && !checkboxSelect">
<a class="link-text" @click="callback(row)">
{{ row.___selected ? "已选择" : "选择" }}
</a>
@@ -320,6 +332,10 @@ export default {
type: null,
default: () => [],
},
checkboxSelect: {
type: Boolean,
default: false,
},
},
data() {
return {
@@ -432,8 +448,28 @@ export default {
if (name === "updatePoint") this.openMemberPoint(row);
},
onSelectionChange(selection) {
if (this.selectedMember && this.checkboxSelect) {
this.selectMember = selection || [];
return;
}
this.selectedRows = selection || [];
},
getSelection() {
return this.selectMember || [];
},
syncTableSelection() {
if (!this.selectedMember || !this.checkboxSelect) {
return;
}
this.$nextTick(() => {
this.clearSelection();
this.data.forEach((row) => {
if (this.selectMember.some((member) => member.id === row.id)) {
this.$refs.table?.toggleRowSelection(row, true);
}
});
});
},
openSetMemberGroup() {
this.memberGroupFlag = true;
this.memberGroupLoading = false;
@@ -569,6 +605,7 @@ export default {
this.loading = false;
this.init(res.result.records);
this.total = res.result.total;
this.syncTableSelection();
}
});
},

View File

@@ -156,10 +156,15 @@
<el-dialog v-model="checkUserList" width="1200px" title="选择会员" destroy-on-close>
<userList
v-if="checkUserList"
@callback="callbackSelectUser"
:selectedList="selectedMember"
ref="memberLayout"
:selectedMember="true"
:checkboxSelect="true"
:selectedList="memberSelectSnapshot"
/>
<template #footer>
<el-button @click="cancelMemberSelect">取消</el-button>
<el-button type="primary" @click="confirmMemberSelect">确定</el-button>
</template>
</el-dialog>
</div>
</template>
@@ -185,6 +190,7 @@ export default {
showCouponSelect: false,
tempCouponList: [],
checkUserList: false,
memberSelectSnapshot: [],
selectedMember: [],
form: {
promotionName: "",
@@ -237,20 +243,14 @@ export default {
};
return map[type] || "danger";
},
callbackSelectUser(val) {
let findUser = this.selectedMember.find((item) => {
return item.id === val.id;
});
if (!findUser) {
this.selectedMember.push(val);
} else {
this.selectedMember.map((item, index) => {
if (item.id === findUser.id) {
this.selectedMember.splice(index, 1);
}
});
}
cancelMemberSelect() {
this.checkUserList = false;
},
confirmMemberSelect() {
const list = this.$refs.memberLayout?.getSelection?.() || [];
this.selectedMember = list;
this.reSelectMember();
this.checkUserList = false;
},
delUser(index) {
this.selectedMember.splice(index, 1);
@@ -293,10 +293,8 @@ export default {
});
},
addVip() {
this.memberSelectSnapshot = JSON.parse(JSON.stringify(this.selectedMember));
this.checkUserList = true;
this.$nextTick(() => {
this.$refs.memberLayout.selectedMember = true;
});
},
showSelector() {
this.tempCouponList = [...this.selectCouponList];