Merge branch 'zwg' into dev

src/page/main/system/role/index.vue

@@ -26,7 +26,7 @@
               <span>已选择</span>
               <span class="num">{{selection.length}}</span>
               <span>项</span>
-              <span class="can_click_text" @click="clearSelection">清空</span>
+              <span class="can_click_text" @click="clearRoleSelection">清空</span>
             </div>
           </div>
         </template>
@@ -114,13 +114,13 @@
         <div class="topFilter">
           <div class="left">
             <span>已选择</span>
-            <span class="num">0</span>
+            <span class="num">{{userSelection.length}}</span>
             <span>项</span>
-            <span class="can_click_text" @click="clearSelection">清空</span>
+            <span class="can_click_text" @click="clearUserSelection">清空</span>
           </div>
           <div class="right">
             <el-select
-              v-model="userFilter.type"
+              v-model="userFilter.is_admin"
               placeholder="请选择"
               style="width: 200px"
             >
@@ -132,31 +132,52 @@
               >
               </el-option>
             </el-select>
-            <el-select
-              v-model="userFilter.org"
-              placeholder="请选择"
+            <el-cascader
+              v-model="userFilter.organization_id"
+              :options="orgList"
+              placeholder="请选择组织"
+              :props="{ expandTrigger: 'hover', label: 'name', value: 'id', emitPath: false, checkStrictly: true, children: 'Child'}"
+              :clearable="true"
+              collapse-tags
               style="width: 200px"
             >
-              <el-option
-                v-for="(item, index) in orgList"
-                :key="'pushOptions' + index"
-                :label="item.name"
-                :value="item.value"
-              >
-              </el-option>
-            </el-select>
+              <template #default="{ data }">
+                <span>{{ data.name }}</span>
+              </template>
+            </el-cascader>
             <el-input
               v-model="userFilter.search"
               placeholder="请输入内容"
               style="width: 200px"
               :prefix-icon="Search"
             />
-            <el-button type="primary" @click="distribute">查询</el-button>
-            <el-button type="default" @click="distributeDialog = false">重置</el-button>
+            <el-button type="primary" @click="searchAction">查询</el-button>
+            <el-button type="default" @click="clearAction">重置</el-button>
           </div>
         </div>
         <div class="table_box">
-
+          <div class="user_table bg-scroll">
+            <bg-table 
+              ref="userTable" 
+              :headers="userHeaders" 
+              :rows="userRows" 
+              :select="true" 
+              :stripe="true"
+              @selectAc="selectUserRows"
+            >
+              <template v-slot:is_admin="{ row }">
+                {{ ["","业务系统账号","组织管理员账号","平台用户账号"][row.is_admin] }}
+              </template>
+            </bg-table>
+          </div>
+          <bg-pagination
+            :page="userFilter.page"
+            :size="userFilter.limit"
+            :total="total"
+            @change-page="changeUserPage"
+            @change-size="changeUserSize"
+          >
+          </bg-pagination>
         </div>
       </div>
       <template v-slot:footer>
@@ -177,6 +198,7 @@ import { ElMessage } from 'element-plus'
 import { useRouter } from 'vue-router'
 const router = useRouter()
 const Bgtable = ref(null)
+const userTable = ref(null)
 const state = reactive({
   filter: {
     page: 1,
@@ -187,7 +209,6 @@ const state = reactive({
     {
       label: "角色名",
       prop: "role_name",
-      
       width: 220
     },
     {
@@ -228,13 +249,14 @@ const state = reactive({
   selection: [],
   delDialog: false,
   delType: 1, // 删除类型  1-单条删除 2-批量删除
-  distributeDialog: false, // 分配用户弹窗
 })
 const userState = reactive({
   userFilter: {
-    type: "",
-    org: "",
+    is_admin: "",
+    organization_id: "",
     search: "",
+    limit: 10,
+    page: 1,
   },
   userTypeList: [
     {
@@ -254,9 +276,29 @@ const userState = reactive({
       value: 3
     },
   ],
-  orgList: [
-
-  ]
+  orgList: [],
+  userHeaders: [
+    {
+      label: "帐号",
+      prop: "system_account",
+    },
+    {
+      label: "类型",
+      prop: "is_admin",
+    },
+    {
+      label: "用户手机号",
+      prop: "contact_phone",
+    },
+    {
+      label: "所属组织",
+      prop: "organization_name",
+    },
+  ],
+  userRows: [],
+  total: 0,
+  userSelection: [],
+  distributeDialog: false, // 分配用户弹窗
 })
 const getRoleRows = () => {
   let params = {...state.filter}
@@ -272,6 +314,19 @@ const getRoleRows = () => {
       }
     })
 } // 获取角色列表
+
+const getOrgList = () => {
+  axios
+    .get(`/apaas/system/v5/org/tree`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        console.log(res.data.data)
+        userState.orgList = res.data.data || []
+      }else {
+        ElMessage.error(res.data.data)
+      }
+    })
+} // 获取组织列表
 const changePage = (val) => {
   state.filter.page = val
   getRoleRows()
@@ -304,8 +359,8 @@ const selectRows = (data) => {
   state.selection = data.selection
 } // 表格多选
 
-const clearSelection = () => {
-  Bgtable.value.clearSelection()
+const clearRoleSelection = () => {
+  Bgtable.value.clearTable()
 }
 
 const register = () => {
@@ -324,11 +379,100 @@ const edit_row = (row) => {
 } // 编辑角色
 
 const distribute_user = (row) => {
-  state.distributeDialog = true
+  clearAction(1)
+  userState.distributeDialog = true
+  state.actionRow = row
+  getUserList()
+} // 分配角色按钮
+
+const getUserList = () => {
+  nextTick(() => {
+    clearUserSelection()
+  })
+  let params = {
+    limit: userState.userFilter.limit,
+    page: userState.userFilter.page,
+    search: userState.userFilter.search,
+    organization_id: userState.userFilter.organization_id,
+    is_admin: userState.userFilter.is_admin,
+    role_id: state.actionRow.id,
+  }
+  axios
+    .get(`/apaas/system/v5/role/allotment/list`,{params})
+    .then((res) => {
+      if (res.data.code == 200) {
+        console.log(res.data.data)
+        userState.userRows = res.data.data || []
+        userState.total = res.data.total
+        nextTick(() => {
+          userState.userRows.forEach(e => {
+            if(e.is_bind == 1) {
+              userTable.value.toggleRowSelection(e,true)
+            }
+          })
+        })
+      }else {
+        ElMessage.error(res.data.data)
+      }
+    })
+}
+const changeUserPage = (val) => {
+  userState.userFilter.page = val
+  getUserList()
+}
+
+const changeUserSize = (val) => {
+  userState.userFilter.limit = val
+  changeUserPage(1)
+}
+
+const searchAction = () => {
+  console.log(userState.userFilter)
+  changeUserPage(1)
+}
+
+const clearAction = (type) => {
+  userState.userFilter = {
+    is_admin: "",
+    organization_id: "",
+    search: "",
+    limit: 10,
+    page: 1,
+  }
+  if (type != 1) {
+    changeUserPage(1)
+  }
+}
+
+const clearUserSelection = () => {
+  userTable.value.clearTable()
+}
+
+const selectUserRows = (data) => {
+  userState.userSelection = data.selection
 }
 
 const distribute = () => {
-  state.distributeDialog = false
+  let user_ids = []
+  userState.userSelection.forEach(e => {
+    user_ids.push(e.id)
+  })
+  let params = {
+    id: state.actionRow.id,
+    user_ids: user_ids
+  }
+  axios
+    .post(`/apaas/system/v5/role/allotment/user`,params)
+    .then((res) => {
+      if (res.data.code == 200) {
+        ElMessage.success(res.data.data)
+        userState.distributeDialog = false
+        changePage(1)
+      }else {
+        ElMessage.error(res.data.data)
+      }
+    })
+  
 }
 
 const delete_row = (row) => {
@@ -372,6 +516,7 @@ const deleteData = () => {
 }
 onBeforeMount(() => {
   getRoleRows()
+  getOrgList()
 })
     
 const {
@@ -381,13 +526,17 @@ const {
   tableTotal,
   delDialog,
   selection,
-  distributeDialog,
 } = toRefs(state)
 
 const {
   userFilter,
   userTypeList,
   orgList,
+  userHeaders,
+  userRows,
+  total,
+  userSelection,
+  distributeDialog,
 } =toRefs(userState)
 </script>
 
@@ -471,6 +620,13 @@ const {
           }
         }
       }
+      .table_box {
+        padding: 10px 16px;
+        height: calc(100% - 68px);
+        .user_table {
+          max-height: calc(100% - 48px);
+        }
+      }
     }
   }
 }