update

2026-04-21 17:24:51 +08:00
parent d47ef8d680
commit 4f45ecbd63
13 changed files with 675 additions and 105 deletions
@@ -0,0 +1,127 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="560px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="100px" :rules="formRules">
+                <el-form-item label="日期" prop="cost_date">
+                    <el-date-picker
+                        v-model="formData.cost_date"
+                        type="date"
+                        value-format="YYYY-MM-DD"
+                        placeholder="请选择日期"
+                        :disabled="mode === 'edit'"
+                    />
+                </el-form-item>
+                <el-form-item label="账户消耗" prop="amount">
+                    <el-input-number
+                        v-model="formData.amount"
+                        :min="0"
+                        :step="0.01"
+                        :precision="2"
+                        class="w-full"
+                    />
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input
+                        v-model="formData.remark"
+                        type="textarea"
+                        :autosize="{ minRows: 4, maxRows: 6 }"
+                        maxlength="255"
+                        show-word-limit
+                        placeholder="请输入备注"
+                    />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+
+import { accountCostAdd, accountCostDetail, accountCostEdit } from '@/api/finance'
+import Popup from '@/components/popup/index.vue'
+
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref<'add' | 'edit'>('add')
+
+const popupTitle = computed(() => (mode.value === 'edit' ? '编辑账户消耗' : '新增账户消耗'))
+
+const formData = reactive({
+    id: '',
+    cost_date: '',
+    amount: 0,
+    remark: '',
+})
+
+const formRules = {
+    cost_date: [
+        {
+            required: true,
+            message: '请选择日期',
+            trigger: ['change'],
+        },
+    ],
+    amount: [
+        {
+            required: true,
+            message: '请输入账户消耗金额',
+            trigger: ['blur', 'change'],
+        },
+    ],
+}
+
+const resetForm = () => {
+    formData.id = ''
+    formData.cost_date = ''
+    formData.amount = 0
+    formData.remark = ''
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    if (mode.value === 'edit') {
+        await accountCostEdit(formData)
+    } else {
+        await accountCostAdd(formData)
+    }
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type: 'add' | 'edit' = 'add') => {
+    mode.value = type
+    resetForm()
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<string, any>) => {
+    formData.id = data.id ?? ''
+    formData.cost_date = data.cost_date ?? ''
+    formData.amount = Number(data.amount ?? 0)
+    formData.remark = data.remark ?? ''
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await accountCostDetail({ id: row.id })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail,
+})
+</script>