1

src/components/treeChoice/index.vue → src/components/deptTreeChoice/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="tree-choice">
-		<!-- <el-input placeholder="输入名称搜索" v-model="filterText" style="margin-bottom: 10px"></el-input> -->
+		<el-input placeholder="输入名称搜索" v-model="filterText" style="margin-bottom: 10px"></el-input>
 		<el-tree
 			:data="dataList"
 			node-key="id"
@@ -11,6 +11,7 @@
 			ref="tree"
 			@node-click="nodeClick"
 			show-checkbox
+			:default-checked-keys="defaultChecked"
 			:props="{ disabled: () => true }"
 		>
 			<span class="custom-tree-node" slot-scope="{ data }">
@@ -22,6 +23,10 @@
 
 <script>
 	export default {
+		model: {
+			prop: 'modelValue',
+			event: 'dataChange'
+		},
 		props: {
 			dataList: Array,
 			nodeKey: {
@@ -31,6 +36,10 @@
 			nodeVal: {
 				type: String,
 				default: 'name'
+			},
+			modelValue: {
+				type: Array,
+				required: true
 			}
 		},
 		data() {
@@ -39,6 +48,25 @@
 				filterText: ''
 			}
 		},
+		computed: {
+			deptIds: {
+				get() {
+					return this.modelValue
+				},
+				set(val) {
+					this.$emit('dataChange', val)
+				}
+			},
+			//选中节点
+			defaultChecked() {
+				let ids = this.$store.state.user.dataPermissions
+				if (ids.includes('*')) {
+					return this.getAllIds(this.dataList)
+				} else {
+					return ids
+				}
+			}
+		},
 		watch: {
 			filterText(val) {
 				this.$refs.tree.filter(val)
@@ -51,8 +79,24 @@
 				return data[this.nodeVal].indexOf(value) !== -1
 			},
 			nodeClick(data) {
-				console.log(data)
-				this.$emit('itemClick', data)
+				let ids
+				if (data.children && data.children.length) {
+					ids = this.getAllIds(data.children)
+				} else {
+					ids = []
+				}
+				ids.push(data.id)
+				this.deptIds = ids.filter((item) => this.defaultChecked.includes(item))
+			},
+			getAllIds(parents) {
+				let arrs = []
+				parents.forEach((item) => {
+					arrs.push(item.id)
+					if (item.children && item.children.length) {
+						arrs = [...arrs, ...this.getAllIds(item.children)]
+					}
+				})
+				return arrs
 			}
 		}
 	}

src/store/modules/user.js

@@ -8,7 +8,8 @@ const user = {
 		name: '',
 		avatar: '',
 		roles: [],
-		permissions: []
+		permissions: [],
+		dataPermissions: []
 	},
 
 	mutations: {
@@ -26,6 +27,9 @@ const user = {
 		},
 		SET_PERMISSIONS: (state, permissions) => {
 			state.permissions = permissions
+		},
+		SET_DATA_PERMISSIONS: (state, dataPermissions) => {
+			state.dataPermissions = dataPermissions
 		}
 	},
 
@@ -73,6 +77,7 @@ const user = {
 							} else {
 								commit('SET_ROLES', ['ROLE_DEFAULT'])
 							}
+							commit('SET_DATA_PERMISSIONS', user.dataJurisdictionIds.split(','))
 							commit('SET_NAME', user.userName)
 							commit('SET_AVATAR', avatar)
 							resolve(res)

src/views/index.vue

@@ -3,14 +3,11 @@
 </template>
 
 <script>
-	import area from '@/utils/area.js'
 	export default {
 		data() {
 			return {}
 		},
-		mounted() {
-			console.log(JSON.parse(JSON.stringify(area)))
-		}
+		mounted() {}
 	}
 </script>
 

src/views/system/stockLocation/index.vue

@@ -1,15 +1,15 @@
 <template>
 	<div class="page-container">
 		<div class="content-container">
-			<TreeChoice :dataList="deptList" nodeKey="id" nodeVal="label" @itemClick="menuClick" />
-			<div class="main"></div>
+			<TreeChoice :dataList="deptList" nodeKey="id" nodeVal="label" v-model="hasDeptIds" />
+			<div class="main"> </div>
 		</div>
 	</div>
 </template>
 
 <script>
 	import { deptList } from '@/api/system/stockLocation.js'
-	import TreeChoice from '@/components/treeChoice/index.vue'
+	import TreeChoice from '@/components/deptTreeChoice/index.vue'
 	export default {
 		name: 'stockLocation',
 		components: {
@@ -18,7 +18,9 @@
 		data() {
 			return {
 				//部门数据
-				deptList: []
+				deptList: [],
+				//拥有权限的部门id数组
+				hasDeptIds: []
 			}
 		},
 		created() {

src/views/system/tableHead/index.vue

@@ -73,7 +73,7 @@
 <script>
 	import { listMenu, tableHeadAdd, tableHeadList, tableHeadUpd, tableHeadDel } from '@/api/system/tableHead'
 	import { checkPermi } from '@/utils/permission'
-	import TreeChoice from '@/components/treeChoice/index.vue'
+	import TreeChoice from '@/components/deptTreeChoice/index.vue'
 	export default {
 		name: 'TableHead',
 		dicts: ['sys_tableHead_required'],