Browse Source
Merge branch 'gva_gormv2_dev' of https://github.com/flipped-aurora/gin-vue-admin into develop
main
Merge branch 'gva_gormv2_dev' of https://github.com/flipped-aurora/gin-vue-admin into develop
main
pixel
4 years ago
11 changed files with 490 additions and 195 deletions
-
1server/config.yaml
-
1server/config/gorm.go
-
6server/initialize/gorm.go
-
150server/initialize/logger.go
-
1web/src/App.vue
-
3web/src/style/basics.scss
-
16web/src/style/main.scss
-
89web/src/style/mobile.scss
-
349web/src/view/dashboard/index.vue
-
34web/src/view/example/form/form.vue
-
35web/src/view/layout/index.vue
@ -0,0 +1,150 @@ |
|||
package initialize |
|||
|
|||
import ( |
|||
"context" |
|||
"fmt" |
|||
"gin-vue-admin/global" |
|||
"go.uber.org/zap" |
|||
"gorm.io/gorm/logger" |
|||
"gorm.io/gorm/utils" |
|||
"io/ioutil" |
|||
"log" |
|||
"os" |
|||
"time" |
|||
) |
|||
|
|||
var ( |
|||
Discard = New(log.New(ioutil.Discard, "", log.LstdFlags), GormConfig{}) |
|||
Default = New(log.New(os.Stdout, "\r\n", log.LstdFlags), GormConfig{ |
|||
SlowThreshold: 200 * time.Millisecond, |
|||
LogLevel: logger.Warn, |
|||
Colorful: true, |
|||
}) |
|||
Recorder = traceRecorder{Interface: Default, BeginAt: time.Now()} |
|||
) |
|||
|
|||
type traceRecorder struct { |
|||
logger.Interface |
|||
BeginAt time.Time |
|||
SQL string |
|||
RowsAffected int64 |
|||
Err error |
|||
} |
|||
|
|||
func New(writer Writer, config GormConfig) logger.Interface { |
|||
var ( |
|||
infoStr = "%s\n[info] " |
|||
warnStr = "%s\n[warn] " |
|||
errStr = "%s\n[error] " |
|||
traceStr = "%s\n[%.3fms] [rows:%v] %s" |
|||
traceWarnStr = "%s %s\n[%.3fms] [rows:%v] %s" |
|||
traceErrStr = "%s %s\n[%.3fms] [rows:%v] %s" |
|||
) |
|||
|
|||
if config.Colorful { |
|||
infoStr = logger.Green + "%s\n" + logger.Reset + logger.Green + "[info] " + logger.Reset |
|||
warnStr = logger.BlueBold + "%s\n" + logger.Reset + logger.Magenta + "[warn] " + logger.Reset |
|||
errStr = logger.Magenta + "%s\n" + logger.Reset + logger.Red + "[error] " + logger.Reset |
|||
traceStr = logger.Green + "%s\n" + logger.Reset + logger.Yellow + "[%.3fms] " + logger.BlueBold + "[rows:%v]" + logger.Reset + " %s" |
|||
traceWarnStr = logger.Green + "%s " + logger.Yellow + "%s\n" + logger.Reset + logger.RedBold + "[%.3fms] " + logger.Yellow + "[rows:%v]" + logger.Magenta + " %s" + logger.Reset |
|||
traceErrStr = logger.RedBold + "%s " + logger.MagentaBold + "%s\n" + logger.Reset + logger.Yellow + "[%.3fms] " + logger.BlueBold + "[rows:%v]" + logger.Reset + " %s" |
|||
} |
|||
|
|||
return &GormLogger{ |
|||
Writer: writer, |
|||
GormConfig: config, |
|||
infoStr: infoStr, |
|||
warnStr: warnStr, |
|||
errStr: errStr, |
|||
traceStr: traceStr, |
|||
traceWarnStr: traceWarnStr, |
|||
traceErrStr: traceErrStr, |
|||
} |
|||
} |
|||
|
|||
// Writer log writer interface
|
|||
type Writer interface { |
|||
Printf(string, ...interface{}) |
|||
} |
|||
|
|||
type GormConfig struct { |
|||
SlowThreshold time.Duration |
|||
Colorful bool |
|||
LogLevel logger.LogLevel |
|||
} |
|||
|
|||
type GormLogger struct { |
|||
Writer |
|||
GormConfig |
|||
infoStr, warnStr, errStr string |
|||
traceStr, traceErrStr, traceWarnStr string |
|||
} |
|||
|
|||
func (g *GormLogger) LogMode(level logger.LogLevel) logger.Interface { |
|||
newLogger := *g |
|||
newLogger.LogLevel = level |
|||
return &newLogger |
|||
} |
|||
|
|||
func (g *GormLogger) Info(ctx context.Context, message string, data ...interface{}) { |
|||
if g.LogLevel >= logger.Info { |
|||
g.Printf(g.infoStr+message, append([]interface{}{utils.FileWithLineNum()}, data...)...) |
|||
} |
|||
} |
|||
|
|||
func (g *GormLogger) Warn(ctx context.Context, message string, data ...interface{}) { |
|||
if g.LogLevel >= logger.Warn { |
|||
g.Printf(g.warnStr+message, append([]interface{}{utils.FileWithLineNum()}, data...)...) |
|||
} |
|||
} |
|||
|
|||
func (g *GormLogger) Error(ctx context.Context, message string, data ...interface{}) { |
|||
if g.LogLevel >= logger.Error { |
|||
g.Printf(g.errStr+message, append([]interface{}{utils.FileWithLineNum()}, data...)...) |
|||
} |
|||
} |
|||
|
|||
func (g *GormLogger) Trace(ctx context.Context, begin time.Time, fc func() (string, int64), err error) { |
|||
if g.LogLevel > 0 { |
|||
elapsed := time.Since(begin) |
|||
switch { |
|||
case err != nil && g.LogLevel >= logger.Error: |
|||
sql, rows := fc() |
|||
if rows == -1 { |
|||
g.Printf(g.traceErrStr, utils.FileWithLineNum(), err, float64(elapsed.Nanoseconds())/1e6, "-", sql) |
|||
} else { |
|||
g.Printf(g.traceErrStr, utils.FileWithLineNum(), err, float64(elapsed.Nanoseconds())/1e6, rows, sql) |
|||
} |
|||
case elapsed > g.SlowThreshold && g.SlowThreshold != 0 && g.LogLevel >= logger.Warn: |
|||
sql, rows := fc() |
|||
slowLog := fmt.Sprintf("SLOW SQL >= %v", g.SlowThreshold) |
|||
if rows == -1 { |
|||
g.Printf(g.traceWarnStr, utils.FileWithLineNum(), slowLog, float64(elapsed.Nanoseconds())/1e6, "-", sql) |
|||
} else { |
|||
g.Printf(g.traceWarnStr, utils.FileWithLineNum(), slowLog, float64(elapsed.Nanoseconds())/1e6, rows, sql) |
|||
} |
|||
case g.LogLevel >= logger.Info: |
|||
sql, rows := fc() |
|||
if rows == -1 { |
|||
g.Printf(g.traceStr, utils.FileWithLineNum(), float64(elapsed.Nanoseconds())/1e6, "-", sql) |
|||
} else { |
|||
g.Printf(g.traceStr, utils.FileWithLineNum(), float64(elapsed.Nanoseconds())/1e6, rows, sql) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
func (g *GormLogger) Printf(message string, data ...interface{}) { |
|||
switch len(data) { |
|||
case 0: |
|||
global.GVA_LOG.Info(message) |
|||
case 1: |
|||
global.GVA_LOG.Info("gorm", zap.Any("src", data[0])) |
|||
case 2: |
|||
global.GVA_LOG.Info("gorm", zap.Any("src", data[0]), zap.Any("duration", data[1])) |
|||
case 3: |
|||
global.GVA_LOG.Info("gorm", zap.Any("src", data[0]), zap.Any("duration", data[1]), zap.Any("rows", data[2])) |
|||
case 4: |
|||
global.GVA_LOG.Info("gorm", zap.Any("src", data[0]), zap.Any("duration", data[1]), zap.Any("rows", data[2]), zap.Any("sql", data[3])) |
|||
} |
|||
} |
@ -0,0 +1,89 @@ |
|||
|
|||
@import '@/style/basics.scss'; |
|||
@media screen and (min-width: 320px)and (max-width: 750px){ |
|||
.el-header{ |
|||
padding: 0 $padding-xs; |
|||
} |
|||
.layout-cont { |
|||
.main-cont{ |
|||
.breadcrumb{ |
|||
padding: 0 $padding-xs; |
|||
} |
|||
} |
|||
} |
|||
.layout-cont{ |
|||
.right-box{ |
|||
margin-right: $margin-xs; |
|||
} |
|||
} |
|||
.search-component{ |
|||
width: 30px; |
|||
} |
|||
.screenfull{ |
|||
width: 26px; |
|||
text-align: center; |
|||
} |
|||
.el-main{ |
|||
.admin-box{ |
|||
margin-left: 0; |
|||
margin-right: 0; |
|||
} |
|||
.big.admin-box{ |
|||
padding: 0 0 15px 0; |
|||
} |
|||
.big { |
|||
.bottom { |
|||
.chart-player{ |
|||
height: auto!important; |
|||
margin-bottom: 15px; |
|||
} |
|||
.todoapp{ |
|||
background-color: #fff; |
|||
padding-bottom: 10px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card .car-left, |
|||
.card .car-right{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.card{ |
|||
padding-left: $padding-xs; |
|||
padding-right: $padding-xs; |
|||
|
|||
} |
|||
.card { |
|||
.text{ |
|||
width: 100%; |
|||
h4{ |
|||
white-space: break-spaces; |
|||
} |
|||
} |
|||
} |
|||
.shadow{ |
|||
margin-left: 5px; |
|||
margin-right: 5px; |
|||
.grid-content{ |
|||
margin-bottom: 10px; |
|||
padding: 0; |
|||
} |
|||
} |
|||
.el-dialog{ |
|||
width: 90%; |
|||
} |
|||
.el-transfer{ |
|||
.el-transfer-panel{ |
|||
width: 40%; |
|||
display: inline-block; |
|||
} |
|||
.el-transfer__buttons{ |
|||
padding: 0 5px; |
|||
display: inline-block; |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
@ -1,179 +1,204 @@ |
|||
<template> |
|||
<div class="big"> |
|||
<div class="card"> |
|||
<div class="car-left"> |
|||
<div> |
|||
<span class="card-img"> <img :src="userInfo.headerImg" alt="" > </span> |
|||
<div class="text"><h4>早安,管理员, 请开始您一天的工作吧!</h4> |
|||
<p class="tips-text"> |
|||
<i class="el-icon-sunny el-icon"></i> |
|||
<span>今日晴,0℃ - 10℃,天气寒冷,注意添加衣物。</span> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="car-right"> |
|||
<el-row> |
|||
<el-col :span="8"><div class="car-item"> |
|||
<span class="flow"><i class="el-icon-s-grid"></i></span> |
|||
<span>今日流量 </span> |
|||
<b>13260</b> |
|||
</div></el-col> |
|||
<el-col :span="8"><div class="car-item"> |
|||
<span class="user-number"> |
|||
<i class="el-icon-s-custom "></i> |
|||
</span> |
|||
<span>总用户 </span> |
|||
<b>48286</b> |
|||
</div></el-col> |
|||
<el-col :span="8"><div class="car-item "> |
|||
<span class="feedback"> |
|||
<i class="el-icon-star-on"></i> |
|||
</span> |
|||
<span>好评率 </span> |
|||
<b>98%</b> |
|||
</div></el-col> |
|||
</el-row> |
|||
</div> |
|||
</div> |
|||
<div class="shadow"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="4" v-for="(card,key) in toolCards" :key="key" @click.native="toTarget(card.name)"> |
|||
<el-card shadow="hover" class="grid-content"> |
|||
<i :class="card.icon" :style="{color:card.color}"></i> |
|||
<p>{{card.label}}</p> |
|||
</el-card> |
|||
</el-col> |
|||
<div class="big"> |
|||
<el-row> |
|||
<div class="card"> |
|||
<el-col :xs="24" :lg="16" :md="16" > |
|||
<div class="car-left"> |
|||
<el-row> |
|||
<div> |
|||
<el-col :xs="4" :md="3" :lg="3"> |
|||
<span class="card-img"> |
|||
<img :src="userInfo.headerImg" alt="" /> |
|||
</span> |
|||
</el-col> |
|||
<el-col :xs="20" :lg="12" :md="12"> |
|||
<div class="text"> |
|||
<h4>早安,管理员, 请开始您一天的工作吧!</h4> |
|||
<p class="tips-text"> |
|||
<i class="el-icon-sunny el-icon"></i> |
|||
<span>今日晴,0℃ - 10℃,天气寒冷,注意添加衣物。</span> |
|||
</p> |
|||
</div> |
|||
</el-col> |
|||
</div> |
|||
</el-row> |
|||
</div> |
|||
<div class="bottom"> |
|||
<el-row :gutter="32"> |
|||
<el-col :xs="24" :sm="24" :lg="12"> |
|||
<div class="chart-player"> |
|||
<musicPlayer /> |
|||
</div> |
|||
</el-col> |
|||
<el-col :xs="24" :sm="24" :lg="12"> |
|||
<div class="chart-player"> |
|||
<todo-list /> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-col> |
|||
<el-col :xs="24" :lg='8' :md="8"> |
|||
<div class="car-right"> |
|||
<el-row> |
|||
<el-col :span="8" |
|||
><div class="car-item"> |
|||
<span class="flow"><i class="el-icon-s-grid"></i></span> |
|||
<span>今日流量 </span> |
|||
<b>13260</b> |
|||
</div></el-col |
|||
> |
|||
<el-col :span="8" |
|||
><div class="car-item"> |
|||
<span class="user-number"> |
|||
<i class="el-icon-s-custom"></i> |
|||
</span> |
|||
<span>总用户 </span> |
|||
<b>48286</b> |
|||
</div></el-col |
|||
> |
|||
<el-col :span="8" |
|||
><div class="car-item"> |
|||
<span class="feedback"> |
|||
<i class="el-icon-star-on"></i> |
|||
</span> |
|||
<span>好评率 </span> |
|||
<b>98%</b> |
|||
</div></el-col |
|||
> |
|||
</el-row> |
|||
</div> |
|||
</el-col> |
|||
</div> |
|||
</el-row> |
|||
|
|||
<div class="shadow"> |
|||
<el-row :gutter="20"> |
|||
<el-col |
|||
:span="4" |
|||
v-for="(card, key) in toolCards" |
|||
:key="key" |
|||
@click.native="toTarget(card.name)" |
|||
:xs="8" |
|||
> |
|||
<el-card shadow="hover" class="grid-content"> |
|||
<i :class="card.icon" :style="{ color: card.color }"></i> |
|||
<p>{{ card.label }}</p> |
|||
</el-card> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
<div class="bottom"> |
|||
<el-row :gutter="32"> |
|||
<el-col :xs="24" :sm="24" :lg="12"> |
|||
<div class="chart-player"> |
|||
<musicPlayer /> |
|||
</div> |
|||
</el-col> |
|||
<el-col :xs="24" :sm="24" :lg="12"> |
|||
<div class="chart-player"> |
|||
<todo-list /> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import musicPlayer from "./component/musicPlayer" |
|||
import TodoList from "./component/todoList" |
|||
import { mapGetters } from 'vuex' |
|||
import musicPlayer from "./component/musicPlayer"; |
|||
import TodoList from "./component/todoList"; |
|||
import { mapGetters } from "vuex"; |
|||
export default { |
|||
name: 'Dashboard', |
|||
name: "Dashboard", |
|||
data() { |
|||
return { |
|||
toolCards:[ |
|||
{ |
|||
label:"用户管理", |
|||
icon:"el-icon el-icon-monitor", |
|||
name:"user", |
|||
color:"#ff9c6e" |
|||
}, |
|||
{ |
|||
label:"角色管理", |
|||
icon:"el-icon el-icon-setting", |
|||
name:"authority", |
|||
color:"#69c0ff" |
|||
}, |
|||
{ |
|||
label:"菜单管理", |
|||
icon:"el-icon el-icon-menu", |
|||
name:"menu", |
|||
color:"#b37feb" |
|||
}, |
|||
{ |
|||
label:"代码生成器", |
|||
icon:"el-icon el-icon-cpu", |
|||
name:"autoCode", |
|||
color:"#ffd666" |
|||
}, |
|||
{ |
|||
label:"表单生成器", |
|||
icon:"el-icon el-icon-document-checked", |
|||
name:"formCreate", |
|||
color:"#ff85c0" |
|||
}, |
|||
{ |
|||
label:"关于我们", |
|||
icon:"el-icon el-icon-user", |
|||
name:"about", |
|||
color:"#5cdbd3" |
|||
} |
|||
|
|||
] |
|||
} |
|||
toolCards: [ |
|||
{ |
|||
label: "用户管理", |
|||
icon: "el-icon el-icon-monitor", |
|||
name: "user", |
|||
color: "#ff9c6e", |
|||
}, |
|||
{ |
|||
label: "角色管理", |
|||
icon: "el-icon el-icon-setting", |
|||
name: "authority", |
|||
color: "#69c0ff", |
|||
}, |
|||
{ |
|||
label: "菜单管理", |
|||
icon: "el-icon el-icon-menu", |
|||
name: "menu", |
|||
color: "#b37feb", |
|||
}, |
|||
{ |
|||
label: "代码生成器", |
|||
icon: "el-icon el-icon-cpu", |
|||
name: "autoCode", |
|||
color: "#ffd666", |
|||
}, |
|||
{ |
|||
label: "表单生成器", |
|||
icon: "el-icon el-icon-document-checked", |
|||
name: "formCreate", |
|||
color: "#ff85c0", |
|||
}, |
|||
{ |
|||
label: "关于我们", |
|||
icon: "el-icon el-icon-user", |
|||
name: "about", |
|||
color: "#5cdbd3", |
|||
}, |
|||
], |
|||
}; |
|||
}, |
|||
computed: { |
|||
...mapGetters('user', ['userInfo']) |
|||
computed: { |
|||
...mapGetters("user", ["userInfo"]), |
|||
}, |
|||
components:{ |
|||
musicPlayer, //音乐播放器 |
|||
TodoList, //TodoList |
|||
// RaddarChart, //雷达图 |
|||
// stackMap, //堆叠图 |
|||
// Sunburst, //旭日图 |
|||
}, |
|||
methods:{ |
|||
toTarget(name){ |
|||
this.$router.push({name}) |
|||
} |
|||
components: { |
|||
musicPlayer, //音乐播放器 |
|||
TodoList, //TodoList |
|||
// RaddarChart, //雷达图 |
|||
// stackMap, //堆叠图 |
|||
// Sunburst, //旭日图 |
|||
}, |
|||
methods: { |
|||
toTarget(name) { |
|||
this.$router.push({ name }); |
|||
}, |
|||
} |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.big{ |
|||
margin:100px 0 0 0; |
|||
padding-top: 0; |
|||
background-color: rgb(243,243,243); |
|||
padding-top: 15px; |
|||
.top{ |
|||
width: 100%; |
|||
height: 360px; |
|||
margin-top: 20px; |
|||
overflow: hidden; |
|||
.chart-container{ |
|||
position: relative; |
|||
width: 100%; |
|||
height: 100%; |
|||
padding: 20px; |
|||
background-color: #fff; |
|||
} |
|||
} |
|||
.mid{ |
|||
width: 100%; |
|||
height: 380px; |
|||
.chart-wrapper { |
|||
height: 340px; |
|||
background: #fff; |
|||
padding: 16px 16px 0; |
|||
margin-bottom: 32px; |
|||
} |
|||
} |
|||
.bottom{ |
|||
width: 100%; |
|||
height: 300px; |
|||
// margin: 20px 0; |
|||
.el-row{ |
|||
margin-right: 4px !important; |
|||
} |
|||
.chart-player{ |
|||
width: 100%; |
|||
height: 270px; |
|||
padding: 10px; |
|||
background-color: #fff; |
|||
} |
|||
} |
|||
.big { |
|||
margin: 100px 0 0 0; |
|||
padding-top: 0; |
|||
background-color: rgb(243, 243, 243); |
|||
padding-top: 15px; |
|||
.top { |
|||
width: 100%; |
|||
height: 360px; |
|||
margin-top: 20px; |
|||
overflow: hidden; |
|||
.chart-container { |
|||
position: relative; |
|||
width: 100%; |
|||
height: 100%; |
|||
padding: 20px; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
} |
|||
.mid { |
|||
width: 100%; |
|||
height: 380px; |
|||
.chart-wrapper { |
|||
height: 340px; |
|||
background: #fff; |
|||
padding: 16px 16px 0; |
|||
margin-bottom: 32px; |
|||
} |
|||
} |
|||
.bottom { |
|||
width: 100%; |
|||
height: 300px; |
|||
// margin: 20px 0; |
|||
.el-row { |
|||
margin-right: 4px !important; |
|||
} |
|||
.chart-player { |
|||
width: 100%; |
|||
height: 270px; |
|||
padding: 10px; |
|||
background-color: #fff; |
|||
} |
|||
} |
|||
} |
|||
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue