1.移动端添加自定义navbar导航栏

zhuguifei

2025-05-20 7fe7b6182c2d407d28c2c9da1c070c3ce964e3e7

 eims-ui-mobile/src/pages/maint/order-detail.vue

@@ -2,29 +2,25 @@
{
  layout: 'default',
  needLogin: true,
  style: {
    navigationBarTitleText: '工单明细',
    'app-plus': {
      titleNView: {
        buttons: [
          {
            text: '提交',
            fontSize: '14px',
            color: '#FFFFFF',
          },
          {
            text: '',
            fontSize: '24px',
            color: '#FFFFFF',
          },
        ],
      },
    },
  },
  style: { navigationBarTitleText: '工单明细', navigationStyle: 'custom' },
}
</route>
<template>
  <view class="bg-base container" safeAreaInsetTopBottom>
    <wd-navbar
      title="保养工单"
      left-arrow
      @click-left="goBack"
      right-text="提交"
      @click-right="handleClickRight"
      custom-style="background: #4D80F0;"
      safeAreaInsetTop
    >
      <template #right>
        <text v-if="isOperatorOrRepair()" class="text-white">提交</text>
        <text v-else-if="isLeader()" class="text-white">验证</text>
      </template>
    </wd-navbar>
    <wd-form ref="form" :model="order" :rules="rules">
      <wd-cell-group custom-class="group" title="设备信息" border>
        <wd-cell title="设备名称" title-width="200rpx" is-link>
@@ -199,7 +195,7 @@
  toast.success('操作成功')
}

function handleClickRight(data: any) {
function handleSubmit(data: any) {
  message
    .confirm({
      msg: '确定提交？',
@@ -214,55 +210,56 @@
    })
}

onNavigationBarButtonTap((e) => {
  if (e.index === 0) {
    // 管理员角色 且待验证状态
    if (isLeader()) {
      switch (order.status) {
        case '0':
        case '1':
          toast.warning('当前工单等待操作工保养状态，不可操作')
          break
        case '2':
          // 勾选验证，可提交
          if (isVerify.value) {
            // 修改工单状态为已完成
            const data: any = Object.assign({}, { id: order.id, status: order.status })
            data.status = '3'
            handleClickRight(data)
          } else {
            toast.warning('请选择是否验证通过')
const goBack = () => {
  uni.navigateBack()
}
function handleClickRight() {
  // 管理员角色 且待验证状态
  if (isLeader()) {
    switch (order.status) {
      case '0':
      case '1':
        toast.warning('当前工单等待操作工保养状态，不可操作')
        break
      case '2':
        // 勾选验证，可提交
        if (isVerify.value) {
          // 修改工单状态为已完成
          const data: any = Object.assign({}, { id: order.id, status: order.status })
          data.status = '3'
          handleSubmit(data)
        } else {
          toast.warning('请选择是否验证通过')
        }
        break
      case '3':
        toast.warning('当前工单完成状态，不可操作')
        break
    }
  } else if (isOperatorOrRepair()) {
    switch (order.status) {
      case '0':
        break
      case '1':
        {
          const data = Object.assign({}, order)
          // 勾选工单完成，改变状态
          if (isFinish.value) {
            // 修改工单状态为待验证
            data.status = '2'
          }
          break
        case '3':
          toast.warning('当前工单完成状态，不可操作')
          break
      }
    } else if (isOperatorOrRepair()) {
      switch (order.status) {
        case '0':
          break
        case '1':
          {
            const data = Object.assign({}, order)
            // 勾选工单完成，改变状态
            if (isFinish.value) {
              // 修改工单状态为待验证
              data.status = '2'
            }
            handleClickRight(data)
          }
          break
        case '2':
          toast.warning('当前工单等待管理验证状态，不可操作')
          break
        case '3':
          toast.warning('当前工单完成状态，不可操作')
          break
      }
          handleSubmit(data)
        }
        break
      case '2':
        toast.warning('当前工单等待管理验证状态，不可操作')
        break
      case '3':
        toast.warning('当前工单完成状态，不可操作')
        break
    }
  }
})
}

onMounted(() => {})
onLoad((options) => {