添加系统绑的功能

src/components/cockpit/indicatorCrossingTime/index.vue

@@ -2,7 +2,14 @@
     <div>
         <!--指标越限时间分布
          -->
-        <TableHeader :showReset="false"  :timeKeyList="prop.timeKey" ref="TableHeaderRef" @selectChange="selectChange" datePicker v-if="fullscreen">
+        <TableHeader
+            :showReset="false"
+            :timeKeyList="prop.timeKey"
+            ref="TableHeaderRef"
+            @selectChange="selectChange"
+            datePicker
+            v-if="fullscreen"
+        >
             <template v-slot:select>
                 <el-form-item label="监测点">
                     <el-select size="small" filterable v-model="tableStore.table.params.lineId">
@@ -22,7 +29,7 @@
                 :options="echartList1"
                 :style="{
                     width: prop.width,
-                      height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
+                    height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
                 }"
             />
             <!-- <my-echart
@@ -49,7 +56,7 @@ const prop = defineProps({
     h: { type: [String, Number] },
     width: { type: [String, Number] },
     height: { type: [String, Number] },
-   timeKey: { type: Array as () => string[] },
+    timeKey: { type: Array as () => string[] },
     timeValue: { type: Object },
     interval: { type: Number }
 })
@@ -146,6 +153,9 @@ const initProbabilityData = () => {
             const yAxisData = sortedData.map(item => item.indexName)
 
             echartList.value = {
+                title: {
+                    text: '指标越限概率分布'
+                },
                 options: {
                     backgroundColor: '#fff',
                     tooltip: {
@@ -166,14 +176,7 @@ const initProbabilityData = () => {
                             return tips
                         }
                     },
-                    title: {
+
-                        text: '指标越限概率分布',
-                        x: 'center',
-                        textStyle: {
-                            fontSize: 16,
-                            fontWeight: 'normal'
-                        }
-                    },
                     // 移除或隐藏 visualMap 组件
                     visualMap: {
                         show: false, // 设置为 false 隐藏右侧颜色条

src/components/cockpit/indicatorDistribution/index.vue

@@ -1,7 +1,14 @@
 <template>
     <div>
         <!--指标越限概率分布 -->
-        <TableHeader :showReset="false"  :timeKeyList="prop.timeKey" ref="TableHeaderRef" @selectChange="selectChange" datePicker v-if="fullscreen">
+        <TableHeader
+            :showReset="false"
+            :timeKeyList="prop.timeKey"
+            ref="TableHeaderRef"
+            @selectChange="selectChange"
+            datePicker
+            v-if="fullscreen"
+        >
             <template v-slot:select>
                 <el-form-item label="监测点">
                     <el-select size="small" filterable v-model="tableStore.table.params.lineId">
@@ -21,7 +28,7 @@
                 :options="echartList"
                 :style="{
                     width: prop.width,
-                      height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
+                    height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
                 }"
             />
             <!-- <my-echart
@@ -48,7 +55,7 @@ const prop = defineProps({
     h: { type: [String, Number] },
     width: { type: [String, Number] },
     height: { type: [String, Number] },
-   timeKey: { type: Array as () => string[] },
+    timeKey: { type: Array as () => string[] },
     timeValue: { type: Object },
     interval: { type: Number }
 })
@@ -145,6 +152,9 @@ const initProbabilityData = () => {
             const yAxisData = sortedData.map(item => item.indexName)
 
             echartList.value = {
+                title: {
+                    text: '指标越限概率分布'
+                },
                 options: {
                     backgroundColor: '#fff',
                     tooltip: {
@@ -165,14 +175,7 @@ const initProbabilityData = () => {
                             return tips
                         }
                     },
-                    title: {
+
-                        text: '指标越限概率分布',
-                        x: 'center',
-                        textStyle: {
-                            fontSize: 16,
-                            fontWeight: 'normal'
-                        }
-                    },
                     // 移除或隐藏 visualMap 组件
                     visualMap: {
                         show: false, // 设置为 false 隐藏右侧颜色条

src/components/cockpit/listOfMainMonitoringPoints/index.vue

@@ -100,7 +100,7 @@ const prop = defineProps({
     h: { type: [String, Number] },
     width: { type: [String, Number] },
     height: { type: [String, Number] },
-   timeKey: { type: Array as () => string[] },
+    timeKey: { type: Array as () => string[] },
     timeValue: { type: Object },
     interval: { type: Number }
 })
@@ -432,10 +432,9 @@ watch(
     }
 )
 
-onMounted(() => {
+onMounted(async () => {
-    initLineList().then(() => {
+    await initLineList()
-        initCode()
+    await initCode()
-    })
 })
 
 watch(

src/components/tree/allocation.vue

@@ -1,6 +1,6 @@
 <template>
     <div :style="{ width: menuCollapse ? '40px' : props.width }" style="transition: all 0.3s; overflow: hidden">
-        <div class="mt15 mr10" style="display: flex; justify-content: end">
+        <div class="mt10 mr10" style="display: flex; justify-content: end">
             <el-button type="primary" icon="el-icon-Select" @click="save" :loading="loading">保存</el-button>
         </div>
         <Icon
@@ -39,7 +39,7 @@
             </div>
 
             <el-tree
-                :style="{ height: 'calc(100vh - 235px)' }"
+                :style="{ height: 'calc(100vh - 267px)' }"
                 style="overflow: auto"
                 ref="treeRef"
                 :props="defaultProps"
@@ -183,5 +183,7 @@ defineExpose({ treeRef, loading })
 .custom-tree-node {
     display: flex;
     align-items: center;
+   
+
 }
 </style>

src/layouts/admin/components/navMenus.vue

@@ -47,7 +47,8 @@
                 name="fa fa-cogs"
                 size="18"
             />
-        </div> -->"
+        </div> -->
+        "
 
         <Config />
         <PopupPwd ref="popupPwd" />
@@ -71,7 +72,6 @@ import PopupPwd from './popup/password.vue'
 import AdminInfo from './popup/adminInfo.vue'
 import { useNavTabs } from '@/stores/navTabs'
 
-
 const adminInfo = useAdminInfo()
 const navTabs = useNavTabs()
 const configStore = useConfig()
@@ -106,7 +106,7 @@ const onFullScreen = () => {
     })
 }
 
-const handleCommand = (key: string) => {
+const handleCommand = async (key: string) => {
     // console.log(key)
     switch (key) {
         case 'adminInfo':
@@ -116,10 +116,13 @@ const handleCommand = (key: string) => {
             popupPwd.value.open()
             break
         case 'layout':
-            navTabs.closeTabs()
+            await window.location.reload()
-            window.localStorage.clear()
+            setTimeout(() => {
-            adminInfo.reset()
+                navTabs.closeTabs()
-            router.push({ name: 'login' })
+                window.localStorage.clear()
+                adminInfo.reset()
+                router.push({ name: 'login' })
+            }, 0)
             break
         default:
             break

src/stores/navTabs.ts

@@ -25,7 +25,6 @@ export const useNavTabs = defineStore(
         })
 
         function addTab(route: RouteLocationNormalized) {
-            console.log('🚀 ~ addTab ~ route:', route)
             if (!route.meta.addtab) return
             for (const key in state.tabsView) {
                 if (state.tabsView[key].path === route.path) {
@@ -69,7 +68,7 @@ export const useNavTabs = defineStore(
         }
 
         const setTabsViewRoutes = (data: RouteRecordRaw[]): void => {
-            state.tabsViewRoutes = encodeRoutesURI(data)
+            state.tabsViewRoutes = encodeRoutesURI(JSON.parse(JSON.stringify(data)))
         }
 
         const setAuthNode = (key: string, data: string[]) => {
@@ -89,7 +88,7 @@ export const useNavTabs = defineStore(
             // console.log(123, state.tabsViewRoutes)
 
             let list = matchAndReturnRouteData(state.tabsViewRoutes, state.tabsView)
-             state.tabsView = []
+            state.tabsView = []
             list.forEach(item => {
                 addTab(item)
             })

src/views/auth/role/index.vue

@@ -7,16 +7,34 @@
             </div>
             <Table ref="tableRef" :row-config="{ isCurrent: true, isHover: true }" @currentChange="currentChange" />
         </div>
-        <Tree
+        <div>
-            v-if="menuListId"
+            <el-tabs type="border-card">
-            ref="treeRef"
+                <el-tab-pane label="菜单">
-            show-checkbox
+                    <Tree
-            width="350px"
+                        v-if="menuListId"
-            :data="menuTree"
+                        ref="treeRef"
-            :checkStrictly="false"
+                        show-checkbox
-            @checkChange="checkChange"
+                        width="350px"
-        ></Tree>
+                        :data="menuTree"
-        <el-empty style="width: 350px; padding-top: 300px; box-sizing: border-box" description="请选择角色" v-else />
+                        :checkStrictly="false"
+                        @checkChange="checkChange"
+                    ></Tree>
+                    <el-empty
+                        style="width: 350px; padding-top: 300px; box-sizing: border-box"
+                        description="请选择角色"
+                        v-else
+                    />
+                </el-tab-pane>
+                <el-tab-pane label="系统">
+                    <div class="mt10 mr10" style="display: flex; justify-content: end">
+                        <el-button type="primary" icon="el-icon-Select" @click="saveSystem">保存</el-button>
+                    </div>
+                    <el-checkbox-group v-model="systemIds" class="md10  system" >
+                        <el-checkbox v-for="item in systemList" :label="item.name" :value="item.id" :key="item.id" />
+                    </el-checkbox-group>
+                </el-tab-pane>
+            </el-tabs>
+        </div>
         <PopupForm ref="popupRef"></PopupForm>
     </div>
 </template>
@@ -34,11 +52,14 @@ import { del } from '@/api/user-boot/role'
 import { ElMessage } from 'element-plus'
 import PopupForm from './popupForm.vue'
 import { useAdminInfo } from '@/stores/adminInfo'
-
+import { useDictData } from '@/stores/dictData'
+const dictData = useDictData()
+const systemList = dictData.getBasicData('System_Type')
 const adminInfo = useAdminInfo()
 defineOptions({
     name: 'auth/role'
 })
+const systemIds = ref([])
 const height = mainHeight(20).height
 const treeRef = ref()
 const menuTree = ref<treeData[]>([])
@@ -163,6 +184,19 @@ const checkChange = (data: any) => {
             treeRef.value.loading = false
         })
 }
+const saveSystem = () => {
+    //  updateRoleMenu({
+    //     id: menuListId.value,
+    //     idList: systemIds.value
+    // })
+    //     .then(() => {
+    //         ElMessage.success('操作成功!')
+    //         treeRef.value.loading = false
+    //     })
+    //     .catch(() => {
+    //         treeRef.value.loading = false
+    //     })
+}
 onMounted(() => {
     tableStore.index()
 })
@@ -170,3 +204,17 @@ const addRole = () => {
     popupRef.value.open('新增角色')
 }
 </script>
+
+<style lang="scss" scoped>
+:deep(.el-tabs--border-card > .el-tabs__content) {
+    padding: 0px !important;
+}
+.system{
+    width: 330px;
+    height: calc(100vh - 225px);
+     border: 1px solid var(--el-border-color);
+     padding: 5px 10px;
+    display: flex;
+    flex-direction: column;
+}
+</style>

src/views/auth/userList/index.vue

@@ -95,6 +95,7 @@ const tableStore = new TableStore({
                     },
                     click: row => {
                         popupEditRef.value.open('编辑用户', row)
+                        console.log("🚀 ~ row:", row)
                     }
                 },
                 {

src/views/auth/userList/popupEdit.vue

@@ -1,6 +1,5 @@
 <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-item label="用户名" prop="name">
                 <el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入昵称" />
@@ -9,18 +8,32 @@
                 <el-input maxlength="32" show-word-limit v-model.trim="form.loginName" placeholder="请输入登录名" />
             </el-form-item>
             <el-form-item label="默认密码" prop="password" v-if="title === '新增用户'">
-                <el-input maxlength="32" show-word-limit v-model.trim="form.password" placeholder="请输入密码" disabled />
+                <el-input
+                    maxlength="32"
+                    show-word-limit
+                    v-model.trim="form.password"
+                    placeholder="请输入密码"
+                    disabled
+                />
             </el-form-item>
             <el-form-item label="权限类型" prop="type">
                 <el-select v-model.trim="form.type" @change="changeValue" disabled placeholder="请选择权限类型">
-                    <el-option v-for="(item, index) in UserTypeOption" :label="item.label" :value="item.value"
+                    <el-option
-                        :key="index"></el-option>
+                        v-for="(item, index) in UserTypeOption"
+                        :label="item.label"
+                        :value="item.value"
+                        :key="index"
+                    ></el-option>
                 </el-select>
             </el-form-item>
             <el-form-item label="用户类型" prop="casualUser">
                 <el-select v-model.trim="form.casualUser" placeholder="请选择权限类型">
-                    <el-option v-for="(item, index) in TypeOptions" :label="item.label" :value="item.value"
+                    <el-option
-                        :key="index"></el-option>
+                        v-for="(item, index) in TypeOptions"
+                        :label="item.label"
+                        :value="item.value"
+                        :key="index"
+                    ></el-option>
                 </el-select>
             </el-form-item>
             <!-- <el-form-item label="所属部门" prop="deptId">
@@ -28,8 +41,12 @@
             </el-form-item> -->
             <el-form-item label="角色" prop="role">
                 <el-select v-model.trim="form.role" placeholder="请选择角色" multiple collapse-tags>
-                    <el-option v-for="(item, index) in roleOptions" :label="item.label" :value="item.value"
+                    <el-option
-                        :key="index"></el-option>
+                        v-for="(item, index) in roleOptions"
+                        :label="item.label"
+                        :value="item.value"
+                        :key="index"
+                    ></el-option>
                 </el-select>
             </el-form-item>
 
@@ -67,8 +84,16 @@
                         <el-radio-button :label="1">是</el-radio-button>
                         <el-radio-button :label="0">否</el-radio-button>
                     </el-radio-group>
-                    <el-input maxlength="32" show-word-limit :disabled="title !== '新增用户'" v-model.trim="form.id"
+                    <el-input
-                        placeholder="请输入用户id" v-if="useId" style="flex: 1;" class="ml10"></el-input>
+                        maxlength="32"
+                        show-word-limit
+                        :disabled="title !== '新增用户'"
+                        v-model.trim="form.id"
+                        placeholder="请输入用户id"
+                        v-if="useId"
+                        style="flex: 1"
+                        class="ml10"
+                    ></el-input>
                 </div>
             </el-form-item>
         </el-form>
@@ -201,6 +226,7 @@ const title = ref('新增菜单')
 const open = (text: string, data?: anyObj) => {
     title.value = text
     dialogVisible.value = true
+    console.log("🚀 ~ open ~ data:", data)
     if (data) {
         for (let key in form) {
             form[key] = data[key]
@@ -221,8 +247,8 @@ const open = (text: string, data?: anyObj) => {
         form.limitIpStart = '0.0.0.0'
         form.limitIpEnd = '255.255.255.255'
         form.password = '123456'
+        form.type = adminInfo.$state.userType + 1
     }
-    form.type = adminInfo.$state.userType + 1
 }
 const submit = async () => {
     let obj = JSON.parse(JSON.stringify(form))
@@ -240,6 +266,6 @@ const submit = async () => {
     dialogVisible.value = false
 }
 
-const changeValue = () => { }
+const changeValue = () => {}
 defineExpose({ open })
 </script>

src/views/pqs/cockpit/setUp/components/popup.vue

@@ -380,10 +380,11 @@ const drag = throttle(row => {
         } catch (e) {}
 
         Object.assign(item.state, {
-            top: mouseAt.y - parentRect.top,
+            top: mouseAt.y - parentRect.top - 300,
-            left: mouseAt.x - parentRect.left
+            left: mouseAt.x - parentRect.left - 180
         })
-        const newPos = item.calcXY(mouseAt.y - parentRect.top, mouseAt.x - parentRect.left)
+
+        const newPos = item.calcXY(mouseAt.y - parentRect.top - 300, mouseAt.x - parentRect.left - 180)
 
         if (mouseInGrid) {
             gridLayout.value.dragEvent('dragstart', dropId, newPos.x, newPos.y, dragItem.h, dragItem.w)
@@ -441,7 +442,7 @@ const onSubmit = () => {
     console.log(123, findDuplicateNames(layout.value))
     let repeat = findDuplicateNames(layout.value) || []
     if (repeat.length > 0) {
-        return ElMessage.warning(repeat.join('、')+' 组件重复,请删除重复组件!')
+        return ElMessage.warning(repeat.join('、') + ' 组件重复,请删除重复组件!')
     }
 
     // const maxValue = Math.max(...layout.value.map(item => item.y + item.h))

src/views/setting/dictionary/component/add.vue

@@ -31,13 +31,6 @@
                     <el-input v-model="form.path" placeholder="请输入组件路径"></el-input>
                 </el-form-item>
                 <el-form-item class="top" label="组件查询时间" prop="timeKeys">
-                    <!-- <el-radio-group v-model="form.timeKeys" style="width: 100%">
-                        <el-radio-button label="年" value="1" />
-                        <el-radio-button label="季" value="2" />
-                        <el-radio-button label="月" value="3" />
-                        <el-radio-button label="周" value="4" />
-                        <el-radio-button label="日" value="5" />
-                    </el-radio-group> -->
                     <el-checkbox-group v-model="form.timeKeys">
                         <el-checkbox-button value="1">年</el-checkbox-button>
                         <el-checkbox-button value="2">季</el-checkbox-button>
@@ -46,6 +39,17 @@
                         <el-checkbox-button value="5">日</el-checkbox-button>
                     </el-checkbox-group>
                 </el-form-item>
+                <el-form-item class="top" label="组件绑定系统" prop="systemIds">
+                    <el-select
+                        v-model="form.systemIds"
+                        multiple
+                        collapse-tags
+                        collapse-tags-tooltip
+                        placeholder="请选择组件绑定系统"
+                    >
+                        <el-option v-for="item in systemList" :key="item.id" :label="item.name" :value="item.id" />
+                    </el-select>
+                </el-form-item>
                 <el-form-item class="top" label="组件排序" prop="sort">
                     <el-input v-model.number="form.sort" placeholder="请输入组件排序"></el-input>
                 </el-form-item>
@@ -70,7 +74,7 @@
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="cancel">取消</el-button>
-                <el-button type="primary" @click="submit">保存</el-button>
+                <el-button type="primary" @click="submit" :loading="loading">保存</el-button>
             </span>
         </template>
     </el-dialog>
@@ -88,6 +92,7 @@ const dictData = useDictData()
 const dialogVisible = ref(false)
 const title = ref('')
 const formRef = ref()
+const loading = ref(false)
 // 注意不要和表单ref的命名冲突
 const form = ref<anyObj>({
     name: '',
@@ -95,6 +100,7 @@ const form = ref<anyObj>({
     system: [],
     timeKeys: ['1', '2', '3', '4', '5'],
     code: '',
+    systemIds: [],
     path: ''
 })
 const props = { label: 'name', value: 'id' }
@@ -105,11 +111,14 @@ const rules = {
     icon: [{ required: true, message: '请先择组件图标', trigger: 'change' }],
     path: [{ required: true, message: '请输入组件路径', trigger: 'blur' }],
     sort: [{ required: true, message: '请输入排序', trigger: 'blur' }],
-    timeKeys: [{ required: true, message: '请选择组件查询时间', trigger: 'change' }]
+    timeKeys: [{ required: true, message: '请选择组件查询时间', trigger: 'change' }],
+    systemIds: [{ required: true, message: '请选择组件绑定系统', trigger: 'change' }]
 }
 const customDeptOption: any = ref([])
+const systemList = dictData.getBasicData('System_Type')
 onMounted(() => {
-    customDeptOption.value = dictData.getBasicData('System_Type')
+    customDeptOption.value = dictData.getBasicData('Component_Type')
+
     customDeptOption.value.forEach((item: any) => {
         getFatherComponent({ systemType: item.id }).then(res => {
             item.children = res.data.filter(item => item.name != '无')
@@ -134,6 +143,7 @@ const submit = () => {
         if (valid) {
             let url = ''
             ElMessage.info('正在保存请稍等!')
+            loading.value = true
             setTimeout(async () => {
                 await html2canvas(document.querySelector('.GridLayout'), {
                     // scale: 2
@@ -173,6 +183,7 @@ const submit = () => {
                         cancel()
                     })
                 }
+                loading.value = false
             }, 500)
         }
     })

src/views/setting/dictionary/component/index.vue

@@ -13,11 +13,11 @@
         /> -->
         <el-tabs v-model="tableName" type="border-card" @tab-change="changeTab">
             <el-tab-pane v-for="item in tableStore.table.data" :key="item.name" :label="item.name" :name="item.name">
-                <el-tabs v-model="tableName1" tab-position="left">
+                <el-tabs v-model="tableName1" tab-position="left"  class="componentList">
                     <el-tab-pane v-for="k in item?.children" :key="k.name" :label="k.name" :name="k.name">
                         <template #label>
                             <span class="custom-tabs-label">
-                                <span>{{ k.name }}</span>
+                                <p>{{ k.name }}</p>
 
                                 <!-- <el-icon><Edit /></el-icon> -->
                                 <el-button
@@ -25,21 +25,21 @@
                                     icon="el-icon-Edit"
                                     link
                                     class="ml10"
-                                    @click="editTree(k, 0)"
+                                    @click.stop="editTree(k, 0)"
                                 ></el-button>
                                 <el-button
                                     type="danger"
                                     icon="el-icon-Delete"
                                     link
                                     class="ml0"
-                                    @click="del(k)"
+                                    @click.stop="del(k)"
                                 ></el-button>
                             </span>
                         </template>
                         <div :style="height" style="overflow-y: auto; overflow-x: hidden">
                             <el-row :gutter="10" class="pl5 pr5 pt5">
                                 <el-col :span="6" v-for="component in k.children" :key="component.id" class="mb10">
-                                    <el-card class="box-card" shadow="hover">
+                                    <el-card class="box-card"  shadow="hover">
                                         <div slot="header" class="clearfix">
                                             <span style="display: flex; align-items: center">
                                                 {{ component.name }}
@@ -50,7 +50,7 @@
                                                         icon="el-icon-Edit"
                                                         style="padding: 3px 0; color: blue"
                                                         type="text"
-                                                        @click="editTree(component, 1)"
+                                                        @click.stop="editTree(component, 1)"
                                                     >
                                                         编辑
                                                     </el-button>
@@ -58,7 +58,7 @@
                                                         icon="el-icon-Delete"
                                                         style="padding: 3px 0; color: red"
                                                         type="text"
-                                                        @click="del(component)"
+                                                        @click.stop="del(component)"
                                                     >
                                                         删除
                                                     </el-button>
@@ -356,4 +356,9 @@ span {
         min-width: 128px;
     }
 }
+:deep(.componentList){
+    .el-tabs__header{
+        height: calc(100vh - 250px)!important;
+    }
+}
 </style>