<template>
|
<n-modal
|
:show="visible"
|
@update:show="(value) => emit('update:visible', value)"
|
title="📋 复制称重盒子"
|
preset="card"
|
size="medium"
|
:style="bodyStyle"
|
>
|
<div class="form-group">
|
<label class="form-label">源盒子</label>
|
<n-input :value="form.sourceName" disabled />
|
</div>
|
<div class="form-group" style="margin-top: 12px;">
|
<label class="form-label">复制数量</label>
|
<n-input-number v-model:value="form.count" placeholder="请输入复制数量" min="1" max="20" style="max-width: 100px;" />
|
<div class="form-hint">系统将自动递增编号后缀，如 WBOX-2024-001-a, -b, -c…</div>
|
</div>
|
<template #footer>
|
<div class="modal-footer">
|
<div class="modal-footer-right">
|
<n-button @click="handleCancel">取消</n-button>
|
<n-button type="primary" @click="handleSubmit">📋 确认复制</n-button>
|
</div>
|
</div>
|
</template>
|
</n-modal>
|
</template>
|
|
<script setup lang="ts">
|
import { ref, reactive, watch } from 'vue';
|
import { weighingBoxApi } from '@/service/api/md/weighing-box';
|
import { useMessage } from 'naive-ui';
|
|
const props = defineProps({
|
visible: {
|
type: Boolean,
|
default: false
|
},
|
rowData: {
|
type: Object,
|
default: () => ({})
|
}
|
});
|
|
const emit = defineEmits(['update:visible', 'submitted']);
|
|
const message = useMessage();
|
|
const form = reactive({
|
sourceId: undefined,
|
sourceName: '',
|
count: 1
|
});
|
|
const bodyStyle = {
|
width: '400px'
|
};
|
|
watch(() => props.visible, (newValue) => {
|
if (newValue && props.rowData) {
|
form.sourceId = props.rowData.id;
|
form.sourceName = props.rowData.name;
|
form.count = 1;
|
}
|
});
|
|
const handleCancel = () => {
|
emit('update:visible', false);
|
};
|
|
const handleSubmit = async () => {
|
try {
|
const response = await weighingBoxApi.copy({
|
sourceId: form.sourceId,
|
count: form.count
|
});
|
const res = response.response.data;
|
|
if (res.code === 200) {
|
message.success('复制成功');
|
emit('update:visible', false);
|
emit('submitted');
|
} else {
|
message.error(res.msg || '复制失败');
|
}
|
} catch (error) {
|
message.error('复制失败');
|
}
|
};
|
</script>
|
|
<style scoped>
|
/* 表单样式 */
|
.form-group {
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 16px;
|
}
|
|
.form-label {
|
font-size: 14px;
|
font-weight: 500;
|
color: #333;
|
margin-bottom: 8px;
|
}
|
|
.form-hint {
|
font-size: 12px;
|
color: #999;
|
margin-top: 4px;
|
}
|
|
/* 模态框底部 */
|
.modal-footer {
|
width: 100%;
|
display: flex;
|
justify-content: flex-end;
|
align-items: center;
|
}
|
|
.modal-footer-right {
|
display: flex;
|
gap: 10px;
|
}
|
</style>
|
