修改测试bug

src/views/auth/userList/popupEdit.vue

@@ -1,6 +1,6 @@
 <template>
     <el-dialog class="cn-operate-dialog" v-model.trim="dialogVisible" :title="title">
-        <el-form :model="form" label-width="auto" class="form-two" :rules="rules">
+        <el-form :model="form" ref="formRef" label-width="auto" class="form-two" :rules="rules">
             <el-form-item label="用户名" prop="name">
                 <el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入昵称" />
             </el-form-item>
@@ -138,6 +138,7 @@ const form = reactive({
     emailNotice: 0,
     type: 0
 })
+const formRef = ref()
 const rules: Partial<Record<string, Arrayable<FormItemRule>>> = {
     name: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
     role: [{ required: true, message: '角色不能为空', trigger: 'blur' }],
@@ -224,9 +225,10 @@ queryRole()
 const dialogVisible = ref(false)
 const title = ref('新增菜单')
 const open = (text: string, data?: anyObj) => {
+    formRef.value?.resetFields()
     title.value = text
     dialogVisible.value = true
-    console.log("🚀 ~ open ~ data:", data)
+  
     if (data) {
         for (let key in form) {
             form[key] = data[key]
@@ -251,19 +253,23 @@ const open = (text: string, data?: anyObj) => {
     }
 }
 const submit = async () => {
-    let obj = JSON.parse(JSON.stringify(form))
-    obj.limitTime = obj.limitTime.join('-')
-    delete obj.password
-    if (form.id) {
-        await edit(obj)
-        ElMessage.success('修改成功')
-    } else {
-        form.type = adminInfo.$state.userType + 1
-        await add(obj)
-        ElMessage.success('新增成功')
-    }
-    tableStore.index()
-    dialogVisible.value = false
+    formRef.value.validate(async (valid: any) => {
+        if (valid) {
+            let obj = JSON.parse(JSON.stringify(form))
+            obj.limitTime = obj.limitTime.join('-')
+            delete obj.password
+            if (form.id) {
+                await edit(obj)
+                ElMessage.success('修改成功')
+            } else {
+                form.type = adminInfo.$state.userType + 1
+                await add(obj)
+                ElMessage.success('新增成功')
+            }
+            tableStore.index()
+            dialogVisible.value = false
+        }
+    })
 }
 
 const changeValue = () => {}

src/views/govern/device/fileService/index.vue

@@ -27,7 +27,7 @@
                 <el-input
                     maxlength="32"
                     show-word-limit
-                    style="width: 200px; height: 32px"
+                    style="width: 240px; height: 32px"
                     placeholder="请输入文件或文件夹名称"
                     clearable
                     v-model.trim="filterText"

src/views/govern/manage/gplot/index.vue

@@ -1,108 +1,119 @@
-<template>
-    <div class="default-main">
-        <TableHeader>
-            <template v-slot:operation>
-                <el-upload
-                    action=""
-                    class="upload-demo"
-                    :show-file-list="false"
-                    :auto-upload="false"
-                    :on-change="chooseImage"
-                >
-                    <el-button :icon="Plus" type="primary" class="ml10">新增拓扑图</el-button>
-                </el-upload>
-            </template>
-        </TableHeader>
-        <Table ref="tableRef" />
-        <popupEdit ref="popupRef"></popupEdit>
-    </div>
-</template>
-<script setup lang="ts">
-import { Plus } from '@element-plus/icons-vue'
-import { ref, onMounted, provide } from 'vue'
-import TableStore from '@/utils/tableStore'
-import Table from '@/components/table/index.vue'
-import TableHeader from '@/components/table/header/index.vue'
-import popupEdit from './popupEdit.vue'
-import { deleteTopoTemplate, uploadTopo } from '@/api/cs-device-boot/topologyTemplate'
-import { ElMessage } from 'element-plus'
-
-defineOptions({
-    name: 'govern/manage/gplot'
-})
-const tableRef = ref()
-const popupRef = ref()
-const tableStore = new TableStore({
-    showPage: false,
-    url: '/cs-device-boot/topologyTemplate/queryImage',
-    method: 'POST',
-    column: [
-    { title: '序号',  width: 80,formatter: (row: any) => {
-        return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
-      } },
-        { title: '拓扑图模版名称', field: 'name', align: 'center' },
-        { title: '监测点数量', field: 'pointNum', align: 'center' },
-        { title: '拓扑图', field: 'filePath', align: 'center', render: 'image' },
-        {
-            title: '操作',
-            align: 'center',
-            width: '180',
-            render: 'buttons',
-            buttons: [
-                {
-                    name: 'edit',
-                    title: '编辑',
-                    type: 'primary',
-                    icon: 'el-icon-EditPen',
-                    render: 'basicButton',
-                    click: row => {
-                        popupRef.value.open( row)
-                    }
-                },
-                {
-                    name: 'del',
-                    title: '删除',
-                    type: 'danger',
-                    icon: 'el-icon-Delete',
-                    render: 'confirmButton',
-                    popconfirm: {
-                        confirmButtonText: '确认',
-                        cancelButtonText: '取消',
-                        confirmButtonType: 'danger',
-                        title: '确定删除该菜单吗？'
-                    },
-                    click: row => {
-                        deleteTopoTemplate(row.id).then(res => {
-                            ElMessage.success('删除成功')
-                            tableStore.index()
-                        })
-                    }
-                }
-            ]
-        }
-    ],
-    loadCallback: () => {
-        tableStore.table.data.forEach((item: any) => {
-            item.pointNum = item.csLineTopologyTemplateVOList.length
-        })
-    }
-})
-provide('tableStore', tableStore)
-
-onMounted(() => {
-    tableStore.table.ref = tableRef.value
-    tableStore.index()
-    tableStore.table.loading = false
-})
-const addMenu = () => {
-    // console.log(popupRef)
-    popupRef.value.open('新增菜单')
-}
-const chooseImage = e => {
-    console.warn(e)
-    uploadTopo(e.raw).then(res => {
-        ElMessage.success('新增成功')
-        tableStore.index()
-    })
-}
-</script>
+<template>
+    <div class="default-main">
+        <TableHeader>
+            <template v-slot:operation>
+                <el-upload
+                    action=""
+                    class="upload-demo"
+                    accept=".svg,.png,.jpg,.jpeg"
+                    :show-file-list="false"
+                    :auto-upload="false"
+                    :on-change="chooseImage"
+                >
+                    <el-button :icon="Plus" type="primary" class="ml10">新增拓扑图</el-button>
+                </el-upload>
+            </template>
+        </TableHeader>
+        <Table ref="tableRef" />
+        <popupEdit ref="popupRef"></popupEdit>
+    </div>
+</template>
+<script setup lang="ts">
+import { Plus } from '@element-plus/icons-vue'
+import { ref, onMounted, provide } from 'vue'
+import TableStore from '@/utils/tableStore'
+import Table from '@/components/table/index.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import popupEdit from './popupEdit.vue'
+import { deleteTopoTemplate, uploadTopo } from '@/api/cs-device-boot/topologyTemplate'
+import { ElMessage } from 'element-plus'
+
+defineOptions({
+    name: 'govern/manage/gplot'
+})
+const tableRef = ref()
+const popupRef = ref()
+const tableStore = new TableStore({
+    showPage: false,
+    url: '/cs-device-boot/topologyTemplate/queryImage',
+    method: 'POST',
+    column: [
+        {
+            title: '序号',
+            width: 80,
+            formatter: (row: any) => {
+                return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
+            }
+        },
+        { title: '拓扑图模版名称', field: 'name', align: 'center' },
+        { title: '监测点数量', field: 'pointNum', align: 'center' },
+        { title: '拓扑图', field: 'filePath', align: 'center', render: 'image' },
+        {
+            title: '操作',
+            align: 'center',
+            width: '180',
+            render: 'buttons',
+            buttons: [
+                {
+                    name: 'edit',
+                    title: '编辑',
+                    type: 'primary',
+                    icon: 'el-icon-EditPen',
+                    render: 'basicButton',
+                    click: row => {
+                        popupRef.value.open(row)
+                    }
+                },
+                {
+                    name: 'del',
+                    title: '删除',
+                    type: 'danger',
+                    icon: 'el-icon-Delete',
+                    render: 'confirmButton',
+                    popconfirm: {
+                        confirmButtonText: '确认',
+                        cancelButtonText: '取消',
+                        confirmButtonType: 'danger',
+                        title: '确定删除该菜单吗？'
+                    },
+                    click: row => {
+                        deleteTopoTemplate(row.id).then(res => {
+                            ElMessage.success('删除成功')
+                            tableStore.index()
+                        })
+                    }
+                }
+            ]
+        }
+    ],
+    loadCallback: () => {
+        tableStore.table.data.forEach((item: any) => {
+            item.pointNum = item.csLineTopologyTemplateVOList.length
+        })
+    }
+})
+provide('tableStore', tableStore)
+
+onMounted(() => {
+    tableStore.table.ref = tableRef.value
+    tableStore.index()
+    tableStore.table.loading = false
+})
+const addMenu = () => {
+    // console.log(popupRef)
+    popupRef.value.open('新增菜单')
+}
+const chooseImage = e => {
+    const isWord =
+        e.name.endsWith('.svg') || e.name.endsWith('.png') || e.name.endsWith('.jpg') || e.name.endsWith('.jpeg')
+
+    if (!isWord) {
+        return ElMessage.error('请上传图片或svg文件!')
+    }
+
+    uploadTopo(e.raw).then(res => {
+        ElMessage.success('新增成功')
+        tableStore.index()
+    })
+}
+</script>

src/views/govern/manage/gplot/popupEdit.vue

@@ -1,149 +1,154 @@
-<template>
-    <el-dialog class="cn-operate-dialog" v-model.trim="dialogVisible" title="编辑拓扑图信息">
-        <el-form :label-width="140">
-            <el-form-item label="拓扑图:" style="height: auto !important">
-                <div class="gplot-content">
-                    <VueDraggableResizable class-name-draggable="gplot-content-item"
-                        class-name-active="gplot-content-item-active" :active="editorIndex == index" :resizable="false"
-                        :parent="true" :x="item.left" :y="item.top" :w="item.width" :h="item.height"
-                        @dragStart="editorIndex = index" @dragging="resize" v-for="(item, index) in pointList"
-                        :key="index" :isResizable="false">
-                        <div class="text" style="line-height: 20px; white-space: nowrap"
-                            :style="{ color: item.name === '监测点' ? 'red' : 'black' }">
-                            {{ item.name }}
-                        </div>
-                    </VueDraggableResizable>
-                    <img :src="imgUrl" class="gplot-content"
-                        style="border: 1px solid #dcdfe6; position: unset; user-select: none" draggable="false" />
-                    <div>注意监测点不要移出圈</div>
-                </div>
-            </el-form-item>
-            <el-form-item label="监测点位置:" v-if="editorIndex > -1">
-                <div style="display: flex">
-                    <el-select v-model.trim="pointList[editorIndex].position" placeholder="请选择" style="flex: 1"
-                        @change="positionChange">
-                        <el-option v-for="item in linePosition" :key="item.id" :label="item.name"
-                            :value="item.id"></el-option>
-                    </el-select>
-                    <el-button class="ml20" type="danger" @click="deletePoint" icon="el-icon-Delete">删除</el-button>
-                </div>
-            </el-form-item>
-            <el-form-item label=" ">
-                <el-button type="primary" @click="addPoint">添加监测点</el-button>
-            </el-form-item>
-        </el-form>
-        <template #footer>
-            <span class="dialog-footer">
-                <el-button @click="dialogVisible = false">取消</el-button>
-                <el-button type="primary" @click="submit">确认</el-button>
-            </span>
-        </template>
-    </el-dialog>
-</template>
-<script lang="ts" setup>
-import { ref, inject } from 'vue'
-import { reactive } from 'vue'
-import TableStore from '@/utils/tableStore'
-import { useDictData } from '@/stores/dictData'
-import { fullUrl } from '@/utils/common'
-import VueDraggableResizable from 'vue-draggable-resizable'
-import { ElMessage } from 'element-plus'
-import { addLineTemplate } from '@/api/cs-device-boot/lineTemplate'
-
-defineOptions({
-    name: 'govern/manage/gplot/popupEdit'
-})
-const tableStore = inject('tableStore') as TableStore
-const editorIndex = ref(-1)
-const pointList = ref<any[]>([])
-const topoId = ref()
-const imgUrl = ref('')
-const linePosition = useDictData().getBasicData('Line_Position')
-
-const dialogVisible = ref(false)
-const open = (data: anyObj) => {
-    pointList.value = data.csLineTopologyTemplateVOList.map((item: any) => {
-        return {
-            name: linePosition.find(item2 => {
-                return item2.id == item.linePostion
-            })?.name,
-            position: item.linePostion,
-            width: 'auto',
-            height: 20,
-            top: item.lng,
-            left: item.lat
-        }
-    })
-    topoId.value = data.id
-    imgUrl.value = fullUrl(data.filePath)
-    dialogVisible.value = true
-}
-
-const positionChange = (e: string) => {
-    pointList.value[editorIndex.value].name = linePosition.find((item: any) => {
-        return item.id == e
-    })?.name
-}
-const resize = (left: number, top: number) => {
-    const dom = pointList.value[editorIndex.value]
-    dom.left = left
-    dom.top = top
-}
-const addPoint = () => {
-    pointList.value.push({
-        name: '监测点',
-        position: '',
-        width: 'auto',
-        height: 20,
-        top: 100,
-        left: 100
-    })
-    editorIndex.value = pointList.value.length - 1
-}
-const deletePoint = () => {
-    pointList.value.splice(editorIndex.value, 1)
-    editorIndex.value = -1
-}
-const submit = async () => {
-    let allSelect = pointList.value.some(item => item.position === '')
-    if (allSelect) {
-        ElMessage.warning('请完善所有监测点位置')
-        return
-    }
-    let arr = pointList.value.map(item => {
-        return {
-            linePostion: item.position,
-            lat: item.left,
-            lng: item.top,
-            topoId: topoId.value
-        }
-    })
-    addLineTemplate(arr).then(res => {
-        ElMessage.success('保存成功')
-        tableStore.index()
-        dialogVisible.value = false
-    })
-}
-
-defineExpose({ open })
-</script>
-
-<style lang="scss">
-@import 'vue-draggable-resizable/style.css';
-
-.gplot-content {
-    position: relative;
-    width: 375px;
-    object-fit: cover;
-    overflow: hidden;
-
-    .gplot-content-item {
-        border-color: transparent;
-        cursor: move;
-
-        &-active {
-            border-color: red;
-        }
-    }
-}
-</style>
+<template>
+    <el-dialog class="cn-operate-dialog" v-model.trim="dialogVisible" title="编辑拓扑图信息">
+        <el-form :label-width="140">
+            <el-form-item label="拓扑图:" style="height: auto !important">
+                <div class="gplot-content">
+                    <VueDraggableResizable class-name-draggable="gplot-content-item"
+                        class-name-active="gplot-content-item-active" :active="editorIndex == index" :resizable="false"
+                        :parent="true" :x="item.left" :y="item.top" :w="item.width" :h="item.height"
+                        @dragStart="editorIndex = index" @dragging="resize" v-for="(item, index) in pointList"
+                        :key="index" :isResizable="false">
+                        <div class="text" style="line-height: 20px; white-space: nowrap"
+                            :style="{ color: item.name === '监测点' ? 'red' : 'black' }">
+                            {{ item.name }}
+                        </div>
+                    </VueDraggableResizable>
+                    <img :src="imgUrl" class="gplot-content"
+                        style="border: 1px solid #dcdfe6; position: unset; user-select: none" draggable="false" />
+                    <div>注意监测点不要移出圈</div>
+                </div>
+            </el-form-item>
+            <el-form-item label="监测点位置:" v-if="editorIndex > -1">
+                <div style="display: flex">
+                    <el-select v-model.trim="pointList[editorIndex].position" placeholder="请选择" style="flex: 1"
+                        @change="positionChange">
+                        <el-option v-for="item in linePosition" :key="item.id" :label="item.name"
+                            :value="item.id"></el-option>
+                    </el-select>
+                    <el-button class="ml20" type="danger" @click="deletePoint" icon="el-icon-Delete">删除</el-button>
+                </div>
+            </el-form-item>
+            <el-form-item label=" ">
+                <el-button type="primary" @click="addPoint">添加监测点</el-button>
+            </el-form-item>
+        </el-form>
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="dialogVisible = false">取消</el-button>
+                <el-button type="primary" @click="submit">确认</el-button>
+            </span>
+        </template>
+    </el-dialog>
+</template>
+<script lang="ts" setup>
+import { ref, inject } from 'vue'
+import { reactive } from 'vue'
+import TableStore from '@/utils/tableStore'
+import { useDictData } from '@/stores/dictData'
+import { fullUrl } from '@/utils/common'
+import VueDraggableResizable from 'vue-draggable-resizable'
+import { ElMessage } from 'element-plus'
+import { addLineTemplate } from '@/api/cs-device-boot/lineTemplate'
+
+defineOptions({
+    name: 'govern/manage/gplot/popupEdit'
+})
+const tableStore = inject('tableStore') as TableStore
+const editorIndex = ref(-1)
+const pointList = ref<any[]>([])
+const topoId = ref()
+const imgUrl = ref('')
+const linePosition = useDictData().getBasicData('Line_Position')
+
+const dialogVisible = ref(false)
+const open = (data: anyObj) => {
+    pointList.value = data.csLineTopologyTemplateVOList.map((item: any) => {
+        return {
+            name: linePosition.find(item2 => {
+                return item2.id == item.linePostion
+            })?.name,
+            position: item.linePostion,
+            width: 'auto',
+            height: 20,
+            top: item.lng,
+            left: item.lat
+        }
+    })
+    topoId.value = data.id
+    imgUrl.value = fullUrl(data.filePath)
+    dialogVisible.value = true
+}
+
+const positionChange = (e: string) => {
+    pointList.value[editorIndex.value].name = linePosition.find((item: any) => {
+        return item.id == e
+    })?.name
+}
+const resize = (left: number, top: number) => {
+    const dom = pointList.value[editorIndex.value]
+    dom.left = left
+    dom.top = top
+}
+const addPoint = () => {
+    pointList.value.push({
+        name: '监测点',
+        position: '',
+        width: 'auto',
+        height: 20,
+        top: 100,
+        left: 100
+    })
+    editorIndex.value = pointList.value.length - 1
+}
+const deletePoint = () => {
+    pointList.value.splice(editorIndex.value, 1)
+    editorIndex.value = -1
+}
+const submit = async () => {
+    let allSelect = pointList.value.some(item => item.position === '')
+
+    if (pointList.value.length == 0) {
+        ElMessage.warning('请添加监测点！')
+        return
+    }
+    if (allSelect) {
+        ElMessage.warning('请完善所有监测点位置！')
+        return
+    }
+    let arr = pointList.value.map(item => {
+        return {
+            linePostion: item.position,
+            lat: item.left,
+            lng: item.top,
+            topoId: topoId.value
+        }
+    })
+    addLineTemplate(arr).then(res => {
+        ElMessage.success('保存成功')
+        tableStore.index()
+        dialogVisible.value = false
+    })
+}
+
+defineExpose({ open })
+</script>
+
+<style lang="scss">
+@import 'vue-draggable-resizable/style.css';
+
+.gplot-content {
+    position: relative;
+    width: 375px;
+    object-fit: cover;
+    overflow: hidden;
+
+    .gplot-content-item {
+        border-color: transparent;
+        cursor: move;
+
+        &-active {
+            border-color: red;
+        }
+    }
+}
+</style>

src/views/govern/sensitiveLoadMange/index.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="default-main">
-        <TableHeader date-picker>
+        <TableHeader :showReset="false">
             <template #operation>
                 <el-button :icon="Plus" type="primary" @click="addMenu" class="ml10">新增</el-button>
             </template>
@@ -21,7 +21,7 @@ import { Plus } from '@element-plus/icons-vue'
 import { useDictData } from '@/stores/dictData'
 
 defineOptions({
-    name: 'govern/device/sensitiveLoadMange'
+    name: 'govern/sensitiveLoadMange/index'
 })
 const detail = ref()
 

src/views/govern/setting/statisticalType/add.vue

@@ -1,15 +1,14 @@
 <template>
     <el-dialog width="500px" v-model.trim="dialogVisible" :title="title">
-
-        <el-form :model="form" class="form-one" label-width="auto">
-            <el-form-item label="名称">
+        <el-form :model="form" ref="formRef" class="form-one" label-width="auto" :rules="rules">
+            <el-form-item label="名称" prop="name">
                 <el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入名称" />
             </el-form-item>
-            <el-form-item label="编码">
+            <el-form-item label="编码" prop="code">
                 <el-input maxlength="32" show-word-limit v-model.trim="form.code" placeholder="请输入编码" />
             </el-form-item>
-            <el-form-item label="类型" v-if="title == '新增'|| title == '编辑'">
-                <el-select v-model.trim="form.type" placeholder="请选择类型">
+            <el-form-item label="类型" v-if="title == '新增' || title == '编辑'" >
+                <el-select v-model.trim="form.type" placeholder="请选择类型" clearable>
                     <el-option v-for="item in options" :key="item.value" :label="item.name" :value="item.value" />
                 </el-select>
             </el-form-item>
@@ -17,10 +16,9 @@
                 <el-input maxlength="32" show-word-limit v-model.trim="form.remark" placeholder="请输入备注" />
             </el-form-item>
 
-            <el-form-item label="排序">
+            <el-form-item label="排序" prop="sort">
                 <el-input maxlength="32" show-word-limit-number v-model.trim="form.sort" :min="0" />
             </el-form-item>
-
         </el-form>
 
         <template #footer>
@@ -49,29 +47,35 @@ const form = reactive({
     name: '',
     code: '',
     remark: '',
-    // type: 2,
+    type: 2,
     sort: 100,
     pid: '',
     id: ''
 })
+const formRef = ref()
+const rules = {
+    name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
+    code: [{ required: true, message: '请输入编码', trigger: 'blur' }],
+    sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
+}
 const options = ref([
     { name: '通用指标', value: 2 },
     { name: 'APF模块', value: 3 },
     { name: '星型接线', value: 4 },
     { name: '角型接线', value: 5 },
     { name: 'V型接线', value: 6 },
-    { name: '驾驶舱指标', value: 7 },
+    { name: '驾驶舱指标', value: 7 }
 ])
 
 const dialogVisible = ref(false)
 const title = ref('新增菜单')
 const open = (text: string, data?: anyObj) => {
+    formRef.value?.resetFields()
     title.value = text
     for (let key in form) {
         form[key] = data ? data[key] : ''
 
         if (key == 'sort') {
-
             form[key] = data?.sort ? data[key] : 100
             // console.log("🚀 ~ open ~ form[key]:", form[key])
         }
@@ -80,28 +84,24 @@ const open = (text: string, data?: anyObj) => {
 }
 const submit = async () => {
     // 非空校验
-    for (let key in form) {
-        if (key != 'pid' && key != 'id' && key != 'sort') {
-            if (!form[key]) {
-                ElMessage.warning('请填写完整信息')
-                return
+    formRef.value.validate(async valid => {
+        if (valid) {
+            if (form.id) {
+                await updateStatistical(form).then(res => {
+                    ElMessage.success('编辑成功')
+                })
+            } else {
+                if (!form.pid) {
+                    form.pid = tableStore.table.params.pid
+                }
+                await addDictTree(form).then(res => {
+                    ElMessage.success('新增成功')
+                })
             }
+            emits('over')
+            dialogVisible.value = false
         }
-    }
-    if (form.id) {
-        await updateStatistical(form).then(res => {
-            ElMessage.success('编辑成功')
-        })
-    } else {
-        if (!form.pid) {
-            form.pid = tableStore.table.params.pid
-        }
-        await addDictTree(form).then(res => {
-            ElMessage.success('新增成功')
-        })
-    }
-    emits('over')
-    dialogVisible.value = false
+    })
 }
 
 defineExpose({ open })