完善代码

ipsomcadmin/src/directives/dragdialog.js

@@ -1,43 +1,46 @@
 //拖动对话框
 export default {
     bind(el, binding, vnode) {
-        const dialogEl = el.querySelector('.el-dialog');
-        const headerEl = el.querySelector('.el-dialog__header');
+        const dialogEl = el.querySelector('.el-dialog')
+        const headerEl = el.querySelector('.el-dialog__header')
 
-        let dragging = false;
-        let dragStart = { x: 0, y: 0 };
-        let dialogStart = { top: 0, left: 0 };
+        let dragging = false
+        let dragStart = { x: 0, y: 0 }
+        let dialogStart = { top: 0, left: 0 }
 
+        //向对话框注册鼠标按下事件
         headerEl.addEventListener('mousedown', (event) => {
-            dragging = true;
-            dragStart.x = event.clientX;
-            dragStart.y = event.clientY;
-            const rect = dialogEl.getBoundingClientRect();
-            dialogStart.top = rect.top + window.scrollY;
-            dialogStart.left = rect.left + window.scrollX;
-            document.body.style.userSelect = 'none'; // 禁止文本选择
-        });
+            if (event.button === 0) {//按下的是左键
+                dragging = true;
+                dragStart.x = event.clientX
+                dragStart.y = event.clientY
+                const rect = dialogEl.getBoundingClientRect()
+                dialogStart.top = rect.top + window.scrollY
+                dialogStart.left = rect.left + window.scrollX
+                document.body.style.userSelect = 'none'; // 禁止文本选择
+            }
+        })
 
         document.addEventListener('mousemove', (event) => {
             if (dragging) {
-                const deltaX = event.clientX - dragStart.x - 390;
-                const deltaY = event.clientY - dragStart.y - 110;
-                dialogEl.style.top = `${dialogStart.top + deltaY}px`;
-                dialogEl.style.left = `${dialogStart.left + deltaX}px`;
+                const deltaX = event.clientX - dragStart.x - 400
+                const deltaY = event.clientY - dragStart.y - 110
+                dialogEl.style.top = `${dialogStart.top + deltaY}px`
+                dialogEl.style.left = `${dialogStart.left + deltaX}px`
             }
-        });
+        })
 
         document.addEventListener('mouseup', () => {
-            dragging = false;
-            document.body.style.userSelect = ''; // 恢复文本选择
-        });
+            dragging = false
+            document.body.style.userSelect = '' // 恢复文本选择
+        })
 
         // 在组件销毁时移除事件监听器
         el._removeDragListeners = () => {
-            headerEl.removeEventListener('mousedown', startDrag);
-            document.removeEventListener('mousemove', onDrag);
-            document.removeEventListener('mouseup', stopDrag);
-        };
+            headerEl.removeEventListener('mousedown', startDrag)
+            document.removeEventListener('mousemove', onDrag)
+            document.removeEventListener('mouseup', stopDrag)
+        }
 
         // 使用 Vue 的 onBeforeUnmount 钩子（或在 Vue 2 中使用 destroyed 钩子）来移除监听器
         //vnode.context.$once('hook:beforeUnmount', el._removeDragListeners);

ipsomcadmin/src/views/bparam/component/netparamdlg.vue

@@ -18,8 +18,9 @@
             -webkit-box-sizing: border-box;
             -moz-box-sizing: border-box;
             box-sizing: border-box;
-            padding-left: 15px;
+            padding-left: 10px;
             text-align: right;
+            font-size: 12px;
         }
     }
 }
@@ -59,13 +60,28 @@
             <el-form-item label="wifi密码">
                 <el-input v-model="dialogData.editData.data.wifi_pwd" auto-complete="off"></el-input>
             </el-form-item>
-            <el-form-item label="管理中心IP">
-                <el-input v-model="dialogData.editData.data.service_ip" auto-complete="off"></el-input>
+            <el-form-item label="管理中心URL">
+                <div class="netparamdlg">
+                    <div class="netparamdlg__item">
+                        <div class="netparamdlg__item-left">
+                            <el-input v-model="dialogData.editData.data.service_ip" auto-complete="off"
+                                placeholder="www.xxx.com或者ip地址"></el-input>
+                        </div>
+                        <div class="netparamdlg__item-right">管理中心的域名或者IP地址</div>
+                    </div>
+                </div>
             </el-form-item>
             <el-form-item label="管理中心端口">
-                <el-input-number :precision="0" :step="1" :min="100"
-                    v-model.trim="dialogData.editData.data.service_port" auto-complete="off"
-                    style="width:100%"></el-input-number>
+                <div class="netparamdlg">
+                    <div class="netparamdlg__item">
+                        <div class="netparamdlg__item-left">
+                            <el-input-number :precision="0" :step="1" :min="0"
+                                v-model.trim="dialogData.editData.data.service_port" auto-complete="off"
+                                style="width:100%"></el-input-number>
+                        </div>
+                        <div class="netparamdlg__item-right">管理中心在此端口监听链接</div>
+                    </div>
+                </div>
             </el-form-item>
         </el-form>
         <div style="padding-top: 10px;text-align:right">
@@ -115,7 +131,7 @@ export default {
                         wifi_name: '',
                         wifi_pwd: '',
                         service_ip: '',
-                        service_port: 0
+                        service_port: 80
                     },
                     rules: {
                     }