移动端套打组件-已废弃

<template>
  <div class="learn-detail">
    <div class="learn-detail-inner dsf-content" :style="{ bottom: signBtn ? '45px' : 0 }">
      <div class="learn-cover">
        <van-image width="100%" height="100%" fit="fill" :src="setImg()">
          <template v-slot:loading>
            <van-loading type="spinner" size="20" />
          </template>
          <template v-slot:error>
            <img src="../../assets/images/404.png" />
          </template>
        </van-image>
        <!-- <dsf-icon name="zhuanfa" class="learn-relay" @click="repeatGo"></dsf-icon> -->
        <div class="learn-keyword-label">
          <div class="keyword-label-item" v-for="(item, index) in pageInfo.label" :key="index">
            {{ item }}
          </div>
        </div>
        <div class="learn-to" :class="signState == '3' ? 'out' : ''" v-if="signState == '1' || signState == '2' || signState == '3'" @click="continueGO()">
          <span v-text="
              signState == '1'
                ? $t('startLearning')
                : signState == '2'
                ? $t('continueLearning')
                : signState == '3'
                ? $t('hasEndStudy')
                : ''
            "></span>
        </div>
      </div>
      <van-tabs v-model="tabActive" @click="tabClick">
        <van-tab :title="$t('introduces')" :name="$t('introduces')">
          <div class="brief-wrap" :class="signBtn == true ? 'btn-blank' : ''">
            <div class="brief-inner">
              <div class="brief-content-item">
                <dsf-panel style="width: 100%;border-radius: 0" :panelData="{
                    name: $t('baseInfor'),
                    url: '',
                    showMore: false
                  }">
                  <div slot="panel" class="course-item">
                    <div class="brief-title">{{ pageInfo.title }}</div>
                    <div class="brief-date-wrap">
                      <div class="brief-date-item">
                        <span v-text="$t('applyDate')"></span>：
                        <span>{{  dsf.date.format(pageInfo.bmrq_sdate,'dd/mm/yyyy') }}</span> -
                        <span>{{  dsf.date.format(pageInfo.bmrq_edate,'dd/mm/yyyy') }}</span>
                      </div>
                      <div class="brief-date-item">
                        <span v-text="$t('trainDate')"></span>：
                        <span>{{  dsf.date.format(pageInfo.pxrq_sdate,'dd/mm/yyyy') }}</span> -
                        <span>{{  dsf.date.format(pageInfo.pxrq_edate,'dd/mm/yyyy') }}</span>
                      </div>
                    </div>
                    <!-- <div class="brief-course-select-wrap"> -->
                    <!-- <div class="brief-course-select-item orange">
                        <div class="course-select-icon-wrap">
                          <dsf-icon
                            name="bixiuke"
                            class="course-select-icon"
                          ></dsf-icon>
                          <div class="course-select-name" v-text="$t('required')"></div>
                        </div>
                        <div class="num-hour-class-wrap">
                          <div class="num">{{ pageInfo.bxcount }}</div>
                          <div class="unit" v-text="$t('totlaCourse')"></div>
                        </div>
                        <div class="sprit-wrap">
                          <div class="sprit"></div>
                        </div>
                        <div class="num-hour-class-wrap">
                          <div class="num">{{ pageInfo.bxxs }}</div>
                          <div class="unit">(学时)</div>
                        </div>
                      </div> -->
                    <!-- <div class="brief-course-select-item blue">
                        <div class="course-select-icon-wrap">
                          <dsf-icon
                            name="xuanxiuke"
                            class="course-select-icon"
                          ></dsf-icon>
                          <div class="course-select-name">选修</div>
                        </div>
                        <div class="num-hour-class-wrap">
                          <div class="num">{{ pageInfo.xxcount }}</div>
                          <div class="unit">(门)</div>
                        </div>
                        <div class="sprit-wrap">
                          <div class="sprit"></div>
                        </div>
                        <div class="num-hour-class-wrap">
                          <div class="num">{{ pageInfo.xxxs }}</div>
                          <div class="unit">(学时)</div>
                        </div>
                      </div> -->
                    <!-- </div> -->
                    <div class="brief-info-wrap">
                      <div class="brief-info">
                        <span v-text="$t('studentsNumber')"></span>:
                        <span>{{ pageInfo.studentNum }}</span>人
                      </div>
                      <div class="brief-info">
                        <span v-text="$t('hostUnit')"></span>:
                        <span>{{ pageInfo.zbdw }}</span>
                      </div>
                      <div class="brief-info">
                        <span v-text="$t('undertakeUnit')"></span>:
                        <span>{{ pageInfo.cjdw }}</span>
                      </div>
                    </div>
                  </div>
                </dsf-panel>
              </div>
              <div class="brief-content-item">
                <dsf-panel style="width: 100%;border-radius: 0" :panelData="{ name: $t('teachAims'), url: '', showMore: false }">
                  <div slot="panel" class="course-item">
                    <div class="brief-describe" v-html="pageInfo.content"></div>
                  </div>
                </dsf-panel>
              </div>
            </div>
          </div>
        </van-tab>
        <van-tab :title="$t('course')" :name="$t('course')">
          <div class="course-wrap" :class="signBtn == true ? 'btn-blank' : ''">
            <div class="course-inner" v-if="Object.keys(pageCourse).length > 0">
              <div class="course-mask" v-if="courseMask"></div>
              <dsf-panel style="width: 100%;border-radius: 0" :panelData="{ name: item.dy_name, url: '', showMore: false }" v-for="(item, index) in pageCourse" :key="index">
                <div slot="panel" class="course-item">
                  <div class="course-notice" style="flex-direction: column;height:auto;display:none;">
                    <div class="item" style="display:flex;">
                      <div v-text="$t('required')"></div>
                      <div class="course-notice-margin">
                        <span>{{ item.bxcount }}</span><a v-text="$t('manyCourse')"></a>
                      </div>
                      <div class="course-notice-margin">
                        <span>{{ item.bxxs }}</span><a v-text="$t('classHours')"></a>
                      </div>
                    </div>
                    <div class="item" style="display:flex;">
                      <div v-text="$t('optional')"></div>
                      <div class="course-notice-margin">
                        <span>{{ item.xxcount }}</span><a v-text="$t('manyCourse')"></a>
                      </div>
                      <div class="course-notice-margin">
                        <span>{{ item.xxxs }}</span><a v-text="$t('classHours')"></a>
                      </div>
                    </div>
                  </div>
                  <div class="course-list-wrap" v-for="(items, indexs) in item.CHILDREN" :key="indexs" @click="items.study == '0' && pageGo(items, item.nc_zyb_id)">
                    <div class="course-list-inner">
                      <div class="course-list-inner-lt">
                        <div class="course-list-top">
                          <dsf-icon :name="
                              items.type_value == '02'
                                ? 'lianxi'
                                : items.type_value == '04'
                                ? 'wenjuan'
                                : items.type_value == '05'
                                ? 'word'
                                : ''
                            " class="course-icon" v-if="
                              items.type_value !== '05' &&
                                items.type_value !== '10'
                            "></dsf-icon>
                          <i :class="['icon', getIcon(items)]" v-else></i>
                          <div class="course-title" :class="{ ban: items.study == '1' }">
                            {{ items.name }}
                          </div>
                        </div>
                        <div class="course-list-bottom">
                          <div class="course-class-hour">
                            <span v-if="items.type_value == '05'">{{ items.xs }}<a v-text="$t('classHours')"></a></span>
                            <span v-else>{{ getTypetext(items.type_text) }}</span>
                            <div v-if="items.sfbx_value == '1'" class="bxIcon">
                              <span v-text="$t('required')"></span>
                            </div>
                          </div>
                          <div class="course-date" v-if="items.kcsc">
                            {{ items.kcsc }}
                          </div>
                        </div>
                      </div>
                      <div class="course-score" :style="{ visibility: items.score > 0 ? '' : 'hidden' }">
                        {{ items.score }} 分
                      </div>
                      <div class="course-list-inner-rt">
                        <van-circle :value="recharNum(items.wcjd)" :rate="100" :speed="50" size="35px" :stroke-width="80" :text="items.wcjd" layer-color="#ebedf0" />
                      </div>
                    </div>
                  </div>
                </div>
              </dsf-panel>
            </div>
          </div>
        </van-tab>
        <van-tab :title="$t('evaluation')" :name="$t('evaluation')" v-if="signState != '0' && signState != '4' && signState != '5'">
          <div class="examine-wrap" :class="signBtn == true ? 'btn-blank' : ''">
            <div class="examine-inner">
              <dsf-panel style="width: 100%;border-radius: 0" :panelData="{ name: $t('progress'), url: '', showMore: false }">
                <div slot="panel" class="examine-item">
                  <div class="examine-list" v-for="(item, index) in pageExamine" :key="index" v-if="pageExamine.length > 0">
                    <div class="examine-title">{{ item.name }}</div>
                    <div class="examine-progress-wrap">
                      <div class="examine-progress-item" v-show="item.totalBxxs && item.totalBxxs != '0'">
                        <div class="progress-item-lt">
                          <span class="progress-item-lt-key bx" v-text="$t('required')"></span>
                        </div>
                        <div class="progress-item-ct">
                          <van-progress :percentage="formatterNum(item.bxjd)" stroke-width="25" track-color="#cccccc" color="#FA5151" :pivot-text="(item.bxjd || 0) + '%'" />
                        </div>
                        <div class="progress-item-rt">
                          <span>{{ item.totalBxxsjl }}</span>
                          <span>/</span>
                          <span>{{ item.totalBxxs }}</span>
                        </div>
                      </div>
                      <div class="examine-progress-item" v-show="item.totalXxxs && item.totalXxxs != '0'">
                        <div class="progress-item-lt">
                          <span class="progress-item-lt-key xx" v-text="$t('optional')"></span>
                        </div>
                        <div class="progress-item-ct">
                          <van-progress :percentage="formatterNum(item.xxjd)" stroke-width="25" track-color="#cccccc" color="#2A93FD" :pivot-text="(item.xxjd || 0) + '%'" />
                        </div>
                        <div class="progress-item-rt">
                          <span>{{ item.totalXxxsjl }}</span>
                          <span>/</span>
                          <span>{{ item.totalXxxs }}</span>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </dsf-panel>
              <div class="exam-wrap" :class="signBtn == true ? 'btn-blank' : ''" v-if="pageExamine.length > 0">
                <button :class="[
                    'exam-item-btn',
                    asment.jdsfwc ? '' : 'btn-not-allow'
                  ]" @click="gotoSum(asment.jdsfwc)">
                  <i class="icon iconfont icon-icon_shiyongwendang"></i>
                  <span v-text="$t('summary')"></span>
                </button>
                <button :class="[
                    'exam-item-btn',
                    asment.jdsfwc ? '' : 'btn-not-allow'
                  ]" @click="gotoExam(asment)">
                  <i class="icon icon-wenjuan iconfont"></i>
                  <span v-text="$t('finaExam')"></span>
                </button>
              </div>
            </div>
            <div class="examine-inner">
              <div class="cardbox">
                <p><i></i><span>证书</span></p>
                <div class="econtent">

                  
                  <div id="html2canvas" ref="html2canvas">
                    <div class="imgbox">
                      <img :src="cardimg"/> 
                    </div>
                  </div>
                  <div class="shade" v-if="isshade">
                    <span>尚未结业</span>
                  </div>
                  <!-- <button  class="restore-btn"  @click="saveImage('html2canvas', '证书')">生成图片</button> -->


                </div>
              </div>     
            </div>
          </div>
        </van-tab>
      </van-tabs>
    </div>
    <div class="sign-up dsf-bottom" v-if="signBtn" :class="signState == '4' ? 'seal' : signState == '5' ? 'out' : ''" @click="signState == '0' && signOn(pageInfo.title)">
      <div class="sign-up-content">
        <span v-text="
            signState == '0'
              ? $t('applyNow')
              : signState == '4'
              ? '封闭式'
              : signState == '5'
              ? '未授权'
              : ''
          "></span>
        <!-- <span v-if="signState == '0' && pageInfo.bmxz_value == '1'">
          （剩余
          <span>{{ pageInfo.systudent }}</span
          >人）
        </span> -->
      </div>
    </div>
  </div>
</template>

<script>
import html2canvas from "html2canvas";
export default {
  name: "inlearningDetail",
  data() {
    return {
      progressList: {},
      nummm: 30,
      currentRate: 100,
      tabActive: this.$t("introduces"),
      pageInfo: {
        cover: null, //relativePath封面照
        label: [], //关键词
        title: "", //标题
        bmrq_sdate: "", //报名开始时间
        bmrq_edate: "", //报名结束事件
        pxrq_sdate: "", //培训开始时间
        pxrq_edate: "", //培训结束事件
        bxcount: "", //必修总门数
        bxxs: "", //必修学时
        xxcount: "", //选修总门数
        xxxs: "", //选修学时
        studentNum: "", //学员人数
        zbdw: "", //主办单位
        cjdw: "", //承建单位
        abstract: "", //教学目的
        bmxz_value: "", //报名是否限制人数， 1限制 0不限制
        systudent: null //剩余学员数
      },
      pageCourse: {},
      courseMask: true,
      signBtn: true,
      nc_zyb_id: "",
      signState: "",
      pageExamine: {},
      continueLearn: "",
      ztbId: this.$route.params.id,
      userId: this.dsf.$user.loginInfo.userId,
      asment: "",
      cardimg:'',
      isshade:false,  //是否显示   尚未结业
    };
  },
  created() {
    this.initInfo();
    this.initCoursePanel();
    this.imgcard();
  },
  mounted() { },
  methods: {
    getTypetext(t){
      var text = '';
      if(t == '直播') {
        text = 'live'
      } else {
        text = 'course'
      }
      return this.$t(text);
    },
    tabClick(name, title) {
      this.$store.commit("Special_tab_name", title);
    },
    formatterNum(img) {
      return parseInt(img) > 100 ? 100 : parseInt(img);
    },
    setImg(key) {
      let cover = this.pageInfo.cover;
      if (cover) {
        cover = dsf.url.getWebPath(JSON.parse(cover)[0][key || "relativePath"]);
      }
      return cover || "";
    },
    continueGO() {
      let _this = this;
      _this.$router.push({
        path: "/player/" + _this.continueLearn + "/2"
      });
    },
    repeatGo() {
      let _this = this;
      this.dsf.platform.share({
        url:
          window.location.href.split("#/")[0] +
          "#/shareSpecial/" +
          this.$route.params.id,
        title: "专题班分享",
        content: this.pageInfo.title,
        image: _this.setImg("absolutePath")
      });
    },
    recharNum(data) {
      let wcjd = data;
      wcjd = wcjd * 1;
      return wcjd;
    },
    pageGo(res, id) {
      // console.log(res);
      /**
       * 01 课件
       * 02 作业
       * 03 问卷
       * 04 试卷
       * 05 课程
       * 10 直播
       * **/
      let _this = this;
      if (res.type_value == "04") {
        let _params = {
          examId: res.relid,
          userId: _this.userId,
          deviceType: "mobile",
          businessId: res.bussinesid,
          entryType: "1"
        };
        let loader = _this.dsf.layer.loading();
        _this.dsf.http
          .get("nc/mobile/tyzj/exam/url", _params)
          .done(d => {
            _this.dsf.layer.closeLoading(loader);
            if (d.success) {
              _this.$router.push({
                name: "dsfIframe",
                params: { url: d.data.fullPath }
              });
            } else {
              _this.dsf.layer.toast(d.message || "获取列表数据异常", false);
            }
          })
          .error(response => {
            _this.dsf.layer.closeLoading(loader);
            _this.dsf.layer.toast("服务器异常", false);
          });
      } else if (res.type_value  == "03") {
        let loader = _this.dsf.layer.loading();
        let param = {
          wjid: res.relid,
          type: "mobile",
          ztbid: _this.ztbId
        };
        // &改成   %26
        var suburl = dsf.url.getWebPath('wj/tbWj') + '?wjid=' + res.relid + '%26type=mobile%26ztbId=' + _this.ztbId;
        // console.log(suburl);
        _this.$router.push({
          path:
            "/iframe?url=" +suburl
        });
        // _this.dsf.http
        //   // .get("nc/mobile/tyzj/wj/tbWj", param)  //需要和pc一直
        //  .get("wj/tbWj", param)
        //   .done(d => {
        //     _this.dsf.layer.closeLoading(loader);
        //     // console.log(11,d);
        //     if (d.success) {
        //       _this.$router.push({
        //         path:
        //           "/iframe?url=" +
        //           d.data.fullPath.replace("&isview", "&readonly")
        //       });
        //     } else {
        //       _this.dsf.layer.toast(d.message || "获取跳转链接异常", false);
        //     }
        //   })
        //   .error(response => {
        //     _this.dsf.layer.closeLoading(loader);
        //     _this.dsf.layer.toast("服务器异常", false);
        //   });
      } else if (res.type_value  == "05") {
        _this.$router.push({
          path: "/player/" + res.relid + "/2"
        });
      } else if (res.type_value  == "02") {
        _this.dsf.layer.toast("请在电脑端完成", false);
      } else if (res.type_value  == "10") {
        this.$router.push("/recommend/liveSign/" + res.relid);
      }
    },
    signOn(message) {
      let _this = this;
      if (
        (_this.pageInfo.bmxz_value == 1 && _this.pageInfo.systudent > 0) ||
        _this.pageInfo.bmxz_value == 0
      ) {
        //开始报名
        _this.$dialog
          .confirm({
            title: this.$t('sureSingup'),
            message: message,
            className: "signCustom"
            /*confirmButtonColor: '#FF6A00'*/
          })
          .then(() => {
            let loader = _this.dsf.layer.loading();
            _this.dsf.http
              .post("nc/mobile/tj/ztb/addXymdBm", {
                nc_zyb_id: _this.nc_zyb_id
              })
              .done(d => {
                _this.dsf.layer.closeLoading(loader);
                if (d.success) {
                  let timer = setTimeout(() => {
                    _this.initInfo();
                    _this.initCoursePanel();
                    clearTimeout(timer);
                  }, 1500);
                  _this.dsf.layer.toast(d.message, true);
                } else {
                  _this.dsf.layer.toast(d.message || "报名失败", false);
                }
              })
              .error(response => {
                _this.dsf.layer.closeLoading(loader);
                _this.dsf.layer.toast("服务器异常", false);
              });
          })
          .catch(() => {
            console.log("点击了取消");
          });
      } else {
        _this.dsf.layer.toast("报名人数已达上限", false);
      }
    },
    initInfo() {
      let _this = this;
      let loader = _this.dsf.layer.loading();
      _this.dsf.http
        .get("nc/mobile/tyzj/ztb/getZtbInfo", {
          id: _this.ztbId
          // userId: 'c51fa1e3426144eea34e0ffd1bcf61f0'//_this.userId
        })
        .done(d => {
          _this.dsf.layer.closeLoading(loader);
          if (d.success) {
            let _data = d.data;
            let _info = {
              cover: _data.cover, //?JSON.parse(_data.cover)[0].relativePath:null,//relativePath封面照
              label: _data.label_text ? _data.label_text.split("^") : [], //关键词
              title: _data.title, //标题
              bmrq_sdate: _data.bmrq_sdate, //报名开始时间
              bmrq_edate: _data.bmrq_edate, //报名结束事件
              pxrq_sdate: _data.pxrq_sdate, //培训开始时间
              pxrq_edate: _data.pxrq_edate, //培训结束事件
              bxcount: _data.bxcount, //必修总门数
              bxxs: _data.bxxs, //必修学时
              xxcount: _data.xxcount, //选修总门数
              xxxs: _data.xxxs, //选修学时
              studentNum: _data.studentNum, //学员人数
              zbdw: _data.zbdw, //主办单位
              cjdw: _data.cjdw, //承建单位
              content: _data.content, //教学目的
              bmxz_value: parseInt(_data.bmxz_value), //报名是否限制人数， 1限制 0不限制
              systudent: parseInt(_data.systudent) //剩余学员数
            };
            _this.nc_zyb_id = _data.nc_zyb_id; //专业版id
            _this.signState = _data.STATE; //按钮状态
            _this.signState == "0" ||
              _this.signState == "4" ||
              _this.signState == "5"
              ? (_this.signBtn = true)
              : (_this.signBtn = false);
            _this.signState == "1" ||
              _this.signState == "2" ||
              _this.signState == "3"
              ? (_this.courseMask = false)
              : (_this.courseMask = true);
            _this.pageInfo = _info;
            // console.log(_data);
            if (
              _this.signState != "0" &&
              _this.signState != "5" &&
              this.signState != ""
            ) {
              this.initExamine();
            }
            _this.continueLearn = _data.newKcId;
          } else {
            _this.dsf.layer.toast(d.message || "获取列表数据异常", false);
          }
        })
        .error(response => {
          _this.dsf.layer.closeLoading(loader);
          _this.dsf.layer.toast("服务器异常", false);
        });
    },
    initCoursePanel() {
      let _this = this;
      let loader = _this.dsf.layer.loading();
      this.dsf.http
        .get("nc/mobile/tyzj/ztb/getZtbKcList", {
          ztbid: _this.ztbId,
          userId: _this.userId
        })
        .done(d => {
          _this.dsf.layer.closeLoading(loader);
          if (d.success) {
            let _data = d.data.data;
            // console.log(_data);
            _this.pageCourse = _data;
          } else {
            _this.dsf.layer.toast(d.message || "获取列表数据异常", false);
          }
        })
        .error(response => {
          _this.dsf.layer.closeLoading(loader);
          _this.dsf.layer.toast("服务器异常", false);
        });
    },
    initExamine() {
      let _this = this;
      let loader = _this.dsf.layer.loading();
      this.dsf.http
        .get("nc/ztb/tea/getStudentZtbKh", {
          ztbid: _this.ztbId,
          userId: _this.userId
        })
        .done(d => {
          _this.dsf.layer.closeLoading(loader);
          if (d.success) {
            let _data = d.data.dyjdData;
            // console.log(d.data);
            _this.asment = d.data;
            _this.pageExamine = _data;
          } else {
            _this.dsf.layer.toast(d.message || "获取列表数据异常", false);
          }
        })
        .error(response => {
          _this.dsf.layer.closeLoading(loader);
          _this.dsf.layer.toast("服务器异常", false);
        });
    },
    //小结
    gotoSum(isSum) {
      if (isSum) {
        this.dsf.layer.toast("小结请去PC端操作", false);
      }
    },
    gotoExam(item) {
      if (!item.jdsfwc) return;
      let that = this;
      let _params = {
        examId: item.ksid,
        userId: that.userId,
        deviceType: "mobile",
        businessId: that.ztbId,
        entryType: "1"
      };
      let loader = that.dsf.layer.loading();
      that.dsf.http
        .get("nc/mobile/tyzj/exam/url", _params)
        .done(d => {
          that.dsf.layer.closeLoading(loader);
          if (d.success) {
            that.$router.push({
              name: "dsfIframe",
              params: { url: dsf.config.webRoot + d.data.relativePath }
            });
          } else {
            that.dsf.layer.toast(d.message || "获取列表数据异常", false);
          }
        })
        .error(response => {
          that.dsf.layer.closeLoading(loader);
          that.dsf.layer.toast("服务器异常", false);
        });
    },
    getIcon(item) {
      let text = item.type_value;
      let type = item.kcflryvalue || "1";
      let iconArr = [
        "icon-sp",
        "icon-yp",
        "icon-wg",
        "icon-fmt",
        "icon-qt",
        "icon-live"
      ];
      if (text == "05") {
        let t = this.removeEmpty(type.split(","));
        if (t && t.length == 1) {
          return iconArr[t[0] - 1];
        } else {
          return iconArr[0];
        }
      }
      if (text == "10") {
        return "icon-live";
      }
    },
    removeEmpty(arr) {
      for (var i = 0; i < arr.length; i++) {
        if (arr[i] == "" || typeof arr[i] == "undefined") {
          arr.splice(i, 1);
          i = i - 1;
        }
      }
      return arr;
    },
    imgcard(){
      // 获取学员信息
      //用学员信息调接口  显示证书图片

      var relid = this.$route.params.id;
      var type ='05';
      var userId = this.dsf.$user.loginInfo.userId;
      var mbid = '';
      var that=this;
      that.dsf.http
        .get("nc/zsgl/byzs", {
          relId: relid,
          type: type,
          userId: userId,
        })
        .done(res => {
          //state:40013 无毕业证书  不显示
              //state:40015尚未毕业   显示有遮罩层.无下载按钮     ok
              //state:20000 有下载按钮
          // console.log('结果1',res.data);
          if (res.status==200 && res.statusText == 'OK') {
            mbid = res.data.data.mbid
            var mbids = '{"_id":"'+mbid+'"}';
            var sparms={
              id: mbid,
              data: mbids,
              pageName: 'save',
              namespace: 'dsfa.printing.printdesign',
            }  
            that.showcard(sparms);
            console.log(res.data.state);
            if(res.data.state == '40015'){
              that.isshade  = true
            }
          } 
        })
        .error(response => {
          that.dsf.layer.toast("服务器异常", false);
        });
    },
    showcard(sparms){
        var that = this;
        that.dsf.http
          .get("meta/data", sparms)
          .done(res => {
            if(res.success &&  res.state==20000){
                var url = dsf.url.getWebPath(res.data['dsfa_rm.bgsrc']);
                that.cardimg=url
            }
          })
          .error(response => {
            that.dsf.layer.toast("服务器异常", false);
          });
    },
    //图片格式转换方法
    dataURLToBlob(dataurl) {
            let arr = dataurl.split(',');
            let mime = arr[0].match(/:(.*?);/)[1];
            let bstr = atob(arr[1]);
            let n = bstr.length;
            let u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], { type: mime });
      },
 //点击方法
      saveImage(divText, imgText) {
            let canvasID = this.$refs[divText];
            let that = this;
            let a = document.createElement('a');
            html2canvas(canvasID).then(canvas => {
                let dom = document.body.appendChild(canvas);
                dom.style.display = 'none';
                a.style.display = 'none';
                document.body.removeChild(dom);
                let blob = that.dataURLToBlob(dom.toDataURL('image/png'));
                a.setAttribute('href', URL.createObjectURL(blob));
                //这块是保存图片操作  可以设置保存的图片的信息
                a.setAttribute('download', imgText + '.png');
                document.body.appendChild(a);
                a.click();
                URL.revokeObjectURL(blob);
                document.body.removeChild(a);
            });
      },
  }
};
</script>

<style scoped>
.course-score {
  font-size: 14px;
  line-height: 1.5;
  width: 60px;
  height: 48px;
  /* margin-left: 10px; */
  display: flex;
  align-items: center;
}
</style>