Эх сурвалжийг харах

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

vera_min 3 жил өмнө
parent
commit
884b8aba94

+ 8 - 4
src/api/device/index.ts

@@ -34,20 +34,24 @@ export default {
   model: {
     property: (params: object) => get('/product/tsl/property/list', params),
     propertyadd: (data: object) => post('/product/tsl/property/add', data),
-    propertydel: (productId: number,key:string) => del('/product/property/del', { productId,key }),
+    propertyedit: (data: object) => put('/product/tsl/property/edit', data),
+    propertydel: (productId: number,key:string) => del('/product/tsl/property/del', { productId,key }),
 
     function: (params: object) => get('/product/tsl/function/list', params),
     functionadd: (data: object) => post('/product/tsl/function/add', data),
-    functiondel: (productId: number,key:string) => del('/product/function/del', { productId,key }),
+    functionedit: (data: object) => put('/product/tsl/function/edit', data),
+    functiondel: (productId: number,key:string) => del('/product/tsl/function/del', { productId,key }),
 
 
     event: (params: object) => get('/product/tsl/event/list', params),
     eventadd: (data: object) => post('/product/tsl/event/add', data),
-    eventdel: (productId: number,key:string) => del('/product/event/del', { productId,key }),
+    eventedit: (data: object) => put('/product/tsl/event/edit', data),
+    eventdel: (productId: number,key:string) => del('/product/tsl/event/del', { productId,key }),
 
     tag: (params: object) => get('/product/tsl/tag/list', params),
     tagadd: (data: object) => post('/product/tsl/tag/add', data),
-    tagdel: (productId: number,key:string) => del('/product/tag/del', { productId,key }),
+    tagedit: (data: object) => put('/product/tsl/tag/edit', data),
+    tagdel: (productId: number,key:string) => del('/product/tsl/tag/del', { productId,key }),
   },
   
   

+ 3 - 0
src/api/system/index.ts

@@ -46,6 +46,9 @@ export default {
     editRole: (data: object) => put('/system/role/edit', data),
     auth: {
       getList: (itemsType: 'menu' | 'button' | 'column' | 'api' | string, menuIds?: number[]) => get('/system/authorize/query', { itemsType, menuIds }),
+      set: (data: object) => post('/system/authorize/Add', data),
+      // 判断是否允许给角色授权
+      isAllow: (roleId: number) => get('/system/authorize/isAllow', { roleId }),
     }
   },
   org: {

+ 9 - 6
src/layout/routerView/link.vue

@@ -1,9 +1,9 @@
 <template>
-	<div class="layout-view-bg-white flex layout-view-link" :style="{ height: `calc(100vh - ${setLinkHeight}` }">
-		<a :href="currentRoutemeta?.isLink" target="_blank" rel="opener" class="flex-margin">
-			{{ currentRoutemeta?.title.indexOf('.')>0?$t(currentRoutemeta?.title):currentRoutemeta?.title }}:{{ currentRoutemeta?.isLink }}
-		</a>
-	</div>
+  <div class="layout-view-bg-white flex layout-view-link" :style="{ height: `calc(100vh - ${setLinkHeight}` }">
+    <a :href="currentRouteMeta?.linkUrl" target="_blank" rel="opener" class="flex-margin">
+      {{ currentRouteMeta?.title.indexOf('.')>0?$t(currentRouteMeta?.title):currentRouteMeta?.title }}:{{ currentRouteMeta?.linkUrl }}
+    </a>
+  </div>
 </template>
 
 <script lang="ts">
@@ -15,11 +15,13 @@ import { useStore } from '/@/store/index';
 interface LinkViewState {
 	currentRouteMeta: {
 		isLink: string;
+		linkUrl: string;
 		title: string;
 	};
 }
 interface LinkViewRouteMeta extends RouteMeta {
 	isLink: string;
+	linkUrl: string;
 	title: string;
 }
 
@@ -31,6 +33,7 @@ export default defineComponent({
 		const state = reactive<LinkViewState>({
 			currentRouteMeta: {
 				isLink: '',
+				linkUrl: '',
 				title: '',
 			},
 		});
@@ -44,7 +47,7 @@ export default defineComponent({
 		watch(
 			() => route.path,
 			() => {
-				state.currentRouteMeta = <LinkViewRouteMeta>route.meta;
+				state.currentRouteMeta = route.meta as LinkViewRouteMeta;
 			},
 			{
 				immediate: true,

+ 1 - 1
src/router/backEnd.ts

@@ -89,7 +89,7 @@ export function backEndComponent(routes: any) {
 			isHide: item.isHide,
 			isIframe: item.isIframe,
 			isKeepAlive: item.isKeepAlive,
-			isLink: item.isLink,
+			isLink: item.linkUrl || item.isLink,
 			linkUrl: item.linkUrl,
 			title: item.title,
 		}

+ 294 - 77
src/views/device/product/component/editAttr.vue

@@ -9,7 +9,7 @@
 					<el-input v-model="ruleForm.name" placeholder="请输入属性定义名称" />
 				</el-form-item>
 
-				<el-form-item label="数据类型" prop="type">
+				<el-form-item label="数据类型" prop="type" required>
 					<el-select v-model="valueType.type" placeholder="请选择数据类型" @change="seletChange">
 						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
 							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" />
@@ -17,36 +17,145 @@
 					</el-select>
 				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<!--根据数据类型输出不同表单-->
 
-             <el-form-item label="精度" prop="maxLength1" v-if="type=='float' || type=='double'">
-                <el-input v-model="valueType.maxLength1" placeholder="请输入精度" />
-              </el-form-item>
-
-            	<el-form-item label="单位" prop="maxLength" v-if="type=='int' || type=='long' || type=='float'  || type=='double'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入单位" />
-              </el-form-item>
+				<el-form-item label="精度" prop="decimals" v-if="type == 'float' || type == 'double'">
+					<el-input v-model="valueType.decimals" placeholder="请输入精度" />
+				</el-form-item>
 
-              <el-form-item label="最大长度" prop="maxLength" v-if="type=='string'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
-              </el-form-item>
+				<el-form-item label="单位" prop="unit" v-if="type == 'int' || type == 'long' || type == 'float' || type == 'double'">
+					<el-input v-model="valueType.unit" placeholder="请输入单位" />
+				</el-form-item>
 
-               <el-form-item label="时间格式" prop="maxLength" v-if="type=='date'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
-              </el-form-item>
-             
+				<el-form-item label="最大长度" prop="maxLength" v-if="type == 'string'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<el-form-item label="时间格式" prop="maxLength" v-if="type == 'date'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
 
+				<el-form-item label="布尔值" prop="trueText" v-if="type == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="valueType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.trueValue" placeholder="请输入布尔值" value="true" />
+					</div>
 
+					<div class="input-box">
+						<el-input v-model="valueType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.falseValue" placeholder="请输入布尔值" value="false" />
+					</div>
+				</el-form-item>
 
+				<el-form-item label="枚举项" prop="maxLength" v-if="type == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+							><el-icon><Right /></el-icon
+						></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
 
+				<el-form-item label="JSON对象" prop="maxLength" v-if="type == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.name }}</div>
+							<div class="jsonoption">
+								<!-- <el-link type="primary">编辑</el-link> -->
+								<el-link type="primary" @click="deljson(index)">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<div v-if="type == 'array'">
+					<el-form-item label="元素类型" prop="types">
+						<el-select v-model="elementType.type" placeholder="请选择元素类型" @change="seletChanges">
+							<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+								<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" :disabled="item.type == 'array'" />
+							</el-option-group>
+						</el-select>
+					</el-form-item>
+
+					<el-form-item label="精度" prop="decimals" v-if="types == 'float' || types == 'double'">
+						<el-input v-model="elementType.decimals" placeholder="请输入精度" />
+					</el-form-item>
+
+					<el-form-item label="单位" prop="unit" v-if="types == 'int' || types == 'long' || types == 'float' || types == 'double'">
+						<el-input v-model="elementType.unit" placeholder="请输入单位" />
+					</el-form-item>
+
+					<el-form-item label="最大长度" prop="maxLength" v-if="types == 'string'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入最大长度" />
+					</el-form-item>
+
+					<el-form-item label="时间格式" prop="maxLength" v-if="types == 'date'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入时间格式" />
+					</el-form-item>
+
+					<el-form-item label="布尔值" prop="maxLength" v-if="types == 'boolean'">
+						<div class="input-box">
+							<el-input v-model="elementType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.trueValue" placeholder="请输入布尔值" value="true" />
+						</div>
+
+						<div class="input-box">
+							<el-input v-model="elementType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.falseValue" placeholder="请输入布尔值" value="false" />
+						</div>
+					</el-form-item>
+
+					<el-form-item label="枚举项" prop="maxLength" v-if="types == 'enum'">
+						<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+							<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+								><el-icon><Right /></el-icon
+							></span>
+							<el-input v-model="item.value" placeholder="请输入枚举文本" />
+							<div class="input-option">
+								<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+								<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+							</div>
+						</div>
+					</el-form-item>
+				</div>
 
+				
+				<el-form-item label="JSON对象" prop="maxLength" v-if="types == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.data.name }}</div>
+							<div class="jsonoption">
+								<el-link type="primary">编辑</el-link>
+								<el-link type="primary">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<!--根据数据类型输出不同表单-->
 
 				<el-form-item label="是否只读" prop="accessMode">
-					<el-radio-group v-model="ruleForm.accessMode" model-value="0">
+					<el-radio-group v-model="ruleForm.accessMode" >
 						<el-radio label="0">读写</el-radio>
 
 						<el-radio label="1">只读</el-radio>
@@ -63,6 +172,7 @@
 				</span>
 			</template>
 		</el-dialog>
+		<EditOption ref="editOptionRef" @typeList="getOptionData" />
 	</div>
 </template>
 
@@ -70,12 +180,17 @@
 import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
+import { Plus, Minus, Right } from '@element-plus/icons-vue';
+import EditOption from './editOption.vue';
+
 import { ElMessage, UploadProps } from 'element-plus';
 
 interface RuleFormState {
 	id: number;
+	productId: number;
 	name: string;
 	dictType: string;
+	valueType: Object;
 	status: number;
 	desc: string;
 }
@@ -88,44 +203,63 @@ interface DicState {
 
 export default defineComponent({
 	name: 'deviceEditPro',
-	components: { uploadVue },
+	components: { Plus, Minus, Right, EditOption },
 	setup(prop, { emit }) {
 		const formRef = ref<HTMLElement | null>(null);
-
+		const editOptionRef = ref();
 		const state = reactive<DicState>({
 			isShowDialog: false,
 			typeData: [], //
-      type: '',
-       valueType: {
-          type:'',
-          maxLength:'',
+			type: '',
+			types: '',
+			productId:0,
+			valueType: {
+				type: '',
+				maxLength: '',
+				trueText:'是',
+				trueValue:'true',
+				falseText:'否',
+				falseValue:'false',
+			},
+			elementType: {
+				type: '',
+				maxLength: '',
+			},
+			enumdata: [
+				{
+					text: '',
+					value: '',
+				},
+			],
 
-        },
+			jsondata: [],
 
 			ruleForm: {
+				id:0,
+				productId:0,
 				name: '',
 				key: '',
 				transportProtocol: '',
-				accessMode: '0',
+				accessMode: 0,
 				status: 1,
-        valueType: {
-          type:'',
-          maxLength:'',
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
 
-        },
-				
 				desc: '',
 			},
 			rules: {
 				name: [{ required: true, message: '属性定义名称不能为空', trigger: 'blur' }],
 				key: [{ required: true, message: '属性定义标识不能为空', trigger: 'blur' }],
 				accessMode: [{ required: true, message: '请选择是否只读', trigger: 'blur' }],
-		
+				type: [{ required: true, message: '请选择数据类型', trigger: 'blur' }],
+				
 			},
 		});
 
 		// 打开弹窗
-		const openDialog = (row: RuleFormState | null) => {
+		const openDialog = (row: RuleFormState | null,productId:number | null) => {
 			resetForm();
 
 			api.product.getDataType({ status: -1 }).then((res: any) => {
@@ -139,33 +273,73 @@ export default defineComponent({
 						datat[index]['options'] = item;
 					}
 				});
-				console.log(datat);
+				console.log(row);
+				console.log(productId);
 				state.typeData = datat || [];
 			});
-
-			if (row) {
-				// api.dict.getType(row.dictId).then((res:any)=>{
-				//   state.ruleForm = res.data.dictType
-				// }
-				console.log(row);
+	
+			if (row.valueType) {	
 				state.ruleForm = row;
+
+				state.productId=productId;
+				state.valueType = row.valueType;
+				state.ruleForm.valueType.type = row.valueType.type;
+				state.ruleForm.type = row.valueType.type;
+				state.type = row.valueType.type ;
 			}
 			state.isShowDialog = true;
 		};
 		const resetForm = () => {
 			state.ruleForm = {
-				id: 0,
 				name: '',
-				dictType: '',
+				key: '',
+				transportProtocol: '',
+				accessMode: '0',
 				status: 1,
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
 				desc: '',
 			};
 		};
 
-    const seletChange=(val)=>{
-      state.type=val;
-      console.log(val);
-    };
+		const seletChange = (val) => {
+			state.type = val;
+			state.ruleForm.type = val;
+		
+			
+			console.log(val);
+		};
+		const seletChanges = (val) => {
+			console.log(val);
+			state.types = val;
+			console.log(val);
+		};
+
+		const addEnum = () => {
+			state.enumdata.push({
+				text: '',
+				value: '',
+			});
+		};
+		const delEnum = (index) => {
+			state.enumdata.splice(index, 1);
+		};
+
+		const deljson = (index) => {
+			state.jsondata.splice(index, 1);
+		}
+
+		const addJson = () => {
+			editOptionRef.value.openDialog({ product_id: 0, id: 0 });
+		};
+		const getOptionData = (data) => {
+			state.jsondata.push(data);
+
+			console.log(state.jsondata);
+		};
 		// 关闭弹窗
 		const closeDialog = () => {
 			state.isShowDialog = false;
@@ -182,17 +356,44 @@ export default defineComponent({
 				if (valid) {
 					if (state.ruleForm.id !== 0) {
 						//修改
-						api.product.edit(state.ruleForm).then(() => {
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
+						state.ruleForm.productId = state.productId
+						api.model.propertyedit(state.ruleForm).then(() => {
 							ElMessage.success('属性定义类型修改成功');
 							closeDialog(); // 关闭弹窗
 							emit('typeList');
 						});
 					} else {
 						//添加
-         
-            console.log(state.valueType);
-            state.ruleForm.valueType=state.valueType;
-           console.log(state.ruleForm);
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
 						api.model.propertyadd(state.ruleForm).then(() => {
 							ElMessage.success('属性定义类型添加成功');
 							closeDialog(); // 关闭弹窗
@@ -204,8 +405,15 @@ export default defineComponent({
 		};
 
 		return {
+			editOptionRef,
+			getOptionData,
 			openDialog,
-      seletChange,
+			deljson,
+			addEnum,
+			delEnum,
+			addJson,
+			seletChange,
+			seletChanges,
 			closeDialog,
 			onCancel,
 			onSubmit,
@@ -215,34 +423,43 @@ export default defineComponent({
 	},
 });
 </script>
-
-<style scoped>
-.avatar-uploader .avatar {
-	width: 178px;
-	height: 178px;
-	display: block;
-}
-</style>
-
 <style>
-.avatar-uploader .el-upload {
-	border: 1px dashed var(--el-border-color);
-	border-radius: 6px;
+.input-box {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	margin-top: 10px;
+}
+.input-option {
+	line-height: 30px;
+	padding-top: 5px;
+	width: 140px;
+}
+.input-option i {
+	margin: 0px 5px;
+	border: 1px solid #c3c3c3;
+	font-size: 16px;
+}
+.input-options {
+	display: flex;
+	align-items: center;
+	color: #409eff;
 	cursor: pointer;
-	position: relative;
-	overflow: hidden;
-	transition: var(--el-transition-duration-fast);
 }
-
-.avatar-uploader .el-upload:hover {
-	border-color: var(--el-color-primary);
+.jslist {
+	width: 100%;
+	border: 1px solid #e8e8e8;
+	padding: 10px;
+	margin-bottom: 10px;
 }
-
-.el-icon.avatar-uploader-icon {
-	font-size: 28px;
-	color: #8c939d;
-	width: 178px;
-	height: 178px;
-	text-align: center;
+.jsonlist {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+.jsonoption {
+}
+.jsonoption a {
+	margin: 0px 10px;
 }
 </style>

+ 298 - 82
src/views/device/product/component/editEvent.vue

@@ -9,9 +9,8 @@
 					<el-input v-model="ruleForm.name" placeholder="请输入事件定义名称" />
 				</el-form-item>
 
-        
-				<el-form-item label="事件级别" prop="level">
-					<el-radio-group v-model="ruleForm.level" model-value="0">
+                <el-form-item label="事件级别" prop="level">
+					<el-radio-group v-model="ruleForm.level" >
 						<el-radio label="0">普通</el-radio>
 
 						<el-radio label="1">警告</el-radio>
@@ -19,42 +18,152 @@
 					</el-radio-group>
 				</el-form-item>
 
-				<el-form-item label="输出参数" prop="type">
-					<el-select v-model="valueType.type" placeholder="请选择输出参数" @change="seletChange">
+				<el-form-item label="输出参数" prop="type" required>
+					<el-select v-model="valueType.type" placeholder="请选择数据类型" @change="seletChange">
 						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
 							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" />
 						</el-option-group>
 					</el-select>
 				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<!--根据数据类型输出不同表单-->
 
-             <el-form-item label="精度" prop="maxLength1" v-if="type=='float' || type=='double'">
-                <el-input v-model="valueType.maxLength1" placeholder="请输入精度" />
-              </el-form-item>
-
-            	<el-form-item label="单位" prop="maxLength" v-if="type=='int' || type=='long' || type=='float'  || type=='double'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入单位" />
-              </el-form-item>
+				<el-form-item label="精度" prop="decimals" v-if="type == 'float' || type == 'double'">
+					<el-input v-model="valueType.decimals" placeholder="请输入精度" />
+				</el-form-item>
 
-              <el-form-item label="最大长度" prop="maxLength" v-if="type=='string'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
-              </el-form-item>
+				<el-form-item label="单位" prop="unit" v-if="type == 'int' || type == 'long' || type == 'float' || type == 'double'">
+					<el-input v-model="valueType.unit" placeholder="请输入单位" />
+				</el-form-item>
 
-               <el-form-item label="时间格式" prop="maxLength" v-if="type=='date'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
-              </el-form-item>
-             
+				<el-form-item label="最大长度" prop="maxLength" v-if="type == 'string'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<el-form-item label="时间格式" prop="maxLength" v-if="type == 'date'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
 
+				<el-form-item label="布尔值" prop="trueText" v-if="type == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="valueType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.trueValue" placeholder="请输入布尔值" value="true" />
+					</div>
 
+					<div class="input-box">
+						<el-input v-model="valueType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.falseValue" placeholder="请输入布尔值" value="false" />
+					</div>
+				</el-form-item>
 
+				<el-form-item label="枚举项" prop="maxLength" v-if="type == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+							><el-icon><Right /></el-icon
+						></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
 
+				<el-form-item label="JSON对象" prop="maxLength" v-if="type == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.name }}</div>
+							<div class="jsonoption">
+								<!-- <el-link type="primary">编辑</el-link> -->
+								<el-link type="primary" @click="deljson(index)">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<div v-if="type == 'array'">
+					<el-form-item label="元素类型" prop="types">
+						<el-select v-model="elementType.type" placeholder="请选择元素类型" @change="seletChanges">
+							<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+								<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" :disabled="item.type == 'array'" />
+							</el-option-group>
+						</el-select>
+					</el-form-item>
+
+					<el-form-item label="精度" prop="decimals" v-if="types == 'float' || types == 'double'">
+						<el-input v-model="elementType.decimals" placeholder="请输入精度" />
+					</el-form-item>
+
+					<el-form-item label="单位" prop="unit" v-if="types == 'int' || types == 'long' || types == 'float' || types == 'double'">
+						<el-input v-model="elementType.unit" placeholder="请输入单位" />
+					</el-form-item>
+
+					<el-form-item label="最大长度" prop="maxLength" v-if="types == 'string'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入最大长度" />
+					</el-form-item>
+
+					<el-form-item label="时间格式" prop="maxLength" v-if="types == 'date'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入时间格式" />
+					</el-form-item>
+
+					<el-form-item label="布尔值" prop="maxLength" v-if="types == 'boolean'">
+						<div class="input-box">
+							<el-input v-model="elementType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.trueValue" placeholder="请输入布尔值" value="true" />
+						</div>
+
+						<div class="input-box">
+							<el-input v-model="elementType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.falseValue" placeholder="请输入布尔值" value="false" />
+						</div>
+					</el-form-item>
+
+					<el-form-item label="枚举项" prop="maxLength" v-if="types == 'enum'">
+						<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+							<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+								><el-icon><Right /></el-icon
+							></span>
+							<el-input v-model="item.value" placeholder="请输入枚举文本" />
+							<div class="input-option">
+								<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+								<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+							</div>
+						</div>
+					</el-form-item>
+				</div>
 
+				
+				<el-form-item label="JSON对象" prop="maxLength" v-if="types == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.data.name }}</div>
+							<div class="jsonoption">
+								<el-link type="primary">编辑</el-link>
+								<el-link type="primary">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<!--根据数据类型输出不同表单-->
 
+			
 				<el-form-item label="事件定义描述	" prop="desc">
 					<el-input v-model="ruleForm.desc" type="textarea" placeholder="请输入事件定义描述"></el-input>
 				</el-form-item>
@@ -66,6 +175,7 @@
 				</span>
 			</template>
 		</el-dialog>
+		<EditOption ref="editOptionRef" @typeList="getOptionData" />
 	</div>
 </template>
 
@@ -73,12 +183,18 @@
 import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
+import { Plus, Minus, Right } from '@element-plus/icons-vue';
+import EditOption from './editOption.vue';
+
 import { ElMessage, UploadProps } from 'element-plus';
 
 interface RuleFormState {
 	id: number;
+	productId: number;
+	level: number;
 	name: string;
 	dictType: string;
+	valueType: Object;
 	status: number;
 	desc: string;
 }
@@ -91,44 +207,62 @@ interface DicState {
 
 export default defineComponent({
 	name: 'deviceEditPro',
-	components: { uploadVue },
+	components: { Plus, Minus, Right, EditOption },
 	setup(prop, { emit }) {
 		const formRef = ref<HTMLElement | null>(null);
-
+		const editOptionRef = ref();
 		const state = reactive<DicState>({
 			isShowDialog: false,
 			typeData: [], //
-      type: '',
-       valueType: {
-          type:'',
-          maxLength:'',
+			type: '',
+			types: '',
+			productId:0,
+			valueType: {
+				type: '',
+				maxLength: '',
+				trueText:'是',
+				trueValue:'true',
+				falseText:'否',
+				falseValue:'false',
+			},
+			elementType: {
+				type: '',
+				maxLength: '',
+			},
+			enumdata: [
+				{
+					text: '',
+					value: '',
+				},
+			],
 
-        },
+			jsondata: [],
 
 			ruleForm: {
+				id:0,
+				productId:0,
+                level:0,
 				name: '',
 				key: '',
-				transportProtocol: '',
-				accessMode: '0',
 				status: 1,
-        valueType: {
-          type:'',
-          maxLength:'',
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
 
-        },
-				
 				desc: '',
 			},
 			rules: {
 				name: [{ required: true, message: '事件定义名称不能为空', trigger: 'blur' }],
 				key: [{ required: true, message: '事件定义标识不能为空', trigger: 'blur' }],
-				accessMode: [{ required: true, message: '请选择是否只读', trigger: 'blur' }],
-		
+				level: [{ required: true, message: '请选择事件级别', trigger: 'blur' }],
+				type: [{ required: true, message: '请选择数据类型', trigger: 'blur' }],
+				
 			},
 		});
 
 		// 打开弹窗
-		const openDialog = (row: RuleFormState | null) => {
+		const openDialog = (row: RuleFormState | null,productId:number | null) => {
 			resetForm();
 
 			api.product.getDataType({ status: -1 }).then((res: any) => {
@@ -142,33 +276,72 @@ export default defineComponent({
 						datat[index]['options'] = item;
 					}
 				});
-				console.log(datat);
+				console.log(row);
+				console.log(productId);
 				state.typeData = datat || [];
 			});
-
-			if (row) {
-				// api.dict.getType(row.dictId).then((res:any)=>{
-				//   state.ruleForm = res.data.dictType
-				// }
-				console.log(row);
+			state.ruleForm = row;
+			if (row.valueType) {	
 				state.ruleForm = row;
+
+				state.productId=productId;
+				state.valueType = row.valueType;
+				state.ruleForm.valueType.type = row.valueType.type;
+				state.ruleForm.type = row.valueType.type;
+				state.type = row.valueType.type ;
 			}
 			state.isShowDialog = true;
 		};
 		const resetForm = () => {
 			state.ruleForm = {
-				id: 0,
 				name: '',
-				dictType: '',
+				key: '',
+				accessMode: '0',
 				status: 1,
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
 				desc: '',
 			};
 		};
 
-    const seletChange=(val)=>{
-      state.type=val;
-      console.log(val);
-    };
+		const seletChange = (val) => {
+			state.type = val;
+			state.ruleForm.type = val;
+		
+			
+			console.log(val);
+		};
+		const seletChanges = (val) => {
+			console.log(val);
+			state.types = val;
+			console.log(val);
+		};
+
+		const addEnum = () => {
+			state.enumdata.push({
+				text: '',
+				value: '',
+			});
+		};
+		const delEnum = (index) => {
+			state.enumdata.splice(index, 1);
+		};
+
+		const deljson = (index) => {
+			state.jsondata.splice(index, 1);
+		}
+
+		const addJson = () => {
+			editOptionRef.value.openDialog({ product_id: 0, id: 0 });
+		};
+		const getOptionData = (data) => {
+			state.jsondata.push(data);
+
+			console.log(state.jsondata);
+		};
 		// 关闭弹窗
 		const closeDialog = () => {
 			state.isShowDialog = false;
@@ -185,17 +358,44 @@ export default defineComponent({
 				if (valid) {
 					if (state.ruleForm.id !== 0) {
 						//修改
-						api.product.edit(state.ruleForm).then(() => {
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
+						state.ruleForm.productId = state.productId
+						api.model.eventedit(state.ruleForm).then(() => {
 							ElMessage.success('事件定义类型修改成功');
 							closeDialog(); // 关闭弹窗
 							emit('typeList');
 						});
 					} else {
 						//添加
-         
-            console.log(state.valueType);
-            state.ruleForm.valueType=state.valueType;
-           console.log(state.ruleForm);
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
 						api.model.eventadd(state.ruleForm).then(() => {
 							ElMessage.success('事件定义类型添加成功');
 							closeDialog(); // 关闭弹窗
@@ -207,8 +407,15 @@ export default defineComponent({
 		};
 
 		return {
+			editOptionRef,
+			getOptionData,
 			openDialog,
-      seletChange,
+			deljson,
+			addEnum,
+			delEnum,
+			addJson,
+			seletChange,
+			seletChanges,
 			closeDialog,
 			onCancel,
 			onSubmit,
@@ -218,34 +425,43 @@ export default defineComponent({
 	},
 });
 </script>
-
-<style scoped>
-.avatar-uploader .avatar {
-	width: 178px;
-	height: 178px;
-	display: block;
-}
-</style>
-
 <style>
-.avatar-uploader .el-upload {
-	border: 1px dashed var(--el-border-color);
-	border-radius: 6px;
+.input-box {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	margin-top: 10px;
+}
+.input-option {
+	line-height: 30px;
+	padding-top: 5px;
+	width: 140px;
+}
+.input-option i {
+	margin: 0px 5px;
+	border: 1px solid #c3c3c3;
+	font-size: 16px;
+}
+.input-options {
+	display: flex;
+	align-items: center;
+	color: #409eff;
 	cursor: pointer;
-	position: relative;
-	overflow: hidden;
-	transition: var(--el-transition-duration-fast);
 }
-
-.avatar-uploader .el-upload:hover {
-	border-color: var(--el-color-primary);
+.jslist {
+	width: 100%;
+	border: 1px solid #e8e8e8;
+	padding: 10px;
+	margin-bottom: 10px;
 }
-
-.el-icon.avatar-uploader-icon {
-	font-size: 28px;
-	color: #8c939d;
-	width: 178px;
-	height: 178px;
-	text-align: center;
+.jsonlist {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+.jsonoption {
+}
+.jsonoption a {
+	margin: 0px 10px;
 }
 </style>

+ 430 - 168
src/views/device/product/component/editFun.vue

@@ -1,158 +1,371 @@
 <template>
 	<div class="system-edit-dic-container">
-		<el-dialog :title="(ruleForm.id!==0?'修改':'添加')+'功能定义'" v-model="isShowDialog" width="769px">
+		<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-option
-                v-for="item in typeData"
-                :key="item.key"
-                :label="item.name"
-                :value="item.key"
-              />
-            </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-form-item label="是否只读" prop="accessMode">
-          <el-radio-group v-model="ruleForm.accessMode" model-value="0">
-            <el-radio label="0">读写</el-radio>
-
-            <el-radio label="1">只读</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="功能定义描述	" prop="desc">
-          <el-input v-model="ruleForm.desc" type="textarea" placeholder="请输入功能定义描述"></el-input>
-        </el-form-item>
+				<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="maxLength">
+					<div v-for="(item, index) in inputsdata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.name }}</div>
+							<div class="jsonoption">
+								<!-- <el-link type="primary">编辑</el-link> -->
+								<el-link type="primary" @click="deljson(index,'fun')">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson('fun')">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
+
+
+
+				<el-form-item label="输出参数" prop="type" required>
+					<el-select v-model="valueType.type" placeholder="请选择数据类型" @change="seletChange">
+						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" />
+						</el-option-group>
+					</el-select>
+				</el-form-item>
+
+				<!--根据数据类型输出不同表单-->
+
+				<el-form-item label="精度" prop="decimals" v-if="type == 'float' || type == 'double'">
+					<el-input v-model="valueType.decimals" placeholder="请输入精度" />
+				</el-form-item>
+
+				<el-form-item label="单位" prop="unit" v-if="type == 'int' || type == 'long' || type == 'float' || type == 'double'">
+					<el-input v-model="valueType.unit" placeholder="请输入单位" />
+				</el-form-item>
+
+				<el-form-item label="最大长度" prop="maxLength" v-if="type == 'string'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
+
+				<el-form-item label="时间格式" prop="maxLength" v-if="type == 'date'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
+
+				<el-form-item label="布尔值" prop="trueText" v-if="type == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="valueType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.trueValue" placeholder="请输入布尔值" value="true" />
+					</div>
+
+					<div class="input-box">
+						<el-input v-model="valueType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.falseValue" placeholder="请输入布尔值" value="false" />
+					</div>
+				</el-form-item>
+
+				<el-form-item label="枚举项" prop="maxLength" v-if="type == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+							><el-icon><Right /></el-icon
+						></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
+
+				<el-form-item label="JSON对象" prop="maxLength" v-if="type == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.name }}</div>
+							<div class="jsonoption">
+								<!-- <el-link type="primary">编辑</el-link> -->
+								<el-link type="primary" @click="deljson(index,'fun')">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson('json')">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
+
+				<div v-if="type == 'array'">
+					<el-form-item label="元素类型" prop="types">
+						<el-select v-model="elementType.type" placeholder="请选择元素类型" @change="seletChanges">
+							<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+								<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" :disabled="item.type == 'array'" />
+							</el-option-group>
+						</el-select>
+					</el-form-item>
+
+					<el-form-item label="精度" prop="decimals" v-if="types == 'float' || types == 'double'">
+						<el-input v-model="elementType.decimals" placeholder="请输入精度" />
+					</el-form-item>
+
+					<el-form-item label="单位" prop="unit" v-if="types == 'int' || types == 'long' || types == 'float' || types == 'double'">
+						<el-input v-model="elementType.unit" placeholder="请输入单位" />
+					</el-form-item>
+
+					<el-form-item label="最大长度" prop="maxLength" v-if="types == 'string'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入最大长度" />
+					</el-form-item>
+
+					<el-form-item label="时间格式" prop="maxLength" v-if="types == 'date'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入时间格式" />
+					</el-form-item>
+
+					<el-form-item label="布尔值" prop="maxLength" v-if="types == 'boolean'">
+						<div class="input-box">
+							<el-input v-model="elementType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.trueValue" placeholder="请输入布尔值" value="true" />
+						</div>
+
+						<div class="input-box">
+							<el-input v-model="elementType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.falseValue" placeholder="请输入布尔值" value="false" />
+						</div>
+					</el-form-item>
+
+					<el-form-item label="枚举项" prop="maxLength" v-if="types == 'enum'">
+						<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+							<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+								><el-icon><Right /></el-icon
+							></span>
+							<el-input v-model="item.value" placeholder="请输入枚举文本" />
+							<div class="input-option">
+								<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+								<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+							</div>
+						</div>
+					</el-form-item>
+				</div>
+
+				
+				<el-form-item label="JSON对象" prop="maxLength" v-if="types == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.data.name }}</div>
+							<div class="jsonoption">
+								<el-link type="primary">编辑</el-link>
+								<el-link type="primary">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson('json')">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
+
+				<!--根据数据类型输出不同表单-->
+	
+
+				<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>
+					<el-button type="primary" @click="onSubmit" size="default">{{ ruleForm.id !== 0 ? '修 改' : '添 加' }}</el-button>
 				</span>
 			</template>
 		</el-dialog>
+		<EditOption ref="editOptionRef" @typeList="getOptionData" />
 	</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 { Plus, Minus, Right } from '@element-plus/icons-vue';
+import EditOption from './editOption.vue';
+
+import { ElMessage, UploadProps } from 'element-plus';
 
 interface RuleFormState {
-  id:number;
-  name:string;
-  dictType:string;
-  status:number;
-  desc:string;
+	id: number;
+	productId: number;
+	name: string;
+	dictType: string;
+	valueType: Object;
+	inputs: Object;
+	output: Object;
+	status: number;
+	desc: string;
 }
 interface DicState {
 	isShowDialog: boolean;
 	ruleForm: RuleFormState;
-  typeData: RuleFormState[];
-  rules:{}
+	typeData: RuleFormState[];
+	rules: {};
 }
 
 export default defineComponent({
 	name: 'deviceEditPro',
-  components: { uploadVue },
-	setup(prop,{emit}) {
-    const formRef = ref<HTMLElement | null>(null);
-    const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
-
+	components: { Plus, Minus, Right, EditOption },
+	setup(prop, { emit }) {
+		const formRef = ref<HTMLElement | null>(null);
+		const editOptionRef = ref();
 		const state = reactive<DicState>({
 			isShowDialog: false,
-    	typeData: [], // 
-    	
+			typeData: [], //
+			type: '',
+			types: '',
+			productId:0,
+			valueType: {
+				type: '',
+				maxLength: '',
+				trueText:'是',
+				trueValue:'true',
+				falseText:'否',
+				falseValue:'false',
+			},
+			elementType: {
+				type: '',
+				maxLength: '',
+			},
+			enumdata: [
+				{
+					text: '',
+					value: '',
+				},
+			],
+
+			jsondata: [],
+      inputsdata:[],
 
 			ruleForm: {
-        id:0,
-        name:'',
-        key:'',
-        transportProtocol:'',
-        accessMode:'0',
-        status:1,
-        desc:''
+				productId:0,
+				name: '',
+				key: '',
+        inputs:[],
+        output:[],
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
+				desc: '',
+			},
+			rules: {
+				name: [{ required: true, message: '功能定义名称不能为空', trigger: 'blur' }],
+				key: [{ required: true, message: '功能定义标识不能为空', trigger: 'blur' }],
+				type: [{ required: true, message: '请选择数据类型', trigger: 'blur' }],
+				
 			},
-      rules: {
-        name: [
-          { required: true, message: "功能定义名称不能为空", trigger: "blur" }
-        ],
-         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) => {
-      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.dict.getType(row.dictId).then((res:any)=>{
-        //   state.ruleForm = res.data.dictType
-        // }
-        console.log(row);
-        state.ruleForm = row;
-      }
+		const openDialog = (row: RuleFormState | null,productId:number | null) => {
+			resetForm();
+
+			api.product.getDataType({ status: -1 }).then((res: any) => {
+				const datat = Object.values(res.dataType);
+				datat.forEach((item, index) => {
+					if (index == 0) {
+						datat[index]['label'] = '基础类型';
+						datat[index]['options'] = item;
+					} else {
+						datat[index]['label'] = '扩展类型';
+						datat[index]['options'] = item;
+					}
+				});
+				console.log(datat);
+				state.typeData = datat || [];
+			});
+      state.ruleForm = row;
+			if (row.valueType) {	
+				state.ruleForm = row;
+
+				state.productId=productId;
+				state.valueType = row.valueType;
+				state.ruleForm.valueType.type = row.valueType.type;
+				state.ruleForm.type = row.valueType.type;
+				state.type = row.valueType.type ;
+			}
 			state.isShowDialog = true;
 		};
-    const resetForm = ()=>{
-      state.ruleForm = {
-        id:0, 
-        name:'',
-        dictType:'',
-        status:1,
-        desc:''
+		const resetForm = () => {
+			state.ruleForm = {
+				name: '',
+				key: '',
+				status: 1,
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
+				desc: '',
+			};
+		};
+
+		const seletChange = (val) => {
+			state.type = val;
+			state.ruleForm.type = val;
+		
+			
+			console.log(val);
+		};
+		const seletChanges = (val) => {
+			console.log(val);
+			state.types = val;
+			console.log(val);
+		};
+
+		const addEnum = () => {
+			state.enumdata.push({
+				text: '',
+				value: '',
+			});
+		};
+		const delEnum = (index) => {
+			state.enumdata.splice(index, 1);
+		};
+
+		const deljson = (index,type) => {
+      if(type=='fun'){
+        state.inputsdata.splice(index, 1);
+      }else{
+        state.jsondata.splice(index, 1);
       }
-    };
+			
+		}
+
+		const addJson = (type) => {
+			editOptionRef.value.openDialog({ product_id: 0, id: 0,type_data:type });
+		};
+		const getOptionData = (data,type_data) => {
+
+      if(type_data=='fun'){
+        	state.inputsdata.push(data);
+      }else{
+        	state.jsondata.push(data);
+      }
+
+		
+
+			console.log(state.jsondata);
+			console.log(type_data);
+		};
 		// 关闭弹窗
 		const closeDialog = () => {
 			state.isShowDialog = false;
@@ -163,70 +376,119 @@ export default defineComponent({
 		};
 		// 新增
 		const onSubmit = () => {
-      const formWrap = unref(formRef) as any;
-      if (!formWrap) return;
-      formWrap.validate((valid: boolean) => {
-        if (valid) {
-          if(state.ruleForm.id!==0){
-            //修改
-            api.product.edit(state.ruleForm).then(()=>{
-              ElMessage.success('功能定义类型修改成功');
-              closeDialog(); // 关闭弹窗
-              emit('typeList')
-            })
-          }else{
-            //添加
-            console.log(state.ruleForm);
-            api.product.add(state.ruleForm).then(()=>{
-              ElMessage.success('功能定义类型添加成功');
-              closeDialog(); // 关闭弹窗
-              emit('typeList')
-            })
-          }
-        }
-      });
-		};
+			const formWrap = unref(formRef) as any;
+			if (!formWrap) return;
+			formWrap.validate((valid: boolean) => {
+				if (valid) {
+					if (state.ruleForm.id !== 0) {
+						//修改
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
 
+						console.log(state.valueType);
+
+					state.ruleForm.inputs = state.inputsdata;
+            state.ruleForm.output =state.valueType; 
+						state.ruleForm.productId = state.productId
+						api.model.functionedit(state.ruleForm).then(() => {
+							ElMessage.success('功能定义类型修改成功');
+							closeDialog(); // 关闭弹窗
+							emit('typeList');
+						});
+					} else {
+						//添加
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+
+
+						state.ruleForm.inputs = state.inputsdata;
+            state.ruleForm.output =state.valueType; 
+
+						api.model.functionadd(state.ruleForm).then(() => {
+							ElMessage.success('功能定义类型添加成功');
+							closeDialog(); // 关闭弹窗
+							emit('typeList');
+						});
+					}
+				}
+			});
+		};
 
 		return {
+			editOptionRef,
+			getOptionData,
 			openDialog,
+			deljson,
+			addEnum,
+			delEnum,
+			addJson,
+			seletChange,
+			seletChanges,
 			closeDialog,
 			onCancel,
 			onSubmit,
-      formRef,
+			formRef,
 			...toRefs(state),
 		};
 	},
 });
 </script>
-
-<style scoped>
-.avatar-uploader .avatar {
-  width: 178px;
-  height: 178px;
-  display: block;
-}
-</style>
-
 <style>
-.avatar-uploader .el-upload {
-  border: 1px dashed var(--el-border-color);
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-  transition: var(--el-transition-duration-fast);
+.input-box {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	margin-top: 10px;
 }
-
-.avatar-uploader .el-upload:hover {
-  border-color: var(--el-color-primary);
+.input-option {
+	line-height: 30px;
+	padding-top: 5px;
+	width: 140px;
 }
-
-.el-icon.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 178px;
-  height: 178px;
-  text-align: center;
+.input-option i {
+	margin: 0px 5px;
+	border: 1px solid #c3c3c3;
+	font-size: 16px;
+}
+.input-options {
+	display: flex;
+	align-items: center;
+	color: #409eff;
+	cursor: pointer;
+}
+.jslist {
+	width: 100%;
+	border: 1px solid #e8e8e8;
+	padding: 10px;
+	margin-bottom: 10px;
+}
+.jsonlist {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+.jsonoption {
+}
+.jsonoption a {
+	margin: 0px 10px;
 }
 </style>

+ 341 - 0
src/views/device/product/component/editOption.vue

@@ -0,0 +1,341 @@
+<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">
+				<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="type">
+					<el-select v-model="valueType.type" placeholder="请选择数据类型" @change="seletChange">
+						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type"  :disabled="item.type=='object'" />
+						</el-option-group>
+					</el-select>
+				</el-form-item>
+
+				<!--根据数据类型输出不同表单-->
+
+				<el-form-item label="精度" prop="decimals" v-if="type == 'float' || type == 'double'">
+					<el-input v-model="valueType.decimals" placeholder="请输入精度" />
+				</el-form-item>
+
+				<el-form-item label="单位" prop="unit" v-if="type == 'int' || type == 'long' || type == 'float' || type == 'double'">
+					<el-input v-model="valueType.unit" placeholder="请输入单位" />
+				</el-form-item>
+
+				<el-form-item label="最大长度" prop="maxLength" v-if="type == 'string'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
+
+				<el-form-item label="时间格式" prop="maxLength" v-if="type == 'date'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
+
+				<el-form-item label="布尔值" prop="maxLength" v-if="type == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="valueType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.trueValue" placeholder="请输入布尔值"  value="true"/>
+					</div>
+
+					<div class="input-box">
+						<el-input v-model="valueType.falseText" placeholder="请输入布尔值"  value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.falseValue" placeholder="请输入布尔值"  value="false"/>
+					</div>
+				</el-form-item>
+
+				<el-form-item label="枚举项" prop="maxLength" v-if="type == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"><el-icon><Right /></el-icon></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum"  v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
+
+				<el-form-item label="JSON对象" prop="maxLength" v-if="type == 'object'">
+					<div class="input-options" @click="addJson">
+							<el-icon   ><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+				</el-form-item>
+
+
+			<div v-if="type == 'array'">
+				<el-form-item label="元素类型" prop="type" >
+					<el-select v-model="elementType.type" placeholder="请选择元素类型" @change="seletChanges">
+						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" :disabled="item.type=='array'" />
+						</el-option-group>
+					</el-select>
+				</el-form-item>
+
+
+				<el-form-item label="精度" prop="decimals" v-if="types == 'float' || types == 'double'">
+					<el-input v-model="elementType.decimals" placeholder="请输入精度" />
+				</el-form-item>
+
+				<el-form-item label="单位" prop="unit" v-if="types == 'int' || types == 'long' || types == 'float' || types == 'double'">
+					<el-input v-model="elementType.unit" placeholder="请输入单位" />
+				</el-form-item>
+
+				<el-form-item label="最大长度" prop="maxLength" v-if="types == 'string'">
+					<el-input v-model="elementType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
+
+				<el-form-item label="时间格式" prop="maxLength" v-if="types == 'date'">
+					<el-input v-model="elementType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
+
+				<el-form-item label="布尔值" prop="maxLength" v-if="types == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="elementType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="elementType.trueValue" placeholder="请输入布尔值"  value="true"/>
+					</div>
+
+					<div class="input-box">
+						<el-input v-model="elementType.falseText" placeholder="请输入布尔值"  value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="elementType.falseValue" placeholder="请输入布尔值"  value="false"/>
+					</div>
+				</el-form-item>
+
+				<el-form-item label="枚举项" prop="maxLength" v-if="types == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"><el-icon><Right /></el-icon></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum"  v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
+
+
+
+			</div>
+
+				<!--根据数据类型输出不同表单-->
+
+			
+				<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>
+</template>
+
+<script lang="ts">
+import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
+import api from '/@/api/device';
+import uploadVue from '/@/components/upload/index.vue';
+import { Plus, Minus,Right } from '@element-plus/icons-vue';
+
+import { ElMessage, UploadProps } from 'element-plus';
+
+interface RuleFormState {
+	id: number;
+	name: string;
+	desc: string;
+}
+interface DicState {
+	isShowDialog: boolean;
+	ruleForm: RuleFormState;
+	typeData: RuleFormState[];
+	rules: {};
+}
+
+export default defineComponent({
+	name: 'deviceEditPro',
+	components: { Plus, Minus,Right },
+	setup(prop, { emit }) {
+		const formRef = ref<HTMLElement | null>(null);
+
+		const state = reactive<DicState>({
+			isShowDialog: false,
+			typeData: [], //
+			type: '',
+			types:'',
+			valueType: {
+				type: '',
+				maxLength: '',
+			},
+			elementType: {
+				type: '',
+				maxLength: '',
+			},
+			enumdata: [
+				{
+					'text': '',
+					'value': '',
+				},
+			],
+
+			ruleForm: {
+				id:0,
+				name: '',
+				key: '',
+				transportProtocol: '',
+				accessMode: '0',
+				status: 1,
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
+				desc: '',
+			},
+			rules: {
+				name: [{ required: true, message: '参数名称不能为空', trigger: 'blur' }],
+				key: [{ required: true, message: '参数标识不能为空', trigger: 'blur' }],
+				accessMode: [{ required: true, message: '请选择是否只读', trigger: 'blur' }],
+			},
+		});
+
+		// 打开弹窗
+		const openDialog = (row: RuleFormState | null) => {
+			resetForm();
+
+			api.product.getDataType({ status: -1 }).then((res: any) => {
+				const datat = Object.values(res.dataType);
+				datat.forEach((item, index) => {
+					if (index == 0) {
+						datat[index]['label'] = '基础类型';
+						datat[index]['options'] = item;
+					} else {
+						datat[index]['label'] = '扩展类型';
+						datat[index]['options'] = item;
+					}
+				});
+				console.log(datat);
+				state.typeData = datat || [];
+			});
+
+			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.ruleForm = {
+				name: '',
+				desc: '',
+			};
+		};
+
+		const seletChange = (val) => {
+			state.type = val;
+			console.log(val);
+		};
+		const seletChanges = (val) => {
+			console.log(val);
+			state.types = val;
+			console.log(val);
+		};
+
+		const addEnum = () => {
+			state.enumdata.push({
+					'text': '',
+					'value': '',
+					
+				});
+		};
+		const delEnum=(index)=>{
+			state.enumdata.splice(index, 1);
+		}
+
+		const addJson=()=>{
+
+		}
+		// 关闭弹窗
+		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) {
+						//修改
+						api.product.edit(state.ruleForm).then(() => {
+							ElMessage.success('参数类型修改成功');
+							closeDialog(); // 关闭弹窗
+							emit('typeList');
+						});
+					} else {
+						//添加
+						if(state.type=='enum'){
+							state.valueType.elements=state.enumdata;
+						}
+
+						state.ruleForm.valueType = state.valueType;
+						ElMessage.success('参数类型添加成功');
+							closeDialog(); // 关闭弹窗
+							emit('typeList',state.ruleForm,state.ruleForm.type_data);
+					}
+				}
+			});
+		};
+
+		return {
+			openDialog,
+			addEnum,
+			delEnum,
+			addJson,
+			seletChange,
+			seletChanges,
+			closeDialog,
+			onCancel,
+			onSubmit,
+			formRef,
+			...toRefs(state),
+		};
+	},
+});
+</script>
+<style>
+.input-box {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	margin-top: 10px;
+}
+.input-option {
+	line-height: 30px;
+	padding-top: 5px;
+	width: 140px;
+}
+.input-option i {
+	margin: 0px 5px;
+	border: 1px solid #c3c3c3;
+	font-size: 16px;
+}
+.input-options {
+	display: flex;
+	    align-items: center;
+    color: #409eff;
+	cursor:pointer
+}
+
+</style>

+ 294 - 77
src/views/device/product/component/editTab.vue

@@ -9,7 +9,7 @@
 					<el-input v-model="ruleForm.name" placeholder="请输入标签定义名称" />
 				</el-form-item>
 
-				<el-form-item label="数据类型" prop="type">
+				<el-form-item label="数据类型" prop="type" required>
 					<el-select v-model="valueType.type" placeholder="请选择数据类型" @change="seletChange">
 						<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
 							<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" />
@@ -17,36 +17,145 @@
 					</el-select>
 				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<!--根据数据类型输出不同表单-->
 
-             <el-form-item label="精度" prop="maxLength1" v-if="type=='float' || type=='double'">
-                <el-input v-model="valueType.maxLength1" placeholder="请输入精度" />
-              </el-form-item>
-
-            	<el-form-item label="单位" prop="maxLength" v-if="type=='int' || type=='long' || type=='float'  || type=='double'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入单位" />
-              </el-form-item>
+				<el-form-item label="精度" prop="decimals" v-if="type == 'float' || type == 'double'">
+					<el-input v-model="valueType.decimals" placeholder="请输入精度" />
+				</el-form-item>
 
-              <el-form-item label="最大长度" prop="maxLength" v-if="type=='string'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
-              </el-form-item>
+				<el-form-item label="单位" prop="unit" v-if="type == 'int' || type == 'long' || type == 'float' || type == 'double'">
+					<el-input v-model="valueType.unit" placeholder="请输入单位" />
+				</el-form-item>
 
-               <el-form-item label="时间格式" prop="maxLength" v-if="type=='date'">
-                <el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
-              </el-form-item>
-             
+				<el-form-item label="最大长度" prop="maxLength" v-if="type == 'string'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入最大长度" />
+				</el-form-item>
 
-        <!--根据数据类型输出不同表单-->
+				<el-form-item label="时间格式" prop="maxLength" v-if="type == 'date'">
+					<el-input v-model="valueType.maxLength" placeholder="请输入时间格式" />
+				</el-form-item>
 
+				<el-form-item label="布尔值" prop="trueText" v-if="type == 'boolean'">
+					<div class="input-box">
+						<el-input v-model="valueType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.trueValue" placeholder="请输入布尔值" value="true" />
+					</div>
 
+					<div class="input-box">
+						<el-input v-model="valueType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+						<el-input v-model="valueType.falseValue" placeholder="请输入布尔值" value="false" />
+					</div>
+				</el-form-item>
 
+				<el-form-item label="枚举项" prop="maxLength" v-if="type == 'enum'">
+					<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+						<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+							><el-icon><Right /></el-icon
+						></span>
+						<el-input v-model="item.value" placeholder="请输入枚举文本" />
+						<div class="input-option">
+							<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+							<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+						</div>
+					</div>
+				</el-form-item>
 
+				<el-form-item label="JSON对象" prop="maxLength" v-if="type == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.name }}</div>
+							<div class="jsonoption">
+								<!-- <el-link type="primary">编辑</el-link> -->
+								<el-link type="primary" @click="deljson(index)">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<div v-if="type == 'array'">
+					<el-form-item label="元素类型" prop="types">
+						<el-select v-model="elementType.type" placeholder="请选择元素类型" @change="seletChanges">
+							<el-option-group v-for="group in typeData" :key="group.label" :label="group.label">
+								<el-option v-for="item in group.options" :key="item.type" :label="item.title" :value="item.type" :disabled="item.type == 'array'" />
+							</el-option-group>
+						</el-select>
+					</el-form-item>
+
+					<el-form-item label="精度" prop="decimals" v-if="types == 'float' || types == 'double'">
+						<el-input v-model="elementType.decimals" placeholder="请输入精度" />
+					</el-form-item>
+
+					<el-form-item label="单位" prop="unit" v-if="types == 'int' || types == 'long' || types == 'float' || types == 'double'">
+						<el-input v-model="elementType.unit" placeholder="请输入单位" />
+					</el-form-item>
+
+					<el-form-item label="最大长度" prop="maxLength" v-if="types == 'string'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入最大长度" />
+					</el-form-item>
+
+					<el-form-item label="时间格式" prop="maxLength" v-if="types == 'date'">
+						<el-input v-model="elementType.maxLength" placeholder="请输入时间格式" />
+					</el-form-item>
+
+					<el-form-item label="布尔值" prop="maxLength" v-if="types == 'boolean'">
+						<div class="input-box">
+							<el-input v-model="elementType.trueText" placeholder="请输入布尔值" value="是" /><span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.trueValue" placeholder="请输入布尔值" value="true" />
+						</div>
+
+						<div class="input-box">
+							<el-input v-model="elementType.falseText" placeholder="请输入布尔值" value="否" /> <span style="margin: 0px 10px">~</span>
+							<el-input v-model="elementType.falseValue" placeholder="请输入布尔值" value="false" />
+						</div>
+					</el-form-item>
+
+					<el-form-item label="枚举项" prop="maxLength" v-if="types == 'enum'">
+						<div class="input-box" v-for="(item, index) in enumdata" :key="index">
+							<el-input v-model="item.text" placeholder="请输入枚举值" /><span style="margin: 0px 10px"
+								><el-icon><Right /></el-icon
+							></span>
+							<el-input v-model="item.value" placeholder="请输入枚举文本" />
+							<div class="input-option">
+								<el-icon @click="addEnum" v-if="index == 0"><Plus /></el-icon>
+								<el-icon @click="delEnum(index)" v-if="index != 0"><Minus /></el-icon>
+							</div>
+						</div>
+					</el-form-item>
+				</div>
 
+				
+				<el-form-item label="JSON对象" prop="maxLength" v-if="types == 'object'">
+					<div v-for="(item, index) in jsondata" :key="index" class="jslist">
+						<div class="jsonlist">
+							<div>参数名称:</div>
+							<div style="width: 60%">{{ item.data.name }}</div>
+							<div class="jsonoption">
+								<el-link type="primary">编辑</el-link>
+								<el-link type="primary">删除</el-link>
+							</div>
+						</div>
+					</div>
+
+					<div style="display: block; width: 100%">
+						<div class="input-options" @click="addJson">
+							<el-icon><Plus /></el-icon>
+							<div>添加参数</div>
+						</div>
+					</div>
+				</el-form-item>
 
+				<!--根据数据类型输出不同表单-->
 
 				<el-form-item label="是否只读" prop="accessMode">
-					<el-radio-group v-model="ruleForm.accessMode" model-value="0">
+					<el-radio-group v-model="ruleForm.accessMode" >
 						<el-radio label="0">读写</el-radio>
 
 						<el-radio label="1">只读</el-radio>
@@ -63,6 +172,7 @@
 				</span>
 			</template>
 		</el-dialog>
+		<EditOption ref="editOptionRef" @typeList="getOptionData" />
 	</div>
 </template>
 
@@ -70,12 +180,17 @@
 import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import uploadVue from '/@/components/upload/index.vue';
+import { Plus, Minus, Right } from '@element-plus/icons-vue';
+import EditOption from './editOption.vue';
+
 import { ElMessage, UploadProps } from 'element-plus';
 
 interface RuleFormState {
 	id: number;
+	productId: number;
 	name: string;
 	dictType: string;
+	valueType: Object;
 	status: number;
 	desc: string;
 }
@@ -88,44 +203,63 @@ interface DicState {
 
 export default defineComponent({
 	name: 'deviceEditPro',
-	components: { uploadVue },
+	components: { Plus, Minus, Right, EditOption },
 	setup(prop, { emit }) {
 		const formRef = ref<HTMLElement | null>(null);
-
+		const editOptionRef = ref();
 		const state = reactive<DicState>({
 			isShowDialog: false,
 			typeData: [], //
-      type: '',
-       valueType: {
-          type:'',
-          maxLength:'',
+			type: '',
+			types: '',
+			productId:0,
+			valueType: {
+				type: '',
+				maxLength: '',
+				trueText:'是',
+				trueValue:'true',
+				falseText:'否',
+				falseValue:'false',
+			},
+			elementType: {
+				type: '',
+				maxLength: '',
+			},
+			enumdata: [
+				{
+					text: '',
+					value: '',
+				},
+			],
 
-        },
+			jsondata: [],
 
 			ruleForm: {
+				id:0,
+				productId:0,
 				name: '',
 				key: '',
 				transportProtocol: '',
-				accessMode: '0',
+				accessMode: 0,
 				status: 1,
-        valueType: {
-          type:'',
-          maxLength:'',
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
 
-        },
-				
 				desc: '',
 			},
 			rules: {
 				name: [{ required: true, message: '标签定义名称不能为空', trigger: 'blur' }],
 				key: [{ required: true, message: '标签定义标识不能为空', trigger: 'blur' }],
 				accessMode: [{ required: true, message: '请选择是否只读', trigger: 'blur' }],
-		
+				type: [{ required: true, message: '请选择数据类型', trigger: 'blur' }],
+				
 			},
 		});
 
 		// 打开弹窗
-		const openDialog = (row: RuleFormState | null) => {
+		const openDialog = (row: RuleFormState | null,productId:number | null) => {
 			resetForm();
 
 			api.product.getDataType({ status: -1 }).then((res: any) => {
@@ -139,33 +273,73 @@ export default defineComponent({
 						datat[index]['options'] = item;
 					}
 				});
-				console.log(datat);
+				console.log(row);
+				console.log(productId);
 				state.typeData = datat || [];
 			});
-
-			if (row) {
-				// api.dict.getType(row.dictId).then((res:any)=>{
-				//   state.ruleForm = res.data.dictType
-				// }
-				console.log(row);
+			state.ruleForm = row;
+			if (row.valueType) {	
 				state.ruleForm = row;
+
+				state.productId=productId;
+				state.valueType = row.valueType;
+				state.ruleForm.valueType.type = row.valueType.type;
+				state.ruleForm.type = row.valueType.type;
+				state.type = row.valueType.type ;
 			}
 			state.isShowDialog = true;
 		};
 		const resetForm = () => {
 			state.ruleForm = {
-				id: 0,
 				name: '',
-				dictType: '',
+				key: '',
+				transportProtocol: '',
+				accessMode: '0',
 				status: 1,
+				valueType: {
+					type: '',
+					maxLength: '',
+				},
+
 				desc: '',
 			};
 		};
 
-    const seletChange=(val)=>{
-      state.type=val;
-      console.log(val);
-    };
+		const seletChange = (val) => {
+			state.type = val;
+			state.ruleForm.type = val;
+		
+			
+			console.log(val);
+		};
+		const seletChanges = (val) => {
+			console.log(val);
+			state.types = val;
+			console.log(val);
+		};
+
+		const addEnum = () => {
+			state.enumdata.push({
+				text: '',
+				value: '',
+			});
+		};
+		const delEnum = (index) => {
+			state.enumdata.splice(index, 1);
+		};
+
+		const deljson = (index) => {
+			state.jsondata.splice(index, 1);
+		}
+
+		const addJson = () => {
+			editOptionRef.value.openDialog({ product_id: 0, id: 0 });
+		};
+		const getOptionData = (data) => {
+			state.jsondata.push(data);
+
+			console.log(state.jsondata);
+		};
 		// 关闭弹窗
 		const closeDialog = () => {
 			state.isShowDialog = false;
@@ -182,17 +356,44 @@ export default defineComponent({
 				if (valid) {
 					if (state.ruleForm.id !== 0) {
 						//修改
-						api.product.edit(state.ruleForm).then(() => {
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
+						state.ruleForm.productId = state.productId
+						api.model.tagedit(state.ruleForm).then(() => {
 							ElMessage.success('标签定义类型修改成功');
 							closeDialog(); // 关闭弹窗
 							emit('typeList');
 						});
 					} else {
 						//添加
-         
-            console.log(state.valueType);
-            state.ruleForm.valueType=state.valueType;
-           console.log(state.ruleForm);
+						if (state.type == 'enum') {
+							state.valueType.elements = state.enumdata;
+						}
+
+						if (state.type == 'object') {
+							state.valueType.properties = state.jsondata;
+						}
+
+						if (state.type == 'array') {
+							state.valueType.elementType = state.elementType;
+						}
+
+						console.log(state.valueType);
+
+						state.ruleForm.valueType = state.valueType;
 						api.model.tagadd(state.ruleForm).then(() => {
 							ElMessage.success('标签定义类型添加成功');
 							closeDialog(); // 关闭弹窗
@@ -204,8 +405,15 @@ export default defineComponent({
 		};
 
 		return {
+			editOptionRef,
+			getOptionData,
 			openDialog,
-      seletChange,
+			deljson,
+			addEnum,
+			delEnum,
+			addJson,
+			seletChange,
+			seletChanges,
 			closeDialog,
 			onCancel,
 			onSubmit,
@@ -215,34 +423,43 @@ export default defineComponent({
 	},
 });
 </script>
-
-<style scoped>
-.avatar-uploader .avatar {
-	width: 178px;
-	height: 178px;
-	display: block;
-}
-</style>
-
 <style>
-.avatar-uploader .el-upload {
-	border: 1px dashed var(--el-border-color);
-	border-radius: 6px;
+.input-box {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	margin-top: 10px;
+}
+.input-option {
+	line-height: 30px;
+	padding-top: 5px;
+	width: 140px;
+}
+.input-option i {
+	margin: 0px 5px;
+	border: 1px solid #c3c3c3;
+	font-size: 16px;
+}
+.input-options {
+	display: flex;
+	align-items: center;
+	color: #409eff;
 	cursor: pointer;
-	position: relative;
-	overflow: hidden;
-	transition: var(--el-transition-duration-fast);
 }
-
-.avatar-uploader .el-upload:hover {
-	border-color: var(--el-color-primary);
+.jslist {
+	width: 100%;
+	border: 1px solid #e8e8e8;
+	padding: 10px;
+	margin-bottom: 10px;
 }
-
-.el-icon.avatar-uploader-icon {
-	font-size: 28px;
-	color: #8c939d;
-	width: 178px;
-	height: 178px;
-	text-align: center;
+.jsonlist {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+.jsonoption {
+}
+.jsonoption a {
+	margin: 0px 10px;
 }
 </style>

+ 28 - 3
src/views/device/product/detail.vue

@@ -69,7 +69,7 @@
 									<el-table-column label="说明" prop="desc" :show-overflow-tooltip="true" />
 									<el-table-column label="操作" width="300" align="center">
 										<template #default="scope">
-											<el-button size="small" text type="warning">修改</el-button>
+											<el-button size="small" text type="warning" @click="onEditAttr(scope.row)">修改</el-button>
 											<el-button size="small" text type="danger" @click="onRowDel(scope.row.key,'attr')">删除</el-button>
 										</template>
 									</el-table-column>
@@ -155,7 +155,7 @@
 							:total="tableData.total"
 							v-model:page="tableData.param.pageNum"
 							v-model:limit="tableData.param.pageSize"
-							@pagination="typeList"
+							@pagination="getList"
 						/>
 					</div>
 				</el-tab-pane>
@@ -212,7 +212,7 @@ export default defineComponent({
 		const editTabRef = ref();
 		const state = reactive<TableDataState>({
 			isShowDialog: false,
-			activeName: '2', // 分类数据
+			activeName: '1', // 分类数据
 			activetab: 'attr', // 分类数据
 			detail: [],
 			tableData: {
@@ -247,6 +247,11 @@ export default defineComponent({
 			editAttrRef.value.openDialog({ product_id: route.params.id, id: 0 });
 		};
 
+		//编辑属性
+		const onEditAttr=(row: TableDataRow)=>{
+			editAttrRef.value.openDialog(row,route.params.id);
+		};
+
 		//打开添加功能弹窗
 		const onOpenEditFun = () => {
 			editFunRef.value.openDialog({ product_id: route.params.id, id: 0 });
@@ -310,6 +315,24 @@ export default defineComponent({
 		};
 
 
+		//根据不同类型获取列表
+		const getList=()=>{
+			switch (state.activetab) {
+				case 'attr':
+					getproperty();
+					break;
+				case 'fun':
+					getfunction();
+					break;
+				case 'event':
+					getevent();
+					break;
+				case 'tab':
+					gettab();
+					break;
+			}
+		};
+
 		const getproperty=()=>{
 			api.model.property(state.tableData.param).then((res: any) => {
 				state.tableData.data = res.Data;
@@ -367,6 +390,8 @@ export default defineComponent({
 			editEventRef,
 			editTabRef,
 			onRowDel,
+			onEditAttr,
+			getList,
 			getproperty,
 			getfunction,
 			getevent,

+ 8 - 8
src/views/system/dept/component/edit.vue

@@ -3,7 +3,7 @@
     <el-dialog :title="(ruleForm.deptId?'修改':'添加')+'部门'" v-model="isShowDialog" width="769px">
       <el-form ref="formRef" :model="ruleForm" :rules="rules" size="default" label-width="90px">
         <el-row :gutter="35">
-          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form-item label="所属组织" prop="organizationId">
               <el-cascader :options="orgData" :props="{ checkStrictly: true,emitPath: false, value: 'id', label: 'name' }" placeholder="请选择组织" clearable class="w100" v-model="ruleForm.organizationId">
                 <template #default="{ node, data }">
@@ -13,7 +13,7 @@
               </el-cascader>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form-item label="上级部门">
               <el-cascader :options="deptData" :props="{ checkStrictly: true,emitPath: false, value: 'deptId', label: 'deptName' }" placeholder="请选择部门" clearable class="w100" v-model="ruleForm.parentId">
                 <template #default="{ node, data }">
@@ -23,32 +23,32 @@
               </el-cascader>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="部门名称" prop="deptName">
               <el-input v-model="ruleForm.deptName" placeholder="请输入部门名称" clearable></el-input>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="负责人" prop="leader">
               <el-input v-model="ruleForm.leader" placeholder="请输入负责人" clearable></el-input>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="手机号" prop="phone">
               <el-input v-model="ruleForm.phone" placeholder="请输入手机号" clearable></el-input>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="邮箱" prop="email">
               <el-input v-model="ruleForm.email" placeholder="请输入" clearable></el-input>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="排序">
               <el-input-number v-model="ruleForm.orderNum" :min="0" :max="999" controls-position="right" placeholder="请输入排序" class="w100" />
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="部门状态">
               <el-switch v-model="ruleForm.status" :active-value="1" :inactive-value="0" inline-prompt active-text="启" inactive-text="禁"></el-switch>
             </el-form-item>

+ 7 - 7
src/views/system/role/component/editRole.vue

@@ -3,7 +3,7 @@
     <el-dialog :title="(formData.id===0?'添加':'修改')+'角色'" v-model="isShowDialog" width="769px">
       <el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px">
         <el-row :gutter="35">
-          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form-item label="上级角色">
               <el-cascader :options="list" :props="{ label: 'name',value: 'id',checkStrictly: true,emitPath: false }" placeholder="请选择上级菜单" clearable class="w100" v-model="formData.parentId">
                 <template #default="{ node, data }">
@@ -13,27 +13,27 @@
               </el-cascader>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="角色名称" prop="name">
               <el-input v-model="formData.name" placeholder="请输入角色名称" clearable></el-input>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="排序">
               <el-input-number v-model="formData.listOrder" :min="0" controls-position="right" placeholder="请输入排序" class="w100" />
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
             <el-form-item label="角色状态">
               <el-switch v-model="formData.status" :active-value="1" :inactive-value="0" inline-prompt active-text="启" inactive-text="禁"></el-switch>
             </el-form-item>
           </el-col>
-          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form-item label="角色描述">
               <el-input v-model="formData.remark" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input>
             </el-form-item>
           </el-col>
-          <!-- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+          <!-- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form-item label="菜单权限">
               <el-row :gutter="35">
                 <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
@@ -41,7 +41,7 @@
                   <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox>
                   <el-checkbox v-model="menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox>
                 </el-col>
-                <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+                <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                   <el-tree :data="menuData" ref="menuRef" :props="menuProps" :default-checked-keys="formData.menuIds" node-key="id" show-checkbox class="menu-data-tree tree-border" :check-strictly="!menuCheckStrictly" />
                 </el-col>
               </el-row>

+ 93 - 15
src/views/system/role/component/permission.vue

@@ -9,16 +9,16 @@
         </el-button>
         <template #dropdown>
           <el-dropdown-menu>
-            <el-dropdown-item>全部勾选</el-dropdown-item>
-            <el-dropdown-item>取消全选</el-dropdown-item>
-            <el-dropdown-item>展开所有</el-dropdown-item>
-            <el-dropdown-item>折叠所有</el-dropdown-item>
+            <el-dropdown-item @click.native="checkAll(true)">全部勾选</el-dropdown-item>
+            <el-dropdown-item @click.native="checkAll(false)">取消全选</el-dropdown-item>
+            <el-dropdown-item @click.native="expand(true)">展开所有</el-dropdown-item>
+            <el-dropdown-item @click.native="expand(false)">折叠所有</el-dropdown-item>
           </el-dropdown-menu>
         </template>
       </el-dropdown>
-      <el-button :disabled="step <= 0" @click="step--">上一步</el-button>
+      <el-button :disabled="step <= 0" @click="prev">上一步</el-button>
       <el-button :disabled="step >= 3" @click="next">下一步</el-button>
-      <el-button type="primary" :loading="btnLoading" :disabled="step < 3">确定</el-button>
+      <el-button type="primary" :loading="btnLoading" :disabled="step < 3" @click="submit">确定</el-button>
       <el-button @click="cancel">取消</el-button>
     </div>
     <el-steps :active="step" simple>
@@ -28,7 +28,7 @@
       <el-step title="接口权限" />
     </el-steps>
     <div class="scroll-part mt-3">
-      <el-tree ref="treeRef" :data="menuData" show-checkbox default-expand-all node-key="id" highlight-current :props="defaultProps" check-on-click-node :expand-on-click-node="false" />
+      <el-tree ref="treeRef" :data="treeData" show-checkbox default-expand-all node-key="id" highlight-current :props="defaultProps" check-on-click-node :expand-on-click-node="false" @check-change="checkChange" />
     </div>
   </el-dialog>
 </template>
@@ -36,15 +36,26 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import api from '/@/api/system';
+import { ElMessage } from 'element-plus';
 const isShowDialog = ref(false);
 const btnLoading = ref(false);
 const step = ref(0);
 const treeRef = ref();
 const title = ref('角色权限设置');
+const roleId = ref(0);
+const treeData = ref([]);
 const menuData = ref([]);
+const buttonData = ref([]);
+const listData = ref([]);
+const apiData = ref([]);
 const menuIds = ref([]);
+const buttonIds = ref([]);
+const columnIds = ref([]);
+const apiIds = ref([]);
 
 const typeList = ['menu', 'button', 'column', 'api'];
+const idsList = [menuIds, buttonIds, columnIds, apiIds];
+const treeDataList = [menuData, buttonData, listData, apiData];
 const defaultProps = {
 	children: 'children',
 	label: 'name',
@@ -52,25 +63,92 @@ const defaultProps = {
 
 const openDialog = async (row: any) => {
 	title.value = '角色权限设置 - ' + row.name;
+	roleId.value = row.id;
 	isShowDialog.value = true;
 	let res = await api.role.auth.getList(typeList[step.value]);
-	console.log(res);
+	// console.log(res);
+	treeData.value = res;
 	menuData.value = res;
 };
 const cancel = () => {
 	isShowDialog.value = false;
 };
+
+const expand = (expand: boolean) => {
+	const nodes = treeRef.value.store.nodesMap;
+	for (let i in nodes) {
+		nodes[i].expanded = expand;
+	}
+};
+
+const prev = async () => {
+	const currentStep = step.value;
+	const prevStep = step.value - 1;
+	// 获取选中id
+	const val = treeRef.value.getCheckedKeys(currentStep === 0 ? false : true);
+	idsList[currentStep].value = val;
+	treeData.value = treeDataList[prevStep].value;
+	treeRef.value.setCheckedKeys(idsList[prevStep].value);
+	step.value = prevStep;
+};
+
 const next = async () => {
-	if (step.value === 0) {
-		const val = treeRef.value.getCheckedKeys(true);
-		console.log(val);
-		menuIds.value = val;
-		let res = await api.role.auth.getList(typeList[step.value + 1], val);
-		console.log(res);
+	const nextStep = step.value + 1;
+	let res = await api.role.auth.getList(typeList[nextStep], menuIds.value);
+	// console.log(res);
+	treeData.value = res;
+	treeDataList[nextStep].value = res;
+	treeRef.value.setCheckedKeys(idsList[nextStep].value);
+
+	step.value = nextStep;
+};
+
+// 选中状态变化
+const checkChange = () => {
+	idsList[step.value].value = treeRef.value.getCheckedKeys(step.value === 0 ? false : true);
+};
+
+// 全选取消全选
+const checkAll = (all: boolean) => {
+	if (!all) {
+		treeRef.value.setCheckedKeys([]);
+	} else {
+		const ids = deepTree(treeDataList[step.value].value, []);
+		treeRef.value.setCheckedKeys(ids);
 	}
 };
 
-// openDialog({ name: '超级管理员' });
+const submit = async () => {
+	const data = {
+		menuIds: menuIds.value,
+		buttonIds: buttonIds.value,
+		columnIds: columnIds.value,
+		apiIds: apiIds.value,
+		roleId: roleId.value,
+	};
+	// console.log(data);
+
+	btnLoading.value = true;
+	api.role.auth
+		.set(data)
+		.then(() => {
+			ElMessage.success('权限设置成功');
+		})
+		.finally(() => {
+			btnLoading.value = false;
+			isShowDialog.value = false;
+		});
+};
+
+function deepTree(tree: any[], arr: number[]) {
+	for (let item of tree) {
+		arr.push(item.id);
+		if (item.children?.length) deepTree(item.children, arr);
+	}
+	return arr;
+}
+
+// openDialog({ name: '超级管理员', id: 3 });
 
 defineExpose({ openDialog });
 </script>

+ 20 - 13
src/views/system/role/index.vue

@@ -45,7 +45,8 @@
           <template #default="scope">
             <el-button size="small" type="text" @click="onOpenEditRole(scope.row)">修改</el-button>
             <el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
-            <el-dropdown size="small">
+            <el-button size="small" text type="success" @click="permission(scope.row)">角色权限</el-button>
+            <!-- <el-dropdown size="small">
               <el-button type="text" size="small" style="margin-top:1px;margin-left:10px">更多
                 <el-icon>
                   <ele-ArrowDown />
@@ -57,7 +58,7 @@
                   <el-dropdown-item @click.native="permission(scope.row)">角色权限</el-dropdown-item>
                 </el-dropdown-menu>
               </template>
-            </el-dropdown>
+            </el-dropdown> -->
           </template>
         </el-table-column>
       </el-table>
@@ -138,24 +139,30 @@ export default defineComponent({
 				confirmButtonText: '确认',
 				cancelButtonText: '取消',
 				type: 'warning',
-			})
-				.then(() => {
-					api.role.deleteRole(row.id).then(() => {
-						ElMessage.success('删除成功');
-						proxy.$refs['editRoleRef'].resetMenuSession();
-						roleList();
-					});
-				})
-				.catch(() => {});
+			}).then(() => {
+				api.role.deleteRole(row.id).then(() => {
+					ElMessage.success('删除成功');
+					proxy.$refs['editRoleRef'].resetMenuSession();
+					roleList();
+				});
+			});
 		};
+
 		// 设置权限
-		const permission = (row: any) => {
-			permissionRef.value.openDialog(row);
+		const permission = async (row: any) => {
+			const { isAllow } = await api.role.auth.isAllow(row.id);
+			if (isAllow) {
+				permissionRef.value.openDialog(row);
+			} else {
+				ElMessage.error('该角色禁止被授权');
+			}
 		};
+
 		// 页面加载时
 		onMounted(() => {
 			initTableData();
 		});
+
 		return {
 			addRoleRef,
 			editRoleRef,