This commit is contained in:
2026-02-03 18:00:05 +08:00
parent da05ca015e
commit 7d61f83463
4 changed files with 231 additions and 26 deletions

View File

@ -0,0 +1,178 @@
<template>
<div class="inforReport">
<el-dialog :close-on-click-modal="false" @close="visible = false" title="信息上报" v-model="visible" width="50%" top="5vh">
<div class="cntBox">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editorRef"
:defaultConfig="toolbarConfig"
:mode="mode"
/>
<Editor
style="height: 67vh; overflow-y: hidden;"
v-model="valueHtml"
:defaultConfig="editorConfig"
:mode="mode"
@onCreated="handleCreated"
@onChange="handChange"
/>
</div>
<div class="tc mt10">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="downloadWithStyles">下载</el-button>
</div>
</el-dialog>
</div>
</template>
<script setup>
import { timeValidate } from '@/utils/tools'
import { getItem } from "@/utils/storage";
import "@wangeditor/editor/dist/css/style.css";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import { ref, shallowRef, computed, onBeforeUnmount, onMounted, watch } from "vue";
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
data: {
type: Array,
default: () => []
}
})
const baseInfo = {
ssbm:getItem('deptId') ? getItem("deptId")[0].deptName : '',
time:timeValidate(null,'ymd')
}
const emit = defineEmits(['update:modelValue'])
const visible = computed({
get: () => props.modelValue,
set: (val) => emit('update:modelValue', val)
})
// 编辑器实例,必须用 shallowRef
const editorRef = shallowRef()
// 内容 HTML
const valueHtml = ref('')
const mode = 'default'
const toolbarConfig = {}
const editorConfig = { placeholder: '请输入内容...' }
// 带样式的下载方法
const downloadWithStyles = () => {
const wordDocument = `
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>富文本导出</title>
<style>
/* 应用两端对齐样式 */
body {
text-align: justify;
text-justify: inter-character; /* 中文文本两端对齐 */
font-family: "Microsoft YaHei", Arial, sans-serif;
}
p {
text-align: justify;
text-justify: inter-character;
}
.w-e-text-container [data-slate-editor] .table-container{
border: none !important;
border-bottom: 1px solid #ccc !important;
padding: 10px 10px 0px !important;
border-radius: 0 !important;
}
.w-e-text-container [data-slate-editor] table td, .w-e-text-container [data-slate-editor] table th{
border: none !important;
}
</style>
</head>
<body>
${valueHtml.value}
</body>
</html>
`;
const blob = new Blob([wordDocument], {
type: 'application/msword'
});
saveAs(blob, '情报信息报告.doc');
};
function handleHtml (val){
let html = `<h1 style="text-align: center; font-size: 32px; font-weight: bold; font-family: 'Songti SC', 'SimSun', serif; margin-bottom: 20px;">
<span style="color: rgb(225, 60, 57);">林芝公安情报信息</span>
</h1>
<table style="width: 100%; border-bottom: 1px solid black; margin-bottom: 30px; font-family: 'FangSong', serif; font-size: 16px; border-collapse: collapse;">
<tr >
<td style="text-align: left; padding-bottom: 10px; border: none;">单位:${baseInfo.ssbm}</td>
<td style="text-align: right; padding-bottom: 10px; border: none;">时间:${baseInfo.time}</td>
</tr>
</table><h2 style="text-align: center;"></h2>
<h2 style="text-align: center; font-size: 24px; font-family: 'SimHei', sans-serif; margin-bottom: 20px;">关于对 XXXX 事件的综合研判</h2>
<p style="text-indent: 2em; line-height: 2; font-family: 'FangSong', serif; font-size: 18px;">近日,${baseInfo.ssbm}(单位)接报 ${val.length} 起关于 XXXXXX 事件的情报信息,合并研判如下:</p>
<h3 style="font-size: 20px; font-weight: bold; margin-top: 20px; margin-bottom: 10px; font-family: 'SimHei', sans-serif;">一、事件概况</h3>`
val.forEach((item,index)=>{
html+=`<p style="text-indent: 2em; line-height: 2; font-family: 'FangSong', serif; font-size: 18px;">事件 ${index+1}${item.qbmc}${item.xsBh}</p>`
})
html+=`<h3 style="font-size: 20px; font-weight: bold; margin-top: 20px; margin-bottom: 10px; font-family: 'SimHei', sans-serif;">二、事件分析</h3>
<p style="text-indent: 2em; line-height: 2; font-family: 'FangSong', serif; font-size: 18px;">对事件的性质、事件的发展,指向性、危害性、可控性等进行分析。</p>
<h3 style="font-size: 20px; font-weight: bold; margin-top: 20px; margin-bottom: 10px; font-family: 'SimHei', sans-serif;">三、工作指引</h3>
<p style="text-indent: 2em; line-height: 2; font-family: 'FangSong', serif; font-size: 18px;">根据分析内容,针对性提出一些对策建议。</p>
`
valueHtml.value = html
}
watch(()=>props.data,val=>{
handleHtml(val)
},{immediate:true,deep:true})
// 组件销毁时,也及时销毁编辑器
onBeforeUnmount(() => {
const editor = editorRef.value
if (editor == null) return
editor.destroy()
})
const handleCreated = (editor) => {
editorRef.value = editor // 记录 editor 实例,重要!
}
//内容发生变化
const handChange = (editor) => {
// 判断是否是一个空段落,是空就传空文本
console.log(editor.getHtml(), 'editor.getHtml()');
};
</script>
<style lang="scss" scoped>
.cntBox {
width: 100%;
border: 1px solid #ccc;
margin: 0 auto;
}
</style>
<style lang="scss">
.inforReport{
.w-e-text-container [data-slate-editor] .table-container{
border: none !important;
border-bottom: 1px solid #ccc !important;
padding: 10px 10px 0px !important;
border-radius: 0 !important;
}
.w-e-text-container [data-slate-editor] table td, .w-e-text-container [data-slate-editor] table th{
border: none !important;
}
}
</style>

View File

@ -31,7 +31,7 @@
</el-icon>
<span class="vertical-middle">删除</span>
</el-button>
<el-button type="primary" size="small">
<el-button type="primary" size="small" @click="handleReport">
<el-icon class="vertical-middle"><Edit /></el-icon>
<span class="vertical-middle">情报信息报告</span>
</el-button>
@ -113,21 +113,56 @@
<!-- 新增 -->
<AddForm ref="detailDiloag" @getList="getList" :titleData="titleData" :dict="{ D_BZ_LCZT, D_BZ_SSSHZT }" />
</div>
<ExportFile v-model="exportFileModel" :tableColumn="tableColumn" :dict="{ D_GS_XS_LY, D_GS_XS_LX, D_GS_XS_LX }"
:dataModel="pageData.tableData" />
<MakeTag v-model="chooseRow" :dataList="dataList" :dict="{ D_BZ_CJLX, D_BZ_QBCZZT, D_GS_XS_LX, D_BZ_BQJB }"
@getList="getList" />
<Fszl v-model="fszlShow" path="/xxcj/sendFqzl" :itemData="dataList" />
<CustomTag v-model="customTagShow" :dataList="dataList" @getList="getList" :dict="{ D_XXCJ_BQLX }" />
<Configuration v-model="configurationShow" :dataList="dataList" @getList="getList" />
<ExportFile
v-model="exportFileModel"
:tableColumn="tableColumn"
:dict="{ D_GS_XS_LY, D_GS_XS_LX, D_GS_XS_LX }"
:dataModel="pageData.tableData"
/>
<MakeTag
v-model="chooseRow"
:dataList="dataList"
:dict="{ D_BZ_CJLX, D_BZ_QBCZZT, D_GS_XS_LX, D_BZ_BQJB }"
@getList="getList"
/>
<Fszl
v-model="fszlShow"
path="/xxcj/sendFqzl"
:itemData="dataList"
/>
<CustomTag
v-model="customTagShow"
:dataList="dataList"
@getList="getList"
:dict="{ D_XXCJ_BQLX }"
/>
<Configuration
v-model="configurationShow"
:dataList="dataList"
@getList="getList"
/>
<!-- 转会商 -->
<transferMerchant v-if="isShowTransferMerchantTc" :row="currRow" ref="transferMerchantRef" title="转会商"
@close="isShowTransferMerchantTc = false" @ok="getList" />
<transferMerchant
v-if="isShowTransferMerchantTc"
:row="currRow"
ref="transferMerchantRef"
title="转会商"
@close="isShowTransferMerchantTc = false"
@ok="getList"
/>
<!-- 情报信息报告 -->
<InforReport v-if="inforReportShow" v-model="inforReportShow" :data="tableList" />
</template>
<script setup>
import InforReport from './components/inforReport.vue'
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
@ -147,16 +182,16 @@ import Configuration from '../components/configuration.vue'
import transferMerchant from "./components/transferMerchant.vue";
import { isShiQingZhi } from "@/utils/auth.js"
import { Edit } from "@element-plus/icons";
const { proxy } = getCurrentInstance();
const { D_GS_XS_LY, D_BZ_SSSHZT, D_BZ_SSZT, D_BZ_SF, D_GS_XS_LX, D_BZ_BQJB,
D_GS_XS_QTLX, D_GS_ZDQT_LB,
D_BZ_BMJB, D_BZ_CLPP, D_BZ_CLYS, D_BZ_CLLX, D_BZ_XZQHDM, D_BZ_QBCZZT, D_BZ_CJLX, D_BZ_LCZT,
D_XXCJ_BQLX } =
proxy.$dict("D_BZ_BMJB", "D_GS_XS_LY", 'D_BZ_SSSHZT',
"D_BZ_SSZT", "D_BZ_SF", "D_GS_XS_LX", "D_GS_XS_QTLX",
"D_GS_ZDQT_LB", "D_BZ_CLPP", "D_BZ_CLYS", "D_BZ_CLLX", "D_BZ_XZQHDM", "D_BZ_QBCZZT", "D_BZ_CJLX", "D_BZ_BQJB", "D_BZ_LCZT", "D_XXCJ_BQLX"); //获取字典数据
"D_BZ_SSZT", "D_BZ_SF", "D_GS_XS_LX", "D_GS_XS_QTLX",
"D_GS_ZDQT_LB", "D_BZ_CLPP", "D_BZ_CLYS", "D_BZ_CLLX", "D_BZ_XZQHDM", "D_BZ_QBCZZT", "D_BZ_CJLX", "D_BZ_BQJB", "D_BZ_LCZT", "D_XXCJ_BQLX"); //获取字典数据
const detailDiloag = ref();
const inforReportShow = ref(false) //情报信息报告
const searchBox = ref(); //搜索框
const ids = ref([])
const tableList = ref([]);
@ -166,8 +201,6 @@ const chooseData = (val) => {
})
tableList.value = val
}
/** 市情指 */
const cityIntelligenceCommand = isShiQingZhi()
const currRow = ref({})
const transferMerchantRef = ref()
const isShowTransferMerchantTc = ref(false)
@ -226,10 +259,11 @@ const cnMsg = (item) => {
})
}).catch(() => { });
// }
}
const handleReport = () => {
if(tableList.value.length == 0) return proxy.$message({ type: "warning", message: "请选择情报信息" });
inforReportShow.value = true
}
// 回退
const rollbackNewspapers = (item) => {
@ -543,12 +577,6 @@ const openFkDialogszl = (row) => {
}
/** 获取当前角色 */
function getRole() {
const { deptBizType, deptLevel } = getItem('deptId')[0]