<template>
    <div class="container resource close-left-menu contaNEW">
        <div class="pop-banner clearfix">
            <div class="operate-btns">
                <a @click="modifyInfo" v-if="'/supplier/employee:modify' | myqx isNotZero" class="fbtn fb-modify">修改</a>
                <a @click="addUser" class="fbtn fb-add" v-if="'/supplier/employee:add' | myqx isNotZero">添加</a>
                <a v-if="'/supplier/employee:deleteMfsupplierstaffPO' | myqx (!canDelete&&isNotZero)"
                   v:disabled="false" href="javascript:void(0)" class="fbtn fb-remove" style="color:#DCDCDC">删除</a>
                <a @click="deleteUser" v-if="'/supplier/employee:deleteMfsupplierstaffPO' | myqx (canDelete&&isNotZero)"
                   class="fbtn fb-remove">删除</a>
                <a v:disabled="false" style="color:#DCDCDC"
                   v-if="'/supplier/employee:saveOrUpdateMfsupplierstaff' | myqx !canSave" class="fbtn fb-save">保存</a>
                <a @click="saveUser" v-if="'/supplier/employee:saveOrUpdateMfsupplierstaff' | myqx canSave"
                   class="fbtn fb-save">保存</a>
                <a v-if="'/supplier/employee:modifyBizStateY' | myqx isNotY&&!canY&&isNotZero"
                   v:disabled="false"
                   style="color:#DCDCDC" class="fbtn fb-valid">启用</a>
                <a @click="modifyBizState('Y',0)"
                   v-if="'/supplier/employee:modifyBizStateY' | myqx isNotY&&canYisNotZero"
                   class="fbtn fb-valid">启用</a>
                <a v-if="'/supplier/employee:modifyBizStateS' | myqx (isNotS&&isNotE&&!canS&&isNotZero)"
                   class="fbtn fb-unused" v:disabled="false" style="color:#DCDCDC">停用</a>
                <a v-if="'/supplier/employee:modifyBizStateS' | myqx (isNotS&&isNotE&&canS&&isNotZero)"
                   class="fbtn fb-unused" @click="modifyBizState('S',0)">停用</a>
                <a v:disabled="false" style="color:#DCDCDC"
                   v-if="'/supplier/employee:modifyBizStateE' | myqx (isNotE&&!canE&&isNotZero)"
                   class="fbtn fb-dump">作废</a>
                <a @click="modifyBizState('E',1)"
                   v-if="'/supplier/employee:modifyBizStateE' | myqx (isNotE&&canE&&isNotZero)"
                   class="fbtn fb-dump">作废</a>
                <a :disabled="false" style="color:#DCDCDC"
                   v-if="'/supplier/employee:saveOrUpdateMfsupplierstaff' | myqx !canSave"
                   class="fbtn fb-setting">电票权限</a>
                <a @click="showUser('E',1)" v-else class="fbtn fb-setting">电票权限</a>
            </div>
            <h3 class="current-module">业务员维护</h3>
        </div>
        <div class="ep-form">
            <div class="ep-title h-125">
                <div class="ep-pic edit">
           <span class="edit-btn">
              <upload
                      :model.sync="avatar" type="avatar" label=""
                      v-on:file-change="setHeadImg"></upload>
           </span>
                    <avatars :json-str="avatar" @click="showBigImgs(user.pictcontent)"></avatars>
                    <imagebox v-bind:imgarr="imgArry">
                        <span class="pic-max blue-search" id="bigImgs"></span>
                    </imagebox>
                </div>
                <div class="ep-cast" style="z-index: 100; position: absolute; margin-left: 130px;">
                    <div class="ep-responsible"><p class="fl lh-38">共负责</p>
                        <em class="fl ml-5">{{userRelation.length}}</em>
                        <p class="fl lh-38 ml-5">家医疗机构，</p>
                        <em class="fl">{{userRelation.length==0?0:userRelation[0].productCount}}</em>
                        <p class="fl lh-38 ml-5">个产品，</p>
                        <em class="fl">{{userRelation.length==0?0:userRelation[0].pinguiCount}}</em>
                        <p class="fl lh-38 ml-5">个商品</p>
                    </div>
                    <div class="ep-status mt-50">
                        <a href="javascript:" class="pd0" v-if="user.bizstate=='Y'">
                            <p class="fl p-btn-left crew-state valid"></p>
                            <p class="fl p-btn-right">有效</p>
                        </a>
                        <a href="javascript:" class="pd0 ml-15" v-if="user.bizstate=='S'">
                            <p class="fl p-btn-left btn-bgc crew-state block"></p>
                            <p class="fl p-btn-right warn">停用</p>
                        </a>
                        <a href="javascript:" class="pd0 ml-15" v-if="user.bizstate=='N'">
                            <p class="fl p-btn-left bgc-red2 crew-state cancel"></p>
                            <p class="fl p-btn-right btn-red">作废</p>
                        </a>
                    </div>
                    <div class="edit-links">
                        <a href="javascript:void(0);">
                        </a>
                    </div>
                </div>
            </div>
            <div class="ep-infor">
                <div class="edit-user-left">
                    <p>基本信息</p>
                    <div class="base-form">
                        <div class="form-group form-label">
                            <label class="label t-left" for="base1">姓名</label>
                            <div class="control">
                                <input type="text" v-model="user.realname" id="base1" class="inp2" maxlength="8" v-rule></div>
                        </div>
                        <div class="form-group form-label">
                            <div class="radio-control fl">
                                <label class="mr-10">性别</label>
                                <input type="radio" id="radio01" name="radioio" value="1" v-model="user.sex"
                                       v-bind:disabled="disabled">
                                <label class="radio mr-30" for="radio01"><span class="man"></span></label>
                                <input type="radio" name="radioio" id="radio02" value="2" v-model="user.sex"
                                       v-bind:disabled="disabled">
                                <label class="radio mr-30" for="radio02"><span class="woman"></span></label>
                            </div>
                        </div>
                        <div class="form-group fg-block form-label w408">
                            <label class="label" for="c2">登录账号</label>
                            <div class="control">
                                <!-- <div class="tel-array"> -->
                                <input type="text" v-model="user.logonuser" id="c2" class="inp4">
                                <!-- </div> -->
                            </div>
                        </div>
                        <div class="form-group fg-block form-label w408">
                            <label for="cc3" class="label">登录密码</label>
                            <div class="control input-has-btn" v-if="hi">
                                <input type="password" v-model="user.pwd" id="cc3" class="inp4" style="width:100%;" maxlength="15" v-rule>
                                <span class="input-pwd-show" id="show" style="display:none"
                                      @click="showOrHide('show')"></span>
                                <span class="input-pwd-hide" id="hide" @click="showOrHide('hide')"></span>
                            </div>
                            <div class="control input-has-btn" v-if="sh">
                                <input type="password" v-model="user.pwd" id="cc3" class="inp4" style="width:100%;">
                                <span class="input-pwd-show" id="show" style="display:none"></span>
                                <span class="input-pwd-hide" id="hide"></span>
                            </div>
                        </div>
                        <div class="form-group form-label">
                            <label class="label t-left" for="base3">手机号</label>
                            <div class="control">
                                <input type="text" v-model="user.mobiletel1" id="base3" class="inp3"></div>
                        </div>
                        <div class="form-group ml-10">
                            <label class="label"></label>
                            <div class="control">
                                <input type="text" v-model="user.mobiletel2" id="base" placeholder="手机号" title='手机号' maxlength="11" v-rule>
                            </div>
                        </div>
                        <div class="form-group form-label">
                            <label class="label t-left" for="base6">邮箱</label>
                            <div class="control">
                                <input type="text" v-model="user.eMail" id="base6" class="inp2"></div>
                        </div>
                        <div class="form-group form-label ml-10">
                            <label class="label" for="base7">微信号</label>
                            <div class="control">
                                <input type="text" v-model="user.webchatcode" id="base7" class="inp3"></div>
                        </div>
                    </div>
                </div>
                <div class="edit-user-center">
                    <p>系统权限</p>
                    <div class="xtqx">
                        <div class="checkbox-control checkbox-block">
                            <radio_user :list="rolesList" :checked.sync="user.roletype"
                                        style="display:block;"></radio_user>
                        </div>
                    </div>
                </div>
                <div class="edit-user-right">
                    <p>身份证号</p>
                    <div class="sfzh">
                        <div class="id-control form-label">
                            <label class="label" for="base8">身份证号</label>
                            <div class="control">
                                <input type="text" id="base8" v-model="user.idcode" class="inp4" maxlength="18" v-rule></div>
                        </div>
                        <div class="id-pics clearfix" v-show="hi">
                            <div class="pic-upload" id="show0" v-if="uploads0.length>0"
                                 :style="{backgroundImage:'url('+(uploads0.length> 0?uploads0[0].path:'')+')'}"
                                 style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(0)"></span>
                                    <span class="fbtn modify-btn" title="修改" @click="modifyPic(0)"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads0[0].pic)"></span>
                                </div>
                            </div>
                            <uploads v-bind:class="['pic-upload']" :display="'block'" v-if="uploads0.length==0"
                                     id="showupload0"
                                     v-on:file-change="fileChange0" v-bind:multiple="false" v-bind:readonly="readonly">
                                <!-- <div class="upload-tips">请上传正面照片</div> -->
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(0)"></span>
                                    <span class="fbtn modify-btn" title="修改" @click="modifyPic(0)"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads0[0].pic)"></span>
                                </div>
                            </uploads>
                            <div class="pic-upload" id="show1" v-if="uploads1.length>0"
                                 :style="{backgroundImage:'url('+(uploads1.length> 0?uploads1[0].path:'')+')'}"
                                 style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(1)"></span>
                                    <span class="fbtn modify-btn" title="修改" @click="modifyPic(1)"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads1[0].pic)"></span>
                                </div>
                            </div>
                            <uploads v-bind:class="['pic-upload']" :display="'block'" v-if="uploads1.length==0"
                                     id="showupload1"
                                     v-on:file-change="fileChange1" v-bind:multiple="false" v-bind:readonly="readonly">
                                <!-- <div class="upload-tips">请上传背面照片</div> -->
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(1)"></span>
                                    <span class="fbtn modify-btn" title="修改" @click="modifyPic(1)"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads1[0].pic)"></span>
                                </div>
                            </uploads>
                        </div>
                        <div class="id-pics clearfix" v-show="sh">
                            <div class="pic-upload" id="show0"
                                 :style="{backgroundImage:'url('+(uploads0.length> 0?uploads0[0].path:'./images/identity.png')+')'}"
                                 style='background-position: 50% 50%;background-repeat:no-repeat;background-size: 100px 70px;'>
                                <!-- <div class="upload-tips" v-if="uploads0.length==0">请上传正面照片</div>  -->
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(0)"></span>
                                    <span class="fbtn modify-btn" title="修改"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads0[0].pic)"></span>
                                </div>
                            </div>
                            <div class="pic-upload" id="show1"
                                 :style="{backgroundImage:'url('+(uploads1.length> 0?uploads1[0].path:'/images/identity2.png')+')'}"
                                 style='background-position: 50% 50%;background-repeat:no-repeat;background-size:  100px 70px;'>
                                <!-- <div class="upload-tips" v-if="uploads1.length==0">请上传背面照片</div> -->
                                <div class="icon-btn">
                                    <span class="rm-pic" v-on:click="deleteimg(1)"></span>
                                    <span class="fbtn modify-btn" title="修改"><i>|</i></span>
                                    <span class="fbtn magnify-btn" style="width: 89px;" title="放大"
                                          @click="showBigImgs(uploads1[0].pic)"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--         <table class="ep-table ei-table">
                          <thead>
                            <tr>
                              <th style='width:auto;'>基本信息</th>
                              <th style='width:130px;'>系统权限</th>
                              <th>身份证号</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr>
                              <td>
                                <div class="base-form">
                                  <div class="form-group form-label">
                                    <label class="label t-left" for="base1">姓名</label>
                                    <div class="control">
                                      <input type="text" v-model="user.realname" id="base1" class="inp2"></div>
                                    </div>
                                  <div class="form-group">
                                    <label class="label">性别</label>
                                    <div class="control radio-control">
                                      <radio :list="genderList" :checked.sync="user.sex"></radio>
                                    </div>
                                  </div>
                                  <div class="form-group fg-block form-label">
                                    <label class="label" for="c2">登录账号</label>
                                    <div class="control">
                                      <input type="text" v-model="user.logonuser" id="c2" class="inp4">
                                    </div>
                                  </div>
                                  <div class="group-row">
                                    <div class="form-group fg-block form-label">
                                      <label for="cc3" class="label">登录密码</label>
                                      <div class="control input-has-btn"  v-if="hi">
                                          <input type="password" v-model="user.pwd" id="cc3" class="inp4" style="width:100%;">
                                          <span class="input-pwd-show" id="show" style="display:none" @click="showOrHide('show')"></span>
                                          <span class="input-pwd-hide" id="hide" @click="showOrHide('hide')"></span>
                                      </div>
                                       <div class="control input-has-btn" v-if="sh">
                                          <input type="password" v-model="user.pwd" id="cc3" class="inp4" style="width:100%;">
                                          <span class="input-pwd-show" id="show" style="display:none"></span>
                                          <span class="input-pwd-hide" id="hide"></span>
                                      </div>
                                    </div>
                                  </div>
                                  <div class="form-group form-label">
                                    <label class="label t-left" for="base3">手机号</label>
                                    <div class="control">
                                      <input type="text" v-model="user.mobiletel1" id="base3" class="inp3"></div>
                                  </div>
                                  <div class="form-group ml-10">
                                    <label class="label"></label>
                                    <div class="control">
                                      <input type="text" v-model="user.mobiletel2" id="base" placeholder="手机号" title='手机号'></div>
                                  </div>
                                  <div class="form-group form-label">
                                    <label class="label t-left" for="base6">邮箱</label>
                                    <div class="control">
                                      <input type="text" v-model="user.eMail" id="base6" class="inp2"></div>
                                  </div>
                                  <div class="form-group form-label ml-10">
                                    <label class="label" for="base7">微信号</label>
                                    <div class="control">
                                      <input type="text" v-model="user.webchatcode" id="base7" class="inp3"></div>
                                  </div>
                                </div>
                              </td>
                              <td class="v-top" style="padding-right: 0;">
                                <div class="checkbox-control checkbox-block">
                                  <radio_user :list="rolesList"  :checked.sync="user.roletype" style="display:block;"></radio_user>
                                </div>
                              </td>
                              <td class="v-top">
                                <div class="id-control form-label">
                                  <label class="label" for="base8">身份证号</label>
                                  <div class="control">
                                    <input type="text" id="base8" v-model="user.idcode" class="inp4"></div>
                                </div>
                                <div class="id-pics clearfix" v-show="hi">
                                  <div class="pic-upload" id="show0" v-if="uploads0.length>0" :style="{backgroundImage:'url('+(uploads0.length> 0?uploads0[0].path:'')+')'}"
                                  style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                    <div class="icon-btn">
                                      <span class="rm-pic" v-on:click="deleteimg(0)"></span>
                                      <span class="fbtn modify-btn" title="修改" @click="modifyPic(0)"><i>|</i></span>
                                      <span class="fbtn magnify-btn" style="width: 89px;" title="放大"  @click="showBigImgs(uploads0[0].pic)"></span>
                                    </div>
                                  </div>
                                   <uploads v-bind:class="['pic-upload']" :display="'block'"  v-if="uploads0.length==0" id="showupload0"
                                    v-on:file-change="fileChange0" v-bind:multiple="false" v-bind:readonly="readonly">
                                      <div class="upload-tips">请上传正面照片</div>
                                    </uploads>
                                  <div class="pic-upload" id="show1" v-if="uploads1.length>0" :style="{backgroundImage:'url('+(uploads1.length> 0?uploads1[0].path:'')+')'}"
                                  style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                      <div class="icon-btn">
                                        <span class="rm-pic" v-on:click="deleteimg(1)"></span>
                                        <span class="fbtn modify-btn" title="修改" @click="modifyPic(1)"><i>|</i></span>
                                        <span class="fbtn magnify-btn" style="width: 89px;" title="放大" @click="showBigImgs(uploads1[0].pic)"></span>
                                      </div>
                                  </div>
                                  <uploads v-bind:class="['pic-upload']" :display="'block'" v-if="uploads1.length==0" id="showupload1"
                                    v-on:file-change="fileChange1" v-bind:multiple="false" v-bind:readonly="readonly">
                                      <div class="upload-tips">请上传背面照片</div>
                                    </uploads>
                                </div>
                                <div class="id-pics clearfix" v-show="sh">
                                  <div class="pic-upload" id="show0" v-if="uploads0.length>0" :style="{backgroundImage:'url('+(uploads0.length> 0?uploads0[0].path:'')+')'}"
                                  style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                    <div class="icon-btn">
                                      <span class="rm-pic" v-on:click="deleteimg(0)"></span>
                                      <span class="fbtn modify-btn" title="修改" @click="modifyPic(0)"><i>|</i></span>
                                      <span class="fbtn magnify-btn" style="width: 89px;" title="放大"  @click="showBigImgs(uploads0[0].pic)"></span>
                                    </div>
                                  </div>
                                  <div class="pic-upload" v-else>
                                    <div class="upload-tips">请上传正面照片</div>
                                  </div>
                                  <div class="pic-upload" id="show1" v-if="uploads1.length>0" :style="{backgroundImage:'url('+(uploads1.length> 0?uploads1[0].path:'')+')'}"
                                  style='background-position: 50% 50%;background-repeat:no-repeat;background-size: contain;'>
                                      <div class="icon-btn">
                                        <span class="rm-pic" v-on:click="deleteimg(1)"></span>
                                        <span class="fbtn modify-btn" title="修改" @click="modifyPic(1)"><i>|</i></span>
                                        <span class="fbtn magnify-btn" style="width: 89px;" title="放大" @click="showBigImgs(uploads1[0].pic)"></span>
                                      </div>
                                  </div>
                                  <div class="pic-upload" v-else>
                                    <div class="upload-tips">请上传背面照片</div>
                                  </div>
                                </div>
                              </td>
                            </tr>
                            <tr>
                              <td colspan="3">
                                <div class="radio-control fl ml-20 mr-40">
                                  <label class="primary-text mr-10" style="float:left;height:30px;line-height:30px;">接收短信通知</label>
                                  <span style="float:left;">
                                    <radio :list="isorno" :checked.sync="user.isreceivesms"></radio>
                                  </span>
                                </div>
                                <div class="radio-control fl mr-40">
                                  <label class="primary-text mr-10" style="float:left;height:30px;line-height:30px;">接收微信通知</label>
                                  <span style="float:left;">
                                    <radio :list="isorno" :checked.sync="user.isreceivewebchart"></radio>
                                  </span>
                                </div>
                                <div class="radio-control fl">
                                  <label class="primary-text mr-10" style="float:left;height:30px;line-height:30px;">接收邮件通知</label>
                                  <span style="float:left;">
                                    <radio :list="isorno" :checked.sync="user.isreceiveemail"></radio>
                                  </span>
                                </div>
                              </td>
                            </tr>
                          </tbody>
                        </table> -->
            </div>
            <div class="ep-business" v-if="user.guid!=null && user.guid!='' && userRelation.length!=0">
                <h3>
                    <p class="fl">共负责</p> <em class="fl">{{userRelation.length}}</em>
                    <p class="fl">家医疗机构，</p> <em
                        class="fl">{{userRelation.length==0?0:userRelation[0].productCount}}</em>
                    <p class="fl">个产品，</p>
                    <em class="fl">{{userRelation.length==0?0:userRelation[0].pinguiCount}}</em>
                    <p class="fl">个商品</p>
                </h3>
                <table class="ep-table eb-table">
                    <thead>
                    <tr>
                        <th>医疗机构</th>
                        <th>产品</th>
                        <th>配送商</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(firstIndex,ur) in userRelation">
                        <td class="com">
                            <imagebox v-bind:imgarr="ur.medpic | original" v-if="ur.medpic!=null">
                  <span class="pic-max blue-search">
                    <img :src="ur.medpic | thumbnail">
                  </span>
                            </imagebox>
                            <img src="/images/default.jpg" v-if="ur.medpic==null">
                            <p class="com-name">{{ur.medname}}</p>
                            <p>业务授权书</p>
                            <imagebox v-bind:imgarr="ur.ywypic | original" v-if="ur.ywypic!=null">
                    <span class="pic-max blue-search">
                      <img :src="ur.ywypic | thumbnail">
                    </span>
                            </imagebox>
                            <img src="/images/default.jpg" v-if="ur.ywypic==null">
                        </td>
                        <td>
                            <div class="ctable ct-parent">
                                <div class="ct-head">
                                    <span class="ct-col w40">序号</span>
                                    <span class="ct-col w150">产品名称</span>
                                    <span class="ct-col w160">注册证号</span>
                                    <span class="ct-col w70">品规数</span>
                                    <span class="ct-col w104">生产厂家</span>
                                </div>
                                <div class="ct-row" v-for="product in ur.listproducts"
                                     id="ct-r{{firstIndex}}{{$index}}">
                                    <div class="row-line">
                                        <span class="ct-col w40">{{$index+1}}</span>
                                        <span class="ct-col w150 break-it">
                        <span class="break">{{product.productname}}</span>
                      </span>
                                        <span class="ct-col w160 break-it">
                        <span class="break">{{product.registkey}}</span>
                      </span>
                                        <span class="ct-col w70 activate" id="isFocus1{{firstIndex}}{{$index}}">
                        <div>
                          <a href="javascript:void(0);"
                             @click="slidedown(firstIndex,$index,product.guid,1,product.searchGoods)">{{product.pinguiCount}}</a>
                        </div>
                      </span>
                                        <span class="ct-col w104 break-it">
                        <span class="break">{{product.producer}}</span>
                      </span>
                                    </div>
                                    <div class="row-launch" style="display:none;" id="row-l1{{firstIndex}}{{$index}}">
                                        <h3>品规数（{{product.pinguiCount}}）</h3>
                                        <table class="itable">
                                            <thead>
                                            <tr>
                                                <th class="w40">序号</th>
                                                <th class="w90">商品编号</th>
                                                <th class="">商品名称</th>
                                                <th class="w50">规格</th>
                                                <th class="w50">状态</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr v-for="good in product.lg">
                                                <td>{{$index+1}}</td>
                                                <td>{{good.goodscode}}</td>
                                                <td>{{good.goodsname}}</td>
                                                <td>{{good.goodsspec}}</td>
                                                <td>{{good.bizstate | bizstate}}</td>
                                            </tr>
                                            </tbody>
                                        </table>
                                        <div class="pagination page-line m-20-0">
                                            <pagination
                                                    @page-change="listGoods(firstIndex,$index,product.guid,product.searchGoods)"
                                                    :page-no.sync="product.searchGoods.pageNo"
                                                    :total-pages.sync="product.searchGoods.totalPages"></pagination>
                                        </div>
                                        <div class="zip" @click="slideup(firstIndex,$index,product.guid,1)"></div>
                                    </div>
                                </div>
                                <div class="ct-row" v-if="ur.listproducts.length==0">
                                    <div class="row-line">
                                        <span class="ct-col w160 break-it">没有查询到相关数据！</span>
                                    </div>
                                </div>
                            </div>
                        </td>
                        <td class="com">
                            <imagebox v-bind:imgarr="ur.dispic | original" v-if="ur.dispic!=null">
                    <span class="pic-max blue-search">
                    <img :src="ur.dispic | thumbnail">
                    <p class="com-name">{{ur.distrbname}}</p>
                  </span>
                            </imagebox>
                            <img src="/images/default.jpg" v-if="ur.dispic==null">
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <!--star 9-9 提示缺货信息列表-->
        <div class="modal " :class="backMessage.showDialog=='Y'?'':'hide'" >
            <div class="container resource">
                <div class="audit-detail  w600 ml-200">
                    <span class="close-win"  v-on:click="closeDialog()"></span>
                    <div class="sdiv-9-9b no-border pb0">
                        <p class="t-center">电票用户权限菜单</p>
                    </div>
                    <div class="status-process wbe-0 clearfix pd20 pt0">
                        <div class="sp-head sp-headb mb-0"  >
                            <table class="itable no-trshadow">
                                <tbody class="txt_v">
                                <tr v-for="item in getUserPrems" v-else>
                                    <td class="t-left">
                                        <span class="checkbox-control" class="fl">
                                            <input type="checkbox" :id="item.permCode" v-model="checkArr" :value="item.permCode">
                                            <label class="checkbox" :for="item.permCode">{{item.permDesc}}</label>
                                        </span>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                            <div class="w240" style="margin:0 auto;">
                                <button class="btn button-green fl mt-15" v-on:click="closeDialog()">取 消</button>
                                <button class="btn button-green fr mt-15" v-on:click="setPrems()">保 存</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--star 9-9 受理弹出-->
    </div>
</template>
<script>
    var MT = require('../../../vuex/mutation-types');
    require('../../../plugins/jsencrypt');
    // 加密
    //var encrypt=new JSEncrypt();
    module.exports = {
        data: function () {
            return {
                isNotZero: false,
                isNotY: false,
                isNotE: false,
                isNotS: false,
                sh: true,
                hi: false,
                focus: 0,
                genderList: [{
                    value: '1',
                    label: '男'
                }, {
                    value: '2',
                    label: '女'
                }],
                isorno: [{
                    value: 'Y',
                    label: '是'
                }, {
                    value: 'N',
                    label: '否'
                }],
                rolesList: [{
                    value: '1',
                    label: '管理员'
                }, {
                    value: '2',
                    label: '业务员'
                }, {
                    value: '3',
                    label: '业务主管'
                }],
                adminList: [{
                    value: '1',
                    label: '是'
                }, {
                    value: '0',
                    label: '否'
                }],
                checkAdmin: '',
                adminRoleInited: true,
                user: {},
                avatar: '',
                uploads0: [],
                uploads1: [],
                picJson0: '',
                picJson1: '',
                canDelete: true,
                canSave: true,
                canS: true,
                canY: true,
                canE: true,
                search: {
                    staffguid: '',
                },
                searchGoods: {
                    pageSize: 5,
                    pageNo: 1,
                    totalPages: 0,
                    total: 0,
                    param: {
                        productguid: '',
                    }
                },
                userRelation: [],
                isExistAccount: false,
                imgArry: [],
                oldPwd: '',
                backMessage:{
                    showDialog:'N',
                    mList:[],// 提示信息
                },
                getUserPrems:'',
                checkArr:[],
                prems:[],
            };
        },
        methods: {
            showUser:function(){
                var self = this;
                self.$set('backMessage.showDialog','Y');
                self.getUserPremsList();
            },
            // 关闭信息提示弹出框
            closeDialog:function(){
                var self = this;
                this.$set('backMessage.showDialog','N');
            },
            getUserPremsList: function() {
                var self = this;
                Ajax.post('/user/getusereiprems')
                    .then(function (response) {
                        var data = response.data.data;
                        self.$set('getUserPrems', data);
                    })
            },
            setPrems: function(){
                var self = this;
                Ajax.post('/user/setusereiprems',{'prems':self.prems})
                    .then(function (response){
                        var data = response.data.data;
                        if(response.data.errorCode==0){
                            self.MessageBox({
                                title: '提示',
                                message: '保存成功！',
                                type: 'alert'
                            }, function(action) {
                                self.$set('backMessage.showDialog','N');
                                window.location.reload();
                            });
                        }else{
                            layer.msg(response.data.message);
                        }
                    })
            },
                // 设置头像
            setHeadImg: function () {
                this.$set('user.pictcontent', this.avatar);
            },
            getUser: function () {
                var self = this, imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径;
                if (this.$route.params.guid != '0') {
                    Ajax.get('/user/' + this.$route.params.guid)
                        .then(function (response) {
                            self.$set('user', response.data.data);
                            self.oldPwd = self.user.pwd;
                            // encrypt.setPublicKey(self.user.privatekey);
                            // key=encrypt.encrypt(self.user.pwd);
                            // alert(key);
                            if (self.user.pictcontent != null) {
                                self.avatar = self.user.pictcontent;
                            } else {
                                self.$set('avatar', null);
                            }
                            //身份证正面
                            if (self.user.idfrontpictcontent != null) {
                                var picsStr = self.user.idfrontpictcontent;
                                var objPic = JSON.parse(picsStr);
                                for (var i = 0; i < objPic.length; i++) {
                                    var path = imgReg.test(objPic[i].thumbnail.path) ? objPic[i].thumbnail.path : objPic[i].thumbnail.path + objPic[i].thumbnail.name;
                                    var json = '{"path":"' + path + '"}';
                                    var obj = JSON.parse(json);
                                    obj.pic = picsStr;
                                    self.uploads0.push(obj);
                                }
                            } else {
                                self.uploads0 = [];
                            }
                            //身份证背面
                            if (self.user.idbackpictcontent != null) {
                                var picsStr = self.user.idbackpictcontent
                                var objPic = JSON.parse(picsStr);
                                for (var i = 0; i < objPic.length; i++) {
                                    var path = imgReg.test(objPic[i].thumbnail.path) ? objPic[i].thumbnail.path : objPic[i].thumbnail.path + objPic[i].thumbnail.name;
                                    var json = '{"path":"' + path + '"}';
                                    var obj = JSON.parse(json);
                                    obj.pic = picsStr;
                                    self.uploads1.push(obj);
                                }
                            } else {
                                self.uploads1 = [];
                            }
                            self.isNotZero = (self.$route.params.guid != '0');
                            self.isNotY = (self.user.bizstate != 'Y');
                            self.isNotS = (self.user.bizstate != 'S');
                            self.isNotE = (self.user.bizstate != 'E');
                        });
                } else {
                    this.user = {};
                    this.$set('user.isreceivesms', 'Y');// 默认接收短信通知
                    this.$set('user.isreceivewebchart', 'Y');// 默认接收微信通知
                    this.$set('user.isreceiveemail', 'Y');// 默认发送邮件
                    this.$set('user.roletype', '2');// 默认角色业务员
                    this.$set('user.sex', '1');// 默认为男
                    self.$set('avatar', null);
                    this.canDelete = false;
                    this.canE = false;
                    this.canS = false;
                    this.canY = false;
                    this.uploads0 = [];
                    this.uploads1 = [];
                }
            },
            validAccountExist: function () {
                var self = this;
                Ajax.get('/user/validAccountExist/' + self.user.logonuser)
                    .then(function (response) {
                        if (response.data.data > 0) {
                            layer.msg('登录账号已存在！');
                            self.isExistAccount = true;
                        }
                    });
            },
            getUserRelation: function () {
                var self = this;
                if (self.$route.params.guid != '0') {
                    self.search.staffguid = self.$route.params.guid;
                    Ajax.get('/user/listSupplierRelationForUser', self.search)
                        .then(function (response) {
                            var data = response.data.data;
                            for (var i = 0; i < data.length; i++) {
                                data[i].searchGoods = {}
                            }
                            self.$set('userRelation', data);
                        });
                }
            },
            listGoods: function (firstIndex, index, guid) {
                var self = this;
                self.searchGoods.param.productguid = guid;
                Ajax.post('/supplierGood/listGoods', self.searchGoods)
                    .then(function (response) {
                        var data = response.data.data;
                        self.$set('userRelation[' + firstIndex + '].listproducts[' + index + '].lg', data.list);
                        self.searchGoods.pageNo = data.pageNo;
                        self.searchGoods.totalPages = data.totalPages;
                        self.searchGoods.total = data.total;
                        self.$set('userRelation[' + index + '].listproducts[' + index + '].searchGoods', self.searchGoods);
                    });
            },
            addUser: function () {
                this.$route.router.go('/employeeEdit/0');
                this.user = {};
                this.$set('user.isreceivesms', 'Y');// 默认接收短信通知
                this.$set('user.isreceivewebchart', 'Y');// 默认接收微信通知
                this.$set('user.isreceiveemail', 'Y');// 默认发送邮件
                this.$set('user.roletype', '2');// 默认角色业务员
                this.$set('user.sex', '1');// 默认为男
                this.canDelete = false;
                this.canE = false;
                this.canS = false;
                this.canY = false;
                this.isNotZero = false;
                this.uploads0 = [];
                this.uploads1 = [];
                this.$set('avatar', null);
                this.setIsUse('yes');
            },
            //获取当前登录用户信息
            getOnlineUser: function () {
                var self = this;
                Ajax.get('/updateOnline/' + self.user.realname).then(function (resp) {
                    self.$store.dispatch(MT.SET_ONLINE_USER, resp.data);
                });
            },
            saveUser: function () {
                var self = this;
                //身份证
                var regid = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;
                var regid2 = /^\d{15}$/;
                //身份证号前2位数字验证
                var city = {
                    11: "北京",
                    12: "天津",
                    13: "河北",
                    14: "山西",
                    15: "内蒙古",
                    21: "辽宁",
                    22: "吉林",
                    23: "黑龙江 ",
                    31: "上海",
                    32: "江苏",
                    33: "浙江",
                    34: "安徽",
                    35: "福建",
                    36: "江西",
                    37: "山东",
                    41: "河南",
                    42: "湖北 ",
                    43: "湖南",
                    44: "广东",
                    45: "广西",
                    46: "海南",
                    50: "重庆",
                    51: "四川",
                    52: "贵州",
                    53: "云南",
                    54: "西藏 ",
                    61: "陕西",
                    62: "甘肃",
                    63: "青海",
                    64: "宁夏",
                    65: "新疆",
                    71: "台湾",
                    81: "香港",
                    82: "澳门",
                    91: "国外 "
                };
                //手机正则
                var phone = /^(((13[0-9]{1})|(14[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1})|(19[0-9]{1}))+\d{8})$/;
                //邮箱正则
                var email = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
                //身份证正面
                if (self.uploads0.length > 0) {
                    self.user.idfrontpictcontent = self.uploads0[0].pic;
                }
                //身份证背面
                if (self.uploads1.length > 0) {
                    self.user.idbackpictcontent = self.uploads1[0].pic;
                }
                //账号
                if (self.user.logonuser == null || self.user.logonuser == '') {
                    layer.msg('登录账号不能为空！');
                    return;
                }
                if (self.user.logonuser.length != 11) {
                    layer.msg('登录账号不是11位的手机号！');
                    return;
                }
                if (!self.user.logonuser.match(/^(((13[0-9]{1})|(14[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1})|(19[0-9]{1}))+\d{8})$/)) {
                    layer.msg('登录账号必须是您的手机号！');
                    return;
                }
                if (!self.user.mobiletel1 || self.user.mobiletel1.length != 11) {
                    layer.msg('手机号的长度不正确，请重新输入！');
                    return;
                }
                if (!phone.test(self.user.mobiletel1)) {
                    layer.msg('请输入正确的手机号！');
                    return;
                }
                if (self.user.eMail != null && self.user.eMail != '') {
                    if (!email.test(self.user.eMail)) {
                        layer.msg('请输入正确的邮箱！');
                        return;
                    }
                }
                if (self.user.idcode == null || self.user.idcode == '') {
                    layer.msg('身份证号不能为空重新输入！');
                    return;
                }
                if (self.user.idcode.toString().length != 15 &&
                    self.user.idcode.toString().length != 18) {
                    layer.msg('身份证号不正确请重新输入！');
                    return;
                }
                if (self.user.idcode.toString().length == 15 && !regid2.test(self.user.idcode)) {
                    layer.msg('15位的身份证必须为数字！');
                    return;
                }
                // 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X
                if (!regid.test(self.user.idcode)) {
                    layer.msg('请输入正确的身份证！');
                    return;
                }
                if (!city[self.user.idcode.substr(0, 2)]) {
                    layer.msg('请输入正确的身份证！');
                    return;
                }
                //判断15位或者18位身份证是否正确
                if (!self.idCodetrue(self.user.idcode)) {
                    layer.msg('请输入正确的身份证！');
                    return;
                }
 
                // if(!self.user.pwd || self.user.pwd.length < 8){
                //   layer.msg('请输入长度不小于8位数的密码！');
                //   self.$set('user.pwd', '');
                //   return;
                // }
                //  var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z]).{8,30}'); 
                //  if (!pwdRegex.test(self.user.pwd)) {
                //    layer.msg("您的密码复杂度太低（密码中必须包含字母、数字），请及时修改密码！");
                //    self.$set('user.pwd', '');
                //    return;
                // }
                if (self.isExistAccount) {
                    layer.msg('登录账号已存在！');
                    return;
                }
                if (self.user.roletype == null) {
                    layer.msg('请设置系统权限！');
                    return;
                }
                Ajax.post('/user/save', this.user)
                    .then(function (response) {
                        var data = response.data;
                        if (data.errorCode == 0) {
                            self.MessageBox({
                                title: '提示', message: '保存成功', type: 'alert'
                            }, function (action) {
                                if (self.$store.state.user.userId == self.user.guid) {
                                    //如果密码修改，则跳转到登录界面
                                    if (self.oldPwd != self.user.pwd) {
                                        self.MessageBox({
                                            title: '提示', message: '系统检测到您已经修改密码，请重新登录！', type: 'alert'
                                        }, function (action) {
                                            window.location.href = "/logout";
                                        })
                                    } else {
                                        self.getOnlineUser();
                                        self.$route.router.go('/employee');
                                    }
                                } else {
                                    self.$route.router.go('/employee');
                                }
                            });
                        } else {
                            layer.msg(data.message);
                        }
                    });
            },
            //验证身份证是否合法
            idCodetrue: function (idvalue) {
                var r = '';
                var arrSplit = '';
                var dtmBirth = '';
                var bGoodDay = '';
                var valnum = '';
                var nTemp = 0, i;
                //15位身份证验证是否正确
                if (idvalue.length == 15) {
                    r = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
                    arrSplit = idvalue.match(r);  //检查生日日期是否正确
                    dtmBirth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
                    bGoodDay = (dtmBirth.getYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
                    if (!bGoodDay) {
                        // self.MessageBox({title:'提示',message:'身份证的出生日期不对！',type:'alert'
                        // },function(action){
                        // });
                        return false;
                    }
                    return true;
                }
                //18位的身份证是否正确
                if (idvalue.length == 18) {
                    r = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
                    arrSplit = idvalue.match(r);  //检查生日日期是否正确
                    dtmBirth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
                    bGoodDay = (dtmBirth.getFullYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
                    if (!bGoodDay) {
                        // self.MessageBox({title:'提示',message:'身份证的出生日期不对！',type:'alert'
                        // },function(action){
                        // });
                        return false;
                    }
                    return true;
                } else {
                    var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
                    var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
                    for (i = 0; i < 17; i++) {
                        nTemp += idvalue.substr(i, 1) * arrInt[i];
                    }
                    valnum = arrCh[nTemp % 11];
                    if (valnum != idvalue.substr(17, 1)) {
                        // self.MessageBox({title:'提示',message:'18位身份证号的校验码不正确！',type:'alert'
                        // },function(action){
                        // });
                        return false;
                    }
                    return true;
                }
            },
            modifyBizState: function (bizsate, num) {
                var self = this;
                // updateUser的参数说明：guid=用户的GUID，bizstate=操作代码
                // bizstate代码说明：Y=有效，S=停用，E=作废
                var msg = "停用成功！";
                if (bizsate == 'Y') {
                    msg = "启用成功！";
                } else if (bizsate == 'E') {
                    msg = "作废成功！";
                }
                Ajax.post('/user/modifyBizState/' + this.user.guid + '/' + bizsate)
                    .then(function (response) {
                        console.log(msg);
                        layer.msg(msg);
                        self.$route.router.go('/employee');
                        // self.MessageBox({
                        //     title: '提示', message: msg, type: 'alert'
                        // }, function (action) {
                        //     s
                        // });
                    });
            },
            deleteUser: function () {
                var self = this;
                Ajax.get('/user/delete/' + self.user.guid)
                    .then(function(response) {
                        if(response.data.errorCode == 0) {
                            self.MessageBox({
                                title: '提示',
                                message: '删除成功',
                                type: 'alert'
                            }, function(action) {
                                self.$route.router.go('/employee');
                            });
                        }else{
                            self.MessageBox({
                                title: '提示',
                                message: response.data.message,
                                type: 'alert'
                            }, function(action) {});
                        }
                    });
            },
            check: function () {
                var self = this;
                Ajax.get('/user/check/' + self.user.guid)
                    .then(function (response) {
                        if (response.data.data == '0') {
                            layer.msg('供应商必须要有一个管理员！');
                            //   self.MessageBox({title:'提示',message:'供应商必须要有一个管理员！',type:'alert'
                            // },function(action){
                            //     // self.user.roletype=1; 本来就注释了
                            // });
                        }
                    });
            },
            // 身份证照片 - 正面
            fileChange0: function (data) {
                var backObj = JSON.parse(data), imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径
                data = backObj.data;
                for (var i = 0; i < data.length; i++) {
                    var path = imgReg.test(data[i].thumbnail.path) ? data[i].thumbnail.path : data[i].thumbnail.path + data[i].thumbnail.name;
                    var json = '{"path":"' + path + '"}';
                    var obj = JSON.parse(json);
                    obj.pic = JSON.stringify(data);
                    this.uploads0.push(obj);
                }
            },
            // 身份证照片 - 反面
            fileChange1: function (data) {
                var backObj = JSON.parse(data), imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径
                data = backObj.data;
                for (var i = 0; i < data.length; i++) {
                    var path = imgReg.test(data[i].thumbnail.path) ? data[i].thumbnail.path : data[i].thumbnail.path + data[i].thumbnail.name;
                    var json = '{"path":"' + path + '"}';
                    var obj = JSON.parse(json);
                    obj.pic = JSON.stringify(data);
                    this.uploads1.push(obj);
                }
            },
            modifyPic: function (type) {
                if (type == 1) {
                    this.uploads1 = [];
                } else {
                    this.uploads0 = [];
                }
            },
            showOrHide: function (sign) {
                if (sign == 'hide') {
                    $("#cc3").attr("type", "text");
                    $("#hide").css("display", "none");
                    $("#show").css("display", "block");
                } else if (sign == 'show') {
                    $("#cc3").attr("type", "password");
                    $("#show").css("display", "none");
                    $("#hide").css("display", "block");
                }
            },
            modifyInfo: function () {
                var self = this;
                this.setIsUse('yes');
            },
            setIsUse: function (type) {
                if (type == 'no') {
                    this.canDelete = false;
                    this.canSave = false;
                    this.canY = false;
                    this.canS = false;
                    this.canE = false;
                    this.sh = true;
                    this.hi = false;
                    $("input[type='text']").each(function (i) {
                        $(this).attr("readonly", "readonly");
                    });
                    $("input[type='radio']").each(function (i) {
                        $(this).attr("disabled", "disabled");
                    });
                    $("input[type='password']").each(function (i) {
                        $(this).attr("readonly", "readonly");
                    });
                } else if (type == 'yes') {
                    this.canDelete = true;
                    this.canSave = true;
                    this.canY = true;
                    this.canS = true;
                    this.canE = true;
                    this.sh = false;
                    this.hi = true
                    $("input[type='text']").each(function (i) {
                        $(this).removeAttr("readonly", "readonly");
                    });
                    $("input[type='radio']").each(function (i) {
                        $(this).removeAttr("disabled", "disabled");
                    });
                    $("input[type='password']").each(function (i) {
                        $(this).removeAttr("readonly", "readonly");
                    });
                }
            },
            showBigImgs: function (pic) {
                var jsonStr = '[', imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径;
                if (pic != null && pic.length > 0) {
                    pic = JSON.parse(pic);
                    for (var i = 0; i < pic.length; i++) {
                        var path = imgReg.test(pic[i].original.path_? pic[i].original.path : pic[i].original.path+pic[i].original.name;
                        jsonStr += '"' + path + '",';
                    }
                    jsonStr = jsonStr.substring(0, jsonStr.length - 1);
                }
                jsonStr += ']';
                this.$set('imgArry', JSON.parse(jsonStr));
                $("#bigImgs").click();
            },
            slideup: function (firstIndex, index, guid, num) {
                $("#row-l" + num + firstIndex + index).slideUp(400, function () {
                    $("#ct-r" + firstIndex + index).removeClass('active');
                    $("#isFocus" + num + firstIndex + index).removeClass("focus");
                    $(".ct-col:eq(" + index + ")").removeClass('activate');
                });
            },
            slidedown: function (firstIndex, index, guid, num, searchGoods) {
                var clss = $("#ct-r" + firstIndex + index).attr("class");
                if (clss.indexOf("active") != -1) {
                    this.slideup(firstIndex, index, guid, num);
                    return;
                }
                this.focus = num;
                this.listGoods(firstIndex, index, guid);
                $("#ct-r" + firstIndex + index).addClass("active");
                $("#isFocus" + num + firstIndex + index).addClass("focus");
                $("#row-l" + num + firstIndex + index).slideDown(400, function () {
                });
            },
        },
        route: {
            activate: function () {
                this.getUser();
                this.getUserRelation();
            }
        },
        attached: function () {
            if (this.$route.params.guid != '0') {
                this.setIsUse('no');
            } else {
                this.setIsUse('yes');
            }
        },
        watch: {
            'user.roletype': function (value) {
                if (value != 1) {
                    this.check();
                }
            },
                'checkArr':function(val){
                    var self = this;
                    self.prems = [];
                    self.prems = val;
                }
        },
    };
</script>