From 5333935ae59999c47653122a669f4326f0173c1c Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期四, 08 一月 2026 14:47:02 +0800
Subject: [PATCH] 确认按钮在左边
---
src/views/collaborativeApproval/notificationManagement/summary/index.vue | 580
src/views/collaborativeApproval/rulesRegulationsManagement/index.vue | 1301 +-
src/views/productionManagement/workOrder/index.vue | 4
src/views/equipmentManagement/inspectionManagement/components/formDia.vue | 505
src/views/inventoryManagement/stockWarning/index.vue | 3
src/views/salesManagement/paymentShipping/index.vue | 772
src/views/productManagement/productIdentifier/index.vue | 1187 +-
src/views/collaborativeApproval/sealManagement/index.vue | 1292 +-
src/views/salesManagement/salespersonManagement/index.vue | 595
src/views/procurementManagement/procurementPlan/index.vue | 1173 +-
src/views/tool/gen/importTable.vue | 217
src/views/collaborativeApproval/planTemplate/index.vue | 1371 +-
src/views/collaborativeApproval/knowledgeBase/index.vue | 1369 +-
src/views/collaborativeApproval/attendanceManagement/index.vue | 2357 ++--
src/views/salesManagement/customerManagement/index.vue | 684
src/views/example/DynamicTableExample.vue | 574
src/views/equipmentManagement/spareParts/index.vue | 701
src/views/fileManagement/bookshelf/index.vue | 763
src/views/oaSystem/projectManagement/index.vue | 792
src/views/equipmentManagement/defectManagement/index.vue | 332
src/views/salesManagement/salesQuotation/index.vue | 1349 +-
src/components/QRCodeGenerator/index.vue | 859
src/views/productionManagement/productStructure/StructureEdit.vue | 465
src/views/oaSystem/projectManagement/components/taskTree.vue | 1505 +-
src/views/collaborativeApproval/notificationManagement/index.vue | 2218 ++--
src/views/collaborativeApproval/notificationManagement/meetPublish/index.vue | 575
src/views/oaSystem/projectManagement/components/milestoneList.vue | 466
src/views/salesManagement/orderManagement/index.vue | 783
src/views/collaborativeApproval/officeSupplies/index.vue | 863 +
src/views/collaborativeApproval/notificationManagement/meetDraft/index.vue | 769
src/views/collaborativeApproval/rpaManagement/index.vue | 678
src/views/oaSystem/projectManagement/projectDetail.vue | 868
32 files changed, 14,896 insertions(+), 13,074 deletions(-)
diff --git a/src/components/QRCodeGenerator/index.vue b/src/components/QRCodeGenerator/index.vue
index 1708130..fd44f44 100644
--- a/src/components/QRCodeGenerator/index.vue
+++ b/src/components/QRCodeGenerator/index.vue
@@ -1,70 +1,79 @@
<template>
<div class="qr-code-generator">
<!-- 浜岀淮鐮佺敓鎴愯〃鍗� -->
- <el-form :model="form" :rules="rules" ref="formRef" label-width="120px" class="qr-form">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="120px"
+ class="qr-form">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鏍囪瘑绫诲瀷" prop="type">
- <el-select v-model="form.type" placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷" style="width: 100%">
- <el-option label="浜岀淮鐮�" value="qrcode"></el-option>
- <el-option label="闃蹭吉鐮�" value="security"></el-option>
+ <el-form-item label="鏍囪瘑绫诲瀷"
+ prop="type">
+ <el-select v-model="form.type"
+ placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷"
+ style="width: 100%">
+ <el-option label="浜岀淮鐮�"
+ value="qrcode"></el-option>
+ <el-option label="闃蹭吉鐮�"
+ value="security"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鍐呭" prop="content">
- <el-input
- v-model="form.content"
- placeholder="璇疯緭鍏ヨ缂栫爜鐨勫唴瀹�"
- :type="form.type === 'security' ? 'textarea' : 'text'"
- :rows="form.type === 'security' ? 3 : 1"
- ></el-input>
+ <el-form-item label="鍐呭"
+ prop="content">
+ <el-input v-model="form.content"
+ placeholder="璇疯緭鍏ヨ缂栫爜鐨勫唴瀹�"
+ :type="form.type === 'security' ? 'textarea' : 'text'"
+ :rows="form.type === 'security' ? 3 : 1"></el-input>
</el-form-item>
</el-col>
</el-row>
-
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="灏哄" prop="size">
- <el-input-number
- v-model="form.size"
- :min="100"
- :max="500"
- :step="50"
- style="width: 100%"
- ></el-input-number>
+ <el-form-item label="灏哄"
+ prop="size">
+ <el-input-number v-model="form.size"
+ :min="100"
+ :max="500"
+ :step="50"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="杈硅窛" prop="margin">
- <el-input-number
- v-model="form.margin"
- :min="0"
- :max="10"
- :step="1"
- style="width: 100%"
- ></el-input-number>
+ <el-form-item label="杈硅窛"
+ prop="margin">
+ <el-input-number v-model="form.margin"
+ :min="0"
+ :max="10"
+ :step="1"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-col>
</el-row>
-
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鍓嶆櫙鑹�" prop="foregroundColor">
- <el-color-picker v-model="form.foregroundColor" style="width: 100%"></el-color-picker>
+ <el-form-item label="鍓嶆櫙鑹�"
+ prop="foregroundColor">
+ <el-color-picker v-model="form.foregroundColor"
+ style="width: 100%"></el-color-picker>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鑳屾櫙鑹�" prop="backgroundColor">
- <el-color-picker v-model="form.backgroundColor" style="width: 100%"></el-color-picker>
+ <el-form-item label="鑳屾櫙鑹�"
+ prop="backgroundColor">
+ <el-color-picker v-model="form.backgroundColor"
+ style="width: 100%"></el-color-picker>
</el-form-item>
</el-col>
</el-row>
-
<el-row :gutter="20">
<el-col :span="24">
<el-form-item>
- <el-button type="primary" @click="generateCode" :loading="generating">
+ <el-button type="primary"
+ @click="generateCode"
+ :loading="generating">
鐢熸垚{{ form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�' }}
</el-button>
<el-button @click="resetForm">閲嶇疆</el-button>
@@ -72,18 +81,17 @@
</el-col>
</el-row>
</el-form>
-
<!-- 鐢熸垚鐨勭爜鏄剧ず鍖哄煙 -->
- <div v-if="generatedCodeUrl" class="code-display">
+ <div v-if="generatedCodeUrl"
+ class="code-display">
<el-divider content-position="center">
{{ form.type === 'qrcode' ? '鐢熸垚鐨勪簩缁寸爜' : '鐢熸垚鐨勯槻浼爜' }}
</el-divider>
-
<div class="code-container">
<div class="code-image">
- <img :src="generatedCodeUrl" :alt="form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'" />
+ <img :src="generatedCodeUrl"
+ :alt="form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'" />
</div>
-
<div class="code-info">
<p><strong>鍐呭锛�</strong>{{ form.content }}</p>
<p><strong>绫诲瀷锛�</strong>{{ form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�' }}</p>
@@ -91,60 +99,71 @@
<p><strong>鐢熸垚鏃堕棿锛�</strong>{{ generateTime }}</p>
</div>
</div>
-
<div class="code-actions">
- <el-button type="success" @click="downloadCode" icon="Download">
+ <el-button type="success"
+ @click="downloadCode"
+ icon="Download">
涓嬭浇鍥剧墖
</el-button>
- <el-button type="primary" @click="copyToClipboard" icon="CopyDocument">
+ <el-button type="primary"
+ @click="copyToClipboard"
+ icon="CopyDocument">
澶嶅埗鍐呭
</el-button>
- <el-button @click="printCode" icon="Printer">
+ <el-button @click="printCode"
+ icon="Printer">
鎵撳嵃
</el-button>
</div>
</div>
-
<!-- 鎵归噺鐢熸垚瀵硅瘽妗� -->
- <el-dialog v-model="batchDialogVisible" title="鎵归噺鐢熸垚" width="600px">
- <el-form :model="batchForm" label-width="120px">
+ <el-dialog v-model="batchDialogVisible"
+ title="鎵归噺鐢熸垚"
+ width="600px">
+ <el-form :model="batchForm"
+ label-width="120px">
<el-form-item label="鐢熸垚鏁伴噺">
- <el-input-number v-model="batchForm.quantity" :min="1" :max="100" style="width: 100%"></el-input-number>
+ <el-input-number v-model="batchForm.quantity"
+ :min="1"
+ :max="100"
+ style="width: 100%"></el-input-number>
</el-form-item>
<el-form-item label="鍓嶇紑">
- <el-input v-model="batchForm.prefix" placeholder="璇疯緭鍏ュ墠缂�锛屽锛歅ROD_"></el-input>
+ <el-input v-model="batchForm.prefix"
+ placeholder="璇疯緭鍏ュ墠缂�锛屽锛歅ROD_"></el-input>
</el-form-item>
<el-form-item label="璧峰缂栧彿">
- <el-input-number v-model="batchForm.startNumber" :min="1" style="width: 100%"></el-input-number>
+ <el-input-number v-model="batchForm.startNumber"
+ :min="1"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-form>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="generateBatchCodes">寮�濮嬬敓鎴�</el-button>
<el-button @click="batchDialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="generateBatchCodes">寮�濮嬬敓鎴�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鎵归噺鐢熸垚缁撴灉 -->
- <div v-if="batchCodes.length > 0" class="batch-results">
+ <div v-if="batchCodes.length > 0"
+ class="batch-results">
<el-divider content-position="center">鎵归噺鐢熸垚缁撴灉</el-divider>
-
<div class="batch-grid">
- <div
- v-for="(code, index) in batchCodes"
- :key="index"
- class="batch-item"
- >
- <img :src="code.url" :alt="code.content" />
+ <div v-for="(code, index) in batchCodes"
+ :key="index"
+ class="batch-item">
+ <img :src="code.url"
+ :alt="code.content" />
<p class="batch-content">{{ code.content }}</p>
- <el-button size="small" @click="downloadSingleCode(code)">涓嬭浇</el-button>
+ <el-button size="small"
+ @click="downloadSingleCode(code)">涓嬭浇</el-button>
</div>
</div>
-
<div class="batch-actions">
- <el-button type="success" @click="downloadAllCodes">涓嬭浇鍏ㄩ儴</el-button>
+ <el-button type="success"
+ @click="downloadAllCodes">涓嬭浇鍏ㄩ儴</el-button>
<el-button @click="clearBatchCodes">娓呯┖缁撴灉</el-button>
</div>
</div>
@@ -152,390 +171,396 @@
</template>
<script setup>
-import { ref, reactive, computed, onMounted } from 'vue'
-import QRCode from 'qrcode'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Download, CopyDocument, Printer } from '@element-plus/icons-vue'
+ import { ref, reactive, computed, onMounted } from "vue";
+ import QRCode from "qrcode";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Download, CopyDocument, Printer } from "@element-plus/icons-vue";
-// 瀹氫箟缁勪欢鍚嶇О
-defineOptions({
- name: 'QRCodeGenerator'
-})
+ // 瀹氫箟缁勪欢鍚嶇О
+ defineOptions({
+ name: "QRCodeGenerator",
+ });
-// 琛ㄥ崟鏁版嵁
-const form = reactive({
- type: 'qrcode',
- content: '',
- size: 200,
- margin: 2,
- foregroundColor: '#000000',
- backgroundColor: '#FFFFFF'
-})
+ // 琛ㄥ崟鏁版嵁
+ const form = reactive({
+ type: "qrcode",
+ content: "",
+ size: 200,
+ margin: 2,
+ foregroundColor: "#000000",
+ backgroundColor: "#FFFFFF",
+ });
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- type: [{ required: true, message: '璇烽�夋嫨鏍囪瘑绫诲瀷', trigger: 'change' }],
- content: [{ required: true, message: '璇疯緭鍏ュ唴瀹�', trigger: 'blur' }]
-}
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ type: [{ required: true, message: "璇烽�夋嫨鏍囪瘑绫诲瀷", trigger: "change" }],
+ content: [{ required: true, message: "璇疯緭鍏ュ唴瀹�", trigger: "blur" }],
+ };
-// 鍝嶅簲寮忔暟鎹�
-const formRef = ref()
-const generating = ref(false)
-const generatedCodeUrl = ref('')
-const generateTime = ref('')
-const batchDialogVisible = ref(false)
-const batchForm = reactive({
- quantity: 10,
- prefix: '',
- startNumber: 1
-})
-const batchCodes = ref([])
+ // 鍝嶅簲寮忔暟鎹�
+ const formRef = ref();
+ const generating = ref(false);
+ const generatedCodeUrl = ref("");
+ const generateTime = ref("");
+ const batchDialogVisible = ref(false);
+ const batchForm = reactive({
+ quantity: 10,
+ prefix: "",
+ startNumber: 1,
+ });
+ const batchCodes = ref([]);
-// 鐢熸垚浜岀淮鐮佹垨闃蹭吉鐮�
-const generateCode = async () => {
- try {
- await formRef.value.validate()
-
- if (!form.content.trim()) {
- ElMessage.warning('璇疯緭鍏ヨ缂栫爜鐨勫唴瀹�')
- return
- }
-
- generating.value = true
-
- if (form.type === 'qrcode') {
- // 鐢熸垚浜岀淮鐮�
- generatedCodeUrl.value = await QRCode.toDataURL(form.content, {
- width: form.size,
- margin: form.margin,
- color: {
- dark: form.foregroundColor,
- light: form.backgroundColor
- },
- errorCorrectionLevel: 'M'
- })
- } else {
- // 鐢熸垚闃蹭吉鐮侊紙浣跨敤浜岀淮鐮佹妧鏈紝浣嗗唴瀹规牸寮忎笉鍚岋級
- const securityContent = generateSecurityCode(form.content)
- generatedCodeUrl.value = await QRCode.toDataURL(securityContent, {
- width: form.size,
- margin: form.margin,
- color: {
- dark: form.foregroundColor,
- light: form.backgroundColor
- },
- errorCorrectionLevel: 'H' // 闃蹭吉鐮佷娇鐢ㄦ渶楂樼籂閿欑骇鍒�
- })
- }
-
- generateTime.value = new Date().toLocaleString()
- ElMessage.success('鐢熸垚鎴愬姛锛�')
-
- } catch (error) {
- console.error('鐢熸垚澶辫触:', error)
- ElMessage.error('鐢熸垚澶辫触锛�' + error.message)
- } finally {
- generating.value = false
- }
-}
+ // 鐢熸垚浜岀淮鐮佹垨闃蹭吉鐮�
+ const generateCode = async () => {
+ try {
+ await formRef.value.validate();
-// 鐢熸垚闃蹭吉鐮佸唴瀹�
-const generateSecurityCode = (content) => {
- const timestamp = Date.now()
- const random = Math.random().toString(36).substr(2, 8)
- return `SEC_${content}_${timestamp}_${random}`
-}
+ if (!form.content.trim()) {
+ ElMessage.warning("璇疯緭鍏ヨ缂栫爜鐨勫唴瀹�");
+ return;
+ }
-// 涓嬭浇鐢熸垚鐨勭爜
-const downloadCode = () => {
- if (!generatedCodeUrl.value) {
- ElMessage.warning('璇峰厛鐢熸垚鐮�')
- return
- }
-
- const a = document.createElement('a')
- a.href = generatedCodeUrl.value
- a.download = `${form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'}_${new Date().getTime()}.png`
- document.body.appendChild(a)
- a.click()
- document.body.removeChild(a)
- ElMessage.success('涓嬭浇鎴愬姛锛�')
-}
+ generating.value = true;
-// 澶嶅埗鍐呭鍒板壀璐存澘
-const copyToClipboard = async () => {
- try {
- await navigator.clipboard.writeText(form.content)
- ElMessage.success('鍐呭宸插鍒跺埌鍓创鏉�')
- } catch (error) {
- // 闄嶇骇鏂规
- const textArea = document.createElement('textarea')
- textArea.value = form.content
- document.body.appendChild(textArea)
- textArea.select()
- document.execCommand('copy')
- document.body.removeChild(textArea)
- ElMessage.success('鍐呭宸插鍒跺埌鍓创鏉�')
- }
-}
-
-// 鎵撳嵃鐮�
-const printCode = () => {
- if (!generatedCodeUrl.value) {
- ElMessage.warning('璇峰厛鐢熸垚鐮�')
- return
- }
-
- const printWindow = window.open('', '_blank')
- printWindow.document.write(`
- <html>
- <head>
- <title>鎵撳嵃${form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'}</title>
- <style>
- body { text-align: center; padding: 20px; }
- img { max-width: 100%; height: auto; }
- .info { margin: 20px 0; }
- </style>
- </head>
- <body>
- <h2>${form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'}</h2>
- <img src="${generatedCodeUrl.value}" alt="${form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'}" />
- <div class="info">
- <p><strong>鍐呭锛�</strong>${form.content}</p>
- <p><strong>鐢熸垚鏃堕棿锛�</strong>${generateTime.value}</p>
- </div>
- </body>
- </html>
- `)
- printWindow.document.close()
- printWindow.print()
-}
-
-// 閲嶇疆琛ㄥ崟
-const resetForm = () => {
- formRef.value.resetFields()
- generatedCodeUrl.value = ''
- generateTime.value = ''
- batchCodes.value = []
-}
-
-// 鎵归噺鐢熸垚
-const generateBatchCodes = async () => {
- if (!batchForm.prefix.trim()) {
- ElMessage.warning('璇疯緭鍏ュ墠缂�')
- return
- }
-
- batchCodes.value = []
- generating.value = true
-
- try {
- for (let i = 0; i < batchForm.quantity; i++) {
- const number = batchForm.startNumber + i
- const content = `${batchForm.prefix}${number.toString().padStart(6, '0')}`
-
- let codeUrl
- if (form.type === 'qrcode') {
- codeUrl = await QRCode.toDataURL(content, {
+ if (form.type === "qrcode") {
+ // 鐢熸垚浜岀淮鐮�
+ generatedCodeUrl.value = await QRCode.toDataURL(form.content, {
width: form.size,
margin: form.margin,
color: {
dark: form.foregroundColor,
- light: form.backgroundColor
- }
- })
+ light: form.backgroundColor,
+ },
+ errorCorrectionLevel: "M",
+ });
} else {
- const securityContent = generateSecurityCode(content)
- codeUrl = await QRCode.toDataURL(securityContent, {
+ // 鐢熸垚闃蹭吉鐮侊紙浣跨敤浜岀淮鐮佹妧鏈紝浣嗗唴瀹规牸寮忎笉鍚岋級
+ const securityContent = generateSecurityCode(form.content);
+ generatedCodeUrl.value = await QRCode.toDataURL(securityContent, {
width: form.size,
margin: form.margin,
color: {
dark: form.foregroundColor,
- light: form.backgroundColor
- }
- })
+ light: form.backgroundColor,
+ },
+ errorCorrectionLevel: "H", // 闃蹭吉鐮佷娇鐢ㄦ渶楂樼籂閿欑骇鍒�
+ });
}
-
- batchCodes.value.push({
- content,
- url: codeUrl
- })
+
+ generateTime.value = new Date().toLocaleString();
+ ElMessage.success("鐢熸垚鎴愬姛锛�");
+ } catch (error) {
+ console.error("鐢熸垚澶辫触:", error);
+ ElMessage.error("鐢熸垚澶辫触锛�" + error.message);
+ } finally {
+ generating.value = false;
}
-
- ElMessage.success(`鎵归噺鐢熸垚瀹屾垚锛屽叡鐢熸垚 ${batchForm.quantity} 涓爜`)
- batchDialogVisible.value = false
-
- } catch (error) {
- console.error('鎵归噺鐢熸垚澶辫触:', error)
- ElMessage.error('鎵归噺鐢熸垚澶辫触锛�' + error.message)
- } finally {
- generating.value = false
- }
-}
+ };
-// 涓嬭浇鍗曚釜鎵归噺鐢熸垚鐨勭爜
-const downloadSingleCode = (code) => {
- const a = document.createElement('a')
- a.href = code.url
- a.download = `${code.content}.png`
- document.body.appendChild(a)
- a.click()
- document.body.removeChild(a)
-}
+ // 鐢熸垚闃蹭吉鐮佸唴瀹�
+ const generateSecurityCode = content => {
+ const timestamp = Date.now();
+ const random = Math.random().toString(36).substr(2, 8);
+ return `SEC_${content}_${timestamp}_${random}`;
+ };
-// 涓嬭浇鎵�鏈夋壒閲忕敓鎴愮殑鐮�
-const downloadAllCodes = async () => {
- if (batchCodes.value.length === 0) {
- ElMessage.warning('娌℃湁鍙笅杞界殑鐮�')
- return
- }
-
- try {
- // 浣跨敤JSZip鎵撳寘涓嬭浇
- const JSZip = await import('jszip')
- const zip = new JSZip.default()
-
- batchCodes.value.forEach((code, index) => {
- // 灏哹ase64杞崲涓篵lob
- const base64Data = code.url.split(',')[1]
- const byteCharacters = atob(base64Data)
- const byteNumbers = new Array(byteCharacters.length)
- for (let i = 0; i < byteCharacters.length; i++) {
- byteNumbers[i] = byteCharacters.charCodeAt(i)
+ // 涓嬭浇鐢熸垚鐨勭爜
+ const downloadCode = () => {
+ if (!generatedCodeUrl.value) {
+ ElMessage.warning("璇峰厛鐢熸垚鐮�");
+ return;
+ }
+
+ const a = document.createElement("a");
+ a.href = generatedCodeUrl.value;
+ a.download = `${
+ form.type === "qrcode" ? "浜岀淮鐮�" : "闃蹭吉鐮�"
+ }_${new Date().getTime()}.png`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ ElMessage.success("涓嬭浇鎴愬姛锛�");
+ };
+
+ // 澶嶅埗鍐呭鍒板壀璐存澘
+ const copyToClipboard = async () => {
+ try {
+ await navigator.clipboard.writeText(form.content);
+ ElMessage.success("鍐呭宸插鍒跺埌鍓创鏉�");
+ } catch (error) {
+ // 闄嶇骇鏂规
+ const textArea = document.createElement("textarea");
+ textArea.value = form.content;
+ document.body.appendChild(textArea);
+ textArea.select();
+ document.execCommand("copy");
+ document.body.removeChild(textArea);
+ ElMessage.success("鍐呭宸插鍒跺埌鍓创鏉�");
+ }
+ };
+
+ // 鎵撳嵃鐮�
+ const printCode = () => {
+ if (!generatedCodeUrl.value) {
+ ElMessage.warning("璇峰厛鐢熸垚鐮�");
+ return;
+ }
+
+ const printWindow = window.open("", "_blank");
+ printWindow.document.write(`
+ <html>
+ <head>
+ <title>鎵撳嵃${form.type === "qrcode" ? "浜岀淮鐮�" : "闃蹭吉鐮�"}</title>
+ <style>
+ body { text-align: center; padding: 20px; }
+ img { max-width: 100%; height: auto; }
+ .info { margin: 20px 0; }
+ </style>
+ </head>
+ <body>
+ <h2>${form.type === "qrcode" ? "浜岀淮鐮�" : "闃蹭吉鐮�"}</h2>
+ <img src="${generatedCodeUrl.value}" alt="${
+ form.type === "qrcode" ? "浜岀淮鐮�" : "闃蹭吉鐮�"
+ }" />
+ <div class="info">
+ <p><strong>鍐呭锛�</strong>${form.content}</p>
+ <p><strong>鐢熸垚鏃堕棿锛�</strong>${generateTime.value}</p>
+ </div>
+ </body>
+ </html>
+ `);
+ printWindow.document.close();
+ printWindow.print();
+ };
+
+ // 閲嶇疆琛ㄥ崟
+ const resetForm = () => {
+ formRef.value.resetFields();
+ generatedCodeUrl.value = "";
+ generateTime.value = "";
+ batchCodes.value = [];
+ };
+
+ // 鎵归噺鐢熸垚
+ const generateBatchCodes = async () => {
+ if (!batchForm.prefix.trim()) {
+ ElMessage.warning("璇疯緭鍏ュ墠缂�");
+ return;
+ }
+
+ batchCodes.value = [];
+ generating.value = true;
+
+ try {
+ for (let i = 0; i < batchForm.quantity; i++) {
+ const number = batchForm.startNumber + i;
+ const content = `${batchForm.prefix}${number
+ .toString()
+ .padStart(6, "0")}`;
+
+ let codeUrl;
+ if (form.type === "qrcode") {
+ codeUrl = await QRCode.toDataURL(content, {
+ width: form.size,
+ margin: form.margin,
+ color: {
+ dark: form.foregroundColor,
+ light: form.backgroundColor,
+ },
+ });
+ } else {
+ const securityContent = generateSecurityCode(content);
+ codeUrl = await QRCode.toDataURL(securityContent, {
+ width: form.size,
+ margin: form.margin,
+ color: {
+ dark: form.foregroundColor,
+ light: form.backgroundColor,
+ },
+ });
+ }
+
+ batchCodes.value.push({
+ content,
+ url: codeUrl,
+ });
}
- const byteArray = new Uint8Array(byteNumbers)
-
- zip.file(`${code.content}.png`, byteArray)
- })
-
- const content = await zip.generateAsync({ type: 'blob' })
- const a = document.createElement('a')
- a.href = URL.createObjectURL(content)
- a.download = `鎵归噺${form.type === 'qrcode' ? '浜岀淮鐮�' : '闃蹭吉鐮�'}_${new Date().getTime()}.zip`
- document.body.appendChild(a)
- a.click()
- document.body.removeChild(a)
- URL.revokeObjectURL(a.href)
-
- ElMessage.success('鎵归噺涓嬭浇瀹屾垚锛�')
- } catch (error) {
- console.error('鎵归噺涓嬭浇澶辫触:', error)
- ElMessage.error('鎵归噺涓嬭浇澶辫触锛岃閫愪釜涓嬭浇')
- }
-}
-// 娓呯┖鎵归噺鐢熸垚缁撴灉
-const clearBatchCodes = () => {
- batchCodes.value = []
-}
+ ElMessage.success(`鎵归噺鐢熸垚瀹屾垚锛屽叡鐢熸垚 ${batchForm.quantity} 涓爜`);
+ batchDialogVisible.value = false;
+ } catch (error) {
+ console.error("鎵归噺鐢熸垚澶辫触:", error);
+ ElMessage.error("鎵归噺鐢熸垚澶辫触锛�" + error.message);
+ } finally {
+ generating.value = false;
+ }
+ };
-// 鏆撮湶鏂规硶缁欑埗缁勪欢
-defineExpose({
- generateCode,
- downloadCode,
- resetForm,
- form
-})
+ // 涓嬭浇鍗曚釜鎵归噺鐢熸垚鐨勭爜
+ const downloadSingleCode = code => {
+ const a = document.createElement("a");
+ a.href = code.url;
+ a.download = `${code.content}.png`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ };
+
+ // 涓嬭浇鎵�鏈夋壒閲忕敓鎴愮殑鐮�
+ const downloadAllCodes = async () => {
+ if (batchCodes.value.length === 0) {
+ ElMessage.warning("娌℃湁鍙笅杞界殑鐮�");
+ return;
+ }
+
+ try {
+ // 浣跨敤JSZip鎵撳寘涓嬭浇
+ const JSZip = await import("jszip");
+ const zip = new JSZip.default();
+
+ batchCodes.value.forEach((code, index) => {
+ // 灏哹ase64杞崲涓篵lob
+ const base64Data = code.url.split(",")[1];
+ const byteCharacters = atob(base64Data);
+ const byteNumbers = new Array(byteCharacters.length);
+ for (let i = 0; i < byteCharacters.length; i++) {
+ byteNumbers[i] = byteCharacters.charCodeAt(i);
+ }
+ const byteArray = new Uint8Array(byteNumbers);
+
+ zip.file(`${code.content}.png`, byteArray);
+ });
+
+ const content = await zip.generateAsync({ type: "blob" });
+ const a = document.createElement("a");
+ a.href = URL.createObjectURL(content);
+ a.download = `鎵归噺${
+ form.type === "qrcode" ? "浜岀淮鐮�" : "闃蹭吉鐮�"
+ }_${new Date().getTime()}.zip`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ URL.revokeObjectURL(a.href);
+
+ ElMessage.success("鎵归噺涓嬭浇瀹屾垚锛�");
+ } catch (error) {
+ console.error("鎵归噺涓嬭浇澶辫触:", error);
+ ElMessage.error("鎵归噺涓嬭浇澶辫触锛岃閫愪釜涓嬭浇");
+ }
+ };
+
+ // 娓呯┖鎵归噺鐢熸垚缁撴灉
+ const clearBatchCodes = () => {
+ batchCodes.value = [];
+ };
+
+ // 鏆撮湶鏂规硶缁欑埗缁勪欢
+ defineExpose({
+ generateCode,
+ downloadCode,
+ resetForm,
+ form,
+ });
</script>
<style scoped>
-.qr-code-generator {
- padding: 20px;
-}
+ .qr-code-generator {
+ padding: 20px;
+ }
-.qr-form {
- background: #f8f9fa;
- padding: 20px;
- border-radius: 8px;
- margin-bottom: 20px;
-}
+ .qr-form {
+ background: #f8f9fa;
+ padding: 20px;
+ border-radius: 8px;
+ margin-bottom: 20px;
+ }
-.code-display {
- margin-top: 30px;
-}
+ .code-display {
+ margin-top: 30px;
+ }
-.code-container {
- display: flex;
- justify-content: center;
- align-items: flex-start;
- gap: 40px;
- margin: 20px 0;
-}
-
-.code-image img {
- border: 2px solid #e0e0e0;
- border-radius: 8px;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-
-.code-info {
- text-align: left;
- min-width: 200px;
-}
-
-.code-info p {
- margin: 8px 0;
- color: #666;
-}
-
-.code-actions {
- text-align: center;
- margin: 20px 0;
-}
-
-.code-actions .el-button {
- margin: 0 10px;
-}
-
-.batch-results {
- margin-top: 30px;
-}
-
-.batch-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
- gap: 20px;
- margin: 20px 0;
-}
-
-.batch-item {
- text-align: center;
- padding: 15px;
- border: 1px solid #e0e0e0;
- border-radius: 8px;
- background: #fff;
-}
-
-.batch-item img {
- width: 100px;
- height: 100px;
- margin-bottom: 10px;
-}
-
-.batch-content {
- font-size: 12px;
- color: #666;
- margin: 10px 0;
- word-break: break-all;
-}
-
-.batch-actions {
- text-align: center;
- margin: 20px 0;
-}
-
-.batch-actions .el-button {
- margin: 0 10px;
-}
-
-@media (max-width: 768px) {
.code-container {
- flex-direction: column;
- align-items: center;
+ display: flex;
+ justify-content: center;
+ align-items: flex-start;
+ gap: 40px;
+ margin: 20px 0;
}
-
+
+ .code-image img {
+ border: 2px solid #e0e0e0;
+ border-radius: 8px;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+ }
+
+ .code-info {
+ text-align: left;
+ min-width: 200px;
+ }
+
+ .code-info p {
+ margin: 8px 0;
+ color: #666;
+ }
+
+ .code-actions {
+ text-align: center;
+ margin: 20px 0;
+ }
+
+ .code-actions .el-button {
+ margin: 0 10px;
+ }
+
+ .batch-results {
+ margin-top: 30px;
+ }
+
.batch-grid {
- grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+ gap: 20px;
+ margin: 20px 0;
}
-}
+
+ .batch-item {
+ text-align: center;
+ padding: 15px;
+ border: 1px solid #e0e0e0;
+ border-radius: 8px;
+ background: #fff;
+ }
+
+ .batch-item img {
+ width: 100px;
+ height: 100px;
+ margin-bottom: 10px;
+ }
+
+ .batch-content {
+ font-size: 12px;
+ color: #666;
+ margin: 10px 0;
+ word-break: break-all;
+ }
+
+ .batch-actions {
+ text-align: center;
+ margin: 20px 0;
+ }
+
+ .batch-actions .el-button {
+ margin: 0 10px;
+ }
+
+ @media (max-width: 768px) {
+ .code-container {
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .batch-grid {
+ grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
+ }
+ }
</style>
diff --git a/src/views/collaborativeApproval/attendanceManagement/index.vue b/src/views/collaborativeApproval/attendanceManagement/index.vue
index f6a3e3c..97dd549 100644
--- a/src/views/collaborativeApproval/attendanceManagement/index.vue
+++ b/src/views/collaborativeApproval/attendanceManagement/index.vue
@@ -1,310 +1,419 @@
<template>
<div class="app-container">
- <el-tabs v-model="activeTab" type="border-card">
+ <el-tabs v-model="activeTab"
+ type="border-card">
<!-- 鍋囨湡璁剧疆 -->
- <el-tab-pane label="鍋囨湡璁剧疆" name="holiday">
+ <el-tab-pane label="鍋囨湡璁剧疆"
+ name="holiday">
<div class="tab-content">
- <el-button type="primary" @click="openDialog('holiday', 'add')">鏂板鍋囨湡</el-button>
-
- <el-table :data="holidayData" border style="width: 100%; margin-top: 20px;">
- <el-table-column prop="name" label="鍋囨湡鍚嶇О" />
- <el-table-column prop="type" label="鍋囨湡绫诲瀷">
+ <el-button type="primary"
+ @click="openDialog('holiday', 'add')">鏂板鍋囨湡</el-button>
+ <el-table :data="holidayData"
+ border
+ style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name"
+ label="鍋囨湡鍚嶇О" />
+ <el-table-column prop="type"
+ label="鍋囨湡绫诲瀷">
<template #default="scope">
<el-tag :type="getTagType(scope.row.type)">{{ getTypeLabel(scope.row.type) }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="startDate" label="寮�濮嬫棩鏈�" />
- <el-table-column prop="endDate" label="缁撴潫鏃ユ湡" />
- <el-table-column prop="days" label="澶╂暟" align="center" />
- <el-table-column prop="status" label="鐘舵��" >
+ <el-table-column prop="startDate"
+ label="寮�濮嬫棩鏈�" />
+ <el-table-column prop="endDate"
+ label="缁撴潫鏃ユ湡" />
+ <el-table-column prop="days"
+ label="澶╂暟"
+ align="center" />
+ <el-table-column prop="status"
+ label="鐘舵��">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" size="small" @click="openDialog('holiday', 'edit', scope.row)">缂栬緫</el-button>
- <el-button type="danger" size="small" @click="deleteItem('holiday', scope.row)">鍒犻櫎</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="openDialog('holiday', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger"
+ size="small"
+ @click="deleteItem('holiday', scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
-
<!-- 骞村亣璁剧疆 -->
- <el-tab-pane label="骞村亣璁剧疆" name="annual">
+ <el-tab-pane label="骞村亣璁剧疆"
+ name="annual">
<div class="tab-content">
- <el-button type="primary" @click="openDialog('annual', 'add')">鏂板骞村亣瑙勫垯</el-button>
-
- <el-table :data="annualData" border style="width: 100%; margin-top: 20px;">
- <el-table-column prop="employeeType" label="鍛樺伐绫诲瀷">
+ <el-button type="primary"
+ @click="openDialog('annual', 'add')">鏂板骞村亣瑙勫垯</el-button>
+ <el-table :data="annualData"
+ border
+ style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="employeeType"
+ label="鍛樺伐绫诲瀷">
<template #default="scope">
<el-tag :type="getTagType(scope.row.employeeType)">{{ getTypeLabel(scope.row.employeeType) }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="workYears" label="宸ヤ綔骞撮檺" />
- <el-table-column prop="annualDays" label="骞村亣澶╂暟" align="center" />
- <el-table-column prop="maxCarryOver" label="鏈�澶х粨杞ぉ鏁�" align="center" />
- <el-table-column prop="status" label="鐘舵��">
+ <el-table-column prop="workYears"
+ label="宸ヤ綔骞撮檺" />
+ <el-table-column prop="annualDays"
+ label="骞村亣澶╂暟"
+ align="center" />
+ <el-table-column prop="maxCarryOver"
+ label="鏈�澶х粨杞ぉ鏁�"
+ align="center" />
+ <el-table-column prop="status"
+ label="鐘舵��">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" size="small" @click="openDialog('annual', 'edit', scope.row)">缂栬緫</el-button>
- <el-button type="danger" size="small" @click="deleteItem('annual', scope.row)">鍒犻櫎</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="openDialog('annual', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger"
+ size="small"
+ @click="deleteItem('annual', scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
-
<!-- 鍔犵彮璁剧疆 -->
- <el-tab-pane label="鍔犵彮璁剧疆" name="overtime">
+ <el-tab-pane label="鍔犵彮璁剧疆"
+ name="overtime">
<div class="tab-content">
- <el-button type="primary" @click="openDialog('overtime', 'add')">鏂板鍔犵彮瑙勫垯</el-button>
-
- <el-table :data="overtimeData" border style="width: 100%; margin-top: 20px;">
- <el-table-column prop="name" label="瑙勫垯鍚嶇О" />
- <el-table-column prop="type" label="鍔犵彮绫诲瀷" >
+ <el-button type="primary"
+ @click="openDialog('overtime', 'add')">鏂板鍔犵彮瑙勫垯</el-button>
+ <el-table :data="overtimeData"
+ border
+ style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name"
+ label="瑙勫垯鍚嶇О" />
+ <el-table-column prop="type"
+ label="鍔犵彮绫诲瀷">
<template #default="scope">
<el-tag :type="getTagType(scope.row.type)">{{ getTypeLabel(scope.row.type) }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="startTime" label="寮�濮嬫椂闂�" />
- <el-table-column prop="endTime" label="缁撴潫鏃堕棿" />
- <el-table-column prop="rate" label="鍊嶇巼" align="center" />
- <el-table-column prop="status" label="鐘舵��" >
+ <el-table-column prop="startTime"
+ label="寮�濮嬫椂闂�" />
+ <el-table-column prop="endTime"
+ label="缁撴潫鏃堕棿" />
+ <el-table-column prop="rate"
+ label="鍊嶇巼"
+ align="center" />
+ <el-table-column prop="status"
+ label="鐘舵��">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" size="small" @click="openDialog('overtime', 'edit', scope.row)">缂栬緫</el-button>
- <el-button type="danger" size="small" @click="deleteItem('overtime', scope.row)">鍒犻櫎</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="openDialog('overtime', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger"
+ size="small"
+ @click="deleteItem('overtime', scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
-
<!-- 涓婄彮鏃堕棿璁剧疆 -->
- <el-tab-pane label="涓婄彮鏃堕棿璁剧疆" name="worktime">
+ <el-tab-pane label="涓婄彮鏃堕棿璁剧疆"
+ name="worktime">
<div class="tab-content">
- <el-button type="primary" @click="openDialog('worktime', 'add')">鏂板鏃堕棿娈�</el-button>
-
- <el-table :data="worktimeData" border style="width: 100%; margin-top: 20px;">
- <el-table-column prop="name" label="鏃堕棿娈靛悕绉�" />
- <el-table-column prop="startTime" label="涓婄彮鏃堕棿"/>
- <el-table-column prop="endTime" label="涓嬬彮鏃堕棿" />
- <el-table-column prop="flexibleStart" label="寮规�т笂鐝�">
+ <el-button type="primary"
+ @click="openDialog('worktime', 'add')">鏂板鏃堕棿娈�</el-button>
+ <el-table :data="worktimeData"
+ border
+ style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name"
+ label="鏃堕棿娈靛悕绉�" />
+ <el-table-column prop="startTime"
+ label="涓婄彮鏃堕棿" />
+ <el-table-column prop="endTime"
+ label="涓嬬彮鏃堕棿" />
+ <el-table-column prop="flexibleStart"
+ label="寮规�т笂鐝�">
<template #default="scope">
<el-tag :type="scope.row.flexibleStart === 'true' ? 'success' : 'info'">
{{ scope.row.flexibleStart === 'true' ? '鏄�' : '鍚�' }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="flexibleMinutes" label="寮规�ф椂闂�(鍒嗛挓)" width="120" align="center" />
- <el-table-column prop="status" label="鐘舵��" >
+ <el-table-column prop="flexibleMinutes"
+ label="寮规�ф椂闂�(鍒嗛挓)"
+ width="120"
+ align="center" />
+ <el-table-column prop="status"
+ label="鐘舵��">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" size="small" @click="openDialog('worktime', 'edit', scope.row)">缂栬緫</el-button>
- <el-button type="danger" size="small" @click="deleteItem('worktime', scope.row)">鍒犻櫎</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="openDialog('worktime', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger"
+ size="small"
+ @click="deleteItem('worktime', scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
-
<!-- 鎵撳崱璁板綍 -->
- <el-tab-pane label="鎵撳崱璁板綍" name="attendance">
+ <el-tab-pane label="鎵撳崱璁板綍"
+ name="attendance">
<div class="tab-content">
<div style="margin-bottom: 20px;">
- <el-date-picker
- v-model="attendanceDate"
- type="date"
- placeholder="閫夋嫨鏃ユ湡"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- style="margin-right: 10px;"
- @change="filterAttendanceData"
- />
- <el-select
- v-model="attendanceStatus"
- placeholder="閫夋嫨鐘舵��"
- style="width: 120px; margin-right: 10px;"
- @change="filterAttendanceData"
- >
- <el-option label="鍏ㄩ儴" value="" />
- <el-option label="姝ｅ父" value="normal" />
- <el-option label="杩熷埌" value="late" />
- <el-option label="鏃╅��" value="early" />
- <el-option label="缂哄嫟" value="absent" />
+ <el-date-picker v-model="attendanceDate"
+ type="date"
+ placeholder="閫夋嫨鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ style="margin-right: 10px;"
+ @change="filterAttendanceData" />
+ <el-select v-model="attendanceStatus"
+ placeholder="閫夋嫨鐘舵��"
+ style="width: 120px; margin-right: 10px;"
+ @change="filterAttendanceData">
+ <el-option label="鍏ㄩ儴"
+ value="" />
+ <el-option label="姝ｅ父"
+ value="normal" />
+ <el-option label="杩熷埌"
+ value="late" />
+ <el-option label="鏃╅��"
+ value="early" />
+ <el-option label="缂哄嫟"
+ value="absent" />
</el-select>
- <el-button type="primary" @click="exportAttendance">瀵煎嚭璁板綍</el-button>
+ <el-button type="primary"
+ @click="exportAttendance">瀵煎嚭璁板綍</el-button>
</div>
-
- <el-table :data="filteredAttendanceData" border style="width: 100%;">
- <el-table-column prop="employeeName" label="鍛樺伐濮撳悕" width="120" />
- <el-table-column prop="department" label="閮ㄩ棬" width="120" />
- <el-table-column prop="date" label="鏃ユ湡" width="120" />
- <el-table-column prop="clockInTime" label="涓婄彮鎵撳崱" width="120" />
- <el-table-column prop="clockOutTime" label="涓嬬彮鎵撳崱" width="120" />
- <el-table-column prop="workHours" label="宸ヤ綔鏃堕暱" width="100" align="center" />
- <el-table-column prop="status" label="鐘舵��" width="100" align="center">
+ <el-table :data="filteredAttendanceData"
+ border
+ style="width: 100%;">
+ <el-table-column prop="employeeName"
+ label="鍛樺伐濮撳悕"
+ width="120" />
+ <el-table-column prop="department"
+ label="閮ㄩ棬"
+ width="120" />
+ <el-table-column prop="date"
+ label="鏃ユ湡"
+ width="120" />
+ <el-table-column prop="clockInTime"
+ label="涓婄彮鎵撳崱"
+ width="120" />
+ <el-table-column prop="clockOutTime"
+ label="涓嬬彮鎵撳崱"
+ width="120" />
+ <el-table-column prop="workHours"
+ label="宸ヤ綔鏃堕暱"
+ width="100"
+ align="center" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100"
+ align="center">
<template #default="scope">
<el-tag :type="getAttendanceTagType(scope.row.status)">{{ getAttendanceStatusLabel(scope.row.status) }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="location" label="鎵撳崱鍦扮偣" width="150" />
- <el-table-column prop="remark" label="澶囨敞" min-width="150" />
+ <el-table-column prop="location"
+ label="鎵撳崱鍦扮偣"
+ width="150" />
+ <el-table-column prop="remark"
+ label="澶囨敞"
+ min-width="150" />
</el-table>
</div>
</el-tab-pane>
</el-tabs>
-
<!-- 閫氱敤寮圭獥 -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px">
- <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
- <el-form-item label="鍚嶇О" prop="name" v-if="currentType !== 'annual'">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�" />
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="600px">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="100px">
+ <el-form-item label="鍚嶇О"
+ prop="name"
+ v-if="currentType !== 'annual'">
+ <el-input v-model="form.name"
+ placeholder="璇疯緭鍏ュ悕绉�" />
</el-form-item>
-
- <el-form-item label="绫诲瀷" prop="type" v-if="currentType === 'holiday' || currentType === 'overtime'">
- <el-select v-model="form.type" placeholder="璇烽�夋嫨绫诲瀷" style="width: 100%">
- <el-option
- v-for="option in getTypeOptions()"
- :key="option.value"
- :label="option.label"
- :value="option.value"
- />
+ <el-form-item label="绫诲瀷"
+ prop="type"
+ v-if="currentType === 'holiday' || currentType === 'overtime'">
+ <el-select v-model="form.type"
+ placeholder="璇烽�夋嫨绫诲瀷"
+ style="width: 100%">
+ <el-option v-for="option in getTypeOptions()"
+ :key="option.value"
+ :label="option.label"
+ :value="option.value" />
</el-select>
</el-form-item>
-
- <el-form-item label="鍛樺伐绫诲瀷" prop="employeeType" v-if="currentType === 'annual'">
- <el-select v-model="form.employeeType" placeholder="璇烽�夋嫨鍛樺伐绫诲瀷" style="width: 100%">
+ <el-form-item label="鍛樺伐绫诲瀷"
+ prop="employeeType"
+ v-if="currentType === 'annual'">
+ <el-select v-model="form.employeeType"
+ placeholder="璇烽�夋嫨鍛樺伐绫诲瀷"
+ style="width: 100%">
<!-- <el-option label="姝ｅ紡鍛樺伐" value="regular" />
<el-option label="璇曠敤鏈熷憳宸�" value="probation" />
<el-option label="瀹炰範鐢�" value="intern" /> -->
- <el-option
- v-for="option in getTypeOptions()"
- :key="option.value"
- :label="option.label"
- :value="option.value"
- />
+ <el-option v-for="option in getTypeOptions()"
+ :key="option.value"
+ :label="option.label"
+ :value="option.value" />
</el-select>
</el-form-item>
-
- <el-form-item label="宸ヤ綔骞撮檺" prop="workYears" v-if="currentType === 'annual'">
- <el-input v-model="form.workYears" placeholder="濡傦細1-3骞淬��3-5骞寸瓑" />
+ <el-form-item label="宸ヤ綔骞撮檺"
+ prop="workYears"
+ v-if="currentType === 'annual'">
+ <el-input v-model="form.workYears"
+ placeholder="濡傦細1-3骞淬��3-5骞寸瓑" />
</el-form-item>
-
- <el-form-item label="骞村亣澶╂暟" prop="annualDays" v-if="currentType === 'annual'">
- <el-input-number v-model="form.annualDays" :min="0" :max="365" style="width: 100%" />
+ <el-form-item label="骞村亣澶╂暟"
+ prop="annualDays"
+ v-if="currentType === 'annual'">
+ <el-input-number v-model="form.annualDays"
+ :min="0"
+ :max="365"
+ style="width: 100%" />
</el-form-item>
-
- <el-form-item label="鏈�澶х粨杞ぉ鏁�" prop="maxCarryOver" v-if="currentType === 'annual'">
- <el-input-number v-model="form.maxCarryOver" :min="0" :max="30" style="width: 100%" />
+ <el-form-item label="鏈�澶х粨杞ぉ鏁�"
+ prop="maxCarryOver"
+ v-if="currentType === 'annual'">
+ <el-input-number v-model="form.maxCarryOver"
+ :min="0"
+ :max="30"
+ style="width: 100%" />
</el-form-item>
-
- <el-form-item label="鏃ユ湡鑼冨洿" prop="dateRange" v-if="currentType === 'holiday'">
- <el-date-picker
- v-model="form.dateRange"
- type="daterange"
- range-separator="鑷�"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- style="width: 100%"
- @change="calculateDays"
- />
- </el-form-item>
-
- <el-form-item label="澶╂暟" prop="days" v-if="currentType === 'holiday'">
- <el-input-number v-model="form.days" :min="0" style="width: 100%" />
+ <el-form-item label="鏃ユ湡鑼冨洿"
+ prop="dateRange"
+ v-if="currentType === 'holiday'">
+ <el-date-picker v-model="form.dateRange"
+ type="daterange"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ style="width: 100%"
+ @change="calculateDays" />
</el-form-item>
-
- <el-form-item label="寮�濮嬫椂闂�" prop="startTime" v-if="currentType === 'overtime'">
- <el-time-picker
- v-model="form.startTime"
- placeholder="寮�濮嬫椂闂�"
- format="HH:mm"
- value-format="HH:mm"
- style="width: 100%"
- @change="validateTimeField('startTime')"
- />
- </el-form-item>
-
- <el-form-item label="缁撴潫鏃堕棿" prop="endTime" v-if="currentType === 'overtime'">
- <el-time-picker
- v-model="form.endTime"
- placeholder="缁撴潫鏃堕棿"
- format="HH:mm"
- value-format="HH:mm"
- style="width: 100%"
- @change="validateTimeField('endTime')"
- />
- </el-form-item>
-
- <el-form-item label="鍊嶇巼" prop="rate" v-if="currentType === 'overtime'">
- <el-input-number v-model="form.rate" :min="1" :max="3" :step="0.5" style="width: 100%" />
+ <el-form-item label="澶╂暟"
+ prop="days"
+ v-if="currentType === 'holiday'">
+ <el-input-number v-model="form.days"
+ :min="0"
+ style="width: 100%" />
</el-form-item>
-
- <el-form-item label="涓婄彮鏃堕棿" prop="workStartTime" v-if="currentType === 'worktime'">
- <el-time-picker
- v-model="form.workStartTime"
- placeholder="涓婄彮鏃堕棿"
- format="HH:mm"
- value-format="HH:mm"
- style="width: 100%"
- @change="validateTimeField('workStartTime')"
- />
- </el-form-item>
-
- <el-form-item label="涓嬬彮鏃堕棿" prop="workEndTime" v-if="currentType === 'worktime'">
- <el-time-picker
- v-model="form.workEndTime"
- placeholder="涓嬬彮鏃堕棿"
- format="HH:mm"
- value-format="HH:mm"
- style="width: 100%"
- @change="validateTimeField('workEndTime')"
- />
- </el-form-item>
-
- <el-form-item label="寮规�т笂鐝�" prop="flexibleStart" v-if="currentType === 'worktime'">
+ <el-form-item label="寮�濮嬫椂闂�"
+ prop="startTime"
+ v-if="currentType === 'overtime'">
+ <el-time-picker v-model="form.startTime"
+ placeholder="寮�濮嬫椂闂�"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('startTime')" />
+ </el-form-item>
+ <el-form-item label="缁撴潫鏃堕棿"
+ prop="endTime"
+ v-if="currentType === 'overtime'">
+ <el-time-picker v-model="form.endTime"
+ placeholder="缁撴潫鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('endTime')" />
+ </el-form-item>
+ <el-form-item label="鍊嶇巼"
+ prop="rate"
+ v-if="currentType === 'overtime'">
+ <el-input-number v-model="form.rate"
+ :min="1"
+ :max="3"
+ :step="0.5"
+ style="width: 100%" />
+ </el-form-item>
+ <el-form-item label="涓婄彮鏃堕棿"
+ prop="workStartTime"
+ v-if="currentType === 'worktime'">
+ <el-time-picker v-model="form.workStartTime"
+ placeholder="涓婄彮鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('workStartTime')" />
+ </el-form-item>
+ <el-form-item label="涓嬬彮鏃堕棿"
+ prop="workEndTime"
+ v-if="currentType === 'worktime'">
+ <el-time-picker v-model="form.workEndTime"
+ placeholder="涓嬬彮鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('workEndTime')" />
+ </el-form-item>
+ <el-form-item label="寮规�т笂鐝�"
+ prop="flexibleStart"
+ v-if="currentType === 'worktime'">
<el-switch v-model="form.flexibleStart" />
</el-form-item>
-
- <el-form-item label="寮规�ф椂闂�(鍒嗛挓)" prop="flexibleMinutes" v-if="currentType === 'worktime' && form.flexibleStart">
- <el-input-number v-model="form.flexibleMinutes" :min="0" :max="120" style="width: 100%" />
+ <el-form-item label="寮规�ф椂闂�(鍒嗛挓)"
+ prop="flexibleMinutes"
+ v-if="currentType === 'worktime' && form.flexibleStart">
+ <el-input-number v-model="form.flexibleMinutes"
+ :min="0"
+ :max="120"
+ style="width: 100%" />
</el-form-item>
-
- <el-form-item label="鐘舵��" prop="status">
- <el-radio-group v-model="form.status">
- <el-radio value="active">鍚敤</el-radio>
- <el-radio value="inactive">鍋滅敤</el-radio>
- </el-radio-group>
- </el-form-item>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-radio-group v-model="form.status">
+ <el-radio value="active">鍚敤</el-radio>
+ <el-radio value="inactive">鍋滅敤</el-radio>
+ </el-radio-group>
+ </el-form-item>
</el-form>
-
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</span>
</template>
</el-dialog>
@@ -312,933 +421,1001 @@
</template>
<script setup>
-import { ref, reactive, onMounted, onUnmounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { listHolidaySettings, addHolidaySettings, updateHolidaySettings, delHolidaySettings, listAnnualLeaveSettingList, addAnnualLeaveSetting, updateAnnualLeaveSetting, delAnnualLeaveSetting, listOvertimeSettingList, addOvertimeSetting, updateOvertimeSetting, delOvertimeSetting, listWorkingHoursSettingList, addWorkingHoursSetting, updateWorkingHoursSetting, delWorkingHoursSetting } from '@/api/collaborativeApproval/attendanceManagement.js'
+ import { ref, reactive, onMounted, onUnmounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import {
+ listHolidaySettings,
+ addHolidaySettings,
+ updateHolidaySettings,
+ delHolidaySettings,
+ listAnnualLeaveSettingList,
+ addAnnualLeaveSetting,
+ updateAnnualLeaveSetting,
+ delAnnualLeaveSetting,
+ listOvertimeSettingList,
+ addOvertimeSetting,
+ updateOvertimeSetting,
+ delOvertimeSetting,
+ listWorkingHoursSettingList,
+ addWorkingHoursSetting,
+ updateWorkingHoursSetting,
+ delWorkingHoursSetting,
+ } from "@/api/collaborativeApproval/attendanceManagement.js";
-// 褰撳墠婵�娲荤殑鏍囩椤�
-const activeTab = ref('holiday')
+ // 褰撳墠婵�娲荤殑鏍囩椤�
+ const activeTab = ref("holiday");
-// 寮圭獥鐩稿叧
-const dialogVisible = ref(false)
-const dialogTitle = ref('')
-const currentType = ref('')
-const currentAction = ref('')
-const currentEditId = ref('')
-const formRef = ref()
-const page = {
+ // 寮圭獥鐩稿叧
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("");
+ const currentType = ref("");
+ const currentAction = ref("");
+ const currentEditId = ref("");
+ const formRef = ref();
+ const page = {
current: 1,
size: 20,
total: 0,
- }
-const holidayData = ref([])
-const annualData = ref([])
-const overtimeData = ref([])
-const worktimeData = ref([])
+ };
+ const holidayData = ref([]);
+ const annualData = ref([]);
+ const overtimeData = ref([]);
+ const worktimeData = ref([]);
-// 鎵撳崱璁板綍鐩稿叧鏁版嵁
-const attendanceData = ref([])
-const filteredAttendanceData = ref([])
-const attendanceDate = ref('')
-const attendanceStatus = ref('')
+ // 鎵撳崱璁板綍鐩稿叧鏁版嵁
+ const attendanceData = ref([]);
+ const filteredAttendanceData = ref([]);
+ const attendanceDate = ref("");
+ const attendanceStatus = ref("");
-// 琛ㄥ崟鏁版嵁
-const form = reactive({
- name: '',
- type: '',
- dateRange: [],
- startDate: '',
- endDate: '',
- days: 0,
- employeeType: '',
- workYears: '',
- annualDays: 0,
- maxCarryOver: 0,
- startTime: '', // 鍔犵彮寮�濮嬫椂闂�
- endTime: '', // 鍔犵彮缁撴潫鏃堕棿
- workStartTime: '', // 涓婄彮鏃堕棿
- workEndTime: '', // 涓嬬彮鏃堕棿
- rate: 1.5,
- flexibleStart: false,
- flexibleMinutes: 30,
- status: 'active'
-})
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- name: [{ required: true, message: '璇疯緭鍏ュ悕绉�', trigger: 'blur' }],
- type: [{ required: true, message: '璇烽�夋嫨绫诲瀷', trigger: 'change' }],
- dateRange: [{ required: true, message: '璇烽�夋嫨鏃ユ湡鑼冨洿', trigger: 'change' }],
- days: [{ required: true, message: '璇疯緭鍏ュぉ鏁�', trigger: 'blur' }],
- employeeType: [{ required: true, message: '璇烽�夋嫨鍛樺伐绫诲瀷', trigger: 'change' }],
- workYears: [{ required: true, message: '璇疯緭鍏ュ伐浣滃勾闄�', trigger: 'blur' }],
- annualDays: [{ required: true, message: '璇疯緭鍏ュ勾鍋囧ぉ鏁�', trigger: 'blur' }],
- maxCarryOver: [{ required: true, message: '璇疯緭鍏ユ渶澶х粨杞ぉ鏁�', trigger: 'blur' }],
- startTime: [{
- required: true,
- message: '璇烽�夋嫨寮�濮嬫椂闂�',
- trigger: 'change',
- validator: (rule, value, callback) => {
- if (!value) {
- callback(new Error('璇烽�夋嫨寮�濮嬫椂闂�'))
- } else {
- callback()
- }
- }
- }],
- endTime: [{
- required: true,
- message: '璇烽�夋嫨缁撴潫鏃堕棿',
- trigger: 'change',
- validator: (rule, value, callback) => {
- if (!value) {
- callback(new Error('璇烽�夋嫨缁撴潫鏃堕棿'))
- } else {
- callback()
- }
- }
- }],
- workStartTime: [{
- required: true,
- message: '璇烽�夋嫨涓婄彮鏃堕棿',
- trigger: 'change',
- validator: (rule, value, callback) => {
- if (!value) {
- callback(new Error('璇烽�夋嫨涓婄彮鏃堕棿'))
- } else {
- callback()
- }
- }
- }],
- workEndTime: [{
- required: true,
- message: '璇烽�夋嫨涓嬬彮鏃堕棿',
- trigger: 'change',
- validator: (rule, value, callback) => {
- if (!value) {
- callback(new Error('璇烽�夋嫨涓嬬彮鏃堕棿'))
- } else {
- callback()
- }
- }
- }],
- rate: [{ required: true, message: '璇疯緭鍏ュ�嶇巼', trigger: 'blur' }]
-}
-// 宸ュ叿鍑芥暟
-const getTagType = (type) => {
- const tagMap = {
- legal: 'success', adjustment: 'warning', special: 'info', company: 'primary',
- weekday: 'primary', weekend: 'warning', holiday: 'danger', night: 'info',
- regular: 'success', probation: 'info', intern: 'danger'
- }
- return tagMap[type] || 'info'
-}
-
-const getTypeLabel = (type) => {
- const labelMap = {
- legal: '娉曞畾鑺傚亣鏃�', adjustment: '璋冧紤鏃�', special: '鐗规畩鍋囨湡', company: '鍏徃鍋囨湡',
- weekday: '宸ヤ綔鏃ュ姞鐝�', weekend: '鍛ㄦ湯鍔犵彮', holiday: '鑺傚亣鏃ュ姞鐝�', night: '娣卞鍔犵彮',
- regular: '姝ｅ紡鍛樺伐', probation: '璇曠敤鏈熷憳宸�', intern: '瀹炰範鐢�'
- }
- return labelMap[type] || type
-}
-
-// 鎵撳崱璁板綍鐩稿叧宸ュ叿鍑芥暟
-const getAttendanceTagType = (status) => {
- const tagMap = {
- normal: 'success',
- late: 'warning',
- early: 'warning',
- absent: 'danger'
- }
- return tagMap[status] || 'info'
-}
-
-const getAttendanceStatusLabel = (status) => {
- const labelMap = {
- normal: '姝ｅ父',
- late: '杩熷埌',
- early: '鏃╅��',
- absent: '缂哄嫟'
- }
- return labelMap[status] || status
-}
-
-const getTypeOptions = () => {
- if (currentType.value === 'holiday') {
- return [
- { label: '娉曞畾鑺傚亣鏃�', value: 'legal' },
- { label: '璋冧紤鏃�', value: 'adjustment' },
- { label: '鐗规畩鍋囨湡', value: 'special' },
- { label: '鍏徃鍋囨湡', value: 'company' }
- ]
- } else if (currentType.value === 'overtime') {
- return [
- { label: '宸ヤ綔鏃ュ姞鐝�', value: 'weekday' },
- { label: '鍛ㄦ湯鍔犵彮', value: 'weekend' },
- { label: '鑺傚亣鏃ュ姞鐝�', value: 'holiday' },
- { label: '娣卞鍔犵彮', value: 'night' }
- ]
- } else if (currentType.value === 'annual') {
- return [
- { label: '姝ｅ紡鍛樺伐', value: 'regular' },
- { label: '璇曠敤鏈熷憳宸�', value: 'probation' },
- { label: '瀹炰範鐢�', value: 'intern' }
- ]
- }
- return []
-}
-
-// 璁＄畻鍋囨湡澶╂暟
-const calculateDays = () => {
- try {
- if (form.dateRange && form.dateRange.length === 2 && form.dateRange[0] && form.dateRange[1]) {
- const start = new Date(form.dateRange[0])
- const end = new Date(form.dateRange[1])
- form.startDate = start.toISOString().split('T')[0]
- form.endDate = end.toISOString().split('T')[0]
-
- if (isNaN(start.getTime()) || isNaN(end.getTime())) {
- console.warn('鏃犳晥鐨勬棩鏈熸牸寮�')
- return
- }
-
- const diffTime = Math.abs(end - start)
- const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) + 1
- form.days = diffDays
- }
- } catch (error) {
- console.error('璁＄畻澶╂暟澶辫触:', error)
- }
-}
-
-// 楠岃瘉鏃堕棿鏍煎紡
-// const validateTime = (time) => {
-// if (!time) return ''
-// if (typeof time === 'string') return time
-// if (time instanceof Date) {
-// return time.toTimeString().slice(0, 5)
-// }
-// return ''
-// }
-
-// 楠岃瘉鏃堕棿瀛楁
-const validateTimeField = (fieldName) => {
- try {
- const value = form[fieldName]
- if (value && typeof value === 'object' && value.hour !== undefined) {
- // 濡傛灉鏄椂闂村璞★紝杞崲涓哄瓧绗︿覆鏍煎紡
- const hours = value.hour.toString().padStart(2, '0')
- const minutes = value.minute.toString().padStart(2, '0')
- form[fieldName] = `${hours}:${minutes}`
- }
- } catch (error) {
- console.error(`楠岃瘉鏃堕棿瀛楁 ${fieldName} 澶辫触:`, error)
- form[fieldName] = ''
- }
-}
-
-// 鎵撳紑寮圭獥
-const openDialog = (type, action, row = null) => {
- try {
- currentType.value = type
- currentAction.value = action
-
- if (action === 'add') {
- dialogTitle.value = `鏂板${getTypeName(type)}`
- currentEditId.value = ''
- resetForm()
- } else if (action === 'edit' && row) {
- dialogTitle.value = `缂栬緫${getTypeName(type)}`
- currentEditId.value = row.id
- fillForm(row)
- }
-
- dialogVisible.value = true
- } catch (error) {
- console.error('鎵撳紑寮圭獥澶辫触:', error)
- ElMessage.error('鎵撳紑寮圭獥澶辫触锛岃閲嶈瘯')
- }
-}
-
-const getTypeName = (type) => {
- const nameMap = {
- holiday: '鍋囨湡',
- annual: '骞村亣瑙勫垯',
- overtime: '鍔犵彮瑙勫垯',
- worktime: '鏃堕棿娈�'
- }
- return nameMap[type] || ''
-}
-
-const resetForm = () => {
- Object.assign(form, {
- name: '',
- type: '',
+ // 琛ㄥ崟鏁版嵁
+ const form = reactive({
+ name: "",
+ type: "",
dateRange: [],
- startDate: '',
- endDate: '',
+ startDate: "",
+ endDate: "",
days: 0,
- employeeType: '',
- workYears: '',
+ employeeType: "",
+ workYears: "",
annualDays: 0,
maxCarryOver: 0,
- startTime: '',
- endTime: '',
- workStartTime: '',
- workEndTime: '',
+ startTime: "", // 鍔犵彮寮�濮嬫椂闂�
+ endTime: "", // 鍔犵彮缁撴潫鏃堕棿
+ workStartTime: "", // 涓婄彮鏃堕棿
+ workEndTime: "", // 涓嬬彮鏃堕棿
rate: 1.5,
flexibleStart: false,
flexibleMinutes: 30,
- status: 'active'
- })
-}
+ status: "active",
+ });
-const fillForm = (row) => {
- if (currentType.value === 'holiday') {
- Object.assign(form, {
- name: row.name,
- type: row.type,
- dateRange: [new Date(row.startDate), new Date(row.endDate)],
- startDate: row.startDate,
- endDate: row.endDate,
- days: row.days,
- status: row.status
- })
- } else if (currentType.value === 'annual') {
- Object.assign(form, {
- employeeType: row.employeeType,
- workYears: row.workYears,
- annualDays: row.annualDays,
- maxCarryOver: row.maxCarryOver,
- status: row.status
- })
- } else if (currentType.value === 'overtime') {
- Object.assign(form, {
- name: row.name,
- type: row.type,
- startTime: row.startTime || '',
- endTime: row.endTime || '',
- rate: row.rate,
- status: row.status
- })
- } else if (currentType.value === 'worktime') {
- Object.assign(form, {
- name: row.name,
- workStartTime: row.startTime || '',
- workEndTime: row.endTime || '',
- flexibleStart: row.flexibleStart,
- flexibleMinutes: row.flexibleMinutes,
- status: row.status
- })
- }
-}
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ name: [{ required: true, message: "璇疯緭鍏ュ悕绉�", trigger: "blur" }],
+ type: [{ required: true, message: "璇烽�夋嫨绫诲瀷", trigger: "change" }],
+ dateRange: [{ required: true, message: "璇烽�夋嫨鏃ユ湡鑼冨洿", trigger: "change" }],
+ days: [{ required: true, message: "璇疯緭鍏ュぉ鏁�", trigger: "blur" }],
+ employeeType: [
+ { required: true, message: "璇烽�夋嫨鍛樺伐绫诲瀷", trigger: "change" },
+ ],
+ workYears: [{ required: true, message: "璇疯緭鍏ュ伐浣滃勾闄�", trigger: "blur" }],
+ annualDays: [{ required: true, message: "璇疯緭鍏ュ勾鍋囧ぉ鏁�", trigger: "blur" }],
+ maxCarryOver: [
+ { required: true, message: "璇疯緭鍏ユ渶澶х粨杞ぉ鏁�", trigger: "blur" },
+ ],
+ startTime: [
+ {
+ required: true,
+ message: "璇烽�夋嫨寮�濮嬫椂闂�",
+ trigger: "change",
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇烽�夋嫨寮�濮嬫椂闂�"));
+ } else {
+ callback();
+ }
+ },
+ },
+ ],
+ endTime: [
+ {
+ required: true,
+ message: "璇烽�夋嫨缁撴潫鏃堕棿",
+ trigger: "change",
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇烽�夋嫨缁撴潫鏃堕棿"));
+ } else {
+ callback();
+ }
+ },
+ },
+ ],
+ workStartTime: [
+ {
+ required: true,
+ message: "璇烽�夋嫨涓婄彮鏃堕棿",
+ trigger: "change",
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇烽�夋嫨涓婄彮鏃堕棿"));
+ } else {
+ callback();
+ }
+ },
+ },
+ ],
+ workEndTime: [
+ {
+ required: true,
+ message: "璇烽�夋嫨涓嬬彮鏃堕棿",
+ trigger: "change",
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇烽�夋嫨涓嬬彮鏃堕棿"));
+ } else {
+ callback();
+ }
+ },
+ },
+ ],
+ rate: [{ required: true, message: "璇疯緭鍏ュ�嶇巼", trigger: "blur" }],
+ };
+ // 宸ュ叿鍑芥暟
+ const getTagType = type => {
+ const tagMap = {
+ legal: "success",
+ adjustment: "warning",
+ special: "info",
+ company: "primary",
+ weekday: "primary",
+ weekend: "warning",
+ holiday: "danger",
+ night: "info",
+ regular: "success",
+ probation: "info",
+ intern: "danger",
+ };
+ return tagMap[type] || "info";
+ };
-// 鎻愪氦琛ㄥ崟
-const submitForm = async () => {
- try {
- if (!formRef.value) {
- ElMessage.error('琛ㄥ崟寮曠敤涓嶅瓨鍦�')
- return
+ const getTypeLabel = type => {
+ const labelMap = {
+ legal: "娉曞畾鑺傚亣鏃�",
+ adjustment: "璋冧紤鏃�",
+ special: "鐗规畩鍋囨湡",
+ company: "鍏徃鍋囨湡",
+ weekday: "宸ヤ綔鏃ュ姞鐝�",
+ weekend: "鍛ㄦ湯鍔犵彮",
+ holiday: "鑺傚亣鏃ュ姞鐝�",
+ night: "娣卞鍔犵彮",
+ regular: "姝ｅ紡鍛樺伐",
+ probation: "璇曠敤鏈熷憳宸�",
+ intern: "瀹炰範鐢�",
+ };
+ return labelMap[type] || type;
+ };
+
+ // 鎵撳崱璁板綍鐩稿叧宸ュ叿鍑芥暟
+ const getAttendanceTagType = status => {
+ const tagMap = {
+ normal: "success",
+ late: "warning",
+ early: "warning",
+ absent: "danger",
+ };
+ return tagMap[status] || "info";
+ };
+
+ const getAttendanceStatusLabel = status => {
+ const labelMap = {
+ normal: "姝ｅ父",
+ late: "杩熷埌",
+ early: "鏃╅��",
+ absent: "缂哄嫟",
+ };
+ return labelMap[status] || status;
+ };
+
+ const getTypeOptions = () => {
+ if (currentType.value === "holiday") {
+ return [
+ { label: "娉曞畾鑺傚亣鏃�", value: "legal" },
+ { label: "璋冧紤鏃�", value: "adjustment" },
+ { label: "鐗规畩鍋囨湡", value: "special" },
+ { label: "鍏徃鍋囨湡", value: "company" },
+ ];
+ } else if (currentType.value === "overtime") {
+ return [
+ { label: "宸ヤ綔鏃ュ姞鐝�", value: "weekday" },
+ { label: "鍛ㄦ湯鍔犵彮", value: "weekend" },
+ { label: "鑺傚亣鏃ュ姞鐝�", value: "holiday" },
+ { label: "娣卞鍔犵彮", value: "night" },
+ ];
+ } else if (currentType.value === "annual") {
+ return [
+ { label: "姝ｅ紡鍛樺伐", value: "regular" },
+ { label: "璇曠敤鏈熷憳宸�", value: "probation" },
+ { label: "瀹炰範鐢�", value: "intern" },
+ ];
}
+ return [];
+ };
- await formRef.value.validate()
+ // 璁＄畻鍋囨湡澶╂暟
+ const calculateDays = () => {
+ try {
+ if (
+ form.dateRange &&
+ form.dateRange.length === 2 &&
+ form.dateRange[0] &&
+ form.dateRange[1]
+ ) {
+ const start = new Date(form.dateRange[0]);
+ const end = new Date(form.dateRange[1]);
+ form.startDate = start.toISOString().split("T")[0];
+ form.endDate = end.toISOString().split("T")[0];
- if (currentAction.value === 'add') {
- addItem()
- } else if (currentAction.value === 'edit') {
- editItem()
- }
-
- dialogVisible.value = false
- ElMessage.success('鎿嶄綔鎴愬姛')
- } catch (error) {
- console.error('琛ㄥ崟楠岃瘉澶辫触:', error)
- ElMessage.error('琛ㄥ崟楠岃瘉澶辫触锛岃妫�鏌ヨ緭鍏�')
- }
-}
-
-const addItem = () => {
-
- if (currentType.value === 'holiday') {
- const params = {
- name: form.name,
- type: form.type,
- startDate: form.startDate,
- endDate: form.endDate,
- days: form.days,
- status: form.status
- }
- addHolidaySettings(params).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- // dialogVisible.value = false;
- getHolidaySettingsList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else if (currentType.value === 'annual') {
- // annualData.value.push(newItem)
- const params = {
- employeeType: form.employeeType,
- workYears: form.workYears,
- annualDays: form.annualDays,
- maxCarryOver: form.maxCarryOver,
- status: form.status
- }
- addAnnualLeaveSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- // dialogVisible.value = false;
- getAnnualLeaveSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else if (currentType.value === 'overtime') {
- const params = {
- name: form.name,
- type: form.type,
- startTime: form.startTime || '',
- endTime: form.endTime || '',
- rate: form.rate,
- status: form.status
- }
- addOvertimeSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- // dialogVisible.value = false;
- getOvertimeSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- // newItem.startTime = form.startTime || ''
- // newItem.endTime = form.endTime || ''
- // overtimeData.value.push(newItem)
- } else if (currentType.value === 'worktime') {
- const params = {
- name: form.name,
- startTime: form.workStartTime || '',
- endTime: form.workEndTime || '',
- flexibleStart: form.flexibleStart,
- flexibleMinutes: form.flexibleMinutes,
- status: form.status
- }
- addWorkingHoursSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- getWorkingHoursSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- // newItem.startTime = form.workStartTime || ''
- // newItem.endTime = form.workEndTime || ''
- // worktimeData.value.push(newItem)
- }
-}
-
-const editItem = () => {
- let dataArray
- let index
-
- if (currentType.value === 'holiday') {
- const params = {
- id: currentEditId.value,
- name: form.name,
- type: form.type,
- startDate: form.dateRange[0].toISOString().split('T')[0],
- endDate: form.dateRange[1].toISOString().split('T')[0],
- days: form.days,
- status: form.status
- }
- updateHolidaySettings(params).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- // dialogVisible.value = false;
- getHolidaySettingsList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else if (currentType.value === 'annual') {
- const params = {
- id: currentEditId.value,
- employeeType: form.employeeType,
- workYears: form.workYears,
- annualDays: form.annualDays,
- maxCarryOver: form.maxCarryOver,
- status: form.status
- }
- updateAnnualLeaveSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- getAnnualLeaveSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else if (currentType.value === 'overtime') {
- const params = {
- id: currentEditId.value,
- name: form.name,
- type: form.type,
- startTime: form.startTime || '',
- endTime: form.endTime || '',
- rate: form.rate,
- status: form.status
- }
- updateOvertimeSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- getOvertimeSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
-
- // dataArray = overtimeData.value
- // index = dataArray.findIndex(item => item.id === currentEditId.value)
- // if (index > -1) {
- // dataArray[index] = {
- // ...dataArray[index],
- // name: form.name,
- // type: form.type,
- // startTime: form.startTime || '',
- // endTime: form.endTime || '',
- // rate: form.rate,
- // status: form.status
- // }
- // }
- } else if (currentType.value === 'worktime') {
- const params = {
- id: currentEditId.value,
- name: form.name,
- startTime: form.workStartTime || '',
- endTime: form.workEndTime || '',
- flexibleStart: form.flexibleStart,
- flexibleMinutes: form.flexibleMinutes,
- status: form.status
- }
- updateWorkingHoursSetting(params).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- getWorkingHoursSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- // dataArray = worktimeData.value
- // index = dataArray.findIndex(item => item.id === currentEditId.value)
- // if (index > -1) {
- // dataArray[index] = {
- // ...dataArray[index],
- // name: form.name,
- // startTime: form.workStartTime || '',
- // endTime: form.workEndTime || '',
- // flexibleStart: form.flexibleStart,
- // flexibleMinutes: form.flexibleMinutes,
- // status: form.status
- // }
- // }
- }
-}
-
-// 鎵撳崱璁板綍杩囨护鍔熻兘
-const filterAttendanceData = () => {
- let filtered = attendanceData.value
-
- // 鎸夋棩鏈熻繃婊�
- if (attendanceDate.value) {
- filtered = filtered.filter(item => item.date === attendanceDate.value)
- }
-
- // 鎸夌姸鎬佽繃婊�
- if (attendanceStatus.value) {
- filtered = filtered.filter(item => item.status === attendanceStatus.value)
- }
-
- filteredAttendanceData.value = filtered
-}
-
-// 瀵煎嚭鎵撳崱璁板綍
-const exportAttendance = () => {
- ElMessage.success('瀵煎嚭鍔熻兘寮�鍙戜腑...')
-}
-
-// 鍒濆鍖栨墦鍗¤褰曞亣鏁版嵁
-const initAttendanceData = () => {
- const mockData = [
- {
- id: 1,
- employeeName: '闄堝織寮�',
- department: '鎶�鏈儴',
- date: '2025-08-15',
- clockInTime: '09:00:00',
- clockOutTime: '18:00:00',
- workHours: '8.0h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 2,
- employeeName: '鏉庨洩姊�',
- department: '甯傚満閮�',
- date: '2025-08-16',
- clockInTime: '08:58:00',
- clockOutTime: '18:05:00',
- workHours: '8.12h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 3,
- employeeName: '鐜嬪缓鍗�',
- department: '浜轰簨閮�',
- date: '2025-08-16',
- clockInTime: '09:02:00',
- clockOutTime: '18:00:00',
- workHours: '7.97h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 4,
- employeeName: '璧垫檽涓�',
- department: '璐㈠姟閮�',
- date: '2025-09-02',
- clockInTime: '08:55:00',
- clockOutTime: '18:10:00',
- workHours: '8.25h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 5,
- employeeName: '寮犲浗搴�',
- department: '鎶�鏈儴',
- date: '2025-09-02',
- clockInTime: '09:00:00',
- clockOutTime: '18:30:00',
- workHours: '8.5h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: '鍔犵彮'
- },
- {
- id: 6,
- employeeName: '鍒樻槑杈�',
- department: '杩愯惀閮�',
- date: '2025-09-03',
- clockInTime: '09:05:00',
- clockOutTime: '18:00:00',
- workHours: '7.92h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 7,
- employeeName: '瀛欎附鍗�',
- department: '璁捐閮�',
- date: '2025-09-03',
- clockInTime: '08:59:00',
- clockOutTime: '18:02:00',
- workHours: '8.05h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 8,
- employeeName: '鍛ㄥ缓鍐�',
- department: '閿�鍞儴',
- date: '2025-09-04',
- clockInTime: '09:15:00',
- clockOutTime: '18:00:00',
- workHours: '7.75h',
- status: 'late',
- location: '鍏徃鎬婚儴',
- remark: '浜ら�氬牭濉�'
- },
- {
- id: 9,
- employeeName: '鍚村皬鑺�',
- department: '瀹㈡湇閮�',
- date: '2025-09-04',
- clockInTime: '09:01:00',
- clockOutTime: '18:00:00',
- workHours: '7.98h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 10,
- employeeName: '椹枃鏉�',
- department: '鎶�鏈儴',
- date: '2025-09-05',
- clockInTime: '08:57:00',
- clockOutTime: '17:30:00',
- workHours: '7.55h',
- status: 'early',
- location: '鍏徃鎬婚儴',
- remark: '鏈夋�ヤ簨鎻愬墠绂诲紑'
- },
- {
- id: 11,
- employeeName: '鏋楁檽涓�',
- department: '琛屾斂閮�',
- date: '2025-09-05',
- clockInTime: '09:03:00',
- clockOutTime: '18:08:00',
- workHours: '8.08h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 12,
- employeeName: '榛勭編鐜�',
- department: '璐㈠姟閮�',
- date: '2025-09-06',
- clockInTime: '',
- clockOutTime: '',
- workHours: '0h',
- status: 'absent',
- location: '',
- remark: '璇风梾鍋�'
- },
- {
- id: 13,
- employeeName: '閮戞捣娑�',
- department: '甯傚満閮�',
- date: '2025-08-14',
- clockInTime: '09:00:00',
- clockOutTime: '18:00:00',
- workHours: '8.0h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 14,
- employeeName: '璋附濞�',
- department: '浜轰簨閮�',
- date: '2025-08-20',
- clockInTime: '08:58:00',
- clockOutTime: '18:03:00',
- workHours: '8.08h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 15,
- employeeName: '浣曞織浼�',
- department: '鎶�鏈儴',
- date: '2025-08-21',
- clockInTime: '09:10:00',
- clockOutTime: '18:00:00',
- workHours: '7.83h',
- status: 'late',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 16,
- employeeName: '璁搁泤鑺�',
- department: '璁捐閮�',
- date: '2025-08-22',
- clockInTime: '09:01:00',
- clockOutTime: '18:00:00',
- workHours: '7.98h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 17,
- employeeName: '閭撳缓骞�',
- department: '杩愯惀閮�',
- date: '2025-09-10',
- clockInTime: '08:59:00',
- clockOutTime: '18:05:00',
- workHours: '8.1h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- },
- {
- id: 18,
- employeeName: '鏇惧皬绾�',
- department: '瀹㈡湇閮�',
- date: '2025-09-11',
- clockInTime: '09:02:00',
- clockOutTime: '18:00:00',
- workHours: '7.97h',
- status: 'normal',
- location: '鍏徃鎬婚儴',
- remark: ''
- }
- ]
-
- attendanceData.value = mockData
- filteredAttendanceData.value = mockData
-}
-
-// 鍒犻櫎椤圭洰
-const deleteItem = (type, row) => {
- ElMessageBox.confirm('纭畾瑕佸垹闄よ繖涓」鐩悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- let ids = [];
- let dataArray
- if (type === 'holiday') {
- ids.push(row.id)
- delHolidaySettings(ids).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- ids = []
- getHolidaySettingsList()
+ if (isNaN(start.getTime()) || isNaN(end.getTime())) {
+ console.warn("鏃犳晥鐨勬棩鏈熸牸寮�");
+ return;
}
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+
+ const diffTime = Math.abs(end - start);
+ const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) + 1;
+ form.days = diffDays;
+ }
+ } catch (error) {
+ console.error("璁＄畻澶╂暟澶辫触:", error);
}
- else if (type === 'annual') {
- ids.push(row.id)
- delAnnualLeaveSetting(ids).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- ids = []
- getAnnualLeaveSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+ };
+
+ // 楠岃瘉鏃堕棿鏍煎紡
+ // const validateTime = (time) => {
+ // if (!time) return ''
+ // if (typeof time === 'string') return time
+ // if (time instanceof Date) {
+ // return time.toTimeString().slice(0, 5)
+ // }
+ // return ''
+ // }
+
+ // 楠岃瘉鏃堕棿瀛楁
+ const validateTimeField = fieldName => {
+ try {
+ const value = form[fieldName];
+ if (value && typeof value === "object" && value.hour !== undefined) {
+ // 濡傛灉鏄椂闂村璞★紝杞崲涓哄瓧绗︿覆鏍煎紡
+ const hours = value.hour.toString().padStart(2, "0");
+ const minutes = value.minute.toString().padStart(2, "0");
+ form[fieldName] = `${hours}:${minutes}`;
+ }
+ } catch (error) {
+ console.error(`楠岃瘉鏃堕棿瀛楁 ${fieldName} 澶辫触:`, error);
+ form[fieldName] = "";
}
- else if (type === 'overtime') {
- ids.push(row.id)
- delOvertimeSetting(ids).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- ids = []
- getOvertimeSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+ };
+
+ // 鎵撳紑寮圭獥
+ const openDialog = (type, action, row = null) => {
+ try {
+ currentType.value = type;
+ currentAction.value = action;
+
+ if (action === "add") {
+ dialogTitle.value = `鏂板${getTypeName(type)}`;
+ currentEditId.value = "";
+ resetForm();
+ } else if (action === "edit" && row) {
+ dialogTitle.value = `缂栬緫${getTypeName(type)}`;
+ currentEditId.value = row.id;
+ fillForm(row);
+ }
+
+ dialogVisible.value = true;
+ } catch (error) {
+ console.error("鎵撳紑寮圭獥澶辫触:", error);
+ ElMessage.error("鎵撳紑寮圭獥澶辫触锛岃閲嶈瘯");
}
- else if (type === 'worktime') {
- ids.push(row.id)
- delWorkingHoursSetting(ids).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- ids = []
- getWorkingHoursSettingList()
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+ };
+
+ const getTypeName = type => {
+ const nameMap = {
+ holiday: "鍋囨湡",
+ annual: "骞村亣瑙勫垯",
+ overtime: "鍔犵彮瑙勫垯",
+ worktime: "鏃堕棿娈�",
+ };
+ return nameMap[type] || "";
+ };
+
+ const resetForm = () => {
+ Object.assign(form, {
+ name: "",
+ type: "",
+ dateRange: [],
+ startDate: "",
+ endDate: "",
+ days: 0,
+ employeeType: "",
+ workYears: "",
+ annualDays: 0,
+ maxCarryOver: 0,
+ startTime: "",
+ endTime: "",
+ workStartTime: "",
+ workEndTime: "",
+ rate: 1.5,
+ flexibleStart: false,
+ flexibleMinutes: 30,
+ status: "active",
+ });
+ };
+
+ const fillForm = row => {
+ if (currentType.value === "holiday") {
+ Object.assign(form, {
+ name: row.name,
+ type: row.type,
+ dateRange: [new Date(row.startDate), new Date(row.endDate)],
+ startDate: row.startDate,
+ endDate: row.endDate,
+ days: row.days,
+ status: row.status,
+ });
+ } else if (currentType.value === "annual") {
+ Object.assign(form, {
+ employeeType: row.employeeType,
+ workYears: row.workYears,
+ annualDays: row.annualDays,
+ maxCarryOver: row.maxCarryOver,
+ status: row.status,
+ });
+ } else if (currentType.value === "overtime") {
+ Object.assign(form, {
+ name: row.name,
+ type: row.type,
+ startTime: row.startTime || "",
+ endTime: row.endTime || "",
+ rate: row.rate,
+ status: row.status,
+ });
+ } else if (currentType.value === "worktime") {
+ Object.assign(form, {
+ name: row.name,
+ workStartTime: row.startTime || "",
+ workEndTime: row.endTime || "",
+ flexibleStart: row.flexibleStart,
+ flexibleMinutes: row.flexibleMinutes,
+ status: row.status,
+ });
+ }
+ };
+
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ if (!formRef.value) {
+ ElMessage.error("琛ㄥ崟寮曠敤涓嶅瓨鍦�");
+ return;
+ }
+
+ await formRef.value.validate();
+
+ if (currentAction.value === "add") {
+ addItem();
+ } else if (currentAction.value === "edit") {
+ editItem();
+ }
+
+ dialogVisible.value = false;
+ ElMessage.success("鎿嶄綔鎴愬姛");
+ } catch (error) {
+ console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
+ ElMessage.error("琛ㄥ崟楠岃瘉澶辫触锛岃妫�鏌ヨ緭鍏�");
+ }
+ };
+
+ const addItem = () => {
+ if (currentType.value === "holiday") {
+ const params = {
+ name: form.name,
+ type: form.type,
+ startDate: form.startDate,
+ endDate: form.endDate,
+ days: form.days,
+ status: form.status,
+ };
+ addHolidaySettings(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ // dialogVisible.value = false;
+ getHolidaySettingsList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (currentType.value === "annual") {
+ // annualData.value.push(newItem)
+ const params = {
+ employeeType: form.employeeType,
+ workYears: form.workYears,
+ annualDays: form.annualDays,
+ maxCarryOver: form.maxCarryOver,
+ status: form.status,
+ };
+ addAnnualLeaveSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ // dialogVisible.value = false;
+ getAnnualLeaveSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (currentType.value === "overtime") {
+ const params = {
+ name: form.name,
+ type: form.type,
+ startTime: form.startTime || "",
+ endTime: form.endTime || "",
+ rate: form.rate,
+ status: form.status,
+ };
+ addOvertimeSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ // dialogVisible.value = false;
+ getOvertimeSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ // newItem.startTime = form.startTime || ''
+ // newItem.endTime = form.endTime || ''
+ // overtimeData.value.push(newItem)
+ } else if (currentType.value === "worktime") {
+ const params = {
+ name: form.name,
+ startTime: form.workStartTime || "",
+ endTime: form.workEndTime || "",
+ flexibleStart: form.flexibleStart,
+ flexibleMinutes: form.flexibleMinutes,
+ status: form.status,
+ };
+ addWorkingHoursSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ getWorkingHoursSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ // newItem.startTime = form.workStartTime || ''
+ // newItem.endTime = form.workEndTime || ''
+ // worktimeData.value.push(newItem)
+ }
+ };
+
+ const editItem = () => {
+ let dataArray;
+ let index;
+
+ if (currentType.value === "holiday") {
+ const params = {
+ id: currentEditId.value,
+ name: form.name,
+ type: form.type,
+ startDate: form.dateRange[0].toISOString().split("T")[0],
+ endDate: form.dateRange[1].toISOString().split("T")[0],
+ days: form.days,
+ status: form.status,
+ };
+ updateHolidaySettings(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ // dialogVisible.value = false;
+ getHolidaySettingsList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (currentType.value === "annual") {
+ const params = {
+ id: currentEditId.value,
+ employeeType: form.employeeType,
+ workYears: form.workYears,
+ annualDays: form.annualDays,
+ maxCarryOver: form.maxCarryOver,
+ status: form.status,
+ };
+ updateAnnualLeaveSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ getAnnualLeaveSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (currentType.value === "overtime") {
+ const params = {
+ id: currentEditId.value,
+ name: form.name,
+ type: form.type,
+ startTime: form.startTime || "",
+ endTime: form.endTime || "",
+ rate: form.rate,
+ status: form.status,
+ };
+ updateOvertimeSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ getOvertimeSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+
+ // dataArray = overtimeData.value
+ // index = dataArray.findIndex(item => item.id === currentEditId.value)
+ // if (index > -1) {
+ // dataArray[index] = {
+ // ...dataArray[index],
+ // name: form.name,
+ // type: form.type,
+ // startTime: form.startTime || '',
+ // endTime: form.endTime || '',
+ // rate: form.rate,
+ // status: form.status
+ // }
+ // }
+ } else if (currentType.value === "worktime") {
+ const params = {
+ id: currentEditId.value,
+ name: form.name,
+ startTime: form.workStartTime || "",
+ endTime: form.workEndTime || "",
+ flexibleStart: form.flexibleStart,
+ flexibleMinutes: form.flexibleMinutes,
+ status: form.status,
+ };
+ updateWorkingHoursSetting(params)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ getWorkingHoursSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ // dataArray = worktimeData.value
+ // index = dataArray.findIndex(item => item.id === currentEditId.value)
+ // if (index > -1) {
+ // dataArray[index] = {
+ // ...dataArray[index],
+ // name: form.name,
+ // startTime: form.workStartTime || '',
+ // endTime: form.workEndTime || '',
+ // flexibleStart: form.flexibleStart,
+ // flexibleMinutes: form.flexibleMinutes,
+ // status: form.status
+ // }
+ // }
+ }
+ };
+
+ // 鎵撳崱璁板綍杩囨护鍔熻兘
+ const filterAttendanceData = () => {
+ let filtered = attendanceData.value;
+
+ // 鎸夋棩鏈熻繃婊�
+ if (attendanceDate.value) {
+ filtered = filtered.filter(item => item.date === attendanceDate.value);
}
- // const index = dataArray.findIndex(item => item.id === row.id)
- // if (index > -1) {
- // dataArray.splice(index, 1)
- // ElMessage.success('鍒犻櫎鎴愬姛')
- // }
- })
-}
-// 鑾峰彇鍋囨湡璁剧疆鍒楄〃
-const getHolidaySettingsList = () => {
- // tableLoading.value = true;
- listHolidaySettings({...page.value})
- .then(res => {
- // tableLoading.value = false;
- holidayData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- // tableLoading.value = false;
- })
-};
-// 鑾峰彇骞村亣瑙勫垯鍒楄〃
-const getAnnualLeaveSettingList = () => {
+ // 鎸夌姸鎬佽繃婊�
+ if (attendanceStatus.value) {
+ filtered = filtered.filter(item => item.status === attendanceStatus.value);
+ }
- listAnnualLeaveSettingList({...page.value})
- .then(res => {
- // console.log(res.data)
- annualData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- })
-};
-// 鑾峰彇鍔犵彮瑙勫垯鍒楄〃
-const getOvertimeSettingList = () => {
+ filteredAttendanceData.value = filtered;
+ };
- listOvertimeSettingList({...page.value})
- .then(res => {
- // console.log(res.data)
- overtimeData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- })
-};
-// 鑾峰彇宸ヤ綔鏃堕棿瑙勫垯鍒楄〃
-const getWorkingHoursSettingList = () => {
+ // 瀵煎嚭鎵撳崱璁板綍
+ const exportAttendance = () => {
+ ElMessage.success("瀵煎嚭鍔熻兘寮�鍙戜腑...");
+ };
- listWorkingHoursSettingList({...page.value})
- .then(res => {
- // console.log(res.data)
- worktimeData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- })
-};
-onMounted(() => {
- getHolidaySettingsList()
- getAnnualLeaveSettingList()
- getOvertimeSettingList()
- getWorkingHoursSettingList()
- initAttendanceData()
- console.log('鑰冨嫟绠＄悊椤甸潰鍔犺浇瀹屾垚')
-})
+ // 鍒濆鍖栨墦鍗¤褰曞亣鏁版嵁
+ const initAttendanceData = () => {
+ const mockData = [
+ {
+ id: 1,
+ employeeName: "闄堝織寮�",
+ department: "鎶�鏈儴",
+ date: "2025-08-15",
+ clockInTime: "09:00:00",
+ clockOutTime: "18:00:00",
+ workHours: "8.0h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 2,
+ employeeName: "鏉庨洩姊�",
+ department: "甯傚満閮�",
+ date: "2025-08-16",
+ clockInTime: "08:58:00",
+ clockOutTime: "18:05:00",
+ workHours: "8.12h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 3,
+ employeeName: "鐜嬪缓鍗�",
+ department: "浜轰簨閮�",
+ date: "2025-08-16",
+ clockInTime: "09:02:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.97h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 4,
+ employeeName: "璧垫檽涓�",
+ department: "璐㈠姟閮�",
+ date: "2025-09-02",
+ clockInTime: "08:55:00",
+ clockOutTime: "18:10:00",
+ workHours: "8.25h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 5,
+ employeeName: "寮犲浗搴�",
+ department: "鎶�鏈儴",
+ date: "2025-09-02",
+ clockInTime: "09:00:00",
+ clockOutTime: "18:30:00",
+ workHours: "8.5h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "鍔犵彮",
+ },
+ {
+ id: 6,
+ employeeName: "鍒樻槑杈�",
+ department: "杩愯惀閮�",
+ date: "2025-09-03",
+ clockInTime: "09:05:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.92h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 7,
+ employeeName: "瀛欎附鍗�",
+ department: "璁捐閮�",
+ date: "2025-09-03",
+ clockInTime: "08:59:00",
+ clockOutTime: "18:02:00",
+ workHours: "8.05h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 8,
+ employeeName: "鍛ㄥ缓鍐�",
+ department: "閿�鍞儴",
+ date: "2025-09-04",
+ clockInTime: "09:15:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.75h",
+ status: "late",
+ location: "鍏徃鎬婚儴",
+ remark: "浜ら�氬牭濉�",
+ },
+ {
+ id: 9,
+ employeeName: "鍚村皬鑺�",
+ department: "瀹㈡湇閮�",
+ date: "2025-09-04",
+ clockInTime: "09:01:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.98h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 10,
+ employeeName: "椹枃鏉�",
+ department: "鎶�鏈儴",
+ date: "2025-09-05",
+ clockInTime: "08:57:00",
+ clockOutTime: "17:30:00",
+ workHours: "7.55h",
+ status: "early",
+ location: "鍏徃鎬婚儴",
+ remark: "鏈夋�ヤ簨鎻愬墠绂诲紑",
+ },
+ {
+ id: 11,
+ employeeName: "鏋楁檽涓�",
+ department: "琛屾斂閮�",
+ date: "2025-09-05",
+ clockInTime: "09:03:00",
+ clockOutTime: "18:08:00",
+ workHours: "8.08h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 12,
+ employeeName: "榛勭編鐜�",
+ department: "璐㈠姟閮�",
+ date: "2025-09-06",
+ clockInTime: "",
+ clockOutTime: "",
+ workHours: "0h",
+ status: "absent",
+ location: "",
+ remark: "璇风梾鍋�",
+ },
+ {
+ id: 13,
+ employeeName: "閮戞捣娑�",
+ department: "甯傚満閮�",
+ date: "2025-08-14",
+ clockInTime: "09:00:00",
+ clockOutTime: "18:00:00",
+ workHours: "8.0h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 14,
+ employeeName: "璋附濞�",
+ department: "浜轰簨閮�",
+ date: "2025-08-20",
+ clockInTime: "08:58:00",
+ clockOutTime: "18:03:00",
+ workHours: "8.08h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 15,
+ employeeName: "浣曞織浼�",
+ department: "鎶�鏈儴",
+ date: "2025-08-21",
+ clockInTime: "09:10:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.83h",
+ status: "late",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 16,
+ employeeName: "璁搁泤鑺�",
+ department: "璁捐閮�",
+ date: "2025-08-22",
+ clockInTime: "09:01:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.98h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 17,
+ employeeName: "閭撳缓骞�",
+ department: "杩愯惀閮�",
+ date: "2025-09-10",
+ clockInTime: "08:59:00",
+ clockOutTime: "18:05:00",
+ workHours: "8.1h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ {
+ id: 18,
+ employeeName: "鏇惧皬绾�",
+ department: "瀹㈡湇閮�",
+ date: "2025-09-11",
+ clockInTime: "09:02:00",
+ clockOutTime: "18:00:00",
+ workHours: "7.97h",
+ status: "normal",
+ location: "鍏徃鎬婚儴",
+ remark: "",
+ },
+ ];
-onUnmounted(() => {
- // 娓呯悊宸ヤ綔
- dialogVisible.value = false
- currentType.value = ''
- currentAction.value = ''
- currentEditId.value = ''
-})
+ attendanceData.value = mockData;
+ filteredAttendanceData.value = mockData;
+ };
+
+ // 鍒犻櫎椤圭洰
+ const deleteItem = (type, row) => {
+ ElMessageBox.confirm("纭畾瑕佸垹闄よ繖涓」鐩悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ let ids = [];
+ let dataArray;
+ if (type === "holiday") {
+ ids.push(row.id);
+ delHolidaySettings(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ ids = [];
+ getHolidaySettingsList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (type === "annual") {
+ ids.push(row.id);
+ delAnnualLeaveSetting(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ ids = [];
+ getAnnualLeaveSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (type === "overtime") {
+ ids.push(row.id);
+ delOvertimeSetting(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ ids = [];
+ getOvertimeSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else if (type === "worktime") {
+ ids.push(row.id);
+ delWorkingHoursSetting(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ ids = [];
+ getWorkingHoursSettingList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ }
+
+ // const index = dataArray.findIndex(item => item.id === row.id)
+ // if (index > -1) {
+ // dataArray.splice(index, 1)
+ // ElMessage.success('鍒犻櫎鎴愬姛')
+ // }
+ });
+ };
+ // 鑾峰彇鍋囨湡璁剧疆鍒楄〃
+ const getHolidaySettingsList = () => {
+ // tableLoading.value = true;
+ listHolidaySettings({ ...page.value })
+ .then(res => {
+ // tableLoading.value = false;
+ holidayData.value = res.data.records;
+ page.total = res.data.total;
+ })
+ .catch(err => {
+ // tableLoading.value = false;
+ });
+ };
+ // 鑾峰彇骞村亣瑙勫垯鍒楄〃
+ const getAnnualLeaveSettingList = () => {
+ listAnnualLeaveSettingList({ ...page.value })
+ .then(res => {
+ // console.log(res.data)
+ annualData.value = res.data.records;
+ page.total = res.data.total;
+ })
+ .catch(err => {});
+ };
+ // 鑾峰彇鍔犵彮瑙勫垯鍒楄〃
+ const getOvertimeSettingList = () => {
+ listOvertimeSettingList({ ...page.value })
+ .then(res => {
+ // console.log(res.data)
+ overtimeData.value = res.data.records;
+ page.total = res.data.total;
+ })
+ .catch(err => {});
+ };
+ // 鑾峰彇宸ヤ綔鏃堕棿瑙勫垯鍒楄〃
+ const getWorkingHoursSettingList = () => {
+ listWorkingHoursSettingList({ ...page.value })
+ .then(res => {
+ // console.log(res.data)
+ worktimeData.value = res.data.records;
+ page.total = res.data.total;
+ })
+ .catch(err => {});
+ };
+ onMounted(() => {
+ getHolidaySettingsList();
+ getAnnualLeaveSettingList();
+ getOvertimeSettingList();
+ getWorkingHoursSettingList();
+ initAttendanceData();
+ console.log("鑰冨嫟绠＄悊椤甸潰鍔犺浇瀹屾垚");
+ });
+
+ onUnmounted(() => {
+ // 娓呯悊宸ヤ綔
+ dialogVisible.value = false;
+ currentType.value = "";
+ currentAction.value = "";
+ currentEditId.value = "";
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.tab-content {
- padding: 20px 0;
-}
+ .tab-content {
+ padding: 20px 0;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
-:deep(.el-tabs__content) {
- padding: 20px;
-}
+ :deep(.el-tabs__content) {
+ padding: 20px;
+ }
-:deep(.el-form-item) {
- margin-bottom: 20px;
-}
+ :deep(.el-form-item) {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/collaborativeApproval/knowledgeBase/index.vue b/src/views/collaborativeApproval/knowledgeBase/index.vue
index cb643ad..76c8ec9 100644
--- a/src/views/collaborativeApproval/knowledgeBase/index.vue
+++ b/src/views/collaborativeApproval/knowledgeBase/index.vue
@@ -3,144 +3,173 @@
<div class="search_form">
<div>
<span class="search_title">鐭ヨ瘑鏍囬锛�</span>
- <el-input
- v-model="searchForm.title"
- style="width: 240px"
- placeholder="璇疯緭鍏ョ煡璇嗘爣棰樻悳绱�"
- @change="handleQuery"
- clearable
- :prefix-icon="Search"
- />
+ <el-input v-model="searchForm.title"
+ style="width: 240px"
+ placeholder="璇疯緭鍏ョ煡璇嗘爣棰樻悳绱�"
+ @change="handleQuery"
+ clearable
+ :prefix-icon="Search" />
<span class="search_title ml10">鐭ヨ瘑绫诲瀷锛�</span>
- <el-select v-model="searchForm.type" clearable @change="handleQuery" style="width: 240px">
- <el-option label="鍚堝悓鐗规壒" :value="'contract'" />
- <el-option label="瀹℃壒妗堜緥" :value="'approval'" />
- <el-option label="瑙ｅ喅鏂规" :value="'solution'" />
- <el-option label="缁忛獙鎬荤粨" :value="'experience'" />
- <el-option label="鎿嶄綔鎸囧崡" :value="'guide'" />
+ <el-select v-model="searchForm.type"
+ clearable
+ @change="handleQuery"
+ style="width: 240px">
+ <el-option label="鍚堝悓鐗规壒"
+ :value="'contract'" />
+ <el-option label="瀹℃壒妗堜緥"
+ :value="'approval'" />
+ <el-option label="瑙ｅ喅鏂规"
+ :value="'solution'" />
+ <el-option label="缁忛獙鎬荤粨"
+ :value="'experience'" />
+ <el-option label="鎿嶄綔鎸囧崡"
+ :value="'guide'" />
</el-select>
- <el-button type="primary" @click="handleQuery" style="margin-left: 10px">
+ <el-button type="primary"
+ @click="handleQuery"
+ style="margin-left: 10px">
鎼滅储
</el-button>
</div>
<div>
- <el-button @click="handleExport" style="margin-right: 10px">瀵煎嚭</el-button>
- <el-button type="primary" @click="openForm('add')">鏂板鐭ヨ瘑</el-button>
- <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+ <el-button @click="handleExport"
+ style="margin-right: 10px">瀵煎嚭</el-button>
+ <el-button type="primary"
+ @click="openForm('add')">鏂板鐭ヨ瘑</el-button>
+ <el-button type="danger"
+ plain
+ @click="handleDelete">鍒犻櫎</el-button>
</div>
</div>
-
<div class="table_list">
- <PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :page="page"
- :isSelection="true"
- @selection-change="handleSelectionChange"
- :tableLoading="tableLoading"
- @pagination="pagination"
- :total="page.total"
- ></PIMTable>
+ <PIMTable rowKey="id"
+ :column="tableColumn"
+ :tableData="tableData"
+ :page="page"
+ :isSelection="true"
+ @selection-change="handleSelectionChange"
+ :tableLoading="tableLoading"
+ @pagination="pagination"
+ :total="page.total"></PIMTable>
</div>
-
<!-- 鏂板/缂栬緫鐭ヨ瘑寮圭獥 -->
- <el-dialog
- v-model="dialogVisible"
- :title="dialogTitle"
- width="800px"
- :close-on-click-modal="false"
- >
- <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="800px"
+ :close-on-click-modal="false">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="120px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鐭ヨ瘑鏍囬" prop="title">
- <el-input v-model="form.title" placeholder="璇疯緭鍏ョ煡璇嗘爣棰�" />
+ <el-form-item label="鐭ヨ瘑鏍囬"
+ prop="title">
+ <el-input v-model="form.title"
+ placeholder="璇疯緭鍏ョ煡璇嗘爣棰�" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鐭ヨ瘑绫诲瀷" prop="type">
- <el-select v-model="form.type" placeholder="璇烽�夋嫨鐭ヨ瘑绫诲瀷" style="width: 100%">
- <el-option label="鍚堝悓鐗规壒" value="contract" />
- <el-option label="瀹℃壒妗堜緥" value="approval" />
- <el-option label="瑙ｅ喅鏂规" value="solution" />
- <el-option label="缁忛獙鎬荤粨" value="experience" />
- <el-option label="鎿嶄綔鎸囧崡" value="guide" />
+ <el-form-item label="鐭ヨ瘑绫诲瀷"
+ prop="type">
+ <el-select v-model="form.type"
+ placeholder="璇烽�夋嫨鐭ヨ瘑绫诲瀷"
+ style="width: 100%">
+ <el-option label="鍚堝悓鐗规壒"
+ value="contract" />
+ <el-option label="瀹℃壒妗堜緥"
+ value="approval" />
+ <el-option label="瑙ｅ喅鏂规"
+ value="solution" />
+ <el-option label="缁忛獙鎬荤粨"
+ value="experience" />
+ <el-option label="鎿嶄綔鎸囧崡"
+ value="guide" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="閫傜敤鍦烘櫙" prop="scenario">
- <el-input v-model="form.scenario" placeholder="璇疯緭鍏ラ�傜敤鍦烘櫙" />
+ <el-form-item label="閫傜敤鍦烘櫙"
+ prop="scenario">
+ <el-input v-model="form.scenario"
+ placeholder="璇疯緭鍏ラ�傜敤鍦烘櫙" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="瑙ｅ喅鏁堢巼" prop="efficiency">
- <el-select v-model="form.efficiency" placeholder="璇烽�夋嫨瑙ｅ喅鏁堢巼" style="width: 100%">
- <el-option label="鏄捐憲鎻愬崌" value="high" />
- <el-option label="涓�鑸彁鍗�" value="medium" />
- <el-option label="杞诲井鎻愬崌" value="low" />
+ <el-form-item label="瑙ｅ喅鏁堢巼"
+ prop="efficiency">
+ <el-select v-model="form.efficiency"
+ placeholder="璇烽�夋嫨瑙ｅ喅鏁堢巼"
+ style="width: 100%">
+ <el-option label="鏄捐憲鎻愬崌"
+ value="high" />
+ <el-option label="涓�鑸彁鍗�"
+ value="medium" />
+ <el-option label="杞诲井鎻愬崌"
+ value="low" />
</el-select>
</el-form-item>
</el-col>
</el-row>
- <el-form-item label="闂鎻忚堪" prop="problem">
- <el-input
- v-model="form.problem"
- type="textarea"
- :rows="3"
- placeholder="璇锋弿杩伴亣鍒扮殑闂"
- />
+ <el-form-item label="闂鎻忚堪"
+ prop="problem">
+ <el-input v-model="form.problem"
+ type="textarea"
+ :rows="3"
+ placeholder="璇锋弿杩伴亣鍒扮殑闂" />
</el-form-item>
- <el-form-item label="瑙ｅ喅鏂规" prop="solution">
- <el-input
- v-model="form.solution"
- type="textarea"
- :rows="4"
- placeholder="璇疯缁嗘弿杩拌В鍐虫柟妗�"
- />
+ <el-form-item label="瑙ｅ喅鏂规"
+ prop="solution">
+ <el-input v-model="form.solution"
+ type="textarea"
+ :rows="4"
+ placeholder="璇疯缁嗘弿杩拌В鍐虫柟妗�" />
</el-form-item>
- <el-form-item label="鍏抽敭瑕佺偣" prop="keyPoints">
- <el-input
- v-model="form.keyPoints"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ュ叧閿鐐癸紝鐢ㄩ�楀彿鍒嗛殧"
- />
+ <el-form-item label="鍏抽敭瑕佺偣"
+ prop="keyPoints">
+ <el-input v-model="form.keyPoints"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ュ叧閿鐐癸紝鐢ㄩ�楀彿鍒嗛殧" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鍒涘缓浜�" prop="creator">
- <el-input v-model="form.creator" placeholder="璇疯緭鍏ュ垱寤轰汉" />
+ <el-form-item label="鍒涘缓浜�"
+ prop="creator">
+ <el-input v-model="form.creator"
+ placeholder="璇疯緭鍏ュ垱寤轰汉" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="浣跨敤娆℃暟" prop="usageCount">
- <el-input-number v-model="form.usageCount" :min="0" style="width: 100%" />
+ <el-form-item label="浣跨敤娆℃暟"
+ prop="usageCount">
+ <el-input-number v-model="form.usageCount"
+ :min="0"
+ style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</span>
</template>
</el-dialog>
-
<!-- 鏌ョ湅鐭ヨ瘑璇︽儏寮圭獥 -->
- <el-dialog
- v-model="viewDialogVisible"
- title="鐭ヨ瘑璇︽儏"
- width="900px"
- :close-on-click-modal="false"
- >
+ <el-dialog v-model="viewDialogVisible"
+ title="鐭ヨ瘑璇︽儏"
+ width="900px"
+ :close-on-click-modal="false">
<div class="knowledge-detail">
- <el-descriptions :column="2" border>
- <el-descriptions-item label="鐭ヨ瘑鏍囬" :span="2">
+ <el-descriptions :column="2"
+ border>
+ <el-descriptions-item label="鐭ヨ瘑鏍囬"
+ :span="2">
<span class="detail-title">{{ currentKnowledge.title }}</span>
</el-descriptions-item>
<el-descriptions-item label="鐭ヨ瘑绫诲瀷">
@@ -166,31 +195,25 @@
{{ currentKnowledge.createTime }}
</el-descriptions-item>
</el-descriptions>
-
<div class="detail-section">
<h4>闂鎻忚堪</h4>
<div class="detail-content">{{ currentKnowledge.problem }}</div>
</div>
-
<div class="detail-section">
<h4>瑙ｅ喅鏂规</h4>
<div class="detail-content">{{ currentKnowledge.solution }}</div>
</div>
-
<div class="detail-section">
<h4>鍏抽敭瑕佺偣</h4>
<div class="key-points">
- <el-tag
- v-for="(point, index) in currentKnowledge.keyPoints.split(',')"
- :key="index"
- type="success"
- style="margin-right: 8px; margin-bottom: 8px;"
- >
+ <el-tag v-for="(point, index) in currentKnowledge.keyPoints.split(',')"
+ :key="index"
+ type="success"
+ style="margin-right: 8px; margin-bottom: 8px;">
{{ point.trim() }}
</el-tag>
</div>
</div>
-
<div class="detail-section">
<h4>浣跨敤缁熻</h4>
<div class="usage-stats">
@@ -217,11 +240,11 @@
</div>
</div>
</div>
-
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="copyKnowledge">澶嶅埗鐭ヨ瘑</el-button>
<el-button @click="viewDialogVisible = false">鍏抽棴</el-button>
- <el-button type="primary" @click="copyKnowledge">澶嶅埗鐭ヨ瘑</el-button>
<!-- <el-button type="success" @click="markAsFavorite">鏀惰棌@</el-button> -->
</span>
</template>
@@ -230,333 +253,42 @@
</template>
<script setup>
-import { Search } from "@element-plus/icons-vue";
-import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
-import PIMTable from "@/components/PIMTable/PIMTable.vue";
-import { listKnowledgeBase, delKnowledgeBase,addKnowledgeBase,updateKnowledgeBase } from "@/api/collaborativeApproval/knowledgeBase.js";
+ import { Search } from "@element-plus/icons-vue";
+ import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import PIMTable from "@/components/PIMTable/PIMTable.vue";
+ import {
+ listKnowledgeBase,
+ delKnowledgeBase,
+ addKnowledgeBase,
+ updateKnowledgeBase,
+ } from "@/api/collaborativeApproval/knowledgeBase.js";
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- title: [
- { required: true, message: "璇疯緭鍏ョ煡璇嗘爣棰�", trigger: "blur" }
- ],
- type: [
- { required: true, message: "璇烽�夋嫨鐭ヨ瘑绫诲瀷", trigger: "change" }
- ],
- problem: [
- { required: true, message: "璇锋弿杩伴亣鍒扮殑闂", trigger: "blur" }
- ],
- solution: [
- { required: true, message: "璇疯缁嗘弿杩拌В鍐虫柟妗�", trigger: "blur" }
- ]
-};
-
-// 鍝嶅簲寮忔暟鎹�
-const data = reactive({
- searchForm: {
- title: "",
- type: "",
- },
- tableLoading: false,
- page: {
- current: 1,
- size: 20,
- total: 0,
- },
- tableData: [],
- selectedIds: [],
- form: {
- title: "",
- type: "",
- scenario: "",
- efficiency: "",
- problem: "",
- solution: "",
- keyPoints: "",
- creator: "",
- usageCount: 0
- },
- dialogVisible: false,
- dialogTitle: "",
- dialogType: "add",
- viewDialogVisible: false,
- currentKnowledge: {}
-});
-
-const {
- searchForm,
- tableLoading,
- page,
- tableData,
- selectedIds,
- form,
- dialogVisible,
- dialogTitle,
- dialogType,
- viewDialogVisible,
- currentKnowledge
-} = toRefs(data);
-
-// 琛ㄥ崟寮曠敤
-const formRef = ref();
-
-// 琛ㄦ牸鍒楅厤缃�
-const tableColumn = ref([
- {
- label: "鐭ヨ瘑鏍囬",
- prop: "title",
- showOverflowTooltip: true,
- },
- {
- label: "鐭ヨ瘑绫诲瀷",
- prop: "type",
- dataType: "tag",
- formatData: (params) => {
- const typeMap = {
- contract: "鍚堝悓鐗规壒",
- approval: "瀹℃壒妗堜緥",
- solution: "瑙ｅ喅鏂规",
- experience: "缁忛獙鎬荤粨",
- guide: "鎿嶄綔鎸囧崡"
- };
- return typeMap[params] || params;
- },
- formatType: (params) => {
- const typeMap = {
- contract: "success",
- approval: "warning",
- solution: "primary",
- experience: "info",
- guide: "danger"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "閫傜敤鍦烘櫙",
- prop: "scenario",
- width: 150,
- showOverflowTooltip: true,
- },
- {
- label: "瑙ｅ喅鏁堢巼",
- prop: "efficiency",
- dataType: "tag",
- formatData: (params) => {
- const efficiencyMap = {
- high: "鏄捐憲鎻愬崌",
- medium: "涓�鑸彁鍗�",
- low: "杞诲井鎻愬崌"
- };
- return efficiencyMap[params] || params;
- },
- formatType: (params) => {
- const typeMap = {
- high: "success",
- medium: "warning",
- low: "info"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "浣跨敤娆℃暟",
- prop: "usageCount",
- width: 100,
- align: "center"
- },
- {
- label: "鍒涘缓浜�",
- prop: "creator",
- width: 120,
- },
- {
- label: "鍒涘缓鏃堕棿",
- prop: "createTime",
- width: 180,
- },
- {
- dataType: "action",
- label: "鎿嶄綔",
- align: "center",
- fixed: "right",
- width: 200,
- operation: [
- {
- name: "缂栬緫",
- type: "text",
- clickFun: (row) => {
- openForm("edit", row);
- }
- },
- {
- name: "鏌ョ湅",
- type: "text",
- clickFun: (row) => {
- viewKnowledge(row);
- }
- }
- ]
- }
-]);
-
-// 妯℃嫙鏁版嵁
-// let mockData = [
-// {
-// id: "1",
-// title: "鐗规畩鍚堝悓瀹℃壒娴佺▼浼樺寲鏂规",
-// type: "contract",
-// scenario: "澶ч鍚堝悓蹇�熷鎵�",
-// efficiency: "high",
-// problem: "澶ч鍚堝悓瀹℃壒娴佺▼澶嶆潅锛屽鎵规椂闂撮暱锛屽奖鍝嶄笟鍔¤繘灞�",
-// solution: "寤虹珛缁胯壊閫氶亾锛屽绗﹀悎鏉′欢鐨勫悎鍚岄噰鐢ㄧ畝鍖栧鎵规祦绋嬶紝鐢遍儴闂ㄨ礋璐ｄ汉鐩存帴瀹℃壒锛屽钩鍧囧鎵规椂闂翠粠3澶╃缉鐭嚦1澶�",
-// keyPoints: "缁胯壊閫氶亾鏉′欢,绠�鍖栨祦绋�,瀹℃壒鏉冮檺,鏃堕棿鎺у埗",
-// creator: "寮犵粡鐞�",
-// usageCount: 15,
-// createTime: "2024-01-15 10:30:00"
-// },
-// {
-// id: "2",
-// title: "璺ㄩ儴闂ㄥ崗浣滃鎵圭粡楠屾�荤粨",
-// type: "experience",
-// scenario: "澶氶儴闂ㄥ崗浣滈」鐩�",
-// efficiency: "medium",
-// problem: "璺ㄩ儴闂ㄩ」鐩鎵规椂锛屽悇閮ㄩ棬鎰忚涓嶇粺涓�锛屽鎵硅繘搴︾紦鎱�",
-// solution: "寤虹珛椤圭洰鍗忚皟鏈哄埗锛屾寚瀹氶」鐩礋璐ｄ汉锛屽畾鏈熷彫寮�鍗忚皟浼氳锛岀粺涓�鍚勬柟鎰忚鍚庡啀杩涜瀹℃壒",
-// keyPoints: "椤圭洰鍗忚皟,瀹氭湡浼氳,缁熶竴鎰忚,璐熻矗浜哄埗搴�",
-// creator: "鏉庝富绠�",
-// usageCount: 8,
-// createTime: "2024-01-14 15:20:00"
-// },
-// {
-// id: "3",
-// title: "绱ф�ラ噰璐鎵规搷浣滄寚鍗�",
-// type: "guide",
-// scenario: "绱ф�ラ噰璐渶姹�",
-// efficiency: "high",
-// problem: "绱ф�ラ噰璐椂瀹℃壒娴佺▼澶嶆潅锛屾棤娉曟弧瓒崇揣鎬ラ渶姹�",
-// solution: "鍒跺畾绱ф�ラ噰璐鎵规爣鍑嗭紝鏄庣‘绱ф�ョ▼搴﹀垎绾э紝涓嶅悓绾у埆閲囩敤涓嶅悓瀹℃壒娴佺▼锛岀‘淇濈揣鎬ラ渶姹傚緱鍒板強鏃跺鐞�",
-// keyPoints: "绱ф�ュ垎绾�,鏍囧噯鍒跺畾,娴佺▼绠�鍖�,鍙婃椂澶勭悊",
-// creator: "鐜嬩笓鍛�",
-// usageCount: 12,
-// createTime: "2024-01-13 09:15:00"
-// }
-// ];
-
-// 鐭ヨ瘑鏍囬妯℃澘
-const titleTemplates = [
- "{type}瀹℃壒娴佺▼浼樺寲鏂规",
- "{scenario}澶勭悊缁忛獙鎬荤粨",
- "{type}鐗规畩鎯呭喌澶勭悊鎸囧崡",
- "{scenario}蹇�熷鎵规柟妗�",
- "{type}鏍囧噯鍖栨搷浣滄祦绋�",
- "{scenario}闂瑙ｅ喅鏂规",
- "{type}鏈�浣冲疄璺垫�荤粨",
- "{scenario}鏁堢巼鎻愬崌鏂规"
-];
-
-// 鐭ヨ瘑绫诲瀷閰嶇疆
-const knowledgeTypes = [
- { type: "contract", label: "鍚堝悓鐗规壒", efficiency: "high" },
- { type: "approval", label: "瀹℃壒妗堜緥", efficiency: "medium" },
- { type: "solution", label: "瑙ｅ喅鏂规", efficiency: "high" },
- { type: "experience", label: "缁忛獙鎬荤粨", efficiency: "medium" },
- { type: "guide", label: "鎿嶄綔鎸囧崡", efficiency: "low" }
-];
-
-// 鍦烘櫙鍒楄〃
-const scenarios = ["澶ч鍚堝悓瀹℃壒", "璺ㄩ儴闂ㄥ崗浣�", "绱ф�ラ噰璐�", "鐗规畩鐢宠", "娴佺▼浼樺寲", "闂澶勭悊", "鏍囧噯鍖栧缓璁�", "鏁堢巼鎻愬崌"];
-
-// 鑷姩鐢熸垚鏂版暟鎹�
-const generateNewData = () => {
- const newId = (mockData.length + 1).toString();
- const now = new Date();
- const randomType = knowledgeTypes[Math.floor(Math.random() * knowledgeTypes.length)];
- const randomScenario = scenarios[Math.floor(Math.random() * scenarios.length)];
-
- // 鐢熸垚闅忔満鏍囬
- let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
- title = title
- .replace('{type}', randomType.label)
- .replace('{scenario}', randomScenario);
-
- const newKnowledge = {
- id: newId,
- title: title,
- type: randomType.type,
- scenario: randomScenario,
- efficiency: randomType.efficiency,
- problem: `鍦�${randomScenario}杩囩▼涓亣鍒扮殑闂鎻忚堪...`,
- solution: `閽堝${randomScenario}鐨勮В鍐虫柟妗堝拰鎿嶄綔姝ラ...`,
- keyPoints: "鍏抽敭瑕佺偣1,鍏抽敭瑕佺偣2,鍏抽敭瑕佺偣3,鍏抽敭瑕佺偣4",
- creator: ["寮犵粡鐞�", "鏉庝富绠�", "鐜嬩笓鍛�", "鍒樻�荤洃"][Math.floor(Math.random() * 4)],
- usageCount: Math.floor(Math.random() * 20) + 1,
- createTime: now.toLocaleString()
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ title: [{ required: true, message: "璇疯緭鍏ョ煡璇嗘爣棰�", trigger: "blur" }],
+ type: [{ required: true, message: "璇烽�夋嫨鐭ヨ瘑绫诲瀷", trigger: "change" }],
+ problem: [{ required: true, message: "璇锋弿杩伴亣鍒扮殑闂", trigger: "blur" }],
+ solution: [
+ { required: true, message: "璇疯缁嗘弿杩拌В鍐虫柟妗�", trigger: "blur" },
+ ],
};
- // 娣诲姞鍒版暟鎹紑澶�
- mockData.unshift(newKnowledge);
-
- // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�30鏉★級
- if (mockData.length > 30) {
- mockData = mockData.slice(0, 30);
- }
-
- console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂扮煡璇�: ${title}`);
-};
-
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- getList();
- startAutoRefresh();
-});
-
-// 寮�濮嬭嚜鍔ㄥ埛鏂�
-const startAutoRefresh = () => {
- setInterval(() => {
- generateNewData();
- getList();
- }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
-};
-
-// 鏌ヨ鏁版嵁
-const handleQuery = () => {
- page.value.current = 1;
- getList();
-};
-
-const getList = () => {
- tableLoading.value = true;
- listKnowledgeBase({...page.value, ...searchForm.value})
- .then(res => {
- tableLoading.value = false;
- tableData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- tableLoading.value = false;
- })
-};
-
-// 鍒嗛〉澶勭悊
-const pagination = (obj) => {
- page.value.current = obj.page;
- page.value.size = obj.limit;
- handleQuery();
-};
-
-// 閫夋嫨鍙樺寲澶勭悊
-const handleSelectionChange = (selection) => {
- selectedIds.value = selection.map(item => item.id);
-};
-
-// 鎵撳紑琛ㄥ崟
-const openForm = (type, row = null) => {
- dialogType.value = type;
- if (type === "add") {
- dialogTitle.value = "鏂板鐭ヨ瘑";
- // 閲嶇疆琛ㄥ崟
- Object.assign(form.value, {
+ // 鍝嶅簲寮忔暟鎹�
+ const data = reactive({
+ searchForm: {
+ title: "",
+ type: "",
+ },
+ tableLoading: false,
+ page: {
+ current: 1,
+ size: 20,
+ total: 0,
+ },
+ tableData: [],
+ selectedIds: [],
+ form: {
title: "",
type: "",
scenario: "",
@@ -565,262 +297,581 @@
solution: "",
keyPoints: "",
creator: "",
- usageCount: 0
- });
- } else if (type === "edit" && row) {
- dialogTitle.value = "缂栬緫鐭ヨ瘑";
- Object.assign(form.value, {
- id: row.id,
- title: row.title,
- type: row.type,
- scenario: row.scenario,
- efficiency: row.efficiency,
- problem: row.problem,
- solution: row.solution,
- keyPoints: row.keyPoints,
- creator: row.creator,
- usageCount: row.usageCount
- });
- }
- dialogVisible.value = true;
-};
-
-// 鏌ョ湅鐭ヨ瘑璇︽儏
-const viewKnowledge = (row) => {
- currentKnowledge.value = { ...row };
- viewDialogVisible.value = true;
-};
-
-// 鑾峰彇绫诲瀷鏍囩绫诲瀷
-const getTypeTagType = (type) => {
- const typeMap = {
- contract: "success",
- approval: "warning",
- solution: "primary",
- experience: "info",
- guide: "danger"
- };
- return typeMap[type] || "info";
-};
-
-// 鑾峰彇绫诲瀷鏍囩鏂囨湰
-const getTypeLabel = (type) => {
- const typeMap = {
- contract: "鍚堝悓鐗规壒",
- approval: "瀹℃壒妗堜緥",
- solution: "瑙ｅ喅鏂规",
- experience: "缁忛獙鎬荤粨",
- guide: "鎿嶄綔鎸囧崡"
- };
- return typeMap[type] || type;
-};
-
-// 鑾峰彇鏁堢巼鏍囩绫诲瀷
-const getEfficiencyTagType = (efficiency) => {
- const typeMap = {
- high: "success",
- medium: "warning",
- low: "info"
- };
- return typeMap[efficiency] || "info";
-};
-
-// 鑾峰彇鏁堢巼鏍囩鏂囨湰
-const getEfficiencyLabel = (efficiency) => {
- const efficiencyMap = {
- high: "鏄捐憲鎻愬崌",
- medium: "涓�鑸彁鍗�",
- low: "杞诲井鎻愬崌"
- };
- return efficiencyMap[efficiency] || efficiency;
-};
-
-// 鑾峰彇鏁堢巼鎻愬崌鐧惧垎姣�
-const getEfficiencyScore = (efficiency) => {
- const scoreMap = {
- high: 40,
- medium: 25,
- low: 15
- };
- return scoreMap[efficiency] || 0;
-};
-
-// 鑾峰彇骞冲潎鑺傜渷鏃堕棿
-const getTimeSaved = (efficiency) => {
- const timeMap = {
- high: "2-3澶�",
- medium: "1-2澶�",
- low: "0.5-1澶�"
- };
- return timeMap[efficiency] || "鏈煡";
-};
-
-// 澶嶅埗鐭ヨ瘑
-const copyKnowledge = () => {
- const knowledgeText = `
- 鐭ヨ瘑鏍囬锛�${currentKnowledge.value.title}
- 鐭ヨ瘑绫诲瀷锛�${getTypeLabel(currentKnowledge.value.type)}
- 閫傜敤鍦烘櫙锛�${currentKnowledge.value.scenario}
- 闂鎻忚堪锛�${currentKnowledge.value.problem}
- 瑙ｅ喅鏂规锛�${currentKnowledge.value.solution}
- 鍏抽敭瑕佺偣锛�${currentKnowledge.value.keyPoints}
- 鍒涘缓浜猴細${currentKnowledge.value.creator}
- `.trim();
-
- // 澶嶅埗鍒板壀璐存澘
- navigator.clipboard.writeText(knowledgeText).then(() => {
- ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
- }).catch(() => {
- ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+ usageCount: 0,
+ },
+ dialogVisible: false,
+ dialogTitle: "",
+ dialogType: "add",
+ viewDialogVisible: false,
+ currentKnowledge: {},
});
-};
-// 鏀惰棌鐭ヨ瘑
-const markAsFavorite = () => {
- // 澧炲姞浣跨敤娆℃暟
- const index = mockData.findIndex(item => item.id === currentKnowledge.value.id);
- if (index !== -1) {
- mockData[index].usageCount += 1;
- currentKnowledge.value.usageCount += 1;
- }
+ const {
+ searchForm,
+ tableLoading,
+ page,
+ tableData,
+ selectedIds,
+ form,
+ dialogVisible,
+ dialogTitle,
+ dialogType,
+ viewDialogVisible,
+ currentKnowledge,
+ } = toRefs(data);
- ElMessage.success("宸叉敹钘忥紝浣跨敤娆℃暟+1");
-};
+ // 琛ㄥ崟寮曠敤
+ const formRef = ref();
-// 鎻愪氦鐭ヨ瘑琛ㄥ崟
-const submitForm = async () => {
- try {
- await formRef.value.validate();
- if (dialogType.value === "add") {
- // 鏂板鐭ヨ瘑
- addKnowledgeBase({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else {
- updateKnowledgeBase({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+ // 琛ㄦ牸鍒楅厤缃�
+ const tableColumn = ref([
+ {
+ label: "鐭ヨ瘑鏍囬",
+ prop: "title",
+ showOverflowTooltip: true,
+ },
+ {
+ label: "鐭ヨ瘑绫诲瀷",
+ prop: "type",
+ dataType: "tag",
+ formatData: params => {
+ const typeMap = {
+ contract: "鍚堝悓鐗规壒",
+ approval: "瀹℃壒妗堜緥",
+ solution: "瑙ｅ喅鏂规",
+ experience: "缁忛獙鎬荤粨",
+ guide: "鎿嶄綔鎸囧崡",
+ };
+ return typeMap[params] || params;
+ },
+ formatType: params => {
+ const typeMap = {
+ contract: "success",
+ approval: "warning",
+ solution: "primary",
+ experience: "info",
+ guide: "danger",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "閫傜敤鍦烘櫙",
+ prop: "scenario",
+ width: 150,
+ showOverflowTooltip: true,
+ },
+ {
+ label: "瑙ｅ喅鏁堢巼",
+ prop: "efficiency",
+ dataType: "tag",
+ formatData: params => {
+ const efficiencyMap = {
+ high: "鏄捐憲鎻愬崌",
+ medium: "涓�鑸彁鍗�",
+ low: "杞诲井鎻愬崌",
+ };
+ return efficiencyMap[params] || params;
+ },
+ formatType: params => {
+ const typeMap = {
+ high: "success",
+ medium: "warning",
+ low: "info",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "浣跨敤娆℃暟",
+ prop: "usageCount",
+ width: 100,
+ align: "center",
+ },
+ {
+ label: "鍒涘缓浜�",
+ prop: "creator",
+ width: 120,
+ },
+ {
+ label: "鍒涘缓鏃堕棿",
+ prop: "createTime",
+ width: 180,
+ },
+ {
+ dataType: "action",
+ label: "鎿嶄綔",
+ align: "center",
+ fixed: "right",
+ width: 200,
+ operation: [
+ {
+ name: "缂栬緫",
+ type: "text",
+ clickFun: row => {
+ openForm("edit", row);
+ },
+ },
+ {
+ name: "鏌ョ湅",
+ type: "text",
+ clickFun: row => {
+ viewKnowledge(row);
+ },
+ },
+ ],
+ },
+ ]);
+
+ // 妯℃嫙鏁版嵁
+ // let mockData = [
+ // {
+ // id: "1",
+ // title: "鐗规畩鍚堝悓瀹℃壒娴佺▼浼樺寲鏂规",
+ // type: "contract",
+ // scenario: "澶ч鍚堝悓蹇�熷鎵�",
+ // efficiency: "high",
+ // problem: "澶ч鍚堝悓瀹℃壒娴佺▼澶嶆潅锛屽鎵规椂闂撮暱锛屽奖鍝嶄笟鍔¤繘灞�",
+ // solution: "寤虹珛缁胯壊閫氶亾锛屽绗﹀悎鏉′欢鐨勫悎鍚岄噰鐢ㄧ畝鍖栧鎵规祦绋嬶紝鐢遍儴闂ㄨ礋璐ｄ汉鐩存帴瀹℃壒锛屽钩鍧囧鎵规椂闂翠粠3澶╃缉鐭嚦1澶�",
+ // keyPoints: "缁胯壊閫氶亾鏉′欢,绠�鍖栨祦绋�,瀹℃壒鏉冮檺,鏃堕棿鎺у埗",
+ // creator: "寮犵粡鐞�",
+ // usageCount: 15,
+ // createTime: "2024-01-15 10:30:00"
+ // },
+ // {
+ // id: "2",
+ // title: "璺ㄩ儴闂ㄥ崗浣滃鎵圭粡楠屾�荤粨",
+ // type: "experience",
+ // scenario: "澶氶儴闂ㄥ崗浣滈」鐩�",
+ // efficiency: "medium",
+ // problem: "璺ㄩ儴闂ㄩ」鐩鎵规椂锛屽悇閮ㄩ棬鎰忚涓嶇粺涓�锛屽鎵硅繘搴︾紦鎱�",
+ // solution: "寤虹珛椤圭洰鍗忚皟鏈哄埗锛屾寚瀹氶」鐩礋璐ｄ汉锛屽畾鏈熷彫寮�鍗忚皟浼氳锛岀粺涓�鍚勬柟鎰忚鍚庡啀杩涜瀹℃壒",
+ // keyPoints: "椤圭洰鍗忚皟,瀹氭湡浼氳,缁熶竴鎰忚,璐熻矗浜哄埗搴�",
+ // creator: "鏉庝富绠�",
+ // usageCount: 8,
+ // createTime: "2024-01-14 15:20:00"
+ // },
+ // {
+ // id: "3",
+ // title: "绱ф�ラ噰璐鎵规搷浣滄寚鍗�",
+ // type: "guide",
+ // scenario: "绱ф�ラ噰璐渶姹�",
+ // efficiency: "high",
+ // problem: "绱ф�ラ噰璐椂瀹℃壒娴佺▼澶嶆潅锛屾棤娉曟弧瓒崇揣鎬ラ渶姹�",
+ // solution: "鍒跺畾绱ф�ラ噰璐鎵规爣鍑嗭紝鏄庣‘绱ф�ョ▼搴﹀垎绾э紝涓嶅悓绾у埆閲囩敤涓嶅悓瀹℃壒娴佺▼锛岀‘淇濈揣鎬ラ渶姹傚緱鍒板強鏃跺鐞�",
+ // keyPoints: "绱ф�ュ垎绾�,鏍囧噯鍒跺畾,娴佺▼绠�鍖�,鍙婃椂澶勭悊",
+ // creator: "鐜嬩笓鍛�",
+ // usageCount: 12,
+ // createTime: "2024-01-13 09:15:00"
+ // }
+ // ];
+
+ // 鐭ヨ瘑鏍囬妯℃澘
+ const titleTemplates = [
+ "{type}瀹℃壒娴佺▼浼樺寲鏂规",
+ "{scenario}澶勭悊缁忛獙鎬荤粨",
+ "{type}鐗规畩鎯呭喌澶勭悊鎸囧崡",
+ "{scenario}蹇�熷鎵规柟妗�",
+ "{type}鏍囧噯鍖栨搷浣滄祦绋�",
+ "{scenario}闂瑙ｅ喅鏂规",
+ "{type}鏈�浣冲疄璺垫�荤粨",
+ "{scenario}鏁堢巼鎻愬崌鏂规",
+ ];
+
+ // 鐭ヨ瘑绫诲瀷閰嶇疆
+ const knowledgeTypes = [
+ { type: "contract", label: "鍚堝悓鐗规壒", efficiency: "high" },
+ { type: "approval", label: "瀹℃壒妗堜緥", efficiency: "medium" },
+ { type: "solution", label: "瑙ｅ喅鏂规", efficiency: "high" },
+ { type: "experience", label: "缁忛獙鎬荤粨", efficiency: "medium" },
+ { type: "guide", label: "鎿嶄綔鎸囧崡", efficiency: "low" },
+ ];
+
+ // 鍦烘櫙鍒楄〃
+ const scenarios = [
+ "澶ч鍚堝悓瀹℃壒",
+ "璺ㄩ儴闂ㄥ崗浣�",
+ "绱ф�ラ噰璐�",
+ "鐗规畩鐢宠",
+ "娴佺▼浼樺寲",
+ "闂澶勭悊",
+ "鏍囧噯鍖栧缓璁�",
+ "鏁堢巼鎻愬崌",
+ ];
+
+ // 鑷姩鐢熸垚鏂版暟鎹�
+ const generateNewData = () => {
+ const newId = (mockData.length + 1).toString();
+ const now = new Date();
+ const randomType =
+ knowledgeTypes[Math.floor(Math.random() * knowledgeTypes.length)];
+ const randomScenario =
+ scenarios[Math.floor(Math.random() * scenarios.length)];
+
+ // 鐢熸垚闅忔満鏍囬
+ let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
+ title = title
+ .replace("{type}", randomType.label)
+ .replace("{scenario}", randomScenario);
+
+ const newKnowledge = {
+ id: newId,
+ title: title,
+ type: randomType.type,
+ scenario: randomScenario,
+ efficiency: randomType.efficiency,
+ problem: `鍦�${randomScenario}杩囩▼涓亣鍒扮殑闂鎻忚堪...`,
+ solution: `閽堝${randomScenario}鐨勮В鍐虫柟妗堝拰鎿嶄綔姝ラ...`,
+ keyPoints: "鍏抽敭瑕佺偣1,鍏抽敭瑕佺偣2,鍏抽敭瑕佺偣3,鍏抽敭瑕佺偣4",
+ creator: ["寮犵粡鐞�", "鏉庝富绠�", "鐜嬩笓鍛�", "鍒樻�荤洃"][
+ Math.floor(Math.random() * 4)
+ ],
+ usageCount: Math.floor(Math.random() * 20) + 1,
+ createTime: now.toLocaleString(),
+ };
+
+ // 娣诲姞鍒版暟鎹紑澶�
+ mockData.unshift(newKnowledge);
+
+ // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�30鏉★級
+ if (mockData.length > 30) {
+ mockData = mockData.slice(0, 30);
}
- } catch (error) {
- console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
- }
-};
-// 鍒犻櫎鐭ヨ瘑
-const handleDelete = () => {
- if (selectedIds.value.length === 0) {
- ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鐭ヨ瘑");
- return;
- }
+ console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂扮煡璇�: ${title}`);
+ };
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
- // console.log(selectedIds.value);
- delKnowledgeBase(selectedIds.value).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- selectedIds.value = [];
- getList();
- }
- })
- }).catch(() => {
- // 鐢ㄦ埛鍙栨秷
+ // 鐢熷懡鍛ㄦ湡
+ onMounted(() => {
+ getList();
+ startAutoRefresh();
});
-};
-// 瀵煎嚭
-const { proxy } = getCurrentInstance()
-const handleExport = () => {
- proxy.download('/knowledgeBase/export', { ...searchForm.value }, '鐭ヨ瘑搴�.xlsx')
-}
+ // 寮�濮嬭嚜鍔ㄥ埛鏂�
+ const startAutoRefresh = () => {
+ setInterval(() => {
+ generateNewData();
+ getList();
+ }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
+ };
+
+ // 鏌ヨ鏁版嵁
+ const handleQuery = () => {
+ page.value.current = 1;
+ getList();
+ };
+
+ const getList = () => {
+ tableLoading.value = true;
+ listKnowledgeBase({ ...page.value, ...searchForm.value })
+ .then(res => {
+ tableLoading.value = false;
+ tableData.value = res.data.records;
+ page.total = res.data.total;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
+
+ // 鍒嗛〉澶勭悊
+ const pagination = obj => {
+ page.value.current = obj.page;
+ page.value.size = obj.limit;
+ handleQuery();
+ };
+
+ // 閫夋嫨鍙樺寲澶勭悊
+ const handleSelectionChange = selection => {
+ selectedIds.value = selection.map(item => item.id);
+ };
+
+ // 鎵撳紑琛ㄥ崟
+ const openForm = (type, row = null) => {
+ dialogType.value = type;
+ if (type === "add") {
+ dialogTitle.value = "鏂板鐭ヨ瘑";
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(form.value, {
+ title: "",
+ type: "",
+ scenario: "",
+ efficiency: "",
+ problem: "",
+ solution: "",
+ keyPoints: "",
+ creator: "",
+ usageCount: 0,
+ });
+ } else if (type === "edit" && row) {
+ dialogTitle.value = "缂栬緫鐭ヨ瘑";
+ Object.assign(form.value, {
+ id: row.id,
+ title: row.title,
+ type: row.type,
+ scenario: row.scenario,
+ efficiency: row.efficiency,
+ problem: row.problem,
+ solution: row.solution,
+ keyPoints: row.keyPoints,
+ creator: row.creator,
+ usageCount: row.usageCount,
+ });
+ }
+ dialogVisible.value = true;
+ };
+
+ // 鏌ョ湅鐭ヨ瘑璇︽儏
+ const viewKnowledge = row => {
+ currentKnowledge.value = { ...row };
+ viewDialogVisible.value = true;
+ };
+
+ // 鑾峰彇绫诲瀷鏍囩绫诲瀷
+ const getTypeTagType = type => {
+ const typeMap = {
+ contract: "success",
+ approval: "warning",
+ solution: "primary",
+ experience: "info",
+ guide: "danger",
+ };
+ return typeMap[type] || "info";
+ };
+
+ // 鑾峰彇绫诲瀷鏍囩鏂囨湰
+ const getTypeLabel = type => {
+ const typeMap = {
+ contract: "鍚堝悓鐗规壒",
+ approval: "瀹℃壒妗堜緥",
+ solution: "瑙ｅ喅鏂规",
+ experience: "缁忛獙鎬荤粨",
+ guide: "鎿嶄綔鎸囧崡",
+ };
+ return typeMap[type] || type;
+ };
+
+ // 鑾峰彇鏁堢巼鏍囩绫诲瀷
+ const getEfficiencyTagType = efficiency => {
+ const typeMap = {
+ high: "success",
+ medium: "warning",
+ low: "info",
+ };
+ return typeMap[efficiency] || "info";
+ };
+
+ // 鑾峰彇鏁堢巼鏍囩鏂囨湰
+ const getEfficiencyLabel = efficiency => {
+ const efficiencyMap = {
+ high: "鏄捐憲鎻愬崌",
+ medium: "涓�鑸彁鍗�",
+ low: "杞诲井鎻愬崌",
+ };
+ return efficiencyMap[efficiency] || efficiency;
+ };
+
+ // 鑾峰彇鏁堢巼鎻愬崌鐧惧垎姣�
+ const getEfficiencyScore = efficiency => {
+ const scoreMap = {
+ high: 40,
+ medium: 25,
+ low: 15,
+ };
+ return scoreMap[efficiency] || 0;
+ };
+
+ // 鑾峰彇骞冲潎鑺傜渷鏃堕棿
+ const getTimeSaved = efficiency => {
+ const timeMap = {
+ high: "2-3澶�",
+ medium: "1-2澶�",
+ low: "0.5-1澶�",
+ };
+ return timeMap[efficiency] || "鏈煡";
+ };
+
+ // 澶嶅埗鐭ヨ瘑
+ const copyKnowledge = () => {
+ const knowledgeText = `
+ 鐭ヨ瘑鏍囬锛�${currentKnowledge.value.title}
+ 鐭ヨ瘑绫诲瀷锛�${getTypeLabel(currentKnowledge.value.type)}
+ 閫傜敤鍦烘櫙锛�${currentKnowledge.value.scenario}
+ 闂鎻忚堪锛�${currentKnowledge.value.problem}
+ 瑙ｅ喅鏂规锛�${currentKnowledge.value.solution}
+ 鍏抽敭瑕佺偣锛�${currentKnowledge.value.keyPoints}
+ 鍒涘缓浜猴細${currentKnowledge.value.creator}
+ `.trim();
+
+ // 澶嶅埗鍒板壀璐存澘
+ navigator.clipboard
+ .writeText(knowledgeText)
+ .then(() => {
+ ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
+ })
+ .catch(() => {
+ ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+ });
+ };
+
+ // 鏀惰棌鐭ヨ瘑
+ const markAsFavorite = () => {
+ // 澧炲姞浣跨敤娆℃暟
+ const index = mockData.findIndex(
+ item => item.id === currentKnowledge.value.id
+ );
+ if (index !== -1) {
+ mockData[index].usageCount += 1;
+ currentKnowledge.value.usageCount += 1;
+ }
+
+ ElMessage.success("宸叉敹钘忥紝浣跨敤娆℃暟+1");
+ };
+
+ // 鎻愪氦鐭ヨ瘑琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ await formRef.value.validate();
+ if (dialogType.value === "add") {
+ // 鏂板鐭ヨ瘑
+ addKnowledgeBase({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else {
+ updateKnowledgeBase({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ }
+ } catch (error) {
+ console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
+ }
+ };
+
+ // 鍒犻櫎鐭ヨ瘑
+ const handleDelete = () => {
+ if (selectedIds.value.length === 0) {
+ ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鐭ヨ瘑");
+ return;
+ }
+
+ ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ // console.log(selectedIds.value);
+ delKnowledgeBase(selectedIds.value).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ selectedIds.value = [];
+ getList();
+ }
+ });
+ })
+ .catch(() => {
+ // 鐢ㄦ埛鍙栨秷
+ });
+ };
+
+ // 瀵煎嚭
+ const { proxy } = getCurrentInstance();
+ const handleExport = () => {
+ proxy.download(
+ "/knowledgeBase/export",
+ { ...searchForm.value },
+ "鐭ヨ瘑搴�.xlsx"
+ );
+ };
</script>
<style scoped>
-.auto-refresh-info {
- margin-bottom: 15px;
-}
+ .auto-refresh-info {
+ margin-bottom: 15px;
+ }
-.auto-refresh-info .el-alert {
- border-radius: 8px;
-}
+ .auto-refresh-info .el-alert {
+ border-radius: 8px;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
-.knowledge-detail {
- padding: 20px 0;
-}
+ .knowledge-detail {
+ padding: 20px 0;
+ }
-.detail-title {
- font-size: 18px;
- font-weight: bold;
- color: #303133;
-}
+ .detail-title {
+ font-size: 18px;
+ font-weight: bold;
+ color: #303133;
+ }
-.detail-section {
- margin-top: 24px;
-}
+ .detail-section {
+ margin-top: 24px;
+ }
-.detail-section h4 {
- margin: 0 0 12px 0;
- font-size: 16px;
- font-weight: 600;
- color: #303133;
- border-left: 4px solid #409eff;
- padding-left: 12px;
-}
+ .detail-section h4 {
+ margin: 0 0 12px 0;
+ font-size: 16px;
+ font-weight: 600;
+ color: #303133;
+ border-left: 4px solid #409eff;
+ padding-left: 12px;
+ }
-.detail-content {
- background: #f8f9fa;
- padding: 16px;
- border-radius: 6px;
- line-height: 1.6;
- color: #606266;
- white-space: pre-wrap;
-}
+ .detail-content {
+ background: #f8f9fa;
+ padding: 16px;
+ border-radius: 6px;
+ line-height: 1.6;
+ color: #606266;
+ white-space: pre-wrap;
+ }
-.key-points {
- display: flex;
- flex-wrap: wrap;
- gap: 8px;
-}
+ .key-points {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ }
-.usage-stats {
- margin-top: 16px;
-}
+ .usage-stats {
+ margin-top: 16px;
+ }
-.stat-item {
- text-align: center;
- padding: 20px;
- background: #f8f9fa;
- border-radius: 8px;
-}
+ .stat-item {
+ text-align: center;
+ padding: 20px;
+ background: #f8f9fa;
+ border-radius: 8px;
+ }
-.stat-number {
- font-size: 24px;
- font-weight: bold;
- color: #409eff;
- margin-bottom: 8px;
-}
+ .stat-number {
+ font-size: 24px;
+ font-weight: bold;
+ color: #409eff;
+ margin-bottom: 8px;
+ }
-.stat-label {
- font-size: 14px;
- color: #909399;
-}
+ .stat-label {
+ font-size: 14px;
+ color: #909399;
+ }
</style>
diff --git a/src/views/collaborativeApproval/notificationManagement/index.vue b/src/views/collaborativeApproval/notificationManagement/index.vue
index 8e1b792..ffbd7a6 100644
--- a/src/views/collaborativeApproval/notificationManagement/index.vue
+++ b/src/views/collaborativeApproval/notificationManagement/index.vue
@@ -3,300 +3,314 @@
<div class="search_form">
<div>
<span class="search_title">閫氱煡鏍囬锛�</span>
- <el-input
- v-model="searchForm.title"
- style="width: 240px"
- placeholder="璇疯緭鍏ラ�氱煡鏍囬鎼滅储"
- @change="handleQuery"
- clearable
- :prefix-icon="Search"
- />
+ <el-input v-model="searchForm.title"
+ style="width: 240px"
+ placeholder="璇疯緭鍏ラ�氱煡鏍囬鎼滅储"
+ @change="handleQuery"
+ clearable
+ :prefix-icon="Search" />
<span class="search_title ml10">閫氱煡绫诲瀷锛�</span>
- <el-select v-model="searchForm.type" clearable @change="handleQuery" style="width: 240px">
- <el-option label="鏀惧亣閫氱煡" :value="'holiday'" />
- <el-option label="澶勭綒閫氱煡" :value="'penalty'" />
- <el-option label="寮�浼氶�氱煡" :value="'meeting'" />
- <el-option label="涓存椂閫氱煡" :value="'temporary'" />
- <el-option label="姝ｅ紡閫氱煡" :value="'formal'" />
+ <el-select v-model="searchForm.type"
+ clearable
+ @change="handleQuery"
+ style="width: 240px">
+ <el-option label="鏀惧亣閫氱煡"
+ :value="'holiday'" />
+ <el-option label="澶勭綒閫氱煡"
+ :value="'penalty'" />
+ <el-option label="寮�浼氶�氱煡"
+ :value="'meeting'" />
+ <el-option label="涓存椂閫氱煡"
+ :value="'temporary'" />
+ <el-option label="姝ｅ紡閫氱煡"
+ :value="'formal'" />
</el-select>
- <el-button type="primary" @click="handleQuery" style="margin-left: 10px">
+ <el-button type="primary"
+ @click="handleQuery"
+ style="margin-left: 10px">
鎼滅储
</el-button>
</div>
<div>
- <el-button type="primary" @click="openForm('add')">鏂板閫氱煡</el-button>
- <el-button type="success" @click="openMeetingDialog">鍦ㄧ嚎浼氳</el-button>
- <el-button type="warning" @click="openFileShareDialog">鏂囦欢鍏变韩</el-button>
+ <el-button type="primary"
+ @click="openForm('add')">鏂板閫氱煡</el-button>
+ <el-button type="success"
+ @click="openMeetingDialog">鍦ㄧ嚎浼氳</el-button>
+ <el-button type="warning"
+ @click="openFileShareDialog">鏂囦欢鍏变韩</el-button>
<!-- <el-button type="info" @click="refreshEmployees">鍒锋柊鍛樺伐</el-button> -->
- <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+ <el-button type="danger"
+ plain
+ @click="handleDelete">鍒犻櫎</el-button>
</div>
</div>
<div class="table_list">
- <PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :page="page"
- :isSelection="true"
- @selection-change="handleSelectionChange"
- :tableLoading="tableLoading"
- @pagination="pagination"
- :total="page.total"
- ></PIMTable>
+ <PIMTable rowKey="id"
+ :column="tableColumn"
+ :tableData="tableData"
+ :page="page"
+ :isSelection="true"
+ @selection-change="handleSelectionChange"
+ :tableLoading="tableLoading"
+ @pagination="pagination"
+ :total="page.total"></PIMTable>
</div>
-
<!-- 鏂板/缂栬緫閫氱煡寮圭獥 -->
- <el-dialog
- v-model="dialogVisible"
- :title="dialogTitle"
- width="800px"
- :close-on-click-modal="false"
- >
- <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="800px"
+ :close-on-click-modal="false">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="120px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="閫氱煡鏍囬" prop="title">
- <el-input v-model="form.title" placeholder="璇疯緭鍏ラ�氱煡鏍囬" />
+ <el-form-item label="閫氱煡鏍囬"
+ prop="title">
+ <el-input v-model="form.title"
+ placeholder="璇疯緭鍏ラ�氱煡鏍囬" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="閫氱煡绫诲瀷" prop="type">
- <el-select v-model="form.type" placeholder="璇烽�夋嫨閫氱煡绫诲瀷" style="width: 100%">
- <el-option label="鏀惧亣閫氱煡" value="holiday" />
- <el-option label="澶勭綒閫氱煡" value="penalty" />
- <el-option label="寮�浼氶�氱煡" value="meeting" />
- <el-option label="涓存椂閫氱煡" value="temporary" />
- <el-option label="姝ｅ紡閫氱煡" value="formal" />
+ <el-form-item label="閫氱煡绫诲瀷"
+ prop="type">
+ <el-select v-model="form.type"
+ placeholder="璇烽�夋嫨閫氱煡绫诲瀷"
+ style="width: 100%">
+ <el-option label="鏀惧亣閫氱煡"
+ value="holiday" />
+ <el-option label="澶勭綒閫氱煡"
+ value="penalty" />
+ <el-option label="寮�浼氶�氱煡"
+ value="meeting" />
+ <el-option label="涓存椂閫氱煡"
+ value="temporary" />
+ <el-option label="姝ｅ紡閫氱煡"
+ value="formal" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="浼樺厛绾�" prop="priority">
- <el-select v-model="form.priority" placeholder="璇烽�夋嫨浼樺厛绾�" style="width: 100%">
- <el-option label="鏅��" value="low" />
- <el-option label="閲嶈" value="medium" />
- <el-option label="绱ф��" value="high" />
+ <el-form-item label="浼樺厛绾�"
+ prop="priority">
+ <el-select v-model="form.priority"
+ placeholder="璇烽�夋嫨浼樺厛绾�"
+ style="width: 100%">
+ <el-option label="鏅��"
+ value="low" />
+ <el-option label="閲嶈"
+ value="medium" />
+ <el-option label="绱ф��"
+ value="high" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鏈夋晥鏈熻嚦" prop="expireDate">
- <el-date-picker
- v-model="form.expireDate"
- type="date"
- placeholder="璇烽�夋嫨鏈夋晥鏈�"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- style="width: 100%"
- />
+ <el-form-item label="鏈夋晥鏈熻嚦"
+ prop="expireDate">
+ <el-date-picker v-model="form.expireDate"
+ type="date"
+ placeholder="璇烽�夋嫨鏈夋晥鏈�"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
- <el-form-item label="鎺ユ敹閮ㄩ棬" prop="departments">
- <el-select
- v-model="form.departments"
- multiple
- placeholder="璇烽�夋嫨鎺ユ敹閮ㄩ棬"
- style="width: 100%"
- >
- <el-option
- v-for="dept in departments"
- :key="dept"
- :label="dept"
- :value="dept"
- />
+ <el-form-item label="鎺ユ敹閮ㄩ棬"
+ prop="departments">
+ <el-select v-model="form.departments"
+ multiple
+ placeholder="璇烽�夋嫨鎺ユ敹閮ㄩ棬"
+ style="width: 100%">
+ <el-option v-for="dept in departments"
+ :key="dept"
+ :label="dept"
+ :value="dept" />
</el-select>
</el-form-item>
- <el-form-item label="鍚屾鏂瑰紡" prop="syncMethods">
+ <el-form-item label="鍚屾鏂瑰紡"
+ prop="syncMethods">
<el-checkbox-group v-model="form.syncMethods">
- <el-checkbox
- v-for="method in syncMethods"
- :key="method.value"
- :label="method.value"
- >
+ <el-checkbox v-for="method in syncMethods"
+ :key="method.value"
+ :label="method.value">
{{ method.label }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
- <el-form-item label="閫氱煡鍐呭" prop="content">
- <el-input
- v-model="form.content"
- type="textarea"
- :rows="4"
- placeholder="璇疯緭鍏ラ�氱煡鍐呭"
- />
+ <el-form-item label="閫氱煡鍐呭"
+ prop="content">
+ <el-input v-model="form.content"
+ type="textarea"
+ :rows="4"
+ placeholder="璇疯緭鍏ラ�氱煡鍐呭" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</span>
</template>
</el-dialog>
-
<!-- 鍦ㄧ嚎浼氳寮圭獥 -->
- <el-dialog
- v-model="meetingDialogVisible"
- title="鍒涘缓鍦ㄧ嚎浼氳"
- width="700px"
- :close-on-click-modal="false"
- >
- <el-form ref="meetingFormRef" :model="meetingForm" :rules="meetingRules" label-width="120px">
- <el-form-item label="浼氳鏍囬" prop="title">
- <el-input v-model="meetingForm.title" placeholder="璇疯緭鍏ヤ細璁爣棰�" />
+ <el-dialog v-model="meetingDialogVisible"
+ title="鍒涘缓鍦ㄧ嚎浼氳"
+ width="700px"
+ :close-on-click-modal="false">
+ <el-form ref="meetingFormRef"
+ :model="meetingForm"
+ :rules="meetingRules"
+ label-width="120px">
+ <el-form-item label="浼氳鏍囬"
+ prop="title">
+ <el-input v-model="meetingForm.title"
+ placeholder="璇疯緭鍏ヤ細璁爣棰�" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="寮�濮嬫椂闂�" prop="startTime">
- <el-date-picker
- v-model="meetingForm.startTime"
- type="datetime"
- value-format="YYYY-MM-DD HH:mm:ss"
- format="YYYY-MM-DD HH:mm:ss"
- placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
- style="width: 100%"
- />
+ <el-form-item label="寮�濮嬫椂闂�"
+ prop="startTime">
+ <el-date-picker v-model="meetingForm.startTime"
+ type="datetime"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ format="YYYY-MM-DD HH:mm:ss"
+ placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
+ style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="浼氳鏃堕暱" prop="duration">
- <el-input-number
- v-model="meetingForm.duration"
- :min="15"
- :max="480"
- :step="15"
- style="width: 100%"
- />
+ <el-form-item label="浼氳鏃堕暱"
+ prop="duration">
+ <el-input-number v-model="meetingForm.duration"
+ :min="15"
+ :max="480"
+ :step="15"
+ style="width: 100%" />
<span style="margin-left: 10px">鍒嗛挓</span>
</el-form-item>
</el-col>
</el-row>
- <el-form-item label="浼氳骞冲彴" prop="platform">
- <el-select v-model="meetingForm.platform" placeholder="璇烽�夋嫨浼氳骞冲彴" style="width: 100%">
- <el-option
- v-for="platform in meetingPlatforms"
- :key="platform.value"
- :label="platform.label"
- :value="platform.value"
- />
+ <el-form-item label="浼氳骞冲彴"
+ prop="platform">
+ <el-select v-model="meetingForm.platform"
+ placeholder="璇烽�夋嫨浼氳骞冲彴"
+ style="width: 100%">
+ <el-option v-for="platform in meetingPlatforms"
+ :key="platform.value"
+ :label="platform.label"
+ :value="platform.value" />
</el-select>
</el-form-item>
- <el-form-item label="鍙備細浜哄憳" prop="participants">
- <el-select
- v-model="meetingForm.participants"
- multiple
- filterable
- remote
- :remote-method="filterEmployees"
- :loading="employeesLoading"
- placeholder="璇烽�夋嫨鍙備細浜哄憳"
- style="width: 100%"
- >
- <el-option-group
- v-for="group in employeeGroups"
- :key="group.label"
- :label="group.label"
- >
- <el-option
- v-for="employee in group.options"
- :key="employee.value"
- :label="`${employee.label} (${employee.dept})`"
- :value="employee.value"
- >
- <div style="display: flex; justify-content: space-between; align-items: center;">
- <div>
- <div style="font-weight: 500;">{{ employee.label }}</div>
- <div style="color: #909399; font-size: 12px;">{{ employee.dept }}</div>
- </div>
- <div style="text-align: right; font-size: 12px; color: #909399;">
- <div v-if="employee.phone">{{ employee.phone }}</div>
- <div v-if="employee.email">{{ employee.email }}</div>
- </div>
- </div>
- </el-option>
+ <el-form-item label="鍙備細浜哄憳"
+ prop="participants">
+ <el-select v-model="meetingForm.participants"
+ multiple
+ filterable
+ remote
+ :remote-method="filterEmployees"
+ :loading="employeesLoading"
+ placeholder="璇烽�夋嫨鍙備細浜哄憳"
+ style="width: 100%">
+ <el-option-group v-for="group in employeeGroups"
+ :key="group.label"
+ :label="group.label">
+ <el-option v-for="employee in group.options"
+ :key="employee.value"
+ :label="`${employee.label} (${employee.dept})`"
+ :value="employee.value">
+ <div style="display: flex; justify-content: space-between; align-items: center;">
+ <div>
+ <div style="font-weight: 500;">{{ employee.label }}</div>
+ <div style="color: #909399; font-size: 12px;">{{ employee.dept }}</div>
+ </div>
+ <div style="text-align: right; font-size: 12px; color: #909399;">
+ <div v-if="employee.phone">{{ employee.phone }}</div>
+ <div v-if="employee.email">{{ employee.email }}</div>
+ </div>
+ </div>
+ </el-option>
</el-option-group>
</el-select>
<div style="margin-top: 8px; color: #909399; font-size: 12px;">
宸查�夋嫨 {{ meetingForm.participants.length }} 浜�
</div>
<!-- 宸查�夋嫨浜哄憳璇︽儏 -->
- <div v-if="meetingForm.participants.length > 0" style="margin-top: 10px;">
- <el-tag
- v-for="participantId in meetingForm.participants"
- :key="participantId"
- closable
- @close="removeParticipant(participantId)"
- style="margin-right: 8px; margin-bottom: 8px;"
- >
+ <div v-if="meetingForm.participants.length > 0"
+ style="margin-top: 10px;">
+ <el-tag v-for="participantId in meetingForm.participants"
+ :key="participantId"
+ closable
+ @close="removeParticipant(participantId)"
+ style="margin-right: 8px; margin-bottom: 8px;">
{{ getEmployeeName(participantId) }}
</el-tag>
</div>
</el-form-item>
- <el-form-item label="浼氳鎻忚堪" prop="description">
- <el-input
- v-model="meetingForm.description"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ヤ細璁弿杩�"
- />
+ <el-form-item label="浼氳鎻忚堪"
+ prop="description">
+ <el-input v-model="meetingForm.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ヤ細璁弿杩�" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="createMeeting">鍒涘缓浼氳</el-button>
<el-button @click="meetingDialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="createMeeting">鍒涘缓浼氳</el-button>
</span>
</template>
</el-dialog>
-
<!-- 鏂囦欢鍏变韩寮圭獥 -->
- <el-dialog
- v-model="fileShareDialogVisible"
- title="鏂囦欢鍏变韩"
- width="700px"
- :close-on-click-modal="false"
- >
- <el-form ref="fileShareFormRef" :model="fileShareForm" :rules="fileShareRules" label-width="120px">
- <el-form-item label="鍏变韩鏍囬" prop="title">
- <el-input v-model="fileShareForm.title" placeholder="璇疯緭鍏ュ叡浜爣棰�" />
+ <el-dialog v-model="fileShareDialogVisible"
+ title="鏂囦欢鍏变韩"
+ width="700px"
+ :close-on-click-modal="false">
+ <el-form ref="fileShareFormRef"
+ :model="fileShareForm"
+ :rules="fileShareRules"
+ label-width="120px">
+ <el-form-item label="鍏变韩鏍囬"
+ prop="title">
+ <el-input v-model="fileShareForm.title"
+ placeholder="璇疯緭鍏ュ叡浜爣棰�" />
</el-form-item>
- <el-form-item label="鍏变韩鎻忚堪" prop="description">
- <el-input
- v-model="fileShareForm.description"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ュ叡浜弿杩�"
- />
+ <el-form-item label="鍏变韩鎻忚堪"
+ prop="description">
+ <el-input v-model="fileShareForm.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ュ叡浜弿杩�" />
</el-form-item>
- <el-form-item label="鎺ユ敹閮ㄩ棬" prop="departments">
- <el-select
- v-model="fileShareForm.departments"
- multiple
- placeholder="璇烽�夋嫨鎺ユ敹閮ㄩ棬"
- style="width: 100%"
- >
- <el-option
- v-for="dept in departments"
- :key="dept"
- :label="dept"
- :value="dept"
- />
+ <el-form-item label="鎺ユ敹閮ㄩ棬"
+ prop="departments">
+ <el-select v-model="fileShareForm.departments"
+ multiple
+ placeholder="璇烽�夋嫨鎺ユ敹閮ㄩ棬"
+ style="width: 100%">
+ <el-option v-for="dept in departments"
+ :key="dept"
+ :label="dept"
+ :value="dept" />
</el-select>
</el-form-item>
- <el-form-item label="涓婁紶鏂囦欢" prop="files">
- <el-upload
- ref="uploadRef"
- :auto-upload="false"
- :on-change="handleFileChange"
- :on-remove="removeFile"
- :file-list="fileList"
- multiple
- :limit="10"
- accept=".doc,.docx,.pdf,.xls,.xlsx,.ppt,.pptx,.txt,.jpg,.jpeg,.png,.gif"
- >
+ <el-form-item label="涓婁紶鏂囦欢"
+ prop="files">
+ <el-upload ref="uploadRef"
+ :auto-upload="false"
+ :on-change="handleFileChange"
+ :on-remove="removeFile"
+ :file-list="fileList"
+ multiple
+ :limit="10"
+ accept=".doc,.docx,.pdf,.xls,.xlsx,.ppt,.pptx,.txt,.jpg,.jpeg,.png,.gif">
<el-button type="primary">閫夋嫨鏂囦欢</el-button>
<template #tip>
<div class="el-upload__tip">
@@ -308,8 +322,9 @@
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="shareFiles">鍏变韩鏂囦欢</el-button>
<el-button @click="fileShareDialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="shareFiles">鍏变韩鏂囦欢</el-button>
</span>
</template>
</el-dialog>
@@ -317,539 +332,872 @@
</template>
<script setup>
-import { Search } from "@element-plus/icons-vue";
-import { onMounted, ref, reactive, toRefs, computed } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
-import PIMTable from "@/components/PIMTable/PIMTable.vue";
-import { userListNoPageByTenantId } from "@/api/system/user.js";
-import { staffOnJobListPage } from "@/api/personnelManagement/employeeRecord.js";
-import { listNotification, addNotification, updateNotification, delNotification,addOnlineMeeting,addFileSharing } from "@/api/collaborativeApproval/notificationManagement.js";
-import { id } from "element-plus/es/locales.mjs";
+ import { Search } from "@element-plus/icons-vue";
+ import { onMounted, ref, reactive, toRefs, computed } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import PIMTable from "@/components/PIMTable/PIMTable.vue";
+ import { userListNoPageByTenantId } from "@/api/system/user.js";
+ import { staffOnJobListPage } from "@/api/personnelManagement/employeeRecord.js";
+ import {
+ listNotification,
+ addNotification,
+ updateNotification,
+ delNotification,
+ addOnlineMeeting,
+ addFileSharing,
+ } from "@/api/collaborativeApproval/notificationManagement.js";
+ import { id } from "element-plus/es/locales.mjs";
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- title: [
- { required: true, message: "璇疯緭鍏ラ�氱煡鏍囬", trigger: "blur" }
- ],
- type: [
- { required: true, message: "璇烽�夋嫨閫氱煡绫诲瀷", trigger: "change" }
- ],
- content: [
- { required: true, message: "璇疯緭鍏ラ�氱煡鍐呭", trigger: "blur" }
- ]
-};
-
-const meetingRules = {
- title: [
- { required: true, message: "璇疯緭鍏ヤ細璁爣棰�", trigger: "blur" }
- ],
- startTime: [
- { required: true, message: "璇烽�夋嫨浼氳寮�濮嬫椂闂�", trigger: "change" }
- ],
- participants: [
- { required: true, message: "璇烽�夋嫨鍙備細浜哄憳", trigger: "change" }
- ]
-};
-
-const fileShareRules = {
- title: [
- { required: true, message: "璇疯緭鍏ュ叡浜爣棰�", trigger: "blur" }
- ],
- description: [
- { required: true, message: "璇疯緭鍏ュ叡浜弿杩�", trigger: "blur" }
- ]
-};
-
-// 鍝嶅簲寮忔暟鎹�
-const data = reactive({
- searchForm: {
- title: "",
- type: "",
- status: "",
- },
- tableLoading: false,
- page: {
- current: 1,
- size: 20,
- total: 0,
- },
- tableData: [],
- selectedIds: [],
- // 鏂板閫氱煡鐩稿叧
- form: {
- title: "",
- type: "",
- priority: "",
- content: "",
- departments: [],
- expireDate: "",
- syncMethods: []
- },
- dialogVisible: false,
- dialogTitle: "",
- dialogType: "add",
- // 鍦ㄧ嚎浼氳鐩稿叧
- meetingDialogVisible: false,
- meetingForm: {
- title: "",
- startTime: "",
- duration: 60,
- participants: [],
- description: "",
- platform: "wechat"
- },
- // 鏂囦欢鍏变韩鐩稿叧
- fileShareDialogVisible: false,
- fileShareForm: {
- title: "",
- description: "",
- departments: [],
- files: []
- },
- fileList: []
-});
-
-const {
- searchForm,
- tableLoading,
- page,
- tableData,
- selectedIds,
- form,
- dialogVisible,
- dialogTitle,
- dialogType,
- meetingDialogVisible,
- meetingForm,
- fileShareDialogVisible,
- fileShareForm,
- fileList
-} = toRefs(data);
-
-// 琛ㄥ崟寮曠敤
-const formRef = ref();
-const meetingFormRef = ref();
-const fileShareFormRef = ref();
-
-// 琛ㄦ牸鍒楅厤缃�
-const tableColumn = ref([
- {
- label: "閫氱煡鏍囬",
- prop: "title",
- showOverflowTooltip: true,
- },
- {
- label: "閫氱煡绫诲瀷",
- prop: "type",
- dataType: "tag",
- formatData: (params) => {
- const typeMap = {
- holiday: "鏀惧亣閫氱煡",
- penalty: "澶勭綒閫氱煡",
- meeting: "寮�浼氶�氱煡",
- temporary: "涓存椂閫氱煡",
- formal: "姝ｅ紡閫氱煡"
- };
- return typeMap[params] || params;
- },
- formatType: (params) => {
- const typeMap = {
- holiday: "success",
- penalty: "danger",
- meeting: "warning",
- temporary: "info",
- formal: "primary"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "浼樺厛绾�",
- prop: "priority",
- dataType: "tag",
- formatData: (params) => {
- const priorityMap = {
- low: "鏅��",
- medium: "閲嶈",
- high: "绱ф��"
- };
- return priorityMap[params] || params;
- },
- formatType: (params) => {
- const typeMap = {
- low: "info",
- medium: "warning",
- high: "danger"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "鐘舵��",
- prop: "status",
- dataType: "tag",
- formatData: (params) => {
- const statusMap = {
- draft: "鑽夌",
- published: "宸插彂甯�",
- expired: "宸茶繃鏈�"
- };
- return statusMap[params] || params;
- },
- formatType: (params) => {
- const typeMap = {
- draft: "info",
- published: "success",
- expired: "danger"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "鎺ユ敹閮ㄩ棬",
- prop: "departments",
- width: 150,
- showOverflowTooltip: true,
- formatData: (params) => {
- if (!params || params.length === 0) return "鍏ㄩ儴閮ㄩ棬";
- return params.join(", ");
- }
- },
- {
- label: "鏈夋晥鏈熻嚦",
- prop: "expireDate",
- width: 150,
- formatData: (params) => {
- if (!params) return "姘镐箙鏈夋晥";
- return params;
- }
- },
- {
- label: "鍒涘缓鏃堕棿",
- prop: "createTime",
- width: 180,
- },
- {
- dataType: "action",
- label: "鎿嶄綔",
- align: "center",
- fixed: "right",
- width: 280,
- operation: [
- {
- name: "缂栬緫",
- type: "text",
- clickFun: (row) => {
- openForm("edit", row);
- }
- },
- {
- name: "鍙戝竷",
- type: "text",
- clickFun: (row) => {
- publishNotification(row);
- },
- // disabled: (row) => row.status === "published"
- },
- {
- name: "鎾ゅ洖",
- type: "text",
- clickFun: (row) => {
- revokeNotification(row);
- },
- // disabled: (row) => row.status !== "published"
- }
- ]
- }
-]);
-// 閫氱煡鏍囬妯℃澘
-const titleTemplates = [
- "鍏充簬{year}骞磠holiday}鏀惧亣瀹夋帓鐨勯�氱煡",
- "{dept}閮ㄩ棬{meeting}浼氳閫氱煡",
- "鍛樺伐{behavior}琛屼负瑙勮寖鎻愰啋",
- "{company}閲嶈浜嬮」閫氱煡",
- "{dept}閮ㄩ棬宸ヤ綔瀹夋帓閫氱煡",
- "鍏充簬{project}椤圭洰杩涘害鐨勯�氱煡",
- "{dept}閮ㄩ棬浜哄憳璋冩暣閫氱煡",
- "鍏徃{policy}鏀跨瓥鏇存柊閫氱煡"
-];
-
-// 閫氱煡绫诲瀷閰嶇疆
-const notificationTypes = [
- { type: "holiday", label: "鏀惧亣閫氱煡", priority: "high" },
- { type: "meeting", label: "寮�浼氶�氱煡", priority: "medium" },
- { type: "penalty", label: "澶勭綒閫氱煡", priority: "high" },
- { type: "temporary", label: "涓存椂閫氱煡", priority: "low" },
- { type: "formal", label: "姝ｅ紡閫氱煡", priority: "medium" }
-];
-
-// 閮ㄩ棬鍒楄〃
-const departments = ["鎶�鏈儴", "閿�鍞儴", "浜轰簨閮�", "璐㈠姟閮�", "杩愯惀閮�", "甯傚満閮�", "瀹㈡湇閮�"];
-
-// 浜哄憳鍒楄〃
-const employees = ref([]);
-const employeesLoading = ref(false);
-
-// 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
-const getEmployeesList = async () => {
- try {
- employeesLoading.value = true;
- // 浼樺厛浣跨敤绯荤粺鐢ㄦ埛鎺ュ彛锛堟寜绉熸埛鑾峰彇锛�
- const userResponse = await userListNoPageByTenantId();
-
- if (userResponse.data) {
- employees.value = userResponse.data.map(user => ({
- label: user.nickName || user.userName || '鏈煡濮撳悕',
- value: user.userId || user.id,
- dept: user.dept?.deptName || '鏈煡閮ㄩ棬',
- phone: user.phonenumber || '',
- email: user.email || '',
- status: user.status || '0'
- })).filter(user => user.status === '0'); // 鍙樉绀烘甯哥姸鎬佺殑鐢ㄦ埛
- } else {
- // 濡傛灉绯荤粺鐢ㄦ埛鎺ュ彛澶辫触锛屼娇鐢ㄥ憳宸ュ彴璐︽帴鍙�
- const response = await staffOnJobListPage({
- pageNum: 1,
- pageSize: 1000,
- staffState: 1 // 鍦ㄨ亴鐘舵��
- });
-
- if (response.data && response.data.records) {
- employees.value = response.data.records.map(employee => ({
- label: employee.staffName || employee.name || '鏈煡濮撳悕',
- value: employee.staffNo || employee.id || employee.staffId,
- dept: employee.deptName || employee.department || '鏈煡閮ㄩ棬',
- phone: employee.phone || employee.mobile || '',
- email: employee.email || '',
- status: '0'
- }));
- }
- }
- } catch (error) {
- console.error('鑾峰彇鍛樺伐鍒楄〃澶辫触:', error);
- // 濡傛灉鎺ュ彛閮藉け璐ワ紝浣跨敤榛樿鏁版嵁
- employees.value = [
- { label: "寮犱笁", value: "001", dept: "鎶�鏈儴", phone: "13800138001", email: "zhangsan@company.com", status: "0" },
- { label: "鏉庡洓", value: "002", dept: "閿�鍞儴", phone: "13800138002", email: "lisi@company.com", status: "0" },
- { label: "鐜嬩簲", value: "003", dept: "浜轰簨閮�", phone: "13800138003", email: "wangwu@company.com", status: "0" }
- ];
- } finally {
- employeesLoading.value = false;
- }
-};
-
-// 鍛樺伐鍒嗙粍
-const employeeGroups = computed(() => {
- const groups = {};
- employees.value.forEach(employee => {
- const dept = employee.dept || '鍏朵粬閮ㄩ棬';
- if (!groups[dept]) {
- groups[dept] = [];
- }
- groups[dept].push(employee);
- });
-
- // 鎸夐儴闂ㄥ悕绉版帓搴忥紝纭繚鏄剧ず椤哄簭涓�鑷�
- return Object.keys(groups)
- .sort()
- .map(dept => ({
- label: dept,
- options: groups[dept].sort((a, b) => a.label.localeCompare(b.label, 'zh-CN'))
- }));
-});
-
-// 杩囨护鍛樺伐锛堣繙绋嬫悳绱級
-const filterEmployees = (query) => {
- if (query !== '') {
- const lowerQuery = query.toLowerCase();
- return employees.value.filter(employee =>
- employee.label.toLowerCase().includes(lowerQuery) ||
- employee.dept.toLowerCase().includes(lowerQuery) ||
- (employee.phone && employee.phone.includes(query)) ||
- (employee.email && employee.email.toLowerCase().includes(lowerQuery))
- );
- } else {
- return employees.value;
- }
-};
-
-// 鍒锋柊鍛樺伐鍒楄〃
-const refreshEmployees = async () => {
- ElMessage.info("姝ｅ湪鍒锋柊鍛樺伐鍒楄〃...");
- await getEmployeesList();
-
- // 缁熻鍚勯儴闂ㄤ汉鏁�
- const deptStats = {};
- employees.value.forEach(emp => {
- const dept = emp.dept || '鍏朵粬閮ㄩ棬';
- deptStats[dept] = (deptStats[dept] || 0) + 1;
- });
-
- const deptInfo = Object.entries(deptStats)
- .map(([dept, count]) => `${dept}: ${count}浜篳)
- .join(', ');
-
- ElMessage.success(`鍛樺伐鍒楄〃鍒锋柊瀹屾垚锛屽叡 ${employees.value.length} 浜� (${deptInfo})`);
-};
-
-// 鑾峰彇鍛樺伐濮撳悕
-const getEmployeeName = (employeeId) => {
- const employee = employees.value.find(emp => emp.value === employeeId);
- return employee ? employee.label : '鏈煡浜哄憳';
-};
-
-// 鑾峰彇鍛樺伐璇︾粏淇℃伅
-const getEmployeeInfo = (employeeId) => {
- const employee = employees.value.find(emp => emp.value === employeeId);
- if (!employee) return null;
-
- return {
- name: employee.label,
- dept: employee.dept,
- phone: employee.phone,
- email: employee.email
- };
-};
-
-// 绉婚櫎鍙備細浜哄憳
-const removeParticipant = (participantId) => {
- const index = meetingForm.value.participants.indexOf(participantId);
- if (index > -1) {
- meetingForm.value.participants.splice(index, 1);
- }
-};
-
-// 鍚屾鏂瑰紡閫夐」
-const syncMethods = [
- { label: "浼佷笟寰俊", value: "wechat" },
- { label: "閽夐拤", value: "dingtalk" },
- { label: "閭欢", value: "email" },
- { label: "鐭俊", value: "sms" }
-];
-
-// 浼氳骞冲彴閫夐」
-const meetingPlatforms = [
- { label: "浼佷笟寰俊浼氳", value: "wechat" },
- { label: "閽夐拤浼氳", value: "dingtalk" },
- { label: "鑵捐浼氳", value: "tencent" },
- { label: "Zoom", value: "zoom" }
-];
-
-// 鑷姩鐢熸垚鏂版暟鎹�
-const generateNewData = () => {
- const newId = (mockData.length + 1).toString();
- const now = new Date();
- const randomType = notificationTypes[Math.floor(Math.random() * notificationTypes.length)];
- const randomDept = departments[Math.floor(Math.random() * departments.length)];
-
- // 鐢熸垚闅忔満鏍囬
- let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
- title = title
- .replace('{year}', now.getFullYear())
- .replace('{holiday}', ['鏄ヨ妭', '鍥藉簡', '涓', '鍏冩棪'][Math.floor(Math.random() * 4)])
- .replace('{dept}', randomDept)
- .replace('{meeting}', ['鍛ㄤ緥浼�', '鏈堝害鎬荤粨', '椤圭洰璇勫', '鍩硅浼氳'][Math.floor(Math.random() * 4)])
- .replace('{behavior}', ['鑰冨嫟', '鐫�瑁�', '宸ヤ綔鎬佸害', '鍥㈤槦鍗忎綔'][Math.floor(Math.random() * 4)])
- .replace('{company}', ['鍏徃', '闆嗗洟', '鎬婚儴'][Math.floor(Math.random() * 4)])
- .replace('{project}', ['鏁板瓧鍖栬浆鍨�', '浜у搧鍗囩骇', '甯傚満鎷撳睍', '浜烘墠鍩瑰吇'][Math.floor(Math.random() * 4)])
- .replace('{policy}', ['鑰冨嫟', '钖叕', '绂忓埄', '鏅嬪崌'][Math.floor(Math.random() * 4)]);
-
- // 闅忔満鐘舵��
- const statuses = ['draft', 'published'];
- const randomStatus = statuses[Math.floor(Math.random() * statuses.length)];
-
- // 闅忔満浼樺厛绾�
- const priorities = ['low', 'medium', 'high'];
- const randomPriority = priorities[Math.floor(Math.random() * priorities.length)];
-
- const newNotification = {
- id: newId,
- title: title,
- type: randomType.type,
- priority: randomPriority,
- status: randomStatus,
- content: `杩欐槸${title}鐨勮缁嗗唴瀹癸紝璇风浉鍏充汉鍛樻敞鎰忔煡鐪�...`,
- departments: [randomDept],
- expireDate: new Date(now.getTime() + 30 * 24 * 60 * 60 * 1000).toISOString().split('T')[0], // 30澶╁悗杩囨湡
- syncMethods: ["wechat", "dingtalk"],
- createTime: now.toLocaleString()
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ title: [{ required: true, message: "璇疯緭鍏ラ�氱煡鏍囬", trigger: "blur" }],
+ type: [{ required: true, message: "璇烽�夋嫨閫氱煡绫诲瀷", trigger: "change" }],
+ content: [{ required: true, message: "璇疯緭鍏ラ�氱煡鍐呭", trigger: "blur" }],
};
- // 娣诲姞鍒版暟鎹紑澶�
- mockData.unshift(newNotification);
+ const meetingRules = {
+ title: [{ required: true, message: "璇疯緭鍏ヤ細璁爣棰�", trigger: "blur" }],
+ startTime: [
+ { required: true, message: "璇烽�夋嫨浼氳寮�濮嬫椂闂�", trigger: "change" },
+ ],
+ participants: [
+ { required: true, message: "璇烽�夋嫨鍙備細浜哄憳", trigger: "change" },
+ ],
+ };
- // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�20鏉★級
- if (mockData.length > 20) {
- mockData = mockData.slice(0, 20);
- }
+ const fileShareRules = {
+ title: [{ required: true, message: "璇疯緭鍏ュ叡浜爣棰�", trigger: "blur" }],
+ description: [{ required: true, message: "璇疯緭鍏ュ叡浜弿杩�", trigger: "blur" }],
+ };
- console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂伴�氱煡: ${title}`);
-};
-
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- getList();
- getEmployeesList(); // 鑾峰彇鍛樺伐鍒楄〃
- startAutoRefresh();
-});
-
-// 寮�濮嬭嚜鍔ㄥ埛鏂�
-const startAutoRefresh = () => {
- setInterval(() => {
- generateNewData();
- getList();
- }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
-};
-
-// 鏌ヨ鏁版嵁
-const handleQuery = () => {
- page.value.current = 1;
- getList();
-};
-
-const getList = () => {
- tableLoading.value = true;
- listNotification({...page.value, ...searchForm.value})
- .then(res => {
- tableLoading.value = false;
- tableData.value = res.data.records
- page.value.total = res.data.total;
- }).catch(err => {
- tableLoading.value = false;
- })
-};
-
-// 鍒嗛〉澶勭悊
-const pagination = (obj) => {
- page.value.current = obj.page;
- page.value.size = obj.limit;
- handleQuery();
-};
-
-// 閫夋嫨鍙樺寲澶勭悊
-const handleSelectionChange = (selection) => {
- selectedIds.value = selection.map(item => item.id);
-};
-
-// 鎵撳紑琛ㄥ崟
-const openForm = (type, row = null) => {
- dialogType.value = type;
- if (type === "add") {
- dialogTitle.value = "鏂板閫氱煡";
- // 閲嶇疆琛ㄥ崟
- Object.assign(form.value, {
- id: "",
+ // 鍝嶅簲寮忔暟鎹�
+ const data = reactive({
+ searchForm: {
+ title: "",
+ type: "",
+ status: "",
+ },
+ tableLoading: false,
+ page: {
+ current: 1,
+ size: 20,
+ total: 0,
+ },
+ tableData: [],
+ selectedIds: [],
+ // 鏂板閫氱煡鐩稿叧
+ form: {
title: "",
type: "",
priority: "",
content: "",
departments: [],
expireDate: "",
- status: "draft",
- syncMethods: []
+ syncMethods: [],
+ },
+ dialogVisible: false,
+ dialogTitle: "",
+ dialogType: "add",
+ // 鍦ㄧ嚎浼氳鐩稿叧
+ meetingDialogVisible: false,
+ meetingForm: {
+ title: "",
+ startTime: "",
+ duration: 60,
+ participants: [],
+ description: "",
+ platform: "wechat",
+ },
+ // 鏂囦欢鍏变韩鐩稿叧
+ fileShareDialogVisible: false,
+ fileShareForm: {
+ title: "",
+ description: "",
+ departments: [],
+ files: [],
+ },
+ fileList: [],
+ });
+
+ const {
+ searchForm,
+ tableLoading,
+ page,
+ tableData,
+ selectedIds,
+ form,
+ dialogVisible,
+ dialogTitle,
+ dialogType,
+ meetingDialogVisible,
+ meetingForm,
+ fileShareDialogVisible,
+ fileShareForm,
+ fileList,
+ } = toRefs(data);
+
+ // 琛ㄥ崟寮曠敤
+ const formRef = ref();
+ const meetingFormRef = ref();
+ const fileShareFormRef = ref();
+
+ // 琛ㄦ牸鍒楅厤缃�
+ const tableColumn = ref([
+ {
+ label: "閫氱煡鏍囬",
+ prop: "title",
+ showOverflowTooltip: true,
+ },
+ {
+ label: "閫氱煡绫诲瀷",
+ prop: "type",
+ dataType: "tag",
+ formatData: params => {
+ const typeMap = {
+ holiday: "鏀惧亣閫氱煡",
+ penalty: "澶勭綒閫氱煡",
+ meeting: "寮�浼氶�氱煡",
+ temporary: "涓存椂閫氱煡",
+ formal: "姝ｅ紡閫氱煡",
+ };
+ return typeMap[params] || params;
+ },
+ formatType: params => {
+ const typeMap = {
+ holiday: "success",
+ penalty: "danger",
+ meeting: "warning",
+ temporary: "info",
+ formal: "primary",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "浼樺厛绾�",
+ prop: "priority",
+ dataType: "tag",
+ formatData: params => {
+ const priorityMap = {
+ low: "鏅��",
+ medium: "閲嶈",
+ high: "绱ф��",
+ };
+ return priorityMap[params] || params;
+ },
+ formatType: params => {
+ const typeMap = {
+ low: "info",
+ medium: "warning",
+ high: "danger",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "鐘舵��",
+ prop: "status",
+ dataType: "tag",
+ formatData: params => {
+ const statusMap = {
+ draft: "鑽夌",
+ published: "宸插彂甯�",
+ expired: "宸茶繃鏈�",
+ };
+ return statusMap[params] || params;
+ },
+ formatType: params => {
+ const typeMap = {
+ draft: "info",
+ published: "success",
+ expired: "danger",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "鎺ユ敹閮ㄩ棬",
+ prop: "departments",
+ width: 150,
+ showOverflowTooltip: true,
+ formatData: params => {
+ if (!params || params.length === 0) return "鍏ㄩ儴閮ㄩ棬";
+ return params.join(", ");
+ },
+ },
+ {
+ label: "鏈夋晥鏈熻嚦",
+ prop: "expireDate",
+ width: 150,
+ formatData: params => {
+ if (!params) return "姘镐箙鏈夋晥";
+ return params;
+ },
+ },
+ {
+ label: "鍒涘缓鏃堕棿",
+ prop: "createTime",
+ width: 180,
+ },
+ {
+ dataType: "action",
+ label: "鎿嶄綔",
+ align: "center",
+ fixed: "right",
+ width: 280,
+ operation: [
+ {
+ name: "缂栬緫",
+ type: "text",
+ clickFun: row => {
+ openForm("edit", row);
+ },
+ },
+ {
+ name: "鍙戝竷",
+ type: "text",
+ clickFun: row => {
+ publishNotification(row);
+ },
+ // disabled: (row) => row.status === "published"
+ },
+ {
+ name: "鎾ゅ洖",
+ type: "text",
+ clickFun: row => {
+ revokeNotification(row);
+ },
+ // disabled: (row) => row.status !== "published"
+ },
+ ],
+ },
+ ]);
+ // 閫氱煡鏍囬妯℃澘
+ const titleTemplates = [
+ "鍏充簬{year}骞磠holiday}鏀惧亣瀹夋帓鐨勯�氱煡",
+ "{dept}閮ㄩ棬{meeting}浼氳閫氱煡",
+ "鍛樺伐{behavior}琛屼负瑙勮寖鎻愰啋",
+ "{company}閲嶈浜嬮」閫氱煡",
+ "{dept}閮ㄩ棬宸ヤ綔瀹夋帓閫氱煡",
+ "鍏充簬{project}椤圭洰杩涘害鐨勯�氱煡",
+ "{dept}閮ㄩ棬浜哄憳璋冩暣閫氱煡",
+ "鍏徃{policy}鏀跨瓥鏇存柊閫氱煡",
+ ];
+
+ // 閫氱煡绫诲瀷閰嶇疆
+ const notificationTypes = [
+ { type: "holiday", label: "鏀惧亣閫氱煡", priority: "high" },
+ { type: "meeting", label: "寮�浼氶�氱煡", priority: "medium" },
+ { type: "penalty", label: "澶勭綒閫氱煡", priority: "high" },
+ { type: "temporary", label: "涓存椂閫氱煡", priority: "low" },
+ { type: "formal", label: "姝ｅ紡閫氱煡", priority: "medium" },
+ ];
+
+ // 閮ㄩ棬鍒楄〃
+ const departments = [
+ "鎶�鏈儴",
+ "閿�鍞儴",
+ "浜轰簨閮�",
+ "璐㈠姟閮�",
+ "杩愯惀閮�",
+ "甯傚満閮�",
+ "瀹㈡湇閮�",
+ ];
+
+ // 浜哄憳鍒楄〃
+ const employees = ref([]);
+ const employeesLoading = ref(false);
+
+ // 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
+ const getEmployeesList = async () => {
+ try {
+ employeesLoading.value = true;
+ // 浼樺厛浣跨敤绯荤粺鐢ㄦ埛鎺ュ彛锛堟寜绉熸埛鑾峰彇锛�
+ const userResponse = await userListNoPageByTenantId();
+
+ if (userResponse.data) {
+ employees.value = userResponse.data
+ .map(user => ({
+ label: user.nickName || user.userName || "鏈煡濮撳悕",
+ value: user.userId || user.id,
+ dept: user.dept?.deptName || "鏈煡閮ㄩ棬",
+ phone: user.phonenumber || "",
+ email: user.email || "",
+ status: user.status || "0",
+ }))
+ .filter(user => user.status === "0"); // 鍙樉绀烘甯哥姸鎬佺殑鐢ㄦ埛
+ } else {
+ // 濡傛灉绯荤粺鐢ㄦ埛鎺ュ彛澶辫触锛屼娇鐢ㄥ憳宸ュ彴璐︽帴鍙�
+ const response = await staffOnJobListPage({
+ pageNum: 1,
+ pageSize: 1000,
+ staffState: 1, // 鍦ㄨ亴鐘舵��
+ });
+
+ if (response.data && response.data.records) {
+ employees.value = response.data.records.map(employee => ({
+ label: employee.staffName || employee.name || "鏈煡濮撳悕",
+ value: employee.staffNo || employee.id || employee.staffId,
+ dept: employee.deptName || employee.department || "鏈煡閮ㄩ棬",
+ phone: employee.phone || employee.mobile || "",
+ email: employee.email || "",
+ status: "0",
+ }));
+ }
+ }
+ } catch (error) {
+ console.error("鑾峰彇鍛樺伐鍒楄〃澶辫触:", error);
+ // 濡傛灉鎺ュ彛閮藉け璐ワ紝浣跨敤榛樿鏁版嵁
+ employees.value = [
+ {
+ label: "寮犱笁",
+ value: "001",
+ dept: "鎶�鏈儴",
+ phone: "13800138001",
+ email: "zhangsan@company.com",
+ status: "0",
+ },
+ {
+ label: "鏉庡洓",
+ value: "002",
+ dept: "閿�鍞儴",
+ phone: "13800138002",
+ email: "lisi@company.com",
+ status: "0",
+ },
+ {
+ label: "鐜嬩簲",
+ value: "003",
+ dept: "浜轰簨閮�",
+ phone: "13800138003",
+ email: "wangwu@company.com",
+ status: "0",
+ },
+ ];
+ } finally {
+ employeesLoading.value = false;
+ }
+ };
+
+ // 鍛樺伐鍒嗙粍
+ const employeeGroups = computed(() => {
+ const groups = {};
+ employees.value.forEach(employee => {
+ const dept = employee.dept || "鍏朵粬閮ㄩ棬";
+ if (!groups[dept]) {
+ groups[dept] = [];
+ }
+ groups[dept].push(employee);
});
- } else if (type === "edit" && row) {
- dialogTitle.value = "缂栬緫閫氱煡";
+
+ // 鎸夐儴闂ㄥ悕绉版帓搴忥紝纭繚鏄剧ず椤哄簭涓�鑷�
+ return Object.keys(groups)
+ .sort()
+ .map(dept => ({
+ label: dept,
+ options: groups[dept].sort((a, b) =>
+ a.label.localeCompare(b.label, "zh-CN")
+ ),
+ }));
+ });
+
+ // 杩囨护鍛樺伐锛堣繙绋嬫悳绱級
+ const filterEmployees = query => {
+ if (query !== "") {
+ const lowerQuery = query.toLowerCase();
+ return employees.value.filter(
+ employee =>
+ employee.label.toLowerCase().includes(lowerQuery) ||
+ employee.dept.toLowerCase().includes(lowerQuery) ||
+ (employee.phone && employee.phone.includes(query)) ||
+ (employee.email && employee.email.toLowerCase().includes(lowerQuery))
+ );
+ } else {
+ return employees.value;
+ }
+ };
+
+ // 鍒锋柊鍛樺伐鍒楄〃
+ const refreshEmployees = async () => {
+ ElMessage.info("姝ｅ湪鍒锋柊鍛樺伐鍒楄〃...");
+ await getEmployeesList();
+
+ // 缁熻鍚勯儴闂ㄤ汉鏁�
+ const deptStats = {};
+ employees.value.forEach(emp => {
+ const dept = emp.dept || "鍏朵粬閮ㄩ棬";
+ deptStats[dept] = (deptStats[dept] || 0) + 1;
+ });
+
+ const deptInfo = Object.entries(deptStats)
+ .map(([dept, count]) => `${dept}: ${count}浜篳)
+ .join(", ");
+
+ ElMessage.success(
+ `鍛樺伐鍒楄〃鍒锋柊瀹屾垚锛屽叡 ${employees.value.length} 浜� (${deptInfo})`
+ );
+ };
+
+ // 鑾峰彇鍛樺伐濮撳悕
+ const getEmployeeName = employeeId => {
+ const employee = employees.value.find(emp => emp.value === employeeId);
+ return employee ? employee.label : "鏈煡浜哄憳";
+ };
+
+ // 鑾峰彇鍛樺伐璇︾粏淇℃伅
+ const getEmployeeInfo = employeeId => {
+ const employee = employees.value.find(emp => emp.value === employeeId);
+ if (!employee) return null;
+
+ return {
+ name: employee.label,
+ dept: employee.dept,
+ phone: employee.phone,
+ email: employee.email,
+ };
+ };
+
+ // 绉婚櫎鍙備細浜哄憳
+ const removeParticipant = participantId => {
+ const index = meetingForm.value.participants.indexOf(participantId);
+ if (index > -1) {
+ meetingForm.value.participants.splice(index, 1);
+ }
+ };
+
+ // 鍚屾鏂瑰紡閫夐」
+ const syncMethods = [
+ { label: "浼佷笟寰俊", value: "wechat" },
+ { label: "閽夐拤", value: "dingtalk" },
+ { label: "閭欢", value: "email" },
+ { label: "鐭俊", value: "sms" },
+ ];
+
+ // 浼氳骞冲彴閫夐」
+ const meetingPlatforms = [
+ { label: "浼佷笟寰俊浼氳", value: "wechat" },
+ { label: "閽夐拤浼氳", value: "dingtalk" },
+ { label: "鑵捐浼氳", value: "tencent" },
+ { label: "Zoom", value: "zoom" },
+ ];
+
+ // 鑷姩鐢熸垚鏂版暟鎹�
+ const generateNewData = () => {
+ const newId = (mockData.length + 1).toString();
+ const now = new Date();
+ const randomType =
+ notificationTypes[Math.floor(Math.random() * notificationTypes.length)];
+ const randomDept =
+ departments[Math.floor(Math.random() * departments.length)];
+
+ // 鐢熸垚闅忔満鏍囬
+ let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
+ title = title
+ .replace("{year}", now.getFullYear())
+ .replace(
+ "{holiday}",
+ ["鏄ヨ妭", "鍥藉簡", "涓", "鍏冩棪"][Math.floor(Math.random() * 4)]
+ )
+ .replace("{dept}", randomDept)
+ .replace(
+ "{meeting}",
+ ["鍛ㄤ緥浼�", "鏈堝害鎬荤粨", "椤圭洰璇勫", "鍩硅浼氳"][
+ Math.floor(Math.random() * 4)
+ ]
+ )
+ .replace(
+ "{behavior}",
+ ["鑰冨嫟", "鐫�瑁�", "宸ヤ綔鎬佸害", "鍥㈤槦鍗忎綔"][Math.floor(Math.random() * 4)]
+ )
+ .replace(
+ "{company}",
+ ["鍏徃", "闆嗗洟", "鎬婚儴"][Math.floor(Math.random() * 4)]
+ )
+ .replace(
+ "{project}",
+ ["鏁板瓧鍖栬浆鍨�", "浜у搧鍗囩骇", "甯傚満鎷撳睍", "浜烘墠鍩瑰吇"][
+ Math.floor(Math.random() * 4)
+ ]
+ )
+ .replace(
+ "{policy}",
+ ["鑰冨嫟", "钖叕", "绂忓埄", "鏅嬪崌"][Math.floor(Math.random() * 4)]
+ );
+
+ // 闅忔満鐘舵��
+ const statuses = ["draft", "published"];
+ const randomStatus = statuses[Math.floor(Math.random() * statuses.length)];
+
+ // 闅忔満浼樺厛绾�
+ const priorities = ["low", "medium", "high"];
+ const randomPriority =
+ priorities[Math.floor(Math.random() * priorities.length)];
+
+ const newNotification = {
+ id: newId,
+ title: title,
+ type: randomType.type,
+ priority: randomPriority,
+ status: randomStatus,
+ content: `杩欐槸${title}鐨勮缁嗗唴瀹癸紝璇风浉鍏充汉鍛樻敞鎰忔煡鐪�...`,
+ departments: [randomDept],
+ expireDate: new Date(now.getTime() + 30 * 24 * 60 * 60 * 1000)
+ .toISOString()
+ .split("T")[0], // 30澶╁悗杩囨湡
+ syncMethods: ["wechat", "dingtalk"],
+ createTime: now.toLocaleString(),
+ };
+
+ // 娣诲姞鍒版暟鎹紑澶�
+ mockData.unshift(newNotification);
+
+ // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�20鏉★級
+ if (mockData.length > 20) {
+ mockData = mockData.slice(0, 20);
+ }
+
+ console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂伴�氱煡: ${title}`);
+ };
+
+ // 鐢熷懡鍛ㄦ湡
+ onMounted(() => {
+ getList();
+ getEmployeesList(); // 鑾峰彇鍛樺伐鍒楄〃
+ startAutoRefresh();
+ });
+
+ // 寮�濮嬭嚜鍔ㄥ埛鏂�
+ const startAutoRefresh = () => {
+ setInterval(() => {
+ generateNewData();
+ getList();
+ }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
+ };
+
+ // 鏌ヨ鏁版嵁
+ const handleQuery = () => {
+ page.value.current = 1;
+ getList();
+ };
+
+ const getList = () => {
+ tableLoading.value = true;
+ listNotification({ ...page.value, ...searchForm.value })
+ .then(res => {
+ tableLoading.value = false;
+ tableData.value = res.data.records;
+ page.value.total = res.data.total;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
+
+ // 鍒嗛〉澶勭悊
+ const pagination = obj => {
+ page.value.current = obj.page;
+ page.value.size = obj.limit;
+ handleQuery();
+ };
+
+ // 閫夋嫨鍙樺寲澶勭悊
+ const handleSelectionChange = selection => {
+ selectedIds.value = selection.map(item => item.id);
+ };
+
+ // 鎵撳紑琛ㄥ崟
+ const openForm = (type, row = null) => {
+ dialogType.value = type;
+ if (type === "add") {
+ dialogTitle.value = "鏂板閫氱煡";
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(form.value, {
+ id: "",
+ title: "",
+ type: "",
+ priority: "",
+ content: "",
+ departments: [],
+ expireDate: "",
+ status: "draft",
+ syncMethods: [],
+ });
+ } else if (type === "edit" && row) {
+ dialogTitle.value = "缂栬緫閫氱煡";
+ Object.assign(form.value, {
+ id: row.id,
+ title: row.title,
+ type: row.type,
+ priority: row.priority,
+ content: row.content || "",
+ departments: row.departments || [],
+ expireDate: row.expireDate || "",
+ status: row.status,
+ syncMethods: row.syncMethods || [],
+ });
+ }
+ dialogVisible.value = true;
+ };
+
+ // 鎵撳紑鍦ㄧ嚎浼氳寮圭獥
+ const openMeetingDialog = () => {
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(meetingForm.value, {
+ title: "",
+ startTime: "",
+ duration: 60,
+ participants: [],
+ description: "",
+ platform: "wechat",
+ });
+ meetingDialogVisible.value = true;
+ };
+
+ // 鎵撳紑鏂囦欢鍏变韩寮圭獥
+ const openFileShareDialog = () => {
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(fileShareForm.value, {
+ title: "",
+ description: "",
+ departments: [],
+ files: [],
+ });
+ fileList.value = [];
+ fileShareDialogVisible.value = true;
+ };
+
+ // 鎵嬪姩鍒锋柊鏁版嵁
+ const manualRefresh = () => {
+ generateNewData();
+ getList();
+ ElMessage.success("鎵嬪姩鍒锋柊瀹屾垚锛屽凡鐢熸垚鏂伴�氱煡");
+ };
+
+ // 鎻愪氦閫氱煡琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ await formRef.value.validate();
+
+ if (dialogType.value === "add") {
+ // 鏂板閫氱煡
+ addNotification({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else {
+ // 缂栬緫閫氱煡
+ updateNotification({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ }
+ } catch (error) {
+ console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
+ }
+ };
+
+ // 鍒涘缓浼氳
+ const createMeeting = async () => {
+ try {
+ await meetingFormRef.value.validate();
+
+ // 妯℃嫙鍒涘缓浼氳
+ const meetingInfo = {
+ title: meetingForm.value.title,
+ startTime: meetingForm.value.startTime,
+ duration: meetingForm.value.duration,
+ participants: meetingForm.value.participants,
+ description: meetingForm.value.description,
+ platform: meetingForm.value.platform,
+ };
+ // 鏂板浼氳
+ addOnlineMeeting({ ...meetingInfo })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("浼氳娣诲姞鎴愬姛");
+ meetingDialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ // 妯℃嫙鍙戦�佸埌浼佷笟寰俊/閽夐拤
+ // const platformName = meetingPlatforms.find(p => p.value === meetingForm.value.platform)?.label || "鏈煡骞冲彴";
+ // ElMessage.success(`浼氳鍒涘缓鎴愬姛锛佷細璁甀D: ${meetingInfo.meetingId}锛屽皢閫氳繃${platformName}鍙戦�侀�氱煡`);
+
+ // 鑾峰彇鍙備細浜哄憳淇℃伅
+ const participantNames = meetingForm.value.participants
+ .map(participantId => {
+ const employee = employees.value.find(
+ emp => emp.value === participantId
+ );
+ return employee ? employee.label : "鏈煡浜哄憳";
+ })
+ .join("銆�");
+
+ // 鑾峰彇鍙備細浜哄憳璇︾粏淇℃伅
+ const participantDetails = meetingForm.value.participants
+ .map(participantId => {
+ const employee = employees.value.find(
+ emp => emp.value === participantId
+ );
+ return employee
+ ? {
+ name: employee.label,
+ dept: employee.dept,
+ phone: employee.phone,
+ email: employee.email,
+ }
+ : null;
+ })
+ .filter(Boolean);
+
+ // 灏嗕細璁俊鎭坊鍔犲埌閫氱煡鍒楄〃
+ const meetingNotification = {
+ title: `[浼氳閫氱煡] ${meetingInfo.title}`,
+ type: "meeting",
+ priority: "high",
+ status: "published",
+ content: `浼氳鏃堕棿: ${meetingInfo.startTime}锛屾椂闀�: ${
+ meetingInfo.duration
+ }鍒嗛挓锛屽钩鍙�: ${
+ meetingPlatforms.find(p => p.value === meetingForm.value.platform)
+ ?.label || "鏈煡骞冲彴"
+ }锛屽弬浼氫汉鍛�: ${participantNames}锛屽叡${participantDetails.length}浜篳,
+ departments: [],
+ expireDate: "",
+ syncMethods: [meetingForm.value.platform],
+ };
+ addNotification({ ...meetingNotification })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ // dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ // mockData.unshift(meetingNotification);
+ // getList();
+ } catch (error) {
+ console.error("浼氳琛ㄥ崟楠岃瘉澶辫触:", error);
+ }
+ };
+
+ // 鏂囦欢涓婁紶澶勭悊
+ const handleFileChange = file => {
+ const isLt10M = file.size / 1024 / 1024 < 10;
+ if (!isLt10M) {
+ ElMessage.error("涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 10MB!");
+ return false;
+ }
+
+ const fileInfo = {
+ name: file.name,
+ size: file.size,
+ type: file.type,
+ uid: file.uid,
+ };
+
+ fileList.value.push(fileInfo);
+ fileShareForm.value.files.push(fileInfo.name);
+ return false; // 闃绘鑷姩涓婁紶
+ };
+
+ // 绉婚櫎鏂囦欢
+ const removeFile = file => {
+ const index = fileList.value.findIndex(item => item.uid === file.uid);
+ if (index !== -1) {
+ const index2 = fileShareForm.value.files.findIndex(
+ item => item.uid === file.uid
+ );
+ if (index2 !== -1) {
+ fileShareForm.value.files.splice(index2, 1);
+ }
+ fileList.value.splice(index, 1);
+ }
+ };
+
+ // 鍏变韩鏂囦欢
+ const shareFiles = async () => {
+ try {
+ await fileShareFormRef.value.validate();
+
+ if (fileShareForm.value.files.length === 0) {
+ ElMessage.warning("璇疯嚦灏戦�夋嫨涓�涓枃浠�");
+ return;
+ }
+
+ // 妯℃嫙鏂囦欢鍏变韩
+ const shareInfo = {
+ title: fileShareForm.value.title,
+ description: fileShareForm.value.description,
+ departments: fileShareForm.value.departments,
+ files: fileShareForm.value.files,
+ };
+ addFileSharing({ ...shareInfo })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏂囦欢鍏变韩鎴愬姛");
+ fileShareDialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+
+ // ElMessage.success(`鏂囦欢鍏变韩鎴愬姛锛佸叡浜獻D: ${shareInfo.shareId}锛屽凡閫氱煡鐩稿叧閮ㄩ棬`);
+
+ // 灏嗘枃浠跺叡浜俊鎭坊鍔犲埌閫氱煡鍒楄〃
+ const fileShareNotification = {
+ title: `[鏂囦欢鍏变韩] ${shareInfo.title}`,
+ type: "temporary",
+ priority: "medium",
+ status: "published",
+ content: `鍏变韩鎻忚堪: ${shareInfo.description}锛屾枃浠舵暟閲�: ${shareInfo.files.length}涓猔,
+ departments: shareInfo.departments,
+ expireDate: "",
+ syncMethods: ["wechat", "dingtalk"],
+ };
+ addNotification({ ...fileShareNotification })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ // dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+
+ // mockData.unshift(fileShareNotification);
+ // getList();
+ } catch (error) {
+ console.error("鏂囦欢鍏变韩琛ㄥ崟楠岃瘉澶辫触:", error);
+ }
+ };
+
+ // 鍙戝竷閫氱煡
+ const publishNotification = row => {
Object.assign(form.value, {
id: row.id,
title: row.title,
@@ -859,344 +1207,106 @@
departments: row.departments || [],
expireDate: row.expireDate || "",
status: row.status,
- syncMethods: row.syncMethods || []
+ syncMethods: row.syncMethods || [],
});
- }
- dialogVisible.value = true;
-};
-
-// 鎵撳紑鍦ㄧ嚎浼氳寮圭獥
-const openMeetingDialog = () => {
- // 閲嶇疆琛ㄥ崟
- Object.assign(meetingForm.value, {
- title: "",
- startTime: "",
- duration: 60,
- participants: [],
- description: "",
- platform: "wechat"
- });
- meetingDialogVisible.value = true;
-};
-
-// 鎵撳紑鏂囦欢鍏变韩寮圭獥
-const openFileShareDialog = () => {
- // 閲嶇疆琛ㄥ崟
- Object.assign(fileShareForm.value, {
- title: "",
- description: "",
- departments: [],
- files: []
- });
- fileList.value = [];
- fileShareDialogVisible.value = true;
-};
-
-// 鎵嬪姩鍒锋柊鏁版嵁
-const manualRefresh = () => {
- generateNewData();
- getList();
- ElMessage.success("鎵嬪姩鍒锋柊瀹屾垚锛屽凡鐢熸垚鏂伴�氱煡");
-};
-
-// 鎻愪氦閫氱煡琛ㄥ崟
-const submitForm = async () => {
- try {
- await formRef.value.validate();
-
- if (dialogType.value === "add") {
- // 鏂板閫氱煡
- addNotification({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- } else {
- // 缂栬緫閫氱煡
- updateNotification({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- }
- } catch (error) {
- console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
- }
-};
-
-// 鍒涘缓浼氳
-const createMeeting = async () => {
- try {
- await meetingFormRef.value.validate();
-
- // 妯℃嫙鍒涘缓浼氳
- const meetingInfo = {
- title: meetingForm.value.title,
- startTime: meetingForm.value.startTime,
- duration: meetingForm.value.duration,
- participants: meetingForm.value.participants,
- description: meetingForm.value.description,
- platform: meetingForm.value.platform
- };
- // 鏂板浼氳
- addOnlineMeeting({...meetingInfo}).then(res => {
- if(res.code == 200){
- ElMessage.success("浼氳娣诲姞鎴愬姛");
- meetingDialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- // 妯℃嫙鍙戦�佸埌浼佷笟寰俊/閽夐拤
- // const platformName = meetingPlatforms.find(p => p.value === meetingForm.value.platform)?.label || "鏈煡骞冲彴";
- // ElMessage.success(`浼氳鍒涘缓鎴愬姛锛佷細璁甀D: ${meetingInfo.meetingId}锛屽皢閫氳繃${platformName}鍙戦�侀�氱煡`);
-
- // 鑾峰彇鍙備細浜哄憳淇℃伅
- const participantNames = meetingForm.value.participants.map(participantId => {
- const employee = employees.value.find(emp => emp.value === participantId);
- return employee ? employee.label : '鏈煡浜哄憳';
- }).join('銆�');
-
- // 鑾峰彇鍙備細浜哄憳璇︾粏淇℃伅
- const participantDetails = meetingForm.value.participants.map(participantId => {
- const employee = employees.value.find(emp => emp.value === participantId);
- return employee ? {
- name: employee.label,
- dept: employee.dept,
- phone: employee.phone,
- email: employee.email
- } : null;
- }).filter(Boolean);
-
- // 灏嗕細璁俊鎭坊鍔犲埌閫氱煡鍒楄〃
- const meetingNotification = {
- title: `[浼氳閫氱煡] ${meetingInfo.title}`,
- type: "meeting",
- priority: "high",
- status: "published",
- content: `浼氳鏃堕棿: ${meetingInfo.startTime}锛屾椂闀�: ${meetingInfo.duration}鍒嗛挓锛屽钩鍙�: ${meetingPlatforms.find(p => p.value === meetingForm.value.platform)?.label || "鏈煡骞冲彴"}锛屽弬浼氫汉鍛�: ${participantNames}锛屽叡${participantDetails.length}浜篳,
- departments: [],
- expireDate: "",
- syncMethods: [meetingForm.value.platform]
- };
- addNotification({...meetingNotification}).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- // dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- // mockData.unshift(meetingNotification);
- // getList();
- } catch (error) {
- console.error("浼氳琛ㄥ崟楠岃瘉澶辫触:", error);
- }
-};
-
-// 鏂囦欢涓婁紶澶勭悊
-const handleFileChange = (file) => {
- const isLt10M = file.size / 1024 / 1024 < 10;
- if (!isLt10M) {
- ElMessage.error("涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 10MB!");
- return false;
- }
-
- const fileInfo = {
- name: file.name,
- size: file.size,
- type: file.type,
- uid: file.uid
- };
-
- fileList.value.push(fileInfo);
- fileShareForm.value.files.push(fileInfo.name);
- return false; // 闃绘鑷姩涓婁紶
-};
-
-// 绉婚櫎鏂囦欢
-const removeFile = (file) => {
- const index = fileList.value.findIndex(item => item.uid === file.uid);
- if (index !== -1) {
- const index2 = fileShareForm.value.files.findIndex(item => item.uid === file.uid);
- if (index2 !== -1) {
- fileShareForm.value.files.splice(index2, 1);
- }
- fileList.value.splice(index, 1);
- }
-};
-
-// 鍏变韩鏂囦欢
-const shareFiles = async () => {
- try {
- await fileShareFormRef.value.validate();
-
- if (fileShareForm.value.files.length === 0) {
- ElMessage.warning("璇疯嚦灏戦�夋嫨涓�涓枃浠�");
- return;
- }
-
- // 妯℃嫙鏂囦欢鍏变韩
- const shareInfo = {
- title: fileShareForm.value.title,
- description: fileShareForm.value.description,
- departments: fileShareForm.value.departments,
- files: fileShareForm.value.files,
- };
- addFileSharing({...shareInfo}).then(res => {
- if(res.code == 200){
- ElMessage.success("鏂囦欢鍏变韩鎴愬姛");
- fileShareDialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
-
- // ElMessage.success(`鏂囦欢鍏变韩鎴愬姛锛佸叡浜獻D: ${shareInfo.shareId}锛屽凡閫氱煡鐩稿叧閮ㄩ棬`);
-
-
- // 灏嗘枃浠跺叡浜俊鎭坊鍔犲埌閫氱煡鍒楄〃
- const fileShareNotification = {
- title: `[鏂囦欢鍏变韩] ${shareInfo.title}`,
- type: "temporary",
- priority: "medium",
- status: "published",
- content: `鍏变韩鎻忚堪: ${shareInfo.description}锛屾枃浠舵暟閲�: ${shareInfo.files.length}涓猔,
- departments: shareInfo.departments,
- expireDate: "",
- syncMethods: ["wechat", "dingtalk"],
- };
- addNotification({...fileShareNotification}).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- // dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
-
- // mockData.unshift(fileShareNotification);
- // getList();
- } catch (error) {
- console.error("鏂囦欢鍏变韩琛ㄥ崟楠岃瘉澶辫触:", error);
- }
-};
-
-// 鍙戝竷閫氱煡
-const publishNotification = (row) => {
- Object.assign(form.value, {
- id: row.id,
- title: row.title,
- type: row.type,
- priority: row.priority,
- content: row.content || "",
- departments: row.departments || [],
- expireDate: row.expireDate || "",
- status: row.status,
- syncMethods: row.syncMethods || []
- });
- form.value.status = "published";
- updateNotification({...form.value}).then(res => {
- if(res.code == 200){
+ form.value.status = "published";
+ updateNotification({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
ElMessage.success("閫氱煡鍙戝竷鎴愬姛");
getList();
}
- }).catch(err => {
- ElMessage.error(err.msg);
})
-};
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ };
-// 鎾ゅ洖閫氱煡
-const revokeNotification = (row) => {
+ // 鎾ゅ洖閫氱煡
+ const revokeNotification = row => {
Object.assign(form.value, {
- id: row.id,
- title: row.title,
- type: row.type,
- priority: row.priority,
- content: row.content || "",
- departments: row.departments || [],
- expireDate: row.expireDate || "",
- status: row.status,
- syncMethods: row.syncMethods || []
- });
- form.value.status = "draft";
- updateNotification({...form.value}).then(res => {
- if(res.code == 200){
+ id: row.id,
+ title: row.title,
+ type: row.type,
+ priority: row.priority,
+ content: row.content || "",
+ departments: row.departments || [],
+ expireDate: row.expireDate || "",
+ status: row.status,
+ syncMethods: row.syncMethods || [],
+ });
+ form.value.status = "draft";
+ updateNotification({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
ElMessage.success("閫氱煡宸叉挙鍥�");
getList();
}
- }).catch(err => {
- ElMessage.error(err.msg);
})
-};
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ };
-// 鍒犻櫎閫氱煡
-const handleDelete = () => {
- let ids = [];
- if (selectedIds.value.length > 0) {
- ids = selectedIds.value;
- }else{
- ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑閫氱煡");
- return;
- }
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
- delNotification(ids).then(res => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- selectedIds.value = [];
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
+ // 鍒犻櫎閫氱煡
+ const handleDelete = () => {
+ let ids = [];
+ if (selectedIds.value.length > 0) {
+ ids = selectedIds.value;
+ } else {
+ ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑閫氱煡");
+ return;
+ }
+ ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
})
- }).catch(() => {
- // 鐢ㄦ埛鍙栨秷
- });
-};
+ .then(() => {
+ delNotification(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ selectedIds.value = [];
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ })
+ .catch(() => {
+ // 鐢ㄦ埛鍙栨秷
+ });
+ };
</script>
<style scoped>
-.auto-refresh-info {
- margin-bottom: 15px;
-}
+ .auto-refresh-info {
+ margin-bottom: 15px;
+ }
-.auto-refresh-info .el-alert {
- border-radius: 8px;
-}
+ .auto-refresh-info .el-alert {
+ border-radius: 8px;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
-.el-upload__tip {
- color: #909399;
- font-size: 12px;
- margin-top: 8px;
-}
+ .el-upload__tip {
+ color: #909399;
+ font-size: 12px;
+ margin-top: 8px;
+ }
-.el-checkbox-group {
- display: flex;
- flex-wrap: wrap;
- gap: 10px;
-}
+ .el-checkbox-group {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 10px;
+ }
-.el-checkbox {
- margin-right: 0;
-}
+ .el-checkbox {
+ margin-right: 0;
+ }
</style>
diff --git a/src/views/collaborativeApproval/notificationManagement/meetDraft/index.vue b/src/views/collaborativeApproval/notificationManagement/meetDraft/index.vue
index 0c62b8b..68d77ee 100644
--- a/src/views/collaborativeApproval/notificationManagement/meetDraft/index.vue
+++ b/src/views/collaborativeApproval/notificationManagement/meetDraft/index.vue
@@ -3,139 +3,174 @@
<!-- 椤甸潰鏍囬 -->
<div class="page-header">
<h2>浼氳鑽夌</h2>
- <el-button type="primary" @click="handleAdd">
- <el-icon><Plus /></el-icon>
+ <el-button type="primary"
+ @click="handleAdd">
+ <el-icon>
+ <Plus />
+ </el-icon>
鏂板缓鑽夌
</el-button>
</div>
-
<!-- 鎼滅储鍖哄煙 -->
<el-card class="search-card">
- <el-form :model="searchForm" label-width="100px" inline>
+ <el-form :model="searchForm"
+ label-width="100px"
+ inline>
<el-form-item label="浼氳涓婚">
- <el-input v-model="searchForm.title" placeholder="璇疯緭鍏ヤ細璁富棰�" clearable />
+ <el-input v-model="searchForm.title"
+ placeholder="璇疯緭鍏ヤ細璁富棰�"
+ clearable />
</el-form-item>
<el-form-item label="浼氳鏃ユ湡">
- <el-date-picker
- v-model="searchForm.meetingDate"
- type="date"
- placeholder="璇烽�夋嫨浼氳鏃ユ湡"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- style="width: 100%"
- />
+ <el-date-picker v-model="searchForm.meetingDate"
+ type="date"
+ placeholder="璇烽�夋嫨浼氳鏃ユ湡"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ style="width: 100%" />
</el-form-item>
<el-form-item>
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
</el-form-item>
</el-form>
</el-card>
-
<!-- 鑽夌鍒楄〃 -->
<el-card>
- <el-table v-loading="loading" :data="draftList" border>
- <el-table-column prop="title" label="浼氳涓婚" align="center" min-width="200" show-overflow-tooltip />
- <el-table-column prop="room" label="浼氳瀹�" align="center" width="120" />
- <el-table-column prop="host" label="涓绘寔浜�" align="center" width="120" />
- <el-table-column prop="meetingTime" label="浼氳鏃堕棿" align="center" width="180">
+ <el-table v-loading="loading"
+ :data="draftList"
+ border>
+ <el-table-column prop="title"
+ label="浼氳涓婚"
+ align="center"
+ min-width="200"
+ show-overflow-tooltip />
+ <el-table-column prop="room"
+ label="浼氳瀹�"
+ align="center"
+ width="120" />
+ <el-table-column prop="host"
+ label="涓绘寔浜�"
+ align="center"
+ width="120" />
+ <el-table-column prop="meetingTime"
+ label="浼氳鏃堕棿"
+ align="center"
+ width="180">
<template #default="scope">
{{ formatDateTime(scope.row.meetingTime) }}
</template>
</el-table-column>
- <el-table-column prop="participants" label="鍙備細浜烘暟" align="center" width="100">
+ <el-table-column prop="participants"
+ label="鍙備細浜烘暟"
+ align="center"
+ width="100">
<template #default="scope">
{{ scope.row.participants }}浜�
</template>
</el-table-column>
- <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" align="center" width="180" />
- <el-table-column label="鎿嶄綔" align="center" width="200" fixed="right">
+ <el-table-column prop="createTime"
+ label="鍒涘缓鏃堕棿"
+ align="center"
+ width="180" />
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ width="200"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" link @click="viewDraft(scope.row)">鏌ョ湅</el-button>
- <el-button type="primary" link @click="editDraft(scope.row)">缂栬緫</el-button>
- <el-button type="danger" link @click="deleteDraft(scope.row)">鍒犻櫎</el-button>
+ <el-button type="primary"
+ link
+ @click="viewDraft(scope.row)">鏌ョ湅</el-button>
+ <el-button type="primary"
+ link
+ @click="editDraft(scope.row)">缂栬緫</el-button>
+ <el-button type="danger"
+ link
+ @click="deleteDraft(scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.current"
- v-model:limit="queryParams.size"
- @pagination="getList"
- />
+ <pagination v-show="total > 0"
+ :total="total"
+ v-model:page="queryParams.current"
+ v-model:limit="queryParams.size"
+ @pagination="getList" />
</el-card>
-
<!-- 浼氳鑽夌璇︽儏瀵硅瘽妗� -->
- <el-dialog
- title="浼氳鑽夌璇︽儏"
- v-model="detailDialogVisible"
- width="800px"
- >
+ <el-dialog title="浼氳鑽夌璇︽儏"
+ v-model="detailDialogVisible"
+ width="800px">
<div v-if="currentDraft">
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="浼氳涓婚">{{ currentDraft.title }}</el-descriptions-item>
<el-descriptions-item label="浼氳缂栧彿">{{ currentDraft.meetingId }}</el-descriptions-item>
<el-descriptions-item label="浼氳瀹�">{{ currentDraft.room }}</el-descriptions-item>
<el-descriptions-item label="涓绘寔浜�">{{ currentDraft.host }}</el-descriptions-item>
- <el-descriptions-item label="浼氳鏃堕棿" :span="2">
+ <el-descriptions-item label="浼氳鏃堕棿"
+ :span="2">
{{ formatDateTime(currentDraft.meetingTime) }}
</el-descriptions-item>
<el-descriptions-item label="鍒涘缓鏃堕棿">{{ currentDraft.createTime }}</el-descriptions-item>
</el-descriptions>
-
<div class="content-section mt-20">
<h4>鍙備細浜哄憳</h4>
<div class="participants-list">
{{ currentDraft.participantList }}
</div>
</div>
-
<div class="content-section mt-20">
<h4>浼氳璇存槑</h4>
<div class="meeting-description">{{ currentDraft.description }}</div>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
<el-button @click="detailDialogVisible = false">鍏� 闂�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鏂板缓/缂栬緫鑽夌瀵硅瘽妗� -->
- <el-dialog
- :title="dialogTitle"
- v-model="editDialogVisible"
- width="700px"
- >
- <el-form :model="meetingForm" :rules="rules" ref="meetingFormRef" label-width="100px">
- <el-form-item label="浼氳涓婚" prop="title">
- <el-input v-model="meetingForm.title" placeholder="璇疯緭鍏ヤ細璁富棰�" />
+ <el-dialog :title="dialogTitle"
+ v-model="editDialogVisible"
+ width="700px">
+ <el-form :model="meetingForm"
+ :rules="rules"
+ ref="meetingFormRef"
+ label-width="100px">
+ <el-form-item label="浼氳涓婚"
+ prop="title">
+ <el-input v-model="meetingForm.title"
+ placeholder="璇疯緭鍏ヤ細璁富棰�" />
</el-form-item>
- <el-form-item label="浼氳瀹�" prop="room">
- <el-select v-model="meetingForm.roomId" placeholder="璇烽�夋嫨浼氳瀹�" style="width: 100%">
- <el-option v-for="(v,k) in roomList" :label="v.name" :value="v.id" />
+ <el-form-item label="浼氳瀹�"
+ prop="room">
+ <el-select v-model="meetingForm.roomId"
+ placeholder="璇烽�夋嫨浼氳瀹�"
+ style="width: 100%">
+ <el-option v-for="(v,k) in roomList"
+ :label="v.name"
+ :value="v.id" />
</el-select>
</el-form-item>
- <el-form-item label="涓绘寔浜�" prop="host">
- <el-input v-model="meetingForm.host" placeholder="璇疯緭鍏ヤ富鎸佷汉" />
+ <el-form-item label="涓绘寔浜�"
+ prop="host">
+ <el-input v-model="meetingForm.host"
+ placeholder="璇疯緭鍏ヤ富鎸佷汉" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="浼氳鏃ユ湡" prop="meetingDate">
- <el-date-picker
- v-model="meetingForm.meetingDate"
- type="date"
- placeholder="璇烽�夋嫨浼氳鏃ユ湡"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- :disabled-date="disabledDate"
- style="width: 100%"
- />
+ <el-form-item label="浼氳鏃ユ湡"
+ prop="meetingDate">
+ <el-date-picker v-model="meetingForm.meetingDate"
+ type="date"
+ placeholder="璇烽�夋嫨浼氳鏃ユ湡"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ :disabled-date="disabledDate"
+ style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -144,67 +179,57 @@
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="寮�濮嬫椂闂�" prop="startTime">
- <el-select
- v-model="meetingForm.startTime"
- placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
- style="width: 100%"
- >
- <el-option
- v-for="time in timeOptions"
- :key="time.value"
- :label="time.label"
- :value="time.value"
- />
+ <el-form-item label="寮�濮嬫椂闂�"
+ prop="startTime">
+ <el-select v-model="meetingForm.startTime"
+ placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
+ style="width: 100%">
+ <el-option v-for="time in timeOptions"
+ :key="time.value"
+ :label="time.label"
+ :value="time.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="缁撴潫鏃堕棿" prop="endTime">
- <el-select
- v-model="meetingForm.endTime"
- placeholder="璇烽�夋嫨缁撴潫鏃堕棿"
- style="width: 100%"
- >
- <el-option
- v-for="time in timeOptions"
- :key="time.value"
- :label="time.label"
- :value="time.value"
- />
+ <el-form-item label="缁撴潫鏃堕棿"
+ prop="endTime">
+ <el-select v-model="meetingForm.endTime"
+ placeholder="璇烽�夋嫨缁撴潫鏃堕棿"
+ style="width: 100%">
+ <el-option v-for="time in timeOptions"
+ :key="time.value"
+ :label="time.label"
+ :value="time.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
- <el-form-item label="鍙備細浜烘暟" prop="participants">
- <el-input
- v-model="meetingForm.participants"
- type="number"
- placeholder="璇疯緭鍏ュ弬浼氫汉鏁�"
- />
+ <el-form-item label="鍙備細浜烘暟"
+ prop="participants">
+ <el-input v-model="meetingForm.participants"
+ type="number"
+ placeholder="璇疯緭鍏ュ弬浼氫汉鏁�" />
</el-form-item>
- <el-form-item label="鍙備細浜哄憳" prop="participants">
- <el-input
- v-model="meetingForm.participantList"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ュ弬浼氫汉鍛橈紝鐢ㄩ�楀彿鍒嗛殧"
- />
+ <el-form-item label="鍙備細浜哄憳"
+ prop="participants">
+ <el-input v-model="meetingForm.participantList"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ュ弬浼氫汉鍛橈紝鐢ㄩ�楀彿鍒嗛殧" />
</el-form-item>
<el-form-item label="浼氳璇存槑">
- <el-input
- v-model="meetingForm.description"
- type="textarea"
- :rows="4"
- placeholder="璇疯緭鍏ヤ細璁鏄�"
- />
+ <el-input v-model="meetingForm.description"
+ type="textarea"
+ :rows="4"
+ placeholder="璇疯緭鍏ヤ細璁鏄�" />
</el-form-item>
</el-form>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">淇� 瀛�</el-button>
<el-button @click="editDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitForm">淇� 瀛�</el-button>
</div>
</template>
</el-dialog>
@@ -212,284 +237,294 @@
</template>
<script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus } from '@element-plus/icons-vue'
-import Pagination from '@/components/Pagination/index.vue'
-import {getRoomEnum,getDraftList,saveDraft,delDraft} from '@/api/collaborativeApproval/meeting.js'
-import dayjs from "dayjs";
-// 鏁版嵁鍒楄〃鍔犺浇鐘舵��
-const loading = ref(false)
+ import { ref, reactive, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus } from "@element-plus/icons-vue";
+ import Pagination from "@/components/Pagination/index.vue";
+ import {
+ getRoomEnum,
+ getDraftList,
+ saveDraft,
+ delDraft,
+ } from "@/api/collaborativeApproval/meeting.js";
+ import dayjs from "dayjs";
+ // 鏁版嵁鍒楄〃鍔犺浇鐘舵��
+ const loading = ref(false);
-// 鎬绘潯鏁�
-const total = ref(0)
+ // 鎬绘潯鏁�
+ const total = ref(0);
-// 鑽夌鍒楄〃鏁版嵁
-const draftList = ref([])
+ // 鑽夌鍒楄〃鏁版嵁
+ const draftList = ref([]);
-// 鏌ヨ鍙傛暟
-const queryParams = reactive({
- current: 1,
- size: 10
-})
+ // 鏌ヨ鍙傛暟
+ const queryParams = reactive({
+ current: 1,
+ size: 10,
+ });
-// 鎼滅储琛ㄥ崟
-const searchForm = reactive({
- title: '',
- meetingDate: ''
-})
+ // 鎼滅储琛ㄥ崟
+ const searchForm = reactive({
+ title: "",
+ meetingDate: "",
+ });
-// 鏄惁鏄剧ず瀵硅瘽妗�
-const detailDialogVisible = ref(false)
-const editDialogVisible = ref(false)
+ // 鏄惁鏄剧ず瀵硅瘽妗�
+ const detailDialogVisible = ref(false);
+ const editDialogVisible = ref(false);
-const roomList = ref([])
+ const roomList = ref([]);
-// 瀵硅瘽妗嗘爣棰�
-const dialogTitle = ref('')
+ // 瀵硅瘽妗嗘爣棰�
+ const dialogTitle = ref("");
-// 褰撳墠鏌ョ湅鐨勮崏绋�
-const currentDraft = ref(null)
+ // 褰撳墠鏌ョ湅鐨勮崏绋�
+ const currentDraft = ref(null);
-// 琛ㄥ崟寮曠敤
-const meetingFormRef = ref(null)
+ // 琛ㄥ崟寮曠敤
+ const meetingFormRef = ref(null);
-// 鏃堕棿閫夐」锛堜互鍗婂皬鏃朵负闂撮殧锛屽伐浣滄椂闂�8:00-18:00锛�
-const timeOptions = ref([])
+ // 鏃堕棿閫夐」锛堜互鍗婂皬鏃朵负闂撮殧锛屽伐浣滄椂闂�8:00-18:00锛�
+ const timeOptions = ref([]);
-// 琛ㄥ崟鏁版嵁
-const meetingForm = reactive({
- id: '',
- meetingId: '',
- title: '',
- roomId: '',
- host: '',
- meetingDate: '',
- startTime: '',
- endTime: '',
- participants: 0,
- participantList: '',
- description: '',
- createTime: ''
-})
-
-// 琛ㄥ崟鏍￠獙瑙勫垯
-const rules = {
- title: [{ required: true, message: '璇疯緭鍏ヤ細璁富棰�', trigger: 'blur' }],
- roomId: [{ required: true, message: '璇烽�夋嫨浼氳瀹�', trigger: 'change' }],
- host: [{ required: true, message: '璇疯緭鍏ヤ富鎸佷汉', trigger: 'blur' }],
- meetingDate: [{ required: true, message: '璇烽�夋嫨浼氳鏃ユ湡', trigger: 'change' }],
- startTime: [{ required: true, message: '璇烽�夋嫨寮�濮嬫椂闂�', trigger: 'change' }],
- endTime: [{ required: true, message: '璇烽�夋嫨缁撴潫鏃堕棿', trigger: 'change' }]
-}
-
-// 鍒濆鍖栨椂闂撮�夐」锛堜互鍗婂皬鏃朵负闂撮殧锛屽伐浣滄椂闂�8:00-18:00锛�
-const initTimeOptions = () => {
- const options = []
- for (let hour = 8; hour <= 18; hour++) {
- // 姣忎釜灏忔椂娣诲姞涓や釜閫夐」锛氭暣鐐瑰拰鍗婄偣
- options.push({
- value: `${hour.toString().padStart(2, '0')}:00`,
- label: `${hour.toString().padStart(2, '0')}:00`
- })
-
- if (hour < 18) { // 18:00涔嬪悗娌℃湁鍗婄偣閫夐」
- options.push({
- value: `${hour.toString().padStart(2, '0')}:30`,
- label: `${hour.toString().padStart(2, '0')}:30`
- })
- }
- }
- timeOptions.value = options
-}
-
-// 绂佺敤鏃ユ湡锛堢鐢ㄤ粖澶╀箣鍓嶇殑鏃ユ湡锛�
-const disabledDate = (time) => {
- // 绂佺敤浠婂ぉ涔嬪墠鐨勬棩鏈�
- return time.getTime() < Date.now() - 86400000
-}
-
-// 鏌ヨ鏁版嵁
-const getList = async () => {
- loading.value = true
-
- let resp = await getDraftList({...queryParams,...searchForm})
- queryParams.current = resp.data.current
- draftList.value = resp.data.records.map(it=>{
- it.room = roomList.value.find(room=>it.roomId===room.id).name ?? ""
- it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format("HH:mm")} ~ ${dayjs(it.endTime).format("HH:mm")}`
- return it
- })
-
- loading.value = false
-
-}
-
-// 鎼滅储鎸夐挳鎿嶄綔
-const handleSearch = () => {
- queryParams.pageNum = 1
- getList()
-}
-
-// 閲嶇疆鎼滅储琛ㄥ崟
-const resetSearch = () => {
- Object.assign(searchForm, {
- title: '',
- createTime: []
- })
- handleSearch()
-}
-
-// 娣诲姞鎸夐挳鎿嶄綔
-const handleAdd = () => {
- dialogTitle.value = '鏂板缓鑽夌'
- resetForm()
- editDialogVisible.value = true
-}
-
-// 鏌ョ湅鑽夌璇︽儏
-const viewDraft = (row) => {
- currentDraft.value = row
- detailDialogVisible.value = true
-}
-
-// 缂栬緫鑽夌
-const editDraft = (row) => {
- dialogTitle.value = '缂栬緫鑽夌'
- Object.assign(meetingForm, {
- id: row.id,
- meetingId: row.meetingId,
- title: row.title,
- room: row.room,
- roomId: row.id,
- host: row.host,
- meetingDate: row.meetingTime.split(' ')[0],
- startTime: row.meetingTime.split(' ')[1],
- endTime: row.meetingTime.split(' ')[3],
- participants: row.participants,
- participantList: row.participantList,
- description: row.description,
- createTime: row.createTime
- })
- editDialogVisible.value = true
-}
-
-// 鍒犻櫎鑽夌
-const deleteDraft = (row) => {
- ElMessageBox.confirm(
- `纭鍒犻櫎浼氳鑽夌 "${row.title}"?`,
- '鍒犻櫎鑽夌',
- {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }
- ).then(() => {
- delDraft(row.id).then(resp=>{
- ElMessage.success('鑽夌鍒犻櫎鎴愬姛')
- getList()
- })
-
- }).catch(() => {})
-}
-
-// 閲嶇疆琛ㄥ崟
-const resetForm = () => {
- Object.assign(meetingForm, {
- id: '',
- meetingId: '',
- title: '',
- room: '',
- host: '',
- meetingDate: '',
- startTime: '',
- endTime: '',
+ // 琛ㄥ崟鏁版嵁
+ const meetingForm = reactive({
+ id: "",
+ meetingId: "",
+ title: "",
+ roomId: "",
+ host: "",
+ meetingDate: "",
+ startTime: "",
+ endTime: "",
participants: 0,
- participantList: '',
- description: '',
- createTime: ''
- })
-}
+ participantList: "",
+ description: "",
+ createTime: "",
+ });
-// 鎻愪氦琛ㄥ崟
-const submitForm = () => {
- meetingFormRef.value.validate((valid) => {
- if (valid) {
- let formData = {...meetingForm}
- formData.startTime = dayjs(meetingForm.meetingDate + ' ' + meetingForm.startTime).format("YYYY-MM-DD HH:mm:ss")
- formData.endTime = dayjs(meetingForm.meetingDate + ' ' + meetingForm.endTime).format("YYYY-MM-DD HH:mm:ss")
- saveDraft(formData).then(()=>{
- ElMessage.success('淇濆瓨鎴愬姛')
- editDialogVisible.value = false
- getList()
- })
+ // 琛ㄥ崟鏍￠獙瑙勫垯
+ const rules = {
+ title: [{ required: true, message: "璇疯緭鍏ヤ細璁富棰�", trigger: "blur" }],
+ roomId: [{ required: true, message: "璇烽�夋嫨浼氳瀹�", trigger: "change" }],
+ host: [{ required: true, message: "璇疯緭鍏ヤ富鎸佷汉", trigger: "blur" }],
+ meetingDate: [
+ { required: true, message: "璇烽�夋嫨浼氳鏃ユ湡", trigger: "change" },
+ ],
+ startTime: [{ required: true, message: "璇烽�夋嫨寮�濮嬫椂闂�", trigger: "change" }],
+ endTime: [{ required: true, message: "璇烽�夋嫨缁撴潫鏃堕棿", trigger: "change" }],
+ };
+
+ // 鍒濆鍖栨椂闂撮�夐」锛堜互鍗婂皬鏃朵负闂撮殧锛屽伐浣滄椂闂�8:00-18:00锛�
+ const initTimeOptions = () => {
+ const options = [];
+ for (let hour = 8; hour <= 18; hour++) {
+ // 姣忎釜灏忔椂娣诲姞涓や釜閫夐」锛氭暣鐐瑰拰鍗婄偣
+ options.push({
+ value: `${hour.toString().padStart(2, "0")}:00`,
+ label: `${hour.toString().padStart(2, "0")}:00`,
+ });
+
+ if (hour < 18) {
+ // 18:00涔嬪悗娌℃湁鍗婄偣閫夐」
+ options.push({
+ value: `${hour.toString().padStart(2, "0")}:30`,
+ label: `${hour.toString().padStart(2, "0")}:30`,
+ });
+ }
}
- })
-}
+ timeOptions.value = options;
+ };
-// 鏍煎紡鍖栨棩鏈熸椂闂�
-const formatDateTime = (dateTime) => {
- if (!dateTime) return ''
- return dateTime.replace(' ', '\n')
-}
+ // 绂佺敤鏃ユ湡锛堢鐢ㄤ粖澶╀箣鍓嶇殑鏃ユ湡锛�
+ const disabledDate = time => {
+ // 绂佺敤浠婂ぉ涔嬪墠鐨勬棩鏈�
+ return time.getTime() < Date.now() - 86400000;
+ };
-// 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
-onMounted(() => {
- initTimeOptions()
- getList()
- getRoomEnum().then((res) => {
- roomList.value = res.data
- })
-})
+ // 鏌ヨ鏁版嵁
+ const getList = async () => {
+ loading.value = true;
+
+ let resp = await getDraftList({ ...queryParams, ...searchForm });
+ queryParams.current = resp.data.current;
+ draftList.value = resp.data.records.map(it => {
+ it.room = roomList.value.find(room => it.roomId === room.id).name ?? "";
+ it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format(
+ "HH:mm"
+ )} ~ ${dayjs(it.endTime).format("HH:mm")}`;
+ return it;
+ });
+
+ loading.value = false;
+ };
+
+ // 鎼滅储鎸夐挳鎿嶄綔
+ const handleSearch = () => {
+ queryParams.pageNum = 1;
+ getList();
+ };
+
+ // 閲嶇疆鎼滅储琛ㄥ崟
+ const resetSearch = () => {
+ Object.assign(searchForm, {
+ title: "",
+ createTime: [],
+ });
+ handleSearch();
+ };
+
+ // 娣诲姞鎸夐挳鎿嶄綔
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板缓鑽夌";
+ resetForm();
+ editDialogVisible.value = true;
+ };
+
+ // 鏌ョ湅鑽夌璇︽儏
+ const viewDraft = row => {
+ currentDraft.value = row;
+ detailDialogVisible.value = true;
+ };
+
+ // 缂栬緫鑽夌
+ const editDraft = row => {
+ dialogTitle.value = "缂栬緫鑽夌";
+ Object.assign(meetingForm, {
+ id: row.id,
+ meetingId: row.meetingId,
+ title: row.title,
+ room: row.room,
+ roomId: row.id,
+ host: row.host,
+ meetingDate: row.meetingTime.split(" ")[0],
+ startTime: row.meetingTime.split(" ")[1],
+ endTime: row.meetingTime.split(" ")[3],
+ participants: row.participants,
+ participantList: row.participantList,
+ description: row.description,
+ createTime: row.createTime,
+ });
+ editDialogVisible.value = true;
+ };
+
+ // 鍒犻櫎鑽夌
+ const deleteDraft = row => {
+ ElMessageBox.confirm(`纭鍒犻櫎浼氳鑽夌 "${row.title}"?`, "鍒犻櫎鑽夌", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ delDraft(row.id).then(resp => {
+ ElMessage.success("鑽夌鍒犻櫎鎴愬姛");
+ getList();
+ });
+ })
+ .catch(() => {});
+ };
+
+ // 閲嶇疆琛ㄥ崟
+ const resetForm = () => {
+ Object.assign(meetingForm, {
+ id: "",
+ meetingId: "",
+ title: "",
+ room: "",
+ host: "",
+ meetingDate: "",
+ startTime: "",
+ endTime: "",
+ participants: 0,
+ participantList: "",
+ description: "",
+ createTime: "",
+ });
+ };
+
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = () => {
+ meetingFormRef.value.validate(valid => {
+ if (valid) {
+ let formData = { ...meetingForm };
+ formData.startTime = dayjs(
+ meetingForm.meetingDate + " " + meetingForm.startTime
+ ).format("YYYY-MM-DD HH:mm:ss");
+ formData.endTime = dayjs(
+ meetingForm.meetingDate + " " + meetingForm.endTime
+ ).format("YYYY-MM-DD HH:mm:ss");
+ saveDraft(formData).then(() => {
+ ElMessage.success("淇濆瓨鎴愬姛");
+ editDialogVisible.value = false;
+ getList();
+ });
+ }
+ });
+ };
+
+ // 鏍煎紡鍖栨棩鏈熸椂闂�
+ const formatDateTime = dateTime => {
+ if (!dateTime) return "";
+ return dateTime.replace(" ", "\n");
+ };
+
+ // 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
+ onMounted(() => {
+ initTimeOptions();
+ getList();
+ getRoomEnum().then(res => {
+ roomList.value = res.data;
+ });
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.page-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 20px;
-}
+ .page-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ }
-.page-header h2 {
- margin: 0;
- color: #303133;
-}
+ .page-header h2 {
+ margin: 0;
+ color: #303133;
+ }
-.search-card {
- margin-bottom: 20px;
-}
+ .search-card {
+ margin-bottom: 20px;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
-.content-section h4 {
- margin: 0 0 15px 0;
- color: #303133;
-}
+ .content-section h4 {
+ margin: 0 0 15px 0;
+ color: #303133;
+ }
-.mt-20 {
- margin-top: 20px;
-}
+ .mt-20 {
+ margin-top: 20px;
+ }
-.participants-list {
- min-height: 40px;
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
-}
+ .participants-list {
+ min-height: 40px;
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ }
-.meeting-description {
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
- white-space: pre-wrap;
-}
+ .meeting-description {
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ white-space: pre-wrap;
+ }
</style>
diff --git a/src/views/collaborativeApproval/notificationManagement/meetPublish/index.vue b/src/views/collaborativeApproval/notificationManagement/meetPublish/index.vue
index 3f0fc69..49b040d 100644
--- a/src/views/collaborativeApproval/notificationManagement/meetPublish/index.vue
+++ b/src/views/collaborativeApproval/notificationManagement/meetPublish/index.vue
@@ -4,184 +4,216 @@
<div class="page-header">
<h2>浼氳鍙戝竷</h2>
</div>
-
<!-- 鎼滅储鍖哄煙 -->
<el-card class="search-card">
- <el-form :model="searchForm" inline>
+ <el-form :model="searchForm"
+ inline>
<el-form-item label="浼氳涓婚">
- <el-input v-model="searchForm.title" placeholder="璇疯緭鍏ヤ細璁富棰�" clearable/>
+ <el-input v-model="searchForm.title"
+ placeholder="璇疯緭鍏ヤ細璁富棰�"
+ clearable />
</el-form-item>
<el-form-item label="鐢宠浜�">
- <el-input v-model="searchForm.applicant" placeholder="璇疯緭鍏ョ敵璇蜂汉" clearable/>
+ <el-input v-model="searchForm.applicant"
+ placeholder="璇疯緭鍏ョ敵璇蜂汉"
+ clearable />
</el-form-item>
<el-form-item label="鍙戝竷鐘舵��">
- <el-select style="width: 100px" v-model="searchForm.status" placeholder="璇烽�夋嫨鍙戝竷鐘舵��" clearable>
- <el-option label="寰呭彂甯�" value="0"/>
- <el-option label="宸插彂甯�" value="1"/>
+ <el-select style="width: 100px"
+ v-model="searchForm.status"
+ placeholder="璇烽�夋嫨鍙戝竷鐘舵��"
+ clearable>
+ <el-option label="寰呭彂甯�"
+ value="0" />
+ <el-option label="宸插彂甯�"
+ value="1" />
</el-select>
</el-form-item>
<el-form-item>
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
</el-form-item>
</el-form>
</el-card>
-
<!-- 浼氳鍙戝竷鍒楄〃 -->
<el-card>
- <el-table v-loading="loading" :data="approvalList" border>
- <el-table-column prop="title" label="浼氳涓婚" align="center" min-width="200" show-overflow-tooltip/>
- <el-table-column prop="applicant" label="鐢宠浜�" align="center" width="120"/>
- <el-table-column prop="host" label="涓荤悊浜�" align="center" width="120"/>
- <el-table-column prop="meetingTime" label="浼氳鏃堕棿" align="center" width="180">
+ <el-table v-loading="loading"
+ :data="approvalList"
+ border>
+ <el-table-column prop="title"
+ label="浼氳涓婚"
+ align="center"
+ min-width="200"
+ show-overflow-tooltip />
+ <el-table-column prop="applicant"
+ label="鐢宠浜�"
+ align="center"
+ width="120" />
+ <el-table-column prop="host"
+ label="涓荤悊浜�"
+ align="center"
+ width="120" />
+ <el-table-column prop="meetingTime"
+ label="浼氳鏃堕棿"
+ align="center"
+ width="180">
<template #default="scope">
{{ formatDateTime(scope.row.meetingTime) }}
</template>
</el-table-column>
- <el-table-column prop="location" label="浼氳鍦扮偣" align="center" width="150"/>
- <el-table-column prop="participants" label="鍙備細浜烘暟" align="center" width="100">
+ <el-table-column prop="location"
+ label="浼氳鍦扮偣"
+ align="center"
+ width="150" />
+ <el-table-column prop="participants"
+ label="鍙備細浜烘暟"
+ align="center"
+ width="100">
<template #default="scope">
{{ scope.row.participants.length }}浜�
</template>
</el-table-column>
- <el-table-column prop="status" label="鍙戝竷鐘舵��" align="center" width="120">
+ <el-table-column prop="status"
+ label="鍙戝竷鐘舵��"
+ align="center"
+ width="120">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ getStatusText(scope.row.status) }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" align="center" width="200" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ width="200"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" link @click="viewDetail(scope.row)">鏌ョ湅</el-button>
- <el-button
- v-if="scope.row.status == '0'"
- type="primary"
- link
- @click="handleApproval(scope.row)"
- >
+ <el-button type="primary"
+ link
+ @click="viewDetail(scope.row)">鏌ョ湅</el-button>
+ <el-button v-if="scope.row.status == '0'"
+ type="primary"
+ link
+ @click="handleApproval(scope.row)">
鍙戝竷
</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.current"
- v-model:limit="queryParams.size"
- @pagination="getList"
- />
+ <pagination v-show="total > 0"
+ :total="total"
+ v-model:page="queryParams.current"
+ v-model:limit="queryParams.size"
+ @pagination="getList" />
</el-card>
-
<!-- 浼氳璇︽儏瀵硅瘽妗� -->
- <el-dialog
- title="浼氳璇︽儏"
- v-model="detailDialogVisible"
- width="800px"
- >
+ <el-dialog title="浼氳璇︽儏"
+ v-model="detailDialogVisible"
+ width="800px">
<div v-if="currentMeeting">
- <el-descriptions label-width="100px" class="meeting-desc" :column="2" border>
- <el-descriptions-item label="浼氳涓婚" label-class-name="nowrap-label">{{
+ <el-descriptions label-width="100px"
+ class="meeting-desc"
+ :column="2"
+ border>
+ <el-descriptions-item label="浼氳涓婚"
+ label-class-name="nowrap-label">{{
currentMeeting.title
}}</el-descriptions-item>
- <el-descriptions-item label="鐢宠浜�" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鐢宠浜�"
+ label-class-name="nowrap-label">{{
currentMeeting.applicant
}}</el-descriptions-item>
- <el-descriptions-item label="涓荤悊浜�" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="涓荤悊浜�"
+ label-class-name="nowrap-label">{{
currentMeeting.host
}}</el-descriptions-item>
- <el-descriptions-item label="浼氳鏃堕棿" :span="2" label-class-name="nowrap-label">
+ <el-descriptions-item label="浼氳鏃堕棿"
+ :span="2"
+ label-class-name="nowrap-label">
{{ formatDateTime(currentMeeting.meetingTime) }}
</el-descriptions-item>
- <el-descriptions-item label="浼氳鍦扮偣" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="浼氳鍦扮偣"
+ label-class-name="nowrap-label">{{
currentMeeting.location
}}</el-descriptions-item>
- <el-descriptions-item label="鍙備細浜烘暟" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鍙備細浜烘暟"
+ label-class-name="nowrap-label">{{
currentMeeting.participants.length
}}浜�</el-descriptions-item>
- <el-descriptions-item label="鍙戝竷鐘舵��" label-class-name="nowrap-label">
+ <el-descriptions-item label="鍙戝竷鐘舵��"
+ label-class-name="nowrap-label">
<el-tag :type="getStatusType(currentMeeting.status)">
{{ getStatusText(currentMeeting.status) }}
</el-tag>
</el-descriptions-item>
- <el-descriptions-item label="鐢宠鏃堕棿" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鐢宠鏃堕棿"
+ label-class-name="nowrap-label">{{
currentMeeting.createTime
}}</el-descriptions-item>
- <el-descriptions-item style="max-height: 400px" label="浼氳璇存槑" :span="2"
+ <el-descriptions-item style="max-height: 400px"
+ label="浼氳璇存槑"
+ :span="2"
label-class-name="nowrap-label">{{ currentMeeting.description }}</el-descriptions-item>
</el-descriptions>
-
-
<div class="content-section mt-20">
<h4>鍙備細浜哄憳</h4>
<div class="participants-list">
- <el-tag
- v-for="participant in currentMeeting.participants"
- :key="participant.id"
- style="margin-right: 10px; margin-bottom: 10px;"
- >
+ <el-tag v-for="participant in currentMeeting.participants"
+ :key="participant.id"
+ style="margin-right: 10px; margin-bottom: 10px;">
{{ participant.name }}
</el-tag>
</div>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
<el-button @click="detailDialogVisible = false">鍏� 闂�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 浼氳鍙戝竷瀵硅瘽妗� -->
- <el-dialog
- title="浼氳鍙戝竷"
- v-model="approvalDialogVisible"
- >
+ <el-dialog title="浼氳鍙戝竷"
+ v-model="approvalDialogVisible">
<div v-if="currentMeeting">
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="浼氳涓婚">{{ currentMeeting.title }}</el-descriptions-item>
<el-descriptions-item label="鐢宠浜�">{{ currentMeeting.applicant }}</el-descriptions-item>
<el-descriptions-item label="涓荤悊浜�">{{ currentMeeting.host }}</el-descriptions-item>
- <el-descriptions-item label="浼氳鏃堕棿" :span="2">
+ <el-descriptions-item label="浼氳鏃堕棿"
+ :span="2">
{{ formatDateTime(currentMeeting.meetingTime) }}
</el-descriptions-item>
<el-descriptions-item label="浼氳鍦扮偣">{{ currentMeeting.location }}</el-descriptions-item>
<el-descriptions-item label="鍙備細浜烘暟">{{ currentMeeting.participants.length }}浜�</el-descriptions-item>
</el-descriptions>
-
<div class="content-section mt-20">
<h4>鍙備細浜哄憳</h4>
<div class="participants-list">
- <el-tag
- v-for="participant in currentMeeting.participants"
- :key="participant.id"
- style="margin-right: 10px; margin-bottom: 10px;"
- >
+ <el-tag v-for="participant in currentMeeting.participants"
+ :key="participant.id"
+ style="margin-right: 10px; margin-bottom: 10px;">
{{ participant.name }}
</el-tag>
</div>
</div>
-
<div class="approval-opinion mt-20">
<h4>鍙戝竷鎰忚</h4>
- <el-input
- v-model="publishComment"
- type="textarea"
- placeholder="璇疯緭鍏ュ彂甯冩剰瑙�"
- :rows="4"
- />
+ <el-input v-model="publishComment"
+ type="textarea"
+ placeholder="璇疯緭鍏ュ彂甯冩剰瑙�"
+ :rows="4" />
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitApproval('1')">鍙� 甯�</el-button>
<el-button @click="approvalDialogVisible = false">鍙� 娑�</el-button>
-<!-- <el-button type="danger" @click="submitApproval('2')">涓嶉�氳繃</el-button>-->
- <el-button type="primary" @click="submitApproval('1')">鍙� 甯�</el-button>
+ <!-- <el-button type="danger" @click="submitApproval('2')">涓嶉�氳繃</el-button>-->
</div>
</template>
</el-dialog>
@@ -189,228 +221,235 @@
</template>
<script setup>
-import {ref, reactive, onMounted} from 'vue'
-import {ElMessage, ElMessageBox} from 'element-plus'
-import Pagination from '@/components/Pagination/index.vue'
-import {getRoomEnum, getMeetingPublish,saveMeetingApplication} from '@/api/collaborativeApproval/meeting.js'
-import {getStaffOnJob} from "@/api/personnelManagement/onboarding.js";
-import dayjs from "dayjs";
+ import { ref, reactive, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import Pagination from "@/components/Pagination/index.vue";
+ import {
+ getRoomEnum,
+ getMeetingPublish,
+ saveMeetingApplication,
+ } from "@/api/collaborativeApproval/meeting.js";
+ import { getStaffOnJob } from "@/api/personnelManagement/onboarding.js";
+ import dayjs from "dayjs";
-// 鏁版嵁鍒楄〃鍔犺浇鐘舵��
-const loading = ref(false)
+ // 鏁版嵁鍒楄〃鍔犺浇鐘舵��
+ const loading = ref(false);
-// 鎬绘潯鏁�
-const total = ref(0)
-const roomEnum = ref([])
-const staffList = ref([])
-// 鍙戝竷鍒楄〃鏁版嵁
-const approvalList = ref([])
+ // 鎬绘潯鏁�
+ const total = ref(0);
+ const roomEnum = ref([]);
+ const staffList = ref([]);
+ // 鍙戝竷鍒楄〃鏁版嵁
+ const approvalList = ref([]);
-// 鏌ヨ鍙傛暟
-const queryParams = reactive({
- current: 1,
- size: 10
-})
+ // 鏌ヨ鍙傛暟
+ const queryParams = reactive({
+ current: 1,
+ size: 10,
+ });
-// 鎼滅储琛ㄥ崟
-const searchForm = reactive({
- title: '',
- applicant: '',
- status: ''
-})
+ // 鎼滅储琛ㄥ崟
+ const searchForm = reactive({
+ title: "",
+ applicant: "",
+ status: "",
+ });
-// 鏄惁鏄剧ず瀵硅瘽妗�
-const detailDialogVisible = ref(false)
-const approvalDialogVisible = ref(false)
+ // 鏄惁鏄剧ず瀵硅瘽妗�
+ const detailDialogVisible = ref(false);
+ const approvalDialogVisible = ref(false);
-// 褰撳墠鏌ョ湅鐨勪細璁�
-const currentMeeting = ref(null)
+ // 褰撳墠鏌ョ湅鐨勪細璁�
+ const currentMeeting = ref(null);
-// 鍙戝竷鎰忚
-const publishComment = ref('')
+ // 鍙戝竷鎰忚
+ const publishComment = ref("");
-// 鏌ヨ鏁版嵁
-const getList = async () => {
- loading.value = true
- let resp = await getMeetingPublish({...searchForm, ...queryParams})
- approvalList.value = resp.data.records.map(it => {
- let room = roomEnum.value.find(room => it.roomId === room.id)
- it.location = `${room.name}(${room.location})`
- let staffs = JSON.parse(it.participants)
- it.staffCount = staffs.size
- it.status = it.publishStatus
- it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format('HH:mm:ss')} ~ ${dayjs(it.endTime).format('HH:mm:ss')}`
- it.participants = staffList.value.filter(staff => staffs.some(id=>id === staff.id)).map(staff => {
- return {
- id: staff.id,
- name: `${staff.staffName}(${staff.postJob})`
- }
- })
+ // 鏌ヨ鏁版嵁
+ const getList = async () => {
+ loading.value = true;
+ let resp = await getMeetingPublish({ ...searchForm, ...queryParams });
+ approvalList.value = resp.data.records.map(it => {
+ let room = roomEnum.value.find(room => it.roomId === room.id);
+ it.location = `${room.name}(${room.location})`;
+ let staffs = JSON.parse(it.participants);
+ it.staffCount = staffs.size;
+ it.status = it.publishStatus;
+ it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format(
+ "HH:mm:ss"
+ )} ~ ${dayjs(it.endTime).format("HH:mm:ss")}`;
+ it.participants = staffList.value
+ .filter(staff => staffs.some(id => id === staff.id))
+ .map(staff => {
+ return {
+ id: staff.id,
+ name: `${staff.staffName}(${staff.postJob})`,
+ };
+ });
+ return it;
+ });
+ total.value = resp.data.total;
+ loading.value = false;
+ };
- return it
- })
- total.value = resp.data.total
- loading.value = false
-}
+ // 鎼滅储鎸夐挳鎿嶄綔
+ const handleSearch = () => {
+ queryParams.pageNum = 1;
+ getList();
+ };
-// 鎼滅储鎸夐挳鎿嶄綔
-const handleSearch = () => {
- queryParams.pageNum = 1
- getList()
-}
+ // 閲嶇疆鎼滅储琛ㄥ崟
+ const resetSearch = () => {
+ Object.assign(searchForm, {
+ title: "",
+ applicant: "",
+ status: "",
+ });
+ handleSearch();
+ };
-// 閲嶇疆鎼滅储琛ㄥ崟
-const resetSearch = () => {
- Object.assign(searchForm, {
- title: '',
- applicant: '',
- status: ''
- })
- handleSearch()
-}
+ // 鏌ョ湅璇︽儏
+ const viewDetail = row => {
+ currentMeeting.value = row;
+ detailDialogVisible.value = true;
+ };
-// 鏌ョ湅璇︽儏
-const viewDetail = (row) => {
- currentMeeting.value = row
- detailDialogVisible.value = true
-}
+ // 澶勭悊鍙戝竷
+ const handleApproval = row => {
+ currentMeeting.value = row;
+ publishComment.value = "";
+ approvalDialogVisible.value = true;
+ };
-// 澶勭悊鍙戝竷
-const handleApproval = (row) => {
- currentMeeting.value = row
- publishComment.value = ''
- approvalDialogVisible.value = true
-}
+ // 鑾峰彇鐘舵�佺被鍨�
+ const getStatusType = status => {
+ const statusMap = {
+ 0: "info", // 寰呭彂甯�
+ 1: "success", // 宸查�氳繃
+ 2: "danger", // 鏈�氳繃
+ };
+ return statusMap[status] || "info";
+ };
-// 鑾峰彇鐘舵�佺被鍨�
-const getStatusType = (status) => {
- const statusMap = {
- '0': 'info', // 寰呭彂甯�
- '1': 'success', // 宸查�氳繃
- '2': 'danger', // 鏈�氳繃
- }
- return statusMap[status] || 'info'
-}
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusMap = {
+ 0: "寰呭彂甯�",
+ 1: "宸插彂甯�",
+ 2: "宸插彇娑�",
+ };
+ return statusMap[status] || "鏈煡";
+ };
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusMap = {
- '0': '寰呭彂甯�',
- '1': '宸插彂甯�',
- '2': '宸插彇娑�',
- }
- return statusMap[status] || '鏈煡'
-}
+ // 鏍煎紡鍖栨棩鏈熸椂闂�
+ const formatDateTime = dateTime => {
+ if (!dateTime) return "";
+ return dateTime.replace(" ", "\n");
+ };
-// 鏍煎紡鍖栨棩鏈熸椂闂�
-const formatDateTime = (dateTime) => {
- if (!dateTime) return ''
- return dateTime.replace(' ', '\n')
-}
+ // 鎻愪氦鍙戝竷
+ const submitApproval = status => {
+ // if (status === 'approved' && !publishComment.value.trim()) {
+ // ElMessage.warning('璇峰～鍐欏彂甯冩剰瑙�')
+ // return
+ // }
-// 鎻愪氦鍙戝竷
-const submitApproval = (status) => {
- // if (status === 'approved' && !publishComment.value.trim()) {
- // ElMessage.warning('璇峰～鍐欏彂甯冩剰瑙�')
- // return
- // }
-
- ElMessageBox.confirm(
- `纭${status === '1' ? '鍙戝竷' : '鍙栨秷'}璇ヤ細璁紵`,
- '鍙戝竷纭',
+ ElMessageBox.confirm(
+ `纭${status === "1" ? "鍙戝竷" : "鍙栨秷"}璇ヤ細璁紵`,
+ "鍙戝竷纭",
{
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
}
- ).then(() => {
- saveMeetingApplication({
- id: currentMeeting.value.id,
- publishStatus: status,
- publishComment: publishComment.value
- }).then(resp=>{
- // 鏇存柊浼氳鐘舵��
- currentMeeting.value.status = status
+ )
+ .then(() => {
+ saveMeetingApplication({
+ id: currentMeeting.value.id,
+ publishStatus: status,
+ publishComment: publishComment.value,
+ }).then(resp => {
+ // 鏇存柊浼氳鐘舵��
+ currentMeeting.value.status = status;
- ElMessage.success('鍙戝竷鎻愪氦鎴愬姛')
- approvalDialogVisible.value = false
- getList()
- })
+ ElMessage.success("鍙戝竷鎻愪氦鎴愬姛");
+ approvalDialogVisible.value = false;
+ getList();
+ });
+ })
+ .catch(() => {});
+ };
- }).catch(() => {
- })
-}
+ // 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
+ onMounted(async () => {
+ const [resp1, resp2] = await Promise.all([getRoomEnum(), getStaffOnJob()]);
+ roomEnum.value = resp1.data;
+ staffList.value = resp2.data;
-// 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
-onMounted(async () => {
- const [resp1, resp2]= await Promise.all([getRoomEnum(), getStaffOnJob()])
- roomEnum.value = resp1.data
- staffList.value = resp2.data
-
- await getList()
-})
+ await getList();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.page-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 20px;
-}
+ .page-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ }
-.page-header h2 {
- margin: 0;
- color: #303133;
-}
+ .page-header h2 {
+ margin: 0;
+ color: #303133;
+ }
-.search-card {
- margin-bottom: 20px;
-}
+ .search-card {
+ margin-bottom: 20px;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
-.content-section h4 {
- margin: 0 0 15px 0;
- color: #303133;
-}
+ .content-section h4 {
+ margin: 0 0 15px 0;
+ color: #303133;
+ }
-.mt-20 {
- margin-top: 20px;
-}
+ .mt-20 {
+ margin-top: 20px;
+ }
-.participants-list {
- min-height: 40px;
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
-}
+ .participants-list {
+ min-height: 40px;
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ }
-.approval-opinion h4 {
- margin: 0 0 15px 0;
- color: #303133;
-}
+ .approval-opinion h4 {
+ margin: 0 0 15px 0;
+ color: #303133;
+ }
-.nowrap-label {
- white-space: nowrap !important;
-}
+ .nowrap-label {
+ white-space: nowrap !important;
+ }
-.description-content {
- white-space: pre-wrap;
- word-wrap: break-word;
- line-height: 1.6;
- padding: 10px;
- background-color: #f5f7fa;
- border-radius: 4px;
- min-height: 60px;
-}
+ .description-content {
+ white-space: pre-wrap;
+ word-wrap: break-word;
+ line-height: 1.6;
+ padding: 10px;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ min-height: 60px;
+ }
</style>
diff --git a/src/views/collaborativeApproval/notificationManagement/summary/index.vue b/src/views/collaborativeApproval/notificationManagement/summary/index.vue
index 04eaa4a..76d95c9 100644
--- a/src/views/collaborativeApproval/notificationManagement/summary/index.vue
+++ b/src/views/collaborativeApproval/notificationManagement/summary/index.vue
@@ -4,157 +4,185 @@
<div class="page-header">
<h2>浼氳绾</h2>
</div>
-
<!-- 鎼滅储鍖哄煙 -->
<el-card class="search-card">
- <el-form :model="searchForm" inline>
+ <el-form :model="searchForm"
+ inline>
<el-form-item label="浼氳涓婚">
- <el-input v-model="searchForm.title" placeholder="璇疯緭鍏ヤ細璁富棰�" clearable />
+ <el-input v-model="searchForm.title"
+ placeholder="璇疯緭鍏ヤ細璁富棰�"
+ clearable />
</el-form-item>
<el-form-item label="鐢宠浜�">
- <el-input v-model="searchForm.applicant" placeholder="璇疯緭鍏ョ敵璇蜂汉" clearable />
+ <el-input v-model="searchForm.applicant"
+ placeholder="璇疯緭鍏ョ敵璇蜂汉"
+ clearable />
</el-form-item>
<el-form-item>
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
</el-form-item>
</el-form>
</el-card>
-
<!-- 浼氳鍒楄〃 -->
<el-card>
- <el-table v-loading="loading" :data="meetingList" border>
- <el-table-column prop="title" label="浼氳涓婚" align="center" min-width="200" show-overflow-tooltip />
- <el-table-column prop="applicant" label="鐢宠浜�" align="center" width="120" />
- <el-table-column prop="host" label="涓绘寔浜�" align="center" width="120" />
- <el-table-column prop="meetingTime" label="浼氳鏃堕棿" align="center" width="180">
+ <el-table v-loading="loading"
+ :data="meetingList"
+ border>
+ <el-table-column prop="title"
+ label="浼氳涓婚"
+ align="center"
+ min-width="200"
+ show-overflow-tooltip />
+ <el-table-column prop="applicant"
+ label="鐢宠浜�"
+ align="center"
+ width="120" />
+ <el-table-column prop="host"
+ label="涓绘寔浜�"
+ align="center"
+ width="120" />
+ <el-table-column prop="meetingTime"
+ label="浼氳鏃堕棿"
+ align="center"
+ width="180">
<template #default="scope">
{{ formatDateTime(scope.row.meetingTime) }}
</template>
</el-table-column>
- <el-table-column prop="location" label="浼氳鍦扮偣" align="center" width="150" />
- <el-table-column prop="participants" label="鍙備細浜烘暟" align="center" width="100">
+ <el-table-column prop="location"
+ label="浼氳鍦扮偣"
+ align="center"
+ width="150" />
+ <el-table-column prop="participants"
+ label="鍙備細浜烘暟"
+ align="center"
+ width="100">
<template #default="scope">
{{ scope.row.participants.length }}浜�
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" align="center" width="200" fixed="right">
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ width="200"
+ fixed="right">
<template #default="scope">
- <el-button type="primary" link @click="viewDetail(scope.row)">鏌ョ湅</el-button>
- <el-button
- type="primary"
- link
- @click="addMinutes(scope.row)"
- >
+ <el-button type="primary"
+ link
+ @click="viewDetail(scope.row)">鏌ョ湅</el-button>
+ <el-button type="primary"
+ link
+ @click="addMinutes(scope.row)">
娣诲姞绾
</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.current"
- v-model:limit="queryParams.size"
- @pagination="getList"
- />
+ <pagination v-show="total > 0"
+ :total="total"
+ v-model:page="queryParams.current"
+ v-model:limit="queryParams.size"
+ @pagination="getList" />
</el-card>
-
<!-- 浼氳璇︽儏瀵硅瘽妗� -->
- <el-dialog
- title="浼氳璇︽儏"
- v-model="detailDialogVisible"
- width="800px"
- >
+ <el-dialog title="浼氳璇︽儏"
+ v-model="detailDialogVisible"
+ width="800px">
<div v-if="currentMeeting">
- <el-descriptions label-width="100px" class="meeting-desc" :column="2" border>
- <el-descriptions-item label="浼氳涓婚" label-class-name="nowrap-label">{{
+ <el-descriptions label-width="100px"
+ class="meeting-desc"
+ :column="2"
+ border>
+ <el-descriptions-item label="浼氳涓婚"
+ label-class-name="nowrap-label">{{
currentMeeting.title
}}</el-descriptions-item>
- <el-descriptions-item label="鐢宠浜�" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鐢宠浜�"
+ label-class-name="nowrap-label">{{
currentMeeting.applicant
}}</el-descriptions-item>
- <el-descriptions-item label="涓绘寔浜�" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="涓绘寔浜�"
+ label-class-name="nowrap-label">{{
currentMeeting.host
}}</el-descriptions-item>
- <el-descriptions-item label="浼氳鏃堕棿" :span="2" label-class-name="nowrap-label">
+ <el-descriptions-item label="浼氳鏃堕棿"
+ :span="2"
+ label-class-name="nowrap-label">
{{ formatDateTime(currentMeeting.meetingTime) }}
</el-descriptions-item>
- <el-descriptions-item label="浼氳鍦扮偣" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="浼氳鍦扮偣"
+ label-class-name="nowrap-label">{{
currentMeeting.location
}}</el-descriptions-item>
- <el-descriptions-item label="鍙備細浜烘暟" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鍙備細浜烘暟"
+ label-class-name="nowrap-label">{{
currentMeeting.participants.length
}}浜�</el-descriptions-item>
- <el-descriptions-item label="瀹℃壒鐘舵��" label-class-name="nowrap-label">
+ <el-descriptions-item label="瀹℃壒鐘舵��"
+ label-class-name="nowrap-label">
<el-tag :type="getStatusType(currentMeeting.status)">
{{ getStatusText(currentMeeting.status) }}
</el-tag>
</el-descriptions-item>
- <el-descriptions-item label="鐢宠鏃堕棿" label-class-name="nowrap-label">{{
+ <el-descriptions-item label="鐢宠鏃堕棿"
+ label-class-name="nowrap-label">{{
currentMeeting.createTime
}}</el-descriptions-item>
- <el-descriptions-item style="max-height: 400px" label="浼氳璇存槑" :span="2"
- label-class-name="nowrap-label">{{ currentMeeting.description }}</el-descriptions-item>
+ <el-descriptions-item style="max-height: 400px"
+ label="浼氳璇存槑"
+ :span="2"
+ label-class-name="nowrap-label">{{ currentMeeting.description }}</el-descriptions-item>
</el-descriptions>
-
<div class="content-section mt-20">
<h4>鍙備細浜哄憳</h4>
<div class="participants-list">
- <el-tag
- v-for="participant in currentMeeting.participants"
- :key="participant.id"
- style="margin-right: 10px; margin-bottom: 10px;"
- >
+ <el-tag v-for="participant in currentMeeting.participants"
+ :key="participant.id"
+ style="margin-right: 10px; margin-bottom: 10px;">
{{ participant.name }}
</el-tag>
</div>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
<el-button @click="detailDialogVisible = false">鍏� 闂�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 娣诲姞浼氳绾瀵硅瘽妗� -->
- <el-dialog
- title="娣诲姞浼氳绾"
- v-model="minutesDialogVisible"
- width="80%"
- @close="handleCloseMinutesDialog"
- >
+ <el-dialog title="娣诲姞浼氳绾"
+ v-model="minutesDialogVisible"
+ width="80%"
+ @close="handleCloseMinutesDialog">
<div v-if="currentMeeting">
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="浼氳涓婚">{{ currentMeeting.title }}</el-descriptions-item>
<el-descriptions-item label="鐢宠浜�">{{ currentMeeting.applicant }}</el-descriptions-item>
<el-descriptions-item label="涓绘寔浜�">{{ currentMeeting.host }}</el-descriptions-item>
- <el-descriptions-item label="浼氳鏃堕棿" :span="2">
+ <el-descriptions-item label="浼氳鏃堕棿"
+ :span="2">
{{ formatDateTime(currentMeeting.meetingTime) }}
</el-descriptions-item>
<el-descriptions-item label="浼氳鍦扮偣">{{ currentMeeting.location }}</el-descriptions-item>
<el-descriptions-item label="鍙備細浜烘暟">{{ currentMeeting.participants.length }}浜�</el-descriptions-item>
</el-descriptions>
-
<div class="content-section mt-20">
<h4>浼氳绾鍐呭</h4>
<div class="editor-container">
- <Editor
- v-model="minutesContent"
- :min-height="400"
- />
+ <Editor v-model="minutesContent"
+ :min-height="400" />
</div>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitMinutes">淇� 瀛�</el-button>
<el-button @click="minutesDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitMinutes">淇� 瀛�</el-button>
</div>
</template>
</el-dialog>
@@ -162,242 +190,250 @@
</template>
<script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { ElMessage } from 'element-plus'
-import Pagination from '@/components/Pagination/index.vue'
-import Editor from '@/components/Editor/index.vue'
-import { getRoomEnum, getMeetingPublish ,getMeetingMinutesByMeetingId,saveMeetingMinutes} from '@/api/collaborativeApproval/meeting.js'
-import { getStaffOnJob } from "@/api/personnelManagement/onboarding.js"
-import dayjs from "dayjs"
+ import { ref, reactive, onMounted } from "vue";
+ import { ElMessage } from "element-plus";
+ import Pagination from "@/components/Pagination/index.vue";
+ import Editor from "@/components/Editor/index.vue";
+ import {
+ getRoomEnum,
+ getMeetingPublish,
+ getMeetingMinutesByMeetingId,
+ saveMeetingMinutes,
+ } from "@/api/collaborativeApproval/meeting.js";
+ import { getStaffOnJob } from "@/api/personnelManagement/onboarding.js";
+ import dayjs from "dayjs";
-// 鏁版嵁鍒楄〃鍔犺浇鐘舵��
-const loading = ref(false)
+ // 鏁版嵁鍒楄〃鍔犺浇鐘舵��
+ const loading = ref(false);
-// 鎬绘潯鏁�
-const total = ref(0)
-const roomEnum = ref([])
-const staffList = ref([])
+ // 鎬绘潯鏁�
+ const total = ref(0);
+ const roomEnum = ref([]);
+ const staffList = ref([]);
-// 浼氳鍒楄〃鏁版嵁
-const meetingList = ref([])
+ // 浼氳鍒楄〃鏁版嵁
+ const meetingList = ref([]);
-// 鏌ヨ鍙傛暟
-const queryParams = reactive({
- current: 1,
- size: 10
-})
+ // 鏌ヨ鍙傛暟
+ const queryParams = reactive({
+ current: 1,
+ size: 10,
+ });
-// 鎼滅储琛ㄥ崟
-const searchForm = reactive({
- title: '',
- applicant: '',
- // status: '1' // 榛樿鍙樉绀哄凡閫氳繃瀹℃壒鐨勪細璁�
-})
+ // 鎼滅储琛ㄥ崟
+ const searchForm = reactive({
+ title: "",
+ applicant: "",
+ // status: '1' // 榛樿鍙樉绀哄凡閫氳繃瀹℃壒鐨勪細璁�
+ });
-// 鏄惁鏄剧ず瀵硅瘽妗�
-const detailDialogVisible = ref(false)
-const minutesDialogVisible = ref(false)
+ // 鏄惁鏄剧ず瀵硅瘽妗�
+ const detailDialogVisible = ref(false);
+ const minutesDialogVisible = ref(false);
-// 褰撳墠鏌ョ湅鐨勪細璁�
-const currentMeeting = ref(null)
+ // 褰撳墠鏌ョ湅鐨勪細璁�
+ const currentMeeting = ref(null);
-// 浼氳绾鍐呭
-const minutesContent = ref('')
-const minutesContentId = ref('')
+ // 浼氳绾鍐呭
+ const minutesContent = ref("");
+ const minutesContentId = ref("");
-// 鏌ヨ鏁版嵁
-const getList = async () => {
- loading.value = true
- let resp = await getMeetingPublish({ ...searchForm, ...queryParams })
- meetingList.value = resp.data.records.map(it => {
- let room = roomEnum.value.find(room => it.roomId === room.id)
- it.location = `${room.name}(${room.location})`
- let staffs = JSON.parse(it.participants)
- it.staffCount = staffs.size
- it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format('HH:mm:ss')} ~ ${dayjs(it.endTime).format('HH:mm:ss')}`
- it.participants = staffList.value.filter(staff => staffs.some(id => id === staff.id)).map(staff => {
- return {
- id: staff.id,
- name: `${staff.staffName}(${staff.postJob})`
- }
- })
+ // 鏌ヨ鏁版嵁
+ const getList = async () => {
+ loading.value = true;
+ let resp = await getMeetingPublish({ ...searchForm, ...queryParams });
+ meetingList.value = resp.data.records.map(it => {
+ let room = roomEnum.value.find(room => it.roomId === room.id);
+ it.location = `${room.name}(${room.location})`;
+ let staffs = JSON.parse(it.participants);
+ it.staffCount = staffs.size;
+ it.meetingTime = `${it.meetingDate} ${dayjs(it.startTime).format(
+ "HH:mm:ss"
+ )} ~ ${dayjs(it.endTime).format("HH:mm:ss")}`;
+ it.participants = staffList.value
+ .filter(staff => staffs.some(id => id === staff.id))
+ .map(staff => {
+ return {
+ id: staff.id,
+ name: `${staff.staffName}(${staff.postJob})`,
+ };
+ });
- return it
- })
- total.value = resp.data.total
- loading.value = false
-}
+ return it;
+ });
+ total.value = resp.data.total;
+ loading.value = false;
+ };
-// 鎼滅储鎸夐挳鎿嶄綔
-const handleSearch = () => {
- queryParams.current = 1
- getList()
-}
+ // 鎼滅储鎸夐挳鎿嶄綔
+ const handleSearch = () => {
+ queryParams.current = 1;
+ getList();
+ };
-// 閲嶇疆鎼滅储琛ㄥ崟
-const resetSearch = () => {
- Object.assign(searchForm, {
- title: '',
- applicant: '',
- // status: '1'
- })
- handleSearch()
-}
+ // 閲嶇疆鎼滅储琛ㄥ崟
+ const resetSearch = () => {
+ Object.assign(searchForm, {
+ title: "",
+ applicant: "",
+ // status: '1'
+ });
+ handleSearch();
+ };
-// 鏌ョ湅璇︽儏
-const viewDetail = (row) => {
- currentMeeting.value = row
- detailDialogVisible.value = true
-}
+ // 鏌ョ湅璇︽儏
+ const viewDetail = row => {
+ currentMeeting.value = row;
+ detailDialogVisible.value = true;
+ };
-// 娣诲姞浼氳绾
-const addMinutes = async (row) => {
- let resp = await getMeetingMinutesByMeetingId(row.id)
- currentMeeting.value = row
- if (resp.data){
- minutesContent.value = resp.data.content
- minutesContentId.value = resp.data.id
- }else {
- minutesContent.value = `<h2>${row.title}浼氳绾</h2>
-<p><strong>浼氳鏃堕棿锛�</strong>${row.meetingTime}</p>
-<p><strong>浼氳鍦扮偣锛�</strong>${row.location}</p>
-<p><strong>涓绘寔浜猴細</strong>${row.host}</p>
-<p><strong>鍙備細浜哄憳锛�</strong></p>
-<ol>
- ${row.participants.map(p => `<li>${p.name}</li>`).join('')}
-</ol>
-<p><strong>浼氳鍐呭锛�</strong></p>
-<ol>
- <li>璁涓�锛�
- <ul>
- <li>璁ㄨ鍐呭锛�</li>
- <li>鍐宠浜嬮」锛�</li>
- </ul>
- </li>
- <li>璁浜岋細
- <ul>
- <li>璁ㄨ鍐呭锛�</li>
- <li>鍐宠浜嬮」锛�</li>
- </ul>
- </li>
-</ol>
-<p><strong>澶囨敞锛�</strong></p>`
- }
+ // 娣诲姞浼氳绾
+ const addMinutes = async row => {
+ let resp = await getMeetingMinutesByMeetingId(row.id);
+ currentMeeting.value = row;
+ if (resp.data) {
+ minutesContent.value = resp.data.content;
+ minutesContentId.value = resp.data.id;
+ } else {
+ minutesContent.value = `<h2>${row.title}浼氳绾</h2>
+ <p><strong>浼氳鏃堕棿锛�</strong>${row.meetingTime}</p>
+ <p><strong>浼氳鍦扮偣锛�</strong>${row.location}</p>
+ <p><strong>涓绘寔浜猴細</strong>${row.host}</p>
+ <p><strong>鍙備細浜哄憳锛�</strong></p>
+ <ol>
+ ${row.participants.map(p => `<li>${p.name}</li>`).join("")}
+ </ol>
+ <p><strong>浼氳鍐呭锛�</strong></p>
+ <ol>
+ <li>璁涓�锛�
+ <ul>
+ <li>璁ㄨ鍐呭锛�</li>
+ <li>鍐宠浜嬮」锛�</li>
+ </ul>
+ </li>
+ <li>璁浜岋細
+ <ul>
+ <li>璁ㄨ鍐呭锛�</li>
+ <li>鍐宠浜嬮」锛�</li>
+ </ul>
+ </li>
+ </ol>
+ <p><strong>澶囨敞锛�</strong></p>`;
+ }
- minutesDialogVisible.value = true
-}
+ minutesDialogVisible.value = true;
+ };
-// 鎻愪氦浼氳绾
-const submitMinutes = () => {
- if (!minutesContent.value) {
- ElMessage.warning('璇疯緭鍏ヤ細璁邯瑕佸唴瀹�')
- return
- }
- saveMeetingMinutes({
- id: minutesContentId.value,
- content: minutesContent.value,
- meetingId: currentMeeting.value.id,
- title: currentMeeting.value.title
- }).then(resp=>{
- console.log('浼氳绾鍐呭:', minutesContent.value)
- ElMessage.success('浼氳绾淇濆瓨鎴愬姛')
- minutesDialogVisible.value = false
- })
+ // 鎻愪氦浼氳绾
+ const submitMinutes = () => {
+ if (!minutesContent.value) {
+ ElMessage.warning("璇疯緭鍏ヤ細璁邯瑕佸唴瀹�");
+ return;
+ }
+ saveMeetingMinutes({
+ id: minutesContentId.value,
+ content: minutesContent.value,
+ meetingId: currentMeeting.value.id,
+ title: currentMeeting.value.title,
+ }).then(resp => {
+ console.log("浼氳绾鍐呭:", minutesContent.value);
+ ElMessage.success("浼氳绾淇濆瓨鎴愬姛");
+ minutesDialogVisible.value = false;
+ });
+ };
-}
+ // 鍏抽棴浼氳绾瀵硅瘽妗�
+ const handleCloseMinutesDialog = () => {
+ minutesContent.value = "";
+ };
-// 鍏抽棴浼氳绾瀵硅瘽妗�
-const handleCloseMinutesDialog = () => {
- minutesContent.value = ''
-}
+ // 鑾峰彇鐘舵�佺被鍨�
+ const getStatusType = status => {
+ const statusMap = {
+ 0: "info", // 寰呭鎵�
+ 1: "success", // 宸查�氳繃
+ 2: "warning", // 鏈�氳繃
+ 3: "danger", // 鍙栨秷
+ };
+ return statusMap[status] || "info";
+ };
-// 鑾峰彇鐘舵�佺被鍨�
-const getStatusType = (status) => {
- const statusMap = {
- '0': 'info', // 寰呭鎵�
- '1': 'success', // 宸查�氳繃
- '2': 'warning', // 鏈�氳繃
- '3': 'danger' // 鍙栨秷
- }
- return statusMap[status] || 'info'
-}
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusMap = {
+ 0: "寰呭鎵�",
+ 1: "宸查�氳繃",
+ 2: "鏈�氳繃",
+ 3: "宸插彇娑�",
+ };
+ return statusMap[status] || "鏈煡";
+ };
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusMap = {
- '0': '寰呭鎵�',
- '1': '宸查�氳繃',
- '2': '鏈�氳繃',
- '3': '宸插彇娑�'
- }
- return statusMap[status] || '鏈煡'
-}
+ // 鏍煎紡鍖栨棩鏈熸椂闂�
+ const formatDateTime = dateTime => {
+ if (!dateTime) return "";
+ return dateTime.replace(" ", "\n");
+ };
-// 鏍煎紡鍖栨棩鏈熸椂闂�
-const formatDateTime = (dateTime) => {
- if (!dateTime) return ''
- return dateTime.replace(' ', '\n')
-}
+ // 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
+ onMounted(async () => {
+ const [resp1, resp2] = await Promise.all([getRoomEnum(), getStaffOnJob()]);
+ roomEnum.value = resp1.data;
+ staffList.value = resp2.data;
-// 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
-onMounted(async () => {
- const [resp1, resp2] = await Promise.all([getRoomEnum(), getStaffOnJob()])
- roomEnum.value = resp1.data
- staffList.value = resp2.data
-
- await getList()
-})
+ await getList();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.page-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 20px;
-}
+ .page-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ }
-.page-header h2 {
- margin: 0;
- color: #303133;
-}
+ .page-header h2 {
+ margin: 0;
+ color: #303133;
+ }
-.search-card {
- margin-bottom: 20px;
-}
+ .search-card {
+ margin-bottom: 20px;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
-.content-section h4 {
- margin: 0 0 15px 0;
- color: #303133;
-}
+ .content-section h4 {
+ margin: 0 0 15px 0;
+ color: #303133;
+ }
-.mt-20 {
- margin-top: 20px;
-}
+ .mt-20 {
+ margin-top: 20px;
+ }
-.participants-list {
- min-height: 40px;
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
-}
+ .participants-list {
+ min-height: 40px;
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ }
-.nowrap-label {
- white-space: nowrap !important;
-}
+ .nowrap-label {
+ white-space: nowrap !important;
+ }
-.editor-container {
- border: 1px solid #dcdfe6;
- border-radius: 4px;
-}
+ .editor-container {
+ border: 1px solid #dcdfe6;
+ border-radius: 4px;
+ }
</style>
diff --git a/src/views/collaborativeApproval/officeSupplies/index.vue b/src/views/collaborativeApproval/officeSupplies/index.vue
index a2d1c6d..6e429c3 100644
--- a/src/views/collaborativeApproval/officeSupplies/index.vue
+++ b/src/views/collaborativeApproval/officeSupplies/index.vue
@@ -4,175 +4,241 @@
<template #header>
<div class="card-header">
<span>鍔炲叕鐗╄祫鐢宠绠＄悊</span>
- <el-button type="primary" @click="openShow()">
- <el-icon><Plus /></el-icon>
+ <el-button type="primary"
+ @click="openShow()">
+ <el-icon>
+ <Plus />
+ </el-icon>
鏂板缓鐢宠
</el-button>
</div>
</template>
-
- <!-- 鎼滅储鍖哄煙 -->
- <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
- <el-form-item label="鐢宠缂栧彿" prop="code">
- <el-input
- v-model="queryParams.code"
- placeholder="璇疯緭鍏ョ敵璇风紪鍙�"
- clearable
- style="width: 200px"
- @keyup.enter="handleQuery"
- />
- </el-form-item>
- <el-form-item label="鐢宠浜�" prop="applicant">
- <el-input
- v-model="queryParams.applicant"
- placeholder="璇疯緭鍏ョ敵璇蜂汉"
- clearable
- style="width: 200px"
- @keyup.enter="handleQuery"
- />
- </el-form-item>
- <el-form-item label="鐢宠鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="璇烽�夋嫨鐘舵��" clearable style="width: 200px">
- <el-option label="寰呭鎵�" value="1" />
- <el-option label="宸查�氳繃" value="3" />
- <el-option label="宸叉嫆缁�" value="2" />
- <el-option label="宸插彂鏀�" value="4" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="handleQuery">
- <el-icon><Search /></el-icon>
- 鎼滅储
- </el-button>
- <el-button @click="resetQuery">
- <el-icon><Refresh /></el-icon>
- 閲嶇疆
- </el-button>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="handleExport">
- <el-icon><Download /></el-icon>
+ <!-- 鎼滅储鍖哄煙 -->
+ <el-form :model="queryParams"
+ ref="queryRef"
+ :inline="true"
+ v-show="showSearch">
+ <el-form-item label="鐢宠缂栧彿"
+ prop="code">
+ <el-input v-model="queryParams.code"
+ placeholder="璇疯緭鍏ョ敵璇风紪鍙�"
+ clearable
+ style="width: 200px"
+ @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐢宠浜�"
+ prop="applicant">
+ <el-input v-model="queryParams.applicant"
+ placeholder="璇疯緭鍏ョ敵璇蜂汉"
+ clearable
+ style="width: 200px"
+ @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐢宠鐘舵��"
+ prop="status">
+ <el-select v-model="queryParams.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ clearable
+ style="width: 200px">
+ <el-option label="寰呭鎵�"
+ value="1" />
+ <el-option label="宸查�氳繃"
+ value="3" />
+ <el-option label="宸叉嫆缁�"
+ value="2" />
+ <el-option label="宸插彂鏀�"
+ value="4" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary"
+ @click="handleQuery">
+ <el-icon>
+ <Search />
+ </el-icon>
+ 鎼滅储
+ </el-button>
+ <el-button @click="resetQuery">
+ <el-icon>
+ <Refresh />
+ </el-icon>
+ 閲嶇疆
+ </el-button>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary"
+ @click="handleExport">
+ <el-icon>
+ <Download />
+ </el-icon>
瀵煎嚭
</el-button>
- </el-form-item>
- </el-form>
-
+ </el-form-item>
+ </el-form>
<!-- 琛ㄦ牸鍖哄煙 -->
- <el-table
- v-loading="loading"
- :data="officeList"
- @selection-change="handleSelectionChange"
- style="width: 100%"
- >
- <el-table-column type="selection" width="55" align="center" />
- <el-table-column label="鐢宠缂栧彿" align="center" prop="code" width="180" />
- <el-table-column label="鐢宠浜�" align="center" prop="applicant" width="120" />
- <el-table-column label="閮ㄩ棬" align="center" prop="dept" width="120" />
- <el-table-column label="鐗╄祫绫诲瀷" align="center" prop="materialType" width="120">
+ <el-table v-loading="loading"
+ :data="officeList"
+ @selection-change="handleSelectionChange"
+ style="width: 100%">
+ <el-table-column type="selection"
+ width="55"
+ align="center" />
+ <el-table-column label="鐢宠缂栧彿"
+ align="center"
+ prop="code"
+ width="180" />
+ <el-table-column label="鐢宠浜�"
+ align="center"
+ prop="applicant"
+ width="120" />
+ <el-table-column label="閮ㄩ棬"
+ align="center"
+ prop="dept"
+ width="120" />
+ <el-table-column label="鐗╄祫绫诲瀷"
+ align="center"
+ prop="materialType"
+ width="120">
<template #default="scope">
- <el-tag v-if="scope.row.materialType === 1" type="info">鍏朵粬</el-tag>
- <el-tag v-if="scope.row.materialType === 2" type="success">娓呮磥鐢ㄥ搧</el-tag>
- <el-tag v-if="scope.row.materialType === 3" type="warning">鐢靛瓙璁惧</el-tag>
- <el-tag v-if="scope.row.materialType === 4" type="danger">鍔炲叕鐢ㄥ搧</el-tag>
+ <el-tag v-if="scope.row.materialType === 1"
+ type="info">鍏朵粬</el-tag>
+ <el-tag v-if="scope.row.materialType === 2"
+ type="success">娓呮磥鐢ㄥ搧</el-tag>
+ <el-tag v-if="scope.row.materialType === 3"
+ type="warning">鐢靛瓙璁惧</el-tag>
+ <el-tag v-if="scope.row.materialType === 4"
+ type="danger">鍔炲叕鐢ㄥ搧</el-tag>
</template>
</el-table-column>
- <el-table-column label="鐢宠鏁伴噺" align="center" prop="applyNum" width="100" />
- <el-table-column label="鐢宠鍘熷洜" align="center" prop="reason" min-width="200" show-overflow-tooltip />
- <el-table-column label="鐢宠鐘舵��" align="center" prop="status" width="100">
+ <el-table-column label="鐢宠鏁伴噺"
+ align="center"
+ prop="applyNum"
+ width="100" />
+ <el-table-column label="鐢宠鍘熷洜"
+ align="center"
+ prop="reason"
+ min-width="200"
+ show-overflow-tooltip />
+ <el-table-column label="鐢宠鐘舵��"
+ align="center"
+ prop="status"
+ width="100">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ getStatusText(scope.row.status) }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鐢宠鏃堕棿" align="center" prop="applyTime" width="180" />
- <el-table-column label="瀹℃壒浜�" align="center" prop="approval" width="120" />
- <el-table-column label="瀹℃壒鏃堕棿" align="center" prop="approvalTime" width="180" />
- <el-table-column label="鍙戞斁鏃堕棿" align="center" prop="issueTime" width="180" />
- <el-table-column label="鎿嶄綔" align="center" fixed="right" class-name="small-padding fixed-width" width="200">
+ <el-table-column label="鐢宠鏃堕棿"
+ align="center"
+ prop="applyTime"
+ width="180" />
+ <el-table-column label="瀹℃壒浜�"
+ align="center"
+ prop="approval"
+ width="120" />
+ <el-table-column label="瀹℃壒鏃堕棿"
+ align="center"
+ prop="approvalTime"
+ width="180" />
+ <el-table-column label="鍙戞斁鏃堕棿"
+ align="center"
+ prop="issueTime"
+ width="180" />
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ fixed="right"
+ class-name="small-padding fixed-width"
+ width="200">
<template #default="scope">
- <el-button
- v-if="scope.row.status === 1"
- type="primary"
- link
- @click="handleApprove(scope.row)"
- >
+ <el-button v-if="scope.row.status === 1"
+ type="primary"
+ link
+ @click="handleApprove(scope.row)">
瀹℃壒
</el-button>
- <el-button
- v-if="scope.row.status === 3"
- type="success"
- link
- @click="handleIssue(scope.row)"
- >
+ <el-button v-if="scope.row.status === 3"
+ type="success"
+ link
+ @click="handleIssue(scope.row)">
鍙戞斁
</el-button>
- <el-button
- type="info"
- link
- @click="handleDetail(scope.row)"
- >
+ <el-button type="info"
+ link
+ @click="handleDetail(scope.row)">
璇︽儏
</el-button>
- <el-button
- v-if="scope.row.status === 2"
- type="danger"
- link
- @click="handleDelete(scope.row)"
- >
+ <el-button v-if="scope.row.status === 2"
+ type="danger"
+ link
+ @click="handleDelete(scope.row)">
鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.current"
- v-model:limit="queryParams.size"
- @pagination="getList"
- />
+ <pagination v-show="total > 0"
+ :total="total"
+ v-model:page="queryParams.current"
+ v-model:limit="queryParams.size"
+ @pagination="getList" />
</el-card>
-
<!-- 鐢宠瀵硅瘽妗� -->
- <el-dialog
- v-model="showApplyDialog"
- title="鍔炲叕鐗╄祫鐢宠"
- width="600px"
- append-to-body
- >
- <el-form ref="applyFormRef" :model="applyForm" :rules="applyRules" label-width="100px">
- <el-form-item label="鐢宠浜�" prop="applicant">
- <el-input v-model="applyForm.applicant" placeholder="璇疯緭鍏ョ敵璇蜂汉鍚嶇О" />
+ <el-dialog v-model="showApplyDialog"
+ title="鍔炲叕鐗╄祫鐢宠"
+ width="600px"
+ append-to-body>
+ <el-form ref="applyFormRef"
+ :model="applyForm"
+ :rules="applyRules"
+ label-width="100px">
+ <el-form-item label="鐢宠浜�"
+ prop="applicant">
+ <el-input v-model="applyForm.applicant"
+ placeholder="璇疯緭鍏ョ敵璇蜂汉鍚嶇О" />
</el-form-item>
- <el-form-item label="閮ㄩ棬" prop="dept">
- <el-input v-model="applyForm.dept" placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" />
+ <el-form-item label="閮ㄩ棬"
+ prop="dept">
+ <el-input v-model="applyForm.dept"
+ placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" />
</el-form-item>
- <el-form-item label="鐗╄祫绫诲瀷" prop="materialType">
- <el-select v-model="applyForm.materialType" placeholder="璇烽�夋嫨鐗╄祫绫诲瀷" style="width: 100%">
- <el-option label="鍔炲叕鐢ㄥ搧" value="4" />
- <el-option label="鐢靛瓙璁惧" value="3" />
- <el-option label="娓呮磥鐢ㄥ搧" value="2" />
- <el-option label="鍏朵粬" value="1" />
+ <el-form-item label="鐗╄祫绫诲瀷"
+ prop="materialType">
+ <el-select v-model="applyForm.materialType"
+ placeholder="璇烽�夋嫨鐗╄祫绫诲瀷"
+ style="width: 100%">
+ <el-option label="鍔炲叕鐢ㄥ搧"
+ value="4" />
+ <el-option label="鐢靛瓙璁惧"
+ value="3" />
+ <el-option label="娓呮磥鐢ㄥ搧"
+ value="2" />
+ <el-option label="鍏朵粬"
+ value="1" />
</el-select>
</el-form-item>
- <el-form-item label="鍏蜂綋鐗╁搧" prop="itemName">
- <el-input v-model="applyForm.itemName" placeholder="璇疯緭鍏ュ叿浣撶墿鍝佸悕绉�" />
+ <el-form-item label="鍏蜂綋鐗╁搧"
+ prop="itemName">
+ <el-input v-model="applyForm.itemName"
+ placeholder="璇疯緭鍏ュ叿浣撶墿鍝佸悕绉�" />
</el-form-item>
- <el-form-item label="鐢宠鏁伴噺" prop="applyNum">
- <el-input-number v-model="applyForm.applyNum" :min="1" :max="999" style="width: 100%" />
+ <el-form-item label="鐢宠鏁伴噺"
+ prop="applyNum">
+ <el-input-number v-model="applyForm.applyNum"
+ :min="1"
+ :max="999"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="鐢宠鍘熷洜" prop="reason">
- <el-input
- v-model="applyForm.reason"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ョ敵璇峰師鍥�"
- />
+ <el-form-item label="鐢宠鍘熷洜"
+ prop="reason">
+ <el-input v-model="applyForm.reason"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ョ敵璇峰師鍥�" />
</el-form-item>
- <el-form-item label="绱ф�ョ▼搴�" prop="urgency">
+ <el-form-item label="绱ф�ョ▼搴�"
+ prop="urgency">
<el-radio-group v-model="applyForm.urgency">
<el-radio label="1">鏅��</el-radio>
<el-radio label="2">绱ф��</el-radio>
@@ -182,58 +248,59 @@
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitApply">纭� 瀹�</el-button>
<el-button @click="showApplyDialog = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitApply">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 瀹℃壒瀵硅瘽妗� -->
- <el-dialog
- v-model="showApproveDialog"
- title="瀹℃壒鐢宠"
- width="500px"
- append-to-body
- >
- <el-form ref="approveFormRef" :model="approveForm" :rules="approveRules" label-width="100px">
- <el-form-item label="瀹℃壒缁撴灉" prop="approveResult">
+ <el-dialog v-model="showApproveDialog"
+ title="瀹℃壒鐢宠"
+ width="500px"
+ append-to-body>
+ <el-form ref="approveFormRef"
+ :model="approveForm"
+ :rules="approveRules"
+ label-width="100px">
+ <el-form-item label="瀹℃壒缁撴灉"
+ prop="approveResult">
<el-radio-group v-model="approveForm.approveResult">
<el-radio label="3">閫氳繃</el-radio>
<el-radio label="2">鎷掔粷</el-radio>
</el-radio-group>
</el-form-item>
- <el-form-item label="瀹℃壒鎰忚" prop="approvalOpinions">
- <el-input
- v-model="approveForm.approvalOpinions"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ュ鎵规剰瑙�"
- />
+ <el-form-item label="瀹℃壒鎰忚"
+ prop="approvalOpinions">
+ <el-input v-model="approveForm.approvalOpinions"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ュ鎵规剰瑙�" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitApprove">纭� 瀹�</el-button>
<el-button @click="showApproveDialog = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitApprove">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 璇︽儏瀵硅瘽妗� -->
- <el-dialog
- v-model="showDetailDialog"
- title="鐢宠璇︽儏"
- width="700px"
- append-to-body
- >
- <el-descriptions :column="2" border>
+ <el-dialog v-model="showDetailDialog"
+ title="鐢宠璇︽儏"
+ width="700px"
+ append-to-body>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="鐢宠缂栧彿">{{ currentDetail.code }}</el-descriptions-item>
<el-descriptions-item label="鐢宠浜�">{{ currentDetail.applicant }}</el-descriptions-item>
<el-descriptions-item label="閮ㄩ棬">{{ currentDetail.dept }}</el-descriptions-item>
<el-descriptions-item label="鐗╄祫绫诲瀷">{{ currentDetail.materialType }}</el-descriptions-item>
<el-descriptions-item label="鍏蜂綋鐗╁搧">{{ currentDetail.itemName }}</el-descriptions-item>
<el-descriptions-item label="鐢宠鏁伴噺">{{ currentDetail.applyNum }}</el-descriptions-item>
- <el-descriptions-item label="鐢宠鍘熷洜" :span="2">{{ currentDetail.reason }}</el-descriptions-item>
+ <el-descriptions-item label="鐢宠鍘熷洜"
+ :span="2">{{ currentDetail.reason }}</el-descriptions-item>
<el-descriptions-item label="鐢宠鐘舵��">
<el-tag :type="getStatusType(currentDetail.status)">
{{ getStatusText(currentDetail.status) }}
@@ -242,7 +309,8 @@
<el-descriptions-item label="鐢宠鏃堕棿">{{ currentDetail.applyTime }}</el-descriptions-item>
<el-descriptions-item label="瀹℃壒浜�">{{ currentDetail.approval || '-' }}</el-descriptions-item>
<el-descriptions-item label="瀹℃壒鏃堕棿">{{ currentDetail.approvalTime || '-' }}</el-descriptions-item>
- <el-descriptions-item label="瀹℃壒鎰忚" :span="2">{{ currentDetail.approvalOpinions || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="瀹℃壒鎰忚"
+ :span="2">{{ currentDetail.approvalOpinions || '-' }}</el-descriptions-item>
<el-descriptions-item label="鍙戞斁鏃堕棿">{{ currentDetail.issueTime || '-' }}</el-descriptions-item>
<el-descriptions-item label="鍙戞斁浜�">{{ currentDetail.issueUser || '-' }}</el-descriptions-item>
</el-descriptions>
@@ -251,262 +319,277 @@
</template>
<script setup>
-import {listPage,add,update,deleteOff} from "@/api/collaborativeApproval/officeSupplies.js"
-import {ref, reactive, onMounted, getCurrentInstance} from 'vue'
-import Cookies from 'js-cookie'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Search, Refresh, Download, Check } from '@element-plus/icons-vue'
+ import {
+ listPage,
+ add,
+ update,
+ deleteOff,
+ } from "@/api/collaborativeApproval/officeSupplies.js";
+ import { ref, reactive, onMounted, getCurrentInstance } from "vue";
+ import Cookies from "js-cookie";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import {
+ Plus,
+ Search,
+ Refresh,
+ Download,
+ Check,
+ } from "@element-plus/icons-vue";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const showSearch = ref(true)
-const showApplyDialog = ref(false)
-const showApproveDialog = ref(false)
-const showDetailDialog = ref(false)
-const multipleSelection = ref([])
-const officeList = ref([])
-const total = ref(0)
-const suppliesList = ref([])
-const currentDetail = ref({})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const showSearch = ref(true);
+ const showApplyDialog = ref(false);
+ const showApproveDialog = ref(false);
+ const showDetailDialog = ref(false);
+ const multipleSelection = ref([]);
+ const officeList = ref([]);
+ const total = ref(0);
+ const suppliesList = ref([]);
+ const currentDetail = ref({});
-// 鏌ヨ鍙傛暟
-const queryParams = reactive({
- current: 1,
- size: 10,
- code: '',
- applicant: '',
- status: ''
-})
+ // 鏌ヨ鍙傛暟
+ const queryParams = reactive({
+ current: 1,
+ size: 10,
+ code: "",
+ applicant: "",
+ status: "",
+ });
-// 鐢宠琛ㄥ崟
-const applyForm = reactive({
- applicant: '',
- dept: '',
- materialType: '',
- itemName: '',
- applyNum: 1,
- reason: '',
- urgency: '1'
-})
-
-// 瀹℃壒琛ㄥ崟
-const approveForm = reactive({
- approveResult: '3',
- approvalOpinions: ''
-})
-
-// 琛ㄥ崟鏍￠獙瑙勫垯
-const applyRules = {
- applicant: [{ required: true, message: '璇烽�夋嫨鐗╄祫绫诲瀷', trigger: 'blur' }],
- dept: [{ required: true, message: '璇烽�夋嫨鐗╄祫绫诲瀷', trigger: 'blur' }],
- materialType: [{ required: true, message: '璇烽�夋嫨鐗╄祫绫诲瀷', trigger: 'change' }],
- itemName: [{ required: true, message: '璇疯緭鍏ュ叿浣撶墿鍝佸悕绉�', trigger: 'blur' }],
- applyNum: [{ required: true, message: '璇疯緭鍏ョ敵璇锋暟閲�', trigger: 'blur' }],
- reason: [{ required: true, message: '璇疯緭鍏ョ敵璇峰師鍥�', trigger: 'blur' }]
-}
-
-const approveRules = {
- approveResult: [{ required: true, message: '璇烽�夋嫨瀹℃壒缁撴灉', trigger: 'change' }],
- approvalOpinions: [{ required: true, message: '璇疯緭鍏ュ鎵规剰瑙�', trigger: 'blur' }]
-}
-
-const openShow = () => {
- showApplyDialog.value = true
- resetApplyForm()
-}
-
-// 鑾峰彇鍒楄〃鏁版嵁
-const getList = () => {
- loading.value = true
- listPage(queryParams).then(res => {
- total.value = res.data.total
- loading.value = false
- officeList.value = res.data.records
- })
-}
-
-// 鏌ヨ
-const handleQuery = () => {
- queryParams.current = 1
- getList()
-}
-
-// 閲嶇疆鏌ヨ
-const resetQuery = () => {
- queryParams.code = ''
- queryParams.applicant = ''
- queryParams.status = ''
- handleQuery()
-}
-
-// 澶氶��
-const handleSelectionChange = (selection) => {
- multipleSelection.value = selection
-}
-
-// 鑾峰彇鐘舵�佺被鍨�
-const getStatusType = (status) => {
- const statusMap = {
- 1: 'warning',
- 3: 'success',
- 2: 'danger',
- 4: 'info'
- }
- return statusMap[status] || 'info'
-}
-
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusMap = {
- 1: '寰呭鎵�',
- 3: '宸查�氳繃',
- 2: '宸叉嫆缁�',
- 4: '宸插彂鏀�'
- }
- return statusMap[status] || status
-}
-
-// 鎻愪氦鐢宠
-const submitApply = () => {
- add(applyForm).then(() => {
- ElMessage.success('鐢宠鎴愬姛')
- getList()
- showApplyDialog.value = false
- resetApplyForm()
- })
-
-
-
-}
-
-//閲嶇疆琛ㄥ崟
-const resetApplyForm = () => {
- // 閲嶇疆琛ㄥ崟
- Object.assign(applyForm, {
- applicant: '',
- dept: '',
- materialType: '',
- itemName: '',
+ // 鐢宠琛ㄥ崟
+ const applyForm = reactive({
+ applicant: "",
+ dept: "",
+ materialType: "",
+ itemName: "",
applyNum: 1,
- reason: '',
- urgency: '1'
- })
-}
+ reason: "",
+ urgency: "1",
+ });
-// 瀹℃壒
-const handleApprove = (row) => {
- currentDetail.value = row
- showApproveDialog.value = true
-}
+ // 瀹℃壒琛ㄥ崟
+ const approveForm = reactive({
+ approveResult: "3",
+ approvalOpinions: "",
+ });
-const formatDate = (date) => {
- const year = date.getFullYear()
- const month = String(date.getMonth() + 1).padStart(2, '0')
- const day = String(date.getDate()).padStart(2, '0')
- const hours = String(date.getHours()).padStart(2, '0')
- const minutes = String(date.getMinutes()).padStart(2, '0')
- const sends = String(date.getSeconds()).padStart(2, '0')
- return `${year}-${month}-${day} ${hours}:${minutes}:${sends}`
-}
+ // 琛ㄥ崟鏍￠獙瑙勫垯
+ const applyRules = {
+ applicant: [{ required: true, message: "璇烽�夋嫨鐗╄祫绫诲瀷", trigger: "blur" }],
+ dept: [{ required: true, message: "璇烽�夋嫨鐗╄祫绫诲瀷", trigger: "blur" }],
+ materialType: [
+ { required: true, message: "璇烽�夋嫨鐗╄祫绫诲瀷", trigger: "change" },
+ ],
+ itemName: [
+ { required: true, message: "璇疯緭鍏ュ叿浣撶墿鍝佸悕绉�", trigger: "blur" },
+ ],
+ applyNum: [{ required: true, message: "璇疯緭鍏ョ敵璇锋暟閲�", trigger: "blur" }],
+ reason: [{ required: true, message: "璇疯緭鍏ョ敵璇峰師鍥�", trigger: "blur" }],
+ };
-// 鎻愪氦瀹℃壒
-const submitApprove = () => {
- currentDetail.value.status = approveForm.approveResult
- // 浠巆ookie涓幏鍙栧綋鍓嶇櫥褰曠敤鎴峰悕绉�
- currentDetail.value.approval = Cookies.get('username')
- currentDetail.value.approvalTime = formatDate(new Date())
- currentDetail.value.approvalOpinions = approveForm.approvalOpinions
- update(currentDetail.value).then((res) => {
- if(res.code === 200){
- showApproveDialog.value = false
- ElMessage.success('瀹℃壒瀹屾垚')
- getList()
+ const approveRules = {
+ approveResult: [
+ { required: true, message: "璇烽�夋嫨瀹℃壒缁撴灉", trigger: "change" },
+ ],
+ approvalOpinions: [
+ { required: true, message: "璇疯緭鍏ュ鎵规剰瑙�", trigger: "blur" },
+ ],
+ };
- // 閲嶇疆琛ㄥ崟
- Object.assign(approveForm, {
- approveResult: '3',
- approvalOpinions: ''
- })
- }
- })
+ const openShow = () => {
+ showApplyDialog.value = true;
+ resetApplyForm();
+ };
-}
+ // 鑾峰彇鍒楄〃鏁版嵁
+ const getList = () => {
+ loading.value = true;
+ listPage(queryParams).then(res => {
+ total.value = res.data.total;
+ loading.value = false;
+ officeList.value = res.data.records;
+ });
+ };
-// 鍙戞斁
-const handleIssue = (row) => {
- row.status = 4
- row.issueTime = formatDate(new Date())
- row.issueUser = Cookies.get('username')
- update(row).then((res) =>{
- if(res.code === 200){
- ElMessage.success('鍙戞斁瀹屾垚')
- getList()
- }
- })
-}
+ // 鏌ヨ
+ const handleQuery = () => {
+ queryParams.current = 1;
+ getList();
+ };
-// 鏌ョ湅璇︽儏
-const handleDetail = (row) => {
- currentDetail.value = row
- showDetailDialog.value = true
-}
+ // 閲嶇疆鏌ヨ
+ const resetQuery = () => {
+ queryParams.code = "";
+ queryParams.applicant = "";
+ queryParams.status = "";
+ handleQuery();
+ };
-// 鍒犻櫎
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ョ敵璇峰悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- let ids = [row.id]
- deleteOff(ids).then((res) =>{
- ElMessage.success('鍒犻櫎鎴愬姛')
- getList()
+ // 澶氶��
+ const handleSelectionChange = selection => {
+ multipleSelection.value = selection;
+ };
+
+ // 鑾峰彇鐘舵�佺被鍨�
+ const getStatusType = status => {
+ const statusMap = {
+ 1: "warning",
+ 3: "success",
+ 2: "danger",
+ 4: "info",
+ };
+ return statusMap[status] || "info";
+ };
+
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusMap = {
+ 1: "寰呭鎵�",
+ 3: "宸查�氳繃",
+ 2: "宸叉嫆缁�",
+ 4: "宸插彂鏀�",
+ };
+ return statusMap[status] || status;
+ };
+
+ // 鎻愪氦鐢宠
+ const submitApply = () => {
+ add(applyForm).then(() => {
+ ElMessage.success("鐢宠鎴愬姛");
+ getList();
+ showApplyDialog.value = false;
+ resetApplyForm();
+ });
+ };
+
+ //閲嶇疆琛ㄥ崟
+ const resetApplyForm = () => {
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(applyForm, {
+ applicant: "",
+ dept: "",
+ materialType: "",
+ itemName: "",
+ applyNum: 1,
+ reason: "",
+ urgency: "1",
+ });
+ };
+
+ // 瀹℃壒
+ const handleApprove = row => {
+ currentDetail.value = row;
+ showApproveDialog.value = true;
+ };
+
+ const formatDate = date => {
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, "0");
+ const day = String(date.getDate()).padStart(2, "0");
+ const hours = String(date.getHours()).padStart(2, "0");
+ const minutes = String(date.getMinutes()).padStart(2, "0");
+ const sends = String(date.getSeconds()).padStart(2, "0");
+ return `${year}-${month}-${day} ${hours}:${minutes}:${sends}`;
+ };
+
+ // 鎻愪氦瀹℃壒
+ const submitApprove = () => {
+ currentDetail.value.status = approveForm.approveResult;
+ // 浠巆ookie涓幏鍙栧綋鍓嶇櫥褰曠敤鎴峰悕绉�
+ currentDetail.value.approval = Cookies.get("username");
+ currentDetail.value.approvalTime = formatDate(new Date());
+ currentDetail.value.approvalOpinions = approveForm.approvalOpinions;
+ update(currentDetail.value).then(res => {
+ if (res.code === 200) {
+ showApproveDialog.value = false;
+ ElMessage.success("瀹℃壒瀹屾垚");
+ getList();
+
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(approveForm, {
+ approveResult: "3",
+ approvalOpinions: "",
+ });
+ }
+ });
+ };
+
+ // 鍙戞斁
+ const handleIssue = row => {
+ row.status = 4;
+ row.issueTime = formatDate(new Date());
+ row.issueUser = Cookies.get("username");
+ update(row).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鍙戞斁瀹屾垚");
+ getList();
+ }
+ });
+ };
+
+ // 鏌ョ湅璇︽儏
+ const handleDetail = row => {
+ currentDetail.value = row;
+ showDetailDialog.value = true;
+ };
+
+ // 鍒犻櫎
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ョ敵璇峰悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ let ids = [row.id];
+ deleteOff(ids).then(res => {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ });
+ });
+ };
+ const { proxy } = getCurrentInstance();
+ // 瀵煎嚭
+ const handleExport = () => {
+ ElMessageBox.confirm("鎵�鏈夌殑鍐呭灏嗚瀵煎嚭锛屾槸鍚︾‘璁ゅ鍑猴紵", "瀵煎嚭", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
})
- })
-}
-const { proxy } = getCurrentInstance();
-// 瀵煎嚭
-const handleExport = () => {
- ElMessageBox.confirm("鎵�鏈夌殑鍐呭灏嗚瀵煎嚭锛屾槸鍚︾‘璁ゅ鍑猴紵", "瀵煎嚭", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- })
.then(() => {
proxy.download("/officeSupplies/export", {}, "鍔炲叕鐗╄祫.xlsx");
})
.catch(() => {
proxy.$modal.msg("宸插彇娑�");
});
-}
+ };
-// 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
-onMounted(() => {
- getList()
-})
+ // 椤甸潰鍔犺浇鏃惰幏鍙栨暟鎹�
+ onMounted(() => {
+ getList();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.mb8 {
- margin-bottom: 8px;
-}
+ .mb8 {
+ margin-bottom: 8px;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
-:deep(.el-descriptions__label) {
- width: 120px;
-}
+ :deep(.el-descriptions__label) {
+ width: 120px;
+ }
</style>
diff --git a/src/views/collaborativeApproval/planTemplate/index.vue b/src/views/collaborativeApproval/planTemplate/index.vue
index 0af6d8b..810c71d 100644
--- a/src/views/collaborativeApproval/planTemplate/index.vue
+++ b/src/views/collaborativeApproval/planTemplate/index.vue
@@ -3,34 +3,45 @@
<!-- 椤堕儴鎿嶄綔鏍� -->
<div class="header-actions">
<div class="left-actions">
- <el-select v-model="currentLevel" placeholder="閫夋嫨璁″垝绾у埆" style="width: 150px" @change="handleLevelChange">
- <el-option label="涓汉璁″垝" value="personal" />
- <el-option label="灏忕粍璁″垝" value="group" />
- <el-option label="閮ㄩ棬璁″垝" value="department" />
- <el-option label="鍏徃璁″垝" value="company" />
+ <el-select v-model="currentLevel"
+ placeholder="閫夋嫨璁″垝绾у埆"
+ style="width: 150px"
+ @change="handleLevelChange">
+ <el-option label="涓汉璁″垝"
+ value="personal" />
+ <el-option label="灏忕粍璁″垝"
+ value="group" />
+ <el-option label="閮ㄩ棬璁″垝"
+ value="department" />
+ <el-option label="鍏徃璁″垝"
+ value="company" />
</el-select>
- <el-select v-model="currentPeriod" placeholder="閫夋嫨鏃堕棿鍛ㄦ湡" style="width: 120px; margin-left: 10px" @change="handlePeriodChange">
- <el-option label="鍛ㄨ鍒�" value="week" />
- <el-option label="鏈堣鍒�" value="month" />
- <el-option label="骞磋鍒�" value="year" />
+ <el-select v-model="currentPeriod"
+ placeholder="閫夋嫨鏃堕棿鍛ㄦ湡"
+ style="width: 120px; margin-left: 10px"
+ @change="handlePeriodChange">
+ <el-option label="鍛ㄨ鍒�"
+ value="week" />
+ <el-option label="鏈堣鍒�"
+ value="month" />
+ <el-option label="骞磋鍒�"
+ value="year" />
</el-select>
- <el-date-picker
- v-model="currentDate"
- :type="datePickerType"
- placeholder="閫夋嫨鏃ユ湡"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- style="width: 180px; margin-left: 10px"
- @change="handleDateChange"
- />
+ <el-date-picker v-model="currentDate"
+ :type="datePickerType"
+ placeholder="閫夋嫨鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ style="width: 180px; margin-left: 10px"
+ @change="handleDateChange" />
</div>
<div class="right-actions">
- <el-button type="primary" @click="handleAddPlan">鏂板璁″垝</el-button>
+ <el-button type="primary"
+ @click="handleAddPlan">鏂板璁″垝</el-button>
<el-button @click="handleExport">瀵煎嚭璁″垝</el-button>
<!-- <el-button @click="handleShare">鍏变韩璁″垝@</el-button> -->
</div>
</div>
-
<!-- 璁″垝姒傝鍗＄墖 -->
<div class="overview-cards">
<el-row :gutter="20">
@@ -38,13 +49,16 @@
<el-card class="overview-card">
<div class="card-content">
<div class="card-icon personal">
- <el-icon><User /></el-icon>
+ <el-icon>
+ <User />
+ </el-icon>
</div>
<div class="card-info">
<div class="card-title">涓汉璁″垝</div>
<div class="card-number">{{ overviewData.personal.total }}</div>
<div class="card-progress">
- <el-progress :percentage="overviewData.personal.completion" :stroke-width="6" />
+ <el-progress :percentage="overviewData.personal.completion"
+ :stroke-width="6" />
</div>
</div>
</div>
@@ -54,13 +68,16 @@
<el-card class="overview-card">
<div class="card-content">
<div class="card-icon group">
- <el-icon><UserFilled /></el-icon>
+ <el-icon>
+ <UserFilled />
+ </el-icon>
</div>
<div class="card-info">
<div class="card-title">灏忕粍璁″垝</div>
<div class="card-number">{{ overviewData.group.total }}</div>
<div class="card-progress">
- <el-progress :percentage="overviewData.group.completion" :stroke-width="6" />
+ <el-progress :percentage="overviewData.group.completion"
+ :stroke-width="6" />
</div>
</div>
</div>
@@ -70,13 +87,16 @@
<el-card class="overview-card">
<div class="card-content">
<div class="card-icon department">
- <el-icon><OfficeBuilding /></el-icon>
+ <el-icon>
+ <OfficeBuilding />
+ </el-icon>
</div>
<div class="card-info">
<div class="card-title">閮ㄩ棬璁″垝</div>
<div class="card-number">{{ overviewData.department.total }}</div>
<div class="card-progress">
- <el-progress :percentage="overviewData.department.completion" :stroke-width="6" />
+ <el-progress :percentage="overviewData.department.completion"
+ :stroke-width="6" />
</div>
</div>
</div>
@@ -86,13 +106,16 @@
<el-card class="overview-card">
<div class="card-content">
<div class="card-icon company">
- <el-icon><House /></el-icon>
+ <el-icon>
+ <House />
+ </el-icon>
</div>
<div class="card-info">
<div class="card-title">鍏徃璁″垝</div>
<div class="card-number">{{ overviewData.company.total }}</div>
<div class="card-progress">
- <el-progress :percentage="overviewData.company.completion" :stroke-width="6" />
+ <el-progress :percentage="overviewData.company.completion"
+ :stroke-width="6" />
</div>
</div>
</div>
@@ -100,7 +123,6 @@
</el-col>
</el-row>
</div>
-
<!-- 璁″垝鍒楄〃 -->
<div class="plan-content">
<el-card>
@@ -108,68 +130,82 @@
<div class="card-header">
<span>{{ getCurrentLevelText() }} - {{ getCurrentPeriodText() }}</span>
<div>
- <el-button size="small" @click="handleRefresh">鍒锋柊</el-button>
+ <el-button size="small"
+ @click="handleRefresh">鍒锋柊</el-button>
<!-- <el-button size="small" @click="handleFilter">绛涢�堾</el-button> -->
</div>
</div>
</template>
-
<div class="plan-list">
- <div v-for="plan in planList" :key="plan.id" class="plan-item">
+ <div v-for="plan in planList"
+ :key="plan.id"
+ class="plan-item">
<div class="plan-header">
<div class="plan-title">
- <el-tag :type="getPriorityType(plan.priority)" size="small">{{ getPriorityText(plan.priority) }}</el-tag>
+ <el-tag :type="getPriorityType(plan.priority)"
+ size="small">{{ getPriorityText(plan.priority) }}</el-tag>
<span class="title-text">{{ plan.title }}</span>
</div>
<div class="plan-actions">
- <el-button size="small" @click="handleEditPlan(plan)">缂栬緫</el-button>
- <el-button size="small" @click="handleViewDetail(plan)">璇︽儏</el-button>
+ <el-button size="small"
+ @click="handleEditPlan(plan)">缂栬緫</el-button>
+ <el-button size="small"
+ @click="handleViewDetail(plan)">璇︽儏</el-button>
<el-dropdown @command="(command) => handleMoreAction(plan, command)">
<el-button size="small">
- 鏇村<el-icon class="el-icon--right"><ArrowDown /></el-icon>
+ 鏇村<el-icon class="el-icon--right">
+ <ArrowDown />
+ </el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<!-- <el-dropdown-item command="share">鍏变韩@</el-dropdown-item> -->
<el-dropdown-item command="copy">澶嶅埗</el-dropdown-item>
- <el-dropdown-item command="delete" divided>鍒犻櫎</el-dropdown-item>
+ <el-dropdown-item command="delete"
+ divided>鍒犻櫎</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
-
<div class="plan-content">
<div class="plan-description">{{ plan.description }}</div>
<div class="plan-meta">
<div class="meta-item">
- <el-icon><Calendar /></el-icon>
+ <el-icon>
+ <Calendar />
+ </el-icon>
<span>{{ plan.startDate }} - {{ plan.endDate }}</span>
</div>
<div class="meta-item">
- <el-icon><User /></el-icon>
+ <el-icon>
+ <User />
+ </el-icon>
<span>{{ plan.assignee }}</span>
</div>
<div class="meta-item">
- <el-icon><Clock /></el-icon>
+ <el-icon>
+ <Clock />
+ </el-icon>
<span>杩涘害: {{ plan.progress }}%</span>
</div>
<div class="meta-item">
- <el-icon><Flag /></el-icon>
+ <el-icon>
+ <Flag />
+ </el-icon>
<span>{{ getStatusText(plan.status) }}</span>
</div>
</div>
-
<div class="plan-progress">
- <el-progress
- :percentage="plan.progress"
- :color="getProgressColor(plan.progress)"
- :stroke-width="8"
- />
+ <el-progress :percentage="plan.progress"
+ :color="getProgressColor(plan.progress)"
+ :stroke-width="8" />
</div>
-
<div class="plan-tags">
- <el-tag v-for="tag in plan.tags" :key="tag" size="small" style="margin-right: 5px">
+ <el-tag v-for="tag in plan.tags"
+ :key="tag"
+ size="small"
+ style="margin-right: 5px">
{{ tag }}
</el-tag>
</div>
@@ -178,75 +214,96 @@
</div>
</el-card>
</div>
-
<!-- 鏂板/缂栬緫璁″垝瀵硅瘽妗� -->
- <el-dialog
- v-model="planDialogVisible"
- :title="operationType === 'add' ? '鍙戝竷璁″垝' : '缂栬緫璁″垝'"
- width="600px"
- @close="handleDialogClose"
- >
- <el-form :model="planForm" :rules="planRules" ref="planFormRef" label-width="100px">
- <el-form-item label="璁″垝鏍囬" prop="title">
- <el-input v-model="planForm.title" placeholder="璇疯緭鍏ヨ鍒掓爣棰�" />
+ <el-dialog v-model="planDialogVisible"
+ :title="operationType === 'add' ? '鍙戝竷璁″垝' : '缂栬緫璁″垝'"
+ width="600px"
+ @close="handleDialogClose">
+ <el-form :model="planForm"
+ :rules="planRules"
+ ref="planFormRef"
+ label-width="100px">
+ <el-form-item label="璁″垝鏍囬"
+ prop="title">
+ <el-input v-model="planForm.title"
+ placeholder="璇疯緭鍏ヨ鍒掓爣棰�" />
</el-form-item>
- <el-form-item label="璁″垝鎻忚堪" prop="description">
- <el-input
- v-model="planForm.description"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ヨ鍒掓弿杩�"
- />
+ <el-form-item label="璁″垝鎻忚堪"
+ prop="description">
+ <el-input v-model="planForm.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ヨ鍒掓弿杩�" />
</el-form-item>
- <el-form-item label="璁″垝绾у埆" prop="level">
- <el-select v-model="planForm.level" placeholder="閫夋嫨璁″垝绾у埆" style="width: 100%">
- <el-option label="涓汉璁″垝" value="personal" />
- <el-option label="灏忕粍璁″垝" value="group" />
- <el-option label="閮ㄩ棬璁″垝" value="department" />
- <el-option label="鍏徃璁″垝" value="company" />
+ <el-form-item label="璁″垝绾у埆"
+ prop="level">
+ <el-select v-model="planForm.level"
+ placeholder="閫夋嫨璁″垝绾у埆"
+ style="width: 100%">
+ <el-option label="涓汉璁″垝"
+ value="personal" />
+ <el-option label="灏忕粍璁″垝"
+ value="group" />
+ <el-option label="閮ㄩ棬璁″垝"
+ value="department" />
+ <el-option label="鍏徃璁″垝"
+ value="company" />
</el-select>
</el-form-item>
- <el-form-item label="鏃堕棿鍛ㄦ湡" prop="period">
- <el-select v-model="planForm.period" placeholder="閫夋嫨鏃堕棿鍛ㄦ湡" style="width: 100%">
- <el-option label="鍛ㄨ鍒�" value="week" />
- <el-option label="鏈堣鍒�" value="month" />
- <el-option label="骞磋鍒�" value="year" />
+ <el-form-item label="鏃堕棿鍛ㄦ湡"
+ prop="period">
+ <el-select v-model="planForm.period"
+ placeholder="閫夋嫨鏃堕棿鍛ㄦ湡"
+ style="width: 100%">
+ <el-option label="鍛ㄨ鍒�"
+ value="week" />
+ <el-option label="鏈堣鍒�"
+ value="month" />
+ <el-option label="骞磋鍒�"
+ value="year" />
</el-select>
</el-form-item>
- <el-form-item label="寮�濮嬫椂闂�" prop="startDate">
- <el-date-picker
- v-model="planForm.startDate"
- type="date"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- placeholder="閫夋嫨寮�濮嬫椂闂�"
- style="width: 100%"
- />
+ <el-form-item label="寮�濮嬫椂闂�"
+ prop="startDate">
+ <el-date-picker v-model="planForm.startDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ placeholder="閫夋嫨寮�濮嬫椂闂�"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="缁撴潫鏃堕棿" prop="endDate">
- <el-date-picker
- v-model="planForm.endDate"
- type="date"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- placeholder="閫夋嫨缁撴潫鏃堕棿"
- style="width: 100%"
- />
+ <el-form-item label="缁撴潫鏃堕棿"
+ prop="endDate">
+ <el-date-picker v-model="planForm.endDate"
+ type="date"
+ value-format="YYYY-MM-DD"
+ format="YYYY-MM-DD"
+ placeholder="閫夋嫨缁撴潫鏃堕棿"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="璐熻矗浜�" prop="assignee">
- <el-input v-model="planForm.assignee" placeholder="璇疯緭鍏ヨ礋璐ｄ汉" />
+ <el-form-item label="璐熻矗浜�"
+ prop="assignee">
+ <el-input v-model="planForm.assignee"
+ placeholder="璇疯緭鍏ヨ礋璐ｄ汉" />
</el-form-item>
- <el-form-item label="浼樺厛绾�" prop="priority">
- <el-select v-model="planForm.priority" placeholder="閫夋嫨浼樺厛绾�" style="width: 100%">
- <el-option label="楂�" value="high" />
- <el-option label="涓�" value="medium" />
- <el-option label="浣�" value="low" />
+ <el-form-item label="浼樺厛绾�"
+ prop="priority">
+ <el-select v-model="planForm.priority"
+ placeholder="閫夋嫨浼樺厛绾�"
+ style="width: 100%">
+ <el-option label="楂�"
+ value="high" />
+ <el-option label="涓�"
+ value="medium" />
+ <el-option label="浣�"
+ value="low" />
</el-select>
</el-form-item>
<!-- <el-form-item label="鏍囩">
<el-input v-model="planForm.tags" placeholder="璇疯緭鍏ユ爣绛撅紝鐢ㄩ�楀彿鍒嗛殧" />
</el-form-item> -->
- <el-form-item label="鏍囩" prop="tags">
+ <el-form-item label="鏍囩"
+ prop="tags">
<!-- <el-checkbox-group v-model="planForm.tags">
<el-checkbox label="all"></el-checkbox>
<el-checkbox label="manager">绠＄悊灞�</el-checkbox>
@@ -254,50 +311,57 @@
<el-checkbox label="finance">璐㈠姟閮ㄩ棬</el-checkbox>
<el-checkbox label="tech">鎶�鏈儴闂�</el-checkbox>
</el-checkbox-group> -->
- <el-select
- v-model="planForm.tags"
- multiple
- placeholder="璇烽�夋嫨鏍囩"
- style="width: 100%"
- >
- <el-option
- v-for="dept in departments"
- :key="dept"
- :label="dept"
- :value="dept"
- />
+ <el-select v-model="planForm.tags"
+ multiple
+ placeholder="璇烽�夋嫨鏍囩"
+ style="width: 100%">
+ <el-option v-for="dept in departments"
+ :key="dept"
+ :label="dept"
+ :value="dept" />
</el-select>
</el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="planForm.status" placeholder="閫夋嫨鐘舵��" style="width: 100%">
- <el-option label="鏈紑濮�" value="not_started" />
- <el-option label="杩涜涓�" value="in_progress" />
- <el-option label="宸插畬鎴�" value="completed" />
- <el-option label="宸叉殏鍋�" value="paused" />
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="planForm.status"
+ placeholder="閫夋嫨鐘舵��"
+ style="width: 100%">
+ <el-option label="鏈紑濮�"
+ value="not_started" />
+ <el-option label="杩涜涓�"
+ value="in_progress" />
+ <el-option label="宸插畬鎴�"
+ value="completed" />
+ <el-option label="宸叉殏鍋�"
+ value="paused" />
</el-select>
</el-form-item>
- <el-form-item label="杩涘害" prop="progress">
- <el-input-number
- v-model="planForm.progress"
- min="0"
- max="100"
- step="1"
- placeholder="璇疯緭鍏ヨ繘搴�"
- style="width: 100%"
- />
+ <el-form-item label="杩涘害"
+ prop="progress">
+ <el-input-number v-model="planForm.progress"
+ min="0"
+ max="100"
+ step="1"
+ placeholder="璇疯緭鍏ヨ繘搴�"
+ style="width: 100%" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSavePlan">淇濆瓨</el-button>
<el-button @click="planDialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="handleSavePlan">淇濆瓨</el-button>
</span>
</template>
</el-dialog>
<!-- 璁″垝璇︽儏瀵硅瘽妗� -->
- <el-dialog v-model="showPlanDetailDialog" title="璁″垝璇︽儏" width="700px">
- <div v-if="currentPlanDetail" class="mb10">
- <el-descriptions :column="2" border>
+ <el-dialog v-model="showPlanDetailDialog"
+ title="璁″垝璇︽儏"
+ width="700px">
+ <div v-if="currentPlanDetail"
+ class="mb10">
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="璁″垝鏍囬">{{ currentPlanDetail.title }}</el-descriptions-item>
<el-descriptions-item label="璁″垝鎻忚堪">{{ currentPlanDetail.description }}</el-descriptions-item>
<el-descriptions-item label="璁″垝绾у埆">{{ getCurrentLevelText(currentPlanDetail.level) }}</el-descriptions-item>
@@ -316,552 +380,573 @@
</template>
<script setup>
-import { ref, reactive, computed, onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-const { proxy } = getCurrentInstance();
-import {
- User,
- UserFilled,
- OfficeBuilding,
- House,
- Calendar,
- Clock,
- Flag,
- ArrowDown
-} from '@element-plus/icons-vue'
-import { listDutyPlan, addDutyPlan, updateDutyPlan, delDutyPlan,NumDutyPlan,exportDutyPlan } from '@/api/collaborativeApproval/planTemplate.js'
+ import { ref, reactive, computed, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ const { proxy } = getCurrentInstance();
+ import {
+ User,
+ UserFilled,
+ OfficeBuilding,
+ House,
+ Calendar,
+ Clock,
+ Flag,
+ ArrowDown,
+ } from "@element-plus/icons-vue";
+ import {
+ listDutyPlan,
+ addDutyPlan,
+ updateDutyPlan,
+ delDutyPlan,
+ NumDutyPlan,
+ exportDutyPlan,
+ } from "@/api/collaborativeApproval/planTemplate.js";
-// 鍝嶅簲寮忔暟鎹�
-const operationType = ref('add')
-const currentLevel = ref('personal')
-const currentPeriod = ref('week')
-const currentDate = ref(new Date())
-const planDialogVisible = ref(false)
-const dialogTitle = ref('鏂板璁″垝')
-const planFormRef = ref()
-const showPlanDetailDialog = ref(false)
-const currentPlanDetail = ref(null)
+ // 鍝嶅簲寮忔暟鎹�
+ const operationType = ref("add");
+ const currentLevel = ref("personal");
+ const currentPeriod = ref("week");
+ const currentDate = ref(new Date());
+ const planDialogVisible = ref(false);
+ const dialogTitle = ref("鏂板璁″垝");
+ const planFormRef = ref();
+ const showPlanDetailDialog = ref(false);
+ const currentPlanDetail = ref(null);
-// 琛ㄥ崟鏁版嵁
-const planForm = reactive({
- id: '',
- title: '',
- description: '',
- level: 'personal',
- period: 'week',
- startDate: '',
- endDate: '',
- assignee: '',
- priority: 'medium',
- tags: [],
- status: '',
- progress: 0
-})
+ // 琛ㄥ崟鏁版嵁
+ const planForm = reactive({
+ id: "",
+ title: "",
+ description: "",
+ level: "personal",
+ period: "week",
+ startDate: "",
+ endDate: "",
+ assignee: "",
+ priority: "medium",
+ tags: [],
+ status: "",
+ progress: 0,
+ });
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const planRules = {
- title: [{ required: true, message: '璇疯緭鍏ヨ鍒掓爣棰�', trigger: 'blur' }],
- description: [{ required: true, message: '璇疯緭鍏ヨ鍒掓弿杩�', trigger: 'blur' }],
- level: [{ required: true, message: '璇烽�夋嫨璁″垝绾у埆', trigger: 'change' }],
- period: [{ required: true, message: '璇烽�夋嫨鏃堕棿鍛ㄦ湡', trigger: 'change' }],
- startDate: [{ required: true, message: '璇烽�夋嫨寮�濮嬫椂闂�', trigger: 'change' }],
- endDate: [{ required: true, message: '璇烽�夋嫨缁撴潫鏃堕棿', trigger: 'change' }],
- assignee: [{ required: true, message: '璇疯緭鍏ヨ礋璐ｄ汉', trigger: 'blur' }],
- priority: [{ required: true, message: '璇烽�夋嫨浼樺厛绾�', trigger: 'change' }]
-}
-const departments = ["浜у搧", "鍒嗘瀽", "璋冪爺",'鎶�鏈�', '鏋舵瀯', '璁捐','甯傚満', '鎺ㄥ箍', '钀ラ攢'];
-// 姒傝鏁版嵁
-const overviewData = reactive({
- personal: { total: 0, completion: 0 },
- group: { total: 0, completion: 0 },
- department: { total: 0, completion: 0 },
- company: { total: 0, completion: 0 }
-})
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const planRules = {
+ title: [{ required: true, message: "璇疯緭鍏ヨ鍒掓爣棰�", trigger: "blur" }],
+ description: [{ required: true, message: "璇疯緭鍏ヨ鍒掓弿杩�", trigger: "blur" }],
+ level: [{ required: true, message: "璇烽�夋嫨璁″垝绾у埆", trigger: "change" }],
+ period: [{ required: true, message: "璇烽�夋嫨鏃堕棿鍛ㄦ湡", trigger: "change" }],
+ startDate: [{ required: true, message: "璇烽�夋嫨寮�濮嬫椂闂�", trigger: "change" }],
+ endDate: [{ required: true, message: "璇烽�夋嫨缁撴潫鏃堕棿", trigger: "change" }],
+ assignee: [{ required: true, message: "璇疯緭鍏ヨ礋璐ｄ汉", trigger: "blur" }],
+ priority: [{ required: true, message: "璇烽�夋嫨浼樺厛绾�", trigger: "change" }],
+ };
+ const departments = [
+ "浜у搧",
+ "鍒嗘瀽",
+ "璋冪爺",
+ "鎶�鏈�",
+ "鏋舵瀯",
+ "璁捐",
+ "甯傚満",
+ "鎺ㄥ箍",
+ "钀ラ攢",
+ ];
+ // 姒傝鏁版嵁
+ const overviewData = reactive({
+ personal: { total: 0, completion: 0 },
+ group: { total: 0, completion: 0 },
+ department: { total: 0, completion: 0 },
+ company: { total: 0, completion: 0 },
+ });
-// 璁″垝鍒楄〃鏁版嵁
-const planList = ref([])
+ // 璁″垝鍒楄〃鏁版嵁
+ const planList = ref([]);
-// 璁＄畻灞炴��
-const datePickerType = computed(() => {
- switch (currentPeriod.value) {
- case 'week':
- return 'week'
- case 'month':
- return 'month'
- case 'year':
- return 'year'
- default:
- return 'date'
- }
-})
+ // 璁＄畻灞炴��
+ const datePickerType = computed(() => {
+ switch (currentPeriod.value) {
+ case "week":
+ return "week";
+ case "month":
+ return "month";
+ case "year":
+ return "year";
+ default:
+ return "date";
+ }
+ });
-// 鏂规硶
-const handleLevelChange = (value) => {
- console.log('璁″垝绾у埆鍙樻洿:', value)
- getPlanList()
- // 杩欓噷鍙互鏍规嵁绾у埆绛涢�夋暟鎹�
-}
+ // 鏂规硶
+ const handleLevelChange = value => {
+ console.log("璁″垝绾у埆鍙樻洿:", value);
+ getPlanList();
+ // 杩欓噷鍙互鏍规嵁绾у埆绛涢�夋暟鎹�
+ };
-const handlePeriodChange = (value) => {
- console.log('鏃堕棿鍛ㄦ湡鍙樻洿:', value)
- getPlanList()
- // 杩欓噷鍙互鏍规嵁鍛ㄦ湡绛涢�夋暟鎹�
-}
+ const handlePeriodChange = value => {
+ console.log("鏃堕棿鍛ㄦ湡鍙樻洿:", value);
+ getPlanList();
+ // 杩欓噷鍙互鏍规嵁鍛ㄦ湡绛涢�夋暟鎹�
+ };
-const handleDateChange = (value) => {
- console.log('鏃ユ湡鍙樻洿:', value)
- getPlanList()
- // 杩欓噷鍙互鏍规嵁鏃ユ湡绛涢�夋暟鎹�
-}
+ const handleDateChange = value => {
+ console.log("鏃ユ湡鍙樻洿:", value);
+ getPlanList();
+ // 杩欓噷鍙互鏍规嵁鏃ユ湡绛涢�夋暟鎹�
+ };
-const handleAddPlan = () => {
- operationType.value = 'add'
- dialogTitle.value = '鏂板璁″垝'
- planDialogVisible.value = true
- // 閲嶇疆琛ㄥ崟
- Object.keys(planForm).forEach(key => {
- planForm[key] = ''
- })
- planForm.level = 'personal'
- planForm.period = 'week'
- planForm.priority = 'medium'
- planForm.status = 'not_started'
- planForm.progress = 0
-}
+ const handleAddPlan = () => {
+ operationType.value = "add";
+ dialogTitle.value = "鏂板璁″垝";
+ planDialogVisible.value = true;
+ // 閲嶇疆琛ㄥ崟
+ Object.keys(planForm).forEach(key => {
+ planForm[key] = "";
+ });
+ planForm.level = "personal";
+ planForm.period = "week";
+ planForm.priority = "medium";
+ planForm.status = "not_started";
+ planForm.progress = 0;
+ };
-const handleEditPlan = (plan) => {
- operationType.value = 'edit'
- dialogTitle.value = '缂栬緫璁″垝'
- planDialogVisible.value = true
- Object.assign(planForm, plan)
- // // 濉厖琛ㄥ崟鏁版嵁
- // Object.keys(planForm).forEach(key => {
- // if (key === 'tags') {
- // planForm[key] = plan[key].join(', ')
- // } else {
- // planForm[key] = plan[key]
- // }
- // })
-}
+ const handleEditPlan = plan => {
+ operationType.value = "edit";
+ dialogTitle.value = "缂栬緫璁″垝";
+ planDialogVisible.value = true;
+ Object.assign(planForm, plan);
+ // // 濉厖琛ㄥ崟鏁版嵁
+ // Object.keys(planForm).forEach(key => {
+ // if (key === 'tags') {
+ // planForm[key] = plan[key].join(', ')
+ // } else {
+ // planForm[key] = plan[key]
+ // }
+ // })
+ };
-const handleViewDetail = (plan) => {
- currentPlanDetail.value = plan
- showPlanDetailDialog.value = true
- // ElMessage.info(`鏌ョ湅璁″垝璇︽儏: ${plan.title}`)
-}
+ const handleViewDetail = plan => {
+ currentPlanDetail.value = plan;
+ showPlanDetailDialog.value = true;
+ // ElMessage.info(`鏌ョ湅璁″垝璇︽儏: ${plan.title}`)
+ };
-const handleMoreAction = async(plan,command) => {
- let ids = [];
- ids.push(plan.id);
- console.log("ids",ids)
- switch (command) {
- case 'share':
- ElMessage.success('璁″垝宸插叡浜�')
- break
- case 'copy':
- const knowledgeText = `
- 璁″垝鏍囬锛�${plan.title}
- 璁″垝鎻忚堪锛�${plan.description}
- 璁″垝绾у埆锛�${getCurrentLevelText(plan.level)}
- 鏃堕棿鍛ㄦ湡锛�${getCurrentPeriodText(plan.period)}
- 寮�濮嬫椂闂达細${plan.startDate}
- 缁撴潫鏃堕棿锛�${plan.endDate}
- 璐熻矗浜猴細${plan.assignee}
- 浼樺厛绾э細${getPriorityText(plan.priority)}
- 鏍囩锛�${plan.tags.join(', ')}
- 鐘舵�侊細${getStatusText(plan.status)}
- 杩涘害锛�${plan.progress}%
- `.trim();
+ const handleMoreAction = async (plan, command) => {
+ let ids = [];
+ ids.push(plan.id);
+ console.log("ids", ids);
+ switch (command) {
+ case "share":
+ ElMessage.success("璁″垝宸插叡浜�");
+ break;
+ case "copy":
+ const knowledgeText = `
+ 璁″垝鏍囬锛�${plan.title}
+ 璁″垝鎻忚堪锛�${plan.description}
+ 璁″垝绾у埆锛�${getCurrentLevelText(plan.level)}
+ 鏃堕棿鍛ㄦ湡锛�${getCurrentPeriodText(plan.period)}
+ 寮�濮嬫椂闂达細${plan.startDate}
+ 缁撴潫鏃堕棿锛�${plan.endDate}
+ 璐熻矗浜猴細${plan.assignee}
+ 浼樺厛绾э細${getPriorityText(plan.priority)}
+ 鏍囩锛�${plan.tags.join(", ")}
+ 鐘舵�侊細${getStatusText(plan.status)}
+ 杩涘害锛�${plan.progress}%
+ `.trim();
// 澶嶅埗鍒板壀璐存澘
- navigator.clipboard.writeText(knowledgeText).then(() => {
- ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
- }).catch(() => {
- ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+ navigator.clipboard
+ .writeText(knowledgeText)
+ .then(() => {
+ ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
+ })
+ .catch(() => {
+ ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+ });
+ // ElMessage.success('璁″垝宸插鍒�')
+ break;
+ case "delete":
+ ElMessageBox.confirm("纭畾瑕佸垹闄よ繖涓鍒掑悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ delDutyPlan(ids).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("璁″垝宸插垹闄�");
+ ids.value = [];
+ getPlanList();
+ }
+ });
});
- // ElMessage.success('璁″垝宸插鍒�')
- break
- case 'delete':
- ElMessageBox.confirm('纭畾瑕佸垹闄よ繖涓鍒掑悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
-
- delDutyPlan(ids).then(res => {
+ break;
+ }
+ };
+ //
+ const handleSavePlan = async () => {
+ try {
+ await planFormRef.value.validate();
+ if (operationType.value === "add") {
+ addDutyPlan(planForm).then(res => {
if (res.code === 200) {
- ElMessage.success('璁″垝宸插垹闄�')
- ids.value = [];
- getPlanList()
+ ElMessage.success("璁″垝淇濆瓨鎴愬姛");
+ planDialogVisible.value = false;
}
- })
- })
- break
- }
-}
-//
-const handleSavePlan = async () => {
- try {
- await planFormRef.value.validate()
- if (operationType.value === 'add') {
- addDutyPlan(planForm).then(res => {
- if (res.code === 200) {
- ElMessage.success('璁″垝淇濆瓨鎴愬姛')
- planDialogVisible.value = false
- }
- getPlanList()
- })
- } else {
-
- updateDutyPlan(planForm).then(res => {
- if (res.code === 200) {
- ElMessage.success('璁″垝淇濆瓨鎴愬姛')
- planDialogVisible.value = false
- }
- getPlanList()
- })
+ getPlanList();
+ });
+ } else {
+ updateDutyPlan(planForm).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("璁″垝淇濆瓨鎴愬姛");
+ planDialogVisible.value = false;
+ }
+ getPlanList();
+ });
+ }
+ } catch (error) {
+ console.log("琛ㄥ崟楠岃瘉澶辫触:", error);
}
- } catch (error) {
- console.log('琛ㄥ崟楠岃瘉澶辫触:', error)
- }
-}
+ };
-const handleDialogClose = () => {
- planFormRef.value?.resetFields()
-}
+ const handleDialogClose = () => {
+ planFormRef.value?.resetFields();
+ };
-const handleRefresh = () => {
- getPlanList()
- // ElMessage.success('鏁版嵁宸插埛鏂�')
-}
+ const handleRefresh = () => {
+ getPlanList();
+ // ElMessage.success('鏁版嵁宸插埛鏂�')
+ };
-const handleFilter = () => {
- ElMessage.info('鎵撳紑绛涢�夐潰鏉�')
-}
+ const handleFilter = () => {
+ ElMessage.info("鎵撳紑绛涢�夐潰鏉�");
+ };
-const handleExport = () => {
- ElMessageBox.confirm("鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- })
- .then(() => {
- // exportDutyPlan().then(res => {
-
- // })
- proxy.download("/dutyPlan/export", {}, "璁″垝绠＄悊.xlsx");
+ const handleExport = () => {
+ ElMessageBox.confirm("鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
})
- .catch(() => {
- proxy.$modal.msg("宸插彇娑�");
- });
-};
-const handleShare = () => {
- ElMessage.success('璁″垝宸插叡浜�')
-}
+ .then(() => {
+ // exportDutyPlan().then(res => {
-const getCurrentLevelText = () => {
- const levelMap = {
- personal: '涓汉璁″垝',
- group: '灏忕粍璁″垝',
- department: '閮ㄩ棬璁″垝',
- company: '鍏徃璁″垝'
- }
- return levelMap[currentLevel.value] || '涓汉璁″垝'
-}
-
-const getCurrentPeriodText = () => {
- const periodMap = {
- week: '鍛ㄨ鍒�',
- month: '鏈堣鍒�',
- year: '骞磋鍒�'
- }
- return periodMap[currentPeriod.value] || '鍛ㄨ鍒�'
-}
-
-const getPriorityType = (priority) => {
- const typeMap = {
- high: 'danger',
- medium: 'warning',
- low: 'info'
- }
- return typeMap[priority] || 'info'
-}
-
-const getPriorityText = (priority) => {
- const textMap = {
- high: '楂�',
- medium: '涓�',
- low: '浣�'
- }
- return textMap[priority] || '涓�'
-}
-
-const getStatusText = (status) => {
- const statusMap = {
- not_started: '鏈紑濮�',
- in_progress: '杩涜涓�',
- completed: '宸插畬鎴�',
- paused: '宸叉殏鍋�'
- }
- return statusMap[status] || '鏈煡'
-}
-
-const getProgressColor = (progress) => {
- if (progress >= 80) return '#67C23A'
- if (progress >= 50) return '#E6A23C'
- return '#F56C6C'
-}
-//鑾峰彇鏁版嵁鍒楄〃
-const getPlanList = async () => {
- const params = {
- level: currentLevel.value,
- period: currentPeriod.value,
- queryDate:currentDate.value
- }
- listDutyPlan(params).then(res => {
- if (res.code === 200) {
- planList.value = res.data.records
- }
- }).catch(err => {
- console.log(err)
- })
-}
-//鑾峰彇鏁版嵁
-const getPlanNum = async () => {
- NumDutyPlan().then(res => {
- if (res.code === 200) {
- // console.log(res.data)
- //璁茬粨鏋滈噷闈㈢殑鏁版嵁鏍规嵁level 璧嬪�肩粰overviewData
- res.data.forEach(item => {
- overviewData[item.level].total = item.num
- overviewData[item.level].completion = item.completion
+ // })
+ proxy.download("/dutyPlan/export", {}, "璁″垝绠＄悊.xlsx");
})
-
- }
- }).catch(err => {
- console.log(err)
- })
-}
+ .catch(() => {
+ proxy.$modal.msg("宸插彇娑�");
+ });
+ };
+ const handleShare = () => {
+ ElMessage.success("璁″垝宸插叡浜�");
+ };
-onMounted(() => {
- getPlanList()
- getPlanNum()
- console.log('澶氱骇璁″垝妯℃澘椤甸潰宸插姞杞�')
-})
+ const getCurrentLevelText = () => {
+ const levelMap = {
+ personal: "涓汉璁″垝",
+ group: "灏忕粍璁″垝",
+ department: "閮ㄩ棬璁″垝",
+ company: "鍏徃璁″垝",
+ };
+ return levelMap[currentLevel.value] || "涓汉璁″垝";
+ };
+
+ const getCurrentPeriodText = () => {
+ const periodMap = {
+ week: "鍛ㄨ鍒�",
+ month: "鏈堣鍒�",
+ year: "骞磋鍒�",
+ };
+ return periodMap[currentPeriod.value] || "鍛ㄨ鍒�";
+ };
+
+ const getPriorityType = priority => {
+ const typeMap = {
+ high: "danger",
+ medium: "warning",
+ low: "info",
+ };
+ return typeMap[priority] || "info";
+ };
+
+ const getPriorityText = priority => {
+ const textMap = {
+ high: "楂�",
+ medium: "涓�",
+ low: "浣�",
+ };
+ return textMap[priority] || "涓�";
+ };
+
+ const getStatusText = status => {
+ const statusMap = {
+ not_started: "鏈紑濮�",
+ in_progress: "杩涜涓�",
+ completed: "宸插畬鎴�",
+ paused: "宸叉殏鍋�",
+ };
+ return statusMap[status] || "鏈煡";
+ };
+
+ const getProgressColor = progress => {
+ if (progress >= 80) return "#67C23A";
+ if (progress >= 50) return "#E6A23C";
+ return "#F56C6C";
+ };
+ //鑾峰彇鏁版嵁鍒楄〃
+ const getPlanList = async () => {
+ const params = {
+ level: currentLevel.value,
+ period: currentPeriod.value,
+ queryDate: currentDate.value,
+ };
+ listDutyPlan(params)
+ .then(res => {
+ if (res.code === 200) {
+ planList.value = res.data.records;
+ }
+ })
+ .catch(err => {
+ console.log(err);
+ });
+ };
+ //鑾峰彇鏁版嵁
+ const getPlanNum = async () => {
+ NumDutyPlan()
+ .then(res => {
+ if (res.code === 200) {
+ // console.log(res.data)
+ //璁茬粨鏋滈噷闈㈢殑鏁版嵁鏍规嵁level 璧嬪�肩粰overviewData
+ res.data.forEach(item => {
+ overviewData[item.level].total = item.num;
+ overviewData[item.level].completion = item.completion;
+ });
+ }
+ })
+ .catch(err => {
+ console.log(err);
+ });
+ };
+
+ onMounted(() => {
+ getPlanList();
+ getPlanNum();
+ console.log("澶氱骇璁″垝妯℃澘椤甸潰宸插姞杞�");
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
- background-color: #f5f5f5;
- min-height: 100vh;
-}
+ .app-container {
+ padding: 20px;
+ background-color: #f5f5f5;
+ min-height: 100vh;
+ }
-.header-actions {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 20px;
- background: white;
- padding: 20px;
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-.left-actions {
- display: flex;
- align-items: center;
-}
-
-.right-actions {
- display: flex;
- gap: 10px;
-}
-
-.overview-cards {
- margin-bottom: 20px;
-}
-
-.overview-card {
- height: 120px;
-}
-
-.card-content {
- display: flex;
- align-items: center;
- height: 100%;
-}
-
-.card-icon {
- width: 60px;
- height: 60px;
- border-radius: 50%;
- display: flex;
- align-items: center;
- justify-content: center;
- margin-right: 15px;
- font-size: 24px;
- color: white;
-}
-
-.card-icon.personal {
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-}
-
-.card-icon.group {
- background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
-}
-
-.card-icon.department {
- background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
-}
-
-.card-icon.company {
- background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
-}
-
-.card-info {
- flex: 1;
-}
-
-.card-title {
- font-size: 14px;
- color: #666;
- margin-bottom: 5px;
-}
-
-.card-number {
- font-size: 24px;
- font-weight: bold;
- color: #333;
- margin-bottom: 10px;
-}
-
-.card-progress {
- width: 100%;
-}
-
-.plan-content {
- background: white;
- border-radius: 8px;
- overflow: hidden;
-}
-
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-weight: bold;
- color: #333;
-}
-
-.header-actions {
- display: flex;
- gap: 10px;
-}
-
-.plan-list {
- padding: 20px 0;
-}
-
-.plan-item {
- border: 1px solid #e4e7ed;
- border-radius: 8px;
- margin-bottom: 15px;
- padding: 20px;
- transition: all 0.3s ease;
-}
-
-.plan-item:hover {
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
- transform: translateY(-2px);
-}
-
-.plan-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 15px;
-}
-
-.plan-title {
- display: flex;
- align-items: center;
- gap: 10px;
-}
-
-.title-text {
- font-size: 16px;
- font-weight: bold;
- color: #333;
-}
-
-.plan-actions {
- display: flex;
- gap: 10px;
-}
-
-.plan-content {
- margin-bottom: 15px;
-}
-
-.plan-description {
- color: #666;
- margin-bottom: 15px;
- line-height: 1.6;
-}
-
-.plan-meta {
- display: flex;
- flex-wrap: wrap;
- gap: 20px;
- margin-bottom: 15px;
-}
-
-.meta-item {
- display: flex;
- align-items: center;
- gap: 5px;
- color: #666;
- font-size: 14px;
-}
-
-.plan-progress {
- margin-bottom: 15px;
-}
-
-.plan-tags {
- display: flex;
- flex-wrap: wrap;
- gap: 5px;
-}
-
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
-
-/* 鍝嶅簲寮忚璁� */
-@media (max-width: 768px) {
.header-actions {
- flex-direction: column;
- gap: 15px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ background: white;
+ padding: 20px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
-
+
.left-actions {
- flex-wrap: wrap;
+ display: flex;
+ align-items: center;
+ }
+
+ .right-actions {
+ display: flex;
gap: 10px;
}
-
- .plan-meta {
- flex-direction: column;
+
+ .overview-cards {
+ margin-bottom: 20px;
+ }
+
+ .overview-card {
+ height: 120px;
+ }
+
+ .card-content {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ }
+
+ .card-icon {
+ width: 60px;
+ height: 60px;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-right: 15px;
+ font-size: 24px;
+ color: white;
+ }
+
+ .card-icon.personal {
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+ }
+
+ .card-icon.group {
+ background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
+ }
+
+ .card-icon.department {
+ background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
+ }
+
+ .card-icon.company {
+ background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
+ }
+
+ .card-info {
+ flex: 1;
+ }
+
+ .card-title {
+ font-size: 14px;
+ color: #666;
+ margin-bottom: 5px;
+ }
+
+ .card-number {
+ font-size: 24px;
+ font-weight: bold;
+ color: #333;
+ margin-bottom: 10px;
+ }
+
+ .card-progress {
+ width: 100%;
+ }
+
+ .plan-content {
+ background: white;
+ border-radius: 8px;
+ overflow: hidden;
+ }
+
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-weight: bold;
+ color: #333;
+ }
+
+ .header-actions {
+ display: flex;
gap: 10px;
}
-
+
+ .plan-list {
+ padding: 20px 0;
+ }
+
+ .plan-item {
+ border: 1px solid #e4e7ed;
+ border-radius: 8px;
+ margin-bottom: 15px;
+ padding: 20px;
+ transition: all 0.3s ease;
+ }
+
+ .plan-item:hover {
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+ transform: translateY(-2px);
+ }
+
.plan-header {
- flex-direction: column;
- align-items: flex-start;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 15px;
+ }
+
+ .plan-title {
+ display: flex;
+ align-items: center;
gap: 10px;
}
-}
+
+ .title-text {
+ font-size: 16px;
+ font-weight: bold;
+ color: #333;
+ }
+
+ .plan-actions {
+ display: flex;
+ gap: 10px;
+ }
+
+ .plan-content {
+ margin-bottom: 15px;
+ }
+
+ .plan-description {
+ color: #666;
+ margin-bottom: 15px;
+ line-height: 1.6;
+ }
+
+ .plan-meta {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 20px;
+ margin-bottom: 15px;
+ }
+
+ .meta-item {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ color: #666;
+ font-size: 14px;
+ }
+
+ .plan-progress {
+ margin-bottom: 15px;
+ }
+
+ .plan-tags {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 5px;
+ }
+
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
+
+ /* 鍝嶅簲寮忚璁� */
+ @media (max-width: 768px) {
+ .header-actions {
+ flex-direction: column;
+ gap: 15px;
+ }
+
+ .left-actions {
+ flex-wrap: wrap;
+ gap: 10px;
+ }
+
+ .plan-meta {
+ flex-direction: column;
+ gap: 10px;
+ }
+
+ .plan-header {
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 10px;
+ }
+ }
</style>
diff --git a/src/views/collaborativeApproval/rpaManagement/index.vue b/src/views/collaborativeApproval/rpaManagement/index.vue
index 9e5b504..8e1a148 100644
--- a/src/views/collaborativeApproval/rpaManagement/index.vue
+++ b/src/views/collaborativeApproval/rpaManagement/index.vue
@@ -3,85 +3,93 @@
<div class="search_form">
<div>
<span class="search_title">绋嬪簭鍚嶏細</span>
- <el-input
- v-model="searchForm.programName"
- style="width: 240px"
- placeholder="璇疯緭鍏ョ▼搴忓悕鎼滅储"
- @change="handleQuery"
- clearable
- :prefix-icon="Search"
- />
+ <el-input v-model="searchForm.programName"
+ style="width: 240px"
+ placeholder="璇疯緭鍏ョ▼搴忓悕鎼滅储"
+ @change="handleQuery"
+ clearable
+ :prefix-icon="Search" />
<span class="search_title ml10">鎵ц鐘舵�侊細</span>
- <el-select v-model="searchForm.status" clearable @change="handleQuery" style="width: 240px">
- <el-option label="杩愯涓�" :value="'running'" />
- <el-option label="宸插仠姝�" :value="'stopped'" />
- <el-option label="寮傚父" :value="'error'" />
+ <el-select v-model="searchForm.status"
+ clearable
+ @change="handleQuery"
+ style="width: 240px">
+ <el-option label="杩愯涓�"
+ :value="'running'" />
+ <el-option label="宸插仠姝�"
+ :value="'stopped'" />
+ <el-option label="寮傚父"
+ :value="'error'" />
</el-select>
- <el-button type="primary" @click="handleQuery" style="margin-left: 10px">
+ <el-button type="primary"
+ @click="handleQuery"
+ style="margin-left: 10px">
鎼滅储
</el-button>
</div>
<div>
- <el-button @click="handleExport" style="margin-right: 10px">瀵煎嚭</el-button>
- <el-button type="primary" @click="openForm('add')">鏂板</el-button>
- <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+ <el-button @click="handleExport"
+ style="margin-right: 10px">瀵煎嚭</el-button>
+ <el-button type="primary"
+ @click="openForm('add')">鏂板</el-button>
+ <el-button type="danger"
+ plain
+ @click="handleDelete">鍒犻櫎</el-button>
</div>
</div>
<div class="table_list">
- <PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :page="page"
- :isSelection="true"
- @selection-change="handleSelectionChange"
- :tableLoading="tableLoading"
- @pagination="pagination"
- :total="page.total"
- ></PIMTable>
+ <PIMTable rowKey="id"
+ :column="tableColumn"
+ :tableData="tableData"
+ :page="page"
+ :isSelection="true"
+ @selection-change="handleSelectionChange"
+ :tableLoading="tableLoading"
+ @pagination="pagination"
+ :total="page.total"></PIMTable>
</div>
-
<!-- RPA琛ㄥ崟寮圭獥 -->
- <el-dialog
- v-model="dialogVisible"
- :title="dialogTitle"
- width="500px"
- :close-on-click-modal="false"
- >
- <el-form
- ref="formRef"
- :model="form"
- :rules="rules"
- label-width="100px"
- >
- <el-form-item label="绋嬪簭鍚�" prop="programName">
- <el-input
- v-model="form.programName"
- placeholder="璇疯緭鍏ョ▼搴忓悕"
- clearable
- />
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="500px"
+ :close-on-click-modal="false">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="100px">
+ <el-form-item label="绋嬪簭鍚�"
+ prop="programName">
+ <el-input v-model="form.programName"
+ placeholder="璇疯緭鍏ョ▼搴忓悕"
+ clearable />
</el-form-item>
- <el-form-item label="鎵ц鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鎵ц鐘舵��" style="width: 100%">
- <el-option label="杩愯涓�" value="running" />
- <el-option label="宸插仠姝�" value="stopped" />
- <el-option label="寮傚父" value="error" />
+ <el-form-item label="鎵ц鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鎵ц鐘舵��"
+ style="width: 100%">
+ <el-option label="杩愯涓�"
+ value="running" />
+ <el-option label="宸插仠姝�"
+ value="stopped" />
+ <el-option label="寮傚父"
+ value="error" />
</el-select>
</el-form-item>
- <el-form-item label="鎻忚堪" prop="description">
- <el-input
- v-model="form.description"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏PA绋嬪簭鎻忚堪"
- clearable
- />
+ <el-form-item label="鎻忚堪"
+ prop="description">
+ <el-input v-model="form.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏PA绋嬪簭鎻忚堪"
+ clearable />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</span>
</template>
</el-dialog>
@@ -89,278 +97,304 @@
</template>
<script setup>
-import { Search } from "@element-plus/icons-vue";
-import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
-import PIMTable from "@/components/PIMTable/PIMTable.vue";
-import {listRpa, addRpa, updateRpa, delRpa, delRpaBatch} from "@/api/collaborativeApproval/rpaManagement.js";
-// 鍝嶅簲寮忔暟鎹�
-const data = reactive({
- searchForm: {
- programName: "",
- status: "",
- },
- form: {
- programName: "",
- status: "",
- description: ""
- },
- dialogVisible: false,
- dialogTitle: "",
- dialogType: "add",
- tableLoading: false,
- page: {
- current: 1,
- size: 20,
- total: 0,
- },
- tableData: [],
-});
-
-const { searchForm, form, dialogVisible, dialogTitle, dialogType, selectedIds, tableLoading, page, tableData } = toRefs(data);
-
-// 琛ㄥ崟寮曠敤
-const formRef = ref();
-// 閫夋嫨鐨勮鏁版嵁
-const selectedRows = ref([]);
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- programName: [
- { required: true, message: "璇疯緭鍏ョ▼搴忓悕", trigger: "blur" }
- ],
- status: [
- { required: true, message: "璇烽�夋嫨鎵ц鐘舵��", trigger: "change" }
- ]
-};
-
-// 琛ㄦ牸鍒楅厤缃�
-const tableColumn = ref([
- {
- label: "绋嬪簭鍚�",
- prop: "programName",
- // width: 200,
- },
- {
- label: "鎵ц鐘舵��",
- prop: "status",
- dataType: "tag",
- // width: 120,
- formatData: (params) => {
- const statusMap = {
- running: "杩愯涓�",
- stopped: "宸插仠姝�",
- error: "寮傚父"
- };
- return statusMap[params] || params;
+ import { Search } from "@element-plus/icons-vue";
+ import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import PIMTable from "@/components/PIMTable/PIMTable.vue";
+ import {
+ listRpa,
+ addRpa,
+ updateRpa,
+ delRpa,
+ delRpaBatch,
+ } from "@/api/collaborativeApproval/rpaManagement.js";
+ // 鍝嶅簲寮忔暟鎹�
+ const data = reactive({
+ searchForm: {
+ programName: "",
+ status: "",
},
- formatType: (params) => {
- const typeMap = {
- running: "success",
- stopped: "info",
- error: "danger"
- };
- return typeMap[params] || "info";
- }
- },
- {
- label: "鎻忚堪",
- prop: "description",
- // width: 300,
- showOverflowTooltip: true,
- },
- {
- label: "鍒涘缓鏃堕棿",
- prop: "createTime",
- // width: 180,
- },
- {
- dataType: "action",
- label: "鎿嶄綔",
- align: "center",
- fixed: "right",
- width: 150,
- operation: [
- {
- name: "缂栬緫",
- type: "text",
- clickFun: (row) => {
- openForm("edit", row);
- }
+ form: {
+ programName: "",
+ status: "",
+ description: "",
+ },
+ dialogVisible: false,
+ dialogTitle: "",
+ dialogType: "add",
+ tableLoading: false,
+ page: {
+ current: 1,
+ size: 20,
+ total: 0,
+ },
+ tableData: [],
+ });
+
+ const {
+ searchForm,
+ form,
+ dialogVisible,
+ dialogTitle,
+ dialogType,
+ selectedIds,
+ tableLoading,
+ page,
+ tableData,
+ } = toRefs(data);
+
+ // 琛ㄥ崟寮曠敤
+ const formRef = ref();
+ // 閫夋嫨鐨勮鏁版嵁
+ const selectedRows = ref([]);
+
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ programName: [{ required: true, message: "璇疯緭鍏ョ▼搴忓悕", trigger: "blur" }],
+ status: [{ required: true, message: "璇烽�夋嫨鎵ц鐘舵��", trigger: "change" }],
+ };
+
+ // 琛ㄦ牸鍒楅厤缃�
+ const tableColumn = ref([
+ {
+ label: "绋嬪簭鍚�",
+ prop: "programName",
+ // width: 200,
+ },
+ {
+ label: "鎵ц鐘舵��",
+ prop: "status",
+ dataType: "tag",
+ // width: 120,
+ formatData: params => {
+ const statusMap = {
+ running: "杩愯涓�",
+ stopped: "宸插仠姝�",
+ error: "寮傚父",
+ };
+ return statusMap[params] || params;
},
- // {
- // name: "寮�濮�",
- // type: "text",
- // clickFun: (row) => {
- // handleStart(row);
- // },
- // disabled: (row) => row.status !== 'stopped'
- // },
- // {
- // name: "鍋滄",
- // type: "text",
- // clickFun: (row) => {
- // handleStop(row);
- // },
- // disabled: (row) => row.status === 'stopped'
- // }
- ]
- }
-]);
-
-
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- getList();
-});
-
-// 鏌ヨ鏁版嵁
-const handleQuery = () => {
- // page.value.current = 1;
- getList();
-};
-
-const getList = () => {
- tableLoading.value = true;
- listRpa({...page.value, ...searchForm.value})
- .then(res => {
- tableLoading.value = false;
- tableData.value = res.data.records
- page.total = res.data.total;
- }).catch(err => {
- tableLoading.value = false;
- })
-};
-
-// 鍒嗛〉澶勭悊
-const pagination = (obj) => {
- page.value.current = obj.page;
- page.value.size = obj.limit;
- handleQuery();
-};
-
-// 閫夋嫨鍙樺寲澶勭悊
-const handleSelectionChange = (selection) => {
- selectedRows.value = selection;
-};
-
-// 鎵撳紑琛ㄥ崟
-const openForm = (type, row) => {
- dialogType.value = type;
- dialogVisible.value = true;
-
- if (type === "add") {
- dialogTitle.value = "娣诲姞RPA";
- } else {
- dialogTitle.value = "缂栬緫RPA";
- form.value = { ...row };
- }
-};
-
-// 鎻愪氦琛ㄥ崟
-const submitForm = async () => {
- if (!formRef.value) return;
-
- try {
- await formRef.value.validate();
-
- if (dialogType.value === "add") {
- // 娣诲姞鏂癛PA
- addRpa({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("娣诲姞鎴愬姛");
- form.value = {
- programName: "",
- status: "",
- description: ""
+ formatType: params => {
+ const typeMap = {
+ running: "success",
+ stopped: "info",
+ error: "danger",
+ };
+ return typeMap[params] || "info";
+ },
+ },
+ {
+ label: "鎻忚堪",
+ prop: "description",
+ // width: 300,
+ showOverflowTooltip: true,
+ },
+ {
+ label: "鍒涘缓鏃堕棿",
+ prop: "createTime",
+ // width: 180,
+ },
+ {
+ dataType: "action",
+ label: "鎿嶄綔",
+ align: "center",
+ fixed: "right",
+ width: 150,
+ operation: [
+ {
+ name: "缂栬緫",
+ type: "text",
+ clickFun: row => {
+ openForm("edit", row);
},
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
+ },
+ // {
+ // name: "寮�濮�",
+ // type: "text",
+ // clickFun: (row) => {
+ // handleStart(row);
+ // },
+ // disabled: (row) => row.status !== 'stopped'
+ // },
+ // {
+ // name: "鍋滄",
+ // type: "text",
+ // clickFun: (row) => {
+ // handleStop(row);
+ // },
+ // disabled: (row) => row.status === 'stopped'
+ // }
+ ],
+ },
+ ]);
+
+ // 鐢熷懡鍛ㄦ湡
+ onMounted(() => {
+ getList();
+ });
+
+ // 鏌ヨ鏁版嵁
+ const handleQuery = () => {
+ // page.value.current = 1;
+ getList();
+ };
+
+ const getList = () => {
+ tableLoading.value = true;
+ listRpa({ ...page.value, ...searchForm.value })
+ .then(res => {
+ tableLoading.value = false;
+ tableData.value = res.data.records;
+ page.total = res.data.total;
})
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
+
+ // 鍒嗛〉澶勭悊
+ const pagination = obj => {
+ page.value.current = obj.page;
+ page.value.size = obj.limit;
+ handleQuery();
+ };
+
+ // 閫夋嫨鍙樺寲澶勭悊
+ const handleSelectionChange = selection => {
+ selectedRows.value = selection;
+ };
+
+ // 鎵撳紑琛ㄥ崟
+ const openForm = (type, row) => {
+ dialogType.value = type;
+ dialogVisible.value = true;
+
+ if (type === "add") {
+ dialogTitle.value = "娣诲姞RPA";
} else {
- // 缂栬緫RPA
- updateRpa({...form.value}).then(res => {
- if(res.code == 200){
- ElMessage.success("鏇存柊鎴愬姛");
- dialogVisible.value = false;
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
+ dialogTitle.value = "缂栬緫RPA";
+ form.value = { ...row };
}
- } catch (error) {
- console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
- }
-};
+ };
-// 寮�濮婻PA
-const handleStart = (row) => {
- ElMessageBox.confirm(`纭畾瑕佸惎鍔≧PA绋嬪簭"${row.programName}"鍚楋紵`, "鎻愮ず", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
- row.status = "running";
- ElMessage.success("RPA鍚姩鎴愬姛");
- getList();
- }).catch(() => {
- // 鐢ㄦ埛鍙栨秷
- });
-};
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ if (!formRef.value) return;
-// 鍋滄RPA
-const handleStop = (row) => {
- ElMessageBox.confirm(`纭畾瑕佸仠姝PA绋嬪簭"${row.programName}"鍚楋紵`, "鎻愮ず", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
- row.status = "stopped";
- ElMessage.success("RPA鍋滄鎴愬姛");
- getList();
- }).catch(() => {
- // 鐢ㄦ埛鍙栨秷
- });
-};
+ try {
+ await formRef.value.validate();
-// 鍒犻櫎RPA
-const handleDelete = () => {
- let ids = [];
- if (selectedRows.value.length > 0) {
- ids = selectedRows.value.map((item) => item.id);
- } else {
- proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
- return;
- }
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎鎻愮ず", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- })
- .then(() => {
- delRpa(ids).then((res) => {
- if(res.code == 200){
- ElMessage.success("鍒犻櫎鎴愬姛");
- getList();
- }
- }).catch(err => {
- ElMessage.error(err.msg);
- })
- })
- .catch(() => {
- proxy.$modal.msg("宸插彇娑�");
- });
-};
+ if (dialogType.value === "add") {
+ // 娣诲姞鏂癛PA
+ addRpa({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("娣诲姞鎴愬姛");
+ (form.value = {
+ programName: "",
+ status: "",
+ description: "",
+ }),
+ (dialogVisible.value = false);
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } else {
+ // 缂栬緫RPA
+ updateRpa({ ...form.value })
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏇存柊鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ }
+ } catch (error) {
+ console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
+ }
+ };
-// 瀵煎嚭鍔熻兘
-const { proxy } = getCurrentInstance()
-const handleExport = () => {
- proxy.download('/rpaProcessAutomation/export', { ...searchForm.value }, 'RPA绠＄悊.xlsx')
-}
+ // 寮�濮婻PA
+ const handleStart = row => {
+ ElMessageBox.confirm(`纭畾瑕佸惎鍔≧PA绋嬪簭"${row.programName}"鍚楋紵`, "鎻愮ず", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ row.status = "running";
+ ElMessage.success("RPA鍚姩鎴愬姛");
+ getList();
+ })
+ .catch(() => {
+ // 鐢ㄦ埛鍙栨秷
+ });
+ };
+
+ // 鍋滄RPA
+ const handleStop = row => {
+ ElMessageBox.confirm(`纭畾瑕佸仠姝PA绋嬪簭"${row.programName}"鍚楋紵`, "鎻愮ず", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ row.status = "stopped";
+ ElMessage.success("RPA鍋滄鎴愬姛");
+ getList();
+ })
+ .catch(() => {
+ // 鐢ㄦ埛鍙栨秷
+ });
+ };
+
+ // 鍒犻櫎RPA
+ const handleDelete = () => {
+ let ids = [];
+ if (selectedRows.value.length > 0) {
+ ids = selectedRows.value.map(item => item.id);
+ } else {
+ proxy.$modal.msgWarning("璇烽�夋嫨鏁版嵁");
+ return;
+ }
+ ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎鎻愮ず", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ delRpa(ids)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ })
+ .catch(() => {
+ proxy.$modal.msg("宸插彇娑�");
+ });
+ };
+
+ // 瀵煎嚭鍔熻兘
+ const { proxy } = getCurrentInstance();
+ const handleExport = () => {
+ proxy.download(
+ "/rpaProcessAutomation/export",
+ { ...searchForm.value },
+ "RPA绠＄悊.xlsx"
+ );
+ };
</script>
<style scoped></style>
diff --git a/src/views/collaborativeApproval/rulesRegulationsManagement/index.vue b/src/views/collaborativeApproval/rulesRegulationsManagement/index.vue
index 4063295..e158b79 100644
--- a/src/views/collaborativeApproval/rulesRegulationsManagement/index.vue
+++ b/src/views/collaborativeApproval/rulesRegulationsManagement/index.vue
@@ -1,70 +1,108 @@
<template>
<div class="app-container">
-
- <!-- 瑙勭珷鍒跺害绠＄悊-->
- <el-card class="box-card">
- <template #header>
- <div class="card-header">
- <span>瑙勭珷鍒跺害鍙戝竷</span>
- </div>
+ <!-- 瑙勭珷鍒跺害绠＄悊-->
+ <el-card class="box-card">
+ <template #header>
+ <div class="card-header">
+ <span>瑙勭珷鍒跺害鍙戝竷</span>
+ </div>
+ </template>
+ <div class="tab-content">
+ <el-row :gutter="20"
+ class="mb-20">
+ <span class="ml-10">鍒跺害鏍囬锛�</span>
+ <el-col :span="6">
+ <el-input v-model="regulationSearchForm.title"
+ placeholder="璇疯緭鍏ュ埗搴︽爣棰�"
+ clearable />
+ </el-col>
+ <span class="search_title">鍒跺害鍒嗙被锛�</span>
+ <el-col :span="4">
+ <el-select v-model="regulationSearchForm.category"
+ placeholder="鍒跺害鍒嗙被"
+ clearable>
+ <el-option label="浜轰簨鍒跺害"
+ value="hr" />
+ <el-option label="璐㈠姟鍒跺害"
+ value="finance" />
+ <el-option label="瀹夊叏鍒跺害"
+ value="safety" />
+ <el-option label="鎶�鏈埗搴�"
+ value="tech" />
+ </el-select>
+ </el-col>
+ <el-col :span="8">
+ <el-button type="primary"
+ @click="searchRegulations">鎼滅储</el-button>
+ <el-button @click="resetRegulationSearch">閲嶇疆</el-button>
+ <el-button @click="handleExport">瀵煎嚭</el-button>
+ <el-button type="success"
+ @click="handleAdd">
+ 鍙戝竷鍒跺害
+ </el-button>
+ </el-col>
+ </el-row>
+ <el-table :data="regulations"
+ border
+ v-loading="tableLoading"
+ style="width: 100%">
+ <el-table-column prop="regulationNum"
+ label="鍒跺害缂栧彿"
+ width="120" />
+ <el-table-column prop="title"
+ label="鍒跺害鏍囬"
+ min-width="150" />
+ <el-table-column prop="category"
+ label="鍒嗙被"
+ width="120">
+ <template #default="scope">
+ <el-tag>{{ getCategoryText(scope.row.category) }}</el-tag>
</template>
- <div class="tab-content">
- <el-row :gutter="20" class="mb-20">
- <span class="ml-10">鍒跺害鏍囬锛�</span>
- <el-col :span="6">
- <el-input v-model="regulationSearchForm.title" placeholder="璇疯緭鍏ュ埗搴︽爣棰�" clearable />
- </el-col>
- <span class="search_title">鍒跺害鍒嗙被锛�</span>
- <el-col :span="4">
- <el-select v-model="regulationSearchForm.category" placeholder="鍒跺害鍒嗙被" clearable>
- <el-option label="浜轰簨鍒跺害" value="hr" />
- <el-option label="璐㈠姟鍒跺害" value="finance" />
- <el-option label="瀹夊叏鍒跺害" value="safety" />
- <el-option label="鎶�鏈埗搴�" value="tech" />
- </el-select>
- </el-col>
- <el-col :span="8">
- <el-button type="primary" @click="searchRegulations">鎼滅储</el-button>
- <el-button @click="resetRegulationSearch">閲嶇疆</el-button>
- <el-button @click="handleExport">瀵煎嚭</el-button>
- <el-button type="success" @click="handleAdd">
- 鍙戝竷鍒跺害
- </el-button>
- </el-col>
- </el-row>
-
- <el-table :data="regulations" border v-loading="tableLoading" style="width: 100%">
- <el-table-column prop="regulationNum" label="鍒跺害缂栧彿" width="120" />
- <el-table-column prop="title" label="鍒跺害鏍囬" min-width="150" />
- <el-table-column prop="category" label="鍒嗙被" width="120">
- <template #default="scope">
- <el-tag>{{ getCategoryText(scope.row.category) }}</el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="version" label="鐗堟湰" width="120" />
- <el-table-column prop="createUserName" label="鍙戝竷浜�" width="120" />
- <el-table-column prop="createTime" label="鍙戝竷鏃堕棿" width="180" />
- <el-table-column prop="status" label="鐘舵��" width="100">
- <template #default="scope">
- <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
- {{ scope.row.status === 'active' ? '鐢熸晥涓�' : '宸插簾姝�' }}
- </el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="readCount" label="宸茶浜烘暟" width="100" />
- <el-table-column label="鎿嶄綔" width="250" fixed="right">
- <template #default="scope">
- <el-button link @click="viewRegulation(scope.row)">鏌ョ湅</el-button>
- <el-button link type="primary" @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button link type="danger" @click="repealEdit(scope.row)">搴熷純</el-button>
- <el-button link type="success" @click="viewVersionHistory(scope.row)">鐗堟湰鍘嗗彶</el-button>
- <el-button link type="warning" @click="viewReadStatus(scope.row)">闃呰鐘舵��</el-button>
- </template>
- </el-table-column>
- </el-table>
- </div>
- </el-card>
-
+ </el-table-column>
+ <el-table-column prop="version"
+ label="鐗堟湰"
+ width="120" />
+ <el-table-column prop="createUserName"
+ label="鍙戝竷浜�"
+ width="120" />
+ <el-table-column prop="createTime"
+ label="鍙戝竷鏃堕棿"
+ width="180" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
+ <template #default="scope">
+ <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
+ {{ scope.row.status === 'active' ? '鐢熸晥涓�' : '宸插簾姝�' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="readCount"
+ label="宸茶浜烘暟"
+ width="100" />
+ <el-table-column label="鎿嶄綔"
+ width="250"
+ fixed="right">
+ <template #default="scope">
+ <el-button link
+ @click="viewRegulation(scope.row)">鏌ョ湅</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)">缂栬緫</el-button>
+ <el-button link
+ type="danger"
+ @click="repealEdit(scope.row)">搴熷純</el-button>
+ <el-button link
+ type="success"
+ @click="viewVersionHistory(scope.row)">鐗堟湰鍘嗗彶</el-button>
+ <el-button link
+ type="warning"
+ @click="viewReadStatus(scope.row)">闃呰鐘舵��</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-card>
<!-- 鐢ㄥ嵃鐢宠瀵硅瘽妗� -->
<!-- <el-dialog v-model="showSealApplyDialog" title="鐢宠鐢ㄥ嵃" width="600px">
<el-form :model="sealForm" :rules="sealRules" ref="sealFormRef" label-width="100px">
@@ -100,35 +138,62 @@
</span>
</template>
</el-dialog> -->
-
<!-- 瑙勭珷鍒跺害鍙戝竷瀵硅瘽妗� -->
- <el-dialog v-model="showRegulationDialog" :title="operationType === 'add' ? '鍙戝竷鍒跺害' : '缂栬緫鍒跺害'" width="800px">
- <el-form :model="regulationForm" :rules="regulationRules" ref="regulationFormRef" label-width="100px">
- <el-form-item label="鍒跺害缂栧彿" prop="regulationNum">
- <el-input v-model="regulationForm.regulationNum" placeholder="璇疯緭鍏ュ埗搴︾紪鍙�" />
+ <el-dialog v-model="showRegulationDialog"
+ :title="operationType === 'add' ? '鍙戝竷鍒跺害' : '缂栬緫鍒跺害'"
+ width="800px">
+ <el-form :model="regulationForm"
+ :rules="regulationRules"
+ ref="regulationFormRef"
+ label-width="100px">
+ <el-form-item label="鍒跺害缂栧彿"
+ prop="regulationNum">
+ <el-input v-model="regulationForm.regulationNum"
+ placeholder="璇疯緭鍏ュ埗搴︾紪鍙�" />
</el-form-item>
- <el-form-item label="鍒跺害鏍囬" prop="title">
- <el-input v-model="regulationForm.title" placeholder="璇疯緭鍏ュ埗搴︽爣棰�" />
+ <el-form-item label="鍒跺害鏍囬"
+ prop="title">
+ <el-input v-model="regulationForm.title"
+ placeholder="璇疯緭鍏ュ埗搴︽爣棰�" />
</el-form-item>
- <el-form-item label="鍒跺害鍒嗙被" prop="category">
- <el-select v-model="regulationForm.category" placeholder="璇烽�夋嫨鍒跺害鍒嗙被" style="width: 100%">
- <el-option label="浜轰簨鍒跺害" value="hr" />
- <el-option label="璐㈠姟鍒跺害" value="finance" />
- <el-option label="瀹夊叏鍒跺害" value="safety" />
- <el-option label="鎶�鏈埗搴�" value="tech" />
+ <el-form-item label="鍒跺害鍒嗙被"
+ prop="category">
+ <el-select v-model="regulationForm.category"
+ placeholder="璇烽�夋嫨鍒跺害鍒嗙被"
+ style="width: 100%">
+ <el-option label="浜轰簨鍒跺害"
+ value="hr" />
+ <el-option label="璐㈠姟鍒跺害"
+ value="finance" />
+ <el-option label="瀹夊叏鍒跺害"
+ value="safety" />
+ <el-option label="鎶�鏈埗搴�"
+ value="tech" />
</el-select>
</el-form-item>
- <el-form-item label="鍒跺害鍐呭" prop="content">
- <el-input v-model="regulationForm.content" type="textarea" :rows="10" placeholder="璇疯緭鍏ュ埗搴﹁缁嗗唴瀹�" />
+ <el-form-item label="鍒跺害鍐呭"
+ prop="content">
+ <el-input v-model="regulationForm.content"
+ type="textarea"
+ :rows="10"
+ placeholder="璇疯緭鍏ュ埗搴﹁缁嗗唴瀹�" />
</el-form-item>
- <el-form-item label="鍒跺害鐗堟湰" prop="version">
- <el-input v-model="regulationForm.version" placeholder="璇疯緭鍏ュ埗搴︾増鏈�" />
+ <el-form-item label="鍒跺害鐗堟湰"
+ prop="version">
+ <el-input v-model="regulationForm.version"
+ placeholder="璇疯緭鍏ュ埗搴︾増鏈�" />
</el-form-item>
- <el-form-item label="鐢熸晥鏃堕棿" prop="effectiveTime">
- <el-date-picker v-model="regulationForm.effectiveTime" type="datetime" format="YYYY-MM-DD HH:mm:ss"
- value-format="YYYY-MM-DD HH:mm:ss" placeholder="閫夋嫨鐢熸晥鏃堕棿" style="width: 100%" />
+ <el-form-item label="鐢熸晥鏃堕棿"
+ prop="effectiveTime">
+ <el-date-picker v-model="regulationForm.effectiveTime"
+ type="datetime"
+ format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ placeholder="閫夋嫨鐢熸晥鏃堕棿"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="閫傜敤鑼冨洿" prop="scope">
+ <el-form-item label="閫傜敤鑼冨洿"
+ prop="scope">
<el-checkbox-group v-model="regulationForm.scope">
<el-checkbox label="all">鍏ㄤ綋鍛樺伐</el-checkbox>
<el-checkbox label="manager">绠＄悊灞�</el-checkbox>
@@ -137,19 +202,20 @@
<el-checkbox label="tech">鎶�鏈儴闂�</el-checkbox>
</el-checkbox-group>
</el-form-item>
- <el-form-item label="鏄惁闇�瑕佺‘璁�" prop="requireConfirm">
+ <el-form-item label="鏄惁闇�瑕佺‘璁�"
+ prop="requireConfirm">
<el-switch v-model="regulationForm.requireConfirm" />
<span class="ml-10">寮�鍚悗鍛樺伐闇�瑕侀槄璇荤‘璁�</span>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitRegulation">鍙戝竷鍒跺害</el-button>
<el-button @click="showRegulationDialog = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitRegulation">鍙戝竷鍒跺害</el-button>
</span>
</template>
</el-dialog>
-
<!-- 鐢ㄥ嵃璇︽儏瀵硅瘽妗� -->
<!-- <el-dialog v-model="showSealDetailDialog" title="鐢ㄥ嵃鐢宠璇︽儏" width="700px">
<div v-if="currentSealDetail" class="mb10">
@@ -169,11 +235,13 @@
</el-descriptions>
</div>
</el-dialog> -->
-
<!-- 瑙勭珷鍒跺害璇︽儏瀵硅瘽妗� -->
- <el-dialog v-model="showRegulationDetailDialog" title="瑙勭珷鍒跺害璇︽儏" width="800px">
+ <el-dialog v-model="showRegulationDetailDialog"
+ title="瑙勭珷鍒跺害璇︽儏"
+ width="800px">
<div v-if="currentRegulationDetail">
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="鍒跺害缂栧彿">{{ currentRegulationDetail.id }}</el-descriptions-item>
<el-descriptions-item label="鍒跺害鏍囬">{{ currentRegulationDetail.title }}</el-descriptions-item>
<el-descriptions-item label="鍒嗙被">{{ getCategoryText(currentRegulationDetail.category) }}</el-descriptions-item>
@@ -186,19 +254,30 @@
<div class="regulation-content">{{ currentRegulationDetail.content }}</div>
</div>
<!-- 濡傛灉tableData>0 鏄剧ず -->
- <div style="margin: 10px 0;" v-if="tableData && tableData.length > 0" >
- <el-button type="success" @click="resetForm(currentRegulationDetail)">纭鏌ョ湅</el-button>
+ <div style="margin: 10px 0;"
+ v-if="tableData && tableData.length > 0">
+ <el-button type="success"
+ @click="resetForm(currentRegulationDetail)">纭鏌ョ湅</el-button>
</div>
</div>
</el-dialog>
-
<!-- 鐗堟湰鍘嗗彶瀵硅瘽妗� -->
- <el-dialog v-model="showVersionHistoryDialog" title="鐗堟湰鍘嗗彶" width="800px">
- <el-table :data="versionHistory" style="width: 100%;margin-bottom: 10px">
- <el-table-column prop="version" label="鐗堟湰鍙�" width="100" />
- <el-table-column prop="updateTime" label="鏇存柊鏃堕棿" width="180" />
- <el-table-column prop="createUserName" label="鏇存柊浜�" width="120" />
- <el-table-column prop="changeLog" label="鍙樻洿璇存槑">
+ <el-dialog v-model="showVersionHistoryDialog"
+ title="鐗堟湰鍘嗗彶"
+ width="800px">
+ <el-table :data="versionHistory"
+ style="width: 100%;margin-bottom: 10px">
+ <el-table-column prop="version"
+ label="鐗堟湰鍙�"
+ width="100" />
+ <el-table-column prop="updateTime"
+ label="鏇存柊鏃堕棿"
+ width="180" />
+ <el-table-column prop="createUserName"
+ label="鏇存柊浜�"
+ width="120" />
+ <el-table-column prop="changeLog"
+ label="鍙樻洿璇存槑">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鐢熸晥涓�' : '宸插簾姝�' }}
@@ -207,15 +286,27 @@
</el-table-column>
</el-table>
</el-dialog>
-
<!-- 闃呰鐘舵�佸璇濇 -->
- <el-dialog v-model="showReadStatusDialog" title="闃呰鐘舵��" width="800px">
- <el-table :data="readStatusList" style="width: 100%;margin-bottom: 10px">
- <el-table-column prop="employee" label="鍛樺伐濮撳悕" width="120" />
- <el-table-column prop="department" label="鎵�灞為儴闂�" width="150" />
- <el-table-column prop="createTime" label="闃呰鏃堕棿" width="180" />
- <el-table-column prop="confirmTime" label="纭鏃堕棿" width="180" />
- <el-table-column prop="status" label="鐘舵��" width="100">
+ <el-dialog v-model="showReadStatusDialog"
+ title="闃呰鐘舵��"
+ width="800px">
+ <el-table :data="readStatusList"
+ style="width: 100%;margin-bottom: 10px">
+ <el-table-column prop="employee"
+ label="鍛樺伐濮撳悕"
+ width="120" />
+ <el-table-column prop="department"
+ label="鎵�灞為儴闂�"
+ width="150" />
+ <el-table-column prop="createTime"
+ label="闃呰鏃堕棿"
+ width="180" />
+ <el-table-column prop="confirmTime"
+ label="纭鏃堕棿"
+ width="180" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="scope.row.status === 'confirmed' ? 'success' : 'warning'">
{{ scope.row.status === 'confirmed' ? '宸茬‘璁�' : '鏈‘璁�' }}
@@ -228,526 +319,564 @@
</template>
<script setup>
-import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus } from '@element-plus/icons-vue'
-import { listSealApplication, addSealApplication, updateSealApplication,listRuleManagement,addRuleManagement,updateRuleManagement,delRuleManagement,getReadingStatusByRuleId,getReadingStatusList,addReadingStatus,updateReadingStatus } from '@/api/collaborativeApproval/sealManagement.js'
-import { el } from 'element-plus/es/locales.mjs'
-import { getUserProfile } from '@/api/system/user.js'
-import {staffJoinDel, staffJoinListPage} from "@/api/personnelManagement/onboarding.js";
-import useUserStore from '@/store/modules/user'
-import { userLoginFacotryList } from "@/api/system/user.js"
+ import { ref, reactive, onMounted, getCurrentInstance } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus } from "@element-plus/icons-vue";
+ import {
+ listSealApplication,
+ addSealApplication,
+ updateSealApplication,
+ listRuleManagement,
+ addRuleManagement,
+ updateRuleManagement,
+ delRuleManagement,
+ getReadingStatusByRuleId,
+ getReadingStatusList,
+ addReadingStatus,
+ updateReadingStatus,
+ } from "@/api/collaborativeApproval/sealManagement.js";
+ import { el } from "element-plus/es/locales.mjs";
+ import { getUserProfile } from "@/api/system/user.js";
+ import {
+ staffJoinDel,
+ staffJoinListPage,
+ } from "@/api/personnelManagement/onboarding.js";
+ import useUserStore from "@/store/modules/user";
+ import { userLoginFacotryList } from "@/api/system/user.js";
-// 鍝嶅簲寮忔暟鎹�
-const currentUser = ref(null)
-const activeTab = ref('seal')
-const operationType = ref('add')
-const tableData = ref([])
-// 鐢ㄥ嵃鐢宠鐩稿叧
-const userStore = useUserStore()
-const showSealApplyDialog = ref(false)
-const tableLoading = ref(false)
-const showSealDetailDialog = ref(false)
-const currentSealDetail = ref(null)
-const sealFormRef = ref()
-const sealForm = reactive({
- applicationNum: '',
- title: '',
- sealType: '',
- reason: '',
- urgency: 'normal',
- status: 'pending'
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const currentUser = ref(null);
+ const activeTab = ref("seal");
+ const operationType = ref("add");
+ const tableData = ref([]);
+ // 鐢ㄥ嵃鐢宠鐩稿叧
+ const userStore = useUserStore();
+ const showSealApplyDialog = ref(false);
+ const tableLoading = ref(false);
+ const showSealDetailDialog = ref(false);
+ const currentSealDetail = ref(null);
+ const sealFormRef = ref();
+ const sealForm = reactive({
+ applicationNum: "",
+ title: "",
+ sealType: "",
+ reason: "",
+ urgency: "normal",
+ status: "pending",
+ });
-const sealRules = {
- applicationNum: [{ required: true, message: '璇疯緭鍏ョ敵璇风紪鍙�', trigger: 'blur' }],
- title: [{ required: true, message: '璇疯緭鍏ョ敵璇锋爣棰�', trigger: 'blur' }],
- sealType: [{ required: true, message: '璇烽�夋嫨鐢ㄥ嵃绫诲瀷', trigger: 'change' }],
- reason: [{ required: true, message: '璇疯緭鍏ョ敵璇峰師鍥�', trigger: 'blur' }]
-}
+ const sealRules = {
+ applicationNum: [
+ { required: true, message: "璇疯緭鍏ョ敵璇风紪鍙�", trigger: "blur" },
+ ],
+ title: [{ required: true, message: "璇疯緭鍏ョ敵璇锋爣棰�", trigger: "blur" }],
+ sealType: [{ required: true, message: "璇烽�夋嫨鐢ㄥ嵃绫诲瀷", trigger: "change" }],
+ reason: [{ required: true, message: "璇疯緭鍏ョ敵璇峰師鍥�", trigger: "blur" }],
+ };
-const sealSearchForm = reactive({
- title: '',
- status: ''
-})
-// 鍒嗛〉鍙傛暟
-const page = reactive({
- current: 1,
- size: 10,
- total: 0
-})
-// 瑙勭珷鍒跺害鐩稿叧
-const showRegulationDialog = ref(false)
-const showRegulationDetailDialog = ref(false)
-const showVersionHistoryDialog = ref(false)
-const showReadStatusDialog = ref(false)
-const currentRegulationDetail = ref(null)
-const regulationFormRef = ref()
-const regulationForm = reactive({
- id: '',
- regulationNum: '',
- title: '',
- category: '',
- content: '',
- version: '',
- status: 'active',
- readCount: 0,
- effectiveTime: '',
- scope: [],
- requireConfirm: false
-})
+ const sealSearchForm = reactive({
+ title: "",
+ status: "",
+ });
+ // 鍒嗛〉鍙傛暟
+ const page = reactive({
+ current: 1,
+ size: 10,
+ total: 0,
+ });
+ // 瑙勭珷鍒跺害鐩稿叧
+ const showRegulationDialog = ref(false);
+ const showRegulationDetailDialog = ref(false);
+ const showVersionHistoryDialog = ref(false);
+ const showReadStatusDialog = ref(false);
+ const currentRegulationDetail = ref(null);
+ const regulationFormRef = ref();
+ const regulationForm = reactive({
+ id: "",
+ regulationNum: "",
+ title: "",
+ category: "",
+ content: "",
+ version: "",
+ status: "active",
+ readCount: 0,
+ effectiveTime: "",
+ scope: [],
+ requireConfirm: false,
+ });
-const readStatus = ref({
- id: '',
- ruleId: '',
- employee: '',
- department: '',
- createTime: '',
- confirmTime: '',
- status: 'unconfirmed'
-})
+ const readStatus = ref({
+ id: "",
+ ruleId: "",
+ employee: "",
+ department: "",
+ createTime: "",
+ confirmTime: "",
+ status: "unconfirmed",
+ });
-const regulationRules = {
- title: [{ required: true, message: '璇疯緭鍏ュ埗搴︽爣棰�', trigger: 'blur' }],
- category: [{ required: true, message: '璇烽�夋嫨鍒跺害鍒嗙被', trigger: 'change' }],
- content: [{ required: true, message: '璇疯緭鍏ュ埗搴﹀唴瀹�', trigger: 'blur' }],
- effectiveTime: [{ required: true, message: '璇烽�夋嫨鐢熸晥鏃堕棿', trigger: 'change' }],
- scope: [{ required: true, message: '璇烽�夋嫨閫傜敤鑼冨洿', trigger: 'change' }]
-}
+ const regulationRules = {
+ title: [{ required: true, message: "璇疯緭鍏ュ埗搴︽爣棰�", trigger: "blur" }],
+ category: [{ required: true, message: "璇烽�夋嫨鍒跺害鍒嗙被", trigger: "change" }],
+ content: [{ required: true, message: "璇疯緭鍏ュ埗搴﹀唴瀹�", trigger: "blur" }],
+ effectiveTime: [
+ { required: true, message: "璇烽�夋嫨鐢熸晥鏃堕棿", trigger: "change" },
+ ],
+ scope: [{ required: true, message: "璇烽�夋嫨閫傜敤鑼冨洿", trigger: "change" }],
+ };
-const regulationSearchForm = reactive({
- title: '',
- category: ''
-})
+ const regulationSearchForm = reactive({
+ title: "",
+ category: "",
+ });
-// 鍋囨暟鎹�
-const sealApplications = ref([])
+ // 鍋囨暟鎹�
+ const sealApplications = ref([]);
-const regulations = ref([])
+ const regulations = ref([]);
-const versionHistory = ref([])
+ const versionHistory = ref([]);
-const readStatusList = ref([])
+ const readStatusList = ref([]);
// { employee: '闄堝織寮�', department: '閿�鍞儴', readTime: '2025-01-11 10:30:00', confirmTime: '2025-01-11 10:35:00', status: 'confirmed' },
// { employee: '鍒橀泤濠�', department: '鎶�鏈儴', readTime: '2025-01-11 14:20:00', confirmTime: '', status: 'unconfirmed' },
// { employee: '鐜嬪缓鍥�', department: '璐㈠姟閮�', readTime: '2025-01-12 09:15:00', confirmTime: '2025-01-12 09:20:00', status: 'confirmed' }
-// 鐢ㄥ嵃鐢宠鐘舵��
-const getStatusType = (status) => {
- const statusMap = {
- pending: 'warning',
- approved: 'success',
- rejected: 'danger'
- }
- return statusMap[status] || 'info'
-}
-// 鍒跺害鐘舵��
-const getStatusText = (status) => {
- const statusMap = {
- pending: '寰呭鎵�',
- approved: '宸查�氳繃',
- rejected: '宸叉嫆缁�'
- }
- return statusMap[status] || '鏈煡'
-}
-// 鐢ㄥ嵃绫诲瀷
-const getSealTypeText = (sealType) => {
- const sealTypeMap = {
- official: '鍏珷',
- contract: '鍚堝悓涓撶敤绔�',
- finance: '璐㈠姟涓撶敤绔�',
- tegal: '鎶�鏈笓鐢ㄧ珷'
- }
- return sealTypeMap[sealType] || '鏈煡'
-}
-// 鍒跺害鍒嗙被
-const getCategoryText = (category) => {
- const categoryMap = {
- hr: '浜轰簨鍒跺害',
- finance: '璐㈠姟鍒跺害',
- safety: '瀹夊叏鍒跺害',
- tech: '鎶�鏈埗搴�'
- }
- return categoryMap[category] || '鏈煡'
-}
-// 鎼滅储鍗扮珷鐢宠
-const searchSealApplications = () => {
- page.current=1
- getSealApplicationList()
+ // 鐢ㄥ嵃鐢宠鐘舵��
+ const getStatusType = status => {
+ const statusMap = {
+ pending: "warning",
+ approved: "success",
+ rejected: "danger",
+ };
+ return statusMap[status] || "info";
+ };
+ // 鍒跺害鐘舵��
+ const getStatusText = status => {
+ const statusMap = {
+ pending: "寰呭鎵�",
+ approved: "宸查�氳繃",
+ rejected: "宸叉嫆缁�",
+ };
+ return statusMap[status] || "鏈煡";
+ };
+ // 鐢ㄥ嵃绫诲瀷
+ const getSealTypeText = sealType => {
+ const sealTypeMap = {
+ official: "鍏珷",
+ contract: "鍚堝悓涓撶敤绔�",
+ finance: "璐㈠姟涓撶敤绔�",
+ tegal: "鎶�鏈笓鐢ㄧ珷",
+ };
+ return sealTypeMap[sealType] || "鏈煡";
+ };
+ // 鍒跺害鍒嗙被
+ const getCategoryText = category => {
+ const categoryMap = {
+ hr: "浜轰簨鍒跺害",
+ finance: "璐㈠姟鍒跺害",
+ safety: "瀹夊叏鍒跺害",
+ tech: "鎶�鏈埗搴�",
+ };
+ return categoryMap[category] || "鏈煡";
+ };
+ // 鎼滅储鍗扮珷鐢宠
+ const searchSealApplications = () => {
+ page.current = 1;
+ getSealApplicationList();
- // ElMessage.success('鎼滅储瀹屾垚')
-}
-// 閲嶇疆鍗扮珷鐢宠鎼滅储
-const resetSealSearch = () => {
- sealSearchForm.title = ''
- sealSearchForm.status = ''
- searchSealApplications()
-}
-// 鎼滅储鍒跺害
-const searchRegulations = () => {
- page.current=1
- getRegulationList()
-}
-// 閲嶇疆鍒跺害鎼滅储
-const resetRegulationSearch = () => {
- regulationSearchForm.title = ''
- regulationSearchForm.category = ''
- searchRegulations()
-}
-// 鎻愪氦鐢ㄥ嵃鐢宠
-const submitSealApplication = async () => {
- try {
- await sealFormRef.value.validate()
- addSealApplication(sealForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鐢宠鎻愪氦鎴愬姛')
- showSealApplyDialog.value = false
- getSealApplicationList()
- Object.assign(sealForm, {
- applicationNum: '',
- title: '',
- sealType: '',
- reason: '',
- urgency: 'normal',
- status: 'pending'
+ // ElMessage.success('鎼滅储瀹屾垚')
+ };
+ // 閲嶇疆鍗扮珷鐢宠鎼滅储
+ const resetSealSearch = () => {
+ sealSearchForm.title = "";
+ sealSearchForm.status = "";
+ searchSealApplications();
+ };
+ // 鎼滅储鍒跺害
+ const searchRegulations = () => {
+ page.current = 1;
+ getRegulationList();
+ };
+ // 閲嶇疆鍒跺害鎼滅储
+ const resetRegulationSearch = () => {
+ regulationSearchForm.title = "";
+ regulationSearchForm.category = "";
+ searchRegulations();
+ };
+ // 鎻愪氦鐢ㄥ嵃鐢宠
+ const submitSealApplication = async () => {
+ try {
+ await sealFormRef.value.validate();
+ addSealApplication(sealForm)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鐢宠鎻愪氦鎴愬姛");
+ showSealApplyDialog.value = false;
+ getSealApplicationList();
+ Object.assign(sealForm, {
+ applicationNum: "",
+ title: "",
+ sealType: "",
+ reason: "",
+ urgency: "normal",
+ status: "pending",
+ });
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } catch (error) {
+ ElMessage.error("璇峰畬鍠勭敵璇蜂俊鎭�");
+ }
+ };
+ // 鏂板
+ const handleAdd = () => {
+ operationType.value = "add";
+ resetRegulationForm();
+ showRegulationDialog.value = true;
+ };
+
+ // 缂栬緫
+ const handleEdit = row => {
+ operationType.value = "edit";
+ Object.assign(regulationForm, row);
+ showRegulationDialog.value = true;
+ };
+ // 搴熷純
+ const repealEdit = row => {
+ operationType.value = "edit";
+ Object.assign(regulationForm, row);
+ regulationForm.status = "repealed";
+ ElMessageBox.confirm("纭搴熷純璇ュ埗搴︼紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ updateRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害搴熷純鎴愬姛");
+ // showRegulationDialog.value = false
+ getRegulationList();
+ resetRegulationForm();
+ }
+ });
})
+ .catch(() => {
+ ElMessage({
+ type: "info",
+ message: "宸插彇娑堝簾寮�",
+ });
+ });
+ };
+ // 鍙戝竷鍒跺害
+ const submitRegulation = async () => {
+ try {
+ await regulationFormRef.value.validate();
+ if (operationType.value == "add") {
+ addRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害鍙戝竷鎴愬姛");
+ showRegulationDialog.value = false;
+ getRegulationList();
+ resetRegulationForm();
+ }
+ });
+ } else {
+ updateRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害缂栬緫鎴愬姛");
+ showRegulationDialog.value = false;
+ resetRegulationForm();
+ getRegulationList();
+ }
+ });
}
- }).catch(err => {
- ElMessage.error(err.msg)
- })
-
- } catch (error) {
- ElMessage.error('璇峰畬鍠勭敵璇蜂俊鎭�')
- }
-}
-// 鏂板
-const handleAdd = () => {
- operationType.value = 'add'
- resetRegulationForm()
- showRegulationDialog.value = true
-}
+ } catch (err) {
+ ElMessage.error(err.msg);
+ }
+ };
+ //閲嶇疆鍒跺害琛ㄥ崟
+ const resetRegulationForm = () => {
+ Object.assign(regulationForm, {
+ id: "",
+ regulationNum: "",
+ title: "",
+ category: "",
+ content: "",
+ version: "",
+ status: "active",
+ readCount: 0,
+ effectiveTime: "",
+ scope: [],
+ requireConfirm: false,
+ });
+ };
-// 缂栬緫
-const handleEdit = (row) => {
- operationType.value = 'edit'
- Object.assign(regulationForm, row)
- showRegulationDialog.value = true
-}
-// 搴熷純
-const repealEdit = (row) => {
- operationType.value = 'edit'
- Object.assign(regulationForm, row)
- regulationForm.status = 'repealed'
- ElMessageBox.confirm('纭搴熷純璇ュ埗搴︼紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- updateRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害搴熷純鎴愬姛')
- // showRegulationDialog.value = false
- getRegulationList()
- resetRegulationForm()
+ // 鏌ョ湅鐢ㄥ嵃鐢宠璇︽儏
+ const viewSealDetail = row => {
+ currentSealDetail.value = row;
+ showSealDetailDialog.value = true;
+ };
+ // 瀹℃壒鐢ㄥ嵃鐢宠
+ const approveSeal = row => {
+ console.log(row);
+ ElMessageBox.confirm("纭閫氳繃璇ョ敤鍗扮敵璇凤紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ row.status = "approved";
+ updateSealApplication(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("瀹℃壒閫氳繃");
+ }
+ });
+ });
+ };
+ // 鎷掔粷鐢ㄥ嵃鐢宠
+ const rejectSeal = row => {
+ ElMessageBox.prompt("璇疯緭鍏ユ嫆缁濆師鍥�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ inputPattern: /\S+/,
+ inputErrorMessage: "鎷掔粷鍘熷洜涓嶈兘涓虹┖",
+ }).then(({ value }) => {
+ row.status = "rejected";
+ updateSealApplication(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("瀹℃壒鎷掔粷");
+ }
+ });
+ ElMessage.success("宸叉嫆缁濈敵璇�");
+ });
+ };
+ // 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
+ const getList = () => {
+ tableLoading.value = true;
+ //鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
+ getUserProfile().then(res => {
+ if (res.code == 200) {
+ console.log(res.data.userName);
+ currentUser.value = res.data.userName;
}
- })
- }).catch(() => {
- ElMessage({
- type: 'info',
- message: '宸插彇娑堝簾寮�'
- })
- })
-}
-// 鍙戝竷鍒跺害
-const submitRegulation = async () => {
- try {
- await regulationFormRef.value.validate()
- if(operationType.value == 'add'){
- addRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害鍙戝竷鎴愬姛')
- showRegulationDialog.value = false
- getRegulationList()
- resetRegulationForm()
+ });
+ staffJoinListPage({ staffState: 1 })
+ .then(res => {
+ tableLoading.value = false;
+ // tableData.value = res.data.records
+ // //绛涢�夊嚭鍜宑urrentUser鍚屽悕鐨勪汉鍛�
+ tableData.value = res.data.records.filter(
+ item => item.staffName === currentUser.value
+ );
+ console.log("tableData", tableData.value);
+ page.total = res.data.total;
+
+ if (tableData.value.length == 0) {
+ ElMessage.error("褰撳墠鐢ㄦ埛鏈姞鍏ヤ换浣曢儴闂�");
}
})
- }else{
- updateRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害缂栬緫鎴愬姛')
- showRegulationDialog.value = false
- resetRegulationForm()
- getRegulationList()
- }})}
- }catch(err){
- ElMessage.error(err.msg)
- }
-}
-//閲嶇疆鍒跺害琛ㄥ崟
-const resetRegulationForm = () => {
- Object.assign(regulationForm, {
- id: '',
- regulationNum: '',
- title: '',
- category: '',
- content: '',
- version: '',
- status: 'active',
- readCount: 0,
- effectiveTime: '',
- scope: [],
- requireConfirm: false
-})
-}
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
-
-// 鏌ョ湅鐢ㄥ嵃鐢宠璇︽儏
-const viewSealDetail = (row) => {
- currentSealDetail.value = row
- showSealDetailDialog.value = true
-}
-// 瀹℃壒鐢ㄥ嵃鐢宠
-const approveSeal = (row) => {
- console.log(row)
- ElMessageBox.confirm('纭閫氳繃璇ョ敤鍗扮敵璇凤紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- row.status = 'approved'
- updateSealApplication(row).then(res => {
- if(res.code == 200){
- ElMessage.success('瀹℃壒閫氳繃')
+ // 鏌ョ湅鍒跺害鐗堟湰鍘嗗彶
+ const viewVersionHistory = row => {
+ showVersionHistoryDialog.value = true;
+ const params = {
+ category: row.category,
+ };
+ listRuleManagement(page, params).then(res => {
+ if (res.code == 200) {
+ versionHistory.value = res.data.records;
}
- })
- })
-}
-// 鎷掔粷鐢ㄥ嵃鐢宠
-const rejectSeal = (row) => {
- ElMessageBox.prompt('璇疯緭鍏ユ嫆缁濆師鍥�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- inputPattern: /\S+/,
- inputErrorMessage: '鎷掔粷鍘熷洜涓嶈兘涓虹┖'
- }).then(({ value }) => {
- row.status = 'rejected'
- updateSealApplication(row).then(res => {
- if(res.code == 200){
- ElMessage.success('瀹℃壒鎷掔粷')
- }
- })
- ElMessage.success('宸叉嫆缁濈敵璇�')
- })
-}
-// 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
-const getList = () => {
- tableLoading.value = true;
- //鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
- getUserProfile().then(res => {
- if(res.code == 200){
- console.log(res.data.userName)
- currentUser.value = res.data.userName
- }
- })
- staffJoinListPage({staffState: 1}).then(res => {
- tableLoading.value = false;
- // tableData.value = res.data.records
- // //绛涢�夊嚭鍜宑urrentUser鍚屽悕鐨勪汉鍛�
- tableData.value = res.data.records.filter(item => item.staffName === currentUser.value)
- console.log("tableData",tableData.value)
- page.total = res.data.total;
-
- if(tableData.value.length == 0){
- ElMessage.error('褰撳墠鐢ㄦ埛鏈姞鍏ヤ换浣曢儴闂�')
- }
- }).catch(err => {
- tableLoading.value = false;
- })
-
-
-};
-
-// 鏌ョ湅鍒跺害鐗堟湰鍘嗗彶
-const viewVersionHistory = (row) => {
- showVersionHistoryDialog.value = true
- const params = {
-
- category: row.category
- }
- listRuleManagement(page,params).then(res => {
- if(res.code == 200){
- versionHistory.value = res.data.records
- }
- })
-}
-// 鏌ョ湅鍒跺害璇︽儏
-const viewRegulation = (row) => {
- getList()
- currentRegulationDetail.value = row
- showRegulationDetailDialog.value = true
- getReadingStatusByRuleId(row.id).then(res => {
- if(res.code == 200){
- readStatusList.value = res.data
- if(readStatusList.value.length==0 && tableData.value.length>0){
+ });
+ };
+ // 鏌ョ湅鍒跺害璇︽儏
+ const viewRegulation = row => {
+ getList();
+ currentRegulationDetail.value = row;
+ showRegulationDetailDialog.value = true;
+ getReadingStatusByRuleId(row.id).then(res => {
+ if (res.code == 200) {
+ readStatusList.value = res.data;
+ if (readStatusList.value.length == 0 && tableData.value.length > 0) {
const params = {
- ruleId: row.id,
- employee: tableData.value[0].staffName,
- department: tableData.value[0].postJob,
- status: 'unconfirmed'
+ ruleId: row.id,
+ employee: tableData.value[0].staffName,
+ department: tableData.value[0].postJob,
+ status: "unconfirmed",
+ };
+ addReadingStatus(params).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害闃呰鎴愬姛");
+ }
+ });
}
- addReadingStatus(params).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害闃呰鎴愬姛')
- }
- })
}
- }
- })
-
-}
-// 鏌ョ湅鍒跺害闃呰鐘舵��
-const viewReadStatus = (row) => {
- showReadStatusDialog.value = true
- //鏌ョ湅闃呰鐘舵�佸垪琛�
- getReadingStatusByRuleId(row.id).then(res => {
- if(res.code == 200){
- readStatusList.value = res.data
- }
- })
-}
-
-//纭鏌ョ湅
-const resetForm = (row) => {
- console.log("row",row)
- row.readCount = row.readCount + 1
-
- updateRuleManagement(row).then(res => {
- if(res.code == 200){
- ElMessage.success('鏌ョ湅鏁伴噺淇敼鎴愬姛')
- //淇敼闃呰鐘舵��
- //鏍规嵁鍒跺害id鍜屽綋鍓嶇櫥褰曠殑鍛樺伐寰楀埌闃呰鐘舵��
- // let item = readStatusList.value.filter(item => item.employee == tableData.value[0].staffName )
- // if(item.length>0){
- // item[0].status = 'confirmed',
- // item[0].confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
- // }
- // 绛涢�夊綋鍓嶅憳宸ュ搴旇鍒跺害鐨勯槄璇荤姸鎬佽褰�
- let statusItem = readStatusList.value.find(item => item.employee === tableData.value[0].staffName && item.ruleId === row.id);
-
- if (statusItem) {
- // 濡傛灉鎵惧埌璁板綍锛屾洿鏂扮姸鎬佸拰纭鏃堕棿
- statusItem.status = 'confirmed';
- // 鏍煎紡鍖栨椂闂翠负"YYYY-MM-DD HH:mm:ss"鏍煎紡
- const now = new Date();
- statusItem.confirmTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}:${String(now.getSeconds()).padStart(2, '0')}`;
- // statusItem.confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
-
- updateReadingStatus(statusItem).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害闃呰鐘舵�佷慨鏀规垚鍔�')
- }
- })
+ });
+ };
+ // 鏌ョ湅鍒跺害闃呰鐘舵��
+ const viewReadStatus = row => {
+ showReadStatusDialog.value = true;
+ //鏌ョ湅闃呰鐘舵�佸垪琛�
+ getReadingStatusByRuleId(row.id).then(res => {
+ if (res.code == 200) {
+ readStatusList.value = res.data;
}
+ });
+ };
- }
- })
-}
+ //纭鏌ョ湅
+ const resetForm = row => {
+ console.log("row", row);
+ row.readCount = row.readCount + 1;
-// 瀵煎嚭瑙勭珷鍒跺害
-const { proxy } = getCurrentInstance()
-const handleExport = () => {
- proxy.download('/rulesRegulationsManagement/export', { ...regulationSearchForm }, '瑙勭珷鍒跺害.xlsx')
-}
+ updateRuleManagement(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏌ョ湅鏁伴噺淇敼鎴愬姛");
+ //淇敼闃呰鐘舵��
+ //鏍规嵁鍒跺害id鍜屽綋鍓嶇櫥褰曠殑鍛樺伐寰楀埌闃呰鐘舵��
+ // let item = readStatusList.value.filter(item => item.employee == tableData.value[0].staffName )
+ // if(item.length>0){
+ // item[0].status = 'confirmed',
+ // item[0].confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
+ // }
+ // 绛涢�夊綋鍓嶅憳宸ュ搴旇鍒跺害鐨勯槄璇荤姸鎬佽褰�
+ let statusItem = readStatusList.value.find(
+ item =>
+ item.employee === tableData.value[0].staffName &&
+ item.ruleId === row.id
+ );
-// 鑾峰彇鍗扮珷鐢宠鍒楄〃鏁版嵁
-const getSealApplicationList = async () => {
- tableLoading.value = true
- listSealApplication(page,sealSearchForm)
- .then(res => {
- //鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭�
-// 鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭苟杩囨护鏁版嵁
- const currentFactoryName = userStore.currentFactoryName
- if (currentFactoryName) {
- // 鏍规嵁currentFactoryName杩囨护鍑篸epartment鐩稿悓鐨勬暟鎹�
- sealApplications.value = res.data.records.filter(item => item.department === currentFactoryName)
- // 鏇存柊杩囨护鍚庣殑鎬绘暟
- page.value.total = sealApplications.value.length
- } else {
- // 濡傛灉娌℃湁currentFactoryName锛屽垯鏄剧ず鎵�鏈夋暟鎹�
- sealApplications.value = res.data.records
- page.value.total = res.data.total
- }
- // sealApplications.value = res.data.records
- // page.value.total = res.data.total;
- tableLoading.value = false;
+ if (statusItem) {
+ // 濡傛灉鎵惧埌璁板綍锛屾洿鏂扮姸鎬佸拰纭鏃堕棿
+ statusItem.status = "confirmed";
+ // 鏍煎紡鍖栨椂闂翠负"YYYY-MM-DD HH:mm:ss"鏍煎紡
+ const now = new Date();
+ statusItem.confirmTime = `${now.getFullYear()}-${String(
+ now.getMonth() + 1
+ ).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")} ${String(
+ now.getHours()
+ ).padStart(2, "0")}:${String(now.getMinutes()).padStart(
+ 2,
+ "0"
+ )}:${String(now.getSeconds()).padStart(2, "0")}`;
+ // statusItem.confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
- }).catch(err => {
- tableLoading.value = false;
- })
-}
-// 鑾峰彇瑙勭珷鍒跺害鍒楄〃鏁版嵁
-const getRegulationList = async () => {
- tableLoading.value = true
- listRuleManagement(page,regulationSearchForm)
- .then(res => {
+ updateReadingStatus(statusItem).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害闃呰鐘舵�佷慨鏀规垚鍔�");
+ }
+ });
+ }
+ }
+ });
+ };
- regulations.value = res.data.records
- // 杩囨护鎺夊凡搴熷純鐨勫埗搴�
- // regulations.value = res.data.records.filter(item => item.status !== 'repealed')
- page.value.total = res.data.total;
- tableLoading.value = false;
+ // 瀵煎嚭瑙勭珷鍒跺害
+ const { proxy } = getCurrentInstance();
+ const handleExport = () => {
+ proxy.download(
+ "/rulesRegulationsManagement/export",
+ { ...regulationSearchForm },
+ "瑙勭珷鍒跺害.xlsx"
+ );
+ };
- }).catch(err => {
- tableLoading.value = false;
- })
-}
+ // 鑾峰彇鍗扮珷鐢宠鍒楄〃鏁版嵁
+ const getSealApplicationList = async () => {
+ tableLoading.value = true;
+ listSealApplication(page, sealSearchForm)
+ .then(res => {
+ //鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭�
+ // 鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭苟杩囨护鏁版嵁
+ const currentFactoryName = userStore.currentFactoryName;
+ if (currentFactoryName) {
+ // 鏍规嵁currentFactoryName杩囨护鍑篸epartment鐩稿悓鐨勬暟鎹�
+ sealApplications.value = res.data.records.filter(
+ item => item.department === currentFactoryName
+ );
+ // 鏇存柊杩囨护鍚庣殑鎬绘暟
+ page.value.total = sealApplications.value.length;
+ } else {
+ // 濡傛灉娌℃湁currentFactoryName锛屽垯鏄剧ず鎵�鏈夋暟鎹�
+ sealApplications.value = res.data.records;
+ page.value.total = res.data.total;
+ }
+ // sealApplications.value = res.data.records
+ // page.value.total = res.data.total;
+ tableLoading.value = false;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
+ // 鑾峰彇瑙勭珷鍒跺害鍒楄〃鏁版嵁
+ const getRegulationList = async () => {
+ tableLoading.value = true;
+ listRuleManagement(page, regulationSearchForm)
+ .then(res => {
+ regulations.value = res.data.records;
+ // 杩囨护鎺夊凡搴熷純鐨勫埗搴�
+ // regulations.value = res.data.records.filter(item => item.status !== 'repealed')
+ page.value.total = res.data.total;
+ tableLoading.value = false;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
-onMounted(() => {
- // 鍒濆鍖�
- getSealApplicationList()
- getRegulationList()
-})
+ onMounted(() => {
+ // 鍒濆鍖�
+ getSealApplicationList();
+ getRegulationList();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.tab-content {
- padding: 20px 0;
-}
+ .tab-content {
+ padding: 20px 0;
+ }
-.mb-20 {
- margin-bottom: 20px;
-}
+ .mb-20 {
+ margin-bottom: 20px;
+ }
-.mt-20 {
- margin-top: 20px;
-}
+ .mt-20 {
+ margin-top: 20px;
+ }
-.ml-10 {
- margin-left: 10px;
-}
+ .ml-10 {
+ margin-left: 10px;
+ }
-.regulation-content {
- background-color: #f5f5f5;
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
- white-space: pre-wrap;
- height: 200px;
-}
+ .regulation-content {
+ background-color: #f5f5f5;
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ white-space: pre-wrap;
+ height: 200px;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
</style>
diff --git a/src/views/collaborativeApproval/sealManagement/index.vue b/src/views/collaborativeApproval/sealManagement/index.vue
index 88d33dc..aa7fcac 100644
--- a/src/views/collaborativeApproval/sealManagement/index.vue
+++ b/src/views/collaborativeApproval/sealManagement/index.vue
@@ -6,98 +6,145 @@
<span>鐢ㄥ嵃绠＄悊鍙戝竷</span>
</div>
</template>
-
-
- <!-- 鐢ㄥ嵃鐢宠绠＄悊 -->
- <div class="tab-content">
- <el-row :gutter="20" class="mb-20 ">
- <span class="ml-10">鐢ㄥ嵃鏍囬锛�</span>
- <el-col :span="6">
- <el-input v-model="sealSearchForm.title" placeholder="璇疯緭鍏ョ敵璇锋爣棰�" clearable />
- </el-col>
- <span class="search_title">瀹℃壒鐘舵�侊細</span>
- <el-col :span="6">
- <el-select v-model="sealSearchForm.status" placeholder="瀹℃壒鐘舵��" clearable>
- <el-option label="寰呭鎵�" value="pending" />
- <el-option label="宸查�氳繃" value="approved" />
- <el-option label="宸叉嫆缁�" value="rejected" />
- </el-select>
- </el-col>
- <el-col :span="8">
- <el-button type="primary" @click="searchSealApplications">鎼滅储</el-button>
- <el-button @click="resetSealSearch">閲嶇疆</el-button>
- <el-button @click="handleExport">瀵煎嚭</el-button>
- <el-button type="primary" @click="showSealApplyDialog = true">鐢宠鐢ㄥ嵃
- </el-button>
- </el-col>
- </el-row>
-
- <el-table :data="sealApplications" border v-loading="tableLoading" style="width: 100%">
- <el-table-column prop="applicationNum" label="鐢宠缂栧彿" width="120" />
- <el-table-column prop="title" label="鐢宠鏍囬" min-width="200" />
- <el-table-column prop="createUserName" label="鐢宠浜�" width="120" />
- <el-table-column prop="department" label="鎵�灞為儴闂�" width="150" />
- <el-table-column prop="sealType" label="鐢ㄥ嵃绫诲瀷" width="120">
- <template #default="scope">
- {{ getSealTypeText(scope.row.sealType) }}
- </template>
- </el-table-column>
- <el-table-column prop="createTime" label="鐢宠鏃堕棿" width="180" />
- <el-table-column prop="status" label="鐘舵��" width="100">
- <template #default="scope">
- <el-tag :type="getStatusType(scope.row.status)">
- {{ getStatusText(scope.row.status) }}
- </el-tag>
- </template>
- </el-table-column>
- <el-table-column label="鎿嶄綔" width="200" fixed="right">
- <template #default="scope">
- <el-button link @click="viewSealDetail(scope.row)">鏌ョ湅</el-button>
- <el-button
- v-if="scope.row.status === 'pending'"
- link
- type="primary"
- @click="approveSeal(scope.row)"
- >
- 瀹℃壒
- </el-button>
- <el-button
- v-if="scope.row.status === 'pending'"
- link
- type="danger"
- @click="rejectSeal(scope.row)"
- >
- 鎷掔粷
- </el-button>
- </template>
- </el-table-column>
- </el-table>
- <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper"
- :page="page.current" :limit="page.size" @pagination="paginationChange" />
- </div>
+ <!-- 鐢ㄥ嵃鐢宠绠＄悊 -->
+ <div class="tab-content">
+ <el-row :gutter="20"
+ class="mb-20 ">
+ <span class="ml-10">鐢ㄥ嵃鏍囬锛�</span>
+ <el-col :span="6">
+ <el-input v-model="sealSearchForm.title"
+ placeholder="璇疯緭鍏ョ敵璇锋爣棰�"
+ clearable />
+ </el-col>
+ <span class="search_title">瀹℃壒鐘舵�侊細</span>
+ <el-col :span="6">
+ <el-select v-model="sealSearchForm.status"
+ placeholder="瀹℃壒鐘舵��"
+ clearable>
+ <el-option label="寰呭鎵�"
+ value="pending" />
+ <el-option label="宸查�氳繃"
+ value="approved" />
+ <el-option label="宸叉嫆缁�"
+ value="rejected" />
+ </el-select>
+ </el-col>
+ <el-col :span="8">
+ <el-button type="primary"
+ @click="searchSealApplications">鎼滅储</el-button>
+ <el-button @click="resetSealSearch">閲嶇疆</el-button>
+ <el-button @click="handleExport">瀵煎嚭</el-button>
+ <el-button type="primary"
+ @click="showSealApplyDialog = true">鐢宠鐢ㄥ嵃
+ </el-button>
+ </el-col>
+ </el-row>
+ <el-table :data="sealApplications"
+ border
+ v-loading="tableLoading"
+ style="width: 100%">
+ <el-table-column prop="applicationNum"
+ label="鐢宠缂栧彿"
+ width="120" />
+ <el-table-column prop="title"
+ label="鐢宠鏍囬"
+ min-width="200" />
+ <el-table-column prop="createUserName"
+ label="鐢宠浜�"
+ width="120" />
+ <el-table-column prop="department"
+ label="鎵�灞為儴闂�"
+ width="150" />
+ <el-table-column prop="sealType"
+ label="鐢ㄥ嵃绫诲瀷"
+ width="120">
+ <template #default="scope">
+ {{ getSealTypeText(scope.row.sealType) }}
+ </template>
+ </el-table-column>
+ <el-table-column prop="createTime"
+ label="鐢宠鏃堕棿"
+ width="180" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
+ <template #default="scope">
+ <el-tag :type="getStatusType(scope.row.status)">
+ {{ getStatusText(scope.row.status) }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔"
+ width="200"
+ fixed="right">
+ <template #default="scope">
+ <el-button link
+ @click="viewSealDetail(scope.row)">鏌ョ湅</el-button>
+ <el-button v-if="scope.row.status === 'pending'"
+ link
+ type="primary"
+ @click="approveSeal(scope.row)">
+ 瀹℃壒
+ </el-button>
+ <el-button v-if="scope.row.status === 'pending'"
+ link
+ type="danger"
+ @click="rejectSeal(scope.row)">
+ 鎷掔粷
+ </el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <pagination v-show="total > 0"
+ :total="total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="page.current"
+ :limit="page.size"
+ @pagination="paginationChange" />
+ </div>
</el-card>
-
<!-- 鐢ㄥ嵃鐢宠瀵硅瘽妗� -->
- <el-dialog v-model="showSealApplyDialog" title="鐢宠鐢ㄥ嵃" width="600px">
- <el-form :model="sealForm" :rules="sealRules" ref="sealFormRef" label-width="100px">
- <el-form-item label="鐢宠缂栧彿" prop="applicationNum">
- <el-input v-model="sealForm.applicationNum" placeholder="璇疯緭鍏ョ敵璇风紪鍙�" />
+ <el-dialog v-model="showSealApplyDialog"
+ title="鐢宠鐢ㄥ嵃"
+ width="600px">
+ <el-form :model="sealForm"
+ :rules="sealRules"
+ ref="sealFormRef"
+ label-width="100px">
+ <el-form-item label="鐢宠缂栧彿"
+ prop="applicationNum">
+ <el-input v-model="sealForm.applicationNum"
+ placeholder="璇疯緭鍏ョ敵璇风紪鍙�" />
</el-form-item>
- <el-form-item label="鐢宠鏍囬" prop="title">
- <el-input v-model="sealForm.title" placeholder="璇疯緭鍏ョ敵璇锋爣棰�" />
+ <el-form-item label="鐢宠鏍囬"
+ prop="title">
+ <el-input v-model="sealForm.title"
+ placeholder="璇疯緭鍏ョ敵璇锋爣棰�" />
</el-form-item>
- <el-form-item label="鐢ㄥ嵃绫诲瀷" prop="sealType">
- <el-select v-model="sealForm.sealType" placeholder="璇烽�夋嫨鐢ㄥ嵃绫诲瀷" style="width: 100%">
- <el-option label="鍏珷" value="official" />
- <el-option label="鍚堝悓涓撶敤绔�" value="contract" />
- <el-option label="璐㈠姟涓撶敤绔�" value="finance" />
- <el-option label="娉曚汉绔�" value="legal" />
+ <el-form-item label="鐢ㄥ嵃绫诲瀷"
+ prop="sealType">
+ <el-select v-model="sealForm.sealType"
+ placeholder="璇烽�夋嫨鐢ㄥ嵃绫诲瀷"
+ style="width: 100%">
+ <el-option label="鍏珷"
+ value="official" />
+ <el-option label="鍚堝悓涓撶敤绔�"
+ value="contract" />
+ <el-option label="璐㈠姟涓撶敤绔�"
+ value="finance" />
+ <el-option label="娉曚汉绔�"
+ value="legal" />
</el-select>
</el-form-item>
- <el-form-item label="鐢宠鍘熷洜" prop="reason">
- <el-input v-model="sealForm.reason" type="textarea" :rows="4" placeholder="璇疯缁嗚鏄庣敤鍗板師鍥�" />
+ <el-form-item label="鐢宠鍘熷洜"
+ prop="reason">
+ <el-input v-model="sealForm.reason"
+ type="textarea"
+ :rows="4"
+ placeholder="璇疯缁嗚鏄庣敤鍗板師鍥�" />
</el-form-item>
- <el-form-item label="绱ф�ョ▼搴�" prop="urgency">
+ <el-form-item label="绱ф�ョ▼搴�"
+ prop="urgency">
<el-radio-group v-model="sealForm.urgency">
<el-radio label="normal">鏅��</el-radio>
<el-radio label="urgent">绱ф��</el-radio>
@@ -107,12 +154,12 @@
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitSealApplication">鎻愪氦鐢宠</el-button>
<el-button @click="showSealApplyDialog = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitSealApplication">鎻愪氦鐢宠</el-button>
</span>
</template>
</el-dialog>
-
<!-- 瑙勭珷鍒跺害鍙戝竷瀵硅瘽妗� -->
<!-- <el-dialog v-model="showRegulationDialog" :title="operationType === 'add' ? '鍙戝竷鍒跺害' : '缂栬緫鍒跺害'" width="800px">
<el-form :model="regulationForm" :rules="regulationRules" ref="regulationFormRef" label-width="100px">
@@ -161,11 +208,14 @@
</span>
</template>
</el-dialog> -->
-
<!-- 鐢ㄥ嵃璇︽儏瀵硅瘽妗� -->
- <el-dialog v-model="showSealDetailDialog" title="鐢ㄥ嵃鐢宠璇︽儏" width="700px">
- <div v-if="currentSealDetail" class="mb10">
- <el-descriptions :column="2" border>
+ <el-dialog v-model="showSealDetailDialog"
+ title="鐢ㄥ嵃鐢宠璇︽儏"
+ width="700px">
+ <div v-if="currentSealDetail"
+ class="mb10">
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="鐢宠缂栧彿">{{ currentSealDetail.id }}</el-descriptions-item>
<el-descriptions-item label="鐢宠鏍囬">{{ currentSealDetail.title }}</el-descriptions-item>
<el-descriptions-item label="鐢宠浜�">{{ currentSealDetail.createUserName }}</el-descriptions-item>
@@ -177,15 +227,18 @@
{{ getStatusText(currentSealDetail.status) }}
</el-tag>
</el-descriptions-item>
- <el-descriptions-item label="鐢宠鍘熷洜" :span="2">{{ currentSealDetail.reason }}</el-descriptions-item>
+ <el-descriptions-item label="鐢宠鍘熷洜"
+ :span="2">{{ currentSealDetail.reason }}</el-descriptions-item>
</el-descriptions>
</div>
</el-dialog>
-
<!-- 瑙勭珷鍒跺害璇︽儏瀵硅瘽妗� -->
- <el-dialog v-model="showRegulationDetailDialog" title="瑙勭珷鍒跺害璇︽儏" width="800px">
+ <el-dialog v-model="showRegulationDetailDialog"
+ title="瑙勭珷鍒跺害璇︽儏"
+ width="800px">
<div v-if="currentRegulationDetail">
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="鍒跺害缂栧彿">{{ currentRegulationDetail.id }}</el-descriptions-item>
<el-descriptions-item label="鍒跺害鏍囬">{{ currentRegulationDetail.title }}</el-descriptions-item>
<el-descriptions-item label="鍒嗙被">{{ getCategoryText(currentRegulationDetail.category) }}</el-descriptions-item>
@@ -198,19 +251,30 @@
<div class="regulation-content">{{ currentRegulationDetail.content }}</div>
</div>
<!-- 濡傛灉tableData>0 鏄剧ず -->
- <div style="margin: 10px 0;" v-if="tableData && tableData.length > 0" >
- <el-button type="success" @click="resetForm(currentRegulationDetail)">纭鏌ョ湅</el-button>
+ <div style="margin: 10px 0;"
+ v-if="tableData && tableData.length > 0">
+ <el-button type="success"
+ @click="resetForm(currentRegulationDetail)">纭鏌ョ湅</el-button>
</div>
</div>
</el-dialog>
-
<!-- 鐗堟湰鍘嗗彶瀵硅瘽妗� -->
- <el-dialog v-model="showVersionHistoryDialog" title="鐗堟湰鍘嗗彶" width="800px">
- <el-table :data="versionHistory" style="width: 100%;margin-bottom: 10px">
- <el-table-column prop="version" label="鐗堟湰鍙�" width="100" />
- <el-table-column prop="updateTime" label="鏇存柊鏃堕棿" width="180" />
- <el-table-column prop="createUserName" label="鏇存柊浜�" width="120" />
- <el-table-column prop="changeLog" label="鍙樻洿璇存槑">
+ <el-dialog v-model="showVersionHistoryDialog"
+ title="鐗堟湰鍘嗗彶"
+ width="800px">
+ <el-table :data="versionHistory"
+ style="width: 100%;margin-bottom: 10px">
+ <el-table-column prop="version"
+ label="鐗堟湰鍙�"
+ width="100" />
+ <el-table-column prop="updateTime"
+ label="鏇存柊鏃堕棿"
+ width="180" />
+ <el-table-column prop="createUserName"
+ label="鏇存柊浜�"
+ width="120" />
+ <el-table-column prop="changeLog"
+ label="鍙樻洿璇存槑">
<template #default="scope">
<el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
{{ scope.row.status === 'active' ? '鐢熸晥涓�' : '宸插簾姝�' }}
@@ -219,15 +283,27 @@
</el-table-column>
</el-table>
</el-dialog>
-
<!-- 闃呰鐘舵�佸璇濇 -->
- <el-dialog v-model="showReadStatusDialog" title="闃呰鐘舵��" width="800px">
- <el-table :data="readStatusList" style="width: 100%;margin-bottom: 10px">
- <el-table-column prop="employee" label="鍛樺伐濮撳悕" width="120" />
- <el-table-column prop="department" label="鎵�灞為儴闂�" width="150" />
- <el-table-column prop="createTime" label="闃呰鏃堕棿" width="180" />
- <el-table-column prop="confirmTime" label="纭鏃堕棿" width="180" />
- <el-table-column prop="status" label="鐘舵��" width="100">
+ <el-dialog v-model="showReadStatusDialog"
+ title="闃呰鐘舵��"
+ width="800px">
+ <el-table :data="readStatusList"
+ style="width: 100%;margin-bottom: 10px">
+ <el-table-column prop="employee"
+ label="鍛樺伐濮撳悕"
+ width="120" />
+ <el-table-column prop="department"
+ label="鎵�灞為儴闂�"
+ width="150" />
+ <el-table-column prop="createTime"
+ label="闃呰鏃堕棿"
+ width="180" />
+ <el-table-column prop="confirmTime"
+ label="纭鏃堕棿"
+ width="180" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="scope.row.status === 'confirmed' ? 'success' : 'warning'">
{{ scope.row.status === 'confirmed' ? '宸茬‘璁�' : '鏈‘璁�' }}
@@ -240,525 +316,563 @@
</template>
<script setup>
-import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus } from '@element-plus/icons-vue'
-import { listSealApplication, addSealApplication, updateSealApplication,listRuleManagement,addRuleManagement,updateRuleManagement,delRuleManagement,getReadingStatusByRuleId,getReadingStatusList,addReadingStatus,updateReadingStatus } from '@/api/collaborativeApproval/sealManagement.js'
-import { el } from 'element-plus/es/locales.mjs'
-import { getUserProfile } from '@/api/system/user.js'
-import {staffJoinDel, staffJoinListPage} from "@/api/personnelManagement/onboarding.js";
-import useUserStore from '@/store/modules/user'
-import { userLoginFacotryList } from "@/api/system/user.js"
+ import { ref, reactive, onMounted, getCurrentInstance } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus } from "@element-plus/icons-vue";
+ import {
+ listSealApplication,
+ addSealApplication,
+ updateSealApplication,
+ listRuleManagement,
+ addRuleManagement,
+ updateRuleManagement,
+ delRuleManagement,
+ getReadingStatusByRuleId,
+ getReadingStatusList,
+ addReadingStatus,
+ updateReadingStatus,
+ } from "@/api/collaborativeApproval/sealManagement.js";
+ import { el } from "element-plus/es/locales.mjs";
+ import { getUserProfile } from "@/api/system/user.js";
+ import {
+ staffJoinDel,
+ staffJoinListPage,
+ } from "@/api/personnelManagement/onboarding.js";
+ import useUserStore from "@/store/modules/user";
+ import { userLoginFacotryList } from "@/api/system/user.js";
-// 鍝嶅簲寮忔暟鎹�
-const currentUser = ref(null)
-const activeTab = ref('seal')
-const operationType = ref('add')
-const tableData = ref([])
-// 鐢ㄥ嵃鐢宠鐩稿叧
-const userStore = useUserStore()
-const showSealApplyDialog = ref(false)
-const tableLoading = ref(false)
-const showSealDetailDialog = ref(false)
-const currentSealDetail = ref(null)
-const sealFormRef = ref()
-const sealForm = reactive({
- applicationNum: '',
- title: '',
- sealType: '',
- reason: '',
- urgency: 'normal',
- status: 'pending'
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const currentUser = ref(null);
+ const activeTab = ref("seal");
+ const operationType = ref("add");
+ const tableData = ref([]);
+ // 鐢ㄥ嵃鐢宠鐩稿叧
+ const userStore = useUserStore();
+ const showSealApplyDialog = ref(false);
+ const tableLoading = ref(false);
+ const showSealDetailDialog = ref(false);
+ const currentSealDetail = ref(null);
+ const sealFormRef = ref();
+ const sealForm = reactive({
+ applicationNum: "",
+ title: "",
+ sealType: "",
+ reason: "",
+ urgency: "normal",
+ status: "pending",
+ });
-const sealRules = {
- applicationNum: [{ required: true, message: '璇疯緭鍏ョ敵璇风紪鍙�', trigger: 'blur' }],
- title: [{ required: true, message: '璇疯緭鍏ョ敵璇锋爣棰�', trigger: 'blur' }],
- sealType: [{ required: true, message: '璇烽�夋嫨鐢ㄥ嵃绫诲瀷', trigger: 'change' }],
- reason: [{ required: true, message: '璇疯緭鍏ョ敵璇峰師鍥�', trigger: 'blur' }]
-}
+ const sealRules = {
+ applicationNum: [
+ { required: true, message: "璇疯緭鍏ョ敵璇风紪鍙�", trigger: "blur" },
+ ],
+ title: [{ required: true, message: "璇疯緭鍏ョ敵璇锋爣棰�", trigger: "blur" }],
+ sealType: [{ required: true, message: "璇烽�夋嫨鐢ㄥ嵃绫诲瀷", trigger: "change" }],
+ reason: [{ required: true, message: "璇疯緭鍏ョ敵璇峰師鍥�", trigger: "blur" }],
+ };
-const sealSearchForm = reactive({
- title: '',
- status: ''
-})
-// 鍒嗛〉鍙傛暟
-const page = reactive({
- current: 1,
- size: 100,
- total: 0
-})
-// 瑙勭珷鍒跺害鐩稿叧
-const showRegulationDialog = ref(false)
-const showRegulationDetailDialog = ref(false)
-const showVersionHistoryDialog = ref(false)
-const showReadStatusDialog = ref(false)
-const currentRegulationDetail = ref(null)
-const regulationFormRef = ref()
-const regulationForm = reactive({
- id: '',
- regulationNum: '',
- title: '',
- category: '',
- content: '',
- version: '',
- status: 'active',
- readCount: 0,
- effectiveTime: '',
- scope: [],
- requireConfirm: false
-})
+ const sealSearchForm = reactive({
+ title: "",
+ status: "",
+ });
+ // 鍒嗛〉鍙傛暟
+ const page = reactive({
+ current: 1,
+ size: 100,
+ total: 0,
+ });
+ // 瑙勭珷鍒跺害鐩稿叧
+ const showRegulationDialog = ref(false);
+ const showRegulationDetailDialog = ref(false);
+ const showVersionHistoryDialog = ref(false);
+ const showReadStatusDialog = ref(false);
+ const currentRegulationDetail = ref(null);
+ const regulationFormRef = ref();
+ const regulationForm = reactive({
+ id: "",
+ regulationNum: "",
+ title: "",
+ category: "",
+ content: "",
+ version: "",
+ status: "active",
+ readCount: 0,
+ effectiveTime: "",
+ scope: [],
+ requireConfirm: false,
+ });
-const readStatus = ref({
- id: '',
- ruleId: '',
- employee: '',
- department: '',
- createTime: '',
- confirmTime: '',
- status: 'unconfirmed'
-})
+ const readStatus = ref({
+ id: "",
+ ruleId: "",
+ employee: "",
+ department: "",
+ createTime: "",
+ confirmTime: "",
+ status: "unconfirmed",
+ });
-const regulationRules = {
- title: [{ required: true, message: '璇疯緭鍏ュ埗搴︽爣棰�', trigger: 'blur' }],
- category: [{ required: true, message: '璇烽�夋嫨鍒跺害鍒嗙被', trigger: 'change' }],
- content: [{ required: true, message: '璇疯緭鍏ュ埗搴﹀唴瀹�', trigger: 'blur' }],
- effectiveTime: [{ required: true, message: '璇烽�夋嫨鐢熸晥鏃堕棿', trigger: 'change' }],
- scope: [{ required: true, message: '璇烽�夋嫨閫傜敤鑼冨洿', trigger: 'change' }]
-}
+ const regulationRules = {
+ title: [{ required: true, message: "璇疯緭鍏ュ埗搴︽爣棰�", trigger: "blur" }],
+ category: [{ required: true, message: "璇烽�夋嫨鍒跺害鍒嗙被", trigger: "change" }],
+ content: [{ required: true, message: "璇疯緭鍏ュ埗搴﹀唴瀹�", trigger: "blur" }],
+ effectiveTime: [
+ { required: true, message: "璇烽�夋嫨鐢熸晥鏃堕棿", trigger: "change" },
+ ],
+ scope: [{ required: true, message: "璇烽�夋嫨閫傜敤鑼冨洿", trigger: "change" }],
+ };
-const regulationSearchForm = reactive({
- title: '',
- category: ''
-})
+ const regulationSearchForm = reactive({
+ title: "",
+ category: "",
+ });
-// 鍋囨暟鎹�
-const sealApplications = ref([])
+ // 鍋囨暟鎹�
+ const sealApplications = ref([]);
-const regulations = ref([])
+ const regulations = ref([]);
-const versionHistory = ref([])
+ const versionHistory = ref([]);
-const readStatusList = ref([])
+ const readStatusList = ref([]);
// { employee: '闄堝織寮�', department: '閿�鍞儴', readTime: '2025-01-11 10:30:00', confirmTime: '2025-01-11 10:35:00', status: 'confirmed' },
// { employee: '鍒橀泤濠�', department: '鎶�鏈儴', readTime: '2025-01-11 14:20:00', confirmTime: '', status: 'unconfirmed' },
// { employee: '鐜嬪缓鍥�', department: '璐㈠姟閮�', readTime: '2025-01-12 09:15:00', confirmTime: '2025-01-12 09:20:00', status: 'confirmed' }
-// 鐢ㄥ嵃鐢宠鐘舵��
-const getStatusType = (status) => {
- const statusMap = {
- pending: 'warning',
- approved: 'success',
- rejected: 'danger'
- }
- return statusMap[status] || 'info'
-}
-// 鍒跺害鐘舵��
-const getStatusText = (status) => {
- const statusMap = {
- pending: '寰呭鎵�',
- approved: '宸查�氳繃',
- rejected: '宸叉嫆缁�'
- }
- return statusMap[status] || '鏈煡'
-}
-// 鐢ㄥ嵃绫诲瀷
-const getSealTypeText = (sealType) => {
- const sealTypeMap = {
- official: '鍏珷',
- contract: '鍚堝悓涓撶敤绔�',
- finance: '璐㈠姟涓撶敤绔�',
- tegal: '鎶�鏈笓鐢ㄧ珷'
- }
- return sealTypeMap[sealType] || '鏈煡'
-}
-// 鍒跺害鍒嗙被
-const getCategoryText = (category) => {
- const categoryMap = {
- hr: '浜轰簨鍒跺害',
- finance: '璐㈠姟鍒跺害',
- safety: '瀹夊叏鍒跺害',
- tech: '鎶�鏈埗搴�'
- }
- return categoryMap[category] || '鏈煡'
-}
-// 鎼滅储鍗扮珷鐢宠
-const searchSealApplications = () => {
- page.current=1
- getSealApplicationList()
+ // 鐢ㄥ嵃鐢宠鐘舵��
+ const getStatusType = status => {
+ const statusMap = {
+ pending: "warning",
+ approved: "success",
+ rejected: "danger",
+ };
+ return statusMap[status] || "info";
+ };
+ // 鍒跺害鐘舵��
+ const getStatusText = status => {
+ const statusMap = {
+ pending: "寰呭鎵�",
+ approved: "宸查�氳繃",
+ rejected: "宸叉嫆缁�",
+ };
+ return statusMap[status] || "鏈煡";
+ };
+ // 鐢ㄥ嵃绫诲瀷
+ const getSealTypeText = sealType => {
+ const sealTypeMap = {
+ official: "鍏珷",
+ contract: "鍚堝悓涓撶敤绔�",
+ finance: "璐㈠姟涓撶敤绔�",
+ tegal: "鎶�鏈笓鐢ㄧ珷",
+ };
+ return sealTypeMap[sealType] || "鏈煡";
+ };
+ // 鍒跺害鍒嗙被
+ const getCategoryText = category => {
+ const categoryMap = {
+ hr: "浜轰簨鍒跺害",
+ finance: "璐㈠姟鍒跺害",
+ safety: "瀹夊叏鍒跺害",
+ tech: "鎶�鏈埗搴�",
+ };
+ return categoryMap[category] || "鏈煡";
+ };
+ // 鎼滅储鍗扮珷鐢宠
+ const searchSealApplications = () => {
+ page.current = 1;
+ getSealApplicationList();
- // ElMessage.success('鎼滅储瀹屾垚')
-}
-// 閲嶇疆鍗扮珷鐢宠鎼滅储
-const resetSealSearch = () => {
- sealSearchForm.title = ''
- sealSearchForm.status = ''
- searchSealApplications()
-}
-// 鎼滅储鍒跺害
-const searchRegulations = () => {
- page.current=1
- getRegulationList()
-}
-// 閲嶇疆鍒跺害鎼滅储
-const resetRegulationSearch = () => {
- regulationSearchForm.title = ''
- regulationSearchForm.category = ''
- searchRegulations()
-}
-// 鎻愪氦鐢ㄥ嵃鐢宠
-const submitSealApplication = async () => {
- try {
- await sealFormRef.value.validate()
- addSealApplication(sealForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鐢宠鎻愪氦鎴愬姛')
- showSealApplyDialog.value = false
- getSealApplicationList()
- Object.assign(sealForm, {
- applicationNum: '',
- title: '',
- sealType: '',
- reason: '',
- urgency: 'normal',
- status: 'pending'
+ // ElMessage.success('鎼滅储瀹屾垚')
+ };
+ // 閲嶇疆鍗扮珷鐢宠鎼滅储
+ const resetSealSearch = () => {
+ sealSearchForm.title = "";
+ sealSearchForm.status = "";
+ searchSealApplications();
+ };
+ // 鎼滅储鍒跺害
+ const searchRegulations = () => {
+ page.current = 1;
+ getRegulationList();
+ };
+ // 閲嶇疆鍒跺害鎼滅储
+ const resetRegulationSearch = () => {
+ regulationSearchForm.title = "";
+ regulationSearchForm.category = "";
+ searchRegulations();
+ };
+ // 鎻愪氦鐢ㄥ嵃鐢宠
+ const submitSealApplication = async () => {
+ try {
+ await sealFormRef.value.validate();
+ addSealApplication(sealForm)
+ .then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鐢宠鎻愪氦鎴愬姛");
+ showSealApplyDialog.value = false;
+ getSealApplicationList();
+ Object.assign(sealForm, {
+ applicationNum: "",
+ title: "",
+ sealType: "",
+ reason: "",
+ urgency: "normal",
+ status: "pending",
+ });
+ }
+ })
+ .catch(err => {
+ ElMessage.error(err.msg);
+ });
+ } catch (error) {
+ ElMessage.error("璇峰畬鍠勭敵璇蜂俊鎭�");
+ }
+ };
+ // 鏂板
+ const handleAdd = () => {
+ operationType.value = "add";
+ resetRegulationForm();
+ showRegulationDialog.value = true;
+ };
+
+ // 缂栬緫
+ const handleEdit = row => {
+ operationType.value = "edit";
+ Object.assign(regulationForm, row);
+ showRegulationDialog.value = true;
+ };
+ // 搴熷純
+ const repealEdit = row => {
+ operationType.value = "edit";
+ Object.assign(regulationForm, row);
+ regulationForm.status = "repealed";
+ ElMessageBox.confirm("纭搴熷純璇ュ埗搴︼紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ updateRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害搴熷純鎴愬姛");
+ // showRegulationDialog.value = false
+ getRegulationList();
+ resetRegulationForm();
+ }
+ });
})
+ .catch(() => {
+ ElMessage({
+ type: "info",
+ message: "宸插彇娑堝簾寮�",
+ });
+ });
+ };
+ // 鍙戝竷鍒跺害
+ const submitRegulation = async () => {
+ try {
+ await regulationFormRef.value.validate();
+ if (operationType.value == "add") {
+ addRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害鍙戝竷鎴愬姛");
+ showRegulationDialog.value = false;
+ getRegulationList();
+ resetRegulationForm();
+ }
+ });
+ } else {
+ updateRuleManagement(regulationForm).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害缂栬緫鎴愬姛");
+ showRegulationDialog.value = false;
+ resetRegulationForm();
+ getRegulationList();
+ }
+ });
}
- }).catch(err => {
- ElMessage.error(err.msg)
- })
-
- } catch (error) {
- ElMessage.error('璇峰畬鍠勭敵璇蜂俊鎭�')
- }
-}
-// 鏂板
-const handleAdd = () => {
- operationType.value = 'add'
- resetRegulationForm()
- showRegulationDialog.value = true
-}
+ } catch (err) {
+ ElMessage.error(err.msg);
+ }
+ };
+ //閲嶇疆鍒跺害琛ㄥ崟
+ const resetRegulationForm = () => {
+ Object.assign(regulationForm, {
+ id: "",
+ regulationNum: "",
+ title: "",
+ category: "",
+ content: "",
+ version: "",
+ status: "active",
+ readCount: 0,
+ effectiveTime: "",
+ scope: [],
+ requireConfirm: false,
+ });
+ };
-// 缂栬緫
-const handleEdit = (row) => {
- operationType.value = 'edit'
- Object.assign(regulationForm, row)
- showRegulationDialog.value = true
-}
-// 搴熷純
-const repealEdit = (row) => {
- operationType.value = 'edit'
- Object.assign(regulationForm, row)
- regulationForm.status = 'repealed'
- ElMessageBox.confirm('纭搴熷純璇ュ埗搴︼紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- updateRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害搴熷純鎴愬姛')
- // showRegulationDialog.value = false
- getRegulationList()
- resetRegulationForm()
+ // 鏌ョ湅鐢ㄥ嵃鐢宠璇︽儏
+ const viewSealDetail = row => {
+ currentSealDetail.value = row;
+ showSealDetailDialog.value = true;
+ };
+ // 瀹℃壒鐢ㄥ嵃鐢宠
+ const approveSeal = row => {
+ console.log(row);
+ ElMessageBox.confirm("纭閫氳繃璇ョ敤鍗扮敵璇凤紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ row.status = "approved";
+ updateSealApplication(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("瀹℃壒閫氳繃");
+ }
+ });
+ });
+ };
+ // 鎷掔粷鐢ㄥ嵃鐢宠
+ const rejectSeal = row => {
+ ElMessageBox.prompt("璇疯緭鍏ユ嫆缁濆師鍥�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ inputPattern: /\S+/,
+ inputErrorMessage: "鎷掔粷鍘熷洜涓嶈兘涓虹┖",
+ }).then(({ value }) => {
+ row.status = "rejected";
+ updateSealApplication(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("瀹℃壒鎷掔粷");
+ }
+ });
+ ElMessage.success("宸叉嫆缁濈敵璇�");
+ });
+ };
+ // 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
+ const getList = () => {
+ tableLoading.value = true;
+ //鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
+ getUserProfile().then(res => {
+ if (res.code == 200) {
+ console.log(res.data.userName);
+ currentUser.value = res.data.userName;
}
- })
- }).catch(() => {
- ElMessage({
- type: 'info',
- message: '宸插彇娑堝簾寮�'
- })
- })
-}
-// 鍙戝竷鍒跺害
-const submitRegulation = async () => {
- try {
- await regulationFormRef.value.validate()
- if(operationType.value == 'add'){
- addRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害鍙戝竷鎴愬姛')
- showRegulationDialog.value = false
- getRegulationList()
- resetRegulationForm()
+ });
+ staffJoinListPage({ staffState: 1, ...page })
+ .then(res => {
+ tableLoading.value = false;
+ // tableData.value = res.data.records
+ // //绛涢�夊嚭鍜宑urrentUser鍚屽悕鐨勪汉鍛�
+ tableData.value = res.data.records.filter(
+ item => item.staffName === currentUser.value
+ );
+ page.total = res.data.total;
+
+ if (tableData.value.length == 0) {
+ ElMessage.error("褰撳墠鐢ㄦ埛鏈姞鍏ヤ换浣曢儴闂�");
}
})
- }else{
- updateRuleManagement(regulationForm).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害缂栬緫鎴愬姛')
- showRegulationDialog.value = false
- resetRegulationForm()
- getRegulationList()
- }})}
- }catch(err){
- ElMessage.error(err.msg)
- }
-}
-//閲嶇疆鍒跺害琛ㄥ崟
-const resetRegulationForm = () => {
- Object.assign(regulationForm, {
- id: '',
- regulationNum: '',
- title: '',
- category: '',
- content: '',
- version: '',
- status: 'active',
- readCount: 0,
- effectiveTime: '',
- scope: [],
- requireConfirm: false
-})
-}
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
-
-// 鏌ョ湅鐢ㄥ嵃鐢宠璇︽儏
-const viewSealDetail = (row) => {
- currentSealDetail.value = row
- showSealDetailDialog.value = true
-}
-// 瀹℃壒鐢ㄥ嵃鐢宠
-const approveSeal = (row) => {
- console.log(row)
- ElMessageBox.confirm('纭閫氳繃璇ョ敤鍗扮敵璇凤紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- row.status = 'approved'
- updateSealApplication(row).then(res => {
- if(res.code == 200){
- ElMessage.success('瀹℃壒閫氳繃')
+ // 鏌ョ湅鍒跺害鐗堟湰鍘嗗彶
+ const viewVersionHistory = row => {
+ showVersionHistoryDialog.value = true;
+ const params = {
+ category: row.category,
+ };
+ listRuleManagement(page, params).then(res => {
+ if (res.code == 200) {
+ versionHistory.value = res.data.records;
}
- })
- })
-}
-// 鎷掔粷鐢ㄥ嵃鐢宠
-const rejectSeal = (row) => {
- ElMessageBox.prompt('璇疯緭鍏ユ嫆缁濆師鍥�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- inputPattern: /\S+/,
- inputErrorMessage: '鎷掔粷鍘熷洜涓嶈兘涓虹┖'
- }).then(({ value }) => {
- row.status = 'rejected'
- updateSealApplication(row).then(res => {
- if(res.code == 200){
- ElMessage.success('瀹℃壒鎷掔粷')
- }
- })
- ElMessage.success('宸叉嫆缁濈敵璇�')
- })
-}
-// 鑾峰彇鍦ㄨ亴鍛樺伐鍒楄〃
-const getList = () => {
- tableLoading.value = true;
- //鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
- getUserProfile().then(res => {
- if(res.code == 200){
- console.log(res.data.userName)
- currentUser.value = res.data.userName
- }
- })
- staffJoinListPage({staffState: 1, ...page}).then(res => {
- tableLoading.value = false;
- // tableData.value = res.data.records
- // //绛涢�夊嚭鍜宑urrentUser鍚屽悕鐨勪汉鍛�
- tableData.value = res.data.records.filter(item => item.staffName === currentUser.value)
- page.total = res.data.total;
-
- if(tableData.value.length == 0){
- ElMessage.error('褰撳墠鐢ㄦ埛鏈姞鍏ヤ换浣曢儴闂�')
- }
- }).catch(err => {
- tableLoading.value = false;
- })
-
-
-};
-
-// 鏌ョ湅鍒跺害鐗堟湰鍘嗗彶
-const viewVersionHistory = (row) => {
- showVersionHistoryDialog.value = true
- const params = {
-
- category: row.category
- }
- listRuleManagement(page,params).then(res => {
- if(res.code == 200){
- versionHistory.value = res.data.records
- }
- })
-}
-// 鏌ョ湅鍒跺害璇︽儏
-const viewRegulation = (row) => {
- getList()
- currentRegulationDetail.value = row
- showRegulationDetailDialog.value = true
- getReadingStatusByRuleId(row.id).then(res => {
- if(res.code == 200){
- readStatusList.value = res.data
- if(readStatusList.value.length==0 && tableData.value.length>0){
+ });
+ };
+ // 鏌ョ湅鍒跺害璇︽儏
+ const viewRegulation = row => {
+ getList();
+ currentRegulationDetail.value = row;
+ showRegulationDetailDialog.value = true;
+ getReadingStatusByRuleId(row.id).then(res => {
+ if (res.code == 200) {
+ readStatusList.value = res.data;
+ if (readStatusList.value.length == 0 && tableData.value.length > 0) {
const params = {
- ruleId: row.id,
- employee: tableData.value[0].staffName,
- department: tableData.value[0].postJob,
- status: 'unconfirmed'
+ ruleId: row.id,
+ employee: tableData.value[0].staffName,
+ department: tableData.value[0].postJob,
+ status: "unconfirmed",
+ };
+ addReadingStatus(params).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害闃呰鎴愬姛");
+ }
+ });
}
- addReadingStatus(params).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害闃呰鎴愬姛')
- }
- })
}
- }
- })
-
-}
-// 鏌ョ湅鍒跺害闃呰鐘舵��
-const viewReadStatus = (row) => {
- showReadStatusDialog.value = true
- //鏌ョ湅闃呰鐘舵�佸垪琛�
- getReadingStatusByRuleId(row.id).then(res => {
- if(res.code == 200){
- readStatusList.value = res.data
- }
- })
-}
-
-//纭鏌ョ湅
-const resetForm = (row) => {
- console.log("row",row)
- row.readCount = row.readCount + 1
-
- updateRuleManagement(row).then(res => {
- if(res.code == 200){
- ElMessage.success('鏌ョ湅鏁伴噺淇敼鎴愬姛')
- //淇敼闃呰鐘舵��
- //鏍规嵁鍒跺害id鍜屽綋鍓嶇櫥褰曠殑鍛樺伐寰楀埌闃呰鐘舵��
- // let item = readStatusList.value.filter(item => item.employee == tableData.value[0].staffName )
- // if(item.length>0){
- // item[0].status = 'confirmed',
- // item[0].confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
- // }
- // 绛涢�夊綋鍓嶅憳宸ュ搴旇鍒跺害鐨勯槄璇荤姸鎬佽褰�
- let statusItem = readStatusList.value.find(item => item.employee === tableData.value[0].staffName && item.ruleId === row.id);
-
- if (statusItem) {
- // 濡傛灉鎵惧埌璁板綍锛屾洿鏂扮姸鎬佸拰纭鏃堕棿
- statusItem.status = 'confirmed';
- // 鏍煎紡鍖栨椂闂翠负"YYYY-MM-DD HH:mm:ss"鏍煎紡
- const now = new Date();
- statusItem.confirmTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}:${String(now.getSeconds()).padStart(2, '0')}`;
- // statusItem.confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
-
- updateReadingStatus(statusItem).then(res => {
- if(res.code == 200){
- ElMessage.success('鍒跺害闃呰鐘舵�佷慨鏀规垚鍔�')
- }
- })
+ });
+ };
+ // 鏌ョ湅鍒跺害闃呰鐘舵��
+ const viewReadStatus = row => {
+ showReadStatusDialog.value = true;
+ //鏌ョ湅闃呰鐘舵�佸垪琛�
+ getReadingStatusByRuleId(row.id).then(res => {
+ if (res.code == 200) {
+ readStatusList.value = res.data;
}
+ });
+ };
- }
- })
-}
+ //纭鏌ョ湅
+ const resetForm = row => {
+ console.log("row", row);
+ row.readCount = row.readCount + 1;
-// 瀵煎嚭鐢ㄥ嵃鐢宠
-const { proxy } = getCurrentInstance()
-const handleExport = () => {
- proxy.download('/sealApplicationManagement/export', { ...sealSearchForm }, '鐢ㄥ嵃鐢宠.xlsx')
-}
+ updateRuleManagement(row).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鏌ョ湅鏁伴噺淇敼鎴愬姛");
+ //淇敼闃呰鐘舵��
+ //鏍规嵁鍒跺害id鍜屽綋鍓嶇櫥褰曠殑鍛樺伐寰楀埌闃呰鐘舵��
+ // let item = readStatusList.value.filter(item => item.employee == tableData.value[0].staffName )
+ // if(item.length>0){
+ // item[0].status = 'confirmed',
+ // item[0].confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
+ // }
+ // 绛涢�夊綋鍓嶅憳宸ュ搴旇鍒跺害鐨勯槄璇荤姸鎬佽褰�
+ let statusItem = readStatusList.value.find(
+ item =>
+ item.employee === tableData.value[0].staffName &&
+ item.ruleId === row.id
+ );
-// 鑾峰彇鍗扮珷鐢宠鍒楄〃鏁版嵁
-const getSealApplicationList = async () => {
- tableLoading.value = true
- listSealApplication(page,sealSearchForm)
- .then(res => {
- //鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭�
-// 鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭苟杩囨护鏁版嵁
- const currentFactoryName = userStore.currentFactoryName
- if (currentFactoryName) {
- // 鏍规嵁currentFactoryName杩囨护鍑篸epartment鐩稿悓鐨勬暟鎹�
- sealApplications.value = res.data.records.filter(item => item.department === currentFactoryName)
- // 鏇存柊杩囨护鍚庣殑鎬绘暟
- page.total = sealApplications.value.length
- } else {
- // 濡傛灉娌℃湁currentFactoryName锛屽垯鏄剧ず鎵�鏈夋暟鎹�
- sealApplications.value = res.data.records
- page.total = res.data.total
- }
- // sealApplications.value = res.data.records
- // page.value.total = res.data.total;
- tableLoading.value = false;
+ if (statusItem) {
+ // 濡傛灉鎵惧埌璁板綍锛屾洿鏂扮姸鎬佸拰纭鏃堕棿
+ statusItem.status = "confirmed";
+ // 鏍煎紡鍖栨椂闂翠负"YYYY-MM-DD HH:mm:ss"鏍煎紡
+ const now = new Date();
+ statusItem.confirmTime = `${now.getFullYear()}-${String(
+ now.getMonth() + 1
+ ).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")} ${String(
+ now.getHours()
+ ).padStart(2, "0")}:${String(now.getMinutes()).padStart(
+ 2,
+ "0"
+ )}:${String(now.getSeconds()).padStart(2, "0")}`;
+ // statusItem.confirmTime = new Date().toISOString().replace('T', ' ').split('.')[0];
- }).catch(err => {
- tableLoading.value = false;
- })
-}
-// 鑾峰彇瑙勭珷鍒跺害鍒楄〃鏁版嵁
-const getRegulationList = async () => {
- tableLoading.value = true
- listRuleManagement(page,regulationSearchForm)
- .then(res => {
+ updateReadingStatus(statusItem).then(res => {
+ if (res.code == 200) {
+ ElMessage.success("鍒跺害闃呰鐘舵�佷慨鏀规垚鍔�");
+ }
+ });
+ }
+ }
+ });
+ };
- regulations.value = res.data.records
- // 杩囨护鎺夊凡搴熷純鐨勫埗搴�
- // regulations.value = res.data.records.filter(item => item.status !== 'repealed')
- page.total = res.data.total;
- tableLoading.value = false;
+ // 瀵煎嚭鐢ㄥ嵃鐢宠
+ const { proxy } = getCurrentInstance();
+ const handleExport = () => {
+ proxy.download(
+ "/sealApplicationManagement/export",
+ { ...sealSearchForm },
+ "鐢ㄥ嵃鐢宠.xlsx"
+ );
+ };
- }).catch(err => {
- tableLoading.value = false;
- })
-}
+ // 鑾峰彇鍗扮珷鐢宠鍒楄〃鏁版嵁
+ const getSealApplicationList = async () => {
+ tableLoading.value = true;
+ listSealApplication(page, sealSearchForm)
+ .then(res => {
+ //鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭�
+ // 鑾峰彇褰撳墠鐧诲綍鐨勯儴闂ㄤ俊鎭苟杩囨护鏁版嵁
+ const currentFactoryName = userStore.currentFactoryName;
+ if (currentFactoryName) {
+ // 鏍规嵁currentFactoryName杩囨护鍑篸epartment鐩稿悓鐨勬暟鎹�
+ sealApplications.value = res.data.records.filter(
+ item => item.department === currentFactoryName
+ );
+ // 鏇存柊杩囨护鍚庣殑鎬绘暟
+ page.total = sealApplications.value.length;
+ } else {
+ // 濡傛灉娌℃湁currentFactoryName锛屽垯鏄剧ず鎵�鏈夋暟鎹�
+ sealApplications.value = res.data.records;
+ page.total = res.data.total;
+ }
+ // sealApplications.value = res.data.records
+ // page.value.total = res.data.total;
+ tableLoading.value = false;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
+ // 鑾峰彇瑙勭珷鍒跺害鍒楄〃鏁版嵁
+ const getRegulationList = async () => {
+ tableLoading.value = true;
+ listRuleManagement(page, regulationSearchForm)
+ .then(res => {
+ regulations.value = res.data.records;
+ // 杩囨护鎺夊凡搴熷純鐨勫埗搴�
+ // regulations.value = res.data.records.filter(item => item.status !== 'repealed')
+ page.total = res.data.total;
+ tableLoading.value = false;
+ })
+ .catch(err => {
+ tableLoading.value = false;
+ });
+ };
-onMounted(() => {
- // 鍒濆鍖�
- getSealApplicationList()
- getRegulationList()
-})
+ onMounted(() => {
+ // 鍒濆鍖�
+ getSealApplicationList();
+ getRegulationList();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.tab-content {
- padding: 20px 0;
-}
+ .tab-content {
+ padding: 20px 0;
+ }
-.mb-20 {
- margin-bottom: 20px;
-}
+ .mb-20 {
+ margin-bottom: 20px;
+ }
-.mt-20 {
- margin-top: 20px;
-}
+ .mt-20 {
+ margin-top: 20px;
+ }
-.ml-10 {
- margin-left: 10px;
-}
+ .ml-10 {
+ margin-left: 10px;
+ }
-.regulation-content {
- background-color: #f5f5f5;
- padding: 15px;
- border-radius: 4px;
- line-height: 1.6;
- white-space: pre-wrap;
- height: 200px;
-}
+ .regulation-content {
+ background-color: #f5f5f5;
+ padding: 15px;
+ border-radius: 4px;
+ line-height: 1.6;
+ white-space: pre-wrap;
+ height: 200px;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
</style>
diff --git a/src/views/equipmentManagement/defectManagement/index.vue b/src/views/equipmentManagement/defectManagement/index.vue
index f35454f..6456d71 100644
--- a/src/views/equipmentManagement/defectManagement/index.vue
+++ b/src/views/equipmentManagement/defectManagement/index.vue
@@ -2,27 +2,34 @@
<div class="defect-management">
<!-- 鎿嶄綔鎸夐挳 -->
<div class="actions">
- <el-button type="primary" @click="showRegisterDialog = true">鐧昏缂洪櫡</el-button>
+ <el-button type="primary"
+ @click="showRegisterDialog = true">鐧昏缂洪櫡</el-button>
</div>
-
<!-- 缂洪櫡鍒楄〃 -->
- <el-table :data="defectList" style="width: 100%; margin-top: 10px;" border>
- <el-table-column prop="deviceName" label="璁惧鍚嶇О" width="180"></el-table-column>
- <el-table-column prop="defectDescription" label="缂洪櫡鎻忚堪" win-width="300"></el-table-column>
- <el-table-column prop="status" label="鐘舵��" width="220">
+ <el-table :data="defectList"
+ style="width: 100%; margin-top: 10px;"
+ border>
+ <el-table-column prop="deviceName"
+ label="璁惧鍚嶇О"
+ width="180"></el-table-column>
+ <el-table-column prop="defectDescription"
+ label="缂洪櫡鎻忚堪"
+ win-width="300"></el-table-column>
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="220">
<template #default="{ row }">
<el-tag :type="row.status === '涓ラ噸缂洪櫡' ? 'danger' : 'success'">
{{ row.status }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="220">
+ <el-table-column label="鎿嶄綔"
+ width="220">
<template #default="{ row }">
- <el-button
- v-if="row.status === '涓ラ噸缂洪櫡' || row.status === '涓�鑸己闄�'"
- type="text"
- @click="eliminateDefect(row)"
- >
+ <el-button v-if="row.status === '涓ラ噸缂洪櫡' || row.status === '涓�鑸己闄�'"
+ type="text"
+ @click="eliminateDefect(row)">
娑堥櫎缂洪櫡
</el-button>
<!-- <el-button
@@ -32,30 +39,38 @@
>
杞淮淇崟
</el-button> -->
- <el-button type="text" @click="getLedger(row.deviceLedgerId)">
+ <el-button type="text"
+ @click="getLedger(row.deviceLedgerId)">
鏌ョ湅鍙拌处
</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 缂洪櫡鐧昏瀵硅瘽妗� -->
- <el-dialog title="鐧昏璁惧缂洪櫡" v-model="showRegisterDialog" width="50%">
- <el-form :model="defectForm" :rules="defectRules" ref="defectFormRef" label-width="100px">
- <el-form-item label="璁惧鍚嶇О" prop="deviceName">
- <el-select v-model="defectForm.deviceLedgerId" @change="setDeviceModel">
- <el-option
- v-for="(item, index) in deviceOptions"
- :key="index"
- :label="item.deviceName"
- :value="item.id"
- ></el-option>
+ <el-dialog title="鐧昏璁惧缂洪櫡"
+ v-model="showRegisterDialog"
+ width="50%">
+ <el-form :model="defectForm"
+ :rules="defectRules"
+ ref="defectFormRef"
+ label-width="100px">
+ <el-form-item label="璁惧鍚嶇О"
+ prop="deviceName">
+ <el-select v-model="defectForm.deviceLedgerId"
+ @change="setDeviceModel">
+ <el-option v-for="(item, index) in deviceOptions"
+ :key="index"
+ :label="item.deviceName"
+ :value="item.id"></el-option>
</el-select>
</el-form-item>
- <el-form-item label="缂洪櫡鎻忚堪" prop="defectDescription">
- <el-input type="textarea" v-model="defectForm.defectDescription"></el-input>
+ <el-form-item label="缂洪櫡鎻忚堪"
+ prop="defectDescription">
+ <el-input type="textarea"
+ v-model="defectForm.defectDescription"></el-input>
</el-form-item>
- <el-form-item label="璁惧鐘舵��" prop="status">
+ <el-form-item label="璁惧鐘舵��"
+ prop="status">
<el-radio-group v-model="defectForm.status">
<el-radio label="姝ｅ父">姝ｅ父</el-radio>
<el-radio label="涓�鑸己闄�">涓�鑸己闄�</el-radio>
@@ -65,157 +80,168 @@
</el-form>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="submitDefectForm">纭畾</el-button>
<el-button @click="showRegisterDialog = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitDefectForm">纭畾</el-button>
</span>
</template>
</el-dialog>
-
<!-- 缂洪櫡璁惧鍙拌处瀵硅瘽妗� -->
- <el-dialog title="缂洪櫡璁惧鍙拌处" v-model="showLedgerDialog" width="80%">
- <el-table :data="ledgerList" style="width: 100%; margin-top: 10px;" border>
- <el-table-column prop="deviceName" label="璁惧鍚嶇О"></el-table-column>
- <el-table-column prop="defectDescription" label="缂洪櫡鎻忚堪"></el-table-column>
- <el-table-column prop="status" label="鐘舵��"></el-table-column>
- <el-table-column prop="eliminateTime" label="娑堢己鏃堕棿"></el-table-column>
+ <el-dialog title="缂洪櫡璁惧鍙拌处"
+ v-model="showLedgerDialog"
+ width="80%">
+ <el-table :data="ledgerList"
+ style="width: 100%; margin-top: 10px;"
+ border>
+ <el-table-column prop="deviceName"
+ label="璁惧鍚嶇О"></el-table-column>
+ <el-table-column prop="defectDescription"
+ label="缂洪櫡鎻忚堪"></el-table-column>
+ <el-table-column prop="status"
+ label="鐘舵��"></el-table-column>
+ <el-table-column prop="eliminateTime"
+ label="娑堢己鏃堕棿"></el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<script setup>
-import { ref, reactive } from 'vue';
-import { ElMessage } from 'element-plus';
-import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
-// 鍋囪浠ヤ笅鏄悗绔帴鍙�
-import {
- registerDefect,
- getDefectList,
- eliminateDefect as apiEliminateDefect,
- getDefectLedger,
- deleteDefect
-} from '@/api/equipmentManagement/defectManagement';
+ import { ref, reactive } from "vue";
+ import { ElMessage } from "element-plus";
+ import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
+ // 鍋囪浠ヤ笅鏄悗绔帴鍙�
+ import {
+ registerDefect,
+ getDefectList,
+ eliminateDefect as apiEliminateDefect,
+ getDefectLedger,
+ deleteDefect,
+ } from "@/api/equipmentManagement/defectManagement";
-// 缂洪櫡鍒楄〃
-const defectList = ref([]);
-// 鐧昏瀵硅瘽妗嗘樉绀虹姸鎬�
-const showRegisterDialog = ref(false);
-// 鍙拌处瀵硅瘽妗嗘樉绀虹姸鎬�
-const showLedgerDialog = ref(false);
-// 缂洪櫡琛ㄥ崟
-const defectForm = reactive({
- deviceLedgerId: '',
- defectDescription: '',
- status: '',
-});
-const deviceOptions = ref([]);
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const defectRules = reactive({
- deviceLedgerId: [{ required: true, message: '璇疯緭鍏ヨ澶囧悕绉�', trigger: 'blur' }],
- defectDescription: [{ required: true, message: '璇疯緭鍏ョ己闄锋弿杩�', trigger: 'blur' }]
-});
-// 琛ㄥ崟寮曠敤
-const defectFormRef = ref(null);
-// 鍙拌处鍒楄〃
-const ledgerList = ref([]);
+ // 缂洪櫡鍒楄〃
+ const defectList = ref([]);
+ // 鐧昏瀵硅瘽妗嗘樉绀虹姸鎬�
+ const showRegisterDialog = ref(false);
+ // 鍙拌处瀵硅瘽妗嗘樉绀虹姸鎬�
+ const showLedgerDialog = ref(false);
+ // 缂洪櫡琛ㄥ崟
+ const defectForm = reactive({
+ deviceLedgerId: "",
+ defectDescription: "",
+ status: "",
+ });
+ const deviceOptions = ref([]);
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const defectRules = reactive({
+ deviceLedgerId: [
+ { required: true, message: "璇疯緭鍏ヨ澶囧悕绉�", trigger: "blur" },
+ ],
+ defectDescription: [
+ { required: true, message: "璇疯緭鍏ョ己闄锋弿杩�", trigger: "blur" },
+ ],
+ });
+ // 琛ㄥ崟寮曠敤
+ const defectFormRef = ref(null);
+ // 鍙拌处鍒楄〃
+ const ledgerList = ref([]);
-const loadDeviceName = async () => {
- const { data } = await getDeviceLedger();
- // console.log(data);
- deviceOptions.value = data;
-};
+ const loadDeviceName = async () => {
+ const { data } = await getDeviceLedger();
+ // console.log(data);
+ deviceOptions.value = data;
+ };
-// 鑾峰彇缂洪櫡鍒楄〃
-const fetchDefectList = async () => {
- try {
- const res = await getDefectList();
- if (res.code === 200) {
- defectList.value = res.data.records;
- } else {
- ElMessage.error(res.message || '鑾峰彇缂洪櫡鍒楄〃澶辫触');
+ // 鑾峰彇缂洪櫡鍒楄〃
+ const fetchDefectList = async () => {
+ try {
+ const res = await getDefectList();
+ if (res.code === 200) {
+ defectList.value = res.data.records;
+ } else {
+ ElMessage.error(res.message || "鑾峰彇缂洪櫡鍒楄〃澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("鑾峰彇缂洪櫡鍒楄〃澶辫触");
}
- } catch (error) {
- ElMessage.error('鑾峰彇缂洪櫡鍒楄〃澶辫触');
- }
-};
+ };
-// 鎻愪氦缂洪櫡鐧昏琛ㄥ崟
-const submitDefectForm = async () => {
- if (!defectFormRef.value) return;
- try {
- await defectFormRef.value.validate();
- const res = await registerDefect(defectForm);
- if (res.code === 200) {
- ElMessage.success('缂洪櫡鐧昏鎴愬姛');
- showRegisterDialog.value = false;
- fetchDefectList();
- } else {
- ElMessage.error(res.message || '缂洪櫡鐧昏澶辫触');
+ // 鎻愪氦缂洪櫡鐧昏琛ㄥ崟
+ const submitDefectForm = async () => {
+ if (!defectFormRef.value) return;
+ try {
+ await defectFormRef.value.validate();
+ const res = await registerDefect(defectForm);
+ if (res.code === 200) {
+ ElMessage.success("缂洪櫡鐧昏鎴愬姛");
+ showRegisterDialog.value = false;
+ fetchDefectList();
+ } else {
+ ElMessage.error(res.message || "缂洪櫡鐧昏澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("璇峰～鍐欏畬鏁磋〃鍗曚俊鎭�");
}
- } catch (error) {
- ElMessage.error('璇峰～鍐欏畬鏁磋〃鍗曚俊鎭�');
- }
-};
+ };
-// 娑堥櫎缂洪櫡
-const eliminateDefect = async (row) => {
-
- try {
- const res = await apiEliminateDefect(row);
- if (res.code === 200) {
- ElMessage.success('缂洪櫡娑堥櫎鎴愬姛');
- fetchDefectList();
- } else {
- ElMessage.error(res.message || '缂洪櫡娑堥櫎澶辫触');
+ // 娑堥櫎缂洪櫡
+ const eliminateDefect = async row => {
+ try {
+ const res = await apiEliminateDefect(row);
+ if (res.code === 200) {
+ ElMessage.success("缂洪櫡娑堥櫎鎴愬姛");
+ fetchDefectList();
+ } else {
+ ElMessage.error(res.message || "缂洪櫡娑堥櫎澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("缂洪櫡娑堥櫎澶辫触");
}
- } catch (error) {
- ElMessage.error('缂洪櫡娑堥櫎澶辫触');
- }
-};
+ };
-// // 杞淮淇伐鍗�
-// const transferToRepairOrder = async (id) => {
-// try {
-// const res = await transferToRepair(id);
-// if (res.code === 200) {
-// ElMessage.success('杞淮淇伐鍗曟垚鍔�');
-// } else {
-// ElMessage.error(res.message || '杞淮淇伐鍗曞け璐�');
-// }
-// } catch (error) {
-// ElMessage.error('杞淮淇伐鍗曞け璐�');
-// }
-// };
+ // // 杞淮淇伐鍗�
+ // const transferToRepairOrder = async (id) => {
+ // try {
+ // const res = await transferToRepair(id);
+ // if (res.code === 200) {
+ // ElMessage.success('杞淮淇伐鍗曟垚鍔�');
+ // } else {
+ // ElMessage.error(res.message || '杞淮淇伐鍗曞け璐�');
+ // }
+ // } catch (error) {
+ // ElMessage.error('杞淮淇伐鍗曞け璐�');
+ // }
+ // };
-// 鑾峰彇缂洪櫡璁惧鍙拌处
-const getLedger = async (deviceLedgerId) => {
- try {
- const res = await getDefectLedger(deviceLedgerId);
- if (res.code === 200) {
- ledgerList.value = res.data.records;
- showLedgerDialog.value = true;
- } else {
- ElMessage.error(res.message || '鑾峰彇缂洪櫡璁惧鍙拌处澶辫触');
+ // 鑾峰彇缂洪櫡璁惧鍙拌处
+ const getLedger = async deviceLedgerId => {
+ try {
+ const res = await getDefectLedger(deviceLedgerId);
+ if (res.code === 200) {
+ ledgerList.value = res.data.records;
+ showLedgerDialog.value = true;
+ } else {
+ ElMessage.error(res.message || "鑾峰彇缂洪櫡璁惧鍙拌处澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("鑾峰彇缂洪櫡璁惧鍙拌处澶辫触");
}
- } catch (error) {
- ElMessage.error('鑾峰彇缂洪櫡璁惧鍙拌处澶辫触');
- }
-};
+ };
-// 缁勪欢鎸傝浇鏃惰幏鍙栫己闄峰垪琛�
-const onMounted = () => {
- fetchDefectList();
- loadDeviceName();
-};
-onMounted();
+ // 缁勪欢鎸傝浇鏃惰幏鍙栫己闄峰垪琛�
+ const onMounted = () => {
+ fetchDefectList();
+ loadDeviceName();
+ };
+ onMounted();
</script>
<style scoped>
-.defect-management {
- padding: 20px;
-}
+ .defect-management {
+ padding: 20px;
+ }
-.actions {
- margin-bottom: 10px;
-}
+ .actions {
+ margin-bottom: 10px;
+ }
</style>
\ No newline at end of file
diff --git a/src/views/equipmentManagement/inspectionManagement/components/formDia.vue b/src/views/equipmentManagement/inspectionManagement/components/formDia.vue
index 82837af..f33d629 100644
--- a/src/views/equipmentManagement/inspectionManagement/components/formDia.vue
+++ b/src/views/equipmentManagement/inspectionManagement/components/formDia.vue
@@ -1,247 +1,288 @@
<template>
- <div>
- <el-dialog :title="operationType === 'add' ? '鏂板宸℃浠诲姟' : '缂栬緫宸℃浠诲姟'"
- v-model="dialogVisitable" width="800px" @close="cancel">
- <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
- <el-row>
- <el-col :span="12">
- <el-form-item label="璁惧鍚嶇О" prop="taskId">
- <el-select v-model="form.taskId" @change="setDeviceModel" filterable>
- <el-option
- v-for="(item, index) in deviceOptions"
- :key="index"
- :label="item.deviceName"
- :value="item.id"
- ></el-option>
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="宸℃浜�" prop="inspector">
- <el-select v-model="form.inspector" filterable
- default-first-option
- :reserve-keyword="false" placeholder="璇烽�夋嫨" multiple clearable>
- <el-option v-for="item in userList" :label="item.nickName" :value="item.userId" :key="item.userId"/>
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span="12">
- <el-form-item label="澶囨敞" prop="remarks">
- <el-input v-model="form.remarks" placeholder="璇疯緭鍏ュ娉�" type="textarea" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="鐧昏鏃堕棿" prop="dateStr">
- <el-date-picker
- v-model="form.dateStr"
- type="date"
- placeholder="閫夋嫨鐧昏鏃ユ湡"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- style="width: 100%"
- />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span="12">
- <el-form-item label="浠诲姟棰戠巼" prop="frequencyType">
- <el-select v-model="form.frequencyType" placeholder="璇烽�夋嫨" clearable>
- <el-option label="姣忔棩" value="DAILY"/>
- <el-option label="姣忓懆" value="WEEKLY"/>
- <el-option label="姣忔湀" value="MONTHLY"/>
- <!-- <el-option label="瀛ｅ害" value="QUARTERLY"/> -->
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :span="12" v-if="form.frequencyType === 'DAILY' && form.frequencyType">
- <el-form-item label="鏃ユ湡" prop="frequencyDetail">
- <el-time-picker v-model="form.frequencyDetail" placeholder="閫夋嫨鏃堕棿" format="HH:mm"
- value-format="HH:mm" />
- </el-form-item>
- </el-col>
- <el-col :span="12" v-if="form.frequencyType === 'WEEKLY' && form.frequencyType">
- <el-form-item label="鏃ユ湡" prop="frequencyDetail">
- <el-select v-model="form.week" placeholder="璇烽�夋嫨" clearable style="width: 50%">
- <el-option label="鍛ㄤ竴" value="MON"/>
- <el-option label="鍛ㄤ簩" value="TUE"/>
- <el-option label="鍛ㄤ笁" value="WED"/>
- <el-option label="鍛ㄥ洓" value="THU"/>
- <el-option label="鍛ㄤ簲" value="FRI"/>
- <el-option label="鍛ㄥ叚" value="SAT"/>
- <el-option label="鍛ㄦ棩" value="SUN"/>
- </el-select>
- <el-time-picker v-model="form.time" placeholder="閫夋嫨鏃堕棿" format="HH:mm"
- value-format="HH:mm" style="width: 50%"/>
- </el-form-item>
- </el-col>
- <el-col :span="12" v-if="form.frequencyType === 'MONTHLY' && form.frequencyType">
- <el-form-item label="鏃ユ湡" prop="frequencyDetail">
- <el-date-picker
- v-model="form.frequencyDetail"
- type="datetime"
- clearable
- placeholder="閫夋嫨寮�濮嬫棩鏈�"
- format="DD,HH:mm"
- value-format="DD,HH:mm"
- />
- </el-form-item>
- </el-col>
- <el-col :span="12" v-if="form.frequencyType === 'QUARTERLY' && form.frequencyType">
- <el-form-item label="鏃ユ湡" prop="frequencyDetail">
- <el-date-picker
- v-model="form.frequencyDetail"
- type="datetime"
- clearable
- placeholder="閫夋嫨寮�濮嬫棩鏈�"
- format="MM,DD,HH:mm"
- value-format="MM,DD,HH:mm"
- />
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- <template #footer>
- <div class="dialog-footer">
- <el-button @click="cancel">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">淇濆瓨</el-button>
- </div>
- </template>
- </el-dialog>
- </div>
+ <div>
+ <el-dialog :title="operationType === 'add' ? '鏂板宸℃浠诲姟' : '缂栬緫宸℃浠诲姟'"
+ v-model="dialogVisitable"
+ width="800px"
+ @close="cancel">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="120px">
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="璁惧鍚嶇О"
+ prop="taskId">
+ <el-select v-model="form.taskId"
+ @change="setDeviceModel"
+ filterable>
+ <el-option v-for="(item, index) in deviceOptions"
+ :key="index"
+ :label="item.deviceName"
+ :value="item.id"></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="宸℃浜�"
+ prop="inspector">
+ <el-select v-model="form.inspector"
+ filterable
+ default-first-option
+ :reserve-keyword="false"
+ placeholder="璇烽�夋嫨"
+ multiple
+ clearable>
+ <el-option v-for="item in userList"
+ :label="item.nickName"
+ :value="item.userId"
+ :key="item.userId" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="澶囨敞"
+ prop="remarks">
+ <el-input v-model="form.remarks"
+ placeholder="璇疯緭鍏ュ娉�"
+ type="textarea" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鐧昏鏃堕棿"
+ prop="dateStr">
+ <el-date-picker v-model="form.dateStr"
+ type="date"
+ placeholder="閫夋嫨鐧昏鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ style="width: 100%" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="浠诲姟棰戠巼"
+ prop="frequencyType">
+ <el-select v-model="form.frequencyType"
+ placeholder="璇烽�夋嫨"
+ clearable>
+ <el-option label="姣忔棩"
+ value="DAILY" />
+ <el-option label="姣忓懆"
+ value="WEEKLY" />
+ <el-option label="姣忔湀"
+ value="MONTHLY" />
+ <!-- <el-option label="瀛ｅ害" value="QUARTERLY"/> -->
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12"
+ v-if="form.frequencyType === 'DAILY' && form.frequencyType">
+ <el-form-item label="鏃ユ湡"
+ prop="frequencyDetail">
+ <el-time-picker v-model="form.frequencyDetail"
+ placeholder="閫夋嫨鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12"
+ v-if="form.frequencyType === 'WEEKLY' && form.frequencyType">
+ <el-form-item label="鏃ユ湡"
+ prop="frequencyDetail">
+ <el-select v-model="form.week"
+ placeholder="璇烽�夋嫨"
+ clearable
+ style="width: 50%">
+ <el-option label="鍛ㄤ竴"
+ value="MON" />
+ <el-option label="鍛ㄤ簩"
+ value="TUE" />
+ <el-option label="鍛ㄤ笁"
+ value="WED" />
+ <el-option label="鍛ㄥ洓"
+ value="THU" />
+ <el-option label="鍛ㄤ簲"
+ value="FRI" />
+ <el-option label="鍛ㄥ叚"
+ value="SAT" />
+ <el-option label="鍛ㄦ棩"
+ value="SUN" />
+ </el-select>
+ <el-time-picker v-model="form.time"
+ placeholder="閫夋嫨鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 50%" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12"
+ v-if="form.frequencyType === 'MONTHLY' && form.frequencyType">
+ <el-form-item label="鏃ユ湡"
+ prop="frequencyDetail">
+ <el-date-picker v-model="form.frequencyDetail"
+ type="datetime"
+ clearable
+ placeholder="閫夋嫨寮�濮嬫棩鏈�"
+ format="DD,HH:mm"
+ value-format="DD,HH:mm" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12"
+ v-if="form.frequencyType === 'QUARTERLY' && form.frequencyType">
+ <el-form-item label="鏃ユ湡"
+ prop="frequencyDetail">
+ <el-date-picker v-model="form.frequencyDetail"
+ type="datetime"
+ clearable
+ placeholder="閫夋嫨寮�濮嬫棩鏈�"
+ format="MM,DD,HH:mm"
+ value-format="MM,DD,HH:mm" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">淇濆瓨</el-button>
+ <el-button @click="cancel">鍙栨秷</el-button>
+ </div>
+ </template>
+ </el-dialog>
+ </div>
</template>
<script setup>
-import {reactive, ref} from "vue";
-import useUserStore from '@/store/modules/user'
-import {addOrEditTimingTask} from "@/api/inspectionManagement/index.js";
-import {userListNoPageByTenantId} from "@/api/system/user.js";
-import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
+ import { reactive, ref } from "vue";
+ import useUserStore from "@/store/modules/user";
+ import { addOrEditTimingTask } from "@/api/inspectionManagement/index.js";
+ import { userListNoPageByTenantId } from "@/api/system/user.js";
+ import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
-const { proxy } = getCurrentInstance()
-const emit = defineEmits()
-const userStore = useUserStore()
-const dialogVisitable = ref(false);
-const operationType = ref('add');
-const deviceOptions = ref([]);
-const data = reactive({
- form: {
- taskId: undefined,
- taskName: undefined,
- inspector: '',
- inspectorIds: '',
- remarks: '',
- frequencyType: '',
- frequencyDetail: '',
- week: '',
- time: '',
- dateStr: ''
- },
- rules: {
- taskId: [{ required: true, message: "璇烽�夋嫨璁惧", trigger: "change" },],
- inspector: [{ required: true, message: "璇疯緭鍏ュ贰妫�浜�", trigger: "blur" },],
- dateStr: [{ required: true, message: "璇烽�夋嫨鐧昏鏃堕棿", trigger: "change" }]
- }
-})
-const { form, rules } = toRefs(data)
-const userList = ref([])
+ const { proxy } = getCurrentInstance();
+ const emit = defineEmits();
+ const userStore = useUserStore();
+ const dialogVisitable = ref(false);
+ const operationType = ref("add");
+ const deviceOptions = ref([]);
+ const data = reactive({
+ form: {
+ taskId: undefined,
+ taskName: undefined,
+ inspector: "",
+ inspectorIds: "",
+ remarks: "",
+ frequencyType: "",
+ frequencyDetail: "",
+ week: "",
+ time: "",
+ dateStr: "",
+ },
+ rules: {
+ taskId: [{ required: true, message: "璇烽�夋嫨璁惧", trigger: "change" }],
+ inspector: [{ required: true, message: "璇疯緭鍏ュ贰妫�浜�", trigger: "blur" }],
+ dateStr: [{ required: true, message: "璇烽�夋嫨鐧昏鏃堕棿", trigger: "change" }],
+ },
+ });
+ const { form, rules } = toRefs(data);
+ const userList = ref([]);
-const loadDeviceName = async () => {
- const { data } = await getDeviceLedger();
- deviceOptions.value = data;
-};
+ const loadDeviceName = async () => {
+ const { data } = await getDeviceLedger();
+ deviceOptions.value = data;
+ };
-const setDeviceModel = (id) => {
- const option = deviceOptions.value.find((item) => item.id === id);
- if (option) {
- form.value.taskName = option.deviceName;
- }
-}
+ const setDeviceModel = id => {
+ const option = deviceOptions.value.find(item => item.id === id);
+ if (option) {
+ form.value.taskName = option.deviceName;
+ }
+ };
-// 鎵撳紑寮规
-const openDialog = async (type, row) => {
- dialogVisitable.value = true
- operationType.value = type
-
- // 閲嶇疆琛ㄥ崟
- resetForm();
-
- // 鍔犺浇鐢ㄦ埛鍒楄〃
- userListNoPageByTenantId().then((res) => {
- userList.value = res.data;
- });
-
- // 鍔犺浇璁惧鍒楄〃
- await loadDeviceName();
-
- if (type === 'edit' && row) {
- form.value = {...row}
- form.value.inspector = form.value.inspectorIds.split(',').map(Number)
-
- // 濡傛灉鏈夎澶嘔D锛岃嚜鍔ㄨ缃澶囦俊鎭�
- if (form.value.taskId) {
- setDeviceModel(form.value.taskId);
- }
- }
-}
+ // 鎵撳紑寮规
+ const openDialog = async (type, row) => {
+ dialogVisitable.value = true;
+ operationType.value = type;
-// 鍏抽棴瀵硅瘽妗�
-const cancel = () => {
- resetForm()
- dialogVisitable.value = false
- emit('closeDia')
-}
+ // 閲嶇疆琛ㄥ崟
+ resetForm();
-// 閲嶇疆琛ㄥ崟鍑芥暟
-const resetForm = () => {
- if (proxy.$refs.formRef) {
- proxy.$refs.formRef.resetFields()
- }
- // 閲嶇疆琛ㄥ崟鏁版嵁纭繚璁惧淇℃伅姝ｇ‘閲嶇疆
- form.value = {
- taskId: undefined,
- taskName: undefined,
- inspector: '',
- inspectorIds: '',
- remarks: '',
- frequencyType: '',
- frequencyDetail: '',
- week: '',
- time: ''
- }
-}
+ // 鍔犺浇鐢ㄦ埛鍒楄〃
+ userListNoPageByTenantId().then(res => {
+ userList.value = res.data;
+ });
-// 鎻愪氦琛ㄥ崟
-const submitForm = () => {
- proxy.$refs["formRef"].validate(async valid => {
- if (valid) {
- try {
- form.value.inspectorIds = form.value.inspector.join(',')
- delete form.value.inspector
-
- if (form.value.frequencyType === 'WEEKLY') {
- let frequencyDetail = ''
- frequencyDetail = form.value.week + ',' + form.value.time
- form.value.frequencyDetail = frequencyDetail
- }
-
- let res = await userStore.getInfo()
- form.value.registrantId = res.user.userId
-
- await addOrEditTimingTask(form.value)
- cancel()
- proxy.$modal.msgSuccess('鎻愪氦鎴愬姛')
- } catch (error) {
- proxy.$modal.msgError('鎻愪氦澶辫触锛岃閲嶈瘯')
- }
- }
- })
-}
-defineExpose({ openDialog })
+ // 鍔犺浇璁惧鍒楄〃
+ await loadDeviceName();
+
+ if (type === "edit" && row) {
+ form.value = { ...row };
+ form.value.inspector = form.value.inspectorIds.split(",").map(Number);
+
+ // 濡傛灉鏈夎澶嘔D锛岃嚜鍔ㄨ缃澶囦俊鎭�
+ if (form.value.taskId) {
+ setDeviceModel(form.value.taskId);
+ }
+ }
+ };
+
+ // 鍏抽棴瀵硅瘽妗�
+ const cancel = () => {
+ resetForm();
+ dialogVisitable.value = false;
+ emit("closeDia");
+ };
+
+ // 閲嶇疆琛ㄥ崟鍑芥暟
+ const resetForm = () => {
+ if (proxy.$refs.formRef) {
+ proxy.$refs.formRef.resetFields();
+ }
+ // 閲嶇疆琛ㄥ崟鏁版嵁纭繚璁惧淇℃伅姝ｇ‘閲嶇疆
+ form.value = {
+ taskId: undefined,
+ taskName: undefined,
+ inspector: "",
+ inspectorIds: "",
+ remarks: "",
+ frequencyType: "",
+ frequencyDetail: "",
+ week: "",
+ time: "",
+ };
+ };
+
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = () => {
+ proxy.$refs["formRef"].validate(async valid => {
+ if (valid) {
+ try {
+ form.value.inspectorIds = form.value.inspector.join(",");
+ delete form.value.inspector;
+
+ if (form.value.frequencyType === "WEEKLY") {
+ let frequencyDetail = "";
+ frequencyDetail = form.value.week + "," + form.value.time;
+ form.value.frequencyDetail = frequencyDetail;
+ }
+
+ let res = await userStore.getInfo();
+ form.value.registrantId = res.user.userId;
+
+ await addOrEditTimingTask(form.value);
+ cancel();
+ proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
+ } catch (error) {
+ proxy.$modal.msgError("鎻愪氦澶辫触锛岃閲嶈瘯");
+ }
+ }
+ });
+ };
+ defineExpose({ openDialog });
</script>
<style scoped>
-
</style>
\ No newline at end of file
diff --git a/src/views/equipmentManagement/spareParts/index.vue b/src/views/equipmentManagement/spareParts/index.vue
index f91d76f..a971d36 100644
--- a/src/views/equipmentManagement/spareParts/index.vue
+++ b/src/views/equipmentManagement/spareParts/index.vue
@@ -2,91 +2,114 @@
<div class="spare-part-category">
<div class="table_list">
<div class="actions">
- <el-text class="mx-1" size="large">璁惧鍒嗙被</el-text>
+ <el-text class="mx-1"
+ size="large">璁惧鍒嗙被</el-text>
<div>
- <el-button @click="fetchTreeData" :loading="loading">鍒锋柊</el-button>
- <el-button type="primary" @click="addCategory" >鏂板</el-button>
+ <el-button @click="fetchTreeData"
+ :loading="loading">鍒锋柊</el-button>
+ <el-button type="primary"
+ @click="addCategory">鏂板</el-button>
</div>
</div>
- <el-table
- v-loading="loading"
- :data="renderTableData"
- style="width: 100%; margin-top: 10px;"
- border
- row-key="id"
- :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
- >
- <el-table-column prop="name" label="鍒嗙被鍚嶇О" width="450">
+ <el-table v-loading="loading"
+ :data="renderTableData"
+ style="width: 100%; margin-top: 10px;"
+ border
+ row-key="id"
+ :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+ <el-table-column prop="name"
+ label="鍒嗙被鍚嶇О"
+ width="450">
<template #default="{ row }">
<span :style="{ paddingLeft: getIndentation(row) + 'px' }">
{{ row.name }}
</span>
</template>
</el-table-column>
- <el-table-column prop="sparePartsNo" label="鍒嗙被缂栧彿" width="200"></el-table-column>
- <el-table-column prop="status" label="鐘舵��" width="100">
+ <el-table-column prop="sparePartsNo"
+ label="鍒嗙被缂栧彿"
+ width="200"></el-table-column>
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
<template #default="{ row }">
- <el-tag type="success" size="small">{{ row.status }}</el-tag>
+ <el-tag type="success"
+ size="small">{{ row.status }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="description" label="鎻忚堪" win-width="330"></el-table-column>
- <el-table-column label="鎿嶄綔" width="180" fixed="right">
+ <el-table-column prop="description"
+ label="鎻忚堪"
+ win-width="330"></el-table-column>
+ <el-table-column label="鎿嶄綔"
+ width="180"
+ fixed="right">
<template #default="{ row }">
- <el-button
- type="text"
- size="small"
- @click="() => editCategory(row)"
- :disabled="loading"
- >
+ <el-button type="text"
+ size="small"
+ @click="() => editCategory(row)"
+ :disabled="loading">
缂栬緫
</el-button>
- <el-button
- type="text"
- size="small"
- @click="() => deleteCategory(row.id)"
- style="color: #f56c6c;"
- :disabled="loading"
- >
+ <el-button type="text"
+ size="small"
+ @click="() => deleteCategory(row.id)"
+ style="color: #f56c6c;"
+ :disabled="loading">
鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
</div>
- <el-dialog title="鍒嗙被绠＄悊" v-model="dialogVisible" width="60%">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
- <el-form-item label="鍒嗙被鍚嶇О" prop="name">
+ <el-dialog title="鍒嗙被绠＄悊"
+ v-model="dialogVisible"
+ width="60%">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
+ <el-form-item label="鍒嗙被鍚嶇О"
+ prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
- <el-form-item label="鍒嗙被缂栧彿" prop="sparePartsNo">
+ <el-form-item label="鍒嗙被缂栧彿"
+ prop="sparePartsNo">
<el-input v-model="form.sparePartsNo"></el-input>
</el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��">
- <el-option label="姝ｅ父" value="姝ｅ父"></el-option>
- <el-option label="绂佺敤" value="绂佺敤"></el-option>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��">
+ <el-option label="姝ｅ父"
+ value="姝ｅ父"></el-option>
+ <el-option label="绂佺敤"
+ value="绂佺敤"></el-option>
</el-select>
</el-form-item>
- <el-form-item label="鎻忚堪" prop="description">
+ <el-form-item label="鎻忚堪"
+ prop="description">
<el-input v-model="form.description"></el-input>
</el-form-item>
- <el-form-item label="涓婄骇鍒嗙被" prop="parentId">
- <el-select v-model="form.parentId" placeholder="璇烽�夋嫨涓婄骇鍒嗙被">
- <el-option label="鏃犱笂绾у垎绫�" :value="null"></el-option>
- <el-option
- v-for="(item, index) in categories"
- :key="index"
- :label="item.name"
- :value="item.id"
-
- ></el-option>
+ <el-form-item label="涓婄骇鍒嗙被"
+ prop="parentId">
+ <el-select v-model="form.parentId"
+ placeholder="璇烽�夋嫨涓婄骇鍒嗙被">
+ <el-option label="鏃犱笂绾у垎绫�"
+ :value="null"></el-option>
+ <el-option v-for="(item, index) in categories"
+ :key="index"
+ :label="item.name"
+ :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
- <el-button @click="dialogVisible = false" :disabled="formLoading">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm" :loading="formLoading">纭畾</el-button>
+ <el-button type="primary"
+ @click="submitForm"
+ :loading="formLoading">纭畾</el-button>
+ <el-button @click="dialogVisible = false"
+ :disabled="formLoading">鍙栨秷</el-button>
</span>
</template>
</el-dialog>
@@ -94,324 +117,326 @@
</template>
<script setup>
-import { ref, computed, onMounted, reactive, watch } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { getSparePartsList, addSparePart, editSparePart, delSparePart,getSparePartsTree } from "@/api/equipmentManagement/spareParts";
+ import { ref, computed, onMounted, reactive, watch } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import {
+ getSparePartsList,
+ addSparePart,
+ editSparePart,
+ delSparePart,
+ getSparePartsTree,
+ } from "@/api/equipmentManagement/spareParts";
-// 鍔犺浇鐘舵��
-const loading = ref(false);
-const formLoading = ref(false);
-// 瀵硅瘽妗嗘樉绀虹姸鎬�
-const dialogVisible = ref(false);
-// 缂栬緫 ID
-const editId = ref(null);
-// 琛ㄦ牸鏁版嵁
-const categories = ref([]);
-// 娓叉煋鐢ㄧ殑琛ㄦ牸鏁版嵁
-// const renderTableData = computed(() => buildTree(categories.value));
-const renderTableData = ref([]);
-const operationType = ref('add')
-// 琛ㄥ崟寮曠敤
-const formRef = ref(null);
-// 琛ㄥ崟鏁版嵁
-const form = reactive({
- id:'',
- name: '',
- sparePartsNo: '',
- status: '',
- description: '',
- parentId: null
-});
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = reactive({
- name: [
- { required: true, message: '璇疯緭鍏ュ垎绫诲悕绉�', trigger: 'blur' }
- ],
- sparePartsNo: [
- { required: true, message: '璇疯緭鍏ュ垎绫荤紪鍙�', trigger: 'blur' }
- ],
- status: [
- { required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }
- ]
-});
-// 鑾峰彇缂╄繘閲�
-const getIndentation = (row) => {
- // 杩欓噷绠�鍗曡繑鍥� 20锛屽彲鏍规嵁瀹為檯闇�姹傚疄鐜板眰绾х缉杩涢�昏緫
- return 20;
-};
-// 瀹氫箟 buildTree 鍑芥暟
-const buildTree = (flatData) => {
- const map = {};
- const result = [];
- if(flatData){
- return result;
- }
- flatData.forEach(item => {
- map[item.id] = { ...item, children: [] };
+ // 鍔犺浇鐘舵��
+ const loading = ref(false);
+ const formLoading = ref(false);
+ // 瀵硅瘽妗嗘樉绀虹姸鎬�
+ const dialogVisible = ref(false);
+ // 缂栬緫 ID
+ const editId = ref(null);
+ // 琛ㄦ牸鏁版嵁
+ const categories = ref([]);
+ // 娓叉煋鐢ㄧ殑琛ㄦ牸鏁版嵁
+ // const renderTableData = computed(() => buildTree(categories.value));
+ const renderTableData = ref([]);
+ const operationType = ref("add");
+ // 琛ㄥ崟寮曠敤
+ const formRef = ref(null);
+ // 琛ㄥ崟鏁版嵁
+ const form = reactive({
+ id: "",
+ name: "",
+ sparePartsNo: "",
+ status: "",
+ description: "",
+ parentId: null,
});
- flatData.forEach(item => {
- if (item.parentId === null || !map[item.parentId]) {
- result.push(map[item.id]);
- } else {
- map[item.parentId].children.push(map[item.id]);
- }
+
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = reactive({
+ name: [{ required: true, message: "璇疯緭鍏ュ垎绫诲悕绉�", trigger: "blur" }],
+ sparePartsNo: [
+ { required: true, message: "璇疯緭鍏ュ垎绫荤紪鍙�", trigger: "blur" },
+ ],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
});
- return result;
-};
-//鑾峰彇鏍戝舰缁撴瀯
-const fetchTreeData = async () => {
- fetchCategories();
- try {
- const res = await getSparePartsTree();
- if (res.code === 200) {
- renderTableData.value = res.data;
- } else {
- ElMessage.error(res.message || '鑾峰彇鍒嗙被鍒楄〃澶辫触');
+ // 鑾峰彇缂╄繘閲�
+ const getIndentation = row => {
+ // 杩欓噷绠�鍗曡繑鍥� 20锛屽彲鏍规嵁瀹為檯闇�姹傚疄鐜板眰绾х缉杩涢�昏緫
+ return 20;
+ };
+ // 瀹氫箟 buildTree 鍑芥暟
+ const buildTree = flatData => {
+ const map = {};
+ const result = [];
+ if (flatData) {
+ return result;
}
- }catch (error) {
- ElMessage.error('鑾峰彇鍒嗙被鍒楄〃澶辫触');
- }
-}
-
-// 鑾峰彇鍒嗙被鍒楄〃
-const fetchCategories = async () => {
- loading.value = true;
- try {
- const res = await getSparePartsList();
- if (res.code === 200) {
- categories.value = res.data.records;
- } else {
- ElMessage.error(res.message || '鑾峰彇鍒嗙被鍒楄〃澶辫触');
- }
- } catch (error) {
- ElMessage.error('鑾峰彇鍒嗙被鍒楄〃澶辫触');
- } finally {
- loading.value = false;
- }
-};
-
-// 鏂板鍒嗙被
-const addCategory = () => {
- form.id = '';
- form.name = '';
- form.sparePartsNo = '';
- form.status = '';
- form.description = '';
- form.parentId = null;
- operationType.value = 'add'
- dialogVisible.value = true;
- console.log('dialogVisible 鏇存柊涓�', dialogVisible.value);
-};
-
-// 缂栬緫鍒嗙被
-const editCategory = (row) => {
- Object.assign(form, row);
- operationType.value = 'edit'
- dialogVisible.value = true;
-};
-
-// 鍒犻櫎鍒嗙被
-const deleteCategory = async (id) => {
- try {
- await ElMessageBox.confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ュ垎绫伙紝鏄惁缁х画?', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
+ flatData.forEach(item => {
+ map[item.id] = { ...item, children: [] };
});
- loading.value = true;
- const res = await delSparePart(id);
- if (res.code === 200) {
- ElMessage.success('鍒犻櫎鎴愬姛');
- fetchTreeData();
- } else {
- ElMessage.error(res.message || '鍒犻櫎澶辫触');
- }
- } catch (error) {
- if (error !== 'cancel') {
- ElMessage.error('鍒犻櫎澶辫触');
- }
- } finally {
- loading.value = false;
- }
-};
-
-// 鎻愪氦琛ㄥ崟
-const submitForm = async () => {
- if (!formRef.value) return;
- try {
- await formRef.value.validate();
- formLoading.value = true;
- if (operationType.value === 'edit') {
- let res = await editSparePart(form);
- if (res.code === 200) {
- ElMessage.success('缂栬緫鎴愬姛');
- dialogVisible.value = false;
- fetchTreeData();
- }
- } else {
- let res = await addSparePart(form);
- if (res.code === 200) {
- ElMessage.success('缂栬緫鎴愬姛');
- dialogVisible.value = false;
- fetchTreeData();
+ flatData.forEach(item => {
+ if (item.parentId === null || !map[item.parentId]) {
+ result.push(map[item.id]);
+ } else {
+ map[item.parentId].children.push(map[item.id]);
}
+ });
+ return result;
+ };
+ //鑾峰彇鏍戝舰缁撴瀯
+ const fetchTreeData = async () => {
+ fetchCategories();
+ try {
+ const res = await getSparePartsTree();
+ if (res.code === 200) {
+ renderTableData.value = res.data;
+ } else {
+ ElMessage.error(res.message || "鑾峰彇鍒嗙被鍒楄〃澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("鑾峰彇鍒嗙被鍒楄〃澶辫触");
}
- } catch (error) {
- ElMessage.error('璇峰～鍐欏畬鏁磋〃鍗曚俊鎭�');
- } finally {
- formLoading.value = false;
- }
-};
+ };
-// 缁勪欢鎸傝浇鏃惰幏鍙栧垎绫诲垪琛�
-onMounted(() => {
- fetchCategories();
- fetchTreeData();
-});
+ // 鑾峰彇鍒嗙被鍒楄〃
+ const fetchCategories = async () => {
+ loading.value = true;
+ try {
+ const res = await getSparePartsList();
+ if (res.code === 200) {
+ categories.value = res.data.records;
+ } else {
+ ElMessage.error(res.message || "鑾峰彇鍒嗙被鍒楄〃澶辫触");
+ }
+ } catch (error) {
+ ElMessage.error("鑾峰彇鍒嗙被鍒楄〃澶辫触");
+ } finally {
+ loading.value = false;
+ }
+ };
+
+ // 鏂板鍒嗙被
+ const addCategory = () => {
+ form.id = "";
+ form.name = "";
+ form.sparePartsNo = "";
+ form.status = "";
+ form.description = "";
+ form.parentId = null;
+ operationType.value = "add";
+ dialogVisible.value = true;
+ console.log("dialogVisible 鏇存柊涓�", dialogVisible.value);
+ };
+
+ // 缂栬緫鍒嗙被
+ const editCategory = row => {
+ Object.assign(form, row);
+ operationType.value = "edit";
+ dialogVisible.value = true;
+ };
+
+ // 鍒犻櫎鍒嗙被
+ const deleteCategory = async id => {
+ try {
+ await ElMessageBox.confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ュ垎绫伙紝鏄惁缁х画?", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ });
+ loading.value = true;
+ const res = await delSparePart(id);
+ if (res.code === 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ fetchTreeData();
+ } else {
+ ElMessage.error(res.message || "鍒犻櫎澶辫触");
+ }
+ } catch (error) {
+ if (error !== "cancel") {
+ ElMessage.error("鍒犻櫎澶辫触");
+ }
+ } finally {
+ loading.value = false;
+ }
+ };
+
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ if (!formRef.value) return;
+ try {
+ await formRef.value.validate();
+ formLoading.value = true;
+ if (operationType.value === "edit") {
+ let res = await editSparePart(form);
+ if (res.code === 200) {
+ ElMessage.success("缂栬緫鎴愬姛");
+ dialogVisible.value = false;
+ fetchTreeData();
+ }
+ } else {
+ let res = await addSparePart(form);
+ if (res.code === 200) {
+ ElMessage.success("缂栬緫鎴愬姛");
+ dialogVisible.value = false;
+ fetchTreeData();
+ }
+ }
+ } catch (error) {
+ ElMessage.error("璇峰～鍐欏畬鏁磋〃鍗曚俊鎭�");
+ } finally {
+ formLoading.value = false;
+ }
+ };
+
+ // 缁勪欢鎸傝浇鏃惰幏鍙栧垎绫诲垪琛�
+ onMounted(() => {
+ fetchCategories();
+ fetchTreeData();
+ });
</script>
<style scoped>
-.spare-part-category {
- padding: 20px;
-}
-.table_list {
- margin-top: unset;
-}
-.actions {
- display: flex;
- justify-content: space-between;
- margin-bottom: 10px;
- align-items: center;
-}
+ .spare-part-category {
+ padding: 20px;
+ }
+ .table_list {
+ margin-top: unset;
+ }
+ .actions {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 10px;
+ align-items: center;
+ }
-/* 宓屽鏍戝舰缁撴瀯鏍峰紡 */
-.nested-tree-node {
- display: flex;
- align-items: center;
- justify-content: space-between;
- width: 100%;
- padding: 0 4px;
- height: 30px;
- line-height: 30px;
-}
+ /* 宓屽鏍戝舰缁撴瀯鏍峰紡 */
+ .nested-tree-node {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+ padding: 0 4px;
+ height: 30px;
+ line-height: 30px;
+ }
-.category-code {
- color: #606266;
- font-size: 12px;
- margin-left: 8px;
-}
+ .category-code {
+ color: #606266;
+ font-size: 12px;
+ margin-left: 8px;
+ }
-.tree-actions {
- display: flex;
- align-items: center;
- gap: 8px;
- margin-left: auto;
-}
+ .tree-actions {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ margin-left: auto;
+ }
-/* 琛ㄦ牸鏍峰紡璋冩暣 */
-.el-table {
- font-size: 14px;
-}
+ /* 琛ㄦ牸鏍峰紡璋冩暣 */
+ .el-table {
+ font-size: 14px;
+ }
-.el-table__header-wrapper th {
- background-color: #f5f7fa;
- font-weight: 600;
-}
+ .el-table__header-wrapper th {
+ background-color: #f5f7fa;
+ font-weight: 600;
+ }
-.el-table__row:hover > td {
- background-color: #fafafa;
-}
+ .el-table__row:hover > td {
+ background-color: #fafafa;
+ }
-/* 宓屽鏍戝舰缁撴瀯鐗瑰畾鏍峰紡 */
-.nested-tree {
- background-color: transparent;
-}
+ /* 宓屽鏍戝舰缁撴瀯鐗瑰畾鏍峰紡 */
+ .nested-tree {
+ background-color: transparent;
+ }
-.nested-tree .el-tree-node__content {
- height: auto;
- background-color: transparent;
-}
+ .nested-tree .el-tree-node__content {
+ height: auto;
+ background-color: transparent;
+ }
-/* 鎼滅储妗嗘牱寮忚皟鏁� */
-.actions .el-input {
- margin-right: 10px;
- width: 200px;
-}
+ /* 鎼滅储妗嗘牱寮忚皟鏁� */
+ .actions .el-input {
+ margin-right: 10px;
+ width: 200px;
+ }
-/* 鎸夐挳缁勬牱寮� */
-.actions > div {
- display: flex;
- gap: 10px;
-}
+ /* 鎸夐挳缁勬牱寮� */
+ .actions > div {
+ display: flex;
+ gap: 10px;
+ }
-/* 纭繚琛ㄦ牸涓殑鎿嶄綔鎸夐挳涓嶄細琚埅鏂� */
-.el-table-column--fixed-right .el-button {
- margin: 0 2px;
-}
+ /* 纭繚琛ㄦ牸涓殑鎿嶄綔鎸夐挳涓嶄細琚埅鏂� */
+ .el-table-column--fixed-right .el-button {
+ margin: 0 2px;
+ }
-/* 鏍戝舰鑺傜偣鍐呭鏍峰紡 */
-.nested-tree .el-tree-node__expand-icon {
- font-size: 12px;
- margin-right: 4px;
-}
+ /* 鏍戝舰鑺傜偣鍐呭鏍峰紡 */
+ .nested-tree .el-tree-node__expand-icon {
+ font-size: 12px;
+ margin-right: 4px;
+ }
-/* 绌虹姸鎬佹牱寮� */
-.el-table .cell:empty::before {
- content: '-';
- color: #c0c4cc;
-}
+ /* 绌虹姸鎬佹牱寮� */
+ .el-table .cell:empty::before {
+ content: "-";
+ color: #c0c4cc;
+ }
-/* 灞曞紑/鎶樺彔鍔熻兘鏍峰紡 */
-.expand-icon {
- display: inline-block;
- width: 20px;
- height: 20px;
- text-align: center;
- line-height: 20px;
- cursor: pointer;
- font-size: 12px;
- color: #909399;
-}
+ /* 灞曞紑/鎶樺彔鍔熻兘鏍峰紡 */
+ .expand-icon {
+ display: inline-block;
+ width: 20px;
+ height: 20px;
+ text-align: center;
+ line-height: 20px;
+ cursor: pointer;
+ font-size: 12px;
+ color: #909399;
+ }
-.expand-icon.expanded {
- color: #409eff;
-}
+ .expand-icon.expanded {
+ color: #409eff;
+ }
-/* 灞曞紑鍐呭鏍峰紡 */
-.expand-content {
- padding: 10px 20px;
-}
+ /* 灞曞紑鍐呭鏍峰紡 */
+ .expand-content {
+ padding: 10px 20px;
+ }
-/* 瀛愮骇鍐呭鏍峰紡 */
-.child-content {
- padding-left: 40px;
-}
+ /* 瀛愮骇鍐呭鏍峰紡 */
+ .child-content {
+ padding-left: 40px;
+ }
-/* 鏃犲瓙鍒嗙被鎻愮ず鏍峰紡 */
-.no-children {
- padding: 10px 20px;
- color: #909399;
- font-size: 14px;
-}
+ /* 鏃犲瓙鍒嗙被鎻愮ず鏍峰紡 */
+ .no-children {
+ padding: 10px 20px;
+ color: #909399;
+ font-size: 14px;
+ }
-/* 纭繚灞曞紑鐨勮〃鏍兼牱寮忔纭� */
-.el-table .el-table__expanded-cell {
- background-color: #fafafa;
-}
+ /* 纭繚灞曞紑鐨勮〃鏍兼牱寮忔纭� */
+ .el-table .el-table__expanded-cell {
+ background-color: #fafafa;
+ }
-/* 灞曞紑鐨勫瓙琛ㄦ牸鏍峰紡 */
-.el-table .el-table {
- border-top: none;
- border-bottom: none;
-}
+ /* 灞曞紑鐨勫瓙琛ㄦ牸鏍峰紡 */
+ .el-table .el-table {
+ border-top: none;
+ border-bottom: none;
+ }
-/* 灞曞紑鐨勫瓙琛ㄦ牸鍗曞厓鏍兼牱寮� */
-.expand-content .el-table__body-wrapper .el-table__row {
- background-color: #ffffff;
-}
+ /* 灞曞紑鐨勫瓙琛ㄦ牸鍗曞厓鏍兼牱寮� */
+ .expand-content .el-table__body-wrapper .el-table__row {
+ background-color: #ffffff;
+ }
-.expand-content .el-table__body-wrapper .el-table__row:hover > td {
- background-color: #fafafa;
-}
+ .expand-content .el-table__body-wrapper .el-table__row:hover > td {
+ background-color: #fafafa;
+ }
</style>
\ No newline at end of file
diff --git a/src/views/example/DynamicTableExample.vue b/src/views/example/DynamicTableExample.vue
index 038cd43..c79b461 100644
--- a/src/views/example/DynamicTableExample.vue
+++ b/src/views/example/DynamicTableExample.vue
@@ -1,101 +1,91 @@
<template>
<div class="app-container">
<div class="search-form">
- <el-form :inline="true" :model="searchForm">
+ <el-form :inline="true"
+ :model="searchForm">
<el-form-item label="閮ㄩ棬">
- <el-input
- v-model="searchForm.department"
- placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�"
- clearable
- style="width: 200px"
- />
+ <el-input v-model="searchForm.department"
+ placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�"
+ clearable
+ style="width: 200px" />
</el-form-item>
<el-form-item label="濮撳悕">
- <el-input
- v-model="searchForm.name"
- placeholder="璇疯緭鍏ュ鍚�"
- clearable
- style="width: 200px"
- />
+ <el-input v-model="searchForm.name"
+ placeholder="璇疯緭鍏ュ鍚�"
+ clearable
+ style="width: 200px" />
</el-form-item>
<el-form-item>
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="handleReset">閲嶇疆</el-button>
- <el-button type="success" @click="handleAdd">鏂板</el-button>
+ <el-button type="success"
+ @click="handleAdd">鏂板</el-button>
</el-form-item>
</el-form>
</div>
-
<div class="table-container">
- <DynamicTable
- ref="dynamicTableRef"
- :data="tableData"
- :dict-types="dictTypes"
- :loading="loading"
- :show-selection="true"
- :show-actions="true"
- :show-pagination="true"
- :pagination="pagination"
- height="calc(100vh - 280px)"
- @selection-change="handleSelectionChange"
- @edit="handleEdit"
- @delete="handleDelete"
- @select-change="handleSelectChange"
- @input-change="handleInputChange"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
+ <DynamicTable ref="dynamicTableRef"
+ :data="tableData"
+ :dict-types="dictTypes"
+ :loading="loading"
+ :show-selection="true"
+ :show-actions="true"
+ :show-pagination="true"
+ :pagination="pagination"
+ height="calc(100vh - 280px)"
+ @selection-change="handleSelectionChange"
+ @edit="handleEdit"
+ @delete="handleDelete"
+ @select-change="handleSelectChange"
+ @input-change="handleInputChange"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange" />
</div>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog
- v-model="dialogVisible"
- :title="dialogTitle"
- width="600px"
- append-to-body
- >
- <el-form
- ref="formRef"
- :model="form"
- :rules="rules"
- label-width="100px"
- >
- <el-form-item label="閮ㄩ棬" prop="department">
- <el-input v-model="form.department" placeholder="璇疯緭鍏ラ儴闂�" />
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="600px"
+ append-to-body>
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="100px">
+ <el-form-item label="閮ㄩ棬"
+ prop="department">
+ <el-input v-model="form.department"
+ placeholder="璇疯緭鍏ラ儴闂�" />
</el-form-item>
- <el-form-item label="濮撳悕" prop="name">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ュ鍚�" />
+ <el-form-item label="濮撳悕"
+ prop="name">
+ <el-input v-model="form.name"
+ placeholder="璇疯緭鍏ュ鍚�" />
</el-form-item>
- <el-form-item label="宸ュ彿" prop="employeeId">
- <el-input v-model="form.employeeId" placeholder="璇疯緭鍏ュ伐鍙�" />
+ <el-form-item label="宸ュ彿"
+ prop="employeeId">
+ <el-input v-model="form.employeeId"
+ placeholder="璇疯緭鍏ュ伐鍙�" />
</el-form-item>
-
<!-- 鍔ㄦ�佽〃鍗曢」锛氭牴鎹瓧鍏哥敓鎴� -->
- <el-form-item
- v-for="dictItem in dynamicFormItems"
- :key="dictItem.value"
- :label="dictItem.label"
- :prop="dictItem.value"
- >
- <el-select
- v-model="form[dictItem.value]"
- placeholder="璇烽�夋嫨"
- style="width: 100%"
- >
- <el-option
- v-for="option in dictItem.options"
- :key="option.value"
- :label="option.label"
- :value="option.value"
- />
+ <el-form-item v-for="dictItem in dynamicFormItems"
+ :key="dictItem.value"
+ :label="dictItem.label"
+ :prop="dictItem.value">
+ <el-select v-model="form[dictItem.value]"
+ placeholder="璇烽�夋嫨"
+ style="width: 100%">
+ <el-option v-for="option in dictItem.options"
+ :key="option.value"
+ :label="option.label"
+ :value="option.value" />
</el-select>
</el-form-item>
</el-form>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="handleSubmit">纭畾</el-button>
</div>
</template>
</el-dialog>
@@ -103,252 +93,246 @@
</template>
<script setup>
-import { ref, reactive, computed, onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import DynamicTable from '@/components/DynamicTable/index.vue'
+ import { ref, reactive, computed, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import DynamicTable from "@/components/DynamicTable/index.vue";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const dialogVisible = ref(false)
-const dialogTitle = ref('')
-const editIndex = ref(-1)
-const selectedRows = ref([])
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("");
+ const editIndex = ref(-1);
+ const selectedRows = ref([]);
-// 鎼滅储琛ㄥ崟
-const searchForm = reactive({
- department: '',
- name: ''
-})
+ // 鎼滅储琛ㄥ崟
+ const searchForm = reactive({
+ department: "",
+ name: "",
+ });
-// 琛ㄦ牸鏁版嵁
-const tableData = ref([
- {
- id: 1,
- department: '鎶�鏈儴',
- name: '寮犱笁',
- employeeId: 'EMP001',
- status: '1',
- level: '2',
- position: '1'
- },
- {
- id: 2,
- department: '浜轰簨閮�',
- name: '鏉庡洓',
- employeeId: 'EMP002',
- status: '0',
- level: '1',
- position: '2'
- },
- {
- id: 3,
- department: '璐㈠姟閮�',
- name: '鐜嬩簲',
- employeeId: 'EMP003',
- status: '1',
- level: '3',
- position: '1'
- }
-])
-
-// 瀛楀吀绫诲瀷閰嶇疆
-const dictTypes = ref([
- 'sys_normal_disable', // 鐘舵�佸瓧鍏�
- 'sys_user_level', // 绾у埆瀛楀吀
- 'sys_user_position' // 鑱屼綅瀛楀吀
-])
-
-// 鍒嗛〉閰嶇疆
-const pagination = reactive({
- current: 1,
- size: 10,
- total: 0
-})
-
-// 琛ㄥ崟鏁版嵁
-const form = reactive({
- department: '',
- name: '',
- employeeId: '',
- status: '',
- level: '',
- position: ''
-})
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- department: [
- { required: true, message: '璇疯緭鍏ラ儴闂�', trigger: 'blur' }
- ],
- name: [
- { required: true, message: '璇疯緭鍏ュ鍚�', trigger: 'blur' }
- ],
- employeeId: [
- { required: true, message: '璇疯緭鍏ュ伐鍙�', trigger: 'blur' }
- ]
-}
-
-// 鍔ㄦ�佽〃鍗曢」
-const dynamicFormItems = computed(() => {
- // 杩欓噷鍙互鏍规嵁瀛楀吀鏁版嵁鍔ㄦ�佺敓鎴愯〃鍗曢」
- return [
+ // 琛ㄦ牸鏁版嵁
+ const tableData = ref([
{
- label: '鐘舵��',
- value: 'status',
- options: [
- { label: '鍚敤', value: '1' },
- { label: '绂佺敤', value: '0' }
- ]
+ id: 1,
+ department: "鎶�鏈儴",
+ name: "寮犱笁",
+ employeeId: "EMP001",
+ status: "1",
+ level: "2",
+ position: "1",
},
{
- label: '绾у埆',
- value: 'level',
- options: [
- { label: '鍒濈骇', value: '1' },
- { label: '涓骇', value: '2' },
- { label: '楂樼骇', value: '3' }
- ]
+ id: 2,
+ department: "浜轰簨閮�",
+ name: "鏉庡洓",
+ employeeId: "EMP002",
+ status: "0",
+ level: "1",
+ position: "2",
},
{
- label: '鑱屼綅',
- value: 'position',
- options: [
- { label: '鍛樺伐', value: '1' },
- { label: '涓荤', value: '2' },
- { label: '缁忕悊', value: '3' }
- ]
+ id: 3,
+ department: "璐㈠姟閮�",
+ name: "鐜嬩簲",
+ employeeId: "EMP003",
+ status: "1",
+ level: "3",
+ position: "1",
+ },
+ ]);
+
+ // 瀛楀吀绫诲瀷閰嶇疆
+ const dictTypes = ref([
+ "sys_normal_disable", // 鐘舵�佸瓧鍏�
+ "sys_user_level", // 绾у埆瀛楀吀
+ "sys_user_position", // 鑱屼綅瀛楀吀
+ ]);
+
+ // 鍒嗛〉閰嶇疆
+ const pagination = reactive({
+ current: 1,
+ size: 10,
+ total: 0,
+ });
+
+ // 琛ㄥ崟鏁版嵁
+ const form = reactive({
+ department: "",
+ name: "",
+ employeeId: "",
+ status: "",
+ level: "",
+ position: "",
+ });
+
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ department: [{ required: true, message: "璇疯緭鍏ラ儴闂�", trigger: "blur" }],
+ name: [{ required: true, message: "璇疯緭鍏ュ鍚�", trigger: "blur" }],
+ employeeId: [{ required: true, message: "璇疯緭鍏ュ伐鍙�", trigger: "blur" }],
+ };
+
+ // 鍔ㄦ�佽〃鍗曢」
+ const dynamicFormItems = computed(() => {
+ // 杩欓噷鍙互鏍规嵁瀛楀吀鏁版嵁鍔ㄦ�佺敓鎴愯〃鍗曢」
+ return [
+ {
+ label: "鐘舵��",
+ value: "status",
+ options: [
+ { label: "鍚敤", value: "1" },
+ { label: "绂佺敤", value: "0" },
+ ],
+ },
+ {
+ label: "绾у埆",
+ value: "level",
+ options: [
+ { label: "鍒濈骇", value: "1" },
+ { label: "涓骇", value: "2" },
+ { label: "楂樼骇", value: "3" },
+ ],
+ },
+ {
+ label: "鑱屼綅",
+ value: "position",
+ options: [
+ { label: "鍛樺伐", value: "1" },
+ { label: "涓荤", value: "2" },
+ { label: "缁忕悊", value: "3" },
+ ],
+ },
+ ];
+ });
+
+ // 缁勪欢寮曠敤
+ const dynamicTableRef = ref(null);
+ const formRef = ref(null);
+
+ // 浜嬩欢澶勭悊鍑芥暟
+ const handleSearch = () => {
+ // 瀹炵幇鎼滅储閫昏緫
+ console.log("鎼滅储鏉′欢:", searchForm);
+ ElMessage.success("鎼滅储鍔熻兘寰呭疄鐜�");
+ };
+
+ const handleReset = () => {
+ searchForm.department = "";
+ searchForm.name = "";
+ };
+
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板鍛樺伐";
+ editIndex.value = -1;
+ resetForm();
+ dialogVisible.value = true;
+ };
+
+ const handleEdit = (row, index) => {
+ dialogTitle.value = "缂栬緫鍛樺伐";
+ editIndex.value = index;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
+
+ const handleDelete = async (row, index) => {
+ try {
+ await ElMessageBox.confirm("纭畾瑕佸垹闄よ繖鏉¤褰曞悧锛�", "鎻愮ず", {
+ type: "warning",
+ });
+
+ tableData.value.splice(index, 1);
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ } catch (error) {
+ // 鐢ㄦ埛鍙栨秷鍒犻櫎
}
- ]
-})
+ };
-// 缁勪欢寮曠敤
-const dynamicTableRef = ref(null)
-const formRef = ref(null)
+ const handleSelectionChange = selection => {
+ selectedRows.value = selection;
+ };
-// 浜嬩欢澶勭悊鍑芥暟
-const handleSearch = () => {
- // 瀹炵幇鎼滅储閫昏緫
- console.log('鎼滅储鏉′欢:', searchForm)
- ElMessage.success('鎼滅储鍔熻兘寰呭疄鐜�')
-}
+ const handleSelectChange = (row, prop, value) => {
+ console.log("閫夋嫨鍙樺寲:", row, prop, value);
+ // 鍙互鍦ㄨ繖閲屽鐞嗘暟鎹洿鏂伴�昏緫
+ };
-const handleReset = () => {
- searchForm.department = ''
- searchForm.name = ''
-}
+ const handleInputChange = (row, prop, value) => {
+ console.log("杈撳叆鍙樺寲:", row, prop, value);
+ // 鍙互鍦ㄨ繖閲屽鐞嗘暟鎹洿鏂伴�昏緫
+ };
-const handleAdd = () => {
- dialogTitle.value = '鏂板鍛樺伐'
- editIndex.value = -1
- resetForm()
- dialogVisible.value = true
-}
+ const handleSizeChange = size => {
+ pagination.size = size;
+ // 閲嶆柊鍔犺浇鏁版嵁
+ };
-const handleEdit = (row, index) => {
- dialogTitle.value = '缂栬緫鍛樺伐'
- editIndex.value = index
- Object.assign(form, row)
- dialogVisible.value = true
-}
+ const handleCurrentChange = current => {
+ pagination.current = current;
+ // 閲嶆柊鍔犺浇鏁版嵁
+ };
-const handleDelete = async (row, index) => {
- try {
- await ElMessageBox.confirm('纭畾瑕佸垹闄よ繖鏉¤褰曞悧锛�', '鎻愮ず', {
- type: 'warning'
- })
-
- tableData.value.splice(index, 1)
- ElMessage.success('鍒犻櫎鎴愬姛')
- } catch (error) {
- // 鐢ㄦ埛鍙栨秷鍒犻櫎
- }
-}
+ const handleSubmit = async () => {
+ try {
+ await formRef.value.validate();
-const handleSelectionChange = (selection) => {
- selectedRows.value = selection
-}
-
-const handleSelectChange = (row, prop, value) => {
- console.log('閫夋嫨鍙樺寲:', row, prop, value)
- // 鍙互鍦ㄨ繖閲屽鐞嗘暟鎹洿鏂伴�昏緫
-}
-
-const handleInputChange = (row, prop, value) => {
- console.log('杈撳叆鍙樺寲:', row, prop, value)
- // 鍙互鍦ㄨ繖閲屽鐞嗘暟鎹洿鏂伴�昏緫
-}
-
-const handleSizeChange = (size) => {
- pagination.size = size
- // 閲嶆柊鍔犺浇鏁版嵁
-}
-
-const handleCurrentChange = (current) => {
- pagination.current = current
- // 閲嶆柊鍔犺浇鏁版嵁
-}
-
-const handleSubmit = async () => {
- try {
- await formRef.value.validate()
-
- if (editIndex.value === -1) {
- // 鏂板
- const newRow = {
- id: Date.now(),
- ...form
+ if (editIndex.value === -1) {
+ // 鏂板
+ const newRow = {
+ id: Date.now(),
+ ...form,
+ };
+ tableData.value.push(newRow);
+ ElMessage.success("鏂板鎴愬姛");
+ } else {
+ // 缂栬緫
+ Object.assign(tableData.value[editIndex.value], form);
+ ElMessage.success("缂栬緫鎴愬姛");
}
- tableData.value.push(newRow)
- ElMessage.success('鏂板鎴愬姛')
- } else {
- // 缂栬緫
- Object.assign(tableData.value[editIndex.value], form)
- ElMessage.success('缂栬緫鎴愬姛')
+
+ dialogVisible.value = false;
+ } catch (error) {
+ console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
}
-
- dialogVisible.value = false
- } catch (error) {
- console.error('琛ㄥ崟楠岃瘉澶辫触:', error)
- }
-}
+ };
-const resetForm = () => {
- Object.assign(form, {
- department: '',
- name: '',
- employeeId: '',
- status: '',
- level: '',
- position: ''
- })
- formRef.value?.resetFields()
-}
+ const resetForm = () => {
+ Object.assign(form, {
+ department: "",
+ name: "",
+ employeeId: "",
+ status: "",
+ level: "",
+ position: "",
+ });
+ formRef.value?.resetFields();
+ };
-// 缁勪欢鎸傝浇鏃跺垵濮嬪寲鏁版嵁
-onMounted(() => {
- pagination.total = tableData.value.length
-})
+ // 缁勪欢鎸傝浇鏃跺垵濮嬪寲鏁版嵁
+ onMounted(() => {
+ pagination.total = tableData.value.length;
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.search-form {
- margin-bottom: 20px;
- padding: 20px;
- background-color: #f5f5f5;
- border-radius: 4px;
-}
+ .search-form {
+ margin-bottom: 20px;
+ padding: 20px;
+ background-color: #f5f5f5;
+ border-radius: 4px;
+ }
-.table-container {
- background-color: #fff;
- border-radius: 4px;
- padding: 20px;
-}
+ .table-container {
+ background-color: #fff;
+ border-radius: 4px;
+ padding: 20px;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
</style>
diff --git a/src/views/fileManagement/bookshelf/index.vue b/src/views/fileManagement/bookshelf/index.vue
index 2689900..52e97b4 100644
--- a/src/views/fileManagement/bookshelf/index.vue
+++ b/src/views/fileManagement/bookshelf/index.vue
@@ -1,52 +1,76 @@
<template>
<div class="sample">
- <div class="main-content" v-if="!isDetail">
+ <div class="main-content"
+ v-if="!isDetail">
<div class="search">
- <div class="search_thing">
- <div class="search_label">浠撳簱鍚嶇О锛�</div>
- <div class="search_input">
- <el-select v-model="entity.warehouseId" placeholder="閫夋嫨浠撳簱" size="small" @change="warehouseChange">
- <el-option v-for="item in warehouse" :key="item.id" :label="item.label" :value="item.id">
- </el-option>
- </el-select>
- </div>
- </div>
<div class="search_thing">
- <div class="search_label">璐ф灦锛�</div>
+ <div class="search_label">浠撳簱鍚嶇О锛�</div>
<div class="search_input">
- <el-select v-model="entity.shelfId" placeholder="閫夋嫨璐ф灦" size="small" @change="handleShelf">
- <el-option v-for="item in shelf" :key="item.id" :label="item.label" :value="item.id">
+ <el-select v-model="entity.warehouseId"
+ placeholder="閫夋嫨浠撳簱"
+ size="small"
+ @change="warehouseChange">
+ <el-option v-for="item in warehouse"
+ :key="item.id"
+ :label="item.label"
+ :value="item.id">
</el-option>
</el-select>
</div>
</div>
- <!-- <div class="search_thing">
+ <div class="search_thing">
+ <div class="search_label">璐ф灦锛�</div>
+ <div class="search_input">
+ <el-select v-model="entity.shelfId"
+ placeholder="閫夋嫨璐ф灦"
+ size="small"
+ @change="handleShelf">
+ <el-option v-for="item in shelf"
+ :key="item.id"
+ :label="item.label"
+ :value="item.id">
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <!-- <div class="search_thing">
<el-button size="small" @click="handleShelf(entity.shelfId,'')">閲嶇疆</el-button>
<el-button size="small" type="primary" @click="handleShelf(entity.shelfId)">鏌ヨ</el-button>
</div> -->
<div class="btns">
- <el-button size="small" style="color:#3A7BFA" @click="keepVisible=true">缁存姢</el-button>
- <el-button size="small" style="color:#3A7BFA" @click="warehouseVisible=true,isEdit=false">娣诲姞浠撳簱</el-button>
- <el-button size="small" style="color:#3A7BFA" @click="shelvesVisible=true,isEdit=false"
- :disabled="entity.warehouseId==null">娣诲姞璐ф灦</el-button>
+ <el-button size="small"
+ style="color:#3A7BFA"
+ @click="keepVisible=true">缁存姢</el-button>
+ <el-button size="small"
+ style="color:#3A7BFA"
+ @click="warehouseVisible=true,isEdit=false">娣诲姞浠撳簱</el-button>
+ <el-button size="small"
+ style="color:#3A7BFA"
+ @click="shelvesVisible=true,isEdit=false"
+ :disabled="entity.warehouseId==null">娣诲姞璐ф灦</el-button>
</div>
</div>
- <div class="table" v-loading="tableLoading">
- <table class="tables" style="table-layout:fixed;" v-if="tableList.length>0">
+ <div class="table"
+ v-loading="tableLoading">
+ <table class="tables"
+ style="table-layout:fixed;"
+ v-if="tableList.length>0">
<tbody>
- <tr v-for="(item,index) in tableList" :key="index">
- <td v-for="(m,i) in item" :key="i" class="content">
+ <tr v-for="(item,index) in tableList"
+ :key="index">
+ <td v-for="(m,i) in item"
+ :key="i"
+ class="content">
<h4 v-if="m.row!=undefined">{{ m.row }} - {{ m.col }}</h4>
<ul>
- <el-tooltip
- effect="dark"
- placement="top"
- v-for="(n,j) in m.documentationDtoList"
- :key="j">
+ <el-tooltip effect="dark"
+ placement="top"
+ v-for="(n,j) in m.documentationDtoList"
+ :key="j">
<template #content><span>{{ n.docName }}</span>
<span> [{{ n.docNumber }}]</span></template>
<li class="green"
- @click="handelDetail(n)">
+ @click="handelDetail(n)">
<i></i>
<span>{{ n.docName }}</span>
<span> [{{ n.docNumber }}] <span :style="{ color: getStatusColor(n.docStatus) }">锛坽{ n.docStatus }}锛�</span></span>
@@ -56,39 +80,59 @@
</td>
</tr>
<tr>
- <td v-for="(item,index) in rowList" :key="index" style="background: ghostwhite;height: 20px;">{{ item }}
+ <td v-for="(item,index) in rowList"
+ :key="index"
+ style="background: ghostwhite;height: 20px;">{{ item }}
</td>
</tr>
</tbody>
</table>
- <span v-else style="color: rgb(144, 147, 153);display: inline-block;position: absolute;top: 60%;left: 50%;transform: translate(-50%,-50%);">鏆傛棤鏁版嵁</span>
+ <span v-else
+ style="color: rgb(144, 147, 153);display: inline-block;position: absolute;top: 60%;left: 50%;transform: translate(-50%,-50%);">鏆傛棤鏁版嵁</span>
</div>
</div>
- <Detail v-else @hanldeBack="isDetail=false" :current="current" />
-
+ <Detail v-else
+ @hanldeBack="isDetail=false"
+ :current="current" />
<!-- 搴撲綅缁存姢瀵硅瘽妗� -->
- <el-dialog v-model="keepVisible" title="搴撲綅缁存姢" width="350px" :append-to-body="true">
- <el-tree :data="warehouse" ref="tree" node-key="id"
- highlight-current v-if="keepVisible"
- empty-text="鏆傛棤鏁版嵁">
+ <el-dialog v-model="keepVisible"
+ title="搴撲綅缁存姢"
+ width="350px"
+ :append-to-body="true">
+ <el-tree :data="warehouse"
+ ref="tree"
+ node-key="id"
+ highlight-current
+ v-if="keepVisible"
+ empty-text="鏆傛棤鏁版嵁">
<template #default="{ node, data }">
- <div class="custom-tree-node" style="width: 100%;">
+ <div class="custom-tree-node"
+ style="width: 100%;">
<el-row style="width: 100%;display: flex;align-items: center;">
<el-col :span="14">
<span>
- <el-icon v-if="node.level < 2" class="folder-icon">
+ <el-icon v-if="node.level < 2"
+ class="folder-icon">
<FolderOpened />
</el-icon>
- <el-icon v-else class="file-icon">
+ <el-icon v-else
+ class="file-icon">
<Document />
</el-icon>
{{ data.label }}
</span>
</el-col>
- <el-col :span="10" v-if="node.level<3">
- <el-button type="link" size="small" :icon="Edit" @click.stop="handleEdit(data,node.level)">
+ <el-col :span="10"
+ v-if="node.level<3">
+ <el-button type="link"
+ size="small"
+ :icon="Edit"
+ @click.stop="handleEdit(data,node.level)">
</el-button>
- <el-button type="danger" size="small" :icon="Delete" @click.stop="handleDelete(data,node.level)">
+ <el-button type="danger"
+ size="small"
+ :icon="Delete"
+ @click.stop="handleDelete(data,node.level)">
</el-button>
</el-col>
</el-row>
@@ -97,372 +141,393 @@
</el-tree>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="keepVisible = false">纭� 瀹�</el-button>
<el-button @click="keepVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="keepVisible = false" >纭� 瀹�</el-button>
</span>
</template>
</el-dialog>
-
<!-- 浠撳簱鏂板/淇敼瀵硅瘽妗� -->
- <el-dialog v-model="warehouseVisible" :title="isEdit?'浠撳簱淇敼':'浠撳簱鏂板'" width="350px">
+ <el-dialog v-model="warehouseVisible"
+ :title="isEdit?'浠撳簱淇敼':'浠撳簱鏂板'"
+ width="350px">
<el-row>
- <el-col class="search_thing" :span="24">
+ <el-col class="search_thing"
+ :span="24">
<div class="search_label"><span class="required-span">* </span>浠撳簱鍚嶇О锛�</div>
<div class="search_input">
- <el-input v-model="name" size="small" @keyup.enter="confirmWarehouse"></el-input>
+ <el-input v-model="name"
+ size="small"
+ @keyup.enter="confirmWarehouse"></el-input>
</div>
</el-col>
</el-row>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="confirmWarehouse"
+ :loading="upLoadWarehouse">纭� 瀹�</el-button>
<el-button @click="warehouseVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="confirmWarehouse" :loading="upLoadWarehouse">纭� 瀹�</el-button>
</span>
</template>
</el-dialog>
-
<!-- 璐ф灦鏂板/淇敼瀵硅瘽妗� -->
- <el-dialog v-model="shelvesVisible" :title="isEdit?'璐ф灦淇敼':'璐ф灦鏂板'" width="350px">
+ <el-dialog v-model="shelvesVisible"
+ :title="isEdit?'璐ф灦淇敼':'璐ф灦鏂板'"
+ width="350px">
<el-row>
- <el-col class="search_thing" :span="24">
+ <el-col class="search_thing"
+ :span="24">
<div class="search_label"><span class="required-span">* </span>璐ф灦鍚嶇О锛�</div>
<div class="search_input">
- <el-input v-model="shelves.name" size="small"></el-input>
+ <el-input v-model="shelves.name"
+ size="small"></el-input>
</div>
</el-col>
</el-row>
<el-row>
- <el-col class="search_thing" :span="24">
+ <el-col class="search_thing"
+ :span="24">
<div class="search_label"><span class="required-span">* </span>璐ф灦灞傛暟锛�</div>
<div class="search_input">
- <el-input v-model="shelves.row" size="small"></el-input>
+ <el-input v-model="shelves.row"
+ size="small"></el-input>
</div>
</el-col>
</el-row>
<el-row>
- <el-col class="search_thing" :span="24">
+ <el-col class="search_thing"
+ :span="24">
<div class="search_label"><span class="required-span">* </span>璐ф灦鍒楁暟锛�</div>
<div class="search_input">
- <el-input v-model="shelves.col" size="small"></el-input>
+ <el-input v-model="shelves.col"
+ size="small"></el-input>
</div>
</el-col>
</el-row>
<template #footer>
<span class="dialog-footer">
+ <el-button type="primary"
+ @click="confirmShelves"
+ :loading="upLoadShelves">纭� 瀹�</el-button>
<el-button @click="shelvesVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="confirmShelves" :loading="upLoadShelves">纭� 瀹�</el-button>
</span>
</template>
</el-dialog>
-
-
</div>
</template>
<script setup>
-import { ref, reactive, onMounted, watch } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Edit, Delete, FolderOpened, Document } from '@element-plus/icons-vue'
-import { getWarehouseList, addWarehouse, updateWarehouse, deleteWarehouse, getWarehouseStructure, addShelf, updateShelf, deleteShelf } from '@/api/fileManagement/bookshelf'
-import Detail from './detail.vue'
+ import { ref, reactive, onMounted, watch } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Edit, Delete, FolderOpened, Document } from "@element-plus/icons-vue";
+ import {
+ getWarehouseList,
+ addWarehouse,
+ updateWarehouse,
+ deleteWarehouse,
+ getWarehouseStructure,
+ addShelf,
+ updateShelf,
+ deleteShelf,
+ } from "@/api/fileManagement/bookshelf";
+ import Detail from "./detail.vue";
-// 鍝嶅簲寮忔暟鎹�
-const entity = reactive({
- warehouseId: null,
- shelfId: null
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const entity = reactive({
+ warehouseId: null,
+ shelfId: null,
+ });
-const warehouse = ref([])
-const shelf = ref([])
-const keepVisible = ref(false)
-const warehouseVisible = ref(false)
-const shelvesVisible = ref(false)
-const upLoadWarehouse = ref(false)
-const upLoadShelves = ref(false)
-const tableList = ref([])
-const rowList = ref([])
-const value = ref('')
-const name = ref('')
-const shelves = reactive({})
-const isEdit = ref(false)
-const isDetail = ref(false)
-const currentEdit = ref(null)
-const tableLoading = ref(false)
-const current = ref({})
+ const warehouse = ref([]);
+ const shelf = ref([]);
+ const keepVisible = ref(false);
+ const warehouseVisible = ref(false);
+ const shelvesVisible = ref(false);
+ const upLoadWarehouse = ref(false);
+ const upLoadShelves = ref(false);
+ const tableList = ref([]);
+ const rowList = ref([]);
+ const value = ref("");
+ const name = ref("");
+ const shelves = reactive({});
+ const isEdit = ref(false);
+ const isDetail = ref(false);
+ const currentEdit = ref(null);
+ const tableLoading = ref(false);
+ const current = ref({});
-// 妯℃澘寮曠敤
-const organization = ref(null)
+ // 妯℃澘寮曠敤
+ const organization = ref(null);
-// 鐩戝惉鍣�
-watch(isEdit, (newVal) => {
- if (!newVal) {
- Object.keys(shelves).forEach(key => delete shelves[key])
- }
-})
-
-// 鏂规硶
-
-const selectList = async () => {
- // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
- const res = await getWarehouseList()
- warehouse.value = res.data
-
- if (warehouse.value.length == 0) {
- entity.warehouseId = ''
- entity.shelfId = ''
- tableList.value = []
- }
-
-
-
- if (!entity.warehouseId && warehouse.value.length > 0) {
- entity.warehouseId = warehouse.value[0].id
- warehouseChange(entity.warehouseId)
- if (shelf.value.length > 0) {
- entity.shelfId = shelf.value[0].id
- handleShelf(entity.shelfId)
- } else {
- tableList.value = []
+ // 鐩戝惉鍣�
+ watch(isEdit, newVal => {
+ if (!newVal) {
+ Object.keys(shelves).forEach(key => delete shelves[key]);
}
- } else if (warehouse.value.length > 0) {
- warehouseChange(entity.warehouseId)
- if (shelf.value.length > 0) {
- entity.shelfId = shelf.value[0].id
- handleShelf(entity.shelfId)
- } else {
- tableList.value = []
+ });
+
+ // 鏂规硶
+
+ const selectList = async () => {
+ // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
+ const res = await getWarehouseList();
+ warehouse.value = res.data;
+
+ if (warehouse.value.length == 0) {
+ entity.warehouseId = "";
+ entity.shelfId = "";
+ tableList.value = [];
}
- }
-}
-const confirmWarehouse = () => {
- if (!name.value) {
- ElMessage.error('璇峰～鍐欎粨搴撳悕绉�')
- return
- }
- upLoadWarehouse.value = true
-
- if (currentEdit.value && currentEdit.value.id) {
- // 淇敼浠撳簱
- // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
- updateWarehouse({
- id: currentEdit.value.id,
- warehouseName: name.value
- }).then(res => {
- upLoadWarehouse.value = false
- warehouseVisible.value = false
- currentEdit.value = null
- ElMessage.success('淇敼鎴愬姛')
- selectList()
- name.value = ''
- warehouseChange(entity.warehouseId)
- })
-
- } else {
- // 鏂板浠撳簱
- // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
- addWarehouse({
- warehouseName: name.value
- }).then(res => {
- upLoadWarehouse.value = false
- warehouseVisible.value = false
- ElMessage.success('娣诲姞鎴愬姛')
- selectList()
- name.value = ''
- warehouseChange(entity.warehouseId)
- })
- }
-}
+ if (!entity.warehouseId && warehouse.value.length > 0) {
+ entity.warehouseId = warehouse.value[0].id;
+ warehouseChange(entity.warehouseId);
+ if (shelf.value.length > 0) {
+ entity.shelfId = shelf.value[0].id;
+ handleShelf(entity.shelfId);
+ } else {
+ tableList.value = [];
+ }
+ } else if (warehouse.value.length > 0) {
+ warehouseChange(entity.warehouseId);
+ if (shelf.value.length > 0) {
+ entity.shelfId = shelf.value[0].id;
+ handleShelf(entity.shelfId);
+ } else {
+ tableList.value = [];
+ }
+ }
+ };
-const confirmShelves = () => {
- if (!shelves.name) {
- ElMessage.error('璇峰～鍐欒揣鏋跺悕绉�')
- return
- }
- if (!shelves.row) {
- ElMessage.error('璇峰～鍐欒揣鏋跺眰鏁�')
- return
- }
- if (!shelves.col) {
- ElMessage.error('璇峰～鍐欒揣鏋跺垪鏁�')
- return
- }
- upLoadShelves.value = true
-
- if (currentEdit.value && currentEdit.value.id) {
- // 淇敼
- updateShelf({
- id: currentEdit.value.id,
- name: shelves.name,
- row: Number(shelves.row),
- col: Number(shelves.col),
- warehouseId: entity.warehouseId
- }).then(res => {
- upLoadShelves.value = false
- shelvesVisible.value = false
- ElMessage.success('淇敼鎴愬姛')
- selectList()
- currentEdit.value = {}
- }).catch(err => {
- upLoadShelves.value = false
- shelvesVisible.value = false
- ElMessage.error('淇敼澶辫触')
- })
-
- } else {
- // 鏂板
- // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
- addShelf({
- name: shelves.name,
- row: Number(shelves.row),
- col: Number(shelves.col),
- warehouseId: entity.warehouseId
- }).then(res => {
- upLoadShelves.value = false
- shelvesVisible.value = false
- ElMessage.success('娣诲姞鎴愬姛')
- selectList()
- Object.keys(shelves).forEach(key => delete shelves[key])
- }).catch(err => {
- upLoadShelves.value = false
- shelvesVisible.value = false
- ElMessage.error('娣诲姞澶辫触')
- })
- }
- warehouseChange(entity.warehouseId)
-}
+ const confirmWarehouse = () => {
+ if (!name.value) {
+ ElMessage.error("璇峰～鍐欎粨搴撳悕绉�");
+ return;
+ }
+ upLoadWarehouse.value = true;
-
-
-const handleDelete = (row, level) => {
- ElMessageBox.confirm('鏄惁鍒犻櫎褰撳墠鏁版嵁?', "璀﹀憡", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(() => {
- if (level == 1) {
- // 鍒犻櫎浠撳簱
- deleteWarehouse([row.id]).then(res => {
- ElMessage.success('鍒犻櫎鎴愬姛')
- selectList()
- })
- } else {
- // 鍒犻櫎璐ф灦
- deleteShelf({
- id: row.id
+ if (currentEdit.value && currentEdit.value.id) {
+ // 淇敼浠撳簱
+ // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
+ updateWarehouse({
+ id: currentEdit.value.id,
+ warehouseName: name.value,
}).then(res => {
- ElMessage.success('鍒犻櫎鎴愬姛')
- selectList()
- })
+ upLoadWarehouse.value = false;
+ warehouseVisible.value = false;
+ currentEdit.value = null;
+ ElMessage.success("淇敼鎴愬姛");
+ selectList();
+ name.value = "";
+ warehouseChange(entity.warehouseId);
+ });
+ } else {
+ // 鏂板浠撳簱
+ // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
+ addWarehouse({
+ warehouseName: name.value,
+ }).then(res => {
+ upLoadWarehouse.value = false;
+ warehouseVisible.value = false;
+ ElMessage.success("娣诲姞鎴愬姛");
+ selectList();
+ name.value = "";
+ warehouseChange(entity.warehouseId);
+ });
}
- warehouseChange(entity.warehouseId)
- }).catch(() => {})
-}
+ };
-const handleEdit = (data, level) => {
- isEdit.value = true
- if (level == 1) {
- warehouseVisible.value = true
- currentEdit.value = data
- name.value = data.label
- } else {
- shelvesVisible.value = true
- currentEdit.value = data
- Object.assign(shelves, {
- name: data.label,
- row: data.row,
- col: data.col,
- warehouseId: data.warehouseId
- })
- }
-}
-
-const handelDetail = (row) => {
- current.value = row
- isDetail.value = true
-}
-
-// 鏍规嵁鏂囨。鐘舵�佽繑鍥炲搴旂殑棰滆壊
-const getStatusColor = (status) => {
- if (status === '姝ｅ父') {
- return '#34BD66' // 缁胯壊
- } else if (status === '鍊熷嚭') {
- return '#F56C6C' // 绾㈣壊
- }
- return '#606266' // 榛樿棰滆壊
-}
-
-const warehouseChange = (val) => {
-tableList.value = []
-let map = warehouse.value.find(a => {
- return a && a.id === val ? a : null
-})
-if (map && map.children) {
- shelf.value = map.children
- entity.shelfId = ''
-} else {
- shelf.value = []
-}
-currentEdit.value = null
-}
-
-const handleShelf = async(e) => {
- if (e) {
- tableLoading.value = true
- let data = []
- const res = await getWarehouseStructure({warehouseGoodsShelvesId:e})
- if(res.code == 200){
- data = res.data.map(m=>{
- m.books = m.documentationDtoList|[]
- return m
- })
- }else{
- ElMessage.error(res.message)
+ const confirmShelves = () => {
+ if (!shelves.name) {
+ ElMessage.error("璇峰～鍐欒揣鏋跺悕绉�");
+ return;
}
- setTimeout(() => {
- tableLoading.value = false
- let set = new Set()
- tableList.value = []
- let arr = []
-
- if (data && data.length > 0) {
- data.forEach(m => {
- if (m && m.row && m.col) {
- set.add(m.col)
- if (arr.length > 0) {
- if (arr.find(n => n.row == m.row)) {
- arr.push(m)
- } else {
- tableList.value.push(arr)
- arr = []
- arr.push(m)
- }
- } else {
- arr.push(m)
- }
- }
+ if (!shelves.row) {
+ ElMessage.error("璇峰～鍐欒揣鏋跺眰鏁�");
+ return;
+ }
+ if (!shelves.col) {
+ ElMessage.error("璇峰～鍐欒揣鏋跺垪鏁�");
+ return;
+ }
+ upLoadShelves.value = true;
+
+ if (currentEdit.value && currentEdit.value.id) {
+ // 淇敼
+ updateShelf({
+ id: currentEdit.value.id,
+ name: shelves.name,
+ row: Number(shelves.row),
+ col: Number(shelves.col),
+ warehouseId: entity.warehouseId,
+ })
+ .then(res => {
+ upLoadShelves.value = false;
+ shelvesVisible.value = false;
+ ElMessage.success("淇敼鎴愬姛");
+ selectList();
+ currentEdit.value = {};
})
-
- if (arr.length > 0) {
- tableList.value.push(arr)
+ .catch(err => {
+ upLoadShelves.value = false;
+ shelvesVisible.value = false;
+ ElMessage.error("淇敼澶辫触");
+ });
+ } else {
+ // 鏂板
+ // 杩欓噷闇�瑕佹浛鎹负瀹為檯鐨凙PI璋冪敤
+ addShelf({
+ name: shelves.name,
+ row: Number(shelves.row),
+ col: Number(shelves.col),
+ warehouseId: entity.warehouseId,
+ })
+ .then(res => {
+ upLoadShelves.value = false;
+ shelvesVisible.value = false;
+ ElMessage.success("娣诲姞鎴愬姛");
+ selectList();
+ Object.keys(shelves).forEach(key => delete shelves[key]);
+ })
+ .catch(err => {
+ upLoadShelves.value = false;
+ shelvesVisible.value = false;
+ ElMessage.error("娣诲姞澶辫触");
+ });
+ }
+ warehouseChange(entity.warehouseId);
+ };
+
+ const handleDelete = (row, level) => {
+ ElMessageBox.confirm("鏄惁鍒犻櫎褰撳墠鏁版嵁?", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ if (level == 1) {
+ // 鍒犻櫎浠撳簱
+ deleteWarehouse([row.id]).then(res => {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ selectList();
+ });
+ } else {
+ // 鍒犻櫎璐ф灦
+ deleteShelf({
+ id: row.id,
+ }).then(res => {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ selectList();
+ });
}
+ warehouseChange(entity.warehouseId);
+ })
+ .catch(() => {});
+ };
+
+ const handleEdit = (data, level) => {
+ isEdit.value = true;
+ if (level == 1) {
+ warehouseVisible.value = true;
+ currentEdit.value = data;
+ name.value = data.label;
+ } else {
+ shelvesVisible.value = true;
+ currentEdit.value = data;
+ Object.assign(shelves, {
+ name: data.label,
+ row: data.row,
+ col: data.col,
+ warehouseId: data.warehouseId,
+ });
+ }
+ };
+
+ const handelDetail = row => {
+ current.value = row;
+ isDetail.value = true;
+ };
+
+ // 鏍规嵁鏂囨。鐘舵�佽繑鍥炲搴旂殑棰滆壊
+ const getStatusColor = status => {
+ if (status === "姝ｅ父") {
+ return "#34BD66"; // 缁胯壊
+ } else if (status === "鍊熷嚭") {
+ return "#F56C6C"; // 绾㈣壊
+ }
+ return "#606266"; // 榛樿棰滆壊
+ };
+
+ const warehouseChange = val => {
+ tableList.value = [];
+ let map = warehouse.value.find(a => {
+ return a && a.id === val ? a : null;
+ });
+ if (map && map.children) {
+ shelf.value = map.children;
+ entity.shelfId = "";
+ } else {
+ shelf.value = [];
+ }
+ currentEdit.value = null;
+ };
+
+ const handleShelf = async e => {
+ if (e) {
+ tableLoading.value = true;
+ let data = [];
+ const res = await getWarehouseStructure({ warehouseGoodsShelvesId: e });
+ if (res.code == 200) {
+ data = res.data.map(m => {
+ m.books = m.documentationDtoList | [];
+ return m;
+ });
+ } else {
+ ElMessage.error(res.message);
}
-
- rowList.value = []
- for (let i = 0; i < set.size; i++) {
- rowList.value.push(`${i + 1} 鍒梎)
- }
- console.log(6666, tableList.value,rowList.value,data)
- }, 1000)
- }
-}
+ setTimeout(() => {
+ tableLoading.value = false;
+ let set = new Set();
+ tableList.value = [];
+ let arr = [];
+ if (data && data.length > 0) {
+ data.forEach(m => {
+ if (m && m.row && m.col) {
+ set.add(m.col);
+ if (arr.length > 0) {
+ if (arr.find(n => n.row == m.row)) {
+ arr.push(m);
+ } else {
+ tableList.value.push(arr);
+ arr = [];
+ arr.push(m);
+ }
+ } else {
+ arr.push(m);
+ }
+ }
+ });
+ if (arr.length > 0) {
+ tableList.value.push(arr);
+ }
+ }
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- selectList()
-})
+ rowList.value = [];
+ for (let i = 0; i < set.size; i++) {
+ rowList.value.push(`${i + 1} 鍒梎);
+ }
+ console.log(6666, tableList.value, rowList.value, data);
+ }, 1000);
+ }
+ };
+
+ // 鐢熷懡鍛ㄦ湡
+ onMounted(() => {
+ selectList();
+ });
</script>
<style scoped>
@@ -597,23 +662,23 @@
}
li:hover i {
- background: #3A7BFA;
+ background: #3a7bfa;
}
li:hover .num {
- color: #3A7BFA;
+ color: #3a7bfa;
}
.green {
- background: #E0F6EA;
+ background: #e0f6ea;
}
.green i {
- background: #34BD66;
+ background: #34bd66;
}
.green .num {
- color: #34BD66;
+ color: #34bd66;
}
.el-dialog {
@@ -624,7 +689,7 @@
display: flex;
align-items: center;
font-size: 14px;
- color: #3A7BFA;
+ color: #3a7bfa;
position: absolute;
top: 23px;
right: 54px;
diff --git a/src/views/inventoryManagement/stockWarning/index.vue b/src/views/inventoryManagement/stockWarning/index.vue
index d0d5834..8d3df17 100644
--- a/src/views/inventoryManagement/stockWarning/index.vue
+++ b/src/views/inventoryManagement/stockWarning/index.vue
@@ -306,8 +306,9 @@
<template #footer>
<div class="dialog-footer">
- <el-button @click="closeDialog">鍙栨秷</el-button>
<el-button type="primary" @click="submitForm">纭</el-button>
+ <el-button @click="closeDialog">鍙栨秷</el-button>
+
</div>
</template>
</el-dialog>
diff --git a/src/views/oaSystem/projectManagement/components/milestoneList.vue b/src/views/oaSystem/projectManagement/components/milestoneList.vue
index 47b0027..08429e2 100644
--- a/src/views/oaSystem/projectManagement/components/milestoneList.vue
+++ b/src/views/oaSystem/projectManagement/components/milestoneList.vue
@@ -2,18 +2,21 @@
<template>
<div class="milestone-list-container">
<el-timeline>
- <el-timeline-item
- v-for="milestone in milestoneList"
- :key="milestone.phaseId"
- :timestamp="milestone.endDate"
- >
+ <el-timeline-item v-for="milestone in milestoneList"
+ :key="milestone.phaseId"
+ :timestamp="milestone.endDate">
<el-card>
<template #header>
<div class="card-header">
<span>{{ milestone.phaseName }}</span>
<div class="milestone-actions">
- <el-button type="text" size="small" @click="handleEdit(milestone)">缂栬緫</el-button>
- <el-button type="text" size="small" @click="handleDelete(milestone)" danger>鍒犻櫎</el-button>
+ <el-button type="text"
+ size="small"
+ @click="handleEdit(milestone)">缂栬緫</el-button>
+ <el-button type="text"
+ size="small"
+ @click="handleDelete(milestone)"
+ danger>鍒犻櫎</el-button>
</div>
</div>
</template>
@@ -26,66 +29,67 @@
</el-card>
</el-timeline-item>
</el-timeline>
-
<!-- 鏃犻噷绋嬬鏃剁殑鎻愮ず -->
- <div v-if="milestoneList.length === 0" class="empty-tip">
+ <div v-if="milestoneList.length === 0"
+ class="empty-tip">
<el-empty description="鏆傛棤閲岀▼纰戞暟鎹�" />
</div>
-
<!-- 缂栬緫閲岀▼纰戝璇濇 -->
- <el-dialog
- v-model="dialogVisible"
- :title="'缂栬緫閲岀▼纰�: ' + (form.phaseName || '')"
- width="600px"
- :close-on-click-modal="false"
- >
- <el-form
- ref="formRef"
- :model="form"
- :rules="rules"
- label-width="100px"
- >
- <el-form-item label="閲岀▼纰戝悕绉�" prop="phaseName">
- <el-input v-model="form.phaseName" placeholder="璇疯緭鍏ラ噷绋嬬鍚嶇О" />
+ <el-dialog v-model="dialogVisible"
+ :title="'缂栬緫閲岀▼纰�: ' + (form.phaseName || '')"
+ width="600px"
+ :close-on-click-modal="false">
+ <el-form ref="formRef"
+ :model="form"
+ :rules="rules"
+ label-width="100px">
+ <el-form-item label="閲岀▼纰戝悕绉�"
+ prop="phaseName">
+ <el-input v-model="form.phaseName"
+ placeholder="璇疯緭鍏ラ噷绋嬬鍚嶇О" />
</el-form-item>
<el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="寮�濮嬫棩鏈�" prop="startDate">
- <el-date-picker
- v-model="form.startDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨寮�濮嬫棩鏈�"
- style="width: 100%"
- />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="缁撴潫鏃ユ湡" prop="endDate">
- <el-date-picker
- v-model="form.endDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨缁撴潫鏃ユ湡"
- style="width: 100%"
- />
- </el-form-item>
- </el-col>
- </el-row>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��">
- <el-option label="鏈紑濮�" value="notStarted" />
- <el-option label="宸插畬鎴�" value="completed" />
- <el-option label="宸插欢杩�" value="delayed" />
+ <el-col :span="12">
+ <el-form-item label="寮�濮嬫棩鏈�"
+ prop="startDate">
+ <el-date-picker v-model="form.startDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨寮�濮嬫棩鏈�"
+ style="width: 100%" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="缁撴潫鏃ユ湡"
+ prop="endDate">
+ <el-date-picker v-model="form.endDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨缁撴潫鏃ユ湡"
+ style="width: 100%" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��">
+ <el-option label="鏈紑濮�"
+ value="notStarted" />
+ <el-option label="宸插畬鎴�"
+ value="completed" />
+ <el-option label="宸插欢杩�"
+ value="delayed" />
</el-select>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitEditForm">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitEditForm">纭畾</el-button>
</div>
</template>
</el-dialog>
@@ -93,197 +97,203 @@
</template>
<script setup>
-import { ref, onMounted, watch, reactive } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { getProject, listProjectPhase, updateProjectPhase,delProjectPhase } from '@/api/oaSystem/projectManagement';
+ import { ref, onMounted, watch, reactive } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import {
+ getProject,
+ listProjectPhase,
+ updateProjectPhase,
+ delProjectPhase,
+ } from "@/api/oaSystem/projectManagement";
-const props = defineProps({
- projectId: {
- type: String,
- required: true
- }
-});
-
-const emit = defineEmits(['refresh']);
-
-const milestoneList = ref([]);
-const dialogVisible = ref(false);
-const formRef = ref(null);
-const form = reactive({
- phaseId: '',
- phaseName: '',
- startDate: '',
- endDate: '',
- status: 'notStarted',
- projectId: props.projectId
-});
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
- phaseName: [
- { required: true, message: '璇疯緭鍏ラ噷绋嬬鍚嶇О', trigger: 'blur' },
- { min: 2, max: 50, message: '闀垮害鍦� 2 鍒� 50 涓瓧绗�', trigger: 'blur' }
- ],
- status: [
- { required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }
- ]
-};
-
-// 鑾峰彇閲岀▼纰戝垪琛�
-const getMilestoneList = async () => {
- try {
- listProjectPhase(props.projectId).then(res => {
- milestoneList.value = res.data.rows || res.data;
- // 鎸夌洰鏍囨棩鏈熸帓搴�
- // milestoneList.value.sort((a, b) => new Date(a.endDate) - new Date(b.endDate));
- })
- } catch (error) {
- ElMessage.error('鑾峰彇閲岀▼纰戝垪琛ㄥけ璐�');
- console.error('鑾峰彇閲岀▼纰戝垪琛ㄥけ璐�:', error);
- }
-};
-
-// 缂栬緫閲岀▼纰�
-const handleEdit = (milestone) => {
- // 澶嶅埗閲岀▼纰戞暟鎹埌琛ㄥ崟
- Object.assign(form, {
- phaseId: milestone.phaseId,
- phaseName: milestone.phaseName,
- description: milestone.description,
- endDate: milestone.endDate,
- status: milestone.status,
- projectId: props.projectId
+ const props = defineProps({
+ projectId: {
+ type: String,
+ required: true,
+ },
});
- dialogVisible.value = true;
-};
-// 鎻愪氦缂栬緫琛ㄥ崟
-const submitEditForm = async () => {
- try {
- await formRef.value.validate();
-
- // 鍙戦�佹洿鏂拌姹�
- const res = await updateProjectPhase(form);
-
- if (res.code === 200) {
- ElMessage.success('閲岀▼纰戠紪杈戞垚鍔�');
- dialogVisible.value = false;
- getMilestoneList(); // 鍒锋柊鍒楄〃
- emit('refresh'); // 閫氱煡鐖剁粍浠跺埛鏂�
- } else {
- ElMessage.error(res.msg || '閲岀▼纰戠紪杈戝け璐�');
- }
- } catch (error) {
- if (error.name === 'ValidationError') {
- // 琛ㄥ崟楠岃瘉澶辫触锛孍lement Plus浼氳嚜鍔ㄦ彁绀�
- return;
- }
- ElMessage.error('閲岀▼纰戠紪杈戝け璐�');
- console.error('缂栬緫閲岀▼纰戝け璐�:', error);
- }
-};
+ const emit = defineEmits(["refresh"]);
-// 鍒犻櫎閲岀▼纰�
-const handleDelete = (milestone) => {
- ElMessageBox.confirm(
- `纭畾瑕佸垹闄ら噷绋嬬 "${milestone.phaseName}" 鍚楋紵鍒犻櫎鍚庡皢鏃犳硶鎭㈠銆俙,
- '鍒犻櫎纭',
- {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
+ const milestoneList = ref([]);
+ const dialogVisible = ref(false);
+ const formRef = ref(null);
+ const form = reactive({
+ phaseId: "",
+ phaseName: "",
+ startDate: "",
+ endDate: "",
+ status: "notStarted",
+ projectId: props.projectId,
+ });
+
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const rules = {
+ phaseName: [
+ { required: true, message: "璇疯緭鍏ラ噷绋嬬鍚嶇О", trigger: "blur" },
+ { min: 2, max: 50, message: "闀垮害鍦� 2 鍒� 50 涓瓧绗�", trigger: "blur" },
+ ],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ };
+
+ // 鑾峰彇閲岀▼纰戝垪琛�
+ const getMilestoneList = async () => {
+ try {
+ listProjectPhase(props.projectId).then(res => {
+ milestoneList.value = res.data.rows || res.data;
+ // 鎸夌洰鏍囨棩鏈熸帓搴�
+ // milestoneList.value.sort((a, b) => new Date(a.endDate) - new Date(b.endDate));
+ });
+ } catch (error) {
+ ElMessage.error("鑾峰彇閲岀▼纰戝垪琛ㄥけ璐�");
+ console.error("鑾峰彇閲岀▼纰戝垪琛ㄥけ璐�:", error);
}
- )
- .then(async () => {
- try {
- // 璋冪敤鍒犻櫎API
- const res = await delProjectPhase(milestone.phaseId);
-
- if (res.code === 200) {
- ElMessage.success('閲岀▼纰戝垹闄ゆ垚鍔�');
- getMilestoneList(); // 鍒锋柊鍒楄〃
- emit('refresh'); // 閫氱煡鐖剁粍浠跺埛鏂�
- } else {
- ElMessage.error(res.msg || '閲岀▼纰戝垹闄ゅけ璐�');
- }
- } catch (error) {
- ElMessage.error('閲岀▼纰戝垹闄ゅけ璐�');
- console.error('鍒犻櫎閲岀▼纰戝け璐�:', error);
- }
- })
- .catch(() => {
- // 鐢ㄦ埛鍙栨秷鍒犻櫎
- ElMessage.info('宸插彇娑堝垹闄�');
+ };
+
+ // 缂栬緫閲岀▼纰�
+ const handleEdit = milestone => {
+ // 澶嶅埗閲岀▼纰戞暟鎹埌琛ㄥ崟
+ Object.assign(form, {
+ phaseId: milestone.phaseId,
+ phaseName: milestone.phaseName,
+ description: milestone.description,
+ endDate: milestone.endDate,
+ status: milestone.status,
+ projectId: props.projectId,
});
-};
-
-// 鑾峰彇鐘舵�佹爣绛剧被鍨�
-const getStatusType = (status) => {
- const statusTypeMap = {
- notStarted: 'info',
- completed: 'success',
- delayed: 'danger'
+ dialogVisible.value = true;
};
- return statusTypeMap[status] || 'default';
-};
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusTextMap = {
- notStarted: '鏈紑濮�',
- completed: '宸插畬鎴�',
- delayed: '宸插欢杩�'
+ // 鎻愪氦缂栬緫琛ㄥ崟
+ const submitEditForm = async () => {
+ try {
+ await formRef.value.validate();
+
+ // 鍙戦�佹洿鏂拌姹�
+ const res = await updateProjectPhase(form);
+
+ if (res.code === 200) {
+ ElMessage.success("閲岀▼纰戠紪杈戞垚鍔�");
+ dialogVisible.value = false;
+ getMilestoneList(); // 鍒锋柊鍒楄〃
+ emit("refresh"); // 閫氱煡鐖剁粍浠跺埛鏂�
+ } else {
+ ElMessage.error(res.msg || "閲岀▼纰戠紪杈戝け璐�");
+ }
+ } catch (error) {
+ if (error.name === "ValidationError") {
+ // 琛ㄥ崟楠岃瘉澶辫触锛孍lement Plus浼氳嚜鍔ㄦ彁绀�
+ return;
+ }
+ ElMessage.error("閲岀▼纰戠紪杈戝け璐�");
+ console.error("缂栬緫閲岀▼纰戝け璐�:", error);
+ }
};
- return statusTextMap[status] || status;
-};
-// 鐩戝惉椤圭洰ID鍙樺寲
-watch(() => props.projectId, () => {
- if (props.projectId) {
- getMilestoneList();
- }
-});
+ // 鍒犻櫎閲岀▼纰�
+ const handleDelete = milestone => {
+ ElMessageBox.confirm(
+ `纭畾瑕佸垹闄ら噷绋嬬 "${milestone.phaseName}" 鍚楋紵鍒犻櫎鍚庡皢鏃犳硶鎭㈠銆俙,
+ "鍒犻櫎纭",
+ {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }
+ )
+ .then(async () => {
+ try {
+ // 璋冪敤鍒犻櫎API
+ const res = await delProjectPhase(milestone.phaseId);
-// 鍒濆鍖�
-onMounted(() => {
- if (props.projectId) {
- getMilestoneList();
- }
-});
+ if (res.code === 200) {
+ ElMessage.success("閲岀▼纰戝垹闄ゆ垚鍔�");
+ getMilestoneList(); // 鍒锋柊鍒楄〃
+ emit("refresh"); // 閫氱煡鐖剁粍浠跺埛鏂�
+ } else {
+ ElMessage.error(res.msg || "閲岀▼纰戝垹闄ゅけ璐�");
+ }
+ } catch (error) {
+ ElMessage.error("閲岀▼纰戝垹闄ゅけ璐�");
+ console.error("鍒犻櫎閲岀▼纰戝け璐�:", error);
+ }
+ })
+ .catch(() => {
+ // 鐢ㄦ埛鍙栨秷鍒犻櫎
+ ElMessage.info("宸插彇娑堝垹闄�");
+ });
+ };
+
+ // 鑾峰彇鐘舵�佹爣绛剧被鍨�
+ const getStatusType = status => {
+ const statusTypeMap = {
+ notStarted: "info",
+ completed: "success",
+ delayed: "danger",
+ };
+ return statusTypeMap[status] || "default";
+ };
+
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusTextMap = {
+ notStarted: "鏈紑濮�",
+ completed: "宸插畬鎴�",
+ delayed: "宸插欢杩�",
+ };
+ return statusTextMap[status] || status;
+ };
+
+ // 鐩戝惉椤圭洰ID鍙樺寲
+ watch(
+ () => props.projectId,
+ () => {
+ if (props.projectId) {
+ getMilestoneList();
+ }
+ }
+ );
+
+ // 鍒濆鍖�
+ onMounted(() => {
+ if (props.projectId) {
+ getMilestoneList();
+ }
+ });
</script>
<style scoped>
-.milestone-list-container {
- padding: 10px 0;
-}
+ .milestone-list-container {
+ padding: 10px 0;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.milestone-actions {
- display: flex;
- gap: 10px;
-}
+ .milestone-actions {
+ display: flex;
+ gap: 10px;
+ }
-.milestone-content {
- padding: 10px 0;
-}
+ .milestone-content {
+ padding: 10px 0;
+ }
-.milestone-status {
- margin-top: 10px;
-}
+ .milestone-status {
+ margin-top: 10px;
+ }
-.empty-tip {
- margin-top: 40px;
- text-align: center;
-}
+ .empty-tip {
+ margin-top: 40px;
+ text-align: center;
+ }
-.dialog-footer {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
-}
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ }
</style>
diff --git a/src/views/oaSystem/projectManagement/components/taskTree.vue b/src/views/oaSystem/projectManagement/components/taskTree.vue
index 11e3ae8..ddcdb54 100644
--- a/src/views/oaSystem/projectManagement/components/taskTree.vue
+++ b/src/views/oaSystem/projectManagement/components/taskTree.vue
@@ -2,69 +2,98 @@
<div class="task-tree-container">
<!-- 浠诲姟鏍戞搷浣滄寜閽� -->
<div class="tree-actions mb10">
- <el-button type="primary" size="small" icon="Plus" @click="handleAddTask">娣诲姞浠诲姟</el-button>
- <el-button type="success" size="small" icon="RefreshRight" @click="refreshTree">鍒锋柊</el-button>
- <el-button type="info" size="small" icon="Filter" @click="toggleFilter">
+ <el-button type="primary"
+ size="small"
+ icon="Plus"
+ @click="handleAddTask">娣诲姞浠诲姟</el-button>
+ <el-button type="success"
+ size="small"
+ icon="RefreshRight"
+ @click="refreshTree">鍒锋柊</el-button>
+ <el-button type="info"
+ size="small"
+ icon="Filter"
+ @click="toggleFilter">
{{ showFilter ? '闅愯棌绛涢��' : '鏄剧ず绛涢��' }}
</el-button>
</div>
-
<!-- 绛涢�夋潯浠� -->
- <div v-if="showFilter" class="filter-section mb10">
- <el-form :inline="true" :model="filterParams">
+ <div v-if="showFilter"
+ class="filter-section mb10">
+ <el-form :inline="true"
+ :model="filterParams">
<el-form-item label="浠诲姟鐘舵��">
- <el-select v-model="filterParams.status" placeholder="鍏ㄩ儴" clearable style="width: 120px">
- <el-option label="鏈紑濮�" value="notStarted" />
- <el-option label="杩涜涓�" value="inProgress" />
- <el-option label="宸插畬鎴�" value="completed" />
- <el-option label="宸查�炬湡" value="overdue" />
+ <el-select v-model="filterParams.status"
+ placeholder="鍏ㄩ儴"
+ clearable
+ style="width: 120px">
+ <el-option label="鏈紑濮�"
+ value="notStarted" />
+ <el-option label="杩涜涓�"
+ value="inProgress" />
+ <el-option label="宸插畬鎴�"
+ value="completed" />
+ <el-option label="宸查�炬湡"
+ value="overdue" />
</el-select>
</el-form-item>
<el-form-item label="璐熻矗浜�">
- <el-input v-model="filterParams.assignee" placeholder="杈撳叆璐熻矗浜�" clearable style="width: 150px" />
+ <el-input v-model="filterParams.assignee"
+ placeholder="杈撳叆璐熻矗浜�"
+ clearable
+ style="width: 150px" />
</el-form-item>
<el-form-item>
- <el-button type="primary" size="small" @click="filterTree">绛涢��</el-button>
- <el-button size="small" @click="resetFilter">閲嶇疆</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="filterTree">绛涢��</el-button>
+ <el-button size="small"
+ @click="resetFilter">閲嶇疆</el-button>
</el-form-item>
</el-form>
</div>
-
<!-- 浠诲姟鏍� -->
<div class="tree-content">
- <el-tree
- v-loading="loading"
- :data="taskTreeData"
- :props="defaultProps"
- :expand-on-click-node="false"
- node-key="nodeId"
- ref="treeRef"
- @node-contextmenu="handleContextMenu"
- @node-click="handleNodeClick"
- >
+ <el-tree v-loading="loading"
+ :data="taskTreeData"
+ :props="defaultProps"
+ :expand-on-click-node="false"
+ node-key="nodeId"
+ ref="treeRef"
+ @node-contextmenu="handleContextMenu"
+ @node-click="handleNodeClick">
<template #default="{ node, data }">
<!-- 鑺傜偣鍐呭 -->
- <div class="tree-node-content" :class="{ 'phase-node': data.type === 'phase', 'task-node': data.type === 'task' }">
+ <div class="tree-node-content"
+ :class="{ 'phase-node': data.type === 'phase', 'task-node': data.type === 'task' }">
<!-- 鑺傜偣鍥炬爣 -->
<div class="node-icon">
- <i v-if="data.type === 'phase'" class="el-icon-folder text-primary" />
- <i v-else-if="data.status === 'completed'" class="el-icon-circle-check text-success" />
- <i v-else-if="data.status === 'inProgress'" class="el-icon-circle-check text-primary" />
- <i v-else-if="data.status === 'overdue'" class="el-icon-alarm-clock text-danger" />
- <i v-else class="el-icon-circle-close text-gray-400" />
+ <i v-if="data.type === 'phase'"
+ class="el-icon-folder text-primary" />
+ <i v-else-if="data.status === 'completed'"
+ class="el-icon-circle-check text-success" />
+ <i v-else-if="data.status === 'inProgress'"
+ class="el-icon-circle-check text-primary" />
+ <i v-else-if="data.status === 'overdue'"
+ class="el-icon-alarm-clock text-danger" />
+ <i v-else
+ class="el-icon-circle-close text-gray-400" />
</div>
-
<!-- 鑺傜偣鏍囬鍜屾弿杩� -->
<div class="node-info">
- <div class="node-title" :class="{ 'overdue-title': data.type === 'task' && data.status === 'overdue' }">
+ <div class="node-title"
+ :class="{ 'overdue-title': data.type === 'task' && data.status === 'overdue' }">
{{ node.label }}
- <span v-if="data.type === 'task' && data.priority === 'high'" class="priority-tag">楂樹紭</span>
- <span v-else-if="data.type === 'task' && data.priority === 'medium'" class="priority-tag medium">涓紭</span>
+ <span v-if="data.type === 'task' && data.priority === 'high'"
+ class="priority-tag">楂樹紭</span>
+ <span v-else-if="data.type === 'task' && data.priority === 'medium'"
+ class="priority-tag medium">涓紭</span>
</div>
- <div v-if="data.description" class="node-description">{{ data.description }}</div>
-
+ <div v-if="data.description"
+ class="node-description">{{ data.description }}</div>
<!-- 浠诲姟鍏冧俊鎭� -->
- <div v-if="data.type === 'task'" class="task-meta">
+ <div v-if="data.type === 'task'"
+ class="task-meta">
<span class="meta-item">
<i class="el-icon-user"></i>
{{ data.assigneeName || '鏈垎閰�' }}
@@ -75,97 +104,115 @@
</span>
</div>
</div>
-
<!-- 浠诲姟杩涘害鏉� -->
- <div v-if="data.type === 'task'" class="task-progress">
- <el-progress :percentage="data.progress || 0" :stroke-width="4" :show-text="false" />
+ <div v-if="data.type === 'task'"
+ class="task-progress">
+ <el-progress :percentage="data.progress || 0"
+ :stroke-width="4"
+ :show-text="false" />
</div>
-
<!-- 鎿嶄綔鎸夐挳 -->
<div class="node-actions">
- <el-button
- v-if="data.type === 'task'"
- type="text"
- size="small"
- icon="Edit"
- @click.stop="handleEditTask(data)"
- v-hasPermi="['oaSystem:task:edit']"
- />
- <el-button
- v-if="data.type === 'phase'"
- type="text"
- size="small"
- icon="Plus"
- @click.stop="handleAddTaskUnderPhase(data)"
- v-hasPermi="['oaSystem:task:add']"
- />
- <el-button
- type="text"
- size="small"
- icon="Delete"
- @click.stop="handleDeleteNode(data)"
- v-hasPermi="['oaSystem:task:remove']"
- />
+ <el-button v-if="data.type === 'task'"
+ type="text"
+ size="small"
+ icon="Edit"
+ @click.stop="handleEditTask(data)"
+ v-hasPermi="['oaSystem:task:edit']" />
+ <el-button v-if="data.type === 'phase'"
+ type="text"
+ size="small"
+ icon="Plus"
+ @click.stop="handleAddTaskUnderPhase(data)"
+ v-hasPermi="['oaSystem:task:add']" />
+ <el-button type="text"
+ size="small"
+ icon="Delete"
+ @click.stop="handleDeleteNode(data)"
+ v-hasPermi="['oaSystem:task:remove']" />
</div>
</div>
</template>
</el-tree>
</div>
-
<!-- 鍙抽敭鑿滃崟 -->
- <div v-if="showContextMenu" :style="contextMenuStyle" class="context-menu">
+ <div v-if="showContextMenu"
+ :style="contextMenuStyle"
+ class="context-menu">
<el-menu @select="handleContextMenuSelect">
- <el-menu-item v-if="selectedNode.type === 'task'" index="edit">缂栬緫浠诲姟</el-menu-item>
- <el-menu-item v-if="selectedNode.type === 'phase'" index="addTask">娣诲姞瀛愪换鍔�</el-menu-item>
+ <el-menu-item v-if="selectedNode.type === 'task'"
+ index="edit">缂栬緫浠诲姟</el-menu-item>
+ <el-menu-item v-if="selectedNode.type === 'phase'"
+ index="addTask">娣诲姞瀛愪换鍔�</el-menu-item>
<el-menu-item index="delete">鍒犻櫎</el-menu-item>
<el-menu-item index="expandAll">灞曞紑鍏ㄩ儴</el-menu-item>
<el-menu-item index="collapseAll">鏀惰捣鍏ㄩ儴</el-menu-item>
</el-menu>
</div>
-
<!-- 浠诲姟琛ㄥ崟瀵硅瘽妗� -->
- <el-dialog :title="dialogTitle" v-model="dialogOpen" width="600px" append-to-body>
- <el-form ref="taskFormRef" :model="taskForm" :rules="taskRules" label-width="80px">
- <el-form-item label="浠诲姟鍚嶇О" prop="taskName">
- <el-input v-model="taskForm.taskName" placeholder="璇疯緭鍏ヤ换鍔″悕绉�" />
+ <el-dialog :title="dialogTitle"
+ v-model="dialogOpen"
+ width="600px"
+ append-to-body>
+ <el-form ref="taskFormRef"
+ :model="taskForm"
+ :rules="taskRules"
+ label-width="80px">
+ <el-form-item label="浠诲姟鍚嶇О"
+ prop="taskName">
+ <el-input v-model="taskForm.taskName"
+ placeholder="璇疯緭鍏ヤ换鍔″悕绉�" />
</el-form-item>
- <el-form-item label="璐熻矗浜�" prop="assigneeId">
- <el-input v-model="taskForm.assigneeId" placeholder="璇疯緭鍏ヨ礋璐ｄ汉ID" />
+ <el-form-item label="璐熻矗浜�"
+ prop="assigneeId">
+ <el-input v-model="taskForm.assigneeId"
+ placeholder="璇疯緭鍏ヨ礋璐ｄ汉ID" />
</el-form-item>
- <el-form-item label="寮�濮嬫棩鏈�" prop="startDate">
- <el-date-picker
- v-model="taskForm.startDate"
- type="date"
- placeholder="閫夋嫨寮�濮嬫棩鏈�"
- style="width: 100%"
- />
+ <el-form-item label="寮�濮嬫棩鏈�"
+ prop="startDate">
+ <el-date-picker v-model="taskForm.startDate"
+ type="date"
+ placeholder="閫夋嫨寮�濮嬫棩鏈�"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="缁撴潫鏃ユ湡" prop="endDate">
- <el-date-picker
- v-model="taskForm.endDate"
- type="date"
- placeholder="閫夋嫨缁撴潫鏃ユ湡"
- style="width: 100%"
- />
+ <el-form-item label="缁撴潫鏃ユ湡"
+ prop="endDate">
+ <el-date-picker v-model="taskForm.endDate"
+ type="date"
+ placeholder="閫夋嫨缁撴潫鏃ユ湡"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="浼樺厛绾�" prop="priority">
- <el-select v-model="taskForm.priority" placeholder="閫夋嫨浼樺厛绾�">
- <el-option label="浣�" value="low" />
- <el-option label="涓�" value="medium" />
- <el-option label="楂�" value="high" />
+ <el-form-item label="浼樺厛绾�"
+ prop="priority">
+ <el-select v-model="taskForm.priority"
+ placeholder="閫夋嫨浼樺厛绾�">
+ <el-option label="浣�"
+ value="low" />
+ <el-option label="涓�"
+ value="medium" />
+ <el-option label="楂�"
+ value="high" />
</el-select>
</el-form-item>
- <el-form-item label="杩涘害" prop="progress">
- <el-input-number v-model="taskForm.progress" :min="0" :max="100" style="width: 100%" />
+ <el-form-item label="杩涘害"
+ prop="progress">
+ <el-input-number v-model="taskForm.progress"
+ :min="0"
+ :max="100"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="鎻忚堪" prop="description">
- <el-input v-model="taskForm.description" type="textarea" placeholder="璇疯緭鍏ヤ换鍔℃弿杩�" />
+ <el-form-item label="鎻忚堪"
+ prop="description">
+ <el-input v-model="taskForm.description"
+ type="textarea"
+ placeholder="璇疯緭鍏ヤ换鍔℃弿杩�" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitTaskForm">纭畾</el-button>
<el-button @click="dialogOpen = false">鍙栨秷</el-button>
- <el-button type="primary" @click="submitTaskForm">纭畾</el-button>
</div>
</template>
</el-dialog>
@@ -173,662 +220,676 @@
</template>
<script setup>
-import { ref, reactive, computed, watch, onMounted } from 'vue';
-import { ElMessage, ElMessageBox, ElMenu, ElMenuItem } from 'element-plus';
-// import { getProject, addTask, updateTask, deleteTask, deletePhase } from '@/api/oaSystem/projectManagement';
+ import { ref, reactive, computed, watch, onMounted } from "vue";
+ import { ElMessage, ElMessageBox, ElMenu, ElMenuItem } from "element-plus";
+ // import { getProject, addTask, updateTask, deleteTask, deletePhase } from '@/api/oaSystem/projectManagement';
-const props = defineProps({
- projectId: {
- type: String,
- required: true
- }
-});
-
-const emit = defineEmits(['refresh']);
-
-// 缁勪欢鐘舵��
-const loading = ref(false);
-const treeRef = ref();
-const showContextMenu = ref(false);
-const contextMenuStyle = ref({});
-const selectedNode = ref({});
-const showFilter = ref(false);
-const dialogOpen = ref(false);
-const dialogTitle = ref('');
-const taskFormRef = ref();
-
-// 绛涢�夊弬鏁�
-const filterParams = reactive({
- status: '',
- assignee: ''
-});
-
-// 浠诲姟琛ㄥ崟鏁版嵁
-const taskForm = reactive({
- taskId: undefined,
- taskName: '',
- description: '',
- startDate: '',
- endDate: '',
- assigneeId: '',
- assigneeName: '',
- status: 'notStarted',
- progress: 0,
- priority: 'medium',
- phaseId: '',
- projectId: props.projectId
-});
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const taskRules = {
- taskName: [
- { required: true, message: '浠诲姟鍚嶇О涓嶈兘涓虹┖', trigger: 'blur' },
- { min: 2, max: 50, message: '浠诲姟鍚嶇О闀垮害鍦� 2 鍒� 50 涓瓧绗�', trigger: 'blur' }
- ],
- startDate: [
- { required: true, message: '寮�濮嬫棩鏈熶笉鑳戒负绌�', trigger: 'change' }
- ],
- endDate: [
- { required: true, message: '缁撴潫鏃ユ湡涓嶈兘涓虹┖', trigger: 'change' }
- ],
- assigneeId: [
- { required: true, message: '璐熻矗浜轰笉鑳戒负绌�', trigger: 'blur' }
- ],
- progress: [
- { required: true, message: '杩涘害涓嶈兘涓虹┖', trigger: 'blur' },
- { type: 'number', min: 0, max: 100, message: '杩涘害蹇呴』鍦� 0 鍒� 100 涔嬮棿', trigger: 'blur' }
- ]
-};
-
-// 浠诲姟鏍戞暟鎹�
-const rawTaskTreeData = ref([]);
-
-// 妯℃嫙浠诲姟鏁版嵁
-const mockTaskData = {
- 'PRJ2023001': [
- {
- phaseId: 'PHASE001',
- phaseName: '闇�姹傚垎鏋�',
- startDate: '2023-11-01',
- endDate: '2023-11-15',
- status: 'completed',
- tasks: [
- {
- taskId: 'TASK001',
- taskName: '闇�姹傝皟鐮�',
- description: '璋冪爺鐢ㄦ埛闇�姹傚拰涓氬姟娴佺▼',
- startDate: '2023-11-01',
- endDate: '2023-11-05',
- assigneeId: 'USER001',
- assigneeName: '寮犱笁',
- status: 'completed',
- progress: 100,
- priority: 'medium'
- },
- {
- taskId: 'TASK002',
- taskName: '闇�姹傛枃妗ｇ紪鍐�',
- description: '缂栧啓璇︾粏鐨勯渶姹傝鏍艰鏄庝功',
- startDate: '2023-11-06',
- endDate: '2023-11-15',
- assigneeId: 'USER002',
- assigneeName: '鏉庡洓',
- status: 'completed',
- progress: 100,
- priority: 'high'
- }
- ]
+ const props = defineProps({
+ projectId: {
+ type: String,
+ required: true,
},
- {
- phaseId: 'PHASE002',
- phaseName: '绯荤粺璁捐',
- startDate: '2023-11-16',
- endDate: '2023-12-10',
- status: 'completed',
- tasks: [
- {
- taskId: 'TASK003',
- taskName: '绯荤粺鏋舵瀯璁捐',
- description: '璁捐绯荤粺鏁翠綋鏋舵瀯',
- startDate: '2023-11-16',
- endDate: '2023-11-25',
- assigneeId: 'USER003',
- assigneeName: '鐜嬩簲',
- status: 'completed',
- progress: 100,
- priority: 'high'
- },
- {
- taskId: 'TASK004',
- taskName: '鏁版嵁搴撹璁�',
- description: '璁捐鏁版嵁搴撹〃缁撴瀯鍜屽叧绯�',
- startDate: '2023-11-26',
- endDate: '2023-12-10',
- assigneeId: 'USER004',
- assigneeName: '璧靛叚',
- status: 'completed',
- progress: 100,
- priority: 'medium'
- }
- ]
- },
- {
- phaseId: 'PHASE003',
- phaseName: '寮�鍙戝疄鐜�',
- startDate: '2023-12-11',
- endDate: '2024-01-31',
- status: 'inProgress',
- tasks: [
- {
- taskId: 'TASK005',
- taskName: '鍓嶇寮�鍙�',
- description: '寮�鍙戠敤鎴风晫闈㈠拰浜や簰閫昏緫',
- startDate: '2023-12-11',
- endDate: '2024-01-15',
- assigneeId: 'USER005',
- assigneeName: '閽变竷',
- status: 'inProgress',
- progress: 70,
- priority: 'high'
- },
- {
- taskId: 'TASK006',
- taskName: '鍚庣寮�鍙�',
- description: '寮�鍙戜笟鍔￠�昏緫鍜孉PI鎺ュ彛',
- startDate: '2023-12-11',
- endDate: '2024-01-20',
- assigneeId: 'USER006',
- assigneeName: '瀛欏叓',
- status: 'inProgress',
- progress: 60,
- priority: 'high'
- }
- ]
- }
- ],
- // 榛樿鏁版嵁
- default: [
- {
- phaseId: 'PHASE_DEFAULT1',
- phaseName: '鍑嗗闃舵',
- startDate: '2023-01-01',
- endDate: '2023-03-31',
- status: 'completed',
- tasks: [
- {
- taskId: 'TASK_DEFAULT1',
- taskName: '椤圭洰鍚姩',
- description: '鍙紑椤圭洰鍚姩浼氳',
- startDate: '2023-01-01',
- endDate: '2023-01-05',
- assigneeId: 'USER_DEFAULT1',
- assigneeName: '璐熻矗浜篈',
- status: 'completed',
- progress: 100,
- priority: 'high'
- }
- ]
- },
- {
- phaseId: 'PHASE_DEFAULT2',
- phaseName: '鎵ц闃舵',
- startDate: '2023-04-01',
- endDate: '2023-09-30',
- status: 'inProgress',
- tasks: [
- {
- taskId: 'TASK_DEFAULT2',
- taskName: '鏍稿績鍔熻兘寮�鍙�',
- description: '寮�鍙戠郴缁熸牳蹇冨姛鑳芥ā鍧�',
- startDate: '2023-04-01',
- endDate: '2023-06-30',
- assigneeId: 'USER_DEFAULT2',
- assigneeName: '璐熻矗浜築',
- status: 'inProgress',
- progress: 50,
- priority: 'high'
- }
- ]
- }
- ]
-};
-
-const taskTreeData = computed(() => {
- // 搴旂敤绛涢�夋潯浠�
- if (!showFilter.value || (!filterParams.status && !filterParams.assignee)) {
- return rawTaskTreeData.value;
- }
-
- // 娣辨嫹璐濆師濮嬫暟鎹互閬垮厤淇敼
- const filteredData = JSON.parse(JSON.stringify(rawTaskTreeData.value));
-
- // 閫掑綊绛涢�夎妭鐐�
- const filterNodes = (nodes) => {
- const result = [];
-
- nodes.forEach(node => {
- // 瀵逛簬闃舵鑺傜偣锛屾鏌ュ叾瀛愪换鍔℃槸鍚︾鍚堢瓫閫夋潯浠�
- if (node.type === 'phase' && node.children) {
- const filteredChildren = filterNodes(node.children);
- if (filteredChildren.length > 0) {
- // 淇濈暀鑷冲皯鏈変竴涓瓙浠诲姟绗﹀悎鏉′欢鐨勯樁娈�
- node.children = filteredChildren;
- result.push(node);
- }
- }
- // 瀵逛簬浠诲姟鑺傜偣锛岀洿鎺ュ簲鐢ㄧ瓫閫夋潯浠�
- else if (node.type === 'task') {
- const statusMatch = !filterParams.status || node.status === filterParams.status;
- const assigneeMatch = !filterParams.assignee ||
- (node.assigneeName && node.assigneeName.includes(filterParams.assignee));
-
- if (statusMatch && assigneeMatch) {
- result.push(node);
- }
- }
- });
-
- return result;
- };
-
- return filterNodes(filteredData);
-});
-
-// 鏍戣妭鐐归厤缃�
-const defaultProps = {
- children: 'children',
- label: (data) => {
- if (data.type === 'phase') {
- return `${data.phaseName}`;
- } else {
- return `${data.taskName}`;
- }
- }
-};
-
-// 鍔犺浇浠诲姟鏍戞暟鎹�
-const loadTaskTree = async () => {
- loading.value = true;
- // try {
- // const { data } = await getProject(props.projectId);
- // rawTaskTreeData.value = buildTaskTree(data.phases || []);
- // } catch (error) {
- // ElMessage.error('鍔犺浇浠诲姟鏍戝け璐�');
- // console.error('鍔犺浇浠诲姟鏍戝け璐�:', error);
- // } finally {
- // loading.value = false;
- // }
- try {
- // 妯℃嫙缃戠粶寤惰繜
- await new Promise(resolve => setTimeout(resolve, 500));
-
- // 浣跨敤妯℃嫙鏁版嵁鏇夸唬API璇锋眰
- const phases = mockTaskData[props.projectId] || mockTaskData.default;
- rawTaskTreeData.value = buildTaskTree(phases);
- } catch (error) {
- ElMessage.error('鍔犺浇浠诲姟鏍戝け璐�');
- console.error('鍔犺浇浠诲姟鏍戝け璐�:', error);
- } finally {
- loading.value = false;
- }
-};
-
-// 鏋勫缓浠诲姟鏍�
-const buildTaskTree = (phases) => {
- return phases.map(phase => ({
- nodeId: phase.phaseId,
- phaseId: phase.phaseId,
- phaseName: phase.phaseName,
- type: 'phase',
- children: (phase.tasks || []).map(task => ({
- nodeId: task.taskId,
- taskId: task.taskId,
- taskName: task.taskName,
- description: task.description,
- startDate: task.startDate,
- endDate: task.endDate,
- assigneeId: task.assigneeId,
- assigneeName: task.assigneeName,
- status: task.status,
- progress: task.progress,
- priority: task.priority,
- phaseId: task.phaseId,
- projectId: props.projectId,
- type: 'task'
- }))
- }));
-};
-
-// 鏍煎紡鍖栨棩鏈熻寖鍥�
-const formatDateRange = (startDate, endDate) => {
- if (!startDate || !endDate) return '';
- return `${startDate} - ${endDate}`;
-};
-
-// 鍒锋柊鏍�
-const refreshTree = () => {
- loadTaskTree();
- // 閫氱煡鐖剁粍浠跺埛鏂版暟鎹�
- emit('refresh');
-};
-
-// 鍒囨崲绛涢�夐潰鏉�
-const toggleFilter = () => {
- showFilter.value = !showFilter.value;
-};
-
-// 搴旂敤绛涢��
-const filterTree = () => {
- // 绛涢�夐�昏緫宸茬粡鍦╟omputed涓疄鐜�
-};
-
-// 閲嶇疆绛涢��
-const resetFilter = () => {
- filterParams.status = '';
- filterParams.assignee = '';
-};
-
-// 澶勭悊鑺傜偣鐐瑰嚮
-const handleNodeClick = (data, node) => {
- // 鍒囨崲灞曞紑/鏀惰捣鐘舵��
- if (data.type === 'phase') {
- node.expanded = !node.expanded;
- }
-};
-
-// 澶勭悊鍙抽敭鑿滃崟
-const handleContextMenu = (event, data) => {
- event.preventDefault();
- selectedNode.value = data;
- contextMenuStyle.value = {
- position: 'fixed',
- left: `${event.clientX}px`,
- top: `${event.clientY}px`,
- zIndex: 1000
- };
- showContextMenu.value = true;
-};
-
-// 澶勭悊鍙抽敭鑿滃崟閫夋嫨
-const handleContextMenuSelect = (index) => {
- showContextMenu.value = false;
- switch (index) {
- case 'edit':
- if (selectedNode.value.type === 'task') {
- handleEditTask(selectedNode.value);
- }
- break;
- case 'addTask':
- if (selectedNode.value.type === 'phase') {
- handleAddTaskUnderPhase(selectedNode.value);
- }
- break;
- case 'delete':
- handleDeleteNode(selectedNode.value);
- break;
- case 'expandAll':
- treeRef.value?.expandAll();
- break;
- case 'collapseAll':
- treeRef.value?.collapseAll();
- break;
- }
-};
-
-// 娣诲姞浠诲姟
-const handleAddTask = () => {
- resetTaskForm();
- dialogTitle.value = '娣诲姞浠诲姟';
- dialogOpen.value = true;
-};
-
-// 鍦ㄦ寚瀹氶樁娈典笅娣诲姞浠诲姟
-const handleAddTaskUnderPhase = (phase) => {
- resetTaskForm();
- taskForm.phaseId = phase.phaseId;
- dialogTitle.value = '娣诲姞瀛愪换鍔�';
- dialogOpen.value = true;
-};
-
-// 缂栬緫浠诲姟
-const handleEditTask = (task) => {
- resetTaskForm();
- Object.assign(taskForm, { ...task });
- dialogTitle.value = '缂栬緫浠诲姟';
- dialogOpen.value = true;
-};
-
-// 鍒犻櫎鑺傜偣
-const handleDeleteNode = async (node) => {
- const confirmMessage = node.type === 'phase'
- ? `纭畾瑕佸垹闄ら樁娈� "${node.phaseName}" 鍙婂叾鎵�鏈夊瓙浠诲姟鍚楋紵`
- : `纭畾瑕佸垹闄や换鍔� "${node.taskName}" 鍚楋紵`;
-
- await ElMessageBox.confirm(confirmMessage, '纭鎿嶄綔', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).catch(() => {
- throw new Error('鍙栨秷鍒犻櫎');
});
-
- try {
- if (node.type === 'phase') {
- await deletePhase(node.phaseId);
- } else {
- await deleteTask(node.taskId);
+
+ const emit = defineEmits(["refresh"]);
+
+ // 缁勪欢鐘舵��
+ const loading = ref(false);
+ const treeRef = ref();
+ const showContextMenu = ref(false);
+ const contextMenuStyle = ref({});
+ const selectedNode = ref({});
+ const showFilter = ref(false);
+ const dialogOpen = ref(false);
+ const dialogTitle = ref("");
+ const taskFormRef = ref();
+
+ // 绛涢�夊弬鏁�
+ const filterParams = reactive({
+ status: "",
+ assignee: "",
+ });
+
+ // 浠诲姟琛ㄥ崟鏁版嵁
+ const taskForm = reactive({
+ taskId: undefined,
+ taskName: "",
+ description: "",
+ startDate: "",
+ endDate: "",
+ assigneeId: "",
+ assigneeName: "",
+ status: "notStarted",
+ progress: 0,
+ priority: "medium",
+ phaseId: "",
+ projectId: props.projectId,
+ });
+
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const taskRules = {
+ taskName: [
+ { required: true, message: "浠诲姟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 50,
+ message: "浠诲姟鍚嶇О闀垮害鍦� 2 鍒� 50 涓瓧绗�",
+ trigger: "blur",
+ },
+ ],
+ startDate: [
+ { required: true, message: "寮�濮嬫棩鏈熶笉鑳戒负绌�", trigger: "change" },
+ ],
+ endDate: [{ required: true, message: "缁撴潫鏃ユ湡涓嶈兘涓虹┖", trigger: "change" }],
+ assigneeId: [{ required: true, message: "璐熻矗浜轰笉鑳戒负绌�", trigger: "blur" }],
+ progress: [
+ { required: true, message: "杩涘害涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ type: "number",
+ min: 0,
+ max: 100,
+ message: "杩涘害蹇呴』鍦� 0 鍒� 100 涔嬮棿",
+ trigger: "blur",
+ },
+ ],
+ };
+
+ // 浠诲姟鏍戞暟鎹�
+ const rawTaskTreeData = ref([]);
+
+ // 妯℃嫙浠诲姟鏁版嵁
+ const mockTaskData = {
+ PRJ2023001: [
+ {
+ phaseId: "PHASE001",
+ phaseName: "闇�姹傚垎鏋�",
+ startDate: "2023-11-01",
+ endDate: "2023-11-15",
+ status: "completed",
+ tasks: [
+ {
+ taskId: "TASK001",
+ taskName: "闇�姹傝皟鐮�",
+ description: "璋冪爺鐢ㄦ埛闇�姹傚拰涓氬姟娴佺▼",
+ startDate: "2023-11-01",
+ endDate: "2023-11-05",
+ assigneeId: "USER001",
+ assigneeName: "寮犱笁",
+ status: "completed",
+ progress: 100,
+ priority: "medium",
+ },
+ {
+ taskId: "TASK002",
+ taskName: "闇�姹傛枃妗ｇ紪鍐�",
+ description: "缂栧啓璇︾粏鐨勯渶姹傝鏍艰鏄庝功",
+ startDate: "2023-11-06",
+ endDate: "2023-11-15",
+ assigneeId: "USER002",
+ assigneeName: "鏉庡洓",
+ status: "completed",
+ progress: 100,
+ priority: "high",
+ },
+ ],
+ },
+ {
+ phaseId: "PHASE002",
+ phaseName: "绯荤粺璁捐",
+ startDate: "2023-11-16",
+ endDate: "2023-12-10",
+ status: "completed",
+ tasks: [
+ {
+ taskId: "TASK003",
+ taskName: "绯荤粺鏋舵瀯璁捐",
+ description: "璁捐绯荤粺鏁翠綋鏋舵瀯",
+ startDate: "2023-11-16",
+ endDate: "2023-11-25",
+ assigneeId: "USER003",
+ assigneeName: "鐜嬩簲",
+ status: "completed",
+ progress: 100,
+ priority: "high",
+ },
+ {
+ taskId: "TASK004",
+ taskName: "鏁版嵁搴撹璁�",
+ description: "璁捐鏁版嵁搴撹〃缁撴瀯鍜屽叧绯�",
+ startDate: "2023-11-26",
+ endDate: "2023-12-10",
+ assigneeId: "USER004",
+ assigneeName: "璧靛叚",
+ status: "completed",
+ progress: 100,
+ priority: "medium",
+ },
+ ],
+ },
+ {
+ phaseId: "PHASE003",
+ phaseName: "寮�鍙戝疄鐜�",
+ startDate: "2023-12-11",
+ endDate: "2024-01-31",
+ status: "inProgress",
+ tasks: [
+ {
+ taskId: "TASK005",
+ taskName: "鍓嶇寮�鍙�",
+ description: "寮�鍙戠敤鎴风晫闈㈠拰浜や簰閫昏緫",
+ startDate: "2023-12-11",
+ endDate: "2024-01-15",
+ assigneeId: "USER005",
+ assigneeName: "閽变竷",
+ status: "inProgress",
+ progress: 70,
+ priority: "high",
+ },
+ {
+ taskId: "TASK006",
+ taskName: "鍚庣寮�鍙�",
+ description: "寮�鍙戜笟鍔￠�昏緫鍜孉PI鎺ュ彛",
+ startDate: "2023-12-11",
+ endDate: "2024-01-20",
+ assigneeId: "USER006",
+ assigneeName: "瀛欏叓",
+ status: "inProgress",
+ progress: 60,
+ priority: "high",
+ },
+ ],
+ },
+ ],
+ // 榛樿鏁版嵁
+ default: [
+ {
+ phaseId: "PHASE_DEFAULT1",
+ phaseName: "鍑嗗闃舵",
+ startDate: "2023-01-01",
+ endDate: "2023-03-31",
+ status: "completed",
+ tasks: [
+ {
+ taskId: "TASK_DEFAULT1",
+ taskName: "椤圭洰鍚姩",
+ description: "鍙紑椤圭洰鍚姩浼氳",
+ startDate: "2023-01-01",
+ endDate: "2023-01-05",
+ assigneeId: "USER_DEFAULT1",
+ assigneeName: "璐熻矗浜篈",
+ status: "completed",
+ progress: 100,
+ priority: "high",
+ },
+ ],
+ },
+ {
+ phaseId: "PHASE_DEFAULT2",
+ phaseName: "鎵ц闃舵",
+ startDate: "2023-04-01",
+ endDate: "2023-09-30",
+ status: "inProgress",
+ tasks: [
+ {
+ taskId: "TASK_DEFAULT2",
+ taskName: "鏍稿績鍔熻兘寮�鍙�",
+ description: "寮�鍙戠郴缁熸牳蹇冨姛鑳芥ā鍧�",
+ startDate: "2023-04-01",
+ endDate: "2023-06-30",
+ assigneeId: "USER_DEFAULT2",
+ assigneeName: "璐熻矗浜築",
+ status: "inProgress",
+ progress: 50,
+ priority: "high",
+ },
+ ],
+ },
+ ],
+ };
+
+ const taskTreeData = computed(() => {
+ // 搴旂敤绛涢�夋潯浠�
+ if (!showFilter.value || (!filterParams.status && !filterParams.assignee)) {
+ return rawTaskTreeData.value;
}
- ElMessage.success('鍒犻櫎鎴愬姛');
- refreshTree();
- } catch (error) {
- if (error.message !== '鍙栨秷鍒犻櫎') {
- ElMessage.error('鍒犻櫎澶辫触');
- console.error('鍒犻櫎澶辫触:', error);
+
+ // 娣辨嫹璐濆師濮嬫暟鎹互閬垮厤淇敼
+ const filteredData = JSON.parse(JSON.stringify(rawTaskTreeData.value));
+
+ // 閫掑綊绛涢�夎妭鐐�
+ const filterNodes = nodes => {
+ const result = [];
+
+ nodes.forEach(node => {
+ // 瀵逛簬闃舵鑺傜偣锛屾鏌ュ叾瀛愪换鍔℃槸鍚︾鍚堢瓫閫夋潯浠�
+ if (node.type === "phase" && node.children) {
+ const filteredChildren = filterNodes(node.children);
+ if (filteredChildren.length > 0) {
+ // 淇濈暀鑷冲皯鏈変竴涓瓙浠诲姟绗﹀悎鏉′欢鐨勯樁娈�
+ node.children = filteredChildren;
+ result.push(node);
+ }
+ }
+ // 瀵逛簬浠诲姟鑺傜偣锛岀洿鎺ュ簲鐢ㄧ瓫閫夋潯浠�
+ else if (node.type === "task") {
+ const statusMatch =
+ !filterParams.status || node.status === filterParams.status;
+ const assigneeMatch =
+ !filterParams.assignee ||
+ (node.assigneeName &&
+ node.assigneeName.includes(filterParams.assignee));
+
+ if (statusMatch && assigneeMatch) {
+ result.push(node);
+ }
+ }
+ });
+
+ return result;
+ };
+
+ return filterNodes(filteredData);
+ });
+
+ // 鏍戣妭鐐归厤缃�
+ const defaultProps = {
+ children: "children",
+ label: data => {
+ if (data.type === "phase") {
+ return `${data.phaseName}`;
+ } else {
+ return `${data.taskName}`;
+ }
+ },
+ };
+
+ // 鍔犺浇浠诲姟鏍戞暟鎹�
+ const loadTaskTree = async () => {
+ loading.value = true;
+ // try {
+ // const { data } = await getProject(props.projectId);
+ // rawTaskTreeData.value = buildTaskTree(data.phases || []);
+ // } catch (error) {
+ // ElMessage.error('鍔犺浇浠诲姟鏍戝け璐�');
+ // console.error('鍔犺浇浠诲姟鏍戝け璐�:', error);
+ // } finally {
+ // loading.value = false;
+ // }
+ try {
+ // 妯℃嫙缃戠粶寤惰繜
+ await new Promise(resolve => setTimeout(resolve, 500));
+
+ // 浣跨敤妯℃嫙鏁版嵁鏇夸唬API璇锋眰
+ const phases = mockTaskData[props.projectId] || mockTaskData.default;
+ rawTaskTreeData.value = buildTaskTree(phases);
+ } catch (error) {
+ ElMessage.error("鍔犺浇浠诲姟鏍戝け璐�");
+ console.error("鍔犺浇浠诲姟鏍戝け璐�:", error);
+ } finally {
+ loading.value = false;
}
- }
-};
+ };
-// 閲嶇疆浠诲姟琛ㄥ崟
-const resetTaskForm = () => {
- taskForm.taskId = undefined;
- taskForm.taskName = '';
- taskForm.description = '';
- taskForm.startDate = '';
- taskForm.endDate = '';
- taskForm.assigneeId = '';
- taskForm.assigneeName = '';
- taskForm.status = 'notStarted';
- taskForm.progress = 0;
- taskForm.priority = 'medium';
- taskForm.phaseId = '';
- taskForm.projectId = props.projectId;
-
- if (taskFormRef.value) {
- taskFormRef.value.resetFields();
- }
-};
+ // 鏋勫缓浠诲姟鏍�
+ const buildTaskTree = phases => {
+ return phases.map(phase => ({
+ nodeId: phase.phaseId,
+ phaseId: phase.phaseId,
+ phaseName: phase.phaseName,
+ type: "phase",
+ children: (phase.tasks || []).map(task => ({
+ nodeId: task.taskId,
+ taskId: task.taskId,
+ taskName: task.taskName,
+ description: task.description,
+ startDate: task.startDate,
+ endDate: task.endDate,
+ assigneeId: task.assigneeId,
+ assigneeName: task.assigneeName,
+ status: task.status,
+ progress: task.progress,
+ priority: task.priority,
+ phaseId: task.phaseId,
+ projectId: props.projectId,
+ type: "task",
+ })),
+ }));
+ };
-// 鎻愪氦浠诲姟琛ㄥ崟
-const submitTaskForm = async () => {
- try {
- await taskFormRef.value.validate();
-
- if (taskForm.taskId) {
- await updateTask(taskForm);
- ElMessage.success('淇敼浠诲姟鎴愬姛');
- } else {
- await addTask(taskForm);
- ElMessage.success('娣诲姞浠诲姟鎴愬姛');
- }
-
- dialogOpen.value = false;
- refreshTree();
- } catch (error) {
- console.error('鎻愪氦琛ㄥ崟澶辫触:', error);
- }
-};
+ // 鏍煎紡鍖栨棩鏈熻寖鍥�
+ const formatDateRange = (startDate, endDate) => {
+ if (!startDate || !endDate) return "";
+ return `${startDate} - ${endDate}`;
+ };
-// 鐐瑰嚮鍏朵粬鍖哄煙鍏抽棴鍙抽敭鑿滃崟
-document.addEventListener('click', () => {
- if (showContextMenu.value) {
- showContextMenu.value = false;
- }
-});
-
-// 鐩戝惉椤圭洰ID鍙樺寲
-watch(() => props.projectId, (newProjectId) => {
- if (newProjectId) {
+ // 鍒锋柊鏍�
+ const refreshTree = () => {
loadTaskTree();
- }
-});
+ // 閫氱煡鐖剁粍浠跺埛鏂版暟鎹�
+ emit("refresh");
+ };
-// 鍒濆鍖�
-onMounted(() => {
- loadTaskTree();
-});
+ // 鍒囨崲绛涢�夐潰鏉�
+ const toggleFilter = () => {
+ showFilter.value = !showFilter.value;
+ };
+
+ // 搴旂敤绛涢��
+ const filterTree = () => {
+ // 绛涢�夐�昏緫宸茬粡鍦╟omputed涓疄鐜�
+ };
+
+ // 閲嶇疆绛涢��
+ const resetFilter = () => {
+ filterParams.status = "";
+ filterParams.assignee = "";
+ };
+
+ // 澶勭悊鑺傜偣鐐瑰嚮
+ const handleNodeClick = (data, node) => {
+ // 鍒囨崲灞曞紑/鏀惰捣鐘舵��
+ if (data.type === "phase") {
+ node.expanded = !node.expanded;
+ }
+ };
+
+ // 澶勭悊鍙抽敭鑿滃崟
+ const handleContextMenu = (event, data) => {
+ event.preventDefault();
+ selectedNode.value = data;
+ contextMenuStyle.value = {
+ position: "fixed",
+ left: `${event.clientX}px`,
+ top: `${event.clientY}px`,
+ zIndex: 1000,
+ };
+ showContextMenu.value = true;
+ };
+
+ // 澶勭悊鍙抽敭鑿滃崟閫夋嫨
+ const handleContextMenuSelect = index => {
+ showContextMenu.value = false;
+ switch (index) {
+ case "edit":
+ if (selectedNode.value.type === "task") {
+ handleEditTask(selectedNode.value);
+ }
+ break;
+ case "addTask":
+ if (selectedNode.value.type === "phase") {
+ handleAddTaskUnderPhase(selectedNode.value);
+ }
+ break;
+ case "delete":
+ handleDeleteNode(selectedNode.value);
+ break;
+ case "expandAll":
+ treeRef.value?.expandAll();
+ break;
+ case "collapseAll":
+ treeRef.value?.collapseAll();
+ break;
+ }
+ };
+
+ // 娣诲姞浠诲姟
+ const handleAddTask = () => {
+ resetTaskForm();
+ dialogTitle.value = "娣诲姞浠诲姟";
+ dialogOpen.value = true;
+ };
+
+ // 鍦ㄦ寚瀹氶樁娈典笅娣诲姞浠诲姟
+ const handleAddTaskUnderPhase = phase => {
+ resetTaskForm();
+ taskForm.phaseId = phase.phaseId;
+ dialogTitle.value = "娣诲姞瀛愪换鍔�";
+ dialogOpen.value = true;
+ };
+
+ // 缂栬緫浠诲姟
+ const handleEditTask = task => {
+ resetTaskForm();
+ Object.assign(taskForm, { ...task });
+ dialogTitle.value = "缂栬緫浠诲姟";
+ dialogOpen.value = true;
+ };
+
+ // 鍒犻櫎鑺傜偣
+ const handleDeleteNode = async node => {
+ const confirmMessage =
+ node.type === "phase"
+ ? `纭畾瑕佸垹闄ら樁娈� "${node.phaseName}" 鍙婂叾鎵�鏈夊瓙浠诲姟鍚楋紵`
+ : `纭畾瑕佸垹闄や换鍔� "${node.taskName}" 鍚楋紵`;
+
+ await ElMessageBox.confirm(confirmMessage, "纭鎿嶄綔", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).catch(() => {
+ throw new Error("鍙栨秷鍒犻櫎");
+ });
+
+ try {
+ if (node.type === "phase") {
+ await deletePhase(node.phaseId);
+ } else {
+ await deleteTask(node.taskId);
+ }
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ refreshTree();
+ } catch (error) {
+ if (error.message !== "鍙栨秷鍒犻櫎") {
+ ElMessage.error("鍒犻櫎澶辫触");
+ console.error("鍒犻櫎澶辫触:", error);
+ }
+ }
+ };
+
+ // 閲嶇疆浠诲姟琛ㄥ崟
+ const resetTaskForm = () => {
+ taskForm.taskId = undefined;
+ taskForm.taskName = "";
+ taskForm.description = "";
+ taskForm.startDate = "";
+ taskForm.endDate = "";
+ taskForm.assigneeId = "";
+ taskForm.assigneeName = "";
+ taskForm.status = "notStarted";
+ taskForm.progress = 0;
+ taskForm.priority = "medium";
+ taskForm.phaseId = "";
+ taskForm.projectId = props.projectId;
+
+ if (taskFormRef.value) {
+ taskFormRef.value.resetFields();
+ }
+ };
+
+ // 鎻愪氦浠诲姟琛ㄥ崟
+ const submitTaskForm = async () => {
+ try {
+ await taskFormRef.value.validate();
+
+ if (taskForm.taskId) {
+ await updateTask(taskForm);
+ ElMessage.success("淇敼浠诲姟鎴愬姛");
+ } else {
+ await addTask(taskForm);
+ ElMessage.success("娣诲姞浠诲姟鎴愬姛");
+ }
+
+ dialogOpen.value = false;
+ refreshTree();
+ } catch (error) {
+ console.error("鎻愪氦琛ㄥ崟澶辫触:", error);
+ }
+ };
+
+ // 鐐瑰嚮鍏朵粬鍖哄煙鍏抽棴鍙抽敭鑿滃崟
+ document.addEventListener("click", () => {
+ if (showContextMenu.value) {
+ showContextMenu.value = false;
+ }
+ });
+
+ // 鐩戝惉椤圭洰ID鍙樺寲
+ watch(
+ () => props.projectId,
+ newProjectId => {
+ if (newProjectId) {
+ loadTaskTree();
+ }
+ }
+ );
+
+ // 鍒濆鍖�
+ onMounted(() => {
+ loadTaskTree();
+ });
</script>
<style scoped>
-.task-tree-container {
- padding: 10px;
-}
+ .task-tree-container {
+ padding: 10px;
+ }
-.tree-actions {
- display: flex;
- gap: 10px;
- align-items: center;
-}
+ .tree-actions {
+ display: flex;
+ gap: 10px;
+ align-items: center;
+ }
-.filter-section {
- background: #f5f7fa;
- padding: 10px;
- border-radius: 4px;
-}
+ .filter-section {
+ background: #f5f7fa;
+ padding: 10px;
+ border-radius: 4px;
+ }
-.tree-content {
- background: #fff;
- border: 1px solid #ebeef5;
- border-radius: 4px;
- padding: 10px;
- max-height: 600px;
- overflow-y: auto;
-}
+ .tree-content {
+ background: #fff;
+ border: 1px solid #ebeef5;
+ border-radius: 4px;
+ padding: 10px;
+ max-height: 600px;
+ overflow-y: auto;
+ }
-.tree-node-content {
- display: flex;
- align-items: center;
- gap: 8px;
- padding: 5px 0;
- min-height: 40px;
-}
+ .tree-node-content {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ padding: 5px 0;
+ min-height: 40px;
+ }
-.phase-node {
- font-weight: bold;
- color: #409eff;
-}
+ .phase-node {
+ font-weight: bold;
+ color: #409eff;
+ }
-.task-node {
- color: #606266;
-}
+ .task-node {
+ color: #606266;
+ }
-.node-icon {
- display: flex;
- align-items: center;
- width: 20px;
-}
+ .node-icon {
+ display: flex;
+ align-items: center;
+ width: 20px;
+ }
-.node-info {
- flex: 1;
- min-width: 0;
-}
+ .node-info {
+ flex: 1;
+ min-width: 0;
+ }
-.node-title {
- font-weight: 500;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- margin-bottom: 2px;
-}
+ .node-title {
+ font-weight: 500;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-bottom: 2px;
+ }
-.overdue-title {
- color: #f56c6c;
- font-weight: bold;
-}
+ .overdue-title {
+ color: #f56c6c;
+ font-weight: bold;
+ }
-.priority-tag {
- background: #f56c6c;
- color: white;
- font-size: 10px;
- padding: 1px 4px;
- border-radius: 2px;
- margin-left: 5px;
-}
+ .priority-tag {
+ background: #f56c6c;
+ color: white;
+ font-size: 10px;
+ padding: 1px 4px;
+ border-radius: 2px;
+ margin-left: 5px;
+ }
-.priority-tag.medium {
- background: #e6a23c;
-}
+ .priority-tag.medium {
+ background: #e6a23c;
+ }
-.node-description {
- font-size: 12px;
- color: #909399;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
-}
+ .node-description {
+ font-size: 12px;
+ color: #909399;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
-.task-meta {
- display: flex;
- gap: 15px;
- font-size: 12px;
- color: #909399;
- margin-top: 2px;
-}
+ .task-meta {
+ display: flex;
+ gap: 15px;
+ font-size: 12px;
+ color: #909399;
+ margin-top: 2px;
+ }
-.meta-item {
- display: flex;
- align-items: center;
- gap: 3px;
-}
+ .meta-item {
+ display: flex;
+ align-items: center;
+ gap: 3px;
+ }
-.task-progress {
- width: 120px;
- margin: 0 10px;
-}
+ .task-progress {
+ width: 120px;
+ margin: 0 10px;
+ }
-.node-actions {
- display: flex;
- gap: 5px;
- opacity: 0;
- transition: opacity 0.3s;
-}
+ .node-actions {
+ display: flex;
+ gap: 5px;
+ opacity: 0;
+ transition: opacity 0.3s;
+ }
-.tree-node-content:hover .node-actions {
- opacity: 1;
-}
+ .tree-node-content:hover .node-actions {
+ opacity: 1;
+ }
-.context-menu {
- background: white;
- border: 1px solid #ebeef5;
- box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
- border-radius: 4px;
-}
+ .context-menu {
+ background: white;
+ border: 1px solid #ebeef5;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ border-radius: 4px;
+ }
-.context-menu .el-menu {
- min-width: 120px;
- border: none;
-}
+ .context-menu .el-menu {
+ min-width: 120px;
+ border: none;
+ }
-.context-menu .el-menu-item {
- padding: 0 15px;
- height: 36px;
- line-height: 36px;
-}
+ .context-menu .el-menu-item {
+ padding: 0 15px;
+ height: 36px;
+ line-height: 36px;
+ }
-.context-menu .el-menu-item:hover {
- background-color: #f5f7fa;
-}
+ .context-menu .el-menu-item:hover {
+ background-color: #f5f7fa;
+ }
-.text-gray-400 {
- color: #c0c4cc;
-}
+ .text-gray-400 {
+ color: #c0c4cc;
+ }
</style>
\ No newline at end of file
diff --git a/src/views/oaSystem/projectManagement/index.vue b/src/views/oaSystem/projectManagement/index.vue
index 2a0ec3a..a727c1b 100644
--- a/src/views/oaSystem/projectManagement/index.vue
+++ b/src/views/oaSystem/projectManagement/index.vue
@@ -1,54 +1,59 @@
<template>
<div class="app-container">
<!-- 椤堕儴鎼滅储鍜屾搷浣滄爮 -->
- <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="80px">
- <el-form-item label="椤圭洰鍚嶇О" prop="projectName">
- <el-input
- v-model="queryParams.projectName"
- placeholder="璇疯緭鍏ラ」鐩悕绉�"
- clearable
- style="width: 240px"
- @keyup.enter="handleQuery"
- />
+ <el-form :model="queryParams"
+ ref="queryRef"
+ :inline="true"
+ label-width="80px">
+ <el-form-item label="椤圭洰鍚嶇О"
+ prop="projectName">
+ <el-input v-model="queryParams.projectName"
+ placeholder="璇疯緭鍏ラ」鐩悕绉�"
+ clearable
+ style="width: 240px"
+ @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="璐熻矗浜�" prop="managerName">
- <el-input
- v-model="queryParams.managerName"
- placeholder="璇疯緭鍏ヨ礋璐ｄ汉濮撳悕"
- clearable
- style="width: 240px"
- @keyup.enter="handleQuery"
- />
+ <el-form-item label="璐熻矗浜�"
+ prop="managerName">
+ <el-input v-model="queryParams.managerName"
+ placeholder="璇疯緭鍏ヨ礋璐ｄ汉濮撳悕"
+ clearable
+ style="width: 240px"
+ @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select
- v-model="queryParams.status"
- placeholder="椤圭洰鐘舵��"
- clearable
- style="width: 150px"
- >
- <el-option label="瑙勫垝涓�" value="planning" />
- <el-option label="杩涜涓�" value="inProgress" />
- <el-option label="宸插畬鎴�" value="completed" />
- <el-option label="宸叉殏鍋�" value="paused" />
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="queryParams.status"
+ placeholder="椤圭洰鐘舵��"
+ clearable
+ style="width: 150px">
+ <el-option label="瑙勫垝涓�"
+ value="planning" />
+ <el-option label="杩涜涓�"
+ value="inProgress" />
+ <el-option label="宸插畬鎴�"
+ value="completed" />
+ <el-option label="宸叉殏鍋�"
+ value="paused" />
</el-select>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ <el-button type="primary"
+ icon="Search"
+ @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh"
+ @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
</el-form>
-
<!-- 宸ュ叿鏍� -->
- <el-row :gutter="10" class="mb8">
+ <el-row :gutter="10"
+ class="mb8">
<el-col :span="1.5">
- <el-button
- type="primary"
- plain
- icon="Plus"
- @click="handleAdd"
- v-hasPermi="['oaSystem:project:add']"
- >鏂板椤圭洰</el-button>
+ <el-button type="primary"
+ plain
+ icon="Plus"
+ @click="handleAdd"
+ v-hasPermi="['oaSystem:project:add']">鏂板椤圭洰</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button
@@ -71,125 +76,99 @@
>鍒犻櫎椤圭洰</el-button>
</el-col> -->
<el-col :span="1.5">
- <el-button
- type="warning"
- plain
- icon="Download"
- @click="handleExport"
- v-hasPermi="['oaSystem:project:export']"
- >瀵煎嚭椤圭洰</el-button>
+ <el-button type="warning"
+ plain
+ icon="Download"
+ @click="handleExport"
+ v-hasPermi="['oaSystem:project:export']">瀵煎嚭椤圭洰</el-button>
</el-col>
</el-row>
-
<!-- 椤圭洰鍒楄〃琛ㄦ牸 -->
- <el-table
- v-loading="loading"
- :data="projectList"
- @selection-change="handleSelectionChange"
- >
- <el-table-column type="selection" width="50" align="center" />
- <el-table-column
- label="椤圭洰缂栧彿"
- align="center"
- prop="projectId"
- width="100"
- />
- <el-table-column
- label="椤圭洰鍚嶇О"
- align="center"
- prop="projectName"
- :show-overflow-tooltip="true"
- />
- <el-table-column
- label="璐熻矗浜�"
- align="center"
- prop="managerName"
- />
- <el-table-column
- label="寮�濮嬫棩鏈�"
- align="center"
- prop="startDate"
- width="120"
- />
- <el-table-column
- label="缁撴潫鏃ユ湡"
- align="center"
- prop="endDate"
- width="120"
- />
- <el-table-column
- label="鐘舵��"
- align="center"
- prop="status"
- width="90"
- >
+ <el-table v-loading="loading"
+ :data="projectList"
+ @selection-change="handleSelectionChange">
+ <el-table-column type="selection"
+ width="50"
+ align="center" />
+ <el-table-column label="椤圭洰缂栧彿"
+ align="center"
+ prop="projectId"
+ width="100" />
+ <el-table-column label="椤圭洰鍚嶇О"
+ align="center"
+ prop="projectName"
+ :show-overflow-tooltip="true" />
+ <el-table-column label="璐熻矗浜�"
+ align="center"
+ prop="managerName" />
+ <el-table-column label="寮�濮嬫棩鏈�"
+ align="center"
+ prop="startDate"
+ width="120" />
+ <el-table-column label="缁撴潫鏃ユ湡"
+ align="center"
+ prop="endDate"
+ width="120" />
+ <el-table-column label="鐘舵��"
+ align="center"
+ prop="status"
+ width="90">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">{{ getStatusText(scope.row.status) }}</el-tag>
</template>
</el-table-column>
- <el-table-column
- label="瀹屾垚搴�"
- align="center"
- prop="completionRate"
- width="100"
- >
+ <el-table-column label="瀹屾垚搴�"
+ align="center"
+ prop="completionRate"
+ width="100">
<template #default="scope">
- <el-progress :percentage="scope.row.completionRate" :stroke-width="6" />
+ <el-progress :percentage="scope.row.completionRate"
+ :stroke-width="6" />
</template>
</el-table-column>
- <el-table-column
- label="鎿嶄綔"
- align="center"
- width="180"
- class-name="small-padding fixed-width"
- >
+ <el-table-column label="鎿嶄綔"
+ align="center"
+ width="180"
+ class-name="small-padding fixed-width">
<template #default="scope">
- <el-button
- link
- type="primary"
- icon="Search"
- @click="handleView(scope.row)"
- v-hasPermi="['oaSystem:project:query']"
- >璇︽儏</el-button>
- <el-button
- link
- type="primary"
- icon="Edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['oaSystem:project:edit']"
- >缂栬緫</el-button>
- <el-button
- link
- type="danger"
- icon="Delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['oaSystem:project:remove']"
- >鍒犻櫎</el-button>
+ <el-button link
+ type="primary"
+ icon="Search"
+ @click="handleView(scope.row)"
+ v-hasPermi="['oaSystem:project:query']">璇︽儏</el-button>
+ <el-button link
+ type="primary"
+ icon="Edit"
+ @click="handleUpdate(scope.row)"
+ v-hasPermi="['oaSystem:project:edit']">缂栬緫</el-button>
+ <el-button link
+ type="danger"
+ icon="Delete"
+ @click="handleDelete(scope.row)"
+ v-hasPermi="['oaSystem:project:remove']">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉缁勪欢 -->
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.pageNum"
- v-model:limit="queryParams.pageSize"
- @pagination="getList"
- />
-
+ <pagination v-show="total > 0"
+ :total="total"
+ v-model:page="queryParams.pageNum"
+ v-model:limit="queryParams.pageSize"
+ @pagination="getList" />
<!-- 椤圭洰琛ㄥ崟瀵硅瘽妗� -->
- <el-dialog :title="title" v-model="open" width="600px" append-to-body>
- <project-form
- ref="projectFormRef"
- :form="form"
- :rules="rules"
- :visible="open"
- />
+ <el-dialog :title="title"
+ v-model="open"
+ width="600px"
+ append-to-body>
+ <project-form ref="projectFormRef"
+ :form="form"
+ :rules="rules"
+ :visible="open" />
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="cancel">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</div>
</template>
</el-dialog>
@@ -197,285 +176,298 @@
</template>
<script setup>
-import { ref, reactive, computed, onMounted } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import Pagination from '@/components/Pagination';
-import ProjectForm from './components/projectForm.vue';
-import { useRouter } from 'vue-router';
-const { proxy } = getCurrentInstance();
-// 瀵煎叆椤圭洰绠＄悊API鎺ュ彛
-import { listProject, addProject, updateProject, delProject, exportProject } from '@/api/oaSystem/projectManagement';
-// import { listUser } from '@/api/system/user'; // 瀵煎叆鐢ㄦ埛鍒楄〃API鎺ュ彛
+ import { ref, reactive, computed, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import Pagination from "@/components/Pagination";
+ import ProjectForm from "./components/projectForm.vue";
+ import { useRouter } from "vue-router";
+ const { proxy } = getCurrentInstance();
+ // 瀵煎叆椤圭洰绠＄悊API鎺ュ彛
+ import {
+ listProject,
+ addProject,
+ updateProject,
+ delProject,
+ exportProject,
+ } from "@/api/oaSystem/projectManagement";
+ // import { listUser } from '@/api/system/user'; // 瀵煎叆鐢ㄦ埛鍒楄〃API鎺ュ彛
-// 鍒涘缓router瀹炰緥
-const router = useRouter();
+ // 鍒涘缓router瀹炰緥
+ const router = useRouter();
-// 琛ㄦ牸鏁版嵁
-const projectList = ref([]);
-const loading = ref(true);
-const total = ref(0);
-const queryParams = reactive({
- pageNum: 1,
- pageSize: 10,
- projectName: '',
- managerName: '',
- status: ''
-});
-
-// 琛ㄥ崟鏁版嵁
-const form = reactive({
- projectId: undefined,
- projectName: '',
- description: '',
- startDate: '',
- endDate: '',
- managerId: '',
- managerName: '',
- status: 'planning',
- completionRate: 0
-});
-
-// 琛ㄥ崟鏍￠獙瑙勫垯
-const rules = {
- projectName: [
- { required: true, message: '椤圭洰鍚嶇О涓嶈兘涓虹┖', trigger: 'blur' },
- { min: 2, max: 50, message: '椤圭洰鍚嶇О闀垮害鍦� 2 鍒� 50 涓瓧绗�', trigger: 'blur' }
- ],
- startDate: [
- { required: true, message: '寮�濮嬫棩鏈熶笉鑳戒负绌�', trigger: 'change' }
- ],
- endDate: [
- { required: true, message: '缁撴潫鏃ユ湡涓嶈兘涓虹┖', trigger: 'change' }
- ],
- managerId: [
- { required: true, message: '璐熻矗浜轰笉鑳戒负绌�', trigger: 'blur' }
- ]
-};
-
-// 瀵硅瘽妗嗙姸鎬�
-const open = ref(false);
-const title = ref('');
-const projectFormRef = ref();
-const queryRef = ref();
-
-// 閫変腑鐘舵��
-const multiple = computed(() => {
- return selectedRowKeys.value.length === 0;
-});
-const single = computed(() => {
- return selectedRowKeys.value.length !== 1;
-});
-const selectedRowKeys = ref([]);
-
-// 鑾峰彇椤圭洰鍒楄〃
-const getList = async () => {
- loading.value = true;
- try {
- const { data } = await listProject(queryParams);
- projectList.value = data.records;
- total.value = data.total;
- } catch (error) {
- ElMessage.error('鑾峰彇椤圭洰鍒楄〃澶辫触');
- console.error('鑾峰彇椤圭洰鍒楄〃澶辫触:', error);
- } finally {
- loading.value = false;
- }
-};
-
-// 鎼滅储
-const handleQuery = () => {
- queryParams.pageNum = 1;
- getList();
-};
-
-// 閲嶇疆
-const resetQuery = () => {
- if (queryRef.value) {
- queryRef.value.resetFields();
- }
- handleQuery();
-};
-
-// 閫変腑琛屽彉鍖�
-const handleSelectionChange = (selection) => {
- selectedRowKeys.value = selection.map(item => item.projectId);
-};
-
-// 鏂板椤圭洰
-const handleAdd = () => {
- resetForm();
- open.value = true;
- title.value = '鏂板椤圭洰';
-};
-
-// 缂栬緫椤圭洰
-const handleUpdate = async (row) => {
- resetForm();
- const projectId = row.projectId || selectedRowKeys.value[0];
- try {
- // const { data } = await getProject(projectId);
- Object.assign(form, row);
- open.value = true;
- title.value = '缂栬緫椤圭洰';
- } catch (error) {
- ElMessage.error('鑾峰彇椤圭洰璇︽儏澶辫触');
- console.error('鑾峰彇椤圭洰璇︽儏澶辫触:', error);
- }
-};
-
-// 鍒犻櫎椤圭洰
-const handleDelete = async (row) => {
- // const projectIds = row.projectId ? [row.projectId] : selectedRowKeys.value;
- const projectNames = row.projectName ? [row.projectName] :
- projectList.value.filter(item => projectIds.includes(item.projectId)).map(item => item.projectName);
-
- const confirmMessage = `纭畾瑕佸垹闄ら」鐩� "${projectNames.join('銆�')}" 鍚楋紵`;
- await ElMessageBox.confirm(confirmMessage, '纭鎿嶄綔', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).catch(() => {
- throw new Error('鍙栨秷鍒犻櫎');
+ // 琛ㄦ牸鏁版嵁
+ const projectList = ref([]);
+ const loading = ref(true);
+ const total = ref(0);
+ const queryParams = reactive({
+ pageNum: 1,
+ pageSize: 10,
+ projectName: "",
+ managerName: "",
+ status: "",
});
-
- try {
- // if (projectIds.length === 1) {
- await delProject(row.projectId);
- // } else {
- // await delProjectBatch(projectIds);
- // }
- ElMessage.success('鍒犻櫎鎴愬姛');
- getList();
- } catch (error) {
- if (error.message !== '鍙栨秷鍒犻櫎') {
- ElMessage.error('鍒犻櫎澶辫触');
- console.error('鍒犻櫎椤圭洰澶辫触:', error);
+
+ // 琛ㄥ崟鏁版嵁
+ const form = reactive({
+ projectId: undefined,
+ projectName: "",
+ description: "",
+ startDate: "",
+ endDate: "",
+ managerId: "",
+ managerName: "",
+ status: "planning",
+ completionRate: 0,
+ });
+
+ // 琛ㄥ崟鏍￠獙瑙勫垯
+ const rules = {
+ projectName: [
+ { required: true, message: "椤圭洰鍚嶇О涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 50,
+ message: "椤圭洰鍚嶇О闀垮害鍦� 2 鍒� 50 涓瓧绗�",
+ trigger: "blur",
+ },
+ ],
+ startDate: [
+ { required: true, message: "寮�濮嬫棩鏈熶笉鑳戒负绌�", trigger: "change" },
+ ],
+ endDate: [{ required: true, message: "缁撴潫鏃ユ湡涓嶈兘涓虹┖", trigger: "change" }],
+ managerId: [{ required: true, message: "璐熻矗浜轰笉鑳戒负绌�", trigger: "blur" }],
+ };
+
+ // 瀵硅瘽妗嗙姸鎬�
+ const open = ref(false);
+ const title = ref("");
+ const projectFormRef = ref();
+ const queryRef = ref();
+
+ // 閫変腑鐘舵��
+ const multiple = computed(() => {
+ return selectedRowKeys.value.length === 0;
+ });
+ const single = computed(() => {
+ return selectedRowKeys.value.length !== 1;
+ });
+ const selectedRowKeys = ref([]);
+
+ // 鑾峰彇椤圭洰鍒楄〃
+ const getList = async () => {
+ loading.value = true;
+ try {
+ const { data } = await listProject(queryParams);
+ projectList.value = data.records;
+ total.value = data.total;
+ } catch (error) {
+ ElMessage.error("鑾峰彇椤圭洰鍒楄〃澶辫触");
+ console.error("鑾峰彇椤圭洰鍒楄〃澶辫触:", error);
+ } finally {
+ loading.value = false;
}
- }
- // try {
- // await ElMessageBox.confirm(confirmMessage, '纭鎿嶄綔', {
- // confirmButtonText: '纭畾',
- // cancelButtonText: '鍙栨秷',
- // type: 'warning'
- // });
-
- // // 妯℃嫙缃戠粶寤惰繜
- // await new Promise(resolve => setTimeout(resolve, 300));
-
-
- // ElMessage.success('鍒犻櫎鎴愬姛');
- // getList();
- // } catch (error) {
- // if (error !== 'cancel') {
- // console.error('鍒犻櫎椤圭洰澶辫触:', error);
- // }
- // }
-};
+ };
-// 鏌ョ湅椤圭洰璇︽儏
-const handleView = (row) => {
- const projectId = row.projectId;
- // 璺宠浆鍒伴」鐩鎯呴〉闈�
- router.push({
- path: `/oaSystem/projectManagement/projectDetail/${projectId}`,
- query: { projectName: row.projectName }
- });
-};
+ // 鎼滅储
+ const handleQuery = () => {
+ queryParams.pageNum = 1;
+ getList();
+ };
-// 瀵煎嚭椤圭洰
-const handleExport = async () => {
+ // 閲嶇疆
+ const resetQuery = () => {
+ if (queryRef.value) {
+ queryRef.value.resetFields();
+ }
+ handleQuery();
+ };
+
+ // 閫変腑琛屽彉鍖�
+ const handleSelectionChange = selection => {
+ selectedRowKeys.value = selection.map(item => item.projectId);
+ };
+
+ // 鏂板椤圭洰
+ const handleAdd = () => {
+ resetForm();
+ open.value = true;
+ title.value = "鏂板椤圭洰";
+ };
+
+ // 缂栬緫椤圭洰
+ const handleUpdate = async row => {
+ resetForm();
+ const projectId = row.projectId || selectedRowKeys.value[0];
+ try {
+ // const { data } = await getProject(projectId);
+ Object.assign(form, row);
+ open.value = true;
+ title.value = "缂栬緫椤圭洰";
+ } catch (error) {
+ ElMessage.error("鑾峰彇椤圭洰璇︽儏澶辫触");
+ console.error("鑾峰彇椤圭洰璇︽儏澶辫触:", error);
+ }
+ };
+
+ // 鍒犻櫎椤圭洰
+ const handleDelete = async row => {
+ // const projectIds = row.projectId ? [row.projectId] : selectedRowKeys.value;
+ const projectNames = row.projectName
+ ? [row.projectName]
+ : projectList.value
+ .filter(item => projectIds.includes(item.projectId))
+ .map(item => item.projectName);
+
+ const confirmMessage = `纭畾瑕佸垹闄ら」鐩� "${projectNames.join("銆�")}" 鍚楋紵`;
+ await ElMessageBox.confirm(confirmMessage, "纭鎿嶄綔", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).catch(() => {
+ throw new Error("鍙栨秷鍒犻櫎");
+ });
+
+ try {
+ // if (projectIds.length === 1) {
+ await delProject(row.projectId);
+ // } else {
+ // await delProjectBatch(projectIds);
+ // }
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ } catch (error) {
+ if (error.message !== "鍙栨秷鍒犻櫎") {
+ ElMessage.error("鍒犻櫎澶辫触");
+ console.error("鍒犻櫎椤圭洰澶辫触:", error);
+ }
+ }
+ // try {
+ // await ElMessageBox.confirm(confirmMessage, '纭鎿嶄綔', {
+ // confirmButtonText: '纭畾',
+ // cancelButtonText: '鍙栨秷',
+ // type: 'warning'
+ // });
+
+ // // 妯℃嫙缃戠粶寤惰繜
+ // await new Promise(resolve => setTimeout(resolve, 300));
+
+ // ElMessage.success('鍒犻櫎鎴愬姛');
+ // getList();
+ // } catch (error) {
+ // if (error !== 'cancel') {
+ // console.error('鍒犻櫎椤圭洰澶辫触:', error);
+ // }
+ // }
+ };
+
+ // 鏌ョ湅椤圭洰璇︽儏
+ const handleView = row => {
+ const projectId = row.projectId;
+ // 璺宠浆鍒伴」鐩鎯呴〉闈�
+ router.push({
+ path: `/oaSystem/projectManagement/projectDetail/${projectId}`,
+ query: { projectName: row.projectName },
+ });
+ };
+
+ // 瀵煎嚭椤圭洰
+ const handleExport = async () => {
let ids = [];
if (selectedRowKeys.value.length > 0) {
ids = selectedRowKeys.value; // 瀵煎嚭閫変腑鐨勯」鐩�
} else {
ids = projectList.value.map(item => item.projectId); // 瀵煎嚭鎵�鏈夐」鐩�
}
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- })
- .then(() => {
- proxy.download(`/oA/project/export/${ids.join(',')}`, {}, "椤圭洰鏁版嵁.xlsx");
- ElMessage.success("瀵煎嚭鎴愬姛");
- ids = [];
+ ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
})
- .catch(() => {
- proxy.$modal.msg("宸插彇娑�");
- });
-};
-// 鎻愪氦琛ㄥ崟
-const submitForm = async () => {
- try {
- await projectFormRef.value.validate();
+ .then(() => {
+ proxy.download(
+ `/oA/project/export/${ids.join(",")}`,
+ {},
+ "椤圭洰鏁版嵁.xlsx"
+ );
+ ElMessage.success("瀵煎嚭鎴愬姛");
+ ids = [];
+ })
+ .catch(() => {
+ proxy.$modal.msg("宸插彇娑�");
+ });
+ };
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ await projectFormRef.value.validate();
- if (form.projectId) {
- await updateProject(form);
- ElMessage.success('淇敼椤圭洰鎴愬姛');
- } else {
- console.log("form",form);
- await addProject(form);
- ElMessage.success('鏂板椤圭洰鎴愬姛');
+ if (form.projectId) {
+ await updateProject(form);
+ ElMessage.success("淇敼椤圭洰鎴愬姛");
+ } else {
+ console.log("form", form);
+ await addProject(form);
+ ElMessage.success("鏂板椤圭洰鎴愬姛");
+ }
+ open.value = false;
+ getList();
+ } catch (error) {
+ console.error("鎻愪氦琛ㄥ崟澶辫触:", error);
}
+ };
+
+ // 鍙栨秷
+ const cancel = () => {
open.value = false;
+ resetForm();
+ };
+
+ // 閲嶇疆琛ㄥ崟
+ const resetForm = () => {
+ form.projectId = undefined;
+ form.projectName = "";
+ form.description = "";
+ form.startDate = "";
+ form.endDate = "";
+ form.managerId = "";
+ form.managerName = "";
+ form.status = "planning";
+ form.completionRate = 0;
+ if (projectFormRef.value) {
+ projectFormRef.value.resetFields();
+ }
+ };
+
+ // 鑾峰彇鐘舵�佹爣绛剧被鍨�
+ const getStatusType = status => {
+ const statusTypeMap = {
+ planning: "info",
+ inProgress: "primary",
+ completed: "success",
+ paused: "warning",
+ };
+ return statusTypeMap[status] || "default";
+ };
+
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusTextMap = {
+ planning: "瑙勫垝涓�",
+ inProgress: "杩涜涓�",
+ completed: "宸插畬鎴�",
+ paused: "宸叉殏鍋�",
+ };
+ return statusTextMap[status] || status;
+ };
+
+ // 鍒濆鍖�
+ onMounted(() => {
getList();
- } catch (error) {
- console.error('鎻愪氦琛ㄥ崟澶辫触:', error);
- }
-};
-
-// 鍙栨秷
-const cancel = () => {
- open.value = false;
- resetForm();
-};
-
-// 閲嶇疆琛ㄥ崟
-const resetForm = () => {
- form.projectId = undefined;
- form.projectName = '';
- form.description = '';
- form.startDate = '';
- form.endDate = '';
- form.managerId = '';
- form.managerName = '';
- form.status = 'planning';
- form.completionRate = 0;
- if (projectFormRef.value) {
- projectFormRef.value.resetFields();
- }
-};
-
-// 鑾峰彇鐘舵�佹爣绛剧被鍨�
-const getStatusType = (status) => {
- const statusTypeMap = {
- planning: 'info',
- inProgress: 'primary',
- completed: 'success',
- paused: 'warning'
- };
- return statusTypeMap[status] || 'default';
-};
-
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusTextMap = {
- planning: '瑙勫垝涓�',
- inProgress: '杩涜涓�',
- completed: '宸插畬鎴�',
- paused: '宸叉殏鍋�'
- };
- return statusTextMap[status] || status;
-};
-
-// 鍒濆鍖�
-onMounted(() => {
- getList();
-});
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
</style>
\ No newline at end of file
diff --git a/src/views/oaSystem/projectManagement/projectDetail.vue b/src/views/oaSystem/projectManagement/projectDetail.vue
index c3b0779..83f3dd8 100644
--- a/src/views/oaSystem/projectManagement/projectDetail.vue
+++ b/src/views/oaSystem/projectManagement/projectDetail.vue
@@ -8,7 +8,8 @@
<span>椤圭洰鍩烘湰淇℃伅</span>
</div>
</template>
- <el-descriptions :column="2" border>
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="椤圭洰鍚嶇О">{{ projectInfo.projectName }}</el-descriptions-item>
<el-descriptions-item label="椤圭洰璐熻矗浜�">{{ projectInfo.managerName }}</el-descriptions-item>
<el-descriptions-item label="寮�濮嬫棩鏈�">{{ projectInfo.startDate }}</el-descriptions-item>
@@ -17,12 +18,13 @@
<el-tag :type="getStatusType(projectInfo.status)">{{ getStatusText(projectInfo.status) }}</el-tag>
</el-descriptions-item>
<el-descriptions-item label="瀹屾垚搴�">
- <el-progress :percentage="projectInfo.completionRate" :stroke-width="6" />
+ <el-progress :percentage="projectInfo.completionRate"
+ :stroke-width="6" />
</el-descriptions-item>
- <el-descriptions-item label="椤圭洰鎻忚堪" :span="2">{{ projectInfo.description || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="椤圭洰鎻忚堪"
+ :span="2">{{ projectInfo.description || '-' }}</el-descriptions-item>
</el-descriptions>
</el-card>
-
<!-- 椤圭洰杩涘害姒傝 -->
<el-card class="mb20">
<template #header>
@@ -57,7 +59,6 @@
</el-col>
</el-row>
</el-card>
-
<!-- 闃舵鍜屼换鍔＄鐞� -->
<!-- <el-card class="mb20">
<template #header>
@@ -68,162 +69,175 @@
</template>
<task-tree :project-id="projectId" @refresh="getProjectDetail" />
</el-card> -->
-
<!-- 閲岀▼纰戠鐞� -->
<el-card class="mb20">
<template #header>
<div class="card-header">
<span>椤圭洰闃舵閲岀▼纰�</span>
- <el-button type="primary" size="small" @click="handleAddMilestone">娣诲姞閲岀▼纰�</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="handleAddMilestone">娣诲姞閲岀▼纰�</el-button>
</div>
</template>
- <milestone-list :project-id="projectId" @refresh="getProjectDetail" :key="`milestone-${refreshProjectId}`"/>
+ <milestone-list :project-id="projectId"
+ @refresh="getProjectDetail"
+ :key="`milestone-${refreshProjectId}`" />
</el-card>
-
<!-- 闃舵鐩爣绠＄悊 -->
<el-card>
<template #header>
<div class="card-header">
<span>闃舵浠诲姟</span>
- <el-button type="primary" size="small" @click="handleAddPhaseGoal">娣诲姞闃舵鐩爣</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="handleAddPhaseGoal">娣诲姞闃舵鐩爣</el-button>
</div>
</template>
- <phase-goal-list :project-id="projectId" @refresh="getProjectDetail" @editGoal="handleEditPhaseGoal" :key="`phaseGoal-${refreshProjectId}`"/>
+ <phase-goal-list :project-id="projectId"
+ @refresh="getProjectDetail"
+ @editGoal="handleEditPhaseGoal"
+ :key="`phaseGoal-${refreshProjectId}`" />
</el-card>
-
- <!-- 閲岀▼纰戠鐞嗗脊妗� -->
- <el-dialog :title="title" v-model="open" width="600px" append-to-body>
- <el-form :model="form" ref="formRef" label-width="100px">
- <el-form-item label="椤圭洰闃舵鍚嶇О" prop="phaseName">
- <el-input
- v-model="form.phaseName"
- placeholder="璇疯緭鍏ラ」鐩樁娈靛悕绉�"
- maxlength="50"
- />
- </el-form-item>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="寮�濮嬫棩鏈�" prop="startDate">
- <el-date-picker
- v-model="form.startDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨寮�濮嬫棩鏈�"
- style="width: 100%"
- />
+ <!-- 閲岀▼纰戠鐞嗗脊妗� -->
+ <el-dialog :title="title"
+ v-model="open"
+ width="600px"
+ append-to-body>
+ <el-form :model="form"
+ ref="formRef"
+ label-width="100px">
+ <el-form-item label="椤圭洰闃舵鍚嶇О"
+ prop="phaseName">
+ <el-input v-model="form.phaseName"
+ placeholder="璇疯緭鍏ラ」鐩樁娈靛悕绉�"
+ maxlength="50" />
</el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="缁撴潫鏃ユ湡" prop="endDate">
- <el-date-picker
- v-model="form.endDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨缁撴潫鏃ユ湡"
- style="width: 100%"
- />
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="寮�濮嬫棩鏈�"
+ prop="startDate">
+ <el-date-picker v-model="form.startDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨寮�濮嬫棩鏈�"
+ style="width: 100%" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="缁撴潫鏃ユ湡"
+ prop="endDate">
+ <el-date-picker v-model="form.endDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨缁撴潫鏃ユ湡"
+ style="width: 100%" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-radio-group v-model="form.status">
+ <el-radio label="notStarted">鏈紑濮�</el-radio>
+ <el-radio label="completed">宸插畬鎴�</el-radio>
+ <el-radio label="delayed">宸插欢杩�</el-radio>
+ </el-radio-group>
</el-form-item>
- </el-col>
- </el-row>
- <el-form-item label="鐘舵��" prop="status">
- <el-radio-group v-model="form.status">
- <el-radio label="notStarted">鏈紑濮�</el-radio>
- <el-radio label="completed">宸插畬鎴�</el-radio>
- <el-radio label="delayed">宸插欢杩�</el-radio>
- </el-radio-group>
- </el-form-item>
- </el-form>
+ </el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitForm">纭畾</el-button>
<el-button @click="cancel">鍙栨秷</el-button>
- <el-button type="primary" @click="submitForm">纭畾</el-button>
</div>
</template>
</el-dialog>
-
<!-- 闃舵浠诲姟绠＄悊寮规 -->
- <el-dialog :title="goalTitle" v-model="goalOpen" width="600px" append-to-body>
- <el-form :model="goalForm" ref="goalFormRef" label-width="100px">
- <el-form-item label="鎵�灞為樁娈�" prop="phaseId">
- <el-select v-model="goalForm.phaseId" placeholder="璇烽�夋嫨鎵�灞為樁娈�">
- <el-option
- v-for="phase in phaseList"
- :key="phase.phaseId"
- :label="phase.phaseName"
- :value="phase.phaseId"
- />
+ <el-dialog :title="goalTitle"
+ v-model="goalOpen"
+ width="600px"
+ append-to-body>
+ <el-form :model="goalForm"
+ ref="goalFormRef"
+ label-width="100px">
+ <el-form-item label="鎵�灞為樁娈�"
+ prop="phaseId">
+ <el-select v-model="goalForm.phaseId"
+ placeholder="璇烽�夋嫨鎵�灞為樁娈�">
+ <el-option v-for="phase in phaseList"
+ :key="phase.phaseId"
+ :label="phase.phaseName"
+ :value="phase.phaseId" />
</el-select>
</el-form-item>
- <el-form-item label="鐩爣鍚嶇О" prop="taskName">
- <el-input
- v-model="goalForm.taskName"
- placeholder="璇疯緭鍏ョ洰鏍囧悕绉�"
- maxlength="50"
- />
+ <el-form-item label="鐩爣鍚嶇О"
+ prop="taskName">
+ <el-input v-model="goalForm.taskName"
+ placeholder="璇疯緭鍏ョ洰鏍囧悕绉�"
+ maxlength="50" />
</el-form-item>
- <el-form-item label="鐩爣鍊�" prop="targetValue">
- <el-input-number
- v-model="goalForm.targetValue"
- :min="0"
- :precision="2"
- placeholder="璇疯緭鍏ョ洰鏍囧��"
- style="width: 100%"
- />
+ <el-form-item label="鐩爣鍊�"
+ prop="targetValue">
+ <el-input-number v-model="goalForm.targetValue"
+ :min="0"
+ :precision="2"
+ placeholder="璇疯緭鍏ョ洰鏍囧��"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="褰撳墠鍊�" prop="currentValue">
- <el-input-number
- v-model="goalForm.currentValue"
- :min="0"
- :precision="2"
- placeholder="璇疯緭鍏ュ綋鍓嶅��"
- style="width: 100%"
- />
+ <el-form-item label="褰撳墠鍊�"
+ prop="currentValue">
+ <el-input-number v-model="goalForm.currentValue"
+ :min="0"
+ :precision="2"
+ placeholder="璇疯緭鍏ュ綋鍓嶅��"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="鍗曚綅" prop="unit">
- <el-input
- v-model="goalForm.unit"
- placeholder="璇疯緭鍏ュ崟浣�"
- maxlength="10"
- />
+ <el-form-item label="鍗曚綅"
+ prop="unit">
+ <el-input v-model="goalForm.unit"
+ placeholder="璇疯緭鍏ュ崟浣�"
+ maxlength="10" />
</el-form-item>
- <el-form-item label="浠诲姟瀹屾垚鏃ユ湡" prop="targetDate">
- <el-date-picker
- v-model="goalForm.targetDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨鐩爣鏃ユ湡"
- style="width: 100%"
- />
+ <el-form-item label="浠诲姟瀹屾垚鏃ユ湡"
+ prop="targetDate">
+ <el-date-picker v-model="goalForm.targetDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨鐩爣鏃ユ湡"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="寮�濮嬫棩鏈�" prop="startDate">
- <el-date-picker
- v-model="goalForm.startDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨鐩爣鏃ユ湡"
- style="width: 100%"
- />
+ <el-form-item label="寮�濮嬫棩鏈�"
+ prop="startDate">
+ <el-date-picker v-model="goalForm.startDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨鐩爣鏃ユ湡"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="缁撴潫鏃ユ湡" prop="endDate">
- <el-date-picker
- v-model="goalForm.endDate"
- type="date"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- placeholder="閫夋嫨鐩爣鏃ユ湡"
- style="width: 100%"
- />
+ <el-form-item label="缁撴潫鏃ユ湡"
+ prop="endDate">
+ <el-date-picker v-model="goalForm.endDate"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨鐩爣鏃ユ湡"
+ style="width: 100%" />
</el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="goalForm.status" placeholder="璇烽�夋嫨鐘舵��">
- <el-option label="鏈紑濮�" value="notStarted" />
- <el-option label="杩涜涓�" value="inProgress" />
- <el-option label="宸插畬鎴�" value="completed" />
- <el-option label="宸插欢杩�" value="delayed" />
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="goalForm.status"
+ placeholder="璇烽�夋嫨鐘舵��">
+ <el-option label="鏈紑濮�"
+ value="notStarted" />
+ <el-option label="杩涜涓�"
+ value="inProgress" />
+ <el-option label="宸插畬鎴�"
+ value="completed" />
+ <el-option label="宸插欢杩�"
+ value="delayed" />
</el-select>
</el-form-item>
<!-- <el-form-item label="瀹屾垚搴�" prop="completionRate">
@@ -239,8 +253,9 @@
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="submitGoalForm">纭畾</el-button>
<el-button @click="cancelGoal">鍙栨秷</el-button>
- <el-button type="primary" @click="submitGoalForm">纭畾</el-button>
</div>
</template>
</el-dialog>
@@ -248,318 +263,331 @@
</template>
<script setup>
-import { ref, reactive, onMounted, watch } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import { ElMessage } from 'element-plus';
-import TaskTree from './components/taskTree.vue';
-import MilestoneList from './components/milestoneList.vue';
-import ProjectForm from './components/projectForm.vue';
-import PhaseGoalList from './components/phaseGoalList.vue';
-import { getProject, addProjectPhase, listProjectPhase, addProjectTask, updateProjectTask } from '@/api/oaSystem/projectManagement';
+ import { ref, reactive, onMounted, watch } from "vue";
+ import { useRoute, useRouter } from "vue-router";
+ import { ElMessage } from "element-plus";
+ import TaskTree from "./components/taskTree.vue";
+ import MilestoneList from "./components/milestoneList.vue";
+ import ProjectForm from "./components/projectForm.vue";
+ import PhaseGoalList from "./components/phaseGoalList.vue";
+ import {
+ getProject,
+ addProjectPhase,
+ listProjectPhase,
+ addProjectTask,
+ updateProjectTask,
+ } from "@/api/oaSystem/projectManagement";
-const route = useRoute();
-const router = useRouter();
-const open = ref(false);
-const title = ref('');
-const projectFormRef = ref();
-const formRef = ref();
-// 椤圭洰ID
-// 鍦ㄥ叾浠杛ef瀹氫箟闄勮繎娣诲姞
-const refreshProjectId = ref(0);
+ const route = useRoute();
+ const router = useRouter();
+ const open = ref(false);
+ const title = ref("");
+ const projectFormRef = ref();
+ const formRef = ref();
+ // 椤圭洰ID
+ // 鍦ㄥ叾浠杛ef瀹氫箟闄勮繎娣诲姞
+ const refreshProjectId = ref(0);
-const projectId = ref(route.params.projectId);
+ const projectId = ref(route.params.projectId);
-// 椤圭洰淇℃伅
-const projectInfo = reactive({
- projectId: '',
- projectName: '',
- description: '',
- startDate: '',
- endDate: '',
- managerId: '',
- managerName: '',
- status: 'planning',
- completionRate: 0
-});
+ // 椤圭洰淇℃伅
+ const projectInfo = reactive({
+ projectId: "",
+ projectName: "",
+ description: "",
+ startDate: "",
+ endDate: "",
+ managerId: "",
+ managerName: "",
+ status: "planning",
+ completionRate: 0,
+ });
-// 缁熻淇℃伅
-const statistics = reactive({
- totalPhases: 0,
- totalTasks: 0,
- completedTasks: 0
-});
-const form = reactive({
- phaseId: '',
- phaseName: '',
- startDate: '',
- endDate: '',
- status: 'planning',
- oaProjectId: projectId.value,
-})
+ // 缁熻淇℃伅
+ const statistics = reactive({
+ totalPhases: 0,
+ totalTasks: 0,
+ completedTasks: 0,
+ });
+ const form = reactive({
+ phaseId: "",
+ phaseName: "",
+ startDate: "",
+ endDate: "",
+ status: "planning",
+ oaProjectId: projectId.value,
+ });
-// 闃舵鐩爣鐩稿叧
-const goalOpen = ref(false);
-const goalTitle = ref('');
-const goalFormRef = ref();
-const phaseList = ref([]);
-const goalForm = reactive({
- taskId: '',
- phaseId: '',
- taskName: '',
- targetValue: 100,
- currentValue: 0,
- unit: '%',
- targetDate: '',
- startDate: '',
- endDate: '',
- status: 'notStarted',
- completionRate: 0
-});
+ // 闃舵鐩爣鐩稿叧
+ const goalOpen = ref(false);
+ const goalTitle = ref("");
+ const goalFormRef = ref();
+ const phaseList = ref([]);
+ const goalForm = reactive({
+ taskId: "",
+ phaseId: "",
+ taskName: "",
+ targetValue: 100,
+ currentValue: 0,
+ unit: "%",
+ targetDate: "",
+ startDate: "",
+ endDate: "",
+ status: "notStarted",
+ completionRate: 0,
+ });
-// 鑾峰彇椤圭洰璇︽儏
-const getProjectDetail = async () => {
- try {
- getProject().then((res)=>{
- console.log("椤圭洰璇︽儏",res)
- const projectData = res.data[projectId.value];
- // 鏇存柊椤圭洰淇℃伅
- Object.assign(projectInfo, projectData);
-
- // 鏇存柊缁熻淇℃伅
- updateStatistics(projectData);
+ // 鑾峰彇椤圭洰璇︽儏
+ const getProjectDetail = async () => {
+ try {
+ getProject().then(res => {
+ console.log("椤圭洰璇︽儏", res);
+ const projectData = res.data[projectId.value];
+ // 鏇存柊椤圭洰淇℃伅
+ Object.assign(projectInfo, projectData);
- // 寮哄埗鏇存柊DOM浠ョ‘淇濆瓙缁勪欢鑳芥纭埛鏂�
- // 杩欓噷閫氳繃瑙﹀彂refreshProjectId浜嬩欢鏉ュ己鍒跺埛鏂板瓙缁勪欢
- refreshProjectId.value++;
- })
- } catch (error) {
- ElMessage.error('鑾峰彇椤圭洰璇︽儏澶辫触');
- console.error('鑾峰彇椤圭洰璇︽儏澶辫触:', error);
- }
-};
+ // 鏇存柊缁熻淇℃伅
+ updateStatistics(projectData);
-// 鏇存柊缁熻淇℃伅
-const updateStatistics = (projectData) => {
- // 杩欓噷鍋囪projectData涓寘鍚簡缁熻淇℃伅
- // 濡傛灉娌℃湁锛岄渶瑕佸崟鐙姹傜粺璁℃暟鎹�
- statistics.totalPhases = projectData.phases ? projectData.phases.length : 0;
- statistics.totalTasks = projectData.tasks ? projectData.tasks.length : 0;
- statistics.completedTasks = projectData.tasks ?
- projectData.tasks.filter(task => task.status === 'completed').length : 0;
-};
+ // 寮哄埗鏇存柊DOM浠ョ‘淇濆瓙缁勪欢鑳芥纭埛鏂�
+ // 杩欓噷閫氳繃瑙﹀彂refreshProjectId浜嬩欢鏉ュ己鍒跺埛鏂板瓙缁勪欢
+ refreshProjectId.value++;
+ });
+ } catch (error) {
+ ElMessage.error("鑾峰彇椤圭洰璇︽儏澶辫触");
+ console.error("鑾峰彇椤圭洰璇︽儏澶辫触:", error);
+ }
+ };
-// 鑾峰彇椤圭洰闃舵鍒楄〃
-const getPhaseList = async () => {
- try {
- const { data } = await listProjectPhase(projectId.value);
- phaseList.value = data.rows || data;
- } catch (error) {
- ElMessage.error('鑾峰彇椤圭洰闃舵鍒楄〃澶辫触');
- console.error('鑾峰彇椤圭洰闃舵鍒楄〃澶辫触:', error);
- }
-};
+ // 鏇存柊缁熻淇℃伅
+ const updateStatistics = projectData => {
+ // 杩欓噷鍋囪projectData涓寘鍚簡缁熻淇℃伅
+ // 濡傛灉娌℃湁锛岄渶瑕佸崟鐙姹傜粺璁℃暟鎹�
+ statistics.totalPhases = projectData.phases ? projectData.phases.length : 0;
+ statistics.totalTasks = projectData.tasks ? projectData.tasks.length : 0;
+ statistics.completedTasks = projectData.tasks
+ ? projectData.tasks.filter(task => task.status === "completed").length
+ : 0;
+ };
-// 璁＄畻瀹屾垚搴�
-const calculateCompletionRate = () => {
- if (goalForm.targetValue > 0) {
- goalForm.completionRate = Math.min(Math.round((goalForm.currentValue / goalForm.targetValue) * 100), 100);
- } else {
- goalForm.completionRate = 0;
- }
-};
+ // 鑾峰彇椤圭洰闃舵鍒楄〃
+ const getPhaseList = async () => {
+ try {
+ const { data } = await listProjectPhase(projectId.value);
+ phaseList.value = data.rows || data;
+ } catch (error) {
+ ElMessage.error("鑾峰彇椤圭洰闃舵鍒楄〃澶辫触");
+ console.error("鑾峰彇椤圭洰闃舵鍒楄〃澶辫触:", error);
+ }
+ };
-// 娣诲姞闃舵
-const handleAddPhase = () => {
- // resetForm();
- ElMessage.info('娣诲姞闃舵鍔熻兘寰呭疄鐜�');
-};
-
-// 娣诲姞閲岀▼纰�
-const handleAddMilestone = () => {
- resetForm();
- open.value = true;
- title.value = '鏂板椤圭洰闃舵';
-};
-
-// 娣诲姞闃舵浠诲姟
-const handleAddPhaseGoal = () => {
- goalForm.taskId = '';
- goalForm.phaseId = '';
- goalForm.taskName = '';
- goalForm.targetValue = 0;
- goalForm.currentValue = 0;
- goalForm.unit = '%';
- goalForm.targetDate = '';
- goalForm.startDate = '';
- goalForm.endDate = '';
- goalForm.status = 'notStarted';
- goalForm.completionRate = 0;
- if (goalFormRef.value) {
- goalFormRef.value.resetFields();
- }
- getPhaseList();
- goalTitle.value = '鏂板闃舵鐩爣';
- goalOpen.value = true;
-};
-
-// 鎻愪氦琛ㄥ崟
-const submitForm = async () => {
- try {
- await formRef.value.validate();
-
- if (form.phaseId) {
- // await updateProject(form);
- // ElMessage.success('淇敼椤圭洰闃舵鎴愬姛');
+ // 璁＄畻瀹屾垚搴�
+ const calculateCompletionRate = () => {
+ if (goalForm.targetValue > 0) {
+ goalForm.completionRate = Math.min(
+ Math.round((goalForm.currentValue / goalForm.targetValue) * 100),
+ 100
+ );
} else {
- console.log("form",form);
- await addProjectPhase(form);
- ElMessage.success('鏂板椤圭洰闃舵鎴愬姛');
+ goalForm.completionRate = 0;
+ }
+ };
+
+ // 娣诲姞闃舵
+ const handleAddPhase = () => {
+ // resetForm();
+ ElMessage.info("娣诲姞闃舵鍔熻兘寰呭疄鐜�");
+ };
+
+ // 娣诲姞閲岀▼纰�
+ const handleAddMilestone = () => {
+ resetForm();
+ open.value = true;
+ title.value = "鏂板椤圭洰闃舵";
+ };
+
+ // 娣诲姞闃舵浠诲姟
+ const handleAddPhaseGoal = () => {
+ goalForm.taskId = "";
+ goalForm.phaseId = "";
+ goalForm.taskName = "";
+ goalForm.targetValue = 0;
+ goalForm.currentValue = 0;
+ goalForm.unit = "%";
+ goalForm.targetDate = "";
+ goalForm.startDate = "";
+ goalForm.endDate = "";
+ goalForm.status = "notStarted";
+ goalForm.completionRate = 0;
+ if (goalFormRef.value) {
+ goalFormRef.value.resetFields();
+ }
+ getPhaseList();
+ goalTitle.value = "鏂板闃舵鐩爣";
+ goalOpen.value = true;
+ };
+
+ // 鎻愪氦琛ㄥ崟
+ const submitForm = async () => {
+ try {
+ await formRef.value.validate();
+
+ if (form.phaseId) {
+ // await updateProject(form);
+ // ElMessage.success('淇敼椤圭洰闃舵鎴愬姛');
+ } else {
+ console.log("form", form);
+ await addProjectPhase(form);
+ ElMessage.success("鏂板椤圭洰闃舵鎴愬姛");
+ getProjectDetail();
+ }
+ open.value = false;
+ } catch (error) {
+ console.error("鎻愪氦琛ㄥ崟澶辫触:", error);
+ }
+ };
+
+ // 鎻愪氦闃舵浠诲姟琛ㄥ崟
+ const submitGoalForm = async () => {
+ try {
+ await goalFormRef.value.validate();
+ calculateCompletionRate();
+
+ const goalData = {
+ ...goalForm,
+ oaProjectId: projectId.value,
+ };
+
+ if (goalForm.taskId) {
+ await updateProjectTask(goalData);
+ ElMessage.success("淇敼闃舵鐩爣鎴愬姛");
+ } else {
+ await addProjectTask(goalData);
+ ElMessage.success("鏂板闃舵鐩爣鎴愬姛");
+ }
+ // 璋冪敤getProjectDetail鍒锋柊鎵�鏈夌浉鍏虫暟鎹�
+ getProjectDetail();
+ goalOpen.value = false;
+ } catch (error) {
+ console.error("鎻愪氦闃舵鐩爣琛ㄥ崟澶辫触:", error);
+ }
+ };
+
+ // 閲嶇疆閲岀▼纰戣〃鍗�
+ const resetForm = () => {
+ form.phaseId = "";
+ form.phaseName = "";
+ form.startDate = "";
+ form.endDate = "";
+ form.status = "planning";
+ form.oaProjectId = projectId.value;
+ if (formRef.value) {
+ formRef.value.resetFields();
+ }
+ };
+
+ // 鍙栨秷闃舵浠诲姟鎿嶄綔
+ const cancelGoal = () => {
+ goalOpen.value = false;
+ };
+
+ // 鍙栨秷鎿嶄綔
+ const cancel = () => {
+ open.value = false;
+ };
+ // 缂栬緫闃舵浠诲姟
+ const handleEditPhaseGoal = async goal => {
+ // 澶嶅埗鐩爣鏁版嵁鍒拌〃鍗�
+ Object.assign(goalForm, goal);
+
+ // 鑾峰彇椤圭洰闃舵鍒楄〃
+ await getPhaseList();
+
+ // 鎵撳紑缂栬緫寮圭獥
+ goalTitle.value = "缂栬緫闃舵鐩爣";
+ goalOpen.value = true;
+ };
+ // 鑾峰彇鐘舵�佹爣绛剧被鍨�
+ const getStatusType = status => {
+ const statusTypeMap = {
+ planning: "info",
+ inProgress: "primary",
+ completed: "success",
+ paused: "warning",
+ };
+ return statusTypeMap[status] || "default";
+ };
+
+ // 鑾峰彇鐘舵�佹枃鏈�
+ const getStatusText = status => {
+ const statusTextMap = {
+ planning: "瑙勫垝涓�",
+ inProgress: "杩涜涓�",
+ completed: "宸插畬鎴�",
+ paused: "宸叉殏鍋�",
+ };
+ return statusTextMap[status] || status;
+ };
+
+ // 鐩戝惉璺敱鍙傛暟鍙樺寲
+ watch(
+ () => route.params.projectId,
+ newProjectId => {
+ // console.log('璺敱鍙傛暟鍙樺寲:', projectId);
+ if (newProjectId) {
+ projectId.value = newProjectId;
+ getProjectDetail();
+ }
+ }
+ );
+
+ // 鐩戝惉褰撳墠鍊煎拰鐩爣鍊煎彉鍖栵紝閲嶆柊璁＄畻瀹屾垚搴�
+ watch(
+ () => [goalForm.currentValue, goalForm.targetValue],
+ () => {
+ calculateCompletionRate();
+ }
+ );
+
+ // 鍒濆鍖�
+ onMounted(() => {
+ if (projectId.value) {
getProjectDetail();
}
- open.value = false;
- } catch (error) {
- console.error('鎻愪氦琛ㄥ崟澶辫触:', error);
- }
-};
-
-// 鎻愪氦闃舵浠诲姟琛ㄥ崟
-const submitGoalForm = async () => {
- try {
- await goalFormRef.value.validate();
- calculateCompletionRate();
-
- const goalData = {
- ...goalForm,
- oaProjectId: projectId.value
- };
-
- if (goalForm.taskId) {
- await updateProjectTask(goalData);
- ElMessage.success('淇敼闃舵鐩爣鎴愬姛');
-
- } else {
- await addProjectTask(goalData);
- ElMessage.success('鏂板闃舵鐩爣鎴愬姛');
-
- }
- // 璋冪敤getProjectDetail鍒锋柊鎵�鏈夌浉鍏虫暟鎹�
- getProjectDetail();
- goalOpen.value = false;
-
- } catch (error) {
- console.error('鎻愪氦闃舵鐩爣琛ㄥ崟澶辫触:', error);
- }
-};
-
-// 閲嶇疆閲岀▼纰戣〃鍗�
-const resetForm = () => {
- form.phaseId = '';
- form.phaseName = '';
- form.startDate = '';
- form.endDate = '';
- form.status = 'planning';
- form.oaProjectId = projectId.value;
- if (formRef.value) {
- formRef.value.resetFields();
- }
-};
-
-// 鍙栨秷闃舵浠诲姟鎿嶄綔
-const cancelGoal = () => {
- goalOpen.value = false;
-};
-
-// 鍙栨秷鎿嶄綔
-const cancel = () => {
- open.value = false;
-};
-// 缂栬緫闃舵浠诲姟
-const handleEditPhaseGoal = async (goal) => {
- // 澶嶅埗鐩爣鏁版嵁鍒拌〃鍗�
- Object.assign(goalForm, goal);
-
- // 鑾峰彇椤圭洰闃舵鍒楄〃
- await getPhaseList();
-
- // 鎵撳紑缂栬緫寮圭獥
- goalTitle.value = '缂栬緫闃舵鐩爣';
- goalOpen.value = true;
-};
-// 鑾峰彇鐘舵�佹爣绛剧被鍨�
-const getStatusType = (status) => {
- const statusTypeMap = {
- planning: 'info',
- inProgress: 'primary',
- completed: 'success',
- paused: 'warning'
- };
- return statusTypeMap[status] || 'default';
-};
-
-// 鑾峰彇鐘舵�佹枃鏈�
-const getStatusText = (status) => {
- const statusTextMap = {
- planning: '瑙勫垝涓�',
- inProgress: '杩涜涓�',
- completed: '宸插畬鎴�',
- paused: '宸叉殏鍋�'
- };
- return statusTextMap[status] || status;
-};
-
-// 鐩戝惉璺敱鍙傛暟鍙樺寲
-watch(() => route.params.projectId, (newProjectId) => {
- // console.log('璺敱鍙傛暟鍙樺寲:', projectId);
- if (newProjectId) {
- projectId.value = newProjectId;
- getProjectDetail();
- }
-});
-
-// 鐩戝惉褰撳墠鍊煎拰鐩爣鍊煎彉鍖栵紝閲嶆柊璁＄畻瀹屾垚搴�
-watch(() => [goalForm.currentValue, goalForm.targetValue], () => {
- calculateCompletionRate();
-});
-
-// 鍒濆鍖�
-onMounted(() => {
- if (projectId.value) {
- getProjectDetail();
- }
-});
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.progress-item {
- text-align: center;
- padding: 20px;
- background-color: #f5f7fa;
- border-radius: 8px;
-}
+ .progress-item {
+ text-align: center;
+ padding: 20px;
+ background-color: #f5f7fa;
+ border-radius: 8px;
+ }
-.progress-title {
- font-size: 14px;
- color: #606266;
- margin-bottom: 10px;
-}
+ .progress-title {
+ font-size: 14px;
+ color: #606266;
+ margin-bottom: 10px;
+ }
-.progress-number {
- font-size: 24px;
- font-weight: bold;
- color: #409eff;
-}
+ .progress-number {
+ font-size: 24px;
+ font-weight: bold;
+ color: #409eff;
+ }
-.mb20 {
- margin-bottom: 20px;
-}
+ .mb20 {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/procurementManagement/procurementPlan/index.vue b/src/views/procurementManagement/procurementPlan/index.vue
index 14424cc..c3e64d1 100644
--- a/src/views/procurementManagement/procurementPlan/index.vue
+++ b/src/views/procurementManagement/procurementPlan/index.vue
@@ -1,137 +1,179 @@
<template>
<div class="app-container">
<!-- 鎼滅储鍖哄煙 -->
- <el-card class="search-card" shadow="never">
- <el-form :model="searchForm" :inline="true" class="search-form">
+ <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-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 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 type="primary"
+ @click="handleSearch">
+ <el-icon>
+ <Search />
+ </el-icon>
鎼滅储
</el-button>
<el-button @click="handleReset">
- <el-icon><Refresh /></el-icon>
+ <el-icon>
+ <Refresh />
+ </el-icon>
閲嶇疆
</el-button>
</el-form-item>
</el-form>
</el-card>
-
<!-- 鎿嶄綔鎸夐挳 -->
- <el-card class="table-card" shadow="never">
+ <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 type="primary"
+ @click="handleAdd">
+ <el-icon>
+ <Plus />
+ </el-icon>
鏂板璁″垝
</el-button>
- <el-button type="info" @click="handleExport">
- <el-icon><Download /></el-icon>
+ <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>
+ <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>
+ <el-tag type="info"
+ size="small">{{ row.formula }}</el-tag>
</template>
</el-table-column>
- <el-table-column prop="status" label="鐘舵��" width="80" align="center">
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="80"
+ align="center">
<template #default="{ row }">
- <el-tag :type="row.status === 'active' ? 'success' : 'info'" size="small">
+ <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">
+ <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>
+ <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"
- />
+ <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>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog
- v-model="dialogVisible"
- :title="dialogType === 'add' ? '鏂板閲囪喘璁″垝' : '缂栬緫閲囪喘璁″垝'"
- width="1000px"
- :close-on-click-modal="false"
- >
+ <el-dialog v-model="dialogVisible"
+ :title="dialogType === 'add' ? '鏂板閲囪喘璁″垝' : '缂栬緫閲囪喘璁″垝'"
+ width="1000px"
+ :close-on-click-modal="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-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 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 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 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-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>
@@ -143,12 +185,13 @@
</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">
+ <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>
@@ -159,7 +202,8 @@
<el-checkbox v-model="formData.negativeStockAsDemand">璐熷簱瀛樹綔涓洪渶姹�</el-checkbox>
</div>
</el-tab-pane>
- <el-tab-pane label="璁＄畻鍙傛暟" name="calculation">
+ <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>
@@ -172,7 +216,6 @@
</el-tab-pane>
</el-tabs>
</div>
-
<!-- 姹囨�诲悎骞堕�夐」 -->
<div class="form-section">
<div class="section-title">姹囨�诲悎骞堕�夐」</div>
@@ -182,129 +225,161 @@
<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 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 type="info"
+ size="small">
鏀寔鍙橀噺锛氶璁″嚭搴撴暟閲忋�佺幇鏈夊簱瀛樸�佸畨鍏ㄥ簱瀛樸�侀璁″叆搴撴暟閲�
</el-text>
</div>
</div>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit"
+ :loading="submitLoading">纭畾</el-button>
<el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="handleSubmit" :loading="submitLoading">纭畾</el-button>
</div>
</template>
</el-dialog>
-
<!-- 浜у搧閫夋嫨瀵硅瘽妗� -->
- <el-dialog
- v-model="productSelectDialogVisible"
- title="閫夋嫨浜у搧"
- width="800px"
- :close-on-click-modal="false"
- >
+ <el-dialog v-model="productSelectDialogVisible"
+ title="閫夋嫨浜у搧"
+ width="800px"
+ :close-on-click-modal="false">
<div class="product-select">
- <el-alert
- title="璇烽�夋嫨瑕佽绠楃殑浜у搧"
- type="info"
- :closable="false"
- show-icon
- >
+ <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 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>
-
<template #footer>
<div class="dialog-footer">
- <el-button @click="productSelectDialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="handleConfirmProductSelection" :disabled="selectedProducts.length === 0">
+ <el-button type="primary"
+ @click="handleConfirmProductSelection"
+ :disabled="selectedProducts.length === 0">
纭璁＄畻
</el-button>
+ <el-button @click="productSelectDialogVisible = false">鍙栨秷</el-button>
</div>
</template>
</el-dialog>
-
<!-- 璁＄畻缁撴灉瀵硅瘽妗� -->
- <el-dialog
- v-model="calculateDialogVisible"
- title="閲囪喘璁＄畻缁撴灉"
- width="1000px"
- :close-on-click-modal="false"
- >
+ <el-dialog v-model="calculateDialogVisible"
+ title="閲囪喘璁＄畻缁撴灉"
+ width="1000px"
+ :close-on-click-modal="false">
<div class="calculate-result">
- <el-alert
- title="璁＄畻缁撴灉"
- type="success"
- :closable="false"
- show-icon
- >
+ <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">
+ <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">
+ <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">
+ <el-table-column prop="suggestedPurchase"
+ label="寤鸿閲囪喘"
+ width="100"
+ align="right">
<template #default="{ row }">
- <el-tag :type="row.suggestedPurchase > 0 ? 'danger' : 'success'" size="small">
+ <el-tag :type="row.suggestedPurchase > 0 ? 'danger' : 'success'"
+ size="small">
{{ row.suggestedPurchase }}
</el-tag>
</template>
</el-table-column>
</el-table>
</div>
-
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleCreatePurchaseOrder">纭</el-button>
<el-button @click="calculateDialogVisible = false">鍏抽棴</el-button>
- <el-button type="primary" @click="handleCreatePurchaseOrder">纭</el-button>
</div>
</template>
</el-dialog>
@@ -312,213 +387,48 @@
</template>
<script setup>
-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"
+ 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 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 searchForm = reactive({
+ planName: "",
+ status: "",
+ });
-// 鍒嗛〉鏁版嵁
-const pagination = reactive({
- current: 1,
- size: 20
-})
+ // 鍒嗛〉鏁版嵁
+ 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: '',
+ // 琛ㄥ崟鏁版嵁
+ const formData = reactive({
+ code: "",
+ planName: "",
+ description: "",
+ status: "",
isSystemPreset: false,
- formula: '棰勮鍑哄簱鏁伴噺 - 鐜版湁搴撳瓨 + 瀹夊叏搴撳瓨 - 棰勮鍏ュ簱鏁伴噺',
+ formula: "",
// 璁＄畻鍙傛暟
considerExistingStock: false,
warehouseControl: false,
@@ -530,255 +440,420 @@
// 姹囨�诲悎骞堕�夐」
summaryMaterial: false,
summaryAuxAttributes: false,
- summaryDemandDate: false
- })
- activeTab.value = 'demand'
-}
+ summaryDemandDate: false,
+ });
-const validateFormula = () => {
- // 绠�鍗曠殑鍏紡楠岃瘉
- const formula = formData.formula
- if (formula && !/^[a-zA-Z\u4e00-\u9fa5\s\*\+\-\/\(\)\d\.]+$/.test(formula)) {
- ElMessage.warning('鍏紡鏍煎紡鍙兘涓嶆纭紝璇锋鏌�')
- }
-}
+ // 褰撳墠婵�娲荤殑鏍囩椤�
+ const activeTab = ref("demand");
-const handleCalculate = (row) => {
- currentPlan.value = row
- productSelectDialogVisible.value = true
- loadProductList()
-}
+ // 琛ㄥ崟楠岃瘉瑙勫垯
+ const formRules = {
+ planName: [{ required: true, message: "璇疯緭鍏ヨ鍒掑悕绉�", trigger: "blur" }],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ formula: [{ required: true, message: "璇疯緭鍏ヨ绠楀叕寮�", trigger: "blur" }],
+ };
-const loadProductList = () => {
- productLoading.value = true
- // 妯℃嫙鍔犺浇浜у搧鏁版嵁
- listPageCopy({size:-1}).then(res => {
- if(res.code === 200){
- productList.value = res.data.records
- productLoading.value = false
+ // 琛ㄦ牸鏁版嵁
+ 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 handleProductSelectionChange = (selection) => {
- selectedProducts.value = selection
-}
+ const handleSubmit = async () => {
+ try {
+ // 琛ㄥ崟楠岃瘉
+ if (!formData.planName || !formData.formula) {
+ ElMessage.error("璇峰～鍐欏繀濉」");
+ return;
+ }
-const handleConfirmProductSelection = () => {
- if (selectedProducts.value.length === 0) {
- ElMessage.warning('璇烽�夋嫨瑕佽绠楃殑浜у搧')
- return
- }
-
- ElMessage.success(`姝ｅ湪璁＄畻 ${currentPlan.value.planName} 鐨勯噰璐渶姹�...`)
- productSelectDialogVisible.value = false
-
- // 鏍规嵁閫夋嫨鐨勪骇鍝佸拰璁＄畻鍏紡杩涜璁＄畻
- calculateWithSelectedProducts()
-}
+ submitLoading.value = true;
-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
+ 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;
}
- })
+ };
- calculateResult.value = result
- calculateDialogVisible.value = true
-}
+ 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 handleCreatePurchaseOrder = () => {
- calculateDialogVisible.value = false
-}
-const { proxy } = getCurrentInstance();
-const handleExport = () => {
- ElMessageBox.confirm("鍐呭灏嗚瀵煎嚭锛屾槸鍚︾‘璁ゅ鍑猴紵", "瀵煎嚭", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "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(`姝ｅ湪璁＄畻 ${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 handleSizeChange = (size) => {
- pagination.size = size
- loadData()
-}
+ const handleCurrentChange = current => {
+ pagination.current = current;
+ loadData();
+ };
-const handleCurrentChange = (current) => {
- pagination.current = current
- loadData()
-}
-
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- loadData()
-})
+ // 鐢熷懡鍛ㄦ湡
+ onMounted(() => {
+ loadData();
+ });
</script>
<style scoped>
-.app-container {
- padding: 20px;
-}
+ .app-container {
+ padding: 20px;
+ }
-.page-header {
- margin-bottom: 20px;
-}
+ .page-header {
+ margin-bottom: 20px;
+ }
-.page-header h2 {
- margin: 0 0 8px 0;
- color: #303133;
- font-size: 24px;
- font-weight: 600;
-}
+ .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;
-}
+ .page-header p {
+ margin: 0;
+ color: #909399;
+ font-size: 14px;
+ }
-.search-card {
- margin-bottom: 20px;
-}
+ .search-card {
+ margin-bottom: 20px;
+ }
-.search-form {
- margin-bottom: 0;
-}
+ .search-form {
+ margin-bottom: 0;
+ }
-.table-card {
- margin-bottom: 20px;
-}
+ .table-card {
+ margin-bottom: 20px;
+ }
-.table-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- 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-title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #303133;
+ }
-.table-actions {
- display: flex;
- gap: 10px;
-}
+ .table-actions {
+ display: flex;
+ gap: 10px;
+ }
-.pagination-container {
- margin-top: 20px;
- display: flex;
- justify-content: end;
-}
+ .pagination-container {
+ margin-top: 20px;
+ display: flex;
+ justify-content: end;
+ }
-.form-container {
- padding: 0 20px;
-}
+ .form-container {
+ padding: 0 20px;
+ }
-.formula-help {
- margin-top: 5px;
-}
+ .formula-help {
+ margin-top: 5px;
+ }
-.calculate-result {
- padding: 20px 0;
-}
+ .calculate-result {
+ padding: 20px 0;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
-:deep(.el-card__body) {
- padding: 20px;
-}
+ :deep(.el-card__body) {
+ padding: 20px;
+ }
-:deep(.el-table) {
- font-size: 14px;
-}
+ :deep(.el-table) {
+ font-size: 14px;
+ }
-:deep(.el-form-item__label) {
- font-weight: 500;
-}
+ :deep(.el-form-item__label) {
+ font-weight: 500;
+ }
-.form-container {
- padding: 0;
-}
+ .form-container {
+ padding: 0;
+ }
-.form-section {
- margin-bottom: 24px;
- border: 1px solid #e4e7ed;
- border-radius: 6px;
- overflow: hidden;
-}
+ .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;
-}
+ .section-title {
+ background-color: #f5f7fa;
+ padding: 12px 16px;
+ font-weight: 600;
+ color: #303133;
+ border-bottom: 1px solid #e4e7ed;
+ }
-.form-section .el-form {
- padding: 20px;
-}
+ .form-section .el-form {
+ padding: 20px;
+ }
-.param-tabs {
- padding: 20px;
-}
+ .param-tabs {
+ padding: 20px;
+ }
-.param-tabs :deep(.el-tabs__header) {
- margin-bottom: 20px;
-}
+ .param-tabs :deep(.el-tabs__header) {
+ margin-bottom: 20px;
+ }
-.param-tabs :deep(.el-tabs__item.is-active) {
- color: #f56c6c;
- border-bottom-color: #f56c6c;
-}
+ .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 {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 16px;
+ }
-.checkbox-group .el-checkbox {
- margin-right: 0;
- margin-bottom: 8px;
-}
+ .checkbox-group .el-checkbox {
+ margin-right: 0;
+ margin-bottom: 8px;
+ }
-.formula-input-section {
- padding: 20px;
-}
+ .formula-input-section {
+ padding: 20px;
+ }
-.formula-input-section .el-form-item {
- margin-bottom: 12px;
-}
+ .formula-input-section .el-form-item {
+ margin-bottom: 12px;
+ }
-.formula-help {
- text-align: center;
- margin-top: 8px;
-}
+ .formula-help {
+ text-align: center;
+ margin-top: 8px;
+ }
</style>
diff --git a/src/views/productManagement/productIdentifier/index.vue b/src/views/productManagement/productIdentifier/index.vue
index 59d8f90..519f745 100644
--- a/src/views/productManagement/productIdentifier/index.vue
+++ b/src/views/productManagement/productIdentifier/index.vue
@@ -1,159 +1,231 @@
<template>
<div class="app-container">
<el-card class="box-card">
- <!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
- <el-col :span="6">
- <el-input
- v-model="searchForm.productName"
- placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�"
- clearable
- @keyup.enter="handleSearch"
- >
- <template #prefix>
- <el-icon><Search /></el-icon>
- </template>
- </el-input>
- </el-col>
- <el-col :span="6">
- <el-select v-model="searchForm.identifierType" placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷" clearable>
- <el-option label="浜岀淮鐮�" value="浜岀淮鐮�"></el-option>
- <el-option label="闃蹭吉鐮�" value="闃蹭吉鐮�"></el-option>
- </el-select>
- </el-col>
- <el-col :span="6">
- <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鐘舵��" clearable>
- <el-option label="宸茬敓鎴�" value="宸茬敓鎴�"></el-option>
- <el-option label="宸插垎閰�" value="宸插垎閰�"></el-option>
- <el-option label="宸蹭娇鐢�" value="宸蹭娇鐢�"></el-option>
- <el-option label="宸蹭綔搴�" value="宸蹭綔搴�"></el-option>
- </el-select>
- </el-col>
- <el-col :span="6">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
- <el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button style="float: right;" type="primary" @click="handleAdd">
- 鏂板鏍囪瘑
- </el-button>
- </el-col>
- </el-row>
-
+ <!-- 鎼滅储鍖哄煙 -->
+ <el-row :gutter="20"
+ class="search-row">
+ <el-col :span="6">
+ <el-input v-model="searchForm.productName"
+ placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�"
+ clearable
+ @keyup.enter="handleSearch">
+ <template #prefix>
+ <el-icon>
+ <Search />
+ </el-icon>
+ </template>
+ </el-input>
+ </el-col>
+ <el-col :span="6">
+ <el-select v-model="searchForm.identifierType"
+ placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷"
+ clearable>
+ <el-option label="浜岀淮鐮�"
+ value="浜岀淮鐮�"></el-option>
+ <el-option label="闃蹭吉鐮�"
+ value="闃蹭吉鐮�"></el-option>
+ </el-select>
+ </el-col>
+ <el-col :span="6">
+ <el-select v-model="searchForm.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ clearable>
+ <el-option label="宸茬敓鎴�"
+ value="宸茬敓鎴�"></el-option>
+ <el-option label="宸插垎閰�"
+ value="宸插垎閰�"></el-option>
+ <el-option label="宸蹭娇鐢�"
+ value="宸蹭娇鐢�"></el-option>
+ <el-option label="宸蹭綔搴�"
+ value="宸蹭綔搴�"></el-option>
+ </el-select>
+ </el-col>
+ <el-col :span="6">
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
+ <el-button @click="resetSearch">閲嶇疆</el-button>
+ <el-button style="float: right;"
+ type="primary"
+ @click="handleAdd">
+ 鏂板鏍囪瘑
+ </el-button>
+ </el-col>
+ </el-row>
<!-- 浜у搧鏍囪瘑鍒楄〃 -->
- <el-table
- :data="filteredList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column prop="id" label="ID" width="80" align="center"/>
- <el-table-column prop="productName" label="浜у搧鍚嶇О" width="150" />
- <el-table-column prop="productCode" label="浜у搧缂栫爜" width="120" />
- <el-table-column prop="batchNo" label="鎵规鍙�" width="120" />
- <el-table-column prop="identifierType" label="鏍囪瘑绫诲瀷" width="100">
+ <el-table :data="filteredList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column prop="id"
+ label="ID"
+ width="80"
+ align="center" />
+ <el-table-column prop="productName"
+ label="浜у搧鍚嶇О"
+ width="150" />
+ <el-table-column prop="productCode"
+ label="浜у搧缂栫爜"
+ width="120" />
+ <el-table-column prop="batchNo"
+ label="鎵规鍙�"
+ width="120" />
+ <el-table-column prop="identifierType"
+ label="鏍囪瘑绫诲瀷"
+ width="100">
<template #default="scope">
<el-tag :type="getIdentifierTypeType(scope.row.identifierType)">
{{ scope.row.identifierType }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="identifierCode" label="鏍囪瘑鐮�" />
- <el-table-column prop="status" label="鐘舵��" width="100">
+ <el-table-column prop="identifierCode"
+ label="鏍囪瘑鐮�" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="generateTime" label="鐢熸垚鏃堕棿" width="160" />
- <el-table-column label="鎿嶄綔" fixed="right" align="center" width="280">
+ <el-table-column prop="generateTime"
+ label="鐢熸垚鏃堕棿"
+ width="160" />
+ <el-table-column label="鎿嶄綔"
+ fixed="right"
+ align="center"
+ width="280">
<template #default="scope">
- <el-button link type="primary" @click="handleView(scope.row)">鏌ョ湅</el-button>
- <el-button link type="primary" @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button link type="success" @click="generateQRCode(scope.row)">鐢熸垚浜岀淮鐮�</el-button>
- <el-button link type="primary" @click="handleExport(scope.row)">瀵煎嚭</el-button>
- <el-button link type="primary" @click="handleReassign(scope.row)" v-if="scope.row.status === '宸插垎閰�'">閲嶆柊鍒嗛厤</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)">鍒犻櫎</el-button>
+ <el-button link
+ type="primary"
+ @click="handleView(scope.row)">鏌ョ湅</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)">缂栬緫</el-button>
+ <el-button link
+ type="success"
+ @click="generateQRCode(scope.row)">鐢熸垚浜岀淮鐮�</el-button>
+ <el-button link
+ type="primary"
+ @click="handleExport(scope.row)">瀵煎嚭</el-button>
+ <el-button link
+ type="primary"
+ @click="handleReassign(scope.row)"
+ v-if="scope.row.status === '宸插垎閰�'">閲嶆柊鍒嗛厤</el-button>
+ <el-button link
+ type="danger"
+ @click="handleDelete(scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="pagination.total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.currentPage"
- :limit="pagination.pageSize"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="pagination.total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.currentPage"
+ :limit="pagination.pageSize"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="700px">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="700px">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="浜у搧鍚嶇О" prop="productName">
- <el-input v-model="form.productName" placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�"></el-input>
+ <el-form-item label="浜у搧鍚嶇О"
+ prop="productName">
+ <el-input v-model="form.productName"
+ placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="浜у搧缂栫爜" prop="productCode">
- <el-input v-model="form.productCode" placeholder="璇疯緭鍏ヤ骇鍝佺紪鐮�"></el-input>
+ <el-form-item label="浜у搧缂栫爜"
+ prop="productCode">
+ <el-input v-model="form.productCode"
+ placeholder="璇疯緭鍏ヤ骇鍝佺紪鐮�"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鎵规鍙�" prop="batchNo">
- <el-input v-model="form.batchNo" placeholder="璇疯緭鍏ユ壒娆″彿"></el-input>
+ <el-form-item label="鎵规鍙�"
+ prop="batchNo">
+ <el-input v-model="form.batchNo"
+ placeholder="璇疯緭鍏ユ壒娆″彿"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鏍囪瘑绫诲瀷" prop="identifierType">
- <el-select v-model="form.identifierType" placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷" style="width: 100%">
- <el-option label="浜岀淮鐮�" value="浜岀淮鐮�"></el-option>
- <el-option label="闃蹭吉鐮�" value="闃蹭吉鐮�"></el-option>
+ <el-form-item label="鏍囪瘑绫诲瀷"
+ prop="identifierType">
+ <el-select v-model="form.identifierType"
+ placeholder="璇烽�夋嫨鏍囪瘑绫诲瀷"
+ style="width: 100%">
+ <el-option label="浜岀淮鐮�"
+ value="浜岀淮鐮�"></el-option>
+ <el-option label="闃蹭吉鐮�"
+ value="闃蹭吉鐮�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鐢熸垚鏁伴噺" prop="quantity">
- <el-input-number v-model="form.quantity" :min="1" :max="10000" style="width: 100%"></el-input-number>
+ <el-form-item label="鐢熸垚鏁伴噺"
+ prop="quantity">
+ <el-input-number v-model="form.quantity"
+ :min="1"
+ :max="10000"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��" style="width: 100%">
- <el-option label="宸茬敓鎴�" value="宸茬敓鎴�"></el-option>
- <el-option label="宸插垎閰�" value="宸插垎閰�"></el-option>
- <el-option label="宸蹭娇鐢�" value="宸蹭娇鐢�"></el-option>
- <el-option label="宸蹭綔搴�" value="宸蹭綔搴�"></el-option>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ style="width: 100%">
+ <el-option label="宸茬敓鎴�"
+ value="宸茬敓鎴�"></el-option>
+ <el-option label="宸插垎閰�"
+ value="宸插垎閰�"></el-option>
+ <el-option label="宸蹭娇鐢�"
+ value="宸蹭娇鐢�"></el-option>
+ <el-option label="宸蹭綔搴�"
+ value="宸蹭綔搴�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
- <el-form-item label="澶囨敞" prop="remark">
- <el-input type="textarea" v-model="form.remark" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" rows="3"></el-input>
+ <el-form-item label="澶囨敞"
+ prop="remark">
+ <el-input type="textarea"
+ v-model="form.remark"
+ placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
+ rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鏍囪瘑鐢熸垚瀵硅瘽妗� -->
- <el-dialog v-model="generateDialogVisible" title="鏍囪瘑鐢熸垚" width="500px">
+ <el-dialog v-model="generateDialogVisible"
+ title="鏍囪瘑鐢熸垚"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="浜у搧鍚嶇О">
<span>{{ currentProduct.productName }}</span>
@@ -167,30 +239,45 @@
<el-form-item label="鏍囪瘑绫诲瀷">
<span>{{ currentProduct.identifierType }}</span>
</el-form-item>
- <el-form-item label="鐢熸垚鏁伴噺" prop="generateQuantity">
- <el-input-number v-model="generateQuantity" :min="1" :max="10000" style="width: 100%"></el-input-number>
+ <el-form-item label="鐢熸垚鏁伴噺"
+ prop="generateQuantity">
+ <el-input-number v-model="generateQuantity"
+ :min="1"
+ :max="10000"
+ style="width: 100%"></el-input-number>
</el-form-item>
- <el-form-item label="缂栫爜瑙勫垯" prop="codeRule">
- <el-select v-model="codeRule" placeholder="璇烽�夋嫨缂栫爜瑙勫垯" style="width: 100%">
- <el-option label="浜у搧缂栫爜+鎵规鍙�+搴忓彿" value="浜у搧缂栫爜+鎵规鍙�+搴忓彿"></el-option>
- <el-option label="鏃堕棿鎴�+闅忔満鏁�" value="鏃堕棿鎴�+闅忔満鏁�"></el-option>
- <el-option label="鑷畾涔夎鍒�" value="鑷畾涔夎鍒�"></el-option>
+ <el-form-item label="缂栫爜瑙勫垯"
+ prop="codeRule">
+ <el-select v-model="codeRule"
+ placeholder="璇烽�夋嫨缂栫爜瑙勫垯"
+ style="width: 100%">
+ <el-option label="浜у搧缂栫爜+鎵规鍙�+搴忓彿"
+ value="浜у搧缂栫爜+鎵规鍙�+搴忓彿"></el-option>
+ <el-option label="鏃堕棿鎴�+闅忔満鏁�"
+ value="鏃堕棿鎴�+闅忔満鏁�"></el-option>
+ <el-option label="鑷畾涔夎鍒�"
+ value="鑷畾涔夎鍒�"></el-option>
</el-select>
</el-form-item>
- <el-form-item label="鑷畾涔夊墠缂�" prop="customPrefix" v-if="codeRule === '鑷畾涔夎鍒�'">
- <el-input v-model="customPrefix" placeholder="璇疯緭鍏ヨ嚜瀹氫箟鍓嶇紑"></el-input>
+ <el-form-item label="鑷畾涔夊墠缂�"
+ prop="customPrefix"
+ v-if="codeRule === '鑷畾涔夎鍒�'">
+ <el-input v-model="customPrefix"
+ placeholder="璇疯緭鍏ヨ嚜瀹氫箟鍓嶇紑"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="generateIdentifiers">鐢� 鎴�</el-button>
<el-button @click="generateDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="generateIdentifiers">鐢� 鎴�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 閲嶆柊鍒嗛厤瀵硅瘽妗� -->
- <el-dialog v-model="reassignDialogVisible" title="閲嶆柊鍒嗛厤鏍囪瘑" width="500px">
+ <el-dialog v-model="reassignDialogVisible"
+ title="閲嶆柊鍒嗛厤鏍囪瘑"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="浜у搧鍚嶇О">
<span>{{ currentProduct.productName }}</span>
@@ -198,26 +285,38 @@
<el-form-item label="鏍囪瘑鐮�">
<span>{{ currentProduct.identifierCode }}</span>
</el-form-item>
- <el-form-item label="鏂版壒娆″彿" prop="newBatchNo">
- <el-input v-model="newBatchNo" placeholder="璇疯緭鍏ユ柊鎵规鍙�"></el-input>
+ <el-form-item label="鏂版壒娆″彿"
+ prop="newBatchNo">
+ <el-input v-model="newBatchNo"
+ placeholder="璇疯緭鍏ユ柊鎵规鍙�"></el-input>
</el-form-item>
- <el-form-item label="鍒嗛厤鍘熷洜" prop="reassignReason">
- <el-input type="textarea" v-model="reassignReason" rows="3" placeholder="璇疯緭鍏ラ噸鏂板垎閰嶅師鍥�"></el-input>
+ <el-form-item label="鍒嗛厤鍘熷洜"
+ prop="reassignReason">
+ <el-input type="textarea"
+ v-model="reassignReason"
+ rows="3"
+ placeholder="璇疯緭鍏ラ噸鏂板垎閰嶅師鍥�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="saveReassign">纭� 瀹�</el-button>
<el-button @click="reassignDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="saveReassign">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 浜岀淮鐮侀瑙堝璇濇 -->
- <el-dialog v-model="qrCodeDialogVisible" title="浜岀淮鐮侀瑙�" width="500px" center>
+ <el-dialog v-model="qrCodeDialogVisible"
+ title="浜岀淮鐮侀瑙�"
+ width="500px"
+ center>
<div class="qr-preview-container">
- <div v-if="qrCodeUrl" class="qr-image-container">
- <img :src="qrCodeUrl" alt="浜岀淮鐮�" class="qr-image" />
+ <div v-if="qrCodeUrl"
+ class="qr-image-container">
+ <img :src="qrCodeUrl"
+ alt="浜岀淮鐮�"
+ class="qr-image" />
<div class="qr-info">
<p><strong>浜у搧鍚嶇О锛�</strong>{{ currentQRProduct.productName }}</p>
<p><strong>浜у搧缂栫爜锛�</strong>{{ currentQRProduct.productCode }}</p>
@@ -226,29 +325,27 @@
<p><strong>鏍囪瘑绫诲瀷锛�</strong>{{ currentQRProduct.identifierType }}</p>
</div>
</div>
- <div v-else class="qr-loading">
- <el-icon class="is-loading"><Loading /></el-icon>
+ <div v-else
+ class="qr-loading">
+ <el-icon class="is-loading">
+ <Loading />
+ </el-icon>
<p>姝ｅ湪鐢熸垚浜岀淮鐮�...</p>
</div>
</div>
-
<template #footer>
<div class="dialog-footer">
<el-button @click="qrCodeDialogVisible = false">鍏抽棴</el-button>
- <el-button
- v-if="qrCodeUrl"
- type="primary"
- @click="copyQRContent"
- icon="CopyDocument"
- >
+ <el-button v-if="qrCodeUrl"
+ type="primary"
+ @click="copyQRContent"
+ icon="CopyDocument">
澶嶅埗鍐呭
</el-button>
- <el-button
- v-if="qrCodeUrl"
- type="success"
- @click="downloadQRCode"
- icon="Download"
- >
+ <el-button v-if="qrCodeUrl"
+ type="success"
+ @click="downloadQRCode"
+ icon="Download">
涓嬭浇浜岀淮鐮�
</el-button>
</div>
@@ -258,451 +355,465 @@
</template>
<script setup>
-import { ref, reactive, computed } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Search, Loading, Download } from '@element-plus/icons-vue'
-import Pagination from '@/components/PIMTable/Pagination.vue'
-import QRCode from 'qrcode'
+ import { ref, reactive, computed } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus, Search, Loading, Download } from "@element-plus/icons-vue";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
+ import QRCode from "qrcode";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- productName: '',
- identifierType: '',
- status: ''
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ productName: "",
+ identifierType: "",
+ status: "",
+ });
-const identifierList = ref([
- {
- id: 1,
- productName: '宸ヤ笟浼犳劅鍣ˋ鍨�',
- productCode: 'SENSOR001',
- batchNo: 'B202312001',
- identifierType: '浜岀淮鐮�',
- identifierCode: 'QR_SENSOR001_B202312001_001',
- status: '宸插垎閰�',
- generateTime: '2023-12-01 10:00:00',
- remark: '閲嶈浜у搧鏍囪瘑'
- },
- {
- id: 2,
- productName: '鎺у埗闈㈡澘B鍨�',
- productCode: 'PANEL002',
- batchNo: 'B202312002',
- identifierType: '闃蹭吉鐮�',
- identifierCode: 'SEC_PANEL002_B202312002_001',
- status: '宸茬敓鎴�',
- generateTime: '2023-12-02 14:30:00',
- remark: '甯歌浜у搧鏍囪瘑'
- },
- {
- id: 3,
- productName: '鏁版嵁閲囬泦鍣–鍨�',
- productCode: 'COLLECTOR003',
- batchNo: 'B202312003',
- identifierType: '闃蹭吉鐮�',
- identifierCode: 'SEC_COLLECTOR003_B202312003_001',
- status: '宸蹭娇鐢�',
- generateTime: '2023-12-03 09:15:00',
- remark: '娴嬭瘯浜у搧鏍囪瘑'
- }
-])
+ const identifierList = ref([
+ {
+ id: 1,
+ productName: "宸ヤ笟浼犳劅鍣ˋ鍨�",
+ productCode: "SENSOR001",
+ batchNo: "B202312001",
+ identifierType: "浜岀淮鐮�",
+ identifierCode: "QR_SENSOR001_B202312001_001",
+ status: "宸插垎閰�",
+ generateTime: "2023-12-01 10:00:00",
+ remark: "閲嶈浜у搧鏍囪瘑",
+ },
+ {
+ id: 2,
+ productName: "鎺у埗闈㈡澘B鍨�",
+ productCode: "PANEL002",
+ batchNo: "B202312002",
+ identifierType: "闃蹭吉鐮�",
+ identifierCode: "SEC_PANEL002_B202312002_001",
+ status: "宸茬敓鎴�",
+ generateTime: "2023-12-02 14:30:00",
+ remark: "甯歌浜у搧鏍囪瘑",
+ },
+ {
+ id: 3,
+ productName: "鏁版嵁閲囬泦鍣–鍨�",
+ productCode: "COLLECTOR003",
+ batchNo: "B202312003",
+ identifierType: "闃蹭吉鐮�",
+ identifierCode: "SEC_COLLECTOR003_B202312003_001",
+ status: "宸蹭娇鐢�",
+ generateTime: "2023-12-03 09:15:00",
+ remark: "娴嬭瘯浜у搧鏍囪瘑",
+ },
+ ]);
-const pagination = reactive({
- total: 3,
- currentPage: 1,
- pageSize: 10
-})
+ const pagination = reactive({
+ total: 3,
+ currentPage: 1,
+ pageSize: 10,
+ });
-const dialogVisible = ref(false)
-const dialogTitle = ref('鏂板鏍囪瘑')
-const form = reactive({
- productName: '',
- productCode: '',
- batchNo: '',
- identifierType: '',
- quantity: 1,
- status: '宸茬敓鎴�',
- remark: ''
-})
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("鏂板鏍囪瘑");
+ const form = reactive({
+ productName: "",
+ productCode: "",
+ batchNo: "",
+ identifierType: "",
+ quantity: 1,
+ status: "宸茬敓鎴�",
+ remark: "",
+ });
-const rules = {
- productName: [{ required: true, message: '璇疯緭鍏ヤ骇鍝佸悕绉�', trigger: 'blur' }],
- productCode: [{ required: true, message: '璇疯緭鍏ヤ骇鍝佺紪鐮�', trigger: 'blur' }],
- batchNo: [{ required: true, message: '璇疯緭鍏ユ壒娆″彿', trigger: 'blur' }],
- identifierType: [{ required: true, message: '璇烽�夋嫨鏍囪瘑绫诲瀷', trigger: 'change' }],
- quantity: [{ required: true, message: '璇疯緭鍏ョ敓鎴愭暟閲�', trigger: 'blur' }],
- status: [{ required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }]
-}
+ const rules = {
+ productName: [{ required: true, message: "璇疯緭鍏ヤ骇鍝佸悕绉�", trigger: "blur" }],
+ productCode: [{ required: true, message: "璇疯緭鍏ヤ骇鍝佺紪鐮�", trigger: "blur" }],
+ batchNo: [{ required: true, message: "璇疯緭鍏ユ壒娆″彿", trigger: "blur" }],
+ identifierType: [
+ { required: true, message: "璇烽�夋嫨鏍囪瘑绫诲瀷", trigger: "change" },
+ ],
+ quantity: [{ required: true, message: "璇疯緭鍏ョ敓鎴愭暟閲�", trigger: "blur" }],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ };
-const isEdit = ref(false)
-const editId = ref(null)
-const generateDialogVisible = ref(false)
-const reassignDialogVisible = ref(false)
-const currentProduct = ref({})
-const generateQuantity = ref(1)
-const codeRule = ref('')
-const customPrefix = ref('')
-const newBatchNo = ref('')
-const reassignReason = ref('')
-const formRef = ref()
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const generateDialogVisible = ref(false);
+ const reassignDialogVisible = ref(false);
+ const currentProduct = ref({});
+ const generateQuantity = ref(1);
+ const codeRule = ref("");
+ const customPrefix = ref("");
+ const newBatchNo = ref("");
+ const reassignReason = ref("");
+ const formRef = ref();
-// 浜岀淮鐮佺浉鍏冲彉閲�
-const qrCodeDialogVisible = ref(false)
-const qrCodeUrl = ref('')
-const currentQRProduct = ref({})
+ // 浜岀淮鐮佺浉鍏冲彉閲�
+ const qrCodeDialogVisible = ref(false);
+ const qrCodeUrl = ref("");
+ const currentQRProduct = ref({});
-// 璁＄畻灞炴��
-const filteredList = computed(() => {
- let list = identifierList.value
- if (searchForm.productName) {
- list = list.filter(item => item.productName.includes(searchForm.productName))
- }
- if (searchForm.identifierType) {
- list = list.filter(item => item.identifierType === searchForm.identifierType)
- }
- if (searchForm.status) {
- list = list.filter(item => item.status === searchForm.status)
- }
- return list
-})
+ // 璁＄畻灞炴��
+ const filteredList = computed(() => {
+ let list = identifierList.value;
+ if (searchForm.productName) {
+ list = list.filter(item =>
+ item.productName.includes(searchForm.productName)
+ );
+ }
+ if (searchForm.identifierType) {
+ list = list.filter(
+ item => item.identifierType === searchForm.identifierType
+ );
+ }
+ if (searchForm.status) {
+ list = list.filter(item => item.status === searchForm.status);
+ }
+ return list;
+ });
-// 鏂规硶
-const getIdentifierTypeType = (type) => {
- const typeMap = {
- '浜岀淮鐮�': 'success',
- '闃蹭吉鐮�': 'warning'
- }
- return typeMap[type] || 'info'
-}
+ // 鏂规硶
+ const getIdentifierTypeType = type => {
+ const typeMap = {
+ 浜岀淮鐮�: "success",
+ 闃蹭吉鐮�: "warning",
+ };
+ return typeMap[type] || "info";
+ };
-const getStatusType = (status) => {
- const statusMap = {
- '宸茬敓鎴�': 'info',
- '宸插垎閰�': 'primary',
- '宸蹭娇鐢�': 'success',
- '宸蹭綔搴�': 'danger'
- }
- return statusMap[status] || 'info'
-}
+ const getStatusType = status => {
+ const statusMap = {
+ 宸茬敓鎴�: "info",
+ 宸插垎閰�: "primary",
+ 宸蹭娇鐢�: "success",
+ 宸蹭綔搴�: "danger",
+ };
+ return statusMap[status] || "info";
+ };
-const handleSearch = () => {
- // 鎼滅储閫昏緫宸插湪computed涓鐞�
-}
+ const handleSearch = () => {
+ // 鎼滅储閫昏緫宸插湪computed涓鐞�
+ };
-const resetSearch = () => {
- searchForm.productName = ''
- searchForm.identifierType = ''
- searchForm.status = ''
-}
+ const resetSearch = () => {
+ searchForm.productName = "";
+ searchForm.identifierType = "";
+ searchForm.status = "";
+ };
-const handleAdd = () => {
- dialogTitle.value = '鏂板鏍囪瘑'
- isEdit.value = false
- form.productName = ''
- form.productCode = ''
- form.batchNo = ''
- form.identifierType = ''
- form.quantity = 1
- form.status = '宸茬敓鎴�'
- form.remark = ''
- dialogVisible.value = true
-}
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板鏍囪瘑";
+ isEdit.value = false;
+ form.productName = "";
+ form.productCode = "";
+ form.batchNo = "";
+ form.identifierType = "";
+ form.quantity = 1;
+ form.status = "宸茬敓鎴�";
+ form.remark = "";
+ dialogVisible.value = true;
+ };
-const handleView = (row) => {
- // 鏌ョ湅鏍囪瘑璇︽儏
- ElMessage.info('鏌ョ湅鏍囪瘑璇︽儏鍔熻兘寰呭疄鐜�')
-}
+ const handleView = row => {
+ // 鏌ョ湅鏍囪瘑璇︽儏
+ ElMessage.info("鏌ョ湅鏍囪瘑璇︽儏鍔熻兘寰呭疄鐜�");
+ };
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫鏍囪瘑'
- isEdit.value = true
- editId.value = row.id
- Object.assign(form, row)
- dialogVisible.value = true
-}
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫鏍囪瘑";
+ isEdit.value = true;
+ editId.value = row.id;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
-const handleExport = (row) => {
- // 瀵煎嚭鏍囪瘑
- ElMessage.success(`宸插鍑烘爣璇�: ${row.identifierCode}`)
-}
+ const handleExport = row => {
+ // 瀵煎嚭鏍囪瘑
+ ElMessage.success(`宸插鍑烘爣璇�: ${row.identifierCode}`);
+ };
-const handleReassign = (row) => {
- currentProduct.value = row
- newBatchNo.value = ''
- reassignReason.value = ''
- reassignDialogVisible.value = true
-}
+ const handleReassign = row => {
+ currentProduct.value = row;
+ newBatchNo.value = "";
+ reassignReason.value = "";
+ reassignDialogVisible.value = true;
+ };
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ユ爣璇嗗悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const index = identifierList.value.findIndex(item => item.id === row.id)
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ユ爣璇嗗悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ const index = identifierList.value.findIndex(item => item.id === row.id);
+ if (index > -1) {
+ identifierList.value.splice(index, 1);
+ pagination.total--;
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ }
+ });
+ };
+
+ // 鐢熸垚浜岀淮鐮�
+ const generateQRCode = async row => {
+ try {
+ // 妫�鏌ュ繀瑕佸瓧娈�
+ if (!row.productName || !row.productCode || !row.batchNo) {
+ ElMessage.warning("浜у搧淇℃伅涓嶅畬鏁达紝鏃犳硶鐢熸垚浜岀淮鐮�");
+ return;
+ }
+
+ currentQRProduct.value = row;
+ qrCodeUrl.value = "";
+ qrCodeDialogVisible.value = true;
+
+ // 鏋勫缓浜岀淮鐮佸唴瀹�
+ let qrContent = "";
+ if (row.identifierType === "浜岀淮鐮�") {
+ qrContent = `${row.productName}|${row.productCode}|${row.batchNo}|${row.identifierCode}`;
+ } else if (row.identifierType === "闃蹭吉鐮�") {
+ // 闃蹭吉鐮佹牸寮忥細SEC_浜у搧缂栫爜_鎵规鍙穇鏃堕棿鎴砡闅忔満鏁�
+ const timestamp = Date.now();
+ const random = Math.random().toString(36).substr(2, 8);
+ qrContent = `SEC_${row.productCode}_${row.batchNo}_${timestamp}_${random}`;
+ }
+
+ // 鐢熸垚浜岀淮鐮�
+ qrCodeUrl.value = await QRCode.toDataURL(qrContent, {
+ width: 256,
+ margin: 2,
+ color: {
+ dark: "#000000",
+ light: "#FFFFFF",
+ },
+ errorCorrectionLevel: row.identifierType === "闃蹭吉鐮�" ? "H" : "M",
+ });
+
+ ElMessage.success("浜岀淮鐮佺敓鎴愭垚鍔燂紒");
+ } catch (error) {
+ console.error("鐢熸垚浜岀淮鐮佸け璐�:", error);
+ ElMessage.error("鐢熸垚浜岀淮鐮佸け璐ワ細" + error.message);
+ qrCodeDialogVisible.value = false;
+ }
+ };
+
+ // 涓嬭浇浜岀淮鐮�
+ const downloadQRCode = () => {
+ if (!qrCodeUrl.value) {
+ ElMessage.warning("璇峰厛鐢熸垚浜岀淮鐮�");
+ return;
+ }
+
+ const a = document.createElement("a");
+ a.href = qrCodeUrl.value;
+ a.download = `${currentQRProduct.value.productName}_${
+ currentQRProduct.value.identifierType
+ }_${new Date().getTime()}.png`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ ElMessage.success("涓嬭浇鎴愬姛锛�");
+ };
+
+ // 澶嶅埗浜岀淮鐮佸唴瀹�
+ const copyQRContent = async () => {
+ if (!currentQRProduct.value) {
+ ElMessage.warning("娌℃湁鍙鍒剁殑鍐呭");
+ return;
+ }
+
+ try {
+ let content = "";
+ if (currentQRProduct.value.identifierType === "浜岀淮鐮�") {
+ content = `${currentQRProduct.value.productName}|${currentQRProduct.value.productCode}|${currentQRProduct.value.batchNo}|${currentQRProduct.value.identifierCode}`;
+ } else if (currentQRProduct.value.identifierType === "闃蹭吉鐮�") {
+ const timestamp = Date.now();
+ const random = Math.random().toString(36).substr(2, 8);
+ content = `SEC_${currentQRProduct.value.productCode}_${currentQRProduct.value.batchNo}_${timestamp}_${random}`;
+ }
+
+ await navigator.clipboard.writeText(content);
+ ElMessage.success("鍐呭宸插鍒跺埌鍓创鏉�");
+ } catch (error) {
+ // 闄嶇骇鏂规
+ const textArea = document.createElement("textarea");
+ textArea.value = content;
+ document.body.appendChild(textArea);
+ textArea.select();
+ document.execCommand("copy");
+ document.body.removeChild(textArea);
+ ElMessage.success("鍐呭宸插鍒跺埌鍓创鏉�");
+ }
+ };
+
+ const generateIdentifiers = () => {
+ if (!codeRule.value) {
+ ElMessage.warning("璇烽�夋嫨缂栫爜瑙勫垯");
+ return;
+ }
+
+ // 鐢熸垚鏍囪瘑鐨勯�昏緫
+ const newIdentifiers = [];
+ for (let i = 1; i <= generateQuantity.value; i++) {
+ let identifierCode = "";
+ if (codeRule.value === "浜у搧缂栫爜+鎵规鍙�+搴忓彿") {
+ identifierCode = `${currentProduct.value.productCode}_${
+ currentProduct.value.batchNo
+ }_${String(i).padStart(3, "0")}`;
+ } else if (codeRule.value === "鏃堕棿鎴�+闅忔満鏁�") {
+ identifierCode = `TS_${Date.now()}_${Math.floor(Math.random() * 1000)}`;
+ } else if (codeRule.value === "鑷畾涔夎鍒�") {
+ identifierCode = `${customPrefix.value || "CUSTOM"}_${Date.now()}_${i}`;
+ }
+
+ newIdentifiers.push({
+ id: Math.max(...identifierList.value.map(item => item.id)) + i,
+ productName: currentProduct.value.productName,
+ productCode: currentProduct.value.productCode,
+ batchNo: currentProduct.value.batchNo,
+ identifierType: currentProduct.value.identifierType,
+ identifierCode: identifierCode,
+ status: "宸茬敓鎴�",
+ generateTime: new Date().toLocaleString(),
+ remark: "鎵归噺鐢熸垚",
+ });
+ }
+
+ identifierList.value.push(...newIdentifiers);
+ pagination.total += newIdentifiers.length;
+ ElMessage.success(`鎴愬姛鐢熸垚 ${newIdentifiers.length} 涓爣璇哷);
+ generateDialogVisible.value = false;
+ };
+
+ const saveReassign = () => {
+ if (!newBatchNo.value) {
+ ElMessage.warning("璇疯緭鍏ユ柊鎵规鍙�");
+ return;
+ }
+
+ const index = identifierList.value.findIndex(
+ item => item.id === currentProduct.value.id
+ );
if (index > -1) {
- identifierList.value.splice(index, 1)
- pagination.total--
- ElMessage.success('鍒犻櫎鎴愬姛')
+ identifierList.value[index].batchNo = newBatchNo.value;
+ identifierList.value[index].status = "宸插垎閰�";
+ ElMessage.success("鏍囪瘑閲嶆柊鍒嗛厤鎴愬姛");
+ reassignDialogVisible.value = false;
}
- })
-}
+ };
-// 鐢熸垚浜岀淮鐮�
-const generateQRCode = async (row) => {
- try {
- // 妫�鏌ュ繀瑕佸瓧娈�
- if (!row.productName || !row.productCode || !row.batchNo) {
- ElMessage.warning('浜у搧淇℃伅涓嶅畬鏁达紝鏃犳硶鐢熸垚浜岀淮鐮�')
- return
- }
-
- currentQRProduct.value = row
- qrCodeUrl.value = ''
- qrCodeDialogVisible.value = true
-
- // 鏋勫缓浜岀淮鐮佸唴瀹�
- let qrContent = ''
- if (row.identifierType === '浜岀淮鐮�') {
- qrContent = `${row.productName}|${row.productCode}|${row.batchNo}|${row.identifierCode}`
- } else if (row.identifierType === '闃蹭吉鐮�') {
- // 闃蹭吉鐮佹牸寮忥細SEC_浜у搧缂栫爜_鎵规鍙穇鏃堕棿鎴砡闅忔満鏁�
- const timestamp = Date.now()
- const random = Math.random().toString(36).substr(2, 8)
- qrContent = `SEC_${row.productCode}_${row.batchNo}_${timestamp}_${random}`
- }
-
- // 鐢熸垚浜岀淮鐮�
- qrCodeUrl.value = await QRCode.toDataURL(qrContent, {
- width: 256,
- margin: 2,
- color: {
- dark: '#000000',
- light: '#FFFFFF'
- },
- errorCorrectionLevel: row.identifierType === '闃蹭吉鐮�' ? 'H' : 'M'
- })
-
- ElMessage.success('浜岀淮鐮佺敓鎴愭垚鍔燂紒')
-
- } catch (error) {
- console.error('鐢熸垚浜岀淮鐮佸け璐�:', error)
- ElMessage.error('鐢熸垚浜岀淮鐮佸け璐ワ細' + error.message)
- qrCodeDialogVisible.value = false
- }
-}
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (isEdit.value) {
+ // 缂栬緫
+ const index = identifierList.value.findIndex(
+ item => item.id === editId.value
+ );
+ if (index > -1) {
+ identifierList.value[index] = { ...form, id: editId.value };
+ ElMessage.success("缂栬緫鎴愬姛");
+ }
+ } else {
+ // 鏂板
+ const newId =
+ Math.max(...identifierList.value.map(item => item.id)) + 1;
-// 涓嬭浇浜岀淮鐮�
-const downloadQRCode = () => {
- if (!qrCodeUrl.value) {
- ElMessage.warning('璇峰厛鐢熸垚浜岀淮鐮�')
- return
- }
-
- const a = document.createElement('a')
- a.href = qrCodeUrl.value
- a.download = `${currentQRProduct.value.productName}_${currentQRProduct.value.identifierType}_${new Date().getTime()}.png`
- document.body.appendChild(a)
- a.click()
- document.body.removeChild(a)
- ElMessage.success('涓嬭浇鎴愬姛锛�')
-}
+ // 鏍规嵁鏍囪瘑绫诲瀷鐢熸垚涓嶅悓鐨勬爣璇嗙爜
+ let identifierCode = "";
+ if (form.identifierType === "浜岀淮鐮�") {
+ identifierCode = `QR_${form.productCode}_${form.batchNo}_001`;
+ } else if (form.identifierType === "闃蹭吉鐮�") {
+ identifierCode = `SEC_${form.productCode}_${form.batchNo}_001`;
+ }
-// 澶嶅埗浜岀淮鐮佸唴瀹�
-const copyQRContent = async () => {
- if (!currentQRProduct.value) {
- ElMessage.warning('娌℃湁鍙鍒剁殑鍐呭')
- return
- }
-
- try {
- let content = ''
- if (currentQRProduct.value.identifierType === '浜岀淮鐮�') {
- content = `${currentQRProduct.value.productName}|${currentQRProduct.value.productCode}|${currentQRProduct.value.batchNo}|${currentQRProduct.value.identifierCode}`
- } else if (currentQRProduct.value.identifierType === '闃蹭吉鐮�') {
- const timestamp = Date.now()
- const random = Math.random().toString(36).substr(2, 8)
- content = `SEC_${currentQRProduct.value.productCode}_${currentQRProduct.value.batchNo}_${timestamp}_${random}`
- }
-
- await navigator.clipboard.writeText(content)
- ElMessage.success('鍐呭宸插鍒跺埌鍓创鏉�')
- } catch (error) {
- // 闄嶇骇鏂规
- const textArea = document.createElement('textarea')
- textArea.value = content
- document.body.appendChild(textArea)
- textArea.select()
- document.execCommand('copy')
- document.body.removeChild(textArea)
- ElMessage.success('鍐呭宸插鍒跺埌鍓创鏉�')
- }
-}
-
-const generateIdentifiers = () => {
- if (!codeRule.value) {
- ElMessage.warning('璇烽�夋嫨缂栫爜瑙勫垯')
- return
- }
-
- // 鐢熸垚鏍囪瘑鐨勯�昏緫
- const newIdentifiers = []
- for (let i = 1; i <= generateQuantity.value; i++) {
- let identifierCode = ''
- if (codeRule.value === '浜у搧缂栫爜+鎵规鍙�+搴忓彿') {
- identifierCode = `${currentProduct.value.productCode}_${currentProduct.value.batchNo}_${String(i).padStart(3, '0')}`
- } else if (codeRule.value === '鏃堕棿鎴�+闅忔満鏁�') {
- identifierCode = `TS_${Date.now()}_${Math.floor(Math.random() * 1000)}`
- } else if (codeRule.value === '鑷畾涔夎鍒�') {
- identifierCode = `${customPrefix.value || 'CUSTOM'}_${Date.now()}_${i}`
- }
-
- newIdentifiers.push({
- id: Math.max(...identifierList.value.map(item => item.id)) + i,
- productName: currentProduct.value.productName,
- productCode: currentProduct.value.productCode,
- batchNo: currentProduct.value.batchNo,
- identifierType: currentProduct.value.identifierType,
- identifierCode: identifierCode,
- status: '宸茬敓鎴�',
- generateTime: new Date().toLocaleString(),
- remark: '鎵归噺鐢熸垚'
- })
- }
-
- identifierList.value.push(...newIdentifiers)
- pagination.total += newIdentifiers.length
- ElMessage.success(`鎴愬姛鐢熸垚 ${newIdentifiers.length} 涓爣璇哷)
- generateDialogVisible.value = false
-}
-
-const saveReassign = () => {
- if (!newBatchNo.value) {
- ElMessage.warning('璇疯緭鍏ユ柊鎵规鍙�')
- return
- }
-
- const index = identifierList.value.findIndex(item => item.id === currentProduct.value.id)
- if (index > -1) {
- identifierList.value[index].batchNo = newBatchNo.value
- identifierList.value[index].status = '宸插垎閰�'
- ElMessage.success('鏍囪瘑閲嶆柊鍒嗛厤鎴愬姛')
- reassignDialogVisible.value = false
- }
-}
-
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (isEdit.value) {
- // 缂栬緫
- const index = identifierList.value.findIndex(item => item.id === editId.value)
- if (index > -1) {
- identifierList.value[index] = { ...form, id: editId.value }
- ElMessage.success('缂栬緫鎴愬姛')
+ identifierList.value.push({
+ ...form,
+ id: newId,
+ identifierCode: identifierCode,
+ generateTime: new Date().toLocaleString(),
+ });
+ pagination.total++;
+ ElMessage.success("鏂板鎴愬姛");
}
- } else {
- // 鏂板
- const newId = Math.max(...identifierList.value.map(item => item.id)) + 1
-
- // 鏍规嵁鏍囪瘑绫诲瀷鐢熸垚涓嶅悓鐨勬爣璇嗙爜
- let identifierCode = ''
- if (form.identifierType === '浜岀淮鐮�') {
- identifierCode = `QR_${form.productCode}_${form.batchNo}_001`
- } else if (form.identifierType === '闃蹭吉鐮�') {
- identifierCode = `SEC_${form.productCode}_${form.batchNo}_001`
- }
-
- identifierList.value.push({
- ...form,
- id: newId,
- identifierCode: identifierCode,
- generateTime: new Date().toLocaleString()
- })
- pagination.total++
- ElMessage.success('鏂板鎴愬姛')
- }
- dialogVisible.value = false
- }
- })
-}
+ dialogVisible.value = false;
+ }
+ });
+ };
-const handleCurrentChange = (val) => {
- pagination.currentPage = val.page
- pagination.pageSize = val.limit
-}
+ const handleCurrentChange = val => {
+ pagination.currentPage = val.page;
+ pagination.pageSize = val.limit;
+ };
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
-.quick-actions-row {
- margin-bottom: 20px;
-}
+ .quick-actions-row {
+ margin-bottom: 20px;
+ }
-.quick-actions-row .el-alert {
- margin-bottom: 0;
-}
+ .quick-actions-row .el-alert {
+ margin-bottom: 0;
+ }
-.quick-actions-row .el-alert p {
- margin: 5px 0;
- font-size: 14px;
- line-height: 1.5;
-}
+ .quick-actions-row .el-alert p {
+ margin: 5px 0;
+ font-size: 14px;
+ line-height: 1.5;
+ }
-/* 浜岀淮鐮侀瑙堟牱寮� */
-.qr-preview-container {
- text-align: center;
- padding: 20px;
-}
+ /* 浜岀淮鐮侀瑙堟牱寮� */
+ .qr-preview-container {
+ text-align: center;
+ padding: 20px;
+ }
-.qr-image-container {
- display: flex;
- flex-direction: column;
- align-items: center;
- gap: 20px;
-}
+ .qr-image-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 20px;
+ }
-.qr-image {
- max-width: 100%;
- height: auto;
- border: 2px solid #e0e0e0;
- border-radius: 8px;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
+ .qr-image {
+ max-width: 100%;
+ height: auto;
+ border: 2px solid #e0e0e0;
+ border-radius: 8px;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+ }
-.qr-info {
- text-align: left;
- background: #f8f9fa;
- padding: 15px;
- border-radius: 8px;
- min-width: 300px;
-}
+ .qr-info {
+ text-align: left;
+ background: #f8f9fa;
+ padding: 15px;
+ border-radius: 8px;
+ min-width: 300px;
+ }
-.qr-info p {
- margin: 8px 0;
- color: #666;
- font-size: 14px;
-}
+ .qr-info p {
+ margin: 8px 0;
+ color: #666;
+ font-size: 14px;
+ }
-.qr-loading {
- display: flex;
- flex-direction: column;
- align-items: center;
- gap: 15px;
- padding: 40px 0;
-}
+ .qr-loading {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 15px;
+ padding: 40px 0;
+ }
-.qr-loading .el-icon {
- font-size: 32px;
- color: #409EFF;
-}
+ .qr-loading .el-icon {
+ font-size: 32px;
+ color: #409eff;
+ }
-.qr-loading p {
- color: #666;
- margin: 0;
-}
+ .qr-loading p {
+ color: #666;
+ margin: 0;
+ }
</style>
diff --git a/src/views/productionManagement/productStructure/StructureEdit.vue b/src/views/productionManagement/productStructure/StructureEdit.vue
index fb5784f..679a37c 100644
--- a/src/views/productionManagement/productStructure/StructureEdit.vue
+++ b/src/views/productionManagement/productStructure/StructureEdit.vue
@@ -1,304 +1,285 @@
<template>
- <el-dialog
- v-model="visible"
- title="缁撴瀯"
- width="1200"
- close-on-click-modal
- @close="visible = false"
- >
- <el-button
- v-if="dataValue.isEdit"
- type="primary"
- @click="addItem"
- style="margin-bottom: 10px"
- >娣诲姞
+ <el-dialog v-model="visible"
+ title="缁撴瀯"
+ width="1200"
+ close-on-click-modal
+ @close="visible = false">
+ <el-button v-if="dataValue.isEdit"
+ type="primary"
+ @click="addItem"
+ style="margin-bottom: 10px">娣诲姞
</el-button>
- <el-button
- v-if="!dataValue.isEdit"
- type="primary"
- @click="dataValue.isEdit = true"
- style="margin-bottom: 10px"
- >缂栬緫
+ <el-button v-if="!dataValue.isEdit"
+ type="primary"
+ @click="dataValue.isEdit = true"
+ style="margin-bottom: 10px">缂栬緫
</el-button>
- <el-button
- v-if="dataValue.isEdit"
- type="primary"
- @click="cancelEdit"
- style="margin-bottom: 10px"
- >鍙栨秷
+ <el-button v-if="dataValue.isEdit"
+ type="primary"
+ @click="cancelEdit"
+ style="margin-bottom: 10px">鍙栨秷
</el-button>
- <el-form
- ref="form"
- :model="dataValue"
- >
- <el-table :data="dataValue.dataList" style="width: 100%">
- <el-table-column prop="productName" label="浜у搧" width="150"/>
- <el-table-column prop="model" label="瑙勬牸" width="150">
+ <el-form ref="form"
+ :model="dataValue">
+ <el-table :data="dataValue.dataList"
+ style="width: 100%">
+ <el-table-column prop="productName"
+ label="浜у搧"
+ width="150" />
+ <el-table-column prop="model"
+ label="瑙勬牸"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- v-if="dataValue.isEdit"
- :prop="`dataList.${$index}.model`"
- :rules="[{ required: true, message: '璇烽�夋嫨瑙勬牸', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-select
- v-model="row.model"
- placeholder="璇烽�夋嫨浜у搧"
- clearable
- :disabled="!dataValue.isEdit"
- style="width: 100%"
- @visible-change="(v) => { if (v) openDialog($index) }"
- >
- <el-option v-if="row.model" :label="row.model" :value="row.model" />
+ <el-form-item v-if="dataValue.isEdit"
+ :prop="`dataList.${$index}.model`"
+ :rules="[{ required: true, message: '璇烽�夋嫨瑙勬牸', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-select v-model="row.model"
+ placeholder="璇烽�夋嫨浜у搧"
+ clearable
+ :disabled="!dataValue.isEdit"
+ style="width: 100%"
+ @visible-change="(v) => { if (v) openDialog($index) }">
+ <el-option v-if="row.model"
+ :label="row.model"
+ :value="row.model" />
</el-select>
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="processId" label="娑堣�楀伐搴�" width="150">
+ <el-table-column prop="processId"
+ label="娑堣�楀伐搴�"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.processId`"
- :rules="[{ required: true, message: '璇烽�夋嫨娑堣�楀伐搴�', trigger: 'change' }]"
- style="margin: 0"
- >
- <el-select
- v-model="row.processId"
- placeholder="璇烽�夋嫨"
- filterable
- clearable
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- >
- <el-option
- v-for="item in dataValue.processOptions"
- :key="item.id"
- :label="item.name"
- :value="item.id"
- />
+ <el-form-item :prop="`dataList.${$index}.processId`"
+ :rules="[{ required: true, message: '璇烽�夋嫨娑堣�楀伐搴�', trigger: 'change' }]"
+ style="margin: 0">
+ <el-select v-model="row.processId"
+ placeholder="璇烽�夋嫨"
+ filterable
+ clearable
+ style="width: 100%"
+ :disabled="!dataValue.isEdit">
+ <el-option v-for="item in dataValue.processOptions"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id" />
</el-select>
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="unitQuantity" label="鍗曚綅浜у嚭鎵�闇�鏁伴噺" width="150">
+ <el-table-column prop="unitQuantity"
+ label="鍗曚綅浜у嚭鎵�闇�鏁伴噺"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.unitQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣嶄骇鍑烘墍闇�鏁伴噺', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.unitQuantity"
- :min="0"
- :precision="2"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.unitQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣嶄骇鍑烘墍闇�鏁伴噺', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.unitQuantity"
+ :min="0"
+ :precision="2"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="demandedQuantity" label="闇�姹傛�婚噺" width="150">
+ <el-table-column prop="demandedQuantity"
+ label="闇�姹傛�婚噺"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.demandedQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ラ渶姹傛�婚噺', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.demandedQuantity"
- :min="0"
- :precision="2"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.demandedQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ラ渶姹傛�婚噺', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.demandedQuantity"
+ :min="0"
+ :precision="2"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="unit" label="鍗曚綅" width="150">
+ <el-table-column prop="unit"
+ label="鍗曚綅"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.unit`"
- :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣�', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input
- v-model="row.unit"
- placeholder="璇疯緭鍏ュ崟浣�"
- clearable
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.unit`"
+ :rules="[{ required: true, message: '璇疯緭鍏ュ崟浣�', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input v-model="row.unit"
+ placeholder="璇疯緭鍏ュ崟浣�"
+ clearable
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
- <el-table-column prop="diskQuantity" label="鐩樻暟锛堢洏锛�" width="150">
+ <el-table-column prop="diskQuantity"
+ label="鐩樻暟锛堢洏锛�"
+ width="150">
<template #default="{ row, $index }">
- <el-form-item
- :prop="`dataList.${$index}.diskQuantity`"
- :rules="[{ required: true, message: '璇疯緭鍏ョ洏鏁�', trigger: ['blur','change'] }]"
- style="margin: 0"
- >
- <el-input-number
- v-model="row.diskQuantity"
- :min="0"
- :precision="0"
- :step="1"
- controls-position="right"
- style="width: 100%"
- :disabled="!dataValue.isEdit"
- />
+ <el-form-item :prop="`dataList.${$index}.diskQuantity`"
+ :rules="[{ required: true, message: '璇疯緭鍏ョ洏鏁�', trigger: ['blur','change'] }]"
+ style="margin: 0">
+ <el-input-number v-model="row.diskQuantity"
+ :min="0"
+ :precision="0"
+ :step="1"
+ controls-position="right"
+ style="width: 100%"
+ :disabled="!dataValue.isEdit" />
</el-form-item>
</template>
</el-table-column>
-
<el-table-column label="鎿嶄綔">
<template #default="{ row, $index }">
- <el-button
- type="danger"
- text
- @click="dataValue.dataList.splice($index, 1)"
- >鍒犻櫎
+ <el-button type="danger"
+ text
+ @click="dataValue.dataList.splice($index, 1)">鍒犻櫎
</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
-
- <product-select-dialog
- v-if="dataValue.showProductDialog"
- v-model:model-value="dataValue.showProductDialog"
- @confirm="handleProduct"/>
+ <product-select-dialog v-if="dataValue.showProductDialog"
+ v-model:model-value="dataValue.showProductDialog"
+ @confirm="handleProduct" />
<template #footer>
<div class="dialog-footer">
- <el-button @click="visible = false">鍙栨秷</el-button>
- <el-button type="primary" :loading="dataValue.loading" @click="submit" :disabled="!dataValue.isEdit">
+ <el-button type="primary"
+ :loading="dataValue.loading"
+ @click="submit"
+ :disabled="!dataValue.isEdit">
纭
</el-button>
+ <el-button @click="visible = false">鍙栨秷</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
-import {computed, defineAsyncComponent, defineComponent, onMounted, reactive, ref} from "vue";
-import {queryList, add} from '@/api/productionManagement/productStructure.js'
-import {list} from '@/api/productionManagement/productionProcess'
-import {ElMessage} from "element-plus";
+ import {
+ computed,
+ defineAsyncComponent,
+ defineComponent,
+ onMounted,
+ reactive,
+ ref,
+ } from "vue";
+ import { queryList, add } from "@/api/productionManagement/productStructure.js";
+ import { list } from "@/api/productionManagement/productionProcess";
+ import { ElMessage } from "element-plus";
+ defineComponent({
+ name: "StructureEdit",
+ });
-defineComponent({
- name: "StructureEdit",
-})
+ const ProductSelectDialog = defineAsyncComponent(
+ () => import("@/views/basicData/product/ProductSelectDialog.vue")
+ );
+ const form = ref();
-const ProductSelectDialog = defineAsyncComponent(() => import('@/views/basicData/product/ProductSelectDialog.vue'))
-const form = ref()
+ const props = defineProps({
+ showModel: {
+ type: Boolean,
+ default: false,
+ },
+ productModelId: {
+ type: Number,
+ required: true,
+ },
+ });
+ const emits = defineEmits(["update:showModel"]);
+ const visible = computed({
+ get() {
+ return props.showModel;
+ },
+ set(val) {
+ emits("update:showModel", val);
+ },
+ });
+ const dataValue = reactive({
+ dataList: [],
+ productOptions: [],
+ processOptions: [],
+ showProductDialog: false,
+ currentRowIndex: null,
+ loading: false,
+ isEdit: false,
+ });
-const props = defineProps({
- showModel: {
- type: Boolean,
- default: false
- },
- productModelId: {
- type: Number,
- required: true
- }
-})
+ const openDialog = index => {
+ dataValue.currentRowIndex = index;
+ dataValue.showProductDialog = true;
+ };
-const emits = defineEmits(['update:showModel'])
-const visible = computed({
- get() {
- return props.showModel
- },
- set(val) {
- emits('update:showModel', val)
- }
-})
+ const fetchData = async () => {
+ const { data } = await queryList(props.productModelId);
+ dataValue.dataList = data;
+ };
-const dataValue = reactive({
- dataList: [],
- productOptions: [],
- processOptions: [],
- showProductDialog: false,
- currentRowIndex: null,
- loading: false,
- isEdit: false,
-});
+ const fetchProcessOptions = async () => {
+ const { data } = await list(props.productModelId);
+ dataValue.processOptions = data;
+ };
-const openDialog = (index) => {
- dataValue.currentRowIndex = index
- dataValue.showProductDialog = true
-}
-
-const fetchData = async () => {
- const {data} = await queryList(props.productModelId)
- dataValue.dataList = data
-}
-
-const fetchProcessOptions = async () => {
- const {data} = await list(props.productModelId)
- dataValue.processOptions = data
-}
-
-const handleProduct = (row) => {
- if (row?.length > 1) {
- ElMessage.error('鍙兘閫夋嫨涓�涓骇鍝�')
- }
- dataValue.dataList[dataValue.currentRowIndex].productName = row[0].productName
- dataValue.dataList[dataValue.currentRowIndex].model = row[0].model
- dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id
- dataValue.showProductDialog = false
-}
-
-const submit = () => {
- form.value.validate(valid => {
- dataValue.loading = true
- if (valid) {
- add({
- parentId: props.productModelId,
- productStructureList: dataValue.dataList || []
- }).then(res => {
- ElMessage.success('淇濆瓨鎴愬姛')
- visible.value = false
- dataValue.loading = false
- })
+ const handleProduct = row => {
+ if (row?.length > 1) {
+ ElMessage.error("鍙兘閫夋嫨涓�涓骇鍝�");
}
- }).finally(() => {
- dataValue.loading = false
- })
-}
+ dataValue.dataList[dataValue.currentRowIndex].productName =
+ row[0].productName;
+ dataValue.dataList[dataValue.currentRowIndex].model = row[0].model;
+ dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id;
+ dataValue.showProductDialog = false;
+ };
-const addItem = () => {
- dataValue.dataList.push({
- productName: '',
- productId: '',
- model: undefined,
- productModelId: undefined,
- processId: '',
- unitQuantity: 0,
- demandedQuantity: 0,
- unit: '',
- diskQuantity: 0,
- })
-}
+ const submit = () => {
+ form.value
+ .validate(valid => {
+ dataValue.loading = true;
+ if (valid) {
+ add({
+ parentId: props.productModelId,
+ productStructureList: dataValue.dataList || [],
+ }).then(res => {
+ ElMessage.success("淇濆瓨鎴愬姛");
+ visible.value = false;
+ dataValue.loading = false;
+ });
+ }
+ })
+ .finally(() => {
+ dataValue.loading = false;
+ });
+ };
-const cancelEdit = () => {
- dataValue.isEdit = false
- dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined)
-}
+ const addItem = () => {
+ dataValue.dataList.push({
+ productName: "",
+ productId: "",
+ model: undefined,
+ productModelId: undefined,
+ processId: "",
+ unitQuantity: 0,
+ demandedQuantity: 0,
+ unit: "",
+ diskQuantity: 0,
+ });
+ };
-onMounted(() => {
- fetchData()
- fetchProcessOptions()
-})
+ const cancelEdit = () => {
+ dataValue.isEdit = false;
+ dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined);
+ };
-
+ onMounted(() => {
+ fetchData();
+ fetchProcessOptions();
+ });
</script>
\ No newline at end of file
diff --git a/src/views/productionManagement/workOrder/index.vue b/src/views/productionManagement/workOrder/index.vue
index a538c1d..d368de7 100644
--- a/src/views/productionManagement/workOrder/index.vue
+++ b/src/views/productionManagement/workOrder/index.vue
@@ -61,9 +61,9 @@
</el-form>
<template #footer>
<span class="dialog-footer">
- <el-button @click="editDialogVisible = false">鍙栨秷</el-button>
<el-button type="primary"
@click="handleUpdate">纭畾</el-button>
+ <el-button @click="editDialogVisible = false">鍙栨秷</el-button>
</span>
</template>
</el-dialog>
@@ -184,9 +184,9 @@
</el-form>
<template #footer>
<span class="dialog-footer">
- <el-button @click="reportDialogVisible = false">鍙栨秷</el-button>
<el-button type="primary"
@click="handleReport">纭畾</el-button>
+ <el-button @click="reportDialogVisible = false">鍙栨秷</el-button>
</span>
</template>
</el-dialog>
diff --git a/src/views/salesManagement/customerManagement/index.vue b/src/views/salesManagement/customerManagement/index.vue
index f66b5f4..d923156 100644
--- a/src/views/salesManagement/customerManagement/index.vue
+++ b/src/views/salesManagement/customerManagement/index.vue
@@ -2,156 +2,229 @@
<div class="app-container">
<el-card class="box-card">
<!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
+ <el-row :gutter="20"
+ class="search-row">
<el-col :span="6">
- <el-input
- v-model="searchForm.name"
- placeholder="璇疯緭鍏ュ鎴峰悕绉�"
- clearable
- @keyup.enter="handleSearch"
- >
+ <el-input v-model="searchForm.name"
+ placeholder="璇疯緭鍏ュ鎴峰悕绉�"
+ clearable
+ @keyup.enter="handleSearch">
<template #prefix>
- <el-icon><Search /></el-icon>
+ <el-icon>
+ <Search />
+ </el-icon>
</template>
</el-input>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.region" placeholder="璇烽�夋嫨鍖哄煙" clearable>
- <el-option label="鍗庝笢鍖�" value="鍗庝笢鍖�"></el-option>
- <el-option label="鍗庡崡鍖�" value="鍗庡崡鍖�"></el-option>
- <el-option label="鍗庡寳鍖�" value="鍗庡寳鍖�"></el-option>
- <el-option label="瑗垮崡鍖�" value="瑗垮崡鍖�"></el-option>
+ <el-select v-model="searchForm.region"
+ placeholder="璇烽�夋嫨鍖哄煙"
+ clearable>
+ <el-option label="鍗庝笢鍖�"
+ value="鍗庝笢鍖�"></el-option>
+ <el-option label="鍗庡崡鍖�"
+ value="鍗庡崡鍖�"></el-option>
+ <el-option label="鍗庡寳鍖�"
+ value="鍗庡寳鍖�"></el-option>
+ <el-option label="瑗垮崡鍖�"
+ value="瑗垮崡鍖�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.level" placeholder="璇烽�夋嫨瀹㈡埛绛夌骇" clearable>
- <el-option label="VIP瀹㈡埛" value="VIP瀹㈡埛"></el-option>
- <el-option label="閲嶈瀹㈡埛" value="閲嶈瀹㈡埛"></el-option>
- <el-option label="鏅�氬鎴�" value="鏅�氬鎴�"></el-option>
+ <el-select v-model="searchForm.level"
+ placeholder="璇烽�夋嫨瀹㈡埛绛夌骇"
+ clearable>
+ <el-option label="VIP瀹㈡埛"
+ value="VIP瀹㈡埛"></el-option>
+ <el-option label="閲嶈瀹㈡埛"
+ value="閲嶈瀹㈡埛"></el-option>
+ <el-option label="鏅�氬鎴�"
+ value="鏅�氬鎴�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button style="float: right;" type="primary" @click="handleAdd">
+ <el-button style="float: right;"
+ type="primary"
+ @click="handleAdd">
鏂板瀹㈡埛
</el-button>
</el-col>
</el-row>
-
<!-- 瀹㈡埛鍒楄〃 -->
- <el-table
- :data="filteredList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column prop="id" label="ID" width="80" align="center"/>
- <el-table-column prop="name" label="瀹㈡埛鍚嶇О" width="150" />
- <el-table-column prop="contactPerson" label="鑱旂郴浜�" width="100" />
- <el-table-column prop="phone" label="鑱旂郴鐢佃瘽" width="140" />
- <el-table-column prop="email" label="閭" />
- <el-table-column prop="region" label="鍖哄煙" width="100" />
- <el-table-column prop="level" label="瀹㈡埛绛夌骇" width="100">
+ <el-table :data="filteredList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column prop="id"
+ label="ID"
+ width="80"
+ align="center" />
+ <el-table-column prop="name"
+ label="瀹㈡埛鍚嶇О"
+ width="150" />
+ <el-table-column prop="contactPerson"
+ label="鑱旂郴浜�"
+ width="100" />
+ <el-table-column prop="phone"
+ label="鑱旂郴鐢佃瘽"
+ width="140" />
+ <el-table-column prop="email"
+ label="閭" />
+ <el-table-column prop="region"
+ label="鍖哄煙"
+ width="100" />
+ <el-table-column prop="level"
+ label="瀹㈡埛绛夌骇"
+ width="100">
<template #default="scope">
<el-tag :type="getLevelType(scope.row.level)">
{{ scope.row.level }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="salesperson" label="璐熻矗涓氬姟鍛�" width="120" />
- <el-table-column prop="status" label="鐘舵��" width="80">
+ <el-table-column prop="salesperson"
+ label="璐熻矗涓氬姟鍛�"
+ width="120" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="80">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="200" fixed="right" align="center">
+ <el-table-column label="鎿嶄綔"
+ width="200"
+ fixed="right"
+ align="center">
<template #default="scope">
- <el-button link type="primary" @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button link type="primary" @click="handleAllocation(scope.row)">鍒嗛厤</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)">鍒犻櫎</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)">缂栬緫</el-button>
+ <el-button link
+ type="primary"
+ @click="handleAllocation(scope.row)">鍒嗛厤</el-button>
+ <el-button link
+ type="danger"
+ @click="handleDelete(scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="pagination.total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.currentPage"
- :limit="pagination.pageSize"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="pagination.total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.currentPage"
+ :limit="pagination.pageSize"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="600px">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="瀹㈡埛鍚嶇О" prop="name">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ュ鎴峰悕绉�"></el-input>
+ <el-form-item label="瀹㈡埛鍚嶇О"
+ prop="name">
+ <el-input v-model="form.name"
+ placeholder="璇疯緭鍏ュ鎴峰悕绉�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鑱旂郴浜�" prop="contactPerson">
- <el-input v-model="form.contactPerson" placeholder="璇疯緭鍏ヨ仈绯讳汉"></el-input>
+ <el-form-item label="鑱旂郴浜�"
+ prop="contactPerson">
+ <el-input v-model="form.contactPerson"
+ placeholder="璇疯緭鍏ヨ仈绯讳汉"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鑱旂郴鐢佃瘽" prop="phone">
- <el-input v-model="form.phone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�"></el-input>
+ <el-form-item label="鑱旂郴鐢佃瘽"
+ prop="phone">
+ <el-input v-model="form.phone"
+ placeholder="璇疯緭鍏ヨ仈绯荤數璇�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="閭" prop="email">
- <el-input v-model="form.email" placeholder="璇疯緭鍏ラ偖绠�"></el-input>
+ <el-form-item label="閭"
+ prop="email">
+ <el-input v-model="form.email"
+ placeholder="璇疯緭鍏ラ偖绠�"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鍖哄煙" prop="region">
- <el-select v-model="form.region" placeholder="璇烽�夋嫨鍖哄煙" style="width: 100%">
- <el-option label="鍗庝笢鍖�" value="鍗庝笢鍖�"></el-option>
- <el-option label="鍗庡崡鍖�" value="鍗庡崡鍖�"></el-option>
- <el-option label="鍗庡寳鍖�" value="鍗庡寳鍖�"></el-option>
- <el-option label="瑗垮崡鍖�" value="瑗垮崡鍖�"></el-option>
+ <el-form-item label="鍖哄煙"
+ prop="region">
+ <el-select v-model="form.region"
+ placeholder="璇烽�夋嫨鍖哄煙"
+ style="width: 100%">
+ <el-option label="鍗庝笢鍖�"
+ value="鍗庝笢鍖�"></el-option>
+ <el-option label="鍗庡崡鍖�"
+ value="鍗庡崡鍖�"></el-option>
+ <el-option label="鍗庡寳鍖�"
+ value="鍗庡寳鍖�"></el-option>
+ <el-option label="瑗垮崡鍖�"
+ value="瑗垮崡鍖�"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="瀹㈡埛绛夌骇" prop="level">
- <el-select v-model="form.level" placeholder="璇烽�夋嫨瀹㈡埛绛夌骇" style="width: 100%">
- <el-option label="VIP瀹㈡埛" value="VIP瀹㈡埛"></el-option>
- <el-option label="閲嶈瀹㈡埛" value="閲嶈瀹㈡埛"></el-option>
- <el-option label="鏅�氬鎴�" value="鏅�氬鎴�"></el-option>
+ <el-form-item label="瀹㈡埛绛夌骇"
+ prop="level">
+ <el-select v-model="form.level"
+ placeholder="璇烽�夋嫨瀹㈡埛绛夌骇"
+ style="width: 100%">
+ <el-option label="VIP瀹㈡埛"
+ value="VIP瀹㈡埛"></el-option>
+ <el-option label="閲嶈瀹㈡埛"
+ value="閲嶈瀹㈡埛"></el-option>
+ <el-option label="鏅�氬鎴�"
+ value="鏅�氬鎴�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="璐熻矗涓氬姟鍛�" prop="salesperson">
- <el-select v-model="form.salesperson" placeholder="璇烽�夋嫨涓氬姟鍛�" style="width: 100%">
- <el-option label="闄堝織寮�" value="闄堝織寮�"></el-option>
- <el-option label="鍒橀泤濠�" value="鍒橀泤濠�"></el-option>
- <el-option label="鐜嬪缓鍥�" value="鐜嬪缓鍥�"></el-option>
+ <el-form-item label="璐熻矗涓氬姟鍛�"
+ prop="salesperson">
+ <el-select v-model="form.salesperson"
+ placeholder="璇烽�夋嫨涓氬姟鍛�"
+ style="width: 100%">
+ <el-option label="闄堝織寮�"
+ value="闄堝織寮�"></el-option>
+ <el-option label="鍒橀泤濠�"
+ value="鍒橀泤濠�"></el-option>
+ <el-option label="鐜嬪缓鍥�"
+ value="鐜嬪缓鍥�"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��" style="width: 100%">
- <el-option label="娲昏穬" value="娲昏穬"></el-option>
- <el-option label="娼滃湪" value="娼滃湪"></el-option>
- <el-option label="娴佸け" value="娴佸け"></el-option>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ style="width: 100%">
+ <el-option label="娲昏穬"
+ value="娲昏穬"></el-option>
+ <el-option label="娼滃湪"
+ value="娼滃湪"></el-option>
+ <el-option label="娴佸け"
+ value="娴佸け"></el-option>
</el-select>
</el-form-item>
</el-col>
@@ -159,14 +232,16 @@
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 瀹㈡埛鍒嗛厤瀵硅瘽妗� -->
- <el-dialog v-model="allocationDialogVisible" title="瀹㈡埛鍒嗛厤" width="500px">
+ <el-dialog v-model="allocationDialogVisible"
+ title="瀹㈡埛鍒嗛厤"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="瀹㈡埛鍚嶇О">
<span>{{ currentCustomer.name }}</span>
@@ -175,20 +250,29 @@
<span>{{ currentCustomer.salesperson }}</span>
</el-form-item>
<el-form-item label="閲嶆柊鍒嗛厤">
- <el-select v-model="newSalesperson" placeholder="璇烽�夋嫨鏂颁笟鍔″憳" style="width: 100%">
- <el-option label="闄堝織寮�" value="闄堝織寮�"></el-option>
- <el-option label="鍒橀泤濠�" value="鍒橀泤濠�"></el-option>
- <el-option label="鐜嬪缓鍥�" value="鐜嬪缓鍥�"></el-option>
+ <el-select v-model="newSalesperson"
+ placeholder="璇烽�夋嫨鏂颁笟鍔″憳"
+ style="width: 100%">
+ <el-option label="闄堝織寮�"
+ value="闄堝織寮�"></el-option>
+ <el-option label="鍒橀泤濠�"
+ value="鍒橀泤濠�"></el-option>
+ <el-option label="鐜嬪缓鍥�"
+ value="鐜嬪缓鍥�"></el-option>
</el-select>
</el-form-item>
<el-form-item label="鍒嗛厤鍘熷洜">
- <el-input v-model="allocationReason" type="textarea" rows="3" placeholder="璇疯緭鍏ュ垎閰嶅師鍥�"></el-input>
+ <el-input v-model="allocationReason"
+ type="textarea"
+ rows="3"
+ placeholder="璇疯緭鍏ュ垎閰嶅師鍥�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="saveAllocation">纭� 瀹�</el-button>
<el-button @click="allocationDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="saveAllocation">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
@@ -196,228 +280,232 @@
</template>
<script setup>
-import { ref, reactive, computed } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Search } from '@element-plus/icons-vue'
-import Pagination from '@/components/PIMTable/Pagination.vue'
+ import { ref, reactive, computed } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus, Search } from "@element-plus/icons-vue";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- name: '',
- region: '',
- level: ''
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ name: "",
+ region: "",
+ level: "",
+ });
-const customerList = ref([
- {
- id: 1,
- name: '涓婃捣绉戞妧鏈夐檺鍏徃',
- contactPerson: '闄堝織寮�',
- phone: '021-12345678',
- email: 'zhang@shanghai-tech.com',
- region: '鍗庝笢鍖�',
- level: 'VIP瀹㈡埛',
- salesperson: '闄堝織寮�',
- status: '娲昏穬'
- },
- {
- id: 2,
- name: '娣卞湷鐢靛瓙鏈夐檺鍏徃',
- contactPerson: '鍒橀泤濠�',
- phone: '0755-87654321',
- email: 'li@shenzhen-elec.com',
- region: '鍗庡崡鍖�',
- level: '閲嶈瀹㈡埛',
- salesperson: '鍒橀泤濠�',
- status: '娲昏穬'
- },
- {
- id: 3,
- name: '鍖椾含璐告槗鍏徃',
- contactPerson: '鐜嬪缓鍥�',
- phone: '010-11223344',
- email: 'wang@beijing-trade.com',
- region: '鍗庡寳鍖�',
- level: '鏅�氬鎴�',
- salesperson: '鐜嬪缓鍥�',
- status: '娼滃湪'
- }
-])
+ const customerList = ref([
+ {
+ id: 1,
+ name: "涓婃捣绉戞妧鏈夐檺鍏徃",
+ contactPerson: "闄堝織寮�",
+ phone: "021-12345678",
+ email: "zhang@shanghai-tech.com",
+ region: "鍗庝笢鍖�",
+ level: "VIP瀹㈡埛",
+ salesperson: "闄堝織寮�",
+ status: "娲昏穬",
+ },
+ {
+ id: 2,
+ name: "娣卞湷鐢靛瓙鏈夐檺鍏徃",
+ contactPerson: "鍒橀泤濠�",
+ phone: "0755-87654321",
+ email: "li@shenzhen-elec.com",
+ region: "鍗庡崡鍖�",
+ level: "閲嶈瀹㈡埛",
+ salesperson: "鍒橀泤濠�",
+ status: "娲昏穬",
+ },
+ {
+ id: 3,
+ name: "鍖椾含璐告槗鍏徃",
+ contactPerson: "鐜嬪缓鍥�",
+ phone: "010-11223344",
+ email: "wang@beijing-trade.com",
+ region: "鍗庡寳鍖�",
+ level: "鏅�氬鎴�",
+ salesperson: "鐜嬪缓鍥�",
+ status: "娼滃湪",
+ },
+ ]);
-const pagination = reactive({
- total: 3,
- currentPage: 1,
- pageSize: 10
-})
+ const pagination = reactive({
+ total: 3,
+ currentPage: 1,
+ pageSize: 10,
+ });
-const dialogVisible = ref(false)
-const dialogTitle = ref('鏂板瀹㈡埛')
-const form = reactive({
- name: '',
- contactPerson: '',
- phone: '',
- email: '',
- region: '',
- level: '',
- salesperson: '',
- status: '娲昏穬'
-})
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("鏂板瀹㈡埛");
+ const form = reactive({
+ name: "",
+ contactPerson: "",
+ phone: "",
+ email: "",
+ region: "",
+ level: "",
+ salesperson: "",
+ status: "娲昏穬",
+ });
-const rules = {
- name: [{ required: true, message: '璇疯緭鍏ュ鎴峰悕绉�', trigger: 'blur' }],
- contactPerson: [{ required: true, message: '璇疯緭鍏ヨ仈绯讳汉', trigger: 'blur' }],
- phone: [{ required: true, message: '璇疯緭鍏ヨ仈绯荤數璇�', trigger: 'blur' }],
- email: [{ required: true, message: '璇疯緭鍏ラ偖绠�', trigger: 'blur' }],
- region: [{ required: true, message: '璇烽�夋嫨鍖哄煙', trigger: 'change' }],
- level: [{ required: true, message: '璇烽�夋嫨瀹㈡埛绛夌骇', trigger: 'change' }],
- salesperson: [{ required: true, message: '璇烽�夋嫨涓氬姟鍛�', trigger: 'change' }],
- status: [{ required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }]
-}
+ const rules = {
+ name: [{ required: true, message: "璇疯緭鍏ュ鎴峰悕绉�", trigger: "blur" }],
+ contactPerson: [{ required: true, message: "璇疯緭鍏ヨ仈绯讳汉", trigger: "blur" }],
+ phone: [{ required: true, message: "璇疯緭鍏ヨ仈绯荤數璇�", trigger: "blur" }],
+ email: [{ required: true, message: "璇疯緭鍏ラ偖绠�", trigger: "blur" }],
+ region: [{ required: true, message: "璇烽�夋嫨鍖哄煙", trigger: "change" }],
+ level: [{ required: true, message: "璇烽�夋嫨瀹㈡埛绛夌骇", trigger: "change" }],
+ salesperson: [{ required: true, message: "璇烽�夋嫨涓氬姟鍛�", trigger: "change" }],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ };
-const isEdit = ref(false)
-const editId = ref(null)
-const allocationDialogVisible = ref(false)
-const currentCustomer = ref({})
-const newSalesperson = ref('')
-const allocationReason = ref('')
-const formRef = ref()
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const allocationDialogVisible = ref(false);
+ const currentCustomer = ref({});
+ const newSalesperson = ref("");
+ const allocationReason = ref("");
+ const formRef = ref();
-// 璁＄畻灞炴��
-const filteredList = computed(() => {
- let list = customerList.value
- if (searchForm.name) {
- list = list.filter(item => item.name.includes(searchForm.name))
- }
- if (searchForm.region) {
- list = list.filter(item => item.region === searchForm.region)
- }
- if (searchForm.level) {
- list = list.filter(item => item.level === searchForm.level)
- }
- return list
-})
-
-// 鏂规硶
-const getLevelType = (level) => {
- const levelMap = {
- 'VIP瀹㈡埛': 'danger',
- '閲嶈瀹㈡埛': 'warning',
- '鏅�氬鎴�': 'info'
- }
- return levelMap[level] || 'info'
-}
-
-const getStatusType = (status) => {
- const statusMap = {
- '娲昏穬': 'success',
- '娼滃湪': 'warning',
- '娴佸け': 'danger'
- }
- return statusMap[status] || 'info'
-}
-
-const handleSearch = () => {
- // 鎼滅储閫昏緫宸插湪computed涓鐞�
-}
-
-const resetSearch = () => {
- searchForm.name = ''
- searchForm.region = ''
- searchForm.level = ''
-}
-
-const handleAdd = () => {
- dialogTitle.value = '鏂板瀹㈡埛'
- isEdit.value = false
- form.name = ''
- form.contactPerson = ''
- form.phone = ''
- form.email = ''
- form.region = ''
- form.level = ''
- form.salesperson = ''
- form.status = '娲昏穬'
- dialogVisible.value = true
-}
-
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫瀹㈡埛'
- isEdit.value = true
- editId.value = row.id
- Object.assign(form, row)
- dialogVisible.value = true
-}
-
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ュ鎴峰悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const index = customerList.value.findIndex(item => item.id === row.id)
- if (index > -1) {
- customerList.value.splice(index, 1)
- pagination.total--
- ElMessage.success('鍒犻櫎鎴愬姛')
+ // 璁＄畻灞炴��
+ const filteredList = computed(() => {
+ let list = customerList.value;
+ if (searchForm.name) {
+ list = list.filter(item => item.name.includes(searchForm.name));
}
- })
-}
+ if (searchForm.region) {
+ list = list.filter(item => item.region === searchForm.region);
+ }
+ if (searchForm.level) {
+ list = list.filter(item => item.level === searchForm.level);
+ }
+ return list;
+ });
-const handleAllocation = (row) => {
- currentCustomer.value = row
- newSalesperson.value = ''
- allocationReason.value = ''
- allocationDialogVisible.value = true
-}
+ // 鏂规硶
+ const getLevelType = level => {
+ const levelMap = {
+ VIP瀹㈡埛: "danger",
+ 閲嶈瀹㈡埛: "warning",
+ 鏅�氬鎴�: "info",
+ };
+ return levelMap[level] || "info";
+ };
-const saveAllocation = () => {
- if (!newSalesperson.value) {
- ElMessage.warning('璇烽�夋嫨鏂颁笟鍔″憳')
- return
- }
-
- const index = customerList.value.findIndex(item => item.id === currentCustomer.value.id)
- if (index > -1) {
- customerList.value[index].salesperson = newSalesperson.value
- ElMessage.success('瀹㈡埛鍒嗛厤鎴愬姛')
- allocationDialogVisible.value = false
- }
-}
+ const getStatusType = status => {
+ const statusMap = {
+ 娲昏穬: "success",
+ 娼滃湪: "warning",
+ 娴佸け: "danger",
+ };
+ return statusMap[status] || "info";
+ };
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (isEdit.value) {
- // 缂栬緫
- const index = customerList.value.findIndex(item => item.id === editId.value)
- if (index > -1) {
- customerList.value[index] = { ...form, id: editId.value }
- ElMessage.success('缂栬緫鎴愬姛')
- }
- } else {
- // 鏂板
- const newId = Math.max(...customerList.value.map(item => item.id)) + 1
- customerList.value.push({
- ...form,
- id: newId
- })
- pagination.total++
- ElMessage.success('鏂板鎴愬姛')
+ const handleSearch = () => {
+ // 鎼滅储閫昏緫宸插湪computed涓鐞�
+ };
+
+ const resetSearch = () => {
+ searchForm.name = "";
+ searchForm.region = "";
+ searchForm.level = "";
+ };
+
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板瀹㈡埛";
+ isEdit.value = false;
+ form.name = "";
+ form.contactPerson = "";
+ form.phone = "";
+ form.email = "";
+ form.region = "";
+ form.level = "";
+ form.salesperson = "";
+ form.status = "娲昏穬";
+ dialogVisible.value = true;
+ };
+
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫瀹㈡埛";
+ isEdit.value = true;
+ editId.value = row.id;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
+
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ュ鎴峰悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ const index = customerList.value.findIndex(item => item.id === row.id);
+ if (index > -1) {
+ customerList.value.splice(index, 1);
+ pagination.total--;
+ ElMessage.success("鍒犻櫎鎴愬姛");
}
- dialogVisible.value = false
- }
- })
-}
+ });
+ };
-const handleCurrentChange = (val) => {
- pagination.currentPage = val.page
- pagination.pageSize = val.limit
-}
+ const handleAllocation = row => {
+ currentCustomer.value = row;
+ newSalesperson.value = "";
+ allocationReason.value = "";
+ allocationDialogVisible.value = true;
+ };
+
+ const saveAllocation = () => {
+ if (!newSalesperson.value) {
+ ElMessage.warning("璇烽�夋嫨鏂颁笟鍔″憳");
+ return;
+ }
+
+ const index = customerList.value.findIndex(
+ item => item.id === currentCustomer.value.id
+ );
+ if (index > -1) {
+ customerList.value[index].salesperson = newSalesperson.value;
+ ElMessage.success("瀹㈡埛鍒嗛厤鎴愬姛");
+ allocationDialogVisible.value = false;
+ }
+ };
+
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (isEdit.value) {
+ // 缂栬緫
+ const index = customerList.value.findIndex(
+ item => item.id === editId.value
+ );
+ if (index > -1) {
+ customerList.value[index] = { ...form, id: editId.value };
+ ElMessage.success("缂栬緫鎴愬姛");
+ }
+ } else {
+ // 鏂板
+ const newId = Math.max(...customerList.value.map(item => item.id)) + 1;
+ customerList.value.push({
+ ...form,
+ id: newId,
+ });
+ pagination.total++;
+ ElMessage.success("鏂板鎴愬姛");
+ }
+ dialogVisible.value = false;
+ }
+ });
+ };
+
+ const handleCurrentChange = val => {
+ pagination.currentPage = val.page;
+ pagination.pageSize = val.limit;
+ };
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/salesManagement/orderManagement/index.vue b/src/views/salesManagement/orderManagement/index.vue
index 90bdd67..a5e59d3 100644
--- a/src/views/salesManagement/orderManagement/index.vue
+++ b/src/views/salesManagement/orderManagement/index.vue
@@ -2,164 +2,238 @@
<div class="app-container">
<el-card class="box-card">
<!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
+ <el-row :gutter="20"
+ class="search-row">
<el-col :span="6">
- <el-input
- v-model="searchForm.orderNo"
- placeholder="璇疯緭鍏ヨ鍗曞彿"
- clearable
- @keyup.enter="handleSearch"
- >
+ <el-input v-model="searchForm.orderNo"
+ placeholder="璇疯緭鍏ヨ鍗曞彿"
+ clearable
+ @keyup.enter="handleSearch">
<template #prefix>
- <el-icon><Search /></el-icon>
+ <el-icon>
+ <Search />
+ </el-icon>
</template>
</el-input>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.customer" placeholder="璇烽�夋嫨瀹㈡埛" clearable>
- <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃" value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
- <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃" value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
- <el-option label="鍖椾含璐告槗鍏徃" value="鍖椾含璐告槗鍏徃"></el-option>
+ <el-select v-model="searchForm.customer"
+ placeholder="璇烽�夋嫨瀹㈡埛"
+ clearable>
+ <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃"
+ value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
+ <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃"
+ value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
+ <el-option label="鍖椾含璐告槗鍏徃"
+ value="鍖椾含璐告槗鍏徃"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨璁㈠崟鐘舵��" clearable>
- <el-option label="寰呭鏍�" value="寰呭鏍�"></el-option>
- <el-option label="宸插鏍�" value="宸插鏍�"></el-option>
- <el-option label="宸插彂璐�" value="宸插彂璐�"></el-option>
- <el-option label="宸插畬鎴�" value="宸插畬鎴�"></el-option>
- <el-option label="宸插彇娑�" value="宸插彇娑�"></el-option>
+ <el-select v-model="searchForm.status"
+ placeholder="璇烽�夋嫨璁㈠崟鐘舵��"
+ clearable>
+ <el-option label="寰呭鏍�"
+ value="寰呭鏍�"></el-option>
+ <el-option label="宸插鏍�"
+ value="宸插鏍�"></el-option>
+ <el-option label="宸插彂璐�"
+ value="宸插彂璐�"></el-option>
+ <el-option label="宸插畬鎴�"
+ value="宸插畬鎴�"></el-option>
+ <el-option label="宸插彇娑�"
+ value="宸插彇娑�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button style="float: right;" type="primary" @click="handleAdd">
+ <el-button style="float: right;"
+ type="primary"
+ @click="handleAdd">
鏂板璁㈠崟
</el-button>
</el-col>
</el-row>
-
<!-- 璁㈠崟鍒楄〃 -->
- <el-table
- :data="filteredList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column prop="id" label="ID" width="80" align="center"/>
- <el-table-column prop="orderNo" label="璁㈠崟鍙�" width="150" />
- <el-table-column prop="customer" label="瀹㈡埛鍚嶇О" />
- <el-table-column prop="salesperson" label="涓氬姟鍛�" width="100" />
- <el-table-column prop="orderDate" label="涓嬪崟鏃ユ湡" width="120" />
- <el-table-column prop="amount" label="璁㈠崟閲戦" width="120">
+ <el-table :data="filteredList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column prop="id"
+ label="ID"
+ width="80"
+ align="center" />
+ <el-table-column prop="orderNo"
+ label="璁㈠崟鍙�"
+ width="150" />
+ <el-table-column prop="customer"
+ label="瀹㈡埛鍚嶇О" />
+ <el-table-column prop="salesperson"
+ label="涓氬姟鍛�"
+ width="100" />
+ <el-table-column prop="orderDate"
+ label="涓嬪崟鏃ユ湡"
+ width="120" />
+ <el-table-column prop="amount"
+ label="璁㈠崟閲戦"
+ width="120">
<template #default="scope">
楼{{ scope.row.amount.toFixed(2) }}
</template>
</el-table-column>
- <el-table-column prop="status" label="璁㈠崟鐘舵��" width="100">
+ <el-table-column prop="status"
+ label="璁㈠崟鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="250" fixed="right" align="center">
+ <el-table-column label="鎿嶄綔"
+ width="250"
+ fixed="right"
+ align="center">
<template #default="scope">
- <el-button link type="primary" @click="handleView(scope.row)">鏌ョ湅</el-button>
- <el-button link type="primary" @click="handleEdit(scope.row)" v-if="scope.row.status === '寰呭鏍�'">缂栬緫</el-button>
- <el-button link type="primary" @click="handleReview(scope.row)" v-if="scope.row.status === '寰呭鏍�'">瀹℃牳</el-button>
- <el-button link type="primary" @click="handleTransfer(scope.row)" v-if="scope.row.status === '宸插鏍�'">杞崟</el-button>
- <el-button link type="danger" @click="handleCancel(scope.row)" v-if="scope.row.status === '寰呭鏍�'">鍙栨秷</el-button>
+ <el-button link
+ type="primary"
+ @click="handleView(scope.row)">鏌ョ湅</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)"
+ v-if="scope.row.status === '寰呭鏍�'">缂栬緫</el-button>
+ <el-button link
+ type="primary"
+ @click="handleReview(scope.row)"
+ v-if="scope.row.status === '寰呭鏍�'">瀹℃牳</el-button>
+ <el-button link
+ type="primary"
+ @click="handleTransfer(scope.row)"
+ v-if="scope.row.status === '宸插鏍�'">杞崟</el-button>
+ <el-button link
+ type="danger"
+ @click="handleCancel(scope.row)"
+ v-if="scope.row.status === '寰呭鏍�'">鍙栨秷</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="pagination.total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.currentPage"
- :limit="pagination.pageSize"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="pagination.total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.currentPage"
+ :limit="pagination.pageSize"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="700px">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="700px">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="瀹㈡埛鍚嶇О" prop="customer">
- <el-select v-model="form.customer" placeholder="璇烽�夋嫨瀹㈡埛" style="width: 100%">
- <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃" value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
- <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃" value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
- <el-option label="鍖椾含璐告槗鍏徃" value="鍖椾含璐告槗鍏徃"></el-option>
+ <el-form-item label="瀹㈡埛鍚嶇О"
+ prop="customer">
+ <el-select v-model="form.customer"
+ placeholder="璇烽�夋嫨瀹㈡埛"
+ style="width: 100%">
+ <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃"
+ value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
+ <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃"
+ value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
+ <el-option label="鍖椾含璐告槗鍏徃"
+ value="鍖椾含璐告槗鍏徃"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="涓氬姟鍛�" prop="salesperson">
- <el-select v-model="form.salesperson" placeholder="璇烽�夋嫨涓氬姟鍛�" style="width: 100%">
- <el-option label="闄堝織寮�" value="闄堝織寮�"></el-option>
- <el-option label="鍒橀泤濠�" value="鍒橀泤濠�"></el-option>
- <el-option label="鐜嬪缓鍥�" value="鐜嬪缓鍥�"></el-option>
+ <el-form-item label="涓氬姟鍛�"
+ prop="salesperson">
+ <el-select v-model="form.salesperson"
+ placeholder="璇烽�夋嫨涓氬姟鍛�"
+ style="width: 100%">
+ <el-option label="闄堝織寮�"
+ value="闄堝織寮�"></el-option>
+ <el-option label="鍒橀泤濠�"
+ value="鍒橀泤濠�"></el-option>
+ <el-option label="鐜嬪缓鍥�"
+ value="鐜嬪缓鍥�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="璁㈠崟鏃ユ湡" prop="orderDate">
- <el-date-picker
- v-model="form.orderDate"
- type="date"
- placeholder="閫夋嫨璁㈠崟鏃ユ湡"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="璁㈠崟鏃ユ湡"
+ prop="orderDate">
+ <el-date-picker v-model="form.orderDate"
+ type="date"
+ placeholder="閫夋嫨璁㈠崟鏃ユ湡"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="璁㈠崟閲戦" prop="amount">
- <el-input-number v-model="form.amount" :precision="2" :min="0" style="width: 100%"></el-input-number>
+ <el-form-item label="璁㈠崟閲戦"
+ prop="amount">
+ <el-input-number v-model="form.amount"
+ :precision="2"
+ :min="0"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="璁㈠崟鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��" style="width: 100%">
- <el-option label="寰呭鏍�" value="寰呭鏍�"></el-option>
- <el-option label="宸插鏍�" value="宸插鏍�"></el-option>
- <el-option label="宸插彂璐�" value="宸插彂璐�"></el-option>
- <el-option label="宸插畬鎴�" value="宸插畬鎴�"></el-option>
- <el-option label="宸插彇娑�" value="宸插彇娑�"></el-option>
+ <el-form-item label="璁㈠崟鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ style="width: 100%">
+ <el-option label="寰呭鏍�"
+ value="寰呭鏍�"></el-option>
+ <el-option label="宸插鏍�"
+ value="宸插鏍�"></el-option>
+ <el-option label="宸插彂璐�"
+ value="宸插彂璐�"></el-option>
+ <el-option label="宸插畬鎴�"
+ value="宸插畬鎴�"></el-option>
+ <el-option label="宸插彇娑�"
+ value="宸插彇娑�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
- <el-form-item label="澶囨敞" prop="remark">
- <el-input type="textarea" v-model="form.remark" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" rows="3"></el-input>
+ <el-form-item label="澶囨敞"
+ prop="remark">
+ <el-input type="textarea"
+ v-model="form.remark"
+ placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
+ rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 璁㈠崟瀹℃牳瀵硅瘽妗� -->
- <el-dialog v-model="reviewDialogVisible" title="璁㈠崟瀹℃牳" width="500px">
+ <el-dialog v-model="reviewDialogVisible"
+ title="璁㈠崟瀹℃牳"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="璁㈠崟鍙�">
<span>{{ currentOrder.orderNo }}</span>
@@ -170,26 +244,33 @@
<el-form-item label="璁㈠崟閲戦">
<span>楼{{ currentOrder.amount.toFixed(2) }}</span>
</el-form-item>
- <el-form-item label="瀹℃牳缁撴灉" prop="reviewResult">
+ <el-form-item label="瀹℃牳缁撴灉"
+ prop="reviewResult">
<el-radio-group v-model="reviewResult">
<el-radio label="閫氳繃">閫氳繃</el-radio>
<el-radio label="鎷掔粷">鎷掔粷</el-radio>
</el-radio-group>
</el-form-item>
- <el-form-item label="瀹℃牳鎰忚" prop="reviewComment">
- <el-input type="textarea" v-model="reviewComment" rows="3" placeholder="璇疯緭鍏ュ鏍告剰瑙�"></el-input>
+ <el-form-item label="瀹℃牳鎰忚"
+ prop="reviewComment">
+ <el-input type="textarea"
+ v-model="reviewComment"
+ rows="3"
+ placeholder="璇疯緭鍏ュ鏍告剰瑙�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="saveReview">纭� 瀹�</el-button>
<el-button @click="reviewDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="saveReview">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 璁㈠崟杞崟瀵硅瘽妗� -->
- <el-dialog v-model="transferDialogVisible" title="璁㈠崟杞崟" width="500px">
+ <el-dialog v-model="transferDialogVisible"
+ title="璁㈠崟杞崟"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="璁㈠崟鍙�">
<span>{{ currentOrder.orderNo }}</span>
@@ -197,21 +278,32 @@
<el-form-item label="褰撳墠涓氬姟鍛�">
<span>{{ currentOrder.salesperson }}</span>
</el-form-item>
- <el-form-item label="杞崟缁�" prop="newSalesperson">
- <el-select v-model="newSalesperson" placeholder="璇烽�夋嫨鏂颁笟鍔″憳" style="width: 100%">
- <el-option label="闄堝織寮�" value="闄堝織寮�"></el-option>
- <el-option label="鍒橀泤濠�" value="鍒橀泤濠�"></el-option>
- <el-option label="鐜嬪缓鍥�" value="鐜嬪缓鍥�"></el-option>
+ <el-form-item label="杞崟缁�"
+ prop="newSalesperson">
+ <el-select v-model="newSalesperson"
+ placeholder="璇烽�夋嫨鏂颁笟鍔″憳"
+ style="width: 100%">
+ <el-option label="闄堝織寮�"
+ value="闄堝織寮�"></el-option>
+ <el-option label="鍒橀泤濠�"
+ value="鍒橀泤濠�"></el-option>
+ <el-option label="鐜嬪缓鍥�"
+ value="鐜嬪缓鍥�"></el-option>
</el-select>
</el-form-item>
- <el-form-item label="杞崟鍘熷洜" prop="transferReason">
- <el-input type="textarea" v-model="transferReason" rows="3" placeholder="璇疯緭鍏ヨ浆鍗曞師鍥�"></el-input>
+ <el-form-item label="杞崟鍘熷洜"
+ prop="transferReason">
+ <el-input type="textarea"
+ v-model="transferReason"
+ rows="3"
+ placeholder="璇疯緭鍏ヨ浆鍗曞師鍥�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="saveTransfer">纭� 瀹�</el-button>
<el-button @click="transferDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="saveTransfer">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
@@ -219,261 +311,272 @@
</template>
<script setup>
-import { ref, reactive, computed } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Search } from '@element-plus/icons-vue'
-import Pagination from '@/components/PIMTable/Pagination.vue'
+ import { ref, reactive, computed } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus, Search } from "@element-plus/icons-vue";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- orderNo: '',
- customer: '',
- status: ''
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ orderNo: "",
+ customer: "",
+ status: "",
+ });
-const orderList = ref([
- {
- id: 1,
- orderNo: 'ORD202312001',
- customer: '骞垮窞绉戞妧鍏徃',
- salesperson: '寮犱笁',
- orderDate: '2023-12-01',
- amount: 50000.00,
- status: '寰呭鏍�',
- remark: '閲嶈瀹㈡埛璁㈠崟'
- },
- {
- id: 2,
- orderNo: 'ORD202312002',
- customer: '娣卞湷鐢靛瓙鏈夐檺鍏徃',
- salesperson: '鍒橀泤濠�',
- orderDate: '2023-12-02',
- amount: 35000.00,
- status: '宸插鏍�',
- remark: '甯歌璁㈠崟'
- },
- {
- id: 3,
- orderNo: 'ORD202312003',
- customer: '鍖椾含璐告槗鍏徃',
- salesperson: '鐜嬪缓鍥�',
- orderDate: '2023-12-03',
- amount: 28000.00,
- status: '宸插彂璐�',
- remark: '鏂板鎴疯鍗�'
- }
-])
+ const orderList = ref([
+ {
+ id: 1,
+ orderNo: "ORD202312001",
+ customer: "骞垮窞绉戞妧鍏徃",
+ salesperson: "寮犱笁",
+ orderDate: "2023-12-01",
+ amount: 50000.0,
+ status: "寰呭鏍�",
+ remark: "閲嶈瀹㈡埛璁㈠崟",
+ },
+ {
+ id: 2,
+ orderNo: "ORD202312002",
+ customer: "娣卞湷鐢靛瓙鏈夐檺鍏徃",
+ salesperson: "鍒橀泤濠�",
+ orderDate: "2023-12-02",
+ amount: 35000.0,
+ status: "宸插鏍�",
+ remark: "甯歌璁㈠崟",
+ },
+ {
+ id: 3,
+ orderNo: "ORD202312003",
+ customer: "鍖椾含璐告槗鍏徃",
+ salesperson: "鐜嬪缓鍥�",
+ orderDate: "2023-12-03",
+ amount: 28000.0,
+ status: "宸插彂璐�",
+ remark: "鏂板鎴疯鍗�",
+ },
+ ]);
-const pagination = reactive({
- total: 3,
- currentPage: 1,
- pageSize: 10
-})
+ const pagination = reactive({
+ total: 3,
+ currentPage: 1,
+ pageSize: 10,
+ });
-const dialogVisible = ref(false)
-const dialogTitle = ref('鏂板璁㈠崟')
-const form = reactive({
- customer: '',
- salesperson: '',
- orderDate: '',
- amount: 0,
- status: '寰呭鏍�',
- remark: ''
-})
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("鏂板璁㈠崟");
+ const form = reactive({
+ customer: "",
+ salesperson: "",
+ orderDate: "",
+ amount: 0,
+ status: "寰呭鏍�",
+ remark: "",
+ });
-const rules = {
- customer: [{ required: true, message: '璇烽�夋嫨瀹㈡埛', trigger: 'change' }],
- salesperson: [{ required: true, message: '璇烽�夋嫨涓氬姟鍛�', trigger: 'change' }],
- orderDate: [{ required: true, message: '璇烽�夋嫨璁㈠崟鏃ユ湡', trigger: 'change' }],
- amount: [{ required: true, message: '璇疯緭鍏ヨ鍗曢噾棰�', trigger: 'blur' }],
- status: [{ required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }]
-}
+ const rules = {
+ customer: [{ required: true, message: "璇烽�夋嫨瀹㈡埛", trigger: "change" }],
+ salesperson: [{ required: true, message: "璇烽�夋嫨涓氬姟鍛�", trigger: "change" }],
+ orderDate: [{ required: true, message: "璇烽�夋嫨璁㈠崟鏃ユ湡", trigger: "change" }],
+ amount: [{ required: true, message: "璇疯緭鍏ヨ鍗曢噾棰�", trigger: "blur" }],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ };
-const isEdit = ref(false)
-const editId = ref(null)
-const reviewDialogVisible = ref(false)
-const transferDialogVisible = ref(false)
-const currentOrder = ref({})
-const reviewResult = ref('')
-const reviewComment = ref('')
-const newSalesperson = ref('')
-const transferReason = ref('')
-const formRef = ref()
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const reviewDialogVisible = ref(false);
+ const transferDialogVisible = ref(false);
+ const currentOrder = ref({});
+ const reviewResult = ref("");
+ const reviewComment = ref("");
+ const newSalesperson = ref("");
+ const transferReason = ref("");
+ const formRef = ref();
-// 璁＄畻灞炴��
-const filteredList = computed(() => {
- let list = orderList.value
- if (searchForm.orderNo) {
- list = list.filter(item => item.orderNo.includes(searchForm.orderNo))
- }
- if (searchForm.customer) {
- list = list.filter(item => item.customer === searchForm.customer)
- }
- if (searchForm.status) {
- list = list.filter(item => item.status === searchForm.status)
- }
- return list
-})
-
-// 鏂规硶
-const getStatusType = (status) => {
- const statusMap = {
- '寰呭鏍�': 'warning',
- '宸插鏍�': 'primary',
- '宸插彂璐�': 'success',
- '宸插畬鎴�': 'success',
- '宸插彇娑�': 'danger'
- }
- return statusMap[status] || 'info'
-}
-
-const handleSearch = () => {
- // 鎼滅储閫昏緫宸插湪computed涓鐞�
-}
-
-const resetSearch = () => {
- searchForm.orderNo = ''
- searchForm.customer = ''
- searchForm.status = ''
-}
-
-const handleAdd = () => {
- dialogTitle.value = '鏂板璁㈠崟'
- isEdit.value = false
- form.customer = ''
- form.salesperson = ''
- form.orderDate = ''
- form.amount = 0
- form.status = '寰呭鏍�'
- form.remark = ''
- dialogVisible.value = true
-}
-
-const handleView = (row) => {
- // 鏌ョ湅璁㈠崟璇︽儏
- ElMessage.info('鏌ョ湅璁㈠崟璇︽儏鍔熻兘寰呭疄鐜�')
-}
-
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫璁㈠崟'
- isEdit.value = true
- editId.value = row.id
- Object.assign(form, row)
- dialogVisible.value = true
-}
-
-const handleReview = (row) => {
- currentOrder.value = row
- reviewResult.value = ''
- reviewComment.value = ''
- reviewDialogVisible.value = true
-}
-
-const handleTransfer = (row) => {
- currentOrder.value = row
- newSalesperson.value = ''
- transferReason.value = ''
- transferDialogVisible.value = true
-}
-
-const handleCancel = (row) => {
- ElMessageBox.confirm('纭鍙栨秷璇ヨ鍗曞悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const index = orderList.value.findIndex(item => item.id === row.id)
- if (index > -1) {
- orderList.value[index].status = '宸插彇娑�'
- ElMessage.success('璁㈠崟宸插彇娑�')
+ // 璁＄畻灞炴��
+ const filteredList = computed(() => {
+ let list = orderList.value;
+ if (searchForm.orderNo) {
+ list = list.filter(item => item.orderNo.includes(searchForm.orderNo));
}
- })
-}
-
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ヨ鍗曞悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const index = orderList.value.findIndex(item => item.id === row.id)
- if (index > -1) {
- orderList.value.splice(index, 1)
- pagination.total--
- ElMessage.success('鍒犻櫎鎴愬姛')
+ if (searchForm.customer) {
+ list = list.filter(item => item.customer === searchForm.customer);
}
- })
-}
-
-const saveReview = () => {
- if (!reviewResult.value) {
- ElMessage.warning('璇烽�夋嫨瀹℃牳缁撴灉')
- return
- }
-
- const index = orderList.value.findIndex(item => item.id === currentOrder.value.id)
- if (index > -1) {
- if (reviewResult.value === '閫氳繃') {
- orderList.value[index].status = '宸插鏍�'
- ElMessage.success('璁㈠崟瀹℃牳閫氳繃')
- } else {
- orderList.value[index].status = '宸插彇娑�'
- ElMessage.success('璁㈠崟瀹℃牳鎷掔粷')
+ if (searchForm.status) {
+ list = list.filter(item => item.status === searchForm.status);
}
- reviewDialogVisible.value = false
- }
-}
+ return list;
+ });
-const saveTransfer = () => {
- if (!newSalesperson.value) {
- ElMessage.warning('璇烽�夋嫨鏂颁笟鍔″憳')
- return
- }
-
- const index = orderList.value.findIndex(item => item.id === currentOrder.value.id)
- if (index > -1) {
- orderList.value[index].salesperson = newSalesperson.value
- ElMessage.success('璁㈠崟杞崟鎴愬姛')
- transferDialogVisible.value = false
- }
-}
+ // 鏂规硶
+ const getStatusType = status => {
+ const statusMap = {
+ 寰呭鏍�: "warning",
+ 宸插鏍�: "primary",
+ 宸插彂璐�: "success",
+ 宸插畬鎴�: "success",
+ 宸插彇娑�: "danger",
+ };
+ return statusMap[status] || "info";
+ };
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (isEdit.value) {
- // 缂栬緫
- const index = orderList.value.findIndex(item => item.id === editId.value)
- if (index > -1) {
- orderList.value[index] = { ...form, id: editId.value }
- ElMessage.success('缂栬緫鎴愬姛')
- }
- } else {
- // 鏂板
- const newId = Math.max(...orderList.value.map(item => item.id)) + 1
- const orderNo = `ORD${new Date().getFullYear()}${String(new Date().getMonth() + 1).padStart(2, '0')}${String(new Date().getDate()).padStart(2, '0')}${String(newId).padStart(3, '0')}`
- orderList.value.push({
- ...form,
- id: newId,
- orderNo: orderNo
- })
- pagination.total++
- ElMessage.success('鏂板鎴愬姛')
+ const handleSearch = () => {
+ // 鎼滅储閫昏緫宸插湪computed涓鐞�
+ };
+
+ const resetSearch = () => {
+ searchForm.orderNo = "";
+ searchForm.customer = "";
+ searchForm.status = "";
+ };
+
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板璁㈠崟";
+ isEdit.value = false;
+ form.customer = "";
+ form.salesperson = "";
+ form.orderDate = "";
+ form.amount = 0;
+ form.status = "寰呭鏍�";
+ form.remark = "";
+ dialogVisible.value = true;
+ };
+
+ const handleView = row => {
+ // 鏌ョ湅璁㈠崟璇︽儏
+ ElMessage.info("鏌ョ湅璁㈠崟璇︽儏鍔熻兘寰呭疄鐜�");
+ };
+
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫璁㈠崟";
+ isEdit.value = true;
+ editId.value = row.id;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
+
+ const handleReview = row => {
+ currentOrder.value = row;
+ reviewResult.value = "";
+ reviewComment.value = "";
+ reviewDialogVisible.value = true;
+ };
+
+ const handleTransfer = row => {
+ currentOrder.value = row;
+ newSalesperson.value = "";
+ transferReason.value = "";
+ transferDialogVisible.value = true;
+ };
+
+ const handleCancel = row => {
+ ElMessageBox.confirm("纭鍙栨秷璇ヨ鍗曞悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ const index = orderList.value.findIndex(item => item.id === row.id);
+ if (index > -1) {
+ orderList.value[index].status = "宸插彇娑�";
+ ElMessage.success("璁㈠崟宸插彇娑�");
}
- dialogVisible.value = false
- }
- })
-}
+ });
+ };
-const handleCurrentChange = (val) => {
- pagination.currentPage = val.page
- pagination.pageSize = val.limit
-}
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ヨ鍗曞悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ const index = orderList.value.findIndex(item => item.id === row.id);
+ if (index > -1) {
+ orderList.value.splice(index, 1);
+ pagination.total--;
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ }
+ });
+ };
+
+ const saveReview = () => {
+ if (!reviewResult.value) {
+ ElMessage.warning("璇烽�夋嫨瀹℃牳缁撴灉");
+ return;
+ }
+
+ const index = orderList.value.findIndex(
+ item => item.id === currentOrder.value.id
+ );
+ if (index > -1) {
+ if (reviewResult.value === "閫氳繃") {
+ orderList.value[index].status = "宸插鏍�";
+ ElMessage.success("璁㈠崟瀹℃牳閫氳繃");
+ } else {
+ orderList.value[index].status = "宸插彇娑�";
+ ElMessage.success("璁㈠崟瀹℃牳鎷掔粷");
+ }
+ reviewDialogVisible.value = false;
+ }
+ };
+
+ const saveTransfer = () => {
+ if (!newSalesperson.value) {
+ ElMessage.warning("璇烽�夋嫨鏂颁笟鍔″憳");
+ return;
+ }
+
+ const index = orderList.value.findIndex(
+ item => item.id === currentOrder.value.id
+ );
+ if (index > -1) {
+ orderList.value[index].salesperson = newSalesperson.value;
+ ElMessage.success("璁㈠崟杞崟鎴愬姛");
+ transferDialogVisible.value = false;
+ }
+ };
+
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (isEdit.value) {
+ // 缂栬緫
+ const index = orderList.value.findIndex(
+ item => item.id === editId.value
+ );
+ if (index > -1) {
+ orderList.value[index] = { ...form, id: editId.value };
+ ElMessage.success("缂栬緫鎴愬姛");
+ }
+ } else {
+ // 鏂板
+ const newId = Math.max(...orderList.value.map(item => item.id)) + 1;
+ const orderNo = `ORD${new Date().getFullYear()}${String(
+ new Date().getMonth() + 1
+ ).padStart(2, "0")}${String(new Date().getDate()).padStart(
+ 2,
+ "0"
+ )}${String(newId).padStart(3, "0")}`;
+ orderList.value.push({
+ ...form,
+ id: newId,
+ orderNo: orderNo,
+ });
+ pagination.total++;
+ ElMessage.success("鏂板鎴愬姛");
+ }
+ dialogVisible.value = false;
+ }
+ });
+ };
+
+ const handleCurrentChange = val => {
+ pagination.currentPage = val.page;
+ pagination.pageSize = val.limit;
+ };
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/salesManagement/paymentShipping/index.vue b/src/views/salesManagement/paymentShipping/index.vue
index 31dcf55..e545eb3 100644
--- a/src/views/salesManagement/paymentShipping/index.vue
+++ b/src/views/salesManagement/paymentShipping/index.vue
@@ -2,183 +2,255 @@
<div class="app-container">
<el-card class="box-card">
<!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
+ <el-row :gutter="20"
+ class="search-row">
<el-col :span="6">
- <el-input
- v-model="searchForm.orderNo"
- placeholder="璇疯緭鍏ヨ鍗曞彿"
- clearable
- @keyup.enter="handleSearch"
- >
+ <el-input v-model="searchForm.orderNo"
+ placeholder="璇疯緭鍏ヨ鍗曞彿"
+ clearable
+ @keyup.enter="handleSearch">
<template #prefix>
- <el-icon><Search /></el-icon>
+ <el-icon>
+ <Search />
+ </el-icon>
</template>
</el-input>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.paymentStatus" placeholder="璇烽�夋嫨浠樻鐘舵��" clearable>
- <el-option label="鏈粯娆�" value="鏈粯娆�"></el-option>
- <el-option label="宸蹭粯娆�" value="宸蹭粯娆�"></el-option>
- <el-option label="閮ㄥ垎浠樻" value="閮ㄥ垎浠樻"></el-option>
+ <el-select v-model="searchForm.paymentStatus"
+ placeholder="璇烽�夋嫨浠樻鐘舵��"
+ clearable>
+ <el-option label="鏈粯娆�"
+ value="鏈粯娆�"></el-option>
+ <el-option label="宸蹭粯娆�"
+ value="宸蹭粯娆�"></el-option>
+ <el-option label="閮ㄥ垎浠樻"
+ value="閮ㄥ垎浠樻"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.shippingStatus" placeholder="璇烽�夋嫨鍙戣揣鐘舵��" clearable>
- <el-option label="寰呭彂璐�" value="寰呭彂璐�"></el-option>
- <el-option label="宸插彂璐�" value="宸插彂璐�"></el-option>
- <el-option label="宸茬鏀�" value="宸茬鏀�"></el-option>
+ <el-select v-model="searchForm.shippingStatus"
+ placeholder="璇烽�夋嫨鍙戣揣鐘舵��"
+ clearable>
+ <el-option label="寰呭彂璐�"
+ value="寰呭彂璐�"></el-option>
+ <el-option label="宸插彂璐�"
+ value="宸插彂璐�"></el-option>
+ <el-option label="宸茬鏀�"
+ value="宸茬鏀�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button style="float: right;" type="primary" @click="handleAdd">
+ <el-button style="float: right;"
+ type="primary"
+ @click="handleAdd">
鏂板璁板綍
</el-button>
</el-col>
</el-row>
-
<!-- 鏀粯涓庡彂璐у垪琛� -->
- <el-table
- :data="recordList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column prop="id" label="ID" width="80" align="center"/>
- <el-table-column prop="orderNo" label="璁㈠崟鍙�" />
- <el-table-column prop="customer" label="瀹㈡埛鍚嶇О" />
- <el-table-column prop="orderAmount" label="璁㈠崟閲戦" width="120">
+ <el-table :data="recordList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column prop="id"
+ label="ID"
+ width="80"
+ align="center" />
+ <el-table-column prop="orderNo"
+ label="璁㈠崟鍙�" />
+ <el-table-column prop="customer"
+ label="瀹㈡埛鍚嶇О" />
+ <el-table-column prop="orderAmount"
+ label="璁㈠崟閲戦"
+ width="120">
<template #default="scope">
楼{{ scope.row.orderAmount }}
</template>
</el-table-column>
- <el-table-column prop="orderAmount" label="宸蹭粯娆鹃噾棰�" width="120">
+ <el-table-column prop="orderAmount"
+ label="宸蹭粯娆鹃噾棰�"
+ width="120">
<template #default="scope">
楼{{ scope.row.paidAmount }}
</template>
</el-table-column>
- <el-table-column prop="paymentStatus" label="浠樻鐘舵��" width="100">
+ <el-table-column prop="paymentStatus"
+ label="浠樻鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="getPaymentStatusType(scope.row.paymentStatus)">
{{ scope.row.paymentStatus }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="shippingStatus" label="鍙戣揣鐘舵��" width="100">
+ <el-table-column prop="shippingStatus"
+ label="鍙戣揣鐘舵��"
+ width="100">
<template #default="scope">
<el-tag :type="getShippingStatusType(scope.row.shippingStatus)">
{{ scope.row.shippingStatus }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="shippingDate" label="鍙戣揣鏃ユ湡" width="120" />
- <el-table-column label="鎿嶄綔" width="250" fixed="right" align="center">
+ <el-table-column prop="shippingDate"
+ label="鍙戣揣鏃ユ湡"
+ width="120" />
+ <el-table-column label="鎿嶄綔"
+ width="250"
+ fixed="right"
+ align="center">
<template #default="scope">
-<!-- <el-button link type="primary" @click="handleView(scope.row)">鏌ョ湅</el-button>-->
- <el-button link type="primary" @click="handlePayment(scope.row)" v-if="scope.row.paymentStatus !== '宸蹭粯娆�'">浠樻</el-button>
- <el-button link type="primary" @click="handleShipping(scope.row)" v-if="scope.row.paymentStatus === '宸蹭粯娆�' && scope.row.shippingStatus === '寰呭彂璐�'">鍙戣揣</el-button>
- <el-button link type="primary" @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)">鍒犻櫎</el-button>
+ <!-- <el-button link type="primary" @click="handleView(scope.row)">鏌ョ湅</el-button>-->
+ <el-button link
+ type="primary"
+ @click="handlePayment(scope.row)"
+ v-if="scope.row.paymentStatus !== '宸蹭粯娆�'">浠樻</el-button>
+ <el-button link
+ type="primary"
+ @click="handleShipping(scope.row)"
+ v-if="scope.row.paymentStatus === '宸蹭粯娆�' && scope.row.shippingStatus === '寰呭彂璐�'">鍙戣揣</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)">缂栬緫</el-button>
+ <el-button link
+ type="danger"
+ @click="handleDelete(scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.current"
- :limit="pagination.size"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.current"
+ :limit="pagination.size"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="700px">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="700px">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="璁㈠崟鍙�" prop="orderNo">
- <el-input v-model="form.orderNo" placeholder="璇疯緭鍏ヨ鍗曞彿" disabled></el-input>
+ <el-form-item label="璁㈠崟鍙�"
+ prop="orderNo">
+ <el-input v-model="form.orderNo"
+ placeholder="璇疯緭鍏ヨ鍗曞彿"
+ disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="瀹㈡埛鍚嶇О" prop="customer">
- <el-select v-model="form.customer" placeholder="璇烽�夋嫨瀹㈡埛" style="width: 100%">
- <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃" value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
- <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃" value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
- <el-option label="鍖椾含璐告槗鍏徃" value="鍖椾含璐告槗鍏徃"></el-option>
+ <el-form-item label="瀹㈡埛鍚嶇О"
+ prop="customer">
+ <el-select v-model="form.customer"
+ placeholder="璇烽�夋嫨瀹㈡埛"
+ style="width: 100%">
+ <el-option label="涓婃捣绉戞妧鏈夐檺鍏徃"
+ value="涓婃捣绉戞妧鏈夐檺鍏徃"></el-option>
+ <el-option label="娣卞湷鐢靛瓙鏈夐檺鍏徃"
+ value="娣卞湷鐢靛瓙鏈夐檺鍏徃"></el-option>
+ <el-option label="鍖椾含璐告槗鍏徃"
+ value="鍖椾含璐告槗鍏徃"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="璁㈠崟閲戦" prop="orderAmount">
- <el-input-number v-model="form.orderAmount" :precision="2" :min="0" style="width: 100%"></el-input-number>
+ <el-form-item label="璁㈠崟閲戦"
+ prop="orderAmount">
+ <el-input-number v-model="form.orderAmount"
+ :precision="2"
+ :min="0"
+ style="width: 100%"></el-input-number>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="浠樻鐘舵��" prop="paymentStatus">
- <el-select v-model="form.paymentStatus" placeholder="璇烽�夋嫨浠樻鐘舵��" style="width: 100%">
- <el-option label="鏈粯娆�" value="鏈粯娆�"></el-option>
- <el-option label="宸蹭粯娆�" value="宸蹭粯娆�"></el-option>
- <el-option label="閮ㄥ垎浠樻" value="閮ㄥ垎浠樻"></el-option>
+ <el-form-item label="浠樻鐘舵��"
+ prop="paymentStatus">
+ <el-select v-model="form.paymentStatus"
+ placeholder="璇烽�夋嫨浠樻鐘舵��"
+ style="width: 100%">
+ <el-option label="鏈粯娆�"
+ value="鏈粯娆�"></el-option>
+ <el-option label="宸蹭粯娆�"
+ value="宸蹭粯娆�"></el-option>
+ <el-option label="閮ㄥ垎浠樻"
+ value="閮ㄥ垎浠樻"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鍙戣揣鐘舵��" prop="shippingStatus">
- <el-select v-model="form.shippingStatus" placeholder="璇烽�夋嫨鍙戣揣鐘舵��" style="width: 100%">
- <el-option label="寰呭彂璐�" value="寰呭彂璐�"></el-option>
- <el-option label="宸插彂璐�" value="宸插彂璐�"></el-option>
- <el-option label="宸茬鏀�" value="宸茬鏀�"></el-option>
+ <el-form-item label="鍙戣揣鐘舵��"
+ prop="shippingStatus">
+ <el-select v-model="form.shippingStatus"
+ placeholder="璇烽�夋嫨鍙戣揣鐘舵��"
+ style="width: 100%">
+ <el-option label="寰呭彂璐�"
+ value="寰呭彂璐�"></el-option>
+ <el-option label="宸插彂璐�"
+ value="宸插彂璐�"></el-option>
+ <el-option label="宸茬鏀�"
+ value="宸茬鏀�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鍙戣揣鏃ユ湡" prop="shippingDate">
- <el-date-picker
- v-model="form.shippingDate"
- type="date"
- placeholder="閫夋嫨鍙戣揣鏃ユ湡"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="鍙戣揣鏃ユ湡"
+ prop="shippingDate">
+ <el-date-picker v-model="form.shippingDate"
+ type="date"
+ placeholder="閫夋嫨鍙戣揣鏃ユ湡"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鐗╂祦鍗曞彿" prop="trackingNo">
- <el-input v-model="form.trackingNo" placeholder="璇疯緭鍏ョ墿娴佸崟鍙�"></el-input>
+ <el-form-item label="鐗╂祦鍗曞彿"
+ prop="trackingNo">
+ <el-input v-model="form.trackingNo"
+ placeholder="璇疯緭鍏ョ墿娴佸崟鍙�"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
- <el-form-item label="澶囨敞" prop="remark">
- <el-input type="textarea" v-model="form.remark" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" rows="3"></el-input>
+ <el-form-item label="澶囨敞"
+ prop="remark">
+ <el-input type="textarea"
+ v-model="form.remark"
+ placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
+ rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 浠樻瀵硅瘽妗� -->
- <el-dialog v-model="paymentDialogVisible" title="璁㈠崟浠樻" width="500px">
+ <el-dialog v-model="paymentDialogVisible"
+ title="璁㈠崟浠樻"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="璁㈠崟鍙�">
<span>{{ currentRecord.orderNo }}</span>
@@ -189,23 +261,34 @@
<el-form-item label="璁㈠崟閲戦">
<span>楼{{ currentRecord.orderAmount }}</span>
</el-form-item>
- <el-form-item label="浠樻閲戦" prop="paymentAmount">
- <el-input-number v-model="paymentAmount" :precision="2" :min="0" :max="currentRecord.orderAmount" style="width: 100%"></el-input-number>
+ <el-form-item label="浠樻閲戦"
+ prop="paymentAmount">
+ <el-input-number v-model="paymentAmount"
+ :precision="2"
+ :min="0"
+ :max="currentRecord.orderAmount"
+ style="width: 100%"></el-input-number>
</el-form-item>
- <el-form-item label="浠樻澶囨敞" prop="paymentRemark">
- <el-input type="textarea" v-model="paymentRemark" rows="3" placeholder="璇疯緭鍏ヤ粯娆惧娉�"></el-input>
+ <el-form-item label="浠樻澶囨敞"
+ prop="paymentRemark">
+ <el-input type="textarea"
+ v-model="paymentRemark"
+ rows="3"
+ placeholder="璇疯緭鍏ヤ粯娆惧娉�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="savePayment">纭� 瀹�</el-button>
<el-button @click="paymentDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="savePayment">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鍙戣揣瀵硅瘽妗� -->
- <el-dialog v-model="shippingDialogVisible" title="璁㈠崟鍙戣揣" width="500px">
+ <el-dialog v-model="shippingDialogVisible"
+ title="璁㈠崟鍙戣揣"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="璁㈠崟鍙�">
<span>{{ currentRecord.orderNo }}</span>
@@ -213,36 +296,50 @@
<el-form-item label="瀹㈡埛鍚嶇О">
<span>{{ currentRecord.customer }}</span>
</el-form-item>
- <el-form-item label="鍙戣揣鏃ユ湡" prop="shippingDate">
- <el-date-picker
- v-model="shippingDate"
- type="date"
- placeholder="閫夋嫨鍙戣揣鏃ユ湡"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="鍙戣揣鏃ユ湡"
+ prop="shippingDate">
+ <el-date-picker v-model="shippingDate"
+ type="date"
+ placeholder="閫夋嫨鍙戣揣鏃ユ湡"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
- <el-form-item label="鐗╂祦鍏徃" prop="logisticsCompany">
- <el-select v-model="logisticsCompany" placeholder="璇烽�夋嫨鐗╂祦鍏徃" style="width: 100%">
- <el-option label="椤轰赴閫熻繍" value="椤轰赴閫熻繍"></el-option>
- <el-option label="鍦嗛�氶�熼��" value="鍦嗛�氶�熼��"></el-option>
- <el-option label="涓�氬揩閫�" value="涓�氬揩閫�"></el-option>
- <el-option label="鐢抽�氬揩閫�" value="鐢抽�氬揩閫�"></el-option>
- <el-option label="闊佃揪閫熼��" value="闊佃揪閫熼��"></el-option>
+ <el-form-item label="鐗╂祦鍏徃"
+ prop="logisticsCompany">
+ <el-select v-model="logisticsCompany"
+ placeholder="璇烽�夋嫨鐗╂祦鍏徃"
+ style="width: 100%">
+ <el-option label="椤轰赴閫熻繍"
+ value="椤轰赴閫熻繍"></el-option>
+ <el-option label="鍦嗛�氶�熼��"
+ value="鍦嗛�氶�熼��"></el-option>
+ <el-option label="涓�氬揩閫�"
+ value="涓�氬揩閫�"></el-option>
+ <el-option label="鐢抽�氬揩閫�"
+ value="鐢抽�氬揩閫�"></el-option>
+ <el-option label="闊佃揪閫熼��"
+ value="闊佃揪閫熼��"></el-option>
</el-select>
</el-form-item>
- <el-form-item label="鐗╂祦鍗曞彿" prop="trackingNo">
- <el-input v-model="trackingNo" placeholder="璇疯緭鍏ョ墿娴佸崟鍙�"></el-input>
+ <el-form-item label="鐗╂祦鍗曞彿"
+ prop="trackingNo">
+ <el-input v-model="trackingNo"
+ placeholder="璇疯緭鍏ョ墿娴佸崟鍙�"></el-input>
</el-form-item>
- <el-form-item label="鍙戣揣澶囨敞" prop="shippingRemark">
- <el-input type="textarea" v-model="shippingRemark" rows="3" placeholder="璇疯緭鍏ュ彂璐у娉�"></el-input>
+ <el-form-item label="鍙戣揣澶囨敞"
+ prop="shippingRemark">
+ <el-input type="textarea"
+ v-model="shippingRemark"
+ rows="3"
+ placeholder="璇疯緭鍏ュ彂璐у娉�"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="saveShipping">纭� 瀹�</el-button>
<el-button @click="shippingDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="saveShipping">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
@@ -250,232 +347,241 @@
</template>
<script setup>
-import { ref, reactive, computed,onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Search } from '@element-plus/icons-vue'
-import {listPage,add,update,deletePaymentShipping} from "@/api/salesManagement/paymentShipping.js"
-import Pagination from '@/components/PIMTable/Pagination.vue'
+ import { ref, reactive, computed, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Plus, Search } from "@element-plus/icons-vue";
+ import {
+ listPage,
+ add,
+ update,
+ deletePaymentShipping,
+ } from "@/api/salesManagement/paymentShipping.js";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
-const total = ref(0)
-onMounted(() => {
- getList()
-})
+ const total = ref(0);
+ onMounted(() => {
+ getList();
+ });
-const getList = () => {
- loading.value = true
- listPage({...searchForm,...pagination}).then(res => {
- if(res.code === 200){
- recordList.value = res.data.records
- total.value = res.data.total
- loading.value = false
- console.log(recordList.value)
- }
- })
-}
-
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- orderNo: '',
- paymentStatus: '',
- shippingStatus: ''
-})
-
-const recordList = ref([])
-
-const pagination = reactive({
- current: 1,
- size: 10
-})
-
-const dialogVisible = ref(false)
-const dialogTitle = ref('鏂板璁板綍')
-const form = reactive({
- orderNo: '',
- customer: '',
- orderAmount: 0,
- paymentStatus: '鏈粯娆�',
- shippingStatus: '寰呭彂璐�',
- shippingDate: '',
- trackingNo: '',
- remark: ''
-})
-
-const rules = {
- // orderNo: [{ required: true, message: '璇疯緭鍏ヨ鍗曞彿', trigger: 'blur' }],
- customer: [{ required: true, message: '璇烽�夋嫨瀹㈡埛', trigger: 'change' }],
- orderAmount: [{ required: true, message: '璇疯緭鍏ヨ鍗曢噾棰�', trigger: 'blur' }],
- paymentStatus: [{ required: true, message: '璇烽�夋嫨浠樻鐘舵��', trigger: 'change' }],
- shippingStatus: [{ required: true, message: '璇烽�夋嫨鍙戣揣鐘舵��', trigger: 'change' }]
-}
-
-const isEdit = ref(false)
-const editId = ref(null)
-const paymentDialogVisible = ref(false)
-const shippingDialogVisible = ref(false)
-const currentRecord = ref({})
-const paymentAmount = ref(0)
-const paymentRemark = ref('')
-const shippingDate = ref('')
-const logisticsCompany = ref('')
-const trackingNo = ref('')
-const shippingRemark = ref('')
-const formRef = ref()
-
-// 鏂规硶
-const getPaymentStatusType = (status) => {
- const statusMap = {
- '鏈粯娆�': 'danger',
- '宸蹭粯娆�': 'success',
- '閮ㄥ垎浠樻': 'warning'
- }
- return statusMap[status] || 'info'
-}
-
-const getShippingStatusType = (status) => {
- const statusMap = {
- '寰呭彂璐�': 'warning',
- '宸插彂璐�': 'primary',
- '宸茬鏀�': 'success'
- }
- return statusMap[status] || 'info'
-}
-
-const handleSearch = () => {
- // 鎼滅储閫昏緫宸插湪computed涓鐞�
- getList()
-}
-
-const resetSearch = () => {
- searchForm.orderNo = ''
- searchForm.paymentStatus = ''
- searchForm.shippingStatus = ''
-}
-
-const handleAdd = () => {
- dialogTitle.value = '鏂板璁板綍'
- isEdit.value = false
- form.orderNo = ''
- form.customer = ''
- form.orderAmount = 0
- form.paymentStatus = '鏈粯娆�'
- form.shippingStatus = '寰呭彂璐�'
- form.shippingDate = ''
- form.trackingNo = ''
- form.remark = ''
- dialogVisible.value = true
-}
-
-const handleView = (row) => {
- // 鏌ョ湅璁板綍璇︽儏
- ElMessage.info('鏌ョ湅璁板綍璇︽儏鍔熻兘寰呭疄鐜�')
-}
-
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫璁板綍'
- isEdit.value = true
- editId.value = row.id
- Object.assign(form, row)
- dialogVisible.value = true
-}
-
-const handlePayment = (row) => {
- currentRecord.value = row
- paymentAmount.value = row.orderAmount - row.paidAmount
- paymentRemark.value = ''
- paymentDialogVisible.value = true
-}
-
-const handleShipping = (row) => {
- currentRecord.value = row
- shippingDate.value = ''
- logisticsCompany.value = ''
- trackingNo.value = ''
- shippingRemark.value = ''
- shippingDialogVisible.value = true
-}
-
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ヨ褰曞悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- let ids = [row.id]
- deletePaymentShipping(ids).then(res => {
- if(res.code === 200){
- ElMessage.success('鍒犻櫎鎴愬姛')
- getList()
+ const getList = () => {
+ loading.value = true;
+ listPage({ ...searchForm, ...pagination }).then(res => {
+ if (res.code === 200) {
+ recordList.value = res.data.records;
+ total.value = res.data.total;
+ loading.value = false;
+ console.log(recordList.value);
}
- })
- })
-}
+ });
+ };
-const savePayment = () => {
- currentRecord.value.paidAmount = Number(currentRecord.value.paidAmount) + paymentAmount.value
- if(currentRecord.value.paidAmount == currentRecord.value.orderAmount){
- currentRecord.value.paymentStatus = '宸蹭粯娆�'
- }else{
- currentRecord.value.paymentStatus = '閮ㄥ垎浠樻'
- }
- update(currentRecord.value).then(res => {
- if(res.code === 200){
- ElMessage.success('浠樻淇℃伅宸蹭繚瀛�')
- paymentDialogVisible.value = false
- getList()
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ orderNo: "",
+ paymentStatus: "",
+ shippingStatus: "",
+ });
+
+ const recordList = ref([]);
+
+ const pagination = reactive({
+ current: 1,
+ size: 10,
+ });
+
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("鏂板璁板綍");
+ const form = reactive({
+ orderNo: "",
+ customer: "",
+ orderAmount: 0,
+ paymentStatus: "鏈粯娆�",
+ shippingStatus: "寰呭彂璐�",
+ shippingDate: "",
+ trackingNo: "",
+ remark: "",
+ });
+
+ const rules = {
+ // orderNo: [{ required: true, message: '璇疯緭鍏ヨ鍗曞彿', trigger: 'blur' }],
+ customer: [{ required: true, message: "璇烽�夋嫨瀹㈡埛", trigger: "change" }],
+ orderAmount: [{ required: true, message: "璇疯緭鍏ヨ鍗曢噾棰�", trigger: "blur" }],
+ paymentStatus: [
+ { required: true, message: "璇烽�夋嫨浠樻鐘舵��", trigger: "change" },
+ ],
+ shippingStatus: [
+ { required: true, message: "璇烽�夋嫨鍙戣揣鐘舵��", trigger: "change" },
+ ],
+ };
+
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const paymentDialogVisible = ref(false);
+ const shippingDialogVisible = ref(false);
+ const currentRecord = ref({});
+ const paymentAmount = ref(0);
+ const paymentRemark = ref("");
+ const shippingDate = ref("");
+ const logisticsCompany = ref("");
+ const trackingNo = ref("");
+ const shippingRemark = ref("");
+ const formRef = ref();
+
+ // 鏂规硶
+ const getPaymentStatusType = status => {
+ const statusMap = {
+ 鏈粯娆�: "danger",
+ 宸蹭粯娆�: "success",
+ 閮ㄥ垎浠樻: "warning",
+ };
+ return statusMap[status] || "info";
+ };
+
+ const getShippingStatusType = status => {
+ const statusMap = {
+ 寰呭彂璐�: "warning",
+ 宸插彂璐�: "primary",
+ 宸茬鏀�: "success",
+ };
+ return statusMap[status] || "info";
+ };
+
+ const handleSearch = () => {
+ // 鎼滅储閫昏緫宸插湪computed涓鐞�
+ getList();
+ };
+
+ const resetSearch = () => {
+ searchForm.orderNo = "";
+ searchForm.paymentStatus = "";
+ searchForm.shippingStatus = "";
+ };
+
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板璁板綍";
+ isEdit.value = false;
+ form.orderNo = "";
+ form.customer = "";
+ form.orderAmount = 0;
+ form.paymentStatus = "鏈粯娆�";
+ form.shippingStatus = "寰呭彂璐�";
+ form.shippingDate = "";
+ form.trackingNo = "";
+ form.remark = "";
+ dialogVisible.value = true;
+ };
+
+ const handleView = row => {
+ // 鏌ョ湅璁板綍璇︽儏
+ ElMessage.info("鏌ョ湅璁板綍璇︽儏鍔熻兘寰呭疄鐜�");
+ };
+
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫璁板綍";
+ isEdit.value = true;
+ editId.value = row.id;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
+
+ const handlePayment = row => {
+ currentRecord.value = row;
+ paymentAmount.value = row.orderAmount - row.paidAmount;
+ paymentRemark.value = "";
+ paymentDialogVisible.value = true;
+ };
+
+ const handleShipping = row => {
+ currentRecord.value = row;
+ shippingDate.value = "";
+ logisticsCompany.value = "";
+ trackingNo.value = "";
+ shippingRemark.value = "";
+ shippingDialogVisible.value = true;
+ };
+
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ヨ褰曞悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ let ids = [row.id];
+ deletePaymentShipping(ids).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ }
+ });
+ });
+ };
+
+ const savePayment = () => {
+ currentRecord.value.paidAmount =
+ Number(currentRecord.value.paidAmount) + paymentAmount.value;
+ if (currentRecord.value.paidAmount == currentRecord.value.orderAmount) {
+ currentRecord.value.paymentStatus = "宸蹭粯娆�";
+ } else {
+ currentRecord.value.paymentStatus = "閮ㄥ垎浠樻";
}
- })
-
-}
-
-const saveShipping = () => {
- if (!shippingDate.value || !logisticsCompany.value || !trackingNo.value) {
- ElMessage.warning('璇峰～鍐欏畬鏁寸殑鍙戣揣淇℃伅')
- return
- }
- currentRecord.value.shippingStatus = '宸插彂璐�'
- update(currentRecord.value).then(res => {
- if(res.code === 200){
- ElMessage.success('鍙戣揣淇℃伅宸蹭繚瀛�')
- shippingDialogVisible.value = false
- getList()
- }
- })
-}
-
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (isEdit.value) {
- // 缂栬緫
- update(form).then(res => {
- if(res.code === 200){
- ElMessage.success('缂栬緫鎴愬姛')
- getList()
- }
- })
- } else {
- // 鏂板
- add(form).then(res => {
- if(res.code === 200){
- ElMessage.success('鏂板鎴愬姛')
- getList()
- }
- })
+ update(currentRecord.value).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("浠樻淇℃伅宸蹭繚瀛�");
+ paymentDialogVisible.value = false;
+ getList();
}
- dialogVisible.value = false
- }
- })
-}
+ });
+ };
-const handleCurrentChange = (val) => {
- pagination.current = val.page
- pagination.size = val.limit
-}
+ const saveShipping = () => {
+ if (!shippingDate.value || !logisticsCompany.value || !trackingNo.value) {
+ ElMessage.warning("璇峰～鍐欏畬鏁寸殑鍙戣揣淇℃伅");
+ return;
+ }
+ currentRecord.value.shippingStatus = "宸插彂璐�";
+ update(currentRecord.value).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鍙戣揣淇℃伅宸蹭繚瀛�");
+ shippingDialogVisible.value = false;
+ getList();
+ }
+ });
+ };
+
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (isEdit.value) {
+ // 缂栬緫
+ update(form).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("缂栬緫鎴愬姛");
+ getList();
+ }
+ });
+ } else {
+ // 鏂板
+ add(form).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鏂板鎴愬姛");
+ getList();
+ }
+ });
+ }
+ dialogVisible.value = false;
+ }
+ });
+ };
+
+ const handleCurrentChange = val => {
+ pagination.current = val.page;
+ pagination.size = val.limit;
+ };
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/salesManagement/salesQuotation/index.vue b/src/views/salesManagement/salesQuotation/index.vue
index fac1afe..d2d3943 100644
--- a/src/views/salesManagement/salesQuotation/index.vue
+++ b/src/views/salesManagement/salesQuotation/index.vue
@@ -2,327 +2,429 @@
<div class="app-container">
<el-card class="box-card">
<!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
+ <el-row :gutter="20"
+ class="search-row">
<el-col :span="8">
- <el-input
- v-model="searchForm.quotationNo"
- placeholder="璇疯緭鍏ユ姤浠峰崟鍙�"
- clearable
- @keyup.enter="handleSearch"
- >
+ <el-input v-model="searchForm.quotationNo"
+ placeholder="璇疯緭鍏ユ姤浠峰崟鍙�"
+ clearable
+ @keyup.enter="handleSearch">
<template #prefix>
- <el-icon><Search /></el-icon>
+ <el-icon>
+ <Search />
+ </el-icon>
</template>
</el-input>
</el-col>
<el-col :span="8">
- <el-select v-model="searchForm.customer" placeholder="璇烽�夋嫨瀹㈡埛" clearable>
- <el-option v-for="item in customerOption" :key="item.id" :label="item.customerName" :value="item.customerName">
- {{
+ <el-select v-model="searchForm.customer"
+ placeholder="璇烽�夋嫨瀹㈡埛"
+ clearable>
+ <el-option v-for="item in customerOption"
+ :key="item.id"
+ :label="item.customerName"
+ :value="item.customerName">
+ {{
item.customerName + "鈥斺��" + item.taxpayerIdentificationNumber
}}
- </el-option>
+ </el-option>
</el-select>
</el-col>
-<!-- <el-col :span="6">-->
-<!-- <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鎶ヤ环鐘舵��" clearable>-->
-<!-- <el-option label="鑽夌" value="鑽夌"></el-option>-->
-<!-- <el-option label="宸插彂閫�" value="宸插彂閫�"></el-option>-->
-<!-- <el-option label="瀹㈡埛纭" value="瀹㈡埛纭"></el-option>-->
-<!-- <el-option label="宸茶繃鏈�" value="宸茶繃鏈�"></el-option>-->
-<!-- </el-select>-->
-<!-- </el-col>-->
+ <!-- <el-col :span="6">-->
+ <!-- <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鎶ヤ环鐘舵��" clearable>-->
+ <!-- <el-option label="鑽夌" value="鑽夌"></el-option>-->
+ <!-- <el-option label="宸插彂閫�" value="宸插彂閫�"></el-option>-->
+ <!-- <el-option label="瀹㈡埛纭" value="瀹㈡埛纭"></el-option>-->
+ <!-- <el-option label="宸茶繃鏈�" value="宸茶繃鏈�"></el-option>-->
+ <!-- </el-select>-->
+ <!-- </el-col>-->
<el-col :span="8">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button style="float: right;" type="primary" @click="handleAdd">
+ <el-button style="float: right;"
+ type="primary"
+ @click="handleAdd">
鏂板鎶ヤ环
</el-button>
</el-col>
</el-row>
-
<!-- 鎶ヤ环鍒楄〃 -->
- <el-table
- :data="filteredList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column align="center" label="搴忓彿" type="index" width="60" />
- <el-table-column prop="quotationNo" label="鎶ヤ环鍗曞彿" width="150" />
- <el-table-column prop="customer" label="瀹㈡埛鍚嶇О" />
- <el-table-column prop="salesperson" label="涓氬姟鍛�" width="100" />
- <el-table-column prop="quotationDate" label="鎶ヤ环鏃ユ湡" width="120" />
- <el-table-column prop="validDate" label="鏈夋晥鏈熻嚦" width="120" />
- <el-table-column prop="totalAmount" label="鎶ヤ环閲戦" width="120">
+ <el-table :data="filteredList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column align="center"
+ label="搴忓彿"
+ type="index"
+ width="60" />
+ <el-table-column prop="quotationNo"
+ label="鎶ヤ环鍗曞彿"
+ width="150" />
+ <el-table-column prop="customer"
+ label="瀹㈡埛鍚嶇О" />
+ <el-table-column prop="salesperson"
+ label="涓氬姟鍛�"
+ width="100" />
+ <el-table-column prop="quotationDate"
+ label="鎶ヤ环鏃ユ湡"
+ width="120" />
+ <el-table-column prop="validDate"
+ label="鏈夋晥鏈熻嚦"
+ width="120" />
+ <el-table-column prop="totalAmount"
+ label="鎶ヤ环閲戦"
+ width="120">
<template #default="scope">
楼{{ scope.row.totalAmount.toFixed(2) }}
</template>
</el-table-column>
-<!-- <el-table-column prop="status" label="鎶ヤ环鐘舵��" width="100">-->
-<!-- <template #default="scope">-->
-<!-- <el-tag :type="getStatusType(scope.row.status)">-->
-<!-- {{ scope.row.status }}-->
-<!-- </el-tag>-->
-<!-- </template>-->
-<!-- </el-table-column>-->
- <el-table-column label="鎿嶄綔" width="250" fixed="right" align="center">
+ <!-- <el-table-column prop="status" label="鎶ヤ环鐘舵��" width="100">-->
+ <!-- <template #default="scope">-->
+ <!-- <el-tag :type="getStatusType(scope.row.status)">-->
+ <!-- {{ scope.row.status }}-->
+ <!-- </el-tag>-->
+ <!-- </template>-->
+ <!-- </el-table-column>-->
+ <el-table-column label="鎿嶄綔"
+ width="250"
+ fixed="right"
+ align="center">
<template #default="scope">
- <el-button link type="primary" @click="handleView(scope.row)">鏌ョ湅</el-button>
- <el-button link type="primary" @click="handleEdit(scope.row)" v-if="scope.row.status === '鑽夌'">缂栬緫</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)" v-if="scope.row.status === '鑽夌'">鍒犻櫎</el-button>
+ <el-button link
+ type="primary"
+ @click="handleView(scope.row)">鏌ョ湅</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)"
+ v-if="scope.row.status === '鑽夌'">缂栬緫</el-button>
+ <el-button link
+ type="danger"
+ @click="handleDelete(scope.row)"
+ v-if="scope.row.status === '鑽夌'">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="pagination.total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.currentPage"
- :limit="pagination.pageSize"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="pagination.total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.currentPage"
+ :limit="pagination.pageSize"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="1300px" :close-on-click-modal="false">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="1300px"
+ :close-on-click-modal="false">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<!-- 鍩烘湰淇℃伅 -->
- <el-card class="form-card" shadow="never">
+ <el-card class="form-card"
+ shadow="never">
<template #header>
<span class="card-title">鍩烘湰淇℃伅</span>
</template>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="瀹㈡埛鍚嶇О" prop="customer">
- <el-select v-model="form.customer" placeholder="璇烽�夋嫨瀹㈡埛" style="width: 100%" @change="handleCustomerChange">
- <el-option v-for="item in customerOption" :key="item.id" :label="item.customerName" :value="item.customerName">
- {{
+ <el-form-item label="瀹㈡埛鍚嶇О"
+ prop="customer">
+ <el-select v-model="form.customer"
+ placeholder="璇烽�夋嫨瀹㈡埛"
+ style="width: 100%"
+ @change="handleCustomerChange">
+ <el-option v-for="item in customerOption"
+ :key="item.id"
+ :label="item.customerName"
+ :value="item.customerName">
+ {{
item.customerName + "鈥斺��" + item.taxpayerIdentificationNumber
}}
- </el-option>
+ </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="涓氬姟鍛�" prop="salesperson">
- <el-select v-model="form.salesperson" placeholder="璇烽�夋嫨涓氬姟鍛�" style="width: 100%">
- <el-option v-for="item in userList" :key="item.nickName" :label="item.nickName"
- :value="item.nickName" />
+ <el-form-item label="涓氬姟鍛�"
+ prop="salesperson">
+ <el-select v-model="form.salesperson"
+ placeholder="璇烽�夋嫨涓氬姟鍛�"
+ style="width: 100%">
+ <el-option v-for="item in userList"
+ :key="item.nickName"
+ :label="item.nickName"
+ :value="item.nickName" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鎶ヤ环鏃ユ湡" prop="quotationDate">
- <el-date-picker
- v-model="form.quotationDate"
- type="date"
- placeholder="閫夋嫨鎶ヤ环鏃ユ湡"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="鎶ヤ环鏃ユ湡"
+ prop="quotationDate">
+ <el-date-picker v-model="form.quotationDate"
+ type="date"
+ placeholder="閫夋嫨鎶ヤ环鏃ユ湡"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鏈夋晥鏈熻嚦" prop="validDate">
- <el-date-picker
- v-model="form.validDate"
- type="date"
- placeholder="閫夋嫨鏈夋晥鏈�"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="鏈夋晥鏈熻嚦"
+ prop="validDate">
+ <el-date-picker v-model="form.validDate"
+ type="date"
+ placeholder="閫夋嫨鏈夋晥鏈�"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="浜よ揣鏈�" prop="deliveryPeriod">
- <el-date-picker
- v-model="form.deliveryPeriod"
- type="date"
- placeholder="閫夋嫨浜よ揣鏈�"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="浜よ揣鏈�"
+ prop="deliveryPeriod">
+ <el-date-picker v-model="form.deliveryPeriod"
+ type="date"
+ placeholder="閫夋嫨浜よ揣鏈�"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
</el-row>
</el-card>
-
<!-- 浜у搧淇℃伅 -->
- <el-card class="form-card" shadow="never">
+ <el-card class="form-card"
+ shadow="never">
<template #header>
<div class="card-header">
<span class="card-title">浜у搧淇℃伅</span>
- <el-button type="primary" size="small" @click="addProduct">娣诲姞浜у搧</el-button>
+ <el-button type="primary"
+ size="small"
+ @click="addProduct">娣诲姞浜у搧</el-button>
</div>
</template>
- <el-table :data="form.products" border style="width: 100%">
- <el-table-column prop="product" label="浜у搧鍚嶇О" width="200">
+ <el-table :data="form.products"
+ border
+ style="width: 100%">
+ <el-table-column prop="product"
+ label="浜у搧鍚嶇О"
+ width="200">
<template #default="scope">
- <el-tree-select
- v-model="scope.row.productId"
- placeholder="璇烽�夋嫨"
- clearable
- check-strictly
- @change="getModels($event, scope.row)"
- :data="productOptions"
- :render-after-expand="false"
- style="width: 100%"
- />
+ <el-tree-select v-model="scope.row.productId"
+ placeholder="璇烽�夋嫨"
+ clearable
+ check-strictly
+ @change="getModels($event, scope.row)"
+ :data="productOptions"
+ :render-after-expand="false"
+ style="width: 100%" />
</template>
</el-table-column>
- <el-table-column prop="specification" label="瑙勬牸鍨嬪彿" width="150">
+ <el-table-column prop="specification"
+ label="瑙勬牸鍨嬪彿"
+ width="150">
<template #default="scope">
- <el-select
- v-model="scope.row.specificationId"
- placeholder="璇烽�夋嫨"
- clearable
- @change="getProductModel($event, scope.row)"
- >
- <el-option
- v-for="item in modelOptions"
- :key="item.id"
- :label="item.model"
- :value="item.id"
- />
- </el-select>
+ <el-select v-model="scope.row.specificationId"
+ placeholder="璇烽�夋嫨"
+ clearable
+ @change="getProductModel($event, scope.row)">
+ <el-option v-for="item in modelOptions"
+ :key="item.id"
+ :label="item.model"
+ :value="item.id" />
+ </el-select>
</template>
</el-table-column>
- <el-table-column prop="quantity" label="鏁伴噺">
+ <el-table-column prop="quantity"
+ label="鏁伴噺">
<template #default="scope">
- <el-input-number v-model="scope.row.quantity" :min="1" :precision="0" style="width: 100%" />
+ <el-input-number v-model="scope.row.quantity"
+ :min="1"
+ :precision="0"
+ style="width: 100%" />
</template>
</el-table-column>
- <el-table-column prop="unit" label="鍗曚綅">
+ <el-table-column prop="unit"
+ label="鍗曚綅">
<template #default="scope">
- <el-input v-model="scope.row.unit" placeholder="鍗曚綅" />
+ <el-input v-model="scope.row.unit"
+ placeholder="鍗曚綅" />
</template>
</el-table-column>
- <el-table-column prop="unitPrice" label="鍗曚环">
+ <el-table-column prop="unitPrice"
+ label="鍗曚环">
<template #default="scope">
- <el-input-number v-model="scope.row.unitPrice" :min="0" :precision="2" style="width: 100%" @change="calculateAmount(scope.row)" />
+ <el-input-number v-model="scope.row.unitPrice"
+ :min="0"
+ :precision="2"
+ style="width: 100%"
+ @change="calculateAmount(scope.row)" />
</template>
</el-table-column>
- <el-table-column prop="amount" label="閲戦" width="120">
+ <el-table-column prop="amount"
+ label="閲戦"
+ width="120">
<template #default="scope">
<span>楼{{ scope.row.amount.toFixed(2) }}</span>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="80" align="center">
+ <el-table-column label="鎿嶄綔"
+ width="80"
+ align="center">
<template #default="scope">
- <el-button link type="danger" @click="removeProduct(scope.$index)">鍒犻櫎</el-button>
+ <el-button link
+ type="danger"
+ @click="removeProduct(scope.$index)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
-
<!-- 璐圭敤淇℃伅 -->
- <el-card class="form-card" shadow="never">
+ <el-card class="form-card"
+ shadow="never">
<template #header>
<span class="card-title">璐圭敤淇℃伅</span>
</template>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="浜у搧灏忚">
- <el-input-number v-model="form.subtotal" :precision="2" :min="0" style="width: 100%" readonly />
+ <el-input-number v-model="form.subtotal"
+ :precision="2"
+ :min="0"
+ style="width: 100%"
+ readonly />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="杩愯垂">
- <el-input-number v-model="form.freight" :precision="2" :min="0" style="width: 100%" @change="calculateTotal" />
+ <el-input-number v-model="form.freight"
+ :precision="2"
+ :min="0"
+ style="width: 100%"
+ @change="calculateTotal" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鍏朵粬璐圭敤">
- <el-input-number v-model="form.otherFee" :precision="2" :min="0" style="width: 100%" @change="calculateTotal" />
+ <el-input-number v-model="form.otherFee"
+ :precision="2"
+ :min="0"
+ style="width: 100%"
+ @change="calculateTotal" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="鎶樻墸鐜�(%)">
- <el-input-number v-model="form.discountRate" :precision="2" :min="0" :max="100" style="width: 100%" @change="calculateTotal" />
+ <el-input-number v-model="form.discountRate"
+ :precision="2"
+ :min="0"
+ :max="100"
+ style="width: 100%"
+ @change="calculateTotal" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鎶樻墸閲戦">
- <el-input-number v-model="form.discountAmount" :precision="2" :min="0" style="width: 100%" readonly />
+ <el-input-number v-model="form.discountAmount"
+ :precision="2"
+ :min="0"
+ style="width: 100%"
+ readonly />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="鎶ヤ环鎬婚">
- <el-input-number v-model="form.totalAmount" :precision="2" :min="0" style="width: 100%" readonly />
+ <el-input-number v-model="form.totalAmount"
+ :precision="2"
+ :min="0"
+ style="width: 100%"
+ readonly />
</el-form-item>
</el-col>
</el-row>
</el-card>
-
<!-- 澶囨敞淇℃伅 -->
- <el-card class="form-card" shadow="never">
+ <el-card class="form-card"
+ shadow="never">
<template #header>
<span class="card-title">澶囨敞淇℃伅</span>
</template>
- <el-form-item label="澶囨敞" prop="remark">
- <el-input type="textarea" v-model="form.remark" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" rows="3"></el-input>
+ <el-form-item label="澶囨敞"
+ prop="remark">
+ <el-input type="textarea"
+ v-model="form.remark"
+ placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
+ rows="3"></el-input>
</el-form-item>
</el-card>
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鏌ョ湅璇︽儏瀵硅瘽妗� -->
- <el-dialog v-model="viewDialogVisible" title="鎶ヤ环璇︽儏" width="800px">
- <el-descriptions :column="2" border>
+ <el-dialog v-model="viewDialogVisible"
+ title="鎶ヤ环璇︽儏"
+ width="800px">
+ <el-descriptions :column="2"
+ border>
<el-descriptions-item label="鎶ヤ环鍗曞彿">{{ currentQuotation.quotationNo }}</el-descriptions-item>
<el-descriptions-item label="瀹㈡埛鍚嶇О">{{ currentQuotation.customer }}</el-descriptions-item>
<el-descriptions-item label="涓氬姟鍛�">{{ currentQuotation.salesperson }}</el-descriptions-item>
<el-descriptions-item label="鎶ヤ环鏃ユ湡">{{ currentQuotation.quotationDate }}</el-descriptions-item>
<el-descriptions-item label="鏈夋晥鏈熻嚦">{{ currentQuotation.validDate }}</el-descriptions-item>
<el-descriptions-item label="浜よ揣鏈�">{{ currentQuotation.deliveryPeriod }}</el-descriptions-item>
-<!-- <el-descriptions-item label="鎶ヤ环鐘舵��">-->
-<!-- <el-tag :type="getStatusType(currentQuotation.status)">{{ currentQuotation.status }}</el-tag>-->
-<!-- </el-descriptions-item>-->
- <el-descriptions-item label="鎶ヤ环鎬婚" :span="2">
+ <!-- <el-descriptions-item label="鎶ヤ环鐘舵��">-->
+ <!-- <el-tag :type="getStatusType(currentQuotation.status)">{{ currentQuotation.status }}</el-tag>-->
+ <!-- </el-descriptions-item>-->
+ <el-descriptions-item label="鎶ヤ环鎬婚"
+ :span="2">
<span style="font-size: 18px; color: #e6a23c; font-weight: bold;">楼{{ currentQuotation.totalAmount?.toFixed(2) }}</span>
</el-descriptions-item>
</el-descriptions>
-
<div style="margin-top: 20px;">
<h4>浜у搧鏄庣粏</h4>
- <el-table :data="currentQuotation.products" border style="width: 100%">
- <el-table-column prop="product" label="浜у搧鍚嶇О" />
- <el-table-column prop="specification" label="瑙勬牸鍨嬪彿" />
- <el-table-column prop="quantity" label="鏁伴噺" />
- <el-table-column prop="unit" label="鍗曚綅" />
- <el-table-column prop="unitPrice" label="鍗曚环">
+ <el-table :data="currentQuotation.products"
+ border
+ style="width: 100%">
+ <el-table-column prop="product"
+ label="浜у搧鍚嶇О" />
+ <el-table-column prop="specification"
+ label="瑙勬牸鍨嬪彿" />
+ <el-table-column prop="quantity"
+ label="鏁伴噺" />
+ <el-table-column prop="unit"
+ label="鍗曚綅" />
+ <el-table-column prop="unitPrice"
+ label="鍗曚环">
<template #default="scope">
楼{{ scope.row.unitPrice.toFixed(2) }}
</template>
</el-table-column>
- <el-table-column prop="amount" label="閲戦">
+ <el-table-column prop="amount"
+ label="閲戦">
<template #default="scope">
楼{{ scope.row.amount.toFixed(2) }}
</template>
</el-table-column>
</el-table>
</div>
-
- <div v-if="currentQuotation.remark" style="margin-top: 20px;">
+ <div v-if="currentQuotation.remark"
+ style="margin-top: 20px;">
<h4>澶囨敞</h4>
<p>{{ currentQuotation.remark }}</p>
</div>
@@ -331,469 +433,492 @@
</template>
<script setup>
-import { ref, reactive, computed, onMounted, markRaw, shallowRef } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Search } from '@element-plus/icons-vue'
-import Pagination from '@/components/PIMTable/Pagination.vue'
-import {getQuotationList,addQuotation,updateQuotation,deleteQuotation} from '@/api/salesManagement/salesQuotation.js'
-import {userListNoPage} from "@/api/system/user.js";
-import {customerList} from "@/api/salesManagement/salesLedger.js";
-import {modelList, productTreeList} from "@/api/basicData/product.js";
+ import { ref, reactive, computed, onMounted, markRaw, shallowRef } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import { Search } from "@element-plus/icons-vue";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
+ import {
+ getQuotationList,
+ addQuotation,
+ updateQuotation,
+ deleteQuotation,
+ } from "@/api/salesManagement/salesQuotation.js";
+ import { userListNoPage } from "@/api/system/user.js";
+ import { customerList } from "@/api/salesManagement/salesLedger.js";
+ import { modelList, productTreeList } from "@/api/basicData/product.js";
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- quotationNo: '',
- customer: '',
- status: ''
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ quotationNo: "",
+ customer: "",
+ status: "",
+ });
-const quotationList = ref([])
-const productOptions = ref([]);
-const modelOptions = ref([]);
-const pagination = reactive({
- total: 3,
- currentPage: 1,
- pageSize: 100
-})
+ const quotationList = ref([]);
+ const productOptions = ref([]);
+ const modelOptions = ref([]);
+ const pagination = reactive({
+ total: 3,
+ currentPage: 1,
+ pageSize: 100,
+ });
-const dialogVisible = ref(false)
-const viewDialogVisible = ref(false)
-const dialogTitle = ref('鏂板鎶ヤ环')
-const form = reactive({
- quotationNo: '',
- customer: '',
- salesperson: '',
- quotationDate: '',
- validDate: '',
- paymentMethod: '',
- deliveryPeriod: '',
- status: '鑽夌',
- remark: '',
- products: [],
- subtotal: 0,
- freight: 0,
- otherFee: 0,
- discountRate: 0,
- discountAmount: 0,
- totalAmount: 0
-})
+ const dialogVisible = ref(false);
+ const viewDialogVisible = ref(false);
+ const dialogTitle = ref("鏂板鎶ヤ环");
+ const form = reactive({
+ quotationNo: "",
+ customer: "",
+ salesperson: "",
+ quotationDate: "",
+ validDate: "",
+ paymentMethod: "",
+ deliveryPeriod: "",
+ status: "鑽夌",
+ remark: "",
+ products: [],
+ subtotal: 0,
+ freight: 0,
+ otherFee: 0,
+ discountRate: 0,
+ discountAmount: 0,
+ totalAmount: 0,
+ });
-const rules = {
- customer: [{ required: true, message: '璇烽�夋嫨瀹㈡埛', trigger: 'change' }],
- salesperson: [{ required: true, message: '璇烽�夋嫨涓氬姟鍛�', trigger: 'change' }],
- quotationDate: [{ required: true, message: '璇烽�夋嫨鎶ヤ环鏃ユ湡', trigger: 'change' }],
- validDate: [{ required: true, message: '璇烽�夋嫨鏈夋晥鏈�', trigger: 'change' }],
- deliveryPeriod: [{ required: true, message: '璇烽�夋嫨浜よ揣鏈�', trigger: 'change' }]
-}
-const userList = ref([]);
-const customerOption = ref([]);
+ const rules = {
+ customer: [{ required: true, message: "璇烽�夋嫨瀹㈡埛", trigger: "change" }],
+ salesperson: [{ required: true, message: "璇烽�夋嫨涓氬姟鍛�", trigger: "change" }],
+ quotationDate: [
+ { required: true, message: "璇烽�夋嫨鎶ヤ环鏃ユ湡", trigger: "change" },
+ ],
+ validDate: [{ required: true, message: "璇烽�夋嫨鏈夋晥鏈�", trigger: "change" }],
+ deliveryPeriod: [
+ { required: true, message: "璇烽�夋嫨浜よ揣鏈�", trigger: "change" },
+ ],
+ };
+ const userList = ref([]);
+ const customerOption = ref([]);
-const isEdit = ref(false)
-const editId = ref(null)
-const currentQuotation = ref({})
-const formRef = ref()
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const currentQuotation = ref({});
+ const formRef = ref();
-// 璁＄畻灞炴��
-const filteredList = computed(() => {
- let list = quotationList.value
- if (searchForm.quotationNo) {
- list = list.filter(item => item.quotationNo.includes(searchForm.quotationNo))
- }
- if (searchForm.customer) {
- list = list.filter(item => item.customer === searchForm.customer)
- }
- if (searchForm.status) {
- list = list.filter(item => item.status === searchForm.status)
- }
- return list
-})
-
-// 鏂规硶
-const getStatusType = (status) => {
- const statusMap = {
- '鑽夌': 'info',
- '宸插彂閫�': 'primary',
- '瀹㈡埛纭': 'success',
- '宸茶繃鏈�': 'danger'
- }
- return statusMap[status] || 'info'
-}
-
-const resetSearch = () => {
- searchForm.quotationNo = ''
- searchForm.customer = ''
- searchForm.status = ''
-}
-
-const handleAdd = async () => {
- dialogTitle.value = '鏂板鎶ヤ环'
- isEdit.value = false
- resetForm()
- dialogVisible.value = true
- let userLists = await userListNoPage();
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
- userList.value = (userLists.data || []).map(item => ({
- userId: item.userId,
- nickName: item.nickName || '',
- userName: item.userName || ''
- }));
- getProductOptions();
- customerList().then((res) => {
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
- customerOption.value = (Array.isArray(res) ? res : []).map(item => ({
- id: item.id,
- customerName: item.customerName || '',
- taxpayerIdentificationNumber: item.taxpayerIdentificationNumber || ''
- }))
- });
-}
-const getProductOptions = () => {
- productTreeList().then((res) => {
- productOptions.value = convertIdToValue(res);
- });
-};
-function convertIdToValue(data) {
- return data.map((item) => {
- const { id, children, ...rest } = item;
- const newItem = {
- ...rest,
- value: id, // 灏� id 鏀逛负 value
- };
- if (children && children.length > 0) {
- newItem.children = convertIdToValue(children);
- }
-
- return newItem;
- });
-}
-const getModels = (value, row) => {
- if (!row) return;
- // 濡傛灉娓呯┖閫夋嫨锛屽垯娓呯┖鐩稿叧瀛楁
- if (!value) {
- row.productId = '';
- row.product = '';
- modelOptions.value = [];
- row.specificationId = '';
- row.specification = '';
- row.unit = '';
- return;
- }
- // 鏇存柊 productId锛坴-model 宸茬粡鑷姩鏇存柊锛岃繖閲岀‘淇濅竴鑷存�э級
- row.productId = value;
- // 鎵惧埌瀵瑰簲鐨� label 骞惰祴鍊肩粰 row.product
- const label = findNodeById(productOptions.value, value);
- if (label) {
- row.product = label;
- }
- // 鑾峰彇瑙勬牸鍨嬪彿鍒楄〃
- modelList({ id: value }).then((res) => {
- modelOptions.value = res || [];
- });
-};
-const getProductModel = (value, row) => {
- if (!row) return;
- // 濡傛灉娓呯┖閫夋嫨锛屽垯娓呯┖鐩稿叧瀛楁
- if (!value) {
- row.specificationId = '';
- row.specification = '';
- row.unit = '';
- return;
- }
- // 鏇存柊 specificationId锛坴-model 宸茬粡鑷姩鏇存柊锛岃繖閲岀‘淇濅竴鑷存�э級
- row.specificationId = value;
- const index = modelOptions.value.findIndex((item) => item.id === value);
- if (index !== -1) {
- row.specification = modelOptions.value[index].model;
- row.unit = modelOptions.value[index].unit;
- } else {
- row.specification = '';
- row.unit = '';
- }
-};
-const findNodeById = (nodes, productId) => {
- for (let i = 0; i < nodes.length; i++) {
- if (nodes[i].value === productId) {
- return nodes[i].label; // 鎵惧埌鑺傜偣锛岃繑鍥� label
- }
- if (nodes[i].children && nodes[i].children.length > 0) {
- const foundLabel = findNodeById(nodes[i].children, productId);
- if (foundLabel) {
- return foundLabel; // 鍦ㄥ瓙鑺傜偣涓壘鍒帮紝杩斿洖 label
- }
- }
- }
- return null; // 娌℃湁鎵惧埌鑺傜偣锛岃繑鍥瀗ull
-};
-const handleView = (row) => {
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
- currentQuotation.value = {
- quotationNo: row.quotationNo || '',
- customer: row.customer || '',
- salesperson: row.salesperson || '',
- quotationDate: row.quotationDate || '',
- validDate: row.validDate || '',
- paymentMethod: row.paymentMethod || '',
- deliveryPeriod: row.deliveryPeriod || '',
- status: row.status || '',
- remark: row.remark || '',
- products: row.products ? row.products.map(product => ({
- productId: product.productId || '',
- product: product.product || product.productName || '',
- specificationId: product.specificationId || '',
- specification: product.specification || '',
- quantity: product.quantity || 0,
- unit: product.unit || '',
- unitPrice: product.unitPrice || 0,
- amount: product.amount || 0
- })) : [],
- totalAmount: row.totalAmount || 0
- }
- viewDialogVisible.value = true
-}
-
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫鎶ヤ环'
- isEdit.value = true
- editId.value = row.id
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
- form.quotationNo = row.quotationNo || ''
- form.customer = row.customer || ''
- form.salesperson = row.salesperson || ''
- form.quotationDate = row.quotationDate || ''
- form.validDate = row.validDate || ''
- form.paymentMethod = row.paymentMethod || ''
- form.deliveryPeriod = row.deliveryPeriod || ''
- form.status = row.status || '鑽夌'
- form.remark = row.remark || ''
- form.products = row.products ? row.products.map(product => ({
- productId: product.productId || '',
- product: product.product || product.productName || '',
- specificationId: product.specificationId || '',
- specification: product.specification || '',
- quantity: product.quantity || 0,
- unit: product.unit || '',
- unitPrice: product.unitPrice || 0,
- amount: product.amount || 0
- })) : []
- form.subtotal = row.subtotal || 0
- form.freight = row.freight || 0
- form.otherFee = row.otherFee || 0
- form.discountRate = row.discountRate || 0
- form.discountAmount = row.discountAmount || 0
- form.totalAmount = row.totalAmount || 0
- dialogVisible.value = true
-}
-
-
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ユ姤浠峰崟鍚楋紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- const index = quotationList.value.findIndex(item => item.id === row.id)
- if (index > -1) {
- deleteQuotation(row.id).then(res=>{
- // console.log(res)
- if(res.code===200){
- ElMessage.success('鍒犻櫎鎴愬姛')
- handleSearch()
- }
- })
- // quotationList.value.splice(index, 1)
- // pagination.total--
- // ElMessage.success('鍒犻櫎鎴愬姛')
+ // 璁＄畻灞炴��
+ const filteredList = computed(() => {
+ let list = quotationList.value;
+ if (searchForm.quotationNo) {
+ list = list.filter(item =>
+ item.quotationNo.includes(searchForm.quotationNo)
+ );
}
- })
-}
-
-const resetForm = () => {
- form.customer = ''
- form.salesperson = ''
- form.quotationDate = ''
- form.validDate = ''
- form.paymentMethod = ''
- form.deliveryPeriod = ''
- form.status = '鑽夌'
- form.remark = ''
- form.products = []
- form.subtotal = 0
- form.freight = 0
- form.otherFee = 0
- form.discountRate = 0
- form.discountAmount = 0
- form.totalAmount = 0
-}
-
-const addProduct = () => {
- form.products.push({
- productId: '',
- product: '',
- productName: '',
- specificationId: '',
- specification: '',
- quantity: 1,
- unit: '',
- unitPrice: 0,
- amount: 0
- })
-}
-
-const removeProduct = (index) => {
- form.products.splice(index, 1)
- calculateSubtotal()
-}
-
-const calculateAmount = (product) => {
- product.amount = product.quantity * product.unitPrice
- calculateSubtotal()
-}
-
-const calculateSubtotal = () => {
- form.subtotal = form.products.reduce((sum, product) => sum + product.amount, 0)
- calculateTotal()
-}
-
-const calculateTotal = () => {
- form.discountAmount = form.subtotal * (form.discountRate / 100)
- form.totalAmount = form.subtotal + form.freight + form.otherFee - form.discountAmount
-}
-
-const handleCustomerChange = () => {
- // 鍙互鏍规嵁瀹㈡埛淇℃伅鑷姩濉厖涓�浜涢粯璁ゅ��
-}
-
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (form.products.length === 0) {
- ElMessage.warning('璇疯嚦灏戞坊鍔犱竴涓骇鍝�')
- return
- }
-
- if (isEdit.value) {
- // 缂栬緫
- const index = quotationList.value.findIndex(item => item.id === editId.value)
- if (index > -1) {
- updateQuotation(form).then(res=>{
- // console.log(res)
- if(res.code===200){
- ElMessage.success('缂栬緫鎴愬姛')
- dialogVisible.value = false
- handleSearch()
- }
- })
- // quotationList.value[index] = { ...form, id: editId.value }
- // ElMessage.success('缂栬緫鎴愬姛')
- }
- } else {
- // 鏂板
- // const newId = Math.max(...quotationList.value.map(item => item.id)) + 1
- form.quotationNo = `QT${new Date().getFullYear()}${String(new Date().getMonth() + 1).padStart(2, '0')}${String(new Date().getDate()).padStart(2, '0')}`
-
- addQuotation(form).then(res=>{
- // console.log(res)
- if(res.code===200){
- ElMessage.success('鏂板鎴愬姛')
- dialogVisible.value = false
- handleSearch()
- }
- })
-
- // quotationList.value.push({
- // ...form,
- // // id: newId,
- // quotationNo: quotationNo
- // })
- // pagination.total++
- // ElMessage.success('鏂板鎴愬姛')
- }
-
+ if (searchForm.customer) {
+ list = list.filter(item => item.customer === searchForm.customer);
}
- })
-}
+ if (searchForm.status) {
+ list = list.filter(item => item.status === searchForm.status);
+ }
+ return list;
+ });
-const handleCurrentChange = (val) => {
- pagination.currentPage = val.page
- pagination.pageSize = val.limit
-}
-const handleSearch = ()=>{
- const params = {
- page:pagination,
- ...searchForm
- }
- getQuotationList(params).then(res=>{
- // console.log(res)
- if(res.code===200){
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鎴栧叾浠栧璞℃斁鍏ュ搷搴斿紡瀵硅薄
- quotationList.value = (res.data.records || []).map(item => ({
+ // 鏂规硶
+ const getStatusType = status => {
+ const statusMap = {
+ 鑽夌: "info",
+ 宸插彂閫�: "primary",
+ 瀹㈡埛纭: "success",
+ 宸茶繃鏈�: "danger",
+ };
+ return statusMap[status] || "info";
+ };
+
+ const resetSearch = () => {
+ searchForm.quotationNo = "";
+ searchForm.customer = "";
+ searchForm.status = "";
+ };
+
+ const handleAdd = async () => {
+ dialogTitle.value = "鏂板鎶ヤ环";
+ isEdit.value = false;
+ resetForm();
+ dialogVisible.value = true;
+ let userLists = await userListNoPage();
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
+ userList.value = (userLists.data || []).map(item => ({
+ userId: item.userId,
+ nickName: item.nickName || "",
+ userName: item.userName || "",
+ }));
+ getProductOptions();
+ customerList().then(res => {
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
+ customerOption.value = (Array.isArray(res) ? res : []).map(item => ({
id: item.id,
- quotationNo: item.quotationNo || '',
- customer: item.customer || '',
- salesperson: item.salesperson || '',
- quotationDate: item.quotationDate || '',
- validDate: item.validDate || '',
- paymentMethod: item.paymentMethod || '',
- deliveryPeriod: item.deliveryPeriod || '',
- status: item.status || '鑽夌',
- remark: item.remark || '',
- products: item.products ? item.products.map(product => ({
- productId: product.productId || '',
- product: product.product || product.productName || '',
- specificationId: product.specificationId || '',
- specification: product.specification || '',
- quantity: product.quantity || 0,
- unit: product.unit || '',
- unitPrice: product.unitPrice || 0,
- amount: product.amount || 0
- })) : [],
- subtotal: item.subtotal || 0,
- freight: item.freight || 0,
- otherFee: item.otherFee || 0,
- discountRate: item.discountRate || 0,
- discountAmount: item.discountAmount || 0,
- totalAmount: item.totalAmount || 0
- }))
- pagination.total = res.data.total
- }
- })
- customerList().then((res) => {
- // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
- customerOption.value = (Array.isArray(res) ? res : []).map(item => ({
- id: item.id,
- customerName: item.customerName || '',
- taxpayerIdentificationNumber: item.taxpayerIdentificationNumber || ''
- }))
- });
-}
+ customerName: item.customerName || "",
+ taxpayerIdentificationNumber: item.taxpayerIdentificationNumber || "",
+ }));
+ });
+ };
+ const getProductOptions = () => {
+ productTreeList().then(res => {
+ productOptions.value = convertIdToValue(res);
+ });
+ };
+ function convertIdToValue(data) {
+ return data.map(item => {
+ const { id, children, ...rest } = item;
+ const newItem = {
+ ...rest,
+ value: id, // 灏� id 鏀逛负 value
+ };
+ if (children && children.length > 0) {
+ newItem.children = convertIdToValue(children);
+ }
-onMounted(()=>{
- handleSearch()
-})
+ return newItem;
+ });
+ }
+ const getModels = (value, row) => {
+ if (!row) return;
+ // 濡傛灉娓呯┖閫夋嫨锛屽垯娓呯┖鐩稿叧瀛楁
+ if (!value) {
+ row.productId = "";
+ row.product = "";
+ modelOptions.value = [];
+ row.specificationId = "";
+ row.specification = "";
+ row.unit = "";
+ return;
+ }
+ // 鏇存柊 productId锛坴-model 宸茬粡鑷姩鏇存柊锛岃繖閲岀‘淇濅竴鑷存�э級
+ row.productId = value;
+ // 鎵惧埌瀵瑰簲鐨� label 骞惰祴鍊肩粰 row.product
+ const label = findNodeById(productOptions.value, value);
+ if (label) {
+ row.product = label;
+ }
+ // 鑾峰彇瑙勬牸鍨嬪彿鍒楄〃
+ modelList({ id: value }).then(res => {
+ modelOptions.value = res || [];
+ });
+ };
+ const getProductModel = (value, row) => {
+ if (!row) return;
+ // 濡傛灉娓呯┖閫夋嫨锛屽垯娓呯┖鐩稿叧瀛楁
+ if (!value) {
+ row.specificationId = "";
+ row.specification = "";
+ row.unit = "";
+ return;
+ }
+ // 鏇存柊 specificationId锛坴-model 宸茬粡鑷姩鏇存柊锛岃繖閲岀‘淇濅竴鑷存�э級
+ row.specificationId = value;
+ const index = modelOptions.value.findIndex(item => item.id === value);
+ if (index !== -1) {
+ row.specification = modelOptions.value[index].model;
+ row.unit = modelOptions.value[index].unit;
+ } else {
+ row.specification = "";
+ row.unit = "";
+ }
+ };
+ const findNodeById = (nodes, productId) => {
+ for (let i = 0; i < nodes.length; i++) {
+ if (nodes[i].value === productId) {
+ return nodes[i].label; // 鎵惧埌鑺傜偣锛岃繑鍥� label
+ }
+ if (nodes[i].children && nodes[i].children.length > 0) {
+ const foundLabel = findNodeById(nodes[i].children, productId);
+ if (foundLabel) {
+ return foundLabel; // 鍦ㄥ瓙鑺傜偣涓壘鍒帮紝杩斿洖 label
+ }
+ }
+ }
+ return null; // 娌℃湁鎵惧埌鑺傜偣锛岃繑鍥瀗ull
+ };
+ const handleView = row => {
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
+ currentQuotation.value = {
+ quotationNo: row.quotationNo || "",
+ customer: row.customer || "",
+ salesperson: row.salesperson || "",
+ quotationDate: row.quotationDate || "",
+ validDate: row.validDate || "",
+ paymentMethod: row.paymentMethod || "",
+ deliveryPeriod: row.deliveryPeriod || "",
+ status: row.status || "",
+ remark: row.remark || "",
+ products: row.products
+ ? row.products.map(product => ({
+ productId: product.productId || "",
+ product: product.product || product.productName || "",
+ specificationId: product.specificationId || "",
+ specification: product.specification || "",
+ quantity: product.quantity || 0,
+ unit: product.unit || "",
+ unitPrice: product.unitPrice || 0,
+ amount: product.amount || 0,
+ }))
+ : [],
+ totalAmount: row.totalAmount || 0,
+ };
+ viewDialogVisible.value = true;
+ };
+
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫鎶ヤ环";
+ isEdit.value = true;
+ editId.value = row.id;
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
+ form.quotationNo = row.quotationNo || "";
+ form.customer = row.customer || "";
+ form.salesperson = row.salesperson || "";
+ form.quotationDate = row.quotationDate || "";
+ form.validDate = row.validDate || "";
+ form.paymentMethod = row.paymentMethod || "";
+ form.deliveryPeriod = row.deliveryPeriod || "";
+ form.status = row.status || "鑽夌";
+ form.remark = row.remark || "";
+ form.products = row.products
+ ? row.products.map(product => ({
+ productId: product.productId || "",
+ product: product.product || product.productName || "",
+ specificationId: product.specificationId || "",
+ specification: product.specification || "",
+ quantity: product.quantity || 0,
+ unit: product.unit || "",
+ unitPrice: product.unitPrice || 0,
+ amount: product.amount || 0,
+ }))
+ : [];
+ form.subtotal = row.subtotal || 0;
+ form.freight = row.freight || 0;
+ form.otherFee = row.otherFee || 0;
+ form.discountRate = row.discountRate || 0;
+ form.discountAmount = row.discountAmount || 0;
+ form.totalAmount = row.totalAmount || 0;
+ dialogVisible.value = true;
+ };
+
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ユ姤浠峰崟鍚楋紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ const index = quotationList.value.findIndex(item => item.id === row.id);
+ if (index > -1) {
+ deleteQuotation(row.id).then(res => {
+ // console.log(res)
+ if (res.code === 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ handleSearch();
+ }
+ });
+ // quotationList.value.splice(index, 1)
+ // pagination.total--
+ // ElMessage.success('鍒犻櫎鎴愬姛')
+ }
+ });
+ };
+
+ const resetForm = () => {
+ form.customer = "";
+ form.salesperson = "";
+ form.quotationDate = "";
+ form.validDate = "";
+ form.paymentMethod = "";
+ form.deliveryPeriod = "";
+ form.status = "鑽夌";
+ form.remark = "";
+ form.products = [];
+ form.subtotal = 0;
+ form.freight = 0;
+ form.otherFee = 0;
+ form.discountRate = 0;
+ form.discountAmount = 0;
+ form.totalAmount = 0;
+ };
+
+ const addProduct = () => {
+ form.products.push({
+ productId: "",
+ product: "",
+ productName: "",
+ specificationId: "",
+ specification: "",
+ quantity: 1,
+ unit: "",
+ unitPrice: 0,
+ amount: 0,
+ });
+ };
+
+ const removeProduct = index => {
+ form.products.splice(index, 1);
+ calculateSubtotal();
+ };
+
+ const calculateAmount = product => {
+ product.amount = product.quantity * product.unitPrice;
+ calculateSubtotal();
+ };
+
+ const calculateSubtotal = () => {
+ form.subtotal = form.products.reduce(
+ (sum, product) => sum + product.amount,
+ 0
+ );
+ calculateTotal();
+ };
+
+ const calculateTotal = () => {
+ form.discountAmount = form.subtotal * (form.discountRate / 100);
+ form.totalAmount =
+ form.subtotal + form.freight + form.otherFee - form.discountAmount;
+ };
+
+ const handleCustomerChange = () => {
+ // 鍙互鏍规嵁瀹㈡埛淇℃伅鑷姩濉厖涓�浜涢粯璁ゅ��
+ };
+
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (form.products.length === 0) {
+ ElMessage.warning("璇疯嚦灏戞坊鍔犱竴涓骇鍝�");
+ return;
+ }
+
+ if (isEdit.value) {
+ // 缂栬緫
+ const index = quotationList.value.findIndex(
+ item => item.id === editId.value
+ );
+ if (index > -1) {
+ updateQuotation(form).then(res => {
+ // console.log(res)
+ if (res.code === 200) {
+ ElMessage.success("缂栬緫鎴愬姛");
+ dialogVisible.value = false;
+ handleSearch();
+ }
+ });
+ // quotationList.value[index] = { ...form, id: editId.value }
+ // ElMessage.success('缂栬緫鎴愬姛')
+ }
+ } else {
+ // 鏂板
+ // const newId = Math.max(...quotationList.value.map(item => item.id)) + 1
+ form.quotationNo = `QT${new Date().getFullYear()}${String(
+ new Date().getMonth() + 1
+ ).padStart(2, "0")}${String(new Date().getDate()).padStart(2, "0")}`;
+
+ addQuotation(form).then(res => {
+ // console.log(res)
+ if (res.code === 200) {
+ ElMessage.success("鏂板鎴愬姛");
+ dialogVisible.value = false;
+ handleSearch();
+ }
+ });
+
+ // quotationList.value.push({
+ // ...form,
+ // // id: newId,
+ // quotationNo: quotationNo
+ // })
+ // pagination.total++
+ // ElMessage.success('鏂板鎴愬姛')
+ }
+ }
+ });
+ };
+
+ const handleCurrentChange = val => {
+ pagination.currentPage = val.page;
+ pagination.pageSize = val.limit;
+ };
+ const handleSearch = () => {
+ const params = {
+ page: pagination,
+ ...searchForm,
+ };
+ getQuotationList(params).then(res => {
+ // console.log(res)
+ if (res.code === 200) {
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鎴栧叾浠栧璞℃斁鍏ュ搷搴斿紡瀵硅薄
+ quotationList.value = (res.data.records || []).map(item => ({
+ id: item.id,
+ quotationNo: item.quotationNo || "",
+ customer: item.customer || "",
+ salesperson: item.salesperson || "",
+ quotationDate: item.quotationDate || "",
+ validDate: item.validDate || "",
+ paymentMethod: item.paymentMethod || "",
+ deliveryPeriod: item.deliveryPeriod || "",
+ status: item.status || "鑽夌",
+ remark: item.remark || "",
+ products: item.products
+ ? item.products.map(product => ({
+ productId: product.productId || "",
+ product: product.product || product.productName || "",
+ specificationId: product.specificationId || "",
+ specification: product.specification || "",
+ quantity: product.quantity || 0,
+ unit: product.unit || "",
+ unitPrice: product.unitPrice || 0,
+ amount: product.amount || 0,
+ }))
+ : [],
+ subtotal: item.subtotal || 0,
+ freight: item.freight || 0,
+ otherFee: item.otherFee || 0,
+ discountRate: item.discountRate || 0,
+ discountAmount: item.discountAmount || 0,
+ totalAmount: item.totalAmount || 0,
+ }));
+ pagination.total = res.data.total;
+ }
+ });
+ customerList().then(res => {
+ // 鍙鍒堕渶瑕佺殑瀛楁锛岄伩鍏嶅皢缁勪欢寮曠敤鏀惧叆鍝嶅簲寮忓璞�
+ customerOption.value = (Array.isArray(res) ? res : []).map(item => ({
+ id: item.id,
+ customerName: item.customerName || "",
+ taxpayerIdentificationNumber: item.taxpayerIdentificationNumber || "",
+ }));
+ });
+ };
+
+ onMounted(() => {
+ handleSearch();
+ });
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
-.form-card {
- margin-bottom: 20px;
-}
+ .form-card {
+ margin-bottom: 20px;
+ }
-.card-title {
- font-weight: bold;
- color: #303133;
-}
+ .card-title {
+ font-weight: bold;
+ color: #303133;
+ }
-.card-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
+ .card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
-.dialog-footer {
- text-align: right;
-}
+ .dialog-footer {
+ text-align: right;
+ }
</style>
diff --git a/src/views/salesManagement/salespersonManagement/index.vue b/src/views/salesManagement/salespersonManagement/index.vue
index e597538..3f25d9a 100644
--- a/src/views/salesManagement/salespersonManagement/index.vue
+++ b/src/views/salesManagement/salespersonManagement/index.vue
@@ -2,146 +2,207 @@
<div class="app-container">
<el-card class="box-card">
<!-- 鎼滅储鍖哄煙 -->
- <el-row :gutter="20" class="search-row">
+ <el-row :gutter="20"
+ class="search-row">
<el-col :span="6">
- <el-input
- v-model="searchForm.name"
- placeholder="璇疯緭鍏ヤ笟鍔″憳濮撳悕"
- clearable
- @keyup.enter="handleSearch"
- >
+ <el-input v-model="searchForm.name"
+ placeholder="璇疯緭鍏ヤ笟鍔″憳濮撳悕"
+ clearable
+ @keyup.enter="handleSearch">
<template #prefix>
- <el-icon><Search /></el-icon>
+ <el-icon>
+ <Search />
+ </el-icon>
</template>
</el-input>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.department" placeholder="璇烽�夋嫨閮ㄩ棬" clearable>
- <el-option label="閿�鍞儴" value="閿�鍞儴"></el-option>
- <el-option label="甯傚満閮�" value="甯傚満閮�"></el-option>
- <el-option label="瀹㈡湇閮�" value="瀹㈡湇閮�"></el-option>
+ <el-select v-model="searchForm.department"
+ placeholder="璇烽�夋嫨閮ㄩ棬"
+ clearable>
+ <el-option label="閿�鍞儴"
+ value="閿�鍞儴"></el-option>
+ <el-option label="甯傚満閮�"
+ value="甯傚満閮�"></el-option>
+ <el-option label="瀹㈡湇閮�"
+ value="瀹㈡湇閮�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鐘舵��" clearable>
- <el-option label="鍦ㄨ亴" value="鍦ㄨ亴"></el-option>
- <el-option label="绂昏亴" value="绂昏亴"></el-option>
- <el-option label="璇曠敤鏈�" value="璇曠敤鏈�"></el-option>
+ <el-select v-model="searchForm.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ clearable>
+ <el-option label="鍦ㄨ亴"
+ value="鍦ㄨ亴"></el-option>
+ <el-option label="绂昏亴"
+ value="绂昏亴"></el-option>
+ <el-option label="璇曠敤鏈�"
+ value="璇曠敤鏈�"></el-option>
</el-select>
</el-col>
<el-col :span="6">
- <el-button type="primary" @click="handleSearch">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
- <el-button type="primary" style="float: right;" @click="handleAdd">鏂板涓氬姟鍛�</el-button>
+ <el-button type="primary"
+ style="float: right;"
+ @click="handleAdd">鏂板涓氬姟鍛�</el-button>
</el-col>
</el-row>
-
<!-- 涓氬姟鍛樺垪琛� -->
- <el-table
- :data="filteredList"
- style="width: 100%"
- v-loading="loading"
- border
- stripe
- height="calc(100vh - 22em)"
- >
- <el-table-column prop="id" label="ID" width="80" align="center"/>
- <el-table-column prop="name" label="濮撳悕" width="120" />
- <el-table-column prop="phone" label="鑱旂郴鐢佃瘽" width="140" />
- <el-table-column prop="email" label="閭" width="200" />
- <el-table-column prop="department" label="閮ㄩ棬" width="100" />
- <el-table-column prop="position" label="鑱屼綅" width="100" />
- <el-table-column prop="hireDate" label="鍏ヨ亴鏃ユ湡" width="120" />
- <el-table-column prop="status" label="鐘舵��" width="80">
+ <el-table :data="filteredList"
+ style="width: 100%"
+ v-loading="loading"
+ border
+ stripe
+ height="calc(100vh - 22em)">
+ <el-table-column prop="id"
+ label="ID"
+ width="80"
+ align="center" />
+ <el-table-column prop="name"
+ label="濮撳悕"
+ width="120" />
+ <el-table-column prop="phone"
+ label="鑱旂郴鐢佃瘽"
+ width="140" />
+ <el-table-column prop="email"
+ label="閭"
+ width="200" />
+ <el-table-column prop="department"
+ label="閮ㄩ棬"
+ width="100" />
+ <el-table-column prop="position"
+ label="鑱屼綅"
+ width="100" />
+ <el-table-column prop="hireDate"
+ label="鍏ヨ亴鏃ユ湡"
+ width="120" />
+ <el-table-column prop="status"
+ label="鐘舵��"
+ width="80">
<template #default="scope">
<el-tag :type="getStatusType(scope.row.status)">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
- <el-table-column prop="permissions" label="鏉冮檺">
+ <el-table-column prop="permissions"
+ label="鏉冮檺">
<template #default="scope">
- <el-tag v-for="perm in scope.row.permissionsList" :key="perm" size="small" style="margin-right: 5px;">
+ <el-tag v-for="perm in scope.row.permissionsList"
+ :key="perm"
+ size="small"
+ style="margin-right: 5px;">
{{ perm }}
</el-tag>
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="200" fixed="right" align="center">
+ <el-table-column label="鎿嶄綔"
+ width="200"
+ fixed="right"
+ align="center">
<template #default="scope">
- <el-button link type="primary" @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button link type="primary" @click="handlePermissions(scope.row)">鏉冮檺</el-button>
- <el-button link type="danger" @click="handleDelete(scope.row)">鍒犻櫎</el-button>
+ <el-button link
+ type="primary"
+ @click="handleEdit(scope.row)">缂栬緫</el-button>
+ <el-button link
+ type="primary"
+ @click="handlePermissions(scope.row)">鏉冮檺</el-button>
+ <el-button link
+ type="danger"
+ @click="handleDelete(scope.row)">鍒犻櫎</el-button>
</template>
</el-table-column>
</el-table>
-
<!-- 鍒嗛〉 -->
- <pagination
- :total="total"
- layout="total, sizes, prev, pager, next, jumper"
- :page="pagination.current"
- :limit="pagination.size"
- @pagination="handleCurrentChange"
- />
+ <pagination :total="total"
+ layout="total, sizes, prev, pager, next, jumper"
+ :page="pagination.current"
+ :limit="pagination.size"
+ @pagination="handleCurrentChange" />
</el-card>
-
<!-- 鏂板/缂栬緫瀵硅瘽妗� -->
- <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px">
- <el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
+ <el-dialog v-model="dialogVisible"
+ :title="dialogTitle"
+ width="600px">
+ <el-form :model="form"
+ :rules="rules"
+ ref="formRef"
+ label-width="100px">
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="濮撳悕" prop="name">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ュ鍚�"></el-input>
+ <el-form-item label="濮撳悕"
+ prop="name">
+ <el-input v-model="form.name"
+ placeholder="璇疯緭鍏ュ鍚�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鑱旂郴鐢佃瘽" prop="phone">
- <el-input v-model="form.phone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�"></el-input>
+ <el-form-item label="鑱旂郴鐢佃瘽"
+ prop="phone">
+ <el-input v-model="form.phone"
+ placeholder="璇疯緭鍏ヨ仈绯荤數璇�"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="閭" prop="email">
- <el-input v-model="form.email" placeholder="璇疯緭鍏ラ偖绠�"></el-input>
+ <el-form-item label="閭"
+ prop="email">
+ <el-input v-model="form.email"
+ placeholder="璇疯緭鍏ラ偖绠�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="閮ㄩ棬" prop="department">
- <el-select v-model="form.department" placeholder="璇烽�夋嫨閮ㄩ棬" style="width: 100%">
- <el-option label="閿�鍞儴" value="閿�鍞儴"></el-option>
- <el-option label="甯傚満閮�" value="甯傚満閮�"></el-option>
- <el-option label="瀹㈡湇閮�" value="瀹㈡湇閮�"></el-option>
+ <el-form-item label="閮ㄩ棬"
+ prop="department">
+ <el-select v-model="form.department"
+ placeholder="璇烽�夋嫨閮ㄩ棬"
+ style="width: 100%">
+ <el-option label="閿�鍞儴"
+ value="閿�鍞儴"></el-option>
+ <el-option label="甯傚満閮�"
+ value="甯傚満閮�"></el-option>
+ <el-option label="瀹㈡湇閮�"
+ value="瀹㈡湇閮�"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鑱屼綅" prop="position">
- <el-input v-model="form.position" placeholder="璇疯緭鍏ヨ亴浣�"></el-input>
+ <el-form-item label="鑱屼綅"
+ prop="position">
+ <el-input v-model="form.position"
+ placeholder="璇疯緭鍏ヨ亴浣�"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="鍏ヨ亴鏃ユ湡" prop="hireDate">
- <el-date-picker
- v-model="form.hireDate"
- type="date"
- placeholder="閫夋嫨鍏ヨ亴鏃ユ湡"
- style="width: 100%"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- />
+ <el-form-item label="鍏ヨ亴鏃ユ湡"
+ prop="hireDate">
+ <el-date-picker v-model="form.hireDate"
+ type="date"
+ placeholder="閫夋嫨鍏ヨ亴鏃ユ湡"
+ style="width: 100%"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��" style="width: 100%">
- <el-option label="鍦ㄨ亴" value="鍦ㄨ亴"></el-option>
- <el-option label="绂昏亴" value="绂昏亴"></el-option>
- <el-option label="璇曠敤鏈�" value="璇曠敤鏈�"></el-option>
+ <el-form-item label="鐘舵��"
+ prop="status">
+ <el-select v-model="form.status"
+ placeholder="璇烽�夋嫨鐘舵��"
+ style="width: 100%">
+ <el-option label="鍦ㄨ亴"
+ value="鍦ㄨ亴"></el-option>
+ <el-option label="绂昏亴"
+ value="绂昏亴"></el-option>
+ <el-option label="璇曠敤鏈�"
+ value="璇曠敤鏈�"></el-option>
</el-select>
</el-form-item>
</el-col>
@@ -149,14 +210,16 @@
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="handleSubmit">纭� 瀹�</el-button>
<el-button @click="dialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="handleSubmit">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
-
<!-- 鏉冮檺璁剧疆瀵硅瘽妗� -->
- <el-dialog v-model="permissionDialogVisible" title="鏉冮檺璁剧疆" width="500px">
+ <el-dialog v-model="permissionDialogVisible"
+ title="鏉冮檺璁剧疆"
+ width="500px">
<el-form label-width="100px">
<el-form-item label="涓氬姟鍛樺鍚�">
<span>{{ currentSalesperson.name }}</span>
@@ -174,8 +237,9 @@
</el-form>
<template #footer>
<div class="dialog-footer">
+ <el-button type="primary"
+ @click="savePermissions">纭� 瀹�</el-button>
<el-button @click="permissionDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="savePermissions">纭� 瀹�</el-button>
</div>
</template>
</el-dialog>
@@ -183,200 +247,201 @@
</template>
<script setup>
-import { ref, reactive, computed,onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import {listPage,add,update,deleteSalespersonManagement} from '@/api/salesManagement/salespersonManagement.js'
-import { Plus, Search } from '@element-plus/icons-vue'
-import Pagination from '@/components/PIMTable/Pagination.vue'
+ import { ref, reactive, computed, onMounted } from "vue";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import {
+ listPage,
+ add,
+ update,
+ deleteSalespersonManagement,
+ } from "@/api/salesManagement/salespersonManagement.js";
+ import { Plus, Search } from "@element-plus/icons-vue";
+ import Pagination from "@/components/PIMTable/Pagination.vue";
-const salespersonList = ref([])
-const total = ref(0)
+ const salespersonList = ref([]);
+ const total = ref(0);
-onMounted(() => {
- getList()
-})
-const getList = () => {
- loading.value = true
- listPage({...pagination,...searchForm}).then(res => {
- salespersonList.value = res.data.records
- total.value = res.data.total
- loading.value = false
- })
-}
+ onMounted(() => {
+ getList();
+ });
+ const getList = () => {
+ loading.value = true;
+ listPage({ ...pagination, ...searchForm }).then(res => {
+ salespersonList.value = res.data.records;
+ total.value = res.data.total;
+ loading.value = false;
+ });
+ };
-// 鍝嶅簲寮忔暟鎹�
-const loading = ref(false)
-const searchForm = reactive({
- name: '',
- department: '',
- status: ''
-})
+ // 鍝嶅簲寮忔暟鎹�
+ const loading = ref(false);
+ const searchForm = reactive({
+ name: "",
+ department: "",
+ status: "",
+ });
+ const pagination = reactive({
+ current: 1,
+ size: 10,
+ });
+ const dialogVisible = ref(false);
+ const dialogTitle = ref("鏂板涓氬姟鍛�");
+ const form = reactive({
+ name: "",
+ phone: "",
+ email: "",
+ department: "",
+ position: "",
+ hireDate: "",
+ status: "鍦ㄨ亴",
+ });
-const pagination = reactive({
- current: 1,
- size: 10
-})
+ const rules = {
+ name: [{ required: true, message: "璇疯緭鍏ュ鍚�", trigger: "blur" }],
+ phone: [{ required: true, message: "璇疯緭鍏ヨ仈绯荤數璇�", trigger: "blur" }],
+ email: [{ required: true, message: "璇疯緭鍏ラ偖绠�", trigger: "blur" }],
+ department: [{ required: true, message: "璇烽�夋嫨閮ㄩ棬", trigger: "change" }],
+ position: [{ required: true, message: "璇疯緭鍏ヨ亴浣�", trigger: "blur" }],
+ hireDate: [{ required: true, message: "璇烽�夋嫨鍏ヨ亴鏃ユ湡", trigger: "change" }],
+ status: [{ required: true, message: "璇烽�夋嫨鐘舵��", trigger: "change" }],
+ };
-const dialogVisible = ref(false)
-const dialogTitle = ref('鏂板涓氬姟鍛�')
-const form = reactive({
- name: '',
- phone: '',
- email: '',
- department: '',
- position: '',
- hireDate: '',
- status: '鍦ㄨ亴'
-})
+ const isEdit = ref(false);
+ const editId = ref(null);
+ const permissionDialogVisible = ref(false);
+ const currentSalesperson = ref({});
+ const currentPermissions = ref([]);
+ const formRef = ref();
-const rules = {
- name: [{ required: true, message: '璇疯緭鍏ュ鍚�', trigger: 'blur' }],
- phone: [{ required: true, message: '璇疯緭鍏ヨ仈绯荤數璇�', trigger: 'blur' }],
- email: [{ required: true, message: '璇疯緭鍏ラ偖绠�', trigger: 'blur' }],
- department: [{ required: true, message: '璇烽�夋嫨閮ㄩ棬', trigger: 'change' }],
- position: [{ required: true, message: '璇疯緭鍏ヨ亴浣�', trigger: 'blur' }],
- hireDate: [{ required: true, message: '璇烽�夋嫨鍏ヨ亴鏃ユ湡', trigger: 'change' }],
- status: [{ required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }]
-}
-
-const isEdit = ref(false)
-const editId = ref(null)
-const permissionDialogVisible = ref(false)
-const currentSalesperson = ref({})
-const currentPermissions = ref([])
-const formRef = ref()
-
-// 璁＄畻灞炴��
-const filteredList = computed(() => {
- let list = salespersonList.value
- if (searchForm.name) {
- list = list.filter(item => item.name.includes(searchForm.name))
- }
- if (searchForm.department) {
- list = list.filter(item => item.department === searchForm.department)
- }
- if (searchForm.status) {
- list = list.filter(item => item.status === searchForm.status)
- }
- return list
-})
-
-// 鏂规硶
-const getStatusType = (status) => {
- const statusMap = {
- '鍦ㄨ亴': 'success',
- '绂昏亴': 'danger',
- '璇曠敤鏈�': 'warning'
- }
- return statusMap[status] || 'info'
-}
-
-const handleSearch = () => {
- getList()
- // 鎼滅储閫昏緫宸插湪computed涓鐞�
-}
-
-const resetSearch = () => {
- searchForm.name = ''
- searchForm.department = ''
- searchForm.status = ''
-}
-
-const handleAdd = () => {
- dialogTitle.value = '鏂板涓氬姟鍛�'
- isEdit.value = false
- form.name = ''
- form.phone = ''
- form.email = ''
- form.department = ''
- form.position = ''
- form.hireDate = ''
- form.status = '鍦ㄨ亴'
- dialogVisible.value = true
-}
-
-const handleEdit = (row) => {
- dialogTitle.value = '缂栬緫涓氬姟鍛�'
- isEdit.value = true
- editId.value = row.id
- Object.assign(form, row)
- dialogVisible.value = true
-}
-
-const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ヤ笟鍔″憳鍚楋紵', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
- let ids = [row.id]
- deleteSalespersonManagement(ids).then(res => {
- if(res.code === 200){
- ElMessage.success('鍒犻櫎鎴愬姛')
- getList()
- }
- })
- })
-}
-
-const handlePermissions = (row) => {
- currentSalesperson.value = row
- currentPermissions.value = row.permissions.split(",")
- permissionDialogVisible.value = true
-}
-
-const savePermissions = () => {
- let splice = currentPermissions.value;
- if(splice[0] === ''){
- splice.splice(0,1)
- }
- currentSalesperson.value.permissions = splice.join(",")
- update(currentSalesperson.value).then(res => {
- if(res.code === 200){
- ElMessage.success('鏉冮檺璁剧疆鎴愬姛')
- permissionDialogVisible.value = false
- getList()
+ // 璁＄畻灞炴��
+ const filteredList = computed(() => {
+ let list = salespersonList.value;
+ if (searchForm.name) {
+ list = list.filter(item => item.name.includes(searchForm.name));
}
- })
-}
-
-const handleSubmit = () => {
- formRef.value.validate((valid) => {
- if (valid) {
- if (isEdit.value) {
- // 缂栬緫
- update(form).then(res => {
- if(res.code === 200){
- ElMessage.success('缂栬緫鎴愬姛')
- dialogVisible.value = false
- getList()
- }
- })
- } else {
- add(form).then(res => {
- if(res.code === 200){
- ElMessage.success('鏂板鎴愬姛')
- dialogVisible.value = false
- getList()
- }
- })
-
- }
-
+ if (searchForm.department) {
+ list = list.filter(item => item.department === searchForm.department);
}
- })
-}
+ if (searchForm.status) {
+ list = list.filter(item => item.status === searchForm.status);
+ }
+ return list;
+ });
-const handleCurrentChange = (val) => {
- pagination.value.currentPage = val.page
- pagination.value.pageSize = val.limit
-}
+ // 鏂规硶
+ const getStatusType = status => {
+ const statusMap = {
+ 鍦ㄨ亴: "success",
+ 绂昏亴: "danger",
+ 璇曠敤鏈�: "warning",
+ };
+ return statusMap[status] || "info";
+ };
+
+ const handleSearch = () => {
+ getList();
+ // 鎼滅储閫昏緫宸插湪computed涓鐞�
+ };
+
+ const resetSearch = () => {
+ searchForm.name = "";
+ searchForm.department = "";
+ searchForm.status = "";
+ };
+
+ const handleAdd = () => {
+ dialogTitle.value = "鏂板涓氬姟鍛�";
+ isEdit.value = false;
+ form.name = "";
+ form.phone = "";
+ form.email = "";
+ form.department = "";
+ form.position = "";
+ form.hireDate = "";
+ form.status = "鍦ㄨ亴";
+ dialogVisible.value = true;
+ };
+
+ const handleEdit = row => {
+ dialogTitle.value = "缂栬緫涓氬姟鍛�";
+ isEdit.value = true;
+ editId.value = row.id;
+ Object.assign(form, row);
+ dialogVisible.value = true;
+ };
+
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ヤ笟鍔″憳鍚楋紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(() => {
+ let ids = [row.id];
+ deleteSalespersonManagement(ids).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ }
+ });
+ });
+ };
+
+ const handlePermissions = row => {
+ currentSalesperson.value = row;
+ currentPermissions.value = row.permissions.split(",");
+ permissionDialogVisible.value = true;
+ };
+
+ const savePermissions = () => {
+ let splice = currentPermissions.value;
+ if (splice[0] === "") {
+ splice.splice(0, 1);
+ }
+ currentSalesperson.value.permissions = splice.join(",");
+ update(currentSalesperson.value).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鏉冮檺璁剧疆鎴愬姛");
+ permissionDialogVisible.value = false;
+ getList();
+ }
+ });
+ };
+
+ const handleSubmit = () => {
+ formRef.value.validate(valid => {
+ if (valid) {
+ if (isEdit.value) {
+ // 缂栬緫
+ update(form).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("缂栬緫鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ });
+ } else {
+ add(form).then(res => {
+ if (res.code === 200) {
+ ElMessage.success("鏂板鎴愬姛");
+ dialogVisible.value = false;
+ getList();
+ }
+ });
+ }
+ }
+ });
+ };
+
+ const handleCurrentChange = val => {
+ pagination.value.currentPage = val.page;
+ pagination.value.pageSize = val.limit;
+ };
</script>
<style scoped>
-.search-row {
- margin-bottom: 20px;
-}
+ .search-row {
+ margin-bottom: 20px;
+ }
</style>
diff --git a/src/views/tool/gen/importTable.vue b/src/views/tool/gen/importTable.vue
index 23dbf28..67e4723 100644
--- a/src/views/tool/gen/importTable.vue
+++ b/src/views/tool/gen/importTable.vue
@@ -1,49 +1,66 @@
<template>
<!-- 瀵煎叆琛� -->
- <el-dialog title="瀵煎叆琛�" v-model="visible" width="800px" top="5vh" append-to-body>
- <el-form :model="queryParams" ref="queryRef" :inline="true">
- <el-form-item label="琛ㄥ悕绉�" prop="tableName">
- <el-input
- v-model="queryParams.tableName"
- placeholder="璇疯緭鍏ヨ〃鍚嶇О"
- clearable
- style="width: 180px"
- @keyup.enter="handleQuery"
- />
+ <el-dialog title="瀵煎叆琛�"
+ v-model="visible"
+ width="800px"
+ top="5vh"
+ append-to-body>
+ <el-form :model="queryParams"
+ ref="queryRef"
+ :inline="true">
+ <el-form-item label="琛ㄥ悕绉�"
+ prop="tableName">
+ <el-input v-model="queryParams.tableName"
+ placeholder="璇疯緭鍏ヨ〃鍚嶇О"
+ clearable
+ style="width: 180px"
+ @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="琛ㄦ弿杩�" prop="tableComment">
- <el-input
- v-model="queryParams.tableComment"
- placeholder="璇疯緭鍏ヨ〃鎻忚堪"
- clearable
- style="width: 180px"
- @keyup.enter="handleQuery"
- />
+ <el-form-item label="琛ㄦ弿杩�"
+ prop="tableComment">
+ <el-input v-model="queryParams.tableComment"
+ placeholder="璇疯緭鍏ヨ〃鎻忚堪"
+ clearable
+ style="width: 180px"
+ @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ <el-button type="primary"
+ icon="Search"
+ @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh"
+ @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
</el-form>
<el-row>
- <el-table @row-click="clickRow" ref="table" :data="dbTableList" @selection-change="handleSelectionChange" height="260px">
- <el-table-column type="selection" width="55"></el-table-column>
- <el-table-column prop="tableName" label="琛ㄥ悕绉�" :show-overflow-tooltip="true"></el-table-column>
- <el-table-column prop="tableComment" label="琛ㄦ弿杩�" :show-overflow-tooltip="true"></el-table-column>
- <el-table-column prop="createTime" label="鍒涘缓鏃堕棿"></el-table-column>
- <el-table-column prop="updateTime" label="鏇存柊鏃堕棿"></el-table-column>
+ <el-table @row-click="clickRow"
+ ref="table"
+ :data="dbTableList"
+ @selection-change="handleSelectionChange"
+ height="260px">
+ <el-table-column type="selection"
+ width="55"></el-table-column>
+ <el-table-column prop="tableName"
+ label="琛ㄥ悕绉�"
+ :show-overflow-tooltip="true"></el-table-column>
+ <el-table-column prop="tableComment"
+ label="琛ㄦ弿杩�"
+ :show-overflow-tooltip="true"></el-table-column>
+ <el-table-column prop="createTime"
+ label="鍒涘缓鏃堕棿"></el-table-column>
+ <el-table-column prop="updateTime"
+ label="鏇存柊鏃堕棿"></el-table-column>
</el-table>
- <pagination
- v-show="total>0"
- :total="total"
- v-model:page="queryParams.pageNum"
- v-model:limit="queryParams.pageSize"
- @pagination="getList"
- />
+ <pagination v-show="total>0"
+ :total="total"
+ v-model:page="queryParams.pageNum"
+ v-model:limit="queryParams.pageSize"
+ @pagination="getList" />
</el-row>
<template #footer>
<div class="dialog-footer">
- <el-button type="primary" @click="handleImportTable">纭� 瀹�</el-button>
+ <el-button type="primary"
+ @click="handleImportTable">纭� 瀹�</el-button>
<el-button @click="visible = false">鍙� 娑�</el-button>
</div>
</template>
@@ -51,76 +68,76 @@
</template>
<script setup>
-import { listDbTable, importTable } from "@/api/tool/gen"
+ import { listDbTable, importTable } from "@/api/tool/gen";
-const total = ref(0)
-const visible = ref(false)
-const tables = ref([])
-const dbTableList = ref([])
-const { proxy } = getCurrentInstance()
+ const total = ref(0);
+ const visible = ref(false);
+ const tables = ref([]);
+ const dbTableList = ref([]);
+ const { proxy } = getCurrentInstance();
-const queryParams = reactive({
- pageNum: 1,
- pageSize: 10,
- tableName: undefined,
- tableComment: undefined
-})
+ const queryParams = reactive({
+ pageNum: 1,
+ pageSize: 10,
+ tableName: undefined,
+ tableComment: undefined,
+ });
-const emit = defineEmits(["ok"])
+ const emit = defineEmits(["ok"]);
-/** 鏌ヨ鍙傛暟鍒楄〃 */
-function show() {
- getList()
- visible.value = true
-}
-
-/** 鍗曞嚮閫夋嫨琛� */
-function clickRow(row) {
- proxy.$refs.table.toggleRowSelection(row)
-}
-
-/** 澶氶�夋閫変腑鏁版嵁 */
-function handleSelectionChange(selection) {
- tables.value = selection.map(item => item.tableName)
-}
-
-/** 鏌ヨ琛ㄦ暟鎹� */
-function getList() {
- listDbTable(queryParams).then(res => {
- dbTableList.value = res.rows
- total.value = res.total
- })
-}
-
-/** 鎼滅储鎸夐挳鎿嶄綔 */
-function handleQuery() {
- queryParams.pageNum = 1
- getList()
-}
-
-/** 閲嶇疆鎸夐挳鎿嶄綔 */
-function resetQuery() {
- proxy.resetForm("queryRef")
- handleQuery()
-}
-
-/** 瀵煎叆鎸夐挳鎿嶄綔 */
-function handleImportTable() {
- const tableNames = tables.value.join(",")
- if (tableNames == "") {
- proxy.$modal.msgError("璇烽�夋嫨瑕佸鍏ョ殑琛�")
- return
+ /** 鏌ヨ鍙傛暟鍒楄〃 */
+ function show() {
+ getList();
+ visible.value = true;
}
- importTable({ tables: tableNames }).then(res => {
- proxy.$modal.msgSuccess(res.msg)
- if (res.code === 200) {
- visible.value = false
- emit("ok")
- }
- })
-}
-defineExpose({
- show,
-})
+ /** 鍗曞嚮閫夋嫨琛� */
+ function clickRow(row) {
+ proxy.$refs.table.toggleRowSelection(row);
+ }
+
+ /** 澶氶�夋閫変腑鏁版嵁 */
+ function handleSelectionChange(selection) {
+ tables.value = selection.map(item => item.tableName);
+ }
+
+ /** 鏌ヨ琛ㄦ暟鎹� */
+ function getList() {
+ listDbTable(queryParams).then(res => {
+ dbTableList.value = res.rows;
+ total.value = res.total;
+ });
+ }
+
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ function handleQuery() {
+ queryParams.pageNum = 1;
+ getList();
+ }
+
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ function resetQuery() {
+ proxy.resetForm("queryRef");
+ handleQuery();
+ }
+
+ /** 瀵煎叆鎸夐挳鎿嶄綔 */
+ function handleImportTable() {
+ const tableNames = tables.value.join(",");
+ if (tableNames == "") {
+ proxy.$modal.msgError("璇烽�夋嫨瑕佸鍏ョ殑琛�");
+ return;
+ }
+ importTable({ tables: tableNames }).then(res => {
+ proxy.$modal.msgSuccess(res.msg);
+ if (res.code === 200) {
+ visible.value = false;
+ emit("ok");
+ }
+ });
+ }
+
+ defineExpose({
+ show,
+ });
</script>
--
Gitblit v1.9.3