<template>
  <div class="right_con">
    <div class="news_info_fgx fl"></div>
    <p class="power_audit fl">特权审核</p>
    <div class="search fr mar_T_15">
      <Input placeholder="申请账号" class="wid_120" v-model="search.applyusername" @on-enter="getPowerAudit()"></Input>
      <Select placeholder="状态" class="wid_120" v-model="search.status" :transfer='true'>
        <Option value="0">待审核</Option>
        <Option value="1">待发放</Option>
        <Option value="2">已驳回</Option>
        <Option value="3">已发放</Option>
      </Select>
      <DatePicker :transfer='true' type="date" :value="search.bg_date" :options="bg_date_op" placeholder="申请开始时间" class="wid_120" @on-change="bgdatechange"></DatePicker>-
      <DatePicker :transfer='true' type="date" :value="search.ed_date" :options="ed_date_op" placeholder="申请结束时间" class="wid_120" @on-change="eddatechange"></DatePicker>
      <Button type="primary" @click="getPowerAudit()">搜索</Button>
      <Button class="clear_btn" @click="removeSearch">清空</Button>
    </div>
    <Table :columns="powerAuditList" :data="powerAuditData" class="tables clear" border></Table>
    <div class="page">
      <Page :total="count" :current="pindex" :page-size="10" size="small" show-total show-elevator @on-change="getPowerAudit"/>
    </div>
  </div>
</template>
<script>
import { getNewtoday, removeSearch } from "@/assets/js/common";
export default {
  name: "power_audit",
  data() {
    return {
      count: 0,
      pindex: 1,
      search: {
        applyusername: "",
        status: "",
        bg_date: "",
        ed_date: ""
      },
      bg_date_op: {},
      ed_date_op: {},
      powerAuditList: [
        {
          title: "申请ID",
          key: "id"
        },
        {
          title: "申请账号",
          key: "manager_name"
        },
        {
          title: "申请特权",
          render: (h, params) => {
            let privilege = params.row.privilege ? params.row.privilege : [];
            return h(
              "p",
              privilege.map(item => {
                return h("p",{
                  style:{
                    marginTop:'10px',
                    marginBottom:'10px',
                  }
                },item.title);
              })
            );
          }
        },
        {
          title: "所需荣誉值",
          key: "honor_num"
        },
        {
          title: "剩余荣誉值",
          key: "current_honor_num"
        },
        {
          title: "申请时间",
          key: "create_time"
        },
        {
          title: "状态",
          render: (h, params) => {
            if (params.row.status == 0) {
              return h("span", {
                style: {
                  color: "rgb(0, 156, 255)"
                },
              }, "待审核");
            }
            if (params.row.status == 1) {
              return h("span", {
                style: {
                  color: "rgb(0, 156, 255)"
                },
              }, "待发放");
            }
            if (params.row.status == 2) {
              return h("span", {
                style: {
                  color: "rgb(255, 121, 0)"
                },
              }, "已驳回");
            }
            if (params.row.status == 3) {
              return h("span", {
                style: {
                  color: "rgb(0, 156, 255)"
                },
              }, "已发放");
            }
          }
        },
        {
          title: "操作",
          render: (h, params) => {
            const yes_btn = h(
              "span",
              {
                class: "operate-btn",
                style: {
                  color: "rgb(0, 156, 255)"
                },
                on: {
                  click: () => {
                    this.passPowerAudit(params.row.id, params.index);
                  }
                }
              },
              "通过"
            );
            const no_btn = h(
              "span",
              {
                class: "operate-btn",
                style: {
                  color: "rgb(255, 121, 0)"
                },
                on: {
                  click: () => {
                    this.rejectPowerAudit(params.row.id, params.index);
                  }
                }
              },
              "驳回"
            );
            const send_btn = h(
              "span",
              {
                style: {
                  color: "rgb(0, 156, 255)"
                },
                class: "operate-btn",
                on: {
                  click: () => {
                    this.grantPowerAudit(params.row.id, params.index);
                  }
                }
              },
              "发放"
            );
            const send_text = h(
              "span",
              {
                style: {
                  color: "rgb(0, 156, 255)"
                },
              },
              "--"
            );
            if (params.row.status == 0) {
              return [yes_btn, no_btn];
            }
            if (params.row.status == 1) {
              return [send_btn];
            }
            if (params.row.status == 2) {
              return [send_text];
            }
            if (params.row.status == 3) {
              return [send_text];
            }
          }
        }
      ],
      powerAuditData: []
    };
  },
  watch: {
    "search.bg_date"(n) {
      if (n) {
        let datetime = getNewtoday(n);
        this.ed_date_op = {
          disabledDate: date => {
            return date && date.valueOf() < new Date(datetime);
          }
        };
      } else {
        this.ed_date_op = {};
      }
    },
    "search.ed_date"(n) {
      if (n) {
        this.bg_date_op = {
          disabledDate: date => {
            return date && date.valueOf() > new Date(n);
          }
        };
      } else {
        this.bg_date_op = {};
      }
    }
  },
  methods: {
    // 获取列表数据
    getPowerAudit(page = 1) {
      this.pindex = page;
      this.$store.commit('changeloading',true)
      this.$api.getPowerAudit({
          limit: 10,
          page: this.pindex,
          name: this.search.applyusername,
          status: this.search.status,
          start_time: this.search.bg_date,
          end_time: this.search.ed_date
        }).then(data => {
          if (data.code == 200) {
            this.$store.commit('changeloading',false)
            this.powerAuditData = data.data;
            this.count = data.count;
          } else {
            this.$store.commit('changeloading',false)
            this.$Message.info(data.msg);
          }
        });
    },
    // 时间选择--开始时间
    bgdatechange(date) {
      this.search.bg_date = date;
    },
    // 时间选择--结束时间
    eddatechange(date) {
      this.search.ed_date = date;
    },
    // 清空搜索条件
    removeSearch() {
      this.search = { ...removeSearch({ ...this.search }) };
    },
    passPowerAudit(id, i) {
      this.$api.passPowerAudit({ id }).then(data => {
        if (data.code == 200) {
          this.powerAuditData[i].status = 1;
          this.$Message.info(data.msg);
        } else {
          this.$Message.info(data.msg);
        }
      });
    },
    rejectPowerAudit(id,i) {
      this.$api.rejectPowerAudit({ id }).then(data => {
        if (data.code == 200) {
          this.powerAuditData[i].status = 2;
          this.$Message.info(data.msg);
        } else {
          this.$Message.info(data.msg);
        }
      });
    },
    grantPowerAudit(id,i) {
      this.$api.grantPowerAudit({ id }).then(data => {
        if (data.code == 200) {
          this.powerAuditData[i].status = 3;
          this.$Message.info(data.msg);
        } else {
          this.$Message.info(data.msg);
        }
      });
    },
    sendTextPowerAudit(id,i){
      this.$api.sendTextPowerAudit({id}).then(data=>{
        if(data.code==200){
          this.$Message.info(data.msg)
        }else{
          this.$Message.info(data.msg)
        }
      })
    }
  },
  created() {
    this.getPowerAudit();
  }
};
</script>
<style>
.power_audit {
  font-size: 15px;
  margin-top: 15px;
  margin-left: 5px;
}
</style>



