<template>
  <div>
    <div class="count-list">
      <div class="count-item">全部：{{ total || 0 }}</div>
    </div>
    <div>
      <el-table :data="workfileData" border style="width: 100%"  v-loading="loading">
        <el-table-column
          prop=""
          label="资源简介">
          <template slot-scope="scope">
          <span class="lblue point">
            <span @click="downloadWorkFile(scope.row.id)">{{ scope.row.file_name }}</span>
          </span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="资源大小">
          <template slot-scope="scope">
<!--          <span class="lblue point">-->
          <span>
            <span>{{ scope.row.file_size_name }}</span>
          </span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="作品名称">
          <template slot-scope="scope">
<!--          <span class="lblue point">-->
          <span>
            <span>{{ scope.row.work_name }}</span>
          </span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="作者">
          <template slot-scope="scope">
          <span class="lblue point">
            <a onclick="javascript:void(0)" v-if="scope.row.nickname == '-'">{{ scope.row.nickname }}</a>
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.uid" v-else>{{ scope.row.nickname }}</a>
          </span>
          </template>
        </el-table-column>
        <el-table-column prop="pay_time" label="发布时间">
          <template slot-scope="scope">
            <span>{{ formatDate(scope.row.file_time, 'Y-m-d H:i') }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="pay_time" label="基本数据">
          <template slot-scope="scope">
            <span>下载：{{ scope.row.download || 0 }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="pay_time" label="当前状态">
          <template slot-scope="scope">
            <span v-if="scope.row.status == '0'">待审核</span>
            <span v-else-if="scope.row.status == '1'">上架</span>
            <span v-else-if="scope.row.status == '2'">下架</span>
            <span v-else>--</span>
          </template>
        </el-table-column>
        <el-table-column prop="uid" label="操作">
          <template slot-scope="scope">
            <el-button type="text" v-if="scope.row.status != '1' " @click="onChange(scope.row.id,1)">上架</el-button>
            <el-button type="text" v-if="scope.row.status != '2' " @click="onChange(scope.row.id,2)">下架</el-button>
            <el-button type="text" @click="onDelete(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div style="padding-top: 5px">
      <el-pagination
        class="order-footer"
        background
        layout="total, prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: "user_cards_list",
  data() {
    return {
      page: 1,
      total: 0,
      workfileData: [],
      loading:false,
    }
  },
  mounted() {
    this.getAuditList();
  },
  methods: {
    async getAuditList() {
      const page = this.page;
      const data = {
        page
      };
      let res = await this.$post("/api/admin/UserWorks/getWorkFileList", data);
      if (res && res.status === 1) {
        this.workfileData = res.data.list || [];
        this.total = res.data.total * 1;
      }
    },
    onDelete(id) {
      this.loading = true;
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deleteWorkFile(id)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
        this.loading = false;
      });
    },
    async deleteWorkFile(id) {
      let res = await this.$post("/api/admin/UserWorks/deleteWorkFile", {id: id});
      if (res && res.status === 1) {
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
        this.getAuditList();
        this.loading = false;
      }
    },
    async onChange(id, type) {
      this.loading = true;
      let res = await this.$post("/api/admin/UserWorks/changeWorkFile", {id: id, type: type});
      if (res && res.status === 1) {
        this.$message({
          type: 'success',
          message: '操作成功!'
        });
        this.getAuditList();
        this.loading = false;
      }
    },
    async downloadWorkFile(id) {
      let url = window.location.host + '/api/admin/UserWorks/downloadWorkFile?id=' + id;
      window.location.href = "https://" + url;
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getAuditList();
    },
    formatDate(time, format = '') {
      if (time === "0") {
        return "--";
      }
      let now = new Date(time * 1000);
      let year = now.getFullYear();
      let month = now.getMonth() + 1;
      let date = now.getDate();
      let hour = now.getHours();
      let minute = now.getMinutes();
      let second = now.getSeconds();
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }
      return (format == '' ?
          year +
          "-" +
          month +
          "-" +
          date +
          " " +
          hour +
          ":" +
          minute +
          ":" +
          second
          :
          year +
          "-" +
          month +
          "-" +
          date +
          " " +
          hour +
          ":" +
          minute
      );
    },

  }

}
</script>

<style scoped>
.count-list {
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}
</style>
