<template>
  <div class="first">
    <!-- 类容 -->
    <div class="dialog-form-detail flex flex-r flex-wrap" style="margin-top: 5px">
      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查任务名称</div>
        <div class="detail-value flex flex-align-center">
          {{ props.DataList.taskName }}
        </div>
      </div>
      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查人员</div>
        <!-- <div class="detail-value flex flex-align-center">{{ props.DataList.taskUserList[0].userName }}</div> -->
      </div>
      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查任务开始时间</div>
        <div class="detail-value flex flex-align-center">{{ props.DataList.planStartDatetime }}</div>
      </div>
      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查任务结束时间</div>
        <div class="detail-value flex flex-align-center">{{ props.DataList.planEndDatetime }}</div>
      </div>

      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查项目</div>
        <div class="detail-value flex flex-align-center">
          {{ props.DataList.projectName }}
        </div>
      </div>
      <!-- <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查任务描述</div>
        <div class="detail-value flex flex-align-center">{{ props.DataList.problemtitle }}</div>
      </div> -->

      <div class="flex flex-r">
        <div class="detail-label flex flex-align-center">巡查位置</div>
        <div class="detail-value flex flex-align-center">{{ props.DataList.projectAdress }}</div>
      </div>
    </div>

    <el-table :data="dataList" stripe style="margin-bottom: 20px; margin-top: 10px" :max-height="280">
      <el-table-column type="index" width="55" label="序号" />
      <!-- <el-table-column label="存在问题" prop="haveProblem"> </el-table-column> -->
      <!-- <el-table-column label="检查项" prop="checkItem" />

      <el-table-column label="问题描述" prop="problemContent" />
      <el-table-column label="上报时间" prop="createTime" /> -->
    </el-table>
  </div>
</template>

<script setup>
import { patrolProblemRectifyID } from '@/api/longoPeration/CaseIssues';
const props = defineProps({
  // 数据
  DataList: {
    type: Array,
    default: null,
  },
});
const { proxy } = getCurrentInstance();
const dataList = ref([]);

/** 查询列表 */
const getList = async IdA => {
  let res = await patrolProblemRectifyID(IdA);
  dataList.value = res.data;
  console.log(dataList.value, ' dataList.value');
};

watch(
  () => props.DataList,
  val => {
    if (val) {
      console.log(props.DataList, 'props.DataList');
      getList(props.DataList.id);
    }
  },
  { deep: true, immediate: true }
);
onMounted(() => {});
</script>

<style scoped lang="scss">
.first {
}
</style>