refactor: vue3 axios api ...

This commit is contained in:
xingyu
2022-07-19 22:33:54 +08:00
parent ba96eef51a
commit 9e2e220b69
121 changed files with 1022 additions and 9700 deletions

View File

@ -12,8 +12,8 @@ import {
ElDivider
} from 'element-plus'
import { reactive, ref, unref, onMounted, computed, watch } from 'vue'
import { getCodeImgApi, getTenantIdByNameApi, loginApi, getAsyncRoutesApi } from '@/api/login'
import { setToken } from '@/utils/auth'
import * as LoginApi from '@/api/login'
import { setToken, setTenantId } from '@/utils/auth'
import { useUserStoreWithOut } from '@/store/modules/user'
import { useCache } from '@/hooks/web/useCache'
import { usePermissionStore } from '@/store/modules/permission'
@ -68,14 +68,14 @@ const loginData = reactive({
// 获取验证码
const getCode = async () => {
const res = await getCodeImgApi()
const res = await LoginApi.getCodeImgApi()
loginData.codeImg = 'data:image/gif;base64,' + res.img
loginData.loginForm.uuid = res.uuid
}
//获取租户ID
const getTenantId = async () => {
const res = await getTenantIdByNameApi(loginData.loginForm.tenantName)
wsCache.set('tenantId', res)
const res = await LoginApi.getTenantIdByNameApi(loginData.loginForm.tenantName)
setTenantId(res)
}
// 登录
const handleLogin = async () => {
@ -83,10 +83,11 @@ const handleLogin = async () => {
const data = await validForm()
if (!data) return
loginLoading.value = true
await loginApi(loginData.loginForm)
await LoginApi.loginApi(loginData.loginForm)
.then(async (res) => {
setToken(res)
await userStore.getUserInfoAction()
const userInfo = await LoginApi.getInfoApi()
await userStore.getUserInfoAction(userInfo)
await getRoutes()
})
.catch(() => {
@ -100,9 +101,9 @@ const handleLogin = async () => {
// 获取路由
const getRoutes = async () => {
// 后端过滤菜单
const routers = await getAsyncRoutesApi()
wsCache.set('roleRouters', routers)
await permissionStore.generateRoutes(routers).catch(() => {})
const res = await LoginApi.getAsyncRoutesApi()
wsCache.set('roleRouters', res)
await permissionStore.generateRoutes(res).catch(() => {})
permissionStore.getAddRouters.forEach((route) => {
addRoute(route as RouteRecordRaw) // 动态添加可访问路由表
})

View File

@ -1,16 +1,16 @@
<script setup lang="ts">
import { useIcon } from '@/hooks/web/useIcon'
import { reactive, ref, unref, watch, onMounted, computed } from 'vue'
import { reactive, ref, unref, watch, computed } from 'vue'
import LoginFormTitle from './LoginFormTitle.vue'
import { ElForm, ElFormItem, ElInput, ElRow, ElCol, ElMessage } from 'element-plus'
import { useI18n } from '@/hooks/web/useI18n'
import { required } from '@/utils/formRules'
import {
getTenantIdByNameApi,
getCodeImgApi,
getAsyncRoutesApi,
sendSmsCodeApi,
smsLoginApi
smsLoginApi,
getInfoApi
} from '@/api/login'
import { useCache } from '@/hooks/web/useCache'
import { usePermissionStore } from '@/store/modules/permission'
@ -98,12 +98,6 @@ watch(
immediate: true
}
)
// 获取验证码 TODO @jinz是不是可以去掉手机这里暂时不用验证码
const getCode = async () => {
const res = await getCodeImgApi()
loginData.codeImg = 'data:image/gif;base64,' + res.img
loginData.loginForm.uuid = res.uuid
}
// 获取租户 ID
const getTenantId = async () => {
const res = await getTenantIdByNameApi(loginData.loginForm.tenantName)
@ -120,7 +114,8 @@ const signIn = async () => {
await smsLoginApi(smsVO.loginSms)
.then(async (res) => {
setToken(res?.token)
await userStore.getUserInfoAction()
const userInfo = await getInfoApi()
await userStore.getUserInfoAction(userInfo)
getRoutes()
})
.catch(() => {})
@ -141,9 +136,6 @@ const getRoutes = async () => {
permissionStore.setIsAddRouters(true)
push({ path: redirect.value || permissionStore.addRouters[0].path })
}
onMounted(() => {
getCode()
})
</script>
<template>
<el-form

View File

@ -2,4 +2,4 @@ import LoginForm from './LoginForm.vue'
import MobileForm from './MobileForm.vue'
import LoginFormTitle from './LoginFormTitle.vue'
export {LoginForm, MobileForm, LoginFormTitle}
export { LoginForm, MobileForm, LoginFormTitle }

View File

@ -1,5 +1,4 @@
import { ref, computed, unref, Ref } from 'vue'
import { useI18n } from '@/hooks/web/useI18n'
export enum LoginStateEnum {
LOGIN,
@ -40,72 +39,3 @@ export function useFormValid<T extends Object = any>(formRef: Ref<any>) {
validForm
}
}
const getFormRules = computed(
(): {
[k: string]: ValidationRule | ValidationRule[]
} => {
const accountFormRule = unref(getAccountFormRule)
const passwordFormRule = unref(getPasswordFormRule)
const smsFormRule = unref(getSmsFormRule)
const mobileFormRule = unref(getMobileFormRule)
const mobileRule = {
sms: smsFormRule,
mobile: mobileFormRule
}
switch (unref(currentState)) {
// register form rules
case LoginStateEnum.REGISTER:
return {
account: accountFormRule,
password: passwordFormRule,
confirmPassword: [
{
validator: validateConfirmPassword(formData?.password),
trigger: 'change'
}
],
policy: [
{
validator: validatePolicy,
trigger: 'change'
}
],
...mobileRule
}
// reset password form rules
case LoginStateEnum.RESET_PASSWORD:
return {
account: accountFormRule,
...mobileRule
}
// mobile form rules
case LoginStateEnum.MOBILE:
return mobileRule
// login form rules
default:
return {
account: accountFormRule,
password: passwordFormRule
}
}
}
)
return {
getFormRules
}
}
function createRule(message: string) {
return [
{
required: true,
message,
trigger: 'change'
}
]
}

View File

@ -53,7 +53,9 @@ const beforeUpload = (file: Blob) => {
const reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = () => {
state.options.img = reader.result
if (reader.result) {
state.options.img = reader.result as string
}
}
}
}

View File

@ -10,7 +10,7 @@ import * as ApiAccessLogApi from '@/api/infra/apiAccessLog'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<ApiAccessLogVO>, ApiAccessLogVO>({
const { register, tableObject, methods } = useTable<ApiAccessLogVO>({
getListApi: ApiAccessLogApi.getApiAccessLogPageApi
})
const { getList, setSearchParams } = methods

View File

@ -12,7 +12,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<ApiErrorLogVO>, ApiErrorLogVO>({
const { register, tableObject, methods } = useTable<ApiErrorLogVO>({
getListApi: ApiErrorLogApi.getApiErrorLogPageApi,
exportListApi: ApiErrorLogApi.exportApiErrorLogApi
})

View File

@ -14,7 +14,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
const { t } = useI18n() // 国际化
const { push } = useRouter()
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<CodegenTableVO>, CodegenTableVO>({
const { register, tableObject, methods } = useTable<CodegenTableVO>({
getListApi: CodegenApi.getCodegenTablePageApi,
delListApi: CodegenApi.deleteCodegenTableApi
})
@ -71,7 +71,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['infra:codegen:create']" @click="openImportTable">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.import') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.import') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -12,7 +12,7 @@ import * as ConfigApi from '@/api/infra/config'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<ConfigVO>, ConfigVO>({
const { register, tableObject, methods } = useTable<ConfigVO>({
getListApi: ConfigApi.getConfigPageApi,
delListApi: ConfigApi.deleteConfigApi,
exportListApi: ConfigApi.exportConfigApi
@ -102,7 +102,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['infra:config:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -92,7 +92,7 @@ onMounted(async () => {
type="primary"
@click="handleCreate"
>
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<Table :columns="allSchemas.tableColumns" :data="tableData">

View File

@ -12,7 +12,7 @@ const { wsCache } = useCache()
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<FileVO>, FileVO>({
const { register, tableObject, methods } = useTable<FileVO>({
getListApi: FileApi.getFilePageApi,
delListApi: FileApi.deleteFileApi
})

View File

@ -12,7 +12,7 @@ import * as FileConfigApi from '@/api/infra/fileConfig'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<FileConfigVO>, FileConfigVO>({
const { register, tableObject, methods } = useTable<FileConfigVO>({
getListApi: FileConfigApi.getFileConfigPageApi,
delListApi: FileConfigApi.deleteFileConfigApi
})
@ -110,7 +110,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['infra:file-config:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -13,14 +13,14 @@ import { allSchemas } from './jobLog.data'
const { t } = useI18n() // 国际化
const { query } = useRoute()
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<JobLogVO>, JobLogVO>({
const { register, tableObject, methods } = useTable<JobLogVO>({
getListApi: JobLogApi.getJobLogPageApi,
exportListApi: JobLogApi.exportJobLogApi
})
const { getList, setSearchParams, exportList } = methods
const getTableList = async () => {
const id = (query.id as unknown as number) && (query.jobId as unknown as number)
tableObject.paramsObj.params = {
tableObject.params = {
jobId: id
}
await getList()

View File

@ -14,7 +14,7 @@ import { useRouter } from 'vue-router'
const { t } = useI18n() // 国际化
const { push } = useRouter()
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<JobVO>, JobVO>({
const { register, tableObject, methods } = useTable<JobVO>({
getListApi: JobApi.getJobPageApi,
delListApi: JobApi.deleteJobApi,
exportListApi: JobApi.exportJobApi
@ -126,7 +126,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['infra:job:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"
@ -137,7 +137,7 @@ getList()
<Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
</el-button>
<el-button type="info" v-hasPermi="['infra:job:query']" @click="handleJobLog">
<Icon icon="el:zoom-in" class="mr-5px" /> 执行日志
<Icon icon="ep:zoom-in" class="mr-5px" /> 执行日志
</el-button>
</div>
<!-- 列表 -->

View File

@ -20,10 +20,10 @@ const keyListLoad = ref(true)
const keyList = ref<RedisKeyInfo[]>([])
// 基本信息
const readRedisInfo = async () => {
const data = await RedisApi.redisMonitorInfo()
const data = await RedisApi.getCacheApi()
cache.value = data
loadEchartOptions(cache.value.commandStats)
const redisKeysInfo = await RedisApi.redisKeysInfo()
loadEchartOptions(data.commandStats)
const redisKeysInfo = await RedisApi.getKeyDefineListApi()
keyList.value = redisKeysInfo
keyListLoad.value = false //加载完成
}

View File

@ -12,7 +12,7 @@ import * as AppApi from '@/api/pay/app'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<AppVO>, AppVO>({
const { register, tableObject, methods } = useTable<AppVO>({
getListApi: AppApi.getAppPageApi,
delListApi: AppApi.deleteAppApi,
exportListApi: AppApi.exportAppApi
@ -102,7 +102,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -12,7 +12,7 @@ import * as MerchantApi from '@/api/pay/merchant'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<MerchantVO>, MerchantVO>({
const { register, tableObject, methods } = useTable<MerchantVO>({
getListApi: MerchantApi.getMerchantPageApi,
delListApi: MerchantApi.deleteMerchantApi,
exportListApi: MerchantApi.exportMerchantApi
@ -102,7 +102,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -11,7 +11,7 @@ import { rules, allSchemas } from './order.data'
import * as OrderApi from '@/api/pay/order'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<OrderVO>, OrderVO>({
const { register, tableObject, methods } = useTable<OrderVO>({
getListApi: OrderApi.getOrderPageApi,
delListApi: OrderApi.deleteOrderApi,
exportListApi: OrderApi.exportOrderApi
@ -99,7 +99,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['pay:order:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -10,7 +10,7 @@ import * as RefundApi from '@/api/pay/refund'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<RefundVO>, RefundVO>({
const { register, tableObject, methods } = useTable<RefundVO>({
getListApi: RefundApi.getRefundPageApi,
delListApi: RefundApi.deleteRefundApi,
exportListApi: RefundApi.exportRefundApi

View File

@ -16,7 +16,7 @@ const {
register: typeRegister,
tableObject: typeTableObject,
methods: typeMethods
} = useTable<PageResult<DictTypeVO>, DictTypeVO>({
} = useTable<DictTypeVO>({
getListApi: DictTypeApi.getDictTypePageApi,
delListApi: DictTypeApi.deleteDictTypeApi
})
@ -49,7 +49,7 @@ const {
register: dataRegister,
tableObject: dataTableObject,
methods: dataMethods
} = useTable<PageResult<DictDataVO>, DictDataVO>({
} = useTable<DictDataVO>({
getListApi: DictDataApi.getDictDataPageApi,
delListApi: DictDataApi.deleteDictDataApi
})
@ -79,7 +79,7 @@ const handleDataDelete = async (row: DictTypeVO) => {
const parentType = ref('')
const onClickType = async (data: { [key: string]: any }) => {
tableTypeSelect.value = true
dataTableObject.paramsObj.params = {
dataTableObject.params = {
dictType: data.type
}
getDataList()
@ -161,7 +161,7 @@ onMounted(async () => {
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:dict:create']" @click="handleTypeCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->
@ -221,7 +221,7 @@ onMounted(async () => {
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:dict:create']" @click="handleDataCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<Table

View File

@ -12,7 +12,7 @@ import * as ErrorCodeApi from '@/api/system/errorCode'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<ErrorCodeVO>, ErrorCodeVO>({
const { register, tableObject, methods } = useTable<ErrorCodeVO>({
getListApi: ErrorCodeApi.getErrorCodePageApi,
delListApi: ErrorCodeApi.deleteErrorCodeApi
})
@ -96,7 +96,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button v-hasPermi="['system:error-code:create']" type="primary" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -10,7 +10,7 @@ import { useI18n } from '@/hooks/web/useI18n'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<LoginLogVO>, LoginLogVO>({
const { register, tableObject, methods } = useTable<LoginLogVO>({
getListApi: getLoginLogPageApi,
exportListApi: exportLoginLogApi
})

View File

@ -80,7 +80,7 @@ const crudSchemas = reactive<CrudSchema[]>([
{
label: t('table.action'),
field: 'action',
width: '80px',
width: '120px',
form: {
show: false
},

View File

@ -195,7 +195,7 @@ onMounted(async () => {
<ContentWrap>
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:notice:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<el-table

View File

@ -1,166 +0,0 @@
import { reactive } from 'vue'
import { required } from '@/utils/formRules'
import { useI18n } from '@/hooks/web/useI18n'
// 国际化
const { t } = useI18n()
// 修改
export const modelSchema = reactive<FormSchema[]>([
{
label: '上级菜单',
field: 'parentId',
component: 'Input',
formItemProps: {
rules: [required]
}
},
{
label: '菜单类型',
field: 'type',
component: 'RadioButton',
formItemProps: {
rules: [required]
},
componentProps: {
options: [
{
label: '目录',
value: 1
},
{
label: '菜单',
value: 2
},
{
label: '按钮',
value: 3
}
]
}
},
{
label: '菜单图标',
field: 'icon',
component: 'Input',
formItemProps: {
rules: [required]
}
},
{
label: '菜单名称',
field: 'name',
component: 'Input',
formItemProps: {
rules: [required]
}
},
{
label: '显示排序',
field: 'sort',
component: 'Input'
},
{
label: '路由地址',
field: 'path',
component: 'Input',
labelMessage: '访问的路由地址,如:`user`。如需外网地址时,则以 `http(s)://` 开头'
},
{
label: '组件路径',
field: 'component',
component: 'Input'
},
{
label: '权限标识',
field: 'permission',
component: 'Input',
labelMessage:
'Controller 方法上的权限字符,如:@PreAuthorize(`@ss.hasPermission(`system:user:list`)`)'
},
{
label: t('common.status'),
field: 'status',
component: 'RadioButton',
value: 0,
formItemProps: {
rules: [required]
},
componentProps: {
options: [
{
label: '开启',
value: 0
},
{
label: '关闭',
value: 1
}
]
},
labelMessage: '选择停用时,路由将不会出现在侧边栏,也不能被访问'
},
{
label: '是否显示',
field: 'visible',
component: 'RadioButton',
value: 0,
formItemProps: {
rules: [required]
},
componentProps: {
options: [
{
label: '显示',
value: 0
},
{
label: '隐藏',
value: 1
}
]
},
labelMessage: '选择隐藏时,路由将不会出现在侧边栏,但仍然可以访问'
},
{
label: '是否缓存',
field: 'keepAlive',
component: 'RadioButton',
value: 0,
componentProps: {
options: [
{
label: '缓存',
value: 0
},
{
label: '不缓存',
value: 1
}
]
},
labelMessage: '选择缓存时,则会被 `keep-alive` 缓存,需要匹配组件的 `name` 和路由地址保持一致'
}
])
// 列表
export const columns = reactive<TableColumn[]>([
{
label: '菜单名称',
field: 'name'
},
{
label: '权限标识',
field: 'permission',
component: 'Input',
formItemProps: {
rules: [required]
}
},
{
label: '排序',
field: 'sort'
},
{
label: t('table.action'),
field: 'action',
width: '180px'
}
])

View File

@ -1,226 +0,0 @@
<script setup lang="ts">
import { onMounted, ref, unref } from 'vue'
import { handleTree } from '@/utils/tree'
import { useI18n } from '@/hooks/web/useI18n'
import { IconSelect } from '@/components/Icon'
import { ElCard, ElMessage, ElMessageBox, ElTree, ElTreeSelect } from 'element-plus'
import { columns, modelSchema } from './menu.data'
import { Form, FormExpose } from '@/components/Form'
import * as MenuApi from '@/api/system/menu'
import { MenuVO } from '@/api/system/menu/types'
const { t } = useI18n() // 国际化
interface Tree {
id: number
name: string
children?: Tree[]
}
const defaultProps = {
children: 'children',
label: 'name',
value: 'id'
}
// ========== 创建菜单树结构 ==========
const menuOptions = ref([]) // 树形结构
const treeRef = ref<InstanceType<typeof ElTree>>()
const getTree = async () => {
const res = await MenuApi.listSimpleMenusApi()
menuOptions.value = handleTree(res)
}
const filterNode = (value: string, data: Tree) => {
if (!value) return true
return data.name.includes(value)
}
// ========== 菜单信息form表单 ==========
const loading = ref(false) // 遮罩层
const formRef = ref<FormExpose>()
const iconModel = ref('ep:user')
const menuParentId = ref()
const menuStatus = ref('add')
const menuTitle = ref('菜单信息')
const showEdit = ref(false)
// 提交按钮
const submitForm = async () => {
loading.value = true
// 提交请求
try {
const data = unref(formRef)?.formModel as MenuVO
data.parentId = menuParentId.value
// TODO: 表单提交待完善
if (menuStatus.value === 'add') {
await MenuApi.createMenuApi(data)
} else if (menuStatus.value === 'edit') {
await MenuApi.updateMenuApi(data)
}
} finally {
loading.value = false
}
}
// ========== 按钮列表相关 ==========
const tableData = ref([])
const tableLoading = ref(false)
const onDisabled = ref(true)
const tableTitle = ref('按钮信息')
// 树点击事件
const handleMenuNodeClick = async (data: { [key: string]: any }) => {
showEdit.value = true
const res = await MenuApi.getMenuApi(data.id)
menuTitle.value = res.name + '-菜单信息'
tableTitle.value = res.name + '-按钮列表'
menuParentId.value = data.id
tableData.value = await MenuApi.getMenuListApi({ name: res.name })
unref(formRef)?.setValues(res)
onDisabled.value = true
changeDisabled()
}
const handleCreate = () => {
// 重置表单
unref(formRef)?.getElFormRef()?.resetFields()
menuParentId.value = 0
onDisabled.value = false
changeDisabled()
}
const handleEdit = () => {
onDisabled.value = false
changeDisabled()
}
const changeDisabled = () => {
unref(formRef)?.setProps({
disabled: onDisabled
})
}
// 修改操作
const handleUpdate = async (row: MenuVO) => {
// 设置数据
const res = await MenuApi.getMenuApi(row.id)
unref(formRef)?.setValues(res)
}
// 删除操作
const handleDelete = (row: MenuVO) => {
ElMessageBox.confirm(t('common.delDataMessage'), t('common.confirmTitle'), {
confirmButtonText: t('common.ok'),
cancelButtonText: t('common.cancel'),
type: 'warning'
})
.then(async () => {
await MenuApi.deleteMenuApi(row.id)
ElMessage.success(t('common.delSuccess'))
})
.catch(() => {})
}
onMounted(async () => {
await getTree()
})
</script>
<template>
<div class="flex">
<el-card class="w-1/4 menu" :gutter="12" shadow="always">
<template #header>
<div class="card-header">
<span>菜单列表</span>
<el-button type="primary" v-hasPermi="['system:menu:create']" @click="handleCreate">
新增根节点
</el-button>
</div>
</template>
<!-- <p>菜单列表</p> -->
<el-tree
ref="treeRef"
node-key="id"
:accordion="true"
:data="menuOptions"
:props="defaultProps"
:highlight-current="true"
:filter-method="filterNode"
@node-click="handleMenuNodeClick"
/>
</el-card>
<el-card class="w-1/2 menu" style="margin-left: 10px" :gutter="12" shadow="hover">
<template #header>
<div class="card-header">
<span>{{ menuTitle }}</span>
</div>
</template>
<div v-if="!showEdit">
<span>请从左侧选择菜单</span>
</div>
<div v-if="showEdit">
<Form :loading="loading" :schema="modelSchema" ref="formRef">
<template #parentId>
<el-tree-select
node-key="id"
v-model="menuParentId"
:props="defaultProps"
:data="menuOptions"
check-strictly
/>
</template>
<template #icon>
<IconSelect v-model="iconModel" />
</template>
</Form>
<el-button
v-if="!onDisabled"
type="primary"
v-hasPermi="['system:menu:update']"
:loading="loading"
@click="submitForm"
>
{{ t('action.save') }}
</el-button>
<el-button v-if="!onDisabled" :loading="loading" @click="showEdit = false">
{{ t('common.cancel') }}
</el-button>
<el-button
v-if="onDisabled"
v-hasPermi="['system:menu:update']"
type="primary"
:loading="loading"
@click="handleEdit"
>
{{ t('action.edit') }}
</el-button>
</div>
</el-card>
<el-card class="w-1/2 menu" style="margin-left: 10px" :gutter="12" shadow="hover">
<template #header>
<div class="card-header">
<span>{{ tableTitle }}</span>
<!-- <el-button type="primary">新增根节点</el-button> -->
</div>
</template>
<!-- 列表 -->
<Table :loading="tableLoading" :columns="columns" :data="tableData">
<template #action="{ row }">
<el-button
link
type="primary"
v-hasPermi="['system:menu:update']"
@click="handleUpdate(row)"
>
<Icon icon="ep:edit" class="mr-5px" /> {{ t('action.edit') }}
</el-button>
<el-button
link
type="primary"
v-hasPermi="['system:menu:delete']"
@click="handleDelete(row)"
>
<Icon icon="ep:delete" class="mr-5px" /> {{ t('action.del') }}
</el-button>
</template>
</Table>
</el-card>
</div>
</template>
<style scoped>
.menu {
height: 1000px;
max-height: 1800px;
}
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
}
</style>

View File

@ -11,7 +11,7 @@ import { rules, allSchemas } from './notice.data'
import * as NoticeApi from '@/api/system/notice'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<NoticeVO>, NoticeVO>({
const { register, tableObject, methods } = useTable<NoticeVO>({
getListApi: NoticeApi.getNoticePageApi,
delListApi: NoticeApi.deleteNoticeApi
})
@ -95,7 +95,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:notice:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -12,7 +12,7 @@ import * as ClientApi from '@/api/system/oauth2/client'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<OAuth2ClientVo>, OAuth2ClientVo>({
const { register, tableObject, methods } = useTable<OAuth2ClientVo>({
getListApi: ClientApi.getOAuth2ClientPageApi,
delListApi: ClientApi.deleteOAuth2ClientApi
})
@ -96,7 +96,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:oauth2-client:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -9,7 +9,7 @@ import * as TokenApi from '@/api/system/oauth2/token'
import { ref } from 'vue'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<OAuth2TokenVo>, OAuth2TokenVo>({
const { register, tableObject, methods } = useTable<OAuth2TokenVo>({
getListApi: TokenApi.getAccessTokenPageApi,
delListApi: TokenApi.deleteAccessTokenApi
})

View File

@ -1,15 +1,15 @@
<script setup lang="ts">
import dayjs from 'dayjs'
import { useTable } from '@/hooks/web/useTable'
import { allSchemas } from './operateLog.data'
import { allSchemas } from './operatelog.data'
import { DICT_TYPE } from '@/utils/dict'
import { useI18n } from '@/hooks/web/useI18n'
import type { OperateLogVO } from '@/api/system/operateLog/types'
import * as OperateLogApi from '@/api/system/operateLog'
import type { OperateLogVO } from '@/api/system/operatelog/types'
import * as OperateLogApi from '@/api/system/operatelog'
import { ref } from 'vue'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<OperateLogVO>, OperateLogVO>({
const { register, tableObject, methods } = useTable<OperateLogVO>({
getListApi: OperateLogApi.getOperateLogPageApi,
exportListApi: OperateLogApi.exportOperateLogApi
})
@ -20,7 +20,7 @@ const dialogTitle = ref(t('action.detail')) // 弹出层标题
const { getList, setSearchParams, exportList } = methods
// 导出操作
const handleExport = async () => {
await exportList('数据.xls')
await exportList('操作日志.xls')
}
// 详情
const handleDetail = (row: OperateLogVO) => {

View File

@ -100,7 +100,7 @@ const crudSchemas = reactive<CrudSchema[]>([
{
label: t('table.action'),
field: 'action',
width: '80px',
width: '120px',
form: {
show: false
},

View File

@ -12,7 +12,7 @@ import * as PostApi from '@/api/system/post'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<PostVO>, PostVO>({
const { register, tableObject, methods } = useTable<PostVO>({
getListApi: PostApi.getPostPageApi,
delListApi: PostApi.deletePostApi,
exportListApi: PostApi.exportPostApi
@ -102,7 +102,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -27,7 +27,7 @@ import { SystemDataScopeEnum } from '@/utils/constants'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<RoleVO>, RoleVO>({
const { register, tableObject, methods } = useTable<RoleVO>({
getListApi: RoleApi.getRolePageApi,
delListApi: RoleApi.deleteRoleApi
})
@ -159,7 +159,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:role:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -12,7 +12,7 @@ import * as SensitiveWordApi from '@/api/system/sensitiveWord'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<SensitiveWordVO>, SensitiveWordVO>({
const { register, tableObject, methods } = useTable<SensitiveWordVO>({
getListApi: SensitiveWordApi.getSensitiveWordPageApi,
delListApi: SensitiveWordApi.deleteSensitiveWordApi,
exportListApi: SensitiveWordApi.exportSensitiveWordApi
@ -110,7 +110,7 @@ onMounted(async () => {
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:post:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -12,7 +12,7 @@ import * as SmsChannelApi from '@/api/system/sms/smsChannel'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<SmsChannelVO>, SmsChannelVO>({
const { register, tableObject, methods } = useTable<SmsChannelVO>({
getListApi: SmsChannelApi.getSmsChannelPageApi,
delListApi: SmsChannelApi.deleteSmsChannelApi
})
@ -96,7 +96,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:sms-channel:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -10,7 +10,7 @@ import * as SmsLoglApi from '@/api/system/sms/smsLog'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<SmsLogVO>, SmsLogVO>({
const { register, tableObject, methods } = useTable<SmsLogVO>({
getListApi: SmsLoglApi.getSmsLogPageApi
})
const { getList, setSearchParams } = methods

View File

@ -12,7 +12,7 @@ import * as SmsTemplateApi from '@/api/system/sms/smsTemplate'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<SmsTemplateVO>, SmsTemplateVO>({
const { register, tableObject, methods } = useTable<SmsTemplateVO>({
getListApi: SmsTemplateApi.getSmsTemplatePageApi,
delListApi: SmsTemplateApi.deleteSmsTemplateApi
})
@ -114,7 +114,7 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:sms-channel:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -14,7 +14,7 @@ import { TenantPackageVO } from '@/api/system/tenantPackage/types'
const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<TenantVO>, TenantVO>({
const { register, tableObject, methods } = useTable<TenantVO>({
getListApi: TenantApi.getTenantPageApi,
delListApi: TenantApi.deleteTenantApi,
exportListApi: TenantApi.exportTenantApi
@ -128,7 +128,7 @@ onMounted(async () => {
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:tenant:create']" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button
type="warning"

View File

@ -30,7 +30,7 @@ const menuExpand = ref(false)
const menuNodeAll = ref(false)
// ========== 列表相关 ==========
const { register, tableObject, methods } = useTable<PageResult<TenantPackageVO>, TenantPackageVO>({
const { register, tableObject, methods } = useTable<TenantPackageVO>({
getListApi: TenantPackageApi.getTenantPackageTypePageApi,
delListApi: TenantPackageApi.deleteTenantPackageTypeApi
})
@ -123,7 +123,7 @@ onMounted(async () => {
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" @click="handleCreate">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
</div>
<!-- 列表 -->

View File

@ -47,7 +47,7 @@ const { t } = useI18n() // 国际化
// ========== 列表相关 ==========
const tableTitle = ref('用户列表')
const { register, tableObject, methods } = useTable<PageResult<UserVO>, UserVO>({
const { register, tableObject, methods } = useTable<UserVO>({
getListApi: UserApi.getUserPageApi,
delListApi: UserApi.deleteUserApi,
exportListApi: UserApi.exportUserApi
@ -67,7 +67,7 @@ const filterNode = (value: string, data: Tree) => {
return data.name.includes(value)
}
const handleDeptNodeClick = (data: { [key: string]: any }) => {
tableObject.paramsObj.params = {
tableObject.params = {
deptId: data.id
}
tableTitle.value = data.name
@ -157,6 +157,19 @@ const handleStatusChange = async (row: UserVO) => {
row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE : CommonStatusEnum.ENABLE
})
}
// 重置密码
const handleResetPwd = (row: UserVO) => {
ElMessageBox.prompt('请输入"' + row.username + '"的新密码', '提示', {
confirmButtonText: t('common.ok'),
cancelButtonText: t('common.cancel')
}).then(({ value }) => {
console.log(row.id)
console.log(value)
UserApi.resetUserPwdApi(row.id, value).then(() => {
ElMessage.success('修改成功,新密码是:' + value)
})
})
}
// 删除操作
const handleDelete = (row: UserVO) => {
delList(row.id, false)
@ -283,12 +296,16 @@ getList()
<!-- 操作工具栏 -->
<div class="mb-10px">
<el-button type="primary" v-hasPermi="['system:user:create']" @click="handleAdd">
<Icon icon="el:zoom-in" class="mr-5px" /> {{ t('action.add') }}
<Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
</el-button>
<el-button v-hasPermi="['system:user:import']" @click="importDialogVisible = true">
<el-button
type="info"
v-hasPermi="['system:user:import']"
@click="importDialogVisible = true"
>
<Icon icon="ep:upload" class="mr-5px" /> {{ t('action.import') }}
</el-button>
<el-button v-hasPermi="['system:user:export']" @click="handleExport">
<el-button type="warning" v-hasPermi="['system:user:export']" @click="handleExport">
<Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
</el-button>
</div>
@ -336,6 +353,14 @@ getList()
>
<Icon icon="ep:view" class="mr-5px" /> {{ t('action.detail') }}
</el-button>
<el-button
link
type="primary"
v-hasPermi="['system:user:update-password']"
@click="handleResetPwd(row)"
>
<Icon icon="ep:key" class="mr-5px" /> 重置密码
</el-button>
<el-button
link
type="primary"
@ -411,6 +436,7 @@ getList()
<el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button>
</template>
</Dialog>
<!-- 导入 -->
<Dialog
v-model="importDialogVisible"
:title="importDialogTitle"

View File

@ -121,7 +121,7 @@ const crudSchemas = reactive<CrudSchema[]>([
},
{
field: 'action',
width: '240px',
width: '340px',
label: t('table.action'),
form: {
show: false