<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               :page.sync="page"
               v-model="form"
               ref="crud"
               @selection-change="selectionChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="primary"
                   size="small"
                   icon="el-icon-download"
                   v-if="data && data.length > 0"
                   plain
                   @click="handleDownload">导出
        </el-button>
        <el-button type="danger"
                   size="small"
                   icon="iconfont icon-yanjing"
                   v-if="data && data.length > 0"
                   plain
                   @click="helpRecordHideByIp"> 废 齐
        </el-button>
        <el-button type="success"
                   size="small"
                   icon="iconfont icon-yanjing1"
                   v-if="data && data.length > 0"
                   plain
                   @click="helpRecordShowByIp"> 恢 复
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
  import {getVote,setStatusHideByIp,setStatusShowByIp} from "@/api/sing_active/activehelprecord";
  import {mapGetters} from "vuex";

  export default {
    name: "product-help-vote",
    data() {
      return {
        form: {},
        data: [],
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        option: {
          height:'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          addBtn: false,
          viewBtn: false,
          menu: false,
          selection: true,
          dialogClickModal: false,
          column: [
            {
              label: "作品名称",
              prop: "productName",
            },
            {
              label: "作品名称",
              prop: "productNo",
            },
            {
              label: "ip",
              prop: "ip",
            },
            {
              label: "投票次数",
              prop: "count",
            },
            {
              label: "状态",
              prop: "status",
              type: 'select',
              dicData: [{
                label:'正常',
                value: 1
              },{
                label:'已废弃',
                value: 0
              }]
            },
          ]
        },
      };
    },
    props: {
      productId: {
        type: String,
      }
    },
    computed: {
      ...mapGetters(["permission"]),
    },
    methods: {
      helpRecordHideByIp(){
        const arr = [];
        this.selectionList.forEach((ele) => {
          arr.push(ele.ip)
        });
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据隐藏?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return setStatusHideByIp(arr.toString());
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      helpRecordShowByIp(){
        const arr = [];
        this.selectionList.forEach((ele) => {
          arr.push(ele.ip)
        });
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据显示?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return setStatusShowByIp(arr.toString());
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      handleDownload(){
        this.$Export.excel({
          title: this.data[0].productName + "投票情况",
          columns: this.option.column,
          data: this.data
        })
      },
      onLoad() {
        this.loading = true;
        if (this.productId){
          getVote(this.productId).then(res => {
            const data = res.data.data;
            this.loading = false;
            this.data = data;
          });
        }
      }
    }
  };
</script>

<style>
</style>
