<template>
|
<ContentScrollView :paddingH="false">
|
<nut-form :model-value="form" ref="formRef" :rules="rules">
|
<nut-form-item
|
label="员工薪资:"
|
class="bole-form-item"
|
prop="salaryTimeType"
|
required
|
label-width="80px"
|
>
|
<nut-radio-group v-model="form.salaryTimeType" direction="horizontal">
|
<BlRadio :label="Number(key)" v-for="(val, key) in SalaryTimeTypeEnumText" :key="key">{{
|
val
|
}}</BlRadio>
|
</nut-radio-group>
|
</nut-form-item>
|
<nut-form-item label=" " class="bole-form-item" prop="integratedSalary" label-width="80px">
|
<div class="bole-form-input-wrapper">
|
<!-- <NumberInput
|
v-model.trim="form.integratedSalary"
|
class="nut-input-text bole-input-text"
|
placeholder="请输入员工薪资"
|
:min="1"
|
/> -->
|
<nut-input
|
v-model.trim="form.integratedSalary"
|
class="nut-input-text bole-input-text"
|
placeholder="请输入员工薪资"
|
type="text"
|
/>
|
<div class="form-input-unit">{{ SalaryTimeTypeEnumUnit[form.salaryTimeType] }}</div>
|
</div>
|
</nut-form-item>
|
<nut-form-item
|
label="结算方式:"
|
class="bole-form-item"
|
prop="salaryType"
|
required
|
label-width="80px"
|
>
|
<nut-radio-group v-model="form.salaryType" direction="horizontal">
|
<BlRadio :label="Number(key)" v-for="(val, key) in SalaryTypeTextV3">{{ val }}</BlRadio>
|
</nut-radio-group>
|
</nut-form-item>
|
<nut-form-item
|
label="返费类型:"
|
class="bole-form-item"
|
prop="salaryType"
|
required
|
label-width="80px"
|
>
|
<nut-radio-group v-model="form.rebateMode" direction="horizontal">
|
<BlRadio :label="Number(key)" v-for="(val, key) in OrderRebateModeTextV3" :key="key">{{
|
val
|
}}</BlRadio>
|
</nut-radio-group>
|
</nut-form-item>
|
<nut-form-item
|
label="返费金额:"
|
class="bole-form-item"
|
prop="cycleType"
|
required
|
label-width="80px"
|
>
|
<nut-radio-group v-model="form.cycleType" direction="horizontal">
|
<BlRadio :label="Number(key)" v-for="(val, key) in CycleTypeEnumText" :key="key">{{
|
val
|
}}</BlRadio>
|
</nut-radio-group>
|
</nut-form-item>
|
<nut-form-item label=" " class="bole-form-item" prop="supplierProfit" label-width="80px">
|
<div class="bole-form-input-wrapper">
|
<NumberInput
|
v-model.trim="form.supplierProfit"
|
class="nut-input-text bole-input-text"
|
placeholder="请输入返费金额"
|
:min="1"
|
/>
|
<div class="form-input-unit">{{ CycleTypeEnumUnitText[form.cycleType] }}</div>
|
</div>
|
</nut-form-item>
|
<nut-form-item
|
label="返费时长:"
|
class="bole-form-item"
|
prop="rebateTime"
|
label-width="80px"
|
required
|
v-if="form.rebateMode == OrderRebateMode.Hour"
|
>
|
<div class="bole-form-input-wrapper">
|
<NumberInput
|
v-model.trim="form.rebateTime"
|
class="nut-input-text bole-input-text"
|
placeholder="请输入返费时长"
|
:min="1"
|
/>
|
<div class="form-input-unit">{{ RebateCycleTypeText[form.cycleType] }}</div>
|
</div>
|
</nut-form-item>
|
<nut-form-item
|
label="入职时长:"
|
class="bole-form-item"
|
prop="rebateTime"
|
label-width="80px"
|
required
|
v-if="form.rebateMode == OrderRebateMode.Recruit"
|
>
|
<div class="bole-form-input-wrapper">
|
<div class="form-input-separator">入职满</div>
|
<NumberInput
|
v-model.trim="form.rebateTime"
|
class="nut-input-text bole-input-text"
|
placeholder="请输入天数"
|
:min="1"
|
/>
|
<div class="form-input-unit">天一次性返</div>
|
</div>
|
</nut-form-item>
|
</nut-form>
|
</ContentScrollView>
|
<PageFooter :isOnlyAction="false">
|
<PageFooterBtn type="primary" plain @click="goToPrevious()">上一步</PageFooterBtn>
|
<PageFooterBtn type="primary" @click="handleNext">下一步</PageFooterBtn>
|
</PageFooter>
|
</template>
|
|
<script setup lang="ts">
|
import { usePublishOrderContext } from './context';
|
import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types';
|
import { Radio as BlRadio, NumberInput } from '@12333/components';
|
import {
|
SalaryTimeTypeEnumText,
|
SalaryTimeTypeEnumUnit,
|
SalaryTypeTextV3,
|
OrderRebateModeTextV3,
|
CycleTypeEnumText,
|
CycleTypeEnumUnitText,
|
OrderRebateMode,
|
RebateCycleTypeText,
|
} from '@12333/constants';
|
import { FormValidator } from '@12333/utils';
|
|
defineOptions({
|
name: 'PublishOrderStep2',
|
});
|
|
const { goToNext, form, goToPrevious } = usePublishOrderContext();
|
|
const rules = computed<FormRules>(() => ({
|
integratedSalary: [{ required: true, message: '请输入员工薪资' }],
|
supplierProfit: [
|
{ required: true, message: '请输入返费金额', validator: FormValidator.validatorNumberNotNull },
|
],
|
rebateTime: [
|
{
|
required: true,
|
message: form.rebateMode == OrderRebateMode.Recruit ? '请输入入职时长' : '请输入返费时长',
|
},
|
],
|
}));
|
|
const formRef = ref<any>(null);
|
|
function handleNext() {
|
if (!formRef.value) return;
|
formRef.value.validate().then(({ valid, errors }: any) => {
|
if (valid) {
|
goToNext();
|
}
|
});
|
}
|
</script>
|
|
<style lang="scss">
|
@import '@/styles/common.scss';
|
</style>
|
