编辑页面

HTML内容
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>沙集e站</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html, body {
            height: 100%;
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
            background: #f5f5f5;
            color: #333;
            font-size: 14px;
        }
        .app {
            height: 100%;
            max-width: 430px;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            background: #f5f5f5;
        }
        
        /* 顶部搜索栏 - 重新设计 */
        .search-bar {
            background: #fff;
            padding: 12px 15px 14px;
            display: flex;
            align-items: center;
            gap: 12px;
            flex-shrink: 0;
            border-bottom: 1px solid #f0f0f0;
        }
        .city-selector {
            display: flex;
            align-items: center;
            gap: 4px;
            color: #333;
            font-size: 14px;
            font-weight: 500;
            white-space: nowrap;
        }
        .city-selector::after {
            content: '▼';
            font-size: 8px;
            color: #999;
        }
        .search-box {
            flex: 1;
            height: 36px;
            background: #f5f5f5;
            border-radius: 18px;
            display: flex;
            align-items: center;
            padding: 0 14px;
            cursor: pointer;
        }
        .search-box svg {
            width: 15px;
            height: 15px;
            stroke: #999;
            stroke-width: 2;
            fill: none;
            flex-shrink: 0;
        }
        .search-box input {
            border: none;
            outline: none;
            flex: 1;
            font-size: 13px;
            background: transparent;
            pointer-events: none;
            color: #999;
            margin-left: 6px;
        }
        
        /* 页面容器 */
        .page-container {
            flex: 1;
            overflow-y: auto;
            overflow-x: hidden;
            padding-bottom: 55px;
        }
        .page { display: none; height: 100%; }
        .page.active { display: flex; flex-direction: column; }
        
        /* 首页 - 极简风格 */
        .home-page { background: #fff; }
        
        /* Banner轮播 */
        .banner {
            width: 100%;
            height: 120px;
            position: relative;
            overflow: hidden;
        }
        .banner-slider {
            display: flex;
            height: 100%;
            transition: transform 0.3s ease;
        }
        .banner-slide {
            width: 100%;
            height: 100%;
            flex-shrink: 0;
        }
        .banner-slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .banner-dots {
            position: absolute;
            bottom: 8px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 6px;
        }
        .banner-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: rgba(255,255,255,0.6);
        }
        .banner-dot.active {
            background: #fff;
            width: 16px;
            border-radius: 3px;
        }
        
        /* 分类导航 - 极简线性 */
        .category-nav {
            background: #fff;
            padding: 20px 15px;
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 8px;
        }
        .cat-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            cursor: pointer;
            padding: 8px 4px;
        }
        .cat-icon {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: #f5f5f5;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 6px;
        }
        .cat-icon svg {
            width: 22px;
            height: 22px;
            stroke: #666;
            stroke-width: 1.5;
            fill: none;
        }
        .cat-item .cat-name { font-size: 12px; color: #333; }
        
        /* 信息流 - 极简无边界 */
        .info-flow { padding: 0 0 15px 0; }
        .flow-title {
            font-size: 16px;
            font-weight: 600;
            color: #333;
            padding: 15px 15px 12px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: #fff;
            border-bottom: 1px solid #f5f5f5;
        }
        .flow-title .more { font-size: 13px; color: #999; font-weight: normal; }
        
        /* 信息卡片 - 扁平化 */
        .post-card {
            background: #fff;
            padding: 15px;
            cursor: pointer;
            border-bottom: 1px solid #f5f5f5;
        }
        .post-header { display: flex; justify-content: space-between; align-items: flex-start; }
        .post-title { font-size: 15px; color: #333; flex: 1; line-height: 1.5; }
        .post-tag { 
            font-size: 10px; 
            color: #fff; 
            background: #e54d4d;
            padding: 2px 6px; 
            border-radius: 2px; 
            margin-left: 8px;
        }
        
        .post-content { display: flex; gap: 12px; margin-top: 12px; }
        .post-img {
            width: 80px;
            height: 80px;
            background: #f5f5f5;
            border-radius: 4px;
            object-fit: cover;
            flex-shrink: 0;
        }
        .post-info { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
        .post-desc {
            font-size: 13px;
            color: #999;
            line-height: 1.6;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        .post-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; }
        .post-price { font-size: 15px; font-weight: 600; color: #e54d4d; }
        .post-time { font-size: 12px; color: #999; }
        
        /* 信息页 */
        .info-page { background: #fff; }
        .list-header {
            background: #fff;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            gap: 10px;
            border-bottom: 1px solid #f0f0f0;
        }
        .back-btn {
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: #333;
            font-size: 18px;
        }
        .list-title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
        
        /* 分类Tab - 极简 */
        .info-tabs {
            background: #fff;
            display: flex;
            border-bottom: 1px solid #f0f0f0;
        }
        .info-tab {
            flex: 1;
            padding: 14px 0;
            text-align: center;
            font-size: 14px;
            color: #666;
            cursor: pointer;
            position: relative;
        }
        .info-tab.active { color: #e54d4d; font-weight: 600; }
        .info-tab.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 24px;
            height: 2px;
            background: #e54d4d;
        }
        
        /* 筛选栏 - 极简 */
        .filter-bar-2 {
            background: #fff;
            padding: 10px 15px 12px;
            display: flex;
            gap: 15px;
            border-bottom: 1px solid #f0f0f0;
        }
        .filter-btn-2 {
            font-size: 13px;
            color: #666;
            white-space: nowrap;
            cursor: pointer;
        }
        .filter-btn-2.active { color: #e54d4d; font-weight: 500; }
        
        .post-list { flex: 1; overflow-y: auto; background: #f5f5f5; }
        .post-list .post-card { background: #fff; }
        
        /* 详情页 - 极简 */
        .detail-page { background: #fff; }
        .detail-header {
            background: #fff;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            gap: 10px;
            border-bottom: 1px solid #f0f0f0;
        }
        .detail-banner {
            height: 180px;
            background: #f5f5f5;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .detail-banner svg {
            width: 60px;
            height: 60px;
            stroke: #ccc;
            stroke-width: 1.5;
            fill: none;
        }
        .detail-content { flex: 1; overflow-y: auto; padding-bottom: 70px; }
        .detail-info { padding: 15px; border-bottom: 10px solid #f5f5f5; }
        .detail-title { font-size: 17px; color: #333; line-height: 1.5; }
        .detail-price-row { margin-top: 12px; display: flex; align-items: baseline; gap: 4px; }
        .detail-price { font-size: 20px; font-weight: 600; color: #e54d4d; }
        .detail-price-unit { font-size: 14px; color: #e54d4d; }
        .detail-tags { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
        .detail-tags span { font-size: 12px; color: #666; }
        .detail-desc-section { padding: 15px; }
        .detail-desc-title { font-size: 15px; font-weight: 600; color: #333; margin-bottom: 12px; }
        .detail-desc-text { font-size: 14px; color: #666; line-height: 1.8; }
        .detail-contact { padding: 15px; background: #fafafa; margin-top: 15px; }
        .contact-item { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
        .contact-icon {
            width: 36px;
            height: 36px;
            background: #f5f5f5;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .contact-icon svg {
            width: 18px;
            height: 18px;
            stroke: #666;
            stroke-width: 1.5;
            fill: none;
        }
        .contact-text { flex: 1; }
        .contact-name { font-size: 14px; color: #333; }
        .contact-value { font-size: 12px; color: #999; margin-top: 2px; }
        .detail-bottom {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            padding: 12px 15px;
            display: flex;
            gap: 12px;
            border-top: 1px solid #f0f0f0;
        }
        .detail-bottom .btn {
            flex: 1;
            height: 44px;
            border-radius: 22px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 15px;
            cursor: pointer;
        }
        .btn-collect { background: #f5f5f5; color: #666; }
        .btn-contact { background: #e54d4d; color: #fff; }
        
        /* 搜索页 - 极简 */
        .search-page { background: #fff; }
        .search-header {
            background: #fff;
            padding: 10px 15px 12px;
            display: flex;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
            border-bottom: 1px solid #f0f0f0;
        }
        .search-back {
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #333;
            font-size: 18px;
            cursor: pointer;
        }
        .search-input-box {
            flex: 1;
            background: #f5f5f5;
            border-radius: 20px;
            padding: 10px 15px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .search-input-box input {
            border: none;
            outline: none;
            flex: 1;
            font-size: 14px;
            background: transparent;
        }
        .search-btn {
            padding: 8px 16px;
            color: #e54d4d;
            font-size: 14px;
            font-weight: 500;
            cursor: pointer;
        }
        .search-result { padding: 0; }
        .search-empty {
            text-align: center;
            padding: 80px 20px;
            color: #999;
        }
        .search-empty svg {
            width: 48px;
            height: 48px;
            stroke: #ddd;
            stroke-width: 1.5;
            fill: none;
            margin-bottom: 15px;
        }
        .search-empty .text { font-size: 14px; }
        
        /* 发布页 - 极简 */
        .publish-page { background: #fff; }
        .publish-header {
            background: #fff;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            gap: 10px;
            border-bottom: 1px solid #f0f0f0;
        }
        .publish-form { padding: 15px; flex: 1; overflow-y: auto; }
        .form-group { margin-bottom: 20px; }
        .form-label {
            font-size: 14px;
            color: #333;
            font-weight: 500;
            margin-bottom: 8px;
        }
        .form-label span { color: #e54d4d; }
        .form-input {
            width: 100%;
            border: 1px solid #eee;
            border-radius: 8px;
            padding: 12px;
            font-size: 14px;
            outline: none;
            color: #333;
        }
        .form-input:focus { border-color: #e54d4d; }
        textarea.form-input { min-height: 120px; resize: vertical; }
        .category-select {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 10px;
        }
        .category-option {
            padding: 12px 10px;
            border: 1px solid #eee;
            border-radius: 8px;
            text-align: center;
            font-size: 13px;
            color: #666;
            cursor: pointer;
        }
        .category-option.active { border-color: #e54d4d; background: #fff5f5; color: #e54d4d; }
        .publish-submit {
            width: 100%;
            height: 48px;
            background: #e54d4d;
            color: #fff;
            border: none;
            border-radius: 24px;
            font-size: 16px;
            font-weight: 500;
            cursor: pointer;
        }
        
        /* 消息页 - 极简 */
        .message-page { background: #f5f5f5; }
        .msg-list { padding: 10px 0; }
        .msg-item {
            background: #fff;
            padding: 15px;
            margin-bottom: 1px;
            display: flex;
            gap: 12px;
            cursor: pointer;
        }
        .msg-avatar {
            width: 40px;
            height: 40px;
            background: #f5f5f5;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .msg-avatar svg {
            width: 20px;
            height: 20px;
            stroke: #999;
            stroke-width: 1.5;
            fill: none;
        }
        .msg-content { flex: 1; }
        .msg-title { font-size: 14px; color: #333; font-weight: 500; display: flex; align-items: center; }
        .msg-text { font-size: 13px; color: #999; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .msg-time { font-size: 11px; color: #999; margin-top: 4px; }
        .msg-badge {
            width: 6px;
            height: 6px;
            background: #e54d4d;
            border-radius: 50%;
            margin-left: 6px;
        }
        
        /* 我的页面 - 极简 */
        .user-page { background: #f5f5f5; }
        .user-header {
            background: #fff;
            padding: 30px 20px;
            color: #333;
            border-bottom: 1px solid #f0f0f0;
        }
        .user-info { display: flex; align-items: center; gap: 15px; }
        .user-avatar {
            width: 60px;
            height: 60px;
            background: #f5f5f5;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .user-avatar svg {
            width: 28px;
            height: 28px;
            stroke: #999;
            stroke-width: 1.5;
            fill: none;
        }
        .user-name { font-size: 17px; font-weight: 500; }
        .user-id { font-size: 12px; color: #999; margin-top: 4px; }
        
        /* VIP卡 - 极简 */
        .vip-card {
            background: #fff;
            margin: 10px 15px;
            padding: 15px;
        }
        .vip-title { display: flex; justify-content: space-between; align-items: center; }
        .vip-title span { font-size: 15px; font-weight: 600; color: #333; }
        .vip-title a { font-size: 13px; color: #e54d4d; }
        .vip-level {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-top: 12px;
        }
        .vip-level .icon {
            width: 40px;
            height: 40px;
            background: #f5f5f5;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .vip-level .icon svg {
            width: 20px;
            height: 20px;
            stroke: #e54d4d;
            stroke-width: 1.5;
            fill: none;
        }
        .vip-level .info { flex: 1; }
        .vip-level .level-name { font-size: 14px; color: #333; font-weight: 500; }
        .vip-level .level-desc { font-size: 12px; color: #999; margin-top: 2px; }
        .vip-level .btn {
            padding: 6px 14px;
            background: #e54d4d;
            border-radius: 15px;
            font-size: 12px;
            color: #fff;
            cursor: pointer;
        }
        
        /* 配额信息 */
        .quota-info {
            margin: 10px 15px;
            background: #fff;
            padding: 15px;
        }
        .quota-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 12px; }
        .quota-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
        .quota-item { text-align: center; }
        .quota-item .num { font-size: 18px; font-weight: 600; color: #e54d4d; }
        .quota-item .label { font-size: 12px; color: #999; margin-top: 2px; }
        
        /* 用户菜单 - 极简无边界 */
        .user-menu {
            margin: 10px 0;
            background: #fff;
        }
        .menu-item {
            padding: 15px;
            display: flex;
            align-items: center;
            gap: 12px;
            border-bottom: 1px solid #f5f5f5;
            cursor: pointer;
        }
        .menu-item:last-child { border-bottom: none; }
        .menu-item .icon {
            width: 24px;
            height: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .menu-item .icon svg {
            width: 20px;
            height: 20px;
            stroke: #666;
            stroke-width: 1.5;
            fill: none;
        }
        .menu-item .text { flex: 1; font-size: 14px; color: #333; }
        .menu-item .arrow { color: #ccc; font-size: 14px; }
        .menu-item .badge {
            background: #e54d4d;
            color: #fff;
            font-size: 10px;
            padding: 2px 6px;
            border-radius: 10px;
        }
        
        /* 会员弹窗 - 极简 */
        .vip-modal {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.4);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 1000;
        }
        .vip-modal.show { display: flex; }
        .vip-modal-content {
            width: 90%;
            max-width: 320px;
            background: #fff;
            border-radius: 12px;
            padding: 20px;
        }
        .vip-modal-title { font-size: 17px; font-weight: 600; color: #333; text-align: center; }
        .vip-options { margin-top: 18px; }
        .vip-option {
            border: 1px solid #eee;
            border-radius: 8px;
            padding: 14px;
            margin-bottom: 10px;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 12px;
        }
        .vip-option.selected { border-color: #e54d4d; background: #fff5f5; }
        .vip-option .price { font-size: 17px; font-weight: 600; color: #e54d4d; }
        .vip-option .price small { font-size: 12px; font-weight: normal; }
        .vip-option .desc { flex: 1; }
        .vip-option .name { font-size: 14px; color: #333; font-weight: 500; }
        .vip-option .duration { font-size: 12px; color: #999; }
        .vip-option .check { font-size: 16px; color: #e54d4d; }
        .vip-buy {
            width: 100%;
            height: 44px;
            background: #e54d4d;
            border: none;
            border-radius: 22px;
            font-size: 15px;
            color: #fff;
            font-weight: 500;
            cursor: pointer;
            margin-top: 12px;
        }
        
        /* 筛选弹窗 - 极简 */
        .filter-modal {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 1000;
            display: none;
        }
        .filter-modal.show { display: block; }
        .filter-modal-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.4);
        }
        .filter-modal-content {
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            border-radius: 12px 12px 0 0;
            max-height: 75vh;
            display: flex;
            flex-direction: column;
        }
        .filter-modal-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 15px;
            border-bottom: 1px solid #f0f0f0;
        }
        .filter-modal-cancel { font-size: 14px; color: #666; cursor: pointer; }
        .filter-modal-title { font-size: 16px; font-weight: 600; color: #333; }
        .filter-modal-reset { font-size: 14px; color: #e54d4d; cursor: pointer; }
        .filter-modal-body {
            flex: 1;
            overflow-y: auto;
            padding: 15px;
        }
        .filter-section { margin-bottom: 18px; }
        .filter-section-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 10px; }
        .filter-options { display: flex; flex-wrap: wrap; gap: 8px; }
        .filter-option {
            padding: 8px 16px;
            background: #f5f5f5;
            border-radius: 18px;
            font-size: 13px;
            color: #666;
            cursor: pointer;
        }
        .filter-option.selected { background: #fff5f5; color: #e54d4d; }
        .filter-modal-footer {
            padding: 15px;
            border-top: 1px solid #f0f0f0;
        }
        .filter-confirm {
            width: 100%;
            height: 44px;
            background: #e54d4d;
            border: none;
            border-radius: 22px;
            font-size: 15px;
            color: #fff;
            font-weight: 500;
            cursor: pointer;
        }
        
        /* Toast */
        .toast {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0,0,0,0.65);
            color: #fff;
            padding: 12px 24px;
            border-radius: 8px;
            font-size: 14px;
            z-index: 9999;
            display: none;
        }
        .toast.show { display: block; }
        
        /* 底部导航 - 极简线性 */
        .tab-bar {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            height: 55px;
            background: #fff;
            display: flex;
            border-top: 1px solid #f0f0f0;
            z-index: 100;
        }
        .tab-item {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }
        .tab-item svg {
            width: 22px;
            height: 22px;
            stroke: #999;
            stroke-width: 1.5;
            fill: none;
        }
        .tab-item.active svg { stroke: #e54d4d; }
        .tab-item .label { font-size: 11px; color: #999; margin-top: 2px; }
        .tab-item.active .label { color: #e54d4d; }
    </style>
</head>
<body>
    <div class="app">
        <!-- 顶部搜索栏 -->
        <div class="search-bar" id="topSearch">
            <div class="city-selector">沙集</div>
            <div class="search-box" onclick="openSearchPage()">
                <svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="M21 21l-4.35-4.35"/></svg>
                <input type="text" placeholder="搜索招聘/租售/加工..." readonly>
            </div>
</div>
        
        <!-- 页面容器 -->
        <div class="page-container">
            <!-- 首页 -->
            <div class="page home-page active" id="page-home">
                <div class="banner" id="homeBanner">
                    <div class="banner-slider" id="bannerSlider"></div>
                    <div class="banner-dots" id="bannerDots"></div>
                </div>
                <div class="category-nav">
                    <div class="cat-item" onclick="goToInfoAndFilter('招工找工')">
                        <div class="cat-icon">
                            <svg viewBox="0 0 24 24"><path d="M20 7h-4V4a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v3H4a1 1 0 0 0-1 1v11a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8a1 1 0 0 0-1-1zM10 5h4v2h-4V5z"/></svg>
                        </div>
                        <div class="cat-name">招工找工</div>
                    </div>
                    <div class="cat-item" onclick="goToInfoAndFilter('房屋租售')">
                        <div class="cat-icon">
                            <svg viewBox="0 0 24 24"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                        </div>
                        <div class="cat-name">房屋租售</div>
                    </div>
                    <div class="cat-item" onclick="goToInfoAndFilter('设备机械')">
                        <div class="cat-icon">
                            <svg viewBox="0 0 24 24"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg>
                        </div>
                        <div class="cat-name">设备机械</div>
                    </div>
                    <div class="cat-item" onclick="goToInfoAndFilter('原材料')">
                        <div class="cat-icon">
                            <svg viewBox="0 0 24 24"><rect x="2" y="6" width="20" height="12" rx="2"/><path d="M12 12h.01"/></svg>
                        </div>
                        <div class="cat-name">原材料</div>
                    </div>
                    <div class="cat-item" onclick="goToInfoAndFilter('代加工')">
                        <div class="cat-icon">
                            <svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
                        </div>
                        <div class="cat-name">代加工</div>
                    </div>
                </div>
                
                <div class="info-flow">
                    <div class="flow-title">推荐信息 <span class="more" onclick="switchTab('info')">查看更多</span></div>
                    <div id="homePostList"></div>
                </div>
            </div>
            
            <!-- 信息页 -->
            <div class="page info-page" id="page-info">
                <div class="list-header">
                    <div class="back-btn" onclick="goBackToHome()">←</div>
                    <div class="list-title" id="infoPageTitle">信息列表</div>
                </div>
                <div class="info-tabs">
                    <div class="info-tab active" onclick="filterByCategory('全部')">全部</div>
                    <div class="info-tab" onclick="filterByCategory('招工找工')">招工找工</div>
                    <div class="info-tab" onclick="filterByCategory('房屋租售')">房屋租售</div>
                    <div class="info-tab" onclick="filterByCategory('设备机械')">设备机械</div>
                    <div class="info-tab" onclick="filterByCategory('原材料')">原材料</div>
                    <div class="info-tab" onclick="filterByCategory('代加工')">代加工</div>
                </div>
                <div class="filter-bar-2">
                    <div class="filter-btn-2 active" onclick="filterBySort('default', this)">默认排序</div>
                    <div class="filter-btn-2" onclick="filterBySort('price_asc', this)">价格↑</div>
                    <div class="filter-btn-2" onclick="filterBySort('price_desc', this)">价格↓</div>
                    <div class="filter-btn-2" onclick="filterBySort('time', this)">最新发布</div>
                    <div class="filter-btn-2" onclick="showMoreFilter()">筛选</div>
                </div>
                <div class="post-list" id="infoPostList"></div>
            </div>
            
            <!-- 发布页 -->
            <div class="page publish-page" id="page-publish">
                <div class="publish-header">
                    <div class="back-btn" onclick="switchTab('home')">←</div>
                    <span style="font-size:16px;font-weight:600;color:#333">发布信息</span>
                </div>
                <div class="publish-form">
                    <div class="form-group">
                        <div class="form-label">信息类型 <span>*</span></div>
                        <div class="category-select">
                            <div class="category-option" onclick="selectPublishCat(this, '招工找工')">招工找工</div>
                            <div class="category-option" onclick="selectPublishCat(this, '房屋租售')">房屋租售</div>
                            <div class="category-option" onclick="selectPublishCat(this, '设备机械')">设备机械</div>
                            <div class="category-option" onclick="selectPublishCat(this, '原材料')">原材料</div>
                            <div class="category-option" onclick="selectPublishCat(this, '代加工')">代加工</div>
                            <div class="category-option" onclick="selectPublishCat(this, '其他')">其他</div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-label">信息标题 <span>*</span></div>
                        <input type="text" class="form-input" id="publishTitle" placeholder="请输入信息标题">
                    </div>
                    <div class="form-group">
                        <div class="form-label">详细描述 <span>*</span></div>
                        <textarea class="form-input" id="publishDesc" placeholder="请详细描述信息内容">