|
|
@@ -7,7 +7,7 @@
|
|
|
</el-button>
|
|
|
</el-tooltip>
|
|
|
<FlowNodeAvatar v-for="(item, i) of modelValue" :key="i" :name="item.name" />
|
|
|
- <el-dialog v-model="dialogVisible" class="le-dialog" title="选择人员" :width="680" destroy-on-close append-to-body>
|
|
|
+ <el-dialog v-model="dialogVisible" class="le-dialog" title="选择人员" :width="720" destroy-on-close append-to-body>
|
|
|
<div class="sc-user-select sc-user-select-role">
|
|
|
<div class="sc-user-select__left">
|
|
|
<div class="sc-user-select__search">
|
|
|
@@ -73,9 +73,12 @@
|
|
|
<el-scrollbar>
|
|
|
<li v-for="(item, index) in selected" :key="item.id">
|
|
|
<span class="name">
|
|
|
- <label>{{ item.name || '-' }}</label>
|
|
|
+ <el-avatar class="shrink-0" size="small">{{ item.name?.substring(0, 1) }}</el-avatar>
|
|
|
+ <le-text :value="item.name || '-'"></le-text>
|
|
|
</span>
|
|
|
- <span class="delete">
|
|
|
+ <span class="actions">
|
|
|
+ <el-button v-if="index !== 0" icon="ArrowUp" circle size="small" @click="sortItem(index, 'up')" />
|
|
|
+ <el-button v-if="index !== selected.length - 1" icon="ArrowDown" circle size="small" @click="sortItem(index, 'down')" />
|
|
|
<el-button type="danger" icon="Delete" circle size="small" @click="removeItem(index)" />
|
|
|
</span>
|
|
|
</li>
|
|
|
@@ -97,7 +100,7 @@ import user from '@/api/system/user.ts'
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
import department from '@/api/system/department.ts'
|
|
|
|
|
|
-defineOptions({ name: 'LeSelectRole' })
|
|
|
+defineOptions({ name: 'LeSelectUser' })
|
|
|
const emit = defineEmits(['update:modelValue', 'change', 'input', 'update:visible', 'getCurRow'])
|
|
|
type Item = { name: string; id: string; [key: string]: any }
|
|
|
const props = defineProps({
|
|
|
@@ -162,6 +165,16 @@ const removeItem = (index: number) => {
|
|
|
selected.value.splice(index, 1)
|
|
|
treeRef.value?.setCheckedKeys(selectedIds.value)
|
|
|
}
|
|
|
+const sortItem = (index: number, type: 'down' | 'up') => {
|
|
|
+ const _list = selected.value
|
|
|
+ const cur = _list[index]
|
|
|
+ let nextIdx = index + 1
|
|
|
+ if (type === 'up') {
|
|
|
+ nextIdx = index - 1
|
|
|
+ }
|
|
|
+ _list[index] = _list[nextIdx]
|
|
|
+ _list[nextIdx] = cur
|
|
|
+}
|
|
|
const selectHandler = () => {
|
|
|
dialogVisible.value = true
|
|
|
selected.value = JSON.parse(JSON.stringify(props.modelValue || []))
|
|
|
@@ -170,7 +183,7 @@ const selectHandler = () => {
|
|
|
queryGroupData()
|
|
|
}
|
|
|
const _info = dataInfo.value
|
|
|
- if (!_info.loading && !_info.list.length || searchParams.value.username || searchParams.value.departmentId) {
|
|
|
+ if ((!_info.loading && !_info.list.length) || searchParams.value.username || searchParams.value.departmentId) {
|
|
|
queryData(true)
|
|
|
}
|
|
|
}
|
|
|
@@ -317,7 +330,7 @@ const submit = () => {
|
|
|
}
|
|
|
.sc-user-select__selected {
|
|
|
height: 345px;
|
|
|
- width: 200px;
|
|
|
+ width: 240px;
|
|
|
border: 1px solid var(--el-border-color-light);
|
|
|
background: var(--el-color-white);
|
|
|
header {
|
|
|
@@ -342,19 +355,22 @@ const submit = () => {
|
|
|
align-items: center;
|
|
|
.el-avatar {
|
|
|
background: var(--el-color-primary);
|
|
|
- margin-right: 10px;
|
|
|
+ margin-right: 6px;
|
|
|
}
|
|
|
label {
|
|
|
}
|
|
|
}
|
|
|
- .delete {
|
|
|
- display: none;
|
|
|
+ .actions {
|
|
|
+ display: inline-flex;
|
|
|
+ gap: 6px;
|
|
|
+ .el-button + .el-button {
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
}
|
|
|
&:hover {
|
|
|
background: var(--el-color-primary-light-9);
|
|
|
- .delete {
|
|
|
- display: inline-block;
|
|
|
- }
|
|
|
+ //.actions {
|
|
|
+ //}
|
|
|
}
|
|
|
}
|
|
|
}
|
lanceJiang