<!-- 角色管理数据显示 -->
<el-table
:data="tableData"
style="width: 60%;margin-top:10px;" >
<el-table-column
prop="date"
label="选择"
width="180">
<template slot-scope="scope">
<el-radio v-model="templateradio" :label="scope.$index+1" :name="scope.row" @change.native="getTemplateRow(scope.$index,scope.row)"><br></el-radio>
</template>
</el-table-column>
<el-table-column
prop="name"
label="角色编号"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.roleCode }}</span>
</template>
</el-table-column>
<el-table-column
prop="address"
label="角色名称">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.roleName }}</span>
</template>
</el-table-column>
<el-table-column
prop="address"
label="创建人">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.createdBy }}</span>
</template>
</el-table-column>
<el-table-column
prop="address"
label="状态(启用/禁用)">
<template slot-scope="scope">
<el-checkbox :true-label="1" :false-label="0" v-model="scope.row.isStart"></el-checkbox>
</template>
</el-table-column>
<el-table-column
prop="address"
label="最后修改时间">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.createDate.toLocaleString().replace(/T/g,' ').replace(/.[\d]{3}Z/,' ')}}</span>
</template>
</el-table-column>
</el-table>

<el-dialog title="添加角色" :visible.sync="dialogVisible" width="40%" :before-close="handleClose">
<div>
  <div>
    <span style="font-size:20px;">角色编号：</span>
    <el-input style="width:80%;" v-model="addroleid"></el-input>
  </div>
  <div style="margin-top:10px;">
    <span style="font-size:20px;">角色名称：</span>
    <el-input style="width:80%;" v-model="addrolename"></el-input>
  </div>
  <div style="margin-top:10px;">
    <span style="font-size:20px;">角色状态：</span>
    <el-radio v-model="radio" label="1">启用</el-radio>
    <el-radio v-model="radio" label="0">禁用</el-radio>
  </div>
</div>
<span slot="footer" class="dialog-footer">
  <el-button @click="dialogVisible = false">取 消</el-button>
  <el-button type="primary" @click="dialogVisible = false;add()">保 存</el-button>  
  <!-- dialogVisible = false控制添加用户对话框的显示与隐藏 -->
</span>
</el-dialog>

<!-- 修改角色 -->
<el-dialog title="修改角色" :visible.sync="dialogVisible2" width="40%" :before-close="handleClose">
<div>
<div>
<span style="font-size:20px;">角色编号：</span>
<el-input style="width:80%;"></el-input>
</div>
<div style="margin-top:10px;">
<span style="font-size:20px;">角色名称：</span>
<el-input style="width:80%;"></el-input>
</div>
<div style="margin-top:10px;">
<span style="font-size:20px;">角色状态：</span>
<el-radio v-model="radios" label="1">启用</el-radio>
<el-radio v-model="radios" label="0">禁用</el-radio>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible2 = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible2 = false;edit()">确 定</el-button>
<!-- dialogVisible2 = false控制添加用户对话框的显示与隐藏 -->
</span>
</el-dialog>
</div>

<script>
export default {
name:'ShowTable',
data() {
return {
tableData: [],//存放数据库查询的数据
templateradio:1,//选择(单选按钮)双向绑定的值
indexs:0,
dialogVisible: false,//添加角色dialog对话框状态 关闭
dialogVisible2:false,//修改角色dialog对话框状态 关闭
radio:'1',//添加角色dialog对话框角色状态
radios:'1',//修改角色dialog对话框角色状态
addroleid:'',//添加角色dialog对话角色编号
addrolename:'',//添加角色dialog对话角色名称
currentSelectItem: {} //当前选中的行数据
}
},methods:{
//dialog对话框点击关闭
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
done();
})
.catch(_ => {});
},
getTemplateRow(index, row) {
this.templateSelection = row;
this.indexs=index;
this.currentSelectItem=row;
},
// 角色添加
add(){
//alert(this.radio);
var now = new Date();//获取系统当前时间
var year=now.getFullYear();//得到系统当前年份
var month=now.getMonth()+1;//得到系统当前月份
var date=now.getDate();//得到系统当前天数
var hour=now.getHours();//得到系统当前小时
var minute=now.getMinutes();//得到系统当前分钟
var second=now.getSeconds();//得到系统当前秒钟
//判断是否为除年份外的时间是否大于0，大于0则在前加0
if(month<10){
month = '0'+month
}if(date<10){
date = '0'+date
}if(hour<10){
hour = '0'+hour
}if(minute<10){
minute = '0'+minute
}if(second<10){
second = '0'+second
}
//获取系统时间
let obj=year+'-'+month+'-'+date+' '+hour+':'+minute
console.log(obj);
let _this=this;
axios.post("/SL/AddRole",{id:_this.addroleid,name:_this.addrolename,time:obj,radio:_this.radio,creator:'admin'}).then(function(res){
_this.$data.tableData="";
_this.$data.tableData=res.data;
}).catch(function(res){
//请求失败的处理函数
});
},
// 角色修改
edit(){
console.log(this.currentSelectItem);

  }
},created(){
   console.log(1);
   //显示数据
  let _this=this;
  //Vue对象创建完毕后的钩子函数
  axios.post("/SL/GetRole",null).then(function(res){
      //请求成功的处理函数
      _this.$data.tableData=res.data;  
  }).catch(function(res){
      //请求失败的处理函数
  });
}

}
</script>