tjy-uniapp/src/pages/taskOnline/TaskOnlineEquipmentList.vue

<route lang="json5" type="page">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '设备列表（分配项目）',
    navigationStyle: 'custom',
    disableScroll: true,
    'app-plus': {
      bounce: 'none',
    },
  },
}
</route>

<template>
  <view class="equipment-list-container">
    <NavBar title="设备列表（分配项目）" />

    <scroll-view
      class="list-scroll"
      scroll-y
      refresher-enabled
      :refresher-triggered="refreshing"
      @refresherrefresh="onRefresh"
    >
      <view v-for="item in equipmentList" :key="item.id" class="equipment-cell">
        <view class="cell-top" @click="handleSelectEquipment(item)">
          <view class="row">
            <view v-if="orderId" class="checkbox-wrapper">
              <view class="checkbox" :class="{ checked: selectedMap[item.id] }">
                <image
                  v-if="selectedMap[item.id]"
                  class="check-icon"
                  src="/static/images/white-check.png"
                  mode="aspectFit"
                />
              </view>
            </view>
            <view class="cell-top-left">
              <text class="equip-name">{{ item.equipName }}</text>
              <text class="main-checker">主检人：{{ item?.mainCheckerUser?.nickname || '' }}</text>
              <view
                class="status-tag"
                :class="
                  item?.taskStatus !== PressureCheckerMyTaskStatus.CONFIRMED
                    ? 'status-pending'
                    : 'status-done'
                "
              >
                <text class="status-text">
                  {{ PressureCheckerMyTaskStatusMap[item?.taskStatus] }}
                </text>
              </view>
            </view>
          </view>
        </view>

        <view class="cell-center" @click="handleRouteToEquipmentDetail(item, 'EQUIPMENT')">
          <view class="info-box">
            <text class="info-label">
              设备注册代码:
              <text class="info-value">{{ item.equipCode }}</text>
            </text>
            <text class="info-label">
              费用：
              <text class="info-value">{{ handleCalcTotalFee(item?.reportDOList) }}</text>
            </text>
          </view>
        </view>

        <view class="cell-bottom">
          <view
            v-if="
              !item.mainChecker == null &&
              item.taskStatus === PressureCheckerMyTaskStatus.RECORD_INPUT
            "
            class="claim-btn white-btn"
            @click="fetchClaimEquipments(item.id, item.mainChecker != null)"
          >
            <text class="white-btn-text">认领</text>
          </view>
          <view
            v-if="item.mainChecker != null"
            class="record-btn blue-btn"
            @click="handleRouteToEquipmentDetail(item, 'INSPECT')"
          >
            <text class="blue-btn-text">记录录入</text>
          </view>
        </view>
      </view>

      <view v-if="loading && equipmentList.length === 0" class="loading-text">加载中...</view>
      <view v-if="!loading && equipmentList.length === 0" class="empty-text">
        <text>暂无数据</text>
      </view>
    </scroll-view>

    <view v-if="orderId" class="bottom-operate">
      <view class="select-all" @click="handleSelectAll">
        <view class="checkbox" :class="{ checked: selectAll }">
          <image
            v-if="selectAll"
            class="check-icon"
            src="/static/images/white-check.png"
            mode="aspectFit"
          />
        </view>
        <text class="select-all-text">全选</text>
      </view>
      <view class="btn-group">
        <button
          class="operate-btn blue-btn"
          :style="!selectedEquipments.length ? { opacity: 0.5 } : {}"
          @click="selectedEquipments.length && (showMoreOperate = true)"
        >
          更多操作
        </button>
        <button
          class="operate-btn white-btn"
          :style="!selectedEquipments.length ? { opacity: 0.5 } : {}"
          @click="
            selectedEquipments.length &&
              showBatchClaimPopup({ text: '是否认领已选择的设备？', isClaim: false })
          "
        >
          批量认领
        </button>
        <button
          class="operate-btn blue-btn"
          :style="!selectedEquipments.length ? { opacity: 0.5 } : {}"
          @click="selectedEquipments.length && showCheckProjectPopup()"
        >
          添加项目
        </button>
      </view>
    </view>

    <view v-if="showTipsPopup" class="popup-mask" @click="closeTipsPopup">
      <view class="popup-content tips-popup" @click.stop>
        <text class="tips-text">{{ tipsPopupData.text }}</text>
        <view class="popup-actions">
          <button class="action-btn cancel-btn" @click="closeTipsPopup">取消</button>
          <button class="action-btn confirm-btn" @click="handleBatchClaim">确定</button>
        </view>
      </view>
    </view>

    <view v-if="showMoreOperate" class="more-operate-overlay" @click="showMoreOperate = false">
      <view class="more-operate-panel" :class="{ 'more-panel-show': showMoreOperate }">
        <view
          class="more-btn-item"
          :class="{ disabled: !canInform }"
          @click="canInform && createInform()"
        >
          <view class="more-btn-inner more-btn-border">
            <text class="more-btn-text" :style="{ color: canInform ? 'rgb(51,51,51)' : '#ccc' }">
              重大问题线索
            </text>
          </view>
        </view>
        <view
          class="more-btn-item"
          :class="{ disabled: !canSuspend }"
          @click="canSuspend && showSuspendPopupFunc()"
        >
          <view class="more-btn-inner more-btn-border">
            <text class="more-btn-text" :style="{ color: canSuspend ? 'rgb(51,51,51)' : '#ccc' }">
              客户拒检
            </text>
          </view>
        </view>
        <view
          class="more-btn-item"
          :class="{ disabled: !canAddInspectionplan }"
          @click="canAddInspectionplan && showAddInspectionplanPopup()"
        >
          <view class="more-btn-inner more-btn-border">
            <text
              class="more-btn-text"
              :style="{ color: canAddInspectionplan ? 'rgb(51,51,51)' : '#ccc' }"
            >
              检验方案
            </text>
          </view>
        </view>
        <view
          class="more-btn-item"
          :class="{ disabled: !canUpdateContact }"
          @click="canUpdateContact && handleUpdateContact()"
        >
          <view class="more-btn-inner more-btn-border">
            <text
              class="more-btn-text"
              :style="{ color: canUpdateContact ? 'rgb(51,51,51)' : '#ccc' }"
            >
              修改安全管理员
            </text>
          </view>
        </view>
      </view>
    </view>

    <view v-if="showSuspendPopup" class="popup-mask" @click="closeSuspendPopup">
      <view class="popup-content suspend-popup" @click.stop>
        <text class="popup-title">客户拒检</text>
        <view class="form-item">
          <text class="form-label">拒检类别</text>
          <wd-picker
            v-model="suspendReasonDict"
            :columns="refuseCategoryColumns"
            placeholder="请选择拒检类别"
          />
        </view>
        <textarea
          v-if="suspendReasonDict === '5'"
          v-model="suspendReason"
          class="suspend-textarea"
          placeholder="请输入拒绝检验原因"
        />
        <view class="popup-actions suspend-actions">
          <button class="action-btn cancel-btn" @click="closeSuspendPopup">取消</button>
          <button class="action-btn confirm-btn" @click="suspendCheck(1)">上报市局</button>
          <button class="action-btn warn-btn" @click="suspendCheck(0)">无需上报</button>
        </view>
      </view>
    </view>

    <view v-if="showInspectionplanPopup" class="popup-mask" @click="closeInspectionplanPopup">
      <view class="popup-content inspectionplan-popup" @click.stop>
        <text class="popup-title">添加检验方案</text>
        <view class="tab-row">
          <view
            :class="['tab-item', { active: inspectionPlanType === 'commPlan' }]"
            @click="inspectionPlanType = 'commPlan'"
          >
            通用
          </view>
          <view
            :class="['tab-item', { active: inspectionPlanType === 'selfPlan' }]"
            @click="inspectionPlanType = 'selfPlan'"
          >
            自编
          </view>
        </view>
        <view class="form-item">
          <text class="form-label">{{ inspectionPlanType === 'commPlan' ? '检验方案' : '模板封面' }}</text>
          <wd-picker
            v-model="selectedTemplateId"
            :columns="templateListColumn"
            @confirm="onTemplateChange"
          />
        </view>
        <view class="form-item">
          <text class="form-label">检验方案名称</text>
          <input v-model="inspectionplanName" class="form-input" placeholder="请输入检验方案名称" />
        </view>
        <view class="popup-actions">
          <button class="action-btn cancel-btn" @click="closeInspectionplanPopup">取消</button>
          <button class="action-btn confirm-btn" @click="addInspectionplanConfirm">确定</button>
        </view>
      </view>
    </view>

    <UpdateSafetyManagerPopup
      v-if="showUpdateContactPopup"
      :safe-manager="currentSafeManager.name"
      :safe-manager-phone="currentSafeManager.phone"
      @hide="showUpdateContactPopup = false"
      @confirm="handleUpdateSafetyManagerConfirm"
    />

    <view
      v-if="showCheckProject"
      class="popup-mask"
      @click="closeCheckProjectPopup"
      @touchmove.stop.prevent
    >
      <view class="popup-content check-project-popup" @click.stop @touchmove.stop>
        <view class="popup-header">
          <text class="popup-title">添加检验项目</text>
          <text class="popup-close" @click="closeCheckProjectPopup">✕</text>
        </view>
        <BoilerCheckProject
          v-if="showCheckProject"
          :propject-list="checkProjectList"
          :select-templates="selectTemplates"
          use-online="1"
          :equip-data="equipDataForPopup"
          @change="handleCheckProjectChange"
          @confirm="handleCheckProjectConfirm"
          @cancel="closeCheckProjectPopup"
        />
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { ref, computed } from 'vue'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { pressure2NotVerifyPageApi } from '@/api/task'
import { useUserStore } from '@/store/user'
import { useConfigStore } from '@/store/config'
import {
  PressureCheckerMyTaskStatus,
  PressureCheckerMyTaskStatusMap,
  getStrDictOptions,
} from '@/utils/dictMap'
import dayjs from 'dayjs'
import UpdateSafetyManagerPopup from '@/pages/unClaim/components/UpdateSafetyManagerPopup.vue'
import { TaskOrderFuncName, requestFunc } from '@/api/ApiRouter/taskOrder'
import {
  getBoilerTaskItemListByOrderId,
  addInspectProject,
  confirmBoilerEquipmentBatchClaim,
} from '@/api/boiler/boilerTaskOrder'
import { updateEquipBoilerSecurityManager } from '@/api/boiler/boilerEquip'
import NavBar from '@/components/NavBar/NavBar.vue'
import BoilerCheckProject from '@/pages/taskOnline/components/BoilerCheckProject.vue'

interface PopupData {
  text: string
  isClaim: boolean
}

defineOptions({ name: 'TaskOnlineEquipmentList' })

const userStore = useUserStore()
const userInfo = computed(() => userStore.userInfo)
const equipType = useConfigStore().getEquipType()

const orderId = ref('')
const orderNo = ref('')
const equipmentList = ref<any[]>([])
const loading = ref(false)
const refreshing = ref(false)
const selectAll = ref(false)
const selectedEquipments = ref<any[]>([])
const selectedMap = ref<Record<string, boolean>>({})

const canInform = ref(false)
const canSuspend = ref(false)
const canAddInspectionplan = ref(false)
const canUpdateContact = ref(false)

const showTipsPopup = ref(false)
const tipsPopupData = ref<PopupData>({ text: '', isClaim: false })

const showMoreOperate = ref(false)
const showSuspendPopup = ref(false)
const suspendReason = ref('')
const suspendReasonDict = ref('')
const refuseCategoryColumns = computed(() => {
  return getStrDictOptions('refuseInspectedCategory').map((item: any) => ({
    label: item.label,
    value: item.value,
  }))
})

const showInspectionplanPopup = ref(false)
const inspectionPlanType = ref('commPlan')
const inspectionplanName = ref('')
const selectedTemplate = ref<any>(null)
const selectedTemplateId = ref('')
const templateList = ref<any[]>([])
const optionsResult = ref<any[]>([])
const filteredTemplateList = computed(() => {
  if (inspectionPlanType.value === 'commPlan') {
    return optionsResult.value.filter(
      (item) => item.reportType === 900 && (item.pjType === 3 || item.pjType === 5),
    )
  } else if (inspectionPlanType.value === 'selfPlan') {
    return optionsResult.value.filter(
      (item) => item.reportType === 500 && item.pjType === 5,
    )
  }
  return []
})
const templateListColumn = computed(() => [
  filteredTemplateList.value.map((item) => ({ label: item.tbName, value: item.id })),
])

const showUpdateContactPopup = ref(false)
const currentItem = ref<any>({})

const showCheckProject = ref(false)
const checkProjectList = ref<any[][]>([])
const selectTemplates = ref<Record<string, any[]>>({})
const currentSelectedCheckProjectItems = ref<any[]>([])
const equipDataForPopup = ref<any>({})

const currentSafeManager = computed(() => {
  return {
    name: currentItem.value?.safery || '',
    phone: currentItem.value?.saferydh || '',
  }
})

onLoad((options: any) => {
  orderId.value = options?.orderId || ''
  orderNo.value = options?.orderNo || ''
})

onShow(() => {
  fetchCheckerOnlineEquipmentList()
})

const selectedEquipIds = computed(() => selectedEquipments.value.map((item) => item.equipId))

const fetchCheckerOnlineEquipmentList = async () => {
  loading.value = true
  try {
    const res = await getBoilerTaskItemListByOrderId({ id: orderId.value })
    equipmentList.value = res?.data?.orderItems || []
  } catch (error) {
    console.error('获取设备列表失败:', error)
  } finally {
    loading.value = false
  }
}

const onRefresh = async () => {
  refreshing.value = true
  await fetchCheckerOnlineEquipmentList()
  refreshing.value = false
}

const refreshList = () => {
  fetchCheckerOnlineEquipmentList()
}

const handleSelectEquipment = (item: any) => {
  if (!orderId.value) return
  const isSelected = !selectedMap.value[item.id]
  selectedMap.value[item.id] = isSelected
  if (isSelected) {
    selectedEquipments.value.push(item)
  } else {
    selectedEquipments.value = selectedEquipments.value.filter((ele) => ele.id !== item.id)
  }
  updateOperateStatus()
  selectAll.value = selectedEquipments.value.length === equipmentList.value.length
}

const handleSelectAll = () => {
  const newSelectAll = !selectAll.value
  selectAll.value = newSelectAll
  selectedEquipments.value = []
  const newMap: Record<string, boolean> = {}
  for (const item of equipmentList.value) {
    newMap[item.id] = newSelectAll
    if (newSelectAll) {
      selectedEquipments.value.push(item)
    }
  }
  selectedMap.value = newMap
  updateOperateStatus()
}

const updateOperateStatus = () => {
  canInform.value = selectedEquipments.value.length === 1
  canAddInspectionplan.value = selectedEquipments.value.length >= 1
  canUpdateContact.value = selectedEquipments.value.length === 1
  canSuspend.value = selectedEquipments.value.length >= 1
}

const initSelect = () => {
  selectedEquipments.value = []
  selectedMap.value = {}
  selectAll.value = false
  updateOperateStatus()
}

const showBatchClaimPopup = (popupData: PopupData) => {
  const networkType = uni.getNetworkTypeSync?.()
  if (networkType === 'none') {
    return uni.showToast({ title: '暂无网络无法认领，请联网后认领设备', icon: 'error' })
  }
  if (!selectedEquipments.value.length) {
    return uni.showToast({
      title: `请选择要批量${popupData.isClaim ? '取消认领' : '认领'}的设备`,
      icon: 'error',
    })
  }
  tipsPopupData.value = popupData
  showTipsPopup.value = true
}

const closeTipsPopup = () => {
  showTipsPopup.value = false
}

const handleBatchClaim = async () => {
  closeTipsPopup()
  const ids = selectedEquipments.value.map((item: any) => item.mainID)
  const params: { orderItemIdList: string[] } = { orderItemIdList: ids }
  try {
    const result = await confirmBoilerEquipmentBatchClaim(params)
    updateClaim(result, ids, !tipsPopupData.value.isClaim)
  } catch (error) {
    uni.showToast({ title: '操作失败', icon: 'error' })
  }
}

const fetchClaimEquipments = async (equipmentId: string, isClaim: boolean) => {
  const networkType = uni.getNetworkTypeSync?.()
  if (networkType === 'none') {
    return uni.showToast({ title: '暂无网络无法认领，请联网后认领设备', icon: 'error' })
  }
  const currentUserInfo = userInfo.value
  if (!currentUserInfo) {
    return uni.redirectTo({ url: '/pages/login/login' })
  }
  try {
    let result: any
    if (isClaim) {
      result = await requestFunc(TaskOrderFuncName.EquipmentCancelClaim, equipType, {
        id: equipmentId,
      })
    } else {
      result = await requestFunc(TaskOrderFuncName.EquipmentConfirmClaim, equipType, {
        id: equipmentId,
      })
    }
    updateClaim(result, [equipmentId], !isClaim)
  } catch (error) {
    uni.showToast({ title: '操作失败', icon: 'error' })
  }
}

const updateClaim = async (result: any, equipmentIds: string[], isClaim: boolean) => {
  if (result?.code === 0 && result?.data === true) {
    uni.showToast({ title: `${isClaim ? '认领' : '取消认领'}成功` })
    initSelect()
    await fetchCheckerOnlineEquipmentList()
  } else {
    const msg = result?.msg || `${isClaim ? '认领' : '取消认领'}失败`
    uni.showToast({ title: msg, icon: 'error' })
  }
}

const showCheckProjectPopup = async () => {
  if (!selectedEquipments.value.length) {
    return uni.showToast({ title: '请先选择设备', icon: 'error' })
  }

  try {
    uni.showLoading({ title: '加载中...' })
    const firstItem = selectedEquipments.value[0]
    const result: any = await requestFunc(TaskOrderFuncName.CheckEquipTaskList, equipType, {
      id: firstItem.mainID,
    })

    if (result?.data) {
      equipDataForPopup.value = result.data
    }

    const projectList: any[][] = []
    for (const item of selectedEquipments.value) {
      if (item.reportRespVOList || item.reportDOList) {
        projectList.push(item.reportRespVOList || item.reportDOList)
      }
    }
    checkProjectList.value = projectList
    uni.hideLoading()
  } catch (error) {
    uni.hideLoading()
    console.error('加载设备详情失败:', error)
    return uni.showToast({ title: '加载失败', icon: 'error' })
  }

  selectTemplates.value = {}
  currentSelectedCheckProjectItems.value = []
  showCheckProject.value = true
}

const closeCheckProjectPopup = () => {
  showCheckProject.value = false
  currentSelectedCheckProjectItems.value = []
}

const handleCheckProjectChange = (selectedItems: any[]) => {
  currentSelectedCheckProjectItems.value = selectedItems
}

const handleCheckProjectConfirm = async (checkProjectItems: any[]) => {
  const addProjectList = []
  selectedEquipments.value.forEach((item: any) => {
    checkProjectItems.forEach((project: any) => {
      const newItem = {
        ...project,
        orderItemId: item.mainID,
      }
      addProjectList.push(newItem)
    })
  })
  closeCheckProjectPopup()
  uni.showLoading({ title: '提交中...' })
  try {
    await addInspectProject({
      itemList: addProjectList,
      // 200 表示锅炉 300是管道
      type: 200,
    })
    initSelect()
    await fetchCheckerOnlineEquipmentList()
  } catch (error) {
    console.error('添加检验项目失败:', error)
    uni.showToast({ title: '添加项目失败', icon: 'error' })
  } finally {
    uni.hideLoading()
  }
}

const showSuspendPopupFunc = () => {
  const networkType = uni.getNetworkType?.()
  if (networkType === 'none') {
    return uni.showToast({ title: '当前网络连接不可用，请检查网络设置后重新操作', icon: 'error' })
  }
  if (!selectedEquipments.value.length) {
    return uni.showToast({ title: '请先选择设备', icon: 'error' })
  }
  showMoreOperate.value = false
  suspendReasonDict.value = ''
  suspendReason.value = ''
  showSuspendPopup.value = true
}

const closeSuspendPopup = () => {
  showSuspendPopup.value = false
  suspendReasonDict.value = ''
  suspendReason.value = ''
}

const suspendCheck = async (flag: number) => {
  if (!suspendReasonDict.value) {
    return uni.showToast({ title: '请选择拒检类别', icon: 'error' })
  }
  if (suspendReasonDict.value === '5' && !suspendReason.value.trim()) {
    return uni.showToast({ title: '请输入拒绝检验原因', icon: 'error' })
  }
  uni.showLoading({ title: '加载中' })
  const ids = selectedEquipments.value.map((item: any) => item.mainID)
  try {
    const reqData = {
      orderItemIds: ids,
      reason: suspendReason.value,
      reasonDict: suspendReasonDict.value,
      flag,
    }
    const result = await requestFunc(TaskOrderFuncName.BatchSuspendEquip, equipType, reqData)
    uni.hideLoading()
    if (result?.code === 0) {
      initSelect()
      fetchCheckerOnlineEquipmentList()
      uni.showToast({ title: '中止检验成功', icon: 'success' })
      uni.$emit('RefreshOrder')
    } else {
      const msg = result?.msg || '中止检验失败'
      uni.showToast({ title: msg, icon: 'error' })
    }
  } catch (error) {
    uni.showToast({ title: '中止检验失败', icon: 'error' })
  } finally {
    closeSuspendPopup()
    uni.hideLoading()
  }
}

const createInform = async () => {
  const networkType = uni.getNetworkType?.()
  if (networkType === 'none') {
    return uni.showToast({ title: '无网络连接，请联网重试' })
  }
  if (!orderId.value) return

  if (selectedEquipments.value.length !== 1) {
    return uni.showToast({ title: '只能选择一个设备添加重大问题线索', icon: 'error' })
  }

  const selectedEquipment = selectedEquipments.value[0]
  const majorIssue = selectedEquipment.reportRespVOList.find((item: any) => item.reportType == 500)
  if (majorIssue) {
    return uni.showToast({ title: '该设备已添加了重大问题线索', icon: 'error' })
  }

  uni.showLoading({ title: '提交中...', mask: true })
  try {
    const orderFormResp = await requestFunc(TaskOrderFuncName.GetOrderForm, equipType, {
      orderId: orderId.value,
      businessType: 400,
      orderItemId: selectedEquipment.mainID,
    })
    if (orderFormResp?.code !== 0) {
      return uni.showToast({ title: orderFormResp?.msg || '获取模板失败', icon: 'error' })
    }

    const templateId = orderFormResp?.data?.templateId || ''
    const addMajorIssueResp = await requestFunc(TaskOrderFuncName.AddMajorIssues, equipType, {
      orderFormEnterReqVO: {
        businessType: 400,
        modifiedReason: '',
        orderId: orderId.value,
        orderItemId: selectedEquipment.mainID,
      },
      orderId: orderId.value,
      orderItemId: selectedEquipment.mainID,
      prepareId: userInfo.value?.id || '',
      prepareName: userInfo.value?.nickname || '',
      templateId: templateId,
    })
    const refId = addMajorIssueResp?.data || ''
    uni.navigateTo({
      url: `/pages/editor/mainQuestionEditor?templateId=${templateId}&refId=${refId}`,
    })
  } catch (error) {
    uni.hideLoading()
    uni.showToast({ title: '操作失败', icon: 'error' })
  }
}

const showAddInspectionplanPopup = async () => {
  if (!canAddInspectionplan.value) {
    return uni.showToast({ title: '请先选择设备', icon: 'error' })
  }
  showMoreOperate.value = false
  showInspectionplanPopup.value = true
  inspectionPlanType.value = 'commPlan'
  inspectionplanName.value = ''
  selectedTemplate.value = null
  try {
    const result = await pressure2NotVerifyPageApi({
      type: '6',
      reportType: 600,
      status: 200,
      pageNo: 1,
      pageSize: 9999,
    })
    optionsResult.value = result?.data || []
  } catch (error) {
    console.error('获取模板列表失败:', error)
  }
}

const closeInspectionplanPopup = () => {
  showInspectionplanPopup.value = false
}

const onTemplateChange = (selected) => {
  selectedTemplate.value = selected.selectedItems.label
  selectedTemplateId.value = selected.selectedItems.value
}

const addInspectionplanConfirm = async () => {
  if (!selectedTemplate.value) {
    return uni.showToast({ title: '请选择模板封面', icon: 'error' })
  }
  if (!inspectionplanName.value.trim()) {
    return uni.showToast({ title: '请输入检验方案名称', icon: 'error' })
  }
  closeInspectionplanPopup()
  uni.showLoading({ title: '提交中...', mask: true })
  try {
    const reqData = {
      orderId: orderId.value,
      orderItemIds: selectedEquipments.value.map((item) => item.mainID),
      prepareId: userInfo.value?.id || '',
      prepareJson: JSON.stringify({
        prepareName: userInfo.value?.nickname || '',
        prepareDate: dayjs().format('YYYY年MM月DD日'),
      }),
      prepareName: userInfo.value?.nickname || '',
      reportName: inspectionplanName.value.trim(),
      templateId: selectedTemplateId.value,
    }
    const res = await requestFunc(TaskOrderFuncName.AddMajorIssues, equipType, reqData)
    uni.navigateTo({
      url: `/pages/editor/inspectionPlanEditor?templateId=${selectedTemplateId.value}&refId=${res?.data || ''}`,
    })
  } catch (error) {
    uni.hideLoading()
    uni.showToast({ title: '操作失败', icon: 'error' })
  }
}

const handleUpdateContact = () => {
  const current = selectedEquipments.value[0]
  currentItem.value = current || {}
  showMoreOperate.value = false
  showUpdateContactPopup.value = true
}

const handleUpdateSafetyManagerConfirm = async (params: { name: string; phone: string }) => {
  if (selectedEquipIds.value.length < 1) {
    return uni.showToast({ title: '请选择设备', icon: 'error' })
  }

  try {
    uni.showLoading({ title: '提交中...' })

    const selectedEquip = selectedEquipments.value[0]
    const results = await updateEquipBoilerSecurityManager({
      id: selectedEquip.equipId,
      safery: params.name,
      saferydh: params.phone,
    })
    uni.hideLoading()

    const isSuccess = results?.code === 0
    if (isSuccess) {
      uni.showToast({ title: '修改成功', icon: 'success' })
      showUpdateContactPopup.value = false
      initSelect()
      await refreshList()
    } else {
      uni.showToast({ title: '修改失败', icon: 'none' })
    }
  } catch (error) {
    uni.hideLoading()
    console.error('修改安全管理员失败:', error)
    uni.showToast({ title: '修改失败', icon: 'none' })
  }
}

const handleRouteToEquipmentDetail = (item: any, pageType: string) => {
  uni.navigateTo({
    url: `/pages/equipment/detail/equipmentDetail?orderId=${orderId.value}&orderItemId=${item.mainID}&equipId=${item.equipId}&pageType=${pageType}&useOnline=1&canEdit=${true}`,
  })
}

const handleCalcTotalFee = (reportDOList: any) => {
  if (!reportDOList || !Array.isArray(reportDOList)) return 0
  return reportDOList
    .filter((x: any) => x.fee && !isNaN(x.fee) && typeof x.fee === 'number')
    .reduce((sum: number, item: any) => sum + item.fee, 0)
}
</script>

<style lang="scss" scoped>
.equipment-list-container {
  display: flex;
  flex-direction: column;
  height: 100vh;
  background-color: #f5f5f5;
}

.navigate-view {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 44px;
  padding: 0 12px;
  background-color: #fff;
  border-bottom: 1px solid #eee;
}

.navigate-left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}

.back-icon {
  width: 20px;
  height: 20px;
}

.navigate-title {
  flex: 1;
  font-size: 17px;
  font-weight: 500;
  color: #333;
  text-align: center;
}

.navigate-right {
  width: 40px;
}

.list-scroll {
  flex: 1;
  overflow: hidden;
}

.equipment-cell {
  padding: 12px;
  margin: 12px;
  margin-bottom: 0;
  background-color: #fff;
  border-radius: 5px;
}

.cell-top {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgb(244, 244, 244);
}

.row {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.checkbox-wrapper {
  margin-right: 10px;
}

.checkbox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border: 1px solid rgb(187, 187, 187);
  border-radius: 3px;
}

.checkbox.checked {
  background-color: #2f8eff;
  border-color: #2f8eff;
}

.check-icon {
  width: 12px;
  height: 12px;
}

.cell-top-left {
  display: flex;
  flex: 1;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

.equip-name {
  flex: 1;
  font-size: 16px;
  font-weight: bold;
  color: rgb(51, 51, 51);
}

.main-checker {
  flex-basis: 160px;
  flex-shrink: 0;
  font-size: 16px;
  font-weight: bold;
  color: rgb(51, 51, 51);
}

.status-tag {
  display: flex;
  flex-basis: 80px;
  flex-direction: row;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: 5px 0;
  border-radius: 4px;
}

.status-pending {
  background-color: rgba(230, 162, 60, 0.3);
  border: 1px solid rgba(230, 162, 60, 0.5);
}

.status-done {
  background-color: rgba(103, 194, 58, 0.3);
  border: 1px solid rgba(103, 194, 58, 0.5);
}

.status-text {
  font-size: 12px;
  color: rgb(202, 135, 35);
}

.status-done .status-text {
  color: rgb(80, 175, 33);
}

.cell-center {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.info-box {
  display: flex;
  flex: 1;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 8px 12px;
  background-color: rgb(244, 244, 244);
  border-radius: 5px;
}

.info-label {
  margin-top: 8px;
  font-size: 12px;
  color: rgb(108, 108, 108);
}

.info-value {
  color: rgb(51, 51, 51);
}

.cell-bottom {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  margin-top: 10px;
}

.claim-btn,
.record-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 75px;
  height: 29px;
  padding: 0 5px;
  margin-left: 5px;
  border-radius: 3px;
}

.blue-btn {
  color: white;
  background-color: rgb(47, 142, 255);
}

.white-btn {
  background-color: #fff;
  border: 1px solid rgb(217, 217, 217);
}

.blue-btn-text {
  font-size: 12px;
  color: rgb(222, 238, 255);
}

.white-btn-text {
  font-size: 12px;
  color: rgb(59, 59, 59);
}

.loading-text {
  padding: 15px;
  font-size: 14px;
  color: #999;
  text-align: center;
}

.empty-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 0;
  font-size: 14px;
  color: #999;
}

.bottom-operate {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 8px 12px;
  background-color: #fff;
  border-top: 1px solid #eee;
}

.select-all {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.select-all-text {
  margin-left: 6px;
  font-size: 14px;
  color: #333;
}

.btn-group {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.btn-group > button {
  min-width: 70px;
  height: 32px;
  padding: 8px 4px;
  margin-left: 6px;
  font-size: 14px;
  line-height: 1;
  border: none;
  border-radius: 3px;
}

.operate-btn {
  display: flex;
  align-items: center;
  justify-content: center;
}

.popup-mask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.5);
}

.popup-content {
  width: 80%;
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
}

.tips-text {
  display: block;
  margin-bottom: 20px;
  font-size: 16px;
  color: #333;
  text-align: center;
}

.popup-actions {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 36px;
  font-size: 14px;
  border: none;
  border-radius: 4px;
}

.cancel-btn {
  color: #666;
  background-color: #f5f5f5;
}

.confirm-btn {
  color: #fff;
  background-color: #2f8eff;
}

.warn-btn {
  color: #fff;
  background-color: #e6a23c;
}

.suspend-actions {
  gap: 8px;
}

.suspend-actions .action-btn {
  flex: 1;
  width: auto;
}

.more-operate-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 998;
}

.more-operate-panel {
  position: fixed;
  right: 0;
  bottom: 68px;
  left: 0;
  z-index: 999;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease;
  transform: translateY(100%);
}

.more-panel-show {
  transform: translateY(0);
}

.more-btn-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px 10px;
  background-color: #fff;
}

.more-btn-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding-top: 10px;
}

.more-btn-border {
  border-top: 1px solid #f4f5f6;
}

.more-btn-item.disabled {
  opacity: 1;
}

.more-btn-text {
  font-size: 14px;
  color: #333;
}

.suspend-popup .popup-title,
.inspectionplan-popup .popup-title {
  display: block;
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  text-align: center;
}

.tab-row {
  display: flex;
  margin-bottom: 12px;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #2f8eff;
}

.tab-item {
  flex: 1;
  padding: 8px 0;
  font-size: 14px;
  color: #2f8eff;
  text-align: center;
  background-color: #fff;
}

.tab-item.active {
  color: #fff;
  background-color: #2f8eff;
}

.suspend-textarea {
  box-sizing: border-box;
  width: 100%;
  height: 80px;
  padding: 8px;
  margin-bottom: 15px;
  font-size: 14px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.form-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 12px;
}

.form-label {
  margin-bottom: 6px;
  font-size: 14px;
  color: #333;
}

.picker-value {
  padding: 8px;
  font-size: 14px;
  color: #333;
  background-color: #f5f5f5;
  border-radius: 4px;
}

.form-input {
  padding: 0px;
  font-size: 14px;
  background-color: #f5f5f5;
  border-radius: 4px;
}

.template-scroll {
  max-height: 200px;
  margin-bottom: 15px;
}

.template-item {
  padding: 10px;
  font-size: 14px;
  color: #333;
  border-bottom: 1px solid #eee;
}

.template-item.active {
  color: #2f8eff;
  background-color: #f0f8ff;
}

.check-project-popup {
  height: 80vh;
  padding: 0;
  overflow: hidden;
}

.popup-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  border-bottom: 1px solid #eee;
}

.popup-close {
  font-size: 20px;
  color: #999;
}
</style>