123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280 |
- {extend name="public/layout" /} {block name="title"}运营账号{/block}
- {block name="body"}
- <style>
- .layui-fluid {
- display: block;
- box-shadow: 0 0 4px 0 #B6CADE;
- border-radius: 5px;
- margin: 15px;
- background-color: #ffffff;
- }
- .cardheader {
- padding-left: 10px;
- }
- .layui-table thead tr,
- .layui-table-header {
- background-color: #D8E6F1 !important;
- }
- .layui-btn-primary {
- color: #249EFB;
- border: 1px solid #249EFB;
- }
- .layui-btn-primary:hover {
- background-color: #E3F7FF;
- color: #249EFB;
- }
- .layui-card .layui-tab-brief .layui-tab-title li.layui-this {
- color: #249EFB;
- }
- .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
- border: none;
- }
- .layui-card .layui-tab-brief .layui-tab-title li{
- padding: 0px 10px;
- }
- .layui-tab-title .layui-this:after {
- width: 50px;
- height: 4px !important;
- background-color: #249EFB;
- top: 37px;
- left: 50%;
- transform: translateX(-50%);
- }
- .layui-btn-xs,.layui-btn-xs:hover {
- border: 1px solid #249EFB;
- background-color: #fff;
- color: #249EFB;
- padding: 0px 10px;
- }
- .layui-btn-danger,.layui-btn-danger:hover{
- color: #FF5722;
- background-color: #fff;
- border: 1px solid #FF5722;
- padding: 0px 10px;
- }
- .layui-card .layui-tab-brief .layui-tab-title li{margin-left:0 !important;margin-right: 15px;}
- .layui-card .layui-tab-brief .layui-tab-title{margin-left:15px;}
- .layui-card-body {
- padding: 0px;
- }
- </style>
- <body>
- <div class="layui-fluid">
- <div class="layui-card">
- <div class="layui-card-body">
- <div class="layui-row">
- <div class="layui-col-md12 layui-col-xs12 layui-col-sm12">
- <div class="layui-tab layui-tab-brief" lay-filter="component-tabs-hash">
- <ul class="layui-tab-title">
- <li class="layui-this" lay-id="1">运营账号</li>
- <li lay-id="1">权限角色</li>
- </ul>
- <div class="layui-tab-content">
- <div class="layui-tab-item layui-show">
- <div>
- <button class="layui-btn layuiadmin-btn-admin layui-btn-primary" data-type="operate">添加账号</button>
- <div style="float:right;">
- <div class="layui-inline">
- <label class="layui-form-label">姓名</label>
- <div class="layui-input-inline">
- <input type="text" id="keyword" name="keyword" placeholder="请输入姓名" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-inline">
- <button class="layui-btn layuiadmin-btn-course searchBtn submitbtn" lay-submit lay-filter="LAY-user-front-search">
- <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
- </button>
- </div>
- </div>
- </div>
- <table id="operater" lay-filter="operater" style="margin-top:15px;"></table>
- </div>
- <div class="layui-tab-item">
- <div>
- <button class="layui-btn layuiadmin-btn-admin layui-btn-primary" data-type="grant">添加权限角色</button>
- </div>
- <div>
- <table id="grant" lay-filter="grant" style="margin-top:15px;"></table>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- {/block}
- {block name="js"}
- <script type="text/html" id="op">
- {auth:check name="operate/edit"}
- <a class="layui-btn layui-btn-xs" lay-event="edit" title="编辑">编辑</a>
- {/auth:check}
- {auth:check name="operate/log"}
- <a class="layui-btn layui-btn-xs" lay-event="log" title="日志">日志</a>
- {/auth:check}
- {{# if(d.top_one !== 1){ }}
- {auth:check name="operate/del"}
- <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" title="删除">删除</a>
- {/auth:check}
- {{# } }}
- </script>
- <script type="text/html" id="op2">
- {auth:check name="grant/edit"}
- <a class="layui-btn layui-btn-xs" lay-event="edit" title="编辑">编辑</a>
- {/auth:check}
- {auth:check name="grant/del"}
- <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" title="删除">删除</a>
- {/auth:check}
-
- </script>
- <script>
- layui.config({
- base: '__LAYUI__/',
- urlbase: '/sys'
- }).extend({
- index: 'lib/index' //主入口模块
- }).use(['index', 'table'], function () {
- var $ = layui.$,
- table = layui.table,
- form = layui.form;
- //监听搜索
- form.on('submit(LAY-user-front-search)', function(data) {
- var keyword = $('#keyword').val();
- //执行重载
- table.reload('operater', {
- where: {keyword:keyword}
- , page: {
- curr: 1
- }
- });
- });
- document.onkeydown=function(event){
- var e = event || window.event || arguments.callee.caller.arguments[0];
- if(e && e.keyCode==13){
- $(".submitbtn").trigger("click");
- }
- };
- table.render({
- elem: '#operater',
- url: '{:url("operate/index")}',
- page: true,
- height: 'full-180',
- cols: [
- [{
- type: 'numbers',
- field: 'id',
- fixed: 'left',
- title: '序号',
- }, {
- field: 'name',
- title: '姓名',
- }, {
- field: 'phone',
- title: '手机号',
- }, {
- field: 'grant',
- title: '权限角色',
- }, {
- title: '操作',
- width: 240,
- align: 'center',
- fixed: 'right',
- toolbar: '#op'
- }]
- ],
- text: '对不起,加载出现异常!'
- });
- table.render({
- elem: '#grant',
- url: '{:url("grant/list")}',
- height: 'full-180',
- cols: [
- [{
- type: 'numbers',
- field: 'id',
- fixed: 'left',
- title: '序号',
- }, {
- field: 'name',
- title: '权限名',
- }, {
- // field: 'phone',
- // title: '权限',
- // }, {
- title: '操作',
- width: 240,
- align: 'center',
- fixed: 'right',
- toolbar: '#op2'
- }]
- ],
- text: '对不起,加载出现异常!'
- });
- var active = {
- operate: function () {
- layer.open({ type: 2, title: ['添加运营账号', 'color:#333333;background-color:#D8E6F1;'],resize: false, area: ['320px', '300px'], content: '{:url("operate/edit")}' });
- },
- grant: function () {
- layer.open({ type: 2, title: ['添加角色', 'color:#333333;background-color:#D8E6F1;'],resize: false, area: ['80%', '80%'], content: '{:url("grant/add")}' });
- }
- };
- $('.layui-btn.layuiadmin-btn-admin').on('click', function () {
- var type = $(this).data('type');
- active[type] ? active[type].call(this) : '';
- });
- table.on('tool(operater)', function (obj) {
- if (obj.event == 'del') {
- layer.confirm('确定要删除该运营账号?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],} ,function (index) {
- $.get('{:url("operate/del")}?id=' + obj.data.id, function (res) {
- if (res.code == 0) {
- table.reload('operater');
- } else {
- layer.msg(res.msg, { anim: 6 });
- }
- })
- layer.close(index);
- })
- }else if(obj.event == 'log'){
- layer.open({
- type:2,
- title: ['日志', 'color:#333333;background-color:#D8E6F1;'],
- content:'{:url("operate/log")}?id='+obj.data.id,
- resize: false,
- area:['80%', '80%']
- });
- }else if(obj.event == 'edit'){
- layer.open({
- type:2,
- title: ['编辑', 'color:#333333;background-color:#D8E6F1;'],
- content:'{:url("operate/edit")}?id='+obj.data.id,
- resize: false,
- area:['320px', '300px']
- });
- }
- })
- table.on('tool(grant)', function (obj) {
- if (obj.event == 'del') {
- layer.confirm('确定要删除该权限?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function (index) {
- $.get('{:url("grant/del")}?id=' + obj.data.id, function (res) {
- if (res.code == 0) {
- table.reload('grant');
- } else {
- layer.msg(res.msg, { anim: 6 });
- }
- })
- layer.close(index);
- })
- } else if (obj.event == 'edit') {
- layer.open({ type: 2, title: ['修改角色', 'color:#333333;background-color:#D8E6F1;'],resize: false, area: ['80%', '80%'], content: '{:url("grant/edit")}?grant_id=' + obj.data.id });
- }
- });
- });
- </script>
- {/block}
|