|
|
<!--
|
|
|
* @description: 案件详情
|
|
|
* @fileName: index
|
|
|
* @author: 17076
|
|
|
* @date: 2024/6/19-下午2:54
|
|
|
* @version: V1.0.0
|
|
|
-->
|
|
|
|
|
|
<template>
|
|
|
<div class="details-content">
|
|
|
<div class="details-header">
|
|
|
<div v-if="expand" class="flex-row expand-info">
|
|
|
<div class="left-score">
|
|
|
<vue-chart autoresize :option="scoreOption" :style="{ width: '100%', height: '260px' }" />
|
|
|
<div
|
|
|
v-if="caseData['totalScore'] != null"
|
|
|
class="flex-column circle-info"
|
|
|
:style="circleStyle"
|
|
|
>
|
|
|
<span>综合得分</span>
|
|
|
<span :style="commonStyle">{{ caseData['totalScore'] }}</span>
|
|
|
<span :style="commonStyle">{{ caseData['identifyResultName'] }}</span>
|
|
|
<!-- <span>最新时间：<span>{{ caseData['caseAnalysisSuccessTime']||'' }}</span></span> -->
|
|
|
<span v-if="caseData['caseAnalysisSuccessTime']">{{ `最新时间：${caseData['caseAnalysisSuccessTime']}` }}</span>
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
v-else
|
|
|
class="flex-column circle-info empty-score"
|
|
|
>
|
|
|
<span>待分析</span>
|
|
|
<span>暂无结果</span>
|
|
|
|
|
|
</div>
|
|
|
<div v-if="isEdit" class="model" @click="handleAnalysis">模型分析</div>
|
|
|
</div>
|
|
|
<div class="base-info">
|
|
|
<div class="flex-row" style="align-items: center; justify-content: space-between">
|
|
|
<h4>基本信息</h4>
|
|
|
<div style="display: flex;">
|
|
|
<!-- <el-button type="info" plain icon="el-icon-download" @click="handleDownload">下载</el-button> -->
|
|
|
<div v-if="isEdit" class="btn-icon" @click="handleEdit">
|
|
|
<img src="@/assets/caseManagement/edit.png" alt="">
|
|
|
<span>编辑</span>
|
|
|
</div>
|
|
|
<!-- <el-button v-if="isEdit" type="primary" plain icon="el-icon-edit" @click="handleEdit">编辑</el-button> -->
|
|
|
<div v-if="caseData['totalScore'] != null" class="btn-icon" @click="openDeatil">
|
|
|
<img src="@/assets/caseManagement/analysis.png" alt="">
|
|
|
<span>案件分析结果</span>
|
|
|
</div>
|
|
|
<!-- <el-button v-if="caseData['totalScore'] != null" type="primary" plain ></el-button> -->
|
|
|
<el-button type="text" icon="el-icon-arrow-up" style="color: #666666" @click="expand = false">收起</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<el-descriptions :column="4">
|
|
|
<el-descriptions-item label="案件编号">{{ caseData['caseNo'] }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="案件名称">{{ caseData['caseName'] }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="案件类型" span="2">{{ caseData.caseTypeName }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="案件状态">{{ caseData.caseStatusName }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="到案方式">{{ caseData.crimeModeName }}</el-descriptions-item>
|
|
|
<!-- <el-descriptions-item label="立案时间">{{ caseData.registerTime || '暂未添加，上传笔录后自动生成' }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="受理时间">{{ caseData.acceptTime || '暂未添加，上传笔录后自动生成' }}</el-descriptions-item> -->
|
|
|
|
|
|
<el-descriptions-item label="行为人">{{ caseData.caseActorName || '暂未添加，上传笔录后自动生成' }}</el-descriptions-item>
|
|
|
<el-descriptions-item label="当事人">
|
|
|
<div slot="default" :title="caseData.lawParty || '暂未添加，上传笔录后自动生成'" class="case-lawParty">
|
|
|
{{ caseData.lawParty || '暂未添加，上传笔录后自动生成' }}
|
|
|
</div>
|
|
|
</el-descriptions-item>
|
|
|
<el-descriptions-item label="案件概述" span="24">
|
|
|
<div slot="default" class="case-summarize">
|
|
|
{{ caseData.caseDetail }}
|
|
|
</div>
|
|
|
</el-descriptions-item>
|
|
|
</el-descriptions>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-else class="flex-row pick-up-info">
|
|
|
<div class="flex-row left-title" style="align-items: center">
|
|
|
<span>综合得分：</span>
|
|
|
<span :style="commonStyle" style="font-size: 30px;">{{ caseData.totalScore }}</span>
|
|
|
<div v-if="isEdit" class="model" @click="handleAnalysis">模型分析</div>
|
|
|
</div>
|
|
|
<div class="base-info flex-row" style="align-items: center; justify-content: space-between">
|
|
|
<div class="flex-row">
|
|
|
<span>案件编号：</span>
|
|
|
<span>{{ caseData.caseNo }}</span>
|
|
|
<span style="margin-left: 30px">案件名称：</span>
|
|
|
<span>{{ caseData.caseName }}</span>
|
|
|
<span style="margin-left: 30px">案件状态：</span>
|
|
|
<span>{{ caseData.caseStatusName }}</span>
|
|
|
<div class="btn-list">
|
|
|
<div v-if="isEdit" class="btns" @click="handleEdit">
|
|
|
<img src="@/assets/caseManagement/edit.png" alt="">
|
|
|
<span>编辑</span>
|
|
|
</div>
|
|
|
<!-- <el-button v-if="isEdit" type="primary" plain icon="el-icon-edit" @click="handleEdit">编辑</el-button> -->
|
|
|
<div v-if="caseData['totalScore'] != null" class="btns" @click="openDeatil">
|
|
|
<img src="@/assets/caseManagement/analysis.png" alt="">
|
|
|
<span>案件分析结果</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
<el-button type="text" icon="el-icon-arrow-down" style="color: #666666" @click="expand = true">展开</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="flex-row details-info" :style="{ height: expand ? 'calc(100% - 270px)' : 'calc(100% - 80px)' }">
|
|
|
<div class="info-left">
|
|
|
<el-tree
|
|
|
v-if="currentKey"
|
|
|
:data="leftTabs"
|
|
|
node-key="value"
|
|
|
highlight-current
|
|
|
:current-node-key="currentKey"
|
|
|
default-expand-all
|
|
|
@node-click="handleNodeClick"
|
|
|
/>
|
|
|
</div>
|
|
|
<div v-loading="!showFlag" class="info-right">
|
|
|
<h4 style="margin: 0">
|
|
|
<span>{{ selectTitle }}</span>
|
|
|
<span v-if="score!==''">{{ ` ${score}分` }}</span>
|
|
|
</h4>
|
|
|
<component :is="selectCom" v-if="showFlag" :is-edit="isEdit" :is-expand="expand" @reloadData="fetchData" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<!--编辑/新增弹窗-->
|
|
|
<edit-case-info ref="edit" @reloadData="fetchData" />
|
|
|
<!--模型分析-->
|
|
|
<model-analysis ref="analysis" @confirm="handleConfirmAnalysis" />
|
|
|
<!--案件分析详情-->
|
|
|
<case-analysis ref="caseAnalysis" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import VueChart from '@/plugins/echarts'
|
|
|
import scoreConfig from './js/scoreConfig'
|
|
|
import EditCaseInfo from '@/views/caseManagement/components/EditCaseInfo.vue'
|
|
|
import CaseRecord from './components/CaseRecord.vue'
|
|
|
import CaseEvidence from './components/CaseEvidence.vue'
|
|
|
import CommonIndex from './components/CommonIndex.vue'
|
|
|
import InnocentIndex from './components/InnocentIndex.vue'
|
|
|
import IncriminateIndex from './components/IncriminateIndex.vue'
|
|
|
import CaseAtlas from './components/CaseAtlas.vue'
|
|
|
import ModelAnalysis from '@/views/caseManagement/components/ModelAnalysis.vue'
|
|
|
import CaseAnalysis from './components/CaseAnalysis.vue'
|
|
|
import ManuallyDefined from './components/ManuallyDefined.vue'
|
|
|
import { executeModelAnalyse, queryCaseList, getCaseScore } from '@/api/caseManagement'
|
|
|
import merge from 'webpack-merge'
|
|
|
export default {
|
|
|
name: 'Index',
|
|
|
components: {
|
|
|
ModelAnalysis,
|
|
|
EditCaseInfo,
|
|
|
VueChart,
|
|
|
CaseRecord,
|
|
|
CaseEvidence,
|
|
|
CommonIndex,
|
|
|
InnocentIndex,
|
|
|
IncriminateIndex,
|
|
|
CaseAtlas,
|
|
|
CaseAnalysis,
|
|
|
ManuallyDefined
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
// 是否展开
|
|
|
expand: true,
|
|
|
caseData: {},
|
|
|
// 得分配置
|
|
|
scoreOption: scoreConfig,
|
|
|
// 得分/结果样式
|
|
|
commonStyle: {
|
|
|
color: '#FFBB69'
|
|
|
},
|
|
|
// 圆圈样式
|
|
|
circleStyle: {
|
|
|
alignItems: 'center',
|
|
|
boxShadow: '0px 1px 30px 0px rgba(255,169,66,0.2)'
|
|
|
},
|
|
|
showFlag: true,
|
|
|
score: '',
|
|
|
// 左侧分类树
|
|
|
leftTabs: [
|
|
|
{ label: '案件证据', value: '1', children: [
|
|
|
{ label: '笔录', value: '1-1', component: 'CaseRecord' },
|
|
|
{ label: '证据', value: '1-2', component: 'CaseEvidence' }
|
|
|
] },
|
|
|
{ label: '指标判断', value: '4', children: [
|
|
|
{ label: '人工定义', value: '4-1', component: 'ManuallyDefined' }
|
|
|
] },
|
|
|
{ label: '指标结果', value: '2', children: [
|
|
|
{ label: '共性指标', value: '2-1', component: 'CommonIndex' },
|
|
|
{ label: '入罪指标', value: '2-2', component: 'IncriminateIndex' },
|
|
|
{ label: '出罪指标', value: '2-3', component: 'InnocentIndex' }
|
|
|
|
|
|
] },
|
|
|
{ label: '知识图谱', value: '3', children: [
|
|
|
{ label: '案件图谱', value: '3-1', component: 'CaseAtlas' }
|
|
|
] }
|
|
|
],
|
|
|
currentKey: '',
|
|
|
// 当前选中的标题
|
|
|
selectTitle: '案件证据-笔录',
|
|
|
// 当前选中的组件
|
|
|
selectCom: 'CaseRecord',
|
|
|
// 得分详情
|
|
|
scoreInfo: {},
|
|
|
// 是否编辑
|
|
|
isEdit: false,
|
|
|
timer: undefined
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
// 是否是编辑
|
|
|
this.isEdit = this.$route.query.isEdit === '1'
|
|
|
this.fetchData()
|
|
|
this.queryCaseScore()
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取当前选中的node
|
|
|
getSelectNode(val) {
|
|
|
for (const item of this.leftTabs) {
|
|
|
for (const items of item.children) {
|
|
|
if (items.value === val) {
|
|
|
return {
|
|
|
component: items.component,
|
|
|
selectTitle: `${item['label']}-${items['label']}`,
|
|
|
label: `${items['label']}`
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// 获取案件得分详情
|
|
|
queryCaseScore() {
|
|
|
getCaseScore({ caseId: this.$route.params['id'] }).then(res => {
|
|
|
if (res.code === 200) {
|
|
|
this.scoreInfo = res.data
|
|
|
if (this.$route.query.currentKey) {
|
|
|
this.currentKey = this.$route.query.currentKey
|
|
|
const node = this.getSelectNode(this.$route.query.currentKey)
|
|
|
this.selectTitle = node.selectTitle
|
|
|
|
|
|
if (node.label === '共性指标') {
|
|
|
this.score = this.scoreInfo.commonScore
|
|
|
} else if (node.label === '入罪指标') {
|
|
|
this.score = this.scoreInfo.crimeScore
|
|
|
} else if (node.label === '出罪指标') {
|
|
|
this.score = this.scoreInfo.crimeOutScore
|
|
|
} else {
|
|
|
this.score = ''
|
|
|
}
|
|
|
this.selectCom = node.component
|
|
|
} else {
|
|
|
this.currentKey = '1-1'
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 动态更新指针值，触发动画
|
|
|
updateGauge(value) {
|
|
|
this.scoreOption.series[0].data = [{ value }]
|
|
|
this.caseData.totalScore = this.getRandomNumber(20, 80)
|
|
|
},
|
|
|
getRandomNumber(min, max) {
|
|
|
return Math.floor(Math.random() * (max - min + 1)) + min
|
|
|
},
|
|
|
// 获取案件数据
|
|
|
fetchData() {
|
|
|
queryCaseList({ id: this.$route.params['id'] }, 1, 1).then(res => {
|
|
|
if (res.code === 200) {
|
|
|
this.caseData = res.data.records[0]
|
|
|
if (this.caseData.lawPartyList) {
|
|
|
const list = []
|
|
|
this.caseData.lawPartyList.forEach(e => {
|
|
|
list.push(e.name)
|
|
|
})
|
|
|
this.caseData.lawParty = list.join(',')
|
|
|
}
|
|
|
|
|
|
// 设置分数
|
|
|
this.scoreOption.series[0].data = [{ value: this.caseData.totalScore }]
|
|
|
clearInterval(this.timer)
|
|
|
this.timer = undefined
|
|
|
// 判断分数设置不通颜色
|
|
|
if (this.caseData.identifyResult === '3') {
|
|
|
this.scoreOption.series[0].progress.itemStyle.color.colorStops = [{
|
|
|
offset: 0, color: '#00975E'
|
|
|
}, {
|
|
|
offset: 1, color: '#3EE5A6'
|
|
|
}]
|
|
|
this.scoreOption.series[0].pointer.itemStyle.color = '#3EE5A6'
|
|
|
this.commonStyle.color = '#00975E'
|
|
|
this.circleStyle.boxShadow = '0px 1px 30px 0px rgba(0,151,94,0.2)'
|
|
|
} else if (this.caseData.identifyResult === '2') {
|
|
|
this.scoreOption.series[0].progress.itemStyle.color.colorStops = [{
|
|
|
offset: 0, color: '#F68600'
|
|
|
}, {
|
|
|
offset: 1, color: '#FFA942'
|
|
|
}]
|
|
|
this.scoreOption.series[0].pointer.itemStyle.color = '#FFA942'
|
|
|
this.commonStyle.color = '#FFBB69'
|
|
|
this.circleStyle.boxShadow = '0px 1px 30px 0px rgba(255,169,66,0.2)'
|
|
|
} else {
|
|
|
this.scoreOption.series[0].progress.itemStyle.color.colorStops = [{
|
|
|
offset: 0, color: '#FF3429'
|
|
|
}, {
|
|
|
offset: 1, color: '#FF3429'
|
|
|
}]
|
|
|
this.scoreOption.series[0].pointer.itemStyle.color = '#FF3429'
|
|
|
this.commonStyle.color = '#FF3429'
|
|
|
this.circleStyle.boxShadow = '0px 1px 30px 0px rgba(255,169,66,0.2)'
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
// 下载
|
|
|
handleDownload() {
|
|
|
|
|
|
},
|
|
|
openDeatil() {
|
|
|
this.$refs.caseAnalysis.show()
|
|
|
},
|
|
|
// 编辑
|
|
|
handleEdit() {
|
|
|
this.$refs.edit.show(this.caseData, true)
|
|
|
},
|
|
|
// 模型分析
|
|
|
handleAnalysis() {
|
|
|
this.showFlag = false
|
|
|
this.handleConfirmAnalysis()
|
|
|
let value = 80
|
|
|
if (this.timer) return
|
|
|
this.timer = setInterval(() => {
|
|
|
this.updateGauge(value)
|
|
|
value = value === 20 ? 80 : 20
|
|
|
}, 500)
|
|
|
setTimeout(() => {
|
|
|
this.showFlag = true
|
|
|
this.fetchData()
|
|
|
}, 5000)
|
|
|
// this.$refs.analysis.show(this.caseData)
|
|
|
},
|
|
|
handleConfirmAnalysis(data) {
|
|
|
this.$set(this.caseData, 'isAnalysing', true)
|
|
|
const params = {
|
|
|
caseId: this.$route.params['id'],
|
|
|
lawActorName: this.caseData.lawActorName,
|
|
|
lawParty: this.caseData.lawParty
|
|
|
}
|
|
|
executeModelAnalyse(params).then(res => {
|
|
|
const { code, msg } = res
|
|
|
this.$set(this.caseData, 'isAnalysing', false)
|
|
|
if (code === 200) {
|
|
|
this.$baseMessage.success(msg || '模型分析成功!')
|
|
|
}
|
|
|
this.fetchData()
|
|
|
}).catch(() => {
|
|
|
clearInterval(this.timer)
|
|
|
this.timer = undefined
|
|
|
this.showFlag = true
|
|
|
})
|
|
|
},
|
|
|
// 节点点击回调
|
|
|
handleNodeClick(node, data) {
|
|
|
const currentQuery = this.$route.query
|
|
|
currentQuery.currentKey = node.value
|
|
|
// this.$set(this.$route.query, 'currentKey', node.value)
|
|
|
this.$router.push({
|
|
|
query: merge(this.$route.query, currentQuery)
|
|
|
})
|
|
|
// this.$route.query.currentKey = node.value
|
|
|
|
|
|
// console.log(data, 666)
|
|
|
if (data.level === 1) return
|
|
|
this.selectTitle = `${data.parent.data['label']}-${data.data['label']}`
|
|
|
if (data.data['label'] === '共性指标') {
|
|
|
this.score = this.scoreInfo.commonScore
|
|
|
} else if (data.data['label'] === '入罪指标') {
|
|
|
this.score = this.scoreInfo.crimeScore
|
|
|
} else if (data.data['label'] === '出罪指标') {
|
|
|
this.score = this.scoreInfo.crimeOutScore
|
|
|
} else {
|
|
|
this.score = ''
|
|
|
}
|
|
|
this.selectCom = node.component
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.details-content {
|
|
|
height: 100%;
|
|
|
color: #333333;
|
|
|
box-sizing: border-box;
|
|
|
.btn-icon {
|
|
|
padding: 8px 20px;
|
|
|
|
|
|
border-radius: 6px 6px 6px 6px;
|
|
|
border: 1px solid #3763FF;
|
|
|
display: flex;
|
|
|
font-size: 16px;
|
|
|
color: #3763FF;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
margin-right: 24px;
|
|
|
cursor: pointer;
|
|
|
img {
|
|
|
width: 16px;
|
|
|
height: 16px;
|
|
|
margin-right: 8px;
|
|
|
}
|
|
|
}
|
|
|
.info-left {
|
|
|
::v-deep {
|
|
|
.el-descriptions__body {
|
|
|
background: none;
|
|
|
}
|
|
|
.el-tree-node__content {
|
|
|
background: linear-gradient( 90deg, rgba(69, 105, 255, .1) 0%, #FFFFFF 100%);
|
|
|
border-radius: 5px;
|
|
|
height: 35px;
|
|
|
line-height: 35px;
|
|
|
margin-bottom: 10px;
|
|
|
.el-tree-node__expand-icon {
|
|
|
padding: 6px;
|
|
|
}
|
|
|
}
|
|
|
.el-tree-node__children{
|
|
|
margin-left: 10px;
|
|
|
border-left: 1px solid rgba(51, 51, 51, 0.20);
|
|
|
}
|
|
|
.el-tree-node__children .el-tree-node__content {
|
|
|
background: #FFFFFF;
|
|
|
padding-left: 0 !important;
|
|
|
margin-left: 8px;
|
|
|
}
|
|
|
.el-tree-node__children .el-tree-node__content .el-tree-node__expand-icon {
|
|
|
padding: 0;
|
|
|
}
|
|
|
.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
|
|
|
background: #3763FF;
|
|
|
color: white;
|
|
|
}
|
|
|
.el-descriptions-item__label {
|
|
|
font-weight: 400;
|
|
|
font-size: 16px;
|
|
|
color: #666666;
|
|
|
}
|
|
|
.el-descriptions-item__content {
|
|
|
font-weight: 400;
|
|
|
font-size: 16px;
|
|
|
color: #333333;
|
|
|
}
|
|
|
.el-descriptions--small:not(.is-bordered) .el-descriptions-item__cell {
|
|
|
padding-bottom: 16px !important;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.details-header {
|
|
|
padding: 10px;
|
|
|
box-sizing: border-box;
|
|
|
border-radius: 8px;
|
|
|
background: #FFFFFF;
|
|
|
.expand-info {
|
|
|
height: 260px;
|
|
|
align-items: center;
|
|
|
|
|
|
.left-score {
|
|
|
position: relative;
|
|
|
width: 340px;
|
|
|
.model {
|
|
|
width: 200px;
|
|
|
height: 52px;
|
|
|
background: #3763FF;
|
|
|
border-radius: 26px 26px 26px 26px;
|
|
|
text-align: center;
|
|
|
font-size: 18px !important;
|
|
|
color: #FFFFFF;
|
|
|
line-height: 52px;
|
|
|
cursor: pointer;
|
|
|
position: absolute;
|
|
|
top: 180px;
|
|
|
left: 70px;
|
|
|
}
|
|
|
.circle-info {
|
|
|
position: absolute;
|
|
|
width: 220px;
|
|
|
height: 220px;
|
|
|
top: 30px;
|
|
|
left: 60px;
|
|
|
box-shadow: 0 1px 30px 0 rgba(255,169,66,0.2);
|
|
|
border-radius: 50%;
|
|
|
font-size: 12px;
|
|
|
color: #999999;
|
|
|
span {
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
span:nth-child(2) {
|
|
|
font-size: 35px;
|
|
|
font-weight: 700;
|
|
|
}
|
|
|
span:nth-child(3) {
|
|
|
font-size: 13px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
span:nth-last-child(1) {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
.empty-score {
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
font-weight: bold;
|
|
|
font-size: 16px;
|
|
|
// position: relative;
|
|
|
span:nth-child(1) {
|
|
|
margin-top: 0;
|
|
|
}
|
|
|
span:nth-last-child(1) {
|
|
|
font-size: 17px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
.pick-up-info {
|
|
|
height: 50px;
|
|
|
color: #333333;
|
|
|
line-height: 50px;
|
|
|
|
|
|
.model {
|
|
|
width: 112px;
|
|
|
height: 42px;
|
|
|
background: #3763FF;
|
|
|
border-radius: 6px 6px 6px 6px;
|
|
|
text-align: center;
|
|
|
line-height: 42px;font-size: 16px;
|
|
|
color: #FFFFFF;
|
|
|
margin: 0 24px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.left-title {
|
|
|
font-weight: 500;
|
|
|
margin-right: 10px;
|
|
|
span:nth-last-child(1) {
|
|
|
font-weight: 700;
|
|
|
font-size: 20px;
|
|
|
color: #FF9311;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.base-info {
|
|
|
flex: 1;
|
|
|
background: #F5F9FF;
|
|
|
padding: 10px;
|
|
|
box-sizing: border-box;
|
|
|
border-radius: 8px;
|
|
|
position: relative;
|
|
|
// height: 240px;
|
|
|
h4 {
|
|
|
font-weight: bold;
|
|
|
font-size: 18px;
|
|
|
color: #333333;
|
|
|
}
|
|
|
.btn-list {
|
|
|
display: flex;
|
|
|
position: absolute;
|
|
|
right: 48px;
|
|
|
top: 4px;
|
|
|
}
|
|
|
.btns {
|
|
|
padding: 0 20px;
|
|
|
// height: 42px;
|
|
|
// line-height: 42px;
|
|
|
border-radius: 6px 6px 6px 6px;
|
|
|
border: 1px solid #3763FF;
|
|
|
display: flex;
|
|
|
font-size: 16px;
|
|
|
color: #3763FF;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
margin-right: 24px;
|
|
|
height: 38px;
|
|
|
line-height: 38px;
|
|
|
cursor: pointer;
|
|
|
span {
|
|
|
line-height: unset !important;
|
|
|
}
|
|
|
img {
|
|
|
width: 16px;
|
|
|
height: 16px;
|
|
|
margin-right: 8px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.case-summarize {
|
|
|
max-height: 55px;
|
|
|
overflow-y: auto;
|
|
|
overflow-x: hidden;
|
|
|
text-wrap: wrap;
|
|
|
}
|
|
|
.case-lawParty {
|
|
|
width: 250px;
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
}
|
|
|
.details-info {
|
|
|
margin-top: 10px;
|
|
|
box-sizing: border-box;
|
|
|
>div {
|
|
|
height: 100%;
|
|
|
background: #FFFFFF;
|
|
|
padding: 20px;
|
|
|
box-sizing: border-box;
|
|
|
border-radius: 8px;
|
|
|
}
|
|
|
.info-left {
|
|
|
min-width: 245px;
|
|
|
// overflow-y: auto;
|
|
|
// overflow-x: hidden;
|
|
|
}
|
|
|
.info-right {
|
|
|
flex: 1;
|
|
|
margin-left: 10px;
|
|
|
>div {
|
|
|
margin-top: 10px;
|
|
|
height: calc(100% - 10px - 20px);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
::v-deep {
|
|
|
.el-descriptions__body {
|
|
|
background: none;
|
|
|
}
|
|
|
.el-descriptions-item__label {
|
|
|
font-weight: 400;
|
|
|
font-size: 16px;
|
|
|
color: #666666;
|
|
|
}
|
|
|
.el-descriptions-item__content {
|
|
|
font-weight: 400;
|
|
|
font-size: 16px;
|
|
|
color: #333333;
|
|
|
}
|
|
|
.el-descriptions--small:not(.is-bordered) .el-descriptions-item__cell {
|
|
|
padding-bottom: 16px !important;
|
|
|
}
|
|
|
}
|
|
|
</style>
|