|
|
@@ -1,21 +1,27 @@
|
|
|
<template>
|
|
|
- <div class="logDetail">
|
|
|
+ <PageMain class="vh100">
|
|
|
<el-descriptions :column="2">
|
|
|
<template #title>
|
|
|
<div class="title">
|
|
|
<div class="icon">
|
|
|
- <el-icon><List /></el-icon>
|
|
|
+ <el-icon>
|
|
|
+ <List />
|
|
|
+ </el-icon>
|
|
|
</div>
|
|
|
<p>{{ detailData?.operationContent }}</p>
|
|
|
</div>
|
|
|
</template>
|
|
|
- <el-descriptions-item label="操作功能:" label-align="right" align="left" label-width="100">{{ detailData?.moduleName }}</el-descriptions-item>
|
|
|
- <el-descriptions-item label="操作类型:" label-align="right" align="left" label-width="100">{{ detailData?.operatorName }}</el-descriptions-item>
|
|
|
- <el-descriptions-item label="操作人:" label-align="right" align="left" label-width="100">{{ detailData?.createBy }}</el-descriptions-item>
|
|
|
- <el-descriptions-item label="操作时间:" label-align="right" align="left" label-width="100">{{ detailData?.createTime }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="操作功能:" label-align="right" align="left" label-width="100">{{ detailData?.moduleName
|
|
|
+ }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="操作类型:" label-align="right" align="left" label-width="100">{{ detailData?.operatorName
|
|
|
+ }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="操作人:" label-align="right" align="left" label-width="100">{{ detailData?.createBy
|
|
|
+ }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="操作时间:" label-align="right" align="left" label-width="100">{{ detailData?.createTime
|
|
|
+ }}</el-descriptions-item>
|
|
|
</el-descriptions>
|
|
|
<el-row :gutter="20" class="content">
|
|
|
- <el-col :span="11">
|
|
|
+ <el-col :span="11" class="h-full">
|
|
|
<p>变更前</p>
|
|
|
<div class="list">
|
|
|
<el-row class="list-item" :gutter="20" v-for="item in detailData?.compareResultList" :key="item">
|
|
|
@@ -25,7 +31,7 @@
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-divider direction="vertical" style="height: 100%"></el-divider>
|
|
|
- <el-col :span="11">
|
|
|
+ <el-col :span="11" class="h-full">
|
|
|
<p>变更后</p>
|
|
|
<div class="list">
|
|
|
<el-row class="list-item" :gutter="20" v-for="item in detailData?.compareResultList" :key="item">
|
|
|
@@ -35,7 +41,7 @@
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- </div>
|
|
|
+ </PageMain>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
@@ -50,7 +56,7 @@ let detailData = ref(undefined)
|
|
|
|
|
|
const initDetail = () => {
|
|
|
api.logApi.selectById(myRoute.query.id).then((res: any) => {
|
|
|
- if(res.code == 200) {
|
|
|
+ if (res.code == 200) {
|
|
|
detailData.value = res.data
|
|
|
} else {
|
|
|
ElMessage({
|
|
|
@@ -68,50 +74,50 @@ onMounted(() => {
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.logDetail{
|
|
|
- padding: 24px;
|
|
|
- background: #FFFFFF;
|
|
|
- width: 100%;
|
|
|
- height: calc(100vh - 120px);
|
|
|
- .title{
|
|
|
+.title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 50%;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: flex-start;
|
|
|
- .icon{
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- border-radius: 50%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- background: #1A85FA;
|
|
|
- color: #FFFFFF;
|
|
|
- font-size: 20px;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
+ justify-content: center;
|
|
|
+ background: #1A85FA;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size: 20px;
|
|
|
+ margin-right: 10px;
|
|
|
}
|
|
|
- .content{
|
|
|
- height: calc(100% - 120px);
|
|
|
- overflow: hidden;
|
|
|
- p{
|
|
|
- text-align: center;
|
|
|
- background: #F0F0F0;
|
|
|
- margin: 0;
|
|
|
- padding: 16px 0;
|
|
|
- }
|
|
|
- .list{
|
|
|
- height: calc(100% - 80px);
|
|
|
- overflow-y: auto;
|
|
|
- overflow-x: hidden;
|
|
|
- .list-item{
|
|
|
- margin: 14px 0;
|
|
|
- padding: 0 20px;
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- }
|
|
|
+}
|
|
|
+
|
|
|
+.content {
|
|
|
+ height: calc(100% - 144px);
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ p {
|
|
|
+ text-align: center;
|
|
|
+ background: #F0F0F0;
|
|
|
+ margin: 0;
|
|
|
+ padding: 16px 0;
|
|
|
}
|
|
|
- :deep(.el-descriptions) {
|
|
|
- width: 50%;
|
|
|
+
|
|
|
+ .list {
|
|
|
+ height: calc(100% - 56px);
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+
|
|
|
+ .list-item {
|
|
|
+ margin: 14px 0;
|
|
|
+ padding: 0 20px;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+:deep(.el-descriptions) {
|
|
|
+ width: 50%;
|
|
|
+}
|
|
|
</style>
|