pms-app/pages/ruiying/approval.vue

<script setup>
import { ref } from "vue";
import { approvalIotRyDailyReport } from "@/api/ruiying";
import Form from "./components/form.vue";

const formRef = ref(null);

const formLoading = ref(false);

const submitForm = async auditStatus => {
  if (!formRef.value) return;

  try {
    await formRef.value.formRef.validateField("constructionBrief");
    const form = formRef.value.form;

    // if (form.nonProductionTime && !form.nptReason) {
    //   uni.showToast({
    //     title: '非生产时间大于 0 时，必须选择非生产时间原因',
    //     icon: 'none',
    //   });
    //   return;
    // }

    formLoading.value = true;

    const { opinion, id, constructionBrief } = form;
    const data = { auditStatus, opinion, id, constructionBrief };

    // console.log('data :>> ', data);

    await approvalIotRyDailyReport(data);

    formRef.value.loadDetail(id);

    uni.showToast({
      title: auditStatus === 20 ? "通过成功" : "拒绝成功",
      icon: "success",
    });
  } catch (error) {
    console.log("error :>> ", error);
  } finally {
    formLoading.value = false;
  }
};
</script>

<template>
  <view class="page">
    <scroll-view scroll-y="true" class="segmented-content">
      <Form ref="formRef" type="approval"></Form>
    </scroll-view>
    <view class="segmented-footer">
      <view class="footer-btn">
        <button
          :disabled="formLoading || formRef?.form.auditStatus !== 10"
          :loading="formLoading"
          class="mini-btn"
          type="primary"
          @click="submitForm(20)">
          审批通过
        </button>
        <button
          :disabled="formLoading || formRef?.form.auditStatus !== 10"
          :loading="formLoading"
          class="mini-btn"
          type="warn"
          @click="submitForm(30)">
          审批驳回
        </button>
      </view>
    </view>
  </view>
</template>

<style lang="scss" scoped>
@import "@/style/work-order-segmented.scss";
.page {
  padding-bottom: 0;
}

.footer-btn {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0 32px;
  height: 100%;

  gap: 0 32px;

  & > uni-button {
    margin: 0;
  }
}

:deep(.mini-btn) {
  height: 38px !important;
  font-size: 16px !important;
}
</style>