From 54e01453d5ebff7700bdeb34ec090efac0c2a76b Mon Sep 17 00:00:00 2001
From: hrx <18603305412@163.com>
Date: Thu, 30 Oct 2025 16:57:08 +0800
Subject: [PATCH] updata

---
 .../src/layout/components/Sidebar/index.vue   |   7 +-
 f/web-kboss/src/main.js                       |   1 -
 f/web-kboss/src/router/index.js               |  39 +-
 f/web-kboss/src/store/modules/permission.js   |   7 +-
 f/web-kboss/src/styles/index.css              |  60 ++
 .../productMangement/commonBox/index.vue      | 922 +++++++++++-------
 .../src/views/homePage/mainPage/index.vue     |   3 +-
 .../src/views/product/mainPage/index.vue      |  11 +-
 8 files changed, 663 insertions(+), 387 deletions(-)

diff --git a/f/web-kboss/src/layout/components/Sidebar/index.vue b/f/web-kboss/src/layout/components/Sidebar/index.vue
index 42cc42c..9763d74 100644
--- a/f/web-kboss/src/layout/components/Sidebar/index.vue
+++ b/f/web-kboss/src/layout/components/Sidebar/index.vue
@@ -1,4 +1,3 @@
-<!-- Sidebar.vue -->
 <template>
   <div class="index">
     <div :class="{ 'has-logo': showLogo }" class="sidebar-container">
@@ -32,7 +31,7 @@
 
 <script>
 import { mapGetters } from "vuex";
-import SidebarItem from "./SidebarItem.vue";  
+import SidebarItem from "./SidebarItem.vue";
 import variables from "@/styles/variables.scss";
 import Logo from "./Logo.vue";
 
@@ -108,7 +107,7 @@ export default {
     }
   }
 
-  // 重点修改部分 - 更具体的选择器
+  // 更具体的选择器
   ::v-deep .el-menu-vertical {
     border: none;
     height: 100%;
@@ -166,7 +165,7 @@ export default {
     .el-menu--popup {
       .el-menu-item {
         &.is-active {
-          background-color: #d7dafd !important;
+          background-color: #f5f7fa !important;
           color: #296ad9 !important;
         }
       }
diff --git a/f/web-kboss/src/main.js b/f/web-kboss/src/main.js
index aef1694..a8cef51 100644
--- a/f/web-kboss/src/main.js
+++ b/f/web-kboss/src/main.js
@@ -1,7 +1,6 @@
 import Vue from 'vue'
 
 import Cookies from 'js-cookie'
-
 import 'normalize.css/normalize.css' // a modern alternative to CSS resets
 
 import './assets/css/iconfont/iconfont.css'
diff --git a/f/web-kboss/src/router/index.js b/f/web-kboss/src/router/index.js
index 395cf4a..8702ce2 100644
--- a/f/web-kboss/src/router/index.js
+++ b/f/web-kboss/src/router/index.js
@@ -300,31 +300,54 @@ export const constantRoutes = [
  */
 export const asyncRoutes = [
 
+
+
+  // 全部产品 - 一级菜单
+  // 全部产品 - 一级菜单（无子路由）
   {
     path: "/product",
     component: Layout,
-    redirect: "/product/overview",
     meta: {
       title: "全部产品",
       fullPath: "/product",
       noCache: true,
       icon: "el-icon-goods"
     },
-    alwaysShow: true,
     children: [
       {
-        path: "overview",
-        component: () => import('../views/customer/orderManagement/index.vue'),
-        name: 'ProductOverview',
+        path: "",
+        component: () => import('@/views/product/productHome/productIndex/index.vue'),
+        name: 'ProductHome',
         meta: {
-          title: "资源概览",
-          fullPath: "/product/overview",
+          title: "全部产品",
+          fullPath: "/product",
           noCache: true
         }
       },
     ]
   },
-
+  {
+    path: "/overview",
+    component: Layout,
+    meta: {
+      title: "资源概览",
+      fullPath: "/overview",
+      noCache: true,
+      icon: "el-icon-s-data"
+    },
+    children: [
+      {
+        path: "",
+        component: () => import('../views/customer/orderManagement/index.vue'),
+        name: 'ResourceOverview',
+        meta: {
+          title: "资源概览",
+          fullPath: "/overview",
+          noCache: true
+        }
+      }
+    ]
+  },
 
   {
     path: "/orderManagement",
diff --git a/f/web-kboss/src/store/modules/permission.js b/f/web-kboss/src/store/modules/permission.js
index e4c1672..014e8f0 100644
--- a/f/web-kboss/src/store/modules/permission.js
+++ b/f/web-kboss/src/store/modules/permission.js
@@ -16,8 +16,11 @@ function filterAsyncRoutes(routes, permissions) {
     // 检查当前路由是否在权限列表中
     const hasPermission = permissions.some(p => p.path === route.meta?.fullPath);
 
-    // 如果当前路由有权限，则加入结果
-    if (hasPermission) {
+    // 特殊处理：确保"全部产品"和"资源概览"这两个一级路由始终显示
+    const isCriticalRoute = route.path === "/product" || route.path === "/overview";
+
+    // 如果当前路由有权限或者是关键路由，则加入结果
+    if (hasPermission || isCriticalRoute) {
       res.push(tmpRoute);
     }
     // 如果没有直接权限，但有子路由，递归处理子路由
diff --git a/f/web-kboss/src/styles/index.css b/f/web-kboss/src/styles/index.css
index 4deab75..ed5eb85 100644
--- a/f/web-kboss/src/styles/index.css
+++ b/f/web-kboss/src/styles/index.css
@@ -32,3 +32,63 @@
 .mt20{
   margin-top: 20px;
 }
+/* ::v-deep .table-header {
+  background: !important;
+  color: #ffffff !important;
+  font-weight: bold;
+  text-align: center;
+} */
+/* 全局表格头部样式 - 蓝色渐变 */
+.el-table .el-table__header th,
+.el-table .el-table__header .el-table__cell {
+  background:  #409EFF !important;
+  color: #ffffff !important;
+  font-weight: bold !important;
+  text-align: center !important;
+  border-bottom: none !important;
+}
+
+/* 处理表格边框情况 */
+.el-table--border .el-table__header th,
+.el-table--border .el-table__header .el-table__cell {
+  border-right: 1px solid #a0cfff !important;
+}
+
+.el-table--border .el-table__header th:last-child,
+.el-table--border .el-table__header .el-table__cell:last-child {
+  border-right: none !important;
+}
+
+/* 鼠标悬停效果 */
+.el-table .el-table__header th:hover,
+.el-table .el-table__header .el-table__cell:hover {
+  background: linear-gradient(135deg, #66b1ff, #409eff) !important;
+}
+
+/* 科技蓝紫渐变滚动条 */
+::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+
+::-webkit-scrollbar-track {
+  background: linear-gradient(180deg, #f8faff 0%, #f0f4ff 100%);
+  border-radius: 6px;
+  box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.05);
+}
+
+::-webkit-scrollbar-thumb {
+  background: linear-gradient(180deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);
+  border-radius: 6px;
+  border: 1.5px solid #f8faff;
+  box-shadow: 0 1px 4px rgba(99, 102, 241, 0.25);
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: linear-gradient(180deg, #818cf8 0%, #a78bfa 50%, #c084fc 100%);
+  box-shadow: 0 1px 6px rgba(99, 102, 241, 0.35);
+}
+
+::-webkit-scrollbar-thumb:active {
+  background: linear-gradient(180deg, #4f46e5 0%, #7c3aed 50%, #9333ea 100%);
+}
diff --git a/f/web-kboss/src/views/customer/productMangement/commonBox/index.vue b/f/web-kboss/src/views/customer/productMangement/commonBox/index.vue
index 2753957..2ac9f11 100644
--- a/f/web-kboss/src/views/customer/productMangement/commonBox/index.vue
+++ b/f/web-kboss/src/views/customer/productMangement/commonBox/index.vue
@@ -3,16 +3,36 @@
         <div>
             <ul class="search-box">
                 <li>
-                    <span class="search-label">创建日期:</span>
-                    <el-date-picker size="mini" style="width: 220px;" v-model="searchDate" type="datetimerange"
-                        align="right" start-placeholder="开始日期" end-placeholder="结束日期"
-                        :default-time="['00:00:00', '23:59:59']" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
-                        :picker-options="pickerOptions">
-                    </el-date-picker>
+                    <el-input-group class="search-input">
+                        <el-input
+                            size="mini"
+                            v-model="searchData.keyword"
+                            placeholder="请输入关键词"
+                            clearable
+                        ></el-input>
+                        <el-button
+                            slot="append"
+                            icon="el-icon-search"
+                            @click="getTableData"
+                            size="mini"
+                        ></el-button>
+                    </el-input-group>
                 </li>
                 <li>
-
-                    <el-input size="mini" v-model="searchData.keyword" placeholder="请输入关键词" clearable></el-input>
+                    <span class="search-label">创建日期:</span>
+                    <el-date-picker
+                        size="mini"
+                        style="width: 220px;"
+                        v-model="searchDate"
+                        type="datetimerange"
+                        align="right"
+                        start-placeholder="开始日期"
+                        end-placeholder="结束日期"
+                        :default-time="['00:00:00', '23:59:59']"
+                        format="yyyy-MM-dd"
+                        value-format="yyyy-MM-dd"
+                        :picker-options="pickerOptions"
+                    ></el-date-picker>
                 </li>
                 <li>
                     <el-button size="mini" @click="resetSearch">重置</el-button>
@@ -20,53 +40,113 @@
                 </li>
             </ul>
         </div>
+
         <div class="table-box">
-            <div style="margin-bottom: 10px;">
-                    <el-radio-group v-if="role.type == 'user'" v-model="searchData.radioType" class="radio-group"
-                    size="mini" @change="handleRadioChange">
-                    <el-radio-button v-for="item in  radioOptions" :key="item.value" :label="item.value">
+            <div class="table-header">
+                <el-radio-group
+                    v-if="role.type == 'user'"
+                    v-model="searchData.radioType"
+                    class="radio-group"
+                    size="mini"
+                    @change="handleRadioChange"
+                >
+                    <el-radio-button
+                        v-for="item in radioOptions"
+                        :key="item.value"
+                        :label="item.value"
+                    >
                         {{ item.label }}
                     </el-radio-button>
                 </el-radio-group>
-                <el-radio-group v-if="role.type == 'app'" v-model="searchData.radioType" class="radio-group"
-                    size="mini" @change="handleRadioChange">
-                    <el-radio-button v-for="item in  userMap" :key="item.value" :label="item.value">
+
+                <el-radio-group
+                    v-if="role.type == 'app'"
+                    v-model="searchData.radioType"
+                    class="radio-group"
+                    size="mini"
+                    @change="handleRadioChange"
+                >
+                    <el-radio-button
+                        v-for="item in userMap"
+                        :key="item.value"
+                        :label="item.value"
+                    >
                         {{ item.label }}
                     </el-radio-button>
                 </el-radio-group>
-                <!-- <el-button style="margin-left: 10px;" size="mini" @click="openAddDialog">
-                    <i class="el-icon-plus"></i> 添加{{ searchData.radioType === '1' || searchData.radioType === '3' ?
-                        '需求' : '商品' }}
-                </el-button> -->
-                <el-button style="margin-left: 10px;" size="mini" @click="getTableData('1')">
+
+                <el-button
+                    style="margin-left: 10px;"
+                    size="mini"
+                    @click="getTableData('1')"
+                >
                     <i class="el-icon-upload2"></i> 全部导出
                 </el-button>
             </div>
-            <el-table size="large" border height="calc(100vh - 250px)" v-loading="loading" :data="tableData"
-                style="width: 100%;border:1px solid #ccc;" element-loading-text="加载中..."
-                element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.8)">
-                <el-table-column v-if="searchData.radioType!='1'&&searchData.radioType!='3'"  prop="date" label="图片" width="180">
+
+            <el-table
+                size="large"
+                border
+                height="calc(100vh - 250px)"
+                v-loading="loading"
+                :data="tableData"
+                style="width: 100%;border:1px solid #ccc;"
+                element-loading-text="加载中..."
+                element-loading-spinner="el-icon-loading"
+                element-loading-background="rgba(255, 255, 255, 0.8)"
+            >
+                <el-table-column
+                    v-if="searchData.radioType!='1'&&searchData.radioType!='3'"
+                    prop="date"
+                    label="图片"
+                    width="180"
+                >
                     <template slot-scope="scope">
-                        <el-image v-if="scope.row.img" :src="scope.row.img || 'https://www.kaiyuancloud.cn/idfile?path=logo_ncmatch.png'"
+                        <el-image
+                            v-if="scope.row.img"
+                            :src="scope.row.img || defaultImage"
                             style="width: 80px; height: 60px;border: 1px solid #ccc;border-radius: 6px;"
-                            :preview-src-list="[scope.row.img || 'https://www.kaiyuancloud.cn/idfile?path=logo_ncmatch.png']"
-                            fit="cover" :initial-index="0" preview-teleported :z-index="3000">
-                        </el-image>
+                            :preview-src-list="[scope.row.img || defaultImage]"
+                            fit="cover"
+                            :initial-index="0"
+                            preview-teleported
+                            :z-index="3000"
+                        ></el-image>
                         <span v-else>/</span>
                     </template>
                 </el-table-column>
-                <el-table-column prop="product_name" show-overflow-tooltip label="名称" min-width="180">
-                </el-table-column>
-                <el-table-column prop="category_name" show-overflow-tooltip label="所属类别" min-width="180">
-                </el-table-column>
-                <el-table-column show-overflow-tooltip label="审核状态" min-width="180">
+
+                <el-table-column
+                    prop="product_name"
+                    show-overflow-tooltip
+                    label="名称"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    prop="category_name"
+                    show-overflow-tooltip
+                    label="所属类别"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    show-overflow-tooltip
+                    label="审核状态"
+                    min-width="180"
+                >
                     <template slot-scope="scope">
                         <el-tag v-if="scope.row.audit_status === 'approved'" type="success">审核通过</el-tag>
                         <el-tag v-else-if="scope.row.audit_status === 'rejected'" type="danger">审核不通过</el-tag>
                         <el-tag v-else type="warning">待审核</el-tag>
                     </template>
                 </el-table-column>
-                <el-table-column show-overflow-tooltip label="上架状态" min-width="180">
+
+                <el-table-column
+                    show-overflow-tooltip
+                    label="上架状态"
+                    min-width="180"
+                >
                     <template slot-scope="scope">
                         <el-tag v-if="scope.row.listing_status === 'listing'" type="success">已上架</el-tag>
                         <el-tag v-else-if="scope.row.listing_status === 'delisting'" type="danger">已下架</el-tag>
@@ -74,83 +154,176 @@
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="company_name" show-overflow-tooltip label="所属企业" min-width="180">
-                </el-table-column>
-                <el-table-column prop="company_type" show-overflow-tooltip label="公司类别" min-width="180">
-                </el-table-column>
-                <el-table-column prop="contact_person" show-overflow-tooltip label="联系人" min-width="180">
-                </el-table-column>
-                <el-table-column prop="phone_number" show-overflow-tooltip label="联系电话" min-width="180">
-                </el-table-column>
-                <el-table-column prop="create_at" show-overflow-tooltip label="创建时间" min-width="180">
-                </el-table-column>
-                <el-table-column fixed="right" min-width="260" label="操作">
+                <el-table-column
+                    prop="company_name"
+                    show-overflow-tooltip
+                    label="所属企业"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    prop="company_type"
+                    show-overflow-tooltip
+                    label="公司类别"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    prop="contact_person"
+                    show-overflow-tooltip
+                    label="联系人"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    prop="phone_number"
+                    show-overflow-tooltip
+                    label="联系电话"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    prop="create_at"
+                    show-overflow-tooltip
+                    label="创建时间"
+                    min-width="180"
+                ></el-table-column>
+
+                <el-table-column
+                    fixed="right"
+                    min-width="260"
+                    label="操作"
+                >
                     <template slot-scope="scope">
-                        <el-button type="text" size="large" @click="openDetail(scope.row, 1)">查看</el-button>
-                        <el-button @click="editProduct(scope.row)" type="text" style="color: #409EFF;"
-                            size="large">修改</el-button>
-                        <el-button v-if="role.role_type == 'customer'" type="text" size="large"
-                            @click="openDetail(scope.row, 2)">审核</el-button>
+                        <el-button
+                            type="text"
+                            size="large"
+                            @click="openDetail(scope.row, 1)"
+                        >查看</el-button>
+
+                        <el-button
+                            @click="editProduct(scope.row)"
+                            type="text"
+                            style="color: #409EFF;"
+                            size="large"
+                        >修改</el-button>
+
+                        <el-button
+                            v-if="role.role_type == 'customer'"
+                            type="text"
+                            size="large"
+                            @click="openDetail(scope.row, 2)"
+                        >审核</el-button>
+
                         <el-button
                             :disabled="scope.row.audit_status !== 'approved' || scope.row.listing_status === 'listing'"
-                            @click="grounding(scope.row, 'listing')" type="text" style="color: #67C23A;"
-                                size="large">上架</el-button>
+                            @click="grounding(scope.row, 'listing')"
+                            type="text"
+                            style="color: #67C23A;"
+                            size="large"
+                        >上架</el-button>
+
                         <el-button
                             :disabled="scope.row.audit_status !== 'approved' || scope.row.listing_status === 'delisting'"
-                            @click="grounding(scope.row, 'delisting')" type="text" size="large">下架</el-button>
-                        <el-button type="text" size="large" @click="exportData(scope.row)">导出</el-button>
-                        <el-popconfirm v-if="role.role_type == 'customer'" title="确定删除该条目吗？"
-                            @confirm="deleteProduct(scope.row)">
-                            <el-button slot="reference" type="text" style="color: #F56C6C;margin-left: 10px;" size="large"
-                                >删除</el-button>
+                            @click="grounding(scope.row, 'delisting')"
+                            type="text"
+                            size="large"
+                        >下架</el-button>
+
+                        <el-button
+                            type="text"
+                            size="large"
+                            @click="exportData(scope.row)"
+                        >导出</el-button>
+
+                        <el-popconfirm
+                            v-if="role.role_type == 'customer'"
+                            title="确定删除该条目吗？"
+                            @confirm="deleteProduct(scope.row)"
+                        >
+                            <el-button
+                                slot="reference"
+                                type="text"
+                                style="color: #F56C6C;margin-left: 10px;"
+                                size="large"
+                            >删除</el-button>
                         </el-popconfirm>
                     </template>
                 </el-table-column>
             </el-table>
-            <el-pagination class="pageBox" @size-change="handleSizeChange"
-                @current-change="handleCurrentChange" :current-page.sync="current_page" :page-size="page_size"
-                layout="total, prev, pager, next" :total="total_count">
-            </el-pagination>
+
+            <el-pagination
+                class="pageBox"
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page.sync="current_page"
+                :page-size="page_size"
+                layout="total, prev, pager, next"
+                :total="total_count"
+            ></el-pagination>
         </div>
-        <commonDetail :showType="detailType" :visible="showProductDetail" @close="handleDetailClose"
-            @approve="handleApprove" @reject="handleReject">
-        </commonDetail>
+
+        <!-- 详情弹窗 -->
+        <commonDetail
+            :showType="detailType"
+            :visible="showProductDetail"
+            @close="handleDetailClose"
+            @approve="handleApprove"
+            @reject="handleReject"
+        ></commonDetail>
 
         <!-- 编辑商品弹窗 -->
-        <el-dialog :title="editForm.publish_type === '1' ? '编辑商品' : '编辑需求'" :visible.sync="showEditDialog" width="80%"
-            top="5vh">
-            <sendProduct :publish_type="editForm.publish_type" :isEdit="true" :editData="editForm"
-                @success="handleEditSuccess" @close="closeEditDialog">
-            </sendProduct>
+        <el-dialog
+            :title="editForm.publish_type === '1' ? '编辑商品' : '编辑需求'"
+            :visible.sync="showEditDialog"
+            width="80%"
+            top="5vh"
+        >
+            <sendProduct
+                :publish_type="editForm.publish_type"
+                :isEdit="true"
+                :editData="editForm"
+                @success="handleEditSuccess"
+                @close="closeEditDialog"
+            ></sendProduct>
         </el-dialog>
 
         <!-- 添加商品/需求弹窗 -->
-        <el-dialog :title="publish_type === '2' ? '添加需求' : '添加商品'" width="80%" top="5vh"
-            :visible.sync="sendProductVisible">
-            <sendProduct :publish_type="publish_type" :isEdit="false" @success="sendProductSuccess"
-                @close="closeAddDialog">
-            </sendProduct>
+        <el-dialog
+            :title="publish_type === '2' ? '添加需求' : '添加商品'"
+            width="80%"
+            top="5vh"
+            :visible.sync="sendProductVisible"
+        >
+            <sendProduct
+                :publish_type="publish_type"
+                :isEdit="false"
+                @success="sendProductSuccess"
+                @close="closeAddDialog"
+            ></sendProduct>
         </el-dialog>
     </div>
 </template>
+
 <script>
 import XLSX from 'xlsx';
 import { reqSearchByMangement, reqGetProductDetail, reqEditProduct, reqEditProductNoImg, reqExportProduct } from '@/api/ncmatch';
 import commonDetail from '@/views/customer/productMangement/commonDetail/index.vue';
 import { mapState } from 'vuex';
 import sendProduct from '@/views/homePage/ncmatch/mainPage/sendProduct/index.vue';
+
 export default {
     name: 'commonBox',
     components: { commonDetail, sendProduct },
     props: {
         role: {
             type: Object,
-            default: () => { }
+            default: () => ({})
         }
     },
     data() {
         return {
-            detailType: '1',//1:查看 2:审核 3:前台
+            detailType: '1', // 1:查看 2:审核 3:前台
             sendProductVisible: false,
             searchDate: [],
             searchData: {
@@ -158,7 +331,7 @@ export default {
                 start_date: null,
                 end_date: null,
                 keyword: "",
-                audit_status: null, // 移除对 this.role.audit_status 的直接引用
+                audit_status: null,
                 listing_status: null,
                 publish_type: "2",
                 manager_self: "",
@@ -166,20 +339,20 @@ export default {
                 current_page: 1,
                 page_size: 8,
             },
-                         userMap: [
-                 {
-                     label: '用户需求',
-                     value: '1',
-                     publish_type: '2',
-                     manager_self: null,
-                 },
-                 {
-                     label: '用户商品',
-                     value: '2',
-                     publish_type: '1',
-                     manager_self: null,
-                 },
-             ],
+            userMap: [
+                {
+                    label: '用户需求',
+                    value: '1',
+                    publish_type: '2',
+                    manager_self: null,
+                },
+                {
+                    label: '用户商品',
+                    value: '2',
+                    publish_type: '1',
+                    manager_self: null,
+                },
+            ],
             radioMap: {
                 '1': {
                     label: '用户需求',
@@ -194,7 +367,7 @@ export default {
                 '3': {
                     label: '平台需求',
                     publish_type: '2',
-                    manager_self: 'single  ',
+                    manager_self: 'single',
                 },
                 '4': {
                     label: '平台商品',
@@ -220,7 +393,7 @@ export default {
                     value: '4'
                 },
             ],
-            manager_self: null,
+            defaultImage: 'https://www.kaiyuancloud.cn/idfile?path=logo_ncmatch.png',
             page_size: 10,
             current_page: 1,
             publish_type: 1,
@@ -230,66 +403,38 @@ export default {
             showEditDialog: false,
             editForm: {},
             pickerOptions: {
-                shortcuts: [{
-                    text: '最近一周',
-                    onClick(picker) {
-                        const end = new Date();
-                        const start = new Date();
-                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-                        picker.$emit('pick', [start, end]);
+                shortcuts: [
+                    {
+                        text: '最近一周',
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+                            picker.$emit('pick', [start, end]);
+                        }
+                    },
+                    {
+                        text: '最近一个月',
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+                            picker.$emit('pick', [start, end]);
+                        }
+                    },
+                    {
+                        text: '最近三个月',
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+                            picker.$emit('pick', [start, end]);
+                        }
                     }
-                }, {
-                    text: '最近一个月',
-                    onClick(picker) {
-                        const end = new Date();
-                        const start = new Date();
-                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-                        picker.$emit('pick', [start, end]);
-                    }
-                }, {
-                    text: '最近三个月',
-                    onClick(picker) {
-                        const end = new Date();
-                        const start = new Date();
-                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-                        picker.$emit('pick', [start, end]);
-                    }
-                }]
+                ]
             },
         }
     },
-    created() {
-        console.log("父组件传来的值是", this.role);
-        // 在 created 生命周期中设置 audit_status
-        if (this.role && this.role.audit_status) {
-
-            this.searchData.audit_status = this.role.audit_status;
-        }
-                 if (this.role && this.role.publish_type) {
-             if (this.role.type === 'app') {
-                 this.searchData.publish_type = this.role.publish_type;
-             } else if (this.role.type === 'user') {
-                 const selectedItem = this.userMap.find(item => item.value === this.role.publish_type);
-                 if (selectedItem) {
-                     this.searchData.publish_type = selectedItem.publish_type;
-                     this.searchData.manager_self = selectedItem.manager_self;
-                 }
-             }
-         }
-        this.getTableData();
-    },
-    watch: {
-        // 监听 role 对象的变化
-        role: {
-            handler(newRole) {
-                if (newRole && newRole.audit_status) {
-                    this.searchData.audit_status = newRole.audit_status;
-                }
-            },
-            immediate: true,
-            deep: true
-        }
-    },
     computed: {
         showProductDetail: {
             get() {
@@ -300,138 +445,61 @@ export default {
             }
         }
     },
+    created() {
+        console.log("父组件传来的值是", this.role);
+        this.initializeSearchData();
+        this.getTableData();
+    },
+    watch: {
+        role: {
+            handler(newRole) {
+                if (newRole && newRole.audit_status) {
+                    this.searchData.audit_status = newRole.audit_status;
+                }
+            },
+            immediate: true,
+            deep: true
+        }
+    },
     methods: {
-        exportAllData(){
-            console.log("全部导出");
-        },
-        deleteProduct(row) {
-            console.log(row);
-            let ploay = {
-                id: row.id,
-                del_flg: '1'
+        // 初始化搜索数据
+        initializeSearchData() {
+            if (this.role && this.role.audit_status) {
+                this.searchData.audit_status = this.role.audit_status;
             }
-            reqEditProductNoImg(ploay).then(res => {
 
-                if (res.status) {
-                    this.$message.success('删除成功~');
-                    this.getTableData();
-                } else {
-                    this.$message.error('删除失败~');
+            if (this.role && this.role.publish_type) {
+                if (this.role.type === 'app') {
+                    this.searchData.publish_type = this.role.publish_type;
+                } else if (this.role.type === 'user') {
+                    const selectedItem = this.userMap.find(item => item.value === this.role.publish_type);
+                    if (selectedItem) {
+                        this.searchData.publish_type = selectedItem.publish_type;
+                        this.searchData.manager_self = selectedItem.manager_self;
+                    }
                 }
-            })
-        },
-        grounding(row, listing_status) {
-            console.log(listing_status);
-            let ploay = {
-                id: row.id,
-                listing_status: listing_status,
             }
-            reqEditProductNoImg(ploay).then(res => {
-                let msg = listing_status == 'listing' ? '上架' : '下架';
-                if (res.status) {
-                    this.$message.success(msg + '成功~');
-                    this.getTableData();
+        },
+
+        // 数据获取相关方法
+        async getTableData(to_excel) {
+            this.prepareSearchData();
+            this.loading = true;
+
+            try {
+                if (to_excel === '1') {
+                    await this.exportAllData();
                 } else {
-                    this.$message.error(msg + '失败~');
+                    await this.fetchTableData();
                 }
-            })
-        },
-        sendProductSuccess() {
-            this.sendProductVisible = false; // 关闭弹窗
-            this.getTableData(); // 刷新列表
-        },
-        // 关闭添加弹窗
-        closeAddDialog() {
-            this.sendProductVisible = false;
-        },
-        openSendProduct(item) {
-            this.sendProductVisible = true;
-            this.sendProductData = item;
-        },
-                 handleRadioChange(value) {
-             // 根据角色类型选择对应的映射
-             if (this.role.type === 'user') {
-                 // 对于 user 类型，在数组中查找对应的项
-                 const selectedItem = this.userMap.find(item => item.value === value);
-                 if (selectedItem) {
-                     this.searchData.publish_type = selectedItem.publish_type;
-                     this.searchData.manager_self = selectedItem.manager_self;
-                 }
-             } else {
-                 // 对于 app 类型，使用 radioMap
-                 if (this.radioMap[value]) {
-                     this.searchData.publish_type = this.radioMap[value].publish_type;
-                     this.searchData.manager_self = this.radioMap[value].manager_self;
-                 }
-             }
-
-             // 切换类型后重新获取数据
-             this.searchData.current_page = 1;
-             this.getTableData();
-         },
-        resetSearch() {
-            this.searchDate = [];
-            this.searchData.keyword = "";
-            this.searchData.current_page = 1;
-            this.searchData.audit_status = this.role.audit_status;
-            this.getTableData();
-        },
-        exportData(row) {
-            let ploay = {
-                ids: [row.id]
-                // ids:["fYHuG9eXwLi7949Rg9mRg", "vTv8KuqfDhT1efC8prs9y"]
+            } catch (error) {
+                console.error('获取数据失败:', error);
+            } finally {
+                this.loading = false;
             }
-            reqExportProduct(ploay).then(res => {
-                console.log(res);
-                // 创建一个Workbook对象
-                const wb = XLSX.utils.book_new();
-                // 创建第一个sheet
-                const ws1 = XLSX.utils.json_to_sheet(res.data);
-                XLSX.utils.book_append_sheet(wb, ws1, 'sheet1');
-                // 导出Excel文件
-                XLSX.writeFile(wb, '产品列表.xlsx');
-            })
+        },
 
-
-        },
-        handleDetailClose() {
-            // 弹窗关闭时的处理逻辑
-            console.log('弹窗已关闭');
-        },
-        handleApprove() {
-            // 处理审核通过逻辑
-            console.log('审核通过');
-            this.getTableData();
-            // 这里可以添加审核通过后的业务逻辑
-        },
-        handleReject() {
-            // 处理审核不通过逻辑
-            console.log('审核不通过');
-            this.getTableData();
-            // 这里可以添加审核不通过后的业务逻辑
-        },
-        // 编辑商品
-        editProduct(item) {
-            console.log('编辑商品数据:', item);
-            console.log('公司类别数据:', item.company_type);
-            this.editForm = { ...item };
-            this.showEditDialog = true;
-        },
-        // 关闭编辑弹窗
-        closeEditDialog() {
-            this.showEditDialog = false;
-            this.editForm = {};
-        },
-        // 编辑成功回调
-        handleEditSuccess() {
-            // 根据编辑的数据类型显示不同的成功消息
-            const successMessage = this.editForm.publish_type === '2' ? '需求编辑成功！' : '商品编辑成功！';
-            this.$message.success(successMessage);
-            this.closeEditDialog();
-            this.getTableData(); // 刷新列表
-        },
-        getTableData(to_excel) {
-            // 处理日期范围
+        prepareSearchData() {
             if (this.searchDate && this.searchDate.length === 2) {
                 this.searchData.start_date = this.searchDate[0];
                 this.searchData.end_date = this.searchDate[1];
@@ -439,114 +507,208 @@ export default {
                 this.searchData.start_date = null;
                 this.searchData.end_date = null;
             }
+        },
 
-            console.log("searchData", this.searchData);
+        async fetchTableData() {
+            const requestData = this.buildRequestData();
+            const res = await reqSearchByMangement(requestData);
 
-            this.loading = true;
-            if(to_excel==='1'){
-                this.searchData.to_excel=to_excel
-                                reqSearchByMangement({
-                    url_link: window.location.href,
-                    to_excel: to_excel,
-                    publish_type: this.searchData.publish_type,
-                    manager_self: this.searchData.radioType=='4'||this.searchData.radioType=='3'?'single':null
-                }).then(res => {
-                console.log(res);
-                if (res.status) {
-                    // 创建一个Workbook对象
-                    const wb = XLSX.utils.book_new();
-                    // 创建第一个sheet
-                    const ws1 = XLSX.utils.json_to_sheet(res.data);
-                    XLSX.utils.book_append_sheet(wb, ws1, 'sheet1');
-                    // 导出Excel文件
-                    XLSX.writeFile(wb, '产品列表.xlsx');
-                }
-            }).catch(error => {
-                console.error('获取数据失败:', error);
-            }).finally(() => {
-                this.loading = false;
-            })
-            }else{
-                // 根据角色类型获取对应的 manager_self 值
-                let manager_self = null;
-                let publish_type = null;
+            if (res.status) {
+                this.tableData = res.data.product_list;
+                this.total_count = res.data.total_count;
+            }
+        },
 
-                                 if (this.role.type === 'user') {
-                     const selectedItem = this.userMap.find(item => item.value === this.searchData.radioType);
-                     if (selectedItem) {
-                         publish_type = selectedItem.publish_type;
-                         manager_self = this.searchData.radioType=='4'||this.searchData.radioType=='3'?'single':null;
-                     }
-                                  } else if (this.role.type === 'app') {
-                     if (this.radioMap[this.searchData.radioType]) {
-                         publish_type = this.radioMap[this.searchData.radioType].publish_type;
-                         manager_self = this.searchData.radioType=='4'||this.searchData.radioType=='3'?'single':null;
-                     }
-                 }
+        buildRequestData() {
+            const requestData = { ...this.searchData };
 
-                                 // 构建请求参数，确保传递映射中的值
-                 const requestData = {
-                     ...this.searchData,
-                     publish_type: publish_type,
-                     manager_self: manager_self
-                 };
+            // 设置manager_self和publish_type
+            requestData.manager_self = ['3', '4'].includes(this.searchData.radioType) ? 'single' : null;
+            requestData.publish_type = ['1', '3'].includes(this.searchData.radioType) ? '2' : '1';
 
-                 console.log('请求参数:', requestData);
-                 requestData.manager_self=this.searchData.radioType=='4'||this.searchData.radioType=='3'?'single':null
-                 requestData.publish_type = this.searchData.radioType=='1'||this.searchData.radioType=='3'?'2':'1'
-                 if(this.role.lastType=='1'){
-                        requestData.publish_type='1'
-                 }
-                reqSearchByMangement(requestData).then(res => {
-                console.log(res);
-                if (res.status) {
-                    this.tableData = res.data.product_list;
-                    this.total_count = res.data.total_count;
-                }
-            }).catch(error => {
-                console.error('获取数据失败:', error);
-            }).finally(() => {
-                this.loading = false;
-            })
+            if (this.role.lastType === '1') {
+                requestData.publish_type = '1';
             }
 
+            return requestData;
         },
-        //分页器
+
+        async exportAllData() {
+            const requestData = {
+                url_link: window.location.href,
+                to_excel: '1',
+                publish_type: this.searchData.publish_type,
+                manager_self: ['3', '4'].includes(this.searchData.radioType) ? 'single' : null
+            };
+
+            const res = await reqSearchByMangement(requestData);
+
+            if (res.status) {
+                const wb = XLSX.utils.book_new();
+                const ws1 = XLSX.utils.json_to_sheet(res.data);
+                XLSX.utils.book_append_sheet(wb, ws1, 'sheet1');
+                XLSX.writeFile(wb, '产品列表.xlsx');
+            }
+        },
+
+        async exportData(row) {
+            const ploay = {
+                ids: [row.id]
+            };
+
+            const res = await reqExportProduct(ploay);
+
+            if (res.data) {
+                const wb = XLSX.utils.book_new();
+                const ws1 = XLSX.utils.json_to_sheet(res.data);
+                XLSX.utils.book_append_sheet(wb, ws1, 'sheet1');
+                XLSX.writeFile(wb, '产品列表.xlsx');
+            }
+        },
+
+        // 产品操作相关方法
+        async deleteProduct(row) {
+            const ploay = {
+                id: row.id,
+                del_flg: '1'
+            };
+
+            const res = await reqEditProductNoImg(ploay);
+
+            if (res.status) {
+                this.$message.success('删除成功~');
+                this.getTableData();
+            } else {
+                this.$message.error('删除失败~');
+            }
+        },
+
+        async grounding(row, listing_status) {
+            const ploay = {
+                id: row.id,
+                listing_status: listing_status,
+            };
+
+            const res = await reqEditProductNoImg(ploay);
+            const msg = listing_status === 'listing' ? '上架' : '下架';
+
+            if (res.status) {
+                this.$message.success(`${msg}成功~`);
+                this.getTableData();
+            } else {
+                this.$message.error(`${msg}失败~`);
+            }
+        },
+
+        // 搜索相关方法
+        resetSearch() {
+            this.searchDate = [];
+            this.searchData.keyword = "";
+            this.searchData.current_page = 1;
+            this.searchData.audit_status = this.role.audit_status;
+            this.getTableData();
+        },
+
+        handleRadioChange(value) {
+            const selectedItem = this.role.type === 'user'
+                ? this.userMap.find(item => item.value === value)
+                : this.radioMap[value];
+
+            if (selectedItem) {
+                this.searchData.publish_type = selectedItem.publish_type;
+                this.searchData.manager_self = selectedItem.manager_self;
+            }
+
+            this.searchData.current_page = 1;
+            this.getTableData();
+        },
+
+        // 分页方法
         handleSizeChange(val) {
             console.log(`每页 ${val} 条`);
         },
+
         handleCurrentChange(val) {
             this.searchData.current_page = val;
             this.getTableData();
-            console.log(`当前页: ${val}`);
         },
-        openDetail(item, type) {
+
+        // 详情相关方法
+        async openDetail(item, type) {
             this.detailType = type;
             this.loading = true;
-            reqGetProductDetail({
-                id: item.id,
-                from: 'b'
-            }).then(async res => {
-                this.loading = false;
+
+            try {
+                const res = await reqGetProductDetail({
+                    id: item.id,
+                    from: 'b'
+                });
+
                 if (res.status) {
                     await this.$store.commit('SETPRODUCTDETAIL', res.data);
                     await this.$store.commit('SHOWPRODUCTDETAIL', true);
                 } else {
                     this.$message.error(res.msg || '获取详情失败');
                 }
-            }).catch(error => {
-                this.loading = false;
+            } catch (error) {
                 console.error('获取详情失败:', error);
                 this.$message.error('获取详情失败，请重试');
-            });
+            } finally {
+                this.loading = false;
+            }
         },
+
+        handleDetailClose() {
+            console.log('弹窗已关闭');
+        },
+
+        handleApprove() {
+            console.log('审核通过');
+            this.getTableData();
+        },
+
+        handleReject() {
+            console.log('审核不通过');
+            this.getTableData();
+        },
+
+        // 编辑相关方法
+        editProduct(item) {
+            console.log('编辑商品数据:', item);
+            this.editForm = { ...item };
+            this.showEditDialog = true;
+        },
+
+        closeEditDialog() {
+            this.showEditDialog = false;
+            this.editForm = {};
+        },
+
+        handleEditSuccess() {
+            const successMessage = this.editForm.publish_type === '2' ? '需求编辑成功！' : '商品编辑成功！';
+            this.$message.success(successMessage);
+            this.closeEditDialog();
+            this.getTableData();
+        },
+
+        // 添加相关方法
         openAddDialog() {
-            this.publish_type = this.searchData.radioType === '1' || this.searchData.radioType === '3' ? '2' : '1';
+            this.publish_type = ['1', '3'].includes(this.searchData.radioType) ? '2' : '1';
             this.sendProductVisible = true;
+        },
+
+        sendProductSuccess() {
+            this.sendProductVisible = false;
+            this.getTableData();
+        },
+
+        closeAddDialog() {
+            this.sendProductVisible = false;
         }
     }
 }
 </script>
+
 <style scoped>
 .search-box {
     display: flex;
@@ -554,25 +716,31 @@ export default {
     justify-content: flex-start;
     background-color: white;
     padding: 10px;
-
-    li {
-        margin-right: 15px;
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-    }
-
     margin-bottom: 10px;
     border-radius: 8px;
 }
 
+.search-box li {
+    margin-right: 15px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+}
+
 .table-box {
     height: calc(100vh - 150px);
     padding: 10px;
     background-color: white;
-
 }
 
+.table-header {
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+}
+.search-input{
+  display: flex;
+}
 ::v-deep .radio-group {
     .el-radio-button__inner {
         border-radius: 4px;
@@ -580,15 +748,15 @@ export default {
         border: 1px solid #dcdfe6;
         background-color: #f5f7fa;
         color: #606266;
-
-        &:hover {
-            background-color: #ecf5ff;
-            border-color: #409eff;
-            color: #409eff;
-        }
     }
 
-    .el-radio-button__orig-radio:checked+.el-radio-button__inner {
+    .el-radio-button__inner:hover {
+        background-color: #ecf5ff;
+        border-color: #409eff;
+        color: #409eff;
+    }
+
+    .el-radio-button__orig-radio:checked + .el-radio-button__inner {
         background-color: #409eff;
         border-color: #409eff;
         color: #fff;
@@ -601,10 +769,26 @@ export default {
     font-weight: bold;
     display: flex;
     margin-right: 10px;
+    white-space: nowrap;
 }
-.pageBox{
-  width: 100%;
-  text-align: center;
-  margin: 10px;
+
+.pageBox {
+    width: 100%;
+    text-align: center;
+    margin: 10px;
+}
+
+/* 优化搜索框样式 */
+::v-deep .el-input-group__append {
+    background-color: #409EFF;
+    border-color: #409EFF;
+}
+
+::v-deep .el-input-group__append .el-button {
+    color: white;
+}
+
+::v-deep .el-input-group__append .el-button:hover {
+    background-color: #66b1ff;
 }
 </style>
diff --git a/f/web-kboss/src/views/homePage/mainPage/index.vue b/f/web-kboss/src/views/homePage/mainPage/index.vue
index e0009f4..1b2c85c 100644
--- a/f/web-kboss/src/views/homePage/mainPage/index.vue
+++ b/f/web-kboss/src/views/homePage/mainPage/index.vue
@@ -796,6 +796,7 @@ export default Vue.extend({
 
 
 <style scoped lang="less">
+
 // 添加动画样式
 .slide-fade-enter-active {
   transition: all 0.3s ease;
@@ -811,7 +812,7 @@ export default Vue.extend({
   height: 100%;
   overflow: auto !important;
   min-width: 1500px;
-  
+
 }
 
 .banner {
diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue
index d67028d..3ec9a26 100644
--- a/f/web-kboss/src/views/product/mainPage/index.vue
+++ b/f/web-kboss/src/views/product/mainPage/index.vue
@@ -224,7 +224,7 @@ export default Vue.extend({
         console.log(`跳转到资源概览，筛选类型: ${todoName}`, query);
 
         this.$router.push({
-          path: '/product/overview',
+          path: '/overview',
           query: query
         });
       }
@@ -248,7 +248,14 @@ export default Vue.extend({
 </script>
 
 <style lang="less" scoped>
-/* 样式保持不变，与之前相同 */
+::v-deep .table-header {
+  background: #409eff !important;
+  color: #ffffff !important;
+  font-weight: bold;
+  text-align: center;
+}
+
+
 .mainBox {
   background: #f5f7fa;
   width: 100%;