<!-- 
 * @description: 
 * @fileName: index.vue 
 * @author: lh 
 * @date: 2021-08-05 19:11:55 
 * @后台人员:  
 * @path:  
 * @version: V1.0.5 
!-->
<template>
  <div class="page-container">
      <div class="button-item">
          
      </div>
      <div class="button-item">
          <el-rrf-activity-information type='big' :activityInfo='activityInfo' />
      </div>
      <div class="button-item">
          <el-rrf-merchant-overview :overviewList='overviewList'  />
      </div>
      <div class="button-item">
          <el-rrf-table-header :titleShow='false' :handerStyle="'pos-header'" :config="config" :data.sync="data"/>
      </div>
       <div class="button-item">
          <el-rrf-merchant-profile :profile="profile"/>
      </div>
      <div class="button-item">
          <el-rrf-select-tree :code="selsetTreeCode" @changeValue="changeValue" :options="selsetTreeList" placeholder="请选择"  :showOptions="selsetTreeShowOptions" :model="selsetTreeUserName" />
      </div>
      <div class="button-item">
          带文字的switch按钮：<el-rrf-text-switch @switchChange="switchChange" :open="switchOpen" />
      </div>
      <div class="button-item">
          <el-rrf-left-tab :tabList="leftTab" @chooseTab="chooseLeftTab" />
      </div>
      <div class="button-item">
          <el-rrf-merchant-photos :photos="photos"/>
      </div>
      <div class="button-item">
          <el-rrf-audit-photos :photos="auditPhotos"/>
      </div>
      <div class="button-item">
          <el-rrf-statistics-list :list="statisticsList" />
      </div>
      
      <div class="button-item">
          <el-rrf-merchant-settlement :settlement="settlement"/>
      </div>
      <div class="button-item">
          <el-rrf-merchant-device :device="device"/>
      </div>
      <div class="button-item">
          <el-rrf-pay-type :payType="payType"/>
      </div>
      <div class="button-item">
          <el-rrf-merchant-statistics :statistics="statistics"/>
      </div>
      <div class="button-item">
          <el-rrf-base-info-alone :baseInfoAlone="baseInfoAlone"/>
      </div>
      <div class="button-item">
          <el-rrf-base-info :baseInfo="baseInfo"/>
      </div>
      <div class='button-item'>
          <el-rrf-header-title :headeTitle='headeTitle' />
      </div>
      <div class='button-item'>
         <el-rrf-add-role :addData='addData' />
      </div>
      <div class='button-item'>
            <el-rrf-link @click="showDialog">查看el-rrf-dialog</el-rrf-link>
            <el-rrf-dialog
                :visible="dialogVisible"
                @updateVisible="(val)=>{this.dialogVisible = val}"
                title="提交驳回理由"
                :footer="true"
                footerTips="设备数量：01"
                >
                    这就是dialog
            </el-rrf-dialog>
      </div>
      <div class="button-item">
           <el-rrf-table
                :tableData="tableData"
                :type="'selection'"
                :tableHeader="tableHeader1"
                @cell-events="cellClk"
                @size-change="sizeChanges"
                @current-change="currentChanges"
                @multipleSelection="multipleSelection"
                title=""
            >
                <template slot-scope="scope">
                    <img
                        :src="scope.row.headImg"
                        alt=""
                        style="width: 100px; height: 100px;"
                    />
                </template>
            </el-rrf-table>
      </div>
      <div class="button-item">
          <el-rrf-tree :data="treeData" show-checkbox  />
      </div>
  </div>
</template>

<script>
import ElRrfTree from 'pkgs/RfTree/src'
import ElRrfMerchantStatistics from "pkgs/RfMerchantStatistics/src";
import ElRrfMerchantProfile from "pkgs/RfMerchantProfile/src";
import ElRrfTable from "pkgs/RfTable/src";
import ElRrfTableHeader from "pkgs/RfTableHeader/src";
import ElRrfBaseInfo from "pkgs/RfBaseInfo/src";
import ElRrfBaseInfoAlone from "pkgs/RfBaseInfoAlone/src";
import ElRrfMerchantPhotos from "pkgs/RfMerchantPhotos/src";
import ElRrfPayType from "pkgs/RfPayType/src";
import ElRrfMerchantDevice from "pkgs/RfMerchantDevice/src";
import ElRrfMerchantSettlement from "pkgs/RfMerchantSettlement/src";
import ElRrfHeaderTitle from "pkgs/RfHeaderTitle/src"
import ElRrfAddRole from "pkgs/RfAddRole/src"
import ElRrfAuditPhotos from "pkgs/RfAuditPhotos/src"
import ElRrfDialog from "pkgs/RfDialog/src"
import ElRrfLink from "pkgs/RfLink/src"
import ElRrfMerchantOverview from 'pkgs/RfMerchantOverview/src'
import ElRrfActivityInformation from 'pkgs/RfActivityInformation/src'
import ElRrfStatisticsList from 'pkgs/RfStatisticsList/src'
import ElRrfSelectTree from 'pkgs/RfSelectTree/src'
import ElRrfTextSwitch from 'pkgs/RfTextSwitch/src'
import ElRrfLeftTab from 'pkgs/RfLeftTab'

export default {
    components: {
        ElRrfTree,
        ElRrfMerchantStatistics,
        ElRrfTable,
        ElRrfBaseInfo,
        ElRrfTableHeader,
        ElRrfMerchantProfile,
        ElRrfMerchantPhotos,
        ElRrfPayType,
        ElRrfMerchantDevice,
        ElRrfMerchantSettlement,
        ElRrfBaseInfoAlone,
        ElRrfHeaderTitle,
        ElRrfAddRole,
        ElRrfAuditPhotos,
        ElRrfDialog,
        ElRrfLink,
        ElRrfMerchantOverview,
        ElRrfActivityInformation,
        ElRrfStatisticsList,
        ElRrfSelectTree,
        ElRrfLeftTab,
        ElRrfTextSwitch
    },
    data() {
        return {
            leftTab: {
                active: '1',
                list: [
                    {label: '大POS', value: '1'},
                    {label: '电签POS', value: '2'},
                    {label: 'MPOS', value: '3'}
                ]
            },
            switchOpen:false,
            selsetTreeUserName: '',
            selsetTreeCode: 'selsetTreeUserName',
            selsetTreeShowOptions: {},
            selsetTreeList: [
                {
                    id: 1,
                    label: '一级 1',
                    children: [{
                        id: 4,
                        label: '二级 1-1',
                        children: [{
                        id: 9,
                        label: '三级 1-1-1'
                        }, {
                        id: 10,
                        label: '三级 1-1-2'
                        }]
                    }]
                }
            ],
            treeData: [
                {
                    label: '一级 1',
                    children: [
                        {
                            label: '二级 1-1',
                            children: [
                                {label: '三级 1-1-1',children:[]}
                            ]
                        }
                    ]
                }
            ],
            statisticsList: {
                activeList: {value: '11', label: '总库存量 (台) ', code: '0'},
                otherList: [
                    {value: '123', label: '大POS (台) ', code: '1'},
                    {value: '233', label: 'MPOS (台) ', code: '2'},
                    {value: '222', label: '电签POS (台) ', code: '3'}
                ]
            },
            activityInfo:{
                height: 'mt16',
                title: '商家概况',
                list: [
                    {title: '押金活动', tips: '押金58不返商家', content: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。', success: true},
                    {title: '押金活动', tips: '押金58不返商家', content: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。', success: true},
                    {title: '押金活动', tips: '押金58不返商家', content: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。', success: false}
                ]
            },
            overviewList:[
                {
                    icon:'ic_money',
                    name:'账户明细',
                    list:[
                        {label: '账户余额：', value:['￥88.00'], },
                        {label: '押金冻结：', value: ['￥0.00'], },
                    ],
                },
                {
                    icon:'ic_mobile',
                    name:'已绑定终端',
                    list:[
                        {label: '大POS：', value:[8738394834384]},
                        {label: '大POS：', value:[8738394834384]},
                    ],
                    clickFn:this.goDetail
                },
                {
                    icon:'ic_card',
                    name:'商家已认证信用卡',
                    list:[
                        {label: '7张'},
                    ],
                    clickFn:this.goDetail
                },
                {
                    icon:'ic_way',
                    name:'已绑定通道商户号',
                    list:[
                        {label: '海科：', value:['8738394834384','8738394834384']},
                    ],
                },
                
            ],
            dialogVisible: false,
            headeTitle:{
                title:"角色管理",
                tips:"默认角色，根据员工的智能选择角色，可以直接在员工管理处添加账号；可以创建自定义角色，自主选择账号对应的权限范围"
            },
            statistics: {
                title: "商家统计",
                list: [
                    {num: 2233, desc: "累计商家数"},
                    {num: 2399, desc: "累计连锁商家数"},
                    {num: 23993, desc: "累计单店商家数"}
                ]
            },
            addData:{
                title:'添加角色',
                desc:'点击可以添加角色',
                clickFn:this.addDataFn
            },
            device: {
                title: '门店设备',
                subTitle: '共有9个智能设备',
                list: [
                    {
                        title: '小青竹全能付',
                        num: 7,
                        label: '型号：',
                        value: 'ME55',
                        image: 'qnf_shebei'
                    },
                    {
                        title: '油宝宝',
                        num: 7,
                        label: '型号：',
                        value: '商米台式全系列',
                        image: 'ybb_shebei'
                    }
                ]
            },
            settlement:{
                title: '结算账户',
                subTitle: '共2个结算账户',
                list: [
                    {
                        title: '中国工商银行',
                        clickFun: this.editDomain,
                        id: {label:'ID：',value:'1001'},
                        name: '何派',
                        svType: '企业账户-对法人',
                        bindType: '绑定门店',
                        no: {
                             value: '1020202020000',
                             valueNo: '**** **** **** 0001',
                             eyeStatus: true, 
                             eyeClick: this.eyeClick, 
                             encryptionType: 'bankCard',
                        },
                        payType: ['zfb','wx','yl','ic_card'],
                    },
                    {
                        title: '中国工商银行',
                        clickFun: this.editDomain,
                        id: {label:'ID：',value:'1001'},
                        name: '何派',
                        svType: '企业账户-对法人',
                        bindType: '绑定设备',
                        no: {
                             value: '1020202020000',
                             valueNo: '**** **** **** 0001',
                             eyeStatus: true, 
                             eyeClick: this.eyeClick, 
                             encryptionType: 'bankCard',
                        },
                        payType: ['zfb','wx','yl','ic_card'],
                    },
                ]
            },
            photos: {
                title: "门店照片",
                list: [
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg111', desc: "门店门头照"},
                    {image: 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg', desc: "门店全景照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', desc: "收银台照"}
                ]
            },
            auditPhotos:[
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg111', desc: "门店门头照"},
                    {image: 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg', desc: "门店全景照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', desc: "收银台照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg111', desc: "门店门头照"},
                    {image: 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg', desc: "门店全景照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', desc: "收银台照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg111', desc: "门店门头照"},
                    {image: 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg', desc: "门店全景照"},
                    {image: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', desc: "收银台照"}
            ],
            payType:{
                title: '支付方式',
                list: [
                    {
                      image: 'zfb',
                      title: '支付宝',
                      clickFun: this.editDomain,
                      list:[
                          {
                            title: '签约费率：',
                            list:['0.38%']
                          },
                          {
                            title: '结算周期：',
                            list:['D+1']
                          },
                       ]
                    },
                    {
                      image: 'wx',
                      title: '微信',
                      clickFun: this.editDomain,
                      list:[
                          {
                            title: '签约费率：',
                            list:['0.38%']
                          },
                          {
                            title: '结算周期：',
                            list:['D+1']
                          },
                       ]
                    },
                    {
                      image: 'yl',
                      title: '银联二维码',
                      clickFun: this.editDomain,
                      list:[
                          {
                            title: '签约费率：',
                            list:['贷记0.60%','借记0.55%/25元封顶','小额0.38%0.38%']
                          },
                          {
                            title: '结算周期：',
                            list:['D+1']
                          },
                       ]
                    },
                    {
                      image: 'ic_card',
                      title: '刷卡',
                      clickFun: this.editDomain,
                      list:[
                          {
                            title: '签约费率：',
                            list:['贷记0.60%','借记0.55%/25元封顶','小额0.38%0.38%']
                          },
                          {
                            title: '结算周期：',
                            list:['D+1']
                          },
                       ]
                    },
                ]
            },
            profile:{
                title: '商家概况',
                list: [
                    {
                      image: 'mdgk',
                      title: '商家门店概况',
                      num: 300,
                      jump: true,
                      clickFun: this.editDomain,
                      list:[
                        {label: '一团火：', value: 100},
                        {label: '一团火：', value: 100},
                        {label: '一团火：', value: 100},
                        {label: '一团火：', value: 100},
                      ]  
                    },
                    {
                      image: 'ic_mobile',
                      title: '商家设备情况',
                      num: 200,
                      jump: false,
                      list:[
                        {label: 'POS机：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: 'POS机：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                        {label: '收款码：', value: 100},
                      ]  
                    },
                    {
                      image: 'sjjs',
                      title: '商家结算账户概况',
                      num: 400,
                      jump: true,
                      clickFun: this.editDomain,
                      list:[
                        {label: '企业账户-对公：', value: 1},
                        {label: '企业账户-对法人：', value: 1},
                      ]  
                    }
                ]
            },
            data:{
                productId: '',
                productName: '',
                productType: '',
                type: '',
                time: '',
                address:''
            },
            config:[
                {title: '拓展员', code: 'productType'},
                {title: '产品编号', code: 'productId',  keyup:this.keyup},
                {title: '产品名称', code: 'productName'},
                {title: '注册时间', code: 'time', type: 'daterange', startPlaceholder:"开始日期", endPlaceholder: "结束日期", pickerOptions:{ disabledDate(date) { return date.getTime() >= Date.now();} } },
                {title: '产品周期', code: 'type', type: 'select', placeholder:"全部",
                    options:[
                        {value: 0, label: '未到期'},
                        {value: 1, label: '已到期'}
                    ]
                },
                {
                    title: '交易金额', 
                    type: 'startAndEndInput',
                    centerText: '至',
                    startInput: {code: 'startMoney', placeholder: '请输入', append: '元'},
                    endInput: {code: 'endMoney', placeholder: '请输入', append: '元'}
                },
                {
                    title: '选择拓展员',
                    type: 'selectTree',
                    code: 'selectTree',
                    selsetTreeShowOptions: {},
                    changeValue: this.tableHeaderChangeValue,
                    selsetTreeList: [
                        {
                            id: 1,
                            label: '一级 1',
                            children: [{
                                id: 4,
                                label: '二级 1-1',
                                children: [{
                                id: 9,
                                label: '三级 1-1-1'
                                }, {
                                id: 10,
                                label: '三级 1-1-2'
                                }]
                            }]
                        }
                    ],
                }
            ],
            baseInfoAlone:
                {
                    title: '基本信息',
                    edit: true,
                    clickFun: this.editDomain,
                    list:[
                        [
                            {label: "商家MID：", value: "0000001",},
                            {label: "商家地址：", value: "内蒙古呼和浩特市恩和大厦"},
                            {label: "注册时间：", value: "2021-10-01"}
                        ],
                        [
                            {label: "商家简称：", value: "一团火有限公司", },
                            {label: "手机号：", value: "******2345", id: "123", eyeStatus: true, eyeClick: this.eyeClick, encryption: true, encryptionType: 'mobile'},
                            {label: "营业执照照片：", value: ['https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg','https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'], showImage: true}  
                        ],
                        [
                            {label: "商家类型：", value: "连锁商家"},
                            {label: "使用门店：", value:[
                                {name:'梅姐缸缸火锅',vlaue:20872, clickFn:this.routerLink},
                                {name:'梅姐缸缸火锅',vlaue:20872, clickFn:this.routerLink}
                            ], link: true }
                        ]
                    ]
                }
            ,
            baseInfo:[
                {
                    title: '基本信息',
                    edit: true,
                    clickFun: this.editDomain,
                    list:[
                        [
                            {label: "商家MID：", value: "0000001"},
                            {label: "商家地址：", value: "内蒙古呼和浩特市恩和大厦"},
                            {label: "注册时间：", value: "2021-10-01"}
                        ],
                        [
                            {label: "商家简称：", value: "一团火有限公司",},
                            {label: "联系人：", value: "小李"},
                            {label: "拓展员：", value: "小李",}  
                        ],
                        [
                            {label: "商家类型：", value: "连锁商家"},
                            {label: "手机号：", value: "******2345", eyeStatus: true, eyeClick: this.eyeClick, encryption: true, encryptionType: 'mobile', id: "123"}
                        ]
                    ]
                },{
                    title: '工商信息',
                    list:[
                        [
                            {label: "工商名称：", value: "一团火有限公司"},
                            {label: "法人：", value: "张萧"},
                            {label: "营业执照照片：", value: ['https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg','https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'], showImage: true}
                        ],
                        [
                            {label: "营业执照有效期：", value: "2010-10-01 至 长期"},
                            {label: "身份证有效期：", value: "2010-10-10至2030-10-09"}
                        ]
                    ]
                }
            ],
            tableData: [
                {
                    name: '18534625325',
                    storeName: '北京麻辣烫',
                    userNo: '百盛集团',
                    memberGrade: '集团商家',
                    vip:'会员权益',
                    payType: ['zfb','wx','yl','sk'],
                    rateTable: {
                        value: '9月活动费率1',
                        popoverWidth:200,
                        tableHeader: [
                            {
                                label:'贷记卡',
                                prop:'creditCard',
                                minWidth: '100px'
                            },
                            {
                                label:'借记卡',
                                prop:'debitCard',
                                 minWidth: '100px'
                            },
                            {
                                label:'借记卡封顶',
                                prop:'capped',
                                minWidth: '100px'
                            },
                            {
                                label:'微信支付',
                                prop:'wx',
                                minWidth: '100px'
                            },
                            {
                                label:'支付宝支付',
                                prop:'zfb',
                                minWidth: '100px'
                            },
                            {
                                label:'银联二维码',
                                prop:'unionPay',
                                minWidth: '100px'
                            }
                        ],
                        tableData: [
                            {
                                creditCard:'0.58',
                                debitCard:'0.58',
                                capped:'2',
                                wx:'0.58',
                                zfb:'0.58',
                                unionPay:'0.58'
                            }
                        ]


                    },
                    totalFee: {
                        value: '1000',
                        trigger: 'hover',
                        popperContent: {
                            title: '总手续费：￥10.00',
                            content: [
                                {label: '交易手续费：', value: '￥8.00'},
                                {label: 'T0服务费：', value: '￥2.00'}
                            ]
                        }
                    },
                    activationStatus: {
                        value: '已激活',
                        trigger:'hover',
                        popverList:{
                            list:[
                                {label: '激活时间：', value: '2021-12-30 10:22:09'},
                                {label: '终端活动：', value: '押金58不返商家'},
                            ],
                            tips: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。'
                        }
                    },
                    snNumber:{
                        value: '000057028325100089等50台',
                        clickFun: this.editDomain
                    },
                    address:{
                        list:[],
                        value:'北京市北京市朝阳区',
                        clickFun: this.editDomain
                    },
                    callAddress: {
                        value: '北京市朝阳区建外soho西区17号楼2202',
                        list:[
                            '收件人：深圳人人付科技有限公司',
                            '联系方式：1340090909092',
                            '收件地址：北京市朝阳区建外soho西区17号楼2202'
                        ]
                    },

                    age: '小李',
                    encryptionPhone:{
                        value: '18534625325',
                        valueClose: '185****5325',
                        eyeStatus: false,
                        eyeClick: this.eyeClick, 
                        encryption: true, 
                        encryptionType: 'mobile',
                    },
                    certificationStatus: {
                        value: '认证失败',
                        status: false,
                        trigger:'hover',
                        erroMessage:{
                            title: '失败原因：',
                            content: '银行卡与身份证不一致'
                        }
                    },
                    

                    isRegister: '内蒙古呼和浩特赛罕区',
                    headImg: 'http://img.all-pay.cn/2020-04-21/N07Pf075g5.png',
                    operation: [
                        {
                            name: '编辑',
                            clickFun: this.editDomain,
                            type: 'popover',
                            menuList: [
                                {name: '费率配置', clickFun: this.editDomain},
                                {name: '活动配置', clickFun: this.editDomain},
                                {name: '优惠路由配置', clickFun: this.editDomain},
                            ]
                        },
                        {
                            name: '查看',
                            clickFun: this.editDomain
                        },
                        {
                            clickFun: this.editDomain,
                            icon: 'sortDown',
                        },
                        {
                            clickFun: this.editDomain,
                            icon: 'sortUp',
                        }
                    ]
                },
                {
                    name: '000002',
                    userNo: '百盛集团',
                    vip:'会员权益',
                    storeName: '北京麻辣烫',
                    memberGrade: '集团商家',
                    rateTable: {
                        value: '9月活动费率1',
                        tableHeader: [
                            {
                                label:'贷记卡',
                                prop:'creditCard',
                                minWidth: '100px'
                            },
                            {
                                label:'借记卡',
                                prop:'debitCard',
                                 minWidth: '100px'
                            },
                            {
                                label:'借记卡封顶',
                                prop:'capped',
                                minWidth: '100px'
                            },
                            {
                                label:'微信支付',
                                prop:'wx',
                                minWidth: '100px'
                            },
                            {
                                label:'支付宝支付',
                                prop:'zfb',
                                minWidth: '100px'
                            },
                            {
                                label:'银联二维码',
                                prop:'unionPay',
                                minWidth: '100px'
                            }
                        ],
                        tableData: [
                            {
                                creditCard:'0.58',
                                debitCard:'0.58',
                                capped:'2',
                                wx:'0.58',
                                zfb:'0.58',
                                unionPay:'0.58'
                            }
                        ]


                    },
                    payType: ['wx','yl','sk'],
                    age: '小李',
                    address:{
                        list:[],
                        value:'北京市北京市朝阳区',
                        clickFun: this.editDomain
                    },
                    snNumber:{
                        value: '000057028325100089等50台',
                        clickFun: this.editDomain
                    },
                     callAddress: {
                        value: '北京市朝阳区建外soho西区17号楼2202',
                        list:[
                            '收件人：深圳人人付科技有限公司',
                            '联系方式：1340090909092',
                            '收件地址：北京市朝阳区建外soho西区17号楼2202'
                        ]
                    },
                    totalFee: {
                        value: '1000',
                        trigger: 'hover',
                        popperContent: {
                            title: '总手续费：￥10.00',
                            content: [
                                {label: '交易手续费：', value: '￥8.00'},
                                {label: 'T0服务费：', value: '￥2.00'}
                            ]
                        }
                    },
                    activationStatus: {
                        value: '已激活',
                        trigger: 'hover',
                        popverList:{
                            list:[
                                {label: '激活时间：', value: '2021-12-30 10:22:09'},
                                {label: '终端活动：', value: '押金58不返商家'},
                            ],
                            tips: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。'
                        }
                    },
                    
                    certificationStatus: {
                        value: '认证成功',
                        status: true,
                        trigger:'hover',
                        erroMessage:{}
                    },
                    encryptionPhone:{
                        value: '',
                        valueClose: '',
                        eyeStatus: false,
                        eyeClick: this.eyeClick, 
                        encryption: true, 
                        encryptionType: 'mobile',
                        type:'encryption',
                    },
                    isRegister: '内蒙古呼和浩特赛罕区',
                    operation: [
                        {
                            name: '启用',
                            class: 'success',
                            clickFun: this.editDomain
                        },
                        {
                            name: '禁用',
                            clickFun: this.editDomain
                        }
                    ]
                },
                {
                    name: '000003',
                    vip:'会员权益',
                    userNo: '百盛集团',
                    storeName: '北京麻辣烫',
                    memberGrade: '集团商家',
                    rateTable: {
                        value: '9月活动费率1',
                        tableHeader: [
                            {
                                label:'贷记卡',
                                prop:'creditCard',
                                minWidth: '100px'
                            },
                            {
                                label:'借记卡',
                                prop:'debitCard',
                                 minWidth: '100px'
                            },
                            {
                                label:'借记卡封顶',
                                prop:'capped',
                                minWidth: '100px'
                            },
                            {
                                label:'微信支付',
                                prop:'wx',
                                minWidth: '100px'
                            },
                            {
                                label:'支付宝支付',
                                prop:'zfb',
                                minWidth: '100px'
                            },
                            {
                                label:'银联二维码',
                                prop:'unionPay',
                                minWidth: '100px'
                            }
                        ],
                        tableData: [
                            {
                                creditCard:'0.58',
                                debitCard:'0.58',
                                capped:'2',
                                wx:'0.58',
                                zfb:'0.58',
                                unionPay:'0.58'
                            }
                        ]


                    },
                    payType: ['wx','yl','sk'],
                    age: '小李',
                    address:{
                        list:[],
                        value:'北京市北京市朝阳区',
                        clickFun: this.editDomain
                    },
                    snNumber:{
                        value: '000057028325100089等50台',
                        clickFun: this.editDomain
                    },
                     callAddress: {
                        value: '北京市朝阳区建外soho西区17号楼2202',
                        list:[
                            '收件人：深圳人人付科技有限公司',
                            '联系方式：1340090909092',
                            '收件地址：北京市朝阳区建外soho西区17号楼2202'
                        ]
                    },
                    certificationStatus: {
                        value: '认证失败',
                        status: false,
                        trigger:'hover',
                        erroMessage:{
                            title: '失败原因：',
                            content: '银行卡与身份证不一致'
                        }
                    },
                    totalFee: {
                        value: '1000',
                        trigger: 'hover',
                        popperContent: {
                            title: '总手续费：￥10.00',
                            content: [
                                {label: '交易手续费：', value: '￥8.00'},
                                {label: 'T0服务费：', value: '￥2.00'}
                            ]
                        }
                    },
                    activationStatus: {
                        trigger:'hover',
                        value: '已激活',
                        popverList:{
                            list:[
                                {label: '激活时间：', value: '2021-12-30 10:22:09'},
                                {label: '终端活动：', value: '押金58不返商家'},
                            ],
                            tips: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。'
                        }
                    },
                    encryptionPhone:{
                        value: '18534625325',
                        valueClose: '185****5325',
                        eyeStatus: false,
                        eyeClick: this.eyeClick, 
                        encryption: true, 
                        encryptionType: 'mobile',
                        type:'encryption'
                    },
                    isRegister: '内蒙古呼和浩特赛罕区'
                },
                {
                    name: '000004',
                    vip:'会员权益',
                    memberGrade: '百盛集团',
                    userNo: '集团商家',
                    rateTable: {
                        value: '9月活动费率1',
                        tableHeader: [
                            {
                                label:'贷记卡',
                                prop:'creditCard',
                                minWidth: '100px'
                            },
                            {
                                label:'借记卡',
                                prop:'debitCard',
                                minWidth: '100px'
                            },
                            {
                                label:'借记卡封顶',
                                prop:'capped',
                                minWidth: '100px'
                            },
                            {
                                label:'微信支付',
                                prop:'wx',
                                minWidth: '100px'
                            },
                            {
                                label:'支付宝支付',
                                prop:'zfb',
                                minWidth: '100px'
                            },
                            {
                                label:'银联二维码',
                                prop:'unionPay',
                                minWidth: '100px'
                            }
                        ],
                        tableData: [
                            {
                                creditCard:'0.58',
                                debitCard:'0.58',
                                capped:'2',
                                wx:'0.58',
                                zfb:'0.58',
                                unionPay:'0.58'
                            }
                        ]


                    },
                    storeName: '北京麻辣烫',
                    age: '小李',
                    address:{
                        list:[],
                        value:'北京市北京市朝阳区',
                        clickFun: this.editDomain
                    },
                    snNumber:{
                        value: '000057028325100089等50台',
                        clickFun: this.editDomain
                    },
                     callAddress: {
                        value: '北京市朝阳区建外soho西区17号楼2202',
                        list:[
                            '收件人：深圳人人付科技有限公司',
                            '联系方式：1340090909092',
                            '收件地址：北京市朝阳区建外soho西区17号楼2202'
                        ]
                    },
                    totalFee: {
                        value: '1000',
                        trigger: 'hover',
                        popperContent: {
                            title: '总手续费：￥10.00',
                            content: [
                                {label: '交易手续费：', value: '￥8.00'},
                                {label: 'T0服务费：', value: '￥2.00'}
                            ]
                        }
                    },
                    activationStatus: {
                        value:'未激活',
                        trigger:'hover',
                        popverList:{
                            list:[
                                {label: '激活时间：', value: '2021-12-30 10:22:09'},
                                {label: '终端活动：', value: '押金58不返商家'},
                            ],
                            tips: '在首笔交易中收取58元的系统服务费，90天内贷记卡累计交易达15万元，全额返还。'
                        }
                    },
                    certificationStatus: {
                        value: '认证失败',
                        status: false,
                        trigger:'hover',
                        erroMessage:{
                            title: '失败原因：',
                            content: '银行卡与身份证不一致'
                        }
                    },
                    encryptionPhone:{
                        value: '18534625325',
                        valueClose: '185****5325',
                        eyeStatus: false,
                        eyeClick: this.eyeClick, 
                        encryption: true, 
                        encryptionType: 'mobile',
                        type:'encryption'
                    },
                    isRegister: '内蒙古呼和浩特赛罕区'
                }
            ], // 请求到的表格数据
            tableHeader1: [
                {
                    prop: 'storeName',
                    label: '店铺名称',
                    fixed: 'left',
                    minWidth: '100px',
                },
                {
                    prop: 'totalFee',
                    label: '总手续费 (元)',
                    type: 'bluePopover',
                },
                {
                    prop: 'rateTable',
                    label: '费率模版名称',
                    minWidth: '140px',
                    type: 'popoverTable'
                },
                {
                    prop: 'snNumber',
                    label: '入库终端SN',
                    minWidth: '180px',
                    type: 'clickText'
                },
                {
                    prop: 'vip',
                    label: '会员权益',
                    type: 'tag',
                    minWidth: '100px',
                },
                // 表头信息
                {
                    prop: 'userNo',
                    label: '商家MID',
                    minWidth: '120px',
                    describe: true
                },
                {
                    prop: 'activationStatus',
                    label: '激活状态',
                    minWidth: '220px',
                    type: 'activation'
                },
                {
                    prop: 'certificationStatus',
                    label: '认证状态',
                    type: 'certification',
                    minWidth: '120px',
                },
                {
                    prop: 'name',
                    label: '名称',
                    minWidth: '120px',
                },
                {
                    prop: 'memberGrade',
                    label: '商家类型',
                    minWidth: '120px'
                },
                {
                    prop: 'age',
                    label: '拓展员',
                    minWidth: '120px'
                },
                {
                    prop: 'payType',
                    label: '开通支付方式',
                    minWidth: '160px',
                    type: 'payType'
                },
                {
                    prop: 'callAddress',
                    label: '回执地址',
                    minWidth: '360px',
                    type: 'buttonPopover'
                },

                 {
                    prop: 'address',
                    label: '最后登录地址',
                    minWidth: '160px',
                    type: 'address'
                },
                {
                    prop: 'encryptionPhone',
                    label: '手机号',
                    minWidth: '120px',
                    type: 'encryption'
                },
                {
                    prop: 'isRegister',
                    label: '所在地区',
                    minWidth: '180px'
                },
                {
                    prop: 'operation',
                    label: '操作',
                    fixed: 'right',
                    minWidth: '260px',
                    type:'operate'
                }
            ],
        }
    },
    created() {},
    methods: {
        switchChange(val){
            this.switchOpen = val
        },
        changeValue(key,val){
            this.selsetTreeShowOptions= val
            this[key] = val.id ? val.id : ''
        },
        tableHeaderChangeValue(key,val){
            this.config.forEach((i)=>{
                if(i.code == 'selectTree'){
                    i.selsetTreeShowOptions = val
                }
            })
            this.data[key] = val.id ? val.id : ''
        },
        showDialog() {
            this.dialogVisible = true
        },
        routerLink(item){
            console.log(item)
        },
        addDataFn(){
            console.log('addDataFn')
        },
        cellClk(row) {
            this.dialog.Visible = true;
            console.log('固定列操作返回', row);
        },
        sizeChanges(row) {
            console.log('固定列操作返回', row);
        },
        currentChanges(row) {
            console.log('固定列操作返回', row);
        },
        edit(val) {
            console.log("val=====",val)
        },
        handleClick(val) {
            console.log("val======",val)
        },
        editDomain(val,index) {
            console.log(index)
            console.log("val======",val)
        },
        eyeClick(val){
            console.log(val)
            val.eyeStatus = !val.eyeStatus
            console.log("val======",val)
        },
        keyup(e){
          this.data[e.code]=this.data[e.code].replace(/[^\d]/g,'')
        },
        goDetail(e){
            console.log(e)
        },
        multipleSelection(e){
            console.log(e)
        },
        chooseLeftTab(val) {
			this.leftTab.active = val
		},
    }
}
</script>

<style lang="css" scoped>
    .page-container .button-item{
        margin: 30px;
    }
</style>