From db42d47f5692ef64e5436c5a6d29dcb537b44596 Mon Sep 17 00:00:00 2001
From: zouyu <2723363702@qq.com>
Date: 星期一, 26 一月 2026 16:36:13 +0800
Subject: [PATCH] 浪潮对接单点登录:mis调整
---
src/views/procurementManagement/procurementPlan/index.vue | 772 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 772 insertions(+), 0 deletions(-)
diff --git a/src/views/procurementManagement/procurementPlan/index.vue b/src/views/procurementManagement/procurementPlan/index.vue
new file mode 100644
index 0000000..42a1bcf
--- /dev/null
+++ b/src/views/procurementManagement/procurementPlan/index.vue
@@ -0,0 +1,772 @@
+<template>
+ <div class="app-container">
+ <!-- 鎼滅储鍖哄煙 -->
+ <el-card class="search-card" shadow="never">
+ <el-form :model="searchForm" :inline="true" class="search-form">
+ <el-form-item label="璁″垝鍚嶇О">
+ <el-input v-model="searchForm.planName" placeholder="璇疯緭鍏ヨ鍒掑悕绉�" clearable />
+ </el-form-item>
+ <el-form-item label="鐘舵��">
+ <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鐘舵��" clearable style="width: 150px">
+ <el-option label="鍚敤" value="active" />
+ <el-option label="绂佺敤" value="disabled" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="handleSearch">
+ <el-icon><Search /></el-icon>
+ 鎼滅储
+ </el-button>
+ <el-button @click="handleReset">
+ <el-icon><Refresh /></el-icon>
+ 閲嶇疆
+ </el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
+
+ <!-- 鎿嶄綔鎸夐挳 -->
+ <el-card class="table-card" shadow="never">
+ <div class="table-header">
+ <div class="table-title">閲囪喘璁″垝鍒楄〃</div>
+ <div class="table-actions">
+ <el-button type="primary" @click="handleAdd">
+ <el-icon><Plus /></el-icon>
+ 鏂板璁″垝
+ </el-button>
+ <el-button type="info" @click="handleExport">
+ <el-icon><Download /></el-icon>
+ 瀵煎嚭
+ </el-button>
+ </div>
+ </div>
+
+ <!-- 鏁版嵁琛ㄦ牸 -->
+ <el-table
+ v-loading="loading"
+ :data="tableData"
+ stripe
+ border
+ style="width: 100%"
+ >
+ <el-table-column prop="planName" label="璁″垝鍚嶇О" min-width="150" />
+ <el-table-column prop="description" label="鎻忚堪" min-width="200" show-overflow-tooltip />
+ <el-table-column prop="formula" label="璁$畻鍏紡" min-width="200" show-overflow-tooltip>
+ <template #default="{ row }">
+ <el-tag type="info" size="small">{{ row.formula }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="status" label="鐘舵��" width="80" align="center">
+ <template #default="{ row }">
+ <el-tag :type="row.status === 'active' ? 'success' : 'info'" size="small">
+ {{ row.status === 'active' ? '鍚敤' : '绂佺敤' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="updateTime" label="鏈�鍚庤绠楁椂闂�" width="160" />
+ <el-table-column label="鎿嶄綔" width="200" fixed="right" align="center">
+ <template #default="{ row }">
+ <el-button type="primary" link @click="handleEdit(row)">缂栬緫</el-button>
+ <el-button type="success" link @click="handleCalculate(row)">璁$畻</el-button>
+ <el-button type="danger" link @click="handleDelete(row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+
+ <!-- 鍒嗛〉 -->
+ <div class="pagination-container">
+ <el-pagination
+ v-model:current-page="pagination.current"
+ v-model:page-size="pagination.size"
+ :page-sizes="[10, 20, 50, 100]"
+ :total="total"
+ layout="total, sizes, prev, pager, next, jumper"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </el-card>
+
+ <!-- 鏂板/缂栬緫瀵硅瘽妗� -->
+ <FormDialog
+ v-model="dialogVisible"
+ :title="dialogType === 'add' ? '鏂板閲囪喘璁″垝' : '缂栬緫閲囪喘璁″垝'"
+ :width="'1000px'"
+ :operation-type="dialogType"
+ :close-on-click-modal="false"
+ @close="dialogVisible = false"
+ @confirm="handleSubmit"
+ @cancel="dialogVisible = false"
+ >
+ <div class="form-container">
+ <!-- 鍩烘湰淇℃伅 -->
+ <div class="form-section">
+ <div class="section-title">鍩烘湰淇℃伅</div>
+ <el-form
+ ref="formRef"
+ :model="formData"
+ :rules="formRules"
+ label-width="120px"
+ >
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="缂栫爜" prop="code">
+ <el-input v-model="formData.code" placeholder="绯荤粺鑷姩鐢熸垚" disabled />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍚嶇О" prop="planName" required>
+ <el-input v-model="formData.planName" placeholder="璇疯緭鍏ヨ鍒掑悕绉�" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+
+ <el-form-item label="鎻忚堪" prop="description">
+ <el-input
+ v-model="formData.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ヨ鍒掓弿杩�"
+ />
+ </el-form-item>
+
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="formData.status" placeholder="璇烽�夋嫨鐘舵��" style="width: 100%">
+ <el-option label="鍚敤" value="active" />
+ <el-option label="绂佺敤" value="disabled" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鏄惁绯荤粺棰勭疆">
+ <el-checkbox v-model="formData.isSystemPreset">鏄�</el-checkbox>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </div>
+
+ <!-- 璁$畻鍙傛暟 -->
+ <div class="form-section">
+ <div class="section-title">璁$畻鍙傛暟</div>
+ <el-tabs v-model="activeTab" class="param-tabs">
+ <el-tab-pane label="闇�姹傚弬鏁�" name="demand">
+ <div class="checkbox-group">
+ <el-checkbox v-model="formData.considerExistingStock">鑰冭檻鐜版湁搴撳瓨</el-checkbox>
+ <el-checkbox v-model="formData.warehouseControl">浠撳簱杩愯MRP鐨勬帶鍒�</el-checkbox>
+ <el-checkbox v-model="formData.calculateTotalDemand">璁$畻鎬婚渶姹�</el-checkbox>
+ <el-checkbox v-model="formData.considerSafetyStock">鑰冭檻瀹夊叏搴撳瓨</el-checkbox>
+ <el-checkbox v-model="formData.considerLockedStock">鑰冭檻閿佸簱</el-checkbox>
+ <el-checkbox v-model="formData.notConsiderMaterialAux">涓嶈�冭檻鐗╂枡杈呭姪灞炴��</el-checkbox>
+ <el-checkbox v-model="formData.negativeStockAsDemand">璐熷簱瀛樹綔涓洪渶姹�</el-checkbox>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="璁$畻鍙傛暟" name="calculation">
+ <div class="checkbox-group">
+ <el-checkbox v-model="formData.considerExistingStock">鑰冭檻鐜版湁搴撳瓨</el-checkbox>
+ <el-checkbox v-model="formData.warehouseControl">浠撳簱杩愯MRP鐨勬帶鍒�</el-checkbox>
+ <el-checkbox v-model="formData.calculateTotalDemand">璁$畻鎬婚渶姹�</el-checkbox>
+ <el-checkbox v-model="formData.considerSafetyStock">鑰冭檻瀹夊叏搴撳瓨</el-checkbox>
+ <el-checkbox v-model="formData.considerLockedStock">鑰冭檻閿佸簱</el-checkbox>
+ <el-checkbox v-model="formData.notConsiderMaterialAux">涓嶈�冭檻鐗╂枡杈呭姪灞炴��</el-checkbox>
+ <el-checkbox v-model="formData.negativeStockAsDemand">璐熷簱瀛樹綔涓洪渶姹�</el-checkbox>
+ </div>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+
+ <!-- 姹囨�诲悎骞堕�夐」 -->
+ <div class="form-section">
+ <div class="section-title">姹囨�诲悎骞堕�夐」</div>
+ <div class="checkbox-group">
+ <el-checkbox v-model="formData.summaryMaterial">鐗╂枡</el-checkbox>
+ <el-checkbox v-model="formData.summaryAuxAttributes">杈呭姪灞炴��</el-checkbox>
+ <el-checkbox v-model="formData.summaryDemandDate">闇�姹傛棩鏈�</el-checkbox>
+ </div>
+ </div>
+
+ <!-- 璁$畻鍏紡 -->
+ <div class="form-section">
+ <div class="section-title">璁$畻鍏紡</div>
+ <div class="formula-input-section">
+ <el-form-item label="璁$畻鍏紡" prop="formula" required>
+ <el-input
+ v-model="formData.formula"
+ placeholder="渚嬪: 棰勮鍑哄簱鏁伴噺 - 鐜版湁搴撳瓨 + 瀹夊叏搴撳瓨 - 棰勮鍏ュ簱鏁伴噺"
+ @input="validateFormula"
+ />
+ </el-form-item>
+ <div class="formula-help">
+ <el-text type="info" size="small">
+ 鏀寔鍙橀噺锛氶璁″嚭搴撴暟閲忋�佺幇鏈夊簱瀛樸�佸畨鍏ㄥ簱瀛樸�侀璁″叆搴撴暟閲�
+ </el-text>
+ </div>
+ </div>
+ </div>
+ </div>
+ </FormDialog>
+
+ <!-- 浜у搧閫夋嫨瀵硅瘽妗� -->
+ <FormDialog
+ v-model="productSelectDialogVisible"
+ title="閫夋嫨浜у搧"
+ :width="'800px'"
+ :close-on-click-modal="false"
+ @close="productSelectDialogVisible = false"
+ @confirm="handleConfirmProductSelection"
+ @cancel="productSelectDialogVisible = false"
+ >
+ <div class="product-select">
+ <el-alert
+ title="璇烽�夋嫨瑕佽绠楃殑浜у搧"
+ type="info"
+ :closable="false"
+ show-icon
+ >
+ <template #default>
+ <p>閫夋嫨浜у搧鍚庯紝绯荤粺灏嗘牴鎹綋鍓嶈绠楀叕寮忓拰浜у搧搴撳瓨鎯呭喌杩涜璁$畻銆�</p>
+ </template>
+ </el-alert>
+
+ <el-table
+ v-loading="productLoading"
+ :data="productList"
+ @selection-change="handleProductSelectionChange"
+ stripe
+ border
+ style="width: 100%; margin-top: 20px;"
+ >
+ <el-table-column type="selection" width="55" />
+ <el-table-column prop="productCategory" label="浜у搧澶х被" min-width="150" />
+ <el-table-column prop="specificationModel" label="浜у搧瑙勬牸" width="120" />
+ <el-table-column prop="inboundNum0" label="鐜版湁搴撳瓨" width="100" align="right" />
+ <el-table-column prop="inboundNum" label="瀹夊叏搴撳瓨" width="100" align="right" />
+ <el-table-column prop="inboundNum" label="棰勮鍑哄簱" width="100" align="right" />
+ <el-table-column prop="inboundNum0" label="棰勮鍏ュ簱" width="100" align="right" />
+ </el-table>
+ </div>
+ </FormDialog>
+
+ <!-- 璁$畻缁撴灉瀵硅瘽妗� -->
+ <FormDialog
+ v-model="calculateDialogVisible"
+ title="閲囪喘璁$畻缁撴灉"
+ :width="'1000px'"
+ :close-on-click-modal="false"
+ @close="calculateDialogVisible = false"
+ @confirm="handleCreatePurchaseOrder"
+ @cancel="calculateDialogVisible = false"
+ >
+ <div class="calculate-result">
+ <el-alert
+ title="璁$畻缁撴灉"
+ type="success"
+ :closable="false"
+ show-icon
+ >
+ <template #default>
+ <p>鍩轰簬褰撳墠閰嶇疆鐨勮绠楀叕寮忓拰搴撳瓨鎯呭喌锛岀郴缁熷凡璁$畻鍑哄悇浜у搧鐨勯噰璐渶姹傘��</p>
+ </template>
+ </el-alert>
+
+ <el-table :data="calculateResult" stripe border style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="productCategory" label="浜у搧澶х被" min-width="150" />
+ <el-table-column prop="specificationModel" label="浜у搧瑙勬牸" width="120" />
+ <el-table-column prop="inboundNum0" label="鐜版湁搴撳瓨" width="100" align="right" />
+ <el-table-column prop="inboundNum" label="瀹夊叏搴撳瓨" width="100" align="right" />
+ <el-table-column prop="inboundNum" label="棰勮鍑哄簱鏁伴噺" width="120" align="right" />
+ <el-table-column prop="inboundNum0" label="棰勮鍏ュ簱鏁伴噺" width="120" align="right" />
+ <el-table-column prop="weeklyNetDemand" label="鎸夊懆鍑�闇�姹�" width="120" align="right">
+ <template #default="{ row }">
+ <el-tag :type="row.weeklyNetDemand > 0 ? 'warning' : 'success'" size="small">
+ {{ row.weeklyNetDemand }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="suggestedPurchase" label="寤鸿閲囪喘" width="100" align="right">
+ <template #default="{ row }">
+ <el-tag :type="row.suggestedPurchase > 0 ? 'danger' : 'success'" size="small">
+ {{ row.suggestedPurchase }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </FormDialog>
+ </div>
+</template>
+
+<script setup>
+import FormDialog from '@/components/Dialog/FormDialog.vue';
+import {ref, reactive, onMounted, getCurrentInstance} from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { Search, Refresh, Plus, Download } from '@element-plus/icons-vue'
+import {listPage,add,update,del,listPageCopy} from "@/api/procurementManagement/procurementPlan.js"
+
+// 鍝嶅簲寮忔暟鎹�
+const loading = ref(false)
+const submitLoading = ref(false)
+const dialogVisible = ref(false)
+const productSelectDialogVisible = ref(false)
+const calculateDialogVisible = ref(false)
+const dialogType = ref('add')
+const productLoading = ref(false)
+const selectedProducts = ref([])
+const currentPlan = ref(null)
+
+// 鎼滅储琛ㄥ崟
+const searchForm = reactive({
+ planName: '',
+ status: ''
+})
+
+// 鍒嗛〉鏁版嵁
+const pagination = reactive({
+ current: 1,
+ size: 20
+})
+
+// 琛ㄥ崟鏁版嵁
+const formData = reactive({
+ code: '',
+ planName: '',
+ description: '',
+ status: '',
+ isSystemPreset: false,
+ formula: '',
+ // 璁$畻鍙傛暟
+ considerExistingStock: false,
+ warehouseControl: false,
+ calculateTotalDemand: false,
+ considerSafetyStock: false,
+ considerLockedStock: false,
+ notConsiderMaterialAux: false,
+ negativeStockAsDemand: false,
+ // 姹囨�诲悎骞堕�夐」
+ summaryMaterial: false,
+ summaryAuxAttributes: false,
+ summaryDemandDate: false
+})
+
+// 褰撳墠婵�娲荤殑鏍囩椤�
+const activeTab = ref('demand')
+
+// 琛ㄥ崟楠岃瘉瑙勫垯
+const formRules = {
+ planName: [
+ { required: true, message: '璇疯緭鍏ヨ鍒掑悕绉�', trigger: 'blur' }
+ ],
+ status: [
+ { required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }
+ ],
+ formula: [
+ { required: true, message: '璇疯緭鍏ヨ绠楀叕寮�', trigger: 'blur' }
+ ]
+}
+
+// 琛ㄦ牸鏁版嵁
+const tableData = ref([])
+
+// 浜у搧鍒楄〃鏁版嵁
+const productList = ref([
+ {
+ id: 4,
+ productName: '浜у搧D',
+ productCode: 'PD004',
+ existingStock: 90,
+ safetyStock: 40,
+ expectedOutbound: 160,
+ expectedInbound: 35
+ }
+])
+
+// 璁$畻缁撴灉鏁版嵁
+const calculateResult = ref([
+ {
+ productName: '浜у搧A',
+ existingStock: 100,
+ safetyStock: 50,
+ expectedOutbound: 200,
+ expectedInbound: 30,
+ weeklyNetDemand: 120,
+ suggestedPurchase: 150
+ },
+ {
+ productName: '浜у搧B',
+ existingStock: 80,
+ safetyStock: 30,
+ expectedOutbound: 150,
+ expectedInbound: 20,
+ weeklyNetDemand: 100,
+ suggestedPurchase: 120
+ }
+])
+const total = ref(0)
+// 鏂规硶
+const handleSearch = () => {
+ pagination.current = 1
+ loadData()
+}
+
+const handleReset = () => {
+ Object.assign(searchForm, {
+ planName: '',
+ status: ''
+ })
+ handleSearch()
+}
+
+const loadData = () => {
+ loading.value = true
+ listPage({...searchForm,...pagination}).then(res => {
+ if(res.code === 200){
+ tableData.value = res.data.records
+ total.value = res.data.total
+ loading.value = false
+ }
+ })
+}
+
+const handleAdd = () => {
+ dialogType.value = 'add'
+ resetForm()
+ // 鑷姩鐢熸垚缂栫爜
+ formData.code = 'CGJH' + String(Date.now()).slice(-4)
+ dialogVisible.value = true
+}
+
+const handleEdit = (row) => {
+ dialogType.value = 'edit'
+ Object.assign(formData, row)
+ dialogVisible.value = true
+}
+
+const handleDelete = async (row) => {
+ try {
+ await ElMessageBox.confirm('纭畾瑕佸垹闄よ繖涓噰璐鍒掑悧锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ })
+ let ids = [row.id]
+ del(ids).then(res =>{
+ if(res.code === 200){
+ ElMessage.success('鍒犻櫎鎴愬姛')
+ loadData()
+ }
+ })
+ } catch {
+ // 鐢ㄦ埛鍙栨秷鍒犻櫎
+ }
+}
+
+const handleSubmit = async () => {
+ try {
+ // 琛ㄥ崟楠岃瘉
+ if (!formData.planName || !formData.formula) {
+ ElMessage.error('璇峰~鍐欏繀濉」')
+ return
+ }
+
+ submitLoading.value = true
+
+ if (dialogType.value === 'add') {
+ add(formData).then(res => {
+ if(res.code === 200){
+ ElMessage.success('鏂板鎴愬姛')
+ dialogVisible.value = false
+ loadData()
+ }
+ })
+ } else {
+ // 缂栬緫
+ update(formData).then(res => {
+ if(res.code === 200){
+ ElMessage.success('缂栬緫鎴愬姛')
+ dialogVisible.value = false
+ loadData()
+ }
+ })
+ }
+
+
+ } catch (error) {
+ ElMessage.error('鎿嶄綔澶辫触')
+ } finally {
+ submitLoading.value = false
+ }
+}
+
+const resetForm = () => {
+ Object.assign(formData, {
+ code: '',
+ planName: '',
+ description: '',
+ status: '',
+ isSystemPreset: false,
+ formula: '棰勮鍑哄簱鏁伴噺 - 鐜版湁搴撳瓨 + 瀹夊叏搴撳瓨 - 棰勮鍏ュ簱鏁伴噺',
+ // 璁$畻鍙傛暟
+ considerExistingStock: false,
+ warehouseControl: false,
+ calculateTotalDemand: false,
+ considerSafetyStock: false,
+ considerLockedStock: false,
+ notConsiderMaterialAux: false,
+ negativeStockAsDemand: false,
+ // 姹囨�诲悎骞堕�夐」
+ summaryMaterial: false,
+ summaryAuxAttributes: false,
+ summaryDemandDate: false
+ })
+ activeTab.value = 'demand'
+}
+
+const validateFormula = () => {
+ // 绠�鍗曠殑鍏紡楠岃瘉
+ const formula = formData.formula
+ if (formula && !/^[a-zA-Z\u4e00-\u9fa5\s\*\+\-\/\(\)\d\.]+$/.test(formula)) {
+ ElMessage.warning('鍏紡鏍煎紡鍙兘涓嶆纭紝璇锋鏌�')
+ }
+}
+
+const handleCalculate = (row) => {
+ currentPlan.value = row
+ productSelectDialogVisible.value = true
+ loadProductList()
+}
+
+const loadProductList = () => {
+ productLoading.value = true
+ // 妯℃嫙鍔犺浇浜у搧鏁版嵁
+ listPageCopy({size:-1}).then(res => {
+ if(res.code === 200){
+ productList.value = res.data.records
+ productLoading.value = false
+ }
+ })
+}
+
+const handleProductSelectionChange = (selection) => {
+ selectedProducts.value = selection
+}
+
+const handleConfirmProductSelection = () => {
+ if (selectedProducts.value.length === 0) {
+ ElMessage.warning('璇烽�夋嫨瑕佽绠楃殑浜у搧')
+ return
+ }
+
+ ElMessage.success(`姝e湪璁$畻 ${currentPlan.value.planName} 鐨勯噰璐渶姹�...`)
+ productSelectDialogVisible.value = false
+
+ // 鏍规嵁閫夋嫨鐨勪骇鍝佸拰璁$畻鍏紡杩涜璁$畻
+ calculateWithSelectedProducts()
+}
+
+const calculateWithSelectedProducts = () => {
+ // 妯℃嫙璁$畻杩囩▼
+ // 鏍规嵁閫夋嫨鐨勪骇鍝佹洿鏂拌绠楃粨鏋�
+ const result = selectedProducts.value.map(product => {
+ // 杩欓噷搴旇鏍规嵁瀹為檯鐨勮绠楀叕寮忚繘琛岃绠�
+ // 绀轰緥锛氶璁″嚭搴撴暟閲� - 鐜版湁搴撳瓨 + 瀹夊叏搴撳瓨 - 棰勮鍏ュ簱鏁伴噺
+ const weeklyNetDemand = product.inboundNum - product.inboundNum0 + product.inboundNum - product.inboundNum0
+ const suggestedPurchase = Math.max(0, weeklyNetDemand)
+
+ return {
+ productCategory: product.productCategory,
+ specificationModel: product.specificationModel,
+ inboundNum0: product.inboundNum0,
+ inboundNum: product.inboundNum,
+ weeklyNetDemand: weeklyNetDemand,
+ suggestedPurchase: suggestedPurchase
+ }
+ })
+
+ calculateResult.value = result
+ calculateDialogVisible.value = true
+}
+
+
+const handleCreatePurchaseOrder = () => {
+ calculateDialogVisible.value = false
+}
+const { proxy } = getCurrentInstance();
+const handleExport = () => {
+ ElMessageBox.confirm("鍐呭灏嗚瀵煎嚭锛屾槸鍚︾‘璁ゅ鍑猴紵", "瀵煎嚭", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ proxy.download("/procurementPlan/export", {}, "閲囪喘璁″垝.xlsx");
+ })
+ .catch(() => {
+ proxy.$modal.msg("宸插彇娑�");
+ });
+}
+
+
+const handleSizeChange = (size) => {
+ pagination.size = size
+ loadData()
+}
+
+const handleCurrentChange = (current) => {
+ pagination.current = current
+ loadData()
+}
+
+// 鐢熷懡鍛ㄦ湡
+onMounted(() => {
+ loadData()
+})
+</script>
+
+<style scoped>
+.app-container {
+ padding: 20px;
+}
+
+.page-header {
+ margin-bottom: 20px;
+}
+
+.page-header h2 {
+ margin: 0 0 8px 0;
+ color: #303133;
+ font-size: 24px;
+ font-weight: 600;
+}
+
+.page-header p {
+ margin: 0;
+ color: #909399;
+ font-size: 14px;
+}
+
+.search-card {
+ margin-bottom: 20px;
+}
+
+.search-form {
+ margin-bottom: 0;
+}
+
+.table-card {
+ margin-bottom: 20px;
+}
+
+.table-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+}
+
+.table-title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #303133;
+}
+
+.table-actions {
+ display: flex;
+ gap: 10px;
+}
+
+.pagination-container {
+ margin-top: 20px;
+ display: flex;
+ justify-content: end;
+}
+
+.form-container {
+ padding: 0 20px;
+}
+
+.formula-help {
+ margin-top: 5px;
+}
+
+.calculate-result {
+ padding: 20px 0;
+}
+
+.dialog-footer {
+ text-align: right;
+}
+
+:deep(.el-card__body) {
+ padding: 20px;
+}
+
+:deep(.el-table) {
+ font-size: 14px;
+}
+
+:deep(.el-form-item__label) {
+ font-weight: 500;
+}
+
+.form-container {
+ padding: 0;
+}
+
+.form-section {
+ margin-bottom: 24px;
+ border: 1px solid #e4e7ed;
+ border-radius: 6px;
+ overflow: hidden;
+}
+
+.section-title {
+ background-color: #f5f7fa;
+ padding: 12px 16px;
+ font-weight: 600;
+ color: #303133;
+ border-bottom: 1px solid #e4e7ed;
+}
+
+.form-section .el-form {
+ padding: 20px;
+}
+
+.param-tabs {
+ padding: 20px;
+}
+
+.param-tabs :deep(.el-tabs__header) {
+ margin-bottom: 20px;
+}
+
+.param-tabs :deep(.el-tabs__item.is-active) {
+ color: #f56c6c;
+ border-bottom-color: #f56c6c;
+}
+
+.checkbox-group {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 16px;
+}
+
+.checkbox-group .el-checkbox {
+ margin-right: 0;
+ margin-bottom: 8px;
+}
+
+.formula-input-section {
+ padding: 20px;
+}
+
+.formula-input-section .el-form-item {
+ margin-bottom: 12px;
+}
+
+.formula-help {
+ text-align: center;
+ margin-top: 8px;
+}
+</style>
--
Gitblit v1.9.3