From f91448ebb98e43a4e75d51a4cc76e7e76372073e Mon Sep 17 00:00:00 2001
From: pyt <626651354@qq.com>
Date: 星期四, 08 五月 2025 18:02:30 +0800
Subject: [PATCH] Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/leshan-laboratory
---
laboratory/src/components/SelectMember/index.vue | 82 ++++++++++++++++++++++++++---------------
1 files changed, 52 insertions(+), 30 deletions(-)
diff --git a/laboratory/src/components/SelectMember/index.vue b/laboratory/src/components/SelectMember/index.vue
index 62039ee..39f24b7 100644
--- a/laboratory/src/components/SelectMember/index.vue
+++ b/laboratory/src/components/SelectMember/index.vue
@@ -1,6 +1,6 @@
<template>
- <el-dialog class="select-member" :visible.sync="visible" width="53.33%" :close-on-click-modal="false"
- :show-close="false">
+ <el-dialog @open="openDialog" class="select-member" :visible.sync="visible" width="53.33%"
+ :close-on-click-modal="false" :show-close="false">
<template #title>
<div>选择参与人员</div>
</template>
@@ -22,9 +22,10 @@
<div class="select-member-content-left-list">
<div class="select-member-content-left-list-title">角色列表</div>
<div class="select-member-content-left-list-itemBox">
- <div v-for="item in 10" :key="item.id"
- class="select-member-content-left-list-itemBox-item">
- 实验员
+ <div @click="searchUserList(item.roleId)" v-for="item in roleList" :key="item.roleId"
+ class="select-member-content-left-list-itemBox-item"
+ :class="roleId == item.roleId && 'active'">
+ {{ item.roleName }}
</div>
</div>
</div>
@@ -35,15 +36,15 @@
<div class="select-member-content-right-header">
<div class="select-member-content-right-header-text">人员列表</div>
<div class="select-member-content-right-header-search">
- <el-input clearable v-model="searchName" placeholder="请输入姓名" />
+ <el-input clearable v-model="nickNameOrPhone" placeholder="请输入姓名/手机号" />
<el-button type="primary">搜索</el-button>
</div>
</div>
- <Table :data="tableData" :total="0" @selection-change="handleSelectionChange"
- :row-class-name="tableRowClassName">
+ <Table ref="memberTable" :height="null" :row-key="row => row.userId" :data="tableData"
+ :total="0" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName">
<el-table-column type="selection" width="55" />
- <el-table-column label="角色" prop="role" />
- <el-table-column label="姓名" prop="name" />
+ <el-table-column label="角色" prop="roleName" />
+ <el-table-column label="姓名" prop="nickName" />
<el-table-column label="创建时间" prop="createTime" />
</Table>
</div>
@@ -52,40 +53,52 @@
</div>
<div class="select-member-footer">
<el-button @click="close" type="default">关闭</el-button>
- <el-button type="primary">确认选择</el-button>
+ <el-button type="primary" @click="submit">确认选择</el-button>
</div>
</el-dialog>
</template>
<script>
-import { mapState } from 'vuex'
+import { getRoleList, getUserList } from './service'
export default {
data() {
return {
visible: false,
search: '',
- searchName: '',
- tableData: [
- {
- name: '张三',
- role: '实验员',
- createTime: '2025-1-2 15:13:58'
- },
- {
- name: '李四',
- role: '实验员',
- createTime: '2025-1-2 15:13:58'
- },
- ],
- selectData: []
+ nickNameOrPhone: '',
+ tableData: [],
+ selectData: [],
+ roleList: [],
+ roleId: null,
}
},
- computed: {
- ...mapState(['isFold'])
- },
methods: {
+ setSelection(selected) {
+ this.selectData = selected
+ this.$nextTick(() => {
+ // 设置新选中
+ this.tableData.forEach(row => {
+ if (selected.some(i => i.userId === row.userId)) {
+ this.$refs.memberTable.toggleRowSelection(row, true)
+ }
+ })
+ })
+ },
+ openDialog() {
+ getRoleList().then(res => {
+ this.roleList = res;
+ })
+ this.searchUserList(null);
+ },
handleSelectionChange(val) {
this.selectData = val
+ },
+ async searchUserList(roleId) {
+ this.roleId = roleId
+ const res = await getUserList({ roleIds: roleId ? [roleId] : [], nickNameOrPhone: this.searchName, pageSize: 9999, pageNum: 1 })
+ this.tableData = res.records
+ // 数据加载完成后重新应用选中状态
+ this.setSelection(this.selectData)
},
searchRole() {
this.search = ''
@@ -96,8 +109,11 @@
close() {
this.visible = false
},
+ submit() {
+ this.$emit('submit', this.selectData)
+ },
tableRowClassName({ row, rowIndex }) {
- if (this.selectData.findIndex(item => item.name === row.name) != -1) {
+ if (this.selectData.findIndex(item => item.userId === row.userId) != -1) {
return 'select-row';
}
return '';
@@ -191,6 +207,12 @@
&:last-child {
margin-bottom: 0;
}
+
+ &:hover,
+ &.active {
+ background: rgba(4, 156, 154, 0.1);
+ color: #049C9A;
+ }
}
}
}
--
Gitblit v1.7.1