|
@@ -0,0 +1,125 @@
|
|
|
+<template>
|
|
|
+ <xn-form-container
|
|
|
+ title="增加装货时间配置"
|
|
|
+ :width="700"
|
|
|
+ v-model:open="open"
|
|
|
+ :destroy-on-close="true"
|
|
|
+ @close="onClose"
|
|
|
+ >
|
|
|
+ <a-form ref="formRef" :model="formData" :rules="formRules" :wrapper-col="wrapperCol" :label-col="labelCol">
|
|
|
+ <a-form-item label="装货点位:" name="pointId">
|
|
|
+ <a-select
|
|
|
+ v-model:value="formData.pointId"
|
|
|
+ :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
|
|
+ :options="pointList"
|
|
|
+ class="xn-wd"
|
|
|
+ placeholder="请选择装货点位"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item label="装货时间段:" name="loadStartEndTime">
|
|
|
+ <a-range-picker v-model:value="formData.loadStartEndTime" value-format="YYYY-MM-DD HH:mm" show-time :disabled-date="disabledDate" style="width: 100%" />
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item label="可约次数:" name="availableNumber">
|
|
|
+ <a-input-number v-model:value="formData.availableNumber" style="width: 100%;" placeholder="请输入可约次数" allow-clear />
|
|
|
+ </a-form-item>
|
|
|
+ </a-form>
|
|
|
+ <template #footer>
|
|
|
+ <a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
|
|
|
+ <a-button type="primary" @click="onSubmit" :loading="submitLoading">保存</a-button>
|
|
|
+ </template>
|
|
|
+ </xn-form-container>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup name="bizLoadTimeForm">
|
|
|
+ import { cloneDeep } from 'lodash-es'
|
|
|
+ import { message } from 'ant-design-vue'
|
|
|
+ import { required } from '@/utils/formRules'
|
|
|
+ import bizLoadPointApi from '@/api/biz/bizLoadPointApi'
|
|
|
+ import bizLoadTimeApi from '@/api/biz/bizLoadTimeApi'
|
|
|
+ import dayjs from 'dayjs'
|
|
|
+
|
|
|
+ // 抽屉状态
|
|
|
+ const open = ref(false)
|
|
|
+ const emit = defineEmits({ successful: null })
|
|
|
+ const formRef = ref()
|
|
|
+ // 表单数据
|
|
|
+ const formData = ref({})
|
|
|
+ const submitLoading = ref(false)
|
|
|
+ // 装卸货点位列表
|
|
|
+ const pointList = ref([])
|
|
|
+
|
|
|
+ //设置表单样式
|
|
|
+ const labelCol = ref({ span: 4})
|
|
|
+ const wrapperCol = ref({ span: 16})
|
|
|
+
|
|
|
+ // 当前时间
|
|
|
+ const nowTime = ref(new Date())
|
|
|
+ // 禁用时间范围
|
|
|
+ const disabledDate = (current) => {
|
|
|
+ return (
|
|
|
+ (current && current < dayjs(nowTime.value).startOf('time'))
|
|
|
+ )
|
|
|
+ }
|
|
|
+
|
|
|
+ // 打开抽屉
|
|
|
+ const onOpen = (record) => {
|
|
|
+ open.value = true
|
|
|
+ formData.value = {
|
|
|
+ confStartEndTime: '',
|
|
|
+ goodsJson: []
|
|
|
+ }
|
|
|
+ if (record) {
|
|
|
+ let recordData = cloneDeep(record)
|
|
|
+ formData.value = Object.assign({}, recordData)
|
|
|
+ }
|
|
|
+
|
|
|
+ // 获取装卸货点位列表
|
|
|
+ bizLoadPointApi.getList().then((data) => {
|
|
|
+ pointList.value = data.map((item) => {
|
|
|
+ return {
|
|
|
+ value: item['id'],
|
|
|
+ label: item['loadPoint']
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).finally(() => {
|
|
|
+ submitLoading.value = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 关闭抽屉
|
|
|
+ const onClose = () => {
|
|
|
+ formRef.value.resetFields()
|
|
|
+ formData.value = {}
|
|
|
+ open.value = false
|
|
|
+ }
|
|
|
+ // 默认要校验的
|
|
|
+ const formRules = {
|
|
|
+ pointId: [required('请选择装货点位')],
|
|
|
+ loadStartEndTime: [required('请选择装货时间段')],
|
|
|
+ availableNumber: [required('请输入可预约次数')],
|
|
|
+ }
|
|
|
+ // 验证并提交数据
|
|
|
+ const onSubmit = () => {
|
|
|
+ formRef.value
|
|
|
+ .validate()
|
|
|
+ .then(() => {
|
|
|
+ submitLoading.value = true
|
|
|
+ const formDataParam = cloneDeep(formData.value)
|
|
|
+ formDataParam.beginTime = formDataParam.loadStartEndTime[0]+":00"
|
|
|
+ formDataParam.endTime = formDataParam.loadStartEndTime[1]+":00"
|
|
|
+ bizLoadTimeApi
|
|
|
+ .bizLoadTimeSubmitForm(formDataParam, formDataParam.id)
|
|
|
+ .then(() => {
|
|
|
+ onClose()
|
|
|
+ emit('successful')
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ submitLoading.value = false
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(() => {})
|
|
|
+ }
|
|
|
+ // 抛出函数
|
|
|
+ defineExpose({
|
|
|
+ onOpen
|
|
|
+ })
|
|
|
+</script>
|