@steedos-labs/plugin-workflow 3.0.39 → 3.0.41

package/main/default/pages/flow_selector_mobile.page.amis.json

@@ -1,5 +1,5 @@
 {
     "type": "liquid",
-    "template": "<style>\n    @keyframes fadeUpSpring {\n        0% { opacity: 0; transform: translateY(10px); }\n        100% { opacity: 1; transform: translateY(0); }\n    }\n    \n    /* Mobile-optimized scrollbars */\n    ::-webkit-scrollbar {\n        width: 4px;\n        height: 4px;\n    }\n    ::-webkit-scrollbar-track {\n        background: transparent;\n    }\n    ::-webkit-scrollbar-thumb {\n        background-color: rgba(0, 0, 0, 0.2);\n        border-radius: 4px;\n    }\n\n    /* Force full screen modal for mobile */\n    .antd-Modal:has(#steedosFlowSelectorMobile) {\n        top: 0 !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        max-width: 100vw !important;\n        width: 100vw !important;\n        height: 100vh !important;\n        height: 100dvh !important;\n    }\n\n    .antd-Modal-content:has(#steedosFlowSelectorMobile) {\n        height: 100vh !important;\n        height: 100dvh !important;\n        padding-bottom: 0 !important;\n        display: flex !important;\n        flex-direction: column !important;\n        border-radius: 0 !important;\n        overflow: hidden !important;\n    }\n\n    .antd-Modal-body:has(#steedosFlowSelectorMobile) {\n        margin: 0 !important;\n        flex: 1 !important;\n        height: auto !important;\n        overflow: hidden !important;\n        padding: 0 !important;\n        display: flex !important;\n        flex-direction: column !important;\n    }\n    \n    .antd-Service, .liquid-amis-container {\n        display: flex; /* Ensure flex propagation */\n        flex-direction: column;\n        height: 100%;\n        overflow: hidden; /* Prevent double scrollbars */\n    }\n\n    /* Mobile category selector styles */\n    .mobile-category-pill {\n        -webkit-tap-highlight-color: transparent;\n        touch-action: manipulation;\n    }\n\n    /* Flow card animations */\n    @keyframes flowCardSlideIn {\n        0% {\n            opacity: 0;\n            transform: translateY(20px);\n        }\n        100% {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n</style>\n\n<!-- Main Mobile Container -->\n<div id=\"steedosFlowSelectorMobile\" class=\"flex flex-col h-full w-full bg-[#F5F5F7] font-sans text-gray-900 overflow-hidden\">\n    \n    <!-- Top Header Section -->\n    <div class=\"shrink-0 bg-white border-b border-gray-200 shadow-sm pt-4\">\n        \n        <!-- Search Bar -->\n        <div class=\"px-4 pb-3\">\n            <div class=\"relative\">\n                <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-gray-400\">\n                    <svg class=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n                        <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"></line>\n                    </svg>\n                </div>\n                <input \n                    type=\"text\" \n                    id=\"mobileSearchInput\" \n                    placeholder=\"搜索流程...\" \n                    class=\"w-full rounded-xl border border-gray-200 bg-gray-50 py-2.5 pl-10 pr-3 text-base text-gray-900 placeholder:text-gray-400 outline-none transition-all duration-200 focus:bg-white focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20\"\n                >\n            </div>\n        </div>\n        \n        <!-- Category Tabs - Horizontal Scroll -->\n        <div class=\"overflow-x-auto scrollbar-hide pb-2\">\n            <div id=\"mobileCategoryTabs\" class=\"flex gap-2 px-4 min-w-full\">\n                <!-- Categories will be inserted here -->\n            </div>\n        </div>\n    </div>\n    \n    <!-- Main Content Area -->\n    <!-- Added min-h-0 and webkit-overflow-scrolling for better mobile scrolling -->\n    <div class=\"flex-1 overflow-y-auto scroll-smooth px-4 py-4 min-h-0\" style=\"-webkit-overflow-scrolling: touch;\">\n        <div id=\"mobileContentContainer\" class=\"space-y-3 pb-safe\">\n            <div class=\"flex flex-col items-center justify-center pt-20 text-center\">\n                <div class=\"inline-flex items-center gap-2 text-gray-400 text-sm animate-pulse\">\n                    <svg class=\"animate-spin h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n                        <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n                        <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z\"></path>\n                    </svg>\n                    <span>正在加载...</span>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<script>\n    const MobileWorkflowService = {\n        apiBase: \"\",\n        getHeaders: function() { return { 'Content-Type': 'application/json' }; },\n        getData: async function() {\n            try {\n                const appId = (typeof data !== 'undefined' && data.context && data.context.app_id) ? data.context.app_id : \"\";\n                // Use relative path directly to avoid cross-origin issues if apiBase is mixed up\n                const url = \"/service/api/flows/getList?action=new&appId=\" + encodeURIComponent(appId);\n                const res = await fetch(url, { headers: this.getHeaders() });\n                const treeData = await res.json();\n                const categories = [];\n                const parsedFlows = [];\n                if (Array.isArray(treeData)) {\n                    treeData.forEach(cat => {\n                        categories.push({ _id: cat._id, name: cat.name });\n                        if (Array.isArray(cat.flows)) {\n                            cat.flows.forEach(f => {\n                                parsedFlows.push({\n                                    id: f._id, \n                                    name: f.name, \n                                    categoryId: cat._id, \n                                    categoryName: cat.name || \"其他流程\" \n                                });\n                            });\n                        }\n                    });\n                }\n                return { categories: categories, flows: parsedFlows };\n            } catch (e) { \n                console.error(\"MobileWorkflowService Error:\", e);\n                return { categories: [], flows: [] }; \n            }\n        },\n        getFavorites: function() {\n            const saved = localStorage.getItem('steedos_fav_ids');\n            return saved ? JSON.parse(saved) : [];\n        },\n        toggleFavorite: function(flowId, isFav) {\n            let favs = this.getFavorites();\n            if (isFav) { \n                if (!favs.includes(flowId)) favs.push(flowId); \n            } else { \n                favs = favs.filter(id => id !== flowId); \n            }\n            localStorage.setItem('steedos_fav_ids', JSON.stringify(favs));\n            return favs;\n        }\n    };\n\n    const MobileAppState = { \n        allFlows: [], \n        categories: [], \n        favorites: [],\n        currentCategory: 'all',\n        /* Virtualization State */\n        filteredFlows: [],\n        renderedCount: 0,\n        batchSize: 50\n    };\n    \n    const tabsEl = document.getElementById('mobileCategoryTabs');\n    // Important: ContentEl is the scroll host\n    // listEl is the container for items\n    let contentEl, listEl, searchInput;\n\n    function initElements() {\n        // Find elements scoped to our container to avoid collisions if multiple instances\n        const wrapper = document.getElementById('steedosFlowSelectorMobile');\n        if (!wrapper) return false;\n        \n        searchInput = document.getElementById('mobileSearchInput');\n        // The scroll container is the div with class 'overflow-y-auto'\n        contentEl = wrapper.querySelector('.overflow-y-auto');\n        listEl = document.getElementById('mobileContentContainer');\n        return true;\n    }\n\n    async function initMobile() {\n        // Wait for DOM to be ready\n        if (!initElements()) {\n            setTimeout(initMobile, 100);\n            return;\n        }\n\n        try {\n            const data = await MobileWorkflowService.getData();\n            MobileAppState.allFlows = data.flows;\n            MobileAppState.categories = data.categories;\n            MobileAppState.favorites = MobileWorkflowService.getFavorites();\n            \n            initObserver();\n            renderMobileTabs();\n            renderMobileContent();\n            \n            // Search init\n            searchInput.addEventListener('input', (e) => {\n                renderMobileContent(e.target.value.trim());\n            });\n\n        } catch (e) {\n            console.error('Init error:', e);\n            if (listEl) listEl.innerHTML = `<div class=\"text-center pt-20 text-gray-400 text-sm\">加载失败，请检查网络连接</div>`;\n        }\n    }\n\n    let observer;\n    function initObserver() {\n        if (!contentEl) return;\n        \n        const options = {\n            root: contentEl, // Observe intersection with scroll container\n            rootMargin: '200px',\n            threshold: 0.1\n        };\n        \n        observer = new IntersectionObserver((entries) => {\n            entries.forEach(entry => {\n                if (entry.isIntersecting) {\n                    renderNextBatch();\n                }\n            });\n        }, options);\n    }\n\n    function renderMobileTabs(filterText = \"\") {\n        if (!tabsEl) return;\n        \n        // Save scroll position\n        const currentScroll = tabsEl.scrollLeft;\n        tabsEl.innerHTML = \"\";\n        \n        // Filter flows by search text to determine counts\n        let searchedFlows = MobileAppState.allFlows;\n        if (filterText && filterText.length > 0) {\n            searchedFlows = searchedFlows.filter(f => f.name.includes(filterText));\n        }\n        \n        // All category\n        const allCount = searchedFlows.length;\n        const isAllActive = MobileAppState.currentCategory === 'all';\n        // Only show count on 'all' if we are filtering, same as PC? PC usually shows (Total). Let's show (count).\n        const allTab = createTab('all', `全部 (${allCount})`, isAllActive);\n        tabsEl.appendChild(allTab);\n        \n        // Favorites\n        // For favorites, we filter the ALREADY SEARCHED flows to see if they are in favorites\n        const favCount = searchedFlows.filter(f => MobileAppState.favorites.includes(f.id)).length;\n        if (favCount > 0) {\n            const isFavActive = MobileAppState.currentCategory === 'fav';\n            const favTab = createTab('fav', `★ 收藏 (${favCount})`, isFavActive);\n            tabsEl.appendChild(favTab);\n        }\n        \n        // Category tabs\n        MobileAppState.categories.forEach(cat => {\n            const count = searchedFlows.filter(f => f.categoryId === cat._id).length;\n            if (count > 0) {\n                const isActive = MobileAppState.currentCategory === cat._id;\n                const tab = createTab(cat._id, `${cat.name} (${count})`, isActive);\n                tabsEl.appendChild(tab);\n            }\n        });\n        \n        // Restore scroll position\n        tabsEl.scrollLeft = currentScroll;\n    }\n\n    function createTab(catId, label, isActive) {\n        const tab = document.createElement('button');\n        const baseClass = \"mobile-category-pill shrink-0 whitespace-nowrap rounded-full px-4 py-2 text-sm font-medium transition-all duration-200\";\n        const activeClass = \"bg-blue-500 text-white shadow-md\";\n        const inactiveClass = \"bg-white text-gray-700 border border-gray-200 active:bg-gray-50\";\n        \n        tab.className = `${baseClass} ${isActive ? activeClass : inactiveClass}`;\n        tab.textContent = label;\n        tab.dataset.categoryId = catId;\n        \n        tab.onclick = () => {\n            MobileAppState.currentCategory = catId;\n            // Pass current search text to preserve filter\n            renderMobileContent(document.getElementById('mobileSearchInput').value.trim());\n        };\n        \n        return tab;\n    }\n\n    function renderMobileContent(filterText = \"\") {\n        if (!contentEl || !listEl) return;\n        \n        const isSearching = filterText.length > 0;\n        let flows = MobileAppState.allFlows;\n        \n        // 1. First filter by search text\n        if (isSearching) {\n            flows = flows.filter(f => f.name.includes(filterText));\n        }\n\n        // 2. Then filter by category\n        if (MobileAppState.currentCategory === 'fav') {\n            flows = flows.filter(f => MobileAppState.favorites.includes(f.id));\n        } else if (MobileAppState.currentCategory !== 'all') {\n            flows = flows.filter(f => f.categoryId === MobileAppState.currentCategory);\n        }\n        \n        const flowsToShow = flows;\n        \n        // Update tabs to reflect these search results\n        renderMobileTabs(filterText);\n        \n        listEl.innerHTML = \"\";\n        contentEl.scrollTop = 0;\n        \n        if (flowsToShow.length === 0) {\n            listEl.innerHTML = `\n                <div class=\"flex flex-col items-center justify-center pt-20 text-center\">\n                    <div class=\"text-gray-300 text-7xl mb-4\">∅</div>\n                    <div class=\"text-gray-400 text-sm\">${isSearching ? '未找到匹配的流程' : '此分类暂无流程'}</div>\\n                </div>\n            `;\n            return;\n        }\n        \n        MobileAppState.filteredFlows = flowsToShow;\n        MobileAppState.renderedCount = 0;\n        \n        renderNextBatch();\n        updateSentinel();\n    }\n\n    function renderNextBatch() {\n        const { filteredFlows, renderedCount, batchSize } = MobileAppState;\n        const total = filteredFlows.length;\n        if (renderedCount >= total) return;\n        \n        const nextBatch = filteredFlows.slice(renderedCount, renderedCount + batchSize);\n        const fragment = document.createDocumentFragment();\n        \n        nextBatch.forEach((flow, i) => {\n            const index = renderedCount + i;\n            const card = createMobileFlowCard(flow, index);\n            \n            // Remove animation for later batches to avoid scroll lag appearance\n            if (renderedCount > 0) {\n                card.style.animationDelay = '0s';\n            }\n            \n            fragment.appendChild(card);\n        });\n        \n        // Remove sentinel if exists\n        const sentinel = document.getElementById('scroll-sentinel');\n        if (sentinel) sentinel.remove();\n        \n        listEl.appendChild(fragment);\n        MobileAppState.renderedCount += nextBatch.length;\n        \n        updateSentinel();\n    }\n\n    function updateSentinel() {\n        if (MobileAppState.renderedCount < MobileAppState.filteredFlows.length) {\n            const sentinel = document.createElement('div');\n            sentinel.id = 'scroll-sentinel';\n            sentinel.className = 'flex justify-center p-4';\n            sentinel.innerHTML = '<span class=\"text-gray-400 text-xs\">加载更多...</span>';\n            listEl.appendChild(sentinel);\n            if (observer) observer.observe(sentinel);\n        }\n    }\n\n    function createMobileFlowCard(flow, index) {\n        const isFav = MobileAppState.favorites.includes(flow.id);\n        const colorMap = [\n            'bg-blue-50 text-blue-600', \n            'bg-orange-50 text-orange-600', \n            'bg-emerald-50 text-emerald-600', \n            'bg-indigo-50 text-indigo-600',\n            'bg-purple-50 text-purple-600',\n            'bg-pink-50 text-pink-600'\n        ];\n        const colorClass = colorMap[(flow.name.length + index) % colorMap.length];\n        const firstChar = flow.name.replace(/【.*?】/g, '').charAt(0) || flow.name.charAt(0);\n        \n        const card = document.createElement('div');\n        card.className = 'relative flex items-center gap-3 rounded-2xl border border-gray-200 bg-white p-4 shadow-sm transition-all duration-200 active:scale-[0.97] active:bg-gray-50';\n        card.style.animation = 'flowCardSlideIn 0.4s ease-out forwards';\n        card.style.animationDelay = `${Math.min(index * 0.05, 0.5)}s`;\n        card.style.opacity = '0';\n        \n        const iconClass = isFav ? 'text-yellow-400 fill-current' : 'text-gray-300 fill-none stroke-current stroke-[1.5]';\n        \n        card.innerHTML = `\n            <div class=\"flex h-14 w-14 shrink-0 items-center justify-center rounded-xl text-lg font-bold ${colorClass}\">\n                ${firstChar}\n            </div>\n            <div class=\"flex-1 min-w-0\">\n                <div class=\"text-base font-medium text-gray-900 leading-snug line-clamp-3\" title=\"${flow.name}\">\n                    ${flow.name}\n                </div>\n            </div>\n            <button class=\"star-btn shrink-0 flex h-10 w-10 items-center justify-center rounded-full transition-all duration-200 active:scale-90 ${isFav ? 'bg-yellow-50' : 'active:bg-gray-100'}\" title=\"${isFav ? '取消收藏' : '收藏'}\">\n                <svg class=\"h-6 w-6 transition-colors duration-300 ${iconClass}\" viewBox=\"0 0 24 24\">\n                    <path stroke-linecap=\\\"round\\\" stroke-linejoin=\\\"round\\\" d=\\\"M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.562.562 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z\\\" />\\n                </svg>\\n            </button>\\n        `;\n        \n        // Click card to select flow\n        card.onclick = (e) => {\n            if (!e.target.closest('.star-btn')) {\n                setTimeout(() => {\n                    data._scoped.doAction([\n                        { \n                            \"actionType\": \"broadcast\", \n                            \"args\": { \"eventName\": \"flows.selected\" }, \n                            \"data\": { \"value\": flow.id } \n                        }\n                    ]);\n                }, 50);\n            }\n        };\n        \n        // Star button to toggle favorite\n        const starBtn = card.querySelector('.star-btn');\n        const starIcon = starBtn.querySelector('svg');\n        starBtn.onclick = (e) => {\n            e.stopPropagation();\n            const newFavState = !isFav;\n            MobileAppState.favorites = MobileWorkflowService.toggleFavorite(flow.id, newFavState);\n            \n            // Update UI\n            if (newFavState) {\n                starBtn.classList.add('bg-yellow-50');\n                starBtn.classList.remove('active:bg-gray-100');\n                starIcon.setAttribute('class', 'h-6 w-6 transition-colors duration-300 text-yellow-400 fill-current');\n            } else {\n                starBtn.classList.remove('bg-yellow-50');\n                starBtn.classList.add('active:bg-gray-100');\n                starIcon.setAttribute('class', 'h-6 w-6 transition-colors duration-300 text-gray-300 fill-none stroke-current stroke-[1.5]');\n            }\n            \n            // Refresh tabs and content after short delay\n            setTimeout(() => {\n                renderMobileTabs();\n                renderMobileContent(searchInput.value.trim());\n            }, 300);\n        };\n        \n        return card;\n    }\n\n    // Initialize\n    initMobile();\n</script>",
+    "template": "<style>\n    @keyframes fadeUpSpring {\n        0% { opacity: 0; transform: translateY(10px); }\n        100% { opacity: 1; transform: translateY(0); }\n    }\n    \n    /* Mobile-optimized scrollbars */\n    ::-webkit-scrollbar {\n        width: 4px;\n        height: 4px;\n    }\n    ::-webkit-scrollbar-track {\n        background: transparent;\n    }\n    ::-webkit-scrollbar-thumb {\n        background-color: rgba(0, 0, 0, 0.2);\n        border-radius: 4px;\n    }\n\n    /* Force full screen modal for mobile */\n    .antd-Modal:has(#steedosFlowSelectorMobile) {\n        top: 0 !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        max-width: 100vw !important;\n        width: 100vw !important;\n        height: 100vh !important;\n        height: 100dvh !important;\n    }\n\n    .antd-Modal-content:has(#steedosFlowSelectorMobile) {\n        height: 100vh !important;\n        height: 100dvh !important;\n        padding-bottom: 0 !important;\n        display: flex !important;\n        flex-direction: column !important;\n        border-radius: 0 !important;\n        overflow: hidden !important;\n    }\n\n    .antd-Modal-body:has(#steedosFlowSelectorMobile) {\n        margin: 0 !important;\n        flex: 1 !important;\n        height: auto !important;\n        overflow: hidden !important;\n        padding: 0 !important;\n        display: flex !important;\n        flex-direction: column !important;\n    }\n    \n    .antd-Service, .liquid-amis-container {\n        display: flex; /* Ensure flex propagation */\n        flex-direction: column;\n        height: 100%;\n        overflow: hidden; /* Prevent double scrollbars */\n    }\n\n    /* Mobile category selector styles */\n    .mobile-category-pill {\n        -webkit-tap-highlight-color: transparent;\n        touch-action: manipulation;\n    }\n\n    /* Flow card animations */\n    @keyframes flowCardSlideIn {\n        0% {\n            opacity: 0;\n            transform: translateY(20px);\n        }\n        100% {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n</style>\n\n<!-- Main Mobile Container -->\n<div id=\"steedosFlowSelectorMobile\" class=\"flex flex-col h-full w-full bg-[#F5F5F7] font-sans text-gray-900 overflow-hidden\">\n    \n    <!-- Top Header Section -->\n    <div class=\"shrink-0 bg-white border-b border-gray-200 shadow-sm pt-4\">\n        \n        <!-- Search Bar -->\n        <div class=\"px-4 pb-3\">\n            <div class=\"relative\">\n                <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-gray-400\">\n                    <svg class=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n                        <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"></line>\n                    </svg>\n                </div>\n                <input \n                    type=\"text\" \n                    id=\"mobileSearchInput\" \n                    placeholder=\"搜索流程...\" \n                    class=\"w-full rounded-xl border border-gray-200 bg-gray-50 py-2.5 pl-10 pr-3 text-base text-gray-900 placeholder:text-gray-400 outline-none transition-all duration-200 focus:bg-white focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20\"\n                >\n            </div>\n        </div>\n        \n        <!-- Category Tabs - Horizontal Scroll -->\n        <div class=\"overflow-x-auto scrollbar-hide pb-2\">\n            <div id=\"mobileCategoryTabs\" class=\"flex gap-2 px-4 min-w-full\">\n                <!-- Categories will be inserted here -->\n            </div>\n        </div>\n    </div>\n    \n    <!-- Main Content Area -->\n    <!-- Added min-h-0 and webkit-overflow-scrolling for better mobile scrolling -->\n    <div class=\"flex-1 overflow-y-auto scroll-smooth px-4 py-4 min-h-0\" style=\"-webkit-overflow-scrolling: touch;\">\n        <div id=\"mobileContentContainer\" class=\"space-y-3 pb-safe\">\n            <div class=\"flex flex-col items-center justify-center pt-20 text-center\">\n                <div class=\"inline-flex items-center gap-2 text-gray-400 text-sm animate-pulse\">\n                    <svg class=\"animate-spin h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n                        <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n                        <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z\"></path>\n                    </svg>\n                    <span>正在加载...</span>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<script>\n    const MobileWorkflowService = {\n        apiBase: \"\",\n        getHeaders: function() { return { 'Content-Type': 'application/json' }; },\n        getData: async function() {\n            try {\n                const appId = (typeof data !== 'undefined' && data.context && data.context.app_id) ? data.context.app_id : \"\";\n                // Use relative path directly to avoid cross-origin issues if apiBase is mixed up\n                const url = \"/service/api/flows/getList?action=new&appId=\" + encodeURIComponent(appId);\n                const res = await fetch(url, { headers: this.getHeaders() });\n                const treeData = await res.json();\n                const categories = [];\n                const parsedFlows = [];\n                if (Array.isArray(treeData)) {\n                    treeData.forEach(cat => {\n                        categories.push({ _id: cat._id, name: cat.name });\n                        if (Array.isArray(cat.flows)) {\n                            cat.flows.forEach(f => {\n                                parsedFlows.push({\n                                    id: f._id, \n                                    name: f.name, \n                                    categoryId: cat._id, \n                                    categoryName: cat.name || \"其他流程\" \n                                });\n                            });\n                        }\n                    });\n                }\n                return { categories: categories, flows: parsedFlows };\n            } catch (e) { \n                console.error(\"MobileWorkflowService Error:\", e);\n                return { categories: [], flows: [] }; \n            }\n        },\n        getFavorites: function() {\n            const saved = localStorage.getItem('steedos_fav_ids');\n            return saved ? JSON.parse(saved) : [];\n        },\n        toggleFavorite: function(flowId, isFav) {\n            let favs = this.getFavorites();\n            if (isFav) { \n                if (!favs.includes(flowId)) favs.push(flowId); \n            } else { \n                favs = favs.filter(id => id !== flowId); \n            }\n            localStorage.setItem('steedos_fav_ids', JSON.stringify(favs));\n            return favs;\n        }\n    };\n\n    const MobileAppState = { \n        allFlows: [], \n        categories: [], \n        favorites: [],\n        currentCategory: 'all',\n        /* Virtualization State */\n        filteredFlows: [],\n        renderedCount: 0,\n        batchSize: 50\n    };\n    \n    function escapeHtml(str) {\n        return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\"/g, '&quot;').replace(/'/g, '&#39;');\n    }\n\n    const tabsEl = document.getElementById('mobileCategoryTabs');\n    // Important: ContentEl is the scroll host\n    // listEl is the container for items\n    let contentEl, listEl, searchInput;\n\n    function initElements() {\n        // Find elements scoped to our container to avoid collisions if multiple instances\n        const wrapper = document.getElementById('steedosFlowSelectorMobile');\n        if (!wrapper) return false;\n        \n        searchInput = document.getElementById('mobileSearchInput');\n        // The scroll container is the div with class 'overflow-y-auto'\n        contentEl = wrapper.querySelector('.overflow-y-auto');\n        listEl = document.getElementById('mobileContentContainer');\n        return true;\n    }\n\n    async function initMobile() {\n        // Wait for DOM to be ready\n        if (!initElements()) {\n            setTimeout(initMobile, 100);\n            return;\n        }\n\n        try {\n            const data = await MobileWorkflowService.getData();\n            MobileAppState.allFlows = data.flows;\n            MobileAppState.categories = data.categories;\n            MobileAppState.favorites = MobileWorkflowService.getFavorites();\n            \n            initObserver();\n            renderMobileTabs();\n            renderMobileContent();\n            \n            // Search init\n            let _isComposing = false;\n            let _searchTimer = null;\n            searchInput.addEventListener('compositionstart', function() { _isComposing = true; });\n            searchInput.addEventListener('compositionend', function(e) {\n                _isComposing = false;\n                clearTimeout(_searchTimer);\n                renderMobileContent(e.target.value.trim());\n            });\n            searchInput.addEventListener('input', function(e) {\n                if (_isComposing) return;\n                clearTimeout(_searchTimer);\n                _searchTimer = setTimeout(function() { renderMobileContent(e.target.value.trim()); }, 300);\n            });\n\n        } catch (e) {\n            console.error('Init error:', e);\n            if (listEl) listEl.innerHTML = `<div class=\"text-center pt-20 text-gray-400 text-sm\">加载失败，请检查网络连接</div>`;\n        }\n    }\n\n    let observer;\n    function initObserver() {\n        if (!contentEl) return;\n        \n        const options = {\n            root: contentEl, // Observe intersection with scroll container\n            rootMargin: '200px',\n            threshold: 0.1\n        };\n        \n        observer = new IntersectionObserver((entries) => {\n            entries.forEach(entry => {\n                if (entry.isIntersecting) {\n                    renderNextBatch();\n                }\n            });\n        }, options);\n    }\n\n    function renderMobileTabs(filterText = \"\") {\n        if (!tabsEl) return;\n        \n        // Save scroll position\n        const currentScroll = tabsEl.scrollLeft;\n        tabsEl.innerHTML = \"\";\n        \n        // Filter flows by search text to determine counts\n        let searchedFlows = MobileAppState.allFlows;\n        if (filterText && filterText.length > 0) {\n            searchedFlows = searchedFlows.filter(f => f.name.toLowerCase().includes(filterText.toLowerCase()));\n        }\n        \n        // All category\n        const allCount = searchedFlows.length;\n        const isAllActive = MobileAppState.currentCategory === 'all';\n        // Only show count on 'all' if we are filtering, same as PC? PC usually shows (Total). Let's show (count).\n        const allTab = createTab('all', `全部 (${allCount})`, isAllActive);\n        tabsEl.appendChild(allTab);\n        \n        // Favorites\n        // For favorites, we filter the ALREADY SEARCHED flows to see if they are in favorites\n        const favCount = searchedFlows.filter(f => MobileAppState.favorites.includes(f.id)).length;\n        if (favCount > 0) {\n            const isFavActive = MobileAppState.currentCategory === 'fav';\n            const favTab = createTab('fav', `★ 收藏 (${favCount})`, isFavActive);\n            tabsEl.appendChild(favTab);\n        }\n        \n        // Category tabs\n        MobileAppState.categories.forEach(cat => {\n            const count = searchedFlows.filter(f => f.categoryId === cat._id).length;\n            if (count > 0) {\n                const isActive = MobileAppState.currentCategory === cat._id;\n                const tab = createTab(cat._id, `${cat.name} (${count})`, isActive);\n                tabsEl.appendChild(tab);\n            }\n        });\n        \n        // Restore scroll position\n        tabsEl.scrollLeft = currentScroll;\n    }\n\n    function createTab(catId, label, isActive) {\n        const tab = document.createElement('button');\n        const baseClass = \"mobile-category-pill shrink-0 whitespace-nowrap rounded-full px-4 py-2 text-sm font-medium transition-all duration-200\";\n        const activeClass = \"bg-blue-500 text-white shadow-md\";\n        const inactiveClass = \"bg-white text-gray-700 border border-gray-200 active:bg-gray-50\";\n        \n        tab.className = `${baseClass} ${isActive ? activeClass : inactiveClass}`;\n        tab.textContent = label;\n        tab.dataset.categoryId = catId;\n        \n        tab.onclick = () => {\n            MobileAppState.currentCategory = catId;\n            // Pass current search text to preserve filter\n            renderMobileContent(document.getElementById('mobileSearchInput').value.trim());\n        };\n        \n        return tab;\n    }\n\n    function renderMobileContent(filterText = \"\") {\n        if (!contentEl || !listEl) return;\n        \n        const isSearching = filterText.length > 0;\n        let flows = MobileAppState.allFlows;\n        \n        // 1. First filter by search text\n        if (isSearching) {\n            flows = flows.filter(f => f.name.toLowerCase().includes(filterText.toLowerCase()));\n        }\n\n        // 2. Then filter by category\n        if (MobileAppState.currentCategory === 'fav') {\n            flows = flows.filter(f => MobileAppState.favorites.includes(f.id));\n        } else if (MobileAppState.currentCategory !== 'all') {\n            flows = flows.filter(f => f.categoryId === MobileAppState.currentCategory);\n        }\n        \n        const flowsToShow = flows;\n        \n        // Update tabs to reflect these search results\n        renderMobileTabs(filterText);\n        \n        listEl.innerHTML = \"\";\n        contentEl.scrollTop = 0;\n        \n        if (flowsToShow.length === 0) {\n            listEl.innerHTML = `\n                <div class=\"flex flex-col items-center justify-center pt-20 text-center\">\n                    <div class=\"text-gray-300 text-7xl mb-4\">∅</div>\n                    <div class=\"text-gray-400 text-sm\">${isSearching ? '未找到匹配的流程' : '此分类暂无流程'}</div>\\n                </div>\n            `;\n            return;\n        }\n        \n        MobileAppState.filteredFlows = flowsToShow;\n        MobileAppState.renderedCount = 0;\n        \n        renderNextBatch();\n        updateSentinel();\n    }\n\n    function renderNextBatch() {\n        const { filteredFlows, renderedCount, batchSize } = MobileAppState;\n        const total = filteredFlows.length;\n        if (renderedCount >= total) return;\n        \n        const nextBatch = filteredFlows.slice(renderedCount, renderedCount + batchSize);\n        const fragment = document.createDocumentFragment();\n        \n        nextBatch.forEach((flow, i) => {\n            const index = renderedCount + i;\n            const card = createMobileFlowCard(flow, index);\n            \n            // Remove animation for later batches to avoid scroll lag appearance\n            if (renderedCount > 0) {\n                card.style.animationDelay = '0s';\n            }\n            \n            fragment.appendChild(card);\n        });\n        \n        // Remove sentinel if exists\n        const sentinel = document.getElementById('scroll-sentinel');\n        if (sentinel) sentinel.remove();\n        \n        listEl.appendChild(fragment);\n        MobileAppState.renderedCount += nextBatch.length;\n        \n        updateSentinel();\n    }\n\n    function updateSentinel() {\n        if (MobileAppState.renderedCount < MobileAppState.filteredFlows.length) {\n            const sentinel = document.createElement('div');\n            sentinel.id = 'scroll-sentinel';\n            sentinel.className = 'flex justify-center p-4';\n            sentinel.innerHTML = '<span class=\"text-gray-400 text-xs\">加载更多...</span>';\n            listEl.appendChild(sentinel);\n            if (observer) observer.observe(sentinel);\n        }\n    }\n\n    function createMobileFlowCard(flow, index) {\n        const isFav = MobileAppState.favorites.includes(flow.id);\n        const colorMap = [\n            'bg-blue-50 text-blue-600', \n            'bg-orange-50 text-orange-600', \n            'bg-emerald-50 text-emerald-600', \n            'bg-indigo-50 text-indigo-600',\n            'bg-purple-50 text-purple-600',\n            'bg-pink-50 text-pink-600'\n        ];\n        const colorClass = colorMap[(flow.name.length + index) % colorMap.length];\n        const firstChar = flow.name.replace(/【.*?】/g, '').charAt(0) || flow.name.charAt(0);\n        \n        const card = document.createElement('div');\n        card.className = 'relative flex items-center gap-3 rounded-2xl border border-gray-200 bg-white p-4 shadow-sm transition-all duration-200 active:scale-[0.97] active:bg-gray-50';\n        card.style.animation = 'flowCardSlideIn 0.4s ease-out forwards';\n        card.style.animationDelay = `${Math.min(index * 0.05, 0.5)}s`;\n        card.style.opacity = '0';\n        \n        const iconClass = isFav ? 'text-yellow-400 fill-current' : 'text-gray-300 fill-none stroke-current stroke-[1.5]';\n        \n        card.innerHTML = `\n            <div class=\"flex h-14 w-14 shrink-0 items-center justify-center rounded-xl text-lg font-bold ${colorClass}\">\n                ${escapeHtml(firstChar)}\n            </div>\n            <div class=\"flex-1 min-w-0\">\n                <div class=\"text-base font-medium text-gray-900 leading-snug line-clamp-3\" title=\"${escapeHtml(flow.name)}\">\n                    ${escapeHtml(flow.name)}\n                </div>\n            </div>\n            <button class=\"star-btn shrink-0 flex h-10 w-10 items-center justify-center rounded-full transition-all duration-200 active:scale-90 ${isFav ? 'bg-yellow-50' : 'active:bg-gray-100'}\" title=\"${isFav ? '取消收藏' : '收藏'}\">\n                <svg class=\"h-6 w-6 transition-colors duration-300 ${iconClass}\" viewBox=\"0 0 24 24\">\n                    <path stroke-linecap=\\\"round\\\" stroke-linejoin=\\\"round\\\" d=\\\"M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.562.562 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z\\\" />\\n                </svg>\\n            </button>\\n        `;\n        \n        // Click card to select flow\n        card.onclick = (e) => {\n            if (!e.target.closest('.star-btn')) {\n                setTimeout(() => {\n                    data._scoped.doAction([\n                        { \n                            \"actionType\": \"broadcast\", \n                            \"args\": { \"eventName\": \"flows.selected\" }, \n                            \"data\": { \"value\": flow.id } \n                        }\n                    ]);\n                }, 50);\n            }\n        };\n        \n        // Star button to toggle favorite\n        const starBtn = card.querySelector('.star-btn');\n        const starIcon = starBtn.querySelector('svg');\n        starBtn.onclick = (e) => {\n            e.stopPropagation();\n            const newFavState = !isFav;\n            MobileAppState.favorites = MobileWorkflowService.toggleFavorite(flow.id, newFavState);\n            \n            // Update UI\n            if (newFavState) {\n                starBtn.classList.add('bg-yellow-50');\n                starBtn.classList.remove('active:bg-gray-100');\n                starIcon.setAttribute('class', 'h-6 w-6 transition-colors duration-300 text-yellow-400 fill-current');\n            } else {\n                starBtn.classList.remove('bg-yellow-50');\n                starBtn.classList.add('active:bg-gray-100');\n                starIcon.setAttribute('class', 'h-6 w-6 transition-colors duration-300 text-gray-300 fill-none stroke-current stroke-[1.5]');\n            }\n            \n            // Refresh tabs and content after short delay\n            setTimeout(() => {\n                renderMobileTabs();\n                renderMobileContent(searchInput.value.trim());\n            }, 300);\n        };\n        \n        return card;\n    }\n\n    // Initialize\n    initMobile();\n</script>",
     "className": "h-full"
-}
+}

package/main/default/pages/page_instance_print.page.amis.json

@@ -419,5 +419,15 @@
             }
         }
     },
-    "wrapperCustomStyle": {}
+    "wrapperCustomStyle": {},
+    "onEvent": {
+        "init": {
+            "actions": [
+                {
+                    "actionType": "custom",
+                    "script": "document.querySelectorAll('link[rel=\"stylesheet\"]').forEach(link => { if (link.href.includes('salesforce-lightning-design-system.min.css')) { link.remove(); } });"
+                }
+            ]
+        }
+    }
 }

package/main/default/routes/am.router.js

@@ -540,6 +540,7 @@ router.put('/am/flows', async function (req, res) {
                     'created': now,
                     'created_by': userId,
                     'steps': flowCome['current']['steps'],
+                    'nextEvents': flowCome['current']['nextEvents'] || {},
                     'form_version': flow.current.form_version,
                     '_rev': flow.current._rev,
                     'flow': flowId,
@@ -554,7 +555,8 @@ router.put('/am/flows', async function (req, res) {
                 updateObj.$set = {
                     'current.modified': now,
                     'current.modified_by': userId,
-                    'current.steps': flowCome["current"]["steps"]
+                    'current.steps': flowCome["current"]["steps"],
+                    'current.nextEvents': flowCome["current"]["nextEvents"] || {},
                 }
             }
 

package/main/default/routes/api_auto_number.router.js

@@ -5,6 +5,7 @@ const objectql = require('@steedos/objectql');
 const _ = require('lodash');
 const UUFlowManager = require('../manager/uuflow_manager');
 const { requireAuthentication } = require("@steedos/auth");
+const { getCollection } = require('../utils/collection');
 
 // 获取用户当前的 approve
 const getUserApprove = ({ instance, userId }) => {
@@ -38,6 +39,91 @@ const getUserApprove = ({ instance, userId }) => {
     return currentApprove;
 };
 
+// ===== 新设计器 autoNumber 字段：基于字段配置直接生成编号 =====
+
+// 序号补零
+const padNumber = (num, length) => {
+    if (length <= 0) return String(num);
+    const str = String(num);
+    return str.length >= length ? str : '0'.repeat(length - str.length) + str;
+};
+
+// 根据日期格式生成日期片段
+const formatDatePart = (dateFormat, yyyy, mm, dd) => {
+    const mmStr = mm < 10 ? '0' + mm : String(mm);
+    const ddStr = dd < 10 ? '0' + dd : String(dd);
+    switch (dateFormat) {
+        case 'YYYY': return String(yyyy);
+        case 'YYYYMM': return String(yyyy) + mmStr;
+        case 'YYYYMMDD': return String(yyyy) + mmStr + ddStr;
+        default: return ''; // 'none' 或 undefined
+    }
+};
+
+// 根据重置周期判断是否需要重置序号
+const shouldResetNumber = (resetCycle, storedRule, yyyy, mm, dd) => {
+    switch (resetCycle) {
+        case 'yearly': return yyyy !== storedRule.year;
+        case 'monthly': return yyyy !== storedRule.year || mm !== storedRule.month;
+        case 'daily': return yyyy !== storedRule.year || mm !== storedRule.month || dd !== storedRule.day;
+        default: return false; // 'none' - 永不重置
+    }
+};
+
+/**
+ * 基于字段配置生成自动编号（新设计器 autoNumber 类型字段）
+ * 同样使用 instance_number_rules 集合做序号持久化，如果尚未创建规则记录则自动创建
+ */
+const generateAutoNumberFromFieldConfig = async (spaceId, fieldConfig) => {
+    const db = await getCollection("instance_number_rules");
+
+    const ruleName = fieldConfig.auto_number_name;
+    const prefix = fieldConfig.autoNumberPrefix || '';
+    const suffix = fieldConfig.autoNumberSuffix || '';
+    const paddingLen = fieldConfig.autoNumberPadding != null ? fieldConfig.autoNumberPadding : 4;
+    const dateFormat = fieldConfig.autoNumberDateFormat || 'YYYYMM';
+    const resetCycle = fieldConfig.autoNumberResetCycle || 'monthly';
+
+    const now = new Date();
+    const yyyy = now.getFullYear();
+    const mm = now.getMonth() + 1;
+    const dd = now.getDate();
+
+    let numberRules = await db.findOne({ space: spaceId, name: ruleName });
+
+    if (!numberRules) {
+        // 首次使用该字段，自动创建规则记录
+        await db.insertOne({
+            space: spaceId,
+            name: ruleName,
+            year: yyyy,
+            month: mm,
+            day: dd,
+            first_number: 1,
+            number: 0,
+            rules: '' // 新类型字段不使用 rules 模板
+        });
+        numberRules = await db.findOne({ space: spaceId, name: ruleName });
+    }
+
+    let nextNumber = (numberRules.number || 0) + 1;
+
+    if (shouldResetNumber(resetCycle, numberRules, yyyy, mm, dd)) {
+        nextNumber = numberRules.first_number || 1;
+    }
+
+    const paddedNumber = padNumber(nextNumber, paddingLen);
+    const datePart = formatDatePart(dateFormat, yyyy, mm, dd);
+    const autoNumber = prefix + datePart + paddedNumber + suffix;
+
+    await db.updateOne(
+        { _id: numberRules._id },
+        { $set: { year: yyyy, month: mm, day: dd, number: nextNumber } }
+    );
+
+    return autoNumber;
+};
+
 // 获取可编辑的自动编号字段
 const getEditableAutoNumberFields = async (step, formId, formVersion) => {
     const permissions = step.permissions || {};
@@ -45,10 +131,26 @@ const getEditableAutoNumberFields = async (step, formId, formVersion) => {
     const formV = await UUFlowManager.getFormVersion(form, formVersion);
     
     const autoNumberFields = [];
+    const pushedFieldKeys = new Set();
+
+    const getFieldKey = (field) => field?.code || field?.name;
+    const isAutoNumberTypeField = (field) => {
+        const fieldType = (field?.type || '').toString().toLowerCase();
+        return fieldType === 'autonumber' || field?.type === 'autoNumber';
+    };
+    const canGenerateAutoNumber = (field) => {
+        const fieldKey = getFieldKey(field);
+        if (!fieldKey) return false;
+        const permission = permissions[fieldKey];
+        if (permission === 'editable') return true;
+        return false;
+    };
     
     // 检查字段是否是自动编号字段（通过 formula 判断）
     const isAutoNumberField = (field) => {
-        return field.default_value && typeof field.default_value === 'string' && field.default_value.trim().startsWith('auto_number(');
+        if (!field) return false;
+        const hasLegacyAutoNumberFormula = field.default_value && typeof field.default_value === 'string' && field.default_value.trim().startsWith('auto_number(');
+        return hasLegacyAutoNumberFormula || isAutoNumberTypeField(field);
     };
     
     // 从 formula 中提取自动编号规则名称
@@ -57,32 +159,68 @@ const getEditableAutoNumberFields = async (step, formId, formVersion) => {
         const match = formula.match(/auto_number\s*\(\s*['"]?([^'"()]+?)['"]?\s*\)/);
         return match ? match[1].trim() : null;
     };
+
+    const getAutoNumberRuleName = (field) => {
+        // 1) 兼容旧字段公式：default_value = auto_number(...)
+        if (field?.default_value && typeof field.default_value === 'string') {
+            const byFormula = extractAutoNumberName(field.default_value);
+            if (byFormula) return byFormula;
+        }
+
+        // 2) 兼容常见字段属性命名
+        const fromProps =
+            field?.auto_number_name ||
+            field?.autoNumberName ||
+            field?.auto_number_rule ||
+            field?.autoNumberRule ||
+            field?.auto_number_rule_name ||
+            field?.autoNumberRuleName;
+        if (fromProps && typeof fromProps === 'string') {
+            return fromProps.trim();
+        }
+
+        // 3) 对于新设计器 autoNumber 字段，默认回退到字段标识（code/name）
+        return getFieldKey(field);
+    };
+
+    const tryPushAutoNumberField = (field) => {
+        if (!isAutoNumberField(field) || !canGenerateAutoNumber(field)) {
+            return;
+        }
+        const fieldKey = getFieldKey(field);
+        const autoNumberName = getAutoNumberRuleName(field);
+        if (!fieldKey || !autoNumberName || pushedFieldKeys.has(fieldKey)) {
+            return;
+        }
+        pushedFieldKeys.add(fieldKey);
+
+        const fieldInfo = {
+            code: fieldKey,
+            auto_number_name: autoNumberName,
+        };
+
+        // 新设计器 autoNumber 字段，携带配置属性用于直接生成编号
+        if (isAutoNumberTypeField(field)) {
+            fieldInfo.isNewType = true;
+            fieldInfo.autoNumberPrefix = field.autoNumberPrefix;
+            fieldInfo.autoNumberSuffix = field.autoNumberSuffix;
+            fieldInfo.autoNumberPadding = field.autoNumberPadding;
+            fieldInfo.autoNumberDateFormat = field.autoNumberDateFormat;
+            fieldInfo.autoNumberResetCycle = field.autoNumberResetCycle;
+        }
+
+        autoNumberFields.push(fieldInfo);
+    };
+
     for (const field of formV.fields || []) {
-        
         if (field.type === "section") {
             // 处理 section 中的字段
             for (const sectionField of field.fields || []) {
-                if (isAutoNumberField(sectionField) && permissions[sectionField.code] === "editable") {
-                    const autoNumberName = extractAutoNumberName(sectionField.default_value);
-                    if (autoNumberName) {
-                        autoNumberFields.push({
-                            code: sectionField.code,
-                            auto_number_name: autoNumberName
-                        });
-                    }
-                }
+                tryPushAutoNumberField(sectionField);
             }
         } else {
             // 处理普通字段
-            if (isAutoNumberField(field) && permissions[field.code] === "editable") {
-                const autoNumberName = extractAutoNumberName(field.default_value);
-                if (autoNumberName) {
-                    autoNumberFields.push({
-                        code: field.code,
-                        auto_number_name: autoNumberName
-                    });
-                }
-            }
+            tryPushAutoNumberField(field);
         }
     }
     
@@ -182,7 +320,6 @@ router.post('/api/workflow/v2/auto_number', requireAuthentication, async functio
 
         // 获取可编辑的自动编号字段
         const autoNumberFields = await getEditableAutoNumberFields(step, instance.form, instance.form_version);
-        
         if (autoNumberFields.length === 0) {
             return res.status(200).send({
                 success: true,
@@ -201,8 +338,14 @@ router.post('/api/workflow/v2/auto_number', requireAuthentication, async functio
                 continue;
             }
             
-            // 生成自动编号
-            const autoNumber = await instanceNumberBuilder(instance.space, field.auto_number_name);
+            let autoNumber;
+            if (field.isNewType) {
+                // 新设计器 autoNumber 字段：基于字段配置直接生成
+                autoNumber = await generateAutoNumberFromFieldConfig(instance.space, field);
+            } else {
+                // 旧规则：通过预配置的 instance_number_rules 记录生成
+                autoNumber = await instanceNumberBuilder(instance.space, field.auto_number_name);
+            }
             
             if (autoNumber && autoNumber._error) {
                 throw autoNumber._error;

package/main/default/routes/api_workflow_ai_form_design.router.js

@@ -75,6 +75,7 @@ router.post('/am/ai/form-design', async function auth(req, res, next) {
   - "org" — 组织（选择单个部门）
   - "orgMulti" — 组织（多选，选择多个部门）
   - "reference" — 对象选择（选择指定对象的记录，支持多选，可展示记录的多个字段）
+  - "richtext" — 富文本（支持格式化文本、颜色、链接等）
 - required: 布尔值，是否必填
 - colspan: 数字，字段占几列，取值范围 1~tableColumns。默认 1（占一列），设为 tableColumns 则独占一行。section 和 table 始终等于 tableColumns
 - description: 字符串，字段说明/提示文字，支持 HTML
@@ -168,6 +169,19 @@ router.post('/am/ai/form-design', async function auth(req, res, next) {
   - pickerMultiple: 布尔值，是否允许多选，默认 false
   - lookupFilters: 字符串，OData 过滤表达式，如 "status eq 'active'"
   - lookupDisplayFields: 数组，关联数据后额外展示的字段，格式 [{ "field": "字段API名", "label": "显示标签" }]
+  - lookupFillRules: 数组，填充规则，选择关联记录后将源字段值自动填充到表单其他字段。格式 [{ "sourceField": "关联对象的字段API名", "targetField": "当前表单中的目标字段name" }]
+    - 示例：选择合同后自动填充合同金额到表单的金额字段：lookupFillRules: [{ "sourceField": "amount", "targetField": "contract_amount" }]
+
+- member 类型（成员单选）填充规则：
+  - pickerFillRules: 数组，选择人员后将人员字段值自动填充到表单其他字段。源对象为 space_users。格式 [{ "sourceField": "源字段API名", "targetField": "当前表单中的目标字段name" }]
+  - sourceField 支持点号表示法，可访问关联对象的子属性。成员的 organization 字段引用了 organizations 对象，因此可以使用 "organization.xxx" 访问部门属性
+  - 可用的 organization 子属性示例：organization.name（部门名称）、organization.fullname（部门全称）等
+  - 示例：选择成员后自动填充其所属部门名称到文本字段：
+    pickerFillRules: [{ "sourceField": "organization.name", "targetField": "dept_name" }, { "sourceField": "name", "targetField": "user_name" }]
+
+- org 类型（部门单选）填充规则：
+  - pickerFillRules: 数组，选择部门后将部门字段值自动填充到表单其他字段。源对象为 organizations。格式同 member 的 pickerFillRules
+  - 示例：选择部门后自动填充部门全称到文本字段：pickerFillRules: [{ "sourceField": "fullname", "targetField": "org_fullname" }]
 
 - reference 类型（对象选择）：
   - reference_to: 字符串，关联对象的 API 名称，如 "contracts"、"accounts"
@@ -193,16 +207,22 @@ router.post('/am/ai/form-design', async function auth(req, res, next) {
 ## 事件脚本
 
 events 对象包含三个可选的 JavaScript 脚本：
-- onInit: 表单初始化时执行。可用参数：form (表单实例), fields (字段数据)
+- onInit: 表单初始化时执行。可用参数：form (表单实例), fields (字段数据), currentStep (当前审批步骤对象)
   - form.setFieldValue(fieldName, value) — 设置字段值
   - form.getFieldValue(fieldName) — 获取字段值
   - form.setFieldOptions(fieldName, options) — 设置下拉选项
   - form.setFieldHidden(fieldName, hidden) — 显隐字段
   - form.setFieldRequired(fieldName, required) — 设为必填
-- onValueChange: 字段值变化时执行。可用参数：field (变化的字段), value (新值), oldValue (旧值), form (表单实例), values (所有字段值)
-- onSubmit: 表单提交前执行。可用参数：form (表单实例), values (提交数据)。返回 false 可阻止提交
+  - form.currentStep — 当前审批步骤对象，包含 name(步骤名)、step_type(步骤类型: start/submit/sign/counterSign/condition)、_id 等属性
+- onValueChange: 字段值变化时执行。可用参数：field (变化的字段), value (新值), oldValue (旧值), form (表单实例), values (所有字段值), currentStep (当前审批步骤对象)
+- onSubmit: 表单提交前执行。可用参数：form (表单实例), values (提交数据), currentStep (当前审批步骤对象)。返回 false 可阻止提交
+
+所有脚本支持 async/await。
+⚠️ 脚本内容直接写代码体，参数（form、field、value 等）由运行时自动注入，**禁止用 function(...){} 包裹**。
+正确："if (field.name === 'x') { ... }"
+错误："function(field, value, oldValue, form, values) { ... }"
 
-所有脚本支持 async/await，示例：
+示例：
 \`\`\`javascript
 // onValueChange 示例
 if (field.name === 'quantity' || field.name === 'unit_price') {
@@ -227,14 +247,16 @@ if (field.name === 'quantity' || field.name === 'unit_price') {
 新版表单已**不再支持** instance_template（审批单模板）、form_script（表单脚本）、flow_events（流程事件），这些是旧版的遗留功能。当用户提供这些数据时，你需要：
 
 1. **分析其中的业务逻辑**，理解它们实现了什么功能
-2. **将业务逻辑迁移到新版机制中**：
-   - 字段显隐控制 → 转为字段的 visibilityRules
-   - 动态必填控制 → 转为字段的 requiredRules
-   - 字段值自动计算 → 转为 formula 类型字段，或写入 events.onValueChange
+2. **⭐ 声明式字段配置优先，脚本兜底**。迁移旧版脚本时，按以下优先级选择实现方式——能用字段属性声明式解决的，绝不写事件脚本：
+   - 数值范围校验（如金额上限/下限）→ number 字段的 **min / max** 属性（而非 onSubmit 脚本校验）
+   - 字段显隐控制 → 字段的 **visibilityRules**（而非 onValueChange 中 form.setFieldHidden()）
+   - 动态必填控制 → 字段的 **requiredRules**（而非 onValueChange 中 form.setFieldRequired()）
+   - 字段值自动计算 → **formula** 类型字段（而非 onValueChange 中 form.setFieldValue()），仅当公式语法无法表达时才退化到 onValueChange
+   - 跨对象属性引用（如旧公式 {applicant.organization.name}）→ 成员字段的 **pickerFillRules**，sourceField 使用点号表示法如 "organization.name"，targetField 指向目标文本字段
+   - 字段选项设置 → 字段的 **options** 属性（静态选项），仅动态/异步加载选项时才用 events.onInit / events.onValueChange 中 form.setFieldOptions()
    - 初始化赋值/选项加载 → 写入 events.onInit
-   - 值联动/级联逻辑 → 写入 events.onValueChange
-   - 提交前校验 → 写入 events.onSubmit
-   - 字段选项设置 → 转为字段的 options 属性，或通过 events.onInit / events.onValueChange 中 form.setFieldOptions() 设置
+   - 值联动/级联逻辑（无法用 formula 表达时）→ 写入 events.onValueChange
+   - 提交前复杂校验（无法用 min/max/required 等表达时）→ 写入 events.onSubmit
 3. **instance_template 仍可用于推断字段 label、colspan（列宽）和 rowspan（行高）**
 4. **不要在输出中返回** instance_template、form_script、flow_events 字段
 
@@ -313,8 +335,54 @@ if (field.name === 'quantity' || field.name === 'unit_price') {
 - 新版事件脚本使用 form.getFieldValue() / form.setFieldValue() / form.setFieldOptions() / form.setFieldHidden() / form.setFieldRequired() 等 API
 
 ### 流程事件 (flow_events)
-- 旧版流程级别的事件脚本
-- 分析其中的业务逻辑，合并迁移到新版的 events 中
+- 旧版流程级别的事件脚本，通常绑定在 jQuery 事件上（如 \`instance-before-submit\`、\`instance-before-save\` 等）
+- 分析其中的业务逻辑，**优先用字段声明式配置实现，无法声明式表达时才写入 events 脚本**
+- 常见迁移模式：
+  - \`instance-before-submit\` 中的数值范围校验（如 \`money >= 5000000\` 则阻止提交）→ **直接设置 number 字段的 max 属性**，如 \`"max": 4999999.99\`，无需写 onSubmit 脚本
+  - \`instance-before-submit\` 中的必填校验 → 设置字段 \`required: true\` 或 \`requiredRules\`
+  - \`instance-before-submit\` 中的复杂跨字段校验（如"结束日期必须大于开始日期"且无法用单字段属性表达）→ 写入 events.onSubmit，用 \`form.getFieldValue()\` 获取值，返回 \`false\` 阻止提交
+  - \`instance-before-save\` 中的自动赋值 → 写入 events.onInit 或 events.onValueChange
+  - \`WorkflowManager.getInstance().state\` 等实例状态判断 → 新版 onSubmit 仅在提交时触发，草稿保存不触发，通常可省略状态判断
+  - \`e.preventDefault()\` + \`toastr.error(msg)\` → 新版用 \`form.showError(msg); return false;\` 替代
+- 注意：旧版脚本中的字段引用（如 \`formValues['中文字段名']\`）需替换为新版英文字段 name
+- 注意：旧版脚本是 JavaScript 语法，其中被注释掉的代码（// 单行注释 或 /* */ 块注释）属于废弃逻辑，不需要识别和迁移，直接忽略即可
+- 迁移示例：
+  旧版 flow_events：
+  \`\`\`javascript
+  var money = parseFloat(formValues['申请增加额度']);
+  if (money >= 5000000) { e.preventDefault(); toastr.error('金额不能超过500万'); }
+  \`\`\`
+  新版迁移方式：**不写脚本**，直接在字段上配置：
+  \`\`\`json
+  { "name": "apply_increase_amount", "type": "number", "max": 4999999.99, "precision": 2 }
+  \`\`\`
+
+### 旧版 HTML 字段类型迁移
+- 旧版表单中存在 type 为 \"html\" 的字段，这是旧版的 HTML 编辑器字段，允许用户输入和编辑 HTML 格式的富文本内容
+- 新版表单中 **不再支持 \"html\" 类型**，已被 **\"richtext\"（富文本）** 类型完全替代
+- **迁移规则**：当遇到 type 为 \"html\" 的字段时，必须将其 type 改为 \"richtext\"，其余属性（name、label、required、colspan、defaultValue 等）保持不变
+- richtext 类型支持格式化文本、颜色、链接等富文本编辑功能，功能上完全覆盖旧版 html 类型
+- 迁移示例：
+  旧版字段：{ "name": "content", "label": "内容", "type": "html" }
+  新版字段：{ "name": "content", "label": "内容", "type": "richtext" }
+- migrationLog 记录格式："字段 <name>: type 从 html 转换为 richtext"
+
+### 旧公式字段跨对象引用迁移
+- 旧版表单中，公式字段可能通过 \`{applicant.organization.name}\`、\`{applicant.name}\` 等语法引用成员的关联属性。这种跨对象引用在新版中不再通过公式实现，而是通过**成员字段的 pickerFillRules（填充规则）**来替代。
+- 迁移方式：
+  1. 将引用跨对象属性的公式字段改为**普通文本字段**（type: "text"）作为目标字段
+  2. 在成员字段（type: "member"）上配置 **pickerFillRules**，使用点号表示法的 sourceField（如 "organization.name"），targetField 指向该文本字段
+  3. 如果 targetField 字段应为只读展示（即旧版是纯展示的公式字段），设置 readonly: true
+- 迁移示例：
+  旧版公式字段：\`{applicant.organization.name}\` 用于显示申请人所属部门名称
+  新版迁移方式：
+  1. 创建文本字段 { "name": "dept_name", "label": "所属部门", "type": "text", "readonly": true }
+  2. 在成员字段上配置 pickerFillRules: [{ "sourceField": "organization.name", "targetField": "dept_name" }]
+- 常见映射：
+  - \`{applicant.organization.name}\` → sourceField: "organization.name"
+  - \`{applicant.organization.fullname}\` → sourceField: "organization.fullname"
+  - \`{applicant.name}\` → sourceField: "name"
+  - \`{applicant.mobile}\` → sourceField: "mobile"
 
 ## 输出格式
 返回一个 JSON 对象，格式如下（不要有任何其他文字、解释、markdown 标记）：
@@ -325,8 +393,32 @@ if (field.name === 'quantity' || field.name === 'unit_price') {
     "onInit": "脚本代码或空字符串",
     "onValueChange": "脚本代码或空字符串",
     "onSubmit": "脚本代码或空字符串"
-  }
-}`;
+  },
+  "migrationLog": ["迁移记录，仅升级场景需要"]
+}
+
+### migrationLog（迁移记录）
+当用户提供了 flow_events、form_script、instance_template 中包含业务逻辑（如校验、赋值、显隐控制等脚本代码）时，必须在 migrationLog 数组中为每条被迁移的逻辑记录一条说明，格式：
+  "<来源>: <原逻辑简述> → <迁移到的具体位置>"
+
+迁移目标可以是以下任意一种：
+- 字段属性：如 "字段 apply_increase_amount 的 max:4999999.99"
+- 字段规则：如 "字段 remark 的 visibilityRules"、"字段 attachment_desc 的 requiredRules"
+- formula 字段：如 "新增 formula 字段 total_amount"
+- 事件脚本：如 "events.onSubmit"、"events.onValueChange"
+- 已省略（含原因）：如 "已省略（旧版 state=='draft' 判断，新版 onSubmit 仅提交时触发，无需判断）"
+
+示例：
+"migrationLog": [
+  "flow_events: 申请增加额度>=500万阻止提交 → 字段 apply_increase_amount 的 max:4999999.99",
+  "flow_events: ins.state!='draft' 状态判断 → 已省略（新版 onSubmit 仅提交时触发）",
+  "form_script: 根据类型字段显隐备注 → 字段 remark 的 visibilityRules",
+  "form_script: 选择部门后级联加载人员选项 → events.onValueChange",
+  "instance_template: {applicant.organization.name} 跨对象引用 → 成员字段 applicant 的 pickerFillRules (organization.name → dept_name)"
+]
+
+⚠️ 如果 flow_events 或 form_script 不为空但 migrationLog 为空数组，视为错误。每条旧版逻辑都必须有对应的迁移记录，不允许静默丢弃。
+如果没有提供 flow_events、form_script，或它们为空，则 migrationLog 可省略或为空数组。`;
 
     // Build current fields description
     const fieldsJson = JSON.stringify(fields || [], null, 2);
@@ -439,7 +531,7 @@ ${userRequest}
       'text', 'textarea', 'number', 'date', 'datetime', 'time',
       'select', 'multiSelect', 'checkbox', 'radio', 'file', 'image',
       'lookup', 'section', 'table', 'grid', 'formula',
-      'member', 'memberMulti', 'org', 'orgMulti', 'reference'
+      'member', 'memberMulti', 'org', 'orgMulti', 'reference', 'richtext'
     ];
     const jsIdentifierRe = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;
     function sanitizeName(name) {
@@ -458,6 +550,8 @@ ${userRequest}
         if (field.type === 'groupPicker') field.type = field.pickerMultiple ? 'orgMulti' : 'org';
         // Backward compat: map legacy select + pickerMultiple to multiSelect
         if (field.type === 'select' && field.pickerMultiple) field.type = 'multiSelect';
+        // Backward compat: map legacy html type to richtext
+        if (field.type === 'html') field.type = 'richtext';
         if (field.type && !validTypes.includes(field.type)) {
           field.type = 'text'; // fallback to text for unknown types
         }
@@ -481,6 +575,8 @@ ${userRequest}
             if (child.type === 'userPicker') child.type = child.pickerMultiple ? 'memberMulti' : 'member';
             if (child.type === 'groupPicker') child.type = child.pickerMultiple ? 'orgMulti' : 'org';
             if (child.type === 'select' && child.pickerMultiple) child.type = 'multiSelect';
+            // Backward compat: map legacy html type to richtext
+            if (child.type === 'html') child.type = 'richtext';
             if (child.type && !validTypes.includes(child.type)) {
               child.type = 'text';
             }
@@ -512,6 +608,10 @@ ${userRequest}
         onSubmit: result.events.onSubmit || '',
       },
     };
+    // Pass through migrationLog if present (for upgrade audit trail)
+    if (Array.isArray(result.migrationLog) && result.migrationLog.length > 0) {
+      responseData.migrationLog = result.migrationLog;
+    }
     return res.json(responseData);
 
   } catch (error) {