<template>
  <div class="right_con">
    <div v-if="isWelfareType=='list'">
      <div class="news_info_fgx fl"></div>
      <p class="honor_welfare fl">福利设置</p>
      <Button type="primary" class="add_honor_welfare" @click="isWelfareType='add'">添加新福利</Button>
      <!-- <div class="search fr pad_T_15">
        <Button type="primary" @click="getHonorWelfare()">搜索</Button>
        <Button class="clear_btn" @click="removeSearch">清空</Button>
      </div> -->
      <Table :columns="honorWelfareList" border :data="honorWelfareData" class="tables clear"></Table>
      <div class="page">
        <Page :total="count" :current="pindex" :page-size="10" size="small" show-total show-elevator @on-change="getHonorWelfare"/>
      </div>
    </div>
    <div v-else>
      <editHonorWelfare :pindex='pindex' :isWelfareType='isWelfareType' :welfareTypeId='welfareTypeId' @return_last='return_last'></editHonorWelfare>
    </div>
  </div>
</template>
<script>
import { removeSearch,changeUnixtimedate } from "@/assets/js/common";
import editHonorWelfare from "@@/honor/edit_honor_welfare";
export default {
  name: "honor_welfare",
  components: {editHonorWelfare},
  data() {
    return {
      count: 0,
      pindex: 1,
      isWelfareType:'list',
      welfareTypeId:null,
      honorWelfareList: [
        {
          title:'指标',
          key:'required'
        },
        {
          title:'福利名称',
          key:'name'
        },
        {
          title:'有效期',
          render:(h,params)=>{
            let bgtime=!!params.row.start_time?changeUnixtimedate(params.row.start_time):'永久'
            let edtime=!!params.row.end_time?changeUnixtimedate(params.row.end_time):'永久'
            if(bgtime=='永久'&&edtime=='永久'){
              return h('span','永久')
            }else{
              return h('span',bgtime+'至'+edtime)
            }
            
          }
        },
        {
          title:'最后编辑时间',
          key:'update_time'
        },
        {
          title:'编辑者',
          key:'manager_name'
        },
        {
          title:'操作',
          render:(h,params)=>{
            const edit_btn =h('span',{
              class: "operate-btn",
              style: {
                color: "rgba(0, 156, 255, 1)"
              },
              on: {
                click: () => { 
                  this.isWelfareType='edit'
                  this.welfareTypeId=params.row.id
                }
              }
            },'编辑')
            const delete_btn =h('span',{
              class: "operate-btn",
              style: {
                color: "rgba(255, 121, 0, 1)"
              },
              on: {
                click: () => {
                  this.deleteHonorWelfare(params.row.id,params.index)
                 }
              }
            },'删除')
            return [edit_btn,delete_btn]
          }
        }
      ],
      honorWelfareData: []
    };
  },
  watch: {},
  methods: {
    getHonorWelfare(page = 1) {
      this.pindex = page
      this.$api.getHonorWelfare({limit:10,page:this.pindex}).then(data=>{
        if(data.code==200){
          this.honorWelfareData=data.data
          this.count=data.count
        }else{
          this.$Message.info(data.msg)
        }
      })
    },
    removeSearch() {
      this.search = { ...removeSearch({ ...this.search }) };
    },
    return_last(page){
      this.isWelfareType='list'
      this.getHonorWelfare(page)
    },
    deleteHonorWelfare(id,i){
      this.$Modal.confirm({
        title: "提示信息",
        class: "vertical-center-modal no-padding",
        render: h => {
          return h("div", { class: "login_out" }, [
            h("p",
              {
                style: {
                  width: "100%",
                  padding: "30px 0px!important",
                  textAlign: "center",
                  backgourndColor: "rgba(52, 64, 78, 1)",
                  fontSize: "16px",
                  color: "rgba(51, 51, 51, 1)",
                  fontWeight: "400"
                },
              },"确认删除吗？")
          ]);
        },
        onOk: () => {
          this.$api.deleteHonorWelfare({id}).then(data=>{
            if(data.code==200){
              this.$Message.info(data.msg)
              this.honorWelfareData.splice(i,1)
            }else{
              this.$Message.info(data.msg)
            }
          })
        }
      });
    }
  },
  created() {
    this.getHonorWelfare()
  }
};
</script>
<style>
.honor_welfare {
  margin-top: 15px;
  margin-left: 5px;
  font-size: 15px;
}
.add_honor_welfare {
  margin-top: 10px;
  margin-left: 20px;
}
</style>


