nxdt-uniapp/pages/projectInfo/toolDetails.vue

<template>
  <view>
    <Navbar title="工具器详情" />
    <div class="content">
      <u-form
        labelPosition="left"
        :model="formData"
        ref="addressForm"
        labelWidth="120"
        :labelStyle="{ fontWeight: 400, fontSize: '12px', color: 'rgba(15, 39, 75, 0.6)' }"
      >
        <!-- 工具器名称 -->
        <u-form-item label="工具器名称" borderBottom>
          <u-input
            v-model="formData.equipName"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 型号 -->
        <u-form-item label="型号" borderBottom>
          <u-input
            v-model="formData.model"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 数量 -->
        <u-form-item label="数量" borderBottom>
          <u-input
            v-model="formData.num"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 单位 -->
        <u-form-item label="数量" borderBottom>
          <u-input
            v-model="formData.unit"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 设备型号 -->
        <u-form-item label="设备型号" borderBottom>
          <u-input
            v-model="formData.equipType"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 是否强制监测 -->
        <u-form-item label="是否强制监测" borderBottom>
          <u-input
            v-model="formData.isForceDetection"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
        <!-- 下次检测时间 -->
        <u-form-item label="下次检测时间" borderBottom>
          <u-input
            v-model="formData.nextDetectionTime"
            disabled
            disabledColor="#fff"
            border="none"
            inputAlign="right"
            fontSize="12"
            style="font-weight: 500"
          />
        </u-form-item>
      </u-form>
      <div>
        <Title title="工器具文件" />
        <Preview :dataList="formData.instrumentDocumentFiles" />
      </div>
      <div style="margin: 30px 0" v-if="showBtn">
        <u-button type="primary" size="small" shape="circle" @click="handleReadOver">完成批阅</u-button>
      </div>
    </div>
  </view>
</template>

<script>
import { getEquipDetails, addAnnotations } from '@/api/project'

export default {
  data() {
    return {
      loading: false,
      opt: {},
      formData: {
        equipName: '', // 工具器名称
        model: '', // 型号
        num: '', // 数量
        unit: '', // 单位
        equipType: '', // 设备型号
        // 是否强制监测
        isForceDetection: '',
        // 下次检测时间
        nextDetectionTime: '',
        instrumentDocumentFiles: [] // 工器具文件
      },
      showBtn: false
    }
  },
  onLoad(options) {
    this.opt = JSON.parse(options.params)
    console.log('🚀 ~ onLoad ~ options:', this.opt)
    if (this.opt.isApproval) {
      this.showBtn = true
    } else {
      this.showBtn = false
    }
  },
  mounted() {
    this.getEquipDetails()
  },
  methods: {
    // 完成批阅
    handleReadOver() {
      console.log('完成批阅')
      // 确认提示框
      uni.showModal({
        title: '提示',
        content: '是否完成批阅？',
        success: async (res) => {
          if (res.confirm) {
            const params = {
              uuid: this.opt.uuid,
              taskId: this.opt.taskId,
              type: '2'
            }
            const res = await addAnnotations(params)
            console.log('🚀 ~ handleReadOver ~ 完成批阅:', res)
            if (res.code === 200) {
              uni.showToast({
                title: '批阅成功',
                icon: 'success'
              })
              setTimeout(() => {
                uni.navigateBack()
              }, 1000)
            }
          }
        }
      })
    },
    // 获取工具器详情
    async getEquipDetails() {
      const params = {
        id: this.opt.id,
        uuid: this.opt.uuid,
        proId: this.opt.proId,
        consUuid: this.opt.consUuid
      }
      const res = await getEquipDetails(params)
      console.log('🚀 ~ getEquipDetails ~ 工具器详情:', res)
      if (res.code === 200) {
        this.formData = res.data
        this.formData.isForceDetection = res.data.isForceDetection == '1' ? '是' : '否'
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.content {
  padding: 0 20px;
}
</style>