<template>
  <div class="app-container">
    <el-card shadow="never">
      <template #header><div class="card-header"><span>在建工程监管</span></div></template>
      <el-table :data="list" stripe v-loading="loading">
        <el-table-column prop="id" label="序号" width="60" />
        <el-table-column prop="name" label="工程名称" min-width="200" />
        <el-table-column prop="type" label="类型" width="80" />
        <el-table-column prop="contractor" label="施工单位" width="160" />
        <el-table-column prop="startDate" label="开工日期" width="110" />
        <el-table-column prop="endDate" label="竣工日期" width="110" />
        <el-table-column label="进度" width="120">
          <template #default="s">
            <el-progress :percentage="parseInt(s.row.progress)" :status="s.row.progress==='100%'?'success':undefined" />
          </template>
        </el-table-column>
        <el-table-column prop="status" label="状态" width="100">
          <template #default="s"><el-tag :type="s.row.status==='已完工'?'success':'warning'">{{ s.row.status }}</el-tag></template>
        </el-table-column>
        <el-table-column label="操作" width="200" fixed="right">
          <template #default="s">
            <el-button type="primary" link @click="handleDetail(s.row)">详情</el-button>
            <el-button type="primary" link @click="handleVideo(s.row)">视频</el-button>
            <el-button type="primary" link @click="handleFile(s.row)">附件</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>
<script setup name="Zggc">
import { getProjectList } from '@/api/slgc/zggc/index'
const router = useRouter()
const loading = ref(true); const list = ref([])
function handleDetail(r) {
  router.push({ path: '/slgc/zggc/detail', query: { id: r.id, name: r.name, type: r.type, progress: r.progress, status: r.status } })
}
function handleVideo(r) { router.push({ path: '/slgc/zggc/video', query: { id: r.id, name: r.name } }) }
function handleFile(r) { router.push({ path: '/slgc/zggc/file', query: { stcd: r.id || '0' } }) }
onMounted(() => { getProjectList().then(r => { list.value = r.rows; loading.value = false }) })
</script>
<style scoped>.card-header { font-weight:600;font-size:16px; }</style>
