jingNing_H5_Mobile/src/pages/officialDocumentManager/todoOffcialDoucument/detail/index.vue

<script setup>
import { closeToast, showLoadingToast, showToast } from 'vant'
import Pdfh5 from 'pdfh5'
import { userInfo } from "~/store/user";
const { user_id } = userInfo;
const { currentRoute } = useRouter()
const route = currentRoute.value
const gw_id = route.query.gw_id
const detailData = ref({})
const shjl = ref([])

let pdfHeight = $ref('')
function getData() {
  showLoadingToast({
    message: '加载中...',
    forbidClick: true,
  })
  request({
    url: '/jdbg/gwgl_gw/detail',
    data: {
      gw_id,
    },
  }).then((res) => {
    closeToast()
    detailData.value = res.data.one_info
    shjl.value = res.data.one_info.shjl
    const appendUrl = res.data.one_info.gw_content.split('|')[0]
    const curFileShowUrl = window.globalVariables.api
      + appendUrl.replace(/\.\w+$/, '.pdf')
    const pdfh5 = new Pdfh5('#pdfContent', {
      pdfurl: curFileShowUrl,
      scrollEnable: false,
      zoomEnable: false,
    })
    pdfh5.on('complete', (status, msg) => {
      const height = document.getElementsByClassName("pageContainer")[0].style['min-height'];
      const num = document.getElementsByClassName("pageContainer").length
      pdfHeight = parseFloat(height) * num + 50
    });

  })
}
getData()

const auditchecked = ref('')
const auditDialogShow = ref(false)
const sh_reason = ref('')
function clickAudit(item) {
  let ShPerson = item.sh_user_id;
  let localPerson = user_id;
  if (ShPerson !== localPerson) {
    showToast('请审核自己的项目')
    return
  }
  auditchecked.value = ''
  sh_reason.value = ''
  auditDialogShow.value = true
}
function beforeCloseDialog(action) {
  if (action == 'confirm') {
    if (auditchecked.value == '') {
      showToast('请选择审核结果')
      return false
    }
    else if (sh_reason.value == '') {
      showToast('请填写意见')
      return false
    }
    else {
      dialogSubmit()
      return true
    }
  }
  else {
    return true
  }
}
function dialogSubmit() {
  const transObj = {
    gw_id,
    sh_status: auditchecked.value, // 待审核 1通过 2驳回
    sh_reason: sh_reason.value, // 处理意见
  }
  showLoadingToast({
    message: '提交中...',
    forbidClick: true,
  })
  request({
    url: '/jdbg/gwgl_gw/check',
    data: transObj,
  }).then((res) => {
    closeToast()
    if (res.code == 1) {
      showToast(res.msg)
      getData()
    }
  })
}
</script>

<template>
  <div>
    <div class="tableContainer">
      <div class="topPart">
        <table class="Tb" width="100%" cellspacing="0" cellpadding="0">
          <tr>
            <td class="titleOpt">
              类型：
            </td>
            <td>{{ detailData.lb_name }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              标题：
            </td>
            <td>{{ detailData.gw_title }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              发文字号：
            </td>
            <td>{{ detailData.gw_zh }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              发起人：
            </td>
            <td>{{ detailData.gw_fqr_name }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              发起科室：
            </td>
            <td>{{ detailData.gw_fqks_name }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              发起时间：
            </td>
            <td>{{ detailData.create_dateline }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              当前步骤：
            </td>
            <td>{{ detailData.gw_bz }}</td>
          </tr>
          <tr>
            <td class="titleOpt">
              当前审核人：
            </td>
            <td>{{ detailData.gw_shr }}</td>
          </tr>

          <tr>
            <td class="titleOpt">
              审核状态：
            </td>
            <td>
              <div class="specialTd">
                {{ detailData.gw_status_option_n }}
              </div>
            </td>
          </tr>
          <tbody v-for="(item, index) in shjl" :key="index" class="bg-hex-fffff9 border_bottom">
            <tr>
              <td class="titleOpt">
                步骤名称：
              </td>
              <td>
                <div class="specialTd">
                  {{ item.sh_dept_name }}
                </div>
              </td>
            </tr>
            <tr>
              <td class="titleOpt">
                审核人：
              </td>
              <td>
                <div class="specialTd">
                  {{ item.sh_user_name }}
                </div>
              </td>
            </tr>
            <tr>
              <td class="titleOpt">
                操作：
              </td>
              <td>
                <div v-if="item.sh_status == 2">
                  通过
                </div>
                <div v-else-if="item.sh_status == 1" style="padding-top: 5px;padding-bottom: 5px;line-height: 100%;">
                  <van-button class="rightButton" type="primary" @click.stop="clickAudit(item)">
                    审核
                  </van-button>
                </div>
                <div v-else>
                  不通过
                </div>
              </td>
            </tr>
            <tr>
              <td class="titleOpt">
                处理意见：
              </td>
              <td>
                <div class="specialTd">
                  {{ item.sh_reason }}
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
    <div id="pdfContent" :style="{ height: pdfHeight + 'px' }" />
    <van-dialog v-model:show="auditDialogShow" title="审核" confirm-button-text="提交" show-cancel-button
      :before-close="beforeCloseDialog">
      <div class="dialogDiv">
        <van-radio-group v-model="auditchecked">
          <van-cell-group inset>
            <van-cell title="通过" clickable @click="auditchecked = '2'">
              <template #right-icon>
                <van-radio name="2" />
              </template>
            </van-cell>
            <van-cell title="不通过" clickable @click="auditchecked = '3'">
              <template #right-icon>
                <van-radio name="3" />
              </template>
            </van-cell>
          </van-cell-group>
        </van-radio-group>
        <van-field v-model="sh_reason" rows="3" autosize type="textarea" placeholder="填写意见" />
      </div>
    </van-dialog>
  </div>
</template>

<style lang="scss" scoped>
.rightButton {
  height: 30px;
  width: 75px;
}

:deep(.specialTd table tbody tr td) {
  border: 1px #CCCCCC solid !important;
}
</style>