guoyao-jiankang/application/admin/view/common/multicascader.html

<style>
    .el-select .el-input.is-focus .el-input__inner {
        border-color: #18a689;
    }
    .el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
        color: #18a689;
        background-color: #fff;
    }
    .el-select-dropdown__item.selected {
        color: #18a689;
        font-weight: 700;
    }
    .el-select .el-input .el-select__caret {
        font-weight: bold;
        color: #555;
    }
    .el-input__inner {
        border-radius: 0px;
    }
    .el-cascader .el-input .el-input__inner:focus, .el-cascader .el-input.is-focus .el-input__inner {
        border-color: #18a689;
    }
</style>
<div id="{$name}">
    <input type="hidden" name="{$name}" value="{:implode(',',$val)}">

    <el-tree
            :props="props"
            show-checkbox
            :data="options"
            node-key="id"
            :default-checked-keys="value"
            default-expand-all="true"
            @check-change="handleCheckChange">
    </el-tree>
</div>
<script>
    new Vue({
        el: '#{$name}',
        data: function() {
            return {
                props:{
                    label: 'label',
                    children: 'children'
                },
                options: {:json_encode($lists)},
                value: {:json_encode($val)},

            }
        },
        watch: {
            value: function (newVal, oldVal) {
               $('input[name={$name}]').val(newVal.join(','));
            }
        },
        methods: {
            handleCheckChange(data, checked, indeterminate) {
               if(checked){
                   this.value.push(data.id);
               }else {
                   this.value.forEach((item,index) =>{
                       if(item===data.id){
                       this.value.splice(index,1);
                       }
                   });

               }
                $('input[name={$name}]').val(this.value.join(','));
               console.log( this.value);
            },


        }
    })
</script>