gaoluyang
10 天以前 f3cac4aa2db56d6017c1d1dc035bcfeaec76c3e2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<script lang="ts" setup>
import type { MesProTaskApi } from '#/api/mes/pro/task';
 
import { ref } from 'vue';
 
import { useVbenModal } from '@vben/common-ui';
 
import { Button, message, Tag } from 'ant-design-vue';
import dayjs from 'dayjs';
 
import { batchCreateFeedback } from '#/api/mes/pro/feedback';
import ProTaskSelectDialog from '#/views/mes/pro/task/components/select-dialog.vue';
 
defineOptions({ name: 'BatchFeedbackForm' });
 
interface Emits {
  (e: 'success'): void;
}
 
const emit = defineEmits<Emits>();
 
const [Modal, modalApi] = useVbenModal({
  onOpenChange: (open) => {
    if (open) {
      selectedTasks.value = [];
      formData.value = {
        feedbackQuantity: undefined,
        feedbackTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
        remark: '',
      };
    }
  },
});
 
const taskDialogRef = ref<InstanceType<typeof ProTaskSelectDialog>>();
const selectedTasks = ref<MesProTaskApi.Task[]>([]);
const formData = ref({
  feedbackQuantity: undefined as number | undefined,
  feedbackTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
  remark: '',
});
const submitting = ref(false);
 
function handleOpenTaskDialog() {
  taskDialogRef.value?.open([], { multiple: true });
}
 
function handleTaskSelected(rows: MesProTaskApi.Task[]) {
  selectedTasks.value = rows;
}
 
function handleRemoveTask(taskId: number) {
  selectedTasks.value = selectedTasks.value.filter((t) => t.id !== taskId);
}
 
async function handleSubmit() {
  if (!selectedTasks.value.length) {
    message.warning('请选择任务');
    return;
  }
  if (!formData.value.feedbackQuantity) {
    message.warning('请输入报工数量');
    return;
  }
  submitting.value = true;
  try {
    const result = await batchCreateFeedback({
      taskIds: selectedTasks.value.map((t) => t.id!),
      feedbackQuantity: formData.value.feedbackQuantity,
      feedbackTime: formData.value.feedbackTime || undefined,
      remark: formData.value.remark || undefined,
    });
    if (result.failCount) {
      message.warning(
        `批量报工完成:成功 ${result.successCount} 个,失败 ${result.failCount} 个`,
      );
    } else {
      message.success(`批量报工成功,共 ${result.successCount} 个`);
    }
    modalApi.close();
    emit('success');
  } finally {
    submitting.value = false;
  }
}
</script>
 
<template>
  <Modal title="批量报工" @ok="handleSubmit">
    <a-form layout="vertical">
      <a-form-item label="选择任务" required>
        <div class="mb-2">
          <Button type="dashed" @click="handleOpenTaskDialog">
            {{ selectedTasks.length ? `已选 ${selectedTasks.length} 个任务` : '点击选择任务' }}
          </Button>
        </div>
        <div v-if="selectedTasks.length" class="flex flex-wrap gap-1">
          <Tag
            v-for="task in selectedTasks"
            :key="task.id"
            closable
            @close="handleRemoveTask(task.id!)"
          >
            {{ task.code }}
          </Tag>
        </div>
      </a-form-item>
      <a-form-item label="报工数量" required>
        <a-input-number
          v-model:value="formData.feedbackQuantity"
          :min="0.01"
          :precision="2"
          placeholder="请输入报工数量(应用到所有选中任务)"
          class="!w-full"
        />
      </a-form-item>
      <a-form-item label="报工时间">
        <a-date-picker
          v-model:value="formData.feedbackTime"
          show-time
          value-format="YYYY-MM-DD HH:mm:ss"
          class="!w-full"
        />
      </a-form-item>
      <a-form-item label="备注">
        <a-textarea
          v-model:value="formData.remark"
          placeholder="请输入备注"
          :rows="2"
        />
      </a-form-item>
    </a-form>
    <ProTaskSelectDialog ref="taskDialogRef" @selected="handleTaskSelected" />
  </Modal>
</template>