diff --git a/chenhai-ui/src/api/vet/article.js b/chenhai-ui/src/api/vet/article.js
index 6e0156a..18985f1 100644
--- a/chenhai-ui/src/api/vet/article.js
+++ b/chenhai-ui/src/api/vet/article.js
@@ -18,6 +18,17 @@ export function listMyArticle(query) {
   })
 }
 
+// 获取草稿列表
+export function listDraft() {
+  return request({
+    url: '/vet/article/draftList',
+    method: 'get'
+  })
+}
+
+
+
+
 // 查询兽医经验文章详细（包含相关文章）
 export function getArticle(id) {
   return request({
@@ -121,12 +132,13 @@ export function searchArticles(keyword) {
   })
 }
 
-export function getForumHome() {
-  return request({
-    url: '/vet/article/statistics',
-    method: 'get'
-  })
-}
+// 获取论坛统计
+// export function getForumHome() {
+//   return request({
+//     url: '/vet/article/statistics',
+//     method: 'get'
+//   })
+// }
 
 // 论坛文章详情
 export function getForumDetail(id) {
diff --git a/chenhai-ui/src/api/vet/product.js b/chenhai-ui/src/api/vet/product.js
index 552b423..995030b 100644
--- a/chenhai-ui/src/api/vet/product.js
+++ b/chenhai-ui/src/api/vet/product.js
@@ -42,44 +42,3 @@ export function delProduct(id) {
     method: 'delete'
   })
 }
-
-// 提交审核
-export function submitAudit(id) {
-  return request({
-    url: '/vet/product/submitAudit/' + id,
-    method: 'post'
-  })
-}
-
-// 审核产品
-export function auditProduct(data) {
-  return request({
-    url: '/vet/product/audit',
-    method: 'post',
-    data: data
-  })
-}
-
-// 上架产品
-export function publishProduct(id) {
-  return request({
-    url: '/vet/product/publish/' + id,
-    method: 'post'
-  })
-}
-
-// 下架产品
-export function offlineProduct(id) {
-  return request({
-    url: '/vet/product/offline/' + id,
-    method: 'post'
-  })
-}
-
-// 取消审核
-export function cancelAudit(id) {
-  return request({
-    url: '/vet/product/cancelAudit/' + id,
-    method: 'post'
-  })
-}
diff --git a/chenhai-ui/src/api/vet/qualification.js b/chenhai-ui/src/api/vet/qualification.js
index 1eb029c..4aefef0 100644
--- a/chenhai-ui/src/api/vet/qualification.js
+++ b/chenhai-ui/src/api/vet/qualification.js
@@ -96,6 +96,14 @@ export function getQualification(qualificationId, certId) {
   })
 }
 
+// 查看证书详情
+export function listQualificationCertificates(qualificationId) {
+  return request({
+    url: '/vet/qualification/certificate/' + qualificationId + '/list',
+    method: 'get'
+  })
+}
+
 // 证书详情
 export function getQualificationCertificate(certId) {
   return request({
diff --git a/chenhai-ui/src/assets/images/tongzhi.png b/chenhai-ui/src/assets/images/tongzhi.png
index b9f1522..62b0020 100644
Binary files a/chenhai-ui/src/assets/images/tongzhi.png and b/chenhai-ui/src/assets/images/tongzhi.png differ
diff --git a/chenhai-ui/src/assets/images/tz.png b/chenhai-ui/src/assets/images/tz.png
deleted file mode 100644
index c8da7ab..0000000
Binary files a/chenhai-ui/src/assets/images/tz.png and /dev/null differ
diff --git a/chenhai-ui/src/assets/images/tz1.png b/chenhai-ui/src/assets/images/tz1.png
deleted file mode 100644
index 62b0020..0000000
Binary files a/chenhai-ui/src/assets/images/tz1.png and /dev/null differ
diff --git a/chenhai-ui/src/layout/components/Navbar.vue b/chenhai-ui/src/layout/components/Navbar.vue
index ab991bc..07a1d5e 100644
--- a/chenhai-ui/src/layout/components/Navbar.vue
+++ b/chenhai-ui/src/layout/components/Navbar.vue
@@ -119,7 +119,7 @@ export default {
       }).then(() => {
         const userRole = this.$store.state.user.roles[0];
         this.$store.dispatch('LogOut').then(() => {
-          if (userRole === 'vetnotshenhe') {
+          if (userRole === 'vet' || userRole === 'vetnotshenhe') {
             location.href = '/login';
           } else {
             location.href = '/loginGld';
diff --git a/chenhai-ui/src/views/index.vue b/chenhai-ui/src/views/index.vue
index 3338ea6..6ba581f 100644
--- a/chenhai-ui/src/views/index.vue
+++ b/chenhai-ui/src/views/index.vue
@@ -1,8 +1,10 @@
 <template>
   <!--  跳转首页  -->
   <div class="type">
-    <Syd v-if = "userRole === 'vetnotshenhe'"></Syd>
-    <Gld v-else></Gld>
+    <Syd v-if = "userRole === 'vet' || userRole === 'vetnotshenhe'"></Syd>
+<!--    <Gld v-else></Gld>-->
+    <Gld v-else-if="userRole"></Gld>
+    <div v-else></div>
   </div>
 </template>
 
@@ -21,8 +23,12 @@ export default {
     }
   },
   computed: {
+    // userRole() {
+    //   return this.$store.state.user.roles[0];
+    // }
     userRole() {
-      return this.$store.state.user.roles[0];
+      const roles = this.$store.state.user?.roles || [];
+      return roles[0] || '';
     }
   },
   methods: {
diff --git a/chenhai-ui/src/views/loginGld.vue b/chenhai-ui/src/views/loginGld.vue
index 2766ea9..b280a63 100644
--- a/chenhai-ui/src/views/loginGld.vue
+++ b/chenhai-ui/src/views/loginGld.vue
@@ -205,8 +205,7 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-
-/*  登录页  */
+// 登录页
 .login {
   display: flex;
   justify-content: center;
@@ -218,7 +217,7 @@ export default {
   position: relative;
 }
 
-/*  登录模块  */
+// 登录模块
 .login-form {
   display: flex;
   width: 760px;
@@ -233,7 +232,7 @@ export default {
   border: 1px solid rgba(82, 196, 26, 0.2);
 }
 
-/*  左侧登录部分  */
+// 左侧登录部分
 .login-left {
   flex: 1;
   background: linear-gradient(135deg, rgba(82, 196, 26, 0.9) 0%, rgba(24, 144, 255, 0.9) 100%);
diff --git a/chenhai-ui/src/views/syd.vue b/chenhai-ui/src/views/syd.vue
index d86ccdb..185e1e8 100644
--- a/chenhai-ui/src/views/syd.vue
+++ b/chenhai-ui/src/views/syd.vue
@@ -58,17 +58,15 @@
         <el-step title="提交审核"></el-step>
       </el-steps>
 
-      <!-- 选择经营范围 -->
+      <!-- 第一步：选择经营范围 -->
       <div v-if="activeStep === 0">
         <el-form ref="qualificationForm" :model="qualificationForm" :rules="rules" label-width="100px">
           <el-form-item label="真实姓名" prop="realName">
             <el-input v-model="qualificationForm.realName" placeholder="请输入您的真实姓名" />
           </el-form-item>
-
           <el-form-item label="身份证号" prop="idCard">
             <el-input v-model="qualificationForm.idCard" placeholder="请输入身份证号" />
           </el-form-item>
-
           <el-form-item label="资质类型" prop="qualificationType">
             <el-select
               v-model="qualificationForm.qualificationType"
@@ -83,7 +81,6 @@
               />
             </el-select>
           </el-form-item>
-
           <el-form-item label="经营范围" prop="scopeIds">
             <el-select
               v-model="qualificationForm.scopeIds"
@@ -105,21 +102,12 @@
         </el-form>
       </div>
 
-      <!-- 上传资质 -->
+      <!-- 第二步：上传资质 -->
       <div v-if="activeStep === 1">
         <div class="step-summary">
           <div class="summary-item">
             <span class="summary-label">资质类型：</span>
             <div class="scope-tags">
-<!--              <el-tag-->
-<!--                v-for="qualificationType in qualificationForm.qualificationType"-->
-<!--                :key="qualificationType"-->
-<!--                type="info"-->
-<!--                size="small"-->
-<!--                class="scope-tag"-->
-<!--              >-->
-<!--                {{ getQualificationTypeLabel(qualificationForm.qualificationType) }}-->
-<!--              </el-tag>-->
               <el-tag
                 type="info"
                 size="small"
@@ -179,7 +167,6 @@
                     </el-form-item>
                   </el-col>
                 </el-row>
-
                 <el-row :gutter="20">
                   <el-col :span="24">
                     <el-form-item label="证书编号" :prop="'certificateslist.' + index + '.certificateNo'">
@@ -235,7 +222,7 @@
         </el-form>
       </div>
 
-      <!-- 提交审核 -->
+      <!-- 第三步：提交审核 -->
       <div v-if="activeStep === 2">
         <div style="text-align: center; margin-bottom: 30px;">
           <i class="el-icon-circle-check" style="font-size: 60px; color: #67C23A;"></i>
@@ -355,12 +342,9 @@ export default {
   name: "Syd",
   data() {
     return {
-      // 消息通知
-      tjzs: {},
-      // 资质弹窗
+      tjzs: {},  // 消息通知
       title: "兽医资质审核",
-      // flag: true,
-      flag: false,
+      flag: false,  // 资质弹窗
       loading: false,
       activeStep: 0,
       qualificationForm: {
@@ -382,7 +366,6 @@ export default {
       },
       scopeOptions: [],
       qualificationTypeOptions: [],
-
       rules: {
         realName: [
           {required: true, message: "请输入真实姓名", trigger: "blur"}
@@ -405,14 +388,14 @@ export default {
     this.getQualStatusAndHandle();
   },
   methods: {
-    // 获取通知数据
+    /** 获取通知数据 */
     getcountSummary() {
       getStatsCard().then(res => {
         this.tjzs = res.data
       })
     },
 
-    // 初始化选项
+    /** 初始化选项 */
     initOptions() {
       const fetchData = async () => {
         const qtypeRes = await getQualificationTypeOptions();
@@ -424,26 +407,26 @@ export default {
       fetchData();
     },
 
-    // 获取资质类型标签
+    /** 获取资质类型标签 */
     getQualificationTypeLabel(value) {
       const option = this.qualificationTypeOptions.find(item => item.value === value);
       return option ? option.label : value;
     },
 
-    // 获取经营范围标签
+    /** 获取经营范围标签 */
     getScopeLabel(scopeId) {
       const scope = this.scopeOptions.find(item => item.value === scopeId);
       return scope ? scope.label : scopeId;
     },
 
-    // 上一步
+    /** 上一步 */
     prevStep() {
       if (this.activeStep > 0) {
         this.activeStep--
       }
     },
 
-    // 下一步
+    /** 下一步 */
     nextStep() {
       if (this.activeStep === 0) {
         this.$refs.qualificationForm.validate(valid => {
@@ -468,7 +451,7 @@ export default {
       }
     },
 
-    // 获取资质状态
+    /** 获取资质状态 */
     getQualStatusAndHandle() {
       getQualificationStatus()
         .then(res => {
@@ -479,7 +462,7 @@ export default {
         })
     },
 
-    // 提交审核
+    /** 提交审核 */
     submitQualification() {
       this.loading = true;
 
@@ -500,21 +483,25 @@ export default {
         certificates: certificates,
       };
 
-      submitAuditQualification(requestData)
-        .then(response => {
-          this.$message.success('提交成功，请等待审核');
-          this.flag = false;
-          setTimeout(() => {
-            this.$router.push('/VetQualification');
-          }, 300);
-        })
-        .catch(error => {
-          console.error('提交失败:', error);
-          this.$message.error(error.response?.data?.message || '提交失败，请重试');
-        })
-        .finally(() => {
-          this.loading = false;
-        });
+      submitAuditQualification(requestData).then(response => {
+        this.$message.success('提交成功，请等待审核');
+        this.flag = false;
+        setTimeout(() => {
+          // this.$router.push('/vet-info/VetPersonallnfo');
+          // this.$message.warning('请完善您的个人信息')
+          this.$router.push({
+            path: '/vet-info/VetPersonallnfo',
+            query: { needCompleteInfo: 'true' }
+          });
+        }, 300);
+      })
+      .catch(error => {
+        console.error('提交失败:', error);
+        this.$message.error(error.response?.data?.message || '提交失败，请重试');
+      })
+      .finally(() => {
+        this.loading = false;
+      });
     },
 
     // 移除证书
@@ -582,12 +569,7 @@ export default {
 
 .shake {
   animation: cardShake 1s infinite linear;
-  background-color: #fffde6 !important;
-
-  &:hover {
-    animation-play-state: paused;
-    background-color: #edeacd !important;
-  }
+  background-color: #f4b1bc !important;
 }
 
 .info-card .info-icon {
@@ -598,7 +580,7 @@ export default {
 .info-card .info-title {
   font-size: 28px;
   font-weight: bold;
-  color: #42B983;
+  color: #06358c;
   margin-bottom: 0;
   text-align: center;
   cursor: pointer;
@@ -796,15 +778,6 @@ export default {
   }
 }
 
-//.shake {
-//  animation: cardShake 1s infinite linear;
-//
-//  &:hover {
-//    animation-play-state: paused;
-//  }
-//}
-
-
 /* 证书上传样式 */
 .certificate-upload-container {
   max-height: 500px;
diff --git a/chenhai-ui/src/views/system/recommendation/index.vue b/chenhai-ui/src/views/system/recommendation/index.vue
index 7b764ed..54e5e7d 100644
--- a/chenhai-ui/src/views/system/recommendation/index.vue
+++ b/chenhai-ui/src/views/system/recommendation/index.vue
@@ -10,24 +10,24 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="规格" prop="specification">
-        <el-input
-          v-model="queryParams.specification"
-          placeholder="请输入规格"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="当前价格" prop="price">
-        <el-input
-          v-model="queryParams.price"
-          placeholder="请输入当前价格"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
+<!--      <el-form-item label="规格" prop="specification">-->
+<!--        <el-input-->
+<!--          v-model="queryParams.specification"-->
+<!--          placeholder="请输入规格"-->
+<!--          clearable-->
+<!--          size="small"-->
+<!--          @keyup.enter.native="handleQuery"-->
+<!--        />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="当前价格" prop="price">-->
+<!--        <el-input-->
+<!--          v-model="queryParams.price"-->
+<!--          placeholder="请输入当前价格"-->
+<!--          clearable-->
+<!--          size="small"-->
+<!--          @keyup.enter.native="handleQuery"-->
+<!--        />-->
+<!--      </el-form-item>-->
       <el-form-item label="店铺名称" prop="storeName">
         <el-input
           v-model="queryParams.storeName"
@@ -98,6 +98,7 @@
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
+
     <el-table v-loading="loading" :data="recommendationList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="药品图片" align="center" prop="images" width="100">
@@ -137,7 +138,7 @@
       <el-table-column label="适用症状" align="center" prop="indications" :show-overflow-tooltip="true" />
       <el-table-column label="生产厂家" align="center" prop="manufacturer" :show-overflow-tooltip="true" />
 
-      <el-table-column label="专家推荐" align="center" width="200">
+      <el-table-column label="专家推荐" align="center" width="100">
         <template slot-scope="scope">
           <div v-if="scope.row.expertId">
             <div style="font-weight: bold;">{{ scope.row.expertName }}</div>
@@ -147,7 +148,7 @@
         </template>
       </el-table-column>
 
-      <el-table-column label="推荐店铺" align="center" width="200">
+      <el-table-column label="推荐店铺" align="center" width="260">
         <template slot-scope="scope">
           <div v-if="scope.row.storeName">
             <div style="font-weight: bold;">{{ scope.row.storeName }}</div>
@@ -157,21 +158,33 @@
         </template>
       </el-table-column>
 
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
         <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleView(scope.row)"
+            v-hasPermi="['system:recommendation:query']"
+            class="info-btn view-btn"
+          >查看</el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
+            style="color: #42B983"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['system:recommendation:edit']"
+            class="info-btn alter-btn"
           >修改</el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
+            style="color: #f28888"
             @click="handleDelete(scope.row)"
             v-hasPermi="['system:recommendation:remove']"
+            class = "info-btn delete-btn"
           >删除</el-button>
         </template>
       </el-table-column>
@@ -185,6 +198,48 @@
       @pagination="getList"
     />
 
+    <!-- 详情弹窗 -->
+    <el-dialog title="药品详情" :visible.sync="detailViews" width="600px" append-to-body>
+      <el-descriptions class="product-detail-desc" :column="2" border v-loading="detailLoading">
+        <el-descriptions-item label="药品名称">
+          {{ currentDetail.medicineName || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品类型">
+          {{ currentDetail.medicineType || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="规格">
+          {{ currentDetail.specification || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="当前价格">
+          {{ currentDetail.price || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="原价">
+          {{ currentDetail.originalPrice || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="已售数量">
+          {{ currentDetail.soldQuantity || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="销售类型">
+          {{ currentDetail.salesType || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="适用症状">
+          {{ currentDetail.indications || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item :span="2" label="生产厂家">
+          {{ currentDetail.manufacturer || '--' }}
+        </el-descriptions-item>
+        <el-descriptions-item label="推荐店铺">
+          <div v-if="currentDetail.storeName">
+            <div style="font-weight: bold;">{{ currentDetail.storeName }}</div>
+            <div style="font-size: 12px; color: #999;">{{ currentDetail.storeAddress || '-' }}</div>
+          </div>
+        </el-descriptions-item>
+      </el-descriptions>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="detailViews = false">关 闭</el-button>
+      </div>
+    </el-dialog>
+
     <!-- 添加或修改药品推荐对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="100px">
@@ -460,6 +515,7 @@ export default {
     return {
       // 遮罩层
       loading: true,
+      detailLoading: false,
       // 选中数组
       ids: [],
       // 非单个禁用
@@ -478,6 +534,11 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      detailViews: false,
+
+      // 当前查看的详情
+      currentDetail: {},
+
       // 当前激活的标签页
       activeTab: "basic",
 
@@ -897,6 +958,25 @@ export default {
       this.multiple = !selection.length;
     },
 
+    // 详情按钮
+
+    handleView(row) {
+      this.detailViews = true;
+      this.detailLoading = true;
+      this.currentDetail = {};
+
+      const id = row.id;
+      getRecommendation(id).then(response => {
+        if (response.code === 200) {
+          this.currentDetail = response.data;
+        } else {
+          this.$modal.msgError("获取详情失败");
+        }
+        this.detailLoading = false;
+      });
+    },
+
+
     /** 新增按钮操作 */
     handleAdd() {
       this.reset();
@@ -1009,4 +1089,27 @@ export default {
   width: 100px;
   height: 100px;
 }
+
+/* 操作按钮 */
+.info-btn {
+  padding: 6px 10px;
+  border-radius: 4px;
+  margin: 0 10px;
+  transition: all 0.3s ease;
+}
+
+.view-btn:hover {
+  background-color: rgb(216, 238, 248);
+  transform: translateY(-1px);
+}
+
+.alter-btn:hover{
+  background-color: rgb(230, 255, 238);
+  transform: translateY(-1px);
+}
+
+.delete-btn:hover {
+  background-color: rgba(245, 108, 108, 0.1);
+  transform: translateY(-1px);
+}
 </style>
diff --git a/chenhai-ui/src/views/vet/article/index.vue b/chenhai-ui/src/views/vet/article/index.vue
index 5507c25..dbef318 100644
--- a/chenhai-ui/src/views/vet/article/index.vue
+++ b/chenhai-ui/src/views/vet/article/index.vue
@@ -1,401 +1,581 @@
 <template>
-  <div class="app-container">
-    <!-- 论坛标题  -->
+  <div class="app-container forum-container">
+    <!-- 论坛标题 -->
     <div class="forum-header">
-      <h1 class="forum-title">兽医经验分享论坛</h1>
-      <div class="forum-subtitle">专属于兽医相关从业者的交流站</div>
+      <div class="header-content">
+        <div class="title-section">
+          <h1 class="forum-title">
+            <i class="el-icon-notebook-2"></i>经验分享社区
+          </h1>
+          <p class="forum-subtitle">分享经验，共同成长</p>
+          <div class="statistics-section">
+            <div class="stat-item">
+              <div class="stat-number">{{ statistics.totalArticles || 0 }}</div>
+              <div class="stat-label">文章总数</div>
+            </div>
+            <div class="stat-divider"></div>
+            <div class="stat-item">
+              <div class="stat-number">{{ statistics.totalAuthors || 0 }}</div>
+              <div class="stat-label">作者总数</div>
+            </div>
+            <div class="stat-divider"></div>
+            <div class="stat-item">
+              <div class="stat-number">{{ statistics.totalViews || 0 }}</div>
+              <div class="stat-label">总浏览量</div>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
 
-    <!--  搜索部分  -->
-    <div class="forum-filters">
-      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-        <el-form-item label="文章标题" prop="title">
-          <el-input
-            v-model="queryParams.title"
-            placeholder="请输入文章标题"
-            clearable
-            @keyup.enter.native="handleQuery"
-          />
-        </el-form-item>
-<!--        <el-form-item label="文章类别" prop="categoryName">-->
-<!--          <el-select v-model="queryParams.categoryName" placeholder="请选择文章类别" clearable>-->
-<!--            <el-option-->
-<!--              v-for="item in categories"-->
-<!--              :key="item.value"-->
-<!--              :label="item.label"-->
-<!--              :value="item.value"-->
-<!--            ></el-option>-->
-<!--          </el-select>-->
-<!--        </el-form-item>-->
-        <el-form-item label="文章标签" prop="tags">
-          <el-select v-model="queryParams.tags" placeholder="请选择文章标签" clearable>
-            <el-option
-              v-for="tags in tagOptions"
-              :key="tags.value"
-              :label="tags.label"
-              :value="tags.value"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-        </el-form-item>
-      </el-form>
+    <!-- 论坛/我的文章分页 -->
+    <div class="page-tabs">
+      <div class="tabs-header">
+        <el-tabs v-model="activeMainTab" @tab-click="handleMainTabChange">
+          <el-tab-pane label="经验分享" name="forum">
+            <template slot="label">
+              <span><i class="el-icon-house"></i>经验分享</span>
+            </template>
+          </el-tab-pane>
+          <el-tab-pane label="我的文章" name="myArticle">
+            <template slot="label">
+              <span><i class="el-icon-document"></i>我的分享</span>
+            </template>
+          </el-tab-pane>
+        </el-tabs>
+        <div class="forum-actions">
+          <el-button
+            type="primary"
+            plain
+            icon="el-icon-plus"
+            size="mini"
+            @click="handleAdd"
+            v-hasPermi="['vet:article:add']"
+          >新的分享</el-button>
+        </div>
+      </div>
     </div>
 
-    <!--  侧边栏  -->
-    <div class="forum-content">
-      <!-- 个人文章 -->
-      <div class="forum-sidebar">
-        <div class="sidebar-card my-articles">
-          <div class="card-header">
-            <i class="el-icon-user-solid card-icon"></i>
-            <span class="card-title">我的文章</span>
-          </div>
-          <div class="card-body">
-            <div class="stats-row">
-              <div class="stat-item">
-                <div class="stat-number">{{ myStats.published || 0 }}</div>
-                <div class="stat-label">已发布</div>
-              </div>
-              <div class="stat-item">
-                <div class="stat-number">{{ myStats.likes || 0 }}</div>
-                <div class="stat-label">获赞</div>
-              </div>
-              <div class="stat-item">
-                <div class="stat-number">{{ myStats.collects || 0 }}</div>
-                <div class="stat-label">收藏</div>
-              </div>
+    <div class="forum-main">
+      <div class="forum-content">
+        <!-- 经验分享 -->
+        <div v-if="activeMainTab === 'forum'">
+          <!-- 搜索栏 -->
+          <div class="search-container">
+            <div class="search-header">
+              <h3><i class="el-icon-search"></i>搜索分享</h3>
             </div>
-            <el-button
-              type="text"
-              icon="el-icon-collection"
-              @click="handleViewMyArticles"
-              class="view-all-btn"
-            >
-              查看我的所有文章
-            </el-button>
+            <el-form :model="forumQueryParams" ref="forumQueryForm" :inline="true">
+              <el-form-item label="标题" prop="title">
+                <el-input
+                  v-model="forumQueryParams.title"
+                  placeholder="搜索标题"
+                  clearable
+                  @keyup.enter.native="handleForumQuery"
+                />
+              </el-form-item>
+              <el-form-item label="分类" prop="categoryName">
+                <el-select
+                  v-model="forumQueryParams.categoryName"
+                  placeholder="请选择类别"
+                  clearable
+                  style="width: 145px"
+                >
+                  <el-option
+                    v-for="item in categoryOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.label"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="标签" prop="tags">
+                <el-select
+                  v-model="forumQueryParams.tags"
+                  placeholder="请选择标签"
+                  clearable
+                  style="width: 145px"
+                >
+                  <el-option
+                    v-for="tag in tagOptions"
+                    :key="tag.value"
+                    :label="tag.label"
+                    :value="tag.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" icon="el-icon-search" @click="handleForumQuery">搜索</el-button>
+                <el-button icon="el-icon-refresh" @click="resetForumQuery">重置</el-button>
+              </el-form-item>
+            </el-form>
           </div>
-        </div>
 
-        <!-- 文章类别 -->
-        <div class="sidebar-card categories">
-          <div class="card-header">
-            <i class="el-icon-folder file-multiple"></i>
-            <span class="card-title">文章分类</span>
-          </div>
-          <div class="card-body">
-            <div class="category-list">
+          <!-- 经验分享列表 -->
+          <div class="articles-container">
+            <div class="articles-header">
+              <h3>
+                <i class="el-icon-tickets"></i>经验分享
+              </h3>
+            </div>
+
+            <!-- 加载状态 -->
+            <div v-if="loading" class="loading-container">
+              <i class="el-icon-loading"></i>
+              <span>加载中...</span>
+            </div>
+
+            <!-- 经验分享列表 -->
+            <div v-else-if="articleList.length > 0" class="articles-list">
               <div
-                v-for="category in categories"
-                :key="category.value"
-                class="category-item"
-                :class="{ active: queryParams.categoryName === category.value }"
-                @click="handleCategoryClick(category.value)"
+                v-for="article in articleList"
+                :key="article.id"
+                class="article-card"
+                :class="{ 'draft': article.status === '0' }"
               >
-                {{ category.label }}
+                <div class="article-content">
+                  <div class="article-header">
+                    <div class="article-title" @click="handleViewDetail(article)">
+                      <el-tag
+                        v-if="article.userType"
+                        size="mini"
+                        :type="article.userRole === 'vet' ? 'primary' : 'warning'"
+                        class="identity-tag-badge"
+                      >
+                        <i class="el-icon-caret-right">{{ article.userType }}</i>
+                      </el-tag>
+                      {{ article.title || '无标题' }}
+                    </div>
+                    <div class="article-meta">
+                      <span class="author">
+                        <i class="el-icon-user"></i>
+                        {{ article.vetName || '匿名' }}
+                      </span>
+                      <span class="time">
+                        <i class="el-icon-time"></i>
+                        {{ parseTime(article.createTime, '{y}-{m}-{d} {h}:{i}') || '未知时间' }}
+                      </span>
+                      <span class="item">
+                        <i class="el-icon-view"></i>
+                        {{ getCacheVal(article.id, 'viewCount') || article.viewCount || 0 }}
+                      </span>
+                    </div>
+                  </div>
+                  <div class="article-body">
+                    <p class="article-summary">{{ article.summary || '暂无摘要' }}</p>
+                    <div class="article-tags">
+                      <div class="tags-wrapper">
+                        <el-tag
+                          v-if="article.categoryName"
+                          size="mini"
+                          type="success"
+                          class="category-tag"
+                        >
+                          {{ article.categoryName }}
+                        </el-tag>
+                        <el-tag
+                          v-for="tag in article.tags ? article.tags.split(',').slice(0, 3) : []"
+                          :key="tag"
+                          size="mini"
+                          type="info"
+                          class="tag"
+                        >
+                          {{ tag.trim() }}
+                        </el-tag>
+                      </div>
+                      <el-button
+                        size="mini"
+                        type="text"
+                        @click="handleViewDetail(article)"
+                        class="action-btn view-detail-btn"
+                      >
+                        查看详情
+                      </el-button>
+                    </div>
+                  </div>
+
+                  <div class="article-footer">
+                    <div class="article-actions">
+                      <el-button
+                        v-if="article.userId === currentUserId"
+                        size="mini"
+                        type="text"
+                        @click="handleEdit(article)"
+                        class="action-btn edit-btn"
+                      >
+                        <i class="el-icon-edit"></i>
+                        编辑
+                      </el-button>
+                    </div>
+                  </div>
+                </div>
               </div>
             </div>
+
+            <!-- 空状态 -->
+            <div v-else class="empty-container">
+              <i class="el-icon-document"></i>
+              <p>暂无文章</p>
+            </div>
+
+            <!-- 分页 -->
+            <pagination
+              v-show="total>0"
+              :total="total"
+              :page.sync="forumQueryParams.pageNum"
+              :limit.sync="forumQueryParams.pageSize"
+              @pagination="getList"
+            />
           </div>
         </div>
 
-        <!--  热门标签  -->
-        <div class="sidebar-card categories">
-          <div class="card-header">
-            <i class="el-icon-price-tag tag-card-icon"></i>
-            <span class="card-title">️热门标签</span>
-          </div>
-          <div class="card-body">
-            <div class="category-list">
-              <div
-                v-for="tags in tagOptions"
-                :key="tags.value"
-                class="category-item"
-                :class="{ active: queryParams.tagOptionsName === tags.value }"
-                @click="handleTagsClick(tags.value)"
-              >
-                {{ tags.label }}
+        <!-- 我的分享 -->
+        <div v-else-if="activeMainTab === 'myArticle'">
+          <div class="my-article-container">
+            <!-- 搜索栏 -->
+            <div class="search-container">
+              <div class="search-header">
+                <h3><i class="el-icon-search"></i>搜索我的分享</h3>
               </div>
+              <el-form :model="myArticleQueryParams" ref="myArticleQueryForm" :inline="true">
+                <el-form-item label="标题" prop="title">
+                  <el-input
+                    v-model="myArticleQueryParams.title"
+                    placeholder="搜索我的分享标题"
+                    clearable
+                    @keyup.enter.native="handleMyArticleQuery"
+                  />
+                </el-form-item>
+                <el-form-item label="分类" prop="categoryName">
+                  <el-select
+                    v-model="myArticleQueryParams.categoryName"
+                    placeholder="请选择类别"
+                    clearable
+                    style="width: 145px"
+                  >
+                    <el-option
+                      v-for="item in categoryOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.label"
+                    />
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="标签" prop="tags">
+                  <el-select
+                    v-model="myArticleQueryParams.tags"
+                    placeholder="请选择标签"
+                    clearable
+                    style="width: 145px"
+                  >
+                    <el-option
+                      v-for="tag in tagOptions"
+                      :key="tag.value"
+                      :label="tag.label"
+                      :value="tag.value"
+                    />
+                  </el-select>
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" icon="el-icon-search" @click="handleMyArticleQuery">搜索</el-button>
+                  <el-button icon="el-icon-refresh" @click="resetMyArticleQuery">重置</el-button>
+                </el-form-item>
+              </el-form>
             </div>
-          </div>
-        </div>
-      </div>
 
-      <!-- 右侧文章列表  -->
-      <div class="forum-main">
-        <!-- 操作按钮 -->
-        <div class="forum-actions">
-          <!--        <el-row :gutter="10" class="mb8">-->
-          <!--          <el-col :span="1.5">-->
-          <el-button
-            type="primary"
-            plain
-            icon="el-icon-plus"
-            size="mini"
-            @click="handleAdd"
-            v-hasPermi="['vet:article:add']"
-          >发新帖</el-button>
-          <!--          </el-col>-->
-          <!--        </el-row>-->
-        </div>
-        <div>
+            <!-- 我发布的/草稿-->
+            <el-tabs v-model="activeSubTab" type="border-card" class="sub-tab" @tab-click="handleSubTabChange">
+              <el-tab-pane label="我分享的" name="published"></el-tab-pane>
+              <el-tab-pane label="草稿" name="draft"></el-tab-pane>
+            </el-tabs>
+
+            <div class="articles-container my-article-list">
+              <!-- 加载状态 -->
+              <div v-if="loading" class="loading-container">
+                <i class="el-icon-loading"></i>
+                <span>加载中...</span>
+              </div>
+
+              <!-- 我分享的 -->
+              <div v-else-if="articleList.length > 0" class="articles-list">
+                <div
+                  v-for="article in articleList"
+                  :key="article.id"
+                  class="article-card"
+                  :class="{ 'draft': article.status === '0' }"
+                >
+                  <div class="article-content">
+                    <div class="article-header">
+                      <div class="article-title" @click="handleViewDetail(article)">
+                        {{ article.title || '无标题' }}
+                      </div>
+                      <div class="article-meta" v-if="activeSubTab !== 'collect'">
+                        <span class="time">
+                          <i class="el-icon-time"></i>
+                          {{ parseTime(article.createTime, '{y}-{m}-{d} {h}:{i}') || '未知时间' }}
+                        </span>
+                        <span class="stat-item" v-if="activeSubTab !== 'draft'">
+                          <i class="el-icon-view"></i>
+                          {{ getCacheVal(article.id, 'viewCount') || article.viewCount || 0 }}
+                        </span>
+                      </div>
+                      <div class="article-meta" v-else>
+                        <span class="author">
+                          <i class="el-icon-user"></i>
+                          {{ article.vetName || '匿名' }}
+                        </span>
+                        <span class="time">
+                          <i class="el-icon-time"></i>
+                          {{ parseTime(article.createTime, '{y}-{m}-{d} {h}:{i}') || '未知时间' }}
+                        </span>
+                      </div>
+                    </div>
+                    <div class="article-body">
+                      <p class="article-summary">{{ article.summary || '暂无摘要' }}</p>
+                      <div class="article-tags">
+                        <div class="tags-wrapper">
+                          <el-tag
+                            v-if="article.categoryName"
+                            size="mini"
+                            type="success"
+                            class="category-tag"
+                          >
+                            {{ article.categoryName }}
+                          </el-tag>
+                          <el-tag
+                            v-for="tag in article.tags ? article.tags.split(',').slice(0, 3) : []"
+                            :key="tag"
+                            size="mini"
+                            type="info"
+                            class="tag"
+                          >
+                            {{ tag.trim() }}
+                          </el-tag>
+                        </div>
+                        <el-button
+                          size="mini"
+                          type="text"
+                          @click="handleViewDetail(article)"
+                          class="action-btn view-detail-btn"
+                        >
+                          查看详情
+                        </el-button>
+                      </div>
+                    </div>
+
+                    <div class="article-footer">
+                      <div class="article-stats">
+                      </div>
+                      <div class="article-actions">
+                        <!-- 操作按钮 -->
+                        <template v-if="activeSubTab !== 'collect'">
+                          <el-button
+                            size="mini"
+                            type="text"
+                            @click="handleEdit(article)"
+                            class="action-btn edit-btn"
+                          >
+                            <i class="el-icon-edit"></i>
+                            编辑
+                          </el-button>
+                          <el-button
+                            size="mini"
+                            type="text"
+                            @click="handleDel(article)"
+                            class="action-btn del-btn"
+                          >
+                            <i class="el-icon-delete"></i>
+                            删除
+                          </el-button>
+                        </template>
+                        <el-button
+                          v-if="article.status === '0'"
+                          size="mini"
+                          type="text"
+                          @click="handlePublishDraft(article)"
+                          class="action-btn publish-btn"
+                        >
+                          <i class="el-icon-s-promotion"></i>
+                          发布
+                        </el-button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
 
+              <div v-else class="empty-container">
+                <i v-if="activeSubTab === 'published'" class="el-icon-document"></i>
+                <i v-if="activeSubTab === 'draft'" class="el-icon-edit-outline"></i>
+                <i v-if="activeSubTab === 'collect'" class="el-icon-collection"></i>
+                <p v-if="activeSubTab === 'published'">暂无分享</p>
+                <p v-if="activeSubTab === 'draft'">暂无草稿</p>
+                <el-button type="primary" @click="handleAdd" size="small" v-if="activeSubTab !== 'collect'">
+                  创建分享
+                </el-button>
+              </div>
+
+              <!-- 分页 -->
+              <pagination
+                v-show="total>0"
+                :total="total"
+                :page.sync="myArticleQueryParams.pageNum"
+                :limit.sync="myArticleQueryParams.pageSize"
+                @pagination="getList"
+              />
+            </div>
+          </div>
         </div>
       </div>
     </div>
 
-
-
-<!--    <el-row :gutter="10" class="mb8">-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="primary"-->
-<!--          plain-->
-<!--          icon="el-icon-plus"-->
-<!--          size="mini"-->
-<!--          @click="handleAdd"-->
-<!--          v-hasPermi="['vet:article:add']"-->
-<!--        >发新帖</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="success"-->
-<!--          plain-->
-<!--          icon="el-icon-edit"-->
-<!--          size="mini"-->
-<!--          :disabled="single"-->
-<!--          @click="handleUpdate"-->
-<!--          v-hasPermi="['vet:article:edit']"-->
-<!--        >修改</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="danger"-->
-<!--          plain-->
-<!--          icon="el-icon-delete"-->
-<!--          size="mini"-->
-<!--          :disabled="multiple"-->
-<!--          @click="handleDelete"-->
-<!--          v-hasPermi="['vet:article:remove']"-->
-<!--        >删除</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="warning"-->
-<!--          plain-->
-<!--          icon="el-icon-download"-->
-<!--          size="mini"-->
-<!--          @click="handleExport"-->
-<!--          v-hasPermi="['vet:article:export']"-->
-<!--        >导出</el-button>-->
-<!--      </el-col>-->
-<!--      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>-->
-<!--    </el-row>-->
-
-<!--    <el-table v-loading="loading" :data="articleList" @selection-change="handleSelectionChange">-->
-<!--      <el-table-column type="selection" width="55" align="center" />-->
-<!--      &lt;!&ndash;      <el-table-column label="主键ID" align="center" prop="id" />&ndash;&gt;-->
-<!--      <el-table-column label="文章标题" align="center" prop="title" />-->
-<!--      <el-table-column label="文章内容" align="center" prop="content">-->
-<!--        <template #default="scope">-->
-<!--          <div v-html="scope.row.content"></div>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-<!--      <el-table-column label="文章摘要" align="center" prop="summary" />-->
-<!--      <el-table-column label="封面图片" align="center" prop="coverImage" width="100">-->
-<!--        <template slot-scope="scope">-->
-<!--          <image-preview :src="scope.row.coverImage" :width="50" :height="50"/>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-<!--      <el-table-column label="文章图片" align="center" prop="images" />-->
-<!--      &lt;!&ndash;      <el-table-column label="作者" align="center" prop="vetId" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="兽医姓名" align="center" prop="vetName" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="兽医头像" align="center" prop="vetAvatar" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="兽医职称" align="center" prop="vetTitle" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="分类ID" align="center" prop="categoryId" />&ndash;&gt;-->
-<!--      <el-table-column label="分类名称" align="center" prop="categoryName" />-->
-<!--      <el-table-column label="标签" align="center" prop="tags" />-->
-<!--      &lt;!&ndash;      <el-table-column label="是否置顶" align="center" prop="isTop" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="是否精选" align="center" prop="isFeatured" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="状态" align="center" prop="status" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="是否包含敏感词" align="center" prop="isSensitive" />&ndash;&gt;-->
-<!--      &lt;!&ndash;      <el-table-column label="敏感词列表" align="center" prop="sensitiveWords" />&ndash;&gt;-->
-<!--      <el-table-column label="发布时间" align="center" prop="publishTime" width="180">-->
-<!--        <template slot-scope="scope">-->
-<!--          <span>{{ parseTime(scope.row.publishTime, '{y}-{m}-{d}') }}</span>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-<!--      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="180">-->
-<!--        <template slot-scope="scope">-->
-<!--          <el-button-->
-<!--            size="mini"-->
-<!--            type="text"-->
-<!--            icon="el-icon-edit"-->
-<!--            style="color: #42B983"-->
-<!--            class = "article-btn alter-btn"-->
-<!--            @click="handleUpdate(scope.row)"-->
-<!--            v-hasPermi="['vet:info:edit']"-->
-<!--          >修改</el-button>-->
-<!--          <el-button-->
-<!--            size="mini"-->
-<!--            type="text"-->
-<!--            icon="el-icon-delete"-->
-<!--            style="color: #f28888"-->
-<!--            class = "article-btn delete-btn"-->
-<!--            @click="handleDelete(scope.row)"-->
-<!--            v-hasPermi="['vet:info:remove']"-->
-<!--          >删除</el-button>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-<!--    </el-table>-->
-
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 发布/编辑文章弹窗 -->
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
+    <!-- 发布或编辑文章弹窗 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="open"
+      width="800px"
+      append-to-body
+      class="article-dialog"
+      :close-on-click-modal="false"
+    >
       <el-form ref="form" :model="form" :rules="rules" label-width="100px">
         <el-form-item label="文章标题" prop="title">
-          <el-input v-model="form.title" placeholder="请输入文章标题" />
-        </el-form-item>
-        <el-form-item label="文章分类" prop="categoryName">
-          <el-select v-model="form.categoryName" placeholder="请选择分类" style="width: 100%">
-            <el-option
-              v-for="item in categoryOptions"
-              :key="item.value"
-              :label="item.label"
-              :value="item.label"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="文章标签">
-          <el-select
-            v-model="form.tags"
-            multiple
-            placeholder="请选择标签"
-            style="width: 100%"
-          >
-            <el-option
-              v-for="tag in tagOptions"
-              :key="tag.value"
-              :label="tag.label"
-              :value="tag.value"
-            />
-          </el-select>
+          <el-input
+            v-model="form.title"
+            placeholder="请输入文章标题，建议30字以内"
+            maxlength="30"
+            show-word-limit
+          />
         </el-form-item>
-        <el-form-item label="文章摘要" prop="summary">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="文章分类" prop="categoryName">
+              <el-select v-model="form.categoryName" placeholder="请选择分类" style="width: 100%">
+                <el-option
+                  v-for="item in categoryOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.label"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="文章标签">
+              <el-select
+                v-model="form.tags"
+                multiple
+                placeholder="请选择标签（最多5个）"
+                style="width: 100%"
+                :multiple-limit="5"
+              >
+                <el-option
+                  v-for="tag in tagOptions"
+                  :key="tag.value"
+                  :label="tag.label"
+                  :value="tag.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="文章摘要">
           <el-input
             v-model="form.summary"
             type="textarea"
             :rows="3"
-            placeholder="请输入文章摘要"
-            maxlength="200"
+            placeholder="请输入文章摘要（选填，300字以内）"
+            maxlength="300"
             show-word-limit
           />
         </el-form-item>
         <el-form-item label="文章内容" prop="content">
-          <editor v-model="form.content" :min-height="300" />
+          <div class="editor-container">
+            <editor v-model="form.content" :min-height="300" />
+          </div>
         </el-form-item>
-        <el-form-item label="文章状态">
+        <el-form-item label="文章状态" class="status-radio">
           <el-radio-group v-model="form.status">
-            <el-radio label="0">草稿</el-radio>
-            <el-radio label="1">发布</el-radio>
+            <el-radio label="1" border>立即发布</el-radio>
+            <el-radio label="0" border>保存草稿</el-radio>
           </el-radio-group>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button @click="cancel">取 消</el-button>
-        <el-button type="primary" @click="submitForm">{{ form.id ? '修 改' : '发 布' }}</el-button>
+        <el-button type="primary" @click="submitForm" :loading="submitting">
+          {{ form.status === '1' ? '发 布' : '保存草稿' }}
+        </el-button>
       </div>
     </el-dialog>
 
-    <!-- 文章详情弹窗 -->
-    <el-dialog title="文章详情" :visible.sync="detailOpen" width="900px" append-to-body>
-      <div v-if="detailData">
-        <!-- 详情内容 -->
-        <div class="article-detail">
-          <h2 class="article-title">{{ detailData.article.title }}</h2>
-          <div class="article-meta">
-            <span class="author">作者：{{ detailData.article.vetName }}</span>
-            <span class="category">分类：{{ detailData.article.categoryName || '未分类' }}</span>
-            <span class="time">发布时间：{{ parseTime(detailData.article.publishTime) }}</span>
-            <span class="views">浏览：{{ detailData.article.viewCount }}次</span>
-            <span class="likes">点赞：{{ detailData.article.likeCount }}次</span>
-          </div>
-          <div class="article-tags" v-if="detailData.article.tags && detailData.article.tags.trim()">
-            <el-tag
-              v-for="tag in detailData.article.tags.split(',')"
-              :key="tag"
-              size="small"
-              style="margin-right: 5px"
-            >{{ tag.trim() }}</el-tag>
-          </div>
-          <div class="article-summary" v-if="detailData.article.summary">
-            <strong>摘要：</strong>{{ detailData.article.summary }}
-          </div>
-          <div class="article-content" v-html="detailData.article.content"></div>
-
-          <!-- 作者其他文章 -->
-          <div v-if="detailData.authorArticles && detailData.authorArticles.length > 0">
-            <h3 style="margin-top: 30px">作者其他文章</h3>
-            <div class="related-articles">
-              <div
-                v-for="item in detailData.authorArticles"
-                :key="item.id"
-                class="related-item"
-                @click="handleViewDetail(item)"
-              >
-                <div class="related-title">{{ item.title }}</div>
-                <div class="related-meta">
-                  <span>{{ parseTime(item.publishTime, '{y}-{m}-{d}') }}</span>
-                  <span>浏览：{{ item.viewCount || 0 }}</span>
-                </div>
+    <!-- 分享详情弹窗 -->
+    <el-dialog
+      :title="detailData && detailData.article && detailData.article.title || '文章详情'"
+      :visible.sync="detailOpen"
+      width="900px"
+      append-to-body
+      class="detail-dialog"
+      @closed="handleDetailClosed"
+    >
+      <!-- 加载中 -->
+      <div v-if="loadingDetail" class="loading-container">
+        <i class="el-icon-loading"></i>
+        <span>加载详情中...</span>
+      </div>
+      <!-- 详情内容 -->
+      <div v-else-if="detailData && detailData.article" class="detail-container">
+        <!-- 文章头部 -->
+        <div class="detail-header">
+          <div class="author-info">
+            <el-avatar :size="40" :src="detailData.article.avatar" class="author-avatar">
+              {{ detailData.article.vetName ? detailData.article.vetName.charAt(0) : 'V' }}
+            </el-avatar>
+            <div class="author-meta">
+              <div class="author-name">{{ detailData.article.vetName || '匿名' }}</div>
+              <div class="publish-time">
+                <i class="el-icon-time"></i>
+                {{ parseTime(detailData.article.createTime, '{y}年{m}月{d}日 {h}:{i}') || '未知时间' }}
               </div>
             </div>
           </div>
+        </div>
 
-          <!-- 相关文章 -->
-          <div v-if="detailData.relatedArticles && detailData.relatedArticles.length > 0">
-            <h3 style="margin-top: 30px">相关文章</h3>
-            <div class="related-articles">
-              <div
-                v-for="item in detailData.relatedArticles"
-                :key="item.id"
-                class="related-item"
-                @click="handleViewDetail(item)"
-              >
-                <div class="related-title">{{ item.title }}</div>
-                <div class="related-meta">
-                  <span>{{ item.vetName }}</span>
-                  <span>{{ parseTime(item.publishTime, '{y}-{m}-{d}') }}</span>
-                </div>
-              </div>
-            </div>
+        <!-- 文章信息 -->
+        <div class="article-info">
+          <el-tag v-if="detailData.article.categoryName" type="success" size="small">
+            {{ detailData.article.categoryName }}
+          </el-tag>
+          <el-tag
+            v-for="tag in detailData.article.tags ? detailData.article.tags.split(',') : []"
+            :key="tag"
+            type="info"
+            size="small"
+            class="tag"
+          >
+            {{ tag.trim() }}
+          </el-tag>
+          <div class="view-count">
+            <i class="el-icon-view"></i>
+            浏览 {{ getCacheVal(detailData.article.id, 'viewCount') || detailData.article.viewCount || 0 }} 次
           </div>
         </div>
+        <div v-if="detailData.article.summary" class="article-summary-box">
+          <div class="summary-title">文章摘要</div>
+          <div class="summary-content">{{ detailData.article.summary }}</div>
+        </div>
+        <div class="article-content-box">
+          <div class="content-title">文章内容</div>
+          <div class="content" v-html="detailData.article.content || '暂无内容'"></div>
+        </div>
+      </div>
+      <!-- 详情加载失败/无数据 -->
+      <div v-else class="empty-container">
+        <i class="el-icon-warning"></i>
+        <p>文章详情加载失败或不存在</p>
       </div>
       <div slot="footer" class="dialog-footer">
         <el-button @click="detailOpen = false">关 闭</el-button>
-        <el-button
-          v-if="detailData && detailData.isOwner"
-          type="primary"
-          @click="handleEdit(detailData.article)"
-        >
-          编辑文章
-        </el-button>
-        <el-button
-          v-else-if="detailData && !detailData.isOwner"
-          type="primary"
-          @click="handleCollectDetail(detailData.article)"
-        >
-          {{ detailData.isCollected ? '取消收藏' : '收藏文章' }}
-        </el-button>
       </div>
     </el-dialog>
   </div>
@@ -403,31 +583,49 @@
 
 <script>
 import { listArticle, getArticle, addArticle, updateArticle,
-  delArticle, getCategoryOptions, getTagOptions, likeArticle,
-  collectArticle, getMyCollections, getStatistics } from "@/api/vet/article";
+  delArticle, getCategoryOptions, getTagOptions,
+  getStatistics, listMyArticle, listDraft} from "@/api/vet/article";
+import { parseTime } from "@/utils/ruoyi";
 
 export default {
   name: "ForumArticle",
   data() {
     return {
       loading: false,
+      loadingDetail: false,
       articleList: [],
       total: 0,
       currentUserId: null,
-      queryParams: {
+      activeMainTab: 'forum',
+      activeSubTab: 'published',
+      forumQueryParams: {
+        pageNum: 1,
+        pageSize: 8,
+        title: '',
+        categoryName: '',
+        tags: '',
+        status: '1',
+        userId: '',
+        sortField: 'publish_time',
+        sortOrder: 'desc'
+      },
+      myArticleQueryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 8,
         title: '',
         categoryName: '',
         tags: '',
-        status: '1',  // 默认只显示已发布
-        userId: ''
+        status: '1',
+        userId: '',
+        sortField: 'publish_time',
+        sortOrder: 'desc'
       },
       categoryOptions: [],
       tagOptions: [],
       statistics: {},
       open: false,
       title: '',
+      submitting: false,
       form: {
         id: null,
         title: '',
@@ -438,72 +636,160 @@ export default {
         status: '1'
       },
       rules: {
-        title: [{ required: true, message: '请输入文章标题', trigger: 'blur' }],
-        content: [{ required: true, message: '请输入文章内容', trigger: 'blur' }],
-        categoryName: [{ required: true, message: '请选择文章分类', trigger: 'change' }]
+        title: [
+          {required: true, message: '请输入文章标题', trigger: 'blur'},
+          {min: 5, max: 50, message: '标题长度在 5 到 50 个字符', trigger: 'blur'}
+        ],
+        content: [
+          {required: true, message: '请输入文章内容', trigger: 'blur'},
+          {min: 10, message: '内容至少10个字符', trigger: 'blur'}
+        ],
+        categoryName: [
+          {required: true, message: '请选择文章分类', trigger: 'change'}
+        ]
       },
       detailOpen: false,
-      detailData: null
+      detailData: null,
+      articleOperateCache: {}
     }
   },
   created() {
     this.currentUserId = this.$store.state.user.userId;
-    this.getList()
-    this.getCategoryOptions()
-    this.getTagOptions()
-    this.getStatistics()
+    this.getList();
+    this.getCategoryOptions();
+    this.getTagOptions();
+    this.getStatistics();
   },
   methods: {
+    // 获取缓存值
+    getCacheVal(articleId, key) {
+      const cache = this.articleOperateCache[articleId];
+      return cache ? cache[key] : undefined;
+    },
+    updateCache(articleId, data) {
+      this.articleOperateCache[articleId] = {
+        ...this.articleOperateCache[articleId],
+        ...data
+      };
+    },
+
+    // 获取列表
     getList() {
-      this.loading = true
-      listArticle(this.queryParams).then(res => {
-        this.articleList = res.rows || []
-        this.total = res.total || 0
-        this.loading = false
-      }).catch(() => {
-        this.loading = false
-      })
+      this.loading = true;
+      const currentParams = this.activeMainTab === 'forum'
+        ? {...this.forumQueryParams}
+        : {...this.myArticleQueryParams};
+
+      if (this.activeMainTab === 'myArticle' && this.activeSubTab === 'published') {
+        currentParams.userId = this.currentUserId;
+        listMyArticle(currentParams).then(res => {
+          this.articleList = res.rows || [];
+          this.total = res.total || 0;
+          this.loading = false;
+        }).catch(() => {
+          this.articleList = [];
+          this.total = 0;
+          this.loading = false;
+        });
+      } else if (this.activeMainTab === 'myArticle' && this.activeSubTab === 'draft') {
+        currentParams.userId = this.currentUserId;
+        listDraft(currentParams).then(res => {
+          this.articleList = res.rows || [];
+          this.total = res.total || 0;
+          this.loading = false;
+        }).catch(() => {
+          this.articleList = [];
+          this.total = 0;
+          this.loading = false;
+        });
+      } else {
+        listArticle(currentParams).then(res => {
+          this.articleList = res.rows || [];
+          this.total = res.total || 0;
+          this.loading = false;
+        }).catch(() => {
+          this.articleList = [];
+          this.total = 0;
+          this.loading = false;
+        });
+      }
     },
 
+    // 获取分类选项
     getCategoryOptions() {
       getCategoryOptions().then(res => {
-        this.categoryOptions = res.data || []
-      })
+        this.categoryOptions = res.data || [];
+      }).catch(() => {
+        this.categoryOptions = [];
+      });
     },
 
+    // 获取标签选项
     getTagOptions() {
       getTagOptions().then(res => {
-        this.tagOptions = res.data || []
-      })
+        this.tagOptions = res.data || [];
+      }).catch(() => {
+        this.tagOptions = [];
+      });
     },
 
+    // 获取论坛统计信息
     getStatistics() {
       getStatistics().then(res => {
-        this.statistics = res.data || {}
-      })
+        this.statistics = res.data || {};
+      }).catch(() => {
+        this.statistics = {};
+      });
     },
 
-    handleQuery() {
-      this.queryParams.pageNum = 1
-      this.getList()
+    // 经验分享搜索
+    handleForumQuery() {
+      this.forumQueryParams.pageNum = 1;
+      this.getList();
     },
 
-    resetQuery() {
-      this.queryParams = {
+    // 经验分享重置搜索
+    resetForumQuery() {
+      this.forumQueryParams = {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 8,
         title: '',
         categoryName: '',
         tags: '',
         status: '1',
-        userId: ''
-      }
-      this.getList()
+        userId: '',
+        sortField: 'publish_time',
+        sortOrder: 'desc'
+      };
+      this.getList();
     },
 
+    // 我的分享搜索
+    handleMyArticleQuery() {
+      this.myArticleQueryParams.pageNum = 1;
+      this.getList();
+    },
+
+    // 我的分享重置搜索
+    resetMyArticleQuery() {
+      this.myArticleQueryParams = {
+        pageNum: 1,
+        pageSize: 8,
+        title: '',
+        categoryName: '',
+        tags: '',
+        status: '1',
+        userId: '',
+        sortField: 'publish_time',
+        sortOrder: 'desc'
+      };
+      this.getList();
+    },
+
+    // 发布文章
     handleAdd() {
-      this.open = true
-      this.title = '发布新文章'
+      this.open = true;
+      this.title = '发布新文章';
       this.form = {
         id: null,
         title: '',
@@ -512,127 +798,225 @@ export default {
         categoryName: '',
         tags: [],
         status: '1'
-      }
+      };
     },
 
-    handleEdit(row) {
-      getArticle(row.id).then(res => {
-        const article = res.data.article
-        this.form = {
-          id: article.id,
-          title: article.title,
-          content: article.content,
-          summary: article.summary || '',
-          categoryName: article.categoryName || '',
-          tags: article.tags ? article.tags.split(',').map(tag => tag.trim()) : [],
-          status: article.status || '1'
-        }
-        this.open = true
-        this.title = '编辑文章'
-      })
-    },
-
-    handleMyArticles() {
-      console.log('当前用户ID:', this.currentUserId);
-      this.queryParams.userId = this.currentUserId;
-      console.log('查询参数:', this.queryParams);
-      this.getList()
+    // 删除文章
+    handleDel(row) {
+      if (!row || !row.id) {
+        this.$message.warning('文章不存在，无法删除');
+        return;
+      }
+      this.$confirm('确定要删除该文章吗？删除后不可恢复！', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        delArticle(row.id).then(res => {
+          this.$message.success('删除成功');
+          this.getList();
+          delete this.articleOperateCache[row.id];
+          this.getStatistics();
+        }).catch(err => {
+          this.$message.error(err.message || '删除失败');
+        });
+      }).catch(() => {
+        this.$message.info('已取消删除');
+      });
     },
 
-    handleMyCollections() {
-      getMyCollections(this.queryParams).then(res => {
-        this.articleList = res.rows || []
-        this.total = res.total || 0
-      })
+    // 经验分享/我的分享切换
+    handleMainTabChange() {
+      if (this.activeMainTab === 'forum') {
+        this.forumQueryParams.pageNum = 1;
+      } else {
+        this.myArticleQueryParams.pageNum = 1;
+      }
+      this.getList();
     },
 
-    handleBackToForum() {
-      this.resetQuery()
+    // 我分享的/草稿切换
+    handleSubTabChange() {
+      this.myArticleQueryParams.pageNum = 1;
+      if (this.activeSubTab === 'draft') {
+        this.myArticleQueryParams.status = '0';
+      } else {
+        this.myArticleQueryParams.status = '1';
+      }
+      this.getList();
     },
 
+    // 查看文章详情
     handleViewDetail(row) {
+      if (!row || !row.id) {
+        this.$message.warning('文章ID不存在，无法查看详情');
+        return;
+      }
+
+      this.loadingDetail = true;
       getArticle(row.id).then(res => {
-        this.detailData = res.data
-        this.detailOpen = true
-      })
-    },
+        if (!res || !res.data) {
+          throw new Error('获取文章详情失败：返回数据不完整');
+        }
 
-    handleLike(row) {
-      if (row.userId === this.currentUserId) {
-        this.$message.warning('不能给自己的文章点赞')
-        return
-      }
+        const articleData = res.data;
+        this.detailData = {
+          article: articleData,
+          isOwner: articleData.userId === this.currentUserId
+        };
+
+        const articleId = row.id;
+        const baseViewCount = this.getCacheVal(articleId, 'viewCount') || row.viewCount || 0;
+        const baseLikeCount = this.getCacheVal(articleId, 'likeCount') || row.likeCount || 0;
+        const baseCollectCount = this.getCacheVal(articleId, 'collectCount') || row.collectCount || 0;
+
+        const cache = this.articleOperateCache[articleId] || {};
+        this.detailData.article.liked = cache.liked || (this.detailData.article && this.detailData.article.liked) || false;
+        this.detailData.article.likeCount = baseLikeCount;
+        this.detailData.isCollected = cache.isCollected || (this.detailData && this.detailData.isCollected) || false;
+        this.detailData.article.collectCount = baseCollectCount;
+        this.detailData.article.viewCount = baseViewCount;
+
+        const newViewCount = baseViewCount + 1;
+        this.updateCache(articleId, {viewCount: newViewCount});
+        this.detailData.article.viewCount = newViewCount;
+        const targetArticle = this.articleList.find(item => item.id === articleId);
+        if (targetArticle) {
+          targetArticle.viewCount = newViewCount;
+        }
+        this.statistics.totalViews = (this.statistics.totalViews || 0) + 1;
 
-      likeArticle(row.id).then(res => {
-        this.$message.success(res.message || '点赞成功')
-        row.likeCount = (row.likeCount || 0) + 1
-        row.liked = true
+        this.detailOpen = true;
       }).catch(err => {
-        this.$message.error(err.message || '点赞失败')
-      })
+        console.error('查看详情失败：', err);
+        this.$message.error(err.message || '获取文章详情失败，请稍后重试');
+        this.detailData = null;
+      }).finally(() => {
+        this.loadingDetail = false;
+      });
     },
 
-    handleCollect(row) {
-      if (row.userId === this.currentUserId) {
-        this.$message.warning('不能收藏自己的文章')
-        return
+    // 编辑文章
+    handleEdit(row) {
+      if (!row || !row.id) {
+        this.$message.warning('文章不存在，无法编辑');
+        return;
       }
-
-      collectArticle(row.id).then(res => {
-        this.$message.success(res.message || res.data || '操作成功')
-        if (res.message === '收藏成功') {
-          row.collectCount = (row.collectCount || 0) + 1
-          row.collected = true
-        } else {
-          row.collectCount = Math.max(0, (row.collectCount || 1) - 1)
-          row.collected = false
+      getArticle(row.id).then(res => {
+        if (!res || !res.data) {
+          this.$message.error('获取文章详情失败，无法编辑');
+          return;
         }
+        const article = res.data;
+        this.form = {
+          id: article.id,
+          title: article.title || '',
+          content: article.content || '',
+          summary: article.summary || '',
+          categoryName: article.categoryName || '',
+          tags: article.tags ? article.tags.split(',').map(tag => tag.trim()) : [],
+          status: article.status || '1',
+          originalStatus: article.status || '1'
+        };
+        this.open = true;
+        this.title = '编辑文章';
+        this.detailOpen = false;
       }).catch(err => {
-        this.$message.error(err.message || '操作失败')
-      })
+        this.$message.error(err.message || '获取文章详情失败，无法编辑');
+      });
     },
 
-    handleCollectDetail(article) {
-      collectArticle(article.id).then(res => {
-        this.$message.success(res.message || res.data || '操作成功')
-        this.detailData.isCollected = res.message === '收藏成功'
-      }).catch(err => {
-        this.$message.error(err.message || '操作失败')
-      })
+    // 发布草稿
+    handlePublishDraft(row) {
+      if (!row || !row.id) {
+        this.$message.warning('草稿不存在，无法发布');
+        return;
+      }
+      this.$confirm('确定要发布这篇草稿吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const formData = {
+          ...row,
+          status: '1',
+          tags: row.tags ? row.tags.split(',').map(t => t.trim()).join(',') : '',
+          publishTime: new Date().getTime(),
+          viewCount: 0,
+          likeCount: 0,
+          collectCount: 0
+        };
+        updateArticle(formData).then(res => {
+          this.$message.success('发布成功！文章已同步到论坛和我的已发布列表');
+          const index = this.articleList.findIndex(item => item.id === row.id);
+          if (index > -1) {
+            this.articleList.splice(index, 1);
+            this.total = this.total > 0 ? this.total - 1 : 0;
+          }
+          delete this.articleOperateCache[row.id];
+          this.getStatistics();
+          if (this.activeSubTab === 'draft') {
+            this.activeSubTab = 'published';
+            this.myArticleQueryParams.pageNum = 1;
+            this.getList();
+          } else {
+            this.getList();
+          }
+        }).catch(err => {
+          this.$message.error(err.message || '发布失败，请稍后重试');
+        });
+      }).catch(() => {
+        this.$message.info('已取消发布');
+      });
     },
 
+    // 详情弹窗关闭
+    handleDetailClosed() {
+      this.detailData = null;
+      this.loadingDetail = false;
+    },
+
+    // 提交发布/编辑
     submitForm() {
       this.$refs.form.validate(valid => {
         if (valid) {
-          // 处理标签
+          this.submitting = true;
           const formData = {
             ...this.form,
             tags: this.form.tags.join(',')
-          }
-
-          if (formData.id) {
-            updateArticle(formData).then(res => {
-              this.$message.success('修改成功')
-              this.open = false
-              this.getList()
-            }).catch(err => {
-              this.$message.error(err.message || '修改失败')
-            })
-          } else {
-            addArticle(formData).then(res => {
-              this.$message.success('发布成功')
-              this.open = false
-              this.getList()
-            }).catch(err => {
-              this.$message.error(err.message || '发布失败')
-            })
-          }
+          };
+          const isPublishToDraft = formData.id && formData.status === '0' && this.form.originalStatus === '1';
+          const isDraftToPublish = formData.id && formData.status === '1' && this.form.originalStatus === '0';
+          const apiCall = formData.id ? updateArticle(formData) : addArticle(formData);
+          apiCall.then(res => {
+            let tipMsg = '';
+            if (formData.id) {
+              tipMsg = isPublishToDraft ? '草稿保存成功（已从论坛下线）' : '修改成功';
+            } else {
+              tipMsg = formData.status === '1' ? '发布成功' : '草稿保存成功';
+            }
+            this.$message.success(tipMsg);
+            this.open = false;
+            this.getList();
+            if (!formData.id && formData.status === '1') {
+              this.getStatistics();
+            } else if (isPublishToDraft) {
+              this.statistics.totalArticles = Math.max(0, (this.statistics.totalArticles || 0) - 1);
+            } else if (isDraftToPublish) {
+              this.statistics.totalArticles = (this.statistics.totalArticles || 0) + 1;
+            }
+          }).catch(err => {
+            this.$message.error(err.message || '操作失败');
+          }).finally(() => {
+            this.submitting = false;
+          });
         }
-      })
+      });
     },
 
+    // 取消发布/编辑
     cancel() {
-      this.open = false
+      this.open = false;
       this.form = {
         id: null,
         title: '',
@@ -641,196 +1025,635 @@ export default {
         categoryName: '',
         tags: [],
         status: '1'
-      }
-    }
+      };
+      delete this.form.originalStatus;
+    },
+  },
+  filters: {
+    parseTime
   }
 }
 </script>
 
 <style scoped>
+.forum-container {
+  min-height: calc(100vh - 84px);
+  background: #f5f7fa;
+  padding: 20px 0;
+}
+
+/* 经验分享标题 */
 .forum-header {
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  color: white;
-  padding: 20px;
-  border-radius: 8px;
-  margin-bottom: 20px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+.header-content {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 20px;
+}
+
+.title-section {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 15px;
 }
 
-.forum-title {
+.title-section .forum-title {
   margin: 0;
-  font-size: 24px;
+  font-size: 28px;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  color: #333;
 }
 
-.forum-stats {
-  margin-top: 10px;
+.title-section .forum-subtitle {
+  margin: 0;
   font-size: 14px;
   opacity: 0.9;
+  color: #666;
+}
+
+/* 统计区域 */
+.statistics-section {
+  display: flex;
+  align-items: center;
+  background: #ffffff;
+  padding: 15px 25px;
+  border-radius: 12px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
+  margin-top: 10px;
+}
+
+.stat-item {
+  text-align: center;
+  padding: 0 25px;
+}
+
+.stat-number {
+  font-size: 24px;
+  font-weight: bold;
+  margin-bottom: 5px;
+  color: #333;
+}
+
+.stat-label {
+  font-size: 12px;
+  opacity: 0.8;
+  color: #666;
+}
+
+.stat-divider {
+  width: 1px;
+  height: 30px;
+  background: #ebeef5;
+}
+
+/* 论坛/我的文章分页 */
+.page-tabs {
+  max-width: 1200px;
+  margin: 0 auto 20px;
+  padding: 0 20px;
+}
+
+.tabs-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid #e4e7ed;
+  margin-bottom: 20px;
+  position: relative;
+  padding-bottom: 1px;
+}
+
+.tabs-header::after {
+  content: '';
+  position: absolute;
+  bottom: -1px;
+  left: 0;
+  right: 0;
+  height: 1px;
+  background-color: #e4e7ed;
+}
+
+.tabs-header >>> .el-tabs {
+  flex: 1;
+}
+
+.tabs-header >>> .el-tabs__nav-wrap::after {
+  height: 0;
+}
+
+.tabs-header >>> .el-tabs__header {
+  margin-bottom: 0;
+}
+
+.tabs-header >>> .el-tabs__item {
+  font-size: 16px;
+  padding: 0 24px;
+  height: 40px;
+  line-height: 40px;
+}
+
+.tabs-header >>> .el-tabs__item i {
+  margin-right: 8px;
+}
+
+.tabs-header >>> .el-tabs__item.is-active {
+  color: #409EFF;
+  font-weight: 600;
+}
+
+.tabs-header >>> .el-tabs__active-bar {
+  background-color: #409EFF;
+  height: 3px;
+  border-radius: 2px 2px 0 0;
 }
 
+.forum-actions {
+  margin-left: 20px;
+  display: flex;
+  align-items: center;
+}
+
+/* 论坛文章 */
+.forum-main {
+  max-width: 1200px;
+  margin: 0 auto;
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 20px;
+  padding: 0 20px;
+}
+
+/* 搜索栏 */
 .search-container {
-  background: #fff;
+  background: white;
+  border-radius: 12px;
   padding: 20px;
-  border-radius: 8px;
   margin-bottom: 20px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
 }
 
-.operation-container {
-  background: #fff;
-  padding: 15px 20px;
-  border-radius: 8px;
+.search-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
   margin-bottom: 20px;
+}
+
+.search-header h3 {
+  margin: 0;
+  color: #303133;
   display: flex;
-  gap: 10px;
+  align-items: center;
+  gap: 8px;
 }
 
-.forum-table {
-  background: #fff;
+/* 文章列表 */
+.articles-container {
+  background: white;
+  border-radius: 12px;
+  padding: 20px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
+}
+
+.articles-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+  padding-bottom: 15px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.articles-header h3 {
+  margin: 0;
+  color: #303133;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* 我的分享 */
+.my-article-container {
+  width: 100%;
+}
+
+.sub-tab {
+  margin-bottom: 20px;
+}
+
+.sub-tab >>> .el-tabs__content {
+  display: none;
+}
+
+.my-article-list {
+  margin-top: 0;
+}
+
+.del-btn {
+  color: #f56c6c;
+}
+
+/* 文章卡片 */
+.articles-list {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.article-card {
+  background: white;
+  border: 1px solid #ebeef5;
   border-radius: 8px;
+  transition: all 0.3s;
   overflow: hidden;
 }
 
-.article-title-cell {
-  padding: 10px 0;
+.article-card:hover {
+  border-color: #42B983;
+  box-shadow: 0 2px 12px rgb(230, 255, 238);
+  transform: translateY(-2px);
 }
 
-.title-link {
-  color: #333;
-  font-weight: 500;
+.article-card.draft {
+  opacity: 0.8;
+  border-left: 4px solid #909399;
+}
+
+.article-content {
+  padding: 20px;
+}
+
+.article-header {
+  margin-bottom: 15px;
+}
+
+.article-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 8px;
   cursor: pointer;
-  display: block;
-  margin-bottom: 5px;
-  font-size: 16px;
+  display: flex;
+  align-items: center;
+  gap: 10px;
 }
 
-.title-link:hover {
-  color: #409EFF;
-  text-decoration: underline;
+.article-title:hover {
+  color: #42B983;
 }
 
 .article-meta {
   display: flex;
-  flex-direction: column;
-  gap: 5px;
+  align-items: center;
+  gap: 15px;
+  font-size: 12px;
+  color: #909399;
 }
 
-.author {
-  font-size: 12px;
-  color: #666;
+.article-meta i {
+  margin-right: 5px;
 }
 
-.summary {
-  font-size: 12px;
-  color: #999;
-  line-height: 1.4;
+.article-body {
+  margin-bottom: 15px;
+}
+
+.article-summary {
+  color: #606266;
+  line-height: 1.6;
+  margin: 0 0 12px 0;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
-  text-overflow: ellipsis;
+}
+
+.article-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+}
+
+.tags-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+/* 查看详情按钮 */
+.view-detail-btn {
+  margin-left: auto;
+  color: #42B983;
+  font-weight: 500;
+}
+
+.category-tag {
+  font-weight: 500;
+}
+
+.article-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-top: 15px;
+  border-top: 1px solid #f0f0f0;
 }
 
 .article-stats {
+  display: flex;
+  gap: 15px;
+}
+
+.stat-item {
+  display: flex;
+  align-items: center;
+  gap: 5px;
   font-size: 12px;
-  color: #666;
+  color: #909399;
 }
 
-.article-stats i {
-  margin-right: 3px;
+.article-actions {
+  display: flex;
+  gap: 5px;
 }
 
-.article-detail {
-  padding: 20px;
+.action-btn {
+  padding: 5px 10px;
 }
 
-.article-detail .article-title {
-  margin: 0 0 20px 0;
+.action-btn.liked {
+  color: #f56c6c;
+}
+
+.action-btn.collected {
+  color: #e6a23c;
+}
+
+.action-btn.edit-btn {
+  color: #67C23A;
+}
+
+/* 加载状态 */
+.loading-container {
+  text-align: center;
+  padding: 40px;
+  color: #909399;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 10px;
+}
+
+.loading-container i {
   font-size: 24px;
-  color: #333;
-  line-height: 1.4;
+  animation: rotate 1s linear infinite;
 }
 
-.article-detail .article-meta {
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* 空状态 */
+.empty-container {
+  text-align: center;
+  padding: 60px 20px;
+  color: #909399;
+}
+
+.empty-container i {
+  font-size: 48px;
   margin-bottom: 15px;
-  color: #666;
+  opacity: 0.5;
+}
+
+.empty-container p {
+  margin: 0 0 20px 0;
   font-size: 14px;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 20px;
 }
 
-.article-detail .article-meta span {
-  display: inline-block;
+/* 弹窗 */
+.article-dialog >>> .el-dialog__header {
+  border-bottom: 1px solid #ebeef5;
+  padding: 15px 20px;
 }
 
-.article-detail .article-tags {
-  margin-bottom: 20px;
-  padding-bottom: 15px;
-  border-bottom: 1px solid #eee;
+.article-dialog >>> .el-dialog__body {
+  padding: 20px;
 }
 
-.article-detail .article-summary {
-  padding: 15px;
-  background: #f8f9fa;
-  border-radius: 4px;
-  margin-bottom: 20px;
-  color: #666;
-  line-height: 1.6;
+.article-dialog >>> .el-dialog__footer {
+  border-top: 1px solid #ebeef5;
+  padding: 15px 20px;
 }
 
-.article-detail .article-content {
-  line-height: 1.8;
-  margin-top: 20px;
-  font-size: 16px;
+.editor-container {
+  position: relative;
 }
 
-.article-detail .article-content ::v-deep img {
-  max-width: 100%;
-  height: auto;
-  border-radius: 4px;
-  margin: 10px 0;
+.status-radio >>> .el-radio-group {
+  width: 100%;
 }
 
-.article-detail .article-content ::v-deep p {
-  margin: 10px 0;
+.status-radio >>> .el-radio {
+  flex: 1;
+  margin: 0;
 }
 
-.related-articles {
-  margin-top: 15px;
-  padding-top: 15px;
+.status-radio >>> .el-radio__inner {
+  display: none;
 }
 
-.related-item {
-  padding: 12px 15px;
-  border: 1px solid #f0f0f0;
+.status-radio >>> .el-radio__label {
+  padding-left: 0;
+}
+
+.status-radio >>> .el-radio.is-bordered {
+  padding: 12px 20px;
+  text-align: center;
   border-radius: 4px;
-  margin-bottom: 10px;
-  cursor: pointer;
-  transition: all 0.3s;
 }
 
-.related-item:hover {
-  background: #f5f7fa;
-  border-color: #409EFF;
-  transform: translateX(5px);
+/* 详情弹窗 */
+.detail-dialog {
+  max-height: 80vh;
 }
 
-.related-title {
-  font-size: 14px;
-  color: #333;
-  margin-bottom: 8px;
-  font-weight: 500;
+.detail-dialog >>> .el-dialog__body {
+  max-height: calc(80vh - 100px);
+  overflow-y: auto;
 }
 
-.related-meta {
-  font-size: 12px;
-  color: #666;
+.detail-container {
+  padding: 20px;
+}
+
+.detail-header {
   display: flex;
   justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+  padding-bottom: 20px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.author-info {
+  display: flex;
+  align-items: center;
+  gap: 15px;
+}
+
+.author-avatar {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: white;
+  font-weight: bold;
+}
+
+.author-meta .author-name {
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 5px;
 }
 
-.dialog-footer {
+.author-meta .publish-time {
+  font-size: 12px;
+  color: #909399;
   display: flex;
-  justify-content: flex-end;
+  align-items: center;
+  gap: 5px;
+}
+
+.article-info {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
   gap: 10px;
+  margin-bottom: 20px;
+}
+
+.view-count {
+  margin-left: auto;
+  font-size: 12px;
+  color: #909399;
+  display: flex;
+  align-items: center;
+  gap: 5px;
+}
+
+.article-summary-box {
+  background: #f8f9fa;
+  border-radius: 8px;
+  padding: 20px;
+  margin-bottom: 25px;
+  border-left: 4px solid #409EFF;
+}
+
+.summary-title {
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 10px;
+}
+
+.summary-content {
+  color: #606266;
+  line-height: 1.6;
+}
+
+.article-content-box {
+  margin-bottom: 30px;
+}
+
+.content-title {
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 15px;
+  font-size: 18px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.content {
+  line-height: 1.8;
+  color: #303133;
+}
+
+.content >>> img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  margin: 15px 0;
+}
+
+.content >>> p {
+  margin: 15px 0;
+}
+
+.content >>> h1,
+.content >>> h2,
+.content >>> h3 {
+  margin: 20px 0 10px 0;
+  color: #303133;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .forum-main {
+    grid-template-columns: 1fr;
+  }
+
+  .statistics-section {
+    width: 100%;
+    flex-wrap: wrap;
+    justify-content: center;
+    gap: 15px;
+  }
+
+  .stat-divider {
+    display: none;
+  }
+
+  .stat-item {
+    padding: 0 15px;
+  }
+
+  .tabs-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 10px;
+  }
+
+  .forum-actions {
+    margin-left: 0;
+    align-self: flex-end;
+  }
+
+  .article-footer {
+    flex-direction: column;
+    gap: 15px;
+  }
+
+  .article-actions {
+    width: 100%;
+    justify-content: center;
+  }
+
+  .sub-tab >>> .el-tabs__nav {
+    display: flex;
+    flex-wrap: wrap;
+  }
 }
 </style>
diff --git a/chenhai-ui/src/views/vet/info/index.vue b/chenhai-ui/src/views/vet/info/index.vue
index 11c4092..c206941 100644
--- a/chenhai-ui/src/views/vet/info/index.vue
+++ b/chenhai-ui/src/views/vet/info/index.vue
@@ -87,16 +87,16 @@
     <!-- 表格部分 -->
     <el-table v-loading="loading" :data="infoList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="用户昵称" align="center" prop="nickName" />
+      <el-table-column label="用户昵称" align="center" prop="nickName"/>
       <el-table-column label="真实姓名" align="center" prop="realName" />
       <el-table-column label="性别" align="center" prop="gender" />
-      <el-table-column label="出生日期" align="center" prop="birthday">
+      <el-table-column label="出生日期" align="center" prop="birthday" width="100">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.birthday, '{y}-{m}-{d}') }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="身份证号" align="center" prop="idCard"  width="180"/>
-      <el-table-column label="擅长领域" align="center" prop="specialty" />
+      <el-table-column label="身份证号" align="center" prop="idCard"  width="130"/>
+      <el-table-column label="擅长领域" align="center" prop="specialty"/>
       <el-table-column label="工作经验" align="center" prop="workExperience"/>
       <el-table-column label="职称" align="center" prop="title"/>
       <el-table-column label="联系电话" align="center" prop="phone"/>
@@ -105,17 +105,16 @@
       <el-table-column label="所属医院" align="center" prop="hospital" />
       <el-table-column label="联系地址" align="center" prop="address" />
       <el-table-column label="个人简介" align="center" prop="introduction" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="180">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
         <template slot-scope="scope">
           <el-button
             size="mini"
             type="text"
             icon="el-icon-view"
-            style="color: #e6a23c"
             class = "info-btn view-btn"
             @click="handleView(scope.row)"
             v-hasPermi="['vet:info:view']"
-          >详情</el-button>
+          >查看</el-button>
           <el-button
             size="mini"
             type="text"
@@ -345,6 +344,16 @@ export default {
   created() {
     this.getList()
   },
+  mounted() {
+    // 显示完善信息的提示
+    if (this.$route.query.needCompleteInfo === 'true') {
+      this.$message.warning('请完善您的个人信息');
+      this.$router.replace({
+        ...this.$route,
+        query: {}
+      });
+    }
+  },
   methods: {
     /** 查询兽医个人信息列表 */
     getList() {
@@ -416,25 +425,19 @@ export default {
       getfull(id).then(response => {
         if (response.code === 200) {
           const data = response.data
-          console.log('详情返回数据:', data) // 调试用
+          console.log('详情返回数据:', data)
 
-          // 根据你的返回数据结构调整
-          // 数据在 data.vetInfo 中
           if (data.vetInfo) {
             this.detailData = data.vetInfo
-            // 使用 qualifications 字段作为证书数据
             this.certificateList = data.qualifications || []
           } else if (data.personalInfo) {
-            // 如果是旧的接口格式
             this.detailData = data.personalInfo
             this.certificateList = data.certificates || data.qualifications || []
           } else {
-            // 如果是其他格式，直接使用 data
             this.detailData = data
             this.certificateList = data.qualifications || []
           }
 
-          // 如果没有证书数据，显示提示
           if (this.certificateList.length === 0) {
             console.log('没有证书数据')
           }
@@ -546,8 +549,8 @@ export default {
   transition: all 0.3s ease;
 }
 
-.view-btn:hover{
-  background-color: rgba(243, 239, 231, 100);
+.view-btn:hover {
+  background-color: rgb(216, 238, 248);
   transform: translateY(-1px);
 }
 
diff --git a/chenhai-ui/src/views/vet/knowledge/index.vue b/chenhai-ui/src/views/vet/knowledge/index.vue
index 602803c..0f52331 100644
--- a/chenhai-ui/src/views/vet/knowledge/index.vue
+++ b/chenhai-ui/src/views/vet/knowledge/index.vue
@@ -62,11 +62,11 @@
         <el-button
           type="primary"
           plain
-          icon="el-icon-plus"
+          icon="el-icon-finished"
           size="mini"
           @click="handleAdd"
           v-hasPermi="['vet:knowledge:add']"
-        >新增文章</el-button>
+        >发布文章</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -90,38 +90,38 @@
           v-hasPermi="['vet:knowledge:audit']"
         >审核</el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-check"
-          size="mini"
-          :disabled="single"
-          @click="handlePublish"
-          v-hasPermi="['vet:knowledge:publish']"
-        >发布文章</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['vet:knowledge:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="info"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['vet:knowledge:export']"
-        >导出</el-button>
-      </el-col>
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="success"-->
+<!--          plain-->
+<!--          icon="el-icon-check"-->
+<!--          size="mini"-->
+<!--          :disabled="single"-->
+<!--          @click="handlePublish"-->
+<!--          v-hasPermi="['vet:knowledge:publish']"-->
+<!--        >发布文章</el-button>-->
+<!--      </el-col>-->
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="danger"-->
+<!--          plain-->
+<!--          icon="el-icon-delete"-->
+<!--          size="mini"-->
+<!--          :disabled="multiple"-->
+<!--          @click="handleDelete"-->
+<!--          v-hasPermi="['vet:knowledge:remove']"-->
+<!--        >删除</el-button>-->
+<!--      </el-col>-->
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="info"-->
+<!--          plain-->
+<!--          icon="el-icon-download"-->
+<!--          size="mini"-->
+<!--          @click="handleExport"-->
+<!--          v-hasPermi="['vet:knowledge:export']"-->
+<!--        >导出</el-button>-->
+<!--      </el-col>-->
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -140,9 +140,14 @@
           <image-preview :src="scope.row.coverImage" :width="50" :height="50" />
         </template>
       </el-table-column>
-      <el-table-column label="文章标题" align="center" prop="title" min-width="200" show-overflow-tooltip />
-      <el-table-column label="文章副标题" align="center" prop="subtitle" min-width="200" show-overflow-tooltip />
-      <el-table-column label="文章内容" align="center" prop="content" min-width="200" show-overflow-tooltip />
+      <el-table-column label="文章标题" align="center" prop="title" min-width="100" show-overflow-tooltip/>
+      <el-table-column label="文章副标题" align="center" prop="subtitle" min-width="100" show-overflow-tooltip />
+<!--      <el-table-column label="文章内容" align="center" prop="content" min-width="200" show-overflow-tooltip />-->
+      <el-table-column label="文章内容" align="center" prop="content" min-width="200" show-overflow-tooltip>
+        <template #default="scope">
+          <div v-html="scope.row.content"></div>
+        </template>
+      </el-table-column>
       <el-table-column label="发布时间" align="center" prop="publishTime" min-width="200" show-overflow-tooltip />
       <el-table-column label="查看次数" align="center" prop="viewCount" min-width="200" show-overflow-tooltip />
 
@@ -179,21 +184,24 @@
           <span v-else>-</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="280">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="280">
         <template slot-scope="scope">
           <el-button
             size="mini"
             type="text"
             icon="el-icon-view"
             @click="handleView(scope.row)"
+            class="info-btn view-btn"
           >查看</el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
+            style="color: #42B983"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['vet:knowledge:edit']"
             v-if="scope.row.articleStatus === '0' && scope.row.auditStatus === '0'"
+            class="info-btn alter-btn"
           >修改</el-button>
           <el-button
             size="mini"
@@ -228,6 +236,7 @@
             @click="handleOffline(scope.row)"
             v-hasPermi="['vet:knowledge:publish']"
             v-if="scope.row.articleStatus === '1'"
+            class="info-btn offline-btn"
           >下架</el-button>
           <!-- 上架按钮：已下架状态显示 -->
           <el-button
@@ -243,9 +252,11 @@
             size="mini"
             type="text"
             icon="el-icon-delete"
+            style="color: #f28888"
             @click="handleDelete(scope.row)"
             v-hasPermi="['vet:knowledge:remove']"
             v-if="scope.row.articleStatus === '0'"
+            class="info-btn delete-btn"
           >删除</el-button>
         </template>
       </el-table-column>
@@ -262,25 +273,25 @@
     <!-- 新增/修改文章对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-          <el-form-item label="推荐专家" prop="expertId">
-            <el-select
-              v-model="form.expertId"
-              placeholder="请选择推荐专家"
-              clearable
-              filterable
-              style="width: 100%;"
-            >
-              <el-option
-                v-for="expert in expertList"
-                :key="expert.expertId"
-                :label="expert.realName"
-                :value="expert.expertId"
-              />
-            </el-select>
-            <div style="font-size: 12px; color: #999; margin-top: 5px;">
-              提示：选择为您推荐药品的专家
-            </div>
-          </el-form-item>
+        <el-form-item label="推荐专家" prop="expertId">
+          <el-select
+            v-model="form.expertId"
+            placeholder="请选择推荐专家"
+            clearable
+            filterable
+            style="width: 100%;"
+          >
+            <el-option
+              v-for="expert in expertList"
+              :key="expert.expertId"
+              :label="expert.realName"
+              :value="expert.expertId"
+            />
+          </el-select>
+          <div style="font-size: 12px; color: #999; margin-top: 5px;">
+            提示：选择为您推荐药品的专家
+          </div>
+        </el-form-item>
         <el-form-item label="封面" prop="coverImage">
           <image-upload v-model="form.coverImage" />
         </el-form-item>
@@ -877,4 +888,32 @@ export default {
   max-height: 400px;
   overflow-y: auto;
 }
+
+/* 操作按钮 */
+.info-btn {
+  padding: 6px 10px;
+  border-radius: 4px;
+  margin: 0 10px;
+  transition: all 0.3s ease;
+}
+
+.view-btn:hover {
+  background-color: rgb(216, 238, 248);
+  transform: translateY(-1px);
+}
+
+.offline-btn:hover{
+  background-color: rgba(243, 239, 231, 100);
+  transform: translateY(-1px);
+}
+
+.alter-btn:hover{
+  background-color: rgb(230, 255, 238);
+  transform: translateY(-1px);
+}
+
+.delete-btn:hover {
+  background-color: rgba(245, 108, 108, 0.1);
+  transform: translateY(-1px);
+}
 </style>
diff --git a/chenhai-ui/src/views/vet/notification/index.vue b/chenhai-ui/src/views/vet/notification/index.vue
index d2f734b..e5184fa 100644
--- a/chenhai-ui/src/views/vet/notification/index.vue
+++ b/chenhai-ui/src/views/vet/notification/index.vue
@@ -513,8 +513,8 @@ export default {
   }
 
   .info-icon {
-    width: 30px;
-    height: 30px;
+    width: 40px;
+    height: 40px;
     margin-right: 15px;
     filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
   }
diff --git a/chenhai-ui/src/views/vet/product/index.vue b/chenhai-ui/src/views/vet/product/index.vue
index 6417805..f14b15d 100644
--- a/chenhai-ui/src/views/vet/product/index.vue
+++ b/chenhai-ui/src/views/vet/product/index.vue
@@ -1,13 +1,6 @@
 <template>
   <div class="app-container">
-    <!-- 搜索区域 -->
-    <el-form
-      :model="queryParams"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      class="search-form"
-    >
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="产品名称" prop="name">
         <el-input
           v-model="queryParams.name"
@@ -19,46 +12,54 @@
       <el-form-item label="产品类型" prop="type">
         <el-select
           v-model="queryParams.type"
-          placeholder="请选择产品类型"
+          placeholder="请输入产品类型"
           clearable
-          style="width: 120px"
         >
-          <el-option label="全部" value="" />
-          <el-option label="处方药" value="0" />
-          <el-option label="非处方药" value="1" />
-          <el-option label="中成药" value="2" />
-          <el-option label="保健品" value="3" />
+          <el-option
+            v-for="dict in dict.type.medicine_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+            @keyup.enter.native="handleQuery"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="产品分类" prop="category">
         <el-select
           v-model="queryParams.category"
-          placeholder="请选择分类"
+          placeholder="请输入产品分类"
           clearable
-          style="width: 120px"
         >
-          <el-option label="全部" value="" />
-          <el-option label="抗生素类" value="0" />
-          <el-option label="抗寄生虫类" value="1" />
-          <el-option label="疫苗类" value="2" />
-          <el-option label="消毒剂类" value="3" />
-          <el-option label="营养补充类" value="4" />
-          <el-option label="外科用药" value="5" />
-          <el-option label="诊断试剂" value="6" />
-          <el-option label="中药制剂" value="7" />
+          <el-option
+            v-for="dict in dict.type.vet_product_category"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+            @keyup.enter.native="handleQuery"
+          />
         </el-select>
       </el-form-item>
+      <el-form-item label="生产厂家" prop="manufacturer">
+        <el-input
+          v-model="queryParams.manufacturer"
+          placeholder="请输入生产厂家"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
       <el-form-item label="状态" prop="status">
         <el-select
           v-model="queryParams.status"
           placeholder="请选择状态"
           clearable
-          style="width: 120px"
         >
-          <el-option label="全部" value="" />
-          <el-option label="草稿" value="0" />
-          <el-option label="上架" value="1" />
-          <el-option label="下架" value="2" />
+          <el-option
+            v-for="dict in dict.type.sys_publish_status"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+            @keyup.enter.native="handleQuery"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="审核状态" prop="auditStatus">
@@ -66,356 +67,384 @@
           v-model="queryParams.auditStatus"
           placeholder="请选择审核状态"
           clearable
-          style="width: 120px"
         >
-          <el-option label="全部" value="" />
-          <el-option label="待审核" value="0" />
-          <el-option label="审核通过" value="1" />
-          <el-option label="审核拒绝" value="2" />
-          <el-option label="无需审核" value="3" />
+          <el-option
+            v-for="dict in dict.type.audit_status.filter(item => item.value < 4)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+            @keyup.enter.native="handleQuery"
+          />
         </el-select>
       </el-form-item>
+      <!--      <el-form-item label="规格" prop="specification">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.specification"-->
+      <!--          placeholder="请输入规格"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="单位" prop="unit">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.unit"-->
+      <!--          placeholder="请输入单位"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+
+      <!--      <el-form-item label="批准文号" prop="approvalNumber">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.approvalNumber"-->
+      <!--          placeholder="请输入批准文号"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="销售价格" prop="price">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.price"-->
+      <!--          placeholder="请输入销售价格"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="成本价" prop="costPrice">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.costPrice"-->
+      <!--          placeholder="请输入成本价"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="库存数量" prop="stock">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.stock"-->
+      <!--          placeholder="请输入库存数量"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="最低库存预警" prop="minStock">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.minStock"-->
+      <!--          placeholder="请输入最低库存预警"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="治疗周期" prop="treatmentDuration">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.treatmentDuration"-->
+      <!--          placeholder="请输入治疗周期"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="删除标识：0-正常/1-删除" prop="isDeleted">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.isDeleted"-->
+      <!--          placeholder="请输入删除标识：0-正常/1-删除"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="诊所ID" prop="clinicId">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.clinicId"-->
+      <!--          placeholder="请输入诊所ID"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="兽医ID" prop="vetId">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.vetId"-->
+      <!--          placeholder="请输入兽医ID"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="创建时间" prop="createdAt">-->
+      <!--        <el-date-picker clearable-->
+      <!--                        v-model="queryParams.createdAt"-->
+      <!--                        type="date"-->
+      <!--                        value-format="yyyy-MM-dd"-->
+      <!--                        placeholder="请选择创建时间">-->
+      <!--        </el-date-picker>-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="更新时间" prop="updatedAt">-->
+      <!--        <el-date-picker clearable-->
+      <!--                        v-model="queryParams.updatedAt"-->
+      <!--                        type="date"-->
+      <!--                        value-format="yyyy-MM-dd"-->
+      <!--                        placeholder="请选择更新时间">-->
+      <!--        </el-date-picker>-->
+      <!--      </el-form-item>-->
       <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="handleQuery">
-          搜索
-        </el-button>
-        <el-button icon="el-icon-refresh" @click="resetQuery">
-          重置
-        </el-button>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
 
-    <!-- 操作区域 -->
-    <el-row :gutter="10" class="mb8 operation-row">
-      <el-col :span="16" class="operation-left">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
         <el-button
           type="primary"
           plain
           icon="el-icon-plus"
-          size="small"
+          size="mini"
           @click="handleAdd"
           v-hasPermi="['vet:product:add']"
-        >
-          新增
-        </el-button>
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
         <el-button
           type="success"
           plain
           icon="el-icon-edit"
-          size="small"
+          size="mini"
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['vet:product:edit']"
-        >
-          修改
-        </el-button>
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
         <el-button
           type="danger"
           plain
           icon="el-icon-delete"
-          size="small"
+          size="mini"
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['vet:product:remove']"
-        >
-          删除
-        </el-button>
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="small"
-          @click="handleExport"
-          v-hasPermi="['vet:product:export']"
-        >
-          导出
-        </el-button>
-      </el-col>
-      <el-col :span="8" class="operation-right">
-        <right-toolbar
-          :showSearch.sync="showSearch"
-          @queryTable="getList"
-        />
+        >删除</el-button>
       </el-col>
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="warning"-->
+<!--          plain-->
+<!--          icon="el-icon-download"-->
+<!--          size="mini"-->
+<!--          @click="handleExport"-->
+<!--          v-hasPermi="['vet:product:export']"-->
+<!--        >导出</el-button>-->
+<!--      </el-col>-->
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <!-- 数据表格 -->
-    <el-table
-      v-loading="loading"
-      :data="productList"
-      @selection-change="handleSelectionChange"
-      style="width: 100%"
-      :default-sort="{prop: 'createdAt', order: 'descending'}"
-    >
-      <el-table-column type="selection" width="55" align="center" />
-
-      <el-table-column
-        label="产品名称"
-        prop="name"
-        min-width="220"
-        show-overflow-tooltip
-      >
+    <!-- 表格部分 -->
+    <el-table v-loading="loading" :data="productList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center"/>
+      <!--      <el-table-column label="主键ID" align="center" prop="id" />-->
+      <el-table-column label="产品名称" align="center" prop="name" min-width="220" show-overflow-tooltip/>
+      <el-table-column label="相关图片" align="center" prop="mainImage" width="100">
         <template slot-scope="scope">
-          <div class="product-name-cell">
-            <!-- 主图显示区域 -->
-            <div class="image-container" v-if="scope.row.mainImage">
-              <el-image
-                :src="getFullImageUrl(scope.row.mainImage)"
-                :preview-src-list="getAllPreviewImages(scope.row)"
-                fit="cover"
-                class="product-thumb"
-                @click="showImageGallery(scope.row)"
-              >
-                <div slot="error" class="image-slot">
-                  <i class="el-icon-picture-outline"></i>
-                </div>
-              </el-image>
-              <!-- 图片数量提示 -->
-              <div v-if="getImageCount(scope.row) > 1" class="image-count-badge">
-                +{{ getImageCount(scope.row) - 1 }}
-              </div>
-            </div>
-            <div v-else class="no-image-placeholder" @click="showImageGallery(scope.row)">
-              <i class="el-icon-picture-outline"></i>
-            </div>
-            <div class="product-info">
-              <span class="name-text">{{ scope.row.name }}</span>
-            </div>
-          </div>
+          <image-preview :src="scope.row.mainImage" :width="50" :height="50"/>
         </template>
       </el-table-column>
-
-      <!-- 产品类型 -->
-      <el-table-column
-        label="类型"
-        prop="type"
-        width="100"
-        align="center"
-      >
+      <el-table-column label="类型" align="center" prop="type" width="100">
         <template slot-scope="scope">
           <el-tag
             :type="getTypeTagType(scope.row.type)"
             size="small"
           >
-            {{ getTypeText(scope.row.type) }}
+            {{ scope.row.type }}
           </el-tag>
         </template>
       </el-table-column>
-
-      <!-- 产品分类 -->
-      <el-table-column
-        label="分类"
-        prop="category"
-        width="120"
-        align="center"
-      >
+      <el-table-column label="分类" align="center" prop="category" width="120">
         <template slot-scope="scope">
           <el-tag
             :type="getCategoryTagType(scope.row.category)"
             size="small"
           >
-            {{ getCategoryText(scope.row.category) }}
+            {{ scope.row.category }}
           </el-tag>
         </template>
       </el-table-column>
-
-      <el-table-column
-        label="规格"
-        prop="specification"
-        width="120"
-        align="center"
-      />
-
-      <el-table-column
-        label="价格"
-        width="120"
-        align="center"
-        sortable
-      >
+      <el-table-column label="规格" align="center" prop="specification" width="120"/>
+      <!--      <el-table-column label="单位" align="center" prop="unit" />-->
+      <el-table-column label="价格" align="center" prop="price" width="120" sortable>
         <template slot-scope="scope">
           <div class="price-cell">
-            <div class="price-text">¥{{ scope.row.price }}</div>
+            <div class="price-text" >¥{{ scope.row.price }}</div>
             <div class="cost-price">成本: ¥{{ scope.row.costPrice }}</div>
           </div>
         </template>
       </el-table-column>
-
-      <el-table-column
-        label="库存"
-        width="120"
-        align="center"
-      >
+      <el-table-column label="库存" align="center" prop='stock' width="120" sortable>
         <template slot-scope="scope">
           <div class="stock-cell">
-            <div :class="['stock-text', getStockStatusClass(scope.row.stock, scope.row.minStock)]">
+            <div class='stock-text'>
+              <i class="el-icon-box"></i>
               {{ scope.row.stock }}
             </div>
             <div class="min-stock">预警: {{ scope.row.minStock }}</div>
           </div>
         </template>
       </el-table-column>
-
-      <el-table-column
-        label="状态"
-        prop="status"
-        width="100"
-        align="center"
-      >
+      <el-table-column label="生产厂家" align="center" prop="manufacturer" width="150" show-overflow-tooltip/>
+      <el-table-column label="状态" prop="status" width="100" align="center">
         <template slot-scope="scope">
-          <el-tag
-            :type="getStatusTagType(scope.row.status)"
-            size="small"
-          >
+          <el-tag :type="getStatusTagType(scope.row.status)" size="small">
             {{ getStatusText(scope.row.status) }}
           </el-tag>
         </template>
       </el-table-column>
-
-      <el-table-column
-        label="审核状态"
-        prop="auditStatus"
-        width="120"
-        align="center"
-      >
+      <el-table-column label="审核状态" prop="auditStatus" width="120" align="center">
         <template slot-scope="scope">
-          <el-tag
-            :type="getAuditStatusTagType(scope.row.auditStatus)"
-            size="small"
-          >
+          <el-tag :type="getAuditStatusTagType(scope.row.auditStatus)" size="small">
             {{ getAuditStatusText(scope.row.auditStatus) }}
           </el-tag>
         </template>
       </el-table-column>
-
-      <el-table-column
-        label="生产厂家"
-        prop="manufacturer"
-        width="150"
-        show-overflow-tooltip
-      />
-
-      <el-table-column
-        label="创建时间"
-        prop="createdAt"
-        width="160"
-        align="center"
-        sortable
-      >
+<!--      <el-table-column label="批准文号" align="center" prop="approvalNumber" />-->
+<!--      <el-table-column label="主要成分" align="center" prop="ingredients" />-->
+<!--      <el-table-column label="适应症" align="center" prop="indications" />-->
+<!--      <el-table-column label="用法用量" align="center" prop="usageDosage" />-->
+<!--      <el-table-column label="销售价格" align="center" prop="price" />-->
+<!--      <el-table-column label="成本价" align="center" prop="costPrice" />-->
+<!--      <el-table-column label="库存数量" align="center" prop="stock" />-->
+<!--      <el-table-column label="最低库存预警" align="center" prop="minStock" />-->
+<!--      <el-table-column label="多张图片URL，JSON格式" align="center" prop="images" />-->
+<!--      <el-table-column label="适用动物：如犬、猫、猪等" align="center" prop="treatAnimals" />-->
+<!--      <el-table-column label="治疗疾病" align="center" prop="treatDiseases" />-->
+<!--      <el-table-column label="治疗方案/内容" align="center" prop="treatmentContent" />-->
+<!--      <el-table-column label="治疗周期" align="center" prop="treatmentDuration" />-->
+<!--      <el-table-column label="注意事项" align="center" prop="precautions" />-->
+<!--      <el-table-column label="状态：0-草稿/1-上架/2-下架" align="center" prop="status" />-->
+<!--      <el-table-column label="删除标识：0-正常/1-删除" align="center" prop="isDeleted" />-->
+<!--      <el-table-column label="诊所ID" align="center" prop="clinicId" />-->
+<!--      <el-table-column label="兽医ID" align="center" prop="vetId" />-->
+<!--      <el-table-column label="创建时间" align="center" prop="createdAt" width="180">-->
+<!--        <template slot-scope="scope">-->
+<!--          <span>{{ parseTime(scope.row.createdAt, '{y}-{m}-{d}') }}</span>-->
+<!--        </template>-->
+<!--      </el-table-column>-->
+<!--      <el-table-column label="更新时间" align="center" prop="updatedAt" width="180">-->
+<!--        <template slot-scope="scope">-->
+<!--          <span>{{ parseTime(scope.row.updatedAt, '{y}-{m}-{d}') }}</span>-->
+<!--        </template>-->
+<!--      </el-table-column>-->
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="300">
         <template slot-scope="scope">
-          <span>{{ formatTime(scope.row.createdAt) }}</span>
-        </template>
-      </el-table-column>
-
-      <el-table-column
-        label="操作"
-        align="center"
-        width="300"
-        fixed="right"
-        class-name="small-padding fixed-width"
-      >
-        <template slot-scope="scope">
-          <!-- 详情按钮 -->
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-view"
-            @click="handleDetail(scope.row)"
-          >
-            详情
-          </el-button>
-
-          <!-- 编辑按钮（仅在草稿/审核驳回/敏感内容驳回状态显示） -->
           <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['vet:product:edit']"
-            v-if="scope.row.status === '0' && scope.row.auditStatus === '3'"
-          >
-            编辑
-          </el-button>
-
-          <!-- 删除按钮 -->
+          >修改</el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
-            style="color: #f56c6c"
             @click="handleDelete(scope.row)"
             v-hasPermi="['vet:product:remove']"
-          >
-            删除
-          </el-button>
-
-          <!-- 提交审核按钮（草稿状态显示） -->
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-s-promotion"
-            style="color: #1890ff"
-            @click="handleSubmitAudit(scope.row)"
-            v-hasPermi="['vet:product:submit']"
-            v-if="scope.row.status === '0' && scope.row.auditStatus === '0'"
-          >
-            提交审核
-          </el-button>
-
-          <!-- 上架按钮（审核通过且未上架状态显示） -->
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-top"
-            style="color: #52c41a"
-            @click="handlePublish(scope.row)"
-            v-hasPermi="['vet:product:publish']"
-            v-if="scope.row.auditStatus === '2' && scope.row.status === '0'"
-          >
-            上架
-          </el-button>
-
-          <!-- 下架按钮（已上架状态显示） -->
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-bottom"
-            style="color: #faad14"
-            @click="handleOffline(scope.row)"
-            v-hasPermi="['vet:product:offline']"
-            v-if="scope.row.status === '1'"
-          >
-            下架
-          </el-button>
-
-          <!-- 取消审核按钮（待审核状态且编辑权限显示） -->
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-close"
-            style="color: #ff4d4f"
-            @click="handleCancelAudit(scope.row)"
-            v-hasPermi="['vet:product:edit']"
-            v-if="scope.row.status === '0' && scope.row.auditStatus === '1'"
-          >
-            取消审核
-          </el-button>
-
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-s-promotion"
-            style="color: #1890ff"
-            @click="handleResubmitAudit(scope.row)"
-            v-hasPermi="['vet:product:submit']"
-            v-if="scope.row.status === '0' && scope.row.auditStatus === '3'"
-          >
-            重新提交
-          </el-button>
+          >删除</el-button>
         </template>
+<!--        <template slot-scope="scope">-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-view"-->
+<!--            @click="handleDetail(scope.row)"-->
+<!--          >-->
+<!--            详情-->
+<!--          </el-button>-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-edit"-->
+<!--            style="color: #42B983"-->
+<!--            @click="handleUpdate(scope.row)"-->
+<!--            v-hasPermi="['vet:product:edit']"-->
+<!--            v-if="scope.row.status === '0' && (scope.row.auditStatus === '0' || scope.row.auditStatus === '3')"-->
+<!--          >-->
+<!--            编辑-->
+<!--          </el-button>-->
+
+<!--          &lt;!&ndash; 删除按钮 &ndash;&gt;-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-delete"-->
+<!--            style="color: #f56c6c"-->
+<!--            @click="handleDelete(scope.row)"-->
+<!--            v-hasPermi="['vet:product:remove']"-->
+<!--          >-->
+<!--            删除-->
+<!--          </el-button>-->
+
+<!--          &lt;!&ndash; 提交审核按钮（草稿状态显示） &ndash;&gt;-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-s-promotion"-->
+<!--            style="color: #dab708"-->
+<!--            @click="handleSubmitAudit(scope.row)"-->
+<!--            v-hasPermi="['vet:product:submit']"-->
+<!--            v-if="scope.row.status === '0' && scope.row.auditStatus === '0'"-->
+<!--          >-->
+<!--            提交审核-->
+<!--          </el-button>-->
+
+<!--          &lt;!&ndash; 上架按钮（审核通过且未上架状态显示） &ndash;&gt;-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-top"-->
+<!--            style="color: #f46a0c"-->
+<!--            @click="handlePublish(scope.row)"-->
+<!--            v-hasPermi="['vet:product:publish']"-->
+<!--            v-if="scope.row.auditStatus === '2' && scope.row.status === '0'"-->
+<!--          >-->
+<!--            上架-->
+<!--          </el-button>-->
+
+<!--          &lt;!&ndash; 下架按钮（已上架状态显示） &ndash;&gt;-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-bottom"-->
+<!--            style="color: #636361"-->
+<!--            @click="handleOffline(scope.row)"-->
+<!--            v-hasPermi="['vet:product:offline']"-->
+<!--            v-if="scope.row.status === '1'"-->
+<!--          >-->
+<!--            下架-->
+<!--          </el-button>-->
+
+<!--          &lt;!&ndash; 取消审核按钮（待审核状态且编辑权限显示） &ndash;&gt;-->
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-close"-->
+<!--            style="color: #5607b3"-->
+<!--            @click="handleCancelAudit(scope.row)"-->
+<!--            v-hasPermi="['vet:product:edit']"-->
+<!--            v-if="scope.row.status === '0' && scope.row.auditStatus === '1'"-->
+<!--          >-->
+<!--            取消审核-->
+<!--          </el-button>-->
+
+<!--          <el-button-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-s-promotion"-->
+<!--            style="color: #ae059e"-->
+<!--            @click="handleResubmitAudit(scope.row)"-->
+<!--            v-hasPermi="['vet:product:submit']"-->
+<!--            v-if="scope.row.status === '0' && scope.row.auditStatus === '3'"-->
+<!--          >-->
+<!--            重新提交-->
+<!--          </el-button>-->
+<!--        </template>-->
       </el-table-column>
     </el-table>
 
-    <!-- 分页 -->
     <pagination
       v-show="total>0"
       :total="total"
@@ -424,497 +453,143 @@
       @pagination="getList"
     />
 
-    <!-- 图片预览对话框 -->
-    <el-dialog
-      title="产品图片"
-      :visible.sync="imageDialogVisible"
-      width="80%"
-      top="5vh"
-      append-to-body
-      @closed="handleImageDialogClose"
-    >
-      <div class="image-gallery">
-        <!-- 主图 -->
-        <div v-if="currentProduct.mainImage" class="main-image-container">
-          <h3 style="margin-bottom: 10px;">主图</h3>
-          <el-image
-            :src="getFullImageUrl(currentProduct.mainImage)"
-            :preview-src-list="[getFullImageUrl(currentProduct.mainImage)]"
-            fit="contain"
-            class="main-image"
-          />
-        </div>
-
-        <!-- 多张图片 -->
-        <div v-if="currentProduct.imageList && currentProduct.imageList.length > 0" class="additional-images">
-          <h3 style="margin-bottom: 10px;">其他图片</h3>
-          <div class="image-list">
-            <div
-              v-for="(image, index) in currentProduct.imageList"
-              :key="index"
-              class="image-item"
-            >
-              <el-image
-                :src="getFullImageUrl(image)"
-                :preview-src-list="getAllImagesPreviewList(currentProduct)"
-                fit="cover"
-                class="additional-image"
-              >
-                <div slot="error" class="image-slot">
-                  <i class="el-icon-picture-outline"></i>
-                </div>
-              </el-image>
-              <div class="image-actions">
-                <el-button
-                  size="mini"
-                  icon="el-icon-delete"
-                  type="text"
-                  @click="removeImage(index)"
-                  v-hasPermi="['vet:product:edit']"
-                >
-                  删除
-                </el-button>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <!-- 没有图片的提示 -->
-        <div v-if="!currentProduct.mainImage && (!currentProduct.imageList || currentProduct.imageList.length === 0)" class="no-images">
-          <i class="el-icon-picture-outline" style="font-size: 48px; color: #c0c4cc;"></i>
-          <p style="margin-top: 10px; color: #909399;">该产品暂无图片</p>
-        </div>
-      </div>
-
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="imageDialogVisible = false">关 闭</el-button>
-        <el-button type="primary" @click="imageDialogVisible = false" v-if="!isEditing">确 定</el-button>
-      </div>
-    </el-dialog>
-
-    <!-- 添加/编辑对话框 -->
-    <el-dialog
-      :title="title"
-      :visible.sync="open"
-      width="800px"
-      append-to-body
-      :close-on-click-modal="false"
-    >
-      <el-tabs v-model="activeTab" type="border-card">
-        <!-- 基本信息 -->
-        <el-tab-pane label="基本信息" name="basic">
-          <el-form ref="form" :model="form" :rules="rules" label-width="120px">
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="产品名称" prop="name">
-                  <el-input v-model="form.name" placeholder="请输入产品名称" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="产品类型" prop="type">
-                  <el-select v-model="form.type" placeholder="请选择产品类型" style="width: 100%">
-                    <el-option label="处方药" value="0" />
-                    <el-option label="非处方药" value="1" />
-                    <el-option label="中成药" value="2" />
-                    <el-option label="保健品" value="3" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="产品分类" prop="category">
-                  <el-select v-model="form.category" placeholder="请选择产品分类" style="width: 100%">
-                    <el-option label="抗生素类" value="0" />
-                    <el-option label="抗寄生虫类" value="1" />
-                    <el-option label="疫苗类" value="2" />
-                    <el-option label="消毒剂类" value="3" />
-                    <el-option label="营养补充类" value="4" />
-                    <el-option label="外科用药" value="5" />
-                    <el-option label="诊断试剂" value="6" />
-                    <el-option label="中药制剂" value="7" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="规格" prop="specification">
-                  <el-input v-model="form.specification" placeholder="请输入规格" />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="单位" prop="unit">
-                  <el-input v-model="form.unit" placeholder="请输入单位" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="生产厂家" prop="manufacturer">
-                  <el-input v-model="form.manufacturer" placeholder="请输入生产厂家" />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="批准文号" prop="approvalNumber">
-                  <el-input v-model="form.approvalNumber" placeholder="请输入批准文号" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="状态" prop="status">
-                  <el-radio-group v-model="form.status">
-                    <el-radio :label="'0'">草稿</el-radio>
-                    <el-radio :label="'1'">上架</el-radio>
-                    <el-radio :label="'2'">下架</el-radio>
-                  </el-radio-group>
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <!-- 图片上传区域 -->
-            <el-form-item label="产品图片" prop="mainImage">
-              <div class="image-upload-container">
-                <!-- 主图上传 -->
-                <div class="main-upload">
-                  <div class="upload-label">主图</div>
-                  <el-upload
-                    class="avatar-uploader"
-                    action="/dev-api/common/upload"
-                    :show-file-list="false"
-                    :on-success="handleMainImageSuccess"
-                    :before-upload="beforeAvatarUpload"
-                    :headers="uploadHeaders"
-                  >
-                    <img v-if="form.mainImage" :src="getFullImageUrl(form.mainImage)" class="avatar">
-                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-                  </el-upload>
-                  <div v-if="form.mainImage" class="image-actions">
-                    <el-button
-                      size="mini"
-                      type="text"
-                      icon="el-icon-delete"
-                      @click="removeMainImage"
-                    >
-                      删除主图
-                    </el-button>
-                  </div>
-                </div>
-
-                <!-- 多张图片上传 -->
-                <div class="multiple-upload">
-                  <div class="upload-label">其他图片</div>
-                  <div class="upload-tip">最多可上传9张图片</div>
-
-                  <el-upload
-                    class="multiple-uploader"
-                    action="/dev-api/common/upload"
-                    :file-list="form.imageFileList"
-                    :on-success="handleAdditionalImageSuccess"
-                    :before-upload="beforeAvatarUpload"
-                    :on-remove="handleImageRemove"
-                    :headers="uploadHeaders"
-                    list-type="picture-card"
-                    :limit="9"
-                    :on-exceed="handleExceed"
-                    :auto-upload="true"
-                  >
-                    <i class="el-icon-plus"></i>
-                  </el-upload>
-
-                  <div v-if="form.imageList && form.imageList.length > 0" class="image-preview-list">
-                    <div class="preview-tip">已上传 {{ form.imageList.length }} 张图片</div>
-                  </div>
-                </div>
-              </div>
-            </el-form-item>
-
-            <el-form-item label="主要成分" prop="ingredients">
-              <el-input
-                v-model="form.ingredients"
-                type="textarea"
-                placeholder="请输入主要成分"
-                :rows="3"
-              />
-            </el-form-item>
-
-            <el-form-item label="适应症" prop="indications">
-              <el-input
-                v-model="form.indications"
-                type="textarea"
-                placeholder="请输入适应症"
-                :rows="3"
-              />
-            </el-form-item>
-          </el-form>
-        </el-tab-pane>
-
-        <!-- 价格库存 -->
-        <el-tab-pane label="价格库存" name="priceStock">
-          <el-form ref="form" :model="form" :rules="rules" label-width="120px">
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="销售价格" prop="price">
-                  <el-input-number
-                    v-model="form.price"
-                    :min="0"
-                    :precision="2"
-                    :step="0.1"
-                    style="width: 100%"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="成本价" prop="costPrice">
-                  <el-input-number
-                    v-model="form.costPrice"
-                    :min="0"
-                    :precision="2"
-                    :step="0.1"
-                    style="width: 100%"
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="库存数量" prop="stock">
-                  <el-input-number
-                    v-model="form.stock"
-                    :min="0"
-                    :step="1"
-                    style="width: 100%"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="最低库存预警" prop="minStock">
-                  <el-input-number
-                    v-model="form.minStock"
-                    :min="0"
-                    :step="1"
-                    style="width: 100%"
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="20">
-              <el-col :span="12">
-                <el-form-item label="适用动物" prop="treatAnimals">
-                  <el-input
-                    v-model="form.treatAnimals"
-                    placeholder="如：犬、猫、猪等，多个用逗号分隔"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="治疗疾病" prop="treatDiseases">
-                  <el-input
-                    v-model="form.treatDiseases"
-                    placeholder="如：呼吸道感染、皮肤感染等"
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </el-tab-pane>
-
-        <!-- 产品详情 -->
-        <el-tab-pane label="产品详情" name="detail">
-          <el-form ref="form" :model="form" :rules="rules" label-width="120px">
-            <el-form-item label="用法用量" prop="usageDosage">
-              <el-input
-                v-model="form.usageDosage"
-                type="textarea"
-                placeholder="请输入用法用量"
-                :rows="4"
-              />
-            </el-form-item>
-
-            <el-form-item label="治疗方案" prop="treatmentContent">
-              <el-input
-                v-model="form.treatmentContent"
-                type="textarea"
-                placeholder="请输入治疗方案/内容"
-                :rows="3"
-              />
-            </el-form-item>
-
-            <el-form-item label="治疗周期" prop="treatmentDuration">
-              <el-input v-model="form.treatmentDuration" placeholder="请输入治疗周期" />
-            </el-form-item>
-
-            <el-form-item label="注意事项" prop="precautions">
-              <el-input
-                v-model="form.precautions"
-                type="textarea"
-                placeholder="请输入注意事项"
-                :rows="3"
-              />
-            </el-form-item>
-          </el-form>
-        </el-tab-pane>
-      </el-tabs>
-
+    <!-- 添加或修改兽医产品信息对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="产品名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入产品名称" />
+        </el-form-item>
+        <el-form-item label="产品类型" prop="type">
+          <el-select v-model="form.type" placeholder="请选择产品类型" clearable>
+            <el-option v-for="dict in dict.type.medicine_type" :key="dict.value" :label="dict.label" :value="dict.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="产品分类" prop="category">
+          <el-select v-model="form.category" placeholder="请选择产品分类" clearable>
+            <el-option v-for="dict in dict.type.vet_product_category" :key="dict.value" :label="dict.label" :value="dict.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="规格" prop="specification">
+          <el-input v-model="form.specification" placeholder="请输入规格" />
+        </el-form-item>
+        <el-form-item label="单位" prop="unit">
+          <el-input v-model="form.unit" placeholder="请输入单位" />
+        </el-form-item>
+        <el-form-item label="生产厂家" prop="manufacturer">
+          <el-input v-model="form.manufacturer" placeholder="请输入生产厂家" />
+        </el-form-item>
+        <el-form-item label="批准文号" prop="approvalNumber">
+          <el-input v-model="form.approvalNumber" placeholder="请输入批准文号" />
+        </el-form-item>
+        <el-form-item label="主要成分" prop="ingredients">
+          <el-input v-model="form.ingredients" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="适应症" prop="indications">
+          <el-input v-model="form.indications" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="用法用量" prop="usageDosage">
+          <el-input v-model="form.usageDosage" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="销售价格" prop="price">
+          <el-input v-model="form.price" placeholder="请输入销售价格" />
+        </el-form-item>
+        <el-form-item label="成本价" prop="costPrice">
+          <el-input v-model="form.costPrice" placeholder="请输入成本价" />
+        </el-form-item>
+        <el-form-item label="库存数量" prop="stock">
+          <el-input v-model="form.stock" placeholder="请输入库存数量" />
+        </el-form-item>
+        <el-form-item label="最低库存预警" prop="minStock">
+          <el-input v-model="form.minStock" placeholder="请输入最低库存预警" />
+        </el-form-item>
+        <el-form-item label="相关图片" prop="mainImage">
+          <image-upload v-model="form.mainImage"/>
+        </el-form-item>
+<!--        <el-form-item label="多张图片URL，JSON格式" prop="images">-->
+<!--          <el-input v-model="form.images" type="textarea" placeholder="请输入内容" />-->
+<!--        </el-form-item>-->
+        <el-form-item label="适用动物：如犬、猫、猪等" prop="treatAnimals">
+          <el-input v-model="form.treatAnimals" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="治疗疾病" prop="treatDiseases">
+          <el-input v-model="form.treatDiseases" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="治疗方案/内容">
+          <editor v-model="form.treatmentContent" :min-height="192"/>
+        </el-form-item>
+        <el-form-item label="治疗周期" prop="treatmentDuration">
+          <el-input v-model="form.treatmentDuration" placeholder="请输入治疗周期" />
+        </el-form-item>
+        <el-form-item label="注意事项" prop="precautions">
+          <el-input v-model="form.precautions" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+<!--        <el-form-item label="删除标识：0-正常/1-删除" prop="isDeleted">-->
+<!--          <el-input v-model="form.isDeleted" placeholder="请输入删除标识：0-正常/1-删除" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="诊所ID" prop="clinicId">-->
+<!--          <el-input v-model="form.clinicId" placeholder="请输入诊所ID" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="兽医ID" prop="vetId">-->
+<!--          <el-input v-model="form.vetId" placeholder="请输入兽医ID" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="创建时间" prop="createdAt">-->
+<!--          <el-date-picker clearable-->
+<!--                          v-model="form.createdAt"-->
+<!--                          type="date"-->
+<!--                          value-format="yyyy-MM-dd"-->
+<!--                          placeholder="请选择创建时间">-->
+<!--          </el-date-picker>-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="更新时间" prop="updatedAt">-->
+<!--          <el-date-picker clearable-->
+<!--                          v-model="form.updatedAt"-->
+<!--                          type="date"-->
+<!--                          value-format="yyyy-MM-dd"-->
+<!--                          placeholder="请选择更新时间">-->
+<!--          </el-date-picker>-->
+<!--        </el-form-item>-->
+      </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="cancel">取 消</el-button>
         <el-button type="primary" @click="submitForm">确 定</el-button>
-      </div>
-    </el-dialog>
-
-    <!-- 产品详情对话框 -->
-    <el-dialog
-      title="产品详情"
-      :visible.sync="detailDialogVisible"
-      width="600px"
-      append-to-body
-    >
-      <el-descriptions
-        class="product-detail-desc"
-        :column="2"
-        border
-        v-loading="detailLoading"
-      >
-        <el-descriptions-item label="产品名称">
-          {{ currentDetail.name || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="产品类型">
-          <el-tag :type="getTypeTagType(currentDetail.type)" size="small">
-            {{ getTypeText(currentDetail.type) }}
-          </el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="产品分类">
-          <el-tag :type="getCategoryTagType(currentDetail.category)" size="small">
-            {{ getCategoryText(currentDetail.category) }}
-          </el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="规格">
-          {{ currentDetail.specification || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="单位">
-          {{ currentDetail.unit || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="生产厂家">
-          {{ currentDetail.manufacturer || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="批准文号">
-          {{ currentDetail.approvalNumber || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="状态">
-          <el-tag :type="getStatusTagType(currentDetail.status)" size="small">
-            {{ getStatusText(currentDetail.status) }}
-          </el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="审核状态">
-          <el-tag :type="getAuditStatusTagType(currentDetail.auditStatus)" size="small">
-            {{ getAuditStatusText(currentDetail.auditStatus) }}
-          </el-tag>
-        </el-descriptions-item>
-        <el-descriptions-item label="销售价格">
-          <span style="color: #f56c6c; font-weight: bold;">¥{{ currentDetail.price || '0.00' }}</span>
-        </el-descriptions-item>
-        <el-descriptions-item label="成本价">
-          ¥{{ currentDetail.costPrice || '0.00' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="库存数量">
-          <span :class="getStockStatusClass(currentDetail.stock, currentDetail.minStock)">
-            {{ currentDetail.stock || 0 }}
-          </span>
-        </el-descriptions-item>
-        <el-descriptions-item label="最低库存预警">
-          {{ currentDetail.minStock || 0 }}
-        </el-descriptions-item>
-        <el-descriptions-item label="适用动物">
-          {{ currentDetail.treatAnimals || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="治疗疾病">
-          {{ currentDetail.treatDiseases || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item :span="2" label="主要成分">
-          <div class="desc-content">{{ currentDetail.ingredients || '--' }}</div>
-        </el-descriptions-item>
-        <el-descriptions-item :span="2" label="适应症">
-          <div class="desc-content">{{ currentDetail.indications || '--' }}</div>
-        </el-descriptions-item>
-        <el-descriptions-item :span="2" label="用法用量">
-          <div class="desc-content">{{ currentDetail.usageDosage || '--' }}</div>
-        </el-descriptions-item>
-        <el-descriptions-item :span="2" label="治疗方案">
-          <div class="desc-content">{{ currentDetail.treatmentContent || '--' }}</div>
-        </el-descriptions-item>
-        <el-descriptions-item label="治疗周期">
-          {{ currentDetail.treatmentDuration || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item :span="2" label="注意事项">
-          <div class="desc-content">{{ currentDetail.precautions || '--' }}</div>
-        </el-descriptions-item>
-        <el-descriptions-item label="创建时间">
-          {{ formatTime(currentDetail.createdAt) }}
-        </el-descriptions-item>
-        <el-descriptions-item label="更新时间">
-          {{ formatTime(currentDetail.updatedAt) }}
-        </el-descriptions-item>
-      </el-descriptions>
-
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="detailDialogVisible = false">关 闭</el-button>
+        <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { listProduct, getProduct, delProduct, addProduct, updateProduct, submitAudit, publishProduct, offlineProduct, cancelAudit } from "@/api/vet/product"
-import { getToken } from '@/utils/auth'
+import { listProduct, getProduct, delProduct, addProduct, updateProduct } from "@/api/vet/product"
 
 export default {
   name: "Product",
+  dicts: ['medicine_type', 'vet_product_category', 'sys_publish_status', 'audit_status'],
   data() {
     return {
+      // 遮罩层
       loading: true,
-      detailLoading: false,
+      // 选中数组
       ids: [],
+      // 非单个禁用
       single: true,
+      // 非多个禁用
       multiple: true,
+      // 显示搜索条件
       showSearch: true,
-      showDebugInfo: false,
-      imageDialogVisible: false,
-      detailDialogVisible: false,
-      isEditing: false,
+      // 总条数
       total: 0,
+      // 兽医产品信息表格数据
       productList: [],
+      // 弹出层标题
       title: "",
+      // 是否显示弹出层
       open: false,
-      activeTab: 'basic',
-
-      // 当前查看的产品
-      currentProduct: {
-        mainImage: '',
-        imageList: []
-      },
-
-      // 当前查看的详情
-      currentDetail: {},
-
+      // 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 10,
         name: null,
         type: null,
         category: null,
-        status: null,
-        auditStatus: null,
-      },
-
-      form: {
-        id: null,
-        name: null,
-        type: null,
-        category: null,
         specification: null,
         unit: null,
         manufacturer: null,
@@ -927,25 +602,22 @@ export default {
         stock: null,
         minStock: null,
         mainImage: null,
-        // 多张图片相关字段
-        images: null, // JSON字符串
-        imageList: [], // 解析后的图片数组
-        imageFileList: [], // 上传组件需要的文件列表
+        images: null,
         treatAnimals: null,
         treatDiseases: null,
         treatmentContent: null,
         treatmentDuration: null,
         precautions: null,
-        status: "0",
-        isDeleted: 0,
+        status: null,
+        isDeleted: null,
         clinicId: null,
-        userId: null,
+        vetId: null,
         createdAt: null,
-        updatedAt: null,
-        auditStatus: null,
-        auditOpinion: null
+        updatedAt: null
       },
-
+      // 表单参数
+      form: {},
+      // 表单校验
       rules: {
         name: [
           { required: true, message: "产品名称不能为空", trigger: "blur" }
@@ -975,377 +647,25 @@ export default {
       }
     }
   },
-  computed: {
-    uploadHeaders() {
-      return {
-        Authorization: 'Bearer ' + getToken()
-      }
-    }
-  },
   created() {
     this.getList()
   },
   methods: {
-    /** 获取当前用户ID */
-    getCurrentUserId() {
-      // 从store获取
-      if (this.$store && this.$store.state.user && this.$store.state.user.userId) {
-        return this.$store.state.user.userId
-      }
-
-      // 从localStorage获取
-      try {
-        const userStr = localStorage.getItem('userInfo') || sessionStorage.getItem('userInfo')
-        if (userStr) {
-          const userInfo = JSON.parse(userStr)
-          return userInfo.userId
-        }
-      } catch (e) {
-        console.error('解析用户信息失败', e)
-      }
-
-      // 默认值
-      return 1
-    },
-
-    /** 查看产品详情 */
-    handleDetail(row) {
-      this.detailLoading = true
-      this.currentDetail = {}
-      this.detailDialogVisible = true
-
-      getProduct(row.id).then(response => {
-        const data = response.data || {}
-
-        // 处理字段名转换
-        this.currentDetail = {
-          id: data.id,
-          name: data.name,
-          type: data.type,
-          category: data.category,
-          specification: data.specification,
-          unit: data.unit,
-          manufacturer: data.manufacturer,
-          approvalNumber: data.approvalNumber || data.approval_number,
-          ingredients: data.ingredients,
-          indications: data.indications,
-          usageDosage: data.usageDosage || data.usage_dosage,
-          price: data.price,
-          costPrice: data.costPrice || data.cost_price,
-          stock: data.stock,
-          minStock: data.minStock || data.min_stock,
-          treatAnimals: data.treatAnimals || data.treat_animals,
-          treatDiseases: data.treatDiseases || data.treat_diseases,
-          treatmentContent: data.treatmentContent || data.treatment_content,
-          treatmentDuration: data.treatmentDuration || data.treatment_duration,
-          precautions: data.precautions,
-          status: data.status,
-          auditStatus: data.auditStatus || data.audit_status,
-          auditOpinion: data.auditOpinion || data.audit_opinion,
-          createdAt: data.createdAt || data.created_at,
-          updatedAt: data.updatedAt || data.updated_at
-        }
-
-        this.detailLoading = false
-      }).catch(error => {
-        console.error('获取详情失败:', error)
-        this.detailLoading = false
-        this.$modal.msgError("获取产品详情失败")
-      })
-    },
-
-    /** 解析图片JSON字符串 */
-    parseImageJson(images) {
-      if (!images) return []
-      try {
-        if (typeof images === 'string') {
-          const parsed = JSON.parse(images)
-          return Array.isArray(parsed) ? parsed : []
-        } else if (Array.isArray(images)) {
-          return images
-        }
-        return []
-      } catch (e) {
-        console.error('解析图片JSON失败:', e, images)
-        return []
-      }
-    },
-
-    /** 查询产品列表 */
+    /** 查询兽医产品信息列表 */
     getList() {
       this.loading = true
       listProduct(this.queryParams).then(response => {
-        console.log('查询结果:', response)
-
-        this.productList = (response.rows || []).map(item => {
-          // 解析多张图片
-          const imageList = this.parseImageJson(item.images || item.images)
-
-          const processedItem = {
-            id: item.id,
-            name: item.name,
-            type: item.type,
-            category: item.category,
-            specification: item.specification,
-            unit: item.unit,
-            manufacturer: item.manufacturer,
-            ingredients: item.ingredients,
-            indications: item.indications,
-            treatAnimals: item.treatAnimals,
-            treatDiseases: item.treatDiseases,
-            treatmentContent: item.treatmentContent,
-            treatmentDuration: item.treatmentDuration,
-            precautions: item.precautions,
-            status: item.status,
-            auditStatus: item.auditStatus || item.audit_status,
-            auditOpinion: item.auditOpinion || item.audit_opinion,
-            isDeleted: item.isDeleted,
-            clinicId: item.clinicId,
-            userId: item.userId,
-
-            price: item.price !== undefined ? item.price : (item.price || 0),
-            costPrice: item.costPrice !== undefined ? item.costPrice : (item.cost_price || 0),
-            stock: item.stock !== undefined ? item.stock : (item.stock || 0),
-            minStock: item.minStock !== undefined ? item.minStock : (item.min_stock || 10),
-            mainImage: item.mainImage !== undefined ? item.mainImage : (item.main_image || null),
-            images: item.images,
-            imageList: imageList,
-
-            approvalNumber: item.approvalNumber !== undefined ? item.approvalNumber : (item.approval_number || ''),
-            usageDosage: item.usageDosage !== undefined ? item.usageDosage : (item.usage_dosage || ''),
-            createdAt: item.createdAt !== undefined ? item.createdAt : (item.created_at || new Date()),
-            updatedAt: item.updatedAt !== undefined ? item.updatedAt : (item.updated_at || new Date())
-          }
-
-          return processedItem
-        })
-
-        this.total = response.total || 0
-        this.loading = false
-      }).catch(error => {
-        console.error('查询失败:', error)
+        this.productList = response.rows
+        this.total = response.total
         this.loading = false
       })
     },
-
-    /** 获取图片总数 */
-    getImageCount(product) {
-      let count = 0
-      if (product.mainImage) count++
-      if (product.imageList && product.imageList.length > 0) {
-        count += product.imageList.length
-      }
-      return count
-    },
-
-    /** 获取所有预览图片列表 */
-    getAllPreviewImages(product) {
-      const images = []
-      if (product.mainImage) {
-        images.push(this.getFullImageUrl(product.mainImage))
-      }
-      if (product.imageList && product.imageList.length > 0) {
-        product.imageList.forEach(img => {
-          if (img) images.push(this.getFullImageUrl(img))
-        })
-      }
-      return images
-    },
-
-    /** 获取所有图片预览列表（用于图片预览对话框） */
-    getAllImagesPreviewList(product) {
-      return this.getAllPreviewImages(product)
-    },
-
-    /** 显示图片画廊 */
-    showImageGallery(row) {
-      this.currentProduct = {
-        id: row.id,
-        name: row.name,
-        mainImage: row.mainImage,
-        imageList: row.imageList || []
-      }
-      this.imageDialogVisible = true
-      this.isEditing = false
-    },
-
-    /** 图片对话框关闭 */
-    handleImageDialogClose() {
-      this.currentProduct = {
-        mainImage: '',
-        imageList: []
-      }
-    },
-
-    /** 获取完整的图片 URL */
-    getFullImageUrl(url) {
-      if (!url) return ''
-
-      // 如果已经是完整 URL，直接返回
-      if (url.startsWith('http://') || url.startsWith('https://')) {
-        return url
-      }
-
-      // 如果是相对路径，添加 base URL
-      const baseUrl = process.env.VUE_APP_BASE_API || window.location.origin
-
-      if (url.startsWith('/profile/upload/')) {
-        return `${baseUrl}${url}`
-      } else if (url.startsWith('/')) {
-        return `${baseUrl}${url}`
-      } else {
-        return `${baseUrl}/${url}`
-      }
-    },
-
-    /** 主图上传成功 */
-    handleMainImageSuccess(res, file) {
-      if (res.code === 200) {
-        this.form.mainImage = res.fileName
-        this.$modal.msgSuccess("主图上传成功")
-      } else {
-        this.$modal.msgError(res.msg)
-      }
-    },
-
-    /** 多张图片上传成功 */
-    handleAdditionalImageSuccess(res, file) {
-      if (res.code === 200) {
-        if (!this.form.imageList) {
-          this.form.imageList = []
-        }
-        this.form.imageList.push(res.fileName)
-        this.$modal.msgSuccess("图片上传成功")
-      } else {
-        this.$modal.msgError(res.msg)
-      }
-    },
-
-    /** 删除图片 */
-    handleImageRemove(file, fileList) {
-      // 从imageList中移除对应的图片
-      const fileName = file.response ? file.response.fileName : file.name
-      if (this.form.imageList) {
-        const index = this.form.imageList.indexOf(fileName)
-        if (index > -1) {
-          this.form.imageList.splice(index, 1)
-        }
-      }
-    },
-
-    /** 删除主图 */
-    removeMainImage() {
-      this.form.mainImage = null
-    },
-
-    /** 移除图片（从画廊中） */
-    removeImage(index) {
-      if (this.currentProduct.imageList && this.currentProduct.imageList.length > index) {
-        this.currentProduct.imageList.splice(index, 1)
-        this.$modal.msgSuccess("图片已删除")
-      }
-    },
-
-    /** 上传超出限制 */
-    handleExceed(files, fileList) {
-      this.$modal.msgError(`最多只能上传9张图片，当前已选择 ${files.length + fileList.length} 张`)
-    },
-
-    /** 图片上传前校验 */
-    beforeAvatarUpload(file) {
-      const isImage = file.type.startsWith('image/')
-      const isLt2M = file.size / 1024 / 1024 < 2
-      const isLt5M = file.size / 1024 / 1024 < 5
-
-      if (!isImage) {
-        this.$modal.msgError('只能上传图片格式文件!')
-        return false
-      }
-
-      // 主图限制2M，其他图片限制5M
-      if (!isLt2M) {
-        this.$modal.msgError('主图大小不能超过 2MB!')
-        return false
-      }
-
-      if (!isLt5M) {
-        this.$modal.msgError('图片大小不能超过 5MB!')
-        return false
-      }
-
-      return true
-    },
-
-    /** 提交审核 */
-    handleSubmitAudit(row) {
-      this.$modal.confirm('确认提交审核吗？提交后产品将进入待审核状态，不可编辑。').then(() => {
-        return submitAudit(row.id)
-      }).then(() => {
-        this.$modal.msgSuccess("提交审核成功")
-        this.getList()
-      }).catch(() => {})
-    },
-
-    /** 上架产品 */
-    handlePublish(row) {
-      this.$modal.confirm('确认上架该产品吗？').then(() => {
-        return publishProduct(row.id)
-      }).then(() => {
-        this.$modal.msgSuccess("上架成功")
-        this.getList()
-      }).catch(() => {})
-    },
-
-    /** 下架产品 */
-    handleOffline(row) {
-      this.$modal.confirm('确认下架该产品吗？').then(() => {
-        return offlineProduct(row.id)
-      }).then(() => {
-        this.$modal.msgSuccess("下架成功")
-        this.getList()
-      }).catch(() => {})
-    },
-
-    /** 取消审核 */
-    handleCancelAudit(row) {
-      this.$modal.confirm('确认取消审核吗？取消后产品将恢复为草稿状态，可以编辑。').then(() => {
-        return cancelAudit(row.id)
-      }).then(() => {
-        this.$modal.msgSuccess("取消审核成功")
-        this.getList()
-      }).catch(() => {})
-    },
-
-    /** 取消按钮 */
+    // 取消按钮
     cancel() {
       this.open = false
       this.reset()
     },
-
-    // 重新提交审核
-    handleResubmitAudit(row) {
-      this.$modal.confirm('确认重新提交审核吗？').then(() => {
-        // 先将审核状态改为待审核，然后再提交
-        const updateData = {
-          id: row.id,
-          auditStatus: '0',
-          auditOpinion: null,
-          auditUserId: null,
-          auditTime: null
-        }
-
-        // 先更新为待审核状态
-        return updateProduct(updateData)
-      }).then(() => {
-        // 再提交审核
-        return submitAudit(row.id)
-      }).then(() => {
-        this.$modal.msgSuccess("重新提交审核成功")
-        this.getList()
-      }).catch(() => {})
-    },
-
-    /** 表单重置 */
+    // 表单重置
     reset() {
       this.form = {
         id: null,
@@ -1365,191 +685,82 @@ export default {
         minStock: null,
         mainImage: null,
         images: null,
-        imageList: [],
-        imageFileList: [],
         treatAnimals: null,
         treatDiseases: null,
         treatmentContent: null,
         treatmentDuration: null,
         precautions: null,
-        status: "0",
-        isDeleted: 0,
+        status: null,
+        isDeleted: null,
         clinicId: null,
-        userId: this.getCurrentUserId(),
+        vetId: null,
         createdAt: null,
-        updatedAt: null,
-        auditStatus: null,
-        auditOpinion: null
+        updatedAt: null
       }
-      this.activeTab = 'basic'
       this.resetForm("form")
     },
-
     /** 搜索按钮操作 */
     handleQuery() {
       this.queryParams.pageNum = 1
       this.getList()
     },
-
     /** 重置按钮操作 */
     resetQuery() {
       this.resetForm("queryForm")
       this.handleQuery()
     },
-
-    /** 多选框选中数据 */
+    // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
-      this.single = selection.length !== 1
+      this.single = selection.length!==1
       this.multiple = !selection.length
     },
-
     /** 新增按钮操作 */
     handleAdd() {
       this.reset()
       this.open = true
-      this.title = "添加产品"
+      this.title = "添加兽医产品信息"
     },
-
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset()
-      const id = row.id || this.ids[0]
+      const id = row.id || this.ids
       getProduct(id).then(response => {
-        console.log('获取详情:', response)
-        const data = response.data || {}
-
-        // 解析多张图片
-        const imageList = this.parseImageJson(data.images || data.images)
-
-        const processedData = {
-          id: data.id,
-          name: data.name,
-          type: data.type,
-          category: data.category,
-          specification: data.specification,
-          unit: data.unit,
-          manufacturer: data.manufacturer,
-          approvalNumber: data.approvalNumber || data.approval_number,
-          ingredients: data.ingredients,
-          indications: data.indications,
-          usageDosage: data.usageDosage || data.usage_dosage,
-          price: data.price,
-          costPrice: data.costPrice || data.cost_price,
-          stock: data.stock,
-          minStock: data.minStock || data.min_stock,
-          mainImage: data.mainImage || data.main_image,
-          images: data.images,
-          imageList: imageList,
-          imageFileList: this.createImageFileList(imageList),
-          treatAnimals: data.treatAnimals || data.treat_animals,
-          treatDiseases: data.treatDiseases || data.treat_diseases,
-          treatmentContent: data.treatmentContent || data.treatment_content,
-          treatmentDuration: data.treatmentDuration || data.treatment_duration,
-          precautions: data.precautions,
-          status: String(data.status || '0'),
-          auditStatus: data.auditStatus || data.audit_status,
-          auditOpinion: data.auditOpinion || data.audit_opinion,
-          isDeleted: data.isDeleted || data.is_deleted,
-          clinicId: data.clinicId || data.clinic_id,
-          userId: data.userId || data.user_id,
-          createdAt: data.createdAt || data.created_at,
-          updatedAt: data.updatedAt || data.updated_at
-        }
-
-        this.form = processedData
+        this.form = response.data
         this.open = true
-        this.title = "修改产品"
-      }).catch(error => {
-        console.error('获取详情失败:', error)
-        this.$modal.msgError("获取产品信息失败")
+        this.title = "修改兽医产品信息"
       })
     },
-
-    /** 创建图片文件列表 */
-    createImageFileList(imageList) {
-      if (!imageList || !Array.isArray(imageList)) return []
-
-      return imageList.map((image, index) => ({
-        uid: -index - 1, // 使用负值避免冲突
-        name: `image_${index}.jpg`,
-        status: 'success',
-        url: this.getFullImageUrl(image),
-        response: {
-          code: 200,
-          fileName: image
-        }
-      }))
-    },
-
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
         if (valid) {
-          // 确保有用户ID
-          if (!this.form.userId) {
-            this.form.userId = this.getCurrentUserId()
-          }
-
-          // 确保status是字符串
-          if (this.form.status !== undefined && this.form.status !== null) {
-            this.form.status = String(this.form.status)
-          }
-
-          // 将imageList转换为JSON字符串
-          if (this.form.imageList && this.form.imageList.length > 0) {
-            this.form.images = JSON.stringify(this.form.imageList)
-          } else {
-            this.form.images = null
-          }
-
-          const loadingInstance = this.$loading({
-            lock: true,
-            text: '正在提交...',
-            background: 'rgba(0, 0, 0, 0.7)'
-          })
-
           if (this.form.id != null) {
             updateProduct(this.form).then(response => {
-              loadingInstance.close()
               this.$modal.msgSuccess("修改成功")
               this.open = false
               this.getList()
-            }).catch(error => {
-              loadingInstance.close()
-              console.error('修改失败:', error)
-              this.$modal.msgError("修改失败")
             })
           } else {
             addProduct(this.form).then(response => {
-              loadingInstance.close()
               this.$modal.msgSuccess("新增成功")
               this.open = false
-              // 新增成功后重置查询条件，回到第一页
-              this.queryParams.pageNum = 1
-              this.queryParams.name = null
               this.getList()
-            }).catch(error => {
-              loadingInstance.close()
-              console.error('新增失败:', error)
-              this.$modal.msgError("新增失败")
             })
           }
         }
       })
     },
-
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids
-      this.$modal.confirm('是否确认删除选中的产品？').then(() => {
+      this.$modal.confirm('是否确认删除兽医产品信息编号为"' + ids + '"的数据项？').then(function() {
         return delProduct(ids)
       }).then(() => {
         this.getList()
         this.$modal.msgSuccess("删除成功")
       }).catch(() => {})
     },
-
     /** 导出按钮操作 */
     handleExport() {
       this.download('vet/product/export', {
@@ -1557,54 +768,28 @@ export default {
       }, `product_${new Date().getTime()}.xlsx`)
     },
 
-    /** 获取产品类型文本 */
-    getTypeText(type) {
-      const map = {
-        "0": '处方药',
-        "1": '非处方药',
-        "2": '中成药',
-        "3": '保健品'
-      }
-      return map[type] || type
-    },
-
     /** 获取产品类型标签类型 */
     getTypeTagType(type) {
       const map = {
-        "0": 'danger',    // 处方药 - 红色
-        "1": 'warning',   // 非处方药 - 黄色
-        "2": 'success',   // 中成药 - 绿色
-        "3": 'primary'    // 保健品 - 蓝色
+        "处方药": 'danger',
+        "非处方药": 'warning',
+        "中成药": 'success',
+        "保健品": 'primary'
       }
       return map[type] || ''
     },
 
-    /** 获取产品分类文本 */
-    getCategoryText(category) {
-      const map = {
-        "0": '抗生素类',
-        "1": '抗寄生虫类',
-        "2": '疫苗类',
-        "3": '消毒剂类',
-        "4": '营养补充类',
-        "5": '外科用药',
-        "6": '诊断试剂',
-        "7": '中药制剂'
-      }
-      return map[category] || category
-    },
-
     /** 获取产品分类标签类型 */
     getCategoryTagType(category) {
       const map = {
-        "0": 'danger',    // 抗生素类 - 红色
-        "1": 'warning',   // 抗寄生虫类 - 黄色
-        "2": 'success',   // 疫苗类 - 绿色
-        "3": 'primary',   // 消毒剂类 - 蓝色
-        "4": 'info',      // 营养补充类 - 青色
-        "5": '',          // 外科用药 - 默认
-        "6": 'warning',   // 诊断试剂 - 黄色
-        "7": 'success'    // 中药制剂 - 绿色
+        "抗生素类": 'danger',
+        "抗寄生虫类": 'warning',
+        "疫苗类": 'success',
+        "消毒剂类": 'primary',
+        "营养补充类": 'info',
+        "外科用药": 'success',
+        "诊断试剂": 'warning',
+        "中药制剂": 'danger'
       }
       return map[category] || ''
     },
@@ -1612,9 +797,8 @@ export default {
     /** 获取状态文本 */
     getStatusText(status) {
       const map = {
-        "0": '草稿',
-        "1": '上架',
-        "2": '下架'
+        "0": '未上架',
+        "1": '已上架'
       }
       return map[status] || status
     },
@@ -1622,9 +806,8 @@ export default {
     /** 获取状态标签类型 */
     getStatusTagType(status) {
       const map = {
-        "0": 'info',
-        "1": 'success',
-        "2": 'danger'
+        "0": 'danger',
+        "1": 'success'
       }
       return map[status] || ''
     },
@@ -1650,165 +833,12 @@ export default {
       }
       return map[auditStatus] || ''
     },
-
-    /** 获取库存状态样式 */
-    getStockStatusClass(stock, minStock) {
-      if (!stock || stock === 0) return 'stock-out'
-      if (minStock && stock <= minStock) return 'stock-warning'
-      return 'stock-normal'
-    },
-
-    /** 格式化时间显示 */
-    formatTime(time) {
-      if (!time) return ''
-
-      try {
-        // 如果是字符串，尝试转换为日期
-        if (typeof time === 'string') {
-          // 处理常见的日期格式
-          if (time.includes('T')) {
-            time = time.replace('T', ' ')
-          }
-        }
-
-        const date = new Date(time)
-
-        // 检查日期是否有效
-        if (isNaN(date.getTime())) {
-          console.warn('无效的日期:', time)
-          return time
-        }
-
-        const year = date.getFullYear()
-        const month = (date.getMonth() + 1).toString().padStart(2, '0')
-        const day = date.getDate().toString().padStart(2, '0')
-        const hour = date.getHours().toString().padStart(2, '0')
-        const minute = date.getMinutes().toString().padStart(2, '0')
-        const second = date.getSeconds().toString().padStart(2, '0')
-
-        // 返回格式化的时间
-        return `${year}-${month}-${day} ${hour}:${minute}:${second}`
-
-      } catch (e) {
-        console.error('日期格式化失败:', e, time)
-        return time
-      }
-    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.app-container {
-  padding: 20px;
-}
-
-.search-form {
-  margin-bottom: 20px;
-}
-
-.operation-row {
-  margin-bottom: 20px;
-
-  .operation-left {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 10px;
-    align-items: center;
-  }
-
-  .operation-right {
-    text-align: right;
-  }
-}
-
-// 表格单元格样式
-.product-name-cell {
-  display: flex;
-  align-items: center;
-  min-height: 60px;
-  cursor: pointer;
-
-  .image-container {
-    position: relative;
-    margin-right: 12px;
-    flex-shrink: 0;
-
-    .product-thumb {
-      width: 50px;
-      height: 50px;
-      border-radius: 4px;
-      border: 1px solid #ebeef5;
-      cursor: pointer;
-      transition: transform 0.3s;
-
-      &:hover {
-        transform: scale(1.05);
-      }
-
-      .image-slot {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 100%;
-        height: 100%;
-        background: #f5f7fa;
-        color: #909399;
-        font-size: 20px;
-      }
-    }
-
-    .image-count-badge {
-      position: absolute;
-      top: -5px;
-      right: -5px;
-      background: #f56c6c;
-      color: white;
-      border-radius: 10px;
-      padding: 2px 6px;
-      font-size: 12px;
-      font-weight: bold;
-      min-width: 20px;
-      text-align: center;
-      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-    }
-  }
-
-  .no-image-placeholder {
-    width: 50px;
-    height: 50px;
-    margin-right: 12px;
-    border-radius: 4px;
-    border: 1px dashed #dcdfe6;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    color: #c0c4cc;
-    font-size: 20px;
-    flex-shrink: 0;
-    cursor: pointer;
-    transition: border-color 0.3s;
-
-    &:hover {
-      border-color: #409EFF;
-      color: #409EFF;
-    }
-  }
-
-  .product-info {
-    flex: 1;
-    min-width: 0;
-
-    .name-text {
-      font-weight: 500;
-      display: block;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-  }
-}
-
+//表格价格、库存样式
 .price-cell {
   .price-text {
     font-weight: bold;
@@ -1825,258 +855,12 @@ export default {
 .stock-cell {
   .stock-text {
     font-weight: bold;
-
-    &.stock-normal {
-      color: #67c23a;
-    }
-
-    &.stock-warning {
-      color: #e6a23c;
-    }
-
-    &.stock-out {
-      color: #f56c6c;
-    }
   }
 
   .min-stock {
     font-size: 12px;
-    color: #999;
+    color: #f88080;
     margin-top: 2px;
   }
 }
-
-// 图片画廊样式
-.image-gallery {
-  .main-image-container {
-    margin-bottom: 30px;
-
-    .main-image {
-      width: 100%;
-      max-height: 400px;
-      border-radius: 4px;
-      border: 1px solid #ebeef5;
-    }
-  }
-
-  .additional-images {
-    .image-list {
-      display: grid;
-      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
-      gap: 15px;
-      margin-top: 15px;
-
-      .image-item {
-        position: relative;
-        border: 1px solid #ebeef5;
-        border-radius: 4px;
-        overflow: hidden;
-        transition: transform 0.3s;
-
-        &:hover {
-          transform: translateY(-5px);
-          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-
-          .image-actions {
-            opacity: 1;
-          }
-        }
-
-        .additional-image {
-          width: 100%;
-          height: 150px;
-          cursor: pointer;
-
-          .image-slot {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            width: 100%;
-            height: 100%;
-            background: #f5f7fa;
-            color: #909399;
-            font-size: 24px;
-          }
-        }
-
-        .image-actions {
-          position: absolute;
-          top: 5px;
-          right: 5px;
-          opacity: 0;
-          transition: opacity 0.3s;
-
-          .el-button {
-            background: rgba(255, 255, 255, 0.9);
-            padding: 4px 8px;
-            border-radius: 2px;
-
-            &:hover {
-              background: white;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .no-images {
-    text-align: center;
-    padding: 40px 0;
-    border: 2px dashed #dcdfe6;
-    border-radius: 4px;
-    background: #f5f7fa;
-  }
-}
-
-// 图片上传样式
-.image-upload-container {
-  .main-upload, .multiple-upload {
-    margin-bottom: 20px;
-
-    .upload-label {
-      font-weight: 500;
-      margin-bottom: 8px;
-      color: #606266;
-    }
-
-    .upload-tip {
-      font-size: 12px;
-      color: #909399;
-      margin-bottom: 10px;
-    }
-  }
-
-  .main-upload {
-    .avatar-uploader {
-      display: inline-block;
-
-      ::v-deep .el-upload {
-        border: 1px dashed #d9d9d9;
-        border-radius: 6px;
-        cursor: pointer;
-        position: relative;
-        overflow: hidden;
-        transition: border-color 0.3s;
-
-        &:hover {
-          border-color: #409EFF;
-        }
-
-        .avatar-uploader-icon {
-          font-size: 28px;
-          color: #8c939d;
-          width: 120px;
-          height: 120px;
-          line-height: 120px;
-          text-align: center;
-        }
-
-        .avatar {
-          width: 120px;
-          height: 120px;
-          display: block;
-          object-fit: cover;
-        }
-      }
-    }
-
-    .image-actions {
-      margin-top: 10px;
-    }
-  }
-
-  .multiple-upload {
-    ::v-deep .multiple-uploader {
-      .el-upload--picture-card {
-        width: 100px;
-        height: 100px;
-        line-height: 100px;
-      }
-
-      .el-upload-list--picture-card {
-        .el-upload-list__item {
-          width: 100px;
-          height: 100px;
-        }
-      }
-    }
-
-    .image-preview-list {
-      .preview-tip {
-        font-size: 12px;
-        color: #67c23a;
-        margin-top: 10px;
-      }
-    }
-  }
-}
-
-// 详情对话框样式
-.product-detail-desc {
-  margin-top: 20px;
-
-  ::v-deep .el-descriptions-item__label {
-    width: 120px;
-    background-color: #fafafa;
-    font-weight: 500;
-  }
-
-  ::v-deep .el-descriptions-item__content {
-    padding: 0 12px;
-  }
-
-  .desc-content {
-    white-space: pre-wrap;
-    word-break: break-word;
-    line-height: 1.5;
-  }
-}
-
-.stock-out {
-  color: #f56c6c;
-  font-weight: bold;
-}
-
-.stock-warning {
-  color: #e6a23c;
-  font-weight: bold;
-}
-
-.stock-normal {
-  color: #67c23a;
-  font-weight: bold;
-}
-
-// 对话框样式
-::v-deep .el-dialog__body {
-  padding: 20px;
-  max-height: 70vh;
-  overflow-y: auto;
-}
-
-::v-deep .el-tabs__content {
-  padding: 20px;
-}
-
-// 表单样式
-.el-form-item {
-  margin-bottom: 18px;
-}
-
-.el-row {
-  margin-bottom: 10px;
-}
-
-// 操作按钮组样式
-.operation-buttons {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 5px;
-
-  .el-button {
-    margin: 0 !important;
-    padding: 4px 6px;
-  }
-}
 </style>
diff --git a/chenhai-ui/src/views/vet/qualification/index.vue b/chenhai-ui/src/views/vet/qualification/index.vue
index 773fd98..f541719 100644
--- a/chenhai-ui/src/views/vet/qualification/index.vue
+++ b/chenhai-ui/src/views/vet/qualification/index.vue
@@ -64,39 +64,39 @@
       </el-form-item>
     </el-form>
 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['vet:qualification:add']"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['vet:qualification:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['vet:qualification:remove']"
-        >删除</el-button>
-      </el-col>
+<!--    <el-row :gutter="10" class="mb8">-->
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="primary"-->
+<!--          plain-->
+<!--          icon="el-icon-plus"-->
+<!--          size="mini"-->
+<!--          @click="handleAdd"-->
+<!--          v-hasPermi="['vet:qualification:add']"-->
+<!--        >新增</el-button>-->
+<!--      </el-col>-->
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="success"-->
+<!--          plain-->
+<!--          icon="el-icon-edit"-->
+<!--          size="mini"-->
+<!--          :disabled="single"-->
+<!--          @click="handleUpdate"-->
+<!--          v-hasPermi="['vet:qualification:edit']"-->
+<!--        >修改</el-button>-->
+<!--      </el-col>-->
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="danger"-->
+<!--          plain-->
+<!--          icon="el-icon-delete"-->
+<!--          size="mini"-->
+<!--          :disabled="multiple"-->
+<!--          @click="handleDelete"-->
+<!--          v-hasPermi="['vet:qualification:remove']"-->
+<!--        >删除</el-button>-->
+<!--      </el-col>-->
       <!--      <el-col :span="1.5">-->
       <!--        <el-button-->
       <!--          type="warning"-->
@@ -107,9 +107,10 @@
       <!--          v-hasPermi="['vet:qualification:export']"-->
       <!--        >导出</el-button>-->
       <!--      </el-col>-->
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+<!--      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>-->
+<!--    </el-row>-->
 
+    <!-- 表格 -->
     <el-table v-loading="loading" :data="qualificationList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <!--      <el-table-column label="资质ID" align="center" prop="qualificationId" v-if="false" />-->
@@ -121,7 +122,7 @@
           <span v-else style="color: #909399">-</span>
         </template>
       </el-table-column>
-      <el-table-column label="身份证号" align="center" prop="idCard" width="150">
+      <el-table-column label="身份证号" align="center" prop="idCard" width="180">
         <template slot-scope="scope">
           <span v-if="scope.row.idCard">{{ scope.row.idCard }}</span>
           <span v-else style="color: #909399">-</span>
@@ -192,7 +193,7 @@
         </template>
       </el-table-column>
       <el-table-column label="备注" align="center" prop="remark" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="300">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
         <template slot-scope="scope">
           <!-- 查看按钮 -->
           <el-button
@@ -201,6 +202,7 @@
             icon="el-icon-view"
             @click="handleView(scope.row)"
             v-hasPermi="['vet:qualification:query']"
+            class="info-btn view-btn"
           >查看证书详情</el-button>
 
           <!-- 修改按钮 -->
@@ -269,7 +271,7 @@
       @pagination="getList"
     />
 
-    <!--  显示资质证书信息  -->
+    <!--  显示资质证书信息弹窗  -->
     <el-dialog :title="title" :visible.sync="openDetail" width="800px" append-to-body>
       <div v-if="detailData" style="padding: 20px;">
         <div style="margin-top: 30px;">
@@ -344,17 +346,18 @@
                 </el-tag>
               </template>
             </el-table-column>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="300">
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="100">
               <template slot-scope="scope">
               <!--  修改按钮  -->
                 <el-button
-                  v-if="!scope.row.auditStatus || scope.row.auditStatus === '0' || scope.row.auditStatus === '2'"
+                  v-if="!detailData.auditStatus || detailData.auditStatus === '0' || detailData.auditStatus === '2'"
                   size="mini"
                   type="text"
                   icon="el-icon-edit"
                   style="color: #42B983"
                   @click="handleUpdate(scope.row)"
                   v-hasPermi="['vet:qualification:edit']"
+                  class = "info-btn alter-btn"
                 >修改</el-button>
               </template>
             </el-table-column>
@@ -366,6 +369,7 @@
       </div>
     </el-dialog>
 
+    <!-- 图片预览弹窗 -->
     <el-dialog :visible.sync="previewDialogVisible" width="60%" append-to-body>
       <div style="text-align: center; padding: 20px;">
         <img
@@ -377,8 +381,7 @@
       </div>
     </el-dialog>
 
-
-    <!-- 添加或修改兽医资质对话框 -->
+    <!-- 添加或修改兽医资质弹窗 -->
     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <!--        <el-form-item label="真实姓名" prop="realName">-->
@@ -456,6 +459,7 @@
 
 <script>
 import { listQualification, getQualificationCertificate, delQualification, getQualificationCertificates, updateAndSubmitQualification} from "@/api/vet/qualification"
+import {listQualificationCertificates} from "../../../api/vet/qualification";
 
 export default {
   name: "Qualification",
@@ -542,7 +546,7 @@ export default {
     this.getList()
   },
   methods: {
-    /** 查询兽医资质列表 */
+    // 查询兽医资质列表
     getList() {
       this.loading = true
       listQualification(this.queryParams).then(response => {
@@ -552,7 +556,7 @@ export default {
       })
     },
 
-    /** 获取证书状态标签 */
+    // 获取证书状态标签
     getCertStatusLabel(status) {
       const map = {
         '0': '正常',
@@ -562,7 +566,7 @@ export default {
       return map[status] || status || '-'
     },
 
-    /** 获取证书状态标签类型 */
+    // 获取证书状态标签类型
     getCertStatusType(status) {
       const map = {
         '0': 'success',
@@ -572,7 +576,7 @@ export default {
       return map[status] || 'info'
     },
 
-    /** 获取审核状态标签类型 */
+    // 获取审核状态标签类型
     getAuditStatusType(status) {
       const map = {
         '0': 'info',     // 待审核 - 蓝色
@@ -583,7 +587,7 @@ export default {
       return map[status] || 'info'
     },
 
-    /** 格式化资质类型显示 */
+    // 格式化资质类型显示
     formatQualificationType(status) {
       const map = {
         '1': '执业兽医师',
@@ -594,11 +598,12 @@ export default {
       return map[status] || 'info'
     },
 
-    /** 获取完整的图片URL */
+    // 获取完整的图片URL
     getImageUrl(filePath) {
       return `${this.baseUrl}${filePath}`
     },
 
+    // 判断是否为图片文件
     isImageFile(filePath) {
       if (!filePath) return false;
       const imageExts = ['.png','.jpg','.jpeg'];
@@ -606,20 +611,20 @@ export default {
       return imageExts.includes(ext);
     },
 
-    /** 判断是否为PDF文件 */
+    // 判断是否为PDF文件
     isPdfFile(filePath) {
       if (!filePath) return false;
       const ext = filePath.substring(filePath.lastIndexOf('.')).toLowerCase();
       return ext === '.pdf';
     },
 
-    /** 预览图片 */
+    // 预览图片
     previewCertificate(filePath) {
       this.previewFileUrl = filePath;
       this.previewDialogVisible = true;
     },
 
-    /** 下载文件 */
+    // 下载文件
     downloadFile(filePath) {
       const fullUrl = this.getImageUrl(filePath);
       const link = document.createElement('a');
@@ -726,7 +731,7 @@ export default {
     //   })
     // },
 
-    /** 重新提交审核 */
+    // 重新提交审核
     resubmitForm() {
       this.$refs["form"].validate(valid => {
         if (valid) {
@@ -854,14 +859,14 @@ export default {
     //   })
     // },
 
-    /** 资质证书详情 */
+    // 资质证书详情
     handleView(row) {
       this.openDetail = true
       this.detailData = row
       this.title = "资质证书详情"
       this.certificateList = []
       this.detailLoading = true
-      getQualificationCertificates(row.qualificationId).then(response => {
+      listQualificationCertificates(row.qualificationId).then(response => {
         this.detailLoading = false
         if (response.code === 200) {
           this.certificateList = response.rows || [];
@@ -912,13 +917,13 @@ export default {
       this.resetForm("form")
     },
 
-    /** 搜索按钮操作 */
+    // 搜索按钮操作
     handleQuery() {
       this.queryParams.pageNum = 1
       this.getList()
     },
 
-    /** 重置按钮操作 */
+    // 重置按钮操作
     resetQuery() {
       this.resetForm("queryForm")
       this.handleQuery()
@@ -931,7 +936,7 @@ export default {
       this.multiple = !selection.length
     },
 
-    /** 新增按钮操作 */
+    // 新增按钮操作
     handleAdd() {
       this.reset()
       this.open = true
@@ -939,7 +944,7 @@ export default {
       this.form.auditStatus = null
     },
 
-    /** 修改按钮操作 */
+    // 修改按钮操作
     handleUpdate(row) {
       this.reset()
       let certId = row.certId || row.certificateId || row.id
@@ -989,7 +994,7 @@ export default {
     //   })
     // },
 
-    /** 删除按钮操作 */
+    // 删除按钮操作
     handleDelete(row) {
       const qualificationIds = row.qualificationId || this.ids
       this.$modal.confirm('是否确认删除兽医资质编号为"' + qualificationIds + '"的数据项？').then(function() {
@@ -1000,14 +1005,14 @@ export default {
       }).catch(() => {})
     },
 
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('vet/qualification/export', {
-        ...this.queryParams
-      }, `qualification_${new Date().getTime()}.xlsx`)
-    },
+    // 导出按钮操作
+    // handleExport() {
+    //   this.download('vet/qualification/export', {
+    //     ...this.queryParams
+    //   }, `qualification_${new Date().getTime()}.xlsx`)
+    // },
 
-    /** 根据字典值获取标签 */
+    // 根据字典值获取标签
     getDictLabel(dictType, value) {
       const dict = this.dict.type[dictType]
       if (dict && value) {
@@ -1021,7 +1026,7 @@ export default {
 </script>
 
 <style scoped>
-/* 操作按钮样式优化 */
+/* 操作按钮样式 */
 .el-button--text {
   padding: 6px 10px;
   margin: 0 2px;
@@ -1046,4 +1051,22 @@ export default {
 ::v-deep .qualification-detail-dialog table tr:last-child td {
   border-bottom: none;
 }
+
+/* 操作按钮 */
+.info-btn {
+  padding: 6px 10px;
+  border-radius: 4px;
+  margin: 0 10px;
+  transition: all 0.3s ease;
+}
+
+.view-btn:hover {
+  background-color: rgb(216, 238, 248);
+  transform: translateY(-1px);
+}
+
+.alter-btn:hover{
+  background-color: rgb(230, 255, 238);
+  transform: translateY(-1px);
+}
 </style>
diff --git a/chenhai-ui/src/views/vet/training/index.vue b/chenhai-ui/src/views/vet/training/index.vue
index 431494f..9f95e28 100644
--- a/chenhai-ui/src/views/vet/training/index.vue
+++ b/chenhai-ui/src/views/vet/training/index.vue
@@ -93,8 +93,8 @@
           <span>{{ scope.row.publisherName || '-' }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="视频标题" align="center" prop="title" />
-      <el-table-column label="视频描述" align="center" prop="description" />
+      <el-table-column label="视频标题" align="center" prop="title" show-overflow-tooltip/>
+      <el-table-column label="视频描述" align="center" prop="description" show-overflow-tooltip/>
       <el-table-column label="视频地址" align="center" prop="videoUrl" width="180" />
       <el-table-column label="封面图片" align="center" prop="coverImage" width="100">
         <template slot-scope="scope">
@@ -135,15 +135,17 @@
       </el-table-column>
 
       <!-- 操作列 -->
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="300">
         <template slot-scope="scope">
           <!-- 修改按钮 -->
           <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
+            style="color: #42B983"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['vet:training:edit']"
+            class="info-btn alter-btn"
           >修改</el-button>
 
           <!-- 提交审核按钮：审核拒绝或无需审核状态 -->
@@ -185,6 +187,7 @@
             @click="handleOffline(scope.row.id)"
             v-hasPermi="['vet:training:offline']"
             v-if="scope.row.status === '1'"
+            class="info-btn offline-btn"
           >下架</el-button>
 
           <!-- 取消审核按钮 -->
@@ -203,8 +206,10 @@
             size="mini"
             type="text"
             icon="el-icon-delete"
+            style="color: #f28888"
             @click="handleDelete(scope.row)"
             v-hasPermi="['vet:training:remove']"
+            class="info-btn delete-btn"
           >删除</el-button>
         </template>
       </el-table-column>
@@ -1104,7 +1109,6 @@ export default {
 </script>
 
 <style scoped>
-/* 添加一些必要的样式 */
 .video-url-cell {
   display: flex;
   align-items: center;
@@ -1117,4 +1121,26 @@ export default {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+.info-btn {
+  padding: 6px 10px;
+  border-radius: 4px;
+  margin: 0 10px;
+  transition: all 0.3s ease;
+}
+
+.offline-btn:hover{
+  background-color: rgba(243, 239, 231, 100);
+  transform: translateY(-1px);
+}
+
+.alter-btn:hover{
+  background-color: rgb(230, 255, 238);
+  transform: translateY(-1px);
+}
+
+.delete-btn:hover {
+  background-color: rgba(245, 108, 108, 0.1);
+  transform: translateY(-1px);
+}
 </style>