feat:【antd】【mp】mp 的代码评审(menu)

This commit is contained in:
YunaiV
2025-11-20 21:36:36 +08:00
parent 53ef992d1e
commit 5c9a86c0f0
7 changed files with 15 additions and 2 deletions
@@ -37,6 +37,7 @@ const menu = computed({
},
});
const showNewsDialog = ref(false);
// TODO @hw:这个 reset 还有用么?
const hackResetReplySelect = ref(false);
const isLeave = computed<boolean>(() => !(menu.value.children?.length > 0));
@@ -2,3 +2,4 @@ export { default as MenuEditor } from './editor.vue';
export { default as MenuPreviewer } from './previewer.vue';
export type * from './types';
export * from './types';
// TODO @hw:这个貌似没用,可以考虑删除哈。modules 里,直接用就完事啦!
@@ -193,6 +193,8 @@ function onChildDragEnd({ newIndex }: { newIndex: number }) {
</template>
<style lang="scss" scoped>
/** todo @hwantd 和 ele 这里的写法,看看能不能统一; */
.draggable-ghost {
background: #f7fafc;
border: 1px solid #4299e1;
+2
View File
@@ -1,6 +1,7 @@
import type { VbenFormSchema } from '#/adapter/form';
import { getSimpleAccountList } from '#/api/mp/account';
/** 菜单未选中标识 */
export const MENU_NOT_SELECTED = '__MENU_NOT_SELECTED__';
@@ -10,6 +11,7 @@ export enum Level {
Parent = '1',
Undefined = '0',
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
+4 -2
View File
@@ -19,7 +19,6 @@ import {
import MenuEditor from '#/views/mp/menu/modules/menu-editor.vue';
import MenuPreviewer from '#/views/mp/menu/modules/menu-previewer.vue';
// Assets for backgrounds
// TODO @hw:是不是资源的地址,统一下;antd 和 ele,目录不同。建议按照 ele 的方法先;
import iphoneBackImg from './assets/iphone_backImg.png';
import menuFootImg from './assets/menu_foot.png';
@@ -28,12 +27,14 @@ import menuHeadImg from './assets/menu_head.png';
defineOptions({ name: 'MpMenu' });
// ======================== 列表查询 ========================
const loading = ref(false); // 遮罩层
const accountId = ref(-1);
const accountName = ref<string>('');
const menuList = ref<Menu[]>([]);
// ======================== 菜单操作 ========================
// 当前选中菜单编码:
// * 一级('x'
// * 二级('x-y'
@@ -45,6 +46,7 @@ const activeIndex = ref<string>(MENU_NOT_SELECTED);
const parentIndex = ref(-1);
// ======================== 菜单编辑 ========================
const showRightPanel = ref(false); // 右边配置显示默认详情还是配置详情
const isParent = ref<boolean>(true); // 是否一级菜单,控制MenuEditor中name字段长度
const activeMenu = ref<Menu>({}); // 选中菜单,MenuEditor的modelValue
@@ -61,7 +63,6 @@ const tempSelfObj = ref<{
});
const dialogNewsVisible = ref(false); // 跳转图文时的素材选择弹窗
// 创建表单
const [AccountForm, accountFormApi] = useVbenForm({
commonConfig: {
componentProps: {
@@ -305,6 +306,7 @@ onMounted(async () => {
await nextTick();
await initAccountId();
});
// TODO @hw:这个界面:整理下代码,整体的风格、方法的顺序、注释,参考 antd 哈;
</script>
<template>
@@ -20,6 +20,7 @@ import ReplySelect from '#/views/mp/components/wx-reply/wx-reply.vue';
import menuOptions from './menuOptions';
// TODO @hw:去掉 menu- 前缀
const props = defineProps<{
accountId: number;
isParent: boolean;
@@ -40,6 +41,7 @@ const menu = computed({
},
});
const showNewsDialog = ref(false);
// TODO @hw:这个 reset 还有用么?
const hackResetWxReplySelect = ref(false);
const isLeave = computed<boolean>(() => !(menu.value.children?.length > 0));
@@ -51,6 +53,7 @@ watch(menu, () => {
});
// ======================== 菜单编辑(素材选择) ========================
/** 选择素材 */
function selectMaterial(item: any) {
const articleId = item.articleId;
@@ -7,6 +7,8 @@ import { IconifyIcon } from '@vben/icons';
import draggable from 'vuedraggable';
// TODO @hw:文件名,不用带 menu- 前缀;
const props = defineProps<{
accountId: number;
activeIndex: string;