Browse Source

迭代八巡查人员界面及修改、新建,巡查任务界面功能

zhangyihao 9 months ago
parent
commit
807bb4c01d

+ 23 - 0
src/api/inspectionWork/inspector.ts

@@ -31,3 +31,26 @@ export function inspectorUpload(data) {
     data: data
   });
 }
+export function inspectorAdd(data) {
+  return request({
+    url: '/api/riskManagement/inspection/user/create',
+    method: 'post',
+    data: data
+  });
+}
+// 获取新建用户列表
+export function userList(params) {
+  return request({
+    url: '/api/riskManagement/inspection/user/',
+    method: 'get',
+    params: params
+  });
+}
+// 获取新建用户列表
+export function workList(params) {
+  return request({
+    url: '/api/riskManagement/inspection/task/list',
+    method: 'get',
+    params: params
+  });
+}

+ 19 - 17
src/views/inspectionWork/inspector.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-show="!inspectorEditState.show" class="app-container">
+  <div v-show="!inspectorEditState.show && !inspectorAddState.show" class="app-container">
     <el-row :gutter="20">
       <el-col :lg="4" :xs="24">
         <el-tree
@@ -35,7 +35,7 @@
         </transition>
         <el-row :gutter="10">
           <el-col :span="1.5">
-            <el-button type="primary" icon="Plus" @click="handleAdd()">新</el-button>
+            <el-button type="primary" icon="Plus" @click="handleAdd()">新</el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button type="primary" plain icon="Top" @click="handleImport()"> 批量导入 </el-button>
@@ -62,6 +62,7 @@
     </el-row>
   </div>
   <InspectorEdit v-if="inspectorEditState.show" :event-id="inspectorEditState.eventId" @close="handleCancel" />
+  <InspectorAdd v-if="inspectorAddState.show" :event-id="inspectorAddState.eventId" @close="handleCancel" />
 </template>
 
 <script setup lang="ts">
@@ -69,6 +70,7 @@ import { onMounted, reactive, ref, watch } from 'vue';
 import { useRouter } from 'vue-router';
 import { deptList, inspectorList } from '@/api/inspectionWork/inspector';
 import InspectorEdit from './inspectorEdit.vue';
+import InspectorAdd from './inspectorAdd.vue';
 const router = useRouter();
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const loading = ref(true);
@@ -113,19 +115,15 @@ const getTreeSelect = async () => {
 };
 
 const fetchUserData = async () => {
-  try {
-    const res = await inspectorList(queryParams.value); // 调用 inspectorList 接口
-    tableData.value = res.data.map((item) => ({
-      id: item.id,
-      username: item.user_name,
-      phone: item.phonenumber,
-      yzy_organization: item.yzy_account || '', // 如果 yzy_account 为空,则显示空字符串
-      division_responsibility: item.area // 显示责任区划
-    }));
-    total.value = res.total;
-  } catch (error) {
-    console.error('Failed to fetch inspector data:', error);
-  }
+  const res = await inspectorList(queryParams.value); // 调用 inspectorList 接口
+  tableData.value = res.data.map((item) => ({
+    id: item.id,
+    username: item.user_name,
+    phone: item.phonenumber,
+    yzy_organization: item.yzy_account || '', // 如果 yzy_account 为空,则显示空字符串
+    division_responsibility: item.area // 显示责任区划
+  }));
+  total.value = res.total;
 };
 
 // 监听查询参数变化并重新获取数据
@@ -136,15 +134,19 @@ let inspectorEditState = reactive({
   show: false,
   eventId: ''
 });
+let inspectorAddState = reactive({
+  show: false
+});
 const handleCancel = () => {
   inspectorEditState.show = false;
+  inspectorAddState.show = false;
 };
 const handleImport = () => {
   // 实现导入逻辑
 };
 
 const handleAdd = async () => {
-  // 实现新增逻辑
+  inspectorAddState.show = true;
 };
 
 const handleUpdate = (row) => {
@@ -163,7 +165,7 @@ const resetQuery = () => {
   handleQuery();
 };
 const handleSelectionChange = (selection) => {
-  ids.value = selection.map((item) => item.userId);
+  ids.value = selection.map((item) => item.id);
   single.value = selection.length != 1;
   multiple.value = !selection.length;
 };

+ 57 - 9
src/views/inspectionWork/inspectorAdd.vue

@@ -1,11 +1,59 @@
-<script setup lang="ts">
-
-</script>
-
 <template>
-
+  <div class="common-dialog">
+    <div class="common-dialog-content">
+      <div class="common-dialog-title-box">
+        <h3 class="common-dialog-title">新建巡查人员</h3>
+      </div>
+      <div class="common-dialog-box">
+        <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
+          <el-form-item label="姓名:" prop="nick_name">
+            <el-input v-model="formData.nick_name" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="粤政易组织:" prop="yzy_account">
+            <el-input v-model="formData.yzy_account" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="联系方式:" prop="phonenumber">
+            <el-input v-model="formData.phonenumber" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="责任区划:" prop="area">
+            <el-input v-model="formData.area" style="width: 468px !important" />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button @click="closeDialog">取消</el-button>
+          <el-button type="primary" @click="submitForm">确定</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
-
-<style scoped lang="scss">
-
-</style>
+<script setup lang="ts">
+import { inspectorAdd } from '@/api/inspectionWork/inspector';
+import { ref, watch } from 'vue';
+import { ElMessage } from 'element-plus';
+const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+const formData = ref({
+  nick_name: '',
+  phonenumber: '',
+  yzy_account: '',
+  area: ''
+});
+const closeDialog = () => {
+  emits('close');
+};
+// 提交表单
+const submitForm = async () => {
+  // 假设表单已经通过验证
+  const response = await inspectorAdd(formData.value);
+  if (response.code === 200) {
+    ElMessage.success('提交成功');
+    closeDialog(); // 关闭对话框
+  } else {
+    ElMessage.error(response.msg);
+  }
+};
+</script>
+<style scoped></style>

+ 7 - 11
src/views/inspectionWork/inspectorEdit.vue

@@ -63,17 +63,13 @@ const closeDialog = () => {
 };
 // 提交表单
 const submitForm = async () => {
-  try {
-    // 假设表单已经通过验证
-    const response = await inspectorUpload(formData.value);
-    if (response.code === 200) {
-      ElMessage.success('提交成功');
-      closeDialog(); // 关闭对话框
-    } else {
-      ElMessage.error(response.msg);
-    }
-  } catch (error) {
-    ElMessage.error('提交信息失败,请稍后再试');
+  // 假设表单已经通过验证
+  const response = await inspectorUpload(formData.value);
+  if (response.code === 200) {
+    ElMessage.success('提交成功');
+    closeDialog(); // 关闭对话框
+  } else {
+    ElMessage.error(response.msg);
   }
 };
 </script>

+ 184 - 6
src/views/inspectionWork/patrolTask.vue

@@ -1,11 +1,189 @@
-<script setup lang="ts">
-
-</script>
-
 <template>
+  <div>
+    <div class="app-container">
+      <div>
+        <transition name="fade">
+          <div v-show="showSearch">
+            <el-form ref="queryFormRef" :model="queryParams">
+              <el-row :gutter="20">
+                <el-col :span="6">
+                  <el-form-item label="巡查业务:" prop="business" label-width="auto">
+                    <el-select v-model="queryParams.business" placeholder="全部" clearable>
+                      <el-option v-for="item in businessOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="巡查周期:" prop="cycle" label-width="auto">
+                    <el-select v-model="queryParams.cycle" placeholder="全部" clearable>
+                      <el-option v-for="item in cycleOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-button type="primary" @click="handleQuery">搜索</el-button>
+                  <el-button @click="resetQuery">重置</el-button>
+                </el-col>
+              </el-row>
+            </el-form>
+          </div>
+        </transition>
 
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" icon="Plus" @click="handleAdd">新建</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="danger" plain :disabled="multiple" icon="Delete" @click="handleDelete()"> 删除 </el-button>
+          </el-col>
+        </el-row>
+        <!-- 表格组件 -->
+        <el-table ref="multipleTable" v-loading="loading" :data="tableData" @selection-change="handleSelectionChange">
+          <el-table-column type="selection" width="55" align="center" />
+          <el-table-column label="任务编号" align="center" prop="task_number" />
+          <el-table-column label="巡查任务" align="center">
+            <template #default="scope">
+              {{ convertStatus(scope.row.business, 'business') }}
+            </template>
+          </el-table-column>
+          <el-table-column label="巡查时间范围" width="200" align="center" prop="task_time" />
+          <el-table-column label="巡查周期" align="center">
+            <template #default="scope">
+              {{ convertStatus(scope.row.cycle, 'cycle') }}
+            </template>
+          </el-table-column>
+          <el-table-column label="巡查范围" align="center">
+            <template #default="scope">
+              {{ convertStatus(scope.row.inspection_range, 'inspection_range') }}
+            </template>
+          </el-table-column>
+          <el-table-column label="创建人" align="center" prop="create_user" />
+          <el-table-column label="创建时间" align="center" prop="create_time" />
+          <el-table-column label="任务状态" align="center">
+            <template #default="scope">
+              {{ convertStatus(scope.row.task_status, 'task_status') }}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-text class="common-btn-text-primary" @click="handleUpdate(scope.row)">编辑</el-text>
+              <el-text class="common-btn-text-danger" @click="handleWork(scope.row)">完成任务</el-text>
+              <el-text class="common-btn-text-danger" @click="handleDelete(scope.row)">删除</el-text>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="tableData" />
+      </div>
+    </div>
+  </div>
 </template>
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { workList } from '@/api/inspectionWork/inspector';
+const loading = ref(true);
+const showSearch = ref(true);
+const multiple = ref(true);
+const ids = ref<Array<number | string>>([]);
+const single = ref(true);
+const total = ref(0);
+const tableData = ref([]);
+const initFormData = reactive({
+  task_number: '',
+  business: '',
+  task_time: '',
+  cycle: '',
+  id: '',
+  inspection_range: '',
+  task_status: '',
+  create_time: '',
+  create_user: ''
+});
+const data = reactive({
+  form: { ...initFormData },
+  queryParams: {
+    page: 1,
+    pageSize: 10,
+    business: '',
+    cycle: ''
+  }
+});
+const { queryParams, form } = toRefs(data);
+// 巡查业务选项
+const businessOptions = [
+  { value: '', label: '全部' },
+  { value: '0', label: '城市隐患巡查' },
+  { value: '1', label: '森林防火巡查' },
+  { value: '2', label: '重点危化企业巡查' },
+  { value: '3', label: '重点水库水位巡查' }
+];
 
-<style scoped lang="scss">
+// 巡查周期选项
+const cycleOptions = [
+  { value: '', label: '全部' },
+  { value: '0', label: '每年' },
+  { value: '1', label: '每月' },
+  { value: '2', label: '每周' },
+  { value: '3', label: '每日' },
+  { value: '4', label: '一次' }
+];
+// 转换状态的方法
+function convertStatus(value, type) {
+  const statusMapping = {
+    business: {
+      '0': '城市隐患巡查',
+      '1': '森林防火巡查',
+      '2': '重点危化企业巡查',
+      '3': '重点水库水位巡查'
+    },
+    cycle: {
+      '0': '每年',
+      '1': '每月',
+      '2': '每周',
+      '3': '每日',
+      '4': '一次'
+    },
+    inspection_range: {
+      '0': '市级',
+      '1': '区县级',
+      '2': '镇街级',
+      '3': '村居级'
+    },
+    task_status: {
+      '0': '未开始',
+      '1': '进行中',
+      '2': '未完成',
+      '3': '已完结'
+    }
+  };
 
-</style>
+  return statusMapping[type]?.[value] || value;
+}
+const fetchWorkrData = () => {
+  loading.value = true;
+  workList(queryParams.value)
+    .then((res) => {
+      tableData.value = res.data;
+      total.value = res.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+const handleQuery = () => {
+  queryParams.value.page = 1;
+  fetchWorkrData();
+};
+// 重置查询条件
+const resetQuery = () => {
+  queryParams.value = { page: 1, pageSize: 10, business: '', cycle: '' };
+  handleQuery();
+};
+const handleSelectionChange = (selection) => {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+};
+onMounted(() => {
+  fetchWorkrData();
+});
+</script>