tba-hzz-xc/gw-ui/src/views/hlgl/supervision/index.vue

<template>
  <div class="app-container">
    <el-table v-loading="loading" :data="supervisionList" border>
      <el-table-column label="序号" type="index" width="55" align="center" />
      <el-table-column label="GUID" prop="GUID" width="100" :show-overflow-tooltip="true" />
      <el-table-column label="状态" prop="STATUS" width="100" />
      <el-table-column label="审核信息" prop="AUDIT_INFO" :show-overflow-tooltip="true" min-width="180" />
      <el-table-column label="操作" align="center" width="150" fixed="right">
        <template #default="scope">
          <el-button link type="primary" icon="View" @click="handleDetail(scope.row)">详情</el-button>
          <el-button link type="primary" icon="Check" @click="handleAudit(scope.row)">审核</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" @pagination="getList" />

    <!-- 详情对话框 -->
    <el-dialog title="督导详情" v-model="detailVisible" width="800px" append-to-body>
      <el-tabs>
        <el-tab-pane label="附件">
          <el-table :data="attachments" border size="small">
            <el-table-column label="GUID" prop="GUID" :show-overflow-tooltip="true" />
            <el-table-column label="文件名" prop="FILE_NAME" :show-overflow-tooltip="true" />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="分工">
          <el-table :data="divisions" border size="small">
            <el-table-column label="GUID" prop="GUID" :show-overflow-tooltip="true" />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="结果">
          <el-table :data="results" border size="small">
            <el-table-column label="GUID" prop="GUID" :show-overflow-tooltip="true" />
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>

    <!-- 审核对话框 -->
    <el-dialog title="审核督导" v-model="auditVisible" width="500px" append-to-body>
      <el-form :model="auditForm" label-width="80px">
        <el-form-item label="审核结果"><el-select v-model="auditForm.audit" style="width:100%"><el-option label="通过" value="1" /><el-option label="不通过" value="0" /></el-select></el-form-item>
        <el-form-item label="审核意见"><el-input v-model="auditForm.auditInfo" type="textarea" :rows="3" /></el-form-item>
      </el-form>
      <template #footer>
        <el-button @click="auditVisible = false">取消</el-button>
        <el-button type="primary" @click="submitAudit">确定</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue'
import { listSupervision, getSupervisionDetail, auditSupervision } from '@/api/hzz/supervision'
import { ElMessage } from 'element-plus'

const loading = ref(false)
const total = ref(0)
const pageNum = ref(1)
const pageSize = ref(10)
const supervisionList = ref([])

const detailVisible = ref(false)
const attachments = ref([])
const divisions = ref([])
const results = ref([])

const auditVisible = ref(false)
const auditForm = reactive({ guid: '', audit: '1', auditInfo: '' })

const getList = async () => {
  loading.value = true
  try {
    const res = await listSupervision({ pageNum: pageNum.value, pageSize: pageSize.value })
    supervisionList.value = res.rows || []
    total.value = res.total || 0
  } finally { loading.value = false }
}

const handleDetail = async (row) => {
  const res = await getSupervisionDetail(row.GUID)
  attachments.value = res.data?.attachments || []
  divisions.value = res.data?.divisions || []
  results.value = res.data?.results || []
  detailVisible.value = true
}

const handleAudit = (row) => {
  auditForm.guid = row.GUID
  auditForm.audit = '1'
  auditForm.auditInfo = ''
  auditVisible.value = true
}

const submitAudit = async () => {
  await auditSupervision(auditForm.guid, auditForm.audit, auditForm.auditInfo)
  ElMessage.success('审核完成')
  auditVisible.value = false
  getList()
}

onMounted(() => getList())
</script>