提交

2026-07-16 08:13:05 +08:00
1 parent 5c6ace1dd3
commit 8be55c08e9
@@ -0,0 +1,115 @@
+<template>
+  <el-dialog
+    v-model="dialogVisible"
+    title="作废调价函"
+    width="560px"
+    align-center
+    append-to-body
+    destroy-on-close
+    class="dialog-form-layout"
+    modal-class="order-module-dialog-mask"
+    :close-on-click-modal="false"
+  >
+    <el-alert type="warning" :closable="false" style="margin-bottom: 16px">
+      <template #default>
+        <div><strong>注意：</strong>调价函作废后不可恢复，仅保留档案，请谨慎操作。</div>
+      </template>
+    </el-alert>
+
+    <el-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      label-position="top"
+      scroll-to-error
+      :scroll-into-view-options="{ behavior: 'smooth', block: 'center' }"
+    >
+      <div class="form-grid-2">
+        <el-form-item label="作废原因" prop="invalidReason" class="form-col-span-2">
+          <el-input
+            v-model="form.invalidReason"
+            type="textarea"
+            :rows="3"
+            placeholder="请填写作废原因"
+            maxlength="200"
+            show-word-limit
+          />
+        </el-form-item>
+        <el-form-item label="详细说明" prop="remark" class="form-col-span-2">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            :rows="3"
+            placeholder="可选，将写入备注"
+            maxlength="500"
+            show-word-limit
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+
+    <template #footer>
+      <el-button @click="dialogVisible = false">
+        <el-icon><Close /></el-icon>取消
+      </el-button>
+      <el-button type="danger" :loading="submitLoading" @click="handleConfirm">
+        <el-icon><CircleClose /></el-icon>确认作废
+      </el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+  import { Close, CircleClose } from '@element-plus/icons-vue'
+  import { fetchVoidPriceLetter } from '@/api/crm/price-letter'
+  import { $modal } from '@/utils/modal'
+
+  const emit = defineEmits(['success'])
+
+  const dialogVisible = ref(false)
+  const submitLoading = ref(false)
+  const letterId = ref('')
+  const formRef = ref()
+  const form = reactive({
+    invalidReason: '',
+    remark: ''
+  })
+
+  const rules = {
+    invalidReason: [{ required: true, message: '请填写作废原因', trigger: 'blur' }]
+  }
+
+  function open(row: { id: string }) {
+    letterId.value = row.id
+    form.invalidReason = ''
+    form.remark = ''
+    dialogVisible.value = true
+  }
+
+  async function handleConfirm() {
+    const ok = await formRef.value?.validate().catch(() => false)
+    if (!ok) return
+    try {
+      await $modal.confirm('确认作废该调价函？作废后不可恢复。')
+    } catch {
+      return
+    }
+    submitLoading.value = true
+    try {
+      await fetchVoidPriceLetter({
+        id: letterId.value,
+        invalidReason: form.invalidReason,
+        remark: form.remark || undefined
+      })
+      $modal.msgSuccess('作废成功')
+      dialogVisible.value = false
+      emit('success')
+    } catch (e: any) {
+      $modal.msgError(e?.message || '作废失败')
+    } finally {
+      submitLoading.value = false
+    }
+  }
+
+  defineExpose({ open })
+</script>