Commit ffef034b by Tianqing Liu

feat: 新批量,代码逻辑修改

1 parent 86c7be32
...@@ -120,16 +120,16 @@ ...@@ -120,16 +120,16 @@
<a-button type="primary" @click="clerkComparativeFun">店员特征对比</a-button> <a-button type="primary" @click="clerkComparativeFun">店员特征对比</a-button>
</a-form-item> </a-form-item>
<a-form-item style="padding: 0px 5px;border: 1px solid #ccc;border-radius: 6px;"> <a-form-item style="padding: 0px 5px;border: 1px solid #ccc;border-radius: 6px;">
<a-button type="primary" @click="handleMutipleOperation">批量操作</a-button> <a-button type="primary" @click="handleMutipleOperation">{{mutipleOperationText}}</a-button>
<i class="el-icon-arrow-right" style="margin: 0px 10px;"></i> <i class="el-icon-arrow-right" style="margin: 0px 10px;"></i>
<el-button type="text" @click="movePersonRecord(person)">移动</el-button> <el-button type="text" :disabled="!isMultipleOperation" @click="movePersonRecord(person)">移动</el-button>
<a-popconfirm <a-popconfirm
title="将从本组中剔除,您确认吗?" title="将从本组中剔除,您确认吗?"
ok-text="是" ok-text="是"
cancel-text="否" cancel-text="否"
@confirm="deletePersonRecord(person)" @confirm="deletePersonRecord(person)"
> >
<el-button type="text" :disabled="mutipleOperationDisabled || !isCurrentGroup(person)">剔除</el-button> <el-button type="text" :disabled="!isMultipleOperation">剔除</el-button>
</a-popconfirm> </a-popconfirm>
<a-popconfirm <a-popconfirm
title="将彻底删除,您确认吗?" title="将彻底删除,您确认吗?"
...@@ -137,7 +137,7 @@ ...@@ -137,7 +137,7 @@
cancel-text="否" cancel-text="否"
@confirm="deleteRealPersonRecord(person)" @confirm="deleteRealPersonRecord(person)"
> >
<el-button type="text" :disabled="mutipleOperationDisabled || !isCurrentGroup(person)">删除</el-button> <el-button type="text" :disabled="!isMultipleOperation">删除</el-button>
</a-popconfirm> </a-popconfirm>
</a-form-item> </a-form-item>
</a-form> </a-form>
...@@ -159,32 +159,6 @@ ...@@ -159,32 +159,6 @@
<el-checkbox class="checkBox" v-model="person.checked" @change='checkChange(person)'></el-checkbox> <el-checkbox class="checkBox" v-model="person.checked" @change='checkChange(person)'></el-checkbox>
人id:{{ ' ' + person.person_unid }} 人id:{{ ' ' + person.person_unid }}
图片数量:{{ person.perrsonList.length }} 图片数量:{{ person.perrsonList.length }}
<!--批量操作-->
<div class="multiple-operation">
<el-button type="text" @click="handleMutipleOperation(person)">
{{mutipleOperationText(person)}}
<i class="el-icon-arrow-right el-icon--right"></i>
</el-button>
<!--批量子操作-->
<el-button type="text" :disabled="mutipleOperationDisabled || !isCurrentGroup(person)" @click="movePersonRecord(person)">移动</el-button>
<a-popconfirm
title="将从本组中剔除,您确认吗?"
ok-text="是"
cancel-text="否"
@confirm="deletePersonRecord(person)"
>
<el-button type="text" :disabled="mutipleOperationDisabled || !isCurrentGroup(person)">剔除</el-button>
</a-popconfirm>
<a-popconfirm
title="将彻底删除,您确认吗?"
ok-text="是"
cancel-text="否"
@confirm="deleteRealPersonRecord(person)"
>
<el-button type="text" :disabled="mutipleOperationDisabled || !isCurrentGroup(person)">删除</el-button>
</a-popconfirm>
</div>
</div> </div>
<el-row v-for="row in getPagedList(person.perrsonList, 8)"> <el-row v-for="row in getPagedList(person.perrsonList, 8)">
<el-col :span="3" v-for="item in row"> <el-col :span="3" v-for="item in row">
...@@ -490,7 +464,6 @@ export default { ...@@ -490,7 +464,6 @@ export default {
} }
const handleRefresh = function() { const handleRefresh = function() {
isMultipleOperation.value = false isMultipleOperation.value = false
currentMultipleGroupId.value = ''
selectedPersonList.value = [] selectedPersonList.value = []
confirmSearch() confirmSearch()
} }
...@@ -630,47 +603,32 @@ export default { ...@@ -630,47 +603,32 @@ export default {
// 批量操作 // 批量操作
const isMultipleOperation = ref(false) const isMultipleOperation = ref(false)
const currentMultipleGroupId = ref('') // 当前批量操作的组id const handleMutipleOperation = () => {
const handleMutipleOperation = (person) => { // 在当前组操作,批量按钮
if (currentMultipleGroupId.value === person.person_unid) { if (isMultipleOperation.value) {
// 在当前组操作,批量按钮 // 已经是多选状态
if (isMultipleOperation.value) { isMultipleOperation.value = false
// 已经是多选状态 selectedPersonList.value = []
isMultipleOperation.value = false
selectedPersonList.value = []
currentMultipleGroupId.value = ''
} else {
// 非多选状态
currentMultipleGroupId.value = person.person_unid
isMultipleOperation.value = true
}
} else { } else {
// 在其它组操作,批量按钮。此时,必定是非多选状态 // 非多选状态
isMultipleOperation.value = true isMultipleOperation.value = true
currentMultipleGroupId.value = person.person_unid
selectedPersonList.value = []
} }
} }
const mutipleOperationText = (person) => { const mutipleOperationText = computed(() => {
if (isMultipleOperation.value && isCurrentGroup(person)) { if (isMultipleOperation.value) {
return '取消操作' return '取消操作'
} else { } else {
return '批量操作' return '批量操作'
} }
}
const isCurrentGroup = (data) => {
return currentMultipleGroupId.value === data.person_unid
}
const mutipleOperationDisabled = computed(() => {
return !(selectedPersonList.value.length > 0 && isMultipleOperation.value)
}) })
const isSelectedPerson = (id) => { const isSelectedPerson = (id) => {
return selectedPersonList.value.some(item => item.id === id) return selectedPersonList.value.some(item => item.id === id)
} }
// 剔除人员 // 剔除人员
const selectedPersonList = ref([]) // 批量操作,选中的图片 const selectedPersonList = ref([]) // 批量操作,选中的图片
const deletePersonRecord = (data) => { const deletePersonRecord = () => {
console.log('deletePersonRecord', data, selectedPersonList) console.log('deletePersonRecord', selectedPersonList)
if (selectedPersonList.value.length < 1) { if (selectedPersonList.value.length < 1) {
ElMessage({ ElMessage({
message: `至少选择一条数据`, message: `至少选择一条数据`,
...@@ -705,8 +663,8 @@ export default { ...@@ -705,8 +663,8 @@ export default {
) )
} }
// 删除人员 // 删除人员
const deleteRealPersonRecord = (data) => { const deleteRealPersonRecord = () => {
console.log('deletePersonRecord', data, selectedPersonList) console.log('deletePersonRecord', selectedPersonList)
const strIdList = selectedPersonList.value.map(item => item.id).join(',') const strIdList = selectedPersonList.value.map(item => item.id).join(',')
const params = { const params = {
...@@ -734,8 +692,8 @@ export default { ...@@ -734,8 +692,8 @@ export default {
} }
// 移动人员 // 移动人员
const personGroupMoverRef = ref(); const personGroupMoverRef = ref();
const movePersonRecord = (data) => { const movePersonRecord = () => {
console.log('movePersonRecord', data) console.log('movePersonRecord')
if (selectedPersonList.value.length < 1) { if (selectedPersonList.value.length < 1) {
ElMessage({ ElMessage({
message: `至少选择一条数据`, message: `至少选择一条数据`,
...@@ -744,7 +702,7 @@ export default { ...@@ -744,7 +702,7 @@ export default {
return return
} }
personGroupMoverRef.value.initDialog(data, selectedPersonList.value); personGroupMoverRef.value.initDialog(selectedPersonList.value);
} }
// 查询组 // 查询组
const personGroupDialogRef = ref(); const personGroupDialogRef = ref();
...@@ -774,7 +732,7 @@ export default { ...@@ -774,7 +732,7 @@ export default {
const handleClick = function(data, event){ const handleClick = function(data, event){
console.log('handleClick', data, event) console.log('handleClick', data, event)
// 多选。只有设置为多选状态的组,才可以选中 // 多选。只有设置为多选状态的组,才可以选中
if (isMultipleOperation.value && currentMultipleGroupId.value === data.person_unid) { if (isMultipleOperation.value) {
selectedPersonList.value.push(data) selectedPersonList.value.push(data)
} else { } else {
currentItemId.value = data.id currentItemId.value = data.id
...@@ -968,10 +926,7 @@ export default { ...@@ -968,10 +926,7 @@ export default {
isMultipleOperation, isMultipleOperation,
handleMutipleOperation, handleMutipleOperation,
mutipleOperationText, mutipleOperationText,
mutipleOperationDisabled,
deleteRealPersonRecord, deleteRealPersonRecord,
currentMultipleGroupId,
isCurrentGroup,
} }
} }
} }
......
...@@ -55,11 +55,11 @@ export default { ...@@ -55,11 +55,11 @@ export default {
} }
const formData = ref(getInitialFormData()) const formData = ref(getInitialFormData())
const initDialog = (data, selectedList) => { const initDialog = (selectedList) => {
console.log('initDialog', data, selectedList) console.log('initDialog', selectedList)
formData.value = getInitialFormData() formData.value = getInitialFormData()
formData.value.unidList = selectedList.map(item => item.unid) formData.value.unidList = selectedList.map(item => item.unid)
formData.value.countdate = data.perrsonList.length > 0 ? data.perrsonList[0].counttime : '' formData.value.countdate = selectedList.length > 0 ? selectedList[0].counttime : ''
isVisible.value = true; isVisible.value = true;
getDataList() getDataList()
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!