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/priceManagement/index.vue |  276 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 276 insertions(+), 0 deletions(-)

diff --git a/src/views/procurementManagement/priceManagement/index.vue b/src/views/procurementManagement/priceManagement/index.vue
new file mode 100644
index 0000000..12f785b
--- /dev/null
+++ b/src/views/procurementManagement/priceManagement/index.vue
@@ -0,0 +1,276 @@
+<template>
+  <div class="app-container">
+    <el-card class="search-card" shadow="never">
+      <el-form :model="searchForm" :inline="true">
+        <el-form-item label="鍟嗗搧鍚嶇О锛�">
+          <el-input v-model="searchForm.productName" placeholder="璇疯緭鍏ュ晢鍝佸悕绉�" clearable />
+        </el-form-item>
+        <el-form-item label="渚涘簲鍟嗗悕绉帮細">
+          <el-input v-model="searchForm.supplierName" placeholder="璇疯緭鍏ヤ緵搴斿晢鍚嶇О" clearable />
+        </el-form-item>
+        <el-form-item label="浠锋牸鐘舵�侊細">
+          <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鐘舵��" clearable>
+            <el-option label="鏈夋晥" value="active" />
+            <el-option label="宸茶繃鏈�" value="expired" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+          <el-button @click="resetSearch">閲嶇疆</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+
+    <el-card class="table-card" shadow="never">
+      <div class="table-header">
+        <el-button type="primary" @click="openDialog('add')">鏂板浠锋牸</el-button>
+        <el-button type="success" @click="handleBatchUpdate">鎵归噺鏇存柊</el-button>
+        <el-button type="danger" @click="handleBatchDelete">鎵归噺鍒犻櫎</el-button>
+      </div>
+
+      <el-table :data="tableData" border v-loading="loading" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="鍟嗗搧鍚嶇О" prop="productName" />
+        <el-table-column label="瑙勬牸鍨嬪彿" prop="specification" />
+        <el-table-column label="渚涘簲鍟嗗悕绉�" prop="supplierName" />
+        <el-table-column label="鍘熶环鏍�" prop="oldPrice" width="120">
+          <template #default="{ row }">楼{{ row.oldPrice.toFixed(2) }}</template>
+        </el-table-column>
+        <el-table-column label="鏂颁环鏍�" prop="newPrice" width="120">
+          <template #default="{ row }">楼{{ row.newPrice.toFixed(2) }}</template>
+        </el-table-column>
+        <el-table-column label="璋冧环骞呭害" prop="priceChange" width="120">
+          <template #default="{ row }">
+            <span :style="{ color: row.priceChange >= 0 ? '#f56c6c' : '#67c23a' }">
+              {{ row.priceChange >= 0 ? '+' : '' }}{{ row.priceChange.toFixed(2) }}%
+            </span>
+          </template>
+        </el-table-column>
+        <el-table-column label="鐢熸晥鏃堕棿" prop="effectiveTime" width="180" />
+        <el-table-column label="鐘舵��" prop="status" width="100">
+          <template #default="{ row }">
+            <el-tag :type="getStatusType(row.status)">{{ getStatusText(row.status) }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="鎿嶄綔" width="200" align="center">
+          <template #default="{ row }">
+            <el-button type="primary" link @click="openDialog('edit', row)">缂栬緫</el-button>
+            <el-button type="success" link @click="handleApply(row)" v-if="row.status === 'pending'">搴旂敤</el-button>
+            <el-button type="danger" link @click="handleDelete(row)">鍒犻櫎</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '鏂板浠锋牸' : '缂栬緫浠锋牸'" width="600px">
+      <el-form :model="formData" label-width="120px">
+        <el-form-item label="鍟嗗搧鍚嶇О">
+          <el-select v-model="formData.productName" placeholder="璇烽�夋嫨鍟嗗搧" style="width: 100%">
+            <el-option label="鍟嗗搧A" value="鍟嗗搧A" />
+            <el-option label="鍟嗗搧B" value="鍟嗗搧B" />
+            <el-option label="鍟嗗搧C" value="鍟嗗搧C" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="瑙勬牸鍨嬪彿">
+          <el-input v-model="formData.specification" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" />
+        </el-form-item>
+        <el-form-item label="渚涘簲鍟嗗悕绉�">
+          <el-select v-model="formData.supplierName" placeholder="璇烽�夋嫨渚涘簲鍟�" style="width: 100%">
+            <el-option label="渚涘簲鍟咥" value="渚涘簲鍟咥" />
+            <el-option label="渚涘簲鍟咮" value="渚涘簲鍟咮" />
+            <el-option label="渚涘簲鍟咰" value="渚涘簲鍟咰" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="鍘熶环鏍�">
+          <el-input v-model="formData.oldPrice" placeholder="璇疯緭鍏ュ師浠锋牸" type="number" />
+        </el-form-item>
+        <el-form-item label="鏂颁环鏍�">
+          <el-input v-model="formData.newPrice" placeholder="璇疯緭鍏ユ柊浠锋牸" type="number" />
+        </el-form-item>
+        <el-form-item label="鐢熸晥鏃堕棿">
+          <el-date-picker v-model="formData.effectiveTime" type="datetime" placeholder="閫夋嫨鐢熸晥鏃堕棿" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="璋冧环鍘熷洜">
+          <el-select v-model="formData.reason" placeholder="璇烽�夋嫨璋冧环鍘熷洜" style="width: 100%">
+            <el-option label="甯傚満浠锋牸鍙樺姩" value="market" />
+            <el-option label="鎴愭湰鍙樺寲" value="cost" />
+            <el-option label="渚涘簲鍟嗚皟鏁�" value="supplier" />
+            <el-option label="鍏朵粬鍘熷洜" value="other" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="澶囨敞">
+          <el-input v-model="formData.remark" type="textarea" :rows="3" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="dialogVisible = false">鍙栨秷</el-button>
+        <el-button type="primary" @click="handleSubmit">纭畾</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, computed } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+
+const loading = ref(false)
+const dialogVisible = ref(false)
+const dialogType = ref('add')
+const selectedRows = ref([])
+
+const searchForm = reactive({
+  productName: '',
+  supplierName: '',
+  status: ''
+})
+
+const formData = reactive({
+  productName: '',
+  specification: '',
+  supplierName: '',
+  oldPrice: 0,
+  newPrice: 0,
+  effectiveTime: '',
+  reason: '',
+  remark: ''
+})
+
+const mockData = [
+  {
+    id: 1,
+    productName: '鍟嗗搧A',
+    specification: '瑙勬牸1',
+    supplierName: '渚涘簲鍟咥',
+    oldPrice: 50.00,
+    newPrice: 55.00,
+    priceChange: 10.00,
+    effectiveTime: '2024-12-01 00:00:00',
+    status: 'active',
+    reason: '甯傚満浠锋牸鍙樺姩',
+    remark: '甯傚満浠锋牸涓婃定'
+  },
+  {
+    id: 2,
+    productName: '鍟嗗搧B',
+    specification: '瑙勬牸2',
+    supplierName: '渚涘簲鍟咮',
+    oldPrice: 80.00,
+    newPrice: 75.00,
+    priceChange: -6.25,
+    effectiveTime: '2024-12-01 00:00:00',
+    status: 'active',
+    reason: '鎴愭湰鍙樺寲',
+    remark: '鎴愭湰涓嬮檷'
+  }
+]
+
+const tableData = ref([...mockData])
+
+const getStatusType = (status) => {
+  const statusMap = { active: 'success', expired: 'info', pending: 'warning' }
+  return statusMap[status] || 'info'
+}
+
+const getStatusText = (status) => {
+  const statusMap = { active: '鏈夋晥', expired: '宸茶繃鏈�', pending: '寰呯敓鏁�' }
+  return statusMap[status] || '鏈煡'
+}
+
+const handleSearch = () => {
+  loading.value = true
+  setTimeout(() => { loading.value = false }, 500)
+}
+
+const resetSearch = () => {
+  Object.assign(searchForm, { productName: '', supplierName: '', status: '' })
+}
+
+const openDialog = (type, row = {}) => {
+  dialogType.value = type
+  if (type === 'edit' && row.id) {
+    Object.assign(formData, {
+      productName: row.productName,
+      specification: row.specification,
+      supplierName: row.supplierName,
+      oldPrice: row.oldPrice,
+      newPrice: row.newPrice,
+      effectiveTime: row.effectiveTime,
+      reason: row.reason,
+      remark: row.remark
+    })
+  } else {
+    Object.assign(formData, {
+      productName: '',
+      specification: '',
+      supplierName: '',
+      oldPrice: 0,
+      newPrice: 0,
+      effectiveTime: '',
+      reason: '',
+      remark: ''
+    })
+  }
+  dialogVisible.value = true
+}
+
+const handleSubmit = () => {
+  if (dialogType.value === 'add') {
+    const priceChange = ((formData.newPrice - formData.oldPrice) / formData.oldPrice) * 100
+    const newPrice = {
+      id: Date.now(),
+      productName: formData.productName,
+      specification: formData.specification,
+      supplierName: formData.supplierName,
+      oldPrice: formData.oldPrice,
+      newPrice: formData.newPrice,
+      priceChange: priceChange,
+      effectiveTime: formData.effectiveTime,
+      status: 'pending',
+      reason: formData.reason,
+      remark: formData.remark
+    }
+    tableData.value.unshift(newPrice)
+    ElMessage.success('鏂板鎴愬姛')
+  }
+  dialogVisible.value = false
+}
+
+const handleApply = (row) => {
+  row.status = 'active'
+  ElMessage.success('浠锋牸宸插簲鐢�')
+}
+
+const handleDelete = (row) => {
+  ElMessageBox.confirm('纭畾瑕佸垹闄よ繖鏉¤褰曞悧锛�', '鎻愮ず', {
+    confirmButtonText: '纭畾',
+    cancelButtonText: '鍙栨秷',
+    type: 'warning'
+  }).then(() => {
+    const index = tableData.value.findIndex(item => item.id === row.id)
+    if (index !== -1) {
+      tableData.value.splice(index, 1)
+      ElMessage.success('鍒犻櫎鎴愬姛')
+    }
+  })
+}
+
+const handleBatchUpdate = () => {
+  ElMessage.success('鎵归噺鏇存柊鎴愬姛')
+}
+
+const handleBatchDelete = () => {
+  ElMessage.success('鎵归噺鍒犻櫎鎴愬姛')
+}
+
+const handleSelectionChange = (rows) => {
+  selectedRows.value = rows
+}
+</script>
+
+<style scoped>
+.app-container { padding: 20px; }
+.search-card { margin-bottom: 20px; }
+.table-card { margin-bottom: 20px; }
+.table-header { margin-bottom: 20px; }
+</style>

--
Gitblit v1.9.3