Merge branch 'master' of http://192.168.1.22:3000/frontend/pqs-9100_client

frontend/src/views/authority/resource/components/ResourceDialog.vue

@@ -0,0 +1,82 @@
+<template>
+    <el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogSmall">
+      <el-form :model="formData" :rules="rules">
+        <el-form-item label="菜单名称" prop="name">
+          <el-input v-model="formData.name" />
+        </el-form-item>
+        <el-form-item label="菜单路径" prop="path">
+          <el-input v-model="formData.path" />
+        </el-form-item>
+        <el-form-item label="菜单排序" prop="sort">
+          <el-input-number v-model="formData.sort" />
+        </el-form-item>
+        <el-form-item label="菜单类型" prop="type">
+          <el-select v-model="formData.type" placeholder="请选择资源类型">
+            <el-option label="菜单" value="菜单" />
+            <el-option label="按钮" value="按钮" />
+            <el-option label="公共资源" value="公共资源" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="菜单描述" prop="remark">
+          <el-input v-model="formData.remark" :rows="2" type="textarea"/>
+        </el-form-item>
+        <el-form-item label="路由名称" prop="route_Name">
+          <el-input v-model="formData.route_Name" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="handleCancel">取 消</el-button>
+          <el-button type="primary" @click="handleSubmit">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </template>
+  
+  <script lang="ts" setup name="ResourceDialog">
+  import { defineProps, defineEmits, reactive,watch } from 'vue';
+  import { dialogSmall } from '@/utils/elementBind'
+  const props = defineProps<{
+    visible: boolean;
+    dialogTitle: string;
+    
+    formData: {
+      
+      id:string;
+      name: string;
+      path: string;
+      sort: number;
+      type: string;
+      remark: string;
+      route_Name: string;
+    };
+  }>();
+  
+  const rules = {
+          name :[
+            {require:true,trigger:"blur",message:"请填写菜单名称"}
+          ]
+  }
+  const emit = defineEmits<{
+    (e: 'update:visible', value: boolean): void;
+    (e: 'submit', data: any): void;
+  }>();
+  
+  const handleCancel = () => {
+    emit('update:visible', false); // 关闭对话框
+  };
+  
+  const handleSubmit = () => {
+    emit('submit', props.formData); // 提交表单数据
+    emit('update:visible', false); // 提交后关闭对话框
+  };
+  
+  // 当 props.visible 改变时，更新 formData
+  watch(() => props.visible, (newVal) => {
+    if (!newVal) {
+      // 这里可以重置表单数据，如果需要的话
+     
+    }
+  });
+  </script>
+  

frontend/src/views/authority/resource/index.vue

@@ -39,13 +39,12 @@
   import { defineComponent,ref ,reactive} from 'vue'
   import { type Resource } from '@/api/resource/interface'
   import ProTable from '@/components/ProTable/index.vue'
-  import ResourceDialog from '@/components/ResourceDialog/index.vue'; // 导入子组件
-  import {Operation, CirclePlus, Delete, EditPen, Download, Upload, View, Refresh} from '@element-plus/icons-vue'
+  import ResourceDialog from "@/views/authority/resource/components/ResourceDialog.vue"; // 导入子组件
+  import {CirclePlus, Delete, EditPen} from '@element-plus/icons-vue'
   import resourceDataList from '@/api/resource/resourceData'
-  import { useDictStore } from '@/stores/modules/dict'
   import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
-import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
-    let multipleSelection = ref<string[]>([]);
+  import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
+  let multipleSelection = ref<string[]>([]);
   const resourceData = resourceDataList
   const dialogFormVisible = ref(false)
   const isEditMode = ref(false);
@@ -70,17 +69,18 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
     {
       prop: 'name',
       label: '名称',
-      width: 120,
+      width: 150,
       search: { el: 'input', tooltip: '我是搜索提示' },
     },
     {
       prop: 'path',
       label: '路径',
-      width: 180,
+      width: 300,
     },
     {
       prop: 'sort',
       label: '排序',
+      width: 100,
       search: {
       // 自定义 search 显示内容
       render: ({ searchParam }) => {
@@ -90,6 +90,7 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
             <span class='mr10 ml10'>-</span>
             <el-input vModel_trim={searchParam.maxAge} placeholder='最大排序' />
           </div>
+         
         )
       },
     },
@@ -97,13 +98,31 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
     {
       prop: 'type',
       label: '资源类型',
+      width: 150,
       // 字典数据（本地数据）
       //enum: dictStore.getDictData('type'),
-      search: { el: 'select', props: { filterable: true } },
+      //search: { el: 'select', props: { filterable: true } },
       //fieldNames: { label: 'label', value: 'resourceType' },
+      search: {
+      // 自定义 search 显示内容
+      render: ({ searchParam }) => {
+        return (
+          <div class='flx-center'>
+            <el-select >
+              <el-option ></el-option>
+              <el-option label="未检测"></el-option>
+              <el-option label="检测中"></el-option>
+              <el-option label="检测完成"></el-option>
+            </el-select>
+          </div>
+         
+        )
+      },
+    },
     },
     {
       prop: 'route_Name',
+      width: 200,
       label: '路由名称',
       search: { el: 'input' },
     },
@@ -121,11 +140,7 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
       prop: 'update_Time',
       label: '更新时间',
       width: 180,
-      search: {
-      el: 'date-picker',
-      span: 1,
-      props: { type: 'daterange', valueFormat: 'YYYY-MM-DD'},
-      defaultValue: ['2024-11-12', '2024-12-12'],}
+      
     },
     { prop: 'operation', label: '操作', fixed: 'right', width: 200 },
   ])
@@ -166,7 +181,7 @@ const submitForm = () => {
 const openEditDialog = (resource: Resource.ResResourceList) => {
   dialogForm.value = { ...resource }; // 复制资源数据以便编辑
   isEditMode.value = true; // 设置为编辑模式
-  dialogTitle.value = '编辑资源';
+  dialogTitle.value = '编辑菜单';
   dialogFormVisible.value = true; // 显示对话框
 };
  //选中
@@ -177,9 +192,21 @@ const openEditDialog = (resource: Resource.ResResourceList) => {
   };
   //批量删除
   const handleDelList =()=>{
+    ElMessageBox.confirm(
+    `是否删除所选菜单信息？`, // 使用模板字符串来插值
+    '温馨提示',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
       resourceData.value = resourceData.value.filter(item => !multipleSelection.value.includes(item.id));
       multipleSelection.value = []; // Clear selected rows
       ElMessage.success("批量删除成功");
+    })
+     
   }
 // 删除资源
 const deleteResource = (params: Resource.ResResourceList) => {