修改代码中服务器api根路径引用方式，增加服务器根路径的空配置的兼容，避免部署其他服务器时候需要改配置才行的问题

.env.development

@@ -1,13 +1,13 @@
 # 本地环境
 ENV = 'development'
 
-# 本地环境接口地址
-VITE_SERVER_URL =  'http://zhgy.sagoo.cn:8899'
-VITE_API_URL = 'http://zhgy.sagoo.cn:8899/api/v1'
-VITE_IMG_URL = 'http://zhgy.sagoo.cn:8899/'
-VITE_ASSESS_URL = 'http://zhgy.sagoo.cn/base-api/assess/v1'
-VITE_SCREEN_URL = 'http://home.yanglizhi.cn:10003'
-VITE_TOPO_URL = 'http://home.yanglizhi.cn:10001'
-VITE_WS_URL = 'ws://zhgy.sagoo.cn:8899/api/v1/websocket'
-#VITE_API_URL = 'http://sgadserver.wdeveloperw.xyz/api/v1'
-# VITE_IMG_URL = 'http://sgadserver.wdeveloperw.xyz/'
+# 线上环境接口地址
+# VITE_SERVER_PROTOCOL = 'http:'
+# VITE_SERVER_HOSTNAME = 'sgadserver.wdeveloperw.xyz'
+VITE_SERVER_PROTOCOL = 'http:'
+VITE_SERVER_HOSTNAME = 'zhgy.sagoo.cn'
+VITE_SERVER_URL = ':8899'
+VITE_API_URL = ':8899/api/v1'
+VITE_ASSESS_URL = '/base-api/assess/v1'
+VITE_SCREEN_URL = '/plugin/screen/'
+VITE_TOPO_URL = '/plugin/topo/'

.env.production

@@ -5,10 +5,12 @@ ENV = 'production'
 VITE_PUBLIC_PATH = /
 
 # 线上环境接口地址
-VITE_SERVER_URL =  'http://zhgy.sagoo.cn:8899'
-VITE_API_URL = 'http://zhgy.sagoo.cn:8899/api/v1'
-VITE_IMG_URL = 'http://zhgy.sagoo.cn:8899/'
-VITE_ASSESS_URL = 'http://zhgy.sagoo.cn/base-api/assess/v1'
+VITE_SERVER_PROTOCOL = ''
+VITE_SERVER_HOSTNAME = ''
+# VITE_SERVER_PROTOCOL = 'http:'
+# VITE_SERVER_HOSTNAME = 'zhgy.sagoo.cn'
+VITE_SERVER_URL = ':8899'
+VITE_API_URL = ':8899/api/v1'
+VITE_ASSESS_URL = '/base-api/assess/v1'
 VITE_SCREEN_URL = '/plugin/screen/'
-VITE_TOPO_URL = '/plugin/topo/'
-VITE_WS_URL = 'ws://zhgy.sagoo.cn:8899/api/v1/websocket'
+VITE_TOPO_URL = '/plugin/topo/'

src/components/upload/index.vue

@@ -1,35 +1,37 @@
 <template>
-  <div class="upload">
-    <el-upload v-model:file-list="fileList" :class="{hide:fileList.length>=limit}" :accept="accept" list-type="picture-card" :limit="limit" :multiple="multiple" :headers="headers" :before-upload="beforeAvatarUpload" :action="uploadUrl" :on-success="updateImg" :on-preview="handlePictureCardPreview" :on-remove="updateImg">
-      <el-icon>
-        <ele-Plus />
-      </el-icon>
-    </el-upload>
-    <el-dialog v-model="dialogVisible">
-      <img class="preview" :src="dialogImageUrl" alt="Preview Image" />
-    </el-dialog>
-
-    <!-- 上传单张图片 -->
-    <!-- <uploadVue @set-img="youImg=$event" ></uploadVue> -->
+	<div class="upload">
+		<el-upload v-model:file-list="fileList" :class="{ hide: fileList.length >= limit }" :accept="accept" list-type="picture-card" :limit="limit" :multiple="multiple" :headers="headers" :before-upload="beforeAvatarUpload" :action="uploadUrl"
+			:on-success="updateImg" :on-preview="handlePictureCardPreview" :on-remove="updateImg">
+			<el-icon>
+				<ele-Plus />
+			</el-icon>
+		</el-upload>
+		<el-dialog v-model="dialogVisible">
+			<img class="preview" :src="dialogImageUrl" alt="Preview Image" />
+		</el-dialog>
+
+		<!-- 上传单张图片 -->
+		<!-- <uploadVue @set-img="youImg=$event" ></uploadVue> -->
 
 		<!-- 上传多长图片 需增加limit属性，设定图片最多张数 -->
-    <!-- <uploadVue @set-imgs="youImgs=$event" :limit="2"></uploadVue> -->
+		<!-- <uploadVue @set-imgs="youImgs=$event" :limit="2"></uploadVue> -->
 
-    <!-- 上传单张图片，img属性可以恢复表单图片显示 -->
-    <!-- <uploadVue img="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" @set-img="youImg=$event"></uploadVue> -->
+		<!-- 上传单张图片，img属性可以恢复表单图片显示 -->
+		<!-- <uploadVue img="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" @set-img="youImg=$event"></uploadVue> -->
 
-    <!-- 上传多张图片，imgs属性可以恢复表单图片多图显示 需增加limit属性，设定图片最多张数 -->
-    <!-- <uploadVue :imgs="['https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png']" @set-imgs="youImgs=$event" :limit="2"></uploadVue> -->
-		
-  </div>
+		<!-- 上传多张图片，imgs属性可以恢复表单图片多图显示 需增加limit属性，设定图片最多张数 -->
+		<!-- <uploadVue :imgs="['https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png']" @set-imgs="youImgs=$event" :limit="2"></uploadVue> -->
+
+	</div>
 </template>
 
 <script lang="ts" setup>
 import { ref, PropType, watch } from 'vue';
 import { ElMessage } from 'element-plus';
 import type { UploadProps } from 'element-plus';
+import getOrigin from '/@/utils/origin'
 
-const uploadUrl: string = import.meta.env.VITE_API_URL + '/common/singleImg';
+const uploadUrl: string = getOrigin(import.meta.env.VITE_API_URL + '/common/singleImg');
 
 const headers = {
 	Authorization: 'Bearer ' + JSON.parse(sessionStorage.token),
@@ -70,7 +72,7 @@ const fileList = ref<any[]>([
 const updateImg = () => {
 	const list = fileList.value.map((item) => {
 		if (item.response) {
-			return import.meta.env.VITE_IMG_URL + item.response?.data?.path;
+			return getOrigin(import.meta.env.VITE_SERVER_URL + '/' + item.response?.data?.path);
 			// return item.response?.data?.path;
 		} else {
 			return item.url;
@@ -129,6 +131,7 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
 .hide ::v-deep(.el-upload--picture-card) {
 	display: none;
 }
+
 .preview {
 	max-width: 100%;
 	max-height: 60vh;

src/utils/common.ts

@@ -1,19 +1,20 @@
+import getOrigin from '/@/utils/origin'
 /**
  * 通用js方法封装处理
  */
 
-const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
+const baseURL: string | undefined | boolean = getOrigin(import.meta.env.VITE_API_URL)
 
 
-export function getUpFileUrl(url:string){
-    if(!url){
+export function getUpFileUrl(url: string) {
+    if (!url) {
         return url
     }
     if (/^http|^blob/i.test(url)) {
         return url
     }
     let reg = new RegExp('^/*' + baseURL + "/*");
-    return baseURL+"/"+url.replace(reg,'')
+    return baseURL + "/" + url.replace(reg, '')
 }
 
 
@@ -26,7 +27,7 @@ export function getUpFileUrl(url:string){
  * @param {*} children 孩子节点字段 默认 'children'
  * @param {*} rootId 根Id 默认 0
  */
-export function handleTree(data:[], id:string, parentId:string, children:string, rootId:number) {
+export function handleTree(data: [], id: string, parentId: string, children: string, rootId: number) {
     id = id || 'id'
     parentId = parentId || 'parentId'
     children = children || 'children'
@@ -34,8 +35,8 @@ export function handleTree(data:[], id:string, parentId:string, children:string,
     //对源数据深度克隆
     const cloneData = JSON.parse(JSON.stringify(data))
     //循环所有项
-    const treeData =  cloneData.filter((father:any) => {
-        let branchArr = cloneData.filter((child:any) => {
+    const treeData = cloneData.filter((father: any) => {
+        let branchArr = cloneData.filter((child: any) => {
             //返回每一项的子级数组
             return father[id] === child[parentId]
         });
@@ -48,8 +49,8 @@ export function handleTree(data:[], id:string, parentId:string, children:string,
 
 
 // 回显数据字典
-export function selectDictLabel(data:any[], value:string):string {
-    let actions:string[]=[]
+export function selectDictLabel(data: any[], value: string): string {
+    let actions: string[] = []
     data.map((item) => {
         if (item.value == value) {
             actions.push(item.label);

src/utils/origin.ts

@@ -0,0 +1,19 @@
+export default function getOrigin(suffix: string = '', type: string = 'http') {
+  if (type === 'ws') {
+    if (import.meta.env.VITE_SERVER_PROTOCOL === 'https:') {
+      return `wss//${import.meta.env.VITE_SERVER_HOSTNAME}${suffix}`
+    } else if (!import.meta.env.VITE_SERVER_PROTOCOL) {
+      if (window.location.protocol === 'https:') {
+        return `wss//${window.location.hostname}${suffix}`
+      }
+    }
+    return `ws//${import.meta.env.VITE_SERVER_HOSTNAME}${suffix}`
+  }
+
+
+  if (import.meta.env.VITE_SERVER_HOSTNAME) {
+    return `${import.meta.env.VITE_SERVER_PROTOCOL}//${import.meta.env.VITE_SERVER_HOSTNAME}${suffix}`
+  } else {
+    return `${window.location.protocol}//${window.location.hostname}${suffix}`
+  }
+}

src/utils/request.ts

@@ -1,10 +1,11 @@
 import axios from 'axios';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { Session } from '/@/utils/storage';
+import getOrigin from '/@/utils/origin'
 
 // 配置新建一个 axios 实例
 const service = axios.create({
-	baseURL: import.meta.env.VITE_API_URL,
+	baseURL: getOrigin(import.meta.env.VITE_API_URL),
 	timeout: 50000,
 	headers: { 'Content-Type': 'application/json' },
 });

src/utils/request_assess.ts

@@ -1,10 +1,11 @@
 import axios from 'axios';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { Session } from '/@/utils/storage';
+import getOrigin from '/@/utils/origin'
 
 // 配置新建一个 axios 实例
 const service = axios.create({
-	baseURL: import.meta.env.VITE_ASSESS_URL,
+	baseURL: getOrigin(import.meta.env.VITE_ASSESS_URL),
 	timeout: 50000,
 	headers: { 'Content-Type': 'application/json' },
 });
@@ -51,7 +52,7 @@ service.interceptors.response.use(
 				}
 			}
 			if (res.data?.Data) {
-				return res.data.Data 
+				return res.data.Data
 			}
 			if (res.data?.Data === undefined) {
 				return res.data
@@ -97,7 +98,7 @@ export function put(url: string, data?: any): any {
 		data
 	})
 }
-export function del(url: string, data?: any): any{
+export function del(url: string, data?: any): any {
 	return service({
 		url,
 		method: "delete",

src/views/iot/configuration/list.vue

@@ -3,15 +3,7 @@
 		<div class="search">
 			<el-form :inline="true">
 				<el-form-item>
-					<el-input
-						size="default"
-						v-model="params.keyWord"
-						style="width: 200px; margin-left: 20px"
-						class="search-input"
-						placeholder="请输入搜索关键字"
-						@keyup.enter.native="getList(1)"
-						clearable
-					>
+					<el-input size="default" v-model="params.keyWord" style="width: 200px; margin-left: 20px" class="search-input" placeholder="请输入搜索关键字" @keyup.enter.native="getList(1)" clearable>
 					</el-input>
 					<el-button size="default" type="primary" class="ml10" @click="getList(1)">
 						<el-icon>
@@ -53,27 +45,30 @@ import api from '/@/api/configuration';
 import { Session } from '/@/utils/storage';
 import { useSearch } from '/@/hooks/useCommon';
 import { ElMessageBox, ElMessage } from 'element-plus';
+import getOrigin from '/@/utils/origin'
 
 const { params, tableData, getList, loading } = useSearch<any[]>(api.getList, 'data', { keyWord: '' });
 
 getList();
 
+function getTokenUrl(url: string) {
+	const tokenUrl = import.meta.env.VITE_TOPO_URL + '/?token=' + encodeURIComponent(Session.get('token'))
+	return getOrigin(tokenUrl + url)
+};
+
 const view = (row: any) => {
-	const url = import.meta.env.VITE_TOPO_URL + '/?token=' + encodeURIComponent(Session.get('token')) + '#/show/' + row.id;
+	const url = getTokenUrl('#/show/' + row.id);
 	// const url = import.meta.env.VITE_TOPO_URL + '/?token=' + encodeURIComponent(Session.get('token')) + `&bgColor=FF9900` + '#/show/' + row.id;
-	// console.log(url);
 	window.open(url);
 };
 
 const add = () => {
-	const url = import.meta.env.VITE_TOPO_URL + '/?token=' + encodeURIComponent(Session.get('token')) + '#/editor/new';
-	// console.log(url);
+	const url = getTokenUrl('#/editor/new');
 	window.open(url);
 };
 
 const edit = (row: any) => {
-	const url = import.meta.env.VITE_TOPO_URL + '/?token=' + encodeURIComponent(Session.get('token')) + '#/editor/' + row.id;
-	// console.log(url);
+	const url = getTokenUrl('#/editor/' + row.id);
 	window.open(url);
 };
 

src/views/iot/device/product/component/editPro.vue

@@ -1,7 +1,7 @@
 <template>
-	<div class="system-edit-dic-container">
-		<el-dialog :title="(ruleForm.id!==0?'修改':'添加')+'产品'" v-model="isShowDialog" width="769px">
-			<el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="90px">
+  <div class="system-edit-dic-container">
+    <el-dialog :title="(ruleForm.id !== 0 ? '修改' : '添加') + '产品'" v-model="isShowDialog" width="769px">
+      <el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="90px">
         <el-form-item label="产品标识" prop="key">
           <el-input v-model="ruleForm.key" placeholder="请输入产品标识" :disabled="ruleForm.id" />
         </el-form-item>
@@ -9,55 +9,47 @@
           <el-input v-model="ruleForm.name" placeholder="请输入产品名称" />
         </el-form-item>
         <el-form-item label="产品图片" prop="imageUrl">
-     
-                     <uploadVue :img="imageUrl" @set-img="handleAvatarSuccess" ></uploadVue>
+
+          <uploadVue :img="imageUrl" @set-img="handleAvatarSuccess"></uploadVue>
 
         </el-form-item>
-       
+
         <el-form-item label="产品分类" prop="categoryId">
-              <el-cascader :options="cateData" :props="{ checkStrictly: true,emitPath: false, value: 'id', label: 'name' }" placeholder="请选择分类" clearable class="w100" v-model="ruleForm.categoryId">
-                <template #default="{ node, data }">
-                  <span>{{ data.name }}</span>
-                  <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-                </template>
-              </el-cascader>
-            </el-form-item>
+          <el-cascader :options="cateData" :props="{ checkStrictly: true, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择分类" clearable class="w100" v-model="ruleForm.categoryId">
+            <template #default="{ node, data }">
+              <span>{{ data.name }}</span>
+              <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+            </template>
+          </el-cascader>
+        </el-form-item>
 
         <el-form-item label="所属部门" prop="deptId">
-              <el-cascader :options="deptData" :props="{ checkStrictly: true,emitPath: false, value: 'deptId', label: 'deptName' }" placeholder="请选择所属部门" clearable class="w100" v-model="ruleForm.deptId">
-                <template #default="{ node, data }">
-                  <span>{{ data.deptName }}</span>
-                  <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-                </template>
-              </el-cascader>
-            </el-form-item> 
-
-           
-          <el-form-item label="消息协议" prop="messageProtocol">
-              <el-select v-model="ruleForm.messageProtocol" placeholder="请选择消息协议">
-                <el-option
-                                        v-for="dict in network_protocols"
-                                        :key="dict.value"
-                                        :label="dict.label"
-                                        :value="dict.value">
-                                    </el-option>
-              </el-select>
-            </el-form-item> 
-
-            <el-form-item label="传输协议" prop="transportProtocol">
-              <el-select v-model="ruleForm.transportProtocol" placeholder="请选择传输协议">
-                <el-option
-                                            v-for="dict in network_server_type"
-                                            :key="dict.value"
-                                            :label="dict.label"
-                                            :value="dict.value">
-                                        </el-option>
-              </el-select>
-            </el-form-item>
-
-      
+          <el-cascader :options="deptData" :props="{ checkStrictly: true, emitPath: false, value: 'deptId', label: 'deptName' }" placeholder="请选择所属部门" clearable class="w100" v-model="ruleForm.deptId">
+            <template #default="{ node, data }">
+              <span>{{ data.deptName }}</span>
+              <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+            </template>
+          </el-cascader>
+        </el-form-item>
+
+
+        <el-form-item label="消息协议" prop="messageProtocol">
+          <el-select v-model="ruleForm.messageProtocol" placeholder="请选择消息协议">
+            <el-option v-for="dict in network_protocols" :key="dict.value" :label="dict.label" :value="dict.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="传输协议" prop="transportProtocol">
+          <el-select v-model="ruleForm.transportProtocol" placeholder="请选择传输协议">
+            <el-option v-for="dict in network_server_type" :key="dict.value" :label="dict.label" :value="dict.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+
         <el-form-item label="设备类型" prop="deviceType">
-          <el-radio-group v-model="ruleForm.deviceType" >
+          <el-radio-group v-model="ruleForm.deviceType">
             <el-radio label="设备">设备</el-radio>
 
             <el-radio label="网关">网关</el-radio>
@@ -66,75 +58,76 @@
         <el-form-item label="产品描述	" prop="desc">
           <el-input v-model="ruleForm.desc" type="textarea" placeholder="请输入产品描述"></el-input>
         </el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default">{{ruleForm.id!==0?'修 改':'添 加'}}</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="onCancel" size="default">取 消</el-button>
+          <el-button type="primary" @click="onSubmit" size="default">{{ ruleForm.id !== 0 ? '修 改' : '添 加' }}</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent,ref, unref,getCurrentInstance } from 'vue';
+import { reactive, toRefs, defineComponent, ref, unref, getCurrentInstance } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
-import {ElMessage,UploadProps} from "element-plus";
+import { ElMessage, UploadProps } from "element-plus";
+import getOrigin from '/@/utils/origin'
 
 interface RuleFormState {
-  id:number;
-  name:string;
-  dictType:string;
-  status:number;
-  desc:string;
+  id: number;
+  name: string;
+  dictType: string;
+  status: number;
+  desc: string;
 }
 interface DicState {
-	isShowDialog: boolean;
-	ruleForm: RuleFormState;
+  isShowDialog: boolean;
+  ruleForm: RuleFormState;
   cateData: RuleFormState[];
   deptData: RuleFormState[];
-  messageData:RuleFormState[];
-  tranData:RuleFormState[];
-  rules:{}
+  messageData: RuleFormState[];
+  tranData: RuleFormState[];
+  rules: {}
 }
 
 export default defineComponent({
-	name: 'deviceEditPro',
+  name: 'deviceEditPro',
   components: { uploadVue },
-	setup(prop,{emit}) {
+  setup(prop, { emit }) {
     const formRef = ref<HTMLElement | null>(null);
-    const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
+    const baseURL: string | undefined | boolean = getOrigin(import.meta.env.VITE_API_URL)
 
     const { proxy } = getCurrentInstance() as any;
     const { network_server_type, network_protocols } = proxy.useDict('network_server_type', 'network_protocols');
 
-		const state = reactive<DicState>({
-			isShowDialog: false,
-    	cateData: [], // 分类数据
-    	deptData: [], // 
-    	messageData: [], // 
-    	tranData: [], // 
-    	imageUrl: "", // 
-      singleImg:baseURL+"/product/icon/upload",
-
-			ruleForm: {
-        id:0,
-        name:'',
-        categoryId:'',
-        deptId:'',
-        messageProtocol:'',
-        transportProtocol:'',
-        deviceType:'设备',
-        status:1,
-        desc:''
-			},
+    const state = reactive<DicState>({
+      isShowDialog: false,
+      cateData: [], // 分类数据
+      deptData: [], // 
+      messageData: [], // 
+      tranData: [], // 
+      imageUrl: "", // 
+      singleImg: baseURL + "/product/icon/upload",
+
+      ruleForm: {
+        id: 0,
+        name: '',
+        categoryId: '',
+        deptId: '',
+        messageProtocol: '',
+        transportProtocol: '',
+        deviceType: '设备',
+        status: 1,
+        desc: ''
+      },
       rules: {
         name: [
           { required: true, message: "产品名称不能为空", trigger: "blur" }
         ],
-         key: [
+        key: [
           { required: true, message: "产品标识不能为空", trigger: "blur" }
         ],
         parentId: [{ required: true, message: '产品分类不能为空', trigger: 'blur' }],
@@ -143,37 +136,37 @@ export default defineComponent({
         transportProtocol: [{ required: true, message: '传输协议不能为空', trigger: 'blur' }],
         deviceType: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
       }
-		});
+    });
 
 
 
 
     const handleAvatarSuccess: UploadProps['onSuccess'] = (
-      response    ) => {
+      response) => {
 
-	console.log( response);
+      console.log(response);
 
-         state.imageUrl = response
-        state.ruleForm.icon=response
+      state.imageUrl = response
+      state.ruleForm.icon = response
     }
 
 
-		// 打开弹窗
-		const openDialog = (row: RuleFormState|null) => {
+    // 打开弹窗
+    const openDialog = (row: RuleFormState | null) => {
       resetForm();
-        api.category.getList({ status: 1 }).then((res: any) => {
-          state.cateData = res.category || [];
-        });
-        api.dept.getList({ status: -1 }).then((res: any) => {
-          state.deptData = res || [];
-        });
-        // api.product.message_protocol_list({ status: -1 }).then((res: any) => {
-        //   state.messageData = res.data || [];
-        // });
-        // api.product.trunsport_protocol_list({ status: -1 }).then((res: any) => {
-        //   state.tranData = res.data || [];
-        // });
-      if (row){
+      api.category.getList({ status: 1 }).then((res: any) => {
+        state.cateData = res.category || [];
+      });
+      api.dept.getList({ status: -1 }).then((res: any) => {
+        state.deptData = res || [];
+      });
+      // api.product.message_protocol_list({ status: -1 }).then((res: any) => {
+      //   state.messageData = res.data || [];
+      // });
+      // api.product.trunsport_protocol_list({ status: -1 }).then((res: any) => {
+      //   state.tranData = res.data || [];
+      // });
+      if (row) {
         // api.dict.getType(row.dictId).then((res:any)=>{
         //   state.ruleForm = res.data.dictType
         // }
@@ -183,42 +176,42 @@ export default defineComponent({
 
         state.ruleForm = row;
       }
-			state.isShowDialog = true;
-		};
-    const resetForm = ()=>{
+      state.isShowDialog = true;
+    };
+    const resetForm = () => {
       state.ruleForm = {
-        id:0, 
-        name:'',
-        dictType:'',
-        status:1,
-        desc:''
+        id: 0,
+        name: '',
+        dictType: '',
+        status: 1,
+        desc: ''
       }
     };
-		// 关闭弹窗
-		const closeDialog = () => {
-			state.isShowDialog = false;
-		};
-		// 取消
-		const onCancel = () => {
-			closeDialog();
-		};
-		// 新增
-		const onSubmit = () => {
+    // 关闭弹窗
+    const closeDialog = () => {
+      state.isShowDialog = false;
+    };
+    // 取消
+    const onCancel = () => {
+      closeDialog();
+    };
+    // 新增
+    const onSubmit = () => {
       const formWrap = unref(formRef) as any;
       if (!formWrap) return;
       formWrap.validate((valid: boolean) => {
         if (valid) {
-          if(state.ruleForm.id!==0){
+          if (state.ruleForm.id !== 0) {
             //修改
-            api.product.edit(state.ruleForm).then(()=>{
+            api.product.edit(state.ruleForm).then(() => {
               ElMessage.success('产品类型修改成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
             })
-          }else{
+          } else {
             //添加
             console.log(state.ruleForm);
-            api.product.add(state.ruleForm).then(()=>{
+            api.product.add(state.ruleForm).then(() => {
               ElMessage.success('产品类型添加成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
@@ -226,21 +219,21 @@ export default defineComponent({
           }
         }
       });
-		};
+    };
 
 
-		return {
-			openDialog,
+    return {
+      openDialog,
       handleAvatarSuccess,
-			closeDialog,
-			onCancel,
-			onSubmit,
+      closeDialog,
+      onCancel,
+      onSubmit,
       network_server_type,
       network_protocols,
       formRef,
-			...toRefs(state),
-		};
-	},
+      ...toRefs(state),
+    };
+  },
 });
 </script>
 

src/views/system/assess/component/editFun.vue

@@ -1,21 +1,21 @@
 <template>
-	<div class="system-edit-dic-container">
-		<el-dialog :title="(ruleForm.id!==0?'修改':'添加')+'功能定义'" v-model="isShowDialog" width="769px">
-			<el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="120px">
+  <div class="system-edit-dic-container">
+    <el-dialog :title="(ruleForm.id !== 0 ? '修改' : '添加') + '功能定义'" v-model="isShowDialog" width="769px">
+      <el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="120px">
         <el-form-item label="功能定义标识" prop="key">
           <el-input v-model="ruleForm.key" placeholder="请输入功能定义标识" />
         </el-form-item>
         <el-form-item label="功能定义名称" prop="name">
           <el-input v-model="ruleForm.name" placeholder="请输入功能定义名称" />
         </el-form-item>
-    
-    
 
 
-           
-         <el-form-item label="数据类型" prop="valueType">
 
-             <!--    <el-select v-model="ruleForm.valueType" placeholder="请选择数据类型">
+
+
+        <el-form-item label="数据类型" prop="valueType">
+
+          <!--    <el-select v-model="ruleForm.valueType" placeholder="请选择数据类型">
               <el-option
                 v-for="item in typeData"
                 :key="item.key"
@@ -24,25 +24,16 @@
               />
             </el-select> -->
 
-             <el-select v-model="ruleForm.valueType" placeholder="请选择数据类型">
-              <el-option-group
-                v-for="group in typeData"
-                :key="group"
-                :label="group"
-              >
-                <el-option
-                  v-for="item in group.options"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
-                />
-              </el-option-group>
-            </el-select>
-            </el-form-item> 
-
-          
-
-      
+          <el-select v-model="ruleForm.valueType" placeholder="请选择数据类型">
+            <el-option-group v-for="group in typeData" :key="group" :label="group">
+              <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
+            </el-option-group>
+          </el-select>
+        </el-form-item>
+
+
+
+
         <el-form-item label="是否只读" prop="accessMode">
           <el-radio-group v-model="ruleForm.accessMode" model-value="0">
             <el-radio label="0">读写</el-radio>
@@ -53,131 +44,130 @@
         <el-form-item label="功能定义描述	" prop="desc">
           <el-input v-model="ruleForm.desc" type="textarea" placeholder="请输入功能定义描述"></el-input>
         </el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default">{{ruleForm.id!==0?'修 改':'添 加'}}</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="onCancel" size="default">取 消</el-button>
+          <el-button type="primary" @click="onSubmit" size="default">{{ ruleForm.id !== 0 ? '修 改' : '添 加' }}</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
+import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
-import {ElMessage,UploadProps} from "element-plus";
+import { ElMessage, UploadProps } from "element-plus";
 
 interface RuleFormState {
-  id:number;
-  name:string;
-  dictType:string;
-  status:number;
-  desc:string;
+  id: number;
+  name: string;
+  dictType: string;
+  status: number;
+  desc: string;
 }
 interface DicState {
-	isShowDialog: boolean;
-	ruleForm: RuleFormState;
+  isShowDialog: boolean;
+  ruleForm: RuleFormState;
   typeData: RuleFormState[];
-  rules:{}
+  rules: {}
 }
 
 export default defineComponent({
-	name: 'deviceEditPro',
+  name: 'deviceEditPro',
   components: { uploadVue },
-	setup(prop,{emit}) {
+  setup(prop, { emit }) {
     const formRef = ref<HTMLElement | null>(null);
-    const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
-
-		const state = reactive<DicState>({
-			isShowDialog: false,
-    	typeData: [], // 
-    	
-
-			ruleForm: {
-        id:0,
-        name:'',
-        key:'',
-        transportProtocol:'',
-        accessMode:'0',
-        status:1,
-        desc:''
-			},
+
+    const state = reactive<DicState>({
+      isShowDialog: false,
+      typeData: [], // 
+
+
+      ruleForm: {
+        id: 0,
+        name: '',
+        key: '',
+        transportProtocol: '',
+        accessMode: '0',
+        status: 1,
+        desc: ''
+      },
       rules: {
         name: [
           { required: true, message: "功能定义名称不能为空", trigger: "blur" }
         ],
-         key: [
+        key: [
           { required: true, message: "功能定义标识不能为空", trigger: "blur" }
         ],
         accessMode: [{ required: true, message: '功能定义分类不能为空', trigger: 'blur' }],
         deptId: [{ required: true, message: '所属部门不能为空', trigger: 'blur' }],
         deviceType: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
       }
-		});
+    });
 
-		// 打开弹窗
-		const openDialog = (row: RuleFormState|null) => {
+    // 打开弹窗
+    const openDialog = (row: RuleFormState | null) => {
       resetForm();
-   
-        api.product.getDataType({ status: -1 }).then((res: any) => {
-        
-       
-            // const  datat=Object.values(res.dataType);
-            // datat.forEach((item, index) => {
-
-            // });
-          
-                state.typeData = res.dataType || [];
-           
-         
-        });
-       
-      if (row){
+
+      api.product.getDataType({ status: -1 }).then((res: any) => {
+
+
+        // const  datat=Object.values(res.dataType);
+        // datat.forEach((item, index) => {
+
+        // });
+
+        state.typeData = res.dataType || [];
+
+
+      });
+
+      if (row) {
         // api.dict.getType(row.dictId).then((res:any)=>{
         //   state.ruleForm = res.data.dictType
         // }
         console.log(row);
         state.ruleForm = row;
       }
-			state.isShowDialog = true;
-		};
-    const resetForm = ()=>{
+      state.isShowDialog = true;
+    };
+    const resetForm = () => {
       state.ruleForm = {
-        id:0, 
-        name:'',
-        dictType:'',
-        status:1,
-        desc:''
+        id: 0,
+        name: '',
+        dictType: '',
+        status: 1,
+        desc: ''
       }
     };
-		// 关闭弹窗
-		const closeDialog = () => {
-			state.isShowDialog = false;
-		};
-		// 取消
-		const onCancel = () => {
-			closeDialog();
-		};
-		// 新增
-		const onSubmit = () => {
+    // 关闭弹窗
+    const closeDialog = () => {
+      state.isShowDialog = false;
+    };
+    // 取消
+    const onCancel = () => {
+      closeDialog();
+    };
+    // 新增
+    const onSubmit = () => {
       const formWrap = unref(formRef) as any;
       if (!formWrap) return;
       formWrap.validate((valid: boolean) => {
         if (valid) {
-          if(state.ruleForm.id!==0){
+          if (state.ruleForm.id !== 0) {
             //修改
-            api.product.edit(state.ruleForm).then(()=>{
+            api.product.edit(state.ruleForm).then(() => {
               ElMessage.success('功能定义类型修改成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
             })
-          }else{
+          } else {
             //添加
             console.log(state.ruleForm);
-            api.product.add(state.ruleForm).then(()=>{
+            api.product.add(state.ruleForm).then(() => {
               ElMessage.success('功能定义类型添加成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
@@ -185,18 +175,18 @@ export default defineComponent({
           }
         }
       });
-		};
+    };
 
 
-		return {
-			openDialog,
-			closeDialog,
-			onCancel,
-			onSubmit,
+    return {
+      openDialog,
+      closeDialog,
+      onCancel,
+      onSubmit,
       formRef,
-			...toRefs(state),
-		};
-	},
+      ...toRefs(state),
+    };
+  },
 });
 </script>
 

src/views/system/assess/component/editPro.vue

@@ -1,7 +1,7 @@
 <template>
-	<div class="system-edit-dic-container">
-		<el-dialog :title="(ruleForm.id!==0?'修改':'添加')+'产品'" v-model="isShowDialog" width="769px">
-			<el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="90px">
+  <div class="system-edit-dic-container">
+    <el-dialog :title="(ruleForm.id !== 0 ? '修改' : '添加') + '产品'" v-model="isShowDialog" width="769px">
+      <el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="90px">
         <el-form-item label="产品标识" prop="key">
           <el-input v-model="ruleForm.key" placeholder="请输入产品标识" />
         </el-form-item>
@@ -9,57 +9,47 @@
           <el-input v-model="ruleForm.name" placeholder="请输入产品名称" />
         </el-form-item>
         <el-form-item label="产品图片" prop="imageUrl">
-     
-                     <uploadVue @set-img="handleAvatarSuccess" ></uploadVue>
+
+          <uploadVue @set-img="handleAvatarSuccess"></uploadVue>
 
         </el-form-item>
-       
+
         <el-form-item label="产品分类" prop="categoryId">
-              <el-cascader :options="cateData" :props="{ checkStrictly: true,emitPath: false, value: 'id', label: 'name' }" placeholder="请选择分类" clearable class="w100" v-model="ruleForm.categoryId">
-                <template #default="{ node, data }">
-                  <span>{{ data.name }}</span>
-                  <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-                </template>
-              </el-cascader>
-            </el-form-item>
+          <el-cascader :options="cateData" :props="{ checkStrictly: true, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择分类" clearable class="w100" v-model="ruleForm.categoryId">
+            <template #default="{ node, data }">
+              <span>{{ data.name }}</span>
+              <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+            </template>
+          </el-cascader>
+        </el-form-item>
 
         <el-form-item label="所属部门" prop="deptId">
-              <el-cascader :options="deptData" :props="{ checkStrictly: true,emitPath: false, value: 'deptId', label: 'deptName' }" placeholder="请选择所属部门" clearable class="w100" v-model="ruleForm.deptId">
-                <template #default="{ node, data }">
-                  <span>{{ data.deptName }}</span>
-                  <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-                </template>
-              </el-cascader>
-            </el-form-item> 
-
-           
-          <el-form-item label="消息协议" prop="messageProtocol">
-      
-
-               <el-select v-model="ruleForm.messageProtocol" placeholder="请选择消息协议">
-              <el-option
-                v-for="item in messageData"
-                :key="item.key"
-                :label="item.name"
-                :value="item.key"
-              />
-            </el-select>
-            </el-form-item> 
-
-            <el-form-item label="传输协议" prop="transportProtocol">
-           
-
-                 <el-select v-model="ruleForm.transportProtocol" placeholder="请选择传输协议">
-              <el-option
-                v-for="item in tranData"
-                :key="item.key"
-                :label="item.name"
-                :value="item.key"
-              />
-            </el-select>
-            </el-form-item>
-
-      
+          <el-cascader :options="deptData" :props="{ checkStrictly: true, emitPath: false, value: 'deptId', label: 'deptName' }" placeholder="请选择所属部门" clearable class="w100" v-model="ruleForm.deptId">
+            <template #default="{ node, data }">
+              <span>{{ data.deptName }}</span>
+              <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+            </template>
+          </el-cascader>
+        </el-form-item>
+
+
+        <el-form-item label="消息协议" prop="messageProtocol">
+
+
+          <el-select v-model="ruleForm.messageProtocol" placeholder="请选择消息协议">
+            <el-option v-for="item in messageData" :key="item.key" :label="item.name" :value="item.key" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="传输协议" prop="transportProtocol">
+
+
+          <el-select v-model="ruleForm.transportProtocol" placeholder="请选择传输协议">
+            <el-option v-for="item in tranData" :key="item.key" :label="item.name" :value="item.key" />
+          </el-select>
+        </el-form-item>
+
+
         <el-form-item label="设备类型" prop="deviceType">
           <el-radio-group v-model="ruleForm.deviceType" model-value="设备">
             <el-radio label="设备">设备</el-radio>
@@ -70,72 +60,73 @@
         <el-form-item label="产品描述	" prop="desc">
           <el-input v-model="ruleForm.desc" type="textarea" placeholder="请输入产品描述"></el-input>
         </el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default">{{ruleForm.id!==0?'修 改':'添 加'}}</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="onCancel" size="default">取 消</el-button>
+          <el-button type="primary" @click="onSubmit" size="default">{{ ruleForm.id !== 0 ? '修 改' : '添 加' }}</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
+import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
-import {ElMessage,UploadProps} from "element-plus";
+import { ElMessage, UploadProps } from "element-plus";
+import getOrigin from '/@/utils/origin'
 
 interface RuleFormState {
-  id:number;
-  name:string;
-  dictType:string;
-  status:number;
-  desc:string;
+  id: number;
+  name: string;
+  dictType: string;
+  status: number;
+  desc: string;
 }
 interface DicState {
-	isShowDialog: boolean;
-	ruleForm: RuleFormState;
+  isShowDialog: boolean;
+  ruleForm: RuleFormState;
   cateData: RuleFormState[];
   deptData: RuleFormState[];
-  messageData:RuleFormState[];
-  tranData:RuleFormState[];
-  rules:{}
+  messageData: RuleFormState[];
+  tranData: RuleFormState[];
+  rules: {}
 }
 
 export default defineComponent({
-	name: 'deviceEditPro',
+  name: 'deviceEditPro',
   components: { uploadVue },
-	setup(prop,{emit}) {
+  setup(prop, { emit }) {
     const formRef = ref<HTMLElement | null>(null);
-    const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
-
-		const state = reactive<DicState>({
-			isShowDialog: false,
-    	cateData: [], // 分类数据
-    	deptData: [], // 
-    	messageData: [], // 
-    	tranData: [], // 
-    	imageUrl: "", // 
-      singleImg:baseURL+"/product/icon/upload",
-
-			ruleForm: {
-        id:0,
-        name:'',
-        categoryId:'',
-        deptId:'',
-        messageProtocol:'',
-        transportProtocol:'',
-        deviceType:'设备',
-        status:1,
-        desc:''
-			},
+    const baseURL: string | undefined | boolean = getOrigin(import.meta.env.VITE_API_URL)
+
+    const state = reactive<DicState>({
+      isShowDialog: false,
+      cateData: [], // 分类数据
+      deptData: [], // 
+      messageData: [], // 
+      tranData: [], // 
+      imageUrl: "", // 
+      singleImg: baseURL + "/product/icon/upload",
+
+      ruleForm: {
+        id: 0,
+        name: '',
+        categoryId: '',
+        deptId: '',
+        messageProtocol: '',
+        transportProtocol: '',
+        deviceType: '设备',
+        status: 1,
+        desc: ''
+      },
       rules: {
         name: [
           { required: true, message: "产品名称不能为空", trigger: "blur" }
         ],
-         key: [
+        key: [
           { required: true, message: "产品标识不能为空", trigger: "blur" }
         ],
         parentId: [{ required: true, message: '产品分类不能为空', trigger: 'blur' }],
@@ -144,79 +135,79 @@ export default defineComponent({
         transportProtocol: [{ required: true, message: '传输协议不能为空', trigger: 'blur' }],
         deviceType: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
       }
-		});
+    });
 
 
 
 
     const handleAvatarSuccess: UploadProps['onSuccess'] = (
-      response    ) => {
+      response) => {
 
-	console.log( response);
+      console.log(response);
 
-         state.imageUrl = response
-        state.ruleForm.imageUrl=response
+      state.imageUrl = response
+      state.ruleForm.imageUrl = response
     }
 
 
-		// 打开弹窗
-		const openDialog = (row: RuleFormState|null) => {
+    // 打开弹窗
+    const openDialog = (row: RuleFormState | null) => {
       resetForm();
-        api.category.getList({ status: 1 }).then((res: any) => {
-          state.cateData = res.category || [];
-        });
-        api.dept.getList({ status: -1 }).then((res: any) => {
-          state.deptData = res || [];
-        });
-        api.product.message_protocol_list({ status: -1 }).then((res: any) => {
-          state.messageData = res.data || [];
-        });
-        api.product.trunsport_protocol_list({ status: -1 }).then((res: any) => {
-          state.tranData = res.data || [];
-        });
-      if (row){
+      api.category.getList({ status: 1 }).then((res: any) => {
+        state.cateData = res.category || [];
+      });
+      api.dept.getList({ status: -1 }).then((res: any) => {
+        state.deptData = res || [];
+      });
+      api.product.message_protocol_list({ status: -1 }).then((res: any) => {
+        state.messageData = res.data || [];
+      });
+      api.product.trunsport_protocol_list({ status: -1 }).then((res: any) => {
+        state.tranData = res.data || [];
+      });
+      if (row) {
         // api.dict.getType(row.dictId).then((res:any)=>{
         //   state.ruleForm = res.data.dictType
         // }
 
         state.ruleForm = row;
       }
-			state.isShowDialog = true;
-		};
-    const resetForm = ()=>{
+      state.isShowDialog = true;
+    };
+    const resetForm = () => {
       state.ruleForm = {
-        id:0, 
-        name:'',
-        dictType:'',
-        status:1,
-        desc:''
+        id: 0,
+        name: '',
+        dictType: '',
+        status: 1,
+        desc: ''
       }
     };
-		// 关闭弹窗
-		const closeDialog = () => {
-			state.isShowDialog = false;
-		};
-		// 取消
-		const onCancel = () => {
-			closeDialog();
-		};
-		// 新增
-		const onSubmit = () => {
+    // 关闭弹窗
+    const closeDialog = () => {
+      state.isShowDialog = false;
+    };
+    // 取消
+    const onCancel = () => {
+      closeDialog();
+    };
+    // 新增
+    const onSubmit = () => {
       const formWrap = unref(formRef) as any;
       if (!formWrap) return;
       formWrap.validate((valid: boolean) => {
         if (valid) {
-          if(state.ruleForm.id!==0){
+          if (state.ruleForm.id !== 0) {
             //修改
-            api.product.edit(state.ruleForm).then(()=>{
+            api.product.edit(state.ruleForm).then(() => {
               ElMessage.success('产品类型修改成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
             })
-          }else{
+          } else {
             //添加
             console.log(state.ruleForm);
-            api.product.add(state.ruleForm).then(()=>{
+            api.product.add(state.ruleForm).then(() => {
               ElMessage.success('产品类型添加成功');
               closeDialog(); // 关闭弹窗
               emit('typeList')
@@ -224,19 +215,19 @@ export default defineComponent({
           }
         }
       });
-		};
+    };
 
 
-		return {
-			openDialog,
+    return {
+      openDialog,
       handleAvatarSuccess,
-			closeDialog,
-			onCancel,
-			onSubmit,
+      closeDialog,
+      onCancel,
+      onSubmit,
       formRef,
-			...toRefs(state),
-		};
-	},
+      ...toRefs(state),
+    };
+  },
 });
 </script>
 

src/views/system/monitor/server/index.vue

@@ -1,165 +1,165 @@
 <template>
 	<div class="system-user-container">
-    <div class="flex-row gap-3">
-      <el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
-        <el-card class="box-card-meter">
-          <div class="el-table--enable-row-hover el-table--medium">
-            <el-row :gutter="30">
-              <el-col :xs="24" :sm="24" :md="12">
-                <table cellspacing="0" style="width: 100%">
-                  <tbody>
-                  <tr>
-                    <td>
-                      <div class="cell-card">CPU数: </div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.cpuNum }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">核心数: </div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.cpuCores }}</div>
-                    </td>
-                  </tr>
-
-                  <tr>
-                    <td>
-                      <div class="cell-card">使用率:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.cpuUsed }}%</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">LA5:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.cpuAvg5 }}%</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">LA15:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.cpuAvg15 }}%</div>
-                    </td>
-                  </tr>
-                  </tbody>
-                </table>
-              </el-col>
-              <el-col :xs="24" :sm="24" :md="12">
-                <div style="min-height: 180px" ref="chartsWarningRef1"></div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
-        <el-card class="box-card-meter">
-          <div class="el-table--enable-row-hover el-table--medium">
-            <el-row :gutter="30">
-              <el-col :xs="24" :sm="24" :md="12">
-                <table cellspacing="0" style="width: 100%">
-                  <tbody>
-                  <tr>
-                    <td>
-                      <div class="cell-card">内存总数:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.memTotal) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">已使用:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.memUsed) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">剩余:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.memFree) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">系统使用:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.goUsed) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">使用率:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.memUsage }}%</div>
-                    </td>
-                  </tr>
-                  </tbody>
-                </table>
-              </el-col>
-              <el-col :xs="24" :sm="24" :md="12">
-                <div style="min-height: 180px" ref="chartsWarningRef2"></div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-card>
-      </el-col>
-      <el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
-        <el-card class="box-card-meter">
-          <div class="el-table--enable-row-hover el-table--medium">
-            <el-row :gutter="30">
-              <el-col :xs="24" :sm="24" :md="12">
-                <table cellspacing="0" style="width: 100%">
-                  <tbody>
-                  <tr>
-                    <td>
-                      <div class="cell-card">磁盘容量:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.diskTotal) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">已使用:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ memorySizeFormat(sysInfo.diskUsed) }}</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td>
-                      <div class="cell-card">使用率:</div>
-                    </td>
-                    <td>
-                      <div class="cell-card">{{ sysInfo.diskUsedPercent }}%</div>
-                    </td>
-                  </tr>
-                  </tbody>
-                </table>
-              </el-col>
-              <el-col :xs="24" :sm="24" :md="12">
-                <div style="min-height: 180px" ref="chartsWarningRef3"></div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-card>
-      </el-col>
-
-    </div>
-    <div class="flex-row gap-3">
+		<div class="flex-row gap-3">
+			<el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
+				<el-card class="box-card-meter">
+					<div class="el-table--enable-row-hover el-table--medium">
+						<el-row :gutter="30">
+							<el-col :xs="24" :sm="24" :md="12">
+								<table cellspacing="0" style="width: 100%">
+									<tbody>
+										<tr>
+											<td>
+												<div class="cell-card">CPU数: </div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.cpuNum }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">核心数: </div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.cpuCores }}</div>
+											</td>
+										</tr>
+
+										<tr>
+											<td>
+												<div class="cell-card">使用率:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.cpuUsed }}%</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">LA5:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.cpuAvg5 }}%</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">LA15:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.cpuAvg15 }}%</div>
+											</td>
+										</tr>
+									</tbody>
+								</table>
+							</el-col>
+							<el-col :xs="24" :sm="24" :md="12">
+								<div style="min-height: 180px" ref="chartsWarningRef1"></div>
+							</el-col>
+						</el-row>
+					</div>
+				</el-card>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
+				<el-card class="box-card-meter">
+					<div class="el-table--enable-row-hover el-table--medium">
+						<el-row :gutter="30">
+							<el-col :xs="24" :sm="24" :md="12">
+								<table cellspacing="0" style="width: 100%">
+									<tbody>
+										<tr>
+											<td>
+												<div class="cell-card">内存总数:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.memTotal) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">已使用:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.memUsed) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">剩余:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.memFree) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">系统使用:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.goUsed) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">使用率:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.memUsage }}%</div>
+											</td>
+										</tr>
+									</tbody>
+								</table>
+							</el-col>
+							<el-col :xs="24" :sm="24" :md="12">
+								<div style="min-height: 180px" ref="chartsWarningRef2"></div>
+							</el-col>
+						</el-row>
+					</div>
+				</el-card>
+			</el-col>
+			<el-col :xs="24" :sm="12" :md="8" class="marg-b-15">
+				<el-card class="box-card-meter">
+					<div class="el-table--enable-row-hover el-table--medium">
+						<el-row :gutter="30">
+							<el-col :xs="24" :sm="24" :md="12">
+								<table cellspacing="0" style="width: 100%">
+									<tbody>
+										<tr>
+											<td>
+												<div class="cell-card">磁盘容量:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.diskTotal) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">已使用:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ memorySizeFormat(sysInfo.diskUsed) }}</div>
+											</td>
+										</tr>
+										<tr>
+											<td>
+												<div class="cell-card">使用率:</div>
+											</td>
+											<td>
+												<div class="cell-card">{{ sysInfo.diskUsedPercent }}%</div>
+											</td>
+										</tr>
+									</tbody>
+								</table>
+							</el-col>
+							<el-col :xs="24" :sm="24" :md="12">
+								<div style="min-height: 180px" ref="chartsWarningRef3"></div>
+							</el-col>
+						</el-row>
+					</div>
+				</el-card>
+			</el-col>
+
+		</div>
+		<div class="flex-row gap-3">
 			<el-col :xs="24" :sm="12" :md="12" class="marg-b-15">
 				<el-card class="box-card">
 					<template #header>
@@ -295,9 +295,10 @@ import { toRefs, reactive, onMounted, getCurrentInstance, defineComponent } from
 import * as echarts from 'echarts';
 import 'echarts-wordcloud';
 import api from '/@/api/system';
+import getOrigin from '/@/utils/origin'
 let interval: any = null;
 export default defineComponent({
-  name: 'monitor',
+	name: 'monitor',
 	components: {},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
@@ -308,9 +309,9 @@ export default defineComponent({
 
 		let myChart1: any;
 		let myChart2: any;
-    let myChart3: any;
+		let myChart3: any;
 
-    function setOptChart1(value: number) {
+		function setOptChart1(value: number) {
 			myChart1.setOption({
 				series: [
 					{
@@ -338,20 +339,20 @@ export default defineComponent({
 				],
 			});
 		}
-    function setOptChart3(value: number) {
-      myChart3.setOption({
-        series: [
-          {
-            data: [
-              {
-                value: value,
-                name: '',//磁盘
-              },
-            ],
-          },
-        ],
-      });
-    }
+		function setOptChart3(value: number) {
+			myChart3.setOption({
+				series: [
+					{
+						data: [
+							{
+								value: value,
+								name: '',//磁盘
+							},
+						],
+					},
+				],
+			});
+		}
 
 		//CPU
 		const initChartCPU = () => {
@@ -383,9 +384,9 @@ export default defineComponent({
 								],
 							},
 						},
-            splitNumber: 5, //分割线之间的刻度
+						splitNumber: 5, //分割线之间的刻度
 
-            detail: {
+						detail: {
 							valueAnimation: true,
 							formatter: '{value}%',
 							textStyle: {
@@ -436,9 +437,9 @@ export default defineComponent({
 								],
 							},
 						},
-            splitNumber: 5, //分割线之间的刻度
+						splitNumber: 5, //分割线之间的刻度
 
-            detail: {
+						detail: {
 							valueAnimation: true,
 							formatter: '{value}%',
 							textStyle: {
@@ -459,66 +460,66 @@ export default defineComponent({
 			myChart2.setOption(option);
 			state.myCharts.push(myChart2);
 		};
-    //磁盘
-    const initChartDISK = () => {
-      myChart3 = echarts.init(proxy.$refs.chartsWarningRef3);
-      const option = {
-        tooltip: {
-          formatter: '{a} <br/>{b} : {c}%',
-        },
-        series: [
-          {
-            type: 'gauge',
-            name: '磁盘',
-            radius: '90%', //修改表盘大小
-            title: {
-              show: true, //控制表盘title(今日预计用电量)字体是否显示
-              fontSize: 12, //控制表盘title(今日预计用电量)字体大小
-              'color': 'green',           		//控制表盘title(今日预计用电量)字体颜色
-              offsetCenter: [-2, '30%'], //设置表盘title(今日预计用电量)位置
-            },
-            axisLine: {
-              show: true,
-              lineStyle: {
-                // 属性lineStyle控制线条样式
-                color: [
-                  [0.3, '#4dabf7'],
-                  [0.6, '#69db7c'],
-                  [0.8, '#ffa94d'],
-                  [1, '#ff6b6b'],
-                ],
-              },
-            },
-            splitNumber: 5, //分割线之间的刻度
-
-            detail: {
-              valueAnimation: true,
-              formatter: '{value}%',
-              textStyle: {
-                fontSize: 20,
-                color: 'red',
-              },
-              offsetCenter: ['0', '80%'], //表盘数据(30%)位置
-            },
-            // data: [
-            // 	{
-            // 		value: 30,
-            // 		name: '内存使用率',
-            // 	},
-            // ],
-          },
-        ],
-      };
-      myChart3.setOption(option);
-      state.myCharts.push(myChart3);
-    };
+		//磁盘
+		const initChartDISK = () => {
+			myChart3 = echarts.init(proxy.$refs.chartsWarningRef3);
+			const option = {
+				tooltip: {
+					formatter: '{a} <br/>{b} : {c}%',
+				},
+				series: [
+					{
+						type: 'gauge',
+						name: '磁盘',
+						radius: '90%', //修改表盘大小
+						title: {
+							show: true, //控制表盘title(今日预计用电量)字体是否显示
+							fontSize: 12, //控制表盘title(今日预计用电量)字体大小
+							'color': 'green',           		//控制表盘title(今日预计用电量)字体颜色
+							offsetCenter: [-2, '30%'], //设置表盘title(今日预计用电量)位置
+						},
+						axisLine: {
+							show: true,
+							lineStyle: {
+								// 属性lineStyle控制线条样式
+								color: [
+									[0.3, '#4dabf7'],
+									[0.6, '#69db7c'],
+									[0.8, '#ffa94d'],
+									[1, '#ff6b6b'],
+								],
+							},
+						},
+						splitNumber: 5, //分割线之间的刻度
+
+						detail: {
+							valueAnimation: true,
+							formatter: '{value}%',
+							textStyle: {
+								fontSize: 20,
+								color: 'red',
+							},
+							offsetCenter: ['0', '80%'], //表盘数据(30%)位置
+						},
+						// data: [
+						// 	{
+						// 		value: 30,
+						// 		name: '内存使用率',
+						// 	},
+						// ],
+					},
+				],
+			};
+			myChart3.setOption(option);
+			state.myCharts.push(myChart3);
+		};
 
 		// 页面加载时
 		onMounted(() => {
 			initChartCPU();
 			initChartRAM();
-      initChartDISK();
-    });
+			initChartDISK();
+		});
 
 		function startWs() {
 			// ws = null;
@@ -529,65 +530,65 @@ export default defineComponent({
 			// 	state.sysInfo = data;
 			// 	setOptChart1(data.cpuUsed);
 			// 	setOptChart2(data.memUsage);
-      //   setOptChart3(data.diskUsedPercent);
+			//   setOptChart3(data.diskUsedPercent);
 			// };
 
-      const es = new EventSource(import.meta.env.VITE_SERVER_URL+"/subscribe/sysenv");
+			const es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/sysenv"));
 
-      es.addEventListener("host", displayHost);
-      es.addEventListener("mem", displayMem);
-      es.addEventListener("cpu", displayCpu);
-      es.addEventListener("sysLoad", displaySysLoad);
-      es.addEventListener("disk", displayDisk);
-    }
+			es.addEventListener("host", displayHost);
+			es.addEventListener("mem", displayMem);
+			es.addEventListener("cpu", displayCpu);
+			es.addEventListener("sysLoad", displaySysLoad);
+			es.addEventListener("disk", displayDisk);
+		}
 
 		startWs();
 
-    function displayHost(event: { data: any; }) {
-      const data=JSON.parse(event.data);
-      state.sysInfo.sysOsName = data.os
-      state.sysInfo.sysOsArch = data.kernelArch
-      state.sysInfo.sysComputerName = data.hostname
-      state.sysInfo.goStartTime = data.bootTime
-      state.sysInfo.goRunTime = data.uptime
-    }
+		function displayHost(event: { data: any; }) {
+			const data = JSON.parse(event.data);
+			state.sysInfo.sysOsName = data.os
+			state.sysInfo.sysOsArch = data.kernelArch
+			state.sysInfo.sysComputerName = data.hostname
+			state.sysInfo.goStartTime = data.bootTime
+			state.sysInfo.goRunTime = data.uptime
+		}
 
-    function displayMem(event: { data: any; }) {
-      const data=JSON.parse(event.data);
-      setOptChart2(data.usedPercent.toFixed(2));
-      state.sysInfo.memTotal = data.total
-      state.sysInfo.memUsed = data.used
-      state.sysInfo.memFree = data.free
-      state.sysInfo.goUsed = data.goUsed
-      state.sysInfo.memUsage = data.usedPercent.toFixed(2)
+		function displayMem(event: { data: any; }) {
+			const data = JSON.parse(event.data);
+			setOptChart2(data.usedPercent.toFixed(2));
+			state.sysInfo.memTotal = data.total
+			state.sysInfo.memUsed = data.used
+			state.sysInfo.memFree = data.free
+			state.sysInfo.goUsed = data.goUsed
+			state.sysInfo.memUsage = data.usedPercent.toFixed(2)
 
-    }
+		}
 
-    function displayCpu(event: { data: any; }) {
-      const data=JSON.parse(event.data);
-      state.sysInfo.cpuNum = data.Number
-      state.sysInfo.cpuCores = data.Cores
-      state.sysInfo.cpuUsed = data.UsedPercent[0].toFixed(2)
-      setOptChart1(data.UsedPercent[0].toFixed(2));
+		function displayCpu(event: { data: any; }) {
+			const data = JSON.parse(event.data);
+			state.sysInfo.cpuNum = data.Number
+			state.sysInfo.cpuCores = data.Cores
+			state.sysInfo.cpuUsed = data.UsedPercent[0].toFixed(2)
+			setOptChart1(data.UsedPercent[0].toFixed(2));
 
 
-    };
+		};
 
-    function displaySysLoad(event: { data: any; }) {
-      const data=JSON.parse(event.data)
-      state.sysInfo.cpuAvg5 = data.load5.toFixed(2)
-      state.sysInfo.cpuAvg15 = data.load15.toFixed(2)
+		function displaySysLoad(event: { data: any; }) {
+			const data = JSON.parse(event.data)
+			state.sysInfo.cpuAvg5 = data.load5.toFixed(2)
+			state.sysInfo.cpuAvg15 = data.load15.toFixed(2)
 
-    };
+		};
 
-    function displayDisk(event: { data: any; }) {
-      const data=JSON.parse(event.data)
-      state.sysInfo.diskTotal = data.total
-      state.sysInfo.diskUsed = data.used
-      state.sysInfo.diskUsedPercent = data.usedPercent.toFixed(2)
-      setOptChart3(data.usedPercent.toFixed(2));
+		function displayDisk(event: { data: any; }) {
+			const data = JSON.parse(event.data)
+			state.sysInfo.diskTotal = data.total
+			state.sysInfo.diskUsed = data.used
+			state.sysInfo.diskUsedPercent = data.usedPercent.toFixed(2)
+			setOptChart3(data.usedPercent.toFixed(2));
 
-    };
+		};
 
 
 		// function getSystemInfo() {
@@ -595,9 +596,9 @@ export default defineComponent({
 		// 		state.sysInfo = res;
 		// 		setOptChart1(res.cpuUsed);
 		// 		setOptChart2(res.memUsage);
-    //     setOptChart3(res.diskUsedPercent);
-    //
-    //   });
+		//     setOptChart3(res.diskUsedPercent);
+		//
+		//   });
 		// }
 
 		return {
@@ -605,9 +606,9 @@ export default defineComponent({
 			// getSystemInfo,
 			setOptChart1,
 			setOptChart2,
-      setOptChart3,
+			setOptChart3,
 
-      // ws,
+			// ws,
 		};
 	},
 	created() {
@@ -698,22 +699,21 @@ export default defineComponent({
 }
 
 .cell-card {
-  box-sizing: border-box;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: normal;
-  word-break: break-all;
-  line-height: 36px;
+	box-sizing: border-box;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: normal;
+	word-break: break-all;
+	line-height: 36px;
 }
 
 .box-card {
 	min-height: 380px;
 }
 
-.box-card-meter{
-  height: 230px;
+.box-card-meter {
+	height: 230px;
 
-  min-height: 180px;
+	min-height: 180px;
 }
-
 </style>