|
|
|
@ -1,9 +1,11 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div class="flex gap"> |
|
|
|
<div class="flex gap"> |
|
|
|
<el-tag type="info" effect="plain" closable v-for="(item, index) in modelValue" :key="item" @close="handleRemove(index)">{{ item.name }}</el-tag> |
|
|
|
<el-tag type="info" effect="plain" closable v-for="(item, index) in modelValue" :key="item" |
|
|
|
|
|
|
|
@close="handleRemove(index)">{{ item.name }} |
|
|
|
|
|
|
|
</el-tag> |
|
|
|
<el-button size="small" type="primary" plain @click="show = true"> |
|
|
|
<el-button size="small" type="primary" plain @click="show = true"> |
|
|
|
<template #icon> |
|
|
|
<template #icon> |
|
|
|
<icon name="el-icon-Plus" /> |
|
|
|
<icon name="el-icon-Plus"/> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -51,10 +53,14 @@ |
|
|
|
:data="polices" |
|
|
|
:data="polices" |
|
|
|
row-key="id" |
|
|
|
row-key="id" |
|
|
|
max-height="890px" |
|
|
|
max-height="890px" |
|
|
|
@selection-change="selectionChange" |
|
|
|
|
|
|
|
v-loading="loading" |
|
|
|
v-loading="loading" |
|
|
|
> |
|
|
|
> |
|
|
|
<el-table-column type="selection" width="55" /> |
|
|
|
<el-table-column width="55"> |
|
|
|
|
|
|
|
<template #default="{row}"> |
|
|
|
|
|
|
|
<el-checkbox |
|
|
|
|
|
|
|
v-model="row.isCheck" @change="changeCheck(row)" size="large" /> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
<el-table-column |
|
|
|
label="姓名" |
|
|
|
label="姓名" |
|
|
|
prop="name" |
|
|
|
prop="name" |
|
|
|
@ -122,13 +128,14 @@ |
|
|
|
</el-pagination> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="flex gap mt-10 wrap v-center"> |
|
|
|
<div class="flex gap mt-10 wrap v-center"> |
|
|
|
<span>已选警员:</span> |
|
|
|
<span>已选 {{checkPolices.length}} 员警员:</span> |
|
|
|
<el-tag |
|
|
|
<el-tag |
|
|
|
v-for="(item, index) in checkPolices" |
|
|
|
v-for="(item, index) in checkPolices" |
|
|
|
:key="item" |
|
|
|
:key="item" |
|
|
|
closable |
|
|
|
closable |
|
|
|
@close="handleRemove(index)" |
|
|
|
@close="handleRemove(index)" |
|
|
|
>{{ item.name }}</el-tag |
|
|
|
>{{ item.name }} |
|
|
|
|
|
|
|
</el-tag |
|
|
|
> |
|
|
|
> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
</el-col> |
|
|
|
@ -141,10 +148,10 @@ |
|
|
|
</el-dialog> |
|
|
|
</el-dialog> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<script setup> |
|
|
|
<script setup> |
|
|
|
import { departTreeList } from "@/api/system/depart"; |
|
|
|
import {departTreeList} from "@/api/system/depart"; |
|
|
|
import { listPolice } from "@/api/system/police"; |
|
|
|
import {listPolice} from "@/api/system/police"; |
|
|
|
import useCatchStore from "@/stores/modules/catch"; |
|
|
|
import useCatchStore from "@/stores/modules/catch"; |
|
|
|
import { getDictLable } from "@/utils/util"; |
|
|
|
import {getDictLable} from "@/utils/util"; |
|
|
|
|
|
|
|
|
|
|
|
const catchSotre = useCatchStore(); |
|
|
|
const catchSotre = useCatchStore(); |
|
|
|
const dict = catchSotre.getDicts(["personType"]); |
|
|
|
const dict = catchSotre.getDicts(["personType"]); |
|
|
|
@ -163,7 +170,7 @@ const emit = defineEmits(['update:modelValue']) |
|
|
|
|
|
|
|
|
|
|
|
const show = ref(false); |
|
|
|
const show = ref(false); |
|
|
|
const query = ref({ |
|
|
|
const query = ref({ |
|
|
|
current:1, |
|
|
|
current: 1, |
|
|
|
departBranch: true |
|
|
|
departBranch: true |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
}); |
|
|
|
@ -172,15 +179,15 @@ watch(() => props.departId, (val) => { |
|
|
|
getList() |
|
|
|
getList() |
|
|
|
}) |
|
|
|
}) |
|
|
|
const total = ref(0); |
|
|
|
const total = ref(0); |
|
|
|
const ableRef =ref(null) |
|
|
|
const ableRef = ref(null) |
|
|
|
const treeData = catchSotre.getDepartsAll(); |
|
|
|
const treeData = catchSotre.getDepartsAll(); |
|
|
|
const polices = ref([]); |
|
|
|
const polices = ref([]); |
|
|
|
const loading = ref(false) |
|
|
|
const loading = ref(false) |
|
|
|
|
|
|
|
|
|
|
|
function getList() { |
|
|
|
function getList() { |
|
|
|
loading.value = true |
|
|
|
loading.value = true |
|
|
|
listPolice(query.value).then((data) => { |
|
|
|
listPolice(query.value).then((data) => { |
|
|
|
polices.value = data.records; |
|
|
|
polices.value = data.records; |
|
|
|
console.log('polices',polices) |
|
|
|
|
|
|
|
setCheckFun(data.records) |
|
|
|
setCheckFun(data.records) |
|
|
|
total.value = data.total; |
|
|
|
total.value = data.total; |
|
|
|
loading.value = false |
|
|
|
loading.value = false |
|
|
|
@ -188,69 +195,50 @@ function getList() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const setCheckFun =(row)=>{ |
|
|
|
const setCheckFun = (row) => { |
|
|
|
|
|
|
|
let keyValue = checkPolices.value.map(s=>s.empNo); |
|
|
|
row.forEach((s)=>{ |
|
|
|
row.forEach((s) => { |
|
|
|
let data =checkPolices.value.find(x=>{ |
|
|
|
if(keyValue.indexOf(s.empNo) >= 0){ |
|
|
|
return JSON.stringify(x) === JSON.stringify({ |
|
|
|
s.isCheck=true; |
|
|
|
name: s.name, |
|
|
|
}else{ |
|
|
|
empNo: s.empNo, |
|
|
|
s.isCheck=false; |
|
|
|
idCode: s.idCode |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
if(data){ |
|
|
|
|
|
|
|
nextTick(()=>{ |
|
|
|
|
|
|
|
ableRef.value.toggleRowSelection(s, true); |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const checkPolices = ref([]); |
|
|
|
const checkPolices = ref([]); |
|
|
|
const checkPolicesMap =ref([]) |
|
|
|
|
|
|
|
function selectionChange(selectionRows) { |
|
|
|
|
|
|
|
if( checkPolicesMap.value['key'+query.value.current]){ |
|
|
|
|
|
|
|
let data = checkPolicesMap.value['key'+query.value.current]; |
|
|
|
|
|
|
|
checkPolicesMap.value['key'+query.value.current]=getCheckData(data,selectionRows); |
|
|
|
|
|
|
|
}else{ |
|
|
|
|
|
|
|
checkPolicesMap.value['key'+query.value.current] =getCheckData([],selectionRows); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
checkPolices.value=[] |
|
|
|
|
|
|
|
for (let key in checkPolicesMap.value){ |
|
|
|
|
|
|
|
checkPolices.value=checkPolices.value.concat(checkPolicesMap.value[key]) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const getCheckData = (data,selectionRows) =>{ |
|
|
|
const changeCheck = (row)=>{ |
|
|
|
selectionRows.forEach(item => { |
|
|
|
let checkIndex =checkPolices.value.map(s=>s.empNo); |
|
|
|
if (data.findIndex(o => o.empNo === item.empNo) === -1) { |
|
|
|
if(row.isCheck){ |
|
|
|
data.push({ |
|
|
|
checkPolices.value.push({ |
|
|
|
name: item.name, |
|
|
|
name: row.name, |
|
|
|
empNo: item.empNo, |
|
|
|
empNo: row.empNo, |
|
|
|
idCode: item.idCode |
|
|
|
idCode: row.idCode |
|
|
|
}) |
|
|
|
}); |
|
|
|
} |
|
|
|
}else{ |
|
|
|
}) |
|
|
|
checkPolices.value.splice(checkIndex.indexOf(row.empNo),1) |
|
|
|
data.forEach((s,i)=>{ |
|
|
|
|
|
|
|
if (selectionRows.findIndex(o => o.empNo === s.empNo) === -1){ |
|
|
|
|
|
|
|
data.splice(i,1) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
return data; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function handleSelectDepart(node) { |
|
|
|
function handleSelectDepart(node) { |
|
|
|
query.value.departId = node.id; |
|
|
|
query.value.departId = node.id; |
|
|
|
getList(); |
|
|
|
getList(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function handleRemove(index) { |
|
|
|
function handleRemove(index) { |
|
|
|
|
|
|
|
console.log(index) |
|
|
|
|
|
|
|
polices.value.forEach(s=>{ |
|
|
|
|
|
|
|
if(s.empNo == checkPolices.value[index].empNo){ |
|
|
|
|
|
|
|
s.isCheck =false |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
checkPolices.value.splice(index, 1) |
|
|
|
checkPolices.value.splice(index, 1) |
|
|
|
|
|
|
|
|
|
|
|
emit('update:modelValue', checkPolices.value) |
|
|
|
emit('update:modelValue', checkPolices.value) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|