Merge branch 'master' of http://git.mydig.net/Sagoo-Cloud/sagoo-admin-ui

src/layout/navBars/breadcrumb/setings.vue

@@ -1,13 +1,6 @@
 <template>
 	<div class="layout-breadcrumb-seting">
-		<el-drawer
-			:title="$t('message.layout.configTitle')"
-			v-model="getThemeConfig.isDrawer"
-			direction="rtl"
-			destroy-on-close
-			size="260px"
-			@close="onDrawerClose"
-		>
+		<el-drawer :title="$t('message.layout.configTitle')" v-model="getThemeConfig.isDrawer" direction="rtl" destroy-on-close size="260px" @close="onDrawerClose">
 			<el-scrollbar class="layout-breadcrumb-seting-bar">
 				<!-- 全局主题 -->
 				<el-divider content-position="left">{{ $t('message.layout.oneTitle') }}</el-divider>
@@ -17,7 +10,7 @@
 						<el-color-picker v-model="getThemeConfig.primary" size="default" @change="onColorPickerChange"> </el-color-picker>
 					</div>
 				</div>
-        <div class="layout-breadcrumb-seting-bar-flex mt15">
+				<div class="layout-breadcrumb-seting-bar-flex mt15">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fourIsDark') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
 						<el-switch v-model="getThemeConfig.isIsDark" size="small" @change="onAddDarkChange"></el-switch>
@@ -73,36 +66,21 @@
 				<div class="layout-breadcrumb-seting-bar-flex" :style="{ opacity: getThemeConfig.layout !== 'columns' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.twoColumnsMenuBar') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-color-picker
-							v-model="getThemeConfig.columnsMenuBar"
-							size="default"
-							@change="onBgColorPickerChange('columnsMenuBar')"
-							:disabled="getThemeConfig.layout !== 'columns'"
-						>
+						<el-color-picker v-model="getThemeConfig.columnsMenuBar" size="default" @change="onBgColorPickerChange('columnsMenuBar')" :disabled="getThemeConfig.layout !== 'columns'">
 						</el-color-picker>
 					</div>
 				</div>
 				<div class="layout-breadcrumb-seting-bar-flex" :style="{ opacity: getThemeConfig.layout !== 'columns' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.twoColumnsMenuBarColor') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-color-picker
-							v-model="getThemeConfig.columnsMenuBarColor"
-							size="default"
-							@change="onBgColorPickerChange('columnsMenuBarColor')"
-							:disabled="getThemeConfig.layout !== 'columns'"
-						>
+						<el-color-picker v-model="getThemeConfig.columnsMenuBarColor" size="default" @change="onBgColorPickerChange('columnsMenuBarColor')" :disabled="getThemeConfig.layout !== 'columns'">
 						</el-color-picker>
 					</div>
 				</div>
 				<div class="layout-breadcrumb-seting-bar-flex mt14" :style="{ opacity: getThemeConfig.layout !== 'columns' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.twoIsColumnsMenuBarColorGradual') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-switch
-							v-model="getThemeConfig.isColumnsMenuBarColorGradual"
-							size="small"
-							@change="onColumnsMenuBarGradualChange"
-							:disabled="getThemeConfig.layout !== 'columns'"
-						></el-switch>
+						<el-switch v-model="getThemeConfig.isColumnsMenuBarColorGradual" size="small" @change="onColumnsMenuBarGradualChange" :disabled="getThemeConfig.layout !== 'columns'"></el-switch>
 					</div>
 				</div>
 
@@ -129,12 +107,7 @@
 				<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: getThemeConfig.layout !== 'classic' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.threeIsClassicSplitMenu') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-switch
-							v-model="getThemeConfig.isClassicSplitMenu"
-							:disabled="getThemeConfig.layout !== 'classic'"
-							size="small"
-							@change="onClassicSplitMenuChange"
-						>
+						<el-switch v-model="getThemeConfig.isClassicSplitMenu" :disabled="getThemeConfig.layout !== 'classic'" size="small" @change="onClassicSplitMenuChange">
 						</el-switch>
 					</div>
 				</div>
@@ -147,15 +120,7 @@
 				<div class="layout-breadcrumb-seting-bar-flex mt11">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.threeLockScreenTime') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-input-number
-							v-model="getThemeConfig.lockScreenTime"
-							controls-position="right"
-							:min="1"
-							:max="9999"
-							@change="setLocalThemeConfig"
-							size="default"
-							style="width: 90px"
-						>
+						<el-input-number v-model="getThemeConfig.lockScreenTime" controls-position="right" :min="1" :max="9999" @change="setLocalThemeConfig" size="default" style="width: 90px">
 						</el-input-number>
 					</div>
 				</div>
@@ -168,18 +133,10 @@
 						<el-switch v-model="getThemeConfig.isShowLogo" size="small" @change="onIsShowLogoChange"></el-switch>
 					</div>
 				</div>
-				<div
-					class="layout-breadcrumb-seting-bar-flex mt15"
-					:style="{ opacity: getThemeConfig.layout === 'classic' || getThemeConfig.layout === 'transverse' ? 0.5 : 1 }"
-				>
+				<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: getThemeConfig.layout === 'classic' || getThemeConfig.layout === 'transverse' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fourIsBreadcrumb') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-switch
-							v-model="getThemeConfig.isBreadcrumb"
-							:disabled="getThemeConfig.layout === 'classic' || getThemeConfig.layout === 'transverse'"
-							size="small"
-							@change="onIsBreadcrumbChange"
-						></el-switch>
+						<el-switch v-model="getThemeConfig.isBreadcrumb" :disabled="getThemeConfig.layout === 'classic' || getThemeConfig.layout === 'transverse'" size="small" @change="onIsBreadcrumbChange"></el-switch>
 					</div>
 				</div>
 				<div class="layout-breadcrumb-seting-bar-flex mt15">
@@ -209,12 +166,7 @@
 				<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: isMobile ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fourIsSortableTagsView') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-switch
-							v-model="getThemeConfig.isSortableTagsView"
-							:disabled="isMobile ? true : false"
-							size="small"
-							@change="onSortableTagsViewChange"
-						></el-switch>
+						<el-switch v-model="getThemeConfig.isSortableTagsView" :disabled="isMobile ? true : false" size="small" @change="onSortableTagsViewChange"></el-switch>
 					</div>
 				</div>
 				<div class="layout-breadcrumb-seting-bar-flex mt15">
@@ -279,14 +231,7 @@
 				<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: getThemeConfig.layout !== 'columns' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveColumnsAsideStyle') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-select
-							v-model="getThemeConfig.columnsAsideStyle"
-							placeholder="请选择"
-							size="default"
-							style="width: 90px"
-							:disabled="getThemeConfig.layout !== 'columns' ? true : false"
-							@change="setLocalThemeConfig"
-						>
+						<el-select v-model="getThemeConfig.columnsAsideStyle" placeholder="请选择" size="default" style="width: 90px" :disabled="getThemeConfig.layout !== 'columns' ? true : false" @change="setLocalThemeConfig">
 							<el-option label="圆角" value="columns-round"></el-option>
 							<el-option label="卡片" value="columns-card"></el-option>
 						</el-select>
@@ -295,14 +240,7 @@
 				<div class="layout-breadcrumb-seting-bar-flex mt15 mb27" :style="{ opacity: getThemeConfig.layout !== 'columns' ? 0.5 : 1 }">
 					<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('message.layout.fiveColumnsAsideLayout') }}</div>
 					<div class="layout-breadcrumb-seting-bar-flex-value">
-						<el-select
-							v-model="getThemeConfig.columnsAsideLayout"
-							placeholder="请选择"
-							size="default"
-							style="width: 90px"
-							:disabled="getThemeConfig.layout !== 'columns' ? true : false"
-							@change="setLocalThemeConfig"
-						>
+						<el-select v-model="getThemeConfig.columnsAsideLayout" placeholder="请选择" size="default" style="width: 90px" :disabled="getThemeConfig.layout !== 'columns' ? true : false" @change="setLocalThemeConfig">
 							<el-option label="水平" value="columns-horizontal"></el-option>
 							<el-option label="垂直" value="columns-vertical"></el-option>
 						</el-select>
@@ -514,8 +452,13 @@ export default defineComponent({
 		// 4、界面显示 --> 深色模式
 		const onAddDarkChange = () => {
 			const body = document.documentElement as HTMLElement;
-			if (getThemeConfig.value.isIsDark) body.setAttribute('data-theme', 'dark');
-			else body.setAttribute('data-theme', '');
+			if (getThemeConfig.value.isIsDark) {
+				body.setAttribute('data-theme', 'dark');
+				document.querySelector('html')!.className = 'dark'
+			} else {
+				body.setAttribute('data-theme', '');
+				document.querySelector('html')!.className = ''
+			}
 		};
 		// 4、界面显示 --> 开启水印
 		const onWartermarkChange = () => {
@@ -658,24 +601,29 @@ export default defineComponent({
 .layout-breadcrumb-seting-bar {
 	height: calc(100vh - 50px);
 	padding: 0 15px;
+
 	::v-deep(.el-scrollbar__view) {
 		overflow-x: hidden !important;
 	}
+
 	.layout-breadcrumb-seting-bar-flex {
 		display: flex;
 		align-items: center;
 		margin-bottom: 5px;
+
 		&-label {
 			flex: 1;
 			color: var(--el-text-color-primary);
 		}
 	}
+
 	.layout-drawer-content-flex {
 		overflow: hidden;
 		display: flex;
 		flex-wrap: wrap;
 		align-content: flex-start;
 		margin: 0 -5px;
+
 		.layout-drawer-content-item {
 			width: 50%;
 			height: 70px;
@@ -683,31 +631,39 @@ export default defineComponent({
 			border: 1px solid transparent;
 			position: relative;
 			padding: 5px;
+
 			.el-container {
 				height: 100%;
+
 				.el-aside-dark {
 					background-color: var(--next-color-seting-header);
 				}
+
 				.el-aside {
 					background-color: var(--next-color-seting-aside);
 				}
+
 				.el-header {
 					background-color: var(--next-color-seting-header);
 				}
+
 				.el-main {
 					background-color: var(--next-color-seting-main);
 				}
 			}
+
 			.el-circular {
 				border-radius: 2px;
 				overflow: hidden;
 				border: 1px solid transparent;
 				transition: all 0.3s ease-in-out;
 			}
+
 			.drawer-layout-active {
 				border: 1px solid;
 				border-color: var(--el-color-primary);
 			}
+
 			.layout-tips-warp,
 			.layout-tips-warp-active {
 				transition: all 0.3s ease-in-out;
@@ -719,6 +675,7 @@ export default defineComponent({
 				border-color: var(--el-color-primary-light-4);
 				border-radius: 100%;
 				padding: 4px;
+
 				.layout-tips-box {
 					transition: inherit;
 					width: 30px;
@@ -727,6 +684,7 @@ export default defineComponent({
 					border: 1px solid;
 					border-color: var(--el-color-primary-light-4);
 					border-radius: 100%;
+
 					.layout-tips-txt {
 						transition: inherit;
 						position: relative;
@@ -746,30 +704,37 @@ export default defineComponent({
 					}
 				}
 			}
+
 			.layout-tips-warp-active {
 				border: 1px solid;
 				border-color: var(--el-color-primary);
+
 				.layout-tips-box {
 					border: 1px solid;
 					border-color: var(--el-color-primary);
+
 					.layout-tips-txt {
 						color: var(--el-color-primary) !important;
 						background-color: var(--next-color-seting-main) !important;
 					}
 				}
 			}
+
 			&:hover {
 				.el-circular {
 					transition: all 0.3s ease-in-out;
 					border: 1px solid;
 					border-color: var(--el-color-primary);
 				}
+
 				.layout-tips-warp {
 					transition: all 0.3s ease-in-out;
 					border-color: var(--el-color-primary);
+
 					.layout-tips-box {
 						transition: inherit;
 						border-color: var(--el-color-primary);
+
 						.layout-tips-txt {
 							transition: inherit;
 							color: var(--el-color-primary) !important;
@@ -780,12 +745,15 @@ export default defineComponent({
 			}
 		}
 	}
+
 	.copy-config {
 		margin: 10px 0;
+
 		.copy-config-btn {
 			width: 100%;
 			margin-top: 15px;
 		}
+
 		.copy-config-btn-reset {
 			width: 100%;
 			margin: 10px 0 0;

src/layout/navBars/breadcrumb/user.vue

@@ -57,7 +57,7 @@
       </span>
       <template #dropdown>
         <el-dropdown-menu>
-          <el-dropdown-item command="/home">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
+          <!-- <el-dropdown-item command="/home">{{ $t('message.user.dropdown1') }}</el-dropdown-item> -->
           <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
           <el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
         </el-dropdown-menu>

src/main.ts

@@ -9,6 +9,7 @@ import other from '/@/utils/other';
 
 import ElementPlus from 'element-plus';
 import 'element-plus/dist/index.css';
+import 'element-plus/theme-chalk/dark/css-vars.css'
 import '/@/theme/index.scss';
 import mitt from 'mitt';
 import VueGridLayout from 'vue-grid-layout';

src/views/iot/device-tree/tree/index.vue

@@ -5,6 +5,8 @@
 				<el-card shadow="hover">
 					<el-scrollbar v-loading="treeLoading">
 						<el-input :prefix-icon="search" v-model="searchVal" placeholder="请输入设备树名称" clearable size="default" style="width: 100%;" />
+
+            <el-button v-if="!treeLoading && !treeData.length" type="primary" class="mt-2" @click="operateCmd('add', {})" style="width: 100%">新建节点</el-button>
 						<el-tree
               ref="zlTreeSearchRef"
               v-if="!treeLoading"
@@ -140,7 +142,7 @@
             <el-tab-pane label="绑定实际设备" name="3">
               <el-form-item label="选择设备" prop="deviceKey">
                 <el-select v-model="ruleForm.deviceKey" filterable placeholder="请选择设备">
-                  <el-option v-for="item in deviceList" :key="item.id" :label="item.name" :value="item.id">
+                  <el-option v-for="item in deviceList" :key="item.key" :label="item.name" :value="item.key">
                     <span style="float: left">{{ item.name }}</span>
                     <!-- <span style="float: right; font-size: 13px">{{ item.key }}</span> -->
                   </el-option>
@@ -288,7 +290,7 @@ export default defineComponent({
           state.treeDetail = res.data || {}
           ruleForm.value.startDate = state.treeDetail.startDate
           ruleForm.value.endDate = state.treeDetail.endDate
-          ruleForm.value.deviceKey = state.treeDetail.deviceKey ? Number(state.treeDetail.deviceKey) : ''
+          ruleForm.value.deviceKey = state.treeDetail.deviceKey
         })
     }
     const onSaveTime = () => {

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

@@ -1,6 +1,13 @@
 <template>
-	<codeEditor class="params" ref="mirrorRef" mode="" :content="content"></codeEditor>
+	<div class="flex">
+		<codeEditor class="params flex1" ref="mirrorRef" mode="" :content="content"></codeEditor>
+		<div class="mock" style="width: 300px;margin-left: 20px;">
+			<el-input class="input" v-model="inputData" type="textarea" placeholder="请输入入参，以字符串的方式，如果是对象字符串会在执行时自动转换为对象再执行"></el-input>
+			<el-input class="output" v-model="outputData" type="textarea" readonly placeholder="此处显示执行结果"></el-input>
+		</div>
+	</div>
 	<el-button type="primary" style="margin-top:20px" @click="saveCode">保存脚本</el-button>
+	<el-button type="primary" style="margin-top:20px" @click="mock">调试</el-button>
 </template>
 
 <script lang="ts" setup>
@@ -18,6 +25,8 @@ const props = defineProps({
 	script: String
 })
 
+const inputData = ref('')
+const outputData = ref('')
 const content = ref('')
 const mirrorRef = ref()
 
@@ -26,15 +35,15 @@ onMounted(() => {
 })
 
 function saveCode() {
-	const data = mirrorRef.value.getValue()
+	const funStr = mirrorRef.value.getValue()
 
-	if (data === '') {
-		return toSave(data)
+	if (funStr === '') {
+		return toSave(funStr)
 	}
 
 	try {
-		eval("(" + data + ")")
-		toSave(data)
+		eval("(" + funStr + ")")
+		toSave(funStr)
 	} catch (error) {
 		ElMessage.error('语法校验未通过')
 	}
@@ -48,11 +57,45 @@ function toSave(data: string) {
 		ElMessage.success('保存成功')
 		emit('updateScript', data)
 	})
+}
+
+function mock() {
+	if (!inputData.value) return ElMessage.error('请输入参数')
+
+	const funStr = mirrorRef.value.getValue()
+
+	if (funStr === '') {
+		return ElMessage.error('请先输入可执行脚本')
+	}
+
+	try {
+		const fun = eval("(" + funStr + ")")
+		try {
+			const res = fun(JSON.parse(inputData.value))
+			outputData.value = typeof res === 'object' ? JSON.stringify(res, null, 2) : res
+		} catch {
+			const res = fun(inputData.value)
+			outputData.value = typeof res === 'object' ? JSON.stringify(res, null, 2) : res
+		}
+	} catch (error) {
+		ElMessage.error('数据解析脚本语法校验未通过或参数类型有误')
+	}
 
 }
 </script>
 <style lang="scss" scoped>
-::v-deep(.CodeMirror){
+::v-deep(.CodeMirror) {
 	height: calc(100vh - 360px);
 }
+
+.input,
+.output {
+	::v-deep(.el-textarea__inner) {
+		height: calc(50vh - 190px);
+	}
+}
+
+.output {
+	margin-top: 20px;
+}
 </style>

src/views/login/index.vue

@@ -103,8 +103,13 @@ export default defineComponent({
 		// 4、界面显示 --> 深色模式
 		const onAddDarkChange = () => {
 			const body = document.documentElement as HTMLElement;
-			if (getThemeConfig.value.isIsDark) body.setAttribute('data-theme', 'dark');
-			else body.setAttribute('data-theme', '');
+			if (getThemeConfig.value.isIsDark) {
+				body.setAttribute('data-theme', 'dark');
+				document.querySelector('html')!.className = 'dark'
+			} else {
+				body.setAttribute('data-theme', '');
+				document.querySelector('html')!.className = ''
+			}
 		};
 
 		return {