|
|
@@ -1,17 +1,65 @@
|
|
|
<!-- 会员机构管理-机构管理-系统角色管理-用户 -->
|
|
|
<template>
|
|
|
- <app-drawer title="用户" width="900" v-model:show="show" :loading="loading" :refresh="refresh">
|
|
|
+ <app-drawer title="关联用户" width="480" v-model:show="show" :loading="loading">
|
|
|
+ <app-table :data="dataList" :columns="tableColumns" :highlight-current-row="false"
|
|
|
+ :span-method="objectSpanMethod" />
|
|
|
+ <template #footer>
|
|
|
+ <el-button @click="onCancel">{{ t('operation.cancel') }}</el-button>
|
|
|
+ </template>
|
|
|
</app-drawer>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { shallowRef, PropType, defineAsyncComponent } from 'vue'
|
|
|
+import { shallowRef, PropType } from 'vue'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { useRequest } from '@/hooks/request'
|
|
|
+import { queryRoleUser } from '@/services/api/admin'
|
|
|
import { i18n } from '@/stores'
|
|
|
import AppDrawer from '@pc/components/base/drawer/index.vue'
|
|
|
+import AppTable from '@pc/components/base/table/index.vue'
|
|
|
|
|
|
-const { global: { t } } = i18n
|
|
|
+const props = defineProps({
|
|
|
+ record: {
|
|
|
+ type: Object as PropType<Model.RoleRsp>,
|
|
|
+ required: true
|
|
|
+ }
|
|
|
+})
|
|
|
|
|
|
+const t = i18n.global.t
|
|
|
const show = shallowRef(true)
|
|
|
-const refresh = shallowRef(false)
|
|
|
-const loading = shallowRef(false)
|
|
|
+
|
|
|
+const { dataList, loading } = useRequest(queryRoleUser, {
|
|
|
+ params: {
|
|
|
+ autoId: props.record.autoid
|
|
|
+ },
|
|
|
+ onError: (err) => {
|
|
|
+ ElMessage.error(err)
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const tableColumns: Model.TableColumn[] = [
|
|
|
+ { field: 'rolename', label: '角色名称', formatValue: () => props.record.rolename },
|
|
|
+ { field: 'username', label: '用户名称' }
|
|
|
+]
|
|
|
+
|
|
|
+// 计算行合并值
|
|
|
+const objectSpanMethod = (data: { rowIndex: number; columnIndex: number; }) => {
|
|
|
+ if (data.columnIndex === 0) {
|
|
|
+ if (data.rowIndex === 0) {
|
|
|
+ return {
|
|
|
+ rowspan: dataList.value.length,
|
|
|
+ colspan: 1,
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return {
|
|
|
+ rowspan: 0,
|
|
|
+ colspan: 0,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const onCancel = () => {
|
|
|
+ show.value = false
|
|
|
+}
|
|
|
</script>
|