<style>
.tr_active{background:#f3f5f7;}
</style>
<template>
<div class="container resource" style="min-height: 490px;">

  <div class="pop-banner clearfix">
    
    <div class="operate-btns">
        <a href="javascript:void(0)" class="fbtn fb-modify" 
          v-show="!addrow&&edits==0"
          v-on:click="update()">修改</a>

        <a href="javascript:void(0)" class="fbtn fb-save" 
         v-show="edits" v-on:click="saves()">保存</a>

        <a href="javascript:;" class="fbtn fb-add" v-show="!addrow&&edits==0"
          v-on:click="addrow=!addrow">添加</a>
        <a href="javascript:void(0)" class="fbtn fb-save" 
         v-show="addrow" v-on:click="add()">保存</a>
        <a href="javascript:;" class="fbtn fb-refresh"
          v-on:click="getData('refresh')">刷新</a>
    </div>
    <h3 class="current-module">资料指标</h3>
  </div>
  
  <!--table-->
  <table class="itable basic-user-info data-ind-table">
    <thead>
      <tr>
        <th class="w70">序号</th>
        <th class="w70">编号</th>
        <th class="w250">名称</th>
        <th class="w150">状态</th>
        <th class="w150">计算粒度</th>
        <th class="">操作</th>
      </tr>
    </thead>
    <tbody  v-show="addrow">
      <tr >
          <td>
          </td>
          <td class="td-code padd_10">
            <input type="text" class="txt-center" v-model="newobj.code">
          </td>
          <td class="td-name padd_40">
           <input type="text" class="txt-center" v-model="newobj.name">
          </td>
          <td class="td-type select-style padd_30">
            <select-ui :list="statusselects"  :empty="false"
            :selected.sync="newobj.state">              
            </select-ui>
          </td>
          <td class="td-type select-style padd_30">
             <select-ui :list="powerselects"  :empty="false"
            :selected.sync="newobj.granularity">              
            </select-ui>
          </td>
          <td>
          </td>
        </tr>
    </tbody>

    <tbody   v-for="item in list" >
      <tr    v-if="item.edit==1">
          <td>
          </td>
          <td class="td-code padd_10">
            <input type="text" class="txt-center" v-model="item.code">
          </td>
          <td class="td-name padd_40">
            <input type="text" class="txt-center" v-model="item.name">
          </td>
          <td class="td-type select-style padd_30">
            <select-ui :list="statusselects" :empty="false"
            :selected.sync="item.state">              
            </select-ui>
          </td>
          <td class="td-type select-style padd_30">
             <select-ui :list="powerselects" :empty="false"
            :selected.sync="item.granularity">              
            </select-ui>
          </td>
          <td>
            <a class="btn-d btn-d-activate"  href="javascript:"
             v-on:click="save($index)">
            保存</a>
            <a class="btn-d btn-d-cancel"  href="javascript:"
             v-on:click="edit($index)">
            取消</a>
          </td>
      </tr>
      <tr  
      :class="{'tr_sty_red':item.status==0,
      'tr_active':item.code==$route.params.id}"   v-else>
        <td>{{$index+1}}</td>
        <td>{{item.code}}</td>
        <td>{{item.name}}</td>
        <td>{{item.state | ft-state}}</td>
        <td>{{item.granularity | ft-case powerselects }}</td>
        <td>
              
            <a class="btn-d btn-d-activate"
              v-link="{name:'attr',params:{id:item.code},query:{page:item.code}}">
            属性配置
            </a>
            <a class="btn-d btn-d-activate" 
              v-link="{name:'the',params:{id:item.code},query:{page:1}}">
            证照配置</a>
            <!-- <a class="btn-d btn-d-activate" 
              v-on:click="edit($index)">
            修改</a> -->
            <a class="btn-d btn-d-red btn-w60" href="javascript:"
            v-on:click="remove($index)" >
            删除</a>
        </td>
      </tr>      
    </tbody>
  </table> 
   <!--end table-->
    
  <router-view  ></router-view>

  

</div>
</template>
<script>
module.exports={
  data:function(){
    return {
      list:[
          {id:1,name:'供应商企业资料',status:1,power:0}
      ],search: {
          pageSize: 6,
          page: 1,
          totalPages: 0,searchtxt:''       
      },newobj:{
        name:'',state:1,granularity:0,code:0
      },editlist:[],addrow:0,
      statusselects:[
        {value:0,label:'无效'},{value:1,label:'有效'}
      ],powerselects:[
        {value:0,label:'产品级'},{value:1,label:'企业级'}
      ],edits:0
    }
  },methods:{
    getData:function(casetxt){//请求数据
      if(casetxt){
        if( casetxt=='search' && this.search.searchtxt.length==''){
          return ;
        }
        if(casetxt=='getData'){
          //this.$router.go('/dataIndicators')
        }
        this.search.page=1;       
      }
      Ajax.post('/systemdata/operator/infor/getAllIndexInforList',
      this.search).then(function(res){
          var result=res.data;

          if(result.data){
              this.$set('list',result.data);
              //this.search.totalPages = result.totalPages || 0;
          }
      }.bind(this))
    },edit:function(index){//修改  状态
      var obj=Object.assign({},this.list[index],
        {edit:this.list[index].edit?0:1});     
      if(obj.edit==1){
        this.editlist[index]=Object.assign({},obj);
      }else{
        obj=Object.assign({},this.editlist[index]);

        obj.edit=0;        
      }           
      this.$set('list['+index+']',obj)
      this.hasedits();
    },save:function(index){//单个保存
        var obj=Object.assign({},this.list[index]);
        obj.oldcode=this.editlist[index].code;        

        Ajax.post('/systemdata/operator/infor/updateIndexInforList',
        obj).then(function(res){
            var result=res.data;

            if(result.errorCode==0){
                obj.edit=0;
                this.$set('list['+index+']',obj)
                this.hasedits();
            }
        }.bind(this))
    },remove:function(index){//删除
      var deletecur=this.$route.params.id==this.list[index].code;
      var obj=Object.assign({},this.list[index]);

      this.MessageBox({
        title: '提示',
        message: '是否删除',
        type: 'success',
        showCancelButton: true
      }).then(function(action) {    
          if(action=="confirm"){
              var id=this.list[index].id;
              Ajax.post('/systemdata/operator/infor/delIndexInforList',
              obj).then(function(res){
                  var result=res.data;

                  if(result.errorCode==0){
                      this.list.splice(index,1);
                      if(deletecur){
                        this.$router.go('/dataIndicators')
                      }
                  }
              }.bind(this))
          }          
      }.bind(this));
    },add:function(){//添加
      var obj=Object.assign({},this.newobj);

        Ajax.post('/systemdata/operator/infor/addIndexInforList',obj).then(function(res){
            var result=res.data;

            if(result.errorCode==0){
              //this.newobj.id=result.id;
              this.list.unshift(this.newobj);
              this.newobj=Object.assign({},this.newobj,
                {name:'',state:0,granularity:0,code:0});
              this.addrow=0;

            }
        }.bind(this))
    },update:function(){//star 8-11 修改全部状态为编辑模式
        this.edits=1;
        for(var i=0;i<this.list.length;i++){
           var obj= Object.assign({},this.list[i],{edit:1})

           //this.editlist[i]=obj;
           this.$set('editlist['+i+']',Object.assign({},obj));
           this.$set('list['+i+']',obj)
        }
    },saves:function(){ //全部修改保存
        var list=[];
        for(var i=0;i<this.list.length;i++){
          var obj=Object.assign({},this.list[i])
          obj.oldcode=this.editlist[i].code;
          list.push(obj);

        }
        Ajax.post('/systemdata/operator/infor/updateAllIndexInforList',
          JSON.stringify(list)).then(function(res){
            var result=res.data;

            if(result.errorCode==0){
              this.edits=0;
              for(var i=0;i<this.list.length;i++){
                this.list[i].edit=0;
              }
            }
        }.bind(this))
    },hasedits:function(){//循环list 当都不是编辑状态时修改edits
      var a=0;
      for(var i=0;i<this.list.length;i++){
        if(this.list[i].edit==1){
          a=1;
        }
      }

      if(a==0){
        this.edits=0;
      }
    }
  },route:{
    activate:function(){
      this.getData();
    }
  }
}
</script>