feat: 🚀 获取所有邮件模板内容,修复路由添加和更新问题

src/api/v1/emailTemplate.ts

@@ -1,30 +1,27 @@
 import { http } from '@/api/service/request';
 import type { BaseResult, ResultTable } from '@/api/service/types';
 
-/**
- * 邮件模板表---获取邮件模板表列表
- */
+/** 邮件模板表---获取邮件模板表列表 */
 export const fetchGetEmailTemplateList = (data: any) => {
 	return http.request<BaseResult<ResultTable>>('get', `emailTemplate/getEmailTemplateList/${data.currentPage}/${data.pageSize}`, { params: data });
 };
 
-/**
- * 邮件模板表---添加邮件模板表
- */
+/** 邮件模板表---查询所有邮件模板 */
+export const fetchGetAllEmailTemplates = () => {
+	return http.request<BaseResult<any>>('get', 'emailTemplate/getAllEmailTemplates');
+};
+
+/** 邮件模板表---添加邮件模板表 */
 export const fetchAddEmailTemplate = (data: any) => {
 	return http.request<BaseResult<object>>('post', 'emailTemplate/addEmailTemplate', { data });
 };
 
-/**
- * 邮件模板表---更新邮件模板表
- */
+/** 邮件模板表---更新邮件模板表 */
 export const fetchUpdateEmailTemplate = (data: any) => {
 	return http.request<BaseResult<object>>('put', 'emailTemplate/updateEmailTemplate', { data });
 };
 
-/**
- * 邮件模板表---删除邮件模板表
- */
+/** 邮件模板表---删除邮件模板表 */
 export const fetchDeleteEmailTemplate = (data: any) => {
 	return http.request<BaseResult<object>>('delete', 'emailTemplate/deleteEmailTemplate', { data });
 };

src/components/SelectIcon/Select.vue

@@ -24,9 +24,11 @@ const form = ref(props.formInline);
  */
 const onSearch = async () => {
 	innerForm.loading = true;
+	const { currentPage, pageSize } = innerForm;
 
 	// 获取数据
-	const baseResult = await fetchGetMenuIconList(innerForm);
+	const baseResult = await fetchGetMenuIconList({ currentPage, pageSize });
+	if (baseResult.code !== 200) return;
 	const data = baseResult.data;
 
 	// 赋值内容
@@ -34,7 +36,6 @@ const onSearch = async () => {
 	innerForm.currentPage = data.pageNo;
 	innerForm.pageSize = data.pageSize;
 	innerForm.total = data.total;
-
 	innerForm.loading = false;
 };
 
@@ -49,16 +50,15 @@ const onChangeIcon = (value: any) => {
 /**
  * * 清除图标
  */
-const onClear = () => {
-	form.value.icon = '';
-};
+const onClear = () => (form.value.icon = '');
 
 /**
  * * 修改当前页
  * @param value
  */
-const onCurrentChange = (value: number) => {
+const onCurrentChange = async (value: number) => {
 	innerForm.currentPage = value;
+	await onSearch();
 };
 
 onMounted(() => {
@@ -76,12 +76,12 @@ onMounted(() => {
 				</div>
 			</template>
 
-			<ul class="flex flex-wrap px-2 ml-2">
+			<ul class="flex flex-wrap px-2 ml-2 h-[210px]">
 				<li
 					v-for="(item, key) in innerForm.datalist"
 					:key="key"
+					:class="`icon-item p-2 cursor-pointer mr-2 mt-1 flex justify-center items-center border border-[#e5e7eb] ${item.iconCode === form.icon ? 'current' : ''}`"
 					:title="item.iconName"
-					class="icon-item p-2 cursor-pointer mr-2 mt-1 flex justify-center items-center border border-[#e5e7eb]"
 					@click="onChangeIcon(item)"
 				>
 					<IconifyIconOnline :icon="item.iconCode" height="20px" width="20px" />
@@ -109,7 +109,17 @@ onMounted(() => {
 </template>
 
 <style lang="scss" scoped>
+.current {
+	color: var(--el-color-primary);
+	border-color: var(--el-color-primary);
+	transition: all 0.4s;
+	transform: scaleX(1.05);
+}
+
 .icon-item {
+	width: 38px;
+	height: 38px;
+
 	&:hover {
 		color: var(--el-color-primary);
 		border-color: var(--el-color-primary);

src/store/configuration/emailUsers.ts

@@ -16,8 +16,6 @@ export const useEmailUsersStore = defineStore('emailUsersStore', {
 			form: {
 				// 邮箱
 				email: undefined,
-				// 使用邮件模板
-				emailTemplate: undefined,
 				// Host地址
 				host: undefined,
 				// 端口号

src/views/configuration/emailTemplate/email-template-dialog.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import { FormInstance } from 'element-plus';
-import { rules } from '@/views/system/emailTemplate/utils/columns';
-import { FormProps } from '@/views/system/emailTemplate/utils/types';
+import { rules } from '@/views/configuration/emailTemplate/utils/columns';
+import { FormProps } from '@/views/configuration/emailTemplate/utils/types';
 import { $t } from '@/plugins/i18n';
 
 const props = withDefaults(defineProps<FormProps>(), {

src/views/configuration/emailTemplate/index.vue

@@ -1,16 +1,16 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
-import { columns } from '@/views/system/emailTemplate/utils/columns';
+import { columns } from '@/views/configuration/emailTemplate/utils/columns';
 import PureTableBar from '@/components/TableBar/src/bar';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import PureTable from '@pureadmin/table';
-import { onAdd, onDelete, onSearch, onUpdate } from '@/views/system/emailTemplate/utils/hooks';
+import { onAdd, onDelete, onSearch, onUpdate } from '@/views/configuration/emailTemplate/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import Refresh from '@iconify-icons/ep/refresh';
 import { selectUserinfo } from '@/components/Table/Userinfo/columns';
 import { $t } from '@/plugins/i18n';
-import { useEmailTemplateStore } from '@/store/system/emailTemplate.ts';
+import { useEmailTemplateStore } from '@/store/configuration/emailTemplate.ts';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 
 const tableRef = ref();

src/views/configuration/emailTemplate/utils/hooks.ts

@@ -1,9 +1,9 @@
 import { addDialog } from '@/components/BaseDialog/index';
-import EmailTemplateDialog from '@/views/system/emailTemplate/email-template-dialog.vue';
-import { useEmailTemplateStore } from '@/store/system/emailTemplate.ts';
+import EmailTemplateDialog from '@/views/configuration/emailTemplate/email-template-dialog.vue';
+import { useEmailTemplateStore } from '@/store/configuration/emailTemplate.ts';
 import { h, ref } from 'vue';
 import { messageBox } from '@/utils/message';
-import type { FormItemProps } from '@/views/system/emailTemplate/utils/types';
+import type { FormItemProps } from '@/views/configuration/emailTemplate/utils/types';
 import { $t } from '@/plugins/i18n';
 
 export const formRef = ref();

src/views/configuration/emailUsers/email-users-dialog.vue

@@ -1,10 +1,11 @@
 <script lang="ts" setup>
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import { FormInstance } from 'element-plus';
-import { rules } from '@/views/system/emailUsers/utils/columns';
-import { FormProps } from '@/views/system/emailUsers/utils/types';
+import { rules } from '@/views/configuration/emailUsers/utils/columns';
+import { FormProps } from '@/views/configuration/emailUsers/utils/types';
 import { $t } from '@/plugins/i18n';
 import { usePublicHooks } from '@/views/hooks';
+import { fetchGetAllEmailTemplates } from '@/api/v1/emailTemplate';
 
 const props = withDefaults(defineProps<FormProps>(), {
 	formInline: () => ({
@@ -29,6 +30,22 @@ const formRef = ref<FormInstance>();
 const form = ref(props.formInline);
 // 用户是否停用样式
 const { switchStyle } = usePublicHooks();
+// 邮件模板列表
+const emailTemplateList = ref();
+
+/** 查询所有邮件模板 */
+const getAllEmailTemplates = async () => {
+	const result = await fetchGetAllEmailTemplates();
+	if (result.code !== 200) return;
+	emailTemplateList.value = result.data.map(({ id, templateName }) => ({
+		value: id,
+		label: templateName,
+	}));
+};
+
+onMounted(() => {
+	getAllEmailTemplates();
+});
 
 defineExpose({ formRef });
 </script>
@@ -39,7 +56,9 @@ defineExpose({ formRef });
 			<el-input v-model="form.email" autocomplete="off" type="text" />
 		</el-form-item>
 		<el-form-item :label="$t('emailUsers_emailTemplate')" prop="emailTemplate">
-			<el-input v-model="form.emailTemplate" autocomplete="off" type="text" />
+			<el-select v-model="form.emailTemplate" :placeholder="$t('input') + $t('emailUsers_emailTemplate')" clearable filterable>
+				<el-option v-for="(item, index) in emailTemplateList" :key="index" :label="item.label" :navigationBar="false" :value="item.value" />
+			</el-select>
 		</el-form-item>
 		<el-form-item :label="$t('emailUsers_password')" prop="password">
 			<el-input v-model="form.password" autocomplete="off" type="text" />

src/views/configuration/emailUsers/index.vue

@@ -1,16 +1,16 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
-import { columns } from '@/views/system/emailUsers/utils/columns';
+import { columns } from '@/views/configuration/emailUsers/utils/columns';
 import PureTableBar from '@/components/TableBar/src/bar';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import PureTable from '@pureadmin/table';
-import { deleteIds, onAdd, onChangeDefault, onDelete, onDeleteBatch, onSearch, onUpdate, switchLoadMap } from '@/views/system/emailUsers/utils/hooks';
+import { deleteIds, onAdd, onChangeDefault, onDelete, onDeleteBatch, onSearch, onUpdate, switchLoadMap } from '@/views/configuration/emailUsers/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import Refresh from '@iconify-icons/ep/refresh';
 import { selectUserinfo } from '@/components/Table/Userinfo/columns';
 import { $t } from '@/plugins/i18n';
-import { useEmailUsersStore } from '@/store/system/emailUsers';
+import { useEmailUsersStore } from '@/store/configuration/emailUsers';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 import { usePublicHooks } from '@/views/hooks';
 import { FormInstance } from 'element-plus';
@@ -67,9 +67,6 @@ onMounted(() => {
 			<el-form-item :label="$t('emailUsers_email')" prop="email">
 				<el-input v-model="emailUsersStore.form.email" :placeholder="`${$t('input')}${$t('emailUsers_email')}`" class="!w-[180px]" clearable />
 			</el-form-item>
-			<el-form-item :label="$t('emailUsers_emailTemplate')" prop="emailTemplate">
-				<el-input v-model="emailUsersStore.form.emailTemplate" :placeholder="`${$t('input')}${$t('emailUsers_emailTemplate')}`" class="!w-[180px]" clearable />
-			</el-form-item>
 			<el-form-item :label="$t('emailUsers_host')" prop="host">
 				<el-input v-model="emailUsersStore.form.host" :placeholder="`${$t('input')}${$t('emailUsers_host')}`" class="!w-[180px]" clearable />
 			</el-form-item>

src/views/configuration/emailUsers/utils/columns.ts

@@ -7,18 +7,18 @@ export const columns: TableColumnList = [
 	{ type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 },
 	// 邮箱
 	{ label: $t('emailUsers_email'), prop: 'email' },
-	// 邮件模板
-	{ label: $t('emailUsers_emailTemplate'), prop: 'emailTemplate' },
+	// // 邮件模板
+	// { label: $t('emailUsers_emailTemplate'), prop: 'emailTemplate' },
 	// 密码
 	{ label: $t('emailUsers_password'), prop: 'password' },
 	// Host地址
 	{ label: $t('emailUsers_host'), prop: 'host' },
 	// 端口号
-	{ label: $t('emailUsers_port'), prop: 'port' },
+	{ label: $t('emailUsers_port'), prop: 'port', width: 90 },
 	// 邮箱协议
-	{ label: $t('emailUsers_smtpAgreement'), prop: 'smtpAgreement' },
+	{ label: $t('emailUsers_smtpAgreement'), prop: 'smtpAgreement', width: 100 },
 	// 是否为默认邮件
-	{ label: $t('emailUsers_isDefault'), prop: 'isDefault', slot: 'isDefault' },
+	{ label: $t('emailUsers_isDefault'), prop: 'isDefault', slot: 'isDefault', width: 100 },
 	{ label: $t('table.updateTime'), prop: 'updateTime', sortable: true, width: 160 },
 	{ label: $t('table.createTime'), prop: 'createTime', sortable: true, width: 160 },
 	{ label: $t('table.createUser'), prop: 'createUser', slot: 'createUser', width: 90 },

src/views/configuration/emailUsers/utils/hooks.ts

@@ -1,9 +1,9 @@
 import { addDialog } from '@/components/BaseDialog/index';
-import EmailUsersDialog from '@/views/system/emailUsers/email-users-dialog.vue';
-import { useEmailUsersStore } from '@/store/system/emailUsers';
+import EmailUsersDialog from '@/views/configuration/emailUsers/email-users-dialog.vue';
+import { useEmailUsersStore } from '@/store/configuration/emailUsers';
 import { h, ref } from 'vue';
 import { messageBox } from '@/utils/message';
-import type { FormItemProps } from '@/views/system/emailUsers/utils/types';
+import type { FormItemProps } from '@/views/configuration/emailUsers/utils/types';
 import { $t } from '@/plugins/i18n';
 
 export const formRef = ref();

src/views/configuration/menuIcon/index.vue

@@ -1,18 +1,18 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
-import { columns } from '@/views/system/menuIcon/utils/columns';
+import { columns } from '@/views/configuration/menuIcon/utils/columns';
 import PureTableBar from '@/components/TableBar/src/bar';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import PureTable from '@pureadmin/table';
-import { deleteIds, onAdd, onDelete, onDeleteBatch, onSearch, onUpdate } from '@/views/system/menuIcon/utils/hooks';
+import { deleteIds, onAdd, onDelete, onDeleteBatch, onSearch, onUpdate } from '@/views/configuration/menuIcon/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import Refresh from '@iconify-icons/ep/refresh';
 import { selectUserinfo } from '@/components/Table/Userinfo/columns';
 import { $t } from '@/plugins/i18n';
-import { useMenuIconStore } from '@/store/system/menuIcon';
-import MenuIconSelectIconName from '@/views/system/menuIcon/menu-icon-select-icon-name.vue';
+import { useMenuIconStore } from '@/store/configuration/menuIcon';
+import MenuIconSelectIconName from '@/views/configuration/menuIcon/menu-icon-select-icon-name.vue';
 
 const tableRef = ref();
 const formRef = ref();

src/views/configuration/menuIcon/menu-icon-dialog.vue

@@ -1,11 +1,11 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import { FormInstance } from 'element-plus';
-import { rules } from '@/views/system/menuIcon/utils/columns';
-import { FormProps } from '@/views/system/menuIcon/utils/types';
+import { rules } from '@/views/configuration/menuIcon/utils/columns';
+import { FormProps } from '@/views/configuration/menuIcon/utils/types';
 import { $t } from '@/plugins/i18n';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
-import MenuIconSelectIconName from '@/views/system/menuIcon/menu-icon-select-icon-name.vue';
+import MenuIconSelectIconName from '@/views/configuration/menuIcon/menu-icon-select-icon-name.vue';
 
 const props = withDefaults(defineProps<FormProps>(), {
 	formInline: () => ({

src/views/configuration/menuIcon/menu-icon-select-icon-name.vue

@@ -3,7 +3,7 @@ import { $t } from '@/plugins/i18n';
 import { ref } from 'vue';
 import { fetchGetIconNameList } from '@/api/v1/menuIcon';
 import LoadingSvg from '@/assets/svg/loading.svg';
-import { FormProps } from '@/views/system/menuIcon/utils/types';
+import { FormProps } from '@/views/configuration/menuIcon/utils/types';
 
 const props = withDefaults(defineProps<FormProps>(), {
 	formInline: () => ({

src/views/configuration/menuIcon/utils/hooks.ts

@@ -1,9 +1,9 @@
 import { addDialog } from '@/components/BaseDialog/index';
-import MenuIconDialog from '@/views/system/menuIcon/menu-icon-dialog.vue';
-import { useMenuIconStore } from '@/store/system/menuIcon';
+import MenuIconDialog from '@/views/configuration/menuIcon/menu-icon-dialog.vue';
+import { useMenuIconStore } from '@/store/configuration/menuIcon';
 import { h, ref } from 'vue';
 import { messageBox } from '@/utils/message';
-import type { FormItemProps } from '@/views/system/menuIcon/utils/types';
+import type { FormItemProps } from '@/views/configuration/menuIcon/utils/types';
 import { $t } from '@/plugins/i18n';
 
 export const formRef = ref();

src/views/monitor/files/files-dialog.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import { FormInstance } from 'element-plus';
-import { rules } from '@/views/system/files/utils/columns';
-import { FormProps } from '@/views/system/files/utils/types';
+import { rules } from '@/views/monitor/files/utils/columns';
+import { FormProps } from '@/views/monitor/files/utils/types';
 import { $t } from '@/plugins/i18n';
 
 const props = withDefaults(defineProps<FormProps>(), {

src/views/monitor/files/index.vue

@@ -1,16 +1,16 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
-import { columns } from '@/views/system/files/utils/columns';
+import { columns } from '@/views/monitor/files/utils/columns';
 import PureTableBar from '@/components/TableBar/src/bar';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import PureTable from '@pureadmin/table';
-import { onAdd, onDelete, onSearch, onUpdate } from '@/views/system/files/utils/hooks';
+import { onAdd, onDelete, onSearch, onUpdate } from '@/views/monitor/files/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import Refresh from '@iconify-icons/ep/refresh';
 import { selectUserinfo } from '@/components/Table/Userinfo/columns';
 import { $t } from '@/plugins/i18n';
-import { useFilesStore } from '@/store/system/files.ts';
+import { useFilesStore } from '@/store/monitor/files.ts';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 import { FormInstance } from 'element-plus';
 

src/views/monitor/files/utils/hooks.ts

@@ -1,9 +1,9 @@
 import { addDialog } from '@/components/BaseDialog/index';
-import FilesDialog from '@/views/system/files/files-dialog.vue';
-import { useFilesStore } from '@/store/system/files';
+import FilesDialog from '@/views/monitor/files/files-dialog.vue';
+import { useFilesStore } from '@/store/monitor/files';
 import { h, ref } from 'vue';
 import { messageBox } from '@/utils/message';
-import type { FormItemProps } from '@/views/system/files/utils/types';
+import type { FormItemProps } from '@/views/monitor/files/utils/types';
 import { $t } from '@/plugins/i18n';
 
 export const formRef = ref();

src/views/monitor/server/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
-import ListCard from '@/views/monitoring/server/list-card.vue';
+import ListCard from '@/views/monitor/server/list-card.vue';
 import { fetchSystemHealthList } from '@/api/v1/system';
 import { $t } from '@/plugins/i18n';
 

src/views/monitor/server/list-card.vue

@@ -1,10 +1,6 @@
 <script lang="ts" setup>
 import { computed, PropType } from 'vue';
-import shopIcon from '@/assets/svg/shop.svg?component';
-import laptopIcon from '@/assets/svg/laptop.svg?component';
-import serviceIcon from '@/assets/svg/service.svg?component';
-import calendarIcon from '@/assets/svg/calendar.svg?component';
-import userAvatarIcon from '@/assets/svg/user_avatar.svg?component';
+import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 
 interface CardProductType {
 	type: string;
@@ -27,11 +23,11 @@ const cardLogoClass = computed(() => ['list-card-item_detail--logo', { 'list-car
 		<div class="list-card-item_detail bg-bg_color">
 			<el-row justify="space-between">
 				<div :class="cardLogoClass">
-					<shopIcon v-if="product.type === 'db'" />
-					<calendarIcon v-if="product.type === 'redis'" />
-					<serviceIcon v-if="product.type === 'ping'" />
-					<userAvatarIcon v-if="product.type === 'minio'" />
-					<laptopIcon v-if="product.type === 'diskSpace'" />
+					<component :is="useRenderIcon('raphael:db')" v-if="product.type === 'db'" />
+					<component :is="useRenderIcon('devicon:redis')" v-if="product.type === 'redis'" />
+					<component :is="useRenderIcon('material-symbols:terminal')" v-if="product.type === 'ping'" />
+					<component :is="useRenderIcon('simple-icons:minio')" v-if="product.type === 'minio'" />
+					<component :is="useRenderIcon('mage:compact-disk')" v-if="product.type === 'diskSpace'" />
 				</div>
 				<div class="list-card-item_detail--operation">
 					<el-tag :color="product.status ? '#00a870' : '#eee'" class="mx-1 list-card-item_detail--operation--tag" effect="dark">

src/views/system/adminUser/admin-user-dialog.vue

@@ -31,7 +31,7 @@ const props = withDefaults(defineProps<FormProps>(), {
 		// 状态
 		status: undefined,
 		// 部门
-		deptIds: undefined,
+		deptId: undefined,
 	}),
 });
 

src/views/system/adminUser/utils/types.ts

@@ -19,7 +19,7 @@ export interface FormItemProps {
 	// 状态
 	status: boolean;
 	// 部门
-	deptIds: string[];
+	deptId: string[];
 }
 
 // 添加或修改表单Props

src/views/system/menu/utils/hooks.tsx

@@ -126,12 +126,15 @@ export const onUpdate = (row?: FormItemProps) => {
 		beforeSure: (done, { options }) => {
 			const menuFormRef = formRef.value.menuFormRef;
 			const curData = options.props.formInline as FormItemProps;
+			delete curData.higherMenuOptions;
+
+			// 表单验证
 			menuFormRef.validate(async (valid: any) => {
 				if (!valid) return;
-				delete curData.higherMenuOptions;
-
+				curData.parentId = curData.parentId ?? 0;
 				curData.id = row.id;
 				const result = await menuStore.updateMenu(curData);
+
 				// 刷新表格数据
 				if (result) {
 					done();