春风项目四线(合箱线、总装线)
查看 | 历史 | 提交 | 提交对比
cl
2024-01-18 d18622be3bf4c48e9cf17bc4d3254245438ed272
提交 | 用户 | 时间
fd2207 1 <template>
懒 2   <div class="app-container">
3      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
4       <el-form-item label="用户名称" prop="userName">
5         <el-input
6           v-model="queryParams.userName"
7           placeholder="请输入用户名称"
8           clearable
9           style="width: 240px"
10           @keyup.enter.native="handleQuery"
11         />
12       </el-form-item>
13       <el-form-item label="手机号码" prop="phonenumber">
14         <el-input
15           v-model="queryParams.phonenumber"
16           placeholder="请输入手机号码"
17           clearable
18           style="width: 240px"
19           @keyup.enter.native="handleQuery"
20         />
21       </el-form-item>
22       <el-form-item>
23         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
24         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
25       </el-form-item>
26     </el-form>
27
28     <el-row :gutter="10" class="mb8">
29       <el-col :span="1.5">
30         <el-button
31           type="primary"
32           plain
33           icon="el-icon-plus"
34           size="mini"
35           @click="openSelectUser"
36           v-hasPermi="['system:role:add']"
37         >添加用户</el-button>
38       </el-col>
39       <el-col :span="1.5">
40         <el-button
41           type="danger"
42           plain
43           icon="el-icon-circle-close"
44           size="mini"
45           :disabled="multiple"
46           @click="cancelAuthUserAll"
47           v-hasPermi="['system:role:remove']"
48         >批量取消授权</el-button>
49       </el-col>
50       <el-col :span="1.5">
51         <el-button
52           type="warning"
53           plain
54           icon="el-icon-close"
55           size="mini"
56           @click="handleClose"
57         >关闭</el-button>
58       </el-col>
59       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
60     </el-row>
61
62     <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
63       <el-table-column type="selection" width="55" align="center" />
64       <el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
65       <el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
66       <el-table-column label="邮箱" prop="email" :show-overflow-tooltip="true" />
67       <el-table-column label="手机" prop="phonenumber" :show-overflow-tooltip="true" />
68       <el-table-column label="状态" align="center" prop="status">
69         <template slot-scope="scope">
70           <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
71         </template>
72       </el-table-column>
73       <el-table-column label="创建时间" align="center" prop="createTime" width="180">
74         <template slot-scope="scope">
75           <span>{{ parseTime(scope.row.createTime) }}</span>
76         </template>
77       </el-table-column>
78       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
79         <template slot-scope="scope">
80           <el-button
81             size="mini"
82             type="text"
83             icon="el-icon-circle-close"
84             @click="cancelAuthUser(scope.row)"
85             v-hasPermi="['system:role:remove']"
86           >取消授权</el-button>
87         </template>
88       </el-table-column>
89     </el-table>
90
91     <pagination
92       v-show="total>0"
93       :total="total"
94       :page.sync="queryParams.pageNum"
95       :limit.sync="queryParams.pageSize"
96       @pagination="getList"
97     />
98     <select-user ref="select" :roleId="queryParams.roleId" @ok="handleQuery" />
99   </div>
100 </template>
101
102 <script>
103 import { allocatedUserList, authUserCancel, authUserCancelAll } from "@/api/system/role";
104 import selectUser from "./selectUser";
105
106 export default {
107   name: "AuthUser",
108   dicts: ['sys_normal_disable'],
109   components: { selectUser },
110   data() {
111     return {
112       // 遮罩层
113       loading: true,
114       // 选中用户组
115       userIds: [],
116       // 非多个禁用
117       multiple: true,
118       // 显示搜索条件
119       showSearch: true,
120       // 总条数
121       total: 0,
122       // 用户表格数据
123       userList: [],
124       // 查询参数
125       queryParams: {
126         pageNum: 1,
127         pageSize: 10,
128         roleId: undefined,
129         userName: undefined,
130         phonenumber: undefined
131       }
132     };
133   },
134   created() {
135     const roleId = this.$route.params && this.$route.params.roleId;
136     if (roleId) {
137       this.queryParams.roleId = roleId;
138       this.getList();
139     }
140   },
141   methods: {
142     /** 查询授权用户列表 */
143     getList() {
144       this.loading = true;
145       allocatedUserList(this.queryParams).then(response => {
146           this.userList = response.rows;
147           this.total = response.total;
148           this.loading = false;
149         }
150       );
151     },
152     // 返回按钮
153     handleClose() {
154       const obj = { path: "/system/role" };
155       this.$tab.closeOpenPage(obj);
156     },
157     /** 搜索按钮操作 */
158     handleQuery() {
159       this.queryParams.pageNum = 1;
160       this.getList();
161     },
162     /** 重置按钮操作 */
163     resetQuery() {
164       this.resetForm("queryForm");
165       this.handleQuery();
166     },
167     // 多选框选中数据
168     handleSelectionChange(selection) {
169       this.userIds = selection.map(item => item.userId)
170       this.multiple = !selection.length
171     },
172     /** 打开授权用户表弹窗 */
173     openSelectUser() {
174       this.$refs.select.show();
175     },
176     /** 取消授权按钮操作 */
177     cancelAuthUser(row) {
178       const roleId = this.queryParams.roleId;
179       this.$modal.confirm('确认要取消该用户"' + row.userName + '"角色吗？').then(function() {
180         return authUserCancel({ userId: row.userId, roleId: roleId });
181       }).then(() => {
182         this.getList();
183         this.$modal.msgSuccess("取消授权成功");
184       }).catch(() => {});
185     },
186     /** 批量取消授权按钮操作 */
187     cancelAuthUserAll(row) {
188       const roleId = this.queryParams.roleId;
189       const userIds = this.userIds.join(",");
190       this.$modal.confirm('是否取消选中用户授权数据项？').then(function() {
191         return authUserCancelAll({ roleId: roleId, userIds: userIds });
192       }).then(() => {
193         this.getList();
194         this.$modal.msgSuccess("取消授权成功");
195       }).catch(() => {});
196     }
197   }
198 };
199 </script>