74 lines
1.6 KiB
Vue
74 lines
1.6 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { computed, reactive, watch } from 'vue';
|
||
|
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||
|
|
|
||
|
|
defineOptions({ name: 'StatusActionDialog' });
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
action: Api.Product.ProductLifecycleAction | null;
|
||
|
|
}
|
||
|
|
|
||
|
|
interface Emits {
|
||
|
|
(e: 'submit', payload: Api.Product.ChangeProductStatusParams): void;
|
||
|
|
}
|
||
|
|
|
||
|
|
const props = defineProps<Props>();
|
||
|
|
const emit = defineEmits<Emits>();
|
||
|
|
|
||
|
|
const visible = defineModel<boolean>('visible', {
|
||
|
|
default: false
|
||
|
|
});
|
||
|
|
|
||
|
|
const model = reactive({
|
||
|
|
reason: ''
|
||
|
|
});
|
||
|
|
|
||
|
|
const confirmDisabled = computed(() => Boolean(props.action?.needReason && !model.reason.trim()));
|
||
|
|
|
||
|
|
function handleConfirm() {
|
||
|
|
if (!props.action) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
emit('submit', {
|
||
|
|
id: '',
|
||
|
|
actionCode: props.action.actionCode,
|
||
|
|
reason: model.reason.trim() || null
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
watch(
|
||
|
|
() => visible.value,
|
||
|
|
value => {
|
||
|
|
if (!value) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
model.reason = '';
|
||
|
|
}
|
||
|
|
);
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<BusinessFormDialog
|
||
|
|
v-model="visible"
|
||
|
|
:title="action ? `${action.actionName}产品` : '生命周期动作'"
|
||
|
|
preset="sm"
|
||
|
|
:confirm-disabled="confirmDisabled"
|
||
|
|
@confirm="handleConfirm"
|
||
|
|
>
|
||
|
|
<ElForm label-position="top">
|
||
|
|
<ElFormItem :label="action?.needReason ? '动作原因（必填）' : '动作原因（选填）'">
|
||
|
|
<ElInput
|
||
|
|
v-model="model.reason"
|
||
|
|
type="textarea"
|
||
|
|
:rows="4"
|
||
|
|
maxlength="500"
|
||
|
|
show-word-limit
|
||
|
|
placeholder="请输入动作原因"
|
||
|
|
/>
|
||
|
|
</ElFormItem>
|
||
|
|
</ElForm>
|
||
|
|
</BusinessFormDialog>
|
||
|
|
</template>
|