<style>
</style>
<template>
<div class="flexOne">
<div class="query-box">
<ul>
<li>
<span><em>{{$t('adm.adm_Rolename')}}</em><el-input v-model='msg.Name' :placeholder="$t('pub.pleaseImport')"></el-input></span>
</li>
<li>
<span><em>{{$t('admin.admin_status')}}</em><el-select v-model='msg.Status' placeholder="不限">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option :label="$t('pub.normalSel')" value='0'></el-option>
<el-option :label="$t('pub.fressSel')" value='1'></el-option>
</el-select>
</span>
</li>
<!-- <li>
<span><em>版本</em><el-select v-model='msg.Versions_Id' placeholder="不限">
<el-option label='不限' value=''></el-option>
<el-option v-for='item in versions'
:key="item.Id"
:label="item.VersionsName"
:value="item.Id"
></el-option>
</el-select>
</span>
</li> -->
<li>
<input type="button" class="hollowFixedBtn" @click="resetPageIndex();getList()()" :value="$t('pub.searchBtn')" />
<input type="button" @click="outerVisible = true,dialogTitle='新增角色',resetForm('addMsg')" class="normalBtn" :value="$t('pub.addBtn')" />
</li>
</ul>
</div>
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<th width="300">{{$t('adm.adm_Rolename')}}</th>
<th width="600">{{$t('system.label_info')}}</th>
<th width="100">{{$t('admin.admin_status')}}</th>
<!-- <th>版本名称</th> -->
<th>{{$t('admin.admin_czPerson')}}</th>
<th>{{$t('system.table_operation')}}</th>
</tr>
<tr v-for="(item,index) in dataList">
<td>{{item.Name}}</td>
<td>{{item.Description}}</td>
<td>{{item.Status==0?$t('pub.normalSel'):$t('pub.fressSel')}}</td>
<!-- <td>{{item.VersionsName}}</td> -->
<td>{{item.EmName}}</td>
<td>
<el-row>
<el-tooltip class="item" effect="dark" :content="$t('pub.updateMsg')" placement="top-start">
<el-button @click="outerVisible = true,dialogTitle='修改角色',updateData(item.Id)" type="primary" icon="el-icon-edit" circle></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" :content="$t('adm.adm_quanxian')" placement="top-start">
<el-button @click="goUrl('appPermissionList',item.Id)" type="primary" icon="iconfont icon-quanxianguanli" circle></el-button>
</el-tooltip>
</el-row>
</td>
</tr>
</table>
<el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage" layout="total,prev, pager, next, jumper" :page-size=msg.pageSize :total=total>
</el-pagination>
<el-dialog custom-class='w450' :title="dialogTitle" :visible.sync="outerVisible" center :before-close="closeChangeMachie">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px" >
<el-form-item maxlength='50' :label="$t('adm.adm_Rolename')" prop="Name">
<el-input class='w217' type="text" v-model="addMsg.Name" :placeholder="$t('pub.pleaseImport')"></el-input>
</el-form-item>
<!-- <el-form-item label="版本" prop="Versions_Id">
<el-select class='w217' v-model='addMsg.Versions_Id' placeholder="请选择">
<el-option v-for='item in versions' :key="item.Id" :label="item.VersionsName" :value="item.Id"></el-option>
</el-select>
</el-form-item> -->
<el-form-item :label="$t('admin.admin_status')" prop="Status">
<el-switch v-model="addMsg.Status" active-value="0" inactive-value="1"></el-switch>
</el-form-item>
<el-form-item :label="$t('system.label_info')" prop="Description">
<el-input maxlength='250' class='w217' type="textarea" v-model="addMsg.Description"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<button class="hollowFixedBtn" @click="outerVisible = false,resetForm('addMsg'),getList()">{{$t('pub.cancelBtn')}}</button>
<button class="normalBtn" type="primary" @click="submitForm('addMsg')">{{$t('pub.saveBtn')}}</button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
switchValue:'1',
dialogTitle: '',
insideDialogTxt: '保存成功！',
outerVisible: false,
innerVisible: false,
isRight:true,
versions: [],
total: 0,
currentPage: 1,
dataList: [],
msg: {
pageIndex: 1,
pageSize: 15,
Status: '0',
Name: '',
},
addMsg:{
Id:'0',
Name:'',
Description:'',
Status:'0',
},
rules:{
Name:[
{ required: true, message: this.$t('system.ph_name'), trigger: 'blur' }
],
Status:[
{ required: false, message: '', trigger: 'change' }
],
Description:[
{ required: false, message: this.$t('adm.adm_qsrmiaoshu'), trigger: 'change' }
],
},
verSionMsg: {
Status: 0
},
}
},
mounted() {
// this.msg.Versions_Id = this.$route.query.id
this.getList()
this.getVersion()
},
methods: {
getList() { //获取列表数据
this.apipost("admin_get_AppRoleGetPageList", this.msg, res => {
if(res.data.resultCode==1){
this.dataList = res.data.data.pageData;
this.total = res.data.data.count;
}else{}
}, err => {})
},
getVersion() { //获取版本信息
this.apipost('admin_get_SysVersionsGetList', this.verSionMsg, res => {
this.versions = res.data.data;
}, err => {
})
},
addData(){ //添加角色
this.apipost("admin_post_AppRoleSet",this.addMsg,res=>{
if(res.data.resultCode==1)
{
this.$message.success(res.data.message)
this.outerVisible=false;
this.getList()
this.resetForm('addMsg');
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
updateData(id){ //修改角色
this.addMsg.Id=id;
this.apipost('admin_get_AppRoleGet',{RoleId:id},res=>{
if(res.data.resultCode==1){
this.addMsg.Name = res.data.data.Name
this.addMsg.Description = res.data.data.Description
// this.addMsg.Versions_Id = res.data.data.Versions_Id
this.addMsg.Status = res.data.data.Status.toString();
}else{}
},err=>{})
},
deleteData(id){
this.apipost('admin_post_AppRoleRemove', {RoleId:id}, res => {
if(res.data.resultCode==1){
this.getList()
}else{
alert(res.data.message)
}
}, err => {})
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
resetPageIndex() {
this.msg.pageIndex = 1;
this.currentPage = 1
},
goUrl(name,id){
this.$router.push({ name: name,query:{"id":id,blank:'y',tab:'App权限设置'}})
},
submitForm(addMsg) {//提交创建、修改表单
this.$refs[addMsg].validate((valid) => {
if (valid) {
this.addData();
} else {
return false;
}
});
},
closeChangeMachie(done){//弹出框关闭初始化弹框内表单
done();
this.resetForm('addMsg');
},
resetForm(formName) {//弹出框取消 初始化谈框内表单
this.addMsg.Id='0';
this.addMsg.Status='0';
this.$refs[formName].resetFields();
}
}
}
</script>