添加 加入的机构列表

src/api/org.js

@@ -14,3 +14,18 @@ export function addOrg(data) {
     data
   });
 }
+
+/**
+ * 得到用户的机构列表
+ * @param {Object} data
+ */
+export function GetOrgList_User(data) {
+  let params = getRequestParameter('org_manager-GetOrgList_User');
+
+  return request({
+    method: 'post',
+    url: process.env.VUE_APP_FileServer,
+    params,
+    data
+  });
+}

src/views/account_manager/OrgList.vue

@@ -0,0 +1,74 @@
+<template>
+  <el-dialog :visible="visible" :before-close="handleClose">
+    <div slot="title">用户【{{ curUserName }}】加入的机构列表</div>
+
+    <el-table :data="org_list" height="320px" border>
+      <el-table-column prop="org_name" label="机构名" width="480" />
+      <el-table-column label="已审核">
+        <template slot-scope="{ row }">
+          <span>{{ row.is_audited === 'true' ? '√' : '' }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div slot="footer">
+      <el-button @click="handleClose">关闭</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { GetOrgList_User } from '@/api/org';
+
+export default {
+  props: {
+    userId: {
+      default: '',
+      type: String
+    },
+    curUserName: {
+      default: '',
+      type: String
+    }
+  },
+  data() {
+    return {
+      visible: false,
+      org_list: []
+    };
+  },
+  watch: {
+    userId(newVal) {
+      if (newVal.length > 0) {
+        GetOrgList_User({ user_id: this.userId, audited_status: -1 }).then(({ org_list }) => {
+          this.org_list = org_list;
+        });
+      } else {
+        this.org_list = [];
+      }
+    }
+  },
+  methods: {
+    show() {
+      this.visible = true;
+    },
+
+    handleClose() {
+      this.visible = false;
+      this.$emit('orgListClose');
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+.el-table__header {
+  .cell {
+    text-align: center;
+  }
+}
+
+.el-dialog__body {
+  padding-bottom: 0;
+}
+</style>

src/views/account_manager/index.vue

@@ -48,7 +48,13 @@
         <el-table-column prop="user_name" label="用户名" width="180" />
         <el-table-column prop="real_name" label="姓名" width="180" />
         <el-table-column prop="user_type_name" label="用户类型" width="120" />
-        <el-table-column prop="org_count" label="服务机构数量" width="110" />
+        <el-table-column label="加入的机构数量" width="150">
+          <template slot-scope="{ row }">
+            <span class="link" @click="showUserOrgList(row.id, row.user_name)">
+              {{ row.org_count }}
+            </span>
+          </template>
+        </el-table-column>
         <el-table-column prop="phone" label="手机号" width="150" />
         <el-table-column prop="email" label="邮箱" />
         <el-table-column fixed="right" width="80">
@@ -76,14 +82,23 @@
       @current-change="changePage"
       @size-change="changePageSize"
     />
+
+    <org-list
+      ref="orgList"
+      :user-id="userId"
+      :cur-user-name="curUserName"
+      @orgListClose="orgListClose"
+    />
   </div>
 </template>
 
 <script>
+import OrgList from './OrgList.vue';
 import { pageQueryUserList } from '@/api/list';
 
 export default {
   name: 'AccountManager',
+  components: { OrgList },
   data() {
     return {
       org_id: '',
@@ -107,7 +122,9 @@ export default {
       user_list: [],
       page_capacity: 10,
       total_count: 0,
-      cur_page: 1
+      cur_page: 1,
+      userId: '',
+      curUserName: ''
     };
   },
   created() {
@@ -140,6 +157,17 @@ export default {
     },
     handleShow(i, row) {
       console.log(i, row);
+    },
+
+    showUserOrgList(id, user_name) {
+      this.userId = id;
+      this.curUserName = user_name;
+      this.$refs.orgList.show();
+    },
+
+    orgListClose() {
+      this.userId = '';
+      this.curUserName = '';
     }
   }
 };
@@ -186,6 +214,10 @@ export default {
       font-size: 20px;
       font-weight: 400;
     }
+
+    .link {
+      cursor: pointer;
+    }
   }
 }
 </style>