<template>
  <div class="scene-management-body" v-loading.fullscreen.lock="fullscreenLoading">
    <div class="order-management-body">
      <div class="order-management-inner">
        <div class="base-info">
          <span>关键词：</span>
          <el-input
            @keyup.enter.native="()=>{currentPage=1;_getSceneData()}"
            v-model="searchKey"
            placeholder="关键词"
          ></el-input>

        </div>
      </div>
      <!-- 全部 -->
      <div class="scene-management_bottom">
        <div class="order-management-table">
          <el-table
            key="order_table"
            ref="order_table"
            class="e-table"
            :data="scenes"
            style="width: 100%"
          >
            <el-table-column label="标题">
              <template slot-scope="scope">
                <a :href="scope.row.webSite" target="_blank" style="cursor: pointer;">
                  {{scope.row.title}}
                </a>
              </template>
            </el-table-column>
            <el-table-column label="拍摄时间">
              <template slot-scope="scope">
                <div>{{new Date(scope.row.createTime).format('yyyy-MM-dd hh:mm:ss')}}</div>
              </template>
            </el-table-column>
            <el-table-column prop="status" label="状态">
              <template slot-scope="scope">
                {{statusMap[scope.row.status]}}
              </template>
            </el-table-column>
            <el-table-column prop="snCode" label="拍摄设备snCode" ></el-table-column>
            <el-table-column prop="userId" label="所属用户"></el-table-column>

          </el-table>
        </div>
        <div class="order-management-pagination">
          <el-pagination
            @current-change="handleCurrentChange"
            :current-page.sync="currentPage"
            :page-size="pageSize"
            layout="total, prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>
<script>


        // "childName": "",
        // "createTime": "2021-08-18 20:22:42",
        // "id": "t-8RZswdS",
        // "path": "/mnt/data/00001001/877605413455921152/74ee2a32dbde_202108180952482000/results",
        // "recount": null,
        // "shootTime": "",
        // "snCode": "",
        // "status": 0,
        // "title": "楼顶",
        // "updateTime": null,
        // "userId": null,
        // "webSite": "https://testlaser.4dkankan.com/maxkk/t-8RZswdS"

const statusMap = {
  0: '未初始化',
  1: '初始化完成'
}

export default {
  data () {
    return {
      currentPage: 1,
      fullscreenLoading: false,
      total: 0,
      pageSize: 10,
      searchKey: '',
      scenes: [],
      statusMap
    }
  },
  methods: {
    async changTypeHandle (item) {
      this.fullscreenLoading = true
      await this.$http.post('/manager/scene/updateSceneType', {
        sceneType: item.sceneType,
        sceneNum: item.num
      })

      this._getSceneData()
      this.fullscreenLoading = false
    },
    async _getSceneData() {
      this.fullscreenLoading = true
      let res = await this.$http.post('http://120.25.146.52:9294/indoor/scene/list', {
        searchKey: this.searchKey,
        pageNum: this.currentPage,
        pageSize: this.pageSize
      })

      this.scenes = res.data.content
      
      this.fullscreenLoading = false
      this.total = res.data.totalElements

    },
    handleCurrentChange (val) {
      let page = val
      // console.log(`当前页: ${val}`)
      if (this.total > 0 && !this.hasClickSearch) {
        this._getSceneData(page)
      } else {
        this._searchOrderByPage(page)
      }
    },
  },
  watch: {
    currentPage () {
      this._getSceneData()
    }
  },
  created () {
    this._getSceneData()
  }
}
</script>
<style lang="css" scoped>
@import "./style.css";
</style>
<style type="text/css">
.el-table__expand-icon > i {
  display: none !important;
}

.delete_btn span {
  color: #f56c6c;
}

.download_btn span {
  color: #09e1c0;
}

.el-dialog__body {
  padding: 10px 20px;
}

.el-dialog__title {
  font-weight: 700;
}

.el-progress-bar {
  margin-top: 10px;
}

.el-dialog {
  border-radius: 7px;
}

.cancle-download-btn {
  background: #09e1c0;
  color: white;
  width: 120px;
  font-size: 16px;
  font-weight: 100;
  letter-spacing: 1px;
  border: none;
}

.cancle-download-btn:hover {
  background: #09e1c0;
  color: white;
}

.cancle-download-btn:focus {
  color: white;
}

#progressText {
  padding: 0 0 20px 0;
  font-weight: 100;
}

#downloadDataName,
#percent {
  font-size: 16px;
  font-weight: 200;
  color: black;
}

#percent {
  float: right;
}
</style>
