|
|
@@ -1,8 +1,5 @@
|
|
|
<template>
|
|
|
- <div
|
|
|
- class="chatBIReport"
|
|
|
- :style="{ height: openMessageflag ? '' : '200px' }"
|
|
|
- v-if="reportAnalysisData">
|
|
|
+ <div class="chatBIReport" :style="{ height: openMessageflag ? '' : '200px' }">
|
|
|
<div class="header">
|
|
|
<div class="reporter">{{ title }}</div>
|
|
|
<div class="commitTime">
|
|
|
@@ -10,8 +7,9 @@
|
|
|
<div class="value">{{ commitTime }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="content">
|
|
|
- <p class="message" v-html="resData.msg"></p>
|
|
|
+ <div class="tab">智能洞察<img :src="require('@/assets/dongcha.png')" /></div>
|
|
|
+ <div class="content" v-if="reportAnalysisData">
|
|
|
+ <p class="message" v-html="reportAnalysisData"></p>
|
|
|
<div class="foldBtn">
|
|
|
<img
|
|
|
:class="[openMessageflag ? 'openMessage-img' : '']"
|
|
|
@@ -19,6 +17,9 @@
|
|
|
@click="openMessageflag = !openMessageflag" />
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="mask" v-if="!reportAnalysisData">
|
|
|
+ <van-loading type="spinner" color="#1989fa" />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
@@ -49,12 +50,10 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
getReportAnalysis() {
|
|
|
- this.toastLoading(0, '加载中...', true);
|
|
|
reportAnalysis({ reportId: this.reportId })
|
|
|
.then((res) => {
|
|
|
- this.toastLoading().clear();
|
|
|
if (res.code == 200) {
|
|
|
- this.reportAnalysisData = res.data.msg || '';
|
|
|
+ this.reportAnalysisData = res.msg || '';
|
|
|
} else {
|
|
|
this.$toast(response.msg);
|
|
|
}
|
|
|
@@ -70,8 +69,8 @@ export default {
|
|
|
<style lang="scss" scoped>
|
|
|
.chatBIReport {
|
|
|
margin: 10px;
|
|
|
- // max-height: 300px;
|
|
|
overflow-y: auto;
|
|
|
+ position: relative;
|
|
|
.header {
|
|
|
background-color: #fff;
|
|
|
padding: 10px 16px;
|
|
|
@@ -83,6 +82,19 @@ export default {
|
|
|
align-items: center;
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
+ .tab {
|
|
|
+ background-color: #fff;
|
|
|
+ font-size: 18px;
|
|
|
+ padding: 10px 16px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #0057ba;
|
|
|
+ border-bottom: 1px solid #999;
|
|
|
+ img {
|
|
|
+ width: 20px;
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
.content {
|
|
|
background-color: #fff;
|
|
|
.message {
|
|
|
@@ -91,6 +103,7 @@ export default {
|
|
|
white-space: pre-wrap;
|
|
|
line-height: 24px;
|
|
|
background-color: #fff;
|
|
|
+ margin-top: 0;
|
|
|
}
|
|
|
.foldBtn {
|
|
|
position: sticky;
|
|
|
@@ -106,5 +119,15 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .mask {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ top: 0;
|
|
|
+ background: rgba(255, 255, 255, 0.8);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
