tqApp-webView/components/tq-work-type/index.vue

<template>
    <xm-cascader 
		ref="cascaderRef"
		v-model="value" 
		:options="list" 
		:checkStrictly="checkStrictly" 
		@input="handleInput" 
		:showAllLevels="true"
		@confirm="handleConfirm"
		:props="{
			value: 'id',
			label: 'name',
			children: 'children'
		}"
	>
	</xm-cascader>
</template>

<script>
import { dropDownList} from "@/api/common/system.js";
import {clearProps,copyProps,toTree} from '@/utils/gdtq.js'

export default {
    props: {

        checkStrictly: { //传入此参数columns无效
            type: Boolean,
            default: true,
        },
		
    },

    data() {
        return {
			value: '',
            list: [
				/* {
                    "code": 1,
                    "areaName": "Parent 1",
                    "parentId": 0,
                    "child": [{
                            "code": 2,
                            "areaName": "Child 1.1",
                            "parentId": 1,
                            "child": []
                        },
                        {
                            "code": 3,
                            "areaName": "Child 1.2",
                            "parentId": 1,
                            "child": []
                        }
                    ]
                }, */
			],
        }
    },
	
    created() {
       this.initOptions()
    },
    methods: {
		async initOptions() {
			
			let { data } = await dropDownList({});
			 this.list = toTree(data, "id", "parentId");
		},
		handleInput(e) {
			// console.log(e,'eeee')
		},
		
        show() {
			this.$refs.cascaderRef.openDept()
        },

        close() {
			this.$refs.cascaderRef.close()
        },

        handleConfirm(e) {
            this.$emit('confirm', e)
        },

    }
}
</script>

<style lang="scss" scoped></style>