<template>
    <mu-list-item button style="" nested>
        <mu-list-item-content>
            <mu-list-item-title>
                <mu-row>
                    <mu-col>{{item.name}}</mu-col>
                    <mu-col>{{item.cusareaname}}</mu-col>
                </mu-row>
            </mu-list-item-title>
            <mu-list-item-sub-title>
                <mu-row>
                    <mu-col>{{item.tele}}</mu-col>
                    <mu-col span="2">{{item.stateStr}}</mu-col>
                </mu-row>
            </mu-list-item-sub-title>
        </mu-list-item-content>
        <mu-list-item-action>
            <mu-button icon>
                <i class="iconfont icon-right"></i>
            </mu-button>
        </mu-list-item-action>
        <template v-if="ifaccount">
        <!-- <mu-list-item-sub-title slot="nested" style="margin-left:16px;color:black" v-if="item.custaccount.length > 0 ">
            <mu-row>
                <mu-col>户名</mu-col>
                <mu-col>账户</mu-col>
                <mu-col>账户备注</mu-col>
            </mu-row>
        </mu-list-item-sub-title> -->
        <div slot="nested" v-for="(item,i) in item.custaccount" style="margin-left:16px;display:flex">
                     <!-- <mu-row wrap>
                        <mu-col span="3">{{item.accountname}}</mu-col>
                        <mu-col span="4"><span>{{item.account}}</span></mu-col>
                        <mu-col span="4">{{item.dscrp}}</mu-col>
                    </mu-row> -->
                   <!-- 、、 <div style="display:flex"> -->
                        <span style="width:20%;margin-right:2%;word-wrap: break-word;overflow: hidden;">{{item.accountname}}</span>
                        <span style="width:38%;margin-right:2%; word-wrap: break-word;overflow: hidden;text-align:center">{{item.account}}</span>
                        <span  style="width:38%;word-wrap: break-word;overflow: hidden;text-align:center">{{item.dscrp}}</span>
                        <!-- <span style="flex: 0 0 20%">{{item.accountname}}</span>
                        <span style="flex: 0 0 20%;border: solid;">{{item.account}}</span>
                        <span  style="flex: 0 0 60%">{{item.dscrp}}</span> -->
                    <!-- </div> -->
        </div> 
        </template>
    </mu-list-item>
</template>

<script>
    export default {
        name: "cust-item",
        props: {
            item: {
                // 传入数据
                type: Object
            },
            ifaccount:{
                type:Boolean,
                default:false
            }
        },
        data() {
            return {
                showCount: 0
                // selectMode: false
            }
        }
    }
</script>