# coc_admin

**Repository Path**: songjucool/coc_admin

## Basic Information

- **Project Name**: coc_admin
- **Description**: 管理后台前端
- **Primary Language**: HTML/CSS
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2020-02-12
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# coc_admin

#### 介绍
个人博客页: https://me.csdn.net/weixin_43546543
coc后台管理系统,该项目采用前后完全分离的方式,前端只通过传递json格式到后端,后端返回json格式的数据给前端,这样做的话后端可提供像小程序\网页\android\iphone\接口及与其它语言的数据对接(只需通过http传json请求即可)
十分方便灵活,对于分工明确的公司来说是值得采用和借鉴的.在Web程序应用，如网站管理后台，网站会员中心，CMS，CRM，OA等。
在此声明,本项目完全开源,同行可使用于商用或学习,随便修改哦.在此感谢诸多开源的公司及个人.

#### 软件架构
html+javascript+css+jquery+layui
要熟悉jquery和layui的操作哦


#### 安装教程

1.  将下载或拉取的代码用编辑工具打开,修改static/js/app.js中的api_url为后端请求路径即可
2.  将后端coc_api代码下载并部署

#### 使用说明

1.  使用需知
    1.1 需要请求服务器数据时用app.js中封装的APIRequest函数来请求,因为这样的话能够判断该用户当前的情况,比如登录过期,这样会弹窗让用户到用户界面重新登录,传入数据封装成json格式来请求,如:
    new APIRequest(
		{
			url: global.api_url + "/sysPermission/selectAll",
			method: "GET",
			data:json,
			async: false,
			success: function (result) {
				menuList = result.data.records;
			},
			dataType: "json"
		}
	);
	1.2 如果layui做表格时,需要加上这些属性,因为coc_api中返回的数据是这样的格式,要自定义下才能把数据解析出来,示例可参考pages/admin/list.html页面
	    ,headers:{content_type: "application/json;charset=UTF-8",Authorization:getUser().token}
        ,method:'post'
        ,request: {
        	pageName: 'current' //页码的参数名称，默认：page
        	,limitName: 'size' //每页数据量的参数名，默认：limit
        }
        ,parseData: function(res) { //res 即为原始返回的数据
        	return {
        		"code": res.errorCode, //解析接口状态
        		"msg": res.errorMsg, //解析提示文本
        		"count": res.data.total, //解析数据长度
        		"data": res.data.records //解析数据列表
        	}
        }
        ,response:{
        	statusCode: 200
        }
      
2.  创建html页面需要这些文件,可自定义下自己创建html时的模板
    <script src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script src="../../static/js/app.js"/>
    <link rel="stylesheet" href="../../static/css/font.css">
    <link rel="stylesheet" href="../../static/css/weadmin.css">
3.  页面使用<select></select>标签时,一定要加multiple属性,否则回显时会有问题
4. 像修改这类的,通过前端的sessionStorage存入本地,然后取出来可以了

#### 前端页面效果
![输入图片说明](https://images.gitee.com/uploads/images/2020/0303/101311_c16fc223_4814298.png "屏幕截图.png")
![输入图片说明](https://images.gitee.com/uploads/images/2020/0303/101333_2bda8444_4814298.png "屏幕截图.png")
![输入图片说明](https://images.gitee.com/uploads/images/2020/0303/101353_a96683e6_4814298.png "屏幕截图.png")
![输入图片说明](https://images.gitee.com/uploads/images/2020/0303/101419_2a62db0b_4814298.png "屏幕截图.png")

#### 参与贡献

1.  Fork 本仓库
2.  新建 Feat_xxx 分支
3.  提交代码
4.  新建 Pull Request


   QQ 1016999146