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

网上会议

Browse Source
This commit is contained in:
wangjie
2025-04-23 17:56:15 +08:00
parent 94f20163f0
commit d027f87351
2 changed files with 723 additions and 391 deletions
Download Patch File Download Diff File Expand all files Collapse all files

326
src/views/backOfficeSystem/MeetingRoom/index.vue Normal file
View File

@ -0,0 +1,326 @@
<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="btns">
<el-button type="primary">新增</el-button>
<el-button type="danger">新增</el-button>
</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-link>
<el-link type="primary">会议回放</el-link>
<el-link type="danger">删除</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>
</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 { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const detailDiloag = ref();
const searchBox = ref(); //搜索框
const searchConfiger = ref([
{
label: "会议主题",
prop: "businessNo",
placeholder: "请输入会议主题",
showType: "input"
},
{
label: "关联线索",
prop: "goodsName",
placeholder: "请选择关联线索",
showType: "select"
},
{
label: "涉及人员",
prop: "businessNo",
placeholder: "请输入涉及人员",
showType: "input"
},
{
label: "会议内容",
prop: "businessNo",
placeholder: "请输入会议内容",
showType: "input"
}
]);
const queryFrom = ref({});
const pageData = reactive({
tableData: [
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
},
{
title: "林芝市XX地区发生的重大案件处理",
hynr: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
lxxs: "XX王某XXXXXXXXXXXXX王某XXXXXXXXXXXXXXXXXXXXXXX",
sjry: "王某、赵某、.....",
chry: "王某、赵某、赵某赵某赵某.....",
cqcs: ["应抓捕XXXXXXXXXXcccccccccc", "应抓捕XXXXXXXXXXcccccccccc"]
}
],
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null",
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
},
controlsWidth: 120
});
onMounted(() => {
getList();
tabHeightFn();
});
//选择类型
const handleType = val => {
pageData.keyCount++;
pageData.pageConfiger.pageCurrent = 1;
getList();
};
// 搜索
const onSearch = val => {
queryFrom.value = { ...val };
pageData.pageConfiger.pageCurrent = 1;
getList();
};
const changeNo = val => {
pageData.pageConfiger.pageNum = val;
getList();
};
const changeSize = val => {
pageData.pageConfiger.pageSize = val;
getList();
};
// 获取列表
const getList = val => {
// pageData.tableConfiger.loading = true;
let data = { ...pageData.pageConfiger, ...queryFrom.value };
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
// qcckPost(data,url).then(res=>{
// pageData.tableData = res.records || [];
// pageData.total = res.total;
// pageData.tableConfiger.loading = false;
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
};
// 详情
const addEdit = (type, row) => {
detailDiloag.value.init(type, row);
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
window.onresize = function () {
tabHeightFn();
};
};
</script>
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
.btns {
padding: 10px 20px;
}
.list {
height: calc(100% - 62px);
gap: 10px;
margin: 0 15px;
overflow: auto;
.list-item {
display: inline-block;
border: 1px solid #ccc;
height: 280px;
width: 380px;
box-sizing: border-box;
border-radius: 5px;
padding: 10px;
margin: 10px 5px;
&:hover {
border-color: rgb(124, 195, 253);
background-color: rgba(190, 233, 255, 0.582);
}
&:hover .mid {
border-color: rgb(124, 195, 253);
}
&:hover .desc {
background-color: rgb(190, 233, 255);
}
.title {
color: black;
font-size: 14px;
font-weight: 700;
// height: 24px;
// line-height: 24px;
margin-bottom: 5px;
}
.info {
color: #a5a1a1;
font-size: 12px;
line-height: 1.5;
}
.desc {
margin-top: 5px;
background-color: rgb(242, 242, 242);
width: 260px;
height: calc(100% - 25px);
padding: 10px;
}
.mid {
border: 1px dashed rgb(124, 195, 253);
border-left: 0;
border-right: 0;
padding: 10px 0;
display: flex;
justify-content: space-between;
.right {
width: 80px;
.el-button + .el-button {
margin-left: 0;
margin-top: 5px;
}
}
}
.bottom {
display: flex;
justify-content: flex-end;
}
}
}
</style>