<!--
 * @Descripttion: 地球-浙江
 * @Author: sujunling
 * @Date: 2025-05-20 10:28:17
-->
<template>
  <transition
    appear
    name="animate__animated animate__move"
    enter-active-class="animate__fadeInUp"
    leave-active-class="animate__fadeOutDown"
  >
    <!--     enter-active-class="animate__zoomIn"
    leave-active-class="animate__zoomOut" -->
    <div class="widget-InspectionsNum">
      <div class="head">
        <div class="title">
          <div class="icon"></div>
          <span class="site-info">进度模拟方案</span>
          <span
            class="but_title_tab"
            :class="{ activeBut: activeName == i.num_boards }"
            v-for="(i, k) in titleList"
            :key="k"
            @click="changeActive(i.num_boards)"
            >{{ k ? `方案${i.num_boards + 1}` : `【最优】方案${i.num_boards + 1}` }}:&nbsp;&nbsp;工期{{
              Math.ceil(Math.abs(i.time_score))
            }}天</span
          >
          <i class="export-file" @click="project">导出project文件</i>
        </div>
      </div>
      <div class="but_table" :class="{ activeNoData2: tableData.length == 0 }">
        <el-table v-if="tableData.length" :data="tableData" size="mini" style="width: 100%" height="230">
          <el-table-column prop="num" label="序号"
            ><template slot-scope="scope">{{ scope.$index + 1 }}</template></el-table-column
          >
          <el-table-column prop="step" label="施工工序"> </el-table-column>
          <el-table-column prop="joint_unit" label="联合单元" width="200"> </el-table-column>
          <el-table-column prop="duration_days" label="工期（工作日）"
            ><template slot-scope="{ row }">{{ Math.ceil(Math.abs(row.duration_days)) }}</template></el-table-column
          >
          <el-table-column prop="start_time" label="开始时间"
            ><template slot-scope="{ row }">{{ getDate(row.start_time) }}</template></el-table-column
          >
          <el-table-column prop="end_time" label="结束时间"
            ><template slot-scope="{ row }">{{ getDate(row.end_time) }}</template></el-table-column
          >
          <el-table-column prop="" label="查看区域">
            <template slot-scope="scope">
              <el-button class="tdbutton" size="mini" type="primary" @click="addMarker(scope.row)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </transition>
</template>

<script>
import eventBus from '@/utils/eventBus.js'
import { getResultList } from 'staticPub/config'
export default {
  data() {
    return {
      activeName: 0,
      titleList: [],
      tableData: [],
      best_schedule: []
    }
  },
  mounted() {
    viewer.overlay = {
      list: []
    }

    window.init = function () {
      // 定义请求数据
      const requestData = {
        c_puct: 1.4142,
        n_playout: 2000,
        start_date: '2025-03-03T08:00:00',
        switch_time_hours: 744,
        rain_intervals: [{ start: '2025-03-10T00:00:00', end: '2025-03-12T00:00:00' }]
      }

      // 使用fetch发送POST请求
      fetch('http://localhost:8000/run', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify(requestData)
      })
        .then((response) => {
          if (!response.ok) {
            throw new Error('Network response was not ok')
          }
          return response.json()
        })
        .then((data) => {
          console.log('Success:', data)
          // 在这里处理响应数据
        })
        .catch((error) => {
          console.error('Error:', error)
          // 在这里处理错误
        })
    }
  },

  methods: {
    indexMethod(index) {
      return index + 1
    },

    changeActive(t) {
      this.activeName = t
      this.tableData = this.titleList[t].schedule
    },

    changeTable(t, best_schedule) {
      this.best_schedule = best_schedule
      this.titleList = t
      this.tableData = t[this.activeName].schedule
      //   this.tableData[0].joint_unit = ['B']
    },

    getDate(isoDate) {
      const date = new Date(isoDate)
      const year = date.getFullYear()
      const month = String(date.getMonth() + 1).padStart(2, '0')
      const day = String(date.getDate()).padStart(2, '0')
      const hours = String(date.getHours()).padStart(2, '0')
      const minutes = String(date.getMinutes()).padStart(2, '0')
      const seconds = String(date.getSeconds()).padStart(2, '0')
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
    },

    project() {
      var fileUrl = getResultList.fileUrl
      const link = document.createElement('a')
      link.href = fileUrl
      link.download = fileName || fileUrl.split('/').pop() // 默认使用URL中的文件名
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
    },

    openNewNode(step) {
      if (this.best_schedule && this.best_schedule.length) {
        var arr = this.best_schedule.filter((i) => i.step == step)
        if (arr && arr.length) {
          eventBus.emit('best_schedule', arr)
        }
      }
    },

    addMarker(r) {
      if (viewer.overlay && viewer.overlay.list && viewer.overlay.list.length) {
        for (var i = 0; i < viewer.overlay.list.length; i++) {
          viewer.entities.remove(viewer.overlay.list[i])
        }
      } else {
        viewer.overlay.list = []
      }
      var list = {
        A: [
          [111.28617392592109, 30.690762879728375],
          [111.28634705606925, 30.69098285392147],
          [111.28678862317192, 30.690738044523563],
          [111.28633188260623, 30.69010639622541],
          [111.28585748839016, 30.69034560843397],
          [111.28617392592109, 30.690762879728375]
        ],
        B: [
          [111.28633188260623, 30.69010639622541],
          [111.28678862317192, 30.69073804452356],
          [111.28711359561618, 30.69055787467016],
          [111.28666699327329, 30.68993741567625],
          [111.28633188260623, 30.69010639622541]
        ],
        C: [
          [111.28698435309421, 30.689777384704673],
          [111.28666699327329, 30.68993741567625],
          [111.28711359561618, 30.69055787467016],
          [111.2874096185659, 30.690393753583784],
          [111.28698435309421, 30.689777384704673]
        ],
        D: [
          [111.28737189745326, 30.68958196090819],
          [111.28698435309421, 30.68977738470467],
          [111.2874096185659, 30.69039375358378],
          [111.28779367049783, 30.69018082562396],
          [111.28737189745326, 30.68958196090819]
        ],
        E: [
          [111.28779367049783, 30.690180825623962],
          [111.2880461592682, 30.690040838431216],
          [111.28761529108642, 30.689459225815664],
          [111.28737189745326, 30.68958196090819],
          [111.28779367049783, 30.690180825623962]
        ]
      }
      if (r.joint_unit && r.joint_unit.length) {
        r.joint_unit.map((i) => {
          var pos = []
          for (var j = 0; j < list[i].length; j++) {
            var l = list[i][j]
            pos.push(Cesium.Cartesian3.fromDegrees(l[0], l[1]))
          }
          var line = viewer.entities.add({
            polyline: {
              positions: pos,
              width: 3,
              followSurface: true,
              material: Cesium.Color.fromCssColorString('rgba(14,234,255,0.9)'),
              clampToGround: true
            }
          })
          viewer.flyTo(line, {
            duration: 1
          })
          viewer.overlay.list.push(line)
        })
      }
    },

    toCartesian3(p, h) {
      if (p) {
        if (p instanceof Cartesian3) {
          return p
        } else {
          var o = getXY(p)
          var z = p.z || p[2] || '0.0'
          return Cartesian3.fromDegrees(Number(o.x), Number(o.y), Number(h || z))
        }
      }
    }
  }
}
</script>
<style>
.but_table th.el-table__cell,
.but_table .el-table,
.but_table .el-table__expanded-cell,
.but_table .el-table tr {
  background-color: rgba(14, 167, 255, 0) !important;
}
.but_table .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background-color: rgba(14, 167, 255, 0) !important;
}
.but_table .el-table td.el-table__cell,
.but_table .el-table th.el-table__cell.is-leaf {
  border-bottom: 1px solid rgba(14, 167, 255, 0);
}
.but_table .el-table {
  color: #fff !important;
}
.but_table .el-table th.el-table__cell > .cell {
  font-weight: 500;
  font-size: 14px;
  color: #2ba7ff;
}
.but_table .el-table--border::after,
.but_table .el-table--group::after,
.but_table .el-table::before {
  background-color: rgba(14, 167, 255, 0);
}
.activeNoData2 {
  height: 100%;
  background: url('~@/assets/images/jczc/noData2.png') no-repeat center center;
  background-size: 102px 74px;
}
</style>
<style lang='scss' scoped>
.export-file {
  position: absolute;
  right: 20px;
  font-weight: 400;
  cursor: pointer;
  font-size: 14px;
  color: #1eecff;
}
.but_title_tab {
  font-weight: normal;
}
// .animate__zoomIn,
// .animate__zoomOut {
//   animation-duration: 3s; //动画持续时间
//   animation-delay: 0s; //动画延迟时间
// }
.animate__fadeInUp,
.animate__fadeOutDown {
  animation-duration: 3s; //动画持续时间
  animation-delay: 0s; //动画延迟时间
}
.widget-InspectionsNum {
  background-color: #000;
  bottom: 0.052083rem /* 10/192 */;
  height: 1.572917rem /* 302/192 */;
  width: 98%;
  margin-left: 0.10417rem;
  position: absolute;
  font-family: Source Han Sans CN;
  overflow: hidden;
  background: linear-gradient(0deg, rgba(14, 167, 255, 0.7) 0%, rgba(14, 167, 255, 0.2) 100%);
  .head {
    height: 0.166667rem /* 32/192 */;
    width: 100%;
    background: linear-gradient(-90deg, rgba(43, 167, 255, 0.2) 0%, rgba(43, 167, 255, 0.08) 100%);
    font-family: Source Han Sans CN-HEAVY;
    .title {
      width: 100%;
      height: 100%;
      display: flex;
      font-weight: 400;
      align-items: center;
      position: relative;
      .icon {
        height: 0.166667rem /* 32/192 */;
        width: 0.34375rem /* 66/192 */;
        background: url('~@/views/groupPage/images/模块图标/统计分析/安全巡查.png') no-repeat center center;
        background-size: 100% 100%;
      }
      .site-info {
        margin-right: 50px;
      }
      span {
        font-weight: bold;
        font-size: 0.083333rem /* 16/192 */;
        color: #ffffff;
        padding: 0.041667rem /* 8/192 */;
        background: linear-gradient(0deg, #9bd2fa 0%, #ffffff 100%);
        background-clip: text;
        -webkit-text-fill-color: transparent;
        cursor: pointer;
      }
      .activeBut {
        color: #ffbd1f;
        background: linear-gradient(0deg, #ffbd1f 0%, #ffffff 100%);
        background-clip: text;
        -webkit-text-fill-color: transparent;
        border-bottom: solid 1px #ffbd1f;
      }
    }
  }
}
</style>
