diff --git a/antis-ncc-admin/src/api/extend/salaryCalculation.js b/antis-ncc-admin/src/api/extend/salaryCalculation.js
new file mode 100644
index 0000000..0dd37a4
--- /dev/null
+++ b/antis-ncc-admin/src/api/extend/salaryCalculation.js
@@ -0,0 +1,28 @@
+import request from '@/utils/request'
+
+// 保存金三角开卡业绩统计数据
+export function saveGoldTriangleStatistics(statisticsMonth) {
+  return request({
+    url: '/api/Extend/LqStatistics/save-gold-triangle-statistics',
+    method: 'POST',
+    data: { statisticsMonth }
+  })
+}
+
+// 保存健康师个人开单业绩统计数据
+export function savePersonalPerformanceStatistics(statisticsMonth) {
+  return request({
+    url: '/api/Extend/LqStatistics/save-personal-performance-statistics',
+    method: 'POST',
+    data: { statisticsMonth }
+  })
+}
+
+// 保存科技部开单业绩统计数据
+export function saveTechPerformanceStatistics(statisticsMonth) {
+  return request({
+    url: '/api/Extend/LqStatistics/save-tech-performance-statistics',
+    method: 'POST',
+    data: { statisticsMonth }
+  })
+}
diff --git a/antis-ncc-admin/src/views/salaryCalculation/index.vue b/antis-ncc-admin/src/views/salaryCalculation/index.vue
new file mode 100644
index 0000000..61d6ca8
--- /dev/null
+++ b/antis-ncc-admin/src/views/salaryCalculation/index.vue
@@ -0,0 +1,605 @@
+<template>
+  <div class="NCC-common-layout">
+    <div class="NCC-common-layout-center">
+      <!-- 页面标题 -->
+      <div class="page-header">
+        <h2 class="page-title">
+          <i class="el-icon-calculator"></i>
+          工资计算系统
+        </h2>
+        <p class="page-description">统计各类业绩数据，为工资计算提供基础数据支撑</p>
+      </div>
+
+      <!-- 统计月份选择 -->
+      <div class="NCC-common-search-box">
+        <el-form :inline="true" class="statistics-form">
+          <el-form-item label="统计月份">
+            <el-date-picker
+              v-model="statisticsMonth"
+              type="month"
+              placeholder="选择月份"
+              format="yyyyMM"
+              value-format="yyyyMM"
+              :clearable="false"
+              class="month-picker"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button 
+              type="primary" 
+              icon="el-icon-refresh" 
+              @click="refreshMonth"
+              :loading="loading"
+            >
+              刷新月份
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+
+      <!-- 统计按钮区域 -->
+      <div class="statistics-buttons">
+        <div class="button-grid">
+          <!-- 金三角开卡业绩统计 -->
+          <div class="statistics-card gold-triangle">
+            <div class="card-header">
+              <i class="el-icon-trophy"></i>
+              <h3>金三角开卡业绩统计</h3>
+            </div>
+            <div class="card-content">
+              <p class="card-description">统计金三角团队的开卡业绩数据</p>
+              <el-button 
+                type="primary" 
+                size="large" 
+                :loading="loadingStates.goldTriangle"
+                @click="handleGoldTriangleStatistics"
+                class="statistics-btn"
+              >
+                <i class="el-icon-data-analysis"></i>
+                开始统计
+              </el-button>
+            </div>
+          </div>
+
+          <!-- 健康师个人开单业绩统计 -->
+          <div class="statistics-card personal-performance">
+            <div class="card-header">
+              <i class="el-icon-user"></i>
+              <h3>健康师个人开单业绩统计</h3>
+            </div>
+            <div class="card-content">
+              <p class="card-description">统计健康师个人开单业绩，包含基础业绩和合作业绩</p>
+              <el-button 
+                type="success" 
+                size="large" 
+                :loading="loadingStates.personalPerformance"
+                @click="handlePersonalPerformanceStatistics"
+                class="statistics-btn"
+              >
+                <i class="el-icon-data-analysis"></i>
+                开始统计
+              </el-button>
+            </div>
+          </div>
+
+          <!-- 科技部开单业绩统计 -->
+          <div class="statistics-card tech-performance">
+            <div class="card-header">
+              <i class="el-icon-cpu"></i>
+              <h3>科技部开单业绩统计</h3>
+            </div>
+            <div class="card-content">
+              <p class="card-description">统计科技部老师的开单业绩数据</p>
+              <el-button 
+                type="warning" 
+                size="large" 
+                :loading="loadingStates.techPerformance"
+                @click="handleTechPerformanceStatistics"
+                class="statistics-btn"
+              >
+                <i class="el-icon-data-analysis"></i>
+                开始统计
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 结果显示区域 -->
+      <div class="result-section">
+        <div class="result-header">
+          <h3>
+            <i class="el-icon-document"></i>
+            统计结果
+          </h3>
+          <el-button 
+            type="text" 
+            icon="el-icon-delete" 
+            @click="clearResults"
+            v-if="resultData.length > 0"
+          >
+            清空结果
+          </el-button>
+        </div>
+        
+        <div class="result-content" v-if="resultData.length > 0">
+          <div 
+            v-for="(result, index) in resultData" 
+            :key="index" 
+            class="result-item"
+            :class="result.type"
+          >
+            <div class="result-header-item">
+              <div class="result-title">
+                <i :class="getResultIcon(result.type)"></i>
+                {{ result.title }}
+              </div>
+              <div class="result-time">{{ result.time }}</div>
+            </div>
+            <div class="result-body">
+              <div class="result-status" :class="result.success ? 'success' : 'error'">
+                <i :class="result.success ? 'el-icon-success' : 'el-icon-error'"></i>
+                {{ result.success ? '统计成功' : '统计失败' }}
+              </div>
+              <div class="result-details">
+                <pre class="result-json">{{ formatResult(result.data) }}</pre>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div v-else class="empty-result">
+          <i class="el-icon-document-copy"></i>
+          <p>暂无统计结果，请点击上方按钮开始统计</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { 
+  saveGoldTriangleStatistics, 
+  savePersonalPerformanceStatistics, 
+  saveTechPerformanceStatistics 
+} from '@/api/extend/salaryCalculation'
+
+export default {
+  name: 'SalaryCalculation',
+  data() {
+    return {
+      // 统计月份，默认为当前月份
+      statisticsMonth: this.getCurrentMonth(),
+      // 加载状态
+      loading: false,
+      loadingStates: {
+        goldTriangle: false,
+        personalPerformance: false,
+        techPerformance: false
+      },
+      // 结果数据
+      resultData: []
+    }
+  },
+  methods: {
+    // 获取当前月份
+    getCurrentMonth() {
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      return `${year}${month}`
+    },
+
+    // 刷新月份
+    refreshMonth() {
+      this.statisticsMonth = this.getCurrentMonth()
+      this.$message.success('月份已刷新为当前月份')
+    },
+
+    // 金三角开卡业绩统计
+    async handleGoldTriangleStatistics() {
+      this.loadingStates.goldTriangle = true
+      try {
+        const response = await saveGoldTriangleStatistics(this.statisticsMonth)
+        this.addResult({
+          type: 'gold-triangle',
+          title: '金三角开卡业绩统计',
+          success: true,
+          data: response.data,
+          time: new Date().toLocaleString()
+        })
+        this.$message.success('金三角开卡业绩统计完成')
+      } catch (error) {
+        this.addResult({
+          type: 'gold-triangle',
+          title: '金三角开卡业绩统计',
+          success: false,
+          data: error.message || '统计失败',
+          time: new Date().toLocaleString()
+        })
+        this.$message.error('金三角开卡业绩统计失败')
+      } finally {
+        this.loadingStates.goldTriangle = false
+      }
+    },
+
+    // 健康师个人开单业绩统计
+    async handlePersonalPerformanceStatistics() {
+      this.loadingStates.personalPerformance = true
+      try {
+        const response = await savePersonalPerformanceStatistics(this.statisticsMonth)
+        this.addResult({
+          type: 'personal-performance',
+          title: '健康师个人开单业绩统计',
+          success: true,
+          data: response.data,
+          time: new Date().toLocaleString()
+        })
+        this.$message.success('健康师个人开单业绩统计完成')
+      } catch (error) {
+        this.addResult({
+          type: 'personal-performance',
+          title: '健康师个人开单业绩统计',
+          success: false,
+          data: error.message || '统计失败',
+          time: new Date().toLocaleString()
+        })
+        this.$message.error('健康师个人开单业绩统计失败')
+      } finally {
+        this.loadingStates.personalPerformance = false
+      }
+    },
+
+    // 科技部开单业绩统计
+    async handleTechPerformanceStatistics() {
+      this.loadingStates.techPerformance = true
+      try {
+        const response = await saveTechPerformanceStatistics(this.statisticsMonth)
+        this.addResult({
+          type: 'tech-performance',
+          title: '科技部开单业绩统计',
+          success: true,
+          data: response.data,
+          time: new Date().toLocaleString()
+        })
+        this.$message.success('科技部开单业绩统计完成')
+      } catch (error) {
+        this.addResult({
+          type: 'tech-performance',
+          title: '科技部开单业绩统计',
+          success: false,
+          data: error.message || '统计失败',
+          time: new Date().toLocaleString()
+        })
+        this.$message.error('科技部开单业绩统计失败')
+      } finally {
+        this.loadingStates.techPerformance = false
+      }
+    },
+
+    // 添加结果
+    addResult(result) {
+      this.resultData.unshift(result)
+      // 限制结果数量，最多保留10条
+      if (this.resultData.length > 10) {
+        this.resultData = this.resultData.slice(0, 10)
+      }
+    },
+
+    // 清空结果
+    clearResults() {
+      this.resultData = []
+      this.$message.success('结果已清空')
+    },
+
+    // 获取结果图标
+    getResultIcon(type) {
+      const iconMap = {
+        'gold-triangle': 'el-icon-trophy',
+        'personal-performance': 'el-icon-user',
+        'tech-performance': 'el-icon-cpu'
+      }
+      return iconMap[type] || 'el-icon-document'
+    },
+
+    // 格式化结果显示
+    formatResult(data) {
+      if (typeof data === 'string') {
+        return data
+      }
+      return JSON.stringify(data, null, 2)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.page-header {
+  text-align: center;
+  margin-bottom: 30px;
+  padding: 20px 0;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 12px;
+  color: white;
+  
+  .page-title {
+    margin: 0 0 10px 0;
+    font-size: 28px;
+    font-weight: 600;
+    
+    i {
+      margin-right: 10px;
+      font-size: 32px;
+    }
+  }
+  
+  .page-description {
+    margin: 0;
+    font-size: 16px;
+    opacity: 0.9;
+  }
+}
+
+.statistics-form {
+  background: white;
+  padding: 20px;
+  border-radius: 12px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  margin-bottom: 20px;
+  
+  .month-picker {
+    width: 200px;
+  }
+}
+
+.statistics-buttons {
+  margin-bottom: 30px;
+  
+  .button-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+    gap: 20px;
+  }
+}
+
+.statistics-card {
+  background: white;
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+  overflow: hidden;
+  
+  &:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
+  }
+  
+  .card-header {
+    padding: 20px 20px 15px;
+    border-bottom: 1px solid #f0f0f0;
+    
+    i {
+      font-size: 24px;
+      margin-right: 10px;
+    }
+    
+    h3 {
+      margin: 0;
+      font-size: 18px;
+      font-weight: 600;
+      display: inline-block;
+    }
+  }
+  
+  .card-content {
+    padding: 20px;
+    
+    .card-description {
+      color: #666;
+      margin: 0 0 20px 0;
+      line-height: 1.6;
+    }
+    
+    .statistics-btn {
+      width: 100%;
+      height: 50px;
+      font-size: 16px;
+      font-weight: 600;
+      border-radius: 8px;
+      
+      i {
+        margin-right: 8px;
+        font-size: 18px;
+      }
+    }
+  }
+  
+  // 不同卡片的主题色
+  &.gold-triangle {
+    .card-header i {
+      color: #409EFF;
+    }
+  }
+  
+  &.personal-performance {
+    .card-header i {
+      color: #67C23A;
+    }
+  }
+  
+  &.tech-performance {
+    .card-header i {
+      color: #E6A23C;
+    }
+  }
+}
+
+.result-section {
+  background: white;
+  border-radius: 12px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  
+  .result-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 20px;
+    background: #f8f9fa;
+    border-bottom: 1px solid #e9ecef;
+    
+    h3 {
+      margin: 0;
+      font-size: 18px;
+      font-weight: 600;
+      color: #333;
+      
+      i {
+        margin-right: 8px;
+        color: #409EFF;
+      }
+    }
+  }
+  
+  .result-content {
+    max-height: 600px;
+    overflow-y: auto;
+  }
+  
+  .result-item {
+    border-bottom: 1px solid #f0f0f0;
+    
+    &:last-child {
+      border-bottom: none;
+    }
+    
+    .result-header-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 15px 20px;
+      background: #fafafa;
+      
+      .result-title {
+        font-weight: 600;
+        color: #333;
+        
+        i {
+          margin-right: 8px;
+        }
+      }
+      
+      .result-time {
+        color: #999;
+        font-size: 14px;
+      }
+    }
+    
+    .result-body {
+      padding: 20px;
+      
+      .result-status {
+        display: flex;
+        align-items: center;
+        margin-bottom: 15px;
+        font-weight: 600;
+        
+        i {
+          margin-right: 8px;
+          font-size: 16px;
+        }
+        
+        &.success {
+          color: #67C23A;
+        }
+        
+        &.error {
+          color: #F56C6C;
+        }
+      }
+      
+      .result-details {
+        .result-json {
+          background: #f8f9fa;
+          border: 1px solid #e9ecef;
+          border-radius: 6px;
+          padding: 15px;
+          margin: 0;
+          font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+          font-size: 13px;
+          line-height: 1.5;
+          color: #333;
+          white-space: pre-wrap;
+          word-break: break-all;
+          max-height: 300px;
+          overflow-y: auto;
+        }
+      }
+    }
+    
+    // 不同类型的结果项样式
+    &.gold-triangle {
+      .result-header-item {
+        border-left: 4px solid #409EFF;
+      }
+    }
+    
+    &.personal-performance {
+      .result-header-item {
+        border-left: 4px solid #67C23A;
+      }
+    }
+    
+    &.tech-performance {
+      .result-header-item {
+        border-left: 4px solid #E6A23C;
+      }
+    }
+  }
+  
+  .empty-result {
+    text-align: center;
+    padding: 60px 20px;
+    color: #999;
+    
+    i {
+      font-size: 48px;
+      margin-bottom: 20px;
+      color: #ddd;
+    }
+    
+    p {
+      margin: 0;
+      font-size: 16px;
+    }
+  }
+}
+
+// 响应式设计
+@media (max-width: 768px) {
+  .button-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .page-header {
+    .page-title {
+      font-size: 24px;
+    }
+    
+    .page-description {
+      font-size: 14px;
+    }
+  }
+  
+  .statistics-card {
+    .card-header h3 {
+      font-size: 16px;
+    }
+    
+    .card-content .statistics-btn {
+      height: 45px;
+      font-size: 14px;
+    }
+  }
+}
+</style>