lichunlei
/
cyb_configserver_com


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355
							<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>列表-我的商户-创业帮</title>
    <meta name="keywords" content="列表-我的商户-创业帮">
    <meta name="description" content="列表-我的商户-创业帮">
    <meta content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,shrink-to-fit=no,user-scalable=no" name="viewport" viewport="cover">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <meta name="apple-mobile-web-app-title" content="列表-我的商户-创业帮">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <link rel="stylesheet" href="./static/css/main.css">
  </head>
  <body class="bgcf7f7f7 pb0 ovh">
    <div class="iphonetitle"></div>
    <div class="detail-pos" id="app" v-cloak>
      <van-sticky>
        <van-nav-bar class="camp_title user_title_normal titlef16 whit_icon" left-arrow title="我的商户" v-if="toptitleisshow" @click-left="goback" @click-right="gosearch">
          <template #left> 
            <van-icon name="arrow-left"> </van-icon>
          </template>
          <template #right> 
            <van-icon class="title_righticon" name="search"> </van-icon>
          </template>
        </van-nav-bar>
      </van-sticky>
      <div class="merchant-header pt16">
        <div class="f12 c333 pl16 mb20" ref="closedropdown">共{{TotalCount}}个商户，今日激活{{ActCount}}个商户</div>
        <van-tabs class="merchant-list bgcfff" v-model="active" line-width="20" line-height="2" :ellipsis="false" swipeable @change="checktab">
          <van-tab class="bgcfff" v-for="merchant,ind in merchantTypes" :title="merchant.Name"></van-tab>
          <div class="merchant-list bgcfff">
            <div class="bgcfff">
              <van-dropdown-menu :overlay="openOverlay ? true : false" active-color="#ff502a" v-if="true"> 
                <van-dropdown-item title="排序" :options="option1" v-model="sortdata" @change="sortbtn"></van-dropdown-item>
                <van-dropdown-item v-if="isPos" :title-class="typeActived == index ? 'no-arrow c999 itemcheck' : 'no-arrow c999'" v-for="item,index in dropdownMenus" :ref="`activeType${index}`" @open="changeActiveType(item,index)">
                  <template #title>
                    <div class="f12">{{item.title + '(' + item.count + ')'}}</div>
                  </template>
                </van-dropdown-item>
                <van-dropdown-item title="筛选" ref="item" title-class="no-arrow filter-icon">
                  <template #default>
                    <div class="pt16 pb32 ml16 mr16">
                      <div class="f12 c333">本月交易额(元)</div>
                      <div class="df mt8 dropdown-input">
                        <div class="flex1">
                          <input class="tc" type="number" placeholder="最低值" v-model="screen.min">
                        </div>
                        <div class="dropdown-input-split tc">——</div>
                        <div class="flex1">
                          <input class="tc" type="number" placeholder="最高值" v-model="screen.max">
                        </div>
                      </div>
                    </div>
                    <div class="pb32 ml16 mr16">
                      <div class="f12 c333">激活时间</div>
                      <div class="df mt8 dropdown-button">
                        <van-button plain v-for="item,index in option" :class="selectedOption == index ? 'dropdown-button__active' : ''" @click="onSelectOption(item,index)">{{item.text}}</van-button>
                      </div>
                    </div>
                    <div class="df dropdown-checkbutton">
                      <van-button block @click="resetbtn">
                        <div class="f14 c666">重置</div>
                      </van-button>
                      <van-button block @click="surebtn">
                        <div class="f16 more">确认</div>
                      </van-button>
                    </div>
                  </template>
                </van-dropdown-item>
              </van-dropdown-menu>
            </div>
            <div class="merchant_active">
              <van-pull-refresh v-model="refreshing" @refresh="onRefresh" :class="merchants.length === 0 ? 'isnodata':''" style="height:calc(100vh - 5.4667rem) !important;min-height:50vh;">
                <van-list v-model="loading" :finished="finished" finished-text="没有更多数据了" @load="onLoad" :immediate-check="false">
                  <van-empty class="custom-image" image="./static/images/empty-img.png" description="暂无数据" v-if="isnodata"></van-empty>
                  <van-cell-group :border="false">
                    <van-cell v-for="item,index in merchants" :title="item.MerchantName" is-link center @click="merchantdetail(item.Id)">
                      <template #label><span class="mr16">注册时间:{{item.KqRegTime}}</span><span>当月交易额(元)：{{abs(item.ThisMonthTrade)}}</span></template>
                    </van-cell>
                  </van-cell-group>
                </van-list>
              </van-pull-refresh>
            </div>
          </div>
        </van-tabs>
      </div>
    </div> 
    <script src="./static/js/klm-vv.min.js"></script>
    <script src="./static/js/appfunc.min.js"></script>
    <script src="./static/js/klm-axios-config.js"></script>
    <script src="./static/js/publicfn.js"></script>
    <script>
      function OnStart(){
        app.getsuerinfo();
        PublicLib.SetStatusBarStyle({type:'light', isShow:1});
      };
      // 通过 CDN 引入时不会自动注册 Lazyload 组件
      // 可以通过下面的方式手动注册
      Vue.use(vant.Lazyload);
      //--- PublicLib.SetStatusBarStyle({type:'light', isShow:1});
      // 在 #app 标签下渲染一个按钮组件
      let app = new Vue({
        el: '#app',
        data() {
          return {
            isPos:true,
            isnodata:true,
            toptitleisshow:true,
            container:'',
            active: 0,
            value: 0,
            switch1: false,
            switch2: false,
            selectedOption: 0,
            //- 商户激活状态
            typeActived: 0,
            //- 产品类型id
            ProductType:0,
            //- 排序类型
            sortdata:'trade',
            //- 商户数
            TotalCount:0,
            //- 新增商户数
            ActCount:0,
            openOverlay: true,
            screen:{
              min: '',
              max: '',
              time:''
            },
            pageinfo:{
              PageSize:20,
              PageNum:1
            },
            option1: [
              { text: '本月交易额（由高至低）', value: 'trade' },
              { text: '注册时间（由近及远）', value: 'regdate' },
            ],
            option: [
              { text: '全部', value: '',index:0 },
              { text: `${new Date().getFullYear() - 1}年激活`, value: new Date().getFullYear() - 1,index:1 },
              { text: `${new Date().getFullYear()}年激活`, value: new Date().getFullYear(),index:2 },
            ],
            dropdownMenus: [
              { title: '全部', count: 0, id: 0},
              { title: '已激活', count: 0, id: 1},
              { title: '未激活', count: 0, id: 2},
            ],
            //- 产品类型
            merchantTypes: [
            ],
            //- 商户列表
            merchants:[
            ],
      
            loading: false,
            finished: false,
            refreshing: false,
          };
        },
        created() {
          this.getproductlist();
        },
        methods: {
          onLoad() {
              this.pageinfo.PageNum++;
              if(this.active < this.poslength){
                this.getPosmerchantlist();
              }else{
                this.getmerchantsnlist();
              };
          },
          onRefresh() {
            // 清空列表数据
            this.finished = false;
      
            // 重新加载数据
            // 将 loading 设置为 true，表示处于加载状态
            this.loading = true;
            this.pageinfo.PageNum = 1;
            if(this.active < this.poslength){
              this.getPosmerchantlist('refresh');
            }else{
              this.getmerchantsnlist('refresh');
            };
          },
          onSelectOption(item,index) {
            this.openOverlay = true;
            if(item.index == index){
              this.selectedOption = index;
            }
            this.screen.time = item.value;
          },
          changeActiveType(item,index){
            const that = this;
            that.openOverlay = false;
            if(item.id == index){
              that.typeActived = index;
              setTimeout(function(){
                that.$refs[`activeType${index}`][0].toggle();
                that.openOverlay = true;
              },100);
              //- this.merchants = [];
              this.getPosmerchantlist('refresh');
            };
          },
          resetbtn(){
            this.screen.min = '';
            this.screen.max = '';
            this.screen.time = '';
            this.selectedOption = 0;
          },
          surebtn(){
            //- this.merchants = [];
              if(this.active < this.poslength){
                this.getPosmerchantlist('refresh');
              }else{
                this.getmerchantsnlist('refresh');
              };
            this.$refs.closedropdown.click();
          },
          //- 切换排序方式
          sortbtn(){
            //- this.merchants = [];
              if(this.active < this.poslength){
                this.getPosmerchantlist('refresh');
              }else{
                this.getmerchantsnlist('refresh');
              };
          },
          //- 切换tab栏
          checktab(index){
            this.merchants = [];
            this.pageinfo.PageNum = 1;
            this.ProductType = this.merchantTypes[index].Id;
            if(this.active < this.poslength){
              //- 走pos接口
              this.getPosmerchantlist('refresh');
              this.isPos = true;
            }else{
              //- 走sn接口
              this.getmerchantsnlist('refresh');
              this.isPos = false;
            };
          },
          //- 获取产品列表
          // 增加接口，增加POS机板块业务
          async getproductlist(){
            const listtopos = await getRequest('api/v1/pos/kqproducts/list?t='+Math.random(6),JSON.stringify({PageSize:10,PageNum:1}));
            if(listtopos.status === '1') {
              console.log(listtopos.data);
              const productlist = [];
              const list = PublicLib.getCookieInfo('productCenterList') ? PublicLib.getCookieInfo('productCenterList') : '[]';
              const testarr = JSON.parse(list) ? JSON.parse(list) : [];
              const productsnum = listtopos.data.length - testarr.length;
              if(productsnum !== 0){
                for(let i = productsnum; i > 0; i--){
                  testarr.push(listtopos.data[listtopos.data.length - i].Id);
                };
              };
              testarr.forEach((num)=>{
                listtopos.data.forEach((item,index)=>{
                  if(item.Id === Number(num)){
                    productlist.push(item);
                  };
                });
              });
              this.merchantTypes = productlist;
              //- this.merchantTypes.push(...listtopos.data);
              this.ProductType = productlist[0].Id;
              this.poslength = listtopos.data.length;
              this.getPosmerchantlist(1);
            };
            //- const listtosn = await getRequest('api/v1/kqproducts/list?t='+Math.random(6),JSON.stringify({PageSize:10,PageNum:1}));
            //- if(listtosn.status === '1') {
            //-   this.merchantTypes.push(...listtosn.data);
            //- };
          },
          //- 获取sn商户列表
          async getmerchantsnlist(type = '1'){
            //- PublicLib.ShowLoading({Message:''});
            const UserId = PublicLib.getCookieInfo('userId');
            const res = await getRequest('api/v1/merchantinfo/mymerchant?t='+Math.random(6),JSON.stringify({...this.pageinfo,UserId,ActiveStatus:'',ProductType:this.ProductType,MinTrade:this.screen.min,MaxTrade:this.screen.max,ActTime:this.screen.time,Sort:this.sortdata}));
            if(res.status !== '1') return tips('获取商户列表失败，请重试！');
            //- PublicLib.HideLoading();
            if(res.data.length < this.pageinfo.PageSize) {
              this.finished = true;
            };
            res.data.forEach(item=>{
              item.ThisMonthTrade = item.ThisMonthTrade.toFixed(2)
            });
            if(type === 'refresh'){
              this.merchants = res.data;
              this.refreshing = false;
            }else{
              this.merchants.push(...res.data);
            };
            this.TotalCount = res.other.TotalCount;
            this.ActCount = res.other.ActCount;
            this.dropdownMenus[0].count = res.other.ProductCount;
            this.dropdownMenus[1].count = res.other.ProductActCount;
            this.dropdownMenus[2].count = res.other.ProductUnActCount;
            this.loading = false;
            if(this.merchants.length === 0) {this.isnodata = true}else{this.isnodata = false};
          },
          //- 获取POS商户列表
          async getPosmerchantlist(type = '1'){
            //- PublicLib.ShowLoading({Message:''});
            const UserId = PublicLib.getCookieInfo('userId');
            const res = await getRequest('api/v1/pos/merchantinfo/mymerchant?t='+Math.random(6),JSON.stringify({...this.pageinfo,UserId,ActiveStatus:this.typeActived,ProductType:this.ProductType,MinTrade:this.screen.min,MaxTrade:this.screen.max,ActTime:this.screen.time,Sort:this.sortdata}));
            if(res.status !== '1') return tips('获取商户列表失败，请重试！');
            //- PublicLib.HideLoading();
            if(res.data.length < this.pageinfo.PageSize) {
              this.finished = true;
            };
            res.data.forEach(item=>{
              item.ThisMonthTrade = item.ThisMonthTrade.toFixed(2)
            });
            if(type === 'refresh'){
              this.merchants = res.data;
              this.refreshing = false;
            }else{
              this.merchants.push(...res.data);
            };
            this.TotalCount = res.other.TotalCount;
            this.ActCount = res.other.ActCount;
            this.dropdownMenus[0].count = res.other.ProductCount;
            this.dropdownMenus[1].count = res.other.ProductActCount;
            this.dropdownMenus[2].count = res.other.ProductUnActCount;
            this.loading = false;
            if(this.merchants.length === 0) {this.isnodata = true}else{this.isnodata = false};
          },
          //- 进入搜索
          gosearch(){
            PublicLib.Goto({Url:'merchant-search'});
          },
          goback(){
            PublicLib.GoBack({Level:1});
          },
          merchantdetail(id){
            PublicLib.putCookieInfo('merchantId', id);
            if(this.active < this.poslength){
              PublicLib.Goto({Url:'merchant-detail-pos'});
            }else{
              PublicLib.Goto({Url:'merchant-detail'});
            }
          }
        }
      });
    </script>
  </body>
</html>