支部成员管理 - 关联用户

ruoyi-ui/src/views/branch/member1/index.vue

@@ -66,11 +66,10 @@
 
     <el-table v-loading="loading" :data="memberList" @selection-change="handleSelectionChange" :height="clientHeight" border>
       <el-table-column type="selection" width="55" align="center" />
-      <!--<el-table-column label="memberId" align="center" prop="memberId" />-->
-      <!--<el-table-column label="userId" align="center" prop="userId" />-->
+      <el-table-column label="成员编号" align="center" prop="memberId" />
       <el-table-column label="姓名" align="center" prop="nickName"  width="80"/>
       <el-table-column label="性别" align="center" prop="sex" :formatter="sysUserSexFormat"  width="80"/>
-      <el-table-column label="民族" align="center" prop="ethnic" width="80"/>
+      <el-table-column label="民族" align="center" prop="ethnic" width="80" :formatter="memberEthnicFormat" />
       <el-table-column label="成员类型" align="center" prop="memberType" :formatter="memberTypeFormat"  width="100"/>
       <el-table-column label="出生年月" align="center" prop="birthday" width="100">
         <template slot-scope="scope">
@@ -131,7 +130,7 @@
           <span>{{ parseTime(scope.row.formCreateTime, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="现培养人" align="center" prop="currentMentor"  width="100"/>
+      <el-table-column label="现培养人" align="center" prop="currentMentor"  width="100" :formatter="userListFormat" />
       <el-table-column label="计划发展时间" align="center" prop="planDevelopDuration" width="100">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.planDevelopDuration, '{y}-{m}-{d}') }}</span>
@@ -177,10 +176,29 @@
       <el-form ref="form" :model="form" :rules="rules" label-width="100px">
         <el-row>
           <el-col :span="12">
-          <el-form-item label="民族" prop="remarks">
-            <el-input v-model="form.ethnic" placeholder="请输入民族" />
-          </el-form-item>
-        </el-col>
+            <el-form-item label="绑定用户" prop="userId">
+              <el-select v-model="form.userId" placeholder="请选择绑定用户">
+                <el-option
+                  v-for="dict in userList"
+                  :key="dict.dictValue"
+                  :label="dict.dictLabel"
+                  :value="dict.dictValue"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="民族" prop="ethnic">
+              <el-select v-model="form.ethnic" placeholder="请选择民族">
+                <el-option
+                  v-for="dict in memberEthnicOptions"
+                  :key="dict.dictValue"
+                  :label="dict.dictLabel"
+                  :value="dict.dictValue"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
           <el-col :span="12">
             <el-form-item label="成员类型" prop="memberType">
               <el-select v-model="form.memberType" placeholder="请选择成员类型">
@@ -315,7 +333,14 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="现培养人" prop="currentMentor">
-              <el-input v-model="form.currentMentor" placeholder="请输入现培养人" />
+              <el-select v-model="form.currentMentor" placeholder="请选择现培养人">
+                <el-option
+                  v-for="dict in userList"
+                  :key="dict.dictValue"
+                  :label="dict.dictLabel"
+                  :value="dict.dictValue"
+                ></el-option>
+              </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -392,6 +417,7 @@
   import { getToken } from "@/utils/auth";
   import Treeselect from "@riophae/vue-treeselect";
   import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+  import { listUser} from "@/api/system/user";
 
   export default {
     name: "Member",
@@ -425,6 +451,10 @@
         educationLevelOptions: [],
         // 用户性别字典
         sysUserSexOptions: [],
+        // 成员民族字典
+        memberEthnicOptions: [],
+        // 用户列表
+        userList: [],
         // 用户导入参数
         upload: {
           // 是否显示弹出层（用户导入）
@@ -471,8 +501,8 @@
         form: {},
         // 表单校验
         rules: {
-          memberId: [
-            { required: true, message: "主键id不能为空", trigger: "blur" }
+          userId: [
+            { required: true, message: "绑定用户不能为空", trigger: "blur" }
           ],
         }
       };
@@ -499,13 +529,30 @@
       this.getDicts("sys_user_sex").then(response => {
         this.sysUserSexOptions = response.data;
       });
+      this.getDicts("member_ethnic").then(response => {
+        this.memberEthnicOptions = response.data;
+      });
+      this.getUserList();
     },
     methods: {
+      /** 查询用户列表 */
+      getUserList() {
+        listUser().then(response => {
+          let rows = response.rows;
+          let userList = [];
+          for(let i = 0; i < rows.length; i++) {
+            if (rows[i].userName != "admin") {
+              let user = { "dictValue" : rows[i].userId, "dictLabel" : rows[i].nickName};
+              userList.push(user);
+            }
+          }
+          this.userList = userList;
+        });
+      },
       /** 查询支部成员管理列表 */
       getList() {
         this.loading = true;
         listMember(this.queryParams).then(response => {
-          console.log(response);
           this.memberList = response.rows;
           for (let i = 0; i < this.memberList.length; i++) {
             let posts = Array.from(this.memberList[i].posts);
@@ -551,6 +598,14 @@
       sysUserSexFormat(row, column) {
         return this.selectDictLabel(this.sysUserSexOptions, row.sex);
       },
+      // 用户性别字典翻译
+      memberEthnicFormat(row, column) {
+        return this.selectDictLabel(this.memberEthnicOptions, row.ethnic);
+      },
+      // 用户列表字典翻译
+      userListFormat(row, column) {
+        return this.selectDictLabel(this.userList, row.userId);
+      },
       // 取消按钮
       cancel() {
         this.open = false;