From 22b5328314bb6d57e36d76aa186a68d1595ac816 Mon Sep 17 00:00:00 2001
From: lynn <lynnlinyong@qq.com>
Date: Tue, 24 Jun 2025 16:34:01 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E4=BE=9B=E9=9C=80=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86API=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/student/index.js                      |  24 ++
 .../student/components/SupplyDemandDetail.vue |  46 +++
 .../student/components/SupplyDemandEdit.vue   | 150 ++++++++++
 src/views/student/supply_demand.vue           | 283 +++++++++---------
 4 files changed, 368 insertions(+), 135 deletions(-)
 create mode 100644 src/views/student/components/SupplyDemandDetail.vue
 create mode 100644 src/views/student/components/SupplyDemandEdit.vue

diff --git a/src/api/student/index.js b/src/api/student/index.js
index 186e3ed..c9a5bee 100644
--- a/src/api/student/index.js
+++ b/src/api/student/index.js
@@ -82,4 +82,28 @@ export function updateSchoolmate(data) {
   })
 }
 
+export function supplyDemandList(params) {
+  return request({
+    method: 'get',
+    url: '/api/admin/supply-demand/index',
+    params
+  })
+}
 
+// 供需管理 - 保存（新增/更新）
+export function supplyDemandSave(data) {
+  return request({
+    method: 'post',
+    url: '/api/admin/supply-demand/save',
+    data
+  })
+}
+
+// 供需管理 - 删除
+export function supplyDemandDestroy(params) {
+  return request({
+    method: 'get',
+    url: '/api/admin/supply-demand/destroy',
+    params
+  })
+}
diff --git a/src/views/student/components/SupplyDemandDetail.vue b/src/views/student/components/SupplyDemandDetail.vue
new file mode 100644
index 0000000..dbe1f23
--- /dev/null
+++ b/src/views/student/components/SupplyDemandDetail.vue
@@ -0,0 +1,46 @@
+<template>
+  <el-dialog :visible.sync="visible" width="70%" :title="'供需详情'">
+    <div class="supply-detail">
+      <div class="section">
+        <div class="label">供需类型</div>
+        <div>{{ detail.type === 1 ? '供应' : '需求' }}</div>
+      </div>
+      <div class="section">
+        <div class="label">标题</div>
+        <div>{{ detail.title }}</div>
+      </div>
+      <div class="section">
+        <div class="label">详细描述</div>
+        <div>{{ detail.content }}</div>
+      </div>
+      <div class="section">
+        <div class="label">行业标签</div>
+        <div>{{ detail.tag || '-' }}</div>
+      </div>
+      <div class="section">
+        <div class="label">联系方式</div>
+        <div>
+          <div v-if="detail.mobile">电话：{{ detail.mobile }}</div>
+          <div v-if="detail.wechat">微信：{{ detail.wechat }}</div>
+          <div v-if="detail.email">邮箱：{{ detail.email }}</div>
+        </div>
+      </div>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="$emit('update:visible', false)">关闭</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    visible: Boolean,
+    detail: Object
+  }
+}
+</script>
+<style scoped>
+.supply-detail .section { margin-bottom: 16px; }
+.supply-detail .label { font-weight: bold; margin-bottom: 4px; }
+</style> 
\ No newline at end of file
diff --git a/src/views/student/components/SupplyDemandEdit.vue b/src/views/student/components/SupplyDemandEdit.vue
new file mode 100644
index 0000000..bd14935
--- /dev/null
+++ b/src/views/student/components/SupplyDemandEdit.vue
@@ -0,0 +1,150 @@
+<template>
+  <el-dialog :visible.sync="visible" width="70%" title="编辑供需">
+    <el-form :model="form" label-width="80px">
+      <el-form-item label="供需类型">
+        <el-radio-group v-model="form.type">
+          <el-radio :label="1">供应</el-radio>
+          <el-radio :label="2">需求</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="标题">
+        <el-input v-model="form.title" maxlength="50" show-word-limit></el-input>
+      </el-form-item>
+      <el-form-item label="详细描述">
+        <el-input type="textarea" v-model="form.content" :rows="4" maxlength="200" show-word-limit></el-input>
+      </el-form-item>
+      <el-form-item label="行业标签">
+        <el-input
+          v-model="tagInput"
+          placeholder="输入后回车键确认"
+          @keyup.enter.native="addTag"
+          @blur="addTag"
+          style="margin-bottom: 8px;"
+        />
+        <div>
+          <el-tag
+            v-for="(tag, idx) in tagList"
+            :key="tag + idx"
+            closable
+            @close="removeTag(idx)"
+            style="margin-right: 8px;"
+          >{{ tag }}</el-tag>
+        </div>
+        <div style="color: #999; font-size: 12px; margin-top: 4px;">
+          建议添加相关行业标签，方便其他校友找到你
+        </div>
+      </el-form-item>
+      <el-form-item label="联系方式" required>
+        <div class="contact-type-group">
+          <el-button
+            :type="form.contactType === 'wechat' ? 'primary' : 'default'"
+            @click="form.contactType = 'wechat'"
+            icon="el-icon-chat-dot-round"
+          >微信</el-button>
+          <el-button
+            :type="form.contactType === 'mobile' ? 'primary' : 'default'"
+            @click="form.contactType = 'mobile'"
+            icon="el-icon-phone"
+          >电话</el-button>
+          <el-button
+            :type="form.contactType === 'email' ? 'primary' : 'default'"
+            @click="form.contactType = 'email'"
+            icon="el-icon-message"
+          >邮箱</el-button>
+        </div>
+        <div style="margin-top: 12px;">
+          <el-input
+            v-if="form.contactType === 'wechat'"
+            v-model="form.wechat"
+            placeholder="请输入微信号"
+          />
+          <el-input
+            v-if="form.contactType === 'mobile'"
+            v-model="form.mobile"
+            placeholder="请输入手机号"
+          />
+          <el-input
+            v-if="form.contactType === 'email'"
+            v-model="form.email"
+            placeholder="请输入邮箱"
+          />
+        </div>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="$emit('update:visible', false)">取消</el-button>
+      <el-button type="primary" @click="handleSave">保存</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    visible: Boolean,
+    detail: Object
+  },
+  data() {
+    return {
+      form: {
+        contactType: 'mobile',
+        mobile: '',
+        wechat: '',
+        email: ''
+      },
+      tagInput: '',
+      tagList: []
+    }
+  },
+  watch: {
+    detail: {
+      immediate: true,
+      handler(val) {
+        this.form = {
+          ...val,
+          contactType: val.wechat ? 'wechat' : val.email ? 'email' : 'mobile'
+        }
+        this.tagList = Array.isArray(val.tag)
+          ? val.tag
+          : (val.tag ? val.tag.split(',').filter(Boolean) : [])
+      }
+    }
+  },
+  methods: {
+    addTag() {
+      const val = this.tagInput && this.tagInput.trim()
+      if (val && !this.tagList.includes(val)) {
+        this.tagList.push(val)
+      }
+      this.tagInput = ''
+    },
+    removeTag(idx) {
+      this.tagList.splice(idx, 1)
+    },
+    handleSave() {
+      const data = {
+        id: this.form.id,
+        title: this.form.title,
+        content: this.form.content,
+        tag: this.tagList.join(','),
+        wechat: this.form.wechat,
+        mobile: this.form.mobile,
+        email: this.form.email,
+        type: this.form.type
+      }
+      if (this.form.contactType !== 'wechat') data.wechat = ''
+      if (this.form.contactType !== 'mobile') data.mobile = ''
+      if (this.form.contactType !== 'email') data.email = ''
+      this.$emit('save', data)
+      this.$emit('update:visible', false)
+    }
+  }
+}
+</script>
+<style scoped>
+.contact-type-group {
+  display: flex;
+  gap: 12px;
+  margin-bottom: 8px;
+}
+</style> 
\ No newline at end of file
diff --git a/src/views/student/supply_demand.vue b/src/views/student/supply_demand.vue
index b3b7496..60cfb4f 100644
--- a/src/views/student/supply_demand.vue
+++ b/src/views/student/supply_demand.vue
@@ -16,19 +16,19 @@
     <div class="search-section">
       <el-form :model="filters" inline>
         <el-form-item>
-          <el-input v-model="filters.keyword" placeholder="搜索标题、内容或用户名"></el-input>
+          <el-input v-model="filters.keyword" placeholder="搜索标题" clearable></el-input>
         </el-form-item>
         <el-form-item>
           <el-select v-model="filters.status" placeholder="全部状态" clearable>
-            <el-option label="待审核" value="pending"></el-option>
-            <el-option label="已通过" value="approved"></el-option>
-            <el-option label="已拒绝" value="rejected"></el-option>
+            <el-option label="待审核" value="0"></el-option>
+            <el-option label="已通过" value="1"></el-option>
+            <el-option label="已拒绝" value="2"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
           <el-select v-model="filters.type" placeholder="全部类型" clearable>
-            <el-option label="供应" value="supply"></el-option>
-            <el-option label="需求" value="demand"></el-option>
+            <el-option label="供应" value="1"></el-option>
+            <el-option label="需求" value="2"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
@@ -55,57 +55,57 @@
         <el-table-column label="供需信息" min-width="250">
           <template slot-scope="scope">
             <div class="supply-title">{{ scope.row.title }}</div>
-            <div class="supply-desc">{{ scope.row.description }}</div>
+            <div class="supply-desc">{{ scope.row.content }}</div>
           </template>
         </el-table-column>
         <el-table-column label="类型" width="100">
           <template slot-scope="scope">
-            <el-tag :type="scope.row.type === 'supply' ? 'success' : 'primary'" size="small">{{ scope.row.typeText }}</el-tag>
+            <el-tag :type="scope.row.type === 1 ? 'success' : 'primary'" size="small">
+              {{ scope.row.type === 1 ? '供应' : '需求' }}
+            </el-tag>
           </template>
         </el-table-column>
         <el-table-column label="发布者" width="150">
           <template slot-scope="scope">
             <div class="user-info">
-              <div class="user-avatar">{{ scope.row.publisher.name.charAt(0) }}</div>
+              <div class="user-avatar">{{ (scope.row.user && scope.row.user.name && scope.row.user.name.charAt(0)) || 'U' }}</div>
               <div>
-                <div class="user-name">{{ scope.row.publisher.name }}</div>
-                <div class="user-year">{{ scope.row.publisher.year }}届</div>
+                <div class="user-name">{{ (scope.row.user && scope.row.user.name) || '-' }}</div>
+                <div class="user-year">{{ (scope.row.user && scope.row.user.company_position) || '-' }}</div>
               </div>
             </div>
           </template>
         </el-table-column>
         <el-table-column label="状态" width="120">
           <template slot-scope="scope">
-            <el-tag :type="getStatusTagType(scope.row.status)" size="small">{{ scope.row.statusText }}</el-tag>
+            <el-tag :type="getStatusTagType(scope.row.status)" size="small">
+              {{ getStatusText(scope.row.status) }}
+            </el-tag>
           </template>
         </el-table-column>
-        <el-table-column label="优先级" width="100">
+        <el-table-column label="联系方式" width="150">
           <template slot-scope="scope">
-            <el-tag :type="getPriorityTagType(scope.row.priority)" size="small">{{ scope.row.priorityText }}</el-tag>
+            <div v-if="scope.row.mobile" class="contact-info">
+              <div>手机: {{ scope.row.mobile }}</div>
+            </div>
+            <div v-else-if="scope.row.wechat" class="contact-info">
+              <div>微信: {{ scope.row.wechat }}</div>
+            </div>
+            <span v-else>-</span>
           </template>
         </el-table-column>
         <el-table-column label="发布时间" width="150">
           <template slot-scope="scope">
-            <div class="time-display">{{ scope.row.publishDate }}</div>
-            <div class="time-display-secondary">{{ scope.row.publishTime }}</div>
-          </template>
-        </el-table-column>
-        <el-table-column label="审核时间" width="150">
-          <template slot-scope="scope">
-            <div v-if="scope.row.auditDate">
-              <div class="time-display">{{ scope.row.auditDate }}</div>
-              <div class="time-display-secondary">{{ scope.row.auditTime }}</div>
-            </div>
-            <span v-else>-</span>
+            <div class="time-display">{{ formatDate(scope.row.created_at) }}</div>
+            <div class="time-display-secondary">{{ formatTime(scope.row.created_at) }}</div>
           </template>
         </el-table-column>
         <el-table-column label="操作" width="170" fixed="right">
           <template slot-scope="scope">
             <div class="action-buttons">
-              <el-button v-if="scope.row.status === 'pending' || scope.row.status === 'rejected'" type="success" size="mini" icon="el-icon-check" @click="handleApprove(scope.row)">通过</el-button>
-              <el-button v-if="scope.row.status === 'approved'" type="info" size="mini" icon="el-icon-remove-outline" @click="handleHide(scope.row)">隐藏</el-button>
+              <el-button v-if="scope.row.status === 0 || scope.row.status === 2" type="success" size="mini" icon="el-icon-check" @click="handleApprove(scope.row)">通过</el-button>
               <el-button type="primary" size="mini" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-button>
-              <el-button v-if="scope.row.status === 'pending'" type="danger" size="mini" icon="el-icon-close" @click="handleReject(scope.row)">拒绝</el-button>
+              <el-button v-if="scope.row.status === 0" type="danger" size="mini" icon="el-icon-close" @click="handleReject(scope.row)">拒绝</el-button>
               <el-button type="info" size="mini" icon="el-icon-view" @click="handleView(scope.row)">详情</el-button>
             </div>
           </template>
@@ -125,86 +125,93 @@
         :total="total"
       ></el-pagination>
     </div>
+
+    <!-- 详情弹窗 -->
+    <SupplyDemandDetail
+      :visible.sync="showDetailDialog"
+      :detail="currentDetail"
+      :readonly="true"
+    />
+    <SupplyDemandEdit
+      :visible.sync="showEditDialog"
+      :detail="currentDetail"
+      @save="handleEditSave"
+    />
   </div>
 </template>
 
 <script>
+import { supplyDemandList, supplyDemandSave } from '@/api/student/index.js'
+// 详情弹窗组件
+import SupplyDemandDetail from './components/SupplyDemandDetail.vue'
+import SupplyDemandEdit from './components/SupplyDemandEdit.vue'
 export default {
   name: 'SupplyDemand',
+  components: { SupplyDemandDetail, SupplyDemandEdit },
   data() {
     return {
-      pendingCount: 3,
+      pendingCount: 0,
       filters: {
         keyword: '',
         status: '',
         type: '',
         date: ''
       },
-      list: [
-        {
-          id: 1,
-          title: '提供企业管理咨询服务',
-          description: '专业企业管理咨询团队，具有10年以上行业经验...',
-          type: 'supply',
-          typeText: '供应',
-          publisher: { name: '张总', year: '2010' },
-          status: 'pending',
-          statusText: '待审核',
-          priority: 'high',
-          priorityText: '高',
-          publishDate: '2024-01-15',
-          publishTime: '14:30',
-          auditDate: null,
-          auditTime: null
-        },
-        {
-          id: 2,
-          title: '寻找技术合作伙伴',
-          description: '我们是一家初创公司，目前在开发一款AI智能客服产品...',
-          type: 'demand',
-          typeText: '需求',
-          publisher: { name: '李经理', year: '2015' },
-          status: 'approved',
-          statusText: '已通过',
-          priority: 'medium',
-          priorityText: '中',
-          publishDate: '2024-01-14',
-          publishTime: '16:45',
-          auditDate: '2024-01-14',
-          auditTime: '17:20'
-        },
-        {
-          id: 3,
-          title: '投融资咨询服务',
-          description: '专业投融资顾问，为企业提供全方位的融资解决方案...',
-          type: 'supply',
-          typeText: '供应',
-          publisher: { name: '王顾问', year: '2008' },
-          status: 'rejected',
-          statusText: '已拒绝',
-          priority: 'low',
-          priorityText: '低',
-          publishDate: '2024-01-13',
-          publishTime: '09:15',
-          auditDate: '2024-01-13',
-          auditTime: '10:30'
-        }
-      ],
-      total: 156,
+      list: [],
+      total: 0,
       listQuery: {
         page: 1,
         limit: 10
       },
-      multipleSelection: []
+      multipleSelection: [],
+      showDetailDialog: false,
+      currentDetail: null,
+      showEditDialog: false
     }
   },
+  created() {
+    this.getList()
+  },
   methods: {
+    async getList() {
+      // 构造filter数组
+      const filter = []
+      if (this.filters.keyword) filter.push({ key: 'title', op: 'like', value: this.filters.keyword })
+      if (this.filters.status) filter.push({ key: 'status', op: 'eq', value: this.filters.status })
+      if (this.filters.type) filter.push({ key: 'type', op: 'eq', value: this.filters.type })
+      if (this.filters.date) {
+        let dateStr = this.filters.date
+        if (dateStr instanceof Date) {
+          const local = new Date(dateStr.getTime() + 8 * 60 * 60 * 1000)
+          dateStr = local.toISOString().slice(0, 10)
+        } else if (typeof dateStr === 'string' && dateStr.length > 10) {
+          dateStr = dateStr.slice(0, 10)
+        }
+        filter.push({ key: 'created_at', op: 'like', value: dateStr })
+      }
+      // 构造扁平化参数
+      const params = {
+        page: this.listQuery.page,
+        page_size: this.listQuery.limit
+      }
+      filter.forEach((item, idx) => {
+        params[`filter[${idx}][key]`] = item.key
+        params[`filter[${idx}][op]`] = item.op
+        params[`filter[${idx}][value]`] = item.value
+      })
+      const res = await supplyDemandList(params)
+      // 根据接口返回结构处理数据
+      this.list = res.data || []
+      this.total = res.total || 0
+      // 计算待审核数量（status为0的项）
+      this.pendingCount = this.list.filter(item => item.status === 0).length
+    },
     handleSearch() {
-      console.log('搜索条件:', this.filters)
-      this.$message.success('搜索已触发')
+      this.listQuery.page = 1
+      this.getList()
     },
     handleExport() {
-      console.log('导出数据')
+      // 可根据需要实现导出逻辑
       this.$message.info('数据导出中...')
     },
     handleSelectionChange(val) {
@@ -212,72 +219,73 @@ export default {
     },
     getStatusTagType(status) {
       const statusMap = {
-        pending: 'warning',
-        approved: 'success',
-        rejected: 'danger'
+        0: 'warning', // 待审核
+        1: 'success', // 已通过
+        2: 'danger' // 已拒绝
       }
-      return statusMap[status]
+      return statusMap[status] || 'info'
     },
-    getPriorityTagType(priority) {
-      const priorityMap = {
-        high: 'danger',
-        medium: 'warning',
-        low: 'success'
+    getStatusText(status) {
+      const statusText = {
+        0: '待审核',
+        1: '已通过',
+        2: '已拒绝'
       }
-      return priorityMap[priority]
+      return statusText[status] || '未知'
     },
-    handleApprove(row) {
-      this.$confirm('确定要通过这条供需信息吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'success'
-      }).then(() => {
-        console.log('审核通过:', row.id)
-        // API call here
-        row.status = 'approved'
-        row.statusText = '已通过'
+    async handleApprove(row) {
+      try {
+        await supplyDemandSave({ id: row.id, status: 1 })
         this.$message.success('审核通过成功！')
-      })
+        this.getList()
+      } catch (e) {
+        this.$message.error('操作失败')
+      }
     },
     handleEdit(row) {
-      console.log('编辑:', row.id)
-      this.$message.info('跳转到编辑页面')
+      this.currentDetail = row
+      this.showEditDialog = true
+      this.showDetailDialog = false
     },
-    handleReject(row) {
-      this.$prompt('请输入拒绝原因：', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(({ value }) => {
-        console.log('拒绝:', row.id, '原因:', value)
-        // API call here
-        row.status = 'rejected'
-        row.statusText = '已拒绝'
-        this.$message.success('已拒绝该供需信息！')
-      })
+    async handleEditSave(form) {
+      try {
+        await supplyDemandSave(form)
+        this.$message.success('保存成功')
+        this.getList()
+      } catch (e) {
+        this.$message.error('保存失败')
+      }
     },
-    handleHide(row) {
-      this.$confirm('确定要隐藏这条供需信息吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'info'
-      }).then(() => {
-        console.log('隐藏:', row.id)
-        // API call here
-        this.$message.success('供需信息已隐藏！')
-      })
+    async handleReject(row) {
+      try {
+        await supplyDemandSave({ id: row.id, status: 2 })
+        this.$message.success('已拒绝该供需信息！')
+        this.getList()
+      } catch (e) {
+        this.$message.error('操作失败')
+      }
     },
     handleView(row) {
-      console.log('查看详情:', row.id)
-      this.$message.info('跳转到详情页面')
+      this.currentDetail = row
+      this.showDetailDialog = true
+      this.showEditDialog = false
     },
     handleSizeChange(val) {
       this.listQuery.limit = val
-      // getList()
+      this.getList()
     },
     handleCurrentChange(val) {
       this.listQuery.page = val
-      // getList()
+      this.getList()
+    },
+    formatDate(date) {
+      if (!date) return '-'
+      return date.split(' ')[0]
+    },
+    formatTime(date) {
+      if (!date) return '-'
+      const timePart = date.split(' ')[1]
+      return timePart ? timePart.substring(0, 5) : '-'
     }
   }
 }
@@ -299,7 +307,7 @@ export default {
   margin-bottom: 20px;
   padding-bottom: 15px;
   border-bottom: 2px solid #e9ecef;
-  
+
   .page-title {
     font-size: 24px;
     font-weight: bold;
@@ -307,7 +315,7 @@ export default {
     display: flex;
     align-items: center;
     margin: 0;
-    
+
     i {
       margin-right: 10px;
       color: #3498db;
@@ -379,6 +387,11 @@ export default {
   color: #666;
 }
 
+.contact-info {
+  font-size: 12px;
+  color: #666;
+}
+
 .time-display {
   font-size: 12px;
 }