Browse Source

表格优化提交

main
likunming 1 year ago
parent
commit
9850c32ee3
  1. 11
      io.sc.platform.core.frontend/src/views/likm/RoleStatusTag.vue
  2. 114
      io.sc.platform.core.frontend/src/views/likm/SelectRoleDialog.vue
  3. 100
      io.sc.platform.core.frontend/src/views/likm/SelectUserDialog.vue
  4. 69
      io.sc.platform.core.frontend/src/views/likm/SetPasswordDialog.vue
  5. 17
      io.sc.platform.core.frontend/src/views/likm/UserStatusTag.vue

11
io.sc.platform.core.frontend/src/views/likm/RoleStatusTag.vue

@ -0,0 +1,11 @@
<template>
<div>
<q-chip v-if="enable" color="green" text-color="white" :label="$t('normal')" dense></q-chip>
<q-chip v-if="!enable" color="red" text-color="white" :label="$t('disable')" dense></q-chip>
</div>
</template>
<script setup lang="ts">
const props = defineProps({
enable: { type: Boolean, default: true },
});
</script>

114
io.sc.platform.core.frontend/src/views/likm/SelectRoleDialog.vue

@ -0,0 +1,114 @@
<template>
<w-dialog
ref="dialogRef"
:title="$t('system.selectRoleByUserDialog.title')"
width="800px"
height="500px"
:can-maximize="false"
:buttons="[
{
label: $t('confirm'),
click: () => {
const roleIds = Tools.extractProperties(gridRef.getSelectedRows(), 'id');
axios
.post(Environment.apiContextPath('/api/system/user/addRoles'), {
one: userId,
many: roleIds,
})
.then((response) => {
axios.get(Environment.apiContextPath('/api/system/role/queryRolesByUser?userId=') + userId).then((response) => {
roleGridRef.replaceRows(response.data.content);
});
close();
});
},
},
]"
>
<div class="px-2">
<w-grid
ref="gridRef"
:title="$t('system.role.grid.title')"
selection="multiple"
:full-screen-button="false"
:toolbar-configure="{ noIcon: false }"
:toolbar-actions="['query', 'refresh']"
:query-form-fields="[
{ name: 'code', label: $t('code'), type: 'text' },
{ name: 'name', label: $t('name'), type: 'text' },
{
name: 'enable',
label: $t('enable'),
type: 'select',
options: Options.yesNo(),
queryOperator: 'equals',
},
{
name: 'dataComeFrom',
label: $t('dataComeFrom'),
type: 'select',
options: Options.enum(DataComeFromEnum),
queryOperator: 'equals',
},
]"
:auto-fetch-data="false"
:fetch-data-url="Environment.apiContextPath('/api/system/role/queryOtherRolesByUser?userId=' + userId)"
:columns="[
{ name: 'code', label: $t('code') },
{ name: 'name', label: $t('name') },
{
name: 'status',
label: t('status'),
format: (value, row) => {
return {
componentType: RoleStatusTag,
attrs: row,
};
},
},
{ name: 'lastModifier', label: t('lastModifier') },
{ name: 'lastModifyDate', label: t('lastModifyDate') },
]"
></w-grid>
</div>
</w-dialog>
</template>
<script setup lang="ts">
import { ref, nextTick } from 'vue';
import { useI18n } from 'vue-i18n';
import { axios, Environment, Tools, EnumTools, Options, Formater } from '@/platform';
import RoleStatusTag from './RoleStatusTag.vue';
const { t } = useI18n();
const dialogRef = ref();
const gridRef = ref();
let DataComeFromEnum = ref();
EnumTools.fetch('io.sc.platform.orm.api.enums.DataComeFrom').then((data) => {
DataComeFromEnum.value = data;
});
let userId, userGridRef, roleGridRef;
const open = (param: object) => {
userId = param.userId;
userGridRef = param.userGrid;
roleGridRef = param.roleGrid;
dialogRef.value.show();
nextTick(() => {
gridRef.value.refresh();
});
};
const close = () => {
dialogRef.value.hide();
};
defineExpose({
open,
close,
});
</script>

100
io.sc.platform.core.frontend/src/views/likm/SelectUserDialog.vue

@ -0,0 +1,100 @@
<template>
<w-dialog
ref="dialogRef"
:title="$t('system.role.selectUser.dialog.title')"
width="800px"
height="500px"
:can-maximize="false"
:buttons="[
{
label: $t('confirm'),
click: () => {
const userIds = Tools.extractProperties(gridRef.getSelectedRows(), 'id');
axios
.post(Environment.apiContextPath('/api/system/role/addUsers'), {
one: roleId,
many: userIds,
})
.then((response) => {
userGridRef?.refresh();
close();
});
},
},
]"
>
<div class="px-2">
<w-grid
ref="gridRef"
:title="$t('system.user.grid.title')"
selection="multiple"
:full-screen-button="false"
:toolbar-configure="{ noIcon: false }"
:toolbar-actions="['query', 'refresh']"
:query-form-fields="[
{ name: 'loginName', label: $t('loginName'), type: 'text' },
{ name: 'userName', label: $t('userName'), type: 'text' },
{
name: 'enable',
label: $t('enable'),
type: 'select',
options: Options.yesNo(),
queryOperator: 'equals',
},
{
name: 'dataComeFrom',
label: $t('dataComeFrom'),
type: 'select',
options: Options.enum(DataComeFromEnum),
queryOperator: 'equals',
},
]"
:auto-fetch-data="false"
:fetch-data-url="Environment.apiContextPath('/api/system/user/queryOtherUsersByRole?roleId=' + roleId)"
:columns="[
{ name: 'loginName', label: $t('loginName') },
{ name: 'userName', label: $t('userName') },
{
name: 'status',
label: t('status'),
format: Formater.enableTag(),
},
{ name: 'lastModifier', label: t('lastModifier') },
{ name: 'lastModifyDate', label: t('lastModifyDate'), format: Formater.dateOnly() },
]"
></w-grid>
</div>
</w-dialog>
</template>
<script setup lang="ts">
import { ref, nextTick } from 'vue';
import { useI18n } from 'vue-i18n';
import { axios, Environment, Tools, EnumTools, Options, Formater } from '@/platform';
const { t } = useI18n();
const dialogRef = ref();
const gridRef = ref();
let roleId, userGridRef;
const open = (param: object) => {
roleId = param.roleId;
userGridRef = param.userGrid;
dialogRef.value.show();
nextTick(() => {
gridRef.value.refresh();
});
};
const close = () => {
dialogRef.value.hide();
};
defineExpose({
open,
close,
});
const DataComeFromEnum = await EnumTools.fetch('io.sc.platform.orm.api.enums.DataComeFrom');
</script>

69
io.sc.platform.core.frontend/src/views/likm/SetPasswordDialog.vue

@ -0,0 +1,69 @@
<template>
<w-dialog
ref="setPasswordDialogRef"
:title="$t('system.user.action.' + actionType)"
width="500px"
height="230px"
:can-maximize="false"
:buttons="[
{
label: $t('submit'),
click: () => {
axios
.post(Environment.apiContextPath('/api/system/user/' + actionType), {
userIds: userIds,
password: setPasswordFormRef.getData().password,
})
.then(() => {
setPasswordDialogRef.hide();
NotifyManager.info($t('operationSuccess'));
});
},
},
]"
>
<w-form
ref="setPasswordFormRef"
:cols-num="1"
:fields="[
{ name: 'password', label: $t('password'), type: 'password', required: true },
{
name: 'confirmPassword',
label: $t('confirmPassword'),
type: 'password',
required: true,
rules: [
(value) => {
return Tools.stringEquals(setPasswordFormRef.getData().password, value) ? true : $t('passwordAndConfirmPasswordMustEqual');
},
],
},
]"
class="p-2"
></w-form>
</w-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { axios, Environment, NotifyManager, Tools } from '@/platform';
const setPasswordDialogRef = ref();
const setPasswordFormRef = ref();
let actionType = ref();
let userIds = [];
const open = (type, users) => {
actionType.value = type;
userIds = Tools.extractProperties(users, 'id');
setPasswordDialogRef.value.show();
};
const close = () => {
setPasswordDialogRef.value.hide();
};
defineExpose({
open,
close,
});
</script>

17
io.sc.platform.core.frontend/src/views/likm/UserStatusTag.vue

@ -0,0 +1,17 @@
<template>
<div>
<q-chip v-if="enable && !accountExpired && !accountLocked && !credentialsExpired" color="green" text-color="white" :label="$t('normal')" dense></q-chip>
<q-chip v-if="!enable" color="red" text-color="white" :label="$t('disable')" dense></q-chip>
<q-chip v-if="accountExpired" color="red" text-color="white" :label="$t('accountExpired')" dense></q-chip>
<q-chip v-if="accountLocked" color="red" text-color="white" :label="$t('accountLocked')" dense></q-chip>
<q-chip v-if="credentialsExpired" color="red" text-color="white" :label="$t('credentialsExpired')" dense></q-chip>
</div>
</template>
<script setup lang="ts">
const props = defineProps({
enable: { type: Boolean, default: true },
accountExpired: { type: Boolean, default: false },
accountLocked: { type: Boolean, default: false },
credentialsExpired: { type: Boolean, default: false },
});
</script>
Loading…
Cancel
Save