Files
pj_h5_cloud/src/pages/apply/stride-apply.vue
T

118 lines
3.0 KiB
Vue

<script setup lang="ts">
import { ref, reactive } from "vue"
import { onLoad, onShow } from "@dcloudio/uni-app"
import { isEmpty } from "radash"
import { hooks, router } from "@@/index"
import { applyApi } from "@@/api"
const state = reactive<any>({
detailType: "add",
detailId: null,
detail: null,
})
const applyForm = reactive<any>({
count: 1,
remark: "",
})
const applyFormRules = reactive<any>({
count: [
{ required: true, message: "请输入申请数量" },
{ required: true, min: 1, message: "最少申请1张" },
{ required: true, max: 20, message: "最多申请20张" },
],
})
onLoad((options: any) => {
const { type, id } = options
if (!isEmpty(type)) state.detailType = type
if (!isEmpty(id)) state.detailId = id
if (type === "view") {
getDetail()
}
})
onShow(() => {})
const getDetail = async () => {
if (isEmpty(state.detailId)) return
const _pa = { id: state.detailId }
const { data } = await applyApi.strideDetail(_pa)
if (!isEmpty(data)) {
state.detail = data
applyForm.count = data.count
if (isEmpty(data.remark)) {
applyForm.remark = "无"
} else {
applyForm.remark = data.remark
}
}
}
const applyFormRef = ref<any>(null)
const doSubmit = async () => {
applyFormRef.value.submit()
const { isPass } = applyFormRef.value.validate()
if (!isPass) return
const range = applyForm.displayTimeRange
try {
uni.showLoading({ title: "申请中...", mask: false })
const _pa = {
count: applyForm.count,
remark: applyForm.remark,
}
const { data, code }: any = await applyApi.strideApply(_pa)
if (code != 0) throw new Error()
uni.hideLoading()
uni.showToast({ title: "申请成功", icon: "none" })
router.back()
} catch (error) {
console.error(error)
uni.hideLoading()
}
}
</script>
<template>
<crud-layout title="外来人员就餐" bg="/static/page/blue-bg.png">
<view class="h-30rpx" />
<view class="card p-x-30rpx p-y-40rpx">
<tm-form ref="applyFormRef" v-model="applyForm" :rules="applyFormRules" direction="vertical">
<tm-form-item name="count" label="申请数量" :showBottom="false">
<tm-input
v-model="applyForm.count"
type="number"
:disabled="state.detailType == 'view'"
:showClear="state.detailType != 'view'"
placeholder="请输入申请数量.."
/>
</tm-form-item>
<view class="h-30rpx" />
<tm-form-item name="remark" label="备注" :required="false" :showBottom="false">
<tm-input
v-model="applyForm.remark"
type="textarea"
:disabled="state.detailType == 'view'"
:showClear="state.detailType != 'view'"
:placeholder="state.detailType == 'view' ? '' : '请输入备注..'"
></tm-input>
</tm-form-item>
</tm-form>
</view>
<view
v-if="state.detailType != 'view'"
class="bg-#0094ff p-y-20rpx text-center rounded-40rpx m-x-30rpx m-t-60rpx sub-text-30 color-white!"
@tap="doSubmit"
>
提交
</view>
</crud-layout>
</template>
<style lang="scss" scoped>
:deep() {
.tmFormItemLabel {
padding-bottom: 10rpx !important;
}
}
</style>