feat:案件巡查主页面搭建

This commit is contained in:
李想 2025-04-12 09:58:52 +08:00
parent a5df6641f7
commit fd81dce26c
6 changed files with 419 additions and 22 deletions

View File

@ -21,6 +21,7 @@
"@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-vue": "^5.1.12",
"axios": "^1.6.5",
"dayjs": "^1.11.13",
"echarts": "^5.6.0",
"element-plus": "^2.7.2",
"js-base64": "^3.7.6",

View File

@ -90,12 +90,12 @@ const inputSuppliesRoutes = [
component: () => import('@/views/inputSuppliesManage/knowledgeManage/index.vue'),
meta: { title: '知识库', icon: 'Document' },
},
// {
// path: '/sub-government-affairs-service/patrolCaseManage',
// name: 'patrolCaseManage',
// component: () => import('@/views/inputSuppliesManage/patrolCaseManage/index.vue'),
// meta: { title: '巡查与案件管理', icon: 'Document' },
// },
{
path: '/sub-government-affairs-service/patrolCaseManage',
name: 'patrolCaseManage',
component: () => import('@/views/inputSuppliesManage/patrolCaseManage/index.vue'),
meta: { title: '巡查与案件管理', icon: 'Document' },
},
],
},
];

View File

@ -0,0 +1,66 @@
<template>
<el-dialog v-model="visible" title="Tips" width="500" draggable>
<avue-radio v-model="radio" :dic="radioDic" :button="true" class="top_radio"></avue-radio>
<br />
<avue-form v-model="data" :option="option"> </avue-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false">Cancel</el-button>
<el-button type="primary" @click="visible = false"> Confirm </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { ref, defineExpose, reactive, onMounted } from 'vue';
import { customRules } from '@/config';
import dayjs from 'dayjs';
const data = ref({});
const visible = ref(false);
const radio = ref('1');
const radioDic = reactive([
{ label: '执法消息', value: '1' },
{ label: '被询问人信息', value: '2' },
{ label: '询问内容', value: '3' },
]);
const option = reactive({
column: [
{
label: '询问时间',
prop: 'time',
type: 'date',
format: 'YYYY-MM-DD HH:mm',
valueFormat: 'YYYY-MM-DD HH:mm',
span: 24,
disabled: true,
},
{ label: '询问地点', prop: 'address', span: 24 },
{ label: '询问机关', prop: 'unit', span: 24 },
{ label: '询问人', prop: 'person', span: 24 },
{ label: '记录人', prop: 'recordPerson', span: 24 },
],
});
function handleRecordOpen(obj = {}) {
visible.value = Object.keys(obj).length ? true : false;
if (visible.value) {
data.value = Object.assign({}, obj);
option.column[0].value = dayjs().format('YYYY-MM-DD HH:mm');
}
}
onMounted(() => {
console.log('dayjs', dayjs().format('YYYY-MM-DD HH-mm'));
option.column[0].value = dayjs().format('YYYY-MM-DD HH:mm');
});
defineExpose({
handleRecordOpen,
});
</script>
<style lang="scss" scoped>
.top_radio {
text-align: center;
}
</style>

View File

@ -1,19 +1,354 @@
<template>
<section class="custom-page">巡查与案件</section>
<section class="custom-page">
<avue-crud ref="crudRef" v-model:search="searchCondition" v-model:page="pageData" :data="data" :option="option">
<template #menu="scpoe">
<custom-table-operate :actions="actions" :data="scpoe" />
</template>
<template #sceneProof-form="{ row, type }">
<section class="proof_content_">
<span v-if="type == 'add'">照片视频</span>
<Attrs v-model:attrs="examineForm.proof" :type="type" :limit="5" :file-num="5" accept="image/*,video/*" />
</section>
</template>
<template #documentAttrs-form="{ row, type }">
<FileUpload v-model:attrs="examineForm.documentAttrs" :format="['rar', 'zip', 'doc', 'docx', 'pdf']" :type="type" />
</template>
<template #c2-form="{ type }">
<section class="record_content">
<FileUpload v-model:attrs="examineForm.documentAttrs" :type="type" />
<span>填写笔录</span>
</section>
</template>
</avue-crud>
<RecordModal ref="recordModalRef" />
</section>
</template>
<script setup>
import { ref } from 'vue';
import { ref, reactive, onMounted, watch } from 'vue';
import { getRegion as GetRegion } from '@/apis';
import { GetEntityList as GetUserList } from '@/apis/system/user';
import { GetEntityList as GetDict } from '@/apis/system/dict';
import { CRUD_OPTIONS, pageData, customRules } from '@/config';
import { useUserStore } from '@/store/modules/user';
import FileUpload from '@/views/landManage/component/illegalHandle/common/FileUpload.vue';
import Attrs from '@/views/inputSuppliesManage/common/Attrs.vue';
import RecordModal from './common/RecordModal.vue';
const UserStore = useUserStore();
const { VITE_APP_BASE_API } = import.meta.env;
onMounted(() => {
getRegion();
getMumber();
});
/* --------------- data --------------- */
// #region
const regionData = ref([]);
const memberData = ref([]);
const crudRef = ref(null);
const searchCondition = reactive({
keyword: '',
});
const data = ref([{}]);
const option = reactive({
...CRUD_OPTIONS,
selection: false,
dialogWidth: '50%',
column: [
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '任务编号',
prop: 'text1',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '任务名称',
prop: 'text2',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '单位名称',
prop: 'text3',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '统一社会信用代码',
prop: 'text4',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '法定代表人',
prop: 'text5',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '联系电话',
prop: 'text6',
},
{
addDisplay: false,
editDisplay: false,
viewDisplay: false,
label: '区域',
prop: 'text7',
},
],
group: [
{
label: '任务信息',
prop: 'taskInfo',
column: [
{
label: '任务名称',
prop: 'taskName',
},
{
label: '任务编号',
prop: 'taskNumber',
},
{
label: '任务巡查时限',
type: 'date',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd',
prop: 'taskTime',
},
{
label: '任务巡查类型',
prop: 'taskType',
type: 'select',
value: '1',
clearable: false,
dicData: [
{
label: '指定事项巡查',
value: '1',
},
{
label: '定期巡查',
value: '2',
},
{
label: '全面巡查',
value: '3',
},
],
},
{
label: '执法区域',
prop: 'region',
type: 'cascader',
dicData: [],
props: {
label: 'areaName',
value: 'areaCode',
children: 'areaChildVOS',
},
},
{
label: '小组成员',
prop: 'groupMember',
type: 'select',
dicData: [],
multiple: true,
props: {
label: 'nickName',
value: 'userId',
},
},
],
},
{
label: '执法对象',
prop: 'checkObject',
column: [
{
label: '单位名称',
prop: 'b1',
},
{
label: '社会统一信用代码',
prop: 'b2',
},
{
label: '法定代表人',
prop: 'b3',
},
{
label: '联系电话',
prop: 'phone',
},
{
label: '所在区域',
prop: 'region1',
type: 'cascader',
dicData: [],
props: {
label: 'areaName',
value: 'areaCode',
children: 'areaChildVOS',
},
},
{
label: '详细地址',
prop: 'addressDetail',
},
],
},
{
label: '登记核查信息',
prop: 'registerCheckInfo',
column: [
{
label: '案情记录',
prop: 'record',
span: 24,
type: 'textarea',
},
{
label: '现场取证',
prop: 'sceneProof',
span: 24,
},
{
label: '执法文书',
prop: 'c1',
},
{
label: '',
prop: 'documentAttrs',
span: 24,
},
{
label: '巡查笔录',
prop: 'c2',
},
],
},
{
label: '案件处理',
prop: '_caseResult',
column: [
{
label: '案件处理结果',
prop: 'caseResult',
span: 24,
type: 'radio',
dicUrl: `${VITE_APP_BASE_API}/system/dict/data/list`,
dicQuery: {
dictType: 'sys_law_case_result',
current: 1,
size: 9999,
},
dicHeaders: {
authorization: UserStore.token,
},
props: {
label: 'dictLabel',
value: 'dictValue',
},
dicFormatter: (res) => res?.data?.records ?? [],
},
],
},
],
});
const actions = reactive([
{
name: '详情',
icon: 'view',
event: ({ row }) => {},
},
{
name: '编辑',
icon: 'edit',
event: ({ row }) => {
crudRef.value.rowEdit(row);
},
},
{
name: '登记核查信息',
icon: 'clock',
event: ({ row }) => {
option.group[0].editDisplay = false;
option.group[1].column.forEach((v) => (v.editDisabled = true));
crudRef.value.rowEdit(row);
},
},
{
type: 'danger',
name: '删除',
icon: 'delete',
event: ({ row }) => {},
},
]);
const examineForm = reactive({
caseId: '',
proof: [],
documentAttrs: [],
});
watch(
() => examineForm,
() => {
console.log('examineForm', examineForm.attrs);
},
{
deep: true,
immediate: true,
}
);
const recordModalRef = ref(null);
// #endregion
/* --------------- methods --------------- */
// #region
async function getRegion() {
let res = await GetRegion();
if (res.code == 200) {
regionData.value = res?.data ?? [];
option.group[0].column[4].dicData = regionData.value;
option.group[1].column[4].dicData = regionData.value;
}
}
async function getMumber() {
let res = await GetUserList({
current: 1,
size: 99999,
deptId: 105,
});
if (res.code == 200) {
memberData.value = res?.data?.records ?? [];
option.group[0].column[5].dicData = memberData.value;
console.log('regionData.value', memberData.value);
}
}
async function getDictData(dicType) {
let res = await GetDict({
current: 1,
size: 99999,
dictType: dicType,
});
if (res.code == 200) {
option.group[0].column[3].dicData = res?.data?.records ?? [];
}
}
// #endregion
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.record_content {
display: flex;
}
</style>

View File

@ -2,7 +2,7 @@
<el-upload ref="upload" :file-list="fileList" class="upload-demo" :limit="props.limit" :auto-upload="false" :on-change="fileChange">
<el-button type="primary" :disabled="fileList.length == 5">点击上传</el-button>
<template #tip>
<div v-if="props.format.length" class="el-upload__tip">只能上传{{ props.format.join() }} 文件且不超过20MB</div>
<div v-if="props.format.length && props.tips" class="el-upload__tip">只能上传{{ props.format.join() }} 文件且不超过20MB</div>
</template>
<template #file="{ file }">
<section class="file_line">
@ -41,6 +41,10 @@ const props = defineProps({
type: String,
default: 'view',
},
tips: {
type: Boolean,
default: true,
},
});
/* --------------- data --------------- */

View File

@ -422,16 +422,7 @@ const examineForm = reactive({
proof: [],
attrs: [],
});
watch(
() => examineForm,
() => {
console.log('examineForm', examineForm.attrs);
},
{
deep: true,
immediate: true,
}
);
// #endregion
/* --------------- methods --------------- */