|
|
|
@ -56,6 +56,12 @@ |
|
|
|
class="custom-table" |
|
|
|
> |
|
|
|
<template #bodyCell="{ text, record, column }"> |
|
|
|
<!-- 业务类型 Tag 展示 --> |
|
|
|
<template v-if="column.dataIndex === 'sjlyNo'"> |
|
|
|
<a-tag :color="getBizTypeColor(text)"> |
|
|
|
{{ getBizTypeLabel(text) }} |
|
|
|
</a-tag> |
|
|
|
</template> |
|
|
|
<!-- 满意度标签展示 --> |
|
|
|
<template v-if="column.dataIndex === 'qzmyqk'"> |
|
|
|
<DictLabel :dict-code="DICT_CODE_ENUM.CALLBACK_SATISFACTION" :data-value="text" /> |
|
|
|
@ -103,7 +109,7 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup> |
|
|
|
import { ref, computed, reactive, onMounted, watch } from 'vue'; |
|
|
|
import { ref, computed, reactive, watch } from 'vue'; |
|
|
|
import { useRoute } from 'vue-router'; |
|
|
|
import { message, Modal } from 'ant-design-vue'; |
|
|
|
import { PlusOutlined, DeleteOutlined } from '@ant-design/icons-vue'; |
|
|
|
@ -115,20 +121,27 @@ import { DICT_CODE_ENUM } from '/@/constants/support/dict-const.js'; |
|
|
|
import DictSelect from '/@/components/support/dict-select/index.vue'; |
|
|
|
import DictLabel from '/@/components/support/dict-label/index.vue'; |
|
|
|
import { useDictStore } from '/@/store/modules/system/dict.js'; |
|
|
|
import { useUserStore } from '/@/store/modules/system/user.js'; |
|
|
|
|
|
|
|
const route = useRoute(); |
|
|
|
const userStore = useUserStore(); |
|
|
|
|
|
|
|
// ---------------------------- Tab 切换状态 ---------------------------- |
|
|
|
// ---------------------------- 路由判定与Tab切换 ---------------------------- |
|
|
|
const activeTab = ref('all'); |
|
|
|
|
|
|
|
// 从URL查询参数或路由标题中动态获取业务小类码，传给后端分页接口进行过滤 |
|
|
|
// 是否为“我的工作台”模式 |
|
|
|
const isWorkbench = computed(() => { |
|
|
|
return route.path.includes('my-workbench'); |
|
|
|
}); |
|
|
|
|
|
|
|
// 从URL查询参数或路由标题中动态获取业务小类码 |
|
|
|
const currentBizTypeCode = computed(() => { |
|
|
|
// 1. 优先获取菜单路由中配置的 query 参数，实现未来配置化菜单与零代码新增 |
|
|
|
if (isWorkbench.value) { |
|
|
|
return undefined; |
|
|
|
} |
|
|
|
if (route.query && route.query.sjlyNo) { |
|
|
|
return route.query.sjlyNo; |
|
|
|
} |
|
|
|
|
|
|
|
// 2. 动态匹配：根据路由对应的菜单标题（如“110接处警评议”）与字典“业务小类”的名称进行自动映射，彻底摆脱硬编码写死 |
|
|
|
const title = route.meta?.title; |
|
|
|
if (title) { |
|
|
|
const dictStore = useDictStore(); |
|
|
|
@ -141,12 +154,12 @@ const currentBizTypeCode = computed(() => { |
|
|
|
return matchItem.dataValue; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
return undefined; |
|
|
|
}); |
|
|
|
|
|
|
|
// 根据不同的路由小类编码，从字典中动态适配页面标题 |
|
|
|
const pageTitle = computed(() => { |
|
|
|
if (isWorkbench.value) return '我的工作台'; |
|
|
|
const code = currentBizTypeCode.value; |
|
|
|
if (!code) return '警务评议通用'; |
|
|
|
const label = useDictStore().getDataLabels(DICT_CODE_ENUM.BUSINESS_CLASSIFICATION, code); |
|
|
|
@ -155,15 +168,22 @@ const pageTitle = computed(() => { |
|
|
|
|
|
|
|
// 根据业务小类编码，从字典中动态获取业务小类名称 |
|
|
|
const currentBizTypeName = computed(() => { |
|
|
|
if (isWorkbench.value) return '工作台汇总'; |
|
|
|
const code = currentBizTypeCode.value; |
|
|
|
if (!code) return '未定义'; |
|
|
|
const label = useDictStore().getDataLabels(DICT_CODE_ENUM.BUSINESS_CLASSIFICATION, code); |
|
|
|
return label ? `${label} (${code})` : `未知小类 (${code})`; |
|
|
|
}); |
|
|
|
|
|
|
|
// ---------------------------- 表格列声明 ---------------------------- |
|
|
|
const columns = [ |
|
|
|
{ title: '工单受理编号', dataIndex: 'slbh', ellipsis: true }, |
|
|
|
// ---------------------------- 表格列声明 (动态列) ---------------------------- |
|
|
|
const columns = computed(() => { |
|
|
|
const list = []; |
|
|
|
list.push({ title: '工单受理编号', dataIndex: 'slbh', ellipsis: true }); |
|
|
|
// 在工作台模式下增加“业务类型”展示 |
|
|
|
if (isWorkbench.value) { |
|
|
|
list.push({ title: '业务类型', dataIndex: 'sjlyNo', width: 130, align: 'center' }); |
|
|
|
} |
|
|
|
list.push( |
|
|
|
{ title: '诉求人姓名', dataIndex: 'sqrXm', width: 100, ellipsis: true }, |
|
|
|
{ title: '联系电话', dataIndex: 'lxdh', width: 130 }, |
|
|
|
{ title: '涉及单位', dataIndex: 'sjdwMc', ellipsis: true }, |
|
|
|
@ -171,8 +191,40 @@ const columns = [ |
|
|
|
{ title: '群众满意度', dataIndex: 'qzmyqk', width: 100, align: 'center' }, |
|
|
|
{ title: '工单状态', dataIndex: 'gdzt', width: 100, align: 'center' }, |
|
|
|
{ title: '诉求时间', dataIndex: 'sqsj', width: 150 }, |
|
|
|
{ title: '操作', dataIndex: 'action', width: 160, align: 'center', fixed: 'right' }, |
|
|
|
]; |
|
|
|
{ title: '操作', dataIndex: 'action', width: 160, align: 'center', fixed: 'right' } |
|
|
|
); |
|
|
|
return list; |
|
|
|
}); |
|
|
|
|
|
|
|
// ---------------------------- 业务类型辅助显示 ---------------------------- |
|
|
|
function getBizTypeLabel(sjlyNo) { |
|
|
|
const map = { |
|
|
|
'110': '110接处警', |
|
|
|
'hz': '户政窗口', |
|
|
|
'crj': '出入境', |
|
|
|
'cjg': '车驾管', |
|
|
|
'ajbl': '案件办理', |
|
|
|
'xzsp': '行政审批评议', |
|
|
|
'xf': '信访评议', |
|
|
|
'wq': '民辅警维权', |
|
|
|
'za': '治安管理评议', |
|
|
|
'js': '监所管理评议', |
|
|
|
'xl': '巡逻防控评议', |
|
|
|
'sqfw': '涉企服务评议' |
|
|
|
}; |
|
|
|
return map[sjlyNo] || sjlyNo || '通用业务'; |
|
|
|
} |
|
|
|
|
|
|
|
function getBizTypeColor(sjlyNo) { |
|
|
|
const map = { |
|
|
|
'110': 'red', |
|
|
|
'hz': 'blue', |
|
|
|
'crj': 'purple', |
|
|
|
'cjg': 'green', |
|
|
|
'ajbl': 'orange' |
|
|
|
}; |
|
|
|
return map[sjlyNo] || 'cyan'; |
|
|
|
} |
|
|
|
|
|
|
|
// ---------------------------- 分页查询 ---------------------------- |
|
|
|
const queryFormDefault = { |
|
|
|
@ -181,6 +233,8 @@ const queryFormDefault = { |
|
|
|
qzmyqk: undefined, |
|
|
|
sjlyNo: undefined, |
|
|
|
tabType: 'all', |
|
|
|
processorId: undefined, |
|
|
|
assignStatus: undefined, |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 10, |
|
|
|
}; |
|
|
|
@ -194,9 +248,15 @@ const total = ref(0); |
|
|
|
async function queryData() { |
|
|
|
tableLoading.value = true; |
|
|
|
try { |
|
|
|
// 注入当前菜单路由代表的小类过滤编码 |
|
|
|
if (isWorkbench.value) { |
|
|
|
queryForm.sjlyNo = undefined; |
|
|
|
queryForm.processorId = userStore.employeeId; |
|
|
|
queryForm.assignStatus = 1; // 仅查已分配/已认领 |
|
|
|
} else { |
|
|
|
queryForm.sjlyNo = currentBizTypeCode.value; |
|
|
|
// 注入当前 Tab 状态传给后端 |
|
|
|
queryForm.processorId = undefined; |
|
|
|
queryForm.assignStatus = undefined; |
|
|
|
} |
|
|
|
queryForm.tabType = activeTab.value; |
|
|
|
const res = await wtczApi.queryPage(queryForm); |
|
|
|
tableData.value = res.data?.list || []; |
|
|
|
|
wang
1 month ago