zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新研判首页和echarts组件

Browse Source
This commit is contained in:
Esacpe
2025-05-19 15:50:38 +08:00
parent 1fafd27208
commit 6555a6d277
7 changed files with 276 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/views/backOfficeSystem/MeetingRoom/components/detailForm.vue Normal file
View File

@ -0,0 +1,13 @@
<template>
<div>22</div>
</template>
<script>
export default {
}
</script>
<style>
</style>

145
src/views/backOfficeSystem/MeetingRoom/index.vue
View File

@ -1,81 +1,74 @@
<template>
<div>
<div class="titleBox">
<PageTitle title="网上会议室" />
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
</div>
<!-- 表格 -->
<div class="tabBox">
<div class="flexcb">
<div class="btns">
<el-button type="primary">新增</el-button>
<el-button type="danger">删除</el-button>
</div>
<Search :searchArr="searchArrMeet" @submit="onSearch" :key="pageData.keyCount + 1" class="search" />
</div>
<div class="list noScollLine">
<div class="list-item" v-for="(item, index) in pageData.tableData" :key="`tableData${index}`" @onmouseover="">
<div class="top">
<div class="title ellipsis">{{ item.title }}</div>
<div class="info h36 ellipsis2">会商内容：{{ item.hynr }}</div>
<div class="info h36 ellipsis2">关联线索：{{ item.lxxs }}</div>
<div class="info h36 ellipsis2">涉及人员：{{ item.sjry }}</div>
</div>
<div class="mid">
<div class="left">
<div class="title ellipsis">参会人员：{{ item.chry }}</div>
<div class="desc">
<div class="info ellipsis" v-for="(el, i) in item.cqcs" :key="`item${index}`">{{ i + 1 }}.{{ el }}</div>
<!-- <div class="info ellipsis">2.应抓捕赵某，王某XXXXXXXXX王某XXXXXXXXXXXXXXXX等人</div> -->
</div>
</div>
<div class="right">
<el-button type="primary" size="small">加入会议</el-button>
<el-button type="primary" size="small">反馈情况</el-button>
<el-button type="primary" size="small">处置下发</el-button>
</div>
</div>
<div class="bottom">
<el-link type="primary">
<el-icon><ChatDotSquare /></el-icon>
评论</el-link
>
<el-link type="primary"
><el-icon><VideoPlay /></el-icon>会议回放</el-link
>
<el-link type="danger"
><el-icon><Delete /></el-icon>删除</el-link
>
</div>
</div>
</div>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
:pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div>
<!-- 详情 -->
<DetailForm ref="detailDiloag" />
<div class="titleBox">
<PageTitle title="网上会议室" />
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
</div>
<!-- 表格 -->
<div class="tabBox">
<div class="flexcb">
<div class="btns">
<el-button type="primary">新增</el-button>
<el-button type="danger">删除</el-button>
</div>
<Search :searchArr="searchArrMeet" @submit="onSearch" :key="pageData.keyCount + 1" class="search" />
</div>
<div class="list noScollLine">
<div class="list-item" v-for="(item, index) in pageData.tableData" :key="`tableData${index}`" @onmouseover="">
<div class="top">
<div class="title ellipsis">{{ item.title }}</div>
<div class="info h20 ellipsis">会商内容：{{ item.hynr }}</div>
<div class="info h20 ellipsis">关联线索：{{ item.lxxs }}</div>
<div class="info h20 ellipsis">涉及人员：{{ item.sjry }}</div>
<div class="info h20 ellipsis">会商处置意见：xxxxxxx线索</div>
</div>
<div class="mid">
<div class="left">
<div class="title ellipsis">参会人员：{{ item.chry }}</div>
<div class="desc">
<div class="info ellipsis" v-for="(el, i) in item.cqcs" :key="i">{{ i + 1 }}.{{ el }}</div>
<!-- <div class="info ellipsis">2.应抓捕赵某，王某XXXXXXXXX王某XXXXXXXXXXXXXXXX等人</div> -->
</div>
</div>
<div class="right">
<el-button type="primary" size="small">加入会议</el-button>
<el-button type="primary" size="small">反馈情况</el-button>
<el-button type="primary" size="small">处置下发</el-button>
</div>
</div>
<div class="bottom">
<el-link type="primary"><el-icon><ChatDotSquare /></el-icon>评论</el-link>
<el-link type="primary"><el-icon><VideoPlay /></el-icon>会议回放</el-link>
<el-link type="primary"><el-icon><Edit /></el-icon>详情</el-link>
<el-link type="danger"><el-icon><Delete /></el-icon>删除</el-link>
</div>
</div>
</div>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
:pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div>
<!-- 详情 -->
<DetailForm ref="detailDiloag" />
</template>
<script setup>
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
// import DetailForm from "./components/detailForm.vue";
import DetailForm from "./components/detailForm.vue";
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
@ -220,12 +213,6 @@
tabHeightFn();
});
//选择类型
const handleType = val => {
pageData.keyCount++;
pageData.pageConfiger.pageCurrent = 1;
getList();
};
// 搜索
const onSearch = val => {
queryFrom.value = { ...val };
@ -256,7 +243,7 @@
// 详情
const addEdit = (type, row) => {
detailDiloag.value.init(type, row);
// detailDiloag.value.init(type, row);
};
// 表格高度计算
@ -295,7 +282,7 @@
.list-item {
display: inline-block;
border: 1px solid #ccc;
height: 280px;
height: 254px;
width: 380px;
box-sizing: border-box;
border-radius: 5px;
@ -315,8 +302,6 @@
color: black;
font-size: 14px;
font-weight: 700;
// height: 24px;
// line-height: 24px;
margin-bottom: 5px;
}
.info {

149
src/views/backOfficeSystem/ResearchJudgment/ResearchHome/index.vue Normal file
View File

@ -0,0 +1,149 @@
<template>
<div class="yp—home flex">
<div class="leftbox">
<div class="title">
<span v-for="idx in 3" :key="idx" :class="'sircleL'+idx" class="sircle mr5"></span>
<span class="ml10 mr10">专题统计</span>
<span v-for="idx in 3" :key="idx" :class="'sircleR'+idx" class="sircle ml5"></span>
</div>
<div class="commCnt">
<div class="hh50">
<div class="comm-title">处置统计</div>
<div class="echartsBox">
<MoreBarEcharts echartsId="cztjEcharts" :data="obj.data_cztj"></MoreBarEcharts>
</div>
</div>
<div class="hh50">
<div class="comm-title">会商统计</div>
<div class="echartsBox">
<LineEcharts echartsId="hstjEcharts" :data="obj.data_hstj"></LineEcharts>
</div>
</div>
</div>
</div>
<div class="rightbox">
<div class="title">
<span v-for="idx in 3" :key="idx" :class="'sircleL'+idx" class="sircle mr5"></span>
<span class="ml10 mr10">研判统计</span>
<span v-for="idx in 3" :key="idx" :class="'sircleR'+idx" class="sircle ml5"></span>
</div>
<div class="commCnt"></div>
</div>
</div>
</template>
<script setup>
import MoreBarEcharts from "@/views/home/echarts/moreBarEcharts.vue";
import LineEcharts from "@/views/home/echarts/moreLineEcharts.vue";
import { reactive } from 'vue';
const obj = reactive({
data_cztj:{
xData:['上访','诈骗','敲诈勒索','盗窃','涉黄','涉毒','强奸猥亵','灾害事故','自杀'],
color:[['#0DBAC5','#28EEBF'],['#F06C0D','#EEB416']],
labelColor:'#000',
list:[
{label:'总数',val:[30,20,10,60,50,60,35,45,20]},
{label:'未办结',val:[40,30,20,50,30,44,50,45,62]},
]
},
data_hstj:{
xData:['上访','诈骗','敲诈勒索','盗窃','涉黄','涉毒','强奸猥亵','灾害事故','自杀'],
color:['#0386FB','#00FFFF'],
labelColor:'#000',
list:[
{label:'总数',val:[30,20,10,60,50,60,35,45,20]},
{label:'已会商',val:[40,30,20,50,30,44,50,45,62]},
]
}
})
</script>
<style lang="scss" scoped>
.yp—home{
width: 100%;
height: 100%;
padding-top: 15px;
box-sizing: border-box;
color: #000;
.leftbox{
width:500px;
height: 100%;
margin-right: 10px;
background: #fff;
}
.rightbox{
flex: 1 0 0;
background: #fff;
}
}
@mixin common($width: 16px,$opacity:1){
height: $width;
width: $width;
border-radius: 50%;
background: #0386FB;
opacity: $opacity;
}
// 共同
.title{
display: flex;
align-items: center;
justify-content: center;
height: 60px;
font-size: 24px;
.sircle{
display: inline-block;
}
.sircleL1{
@include common(8px,0.5);
}
.sircleL2{
@include common(12px,0.75);
}
.sircleL3{
@include common(16px);
}
.sircleR1{
@include common(16px);
}
.sircleR2{
@include common(12px,0.75);
}
.sircleR3{
@include common(8px,0.5);
}
}
.commCnt{
height: calc(100% - 60px);
overflow: hidden;
overflow-y: auto;
padding: 10px 20px;
box-sizing: border-box;
.comm-title{
position: relative;
font-size: 20px;
&::before{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 78px;
height: 4px;
background: linear-gradient( 90deg, #3596F9 0%, rgba(53,150,249,0) 100%);
border-radius: 4px 4px 4px 4px;
}
}
.echartsBox{
height: calc(100% - 30px);
margin-top: 4px;
}
}
</style>