文书送达管理前端页面
This commit is contained in:
parent
51301acb17
commit
0fb3e65470
|
|
@ -0,0 +1,167 @@
|
|||
<template>
|
||||
<browser :component-loading="componentLoading"
|
||||
class="enterpriseInfo"
|
||||
style="height: 600px;"
|
||||
:api-config="apiConfig"
|
||||
:table-config="tableConfig"
|
||||
:permissions="permissions"
|
||||
:dialog-config="dialogConfig"
|
||||
:actions="actions"
|
||||
:customQuery="true"
|
||||
@custom-query="customQuery"
|
||||
@update:query-params="queryParams = $event"
|
||||
@update:actions="actions = $event"
|
||||
@update:dialog-config="dialogConfig = $event">
|
||||
<el-table-column header-align="center" prop="documentCode" label="文书编号" min-width="300"/>
|
||||
<el-table-column header-align="center" prop="documentName" label="文书名称" min-width="250"/>
|
||||
<el-table-column header-align="center" prop="documentDate" label="发件时间" min-width="200"/>
|
||||
<template #dialog="{ dialogConfig: dc }">
|
||||
<el-dialog :open="dc.show" :title="dc.title" :type="dc.type" v-if="dc.show" :show-footer="false" @update:open="dc.show = false" class="enterprise-dialog">
|
||||
<!-- 当存在 downloadUrl 时显示 PDF 文件 -->
|
||||
<iframe
|
||||
v-if="dc.data.downloadUrl"
|
||||
:src="`${dc.data.downloadUrl}#toolbar=0&navpanes=0&scrollbar=0`"
|
||||
style="width: 100%; height: 600px; border: none;"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
<!-- 原有的文书内容显示 -->
|
||||
<template v-else>
|
||||
<laspb v-if="dc.data.documentName === '立案审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<ajysspb v-if="dc.data.documentName === '案件移送审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xcjcjl v-if="dc.data.documentName === '现场检查记录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<cyqzpz v-if="dc.data.documentName === '抽样取证凭证'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<jdwts v-if="dc.data.documentName === '鉴定委托书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xcclcsjds v-if="dc.data.documentName === '现场处理措施决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<zlxqzgzls v-if="dc.data.documentName === '责令限期整改指令书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xxdjbczjtzs v-if="dc.data.documentName === '先行登记保存证据通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xxdjbczjcljds v-if="dc.data.documentName === '先行登记保存证据处理决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xwtzs v-if="dc.data.documentName === '询问通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<dcxwbl v-if="dc.data.documentName === '调查询问笔录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<zgfcyjs v-if="dc.data.documentName === '整改复查意见书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<ajdczjbg v-if="dc.data.documentName === '案件调查终结报告'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<fzshyjs v-if="dc.data.documentName === '行政执法决定法制审核意见书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xzcfgzs v-if="dc.data.documentName === '行政处罚告知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<tzhtzs v-if="dc.data.documentName === '行政处罚听证会通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<tzbl v-if="dc.data.documentName === '听证笔录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<tzhbgs v-if="dc.data.documentName === '听证会报告书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<jttljl v-if="dc.data.documentName === '行政处罚集体讨论记录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<ajclcpb v-if="dc.data.documentName === '案件处理呈批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xzcfjds v-if="dc.data.documentName === '行政处罚决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<xzcfjdlxcgs v-if="dc.data.documentName === '行政处罚决定履行催告书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<yqjnfkpzs v-if="dc.data.documentName === '延期(分期)缴纳罚款批准书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<wssdhz v-if="dc.data.documentName === '文书送达回执'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<jaspb v-if="dc.data.documentName === '结案审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
<jnbkb v-if="dc.data.documentName === '卷内备考表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</browser>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {reactive, toRefs} from 'vue'
|
||||
import Browser from '@/components/Browser.vue'
|
||||
import ElDialog from '@/components/ElDialog/index.vue'
|
||||
import documents from '@/api/lawenforcement/Document.js'
|
||||
import laspb from '@pages/xzzfgl/caseMan/laspb.vue'
|
||||
import ajysspb from '@pages/xzzfgl/caseMan/ajysspb.vue'
|
||||
import xcjcjl from '@pages/xzzfgl/caseMan/xcjcjl.vue'
|
||||
import cyqzpz from '@pages/xzzfgl/caseMan/cyqzpz.vue'
|
||||
import jdwts from '@pages/xzzfgl/caseMan/jdwts.vue'
|
||||
import xcclcsjds from '@pages/xzzfgl/caseMan/xcclcsjds.vue'
|
||||
import zlxqzgzls from '@pages/xzzfgl/caseMan/zlxqzgzls.vue'
|
||||
import xxdjbczjtzs from '@pages/xzzfgl/caseMan/xxdjbczjtzs.vue'
|
||||
import xxdjbczjcljds from '@pages/xzzfgl/caseMan/xxdjbczjcljds.vue'
|
||||
import xwtzs from '@pages/xzzfgl/caseMan/xwtzs.vue'
|
||||
import dcxwbl from '@pages/xzzfgl/caseMan/dcxwbl.vue'
|
||||
import zgfcyjs from '@pages/xzzfgl/caseMan/zgfcyjs.vue'
|
||||
import ajdczjbg from '@pages/xzzfgl/caseMan/ajdczjbg.vue'
|
||||
import fzshyjs from '@pages/xzzfgl/caseMan/fzshyjs.vue'
|
||||
import xzcfgzs from '@pages/xzzfgl/caseMan/xzcfgzs.vue'
|
||||
import tzhtzs from '@pages/xzzfgl/caseMan/tzhtzs.vue'
|
||||
import tzbl from '@pages/xzzfgl/caseMan/tzbl.vue'
|
||||
import tzhbgs from '@pages/xzzfgl/caseMan/tzhbgs.vue'
|
||||
import jttljl from '@pages/xzzfgl/caseMan/jttljl.vue'
|
||||
import ajclcpb from '@pages/xzzfgl/caseMan/ajclcpb.vue'
|
||||
import xzcfjds from '@pages/xzzfgl/caseMan/xzcfjds.vue'
|
||||
import xzcfjdlxcgs from '@pages/xzzfgl/caseMan/xzcfjdlxcgs.vue'
|
||||
import yqjnfkpzs from '@pages/xzzfgl/caseMan/yqjnfkpzs.vue'
|
||||
import wssdhz from '@pages/xzzfgl/caseMan/wssdhz.vue'
|
||||
import jaspb from '@pages/xzzfgl/caseMan/jaspb.vue'
|
||||
import jnbkb from '@pages/xzzfgl/caseMan/jnbkb.vue'
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
dialogData: {type: Object, default: () => ({})},
|
||||
tag: {type: String, default: '2'}
|
||||
})
|
||||
|
||||
const state = reactive({
|
||||
componentLoading: false,
|
||||
permissions: {
|
||||
query: false,
|
||||
add: false,
|
||||
modify: false,
|
||||
detail: true,
|
||||
delete: false,
|
||||
importFile: false,
|
||||
exportFile: false,
|
||||
exportSelectFile: false,
|
||||
downloadTemp: false
|
||||
},
|
||||
tableConfig: {
|
||||
hasControlColumn: true,
|
||||
controlWidth: '100',
|
||||
multipleSelect: false
|
||||
},
|
||||
apiConfig: {
|
||||
api: documents,
|
||||
modelId: 'documentId'
|
||||
},
|
||||
dialogConfig: {
|
||||
type: 'max',
|
||||
show: false,
|
||||
mode: 'detail',
|
||||
loading: false,
|
||||
formLabelWidth: '90px',
|
||||
showFooter: false
|
||||
},
|
||||
actions: {
|
||||
detail: handleDetail
|
||||
},
|
||||
queryParams: {},
|
||||
})
|
||||
|
||||
const {
|
||||
componentLoading,
|
||||
permissions,
|
||||
tableConfig,
|
||||
apiConfig,
|
||||
dialogConfig,
|
||||
actions,
|
||||
queryParams
|
||||
} = toRefs(state)
|
||||
|
||||
function customQuery(params) {
|
||||
tableConfig.value.tableLoading = true
|
||||
let query = Object.assign({}, params, props.dialogData)
|
||||
apiConfig.value.api.getDocuments(query).then(res => {
|
||||
tableConfig.value.tableLoading = false
|
||||
if (res.success) tableConfig.value.tableData = res
|
||||
}).catch(() => {
|
||||
tableConfig.value.tableLoading = false
|
||||
})
|
||||
}
|
||||
|
||||
async function handleDetail(row) {
|
||||
dialogConfig.value.show = true
|
||||
dialogConfig.value.mode = 'detail'
|
||||
dialogConfig.value.title = row.documentName
|
||||
dialogConfig.value.data = Object.assign({}, row)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
<template>
|
||||
<div></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted } from 'vue'
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
import { login, sysLogout } from '@/api/lawenforcement/User'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
const route = useRouter()
|
||||
const userStore = useUserStore()
|
||||
const baseURL = `/lawenforcement/v1/auth`
|
||||
|
||||
const handleGetToken = async (code) => {
|
||||
try {
|
||||
const {data} = await login({code})
|
||||
if (data) {
|
||||
userStore.setToken(data.access_token)
|
||||
userStore.setRefreshToken(data.refresh_token)
|
||||
userStore.setExpireIn(data.expires_in)
|
||||
handleUserInfo()
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
const handleUserInfo = async () => {
|
||||
try {
|
||||
if (!userStore.token) {
|
||||
await handleLogin()
|
||||
// 忘记写return导致后面的业务依然在运行。
|
||||
return
|
||||
}
|
||||
// 获取用户信息并持久化到浏览器
|
||||
await userStore.getUserInfo()
|
||||
// 在url没有hash url的时候路由跳转首页
|
||||
const hashUrl = window.location.hash.slice(1)
|
||||
if (hashUrl && hashUrl === '/') {
|
||||
//route.push('/svi/index')
|
||||
route.push('/big-screen')
|
||||
}
|
||||
} catch (error) {
|
||||
handleLogin()
|
||||
}
|
||||
}
|
||||
|
||||
const handleLogin = async () => {
|
||||
try {
|
||||
await userStore.login()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
// 使用 window 的 beforeunload 事件处理页面卸载
|
||||
const setupUnloadListener = () => {
|
||||
window.addEventListener('beforeunload', async () => {
|
||||
const isRefreshing = sessionStorage.getItem('isRefreshing') === 'true';
|
||||
|
||||
// 保存当前的 hash 值,用于页面刷新后恢复
|
||||
if (window.location.hash && window.location.hash !== '#/') {
|
||||
sessionStorage.setItem('savedHash', window.location.hash);
|
||||
console.log('保存 hash:', window.location.hash);
|
||||
}
|
||||
|
||||
if (isRefreshing) {
|
||||
// 如果是刷新操作,清除标记,不执行退出
|
||||
sessionStorage.removeItem('isRefreshing');
|
||||
console.log('页面刷新,不调用退出接口');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 检测导航类型,判断是否为刷新
|
||||
if (performance.getEntriesByType && performance.getEntriesByType("navigation").length > 0) {
|
||||
const navType = performance.getEntriesByType("navigation")[0].type;
|
||||
if (navType === 'reload') {
|
||||
sessionStorage.setItem('isRefreshing', 'true');
|
||||
console.log('检测到页面刷新 (performance.getEntriesByType)');
|
||||
} else {
|
||||
sessionStorage.removeItem('isRefreshing'); // 确保非刷新时清除标记
|
||||
}
|
||||
} else if (performance.navigation) {
|
||||
// 兼容旧版API
|
||||
if (performance.navigation.type === performance.navigation.TYPE_RELOAD) {
|
||||
sessionStorage.setItem('isRefreshing', 'true');
|
||||
console.log('检测到页面刷新 (performance.navigation)');
|
||||
} else {
|
||||
sessionStorage.removeItem('isRefreshing'); // 确保非刷新时清除标记
|
||||
}
|
||||
} else {
|
||||
// 如果API不支持,默认不认为是刷新,以防意外退出
|
||||
sessionStorage.removeItem('isRefreshing');
|
||||
}
|
||||
|
||||
setupUnloadListener();
|
||||
const code = new URLSearchParams(window.location.search).get('code')
|
||||
if (code) {
|
||||
// 去掉浏览器url上的code参数
|
||||
const url = new URL(window.location.href)
|
||||
const fullHash = window.location.hash // 保存完整hash路径
|
||||
url.searchParams.delete('code')
|
||||
window.history.replaceState(null, '', url)
|
||||
handleGetToken(code)
|
||||
} else {
|
||||
// 检查是否有保存的hash值
|
||||
const savedHash = sessionStorage.getItem('savedHash')
|
||||
if (savedHash && window.location.hash === '#/') {
|
||||
// 如果当前hash是'#/'且有保存的hash,则恢复保存的hash
|
||||
window.location.hash = savedHash
|
||||
// 恢复后清除保存的hash
|
||||
sessionStorage.removeItem('savedHash')
|
||||
} else {
|
||||
handleUserInfo()
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,582 @@
|
|||
<template>
|
||||
<div class="dashboard-container">
|
||||
<!-- 统计卡片 -->
|
||||
<div class="statistic-row">
|
||||
<div class="statistic-card" v-for="(card, idx) in stats" :key="idx">
|
||||
<div class="card-icon"><img width="72px" height="72px" :src="card.image" :alt="card.title" /> </div>
|
||||
<div class="card-content">
|
||||
<div class="card-title">{{ card.title }}</div>
|
||||
<div class="card-text">
|
||||
<div class="card-number">{{ card.value }}</div>
|
||||
<!-- <div style="margin-right: 10px;margin-top: 5px">-->
|
||||
<!-- <div> <span class="card-compare">较昨日</span></div>-->
|
||||
<!-- <div style="display: flex"><div class="arrow"></div><span class="num">{{ card.change }}</span></div>-->
|
||||
<!-- </div>-->
|
||||
<div class="goto" @click="gotoPath(card.path)"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex;">
|
||||
<div style="width: 1380px">
|
||||
<!-- 待办事项 -->
|
||||
<div class="todo-section">
|
||||
<div class="section-title">
|
||||
<div class="section-title-icon"></div>
|
||||
<div class="section-title-font ">待办事项</div>
|
||||
</div>
|
||||
<div class="todo-steps">
|
||||
<div class="step-item" v-for="(step, idx) in todoSteps" :key="idx" @mouseenter="mouseenter(idx)" @mouseleave="mouseleave()" @click="gotoPath(step.path)">
|
||||
<div class="step-item-img">
|
||||
<img width="56px" height="56px" class="step-item-img-normal-state" :src="step.image1" alt=""/>
|
||||
<img width="56px" height="56px" class="step-item-img-hover-state" :src="step.image2" alt=""/>
|
||||
</div>
|
||||
<div class="step-item-name">{{ step.name }}</div>
|
||||
<div v-if="idx===0" class="step-item-count-specail">{{ step.count }}</div>
|
||||
<div v-else class="step-item-count">{{ step.count }}</div>
|
||||
<div class="step-item-arrow">
|
||||
<img width="32px" height="32px" class="step-item-arrow-normal-state" src="../../assets/home_page/stepgoto.png" alt=""/>
|
||||
<img width="32px" height="32px" class="step-item-arrow-hover-state" src="../../assets/home_page/stepgoto2.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 悬浮连线 -->
|
||||
<div style="position: absolute; z-index: 8;top: 473px;display: flex;">
|
||||
<img :src="lineImg0" alt="" style="width:100px;margin-left: 115px"/>
|
||||
<img :src="lineImg1" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg2" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg3" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg4" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg5" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg6" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg7" alt="" style="width:100px;margin-left: 32px"/>
|
||||
<img :src="lineImg8" alt="" style="width:100px;margin-left: 32px"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 快捷功能 -->
|
||||
<div class="quick-functions-section">
|
||||
<div class="section-title">
|
||||
<div class="section-title-icon"></div>
|
||||
<div class="section-title-font ">快捷功能</div>
|
||||
</div>
|
||||
<div class="function-item">
|
||||
<div class="function-icons" v-for="(func, idx) in quickFuncs" :key="idx" @click="gotoPath(func.path)">
|
||||
<img class="icon" :src="func.icon " alt=""/><br>
|
||||
<span class="function-icons-name">{{ func.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-left: 35px;width: 430px">
|
||||
<!-- 消息提醒 -->
|
||||
<div class="message-section">
|
||||
<div class="section-title">
|
||||
<div class="section-title-icon"></div>
|
||||
<div class="section-title-font ">消息提醒</div>
|
||||
</div>
|
||||
<div class="message-list">
|
||||
<div class="message-item" v-for="(msg, idx) in messages" :key="idx">
|
||||
<p class="message-content" @click="messageGotoPath(msg)">{{ msg.content }}</p>
|
||||
<p class="message-time">{{ msg.senderAgencyName }} {{ msg.createTime }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from 'vue-router'
|
||||
const route = useRouter()
|
||||
import {onMounted, onUnmounted, ref} from 'vue';
|
||||
import homePage from "@/api/lawenforcement/HomePage.js";
|
||||
import messagesApi from "@/api/lawenforcement/Message.js";
|
||||
// 动态图片加载示例
|
||||
const getImageUrl = (name) => {
|
||||
return new URL(`../../assets/home_page/${name}`, import.meta.url).href
|
||||
}
|
||||
const lineImg0 = ref(getImageUrl('line.png'))
|
||||
const lineImg1 = ref(getImageUrl('line.png'))
|
||||
const lineImg2 = ref(getImageUrl('line.png'))
|
||||
const lineImg3 = ref(getImageUrl('line.png'))
|
||||
const lineImg4 = ref(getImageUrl('line.png'))
|
||||
const lineImg5 = ref(getImageUrl('line.png'))
|
||||
const lineImg6 = ref(getImageUrl('line.png'))
|
||||
const lineImg7 = ref(getImageUrl('line.png'))
|
||||
const lineImg8 = ref(getImageUrl('line.png'))
|
||||
// 统计数据
|
||||
const stats = ref([
|
||||
{ image: getImageUrl('执法信息量.png'), title: '执法信息量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/zfxxgl'},
|
||||
{ image: getImageUrl('文书数量.png'), title: '文书数量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/zfwsgl'},
|
||||
{ image: getImageUrl('检查数量.png'), title: '检查数量', value: 0, arrow: '↓', change: 16 ,path:{path:'/xzzfgl/zfjc/zfjc',query:'1'}},
|
||||
{ image: getImageUrl('案卷数量.png'), title: '案卷数量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/caseList' },
|
||||
{ image: getImageUrl('企业数量.png'), title: '企业数量', value: 0, arrow: '↓', change: 16 ,path:'/dtsjygl/qyxxcx'},
|
||||
]);
|
||||
|
||||
// 待办步骤
|
||||
const todoSteps = ref([
|
||||
{ image1: getImageUrl('定制方案1.png'),image2: getImageUrl('定制方案2.png'), name: '定制方案', count: 0 ,path:'/xzzfgl/zfjc/dzjcfa'},
|
||||
{ image1: getImageUrl('方案审批1.png'),image2: getImageUrl('方案审批2.png'), name: '方案审批', count: 0 ,path:'/xzzfgl/zfjc/fasp'},
|
||||
{ image1: getImageUrl('现场检查1.png'),image2: getImageUrl('现场检查2.png'), name: '现场检查', count: 0 ,path:'/xzzfgl/zfjc/zfjc'},
|
||||
{ image1: getImageUrl('总结1.png'),image2: getImageUrl('总结2.png'), name: '总结', count: 0 ,path:'/xzzfgl/zfjc/zj'},
|
||||
{ image1: getImageUrl('立案1.png'),image2: getImageUrl('立案2.png'), name: '立案', count: 0 ,path:'/xzzfgl/xzcf/zfla'},
|
||||
{ image1: getImageUrl('调查取证1.png'),image2: getImageUrl('调查取证2.png'), name: '调查取证', count: 0 ,path:'/xzzfgl/xzcf/dcqz'},
|
||||
{ image1: getImageUrl('分析研判1.png'),image2: getImageUrl('分析研判2.png'), name: '分析研判', count: 0 ,path:'/xzzfgl/xzcf/fxyp'},
|
||||
{ image1: getImageUrl('法制审核1.png'),image2: getImageUrl('法制审核2.png'), name: '法制审核', count: 0 ,path:'/xzzfgl/xzcf/fzsh'},
|
||||
{ image1: getImageUrl('集体讨论1.png'),image2: getImageUrl('集体讨论2.png'), name: '集体讨论', count: 0,path:'/xzzfgl/xzcf/jttl' },
|
||||
{ image1: getImageUrl('结案1.png'),image2: getImageUrl('结案2.png'), name: '结案', count: 0 ,path:'/xzzfgl/xzcf/zfja' },
|
||||
]);
|
||||
|
||||
// 快捷功能
|
||||
const quickFuncs = ref([
|
||||
{ icon: getImageUrl('企业查询.png'), name: '企业查询' ,path:'/dtsjygl/qyxxcx'},
|
||||
{ icon: getImageUrl('企业分级分类.png'), name: '企业分级分类' ,path:'/dtsjygl/qyfjfl'},
|
||||
{ icon: getImageUrl('执法信息.png'), name: '执法信息' ,path:'/xzzfgl/zfxxgl'},
|
||||
{ icon: getImageUrl('督导检查.png'), name: '督导检查' ,path:'/xzzfgl/ddjcjh/ddjc'},
|
||||
{ icon: getImageUrl('举报核查.png'), name: '举报核查' ,path:'/xzzfgl/jbhcxx'},
|
||||
// { icon: getImageUrl('扫码入企.png'), name: '扫码入企' ,path:'/xzzfgl/smrq'},
|
||||
{ icon: getImageUrl('定制方案1.png'), name: '定制方案' ,path:'/xzzfgl/zfjc/dzjcfa'},
|
||||
{ icon: getImageUrl('执法文书.png'), name: '执法文书' ,path:'/xzzfgl/zfwsgl'},
|
||||
{ icon: getImageUrl('案卷资料.png'), name: '案卷资料',path:'/xzzfgl/caseList' },
|
||||
{ icon: getImageUrl('非现场执法.png'), name: '非现场执法' ,path:'/fxczfgl/index'},
|
||||
{ icon: getImageUrl('文书送达.png'), name: '文书送达' ,path:'/zfwssd/zfwsxx'},
|
||||
{ icon: getImageUrl('档案信息.png'), name: '档案信息',path:'/dagl/xzjcdagl' },
|
||||
]);
|
||||
|
||||
// 消息提醒
|
||||
const messages = ref([]);
|
||||
let timer = null // 时器ID
|
||||
onMounted(() => {
|
||||
homePage.getstatCount().then(rs => {
|
||||
if (rs.success&&rs.data) {
|
||||
stats.value[0].value = rs.data.zfxxs
|
||||
stats.value[1].value = rs.data.wss
|
||||
stats.value[2].value = rs.data.jcs
|
||||
stats.value[3].value = rs.data.ajs
|
||||
stats.value[4].value = rs.data.qys
|
||||
}
|
||||
})
|
||||
|
||||
// 待立案数
|
||||
homePage.getdlaCount().then(rs => {
|
||||
if (rs.success&&rs.data) {
|
||||
if(rs.data.dla)
|
||||
todoSteps.value[4].count = rs.data.dla
|
||||
}
|
||||
})
|
||||
|
||||
homePage.countCurrentNodeCode().then(rs => {
|
||||
if (rs.success&&rs.data) {
|
||||
const target = rs.data
|
||||
//方案待审批
|
||||
const dspfa = target.find(node => node.status === 'plan_approval')
|
||||
if(dspfa){
|
||||
todoSteps.value[1].count = dspfa.stat_num
|
||||
}
|
||||
//方案审批通过待检查
|
||||
const djc = target.find(node => node.status === 'plan_approved')
|
||||
if(djc){
|
||||
todoSteps.value[2].count = djc.stat_num
|
||||
}
|
||||
//检查完毕待总结
|
||||
const dzj = target.find(node => node.status === 'inspect_done')
|
||||
if(dzj){
|
||||
todoSteps.value[3].count = dzj.stat_num
|
||||
}
|
||||
//立案完毕待调查取证
|
||||
const dqz = target.find(node => node.status === 'filed')
|
||||
if(dqz){
|
||||
todoSteps.value[5].count = dqz.stat_num
|
||||
}
|
||||
//调查取证完毕待分析研判
|
||||
const dfxyp = target.find(node => node.status === 'investigation_done')
|
||||
if(dfxyp){
|
||||
todoSteps.value[6].count = dfxyp.stat_num
|
||||
}
|
||||
//分析研判通过待法制审核
|
||||
const dfzsh = target.find(node => node.status === 'analyze_judge')
|
||||
if(dfzsh){
|
||||
todoSteps.value[7].count = dfzsh.stat_num
|
||||
}
|
||||
//法制审核通过待集体讨论
|
||||
const djttl = target.find(node => node.status === 'reviewing_done')
|
||||
if(djttl){
|
||||
todoSteps.value[8].count = djttl.stat_num
|
||||
}
|
||||
//集体讨论完待结案
|
||||
const dja = target.find(node => node.status === 'closed')
|
||||
if(dja){
|
||||
todoSteps.value[9].count = dja.stat_num
|
||||
}
|
||||
}
|
||||
})
|
||||
getMsg();
|
||||
timer = setInterval(getMsg, 60*1000)
|
||||
})
|
||||
onUnmounted(() => {
|
||||
clearInterval(timer)
|
||||
})
|
||||
const getMsg = () =>{
|
||||
messagesApi.getUserMessages({status:'UNREAD',page:0, size:100}).then(rs => {
|
||||
messages.value = rs.data
|
||||
})
|
||||
}
|
||||
|
||||
const gotoPath= (path) =>{
|
||||
route.push(path)
|
||||
}
|
||||
|
||||
const messageGotoPath= (msg) =>{
|
||||
messagesApi.updateMessageStatus(msg.id,{status:'READ'}).then(rs=>{
|
||||
if(rs.success){
|
||||
const idx = messages.value.findIndex((item) => item.id === msg.id)
|
||||
if (idx > -1) messages.value.splice(idx, 1)
|
||||
}
|
||||
})
|
||||
|
||||
route.push(msg.routeUrl)
|
||||
|
||||
|
||||
}
|
||||
|
||||
const mouseenter = (idx)=> {
|
||||
if(idx===0){
|
||||
lineImg0.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===1){
|
||||
lineImg0.value = getImageUrl('gotoleft.png')
|
||||
lineImg1.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===2){
|
||||
lineImg1.value = getImageUrl('gotoleft.png')
|
||||
lineImg2.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===3){
|
||||
lineImg2.value = getImageUrl('gotoleft.png')
|
||||
lineImg3.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===4){
|
||||
lineImg3.value = getImageUrl('gotoleft.png')
|
||||
lineImg4.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===5){
|
||||
lineImg4.value = getImageUrl('gotoleft.png')
|
||||
lineImg5.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===6){
|
||||
lineImg5.value = getImageUrl('gotoleft.png')
|
||||
lineImg6.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===7){
|
||||
lineImg6.value = getImageUrl('gotoleft.png')
|
||||
lineImg7.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===8){
|
||||
lineImg7.value = getImageUrl('gotoleft.png')
|
||||
lineImg8.value = getImageUrl('gotoright.png')
|
||||
}else if(idx===9){
|
||||
lineImg8.value = getImageUrl('gotoleft.png')
|
||||
}
|
||||
|
||||
}
|
||||
const mouseleave = ()=> {
|
||||
lineImg0.value = getImageUrl('line.png')
|
||||
lineImg1.value = getImageUrl('line.png')
|
||||
lineImg2.value = getImageUrl('line.png')
|
||||
lineImg3.value = getImageUrl('line.png')
|
||||
lineImg4.value = getImageUrl('line.png')
|
||||
lineImg5.value = getImageUrl('line.png')
|
||||
lineImg6.value = getImageUrl('line.png')
|
||||
lineImg7.value = getImageUrl('line.png')
|
||||
lineImg8.value = getImageUrl('line.png')
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.dashboard-container{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.statistic-row {
|
||||
width: 1820px;
|
||||
background: rgb(199, 211, 229, 0.4);
|
||||
border-radius: 18px;
|
||||
border: 0.0625rem solid #a9c7da;
|
||||
padding: 15px;
|
||||
margin-bottom: 35px;
|
||||
display: flex;
|
||||
|
||||
.statistic-card {
|
||||
display: flex;
|
||||
background: rgb(255, 255, 255,0.75);
|
||||
border: solid 1pt rgb(255, 255, 255);
|
||||
border-radius: 8px;
|
||||
padding: 15px;
|
||||
margin-right: 15px;
|
||||
width: 350px;
|
||||
.card-icon{
|
||||
|
||||
}
|
||||
.card-content{
|
||||
margin-left: 20px;
|
||||
width: 220px;
|
||||
.card-title {
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 18px;
|
||||
color: #373E52;
|
||||
text-align: right;
|
||||
font-weight: 700;
|
||||
}
|
||||
.card-text{
|
||||
display: flex;
|
||||
float: right;
|
||||
.card-number {
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 40px;
|
||||
color: #373E52;
|
||||
line-height: 52px;
|
||||
font-weight: 700;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.card-compare {
|
||||
font-family: OPPOSans40;
|
||||
font-size: 11px;
|
||||
color: #8890A6;
|
||||
font-weight: 400;
|
||||
}
|
||||
.arrow {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-image: url("../../assets/home_page/上升.png");
|
||||
}
|
||||
.num {
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 12px;
|
||||
color: #E93920;
|
||||
font-weight: 700;
|
||||
}
|
||||
.goto {
|
||||
margin-top: 21px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-image: url("../../assets/home_page/statisticNumgoto.png");
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.todo-section{
|
||||
background: rgb(199, 211, 229, 0.4);
|
||||
border: 0.0625rem solid #a9c7da;
|
||||
border-radius: 16px;
|
||||
padding: 15px;
|
||||
margin-bottom: 35px;
|
||||
|
||||
.todo-steps {
|
||||
display: flex;
|
||||
margin-top: 13px;
|
||||
padding: 15px 0 15px 15px;
|
||||
background: rgb(255, 255, 255,0.75);
|
||||
border: solid 1pt rgb(255, 255, 255);
|
||||
border-radius: 12px;
|
||||
z-index: 0;
|
||||
.step-item {
|
||||
width: 117px;
|
||||
height: 266px;
|
||||
margin-right: 15px;
|
||||
border-radius: 8px;
|
||||
background-image: url("../../assets/home_page/todobg.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
transition: all 0.4s ease; /* 平滑过渡效果 */
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
|
||||
.step-item-img{
|
||||
margin-top: 15px;
|
||||
margin-left: 15px;
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
|
||||
.step-item-img-normal-state {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 默认隐藏悬停图片 */
|
||||
.step-item-img-hover-state {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
.step-item-name{
|
||||
margin-top: 13px;
|
||||
margin-left: 15px;
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 16px;
|
||||
color: #373E52;
|
||||
font-weight: 700;
|
||||
}
|
||||
.step-item-count {
|
||||
margin-top: 15px;
|
||||
margin-left: 15px;
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 40px;
|
||||
color: #3C86FF;
|
||||
font-weight: 700;
|
||||
}
|
||||
.step-item-count-specail {
|
||||
margin-top: 15px;
|
||||
margin-left: 15px;
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 40px;
|
||||
color: #8e8e8e;
|
||||
font-weight: 700;
|
||||
}
|
||||
.step-item-arrow{
|
||||
position: relative;
|
||||
z-index: 8;
|
||||
margin-left: 68px;
|
||||
margin-top: 33px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
.step-item-arrow-normal-state{
|
||||
display: block;
|
||||
}
|
||||
.step-item-arrow-hover-state{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.step-item:hover::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 117px;
|
||||
height: 266px;
|
||||
background: rgba(60, 134, 255, 0.3); /* 蓝色阴影,可自定义颜色和透明度 */
|
||||
background-size: cover;
|
||||
border-radius: 8px;
|
||||
transition: all 0.4s ease;
|
||||
z-index: 2;
|
||||
}
|
||||
.step-item:hover .step-item-img-normal-state {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.step-item:hover .step-item-img-hover-state {
|
||||
display: block;
|
||||
}
|
||||
.step-item:hover .step-item-arrow-normal-state{
|
||||
display: none;
|
||||
}
|
||||
.step-item:hover .step-item-arrow-hover-state{
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.message-section {
|
||||
background: rgb(199, 211, 229, 0.4);
|
||||
border: 0.0625rem solid #a9c7da;
|
||||
border-radius: 16px;
|
||||
padding: 15px;
|
||||
|
||||
|
||||
.message-list {
|
||||
height: 533px;
|
||||
overflow: scroll;
|
||||
.message-item {
|
||||
background: rgb(255, 255, 255, 0.75);
|
||||
border:solid 1pt white;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
margin-top: 10px;
|
||||
.message-content{
|
||||
font-family: OPPOSans40_Medium;
|
||||
font-size: 14px;
|
||||
color: #455273;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
}
|
||||
.message-time {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
.message-item:hover {
|
||||
background: white;
|
||||
.message-content{
|
||||
font-family: OPPOSans40_Medium;
|
||||
font-size: 14px;
|
||||
color:rgb(60, 134, 255);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
}
|
||||
.message-time {
|
||||
font-size: 12px;
|
||||
color:rgb(55, 62, 82);
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.quick-functions-section{
|
||||
background: rgb(199, 211, 229, 0.4);
|
||||
border: 0.0625rem solid #a9c7da;
|
||||
border-radius: 16px;
|
||||
padding: 15px;
|
||||
.function-item {
|
||||
display: flex;
|
||||
padding: 13px 10px 10px 10px;
|
||||
.function-icons {
|
||||
margin-top: 15px;
|
||||
margin-left: 15px;
|
||||
margin-right: 28px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
.icon {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
.function-icons-name {
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
.section-title-icon {
|
||||
border: 3px solid #3C86FF;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.section-title-font{
|
||||
margin-left: 10px;
|
||||
font-family: OPlusSans3-Bold;
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
line-height: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,332 @@
|
|||
<template>
|
||||
<browser :component-loading="componentLoading"
|
||||
:api-config="apiConfig"
|
||||
:permissions="permissions"
|
||||
:dialog-config="dialogConfig"
|
||||
:table-config="tableConfig"
|
||||
:actions="actions"
|
||||
@update:actions="actions = $event"
|
||||
@update:dialog-config="dialogConfig = $event">
|
||||
<template #queryPanel="{ queryParams: qp }" v-if="!portal">
|
||||
<el-form ref="queryForm" :model="qp" label-width="80px">
|
||||
<el-row class="query-condition">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发布单位">
|
||||
<AgencySelector v-model="qp.agency" :lazy-load="true" :multiple="false" placeholder="请选择"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6"><el-form-item label="标题"><el-input v-model="qp.notificationTitle" clearable/></el-form-item></el-col>
|
||||
<el-col :span="6"><el-form-item label="发布人"><el-input v-model="qp.publisher" clearable/></el-form-item></el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
<el-table-column header-align="center" align="center" prop="releaseTime" label="发布时间" min-width="200"/>
|
||||
<el-table-column header-align="center" align="center" prop="publishingUnit" label="发布单位" min-width="200" show-overflow-tooltip/>
|
||||
<el-table-column header-align="center" align="center" prop="noticeTitle" label="标题" min-width="200"/>
|
||||
<el-table-column header-align="center" align="center" prop="publisher" label="发布人" min-width="200"/>
|
||||
<template #tableControlColumn="{ data: r }" v-if="!portal">
|
||||
<el-link v-if="r.data.row.publishingUnitCode === userStore.userInfo.gajgjgdm" type="primary" @click="handleModify(r.data.row)" title="修改">修改</el-link>
|
||||
</template>
|
||||
<template #dialogContent="{ dialogConfig: dc }">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发布单位" prop="agency">
|
||||
<AgencySelector v-model="dc.data.agency" :lazy-load="true" :multiple="false" disabled="true" placeholder="请选择"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发布单位" prop="agency">
|
||||
<AgencySelector v-model="dc.data.agency" :lazy-load="true" :multiple="false" :disabled="true" placeholder="请选择"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发布人" prop="publisher">
|
||||
<el-input v-model="dc.data.publisher" :disabled="true"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="发布时间" prop="releaseTime">
|
||||
<el-date-picker v-model="dc.data.releaseTime"
|
||||
type="datetime"
|
||||
placeholder="选择发布时间"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
:disabled="true"
|
||||
style="width: 100%;"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="接收单位" prop="peoplePolices">
|
||||
<!-- <OfficerSelector v-model="dc.data.peoplePolices"/>-->
|
||||
<!-- <tree-selector v-model="dc.data.peoplePolices"></tree-selector>-->
|
||||
<AgencySelector v-model="dc.data.peoplePolices" :multiple="true" :lazy-load="true" v-if="dc.mode !== 'detail'"/>
|
||||
<el-input v-model="dc.data.jsdws" :disabled="true" type="textarea" rows="3" v-else/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="发布标题" prop="noticeTitle">
|
||||
<el-input v-model="dc.data.noticeTitle" :disabled="dc.mode === 'detail'"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">-->
|
||||
<!-- <el-form-item label="通知公告内容" prop="publishContent">-->
|
||||
<!-- <el-input type="textarea" :rows="6" v-model="dc.data.publishContent"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<el-col :span="24">
|
||||
<el-form-item label="通知公告内容" prop="publishContent">
|
||||
<div style="width: 100%; height: 300px" v-if="dc.mode !== 'detail'">
|
||||
<QuillEditor
|
||||
v-model:content="dc.data.publishContent"
|
||||
contentType="html"
|
||||
:init="editorConfig"
|
||||
:toolbar="toolbarOptions"
|
||||
@ready="handleEditorReady"
|
||||
/>
|
||||
</div>
|
||||
<div v-html="dc.data.publishContent" v-else></div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" style="height: 70px"></el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</browser>
|
||||
</template>
|
||||
<script setup>
|
||||
import {reactive, toRefs, ref, watch, defineProps, onMounted} from 'vue'
|
||||
import Browser from '@/components/Browser.vue'
|
||||
import {useUserStore} from '@/stores/modules/user'
|
||||
import {ElButton, ElMessage} from "element-plus"
|
||||
import AgencySelector from "@/components/AgencySelector.vue"
|
||||
import {DEFAULT_ENTERPRISE_DETAIL, DICTDISPLAYS, DICTITEMS} from "@/utils/Constants.js"
|
||||
import notice from '@/api/lawenforcement/Notice.js';
|
||||
import dayjs from 'dayjs'
|
||||
import OfficerSelector from "@/components/OfficerSelector.vue";
|
||||
import { QuillEditor } from '@vueup/vue-quill';
|
||||
import '@vueup/vue-quill/dist/vue-quill.snow.css';
|
||||
|
||||
const props = defineProps({portal: {type: Boolean, default: () => false}})
|
||||
|
||||
const userStore = useUserStore()
|
||||
|
||||
const option = [{ label: '发布', value: '1' }, { label: '接收', value: '0' }]
|
||||
const state = reactive({
|
||||
componentLoading: false,
|
||||
permissions: {
|
||||
query: !props.portal,
|
||||
add: !props.portal,
|
||||
modify: false,
|
||||
detail: true,
|
||||
delete: !props.portal,
|
||||
deleteAll: false,
|
||||
importFile: false,
|
||||
exportFile: false,
|
||||
exportSelectFile: false,
|
||||
downloadTemp: false,
|
||||
},
|
||||
apiConfig: {
|
||||
api: notice,
|
||||
modelId: 'noticeId',
|
||||
},
|
||||
tableConfig: {
|
||||
hasControlColumn: true,
|
||||
controlWidth: '180',
|
||||
multipleSelect: !props.portal
|
||||
},
|
||||
dialogConfig: {
|
||||
show: false,
|
||||
mode: 'detail',
|
||||
formLabelWidth: '110px',
|
||||
height: '500px',
|
||||
loading: false,
|
||||
baseTitle: '通知公告管理',
|
||||
rules: {
|
||||
agency: [{ required: true, message: '发布单位不能为空', trigger: 'blur' }],
|
||||
publisher: [{ required: true, message: '发布人不能为空', trigger: 'blur' }],
|
||||
releaseTime: [{ required: true, message: '发布时间不能为空', trigger: 'blur' }],
|
||||
peoplePolices: [{ required: true, message: '接收单位不能为空', trigger: 'change' }],
|
||||
noticeTitle: [{ required: true, message: '发布标题不能为空', trigger: 'blur' }],
|
||||
publishContent: [{ required: true, message: '通知公告内容不能为空', trigger: 'blur' }]
|
||||
},
|
||||
data: {},
|
||||
actions: {
|
||||
handleDialogOk: handleDialogOk
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
add: handleAdd,
|
||||
modify: handleModify,
|
||||
detail: handleDetail,
|
||||
handleSelectionChange
|
||||
},
|
||||
simpleConfigCase: {confName: 'case'},
|
||||
simpleConfigZfws: {confName: 'document'},
|
||||
simpleConfigSdfs: {confName: 'recipient'},
|
||||
simpleConfigSsr: {confName: 'method'},
|
||||
deliverys: [],
|
||||
officers: []
|
||||
})
|
||||
|
||||
const {
|
||||
componentLoading,
|
||||
permissions,
|
||||
tableConfig,
|
||||
apiConfig,
|
||||
dialogConfig,
|
||||
actions,
|
||||
simpleConfigCase,
|
||||
simpleConfigZfws,
|
||||
simpleConfigSdfs,
|
||||
simpleConfigSsr,
|
||||
deliverys,
|
||||
officers,
|
||||
queryParams
|
||||
} = toRefs(state)
|
||||
|
||||
const methodName = ref('')
|
||||
// 富文本编辑器
|
||||
const content = ref('<p>初始内容</p>');
|
||||
const toolbarOptions = [
|
||||
['bold', 'italic', 'underline', 'strike'], // 加粗、斜体、下划线、删除线
|
||||
['blockquote', 'code-block'], // 引用、代码块
|
||||
|
||||
[{ 'header': 1 }, { 'header': 2 }], // 标题1、标题2
|
||||
[{ 'list': 'ordered'}, { 'list': 'bullet' }], // 有序列表、无序列表
|
||||
[{ 'script': 'sub'}, { 'script': 'super' }], // 下标、上标
|
||||
[{ 'indent': '-1'}, { 'indent': '+1' }], // 缩进减少、缩进增加
|
||||
[{ 'direction': 'rtl' }], // 文本方向(从右到左)
|
||||
|
||||
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小
|
||||
[{ 'header': [1, 2, 3, 4, 5, 6, false] }], // 标题级别
|
||||
|
||||
[{ 'color': [] }, { 'background': [] }], // 字体颜色、背景颜色
|
||||
[{ 'font': [] }], // 字体
|
||||
[{ 'align': [] }], // 对齐方式
|
||||
|
||||
['clean'] // 清除格式
|
||||
// ['link', 'image', 'video'] // 链接、图片、视频
|
||||
];
|
||||
const editorConfig = {
|
||||
height: '500px',
|
||||
};
|
||||
|
||||
const handleEditorReady = (editor) => {
|
||||
};
|
||||
function handleAdd() {
|
||||
dialogConfig.value.show = true
|
||||
methodName.value = null
|
||||
dialogConfig.value.mode = 'add'
|
||||
dialogConfig.value.title = '通知公告管理新增'
|
||||
dialogConfig.value.data = Object.assign({}, {})
|
||||
const now = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
|
||||
dialogConfig.value.data = {
|
||||
releaseTime: now,
|
||||
publisherUserId: userStore.userInfo.yhwybs,
|
||||
publisher: userStore.userInfo.xm,
|
||||
peoplePolices: [],
|
||||
agency: {
|
||||
agencyCode: userStore.userInfo.gajgjgdm,
|
||||
agencyName: userStore.userInfo.gajgmc,
|
||||
agencyLevel: userStore.userInfo.gajgmclbdm
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function handleModify(row) {
|
||||
dialogConfig.value.show = true
|
||||
methodName.value = null
|
||||
dialogConfig.value.mode = 'modify'
|
||||
dialogConfig.value.title = '通知公告管理修改'
|
||||
dialogConfig.value.data.documentIds = []
|
||||
findOne(row)
|
||||
}
|
||||
|
||||
function handleDetail(row) {
|
||||
dialogConfig.value.show = true
|
||||
methodName.value = null
|
||||
dialogConfig.value.mode = 'detail'
|
||||
dialogConfig.value.title = '通知公告管理详情'
|
||||
dialogConfig.value.showFooter = false
|
||||
findOne(row)
|
||||
}
|
||||
|
||||
function findOne(row) {
|
||||
dialogConfig.value.loading = true
|
||||
console.log(dialogConfig.value, '----')
|
||||
apiConfig.value.api.findOne(row[apiConfig.value.modelId]).then(res => {
|
||||
if (res.success) {
|
||||
dialogConfig.value.loading = false
|
||||
let data = res.data
|
||||
methodName.value = data.deliveryMethod?.methodName
|
||||
data.logistics = data.logistics? data.logistics:{}
|
||||
data.documentIds = data.documentIds?.split(',') || []
|
||||
if (data.materials) data.materials.forEach(item => item.uid = item.materialsId)
|
||||
data.jsdws = data.peoplePolices?.map(item => item.agencyName).join(', ')
|
||||
dialogConfig.value.data = Object.assign({}, data, {picList: data.materials})
|
||||
} else {
|
||||
dialogConfig.value.loading = false
|
||||
throw new Error('查询失败')
|
||||
}
|
||||
}).catch(() => {
|
||||
dialogConfig.value.loading = false
|
||||
})
|
||||
}
|
||||
|
||||
function handleDialogOk(formRef) {
|
||||
let _event = actions.value
|
||||
formRef.validate(valid => {
|
||||
if (valid) {
|
||||
dialogConfig.value.loading = true
|
||||
let data = Object.assign({}, dialogConfig.value.data)
|
||||
if (data.agency === null || data.agency === '') {
|
||||
ElMessage.error('属地不能为空!')
|
||||
}
|
||||
if (dialogConfig.value.mode === 'add') {
|
||||
data.selectAll = false
|
||||
console.log('参数=', data)
|
||||
apiConfig.value.api.add(data).then(res => {
|
||||
dialogConfig.value.show = false
|
||||
if (res.success) {
|
||||
ElMessage.success('操作成功')
|
||||
_event.query()
|
||||
} else {
|
||||
throw new Error('操作失败')
|
||||
}
|
||||
dialogConfig.value.loading = false
|
||||
}).catch(() => {
|
||||
dialogConfig.value.loading = false
|
||||
})
|
||||
} else if (dialogConfig.value.mode === 'modify') {
|
||||
apiConfig.value.api.modify(dialogConfig.value.data[apiConfig.value.modelId], data).then(res => {
|
||||
dialogConfig.value.show = false
|
||||
if (res.success) {
|
||||
ElMessage.success('操作成功')
|
||||
_event.query()
|
||||
} else {
|
||||
throw new Error('操作失败')
|
||||
}
|
||||
dialogConfig.value.loading = false
|
||||
}).catch(() => {
|
||||
dialogConfig.value.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function handleSelectionChange(selectedData) {
|
||||
deliverys.value = [...selectedData]
|
||||
}
|
||||
|
||||
|
||||
// 阅读
|
||||
function read (row) {
|
||||
this.readDialogMode = 'read'
|
||||
this.readDialogShow = true
|
||||
this.readFormData = row
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue