Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
FLIPPED-AURORA
gin-vue-admin
提交
804e28d2
G
gin-vue-admin
项目概览
FLIPPED-AURORA
/
gin-vue-admin
大约 1 年 前同步成功
通知
333
Star
18155
Fork
5506
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gin-vue-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
804e28d2
编写于
11月 25, 2020
作者:
Mr.奇淼(
浏览文件
操作
浏览文件
下载
差异文件
Merge branch 'gva_gormv2_dev' of
https://github.com/flipped-aurora/gin-vue-admin
into develop
上级
a5b37768
52f5e831
变更
11
隐藏空白更改
内联
并排
Showing
11 changed file
with
490 addition
and
195 deletion
+490
-195
server/config.yaml
server/config.yaml
+1
-0
server/config/gorm.go
server/config/gorm.go
+1
-0
server/initialize/gorm.go
server/initialize/gorm.go
+6
-0
server/initialize/logger.go
server/initialize/logger.go
+150
-0
web/src/App.vue
web/src/App.vue
+1
-0
web/src/style/basics.scss
web/src/style/basics.scss
+3
-0
web/src/style/main.scss
web/src/style/main.scss
+12
-4
web/src/style/mobile.scss
web/src/style/mobile.scss
+89
-0
web/src/view/dashboard/index.vue
web/src/view/dashboard/index.vue
+187
-162
web/src/view/example/form/form.vue
web/src/view/example/form/form.vue
+17
-17
web/src/view/layout/index.vue
web/src/view/layout/index.vue
+23
-12
未找到文件。
server/config.yaml
浏览文件 @
804e28d2
...
...
@@ -60,6 +60,7 @@ mysql:
max-idle-conns
:
10
max-open-conns
:
100
log-mode
:
false
log-zap
:
false
# local configuration
local
:
...
...
server/config/gorm.go
浏览文件 @
804e28d2
...
...
@@ -9,4 +9,5 @@ type Mysql struct {
MaxIdleConns
int
`mapstructure:"max-idle-conns" json:"maxIdleConns" yaml:"max-idle-conns"`
MaxOpenConns
int
`mapstructure:"max-open-conns" json:"maxOpenConns" yaml:"max-open-conns"`
LogMode
bool
`mapstructure:"log-mode" json:"logMode" yaml:"log-mode"`
LogZap
bool
`mapstructure:"log-zap" json:"logZap" yaml:"log-zap"`
}
server/initialize/gorm.go
浏览文件 @
804e28d2
...
...
@@ -73,6 +73,12 @@ func GormMysql() *gorm.DB {
// gormConfig 根据配置决定是否开启日志
func
gormConfig
(
mod
bool
)
*
gorm
.
Config
{
if
global
.
GVA_CONFIG
.
Mysql
.
LogZap
{
return
&
gorm
.
Config
{
Logger
:
Default
.
LogMode
(
logger
.
Info
),
DisableForeignKeyConstraintWhenMigrating
:
true
,
}
}
if
mod
{
return
&
gorm
.
Config
{
Logger
:
logger
.
Default
.
LogMode
(
logger
.
Info
),
...
...
server/initialize/logger.go
0 → 100644
浏览文件 @
804e28d2
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
]))
}
}
web/src/App.vue
浏览文件 @
804e28d2
...
...
@@ -15,6 +15,7 @@ export default {
// 引入初始化样式
@import
'@/style/main.scss'
;
@import
'@/style/base.scss'
;
@import
'@/style/mobile.scss'
;
#app
{
background
:
#eee
;
height
:
100vh
;
...
...
web/src/style/basics.scss
浏览文件 @
804e28d2
...
...
@@ -32,3 +32,6 @@ $color-table-tbody:#595959;
$color-table-thead
:
#262626
;
// dashboard
$height-car
:
68px
;
// mobile
$padding-xs
:
5px
;
$margin-xs
:
5px
;
web/src/style/main.scss
浏览文件 @
804e28d2
...
...
@@ -1204,6 +1204,14 @@ $mainHight: 100vh;
top
:
0
;
box-sizing
:
border-box
;
z-index
:
999
;
>
.el-row
{
padding
:
0
;
.el-col-lg-14
{
height
:
60px
;
}
}
}
...
...
@@ -1387,14 +1395,14 @@ $mainHight: 100vh;
.car-left
{
height
:
$height-car
;
width
:
70%
;
float
:
left
;
//
width: 70%;
//
float: left;
}
.car-right
{
height
:
$height-car
;
width
:
29%
;
float
:
left
;
//
width: 29%;
//
float: left;
.flow
,
.user-number
,
...
...
web/src/style/mobile.scss
0 → 100644
浏览文件 @
804e28d2
@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
;
}
}
}
\ No newline at end of file
web/src/view/dashboard/index.vue
浏览文件 @
804e28d2
<
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
>
web/src/view/example/form/form.vue
浏览文件 @
804e28d2
...
...
@@ -2,12 +2,12 @@
<div>
<el-form
:model=
"form"
label-width=
"80px"
ref=
"form"
>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动名称
</label></el-col>
<el-col
:span=
"10"
><el-input
v-model=
"form.name"
></el-input></el-col>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动名称
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
><el-input
v-model=
"form.name"
></el-input></el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动区域
</label></el-col>
<el-col
:span=
"10"
>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动区域
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
>
<el-select
placeholder=
"请选择活动区域"
v-model=
"form.region"
>
<el-option
label=
"上海"
value=
"shanghai"
></el-option>
<el-option
label=
"北京"
value=
"beijing"
></el-option>
...
...
@@ -15,8 +15,8 @@
</el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动时间
</label></el-col>
<el-col
:span=
"10"
>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动时间
</label></el-col>
<el-col
:span=
"10"
:xs=
"18"
>
<el-col
:span=
"11"
>
<el-date-picker
placeholder=
"选择日期"
style=
"width: 100%;"
type=
"date"
v-model=
"form.date1"
></el-date-picker>
</el-col>
...
...
@@ -27,12 +27,12 @@
</el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
即时配送
</label></el-col>
<el-col
:span=
"10"
><el-switch
v-model=
"form.delivery"
></el-switch></el-col>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
即时配送
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
><el-switch
v-model=
"form.delivery"
></el-switch></el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动性质
</label></el-col>
<el-col
:span=
"10"
>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动性质
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
>
<el-checkbox-group
v-model=
"form.type"
>
<el-checkbox
label=
"美食/餐厅线上活动"
name=
"type"
></el-checkbox>
<el-checkbox
label=
"地推活动"
name=
"type"
></el-checkbox>
...
...
@@ -42,8 +42,8 @@
</el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
特殊资源
</label></el-col>
<el-col
:span=
"10"
>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
特殊资源
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
>
<el-radio-group
v-model=
"form.resource"
>
<el-radio
label=
"线上品牌商赞助"
></el-radio>
<el-radio
label=
"线下场地免费"
></el-radio>
...
...
@@ -51,12 +51,12 @@
</el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动形式
</label></el-col>
<el-col
:span=
"10"
><el-input
type=
"textarea"
v-model=
"form.desc"
></el-input></el-col>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动形式
</label></el-col>
<el-col
:span=
"10"
:xs=
"14"
><el-input
type=
"textarea"
v-model=
"form.desc"
></el-input></el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
穿梭框
</label></el-col>
<el-col
:span=
"20"
>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
穿梭框
</label></el-col>
<el-col
:span=
"20"
:xs=
"24"
>
<el-transfer
:data=
"data"
:filter-method=
"filterMethod"
...
...
@@ -67,7 +67,7 @@
</el-col>
</el-row>
<el-row>
<el-col
:span=
"3"
><label
for=
""
>
活动时间
</label></el-col>
<el-col
:span=
"3"
:xs=
"6"
><label
for=
""
>
活动时间
</label></el-col>
<el-col
:span=
"10"
><el-input
v-model=
"form.name"
></el-input></el-col>
</el-row>
<el-row
type=
"flex"
justify=
"center"
>
...
...
web/src/view/layout/index.vue
浏览文件 @
804e28d2
...
...
@@ -16,18 +16,25 @@
:style=
"
{width: `calc(100% - ${isMobile?'0px':isCollapse?'54px':'220px'})`}"
class="topfix"
>
<el-row>
<!-- :xs="8" :sm="6" :md="4" :lg="3" :xl="1" -->
<el-header
class=
"header-cont"
>
<div
@
click=
"totalCollapse"
class=
"menu-total"
>
<i
class=
"el-icon-s-unfold"
v-if=
"isCollapse"
></i>
<i
class=
"el-icon-s-fold"
v-else
></i>
</div>
<el-breadcrumb
class=
"breadcrumb"
separator-class=
"el-icon-arrow-right"
>
<el-breadcrumb-item
:key=
"item.path"
v-for=
"item in matched.slice(1,matched.length)"
>
{{
item
.
meta
.
title
}}
</el-breadcrumb-item>
</el-breadcrumb>
<div
class=
"fl-right right-box"
>
<el-col
:xs=
"2"
:lg=
"1"
:md=
"1"
:sm=
"1"
:xl=
"1"
>
<div
@
click=
"totalCollapse"
class=
"menu-total"
>
<i
class=
"el-icon-s-unfold"
v-if=
"isCollapse"
></i>
<i
class=
"el-icon-s-fold"
v-else
></i>
</div>
</el-col>
<el-col
:xs=
"10"
:lg=
"14"
:md=
'14'
:sm=
"9"
:xl=
"14"
>
<el-breadcrumb
class=
"breadcrumb"
separator-class=
"el-icon-arrow-right"
>
<el-breadcrumb-item
:key=
"item.path"
v-for=
"item in matched.slice(1,matched.length)"
>
{{
item
.
meta
.
title
}}
</el-breadcrumb-item>
</el-breadcrumb>
</el-col>
<el-col
:xs=
"12"
:lg=
"9"
:md=
"9"
:sm=
"14"
:xl=
"9"
>
<div
class=
"fl-right right-box"
>
<Search
/>
<Screenfull
class=
"screenfull"
></Screenfull>
<el-dropdown>
...
...
@@ -48,7 +55,10 @@
</el-dropdown-menu>
</el-dropdown>
</div>
</el-col>
</el-header>
</el-row>
<!-- 当前面包屑用路由自动生成可根据需求修改 -->
<!--
:to="
{ path: item.path }" 暂时注释不用-->
...
...
@@ -172,8 +182,9 @@ export default {
}
}
</
script
>
<
style
lang=
"scss"
>
@import
'@/style/mobile.scss'
;
// $headerHigh: 52px;
// $mainHight: 100vh;
// .dropdown-group {
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录