// Выбрать все функции
function checkAll(c) {
    var arr = document.getElementsByTagName("myname");
    if(c) {
        // Перебрать все флажки
        for(var i = 0;i<arr.length;i++) {
            arr[i].checked = true;   // выбрано
        }
    }else {
        // Перебрать все флажки
        for(var i = 0;i<arr.length;i++) {
            arr[i].checked = false; // Нетвыбрано
        }
    }
}

<input type="checkbox" name="mayall" onclick="checkAll(this.checked)" />Выбрать все<br />
<input type="checkbox" name="myname" />внешний интерфейс&nbsp;&nbsp;
<input type="checkbox" name="myname" />задняя часть&nbsp;&nbsp;
<input type="checkbox" name="myname" />Мини программа

<template>
    <div class="wrap">
        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">Выбрать все</el-checkbox>
            <div style="margin: 15px 0;"></div>
            <el-checkbox-group v-model="checkedLanNames" @change="handleCheckedlanguagesChange">
                <el-checkbox v-for="lan in checkedLanOptions" :label="lan.type" :key="lan.name">{{lan.name}}</el-checkbox>
        </el-checkbox-group>
    </div>
</template>

<script>
    export default {
        name: 'checkedAll',
        data() {
            return {
                checkAll: true, // По умолчанию выбрано все, true означает выбрать все, false — не выбирать все.
                checkedLanNames: [], // Привязка по умолчанию выбрана
                type: "", // Строка кода передается на серверную часть
                languages: [
                    {
                        type:'1',
                        name: "внешний интерфейс"
                    },
                    {
                        type:'2',
                        name: "задняя часть"
                    },
                    {
                        type:'3',
                        name: «мини-программа»
                    },
                    {
                        type:'4',
                        name: «Облачная разработка»
                    },
                ],
                isIndeterminate: true
            };
       },

       mounted () {
           this.checkedLanNames = this.languages.map(item => item.type);
       },

       computed: {
         checkedLanOptions() {
            return this.languages;
         }
       },

       methods: {
        handleCheckAllChange(val) {
            //console.log("Выбрать все", val); // val — это значение, привязанное к v-модели, то есть this.checkAll
            if (this.checkAll) {
                  // 当Выбрать все被выбранокогда,Перебирать исходные данные, добавьте каждый элемент данных в массив выбранных по умолчанию
                 this.checkedLanNames = this.languages.map((item) => item.type);
                } else {
                    this.checkedLanNames = [];
                    this.type = "";
                }
                this.isIndeterminate = false;
        },
        handleCheckedlanguagesChange(value) {
                // value — это значение, привязанное к v-модели, то есть this.checkedLanNames.
                console.log(value);
                if (this.checkedLanNames.length == this.languages.length) {
                    this.checkAll = true;
                } else {
                    this.checkAll = false;
                }
                this.type = this.checkedLanNames.join(",");  // Используйте запятые, чтобы объединить его в строку и передать на серверную часть.
        }
    }
}
</script>

<style lang="scss" scoped>
.wrap {
    text-align: center;
    margin:20px 0 20px 0;
}
</style>