-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor(projects): page manage_role: extract module
- Loading branch information
1 parent
237c6d2
commit 0e9e2e1
Showing
6 changed files
with
187 additions
and
71 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
<script setup lang="ts"> | ||
import type { FilteredColumn } from '@/hooks/common/table'; | ||
defineOptions({ | ||
name: 'TableHeaderOperation' | ||
}); | ||
interface Props { | ||
disabledDelete?: boolean; | ||
loading?: boolean; | ||
} | ||
defineProps<Props>(); | ||
interface Emits { | ||
(e: 'add'): void; | ||
(e: 'delete'): void; | ||
(e: 'refresh'): void; | ||
} | ||
const emit = defineEmits<Emits>(); | ||
const columns = defineModel<FilteredColumn[]>('columns', { | ||
default: () => [] | ||
}); | ||
function add() { | ||
emit('add'); | ||
} | ||
function batchDelete() { | ||
emit('delete'); | ||
} | ||
function refresh() { | ||
emit('refresh'); | ||
} | ||
</script> | ||
|
||
<template> | ||
<NSpace wrap justify="end" class="<sm:w-200px"> | ||
<NButton size="small" ghost type="primary" @click="add"> | ||
<template #icon> | ||
<icon-ic-round-plus class="text-icon" /> | ||
</template> | ||
{{ $t('common.add') }} | ||
</NButton> | ||
<NPopconfirm @positive-click="batchDelete"> | ||
<template #trigger> | ||
<NButton size="small" ghost type="error" :disabled="disabledDelete"> | ||
<template #icon> | ||
<icon-ic-round-delete class="text-icon" /> | ||
</template> | ||
{{ $t('common.batchDelete') }} | ||
</NButton> | ||
</template> | ||
{{ $t('common.confirmDelete') }} | ||
</NPopconfirm> | ||
<NButton size="small" @click="refresh"> | ||
<template #icon> | ||
<icon-mdi-refresh class="text-icon" :class="{ 'animate-spin': loading }" /> | ||
</template> | ||
{{ $t('common.refresh') }} | ||
</NButton> | ||
<TableColumnSetting v-model:columns="columns" /> | ||
</NSpace> | ||
</template> | ||
|
||
<style scoped></style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import { useContext } from '@sa/hooks'; | ||
|
||
function useRoleSearch(searchParams: Api.SystemManage.RoleSearchParams) { | ||
return { | ||
searchParams | ||
}; | ||
} | ||
|
||
export const { setupStore: setupRoleSearchContext, useStore: useRoleSearchContext } = useContext( | ||
'role-search', | ||
useRoleSearch | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
<script setup lang="ts"> | ||
import { watch } from 'vue'; | ||
import { $t } from '@/locales'; | ||
import { roleStatusOptions } from '@/constants/business'; | ||
import { translateOptions } from '@/utils/common'; | ||
import { useRoleSearchContext } from './context'; | ||
defineOptions({ | ||
name: 'RoleSearch' | ||
}); | ||
interface Emits { | ||
(e: 'reset'): void; | ||
(e: 'search'): void; | ||
} | ||
const emit = defineEmits<Emits>(); | ||
// inject searchParams | ||
const { searchParams } = useRoleSearchContext(); | ||
function reset() { | ||
emit('reset'); | ||
} | ||
function search() { | ||
emit('search'); | ||
} | ||
watch( | ||
() => searchParams, | ||
val => { | ||
console.log('val: ', val); | ||
}, | ||
{ | ||
deep: true | ||
} | ||
); | ||
</script> | ||
|
||
<template> | ||
<NCard :title="$t('common.search')" :bordered="false" size="small" class="card-wrapper"> | ||
<NForm :model="searchParams" label-placement="left"> | ||
<NGrid responsive="screen" item-responsive> | ||
<NFormItemGi span="24 s:12 m:6" :label="$t('page.manage.role.roleName')" path="roleName" class="pr-24px"> | ||
<NInput v-model:value="searchParams.roleName" :placeholder="$t('page.manage.role.form.roleName')" /> | ||
</NFormItemGi> | ||
<NFormItemGi span="24 s:12 m:6" :label="$t('page.manage.role.roleCode')" path="roleCode" class="pr-24px"> | ||
<NInput v-model:value="searchParams.roleCode" :placeholder="$t('page.manage.role.form.roleCode')" /> | ||
</NFormItemGi> | ||
<NFormItemGi span="24 s:12 m:6" :label="$t('page.manage.role.roleStatus')" path="roleStatus" class="pr-24px"> | ||
<NSelect | ||
v-model:value="searchParams.roleStatus" | ||
:placeholder="$t('page.manage.role.form.roleStatus')" | ||
:options="translateOptions(roleStatusOptions)" | ||
clearable | ||
/> | ||
</NFormItemGi> | ||
<NFormItemGi span="24 s:12 m:6"> | ||
<NSpace class="w-full" justify="end"> | ||
<NButton @click="reset"> | ||
<template #icon> | ||
<icon-ic-round-refresh class="text-icon" /> | ||
</template> | ||
{{ $t('common.reset') }} | ||
</NButton> | ||
<NButton type="primary" ghost @click="search"> | ||
<template #icon> | ||
<icon-ic-round-search class="text-icon" /> | ||
</template> | ||
{{ $t('common.search') }} | ||
</NButton> | ||
</NSpace> | ||
</NFormItemGi> | ||
</NGrid> | ||
</NForm> | ||
</NCard> | ||
</template> | ||
|
||
<style scoped></style> |
0e9e2e1
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs:
soybean-admin – ./
soybean-admin-eta.vercel.app
soybean-admin-git-main-soybeanjs.vercel.app
soybean-admin-soybeanjs.vercel.app