<template>
  <el-dialog
    :visible.sync="ifShow"
    :close-on-click-modal="false"
    width="516px"
  >
    <div class="rendercontent">
      <div ref="htmlContent">
        <div class="toprender">
          <div class="leftimg">
            <img
              class="img1"
              :src="'data:image/png;base64,' + treeData.avatarUrlBase64"
            >
            <img
              class="img2"
              :src="'data:image/png;base64,' + treeData.countryUrl2Base64"
            >
          </div>
          <div class="centerbox">
            <div class="lineboex">
              <div class="linetitle">会员编号</div>
              <div class="linecontent">{{ treeData.memberCode }}</div>
            </div>
            <div class="lineboex">
              <div class="linetitle">会员姓名</div>
              <div class="linecontent">{{ treeData.name }}</div>
            </div>
            <div class="lineboex">
              <div class="linetitle">安置部门</div>
              <div class="linecontent">{{ `第${treeData.placeDept}部门` }}</div>
            </div>

            <div class="lineboex">
              <div class="linetitle">{{ '支付日期' }}</div>
              <div class="linecontent">{{ treeData.payDate }}</div>
            </div>
          </div>
          <div class="rightimg">
            <img
              :src="
                'data:image/png;base64,' + treeData.settleCountryUrl2Base64
              "
            >
            <div>{{ '结算国家' }}</div>
          </div>
        </div>
        <div class="bottomrender">
          <div class="flexbox">
            <div class="thetitle">{{ '业绩' }}({{ isLocals() }})</div>
            <div class="linecontent">{{ '真实新增' }}</div>
            <div class="linecontent">首购新增</div>
            <div class="linecontent">复购新增</div>
            <div class="linecontent">真实累计</div>
            <div class="linecontent">首购累计</div>
            <div class="linecontent">复购累计</div>
            <div class="linecontent">首购结余</div>
            <div class="linecontent">复购结余</div>
            <!-- <div class="linecontent">新増套数</div>
              <div class="linecontent">累计套数</div> -->
          </div>
          <div class="flexbox">
            <div class="thetitle">左区</div>
            <div class="linecontent">{{ treeData.leftRealNewPv }}</div>
            <div class="linecontent">{{ treeData.leftFirstPurchaseAdd }}</div>
            <div class="linecontent">
              {{ treeData.leftRepeatPurchaseAdd }}
            </div>
            <div class="linecontent">{{ treeData.leftRealTotal || 0 }}</div>
            <div class="linecontent">{{ treeData.leftFirstTotal || 0 }}</div>
            <div class="linecontent">
              {{ treeData.leftRepeatPurchaseTotal || 0 }}
            </div>
            <div class="linecontent">{{ treeData.leftFirstSurplus || 0 }}</div>
            <div class="linecontent">
              {{ treeData.leftRepeatPurchaseSurplus || 0 }}
            </div>
            <!-- <div class="linecontent">{{ treeData.aNewBox || 0 }}</div>
              <div class="linecontent">{{ treeData.aSumBox || 0 }}</div> -->
          </div>
          <div class="flexbox">
            <div class="thetitle">右区</div>
            <div class="linecontent">{{ treeData.rightRealNewPv }}</div>
            <div class="linecontent">
              {{ treeData.rightFirstPurchaseAdd }}
            </div>
            <div class="linecontent">
              {{ treeData.rightRepeatPurchaseAdd }}
            </div>
            <div class="linecontent">{{ treeData.rightRealTotal }}</div>
            <div class="linecontent">{{ treeData.rightFirstTotal }}</div>
            <div class="linecontent">
              {{ treeData.rightRepeatPurchaseTotal }}
            </div>
            <div class="linecontent">{{ treeData.rightFirstSurplus }}</div>
            <div class="linecontent">
              {{ treeData.rightRepeatPurchaseSurplus }}
            </div>
            <!-- <div class="linecontent">{{ treeData.bNewBox || 0 }}</div>
              <div class="linecontent">{{ treeData.bSumBox || 0 }}</div> -->
          </div>
        </div>
      </div>
      <div class="footerbox">
        <div class="footerbtn btn1" @click="downloadImage">下载图片</div>
        <div class="footerbtn btn2" @click="copyText">复制文字</div>
        <!-- <div class="footerbtn btn3"  @click="goTop(treeData)">置顶</div> -->
      </div>
    </div>
  </el-dialog>
</template>

<script>
export default {

}
</script>

<style>

</style>
