创建任务页面优化

src/api/system/user/index.ts

@@ -56,6 +56,12 @@ export const deleteUser = (id: number) => {
   return request.delete({ url: '/system/user/delete?id=' + id })
 }
 
+// 删除用户
+export const deleteUserAllData = (id: number) => {
+  return request.delete({ url: '/system/user/test_delete?id=' + id })
+}
+
+
 // 导出用户
 export const exportUser = (params) => {
   return request.download({ url: '/system/user/export', params })

src/views/system/user/index.vue

@@ -156,6 +156,12 @@
                       >
                         <Icon icon="ep:delete" />删除
                       </el-dropdown-item>
+                      <el-dropdown-item
+                        command="handleDelete2"
+                        v-if="checkPermi(['system:user:deleteAllData'])"
+                      >
+                        <Icon icon="ep:delete" />测试删除全部数据
+                      </el-dropdown-item>
                       <el-dropdown-item
                         command="handleResetPwd"
                         v-if="checkPermi(['system:user:update-password'])"
@@ -332,6 +338,9 @@ const handleCommand = (command: string, row: UserApi.UserVO) => {
     case 'handleRole':
       handleRole(row)
       break
+    case 'handleDelete2':
+      handleDelete2(row.id)
+      break
     default:
       break
   }
@@ -350,6 +359,19 @@ const handleDelete = async (id: number) => {
   } catch {}
 }
 
+/** 删除按钮操作 */
+const handleDelete2 = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await UserApi.deleteUserAllData(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
 /** 重置密码 */
 const handleResetPwd = async (row: UserApi.UserVO) => {
   try {

src/views/task/create copy.vue

@@ -0,0 +1,616 @@
+<template>
+  <ContentWrap title="基本信息">
+    <section class="taskForm">
+      <el-form ref="formRef" :model="formData" :rules="formRules" label-width="auto">
+        <el-form-item label="标题" prop="title">
+          <el-input v-model="formData.title" placeholder="请输入任务标题" />
+        </el-form-item>
+        <el-form-item label="时间周期" prop="planTime">
+          <el-date-picker
+            v-model="formData.planTime"
+            type="daterange"
+            format="YYYY年MM月DD日"
+            range-separator="至"
+            start-placeholder="选择任务计划开始时间"
+            end-placeholder="选择任务计划结束时间"
+            value-format="YYYY-MM-DD"
+          />
+        </el-form-item>
+        <el-form-item label="类型" prop="taskType">
+          <el-tree-select
+            v-model="formData.taskType"
+            :data="tagList"
+            :props="defaultProps"
+            check-strictly
+            node-key="id"
+            placeholder="请选择任务类型"
+          />
+        </el-form-item>
+        <el-form-item label="执行周期" prop="execCycle" v-if="formData.taskType == 2">
+          <el-select v-model="formData.execCycle" placeholder="请选择执行周期">
+            <el-option
+              v-for="dict in getIntDictOptions(DICT_TYPE.TASK_EXEC_TIME)"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="优先级" prop="priority">
+          <el-select v-model="formData.priority" placeholder="请选择任务优先级">
+            <el-option
+              v-for="dict in getIntDictOptions(DICT_TYPE.TASK_PRIORITY)"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+<!--        <el-form-item label="标签" prop="tags" style="width: 100%">-->
+<!--          <el-tree-select-->
+<!--            v-model="formData.tags"-->
+<!--            :data="tagList"-->
+<!--            check-strictly-->
+<!--            :render-after-expand="false"-->
+<!--            placeholder="请选择标签"-->
+<!--            node-key="id"-->
+<!--            show-checkbox-->
+<!--            multiple-->
+<!--            :props="{-->
+<!--              label: 'tagName'-->
+<!--            }"-->
+<!--          />-->
+<!--        </el-form-item>-->
+        <el-form-item label="描述" prop="description" style="width: 100%">
+          <el-input
+            type="textarea"
+            v-model="formData.description"
+            :autosize="{
+              minRows: 3
+            }"
+            placeholder="请输入描述"
+          />
+        </el-form-item>
+      </el-form>
+    </section>
+  </ContentWrap>
+  <ContentWrap title="执行范围">
+    <!-- <template #header> </template> -->
+    <section class="select-area" v-loading="loading">
+      <section>
+        <el-form :model="enterprise.queryParams" ref="queryFormRef" :inline="true" label-width="0"  class="search-form">
+          <div class="form-container">
+            <el-form-item label="" prop="region" class="form-item">
+              <el-select
+                v-model="enterprise.queryParams.region"
+                placeholder="请选择所属区域"
+                clearable
+                @clear="handleQuery"
+                @change="handleQuery"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="enterprise.queryParams.type"
+                placeholder="请选择行业"
+                clearable
+                @change="handleQuery"
+                @clear="handleQuery"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="enterprise.queryParams.type"
+                placeholder="请选择生态"
+                clearable
+                @change="handleQuery"
+                @clear="handleQuery"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="enterprise.queryParams.type"
+                placeholder="请选择类型"
+                clearable
+                @change="handleQuery"
+                @clear="handleQuery"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="enterprisesName" class="form-item">
+              <el-input
+                v-model="enterprise.queryParams.enterprisesName"
+                placeholder="请选择执法人员"
+                clearable
+                @keyup.enter="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item label="" prop="enterprisesName" class="form-item">
+              <el-input
+                v-model="enterprise.queryParams.enterprisesName"
+                placeholder="请输入企业名称"
+                clearable
+                @keyup.enter="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item  class="form-item">
+              <el-button @click="handleQuery">
+                <Icon icon="ep:search" class="mr-5px" /> 搜索
+              </el-button>
+              <el-button @click="resetQuery" class="mr-10px">
+                <Icon icon="ep:refresh" class="mr-5px" /> 重置 </el-button
+              >
+            </el-form-item>
+            <el-form-item  class="action-buttons" >
+              <el-button @click="insertEnterprise" type="primary">
+                <el-icon><CirclePlus /></el-icon> &nbsp; 新增企业
+              </el-button>
+            </el-form-item>
+          </div>
+        </el-form>
+        <section class="enterprise-area">
+          <el-table
+          ref="multipleTableRef"
+          :data="enterprise.list"
+          @selection-change="handleSelectionChange"
+          style="width: 100%; border: 1px solid #EBEEF5; "
+          :cell-style="{ borderBottom: '1px solid #EBEEF5' }"
+          :header-cell-style="{ 
+            borderBottom: '1px solid #EBEEF5',
+            backgroundColor: '#F5F7FA'
+          }"
+          >
+          <template #empty>
+            <div class="no-data">
+              <el-image src="/src/assets/imgs/no_data.png" style="width: 120px;" />
+              <p>暂无数据</p>
+            </div>
+          </template>
+            <el-table-column type="selection" width="30"/>
+            <el-table-column property="enterprisesName"  label="企业名称" min-width="100" />
+            <el-table-column property="region" label="区域" min-width="100">
+              <template #default="scope">
+                {{ getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA).find(dict => dict.value == scope.row.region)?.label || '未知区域' }}
+              </template>
+          </el-table-column>
+            <el-table-column property="enterprisesName" label="行业" min-width="100" />
+            <el-table-column property="enterprisesName" label="生态" min-width="100" />
+            <el-table-column property="enterprisesName" label="类型" min-width="100" />
+            <el-table-column property="enterprisesName" label="执法人员" min-width="100" />
+          </el-table>
+        </section>
+        <pagination
+          v-show="enterprise.total > 0"
+          :total="enterprise.total"
+          :show-page-size="false"
+          size="small"
+          v-model:page="enterprise.queryParams.pageNo"
+          v-model:limit="enterprise.queryParams.pageSize"
+          @pagination="getEnterPriseList"
+        />
+      </section>
+      <div class="footer">
+        <el-button type="primary" @click="submitForm">提 交</el-button>
+        <el-button 
+          type="primary" @click="submitForm"  v-hasPermi="['system:enterprise-inspections:audit']">审核通过</el-button>
+        <el-button 
+          type="danger"
+          @click="submitForm"
+          v-hasPermi="['system:enterprise-inspections:audit']"
+        >删除</el-button>
+      </div>
+    </section>
+  </ContentWrap>
+  <CreateEnterprise ref="formRef"/>
+</template>
+<script setup lang="ts">
+import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
+import { TagLibraryApi } from '@/api/system/taglibrary'
+import { EnterprisesApi, EnterprisesVO } from '@/api/enterprises'
+import { TaskInfoApi } from '@/api/system/taskinfo'
+import { useTagsViewStore} from '@/store/modules/tagsView'
+import {defaultProps} from "@/utils/tree";
+import CreateEnterprise from './createEnterprise.vue'
+
+defineOptions({ name: 'CreateTask' })
+const loading = ref(false)
+const formData = ref({
+  id: undefined,
+  title: undefined,
+  description: undefined,
+  execCycle: undefined,
+  taskType: undefined,
+  priority: undefined,
+  status: undefined,
+  startDate: undefined,
+  endDate: undefined,
+  createBy: undefined,
+  updateBy: undefined,
+  parentId: undefined,
+  parentType: undefined,
+  taskStep: undefined,
+  taskTotal: undefined,
+  planTime: [] as any,
+  tags: [],
+  enterprises: [] as any
+})
+const router=useRouter()
+const route=useRoute()
+const tagView=useTagsViewStore()
+const message = useMessage() // 消息弹窗
+const formRules = reactive({
+  title: [{ required: true, message: '任务标题不能为空', trigger: 'blur' }],
+  taskType: [
+    {
+      required: true,
+      message: '任务类型不能为空',
+      trigger: 'change'
+    }
+  ],
+  planTime: [{ required: true, message: '时间周期不能为空', trigger: 'blur' }]
+})
+const {query}=useRoute()
+const formRef = ref() // 表单 Ref`
+const tagList = ref([])
+const queryFormRef = ref() // 搜索的表单
+const enterprise = ref({
+  list: ref<EnterprisesVO[]>(),
+  queryParams: reactive({
+    pageNo: 1,
+    pageSize: 9,
+    enterprisesName: undefined,
+    type: undefined,
+    region: undefined,
+    registrationNumber: undefined,
+    id:undefined
+  }),
+  total: ref(0)
+})
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  enterprise.value.queryParams.pageNo = 1
+  getEnterPriseList()
+}
+
+const insertEnterprise = () => {
+  formRef.value.open()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+/**
+ * 获取标签列表
+ */
+function getTagList() {
+  TagLibraryApi.getTagLibraryPage({tagType:2}).then((res) => {
+    tagList.value = res
+  })
+}
+const defaultProps = {
+  label: 'tagName', // 使用 'name' 字段作为选项的标签
+  children: 'children', // 如果存在子节点，则使用 'children' 字段
+};
+/**
+ * 获取企业列表
+ */
+async function getEnterPriseList() {
+  loading.value = true
+  try {
+    const data = await EnterprisesApi.getEnterprisesPage(enterprise.value.queryParams)
+    enterprise.value.list = data.list
+    enterprise.value.total = data.total
+  } finally {
+    loading.value = false
+  }
+}
+/**
+ * 全选
+ */
+async function selectAll() {
+  loading.value = true
+	const data = JSON.parse(JSON.stringify(enterprise.value.queryParams));
+	data.pageSize = -1
+	delete data.pageNo
+	const { list } = await EnterprisesApi.getEnterprisesPage(data)
+  const arr = [...formData.value.enterprises, ...list]
+  formData.value.enterprises = uniqueFunc(arr, 'id')
+  loading.value = false
+}
+/**
+ * 取消全选
+ */
+async function cancelAll() {
+  loading.value = true
+  const data = JSON.parse(JSON.stringify(enterprise.value.queryParams));
+  data.pageSize = -1
+	delete data.pageNo
+  const { list } = await EnterprisesApi.getEnterprisesPage(data)
+  if (list) {
+    formData.value.enterprises = formData.value.enterprises.filter((e) => {
+      return !list.some((r) => e.id == r.id)
+    })
+  }
+  loading.value = false
+}
+/**
+ * 单选企业
+ * @param enterprise
+ */
+function selectEnterprise(enterprise) {
+  formData.value.enterprises.push(enterprise)
+}
+/**
+ * 单选取消
+ * @param enterprise
+ */
+function checkEnterprise(enterprise) {
+  formData.value.enterprises = formData.value.enterprises.filter((e) => e.id != enterprise.id)
+}
+/**
+ * 数组去重
+ * @param arr
+ * @param uniId 唯一id
+ * @returns
+ */
+function uniqueFunc(arr, uniId) {
+  const res = new Map()
+  return arr.filter((item) => !res.has(item[uniId]) && res.set(item[uniId], 1))
+}
+/**
+ * 提交表单
+ */
+async function submitForm() {
+  const validate = await unref(formRef).validate()
+  if (validate) {
+    const data = JSON.parse(JSON.stringify(formData.value))
+    //任务状态默认初始值1
+    data.status=1;
+    console.log("任务类型：",formData.value.taskType)
+    data.enterpriseIds = formData.value.enterprises.map((i) => i.id)
+    if(data.enterpriseIds.length==0){
+      message.success("温馨提示：请您选择执法对象")
+    }else{
+       if(data.status<2){
+            data.startDate = data.planTime[0]
+            data.endDate = data.planTime[1]
+            if (data.id) {
+              TaskInfoApi.updateTaskInfo(data).then(() => {
+                message.success('操作成功')
+                tagView.delView(route)
+                router.go(-1)
+              })
+            } else {
+              TaskInfoApi.createTaskInfo(data).then(() => {
+                message.success('操作成功')
+                tagView.delView(route)
+                router.go(-1)
+              })
+            }
+       }else{
+         message.success('温馨提示：该任务已经执行,无法再进行修改')
+       }
+    }
+  }
+}
+function init(){
+	if(query.id){
+		TaskInfoApi.getTaskInfo(query.id).then(res=>{
+			formData.value=res
+			formData.value.planTime=[formData.value.startDate,formData.value.endDate]
+			formData.value.enterprises=res.enterpriseIdes
+      formData.value.tags=res.taskTagIdes.map(t=>t.tagId)
+		})
+	}
+}
+// getEnterPriseList()
+getTagList()
+onMounted(()=>{
+	init()
+})
+</script>
+<style scoped lang="scss">
+
+
+::v-deep .ContentWrap .el-card__header {
+  text-decoration: none !important;  /* 去除下划线 */
+  border-bottom: 0px solid #ebeef5 !important;
+  padding-left: 20px;
+  
+}
+
+::v-deep(.taskForm .el-form) {
+  display: flex;
+  flex-flow: row wrap;
+  justify-content: space-around;
+  gap: 10px;
+  .el-form-item {
+    width: calc(50% - 10px);
+    display: flex;
+    align-items: flex-start;
+  }
+}
+.enterprise-area {
+  flex: 1;
+  gap: 10px;
+  margin: 0 20px;  // 添加与搜索框相同的边距
+  overflow-x: hidden;  // 添加这行
+  width: calc(100% - 40px);  // 添加这行
+
+  :deep(.el-table) {
+    width: 100% !important;  // 添加这行
+
+    .el-table__cell {
+      text-align: center;
+    }
+  }
+
+  
+
+  :deep(.no-data) {
+    padding: 30px 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    
+    p {
+      margin-top: 10px;
+      color: #909399;
+    }
+  }
+
+  .enterprise {
+    cursor: pointer;
+    box-shadow: 0 0 1px 1px #eaeaea;
+    border-radius: 6px;
+    padding: 10px;
+    transition: 0.2s all;
+    margin-bottom: 5px;
+    &:hover {
+      box-shadow: 0 0 1px 1px #ccc;
+    }
+  }
+}
+.check-area {
+  border: 1px dashed #ccc;
+  border-radius: 6px;
+  overflow: hidden;
+  overflow-y: scroll;
+  height: 550px;
+  max-height: 550px;
+  scroll-behavior: smooth;
+  padding: 10px;
+  display: flex;
+  flex-flow: row wrap;
+  gap: 10px;
+  align-content: flex-start;
+  &::-webkit-scrollbar {
+    width: 3px;
+    height: 100%;
+    padding: 2px;
+  }
+  &::-webkit-scrollbar-thumb {
+    background-color: #ccc;
+    border-radius: 5px;
+  }
+  .isChecked {
+    width: calc(100% / 4 - 10px);
+    height: 80px;
+    color: #fff;
+    background-color: var(--el-color-primary);
+    padding: 5px 10px;
+    box-shadow: 0px 0px 1px 1px #ccc;
+    border-radius: 4px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    cursor: pointer;
+  }
+}
+.total {
+  width: 100%;
+  margin-top: 10px;
+  text-align: right;
+}
+.select-area {
+  display: grid;
+  grid-template-rows: 1fr;
+  grid-template-columns: minmax(0, 1fr); 
+  grid-gap: 20px;
+  ::v-deep(.select-area .el-form) {
+    margin-bottom: 15px;
+    .el-form-item {
+      margin-right: 10px;
+      margin-bottom: 10px;
+    }
+  }
+  :deep(.el-form) {
+    margin-bottom: 15px;
+    .el-form-item {
+      margin-right: 10px;
+      margin-bottom: 10px;
+    }
+  }
+
+  .search-form {
+    background-color: #fff;
+    padding: 20px 20px 0px 20px;
+    border-radius: 4px;
+    position: relative;
+    margin: 0 20px;  // 改用 margin 控制间距
+    .form-container {
+      display: grid;
+      grid-template-columns: repeat(4, 1fr);
+      gap: 24px;
+      margin-bottom: 20px;
+    }
+  
+    .form-item {
+      margin: 0;
+      width: 100%;
+      
+      :deep(.el-input),
+      :deep(.el-select) {
+        width: 100%;
+      }
+    }
+
+    .action-buttons {
+      position: absolute;
+      right: 10px;
+      bottom: 0px;
+    }
+  
+    .button-container {
+      display: flex;
+      justify-content: center;
+      gap: 8px;
+    }
+  }
+
+  .pagination-container {
+    display: flex;
+    justify-content: right;
+    margin: 10px; // 确保分页和按钮之间有间距
+  }
+
+  .footer {
+    display: flex;
+    justify-content: center; // 将按钮居中
+    gap: 8px; // 按钮之间的间距
+    padding-top: 20px;
+    margin: 10px;  // 添
+  }
+
+}
+</style>

src/views/task/create.vue

@@ -75,7 +75,7 @@
     </section>
   </ContentWrap>
   <ContentWrap title="执行范围">
-    <template #header> </template>
+    <!-- <template #header> </template> -->
     <section class="select-area" v-loading="loading">
       <section>
         <el-form :model="enterprise.queryParams" ref="queryFormRef" :inline="true" label-width="0">

src/views/task/create2.vue

@@ -0,0 +1,170 @@
+<template>
+    <ContentWrap title="基本信息">
+      <section class="taskForm">
+        <el-form ref="formRef" :model="formData" :rules="formRules" label-width="80px">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="任务标题" prop="title">
+                <el-input v-model="formData.title" placeholder="请输入" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="任务周期" prop="planTime">
+                <el-date-picker
+                  v-model="formData.planTime"
+                  type="daterange"
+                  start-placeholder="选择日期"
+                  end-placeholder="选择日期"
+                  value-format="YYYY-MM-DD"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="任务类型" prop="taskType">
+                <el-select v-model="formData.taskType" placeholder="请选择">
+                  <el-option
+                    v-for="dict in getIntDictOptions(DICT_TYPE.TASK_TYPE)"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="任务描述" prop="description">
+                <el-input
+                  type="textarea"
+                  v-model="formData.description"
+                  :autosize="{ minRows: 3 }"
+                  placeholder="请输入"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </section>
+    </ContentWrap>
+  
+    <ContentWrap title="执行范围">
+      <section class="select-area">
+        <el-row :gutter="20">
+          <el-col :span="24">
+            <el-form :inline="true" :model="enterprise.queryParams">
+              <el-form-item>
+                <el-select v-model="enterprise.queryParams.region" placeholder="请选择区域" clearable>
+                  <el-option
+                    v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA)"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-select v-model="enterprise.queryParams.type" placeholder="请选择行业" clearable>
+                  <el-option
+                    v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-select v-model="enterprise.queryParams.life" placeholder="请选择生态" clearable>
+                  <el-option label="水质污染" value="1" />
+                  <el-option label="大气污染" value="2" />
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-select v-model="enterprise.queryParams.type" placeholder="请选择类型" clearable>
+                  <el-option label="危险企业" value="1" />
+                  <el-option label="一般企业" value="2" />
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-input
+                  v-model="enterprise.queryParams.enterprisesName"
+                  placeholder="请输入执法人员"
+                  clearable
+                />
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="handleQuery">
+                  <Icon icon="ep:search" /> 查询
+                </el-button>
+                <el-button @click="resetQuery">
+                  <Icon icon="ep:refresh" /> 重置
+                </el-button>
+              </el-form-item>
+            </el-form>
+          </el-col>
+        </el-row>
+  
+        <el-table :data="enterprise.list" style="width: 100%" v-loading="loading">
+          <el-table-column type="selection" width="55" />
+          <el-table-column prop="enterprisesName" label="企业名称" />
+          <el-table-column prop="region" label="区域">
+            <template #default="scope">
+              <DictTag :type="DICT_TYPE.ENTERPRISES_AREA" :value="scope.row.region" />
+            </template>
+          </el-table-column>
+          <el-table-column prop="type" label="行业" />
+          <el-table-column prop="life" label="生态" />
+          <el-table-column prop="type" label="类型" />
+          <el-table-column prop="person" label="执法人员" />
+          <el-table-column label="操作" width="100">
+            <template #default="scope">
+              <el-button link type="primary" @click="selectEnterprise(scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+  
+        <div class="pagination-container">
+          <el-pagination
+            v-model:current-page="enterprise.queryParams.pageNo"
+            v-model:page-size="enterprise.queryParams.pageSize"
+            :total="enterprise.total"
+            layout="prev, pager, next"
+          />
+        </div>
+      </section>
+    </ContentWrap>
+  
+    <ContentWrap>
+      <div class="flex justify-center gap-20px">
+        <el-button type="primary" @click="submitForm">创建任务</el-button>
+        <el-button @click="router.back()">返回列表</el-button>
+      </div>
+    </ContentWrap>
+  </template>
+  
+  <style scoped lang="scss">
+  .taskForm {
+    padding: 20px;
+    
+    .el-form {
+      .el-form-item {
+        margin-bottom: 20px;
+      }
+    }
+  }
+  
+  .select-area {
+    padding: 20px;
+  
+    .el-form {
+      margin-bottom: 20px;
+    }
+  
+    .pagination-container {
+      margin-top: 20px;
+      text-align: center;
+    }
+  }
+  
+  .el-table {
+    margin: 20px 0;
+  }
+  </style>

src/views/task/createEnterprise.vue

@@ -0,0 +1,301 @@
+<template>
+  <el-dialog
+  v-model="visible"
+  title="新增企业"
+  width="1200px"
+  :close-on-click-modal="false"
+  append-to-body
+  >
+    <div class="enterprise-container">      
+      <!-- 搜索区域 -->
+      <div class="search-area">
+        <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="0"  class="search-form">
+          <div class="form-container">
+            <el-form-item label="" prop="enterprisesName" class="form-item">
+              <el-input
+                v-model="queryParams.enterprisesName"
+                placeholder="请输入企业名称"
+              />
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="queryParams.type"
+                placeholder="请选择企业规模"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="queryParams.type"
+                placeholder="请选择企业规模"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="type" class="form-item">
+              <el-select
+                v-model="queryParams.type"
+                placeholder="请选择企业规模"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="region" class="form-item">
+              <el-select
+                v-model="queryParams.region"
+                placeholder="请选择所属区域"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="region" class="form-item">
+              <el-select
+                v-model="queryParams.region"
+                placeholder="请选择所属区域"
+              >
+                <el-option
+                  v-for="dict in getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item  class="form-item">
+              <el-button @click="handleQuery">
+                <Icon icon="ep:search" class="mr-5px" /> 搜索
+              </el-button>
+              <el-button @click="resetQuery" class="mr-10px">
+                <Icon icon="ep:refresh" class="mr-5px" /> 重置 </el-button
+              >
+            </el-form-item>
+          </div>
+        </el-form>
+      </div>
+  
+      <!-- 表格区域 -->
+      <el-table
+          ref="multipleTableRef"
+          :data="enterprise.list"
+          @selection-change="handleSelectionChange"
+          style="width: 100%; border: 1px solid #EBEEF5"
+          :cell-style="{ borderBottom: '1px solid #EBEEF5' }"
+          :header-cell-style="{ 
+            borderBottom: '1px solid #EBEEF5',
+            backgroundColor: '#F5F7FA'
+          }"
+          >
+            <el-table-column type="selection" />
+            <el-table-column property="enterprisesName" label="企业名称" />
+            <el-table-column property="region" label="区域">
+              <template #default="scope">
+                {{ getStrDictOptions(DICT_TYPE.ENTERPRISES_AREA).find(dict => dict.value == scope.row.region)?.label || '未知区域' }}
+              </template>
+          </el-table-column>
+            <el-table-column property="enterprisesName" label="行业" />
+            <el-table-column property="enterprisesName" label="生态" />
+            <el-table-column property="enterprisesName" label="类型" />
+            <el-table-column property="enterprisesName" label="执法人员" />
+          </el-table>
+  
+      <!-- 分页 -->
+      <!-- 分页 -->
+      <div class="pagination-container">
+        <pagination
+          v-show="enterprise.total > 0"
+          :total="enterprise.total"
+          :show-page-size="false"
+          size="small"
+          v-model:page="enterprise.queryParams.pageNo"
+          v-model:limit="enterprise.queryParams.pageSize"
+          @pagination="getEnterPriseList"
+        />
+      </div>
+     
+      <!-- 底部按钮 -->
+      <div class="footer">
+        <el-button type="primary" @click="confirmSelect">确认选择</el-button>
+        <el-button @click="handleClose">关闭窗口</el-button>
+      </div>
+    </div>
+  </el-dialog>
+  </template>
+  <script setup lang="ts">
+import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
+import { EnterprisesApi, EnterprisesVO } from '@/api/enterprises'
+
+
+const loading = ref(true) // 列表的加载中
+
+const emit = defineEmits(['update:modelValue', 'success'])
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const enterprise = ref({
+  list: ref<EnterprisesVO[]>(),
+  queryParams: reactive({
+    pageNo: 1,
+    pageSize: 9,
+    enterprisesName: undefined,
+    type: undefined,
+    region: undefined,
+    registrationNumber: undefined,
+    id:undefined
+  }),
+  total: ref(0)
+})
+
+const queryParams = ref({
+  enterprisesName: undefined,
+  type: '',
+  region: undefined,
+  registrationNumber: undefined,
+  id:undefined
+})
+
+
+
+// 控制弹窗显示
+
+const visible = ref(false) // 弹窗的是否展示
+
+// ... 其他变量保持不变 ...
+
+// 关闭弹窗
+const handleClose = () => {
+  visible.value = false
+}
+
+const selectedEnterprises = ref<EnterprisesVO[]>([]);
+
+const handleSelectionChange = (selectedItems: EnterprisesVO[]) => {
+  selectedEnterprises.value = selectedItems;
+}
+
+//确认选择
+const confirmSelect = () => {
+  
+}
+
+// 确认选择
+const handleConfirm = () => {
+  // TODO: 处理选择逻辑
+  visible.value = false
+  emit('success')
+}
+
+/**
+ * 获取企业列表
+ */
+ async function getEnterPriseList() {
+  loading.value = true
+  try {
+    const data = await EnterprisesApi.getEnterprisesPage(enterprise.value.queryParams)
+    enterprise.value.list = data.list
+    enterprise.value.total = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+// 打开弹窗时的初始化
+const open = async () => {
+  // TODO: 初始化数据，例如获取列表等
+  visible.value = true
+  queryParams.value = {
+    enterprisesName: undefined,
+    type: undefined, // 确保这里是 undefined
+    region: undefined,
+    registrationNumber: undefined,
+    id: undefined
+  }
+
+}
+getEnterPriseList()
+
+defineExpose({ open })
+</script>
+
+<style scoped lang="scss">
+.enterprise-container {
+  // ... 样式保持不变 ...
+
+  .search-form {
+    background-color: #fff;
+    padding: 20px 20px 0px 20px;
+    border-radius: 4px;
+    position: relative;
+    margin: 0 20px;  // 改用 margin 控制间距
+    .form-container {
+      display: grid;
+      grid-template-columns: repeat(4, 1fr);
+      gap: 24px;
+      margin-bottom: 20px;
+    }
+  
+    .form-item {
+      margin: 0;
+      width: 100%;
+      
+      :deep(.el-input),
+      :deep(.el-select) {
+        width: 100%;
+      }
+    }
+
+    .action-buttons {
+      position: absolute;
+      right: 10px;
+      bottom: 0px;
+    }
+  
+    .button-container {
+      display: flex;
+      justify-content: center;
+      gap: 8px;
+    }
+  }
+
+  .pagination-container {
+    display: flex;
+    justify-content: right;
+    margin-top: 20px; // 确保分页和按钮之间有间距
+  }
+
+  .footer {
+    display: flex;
+    justify-content: center; // 将按钮居中
+    gap: 8px; // 按钮之间的间距
+    padding-top: 20px;
+    margin-top: 20px; // 添
+  }
+
+}
+
+
+</style>

src/views/task/index.vue

@@ -294,8 +294,6 @@ const taskExec = async (data) => {
     loading.value = false
 
   }
-
-
 }
 
 //选择任务中企业范围