feat:案件巡查主页面搭建

sub-government-affairs-service/package.json

@@ -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",

sub-government-affairs-service/src/router/modules/inputSupplies/index.js

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

sub-government-affairs-service/src/views/inputSuppliesManage/patrolCaseManage/common/RecordModal.vue

@@ -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>

sub-government-affairs-service/src/views/inputSuppliesManage/patrolCaseManage/index.vue

@@ -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 lang="scss" scoped></style>
+.record_content {
+  display: flex;
+}
+</style>

sub-government-affairs-service/src/views/landManage/component/illegalHandle/common/FileUpload.vue

@@ -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 --------------- */

sub-government-affairs-service/src/views/landManage/component/illegalHandle/index.vue

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