td_official/src/views/safety/safetyLog/component/SafetyLogDetailDialog.vue

<template>
  <el-card v-loading="loading">
    <h2 style="text-align: center; margin-top: 5px; font-weight: bold">安全日志</h2>
    <el-row>
      <el-col :span="12" style="text-align: left">记录人：{{ safetyLogDetail?.fill }}</el-col>
      <el-col :span="12" style="text-align: right">记录时间：{{ safetyLogDetail?.createdAt }}</el-col>
    </el-row>
    <el-descriptions :column="3" border style="margin-top: 8px">
      <el-descriptions-item label-align="center" width="160px" label="项目名称" :span="3">{{ safetyLogDetail?.projectName }} </el-descriptions-item>
      <el-descriptions-item label-align="center" label="发生日期" :span="safetyLogDetail?.fileList ? 3 : 1"
        >{{ safetyLogDetail?.dateOfOccurrence }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="气温" v-if="!safetyLogDetail?.fileList">
        <span>最高：{{ safetyLogDetail?.airTemperatureMax }}（℃）</span>
        <span>最低：{{ safetyLogDetail?.airTemperatureMin }}（℃）</span>
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="气候" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.climateName }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="工程施工部位及施工进展情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.progress }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="当日主要危险性项目作业内容" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.jobContent }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="施工项目安全教育与安全交底情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.discloseTheFacts }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="施工作业队伍班前施工安全活动情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.progressOfActivity }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="现场施工安全巡视与检查情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.examine }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="季节施工防寒、防暑等措施实施情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.implementation }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="监理通知有关部门安全检查情况" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.safetyInspectionSituation }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="停工、加班情况" :span="3" v-if="!safetyLogDetail?.fileList"
        >{{ safetyLogDetail?.stoppageOrOvertime }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="其他应记录的安全与文明施工事项" :span="3" v-if="!safetyLogDetail?.fileList">
        {{ safetyLogDetail?.otherRecords }}
      </el-descriptions-item>
      <el-descriptions-item label-align="center" label="附件" :span="3" v-if="safetyLogDetail?.fileList">
        <el-space direction="vertical">
          <el-link
            v-for="item in safetyLogDetail?.fileList"
            :key="item.id"
            :href="`${BASE_URL}${item.path}`"
            type="primary"
            :underline="false"
            target="_blank"
          >
            <span> {{ item.name }} </span>
          </el-link>
        </el-space>
      </el-descriptions-item>
      <!-- <el-descriptions-item label-align="center" label="备注" :span="3">{{ safetyLogDetail?.remark }} </el-descriptions-item> -->
    </el-descriptions>
  </el-card>
</template>

<script setup lang="ts">
import { SafetyLogVO } from '@/api/safety/safetyLog/types';
import { getSafetyLog } from '@/api/safety/safetyLog';
import { useUserStoreHook } from '@/store/modules/user';
import { listByIds } from '@/api/system/oss';
import { OssVO } from '@/api/system/oss/types';

interface Props {
  safetyLogId?: string | number;
}
const BASE_URL = import.meta.env.VITE_APP_BASE_API_GO;
console.log('🚀 ~ BASE_URL:', BASE_URL);

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { weather_type } = toRefs<any>(proxy?.useDict('weather_type'));

// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const props = defineProps<Props>();
const loading = ref<boolean>(false);
const safetyLogDetail = ref<SafetyLogVO>();
const fileList = ref<Array<OssVO>>([]);
const get = async () => {
  loading.value = true;
  const res = await getSafetyLog(props.safetyLogId);
  if (res.data && res.code === 0) {
    safetyLogDetail.value = res.data;
    if (res.data.fileId) {
      const fileRes = await listByIds(res.data.fileId.split(','));
      fileList.value = fileRes.data;
    }
  }
  loading.value = false;
};

onMounted(() => {
  get();
});

watch(
  () => props.safetyLogId,
  (newId, oldId) => {
    if (newId !== oldId) {
      fileList.value = undefined;
      get();
    }
  }
);
</script>