From c7b4b9a2f4c0f05aeb60a9e3f5fba5d9a3676f3f Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期一, 18 八月 2025 16:22:42 +0800
Subject: [PATCH] 中强恒兴设备管理页面添加
---
src/views/procurementManagement/index.vue | 378 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 378 insertions(+), 0 deletions(-)
diff --git a/src/views/procurementManagement/index.vue b/src/views/procurementManagement/index.vue
new file mode 100644
index 0000000..47ec043
--- /dev/null
+++ b/src/views/procurementManagement/index.vue
@@ -0,0 +1,378 @@
+<template>
+ <div class="app-container">
+ <!-- 椤甸潰鏍囬 -->
+ <div class="page-header">
+ <h2>閲囪喘绠＄悊绯荤粺</h2>
+ <p>缁熶竴绠＄悊閲囪喘鍏ㄦ祦绋嬶紝鎻愬崌閲囪喘鏁堢巼涓庤川閲�</p>
+ </div>
+
+ <!-- 鍔熻兘妯″潡鍗＄墖 -->
+ <el-row :gutter="20" class="module-cards">
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/purchaseOrder')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#409EFF"><Document /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>閲囪喘璁㈠崟绠＄悊</h3>
+ <p>鏂板缓銆佺紪杈戙�佸垹闄ら噰璐鍗曪紝閫夋嫨渚涘簲鍟嗭紝濉啓鍟嗗搧鏄庣粏</p>
+ <div class="card-stats">
+ <span>寰呭鏍�: {{ stats.pendingOrders }}</span>
+ <span>宸插鏍�: {{ stats.approvedOrders }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/arrivalManagement')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#67C23A"><Box /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>鍒拌揣绠＄悊</h3>
+ <p>鑷姩鍏宠仈閲囪喘璁㈠崟锛屽綍鍏ュ埌璐у晢鍝佷俊鎭紝鏀寔鎵撳嵃鏌ョ湅</p>
+ <div class="card-stats">
+ <span>寰呮敹璐�: {{ stats.pendingArrivals }}</span>
+ <span>宸叉敹璐�: {{ stats.receivedArrivals }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/qualityInspection')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#E6A23C"><Search /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>璐ㄦ绠＄悊</h3>
+ <p>鍒拌揣鍚庤嚜鍔ㄧ敓鎴愯川妫�鍗曪紝濉啓鍚堟牸涓庝笉鍚堟牸鍟嗗搧鏁伴噺鍙婂師鍥�</p>
+ <div class="card-stats">
+ <span>寰呰川妫�: {{ stats.pendingInspections }}</span>
+ <span>宸插畬鎴�: {{ stats.completedInspections }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ <el-row :gutter="20" class="module-cards">
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/returnManagement')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#F56C6C"><RefreshLeft /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>閫�璐х鐞�</h3>
+ <p>鐢熸垚閲囪喘閫�璐у崟鍜岃川妫�閫�璐у崟锛屾敮鎸佺瓫閫夋煡璇笌鍗曟嵁璇︽儏</p>
+ <div class="card-stats">
+ <span>寰呭鏍�: {{ stats.pendingReturns }}</span>
+ <span>宸插鏍�: {{ stats.approvedReturns }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/priceManagement')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#909399"><Money /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>浠锋牸绠＄悊</h3>
+ <p>鏍规嵁鍟嗗搧鍙婂競鍦轰环鏍煎彉鍖栬繘琛岄噰璐环璋冩暣锛岃嚜鍔ㄦ洿鏂伴噰璐崟鎹�</p>
+ <div class="card-stats">
+ <span>鏈夋晥浠锋牸: {{ stats.activePrices }}</span>
+ <span>寰呯敓鏁�: {{ stats.pendingPrices }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="8">
+ <el-card class="module-card" shadow="hover" @click="navigateTo('/procurementManagement/procurementLedger')">
+ <div class="card-content">
+ <div class="card-icon">
+ <el-icon size="48" color="#9C27B0"><List /></el-icon>
+ </div>
+ <div class="card-info">
+ <h3>閲囪喘鍙拌处</h3>
+ <p>鏌ョ湅閲囪喘鍘嗗彶璁板綍锛岀粺璁″垎鏋愰噰璐暟鎹紝鐢熸垚閲囪喘鎶ヨ〃</p>
+ <div class="card-stats">
+ <span>鎬昏鍗�: {{ stats.totalOrders }}</span>
+ <span>鎬婚噾棰�: 楼{{ stats.totalAmount.toFixed(2) }}</span>
+ </div>
+ </div>
+ </div>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ <!-- 缁熻姒傝 -->
+ <el-card class="stats-card" shadow="never">
+ <template #header>
+ <div class="card-header">
+ <span>閲囪喘缁熻姒傝</span>
+ <el-button type="primary" size="small" @click="refreshStats">鍒锋柊鏁版嵁</el-button>
+ </div>
+ </template>
+
+ <el-row :gutter="20">
+ <el-col :span="6">
+ <div class="stat-item">
+ <div class="stat-number">{{ stats.totalOrders }}</div>
+ <div class="stat-label">閲囪喘璁㈠崟鎬绘暟</div>
+ </div>
+ </el-col>
+ <el-col :span="6">
+ <div class="stat-item">
+ <div class="stat-number">{{ stats.totalAmount.toFixed(2) }}</div>
+ <div class="stat-label">閲囪喘鎬婚噾棰�(涓囧厓)</div>
+ </div>
+ </el-col>
+ <el-col :span="6">
+ <div class="stat-item">
+ <div class="stat-number">{{ stats.avgDeliveryTime }}</div>
+ <div class="stat-label">骞冲潎浜や粯澶╂暟</div>
+ </div>
+ </el-col>
+ <el-col :span="6">
+ <div class="stat-item">
+ <div class="stat-number">{{ stats.qualityRate }}%</div>
+ <div class="stat-label">璐ㄦ鍚堟牸鐜�</div>
+ </div>
+ </el-col>
+ </el-row>
+ </el-card>
+
+ <!-- 鏈�杩戞椿鍔� -->
+ <el-card class="activity-card" shadow="never">
+ <template #header>
+ <span>鏈�杩戞椿鍔�</span>
+ </template>
+
+ <el-timeline>
+ <el-timeline-item
+ v-for="(activity, index) in recentActivities"
+ :key="index"
+ :timestamp="activity.time"
+ :type="activity.type"
+ >
+ {{ activity.content }}
+ </el-timeline-item>
+ </el-timeline>
+ </el-card>
+ </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import { Document, Box, Search, RefreshLeft, Money, List } from '@element-plus/icons-vue'
+
+const router = useRouter()
+
+// 缁熻鏁版嵁
+const stats = ref({
+ pendingOrders: 5,
+ approvedOrders: 25,
+ pendingArrivals: 3,
+ receivedArrivals: 18,
+ pendingInspections: 2,
+ completedInspections: 15,
+ pendingReturns: 1,
+ approvedReturns: 3,
+ activePrices: 45,
+ pendingPrices: 2,
+ totalOrders: 30,
+ totalAmount: 125.8,
+ avgDeliveryTime: 7,
+ qualityRate: 96.5
+})
+
+// 鏈�杩戞椿鍔�
+const recentActivities = ref([
+ {
+ time: '2024-12-01 18:30',
+ content: '鏂板閲囪喘璁㈠崟 PO20241201004',
+ type: 'primary'
+ },
+ {
+ time: '2024-12-01 17:45',
+ content: '瀹屾垚璐ㄦ鍗� QI20241201002',
+ type: 'success'
+ },
+ {
+ time: '2024-12-01 16:20',
+ content: '鍒拌揣鍗� AR20241201003 宸叉敹璐�',
+ type: 'success'
+ },
+ {
+ time: '2024-12-01 15:15',
+ content: '浠锋牸璋冩暣锛氬晢鍝丅 浠� 楼80 璋冩暣涓� 楼75',
+ type: 'warning'
+ },
+ {
+ time: '2024-12-01 14:30',
+ content: '閫�璐у崟 RT20241201003 宸插鏍�',
+ type: 'info'
+ }
+])
+
+// 瀵艰埅鍒版寚瀹氶〉闈�
+const navigateTo = (path) => {
+ router.push(path)
+}
+
+// 鍒锋柊缁熻鏁版嵁
+const refreshStats = () => {
+ // 妯℃嫙鍒锋柊鏁版嵁
+ stats.value.pendingOrders = Math.floor(Math.random() * 10) + 1
+ stats.value.totalAmount = (Math.random() * 100 + 100).toFixed(1)
+}
+
+onMounted(() => {
+ // 椤甸潰鍔犺浇瀹屾垚鍚庣殑鍒濆鍖栭�昏緫
+})
+</script>
+
+<style scoped>
+.app-container {
+ padding: 20px;
+ background-color: #f5f7fa;
+ min-height: 100vh;
+}
+
+.page-header {
+ text-align: center;
+ margin-bottom: 30px;
+ padding: 20px;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+ border-radius: 10px;
+ color: white;
+}
+
+.page-header h2 {
+ margin: 0 0 10px 0;
+ font-size: 28px;
+ font-weight: 600;
+}
+
+.page-header p {
+ margin: 0;
+ font-size: 16px;
+ opacity: 0.9;
+}
+
+.module-cards {
+ margin-bottom: 20px;
+}
+
+.module-card {
+ cursor: pointer;
+ transition: all 0.3s ease;
+ border: none;
+ border-radius: 12px;
+}
+
+.module-card:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
+}
+
+.card-content {
+ display: flex;
+ align-items: center;
+ padding: 20px;
+}
+
+.card-icon {
+ margin-right: 20px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 80px;
+ height: 80px;
+ background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
+ border-radius: 50%;
+ color: white;
+}
+
+.card-info h3 {
+ margin: 0 0 10px 0;
+ font-size: 18px;
+ font-weight: 600;
+ color: #303133;
+}
+
+.card-info p {
+ margin: 0 0 15px 0;
+ font-size: 14px;
+ color: #606266;
+ line-height: 1.5;
+}
+
+.card-stats {
+ display: flex;
+ gap: 15px;
+}
+
+.card-stats span {
+ font-size: 12px;
+ color: #909399;
+ background-color: #f5f7fa;
+ padding: 4px 8px;
+ border-radius: 4px;
+}
+
+.stats-card {
+ margin-bottom: 20px;
+ border-radius: 12px;
+}
+
+.card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.stat-item {
+ text-align: center;
+ padding: 20px;
+}
+
+.stat-number {
+ font-size: 32px;
+ font-weight: 600;
+ color: #409EFF;
+ margin-bottom: 8px;
+}
+
+.stat-label {
+ font-size: 14px;
+ color: #606266;
+}
+
+.activity-card {
+ border-radius: 12px;
+}
+
+.el-timeline-item {
+ padding-bottom: 20px;
+}
+
+.el-timeline-item:last-child {
+ padding-bottom: 0;
+}
+</style>
--
Gitblit v1.9.3