fix: bug

zhengyiming

4 天以前 e9e51e1418443b816e8b00a83035d92768653933

 apps/bMiniApp/src/subpackages/task/taskHandleCheckDetail/InnerPage.vue

@@ -9,10 +9,17 @@
          :contactPhoneNumber="detail?.enterpriseEmployeeUser?.contactPhoneNumber"
        />
      </div>
      <div class="taskCheckFileCard-status-title">验收照片</div>
      <div class="taskCheckFileCard-status-title">验收详情</div>
      <TaskCheckFileCard
        :created-time="detail?.createdTime"
        :userCheckInTime="detail?.userCheckInTime"
        :userCheckOutTime="detail?.userCheckOutTime"
        :checkInTime="detail?.checkInTime"
        :checkOutTime="detail?.checkOutTime"
        :checkReceiveMethods="detail?.checkReceiveMethods"
        :files="detail?.files?.map((x) => setOSSLink(x))"
        userCheckLabelPrefix="用户"
        showCheckTime
      ></TaskCheckFileCard>
    </ContentScrollView>
    <PageFooter>
@@ -20,15 +27,114 @@
        type="primary"
        :color="Colors.Info"
        class="dark-btn"
        @click="checkReceiveTask(EnumTaskUserSubmitCheckReceiveStatus.Fail)"
        >验收未通过</PageFooterBtn
        @click="openDialog(detail?.checkInTime ?? '')"
        >修改服务费</PageFooterBtn
      >
      <PageFooterBtn
        type="primary"
        @click="checkReceiveTask(EnumTaskUserSubmitCheckReceiveStatus.Success)"
        >验收通过</PageFooterBtn
      >
      <PageFooterBtn type="primary" @click="checkReceiveTask()">验收</PageFooterBtn>
    </PageFooter>
    <nut-popup v-model:visible="dialogVisible">
      <div class="payroll-form-wrapper">
        <nut-form :model-value="form" ref="formRef">
          <nut-form-item
            label="服务费:"
            class="bole-form-item"
            prop="serviceFee"
            label-width="90px"
          >
            <div class="bole-form-input-wrapper">
              <NumberInput
                v-model.trim="form.serviceFee"
                class="nut-input-text bole-input-text"
                placeholder="请输入服务费"
                :min="0"
                :max="999999999999"
                :precision="2"
                type="text"
                disabled
              />
              <div class="form-input-unit">元</div>
            </div>
          </nut-form-item>
          <nut-form-item
            label="超时:"
            class="bole-form-item"
            prop="timeoutHours"
            label-width="90px"
          >
            <div class="bole-form-input-wrapper">
              <NumberInput
                v-model.trim="form.timeoutHours"
                class="nut-input-text bole-input-text"
                placeholder="请输入超时时长"
                :min="0"
                :max="999999999999"
                :precision="2"
                type="text"
                @change="onTimeoutHoursChange"
              />
              <div class="form-input-unit">小时</div>
            </div>
          </nut-form-item>
          <nut-form-item
            label="超时费用:"
            class="bole-form-item"
            prop="timeoutFee"
            label-width="90px"
          >
            <div class="bole-form-input-wrapper">
              <NumberInput
                v-model.trim="form.timeoutFee"
                class="nut-input-text bole-input-text"
                placeholder="请输入超时费用"
                :min="0"
                :max="999999999999"
                :precision="2"
                type="text"
              />
              <div class="form-input-unit">元</div>
            </div>
          </nut-form-item>
          <nut-form-item
            label="其他费用:"
            class="bole-form-item"
            prop="otherFee"
            label-width="90px"
          >
            <div class="bole-form-input-wrapper">
              <NumberInput
                v-model.trim="form.otherFee"
                class="nut-input-text bole-input-text"
                placeholder="请输入其他费用"
                :max="999999999999"
                :precision="2"
                type="text"
              />
              <div class="form-input-unit">元</div>
            </div>
          </nut-form-item>
          <nut-form-item
            label="结算金额:"
            class="bole-form-item"
            prop="settlementAmount"
            label-width="90px"
          >
            {{ `${settlementAmount}元` }}
          </nut-form-item>
          <nut-form-item
            label="备注:"
            class="bole-form-item alignTop"
            prop="remark"
            label-width="90px"
          >
            <nut-textarea v-model="form.remark" rows="4" placeholder="请输入备注"> </nut-textarea>
          </nut-form-item>
        </nut-form>
        <div class="payroll-form-footer">
          <nut-button @click="handleCancel">取消</nut-button>
          <nut-button type="primary" @click="handleConfirm">确认</nut-button>
        </div>
      </div>
    </nut-popup>
  </LoadingLayout>
</template>

@@ -36,12 +142,13 @@
import Taro from '@tarojs/taro';
import { useQuery } from '@tanstack/vue-query';
import * as taskCheckReceiveServices from '@12333/services/apiV2/taskCheckReceive';
import TaskCheckPersonalView from '../components/TaskCheckPersonalView.vue';
import { TaskCheckFileCard } from '@12333/components';
import { TaskCheckFileCard, TaskCheckPersonalView, NumberInput } from '@12333/components';
import { Colors, EnumTaskUserSubmitCheckReceiveStatus } from '@12333/constants';
import { Message, setOSSLink } from '@12333/utils';
import dayjs from 'dayjs';
import { goBack } from '@/utils';
import { useCheckReceiveTaskUserSubmit } from '@12333/hooks';
import { useSettlementAmount } from '../hooks';

defineOptions({
  name: 'InnerPage',
@@ -49,31 +156,49 @@

const router = Taro.useRouter();
const id = router.params?.id ?? '';
const taskInfoId = router.params?.taskInfoId ?? '';
const date = router.params?.date ?? '';

const {
  isLoading,
  isError,
  data: detail,
  refetch,
} = useQuery({
  queryKey: ['taskCheckReceiveServices/getCheckReceiveTaskUserSubmit', id, date],
  queryFn: async () => {
    return await taskCheckReceiveServices.getCheckReceiveTaskUserSubmit(
      { taskInfoUserId: id, date: dayjs(date).format('YYYY-MM-DD') },
      {
        showLoading: false,
      }
    );
const { isLoading, isError, detail, refetch } = useCheckReceiveTaskUserSubmit({
  params: {
    taskInfoUserId: id,
    date: dayjs(date).format('YYYY-MM-DD'),
  },
  placeholderData: () => ({} as API.GetCheckReceiveTaskUserSubmitQueryResult),
});

async function checkReceiveTask(checkReceiveStatus: EnumTaskUserSubmitCheckReceiveStatus) {
const {
  dialogVisible,
  form,
  settlementAmount,
  handleCancel,
  openDialog,
  handleConfirm,
  onTimeoutHoursChange,
} = useSettlementAmount({
  taskInfoUserId: id,
  id: taskInfoId,
  timeoutServiceFee: computed(() => detail.value?.timeoutServiceFee),
  date,
  onSuccess() {
    Message.success('提交成功', {
      onClosed() {
        goBack();
      },
    });
  },
});

async function checkReceiveTask() {
  try {
    let params: API.CheckReceiveTaskCommand = {
      id: detail.value?.id,
      checkReceiveStatus: checkReceiveStatus,
      checkReceiveStatus: EnumTaskUserSubmitCheckReceiveStatus.Success,
      // serviceFee: form.serviceFee,
      // timeoutHours: form.timeoutHours,
      // timeoutFee: form.timeoutFee,
      // otherFee: form.otherFee,
      // remark: form.remark,
      // settlementAmount: settlementAmount.value,
    };
    let res = await taskCheckReceiveServices.checkReceiveTask(params);
    if (res) {
@@ -105,5 +230,29 @@
    border-bottom: 1px solid #d9d9d9;
    margin-bottom: 22px;
  }

  .bole-form-input-wrapper {
    display: flex;
    align-items: center;
  }

  .form-input-unit {
    margin-left: 10px;
    color: boleGetCssVar('text-color', 'primary');
    flex-shrink: 0;
  }

  .payroll-form-wrapper {
    width: 600px;
  }

  .payroll-form-footer {
    padding: 10px 20px;
    text-align: center;

    .nut-button + .nut-button {
      margin-left: 20px;
    }
  }
}
</style>