sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

完成

Browse Source 
Former-commit-id: 9001eac1b65eeaa0bdd4d7f563ebebbd4854c1c5 [formerly 9001eac1b65eeaa0bdd4d7f563ebebbd4854c1c5 [formerly 9001eac1b65eeaa0bdd4d7f563ebebbd4854c1c5 [formerly 9001eac1b65eeaa0bdd4d7f563ebebbd4854c1c5 [formerly 1c2b3829fe2458a1dc678aa3e3e20c069fd186e9 [formerly 87efd77bd6c9e4842534b22a90a3c57f8ad49e15]]]]]
Former-commit-id: 51b7d845391107170b6d6055fae0db9204391cab
Former-commit-id: 16c827f13aeb87f8fcbdf7c667dd60a1681833f4
Former-commit-id: a9589d815008a1c41b625905413582a2225cc811 [formerly 58f118d7086495f51c085ecfe22e046dc25a1703]
Former-commit-id: de173859d5e70870200f9eb02220b0edda9ad6d3
Former-commit-id: ec7d195132cac799568d534473a70ce9e638a21f
Former-commit-id: fb49b3ce0453630207ec44212587c3df209529a2
Former-commit-id: 76d0b5475c8b665fd9eae851ae21e4c102254b2f
Former-commit-id: fb71b68aee8dd0627982ce3c39a91017abda502e
This commit is contained in:
liyang
2018-08-07 16:07:05 +08:00
parent 79935b8e98
commit f28718943b
7 changed files with 158 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/d2-error-log-list/components/ExpandItem/index.vue Normal file
View File

@@ -0,0 +1,30 @@
<template>
<div
class="d2-error-log-list__expand"
:class="className">
<p class="d2-error-log-list__expand-title">{{title}}</p>
<p class="d2-error-log-list__expand-value">{{value === '' ? '无数据' : value}}</p>
<slot/>
</div>
</template>
<script>
export default {
props: {
type: {
default: 'log'
},
title: {
default: ''
},
value: {
default: ''
}
},
computed: {
className () {
return this.type === 'log' ? 'd2-error-log-list__expand--log' : 'd2-error-log-list__expand--error'
}
}
}
</script>

136
src/components/d2-error-log-list/index.vue
View File

@@ -1,17 +1,66 @@
<template>
<el-table
:data="log"
:data="logReverse"
border
stripe
style="width: 100%"
size="mini">
<el-table-column type="expand">
<template slot-scope="props">
<div style="overflow: auto;">
<pre>{{stackBeautify(props.row.err)}}</pre>
</div>
</template>
<div slot-scope="props" class="d2-error-log-list__expand-group">
<expand-item
:type="props.row.type"
title="类型"
:value="props.row.type === 'log' ? '日志' : '异常'"/>
<expand-item
:type="props.row.type"
title="内容"
:value="props.row.info"/>
<expand-item
v-if="props.row.type === 'error'"
type="error"
title="报错组件"
:value="get(props.row.vm, '$vnode.tag', '')"/>
<expand-item
v-if="props.row.type === 'error'"
type="error"
title="错误名称"
:value="get(props.row.err, 'name', '')"/>
<expand-item
v-if="props.row.type === 'error'"
type="error"
title="错误信息"
:value="get(props.row.err, 'message', '')"/>
<expand-item
v-if="props.row.type === 'error'"
type="error"
title="错误堆栈"
value="见下">
<div style="overflow: auto;">
<pre>{{stackBeautify(props.row.err)}}</pre>
</div>
</expand-item>
<expand-item
:type="props.row.type"
title="用户名"
:value="get(props.row.user, 'name', '')"/>
<expand-item
:type="props.row.type"
title="uuid"
:value="props.row.uuid"/>
<expand-item
:type="props.row.type"
title="token"
:value="props.row.token"/>
<expand-item
:type="props.row.type"
title="页面地址"
:value="props.row.url"/>
<expand-item
:type="props.row.type"
title="时间"
:value="props.row.time"/>
</div>
</el-table-column>
<el-table-column
@@ -50,19 +99,8 @@
</el-table-column>
<el-table-column
label="组件"
width="140px"
:show-overflow-tooltip="true">
<template
slot-scope="scope">
{{scope.row.vm ? scope.row.vm.$vnode.tag : ''}}
</template>
</el-table-column>
<el-table-column
label="信息"
label="内容"
prop="info"
width="200px"
:show-overflow-tooltip="true">
</el-table-column>
@@ -72,40 +110,48 @@
:show-overflow-tooltip="true">
<template
slot-scope="scope">
{{scope.row.err ? scope.row.err.name : ''}}
{{get(scope.row.err, 'name', '')}}
</template>
</el-table-column>
<el-table-column
label="错误信息">
label="错误信息"
width="140px">
<template
slot-scope="scope">
{{scope.row.err ? scope.row.err.message : ''}}
{{get(scope.row.err, 'message', '')}}
</template>
</el-table-column>
<el-table-column
label="time"
prop="time"
width="150px"
:show-overflow-tooltip="true">
</el-table-column>
</el-table>
</template>
<script>
import { mapState } from 'vuex'
import get from 'lodash.get'
import ExpandItem from './components/ExpandItem'
export default {
name: 'd2-error-log-list',
components: {
ExpandItem
},
computed: {
...mapState({
log: state => state.d2admin.log
})
}),
logReverse () {
// 直接 reverse 的话有点问题
const res = []
const loglength = this.log.length
this.log.forEach((log, index) => {
res.push(this.log[loglength - 1 - index])
})
return res
}
},
methods: {
get,
filterType (value, row) {
console.log('value', value)
return row.type === value
},
stackBeautify (err) {
@@ -117,3 +163,33 @@ export default {
}
}
</script>
<style lang="scss">
@import '~@/assets/style/public.scss';
.d2-error-log-list__expand-group {
.d2-error-log-list__expand {
padding-left: 20px;
margin-bottom: 10px;
&:last-child {
margin-bottom: 0px;
}
.d2-error-log-list__expand-title {
font-size: 16px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 10px;
}
.d2-error-log-list__expand-value {
font-size: 12px;
margin-top: 0px;
margin-bottom: 0px;
}
}
.d2-error-log-list__expand--log {
border-left: 4px solid $color-info;
}
.d2-error-log-list__expand--error {
border-left: 4px solid $color-danger;
}
}
</style>