pms-app/pages/ruihen-task/edit.vue

<script setup>
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { updateRuiHenTask } from "@/api/ruihen";
import Form from "./components/form.vue";

const formRef = ref(null);
const formLoading = ref(false);
const id = ref(null);

onLoad((options) => {
  id.value = Number(options.id) || null;
});

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

  try {
    await formRef.value.validate();
    formLoading.value = true;

    await updateRuiHenTask({ taskList: [formRef.value.buildSubmitData()] });

    uni.showToast({
      title: "修改成功",
      icon: "success",
    });

    setTimeout(() => {
      uni.navigateBack();
    }, 500);
  } catch (error) {
    console.log("submit edit task error", error);
  } finally {
    formLoading.value = false;
  }
};
</script>

<template>
  <view class="page">
    <scroll-view scroll-y="true" class="segmented-content">
      <!-- 复用任务表单组件，传入编辑模式和任务 id -->
      <Form ref="formRef" type="edit" :id="id"></Form>
    </scroll-view>
    <view class="segmented-footer">
      <view class="footer-btn">
        <!-- 编辑页底部确认按钮 -->
        <button
          :loading="formLoading"
          class="mini-btn"
          type="primary"
          @click="submitForm">
          确定
        </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 16px;
  height: 100%;
}

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