|
@@ -1,103 +0,0 @@
|
|
|
-<template>
|
|
|
- <el-collapse v-model="activeNames">
|
|
|
- <template v-if="collapseItems && collapseItems.length >0">
|
|
|
- <el-collapse-item v-for="(item, index) of collapseItems" :key="index" :name="index+1">
|
|
|
- <template slot="title">
|
|
|
- <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange($event,item)">{{item.title}}</el-checkbox>
|
|
|
- </template>
|
|
|
- <el-checkbox-group v-if="item.data && item.data.length > 0" v-model="value" @change="handleCheckedItemChange($event,item)">
|
|
|
- <el-checkbox v-for="dataItem in item.data" :label="dataItem.value" :key="dataItem.value">{{dataItem.label}}</el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </el-collapse-item>
|
|
|
- </template>
|
|
|
- </el-collapse>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script lang="ts">
|
|
|
-/*
|
|
|
- 配置说明
|
|
|
- config:{
|
|
|
- attr:{
|
|
|
- retType:'' //返回值类型 string/arrary
|
|
|
- },
|
|
|
- collapseItems:[{
|
|
|
- title:'',
|
|
|
- data:[{
|
|
|
- label:'选项一',
|
|
|
- value:1
|
|
|
- },{
|
|
|
- label:'选项二',
|
|
|
- value:2
|
|
|
- }]
|
|
|
- }]
|
|
|
- }
|
|
|
-*/
|
|
|
-import { Component, Prop, Vue, Watch } from "vue-property-decorator";
|
|
|
-import VueViews from '@/benyun/compVue/VueViews'
|
|
|
-@Component
|
|
|
-export default class CollapseCheckbox extends VueViews {
|
|
|
- value:Array<any>=[]
|
|
|
- activeNames:Array<any>=[1]
|
|
|
- checkAll= false
|
|
|
- isIndeterminate= false
|
|
|
-
|
|
|
- get collapseItems(){
|
|
|
- let data:Array<any>=[];
|
|
|
- if(this.config?.collapseItems){
|
|
|
- data = this.config.collapseItems
|
|
|
- }
|
|
|
- return data;
|
|
|
- }
|
|
|
- created(){
|
|
|
- if(this.propConfig){
|
|
|
- this.setConfig(this.propConfig)
|
|
|
- }
|
|
|
- }
|
|
|
- mounted(){}
|
|
|
-
|
|
|
- setValue(v:any){
|
|
|
- if(v){
|
|
|
- this.value = v
|
|
|
- }else{
|
|
|
- this.value = []
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- getValue(){
|
|
|
- if(this.attrs.retType){
|
|
|
- let n='';
|
|
|
- for(const item of this.value){
|
|
|
- if(!n){
|
|
|
- n = n + ',' + item
|
|
|
- }else{
|
|
|
- n = item
|
|
|
- }
|
|
|
- }
|
|
|
- return n;
|
|
|
- }else{
|
|
|
- return this.value;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- handleCheckAllChange(val:any,config:any){
|
|
|
- this.value = []
|
|
|
- if(val && config.data){
|
|
|
- for(const item of config.data){
|
|
|
- this.value.push(item.value)
|
|
|
- }
|
|
|
- }
|
|
|
- this.isIndeterminate = false;
|
|
|
- }
|
|
|
-
|
|
|
- handleCheckedItemChange(value:any,config:any){
|
|
|
- let checkedCount = value.length;
|
|
|
- this.checkAll = checkedCount === config.data.length;
|
|
|
- this.isIndeterminate = checkedCount > 0 && checkedCount < config.data.length;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
-
|
|
|
-</style>
|