lcw
This commit is contained in:
@ -3,7 +3,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
<MyTable customClass="zdy_peo_table" :tableData="pageData.tableData" :tableColumn="pageData.tableColumn"
|
||||
:tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger"
|
||||
:controlsWidth="pageData.controlsWidth">
|
||||
:controlsWidth="pageData.controlsWidth" @handleCellClick="clickTag">
|
||||
<template #qblx="{ row }">
|
||||
<DictTag :tag="false" :value="row.qblx" :options="D_GS_XS_LX" />
|
||||
</template>
|
||||
@ -30,12 +30,14 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<Xq v-model:modelValue="xqDialog" :dict="dict" :dataList="dataList" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Xq from "./xq.vue";
|
||||
import { qbcjSelectPage } from "@/api/Intelligence.js";
|
||||
import {xxcjSelectPage,xxcjXxzsx} from '@/api/xxcj.js'
|
||||
import { ref, reactive, getCurrentInstance, watch } from "vue";
|
||||
@ -67,7 +69,8 @@ const searchConfiger = ref([
|
||||
placeholder: "请选择上报来源",
|
||||
showType: "select",
|
||||
options: D_BZ_QBSBLY
|
||||
}, {
|
||||
},
|
||||
{
|
||||
label: "上报时间",
|
||||
prop: "startTime",
|
||||
placeholder: "请选择时间",
|
||||
@ -99,10 +102,10 @@ const pageData = reactive({
|
||||
{ label: "上报人姓名", prop: "xssbr" },
|
||||
{ label: "情报编号", prop: "xsBh" },
|
||||
{ label: "情报标题", prop: "qbmc" },
|
||||
{ label: "情报类型", prop: "qblx", showSolt: true },
|
||||
{ label: "情报来源", prop: "qbly", showSolt: true },
|
||||
{ label: "情报上报时间", prop: "sxsbsj" },
|
||||
{ label: "指向地点", prop: "zxdz" },
|
||||
// { label: "情报类型", prop: "qblx", showSolt: true },
|
||||
// { label: "情报来源", prop: "qbly", showSolt: true },
|
||||
{ label: "情报上报时间", prop: "sxsbsj" ,watch:'300'},
|
||||
// { label: "指向地点", prop: "zxdz" },
|
||||
{ label: "情报内容", prop: "qbnr" },
|
||||
],
|
||||
tableHeight: "50vh",
|
||||
@ -150,6 +153,17 @@ const changeSize = (val) => {
|
||||
pageData.pageConfiger.pageSize = val;
|
||||
changePage()
|
||||
}
|
||||
|
||||
const xqDialog = ref(false)
|
||||
const dataList = ref({})
|
||||
const clickTag = (row) => {
|
||||
if (row.column.property == 'qbmc' || row.column.property == 'xsBh') {
|
||||
xqDialog.value = true;
|
||||
dataList.value = row.row;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
560
src/views/home/model/mesgSwitch/xq.vue
Normal file
560
src/views/home/model/mesgSwitch/xq.vue
Normal file
@ -0,0 +1,560 @@
|
||||
<template>
|
||||
<el-dialog :model-value="modelValue" title="情报详情" width="70%" @close="closeDialog" destroy-on-close>
|
||||
<div style="height: 60vh;overflow: auto; ">
|
||||
<div class="form-container">
|
||||
<div class="form-content">
|
||||
<!-- <div class="form_cnt"> -->
|
||||
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" ref="elform" >
|
||||
<template #jbxx>
|
||||
<div>
|
||||
<h3 class="tags-title">报送情况</h3>
|
||||
<div style="display: flex;justify-content:space-between;width: 200%;">
|
||||
<div>录入人:{{ userName }}</div>
|
||||
<div>录入单位:{{ userInfo.deptName }}</div>
|
||||
<div>本年度报送信息量:{{ tjcll.cnl || 0 }}</div>
|
||||
<div>采纳量:{{ tjcll.sbsl || 0 }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #shzt>
|
||||
<div v-if="disabled">
|
||||
<h3 class="tags-title">审核状态</h3>
|
||||
<div style="display: flex;justify-content:space-between;width: 200%;">
|
||||
<div style="display: flex;">
|
||||
市审核状态:
|
||||
<DictTag v-model:value="listQuery.sldshzt" :options="dict.D_BZ_SSSHZT" :tag="false" />
|
||||
</div>
|
||||
<div style="display: flex;">
|
||||
县审核状态:
|
||||
<DictTag v-model:value="listQuery.xldshzt" :options="dict.D_BZ_SSSHZT" :tag="false" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</FormMessage>
|
||||
<!-- </div> -->
|
||||
<div class="tags-section" v-if="disabled">
|
||||
<h3 class="tags-title">关注部门</h3>
|
||||
<div class="tags-container">
|
||||
<div v-for="(tag, index) in listQuery.gzbmList" :key="tag.id || index" class="tag-item">
|
||||
<div class="tag-content">
|
||||
{{ tag.ssbm }}
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="!listQuery.gzbmList || listQuery.gzbmList.length === 0" class="no-tags">
|
||||
暂无标签
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-section" v-if="disabled">
|
||||
<h3 class="tags-title">关联标签</h3>
|
||||
<div class="tags-container">
|
||||
<div v-for="(tag, index) in listQuery.glbqList" :key="tag.id || index" class="tag-item">
|
||||
<div class="tag-content">
|
||||
{{ tag.bqmc }}
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="!listQuery.glbqList || listQuery.glbqList.length === 0" class="no-tags">
|
||||
暂无标签
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-section" v-if="disabled">
|
||||
<h3 class="tags-title">续报信息</h3>
|
||||
<div class="list-container">
|
||||
<div v-for="(item, index) in dataList.xb" :key="item.id || index" class="list-item">
|
||||
<div class="list-content">
|
||||
{{ item.bcnr }}
|
||||
</div>
|
||||
<div class="tag-actions">
|
||||
<el-icon class="action-icon edit-icon" :size="32" @click="openPursue('续报信息', item)">
|
||||
<EditPen />
|
||||
</el-icon>
|
||||
<el-icon class="action-icon delete-icon" :size="32" @click="handleDeleteTag(item)">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="!dataList.xb || dataList.xb.length === 0" class="no-tags">
|
||||
暂无续报信息
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-section" v-if="disabled">
|
||||
<h3 class="tags-title">补充信息</h3>
|
||||
<div class="list-container">
|
||||
<div v-for="(item, index) in dataList.bc" :key="item.id || index" class="list-item">
|
||||
<div class="list-content">
|
||||
{{ item.bcnr }}
|
||||
</div>
|
||||
<div class="tag-actions">
|
||||
<el-icon class="action-icon edit-icon" :size="32" @click="openPursue('信息追加', item)">
|
||||
<EditPen />
|
||||
</el-icon>
|
||||
<el-icon class="action-icon delete-icon" :size="32" @click="handleDeleteTag(item)">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="!dataList.bc || dataList.bc.length === 0" class="no-tags">
|
||||
暂无补充信息
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ml50 mr50 timeline-container" v-if="disabled">
|
||||
<div class="timeline-title">信息流程展示</div>
|
||||
<el-timeline class="timeline-full-width">
|
||||
<el-timeline-item :timestamp="item.czsj" placement="top" v-for="(item, index) in lcList" :key="index">
|
||||
<el-card class="process-card">
|
||||
<div class="process-info">
|
||||
<div class="info-label">处置人:</div>
|
||||
<div class="info-value">{{ item.czrxm || '未记录' }}</div>
|
||||
</div>
|
||||
<div class="process-info">
|
||||
<div class="info-label">处置结果:</div>
|
||||
<div class="info-value">
|
||||
<DictTag :tag="false" :value="item.czzt" :options="D_BZ_LCZT" />
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<MOSTY.Empty :show="lcList.length == 0" :imgSize="100"></MOSTY.Empty>
|
||||
</div>
|
||||
</div></div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closeDialog">取消</el-button>
|
||||
<el-button type="primary" @click="closeDialog">确认 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</el-dialog>
|
||||
<pursueContent v-model="pursueShow" :dataList="dataVals" :title="processtitle" :updeteBool="true" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||
|
||||
import { xxcjAddEntity, xxcjUpdateEntity, xxcjSelectByid, xxcjSelectCzlcList, xxcjSelectListBc, xxcjDeletesBc, addEntity, xxcjTjcll, xxcjXxzhs } from "@/api/xxcj.js"
|
||||
import { ref, reactive, getCurrentInstance, watch } from "vue";
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import pursueContent from "@/views/backOfficeSystem/HumanIntelligence/components/pursueContent.vue";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { getItem } from '@//utils/storage.js'
|
||||
const router = useRouter()
|
||||
const { proxy } = getCurrentInstance()
|
||||
const { D_BZ_LCZT} = proxy.$dict("D_BZ_LCZT")
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
dict: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}, dataList: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:modelValue'])
|
||||
const closeDialog = () => {
|
||||
emit('update:modelValue', false)
|
||||
}
|
||||
//
|
||||
|
||||
const disabled = true
|
||||
const listQuery = ref({})
|
||||
const userInfo = ref({})
|
||||
const userName = ref('')
|
||||
const formData = ref([
|
||||
{ label: "情报标题", prop: "qbmc", type: "input", width: '45%' },
|
||||
{ label: "情报内容", prop: "qbnr", type: "textarea", width: '100%', rows: 10 },
|
||||
{ label: "附件上传", prop: "fjdz", type: "upload", width: '100%', isImg: false },
|
||||
{ label: "", prop: "jbxx", type: "slot", width: '100%', },
|
||||
{ label: "", prop: "shzt", type: "slot", width: '100%' },
|
||||
])
|
||||
// 根据id查询详情
|
||||
const getDataById = (id) => {
|
||||
xxcjSelectByid({ id }).then((res) => {
|
||||
listQuery.value = res;
|
||||
listQuery.value.fjdz = res.fjdz ? res.fjdz?.split(",") : []
|
||||
});
|
||||
};
|
||||
watch(() => props.modelValue, (newVal, oldVal) => {
|
||||
if (newVal) {
|
||||
userInfo.value = getItem('deptId') ? getItem('deptId')[0] : {}
|
||||
userName.value = getItem('USERNAME')
|
||||
getDataById(props.dataList.id)
|
||||
getqbcjPldb(props.dataList.id)
|
||||
getXxcjTjcll()
|
||||
}
|
||||
})
|
||||
// 流程
|
||||
const lcList = ref([])
|
||||
const getqbcjPldb = (id) => {
|
||||
xxcjSelectCzlcList({ qbid: id }).then(res => {
|
||||
lcList.value = res || []
|
||||
})
|
||||
.catch(() => {
|
||||
})
|
||||
}
|
||||
// 统计
|
||||
const tjcll = ref({})
|
||||
const getXxcjTjcll = () => {
|
||||
xxcjTjcll({}).then(res => {
|
||||
tjcll.value = res
|
||||
}).catch(error => {
|
||||
console.error('请求失败:', error)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
|
||||
::v-deep .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
|
||||
color: #0072ff;
|
||||
background: rgba(0, 114, 255, 0.3);
|
||||
}
|
||||
|
||||
.boxlist {
|
||||
width: 99%;
|
||||
height: 225px;
|
||||
margin-top: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
::v-deep .avatar-uploader {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
::v-deep .el-upload-list {
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
::v-deep .el-upload-list__item-name .el-icon {
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
.form_cnt {
|
||||
// width: 75%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.person {
|
||||
padding-left: 20px;
|
||||
width: 25%;
|
||||
// height: 100vh;
|
||||
}
|
||||
|
||||
/* 补充信息样式 */
|
||||
.supplement-title {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin: 16px 0 10px 0;
|
||||
padding-left: 5px;
|
||||
border-left: 3px solid #24b6dd;
|
||||
}
|
||||
|
||||
.supplement-list {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.supplement-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 8px 12px;
|
||||
background-color: #f5f7fa;
|
||||
border: 1px solid #e4e7ed;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
margin-right: 10px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.supplement-item:hover {
|
||||
background-color: #ecf5ff;
|
||||
border-color: #c6e2ff;
|
||||
}
|
||||
|
||||
.supplement-content {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.supplement-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.action-icon {
|
||||
// font-size: 24px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.edit-icon {
|
||||
color: #24b6dd;
|
||||
}
|
||||
|
||||
.edit-icon:hover {
|
||||
color: #409eff;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.delete-icon {
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.delete-icon:hover {
|
||||
color: #f78989;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
/* 时间线标题样式 */
|
||||
.timeline-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
padding: 12px 16px;
|
||||
margin-bottom: 10px;
|
||||
background-color: #f5f7fa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
|
||||
/* 时间线样式优化 */
|
||||
.el-timeline {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* 处置流程卡片样式 */
|
||||
.process-card {
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.08);
|
||||
transition: all 0.3s ease;
|
||||
margin-bottom: 16px;
|
||||
border-left: 3px solid #409EFF;
|
||||
}
|
||||
|
||||
.process-card:hover {
|
||||
box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.12);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
/* 卡片内部信息样式 */
|
||||
.process-info {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 12px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.process-info:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #409EFF;
|
||||
margin-right: 8px;
|
||||
min-width: 65px;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 1.6;
|
||||
flex: 1;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
/* 时间戳样式 */
|
||||
.el-timeline-item__timestamp {
|
||||
font-size: 13px;
|
||||
color: #909399;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
/* 时间线节点样式 */
|
||||
.el-timeline-item__node {
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
/* 容器类样式 */
|
||||
.form-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
// display: flex;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.timeline-container {
|
||||
border: 1px solid #ebeef5;
|
||||
flex: 1;
|
||||
margin: 0 10px;
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* 时间线宽度 */
|
||||
.timeline-full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 标签区域样式 */
|
||||
.tags-section {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* 标签标题样式 */
|
||||
.tags-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 8px;
|
||||
padding-left: 5px;
|
||||
border-left: 3px solid #409EFF;
|
||||
}
|
||||
|
||||
/* 标签容器样式 */
|
||||
.tags-container {
|
||||
padding: 12px;
|
||||
background-color: #f5f7fa;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 标签项目样式 */
|
||||
.tag-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 6px 10px;
|
||||
background-color: #ecf5ff;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #d9ecff;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/* 标签项目悬停效果 */
|
||||
.tag-item:hover {
|
||||
background-color: #e6f7ff;
|
||||
border-color: #91d5ff;
|
||||
box-shadow: 0 2px 8px rgba(0, 123, 255, 0.15);
|
||||
}
|
||||
|
||||
/* 标签内容样式 */
|
||||
.tag-content {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: #303133;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 标签操作按钮样式 */
|
||||
.tag-actions {
|
||||
display: flex;
|
||||
// align-items: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
/* 操作图标样式 */
|
||||
.action-icon {
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
padding: 6px 8px;
|
||||
border-radius: 4px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 编辑图标样式 */
|
||||
.edit-icon {
|
||||
color: #409EFF;
|
||||
background-color: #ecf5ff;
|
||||
}
|
||||
|
||||
.edit-icon:hover {
|
||||
color: #66B1FF;
|
||||
background-color: #e6f7ff;
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 2px 4px rgba(64, 158, 255, 0.2);
|
||||
}
|
||||
|
||||
/* 列表容器样式 */
|
||||
.list-container {
|
||||
padding: 12px;
|
||||
background-color: #f5f7fa;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* 列表项样式 */
|
||||
.list-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 12px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
border: 1px solid #e4e7ed;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/* 列表项悬停效果 */
|
||||
.list-item:hover {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #dcdfe6;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
/* 列表内容样式 */
|
||||
.list-content {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: #303133;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 删除图标样式 */
|
||||
.delete-icon {
|
||||
color: #F56C6C;
|
||||
background-color: #fef0f0;
|
||||
}
|
||||
|
||||
.delete-icon:hover {
|
||||
color: #F78989;
|
||||
background-color: #fde2e2;
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 2px 4px rgba(245, 108, 108, 0.2);
|
||||
}
|
||||
|
||||
/* 无标签提示样式 */
|
||||
.no-tags {
|
||||
color: #909399;
|
||||
font-size: 14px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -199,7 +199,7 @@ onUnmounted(() => {
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
margin-left: 20px;
|
||||
margin-left: 45%;
|
||||
color: rgb(255, 146, 4);
|
||||
font-family: 'YSBTH';
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user